:root{
  --bg:#f8f9fb;
  --card:#ffffff;
  --card-border:rgba(15,23,42,.07);
  --card-hover:#f4f5f8;
  --text:#1a2332;
  --muted:#5c6573;
  --subtle:#8b95a5;
  --accent:#4a5f7f;
  --accent-soft:#eef1f6;
  --hot:#c45c52;
  --cold:#4a7fb5;
  --chart-hot:#d4655a;
  --chart-hot-past:rgba(212,101,90,.42);
  --chart-cold:#5b8fc9;
  --chart-cold-past:rgba(91,143,201,.42);
  --chart-rain:#6b7fd7;
  --chart-rain-past:rgba(107,127,215,.55);
  --chart-rain-solid:rgba(107,127,215,.92);
  --chart-humid:#4aafa3;
  --chart-humid-past:rgba(74,175,163,.32);
  --chart-grid:#e8eaee;
  --chart-band:#eceef2;
  --shadow-sm:0 1px 2px rgba(15,23,42,.05),0 1px 4px rgba(15,23,42,.04);
  --shadow-md:0 4px 16px rgba(15,23,42,.07),0 1px 3px rgba(15,23,42,.04);
  --r:14px;--rs:10px;
}

:root[data-time="morning"]{--bg:#faf9f7}
:root[data-time="afternoon"]{--bg:#f8f9fb}
:root[data-time="evening"]{--bg:#faf8f6}
:root[data-time="night"]{--bg:#f5f6f9}

body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  background:var(--bg);
  min-height:100vh;
  color:var(--text);
  line-height:1.5;
  transition:background .4s ease;
}

#app{max-width:880px;margin:0 auto;padding:clamp(16px,4vw,24px) clamp(12px,3vw,16px) clamp(32px,8vw,48px)}

/* ─── Loading ─── */
.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:20px}
.spinner{width:36px;height:36px;border:2px solid var(--card-border);border-top-color:var(--accent);border-radius:50%;animation:spin .75s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.loading p{color:var(--muted);font-size:.9rem}

/* ─── Error ─── */
.error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:16px;text-align:center}
.error-icon{color:var(--hot);display:flex;align-items:center;justify-content:center}
.error h2{font-size:1.3rem;font-weight:700}
.error p{color:var(--muted);max-width:320px;font-size:.9rem}

.btn{
  background:var(--accent);border:none;border-radius:8px;color:#fff;cursor:pointer;
  font-size:.875rem;font-weight:600;padding:10px 22px;
  transition:opacity .15s,transform .15s;
  box-shadow:var(--shadow-sm);
}
.btn:hover{opacity:.88;transform:translateY(-1px)}

.hidden{display:none!important}

/* ─── Header wrapper ─── */
.hdr-wrap{position:relative;margin-bottom:28px;padding-bottom:20px;border-bottom:none;box-shadow:0 1px 0 var(--card-border)}

/* ─── Source toggle ─── */
.src-toggle{
  display:inline-flex;align-items:center;
  background:var(--accent-soft);border:none;
  border-radius:999px;padding:3px;margin-top:10px;gap:2px;
  box-shadow:var(--shadow-sm);
}
.src-btn{
  background:none;border:none;color:var(--muted);cursor:pointer;
  font-size:.72rem;font-weight:600;padding:5px 14px;border-radius:999px;
  display:flex;align-items:center;gap:5px;white-space:nowrap;
  transition:background .15s,color .15s;
}
.src-btn.active{background:var(--card);color:var(--accent);box-shadow:var(--shadow-sm)}
.src-btn:not(.active):hover{color:var(--text)}

/* ─── Default header ─── */
.hdr{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 2px}

.loc{
  display:flex;align-items:center;gap:10px;
  cursor:pointer;border-radius:8px;
  padding:6px 8px;margin:-6px -8px;
  transition:background .15s;min-width:0;
}
.loc:hover{background:var(--accent-soft)}
.loc-icon{color:var(--accent);display:flex;align-items:center;flex-shrink:0}
.loc-text{min-width:0}
.loc-name{font-size:clamp(1.05rem,4.5vw,1.25rem);font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.loc-date{font-size:.8rem;color:var(--muted);margin-top:2px}
.loc-search-hint{
  color:var(--subtle);flex-shrink:0;
  opacity:0;transition:opacity .2s;margin-left:2px;
}
.loc:hover .loc-search-hint{opacity:1}
@media(hover:none){.loc-search-hint{opacity:.45}}

.toggle{
  background:var(--card);border:none;
  border-radius:999px;color:var(--muted);cursor:pointer;
  font-size:.78rem;font-weight:600;padding:7px 14px;
  transition:background .15s,color .15s,box-shadow .15s;white-space:nowrap;flex-shrink:0;
  box-shadow:var(--shadow-sm);
}
.toggle:hover{background:var(--accent-soft);color:var(--accent)}

/* ─── Search mode header ─── */
.hdr.searching{gap:10px}
.search-bar{
  flex:1;display:flex;align-items:center;gap:10px;
  background:var(--card);border:none;
  border-radius:10px;padding:9px 16px;
  box-shadow:var(--shadow-sm),0 0 0 1.5px var(--accent);
}
.search-bar svg{color:var(--muted);flex-shrink:0}
.search-bar input{
  flex:1;background:none;border:none;outline:none;
  color:var(--text);font-size:.9rem;font-weight:500;
  min-width:0;font-family:inherit;
}
.search-bar input::placeholder{color:var(--subtle)}
.search-clear{
  background:none;border:none;color:var(--subtle);
  cursor:pointer;font-size:1rem;padding:0 2px;line-height:1;
  transition:color .15s;flex-shrink:0;
}
.search-clear:hover{color:var(--text)}
.cancel-btn{
  background:none;border:none;color:var(--text);
  cursor:pointer;font-size:.85rem;font-weight:600;
  padding:4px 0;white-space:nowrap;flex-shrink:0;
}
.cancel-btn:hover{opacity:.6}

/* ─── Search dropdown ─── */
.search-drop{
  position:absolute;top:calc(100% + 6px);
  left:0;right:0;z-index:200;
  background:var(--card);
  border:none;
  border-radius:var(--rs);overflow:hidden;
  box-shadow:var(--shadow-md);
  animation:dropIn .15s ease;
}
@keyframes dropIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}

.search-result{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 16px;cursor:pointer;gap:16px;
  transition:background .1s;
}
.search-result+.search-result{border-top:1px solid #f0f1f3}
.search-result:hover,.search-result.focused{background:var(--card-hover)}
.sr-left{display:flex;align-items:center;gap:10px;min-width:0}
.sr-pin{color:var(--accent);display:flex;align-items:center;flex-shrink:0}
.sr-name{font-size:.9rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.sr-detail{font-size:.76rem;color:var(--muted);white-space:nowrap;flex-shrink:0}
.search-msg{padding:16px;text-align:center;color:var(--muted);font-size:.85rem}

/* ─── Hero ─── */
.hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse 75% 55% at 88% 12%,var(--glow) 0%,transparent 68%),
    linear-gradient(155deg,var(--hero-tint,transparent) 0%,var(--card) 52%);
  border:none;border-radius:var(--r);
  padding:28px;margin-bottom:16px;
  box-shadow:var(--shadow-md);
}
.hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.hero-left{min-width:0}
.hero-temp{
  font-size:clamp(3rem,14vw,5rem);font-weight:800;line-height:1;letter-spacing:clamp(-2px,-0.5vw,-3px);
  display:flex;align-items:flex-start;gap:4px;color:var(--text);
}
.hero-temp sup{font-size:clamp(1.2rem,4vw,1.8rem);font-weight:500;color:var(--muted);letter-spacing:0;margin-top:clamp(6px,2vw,10px)}
.hero-cond{font-size:1.05rem;font-weight:600;margin:10px 0 4px;color:var(--text)}
.hero-range{font-size:.85rem;color:var(--muted)}
.hero-range .hi{color:var(--hot)}
.hero-range .lo{color:var(--cold)}
.hero-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.badge{
  display:inline-flex;align-items:center;
  font-size:.78rem;font-weight:600;
  padding:5px 11px;border-radius:999px;
  line-height:1.2;
}
.badge-warm{background:rgba(196,92,82,.12);color:var(--hot)}
.badge-cold{background:rgba(74,127,181,.12);color:var(--cold)}
.badge-wet{background:rgba(107,127,215,.14);color:#5568b8}
.badge-dry{background:rgba(139,149,165,.14);color:var(--muted)}
.badge-neutral{background:var(--accent-soft);color:var(--accent)}
.badge-muggy{background:rgba(74,175,163,.16);color:#3a8f85}
.badge-muggy-low{background:rgba(91,143,201,.12);color:var(--cold)}
.badge-jump{cursor:pointer;transition:opacity .15s,transform .15s}
.badge-jump:hover{opacity:.88;transform:translateY(-1px)}
.badge-jump:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hero-icon{color:var(--accent);line-height:1;flex-shrink:0;display:flex;align-items:flex-start;justify-content:flex-end;opacity:.92}
.w-icon{display:block}

.hero-stats{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:10px;margin-top:22px;padding-top:20px;
  border-top:1px solid var(--card-border);
}
.stat-tile{
  display:flex;flex-direction:column;gap:4px;
  background:var(--card);border-radius:var(--rs);
  padding:12px 14px;
  box-shadow:var(--shadow-sm);
}
.stat-ico{color:var(--accent);display:flex;align-items:center;line-height:1}
.stat-ico-rain{color:var(--chart-rain)}
.stat-ico-wind{color:var(--muted)}
.stat-ico-sun{color:#c9a227}
.stat-lbl{font-size:.75rem;font-weight:500;color:var(--muted)}
.stat-val{font-size:.95rem;font-weight:600;color:var(--text)}

/* ─── Section header ─── */
.sec-sub{font-size:.76rem;color:var(--subtle);margin-top:4px;line-height:1.45;word-break:break-word}

/* ─── Historical comparison ─── */
.hist{
  background:#f7f8f9;
  border:1px solid var(--card-border);border-radius:var(--r);
  padding:22px;margin-bottom:20px;
}
.legend{display:flex;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.leg{display:flex;align-items:center;gap:7px;font-size:.73rem;color:var(--muted)}
.leg-dot{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.leg-h{background:#d1d5db}
.leg-f{background:#15171a}

.cmp-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:480px){.cmp-grid{grid-template-columns:1fr}}

.cmp-item{display:flex;flex-direction:column;gap:9px}
.cmp-lbl{font-size:.7rem;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);display:flex;align-items:center;gap:6px}
.cmp-rows{display:flex;flex-direction:column;gap:7px}

.bar-row{display:flex;align-items:center;gap:9px}
.bar-tag{font-size:.68rem;color:var(--subtle);width:54px;flex-shrink:0;text-align:right}
.bar-track{flex:1;height:6px;background:#e6e8eb;border-radius:3px;overflow:hidden}
.bar-fill{height:100%;border-radius:3px;width:0;transition:width 1.1s cubic-bezier(.4,0,.2,1)}
.bar-h{background:#9ba3ae}
.bar-f{background:#15171a}
.bar-num{font-size:.78rem;font-weight:600;width:52px;flex-shrink:0;color:var(--text)}

.delta{font-size:.68rem;padding-left:63px;margin-top:-3px}
.delta-hi{color:var(--hot)}
.delta-lo{color:var(--cold)}
.delta-eq{color:var(--subtle)}

/* ─── Empty / search-first state ─── */
.empty-state{
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;padding:80px 20px 40px;gap:14px;text-align:center;
}
.empty-ico{color:var(--accent);opacity:.7;display:flex;align-items:center;justify-content:center}
.empty-title{font-size:1rem;font-weight:600;color:var(--text)}
.empty-sub{font-size:.83rem;color:var(--muted);max-width:260px}

/* ─── Footer ─── */
.footer{text-align:center;margin-top:40px;padding-top:20px;border-top:none;box-shadow:0 -1px 0 var(--card-border)}
.footer p{font-size:.74rem;color:var(--subtle)}
.footer a{color:var(--accent);text-decoration:none;font-weight:500}
.footer a:hover{text-decoration:underline;text-underline-offset:2px}

/* ─── Animations ─── */
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.fu{opacity:0;animation:fadeUp .35s ease forwards}
.fu:nth-child(1){animation-delay:.04s}
.fu:nth-child(2){animation-delay:.1s}
.fu:nth-child(3){animation-delay:.16s}
.fu:nth-child(4){animation-delay:.22s}
.fu:nth-child(5){animation-delay:.28s}

/* ─── Responsive ─── */
@media(max-width:640px){
  .hdr-wrap{margin-bottom:20px;padding-bottom:16px}
  .hdr{align-items:flex-start}
  .hdr-actions{flex-wrap:wrap;justify-content:flex-end;gap:6px}
  .toggle{font-size:.75rem;padding:6px 12px}
  .src-toggle{width:100%;justify-content:stretch;margin-top:8px}
  .src-btn{flex:1;justify-content:center}
  .hdr.searching{flex-wrap:wrap}
  .hdr.searching .search-bar{flex:1 1 100%;padding:8px 12px}
  .hdr.searching .cancel-btn{margin-left:auto;padding:6px 4px}
  .search-result{flex-direction:column;align-items:flex-start;gap:3px}
  .sr-detail{white-space:normal}
  .hero{padding:20px 16px}
  .hero-top{
    display:grid;
    grid-template-columns:1fr auto;
    column-gap:12px;row-gap:4px;
    align-items:start;
  }
  .hero-left{grid-column:1}
  .hero-icon{grid-column:2;grid-row:1/span 3;align-self:start}
  .hero-anomaly-col,.hero-badges{grid-column:1/-1}
  .hero-badges{margin-top:4px}
  .hero-cond{font-size:.95rem}
  .chart-card{padding:12px 12px 2px}
  .panel-chart{
    aspect-ratio:1;
    display:flex;
    flex-direction:column;
    padding:10px 10px 6px;
  }
  .panel-chart .sec-hdr{margin-bottom:4px!important;flex-shrink:0}
  .panel-chart .sec-ttl{font-size:.9rem}
  .panel-chart .sec-sub{font-size:.72rem;line-height:1.35;margin-top:2px}
  .panel-chart .search-msg{flex:1;display:flex;align-items:center;justify-content:center;padding:12px 0}
  .panel-chart .wc-svg{flex:1;width:100%;min-height:0;height:100%}
  .hist{padding:16px}
}

@media(max-width:480px){
  .hero{padding:18px 14px}
  .hero-stats{gap:8px;margin-top:16px;padding-top:14px}
  .stat-val{font-size:.88rem}
  .sec-hdr{margin-bottom:8px}
  .chart-card{padding:12px 10px 2px}
  .panel-chart{padding:10px 8px 4px}
  .chart-leg{gap:10px}
  .empty-state{padding:60px 16px 32px}
}

@media(max-width:380px){
  .hdr{flex-wrap:wrap;gap:8px}
  .hdr-actions{width:100%}
  .hdr-actions .toggle{flex:1;text-align:center}
  .hero-stats{grid-template-columns:1fr 1fr;gap:8px}
  .hero-stats .stat-tile:last-child{grid-column:1/-1}
}

/* ─── Charts ─── */
.wc-svg{width:100%;display:block;overflow:visible}
.cg{stroke:var(--chart-grid);stroke-width:1;fill:none}
.ca{font-size:10px;fill:var(--subtle);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.cv{font-size:9px;font-weight:700;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
@media(max-width:480px){
  .ca{font-size:11px}
  .cv{font-size:10px}
}
.cv-hot{fill:var(--chart-hot)}
.cv-cold{fill:var(--chart-cold)}
.cl{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cl-hot{stroke:var(--chart-hot)}
.cl-cold{stroke:var(--chart-cold)}
.ch-band{fill:var(--chart-band)}
.cb-bar{fill:var(--muted)}
.ch-avg-line{stroke:var(--subtle);stroke-width:1.5;stroke-dasharray:5,4}
.cl-ytd-cur{stroke:var(--chart-rain);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cl-ytd-hist{stroke:var(--subtle);stroke-width:1.5;stroke-dasharray:6,4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.chart-card{
  background:var(--card);
  border:none;border-radius:var(--r);
  padding:14px 14px 2px;margin-bottom:12px;
  overflow:visible;
  box-shadow:var(--shadow-sm);
}
/* ─── Grouped weather panels ─── */
.weather-panel{
  background:var(--card);
  border-radius:var(--r);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  margin-bottom:12px;
}
.panel-cap{
  display:flex;align-items:center;gap:8px;
  padding:10px 14px;
}
.panel-cap-icon{display:flex;align-items:center;flex-shrink:0}
.panel-cap-title{font-size:.85rem;font-weight:700;flex:1;line-height:1.2}
.panel-cap-hint{font-size:.7rem;opacity:.65;white-space:nowrap;flex-shrink:0}
.panel-chart{padding:14px 14px 2px}
.panel-chart+.panel-chart{border-top:1px solid var(--card-border)}
.lazy-sentinel{height:1px;margin:0;pointer-events:none;visibility:hidden}
.weather-panel{scroll-margin-top:12px}
.chart-card .wc-svg{width:100%;height:auto;display:block}
.panel-chart .wc-svg{width:100%;height:auto;display:block}
.chart-leg{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.cli{display:flex;align-items:center;gap:6px;font-size:.7rem;color:var(--muted)}

/* ─── Tooltip ─── */
.tt{
  position:fixed;z-index:900;
  background:var(--card);border:none;
  border-radius:10px;padding:10px 14px;pointer-events:none;
  font-size:.75rem;line-height:1.75;
  box-shadow:var(--shadow-md);
  min-width:150px;max-width:calc(100vw - 28px);opacity:1;transition:opacity .1s;
}
.tt.hidden{opacity:0}
.tt-title{font-weight:700;color:var(--text);margin-bottom:3px;font-size:.78rem}
.tt-row{display:flex;justify-content:space-between;gap:14px}
.tt-lbl{color:var(--muted)}
.tt-hot{color:var(--hot);font-weight:600}
.tt-cold{color:var(--cold);font-weight:600}
.tt-cur{color:var(--text);font-weight:600}
.tt-muted{color:var(--muted);font-weight:600}
.tt-pos{color:var(--hot);font-weight:600}
.tt-neg{color:var(--cold);font-weight:600}

/* ─── Header actions ─── */
.hdr-actions{display:flex;gap:8px;flex-shrink:0}

/* ─── Chart focus ─── */
.wc-svg:focus{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}

/* ─── Dark mode ─── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:#0f1114;
    --card:#181b20;
    --card-border:rgba(255,255,255,.06);
    --card-hover:#1f242c;
    --text:#eef0f3;
    --muted:#a3acb8;
    --subtle:#a3acb8;
    --accent:#8ba3c7;
    --accent-soft:#1f2838;
    --hot:#e57373;
    --cold:#64b5f6;
    --chart-hot:#eb877c;
    --chart-hot-past:rgba(235,135,124,.52);
    --chart-cold:#74adef;
    --chart-cold-past:rgba(116,173,239,.52);
    --chart-rain:#95a3eb;
    --chart-rain-past:rgba(149,163,235,.78);
    --chart-rain-solid:#a8b4f5;
    --chart-humid:#62c9bd;
    --chart-humid-past:rgba(98,201,189,.4);
    --chart-grid:#3a4352;
    --chart-band:#28303c;
    --shadow-sm:0 1px 3px rgba(0,0,0,.25);
    --shadow-md:0 4px 20px rgba(0,0,0,.35);
  }
  :root:not([data-theme="light"])[data-time="morning"]{--bg:#101218}
  :root:not([data-theme="light"])[data-time="afternoon"]{--bg:#0f1114}
  :root:not([data-theme="light"])[data-time="evening"]{--bg:#100f12}
  :root:not([data-theme="light"])[data-time="night"]{--bg:#0d0e12}
}

:root[data-theme="dark"] {
  --bg:#0f1114;
  --card:#181b20;
  --card-border:rgba(255,255,255,.06);
  --card-hover:#1f242c;
  --text:#eef0f3;
  --muted:#a3acb8;
  --subtle:#a3acb8;
  --accent:#8ba3c7;
  --accent-soft:#1f2838;
  --hot:#e57373;
  --cold:#64b5f6;
  --chart-hot:#eb877c;
  --chart-hot-past:rgba(235,135,124,.52);
  --chart-cold:#74adef;
  --chart-cold-past:rgba(116,173,239,.52);
  --chart-rain:#95a3eb;
  --chart-rain-past:rgba(149,163,235,.78);
  --chart-rain-solid:#a8b4f5;
  --chart-humid:#62c9bd;
  --chart-humid-past:rgba(98,201,189,.4);
  --chart-grid:#3a4352;
  --chart-band:#28303c;
  --shadow-sm:0 1px 3px rgba(0,0,0,.25);
  --shadow-md:0 4px 20px rgba(0,0,0,.35);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .spinner{border-color:#2a2f38;border-top-color:#eef0f3}
  :root:not([data-theme="light"]) .src-toggle{background:#1f242c}
  :root:not([data-theme="light"]) .src-btn.active{background:#181b20}
  :root:not([data-theme="light"]) .loc:hover{background:#1f242c}
  :root:not([data-theme="light"]) .toggle{background:#181b20}
  :root:not([data-theme="light"]) .toggle:hover{background:#1f242c}
  :root:not([data-theme="light"]) .search-bar{background:#181b20;border-color:#eef0f3}
  :root:not([data-theme="light"]) .search-drop{background:#181b20;box-shadow:0 8px 24px rgba(0,0,0,.45)}
  :root:not([data-theme="light"]) .search-result+.search-result{border-top-color:#2a2f38}
  :root:not([data-theme="light"]) .search-result:hover,
  :root:not([data-theme="light"]) .search-result.focused{background:#1f242c}
  :root:not([data-theme="light"]) .hero{background:var(--card)}
  :root:not([data-theme="light"]) .hist,
  :root:not([data-theme="light"]) .chart-card{background:var(--card)}
  :root:not([data-theme="light"]) .weather-panel{background:var(--card)}
  :root:not([data-theme="light"]) .stat-tile{background:var(--card-hover)}
  :root:not([data-theme="light"]) .tt{background:var(--card);box-shadow:var(--shadow-md)}
  :root:not([data-theme="light"]) .ch-band{fill:var(--chart-band)}
  :root:not([data-theme="light"]) .cg{stroke:var(--chart-grid)}
  :root:not([data-theme="light"]) .ca{font-size:10.5px;font-weight:500}
}

:root[data-theme="dark"] .spinner{border-color:var(--card-border);border-top-color:var(--accent)}
:root[data-theme="dark"] .src-toggle{background:var(--accent-soft)}
:root[data-theme="dark"] .src-btn.active{background:var(--card)}
:root[data-theme="dark"] .loc:hover{background:var(--accent-soft)}
:root[data-theme="dark"] .toggle{background:var(--card)}
:root[data-theme="dark"] .toggle:hover{background:var(--accent-soft)}
:root[data-theme="dark"] .search-bar{background:var(--card);box-shadow:var(--shadow-sm),0 0 0 1.5px var(--accent)}
:root[data-theme="dark"] .search-drop{background:var(--card);box-shadow:var(--shadow-md)}
:root[data-theme="dark"] .search-result+.search-result{border-top-color:var(--card-border)}
:root[data-theme="dark"] .search-result:hover,
:root[data-theme="dark"] .search-result.focused{background:var(--card-hover)}
:root[data-theme="dark"] .hero{background:var(--card)}
:root[data-theme="dark"] .hist,
:root[data-theme="dark"] .chart-card{background:var(--card)}
:root[data-theme="dark"] .weather-panel{background:var(--card)}
:root[data-theme="dark"] .stat-tile{background:var(--card-hover)}
:root[data-theme="dark"] .tt{background:var(--card);box-shadow:var(--shadow-md)}
:root[data-theme="dark"] .ch-band{fill:var(--chart-band)}
:root[data-theme="dark"] .cg{stroke:var(--chart-grid)}
:root[data-theme="dark"] .ca{font-size:10.5px;font-weight:500}