/* tvlogo.monster shared base: Furball palette, self-hosted Nunito (SIL OFL 1.1, see /static/fonts/OFL.txt),
   components shared by both flavours ('app' and 'web'). Layout lives in app.css / web.css. */
@font-face{font-family:"Nunito";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/nunito-700-latin.woff2") format("woff2")}
@font-face{font-family:"Nunito";font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/nunito-800-latin.woff2") format("woff2")}
:root{--bg:#0d0b10;--surface:#18141c;--text:#f3eee9;--muted:#aaa1ab;--accent:#f67508;--accent-2:#67e8f9;--border:#2b2531;--ok:#6ee7b7;--warn:#fbbf24;--err:#f87171;--on-accent:#1a0d02;--code-bg:#08070a;--brand:#f67508;color-scheme:dark;
 --mono:"Ubuntu Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--brand-font:"Nunito","Varela Round",system-ui,sans-serif;--r:10px;--wordmark:#ffffff;--tile:#e2ddd7;--tile-border:#3a3340;--tile-none:#221d27}
[data-theme=light]{--bg:#fdf8f3;--surface:#ffffff;--text:#1f140d;--muted:#6b5a4e;--accent:#b8430f;--accent-2:#0e7490;--border:#eaddd2;--ok:#047857;--warn:#a16207;--err:#b91c1c;--on-accent:#ffffff;--code-bg:#f8efe7;--brand:#b5520a;color-scheme:light;--wordmark:#1f140d;--tile:#ffffff;--tile-border:#e3d5c9;--tile-none:#f4ece4}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--bg);color:var(--text);font:14px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent)}
img{max-width:100%}
code,.mono,kbd{font-family:var(--mono)}
h1,h2,h3{line-height:1.2}
.muted{color:var(--muted)}
.small{font-size:12px}
.skip{position:absolute;left:-999px;top:0;background:var(--accent);color:var(--on-accent);padding:6px 10px;z-index:99}
.skip:focus{left:8px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}
/* wordmark: HTML text, 'tvlogo' white (on dark) + '.monster' orange, Nunito 800 */
.brand{display:inline-flex;align-items:center;gap:8px;font:800 20px/1 var(--brand-font);letter-spacing:-.01em;color:var(--wordmark);text-decoration:none;white-space:nowrap}
.brand-pic{display:block;flex:none}.brand img{height:34px;width:auto;display:block}
/* header logo: dark and light pictures, the one matching the theme is shown (templates/_brand_img.html) */
.brand .brand-light{display:none}[data-theme=light] .brand .brand-light{display:block}[data-theme=light] .brand .brand-dark{display:none}
.brand b{color:var(--brand);font-weight:800}
.brand.lg{font-size:32px;gap:12px}.brand.lg img{height:60px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px}
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:var(--on-accent);border:1px solid var(--accent);border-radius:8px;padding:8px 14px;font:600 14px/1.1 inherit;font-family:inherit;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn.ghost{background:transparent;color:var(--accent)}
.btn.quiet{background:transparent;color:var(--text);border-color:var(--border)}
.btn.sm{padding:5px 9px;font-size:12px;border-radius:6px}
.btn.danger{background:transparent;color:var(--err);border-color:var(--err)}
.btn:focus-visible,.toggle-btn:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}
.toggle-btn{background:transparent;color:var(--text);border:1px solid var(--border);border-radius:8px;padding:7px 12px;font:600 13px/1.1 inherit;font-family:inherit;cursor:pointer;display:inline-flex;gap:6px;align-items:center;text-decoration:none}
.toggle-btn[aria-pressed=true],details[open]>summary.toggle-btn{background:var(--accent);color:var(--on-accent);border-color:var(--accent);box-shadow:inset 0 2px 4px rgba(0,0,0,.35)}
summary.toggle-btn{list-style:none}summary.toggle-btn::-webkit-details-marker{display:none}
.input{width:100%;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:10px 12px;font:15px/1.2 var(--mono);outline:none}
.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.searchbar{display:flex;gap:8px;align-items:center}.searchbar .input{flex:1}
/* segmented radio toggles (work without JS inside a GET form) */
.opt-row{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:flex-end}
fieldset.opt{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:5px;min-width:0}
fieldset.opt legend{font:600 11px/1 inherit;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:0;margin-bottom:5px}
.seg{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--bg)}
.seg label{position:relative;cursor:pointer;border-right:1px solid var(--border)}
.seg label:last-child{border-right:0}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg span{display:block;color:var(--muted);padding:6px 10px;font-weight:500;font-size:12.5px;line-height:1.1}
.seg input:checked+span{background:var(--surface);color:var(--text);box-shadow:inset 0 -2px 0 var(--accent)}
.seg label:hover span{color:var(--text)}
/* segmented toggles: no focus ring on mouse/touch (the old :focus-within outline was clipped by overflow:hidden and
   showed as a neon bar in the divider); keyboard focus gets a subtle accent ring drawn inside the segment */
.seg,.seg label,.seg span{-webkit-tap-highlight-color:transparent}
.seg label,.seg label:focus-within{outline:none}
.seg input:focus{outline:none}
.seg span{transition:color .12s ease,background-color .12s ease}
.seg input:focus-visible+span{outline:none;box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent) 70%,transparent)}
.seg input:checked:focus-visible+span{box-shadow:inset 0 -2px 0 var(--accent),inset 0 0 0 2px color-mix(in srgb,var(--accent) 70%,transparent)}
.pill{display:inline-block;font:600 11px/1 var(--mono);padding:3px 8px;border-radius:99px;border:1px solid currentColor;white-space:nowrap}
.pill.ok{color:var(--ok)}.pill.warn{color:var(--warn)}.pill.err{color:var(--err)}.pill.acc{color:var(--accent)}.pill.acc2{color:var(--accent-2)}.pill.mut{color:var(--muted)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:13px}
.kv dt{color:var(--muted)}.kv dd{margin:0;font-family:var(--mono);overflow-wrap:anywhere}
.urlbox{display:flex;align-items:center;gap:8px;background:var(--code-bg);border:1px solid var(--border);border-radius:8px;padding:6px 6px 6px 10px;font:13px var(--mono);min-width:0}
.urlbox a,.urlbox span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--accent)}
.code{background:var(--code-bg);border:1px solid var(--border);border-radius:var(--r);padding:12px 14px;margin:0;font:12.5px/1.55 var(--mono);color:var(--text);overflow:auto;white-space:pre}
.code .c{color:var(--muted)}.code .s{color:var(--accent-2)}.code .k{color:var(--accent)}
.codehead{display:flex;justify-content:space-between;align-items:center;margin:8px 0 6px;font-size:12px;color:var(--muted)}
/* logo frame: solid tile (never a checkerboard). Most upstream logos are drawn for light backgrounds, so the tile is
   off-white in dark mode and white in light mode; 'none' placeholders use a quiet solid panel colour. */
