/* ============================================================================
   FIRST LIGHT — DAY / NIGHT THEME LAYER            (full-site · preview branch)
   ----------------------------------------------------------------------------
   NIGHT (green-on-black) is the DEFAULT and is left untouched — everything here
   is gated behind html[data-theme="day"], so with no attribute this file is a
   no-op.

   PALETTE — "DAYBREAK"
   --------------------
   First Light's identity is a SUNRISE, so the day theme is dawn light on paper:
   a warm sunlit-linen background (never harsh white), CRISP white cards that
   lift with a soft warm shadow, JEWEL-EMERALD green data values and BURNT-HONEY
   amber accents that stay saturated and POP against the light — not muddy. Type,
   layout, IBM Plex Mono, the [ SECTION ] bars and the sunrise emblem are all
   unchanged; only the palette turns to daylight. Tuned for WCAG AA (≥4.5:1 body
   text; large display values clear AA-large ≥3:1 with extra punch).

   HOW IT WORKS
   ------------
   First Light is ~85% CSS-custom-property driven. The day theme is mostly a
   re-declaration of those tokens on the Daybreak palette; every var()-driven
   rule (including the PRO SVG charts, whose lines/bars/axes read var(--g2) /
   var(--a) / var(--mut)) re-tones automatically. The remaining ~15% are
   HARDCODED dark fills baked into rules (page backdrops, dark inputs, dark
   tooltips, dark chips, the terminal chrome); those are patched per-surface in
   the "hardcoded hotspots" sections.

   SCOPE MAP (which block skins which pages)
   -----------------------------------------
     :root                    → explorer (style.css), terminal (terminal.css),
                                 collector pages + otc (they declare tokens on
                                 :root). One superset covers them all.
     body.sd                  → supply-demand / sell-pressure / supply-walls /
                                 conviction (share supply-demand.css tokens)
     body.pro-premium         → pro.html + signals.html
     body.otc-page            → otc.html shell
     .flpn                    → the injected PRO-suite nav bar (all PRO pages)
   ========================================================================== */

/* ══════════════════════════════════════════════════════════════════════════
   1) DAYBREAK — token superset on :root
   Covers every page whose palette tokens live on :root (explorer, terminal,
   collectors, otc). body-scoped palettes (sd / pro-premium) refine below.
   ══════════════════════════════════════════════════════════════════════════ */
