:root{--text:#374151;--text-h:#111827;--bg:#f9fafb;--surface:#fff;--border:#e5e7eb;--accent:#2563eb;--accent-hover:#1d4ed8;--accent-bg:#2563eb1a;--error:#dc2626;--shadow:0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;color:var(--text);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.5}*{box-sizing:border-box}body{min-height:100svh;margin:0}#app{flex-direction:column;max-width:1200px;min-height:100svh;margin:0 auto;padding:24px;display:flex}.app-header{text-align:center;margin-bottom:24px}.app-header h1{color:var(--text-h);margin:0;font-size:28px;font-weight:600}.controls{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;flex-wrap:wrap;align-items:flex-start;gap:16px;margin-bottom:24px;padding:20px;display:flex}.controls>*{flex:auto;min-width:200px}.city-search{position:relative}.city-input{border:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);border-radius:8px;padding:10px 14px;font-size:15px}.city-input:focus{outline:2px solid var(--accent);outline-offset:0}.city-dropdown{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);z-index:100;border-radius:8px;max-height:240px;display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto}.city-dropdown-item{cursor:pointer;padding:10px 14px;font-size:14px}.city-dropdown-item:hover{background:var(--accent-bg)}.date-range-picker{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.date-input{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:8px;flex:1;min-width:130px;padding:10px 14px;font-size:15px}.date-input:focus{outline:2px solid var(--accent)}.date-separator{color:var(--text);white-space:nowrap;font-size:14px}.date-error{color:var(--error);width:100%;font-size:13px}.date-error-info{color:var(--accent)}.message-banner{border-radius:8px;margin-bottom:24px;padding:12px 16px;font-size:14px;line-height:1.5}.message-error{color:#b91c1c;background:#fef2f2;border:1px solid #fecaca}.message-info{color:#1d4ed8;background:#eff6ff;border:1px solid #bfdbfe}.year-selector{width:100%}.year-selector-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.year-selector-title{color:var(--text-h);font-size:15px;font-weight:500}.year-buttons{gap:8px;display:flex}.year-btn{border:1px solid var(--border);background:var(--surface);cursor:pointer;color:var(--text);border-radius:6px;padding:4px 10px;font-size:13px}.year-btn:hover{background:var(--accent-bg);border-color:var(--accent)}.year-hint{color:var(--text);margin-bottom:8px;font-size:13px;display:block}.year-hint-error{color:var(--error)}.year-checkboxes{flex-wrap:wrap;gap:10px;display:flex}.year-checkbox-label{cursor:pointer;border:1px solid var(--border);background:var(--surface);border-radius:6px;align-items:center;gap:6px;padding:4px 8px;font-size:14px;display:flex}.year-checkbox-label:hover{border-color:var(--accent)}.year-checkbox-label input[type=checkbox]{accent-color:var(--accent);cursor:pointer}.query-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;padding:12px 20px;font-size:16px;font-weight:500;transition:background .2s}.query-btn:hover{background:var(--accent-hover)}.query-btn:active{transform:translateY(1px)}.loading{text-align:center;color:var(--text-h);padding:40px;font-size:16px}.chart-section{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;margin-bottom:24px;padding:20px;display:none}.tab-container{gap:8px;margin-bottom:16px;display:flex}.tab{border:1px solid var(--border);background:var(--surface);cursor:pointer;color:var(--text);border-radius:8px;padding:8px 16px;font-size:14px}.tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.tab:hover:not(.active){background:var(--accent-bg)}.chart-container{height:400px;position:relative}.chart-wrapper{flex-direction:column;height:100%;display:flex}.chart-wrapper canvas{flex:1;min-height:0}.table-section{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;margin-bottom:24px;padding:20px;display:none}.table-section h2{color:var(--text-h);margin:0 0 16px;font-size:18px;font-weight:600}.data-table-wrapper{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;min-width:400px;font-size:14px}.data-table th,.data-table td{text-align:center;border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 12px}.data-table th{background:var(--bg);color:var(--text-h);font-weight:600;position:sticky;top:0}.data-table tbody tr:hover{background:var(--accent-bg)}.data-table .year-divider td{color:var(--accent);text-align:center;letter-spacing:.02em;border-top:1px dashed var(--border);border-bottom:1px dashed var(--border);background:#eef2ff;padding:8px 12px;font-size:12px;font-weight:500}.app-footer{text-align:center;color:var(--text);border-top:1px solid var(--border);margin-top:auto;padding:20px;font-size:14px}.app-footer a{color:var(--accent);text-decoration:none}.app-footer a:hover{text-decoration:underline}@media (width<=768px){#app{padding:16px}.app-header h1{font-size:22px}.controls{flex-direction:column;gap:12px}.controls>*{min-width:100%}.chart-container{height:300px}.data-table th,.data-table td{padding:8px 10px;font-size:13px}}.stats-container{margin-bottom:24px}.stat-cards{flex-wrap:wrap;gap:12px;display:flex}.stat-card{background:var(--surface);border:1px solid var(--border);min-width:120px;box-shadow:var(--shadow);border-radius:10px;flex:auto;padding:12px 14px}.stat-label{color:var(--text);margin-bottom:4px;font-size:12px}.stat-value{color:var(--text-h);font-variant-numeric:tabular-nums;font-size:20px;font-weight:600}.stat-warm .stat-value{color:#ea580c}.stat-cold .stat-value{color:#2563eb}.year-avg-strip{color:var(--text);flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;font-size:13px;display:flex}.year-avg-title{color:var(--text-h);font-weight:500}.year-avg-chip{background:var(--bg);border:1px solid var(--border);font-variant-numeric:tabular-nums;border-radius:999px;padding:3px 12px}.year-avg-chip b{color:var(--text-h);margin-right:4px}.extreme-container{margin-top:8px}.extreme-group{margin-bottom:24px}.extreme-group-title{color:var(--text-h);margin:0 0 12px;font-size:17px;font-weight:600}.extreme-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;display:grid}.extreme-year-card{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;padding:14px}.extreme-year-card.warm{border-left:4px solid #f97316}.extreme-year-card.cold{border-left:4px solid #2563eb}.extreme-year-header{color:var(--text-h);align-items:center;gap:8px;margin-bottom:8px;font-size:15px;font-weight:600;display:flex}.extreme-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.extreme-list{gap:6px;margin:0;padding:0;list-style:none;display:grid}.extreme-list li{color:var(--text);font-size:13px;line-height:1.4}.extreme-kind{color:#ea580c;margin-right:2px;font-weight:600;display:inline-block}.extreme-kind.severe{color:#b91c1c}.extreme-year-card.cold .extreme-kind{color:#2563eb}.extreme-year-card.cold .extreme-kind.severe{color:#1d4ed8}.badge-forecast{color:#b45309;vertical-align:middle;background:#fef3c7;border-radius:4px;margin-left:6px;padding:1px 6px;font-size:11px;font-weight:600;display:inline-block}