.logo{display:grid;place-items:center;background:var(--tile);border:1px solid var(--tile-border);border-radius:12px;overflow:hidden;padding:6%}
.logo.t-dark{background:#1b1720;border-color:#3a3340}.logo.t-light{background:#ffffff}
.logo img{display:block;width:100%;height:100%;object-fit:contain}
.logo.lg{width:min(512px,100%);height:auto;aspect-ratio:1;flex:none}.logo.md{width:192px;height:192px}.logo.sm{width:112px;height:112px;border-radius:10px}.logo.xs{width:80px;height:80px;border-radius:8px}
.logo.none{font:700 11px var(--mono);color:var(--muted);text-align:center;background:var(--tile-none);border-color:var(--border)}
table.t{width:100%;border-collapse:collapse;font-size:13px}
table.t th{text-align:left;color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:6px 8px;border-bottom:1px solid var(--border)}
table.t td{padding:7px 8px;border-bottom:1px solid var(--border);vertical-align:middle}
table.t td.mono,table.t td code{font-family:var(--mono);font-size:12px;overflow-wrap:anywhere}
table.t td.num,table.t th.num{text-align:right;font-family:var(--mono)}
.notice{border:1px solid var(--border);border-left:4px solid var(--warn);background:color-mix(in srgb,var(--warn) 8%,var(--surface));padding:10px 14px;border-radius:8px}
.notice.err{border-left-color:var(--err);background:color-mix(in srgb,var(--err) 8%,var(--surface))}
.notice.ok{border-left-color:var(--ok);background:color-mix(in srgb,var(--ok) 8%,var(--surface))}
.prose{max-width:820px}.prose h2{margin-top:1.8em}.prose h3{margin-top:1.4em}.prose li{margin:.3em 0}
.copied{color:var(--ok)!important}

/* homepage stats drop-down, anchored under the header wordmark (the wordmark is its toggle button) */
.brand-wrap{display:inline-flex}
.brand-btn{background:none;border:0;padding:4px 6px;margin:-4px -6px;border-radius:8px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.brand-btn:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}
.brand-btn .caret{font:700 12px/1 system-ui,sans-serif;color:var(--muted);margin-left:-2px;transition:transform .18s ease}
.brand-btn[aria-expanded=false] .caret{transform:rotate(-90deg)}
/* stats panels (home page only). Compact card in the left gutter: its width follows the gutter beside the 860 px search
   column (150-360 px, 8 px clear of the form); the "All stats" panel opens beside it. CA and US side by side, each with a
   flag patch and its own colour; orange (--accent) stays the main accent. Inline SVG bars/rings, no inline styles. */
:root{--sdw:clamp(150px,calc(50vw - 450px),360px)}
.stats-drop,.stats-full{--ca:#ff5d52;--us:#6f9bff}
[data-theme=light] .stats-drop,[data-theme=light] .stats-full{--ca:#c62828;--us:#2856c9}
.flag{display:inline-block;flex:none;width:20px;height:13px;border-radius:2px;vertical-align:-1px;box-shadow:0 0 0 1px color-mix(in srgb,var(--text) 22%,transparent)}
.flag-ca{background:radial-gradient(circle at 50% 54%,#d52b1e 0 2.4px,transparent 2.9px),linear-gradient(90deg,#d52b1e 0 26%,#fff 26% 74%,#d52b1e 74%)}
.flag-us{background:linear-gradient(#3c3b6e,#3c3b6e) 0 0/44% 54% no-repeat,repeating-linear-gradient(180deg,#b22234 0 1px,#fff 1px 2px)}
.hbar{display:block;width:100%;height:8px}
.hbar .bt{fill:color-mix(in srgb,var(--border) 80%,var(--bg))}.hbar .bv{fill:var(--accent);transition:width .7s ease}
.us .hbar .bv,.hbar.us .bv{fill:var(--us)}
.busy .hbar .bv{animation:sd-glow 1.6s ease-in-out infinite}
@keyframes sd-glow{50%{opacity:.5}}
@keyframes sd-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 60%,transparent)}70%{box-shadow:0 0 0 6px transparent}100%{box-shadow:0 0 0 0 transparent}}
.sd-live,.sf-live{display:inline-flex;align-items:center;gap:5px;color:var(--muted);font:600 10px/1 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.sd-live i,.sf-live i{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:sd-pulse 2.2s ease-out infinite}

.stats-drop{position:absolute;top:calc(100% + 6px);left:12px;width:var(--sdw);box-sizing:border-box;container-type:inline-size;
  max-height:calc(100vh - 74px - var(--foot-h,0px) - 10px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;
  background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 6%,var(--surface)),var(--surface) 140px);border:1px solid var(--border);border-radius:14px;
  box-shadow:0 14px 34px rgba(0,0,0,.38);font-size:11.5px;line-height:1.35;z-index:1200;padding:9px 10px 10px;
  transform-origin:top left;transition:opacity .16s ease,transform .16s ease,visibility 0s linear 0s}
.sd-top{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:0 0 8px}
.stats-drop .sd-h{margin:0;color:var(--accent);font:700 11px/1 system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.sd-duel{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.sd-ctry{position:relative;display:flex;flex-direction:column;gap:2px;min-width:0;padding:7px 7px 7px;border-radius:10px;border:1px solid var(--border);
  background:var(--bg);overflow:hidden}
.sd-ctry::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--c)}
.sd-ctry.ca{--c:var(--ca)}.sd-ctry.us{--c:var(--us)}
.sd-ctry .flag{width:clamp(16px,9cqi,26px);height:clamp(10px,5.8cqi,17px)}
.sd-ctry .v{font:800 clamp(17px,10.5cqi,34px)/1.05 var(--mono);color:var(--text);letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:clip;font-variant-numeric:tabular-nums}
.sd-ctry .lbl{font:700 clamp(9.5px,4.6cqi,13px)/1.15 system-ui,sans-serif;color:var(--c)}
.sd-ctry small{font-size:clamp(9px,3.9cqi,11.5px);color:var(--muted);line-height:1.2}
.sd-load{margin:8px 0 0;padding:6px 7px;border-radius:9px;border:1px dashed var(--border)}
.sd-load-h{display:flex;justify-content:space-between;align-items:baseline;gap:4px;margin:0 0 4px;font-size:clamp(9.5px,4cqi,12px);color:var(--muted)}
.sd-load-h b{color:var(--text);font-family:var(--mono);font-weight:700}
.sd-load .hbar .bv{fill:var(--us)}
.stats-drop .sd-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:8px 0 0}
.sd-c{display:flex;flex-direction:column;gap:1px;padding:5px 6px;border-radius:8px;background:color-mix(in srgb,var(--accent) 7%,var(--bg));border:1px solid var(--border);min-width:0}
.sd-c .v{font:700 clamp(11px,6cqi,18px)/1.1 var(--mono);color:var(--accent);overflow:hidden;text-overflow:clip;white-space:nowrap;font-variant-numeric:tabular-nums}
.sd-c span{font-size:clamp(8.5px,3.6cqi,11px);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ring{display:flex;align-items:center;gap:8px;margin:8px 0 0}
.ring svg{width:38px;height:38px;flex:none}
.ring circle{fill:none;stroke-width:3.6}
.ring .rt{stroke:var(--border)}
.ring .rv{stroke:var(--accent);stroke-linecap:round;transition:stroke-dasharray .6s ease}
.ring.us .rv{stroke:var(--us)}
.ring figcaption{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.ring figcaption b{font:700 14px/1.1 var(--mono);color:var(--text)}
.ring figcaption span,.ring figcaption small{font-size:10px;color:var(--muted)}
.sd-rings{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0 0}
.sd-rings .ring{margin:0;flex-direction:column;gap:3px;text-align:center;padding:6px 4px;border:1px solid var(--border);border-radius:9px}
.sd-rings .ring svg{width:clamp(34px,20cqi,64px);height:clamp(34px,20cqi,64px)}
.sd-rings .ring figcaption{align-items:center}
.sd-rings .ring figcaption b{font-size:clamp(12px,6cqi,18px)}
.sd-rings .ring figcaption span{font-size:clamp(9px,3.7cqi,11px)}
.spark polyline{stroke:var(--accent-2)}
.sd-spark{margin:8px 0 0}
.sd-spark .spark{display:block;width:100%;height:clamp(22px,11cqi,40px)}
.sd-spark span{font-size:9.5px;color:var(--muted)}
.sd-harv{margin:6px 0 0;font-size:10.5px;color:var(--muted)}
.sd-harv time{color:var(--text)}
.sd-more{display:block;width:100%;margin-top:8px;padding:6px 8px;font-size:12px}

/* "All stats": popover beside the compact card from 1200 px, full width 1024-1199 px, bottom sheet below */
.stats-full{position:fixed;left:12px;width:min(1080px,calc(100vw - 24px));box-sizing:border-box;max-height:calc(100vh - 64px - var(--foot-h,0px) - 18px);
  overflow:auto;overscroll-behavior:contain;z-index:1210;background:var(--surface);border:1px solid var(--border);border-radius:16px;
  box-shadow:0 20px 54px rgba(0,0,0,.45);padding:16px 18px 18px;font-size:13px;line-height:1.4;animation:sf-in .2s ease}
.stats-full[hidden]{display:none}
@media (min-width:1200px){.stats-full{left:calc(var(--sdw) + 24px);width:min(1080px,calc(100vw - var(--sdw) - 36px))}}
@keyframes sf-in{from{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}
.sf-head{display:flex;align-items:center;gap:12px;margin:0 0 12px}
.sf-head h2{margin:0;font-size:19px}
.sf-upd{color:var(--muted);font-size:11.5px;margin-right:auto}
.sf-x{background:none;border:1px solid var(--border);color:var(--text);border-radius:8px;width:32px;height:32px;font-size:18px;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent}
.sf-x:hover{border-color:var(--accent)}
.sf-x:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}
.stats-full h3{display:flex;align-items:center;gap:8px;margin:18px 0 8px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.stats-full h4{display:flex;align-items:center;gap:7px;margin:0 0 8px;font-size:13px}
.sf-duel{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sf-ctry{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"h h" "hero ring" "kv kv";gap:6px 12px;
  padding:14px 16px;border-radius:14px;border:1px solid var(--border);overflow:hidden;
  background:linear-gradient(150deg,color-mix(in srgb,var(--c) 13%,var(--bg)),var(--bg) 70%)}
.sf-ctry::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--c)}
.sf-ctry.ca{--c:var(--ca)}.sf-ctry.us{--c:var(--us)}
.stats-full .sf-ch{grid-area:h;margin:0;color:var(--text);font-size:13px;letter-spacing:.06em}
.sf-ch .flag{width:26px;height:17px}
.sf-hero{grid-area:hero;margin:0;display:flex;flex-direction:column}
.sf-hero b{font:800 clamp(34px,4.2vw,54px)/1 var(--mono);color:var(--text);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.sf-hero span{font-weight:700;color:var(--c);font-size:13px}
.sf-ctry .ring{grid-area:ring;margin:0;flex-direction:column;gap:2px;text-align:center}
.sf-ctry .ring svg{width:72px;height:72px}
.sf-ctry .ring figcaption{align-items:center;max-width:120px}
.sf-ctry .ring figcaption b{font-size:17px}
.sf-kv{grid-area:kv;list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.sf-kv li{display:flex;flex-direction:column;padding:6px 8px;border-radius:9px;background:color-mix(in srgb,var(--surface) 70%,transparent);border:1px solid var(--border);min-width:0}
.sf-kv span{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-kv b{font:700 16px/1.2 var(--mono);font-variant-numeric:tabular-nums}
.sf-types{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:12px}
.sf-tcol{padding:12px 14px;border:1px solid var(--border);border-radius:12px}
.sf-tr{display:grid;grid-template-columns:128px minmax(0,1fr) 64px;align-items:center;gap:10px;margin:6px 0 0}
.sf-tr span{font-size:12.5px;color:var(--muted)}
.sf-tr b{font:700 14px/1 var(--mono);text-align:right;font-variant-numeric:tabular-nums}
.sf-big{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 0}
.sf-card{padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 12%,var(--bg)),var(--bg))}
.sf-card b{display:block;font:800 24px/1.1 var(--mono);color:var(--accent);font-variant-numeric:tabular-nums}
.sf-card span{font-size:11.5px;color:var(--muted)}
.sf-rings{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.sf-rings .ring{margin:0;padding:10px 12px;border:1px solid var(--border);border-radius:12px}
.sf-rings .ring svg{width:58px;height:58px}
.sf-rings .ring figcaption b{font-size:19px}
.sf-rings .ring figcaption span{font-size:12px}
.sf-rings .ring:nth-child(2) .rv{stroke:var(--accent-2)}
.sf-act{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.sf-act li{display:grid;grid-template-columns:130px minmax(0,1fr) 80px;align-items:center;gap:12px;margin:0}
.sf-act li span{color:var(--muted);font-size:12px}
.sf-act .spark{width:100%;height:32px;display:block}
.sf-act b{font:700 14px/1 var(--mono);text-align:right}
.sf-tables{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sf-tbl{min-width:0}
.sf-scroll{max-height:290px;overflow:auto;overscroll-behavior:contain;border:1px solid var(--border);border-radius:12px;scrollbar-width:thin}
.sf-scroll:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px}
.sf-loadline{display:grid;grid-template-columns:auto minmax(80px,1fr);align-items:center;gap:10px;margin:0 0 8px;font-size:12px;color:var(--muted)}
.sf-loadline b{color:var(--text);font-family:var(--mono)}
.sf-loadline .hbar .bv{fill:var(--us)}
.sf-prov{width:100%;border-collapse:collapse;font-size:12.5px}
.sf-prov th,.sf-prov td{padding:5px 8px;border-bottom:1px solid var(--border);text-align:left;font-weight:400}
.sf-prov thead th{position:sticky;top:0;z-index:1;background:var(--surface);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.sf-prov td:nth-child(2){width:42%}
.sf-prov td:last-child,.sf-prov thead th:last-child{text-align:right;font-family:var(--mono);white-space:nowrap}
.sf-prov svg{display:block;width:100%;height:6px}
.sf-prov .bt{fill:var(--border)}.sf-prov .bv{fill:var(--accent)}
.sf-states td:nth-child(2){display:grid;grid-template-columns:minmax(0,1fr) 46px;align-items:center;gap:8px}
.sf-states td:nth-child(2) span{font-family:var(--mono);text-align:right}
.sf-states .bv{fill:var(--us)}
.sf-states tr.pending th,.sf-states tr.pending td{color:var(--muted)}
.shim{display:block;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--border) 0,color-mix(in srgb,var(--us) 45%,var(--border)) 50%,var(--border) 100%);background-size:200% 100%;animation:sf-shim 1.4s linear infinite}
@keyframes sf-shim{from{background-position:100% 0}to{background-position:-100% 0}}
.sf-states tr.new{animation:sf-row .8s ease}
@keyframes sf-row{from{background:color-mix(in srgb,var(--us) 28%,transparent)}to{background:transparent}}
.sf-harv{margin:14px 0 0;color:var(--muted);font-size:12px}
.sf-harv time{color:var(--text)}
@media (max-width:1023px){
  .stats-full{left:8px;right:8px;width:auto;bottom:calc(var(--foot-h,0px) + 8px);border-radius:16px 16px 12px 12px;padding:12px 12px 14px}
  .sf-types,.sf-tables{grid-template-columns:1fr}
  .sf-big,.sf-rings{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sf-rings .ring svg{width:44px;height:44px}
  .sf-act li{grid-template-columns:96px minmax(0,1fr) 56px;gap:8px}
  .sf-tr{grid-template-columns:112px minmax(0,1fr) 56px}
}
@media (max-width:620px){
  .sf-duel{grid-template-columns:1fr}
  .sf-kv{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sf-hero b{font-size:34px}
  .sf-ctry .ring svg{width:56px;height:56px}
  .sf-rings{grid-template-columns:1fr}
  .sf-tr{grid-template-columns:96px minmax(0,1fr) 52px;gap:8px}
}
.stats-drop[data-state=closed]{opacity:0;transform:translateY(-8px);visibility:hidden;pointer-events:none;
  transition:opacity .16s ease,transform .16s ease,visibility 0s linear .16s}
@media (max-width:1199px){.stats-drop[data-state=auto]{display:none}}
@media (prefers-reduced-motion:reduce){.stats-drop,.stats-drop[data-state=closed],.brand-btn .caret,.ring .rv,.hbar .bv{transition:none}.stats-full{animation:none}.sd-live i,.sf-live i,.busy .hbar .bv,.shim,.sf-states tr.new{animation:none}}
/* result card + hits (both flavours) */
.result{display:flex;flex-wrap:wrap;gap:22px 26px;align-items:center;text-align:left}
.result .det{flex:1 1 240px;min-width:0}
.result .row{display:flex;gap:10px;align-items:center;margin-top:12px;flex-wrap:wrap}
.result.empty{justify-content:center;flex-direction:column;gap:6px;color:var(--muted);text-align:center}
.result.empty img{width:72px}
.hits td.logo-cell{width:92px}
.hits a.pick{font-weight:600}
@media (max-width:720px){.result{flex-direction:column;align-items:stretch}.logo.lg{width:100%;height:auto}}
.code{max-width:100%}
/* API reference (/docs), rendered from openapi.json */
.apiref{display:grid;grid-template-columns:220px minmax(0,1fr);gap:22px;align-items:start}
.apiref-toc{position:sticky;top:78px;display:flex;flex-direction:column;gap:2px;padding:12px;font-size:13px;max-height:calc(100vh - 190px);overflow:auto}
.apiref-toc b{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:2px 0 4px}
.apiref-toc .toc-raw{margin-top:12px}
.apiref-toc a{padding:4px 6px;border-radius:6px;color:var(--text);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.apiref-toc a:hover{background:var(--code-bg)}
.apiref-toc .mono{font-size:12px}
.apiref-body{max-width:none}
.apiref-body h1{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.op{margin:18px 0}.op h2{margin:0 0 4px;font-size:18px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:0}
.op h3{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:14px 0 6px}
.op-sum{font-weight:700;margin:0 0 8px}
.m{display:inline-block;font:800 11px/1 var(--mono);padding:4px 7px;border-radius:6px;color:#04222a;background:var(--accent-2)}
.m-post,.m-put,.m-patch{background:var(--accent)}.m-delete{background:var(--err)}
.tscroll{overflow-x:auto}
table.params td{vertical-align:top}table.params td:nth-child(2){white-space:pre;color:var(--muted)}table.params td:nth-child(3){min-width:150px}
table.params code{display:inline-block;margin:0 3px 3px 0;padding:0 4px;border-radius:4px;background:var(--code-bg)}
.resp{list-style:none;padding:0;margin:0 0 12px}.resp li{margin:6px 0}.resp .code{margin-top:6px;max-height:340px}
@media (max-width:900px){.apiref{grid-template-columns:minmax(0,1fr)}.apiref-toc{position:static;max-height:none;flex-flow:row wrap}.apiref-toc b{width:100%}}