html[data-theme="day"]{
  color-scheme: light;

  /* — core identity — */
  --g:#067a34;        /* jewel-emerald — primary data values (AA on white)    */
  --a:#a85c00;        /* burnt-honey amber — headers/links/accents (AA)       */
  --d:#f1ece0;        /* sunlit-linen paper base                              */
  --dim:#e4dac6;      /* faint hairline                                        */
  --mut:#4a6553;      /* muted green label (AA small)                         */
  --code:#0a6b45;     /* code / hashes — deep teal-green                      */
  --warn:#97590a;  --bad:#bd3a2a;

  /* — surfaces — */
  --bg:#f1ece0; --bg2:#ece5d6;
  --panel:#fffdf7;    /* crisp warm-white card                                */
  --panel2:#f5efe1;   /* elevated fill / table header / hover                 */
  --panel3:#f9f4e8;
  --line:#e0d5bf; --line2:#ccbc98; --line-soft:#e6ddc9cc;
  --txt:#17241c;      /* near-black warm ink (headings)                       */
  --txt2:#384f41;     /* secondary text                                       */
  --mut2:#6a8375;

  /* — accents / chart tones (vivid, POP on light; used by SVG lines+bars) — */
  --g2:#0a8f42;       /* vivid emerald — chart lines, gauges, "up"            */
  --gsoft:#0a7a37;
  --a2:#8a5200;
  --blue:#276fb0;
  --sth:#c47400; --mid:#2f9d6b; --lth:#0a8f42;
  /* coin-age ramp: warm (young/liquid) → cool (old/absorbed), light-tuned */
  --b0:#d98a1e; --b1:#b56a08; --b2:#9a8412; --b3:#2f9d6b; --b4:#0a8f42; --b5:#0d7350; --b6:#0b5238;

  /* glows are a night signature; a blur halo muddies light, so DAY drops them.
     Crisp saturated ink keeps the values popping instead. */
  --glow-g:none;
  --glow-a:none;

  --r:12px;
  --card-bg:linear-gradient(180deg,#fffefb 0%,#fbf6ec 62%,#f9f3e6 100%);
  --card-shadow:0 8px 24px rgba(120,88,30,.10), inset 0 1px 0 #ffffff;
}

/* ── hardcoded hotspots · assets/style.css (explorer) ───────────────────── */

/* dawn-on-paper backdrop (was radial gl-amber over black) */
html[data-theme="day"] body{
  background:
    radial-gradient(1200px 560px at 50% -14%, rgba(255,150,70,.08), transparent 60%),
    radial-gradient(900px 480px at 90% 0%, rgba(10,140,66,.05), transparent 60%),
    linear-gradient(180deg,#f6f1e6 0%, #efe8da 60%), var(--d);
}
/* de-glowed wordmark is near-white mint → ink it for paper */
html[data-theme="day"] .flmark .fl{ color:var(--txt); }
html[data-theme="day"] .tagline .em{ color:var(--g); }

/* punch the big display values (large text → can run a more vivid emerald) */
html[data-theme="day"] .cell .v{ color:#0a9243; }
html[data-theme="day"] .cell .v.amber{ color:#c06a00; }

/* dark inputs / chips → warm light fields */
html[data-theme="day"] .search input,
html[data-theme="day"] .jump input,
html[data-theme="day"] button.copy,
html[data-theme="day"] .copybtn{ background:#fffdf7; }
html[data-theme="day"] .search input{ box-shadow:0 0 10px rgba(10,125,56,.04) inset; }

/* MatMul hero card — literal dark gradient → warm card */
html[data-theme="day"] .matmul{
  background:
    radial-gradient(130% 120% at 0% 0%, rgba(10,140,66,.09), transparent 55%),
    linear-gradient(180deg,#fffefb,#f9f3e6);
  box-shadow:var(--card-shadow);
}
/* crosshair tooltip bubble */
html[data-theme="day"] .fl-cx-tip{ background:#fffdf7; box-shadow:0 6px 18px rgba(90,66,20,.18); }

/* magnitude bars */
html[data-theme="day"] .mbar{ background:rgba(10,143,66,.08); }
html[data-theme="day"] .mbar > i{ background:linear-gradient(90deg,#2fb26e,var(--g2)); box-shadow:none; }
html[data-theme="day"] .mbar.amber > i{ background:linear-gradient(90deg,#d59a3e,#c06a00); box-shadow:none; }

/* footer tip-jar (CSS injected by app.js) + wallet-signals panels */
html[data-theme="day"] .tipjar{
  background:radial-gradient(ellipse at 50% 0%,rgba(10,143,66,.06),transparent 72%),#fffdf7 !important;
}
html[data-theme="day"] .tipjar .tj-addr code{ text-shadow:none !important; }
html[data-theme="day"] .sig,
html[data-theme="day"] .sig-compact,
html[data-theme="day"] .wl-note,
html[data-theme="day"] .wl-edit{ background:#fffdf7 !important; }
html[data-theme="day"] .wl-edit select,
html[data-theme="day"] .wl-edit textarea,
html[data-theme="day"] .wl-btn{ background:#fbf6ec !important; }

/* ══════════════════════════════════════════════════════════════════════════
   2) DAYBREAK — SUPPLY & DEMAND family (body.sd)
   supply-demand / sell-pressure / supply-walls / conviction all share these
   tokens, so one refinement re-skins all four (charts included, via var()).
   ══════════════════════════════════════════════════════════════════════════ */
html[data-theme="day"] body.sd{
  --bg:#f1ece0; --bg2:#ece5d6; --panel:#fffdf7; --panel2:#f5efe1; --panel3:#f9f4e8;
  --line:#e0d5bf; --line2:#ccbc98; --line-soft:#e6ddc9cc;
  --txt:#17241c; --txt2:#384f41; --mut:#4a6553; --mut2:#6a8375;
  --g:#067a34; --g2:#0a8f42; --gsoft:#0a7a37; --a:#a85c00; --a2:#8a5200;
  --warn:#97590a; --bad:#bd3a2a; --blue:#276fb0;
  --b0:#d98a1e; --b1:#b56a08; --b2:#9a8412; --b3:#2f9d6b; --b4:#0a8f42; --b5:#0d7350; --b6:#0b5238;
  --sth:#c47400; --mid:#2f9d6b; --lth:#0a8f42;
}
html[data-theme="day"] body.sd{
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(10,143,66,.07), transparent 55%),
    radial-gradient(900px 460px at 92% 0%, rgba(255,150,70,.06), transparent 60%),
    linear-gradient(180deg,#f6f1e6 0%,#efe8da 55%,#ece4d3 100%) fixed, var(--bg2);
}
/* big KPI / liquidity numbers pop */
html[data-theme="day"] body.sd .kpi .v,
html[data-theme="day"] body.sd .liqbox .lv,
html[data-theme="day"] body.sd .glass-sliver .big{ color:#0a9243; }

/* segmented control active pill: deep emerald bg, near-white label */
html[data-theme="day"] body.sd .seg button.on{ background:#0a7a37; color:#fffdf7; }

/* caveat / warn banners → warm parchment */
html[data-theme="day"] body.sd .warnbanner{ border-color:#e6cf8f; background:linear-gradient(180deg,#fdf4dc,#faf2df); }

/* tracks / hovers / zebra (dark fills → light) */
html[data-theme="day"] body.sd .ohtrack{ background:#ece5d6; }
html[data-theme="day"] body.sd .hbar.clickable:hover{ background:#f3ecda; }
html[data-theme="day"] body.sd .hbar.clickable.open{ background:#efe6d1; }
html[data-theme="day"] body.sd .feed .fr:nth-child(odd){ background:#f8f2e3; }
html[data-theme="day"] body.sd .drill-table tbody tr:hover,
html[data-theme="day"] body.sd .brow:hover,
html[data-theme="day"] body.sd table.sptab tr:hover td{ background:#f3ecda; }

/* liquidity map + demand panel */
html[data-theme="day"] body.sd .liqbox.liquid{ border-color:#e6cf8f; background:linear-gradient(180deg,#fdf4dc,#f9efdb); }
html[data-theme="day"] body.sd .liqbox.absorbed{ border-color:#bfe0cb; background:linear-gradient(180deg,#f0f8f2,#eef6ee); }
html[data-theme="day"] body.sd .panel.demand{ border-color:#e6cf8f; background:linear-gradient(180deg,#fdf6e4,var(--bg)); }

/* tooltips / glass-box / token bar / inputs (dark → light) */
html[data-theme="day"] body.sd .tooltip{ background:#fffdf7; color:var(--txt); box-shadow:0 6px 24px rgba(90,66,20,.18); }
html[data-theme="day"] body.sd .glass-box{ background:linear-gradient(180deg,#fffdf7,#f7f0e2); }
html[data-theme="day"] body.sd .glass-dot{ background:var(--panel); }
html[data-theme="day"] body.sd .glass-box .glass-formula{ background:#f5efe1; }
html[data-theme="day"] body.sd .tokbar input,
html[data-theme="day"] body.sd #clipwrap .cliprow input#clipSize{ background:#fffdf7; }
html[data-theme="day"] body.sd .tokbar button{ background:#0a7a37; color:#fffdf7; }

/* dark status/confidence chips → soft light tints (sell-pressure/supply-walls/conviction) */
html[data-theme="day"] body.sd .badge.high,
html[data-theme="day"] body.sd .badge.support,
html[data-theme="day"] body.sd .cbadge.long-hold{ color:#0a6b34; border-color:#7ec79b; background:#e7f5ec; }
html[data-theme="day"] body.sd .badge.moderate,
html[data-theme="day"] body.sd .badge.resistance,
html[data-theme="day"] body.sd .cbadge.short-hold{ color:#8a4c00; border-color:#e0b878; background:#fbf0d8; }
html[data-theme="day"] body.sd .badge.low,
html[data-theme="day"] body.sd .cbadge.fast-turnover{ color:#8a4c00; border-color:#e0b878; background:#fbeecf; }
html[data-theme="day"] body.sd .badge.modeled{ color:#1f5f95; border-color:#a9cbe6; background:#e6f0f8; }
html[data-theme="day"] body.sd .cbadge.medium-hold{ color:#0a7a44; border-color:#9ad3b4; background:#ecf6f0; }
html[data-theme="day"] body.sd .callout{ background:#fbf3df; }
html[data-theme="day"] body.sd .unpriced{ background:#eaf1f8; }

/* HODL-waves / URPD / trend SVGs: lines(var --g2), bars(var --a), axes(var --mut)
   all re-tone automatically. The few baked #04120a separator/point STROKES stay
   dark, which still reads as a hairline on light bands — intentional. */

/* ══════════════════════════════════════════════════════════════════════════
   3) DAYBREAK — PRO hub + signals (body.pro-premium)
   pro.html/signals.html declare their palette on body.pro-premium (inline), so
   the day palette is re-declared at the same scope (wins on specificity).
   ══════════════════════════════════════════════════════════════════════════ */
html[data-theme="day"] body.pro-premium{
  --bg:#f1ece0; --bg2:#ece5d6;
  --panel:#fffdf7; --panel2:#f5efe1; --panel3:#f9f4e8;
  --line:#e0d5bf; --line2:#ccbc98; --line-soft:#e6ddc9cc;
  --txt:#17241c; --txt2:#384f41; --mut:#4a6553;
  --g:#067a34; --g2:#0a8f42; --gsoft:#0a7a37;
  --a:#a85c00; --slate:#4f6b86; --code:#0a6b45;
  --warn:#97590a; --bad:#bd3a2a;
  background:
    radial-gradient(120% 90% at 50% -8%, rgba(10,143,66,.09), transparent 55%),
    radial-gradient(900px 480px at 90% 0%, rgba(255,150,70,.06), transparent 60%),
    linear-gradient(180deg,#f6f1e6 0%,#efe8da 60%,#ece4d3 100%) fixed, var(--bg2);
  color:var(--txt);
}
html[data-theme="day"] body.pro-premium a{ color:var(--gsoft); }
html[data-theme="day"] body.pro-premium a:hover{ color:var(--g); }

/* ══════════════════════════════════════════════════════════════════════════
   4) DAYBREAK — OTC standalone shell (body.otc-page)
   otc.css tokens live on :root (covered), the page shell just needs a backdrop.
   ══════════════════════════════════════════════════════════════════════════ */
html[data-theme="day"] body.otc-page{
  background:
    radial-gradient(1000px 480px at 50% -8%, rgba(255,150,70,.07), transparent 60%),
    linear-gradient(180deg,#f6f1e6 0%,#efe8da 60%), var(--bg2);
  color:var(--txt);
}

/* ══════════════════════════════════════════════════════════════════════════
   5) DAYBREAK — TERMINAL chrome (terminal.css; plain <body>)
   terminal.css uses --card-bg/--panel (re-toned via :root) for panels, but its
   top bar, status strip, inputs, palette, footer + toasts are baked dark. Patch
   the prominent surfaces so the Desk reads as a clean daylight terminal.
   ══════════════════════════════════════════════════════════════════════════ */
html[data-theme="day"] .topbar{ background:linear-gradient(180deg,#fbf6ea,#f4eddd); }
html[data-theme="day"] .wordmark .fl{ color:var(--txt); }
html[data-theme="day"] .cmd{ background:#fffdf7; }
html[data-theme="day"] .cmd::placeholder{ color:#8a9d8f; }
html[data-theme="day"] .statusstrip{ background:#f7f1e5; }
html[data-theme="day"] .kbstrip{ background:#f7f1e5; }
html[data-theme="day"] .kbstrip kbd{ background:#efe6d1; }
html[data-theme="day"] .gauge{ background:#fbf6ec; }
html[data-theme="day"] .bar .track{ background:#efe6d1; }
html[data-theme="day"] .fill.g{ background:linear-gradient(90deg,#2f9d55,#0a9243); }
html[data-theme="day"] .fill.a{ background:linear-gradient(90deg,#d59a3e,#c06a00); }
html[data-theme="day"] .fill.b{ background:linear-gradient(90deg,#d38a6a,#bd3a2a); }
html[data-theme="day"] table.mini th{ background:#f5efe1; }
html[data-theme="day"] .palette{ background:#fffdf7; }
html[data-theme="day"] .palette .ph{ background:#f5efe1; }
html[data-theme="day"] .toast{ background:linear-gradient(180deg,#fffefb,#faf4e8); color:var(--txt); }
html[data-theme="day"] .helpcard{ background:linear-gradient(180deg,#fffefb,#f7f0e2); }
html[data-theme="day"] .overlay{ background:rgba(40,30,10,.35); }
html[data-theme="day"] .ttip{ background:#fffdf7; color:var(--txt); }
html[data-theme="day"] .node.wallet{ background:#0a9243; }
html[data-theme="day"] .node.root{ background:#0a6b45; }
html[data-theme="day"] .pstate button{ background:#fbf6ec; }   /* Unlock / Retry pills */

/* ══════════════════════════════════════════════════════════════════════════
   6) DAYBREAK — PRO-suite nav bar (.flpn, injected by pro-nav.js)
   Self-contained scoped palette; override its own --flpn-* tokens + kill glows.
   ══════════════════════════════════════════════════════════════════════════ */
html[data-theme="day"] .flpn{
  --flpn-g:#067a34; --flpn-a:#a85c00; --flpn-mut:#4a6553; --flpn-txt:#17241c;
  --flpn-line:#e0d5bf; --flpn-line2:#ccbc98; --flpn-panel:#fffdf7;
  background:linear-gradient(180deg,#fbf6ea 0%,#f4eddd 100%);
  box-shadow:0 6px 22px rgba(120,88,30,.12);
}
html[data-theme="day"] .flpn-brand,
html[data-theme="day"] .flpn-brand b,
html[data-theme="day"] .flpn-brand .flpn-dot,
html[data-theme="day"] .flpn-links a.on,
html[data-theme="day"] .flpn-tok.set .ind,
html[data-theme="day"] .flpn-pop .h{ text-shadow:none; }
html[data-theme="day"] .flpn-tok,
html[data-theme="day"] .flpn-burger,
html[data-theme="day"] .flpn-pop input,
html[data-theme="day"] .flpn-pop button{ background:#fffdf7; }
html[data-theme="day"] .flpn-pop{ background:linear-gradient(180deg,#fffefb,#f7f0e2); }

/* ══════════════════════════════════════════════════════════════════════════
   6b) DAYBREAK — MINER MAP container (minermap.js injected CSS)
   The <canvas> tones are handled in minermap.js (theme-aware palette); these
   rules re-skin the surrounding panel, ASCII underlay, gradient title, tooltip
   and the narrow-screen list so the whole component reads as daylight.
   ══════════════════════════════════════════════════════════════════════════ */
html[data-theme="day"] .mm{
  border-color:#d8ccb2;
  background:
    radial-gradient(130% 120% at 50% -12%, rgba(10,143,66,.08), transparent 58%),
    linear-gradient(180deg,#fffefb 0%,#faf3e6 55%,#f6efdf 100%);
  box-shadow:0 12px 34px rgba(120,88,30,.12), inset 0 1px 0 #ffffff;
}
html[data-theme="day"] .mm::after{ box-shadow:inset 0 0 90px rgba(120,90,30,.10); }
html[data-theme="day"] .mm-base{ color:#2f9d6b; text-shadow:none; opacity:.20; }
html[data-theme="day"] .mm-hd .t{
  background:linear-gradient(90deg,#0a7a37,#0a9243);
  -webkit-background-clip:text; background-clip:text;
}
html[data-theme="day"] .mm-tip{ background:#fffdf7; border-color:#0a8f42; box-shadow:0 8px 24px rgba(90,66,20,.2); }
html[data-theme="day"] .mm-leg .k,
html[data-theme="day"] .mm-leg .bm{ color:#0a8f42; }
html[data-theme="day"] .mm-list li .bar{ background:rgba(10,143,66,.10); }
html[data-theme="day"] .mm-list li .bar i{ background:linear-gradient(90deg,#2f9d55,#0a9243); box-shadow:none; }
html[data-theme="day"] .mm-list li.home .bar i{ background:linear-gradient(90deg,#c88a2a,#c06a00); box-shadow:none; }

/* ══════════════════════════════════════════════════════════════════════════
   6c) DAYBREAK — pro.html residual inline fills (body.pro-premium)
   Most of pro.html is var-driven; these are the few baked-dark / neon spots.
   ══════════════════════════════════════════════════════════════════════════ */
html[data-theme="day"] body.pro-premium .gate .go,
html[data-theme="day"] body.pro-premium .pro-query .go,
html[data-theme="day"] body.pro-premium .qb-run,
html[data-theme="day"] body.pro-premium .xbtn.primary{
  background:linear-gradient(180deg,#0a9243,#0a7a37); color:#fffdf7;
}
html[data-theme="day"] body.pro-premium .lonenode{ background:#f4fbf6; box-shadow:0 0 18px rgba(200,120,20,.16); }
html[data-theme="day"] body.pro-premium .gtip{ background:#fffdf7; box-shadow:0 8px 24px rgba(90,66,20,.2); }

/* ══════════════════════════════════════════════════════════════════════════
   6d) DAYBREAK — explorer sub-page inline dark fills
   address / network / mining / trace / provenance / pro-api each bake a few
   dark inputs, cards, table-header bands, bar tracks and (for dark bg) over-
   light label colours into page-local <style>. These day-only overrides lift
   every one of them to the paper palette so no sub-page is a second-class
   citizen. (All gated on [data-theme="day"] → night is untouched.)
   ══════════════════════════════════════════════════════════════════════════ */
/* dark input / button fields → warm-white */
html[data-theme="day"] .ctrl button,
html[data-theme="day"] .ctrl input,
html[data-theme="day"] .winsel button,
html[data-theme="day"] .gtoolbar button,
html[data-theme="day"] .start input,
html[data-theme="day"] .start .go{ background:#fffdf7; }
/* dark cards / panels / endpoint blocks / signal panels → crisp white card */
html[data-theme="day"] .card,
html[data-theme="day"] .ep,
html[data-theme="day"] .pstat,
html[data-theme="day"] .twocol .col,
html[data-theme="day"] .wrap .sig{ background:#fffdf7; }
/* dark table-header band → warm light */
html[data-theme="day"] .tbl-card thead th{ background:#f5efe1; border-bottom-color:var(--line2); }
/* dark magnitude-bar tracks → light track */
html[data-theme="day"] .hbars .track,
html[data-theme="day"] .pbar{ background:#e4dac6; }
/* label colours picked bright for a dark panel → readable ink on paper */
html[data-theme="day"] .wrap .card .sum .bal .bal-lbl,
html[data-theme="day"] .wrap .card .sum-grid .st .k,
html[data-theme="day"] .wrap .sig .sig-hd .sub,
html[data-theme="day"] .wrap .sig .row .t,
html[data-theme="day"] .wrap .sig .row .meta .mut,
html[data-theme="day"] .wrap .sig .row .cav{ color:var(--mut); }
html[data-theme="day"] .banner-warn b{ color:var(--a); }
html[data-theme="day"] .chip.vf{ color:#bd3a2a; border-color:#e0a89e; }
/* graph empty-node + tooltips (trace) */
html[data-theme="day"] .lonenode{ background:#f4fbf6; }
html[data-theme="day"] .gtip{ background:#fffdf7; }

/* pro-api.html docs: dark banner + code blocks + endpoint cards → daylight */
html[data-theme="day"] .doc .caveat{ background:linear-gradient(180deg,#fdf4dc,#faf2df); }
html[data-theme="day"] .doc .caveat p{ color:var(--txt2); }
html[data-theme="day"] .doc .ep .body .cav{ color:var(--mut2); }
html[data-theme="day"] .doc pre.code{ background:#f3ede0; border-color:var(--line); }

/* ══════════════════════════════════════════════════════════════════════════
   7) THEME TOGGLE — floating night ☾ / day ☀ pill (injected by theme.js)
   Uses the same tokens so it reads correctly in BOTH themes.
   ══════════════════════════════════════════════════════════════════════════ */
#fl-theme-toggle{
  position:fixed; top:14px; right:14px; z-index:200;
  display:inline-flex; align-items:center; gap:7px;
  font-family:"IBM Plex Mono","SF Mono",Consolas,monospace;
  font-size:11px; letter-spacing:.10em; text-transform:uppercase;
  color:var(--a); background:var(--panel);
  border:1px solid var(--line2); border-radius:20px;
  padding:6px 12px; cursor:pointer; line-height:1;
  box-shadow:0 4px 14px rgba(0,0,0,.28);
  transition:border-color .14s, transform .14s, color .14s;
  -webkit-tap-highlight-color:transparent;
}
html[data-theme="day"] #fl-theme-toggle{ box-shadow:0 4px 14px rgba(120,88,30,.16); }
#fl-theme-toggle:hover{ border-color:var(--a); transform:translateY(-1px); }
#fl-theme-toggle:focus-visible{ outline:none; border-color:var(--g); box-shadow:0 0 0 3px rgba(51,255,102,.18); }
html[data-theme="day"] #fl-theme-toggle:focus-visible{ box-shadow:0 0 0 3px rgba(10,143,66,.22); }
#fl-theme-toggle .glyph{ font-size:13px; line-height:1; }
#fl-theme-toggle .lbl{ font-weight:600; }
@media (max-width:520px){
  #fl-theme-toggle{ top:10px; right:10px; padding:8px 12px; }
  #fl-theme-toggle .lbl{ display:none; }
}
@media (prefers-reduced-motion:reduce){ #fl-theme-toggle{ transition:none; } }