html,body,#root{height:100%;margin:0}:root{--color-page:#e9eff4;--color-surface:#fff;--color-surface-muted:#f3f6f8;--color-surface-map:#f3f7f8;--color-border:#d5dfe5;--color-border-strong:#bac9d2;--color-text:#172633;--color-text-muted:#607585;--color-accent:#147f91;--color-accent-hover:#0f6878;--color-accent-soft:#e2f1f3;--color-selected:#e96f2d;--radius-control:10px;--radius-surface:14px;--shadow-float:0 10px 28px #1f324024;--shadow-surface:0 2px 8px #1f324012;--shadow-control:0 4px 14px #1f32401f;--focus-ring:0 0 0 3px #167d9a33}.app{height:100vh;color:var(--color-text);background:var(--color-page);flex-direction:column;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:flex}.app__toolbar{z-index:5;box-sizing:border-box;background:var(--color-surface);border-bottom:1px solid #bac9d2cc;flex:none;align-items:center;gap:.65rem;min-height:52px;padding:.45rem .75rem;display:flex;position:relative;box-shadow:0 1px 5px #1f32400d}.app__offline-status{box-sizing:border-box;color:#874407;text-align:center;background:#fff6e8;border-bottom:1px solid #efcf9f;flex:none;padding:.35rem .75rem;font-size:.8rem;font-weight:600;line-height:1.35}.app__search{flex:20rem;min-width:0;max-width:20rem}.city-search{z-index:10;width:100%;position:relative}.city-search__control{position:relative}.city-search__icon{width:1rem;height:1rem;color:var(--color-text-muted);fill:currentColor;pointer-events:none;position:absolute;top:50%;left:.7rem;transform:translateY(-50%)}.app__search .city-search input{box-sizing:border-box;width:100%;height:36px;color:var(--color-text);font:inherit;border:1px solid var(--color-border-strong);border-radius:var(--radius-control);background:#fbfdfe;outline:none;padding:.4rem .7rem .4rem 2.25rem;font-size:.9rem}.app__search .city-search input::placeholder{color:#8391a2}.app__search .city-search input:focus-visible,.app__horizon button:focus-visible,.app__map-toggle:focus-visible,.weather-widget__header button:focus-visible{border-color:var(--color-accent);box-shadow:var(--focus-ring);outline:none}.city-search__listbox{z-index:20;box-sizing:border-box;border:1px solid var(--color-border);border-radius:var(--radius-control);background:var(--color-surface);width:100%;max-height:19rem;box-shadow:var(--shadow-float);margin:0;padding:.3rem;list-style:none;position:absolute;top:calc(100% + .35rem);left:0;overflow-y:auto}.city-search__listbox li{min-width:0;color:var(--color-text);white-space:nowrap;cursor:pointer;border-radius:6px;align-items:center;gap:.35rem;padding:.52rem .65rem;font-size:.87rem;line-height:1.25;display:flex;overflow:hidden}.city-search__city-name,.city-search__province-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;display:block;overflow:hidden}.city-search__city-name{color:var(--color-text);flex:auto;font-weight:600}.city-search__option-separator{color:#a0acb9;flex:none}.city-search__province-name{color:var(--color-text-muted);flex:0 40%;font-size:.78rem}.city-search__kind{color:#526d79;background:#f3f7f8;border:1px solid #c9d9df;border-radius:999px;flex:none;padding:.12rem .35rem;font-size:.68rem;line-height:1.2}.city-search__kind--county{color:#286b78;background:#eaf5f6;border-color:#b9dce2}.city-search__status{cursor:default;color:var(--color-text-muted);font-size:.78rem}.city-search__status--error{color:#9b3a32;background:#fff7f5;justify-content:space-between}.city-search__status button{border:1px solid var(--color-border-strong);color:var(--color-accent-hover);background:var(--color-surface);font:inherit;cursor:pointer;border-radius:6px;flex:none;padding:.2rem .45rem}.city-search__status button:focus-visible{box-shadow:var(--focus-ring);outline:none}.city-search__listbox li:hover,.city-search__listbox li.city-search__option--active{color:#0d5368;background:var(--color-accent-soft)}.city-search__listbox li:hover .city-search__city-name,.city-search__listbox li.city-search__option--active .city-search__city-name{color:#0d5368}.city-search__listbox li:hover .city-search__province-name,.city-search__listbox li.city-search__option--active .city-search__province-name{color:#3d7180}.app__horizon-control{flex:none;align-items:center;gap:.45rem;display:inline-flex}.app__horizon-label{color:var(--color-text-muted);white-space:nowrap;font-size:.8rem}.app__horizon{border:1px solid var(--color-border-strong);border-radius:var(--radius-control);background:var(--color-surface);display:inline-flex;overflow:hidden}.app__horizon button{box-sizing:border-box;height:36px;font:inherit;cursor:pointer;min-width:3.1rem;color:var(--color-text-muted);background:0 0;border:none;padding:.35rem .7rem;font-size:.86rem}.app__horizon button+button{border-left:1px solid var(--color-border)}.app__horizon button:hover{color:var(--color-text);background:var(--color-surface-muted)}.app__horizon button[aria-pressed=true]{color:#fff;background:var(--color-accent)}.app__horizon button[aria-pressed=true]:hover{background:var(--color-accent-hover)}.app__main{box-sizing:border-box;flex:1;grid-template-columns:minmax(0,7fr) minmax(300px,3fr);gap:10px;min-height:0;padding:10px;display:grid}.app__map{background:var(--color-surface-map);border:1px solid var(--color-border);border-radius:var(--radius-surface);height:100%;min-height:0;box-shadow:var(--shadow-surface);position:relative;overflow:hidden}.app__map-toggle{display:none}.app__map-content{height:100%}.china-map{position:relative}.map-layer{transition:opacity .18s}.map-breadcrumbs{z-index:3;box-sizing:border-box;max-width:calc(100% - 24px);box-shadow:var(--shadow-control);color:#475569;white-space:nowrap;background:#fffffff0;border:1px solid #cbd5e1e6;border-radius:8px;align-items:center;gap:.25rem;padding:.3rem .5rem;font-size:12px;display:inline-flex;position:absolute;top:12px;left:12px;overflow:hidden}.map-breadcrumbs button{font:inherit;color:#0d5368;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:.1rem .2rem;font-size:12px}.map-breadcrumbs button:hover{background:var(--color-accent-soft)}.map-breadcrumbs button:focus-visible{box-shadow:var(--focus-ring);outline:none}.map-breadcrumbs__separator{color:#a0acb9}.map-breadcrumbs__current{color:#334155;font-weight:600}.map-controls{z-index:3;box-shadow:var(--shadow-control);background:#fffffff2;border:1px solid #bac9d2e6;border-radius:12px;align-items:stretch;gap:0;padding:4px;display:flex;position:absolute;bottom:12px;right:12px}.map-controls__level{border:0;border-right:1px solid var(--color-border);color:#475569;pointer-events:none;background:0 0;border-radius:7px 0 0 7px;align-items:center;padding:0 .55rem;font-size:12px;line-height:1.2;display:inline-flex}.map-controls__zoom{border-right:1px solid var(--color-border);align-items:stretch;display:inline-flex}.map-controls__zoom button{color:#365365;cursor:pointer;background:0 0;border:0;width:34px;min-height:34px;padding:0;font:600 1.15rem/1 system-ui,sans-serif}.map-controls__zoom button+button{border-left:1px solid var(--color-border)}.map-controls__zoom button:hover{color:var(--color-accent-hover);background:var(--color-accent-soft)}.map-controls__zoom button:focus-visible{z-index:1;box-shadow:inset var(--focus-ring);outline:none;position:relative}.map-controls__reset{font:inherit;color:#466074;cursor:pointer;white-space:nowrap;box-shadow:none;background:0 0;border:0;border-radius:0 7px 7px 0;padding:.4rem .7rem;font-size:.82rem}.map-controls__reset:hover{color:var(--color-accent-hover);background:var(--color-accent-soft)}.map-controls__reset:focus-visible{box-shadow:var(--focus-ring);outline:none}.county-layer-status{z-index:3;border:1px solid var(--color-border);box-shadow:var(--shadow-control);color:var(--color-text-muted);background:#fffffff5;border-radius:8px;align-items:center;gap:.5rem;padding:.45rem .65rem;font-size:12px;display:inline-flex;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.county-layer-status--error{color:#9a3412}.county-layer-status button{color:inherit;font:inherit;cursor:pointer;background:0 0;border:1px solid;border-radius:6px;padding:.2rem .45rem}.county-layer-status button:focus-visible{box-shadow:var(--focus-ring);outline:none}@media (prefers-reduced-motion:reduce){.map-layer{transition:none}}.app__map svg{touch-action:pan-y;cursor:grab;display:block}.app__map svg:active{cursor:grabbing}.app__rail{border:1px solid var(--color-border);border-radius:var(--radius-surface);min-width:0;min-height:0;box-shadow:var(--shadow-surface);background:var(--color-surface-muted);flex-direction:column;display:flex;overflow:hidden}.city-marker,.province-label-target{cursor:pointer}.province-label-target:focus{outline:none}.province-label-target:hover text,.province-label-target:focus-visible text{fill:#075985;paint-order:stroke;stroke:#fff;stroke-width:3px;font-weight:600}.province-label{fill:#314b5a;paint-order:stroke;stroke:#fffffff0;stroke-width:2.5px;font-weight:600}.province-shape{fill:#e5eff1;stroke:#8fa4af}[data-detail-level=province] [data-navigation=true]:hover .province-shape,[data-detail-level=province] [data-navigation=true]:focus-visible .province-shape{fill:#d4e9ec;stroke:#147f91}[data-detail-level=prefecture] .province-shape,[data-detail-level=county] .province-shape{fill:#edf3f4;stroke:#a8b7bf}.city-marker:focus{outline:none}.city-marker__focus-ring{opacity:0}.city-marker:focus-visible .city-marker__focus-ring{opacity:1}.city-marker:not(.city-marker--selected):hover .city-label,.city-marker:not(.city-marker--selected):focus-visible .city-label{fill:#075985;font-weight:600}.city-label{fill:#243b49;paint-order:stroke;stroke:#fffffff5}.city-marker:not(.city-marker--selected):hover [data-marker-core=true],.city-marker:not(.city-marker--selected):focus-visible [data-marker-core=true]{fill:#0284c7;stroke:#fff;stroke-width:1.5px}.app__attribution{color:var(--color-text-muted);background:var(--color-page);text-align:right;border-top:0;flex:none;padding:.4rem .75rem;font-size:.75rem}.app__attribution a{color:var(--color-accent);text-decoration:none}.comparison-rail{flex-direction:column;min-width:0;height:100%;min-height:0;display:flex}.comparison-rail__current{box-sizing:border-box;border-bottom:1px solid var(--color-border);border-left:3px solid var(--color-accent);background:#eef8f9;flex:none;width:100%;min-width:0;padding:.75rem}.comparison-rail__list{box-sizing:border-box;background:var(--color-surface-muted);flex-direction:column;flex:auto;gap:.6rem;width:100%;min-width:0;min-height:0;padding:.75rem;display:flex;overflow:hidden auto}.comparison-rail__section-heading{align-items:center;gap:.4rem;min-height:1.1rem;display:flex}.comparison-rail__heading{color:#4b6271;text-transform:none;margin:0;font-size:.78rem;font-weight:600}.comparison-rail__count{box-sizing:border-box;border:1px solid var(--color-border-strong);min-width:1.15rem;height:1.15rem;color:var(--color-text-muted);background:var(--color-surface);font-variant-numeric:tabular-nums;border-radius:999px;justify-content:center;align-items:center;padding:0 .25rem;font-size:.68rem;line-height:1;display:inline-flex}.comparison-rail__empty{border:1px dashed var(--color-border);color:#94a3b8;background:#ffffffb8;border-radius:8px;margin:.15rem 0 0;padding:.8rem .7rem;font-size:.85rem}.comparison-rail__empty--current{color:#5c7d87;background:#ffffff80;border-color:#c8e5ea}.comparison-rail__empty--comparison{font-size:.8rem}.weather-widget{box-shadow:var(--shadow-surface)}.weather-widget__header button{font:inherit;color:#466074;background:var(--color-surface)}.weather-widget__header button:hover:not(:disabled){border-color:var(--color-accent);color:#0d5368;background:var(--color-accent-soft)}.weather-widget__header button:disabled{color:var(--color-text-muted);background:var(--color-surface-muted)}.weather-widget__header button:focus-visible{outline:none}.app__horizon button{white-space:nowrap}.app__horizon button[aria-pressed=true]{border-color:#0000}.app__horizon{overflow:hidden}.weather-widget{box-sizing:border-box;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-surface);width:100%;min-width:0;padding:.6rem .65rem}.weather-widget--current{border-color:#b7dfe8;border-left:3px solid var(--color-accent);box-shadow:0 4px 12px #167d9a17}.weather-widget--comparison{border-color:var(--color-border);box-shadow:none}.weather-widget__header{justify-content:space-between;align-items:center;gap:.5rem;display:flex}.weather-widget__city{margin:0;font-size:.95rem;font-weight:650}.weather-widget__title{min-width:0}.weather-widget__context{color:var(--color-text-muted);text-overflow:ellipsis;white-space:nowrap;margin:.12rem 0 0;font-size:.72rem;line-height:1.2;overflow:hidden}.weather-widget__header button{border:1px solid var(--color-border-strong);border-radius:var(--radius-control);background:var(--color-surface);cursor:pointer;white-space:nowrap;padding:.25rem .5rem;font-size:.75rem}.weather-widget--current .weather-widget__header button:not(:disabled){border-color:var(--color-accent);color:#fff;background:var(--color-accent)}.weather-widget--current .weather-widget__header button:not(:disabled):hover{background:#126b83;border-color:#126b83}.weather-widget--current .weather-widget__header button:disabled:before{content:"✓";margin-right:.2rem;font-size:.75rem}.weather-widget--comparison .weather-widget__header button{color:var(--color-text-muted);background:0 0;border-color:#0000}.weather-widget--comparison .weather-widget__header button:hover{border-color:var(--color-border);color:#0d5368;background:var(--color-accent-soft)}.weather-widget__status{color:#64748b;margin:.65rem 0 .15rem;font-size:.85rem}.weather-widget__status p{margin:0 0 .45rem}.weather-widget__status button{border:1px solid var(--color-border-strong);border-radius:var(--radius-control);color:#466074;background:var(--color-surface);cursor:pointer;min-height:30px;padding:.25rem .6rem}.weather-widget__status button:hover{border-color:var(--color-accent);color:#0d5368;background:var(--color-accent-soft)}.weather-widget__status button:focus-visible{border-color:var(--color-accent);box-shadow:var(--focus-ring);outline:none}.weather-widget__days{background:#fafcfd;border-top:1px solid #dfe7eb;border-bottom:0;border-radius:0 0 8px 8px;flex-direction:row;gap:.25rem;min-width:0;margin:.55rem 0 0;padding:.25rem 0 .3rem;list-style:none;display:flex}.weather-widget__days[data-horizontal-scroll=true]{scrollbar-gutter:stable;scrollbar-color:var(--color-border-strong) transparent;scrollbar-width:thin;overflow-x:auto}.weather-widget__days[data-horizontal-scroll=true]::-webkit-scrollbar{height:6px}.weather-widget__days[data-horizontal-scroll=true]::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:999px}.weather-widget__days:not([data-horizontal-scroll=true]) .weather-widget__day{flex:1 1 0;min-width:0}.weather-widget__days:not([data-horizontal-scroll=true]){gap:0}.weather-widget__days[data-horizontal-scroll=true] .weather-widget__day{flex:none;min-width:3.4rem}.weather-widget__day{box-sizing:border-box;border:0;border-left:1px solid var(--color-border);text-align:center;border-radius:0;grid-template-rows:auto auto 1.1rem 1.1rem auto auto;align-items:center;gap:.18rem;min-height:5.8rem;padding:.3rem .25rem;font-size:.72rem;line-height:1.1;display:grid;overflow:hidden}.weather-widget__day:first-child{border-left:0}.weather-widget__weekday{color:#0f172a;font-weight:600}.weather-widget__date{color:#64748b;white-space:nowrap;font-variant-numeric:tabular-nums}.weather-widget__icon{font-size:1rem}.weather-widget__condition{color:#0f172a;text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.weather-widget__range{color:#0f172a;font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.68rem;font-weight:600}.weather-widget__precipitation{box-sizing:border-box;font-variant-numeric:tabular-nums;white-space:nowrap;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:.12rem;min-height:1.15rem;padding:0 .22rem;font-size:.69rem;display:inline-flex}.weather-widget__precipitation-marker{font-size:.62rem;line-height:1}.precipitation-low{color:#15803d;background:#eef8f0;border-color:#cde9d1}.precipitation-medium{color:#b45309;background:#fff6e8;border-color:#f1d8ad}.precipitation-high{color:#b91c1c;background:#ffeded;border-color:#f0c8c8;font-weight:700}@media (width<=720px){html,body,#root{height:100%;min-height:0;overflow:hidden}.app{height:100vh;min-height:0;overflow:hidden}@supports (height:100dvh){.app{height:100dvh}}.app__toolbar{min-height:0;padding:calc(.5rem + env(safe-area-inset-top)) max(.6rem, env(safe-area-inset-right)) .5rem max(.6rem, env(safe-area-inset-left));grid-template-columns:minmax(0,1fr) auto;gap:.45rem .6rem;display:grid}.app__search{grid-column:1/-1;width:100%;max-width:none}.app__search .city-search input{height:44px;font-size:1rem}.app__horizon-control{grid-area:2/2;justify-self:end;gap:.35rem}.app__horizon-label{font-size:.7rem}.app__horizon button{min-width:44px;height:44px;padding:.3rem .45rem}.city-search__listbox{max-width:calc(100vw - 1.2rem);max-height:min(18rem, calc(100vh - env(safe-area-inset-top) - 7rem))}@supports (height:100dvh){.city-search__listbox{max-height:min(18rem, calc(100dvh - env(safe-area-inset-top) - 7rem))}}.app__main{flex-direction:column;flex:auto;min-height:0;padding:10px 10px 0;display:flex;overflow:hidden}.app__map{box-sizing:border-box;flex:0 0 clamp(320px,47.25dvh,440px);height:clamp(320px,47.25dvh,440px);min-height:0}.app__map svg{touch-action:none}.map-controls__zoom button{width:44px;min-height:44px}.map-controls__reset{min-width:44px;min-height:44px}.app__map--collapsed{flex-basis:57px;height:57px}.app__map--collapsed .app__map-content{display:none}.app__map-toggle{z-index:8;box-sizing:border-box;border:1px solid var(--color-border-strong);border-radius:var(--radius-control);min-height:38px;color:var(--color-accent-hover);box-shadow:var(--shadow-control);font:inherit;cursor:pointer;background:#fffffff0;justify-content:center;align-items:center;padding:.45rem .75rem;font-size:.82rem;font-weight:600;display:inline-flex;position:absolute;bottom:10px;left:10px}.app__map--collapsed .app__map-toggle{top:9px;bottom:auto}.app__rail{overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;flex:auto;min-height:0;overflow:hidden auto}.comparison-rail{gap:10px;height:auto;min-height:min-content;padding-bottom:10px}.comparison-rail__current{background:0 0;border:0;width:100%;padding:0}.comparison-rail__list{background:0 0;flex:none;gap:10px;padding:0;position:relative;overflow-y:visible}.comparison-rail__section-heading{width:1px;height:1px;min-height:0;position:absolute;overflow:hidden}.comparison-rail__heading,.comparison-rail__count{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.weather-widget{flex-shrink:0;padding:.65rem}.weather-widget--current{border-color:var(--color-border);border-left:4px solid var(--color-selected);box-shadow:var(--shadow-surface)}.weather-widget__city{font-size:1rem}.weather-widget__header button,.weather-widget__status button{min-width:44px;min-height:44px}.weather-widget__status{margin-top:.45rem}.app__attribution{padding-right:max(.75rem, env(safe-area-inset-right));padding-bottom:calc(.4rem + env(safe-area-inset-bottom));padding-left:max(.75rem, env(safe-area-inset-left))}.weather-widget__days,.weather-widget__days:not([data-horizontal-scroll=true]){scrollbar-gutter:stable;scrollbar-color:var(--color-border-strong) transparent;scrollbar-width:thin;border-top-color:var(--color-border);background:0 0;gap:.4rem;margin-top:.5rem;padding:.45rem .05rem .35rem;overflow-x:auto}.weather-widget__days:not([data-horizontal-scroll=true]) .weather-widget__day,.weather-widget__days[data-horizontal-scroll=true] .weather-widget__day{flex:0 0 4.2rem;min-width:4.2rem}.weather-widget__day,.weather-widget__day:first-child{border:1px solid var(--color-border);background:var(--color-surface-muted);border-radius:8px;min-height:6.25rem;padding:.4rem .3rem}}@media (width>=721px) and (width<=1100px){.app__main{grid-template-columns:minmax(0,3fr) minmax(360px,2fr)}.weather-widget__days:not([data-horizontal-scroll=true]) .weather-widget__range{letter-spacing:-.02em;font-size:.64rem}}