/* CSPricer — the one stylesheet. No <style> elements anywhere (the CSP forbids them); pages only
   add style="" attributes for per-item values (widths, colours).
   Dark is the default; the warm beige light theme is html[data-theme="light"] (theme.js, before paint).
   One meaning per colour: price = --accent (teal) · sell speed = --good / --warn / --bad · float
   premium = --gold · the usual price of a wear = --ref · wears = --fn … --bs.
   Type: IBM Plex Sans for every word (headings, navigation, labels, pills, tags), IBM Plex Mono only for
   figures (prices, floats, seeds). Only the weights that are loaded are ever requested: no faux-bold.
   Licences: fonts/OFL.txt. */

@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:100 700;font-display:swap;src:url("/static/fonts/ibm-plex-sans-var.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/static/fonts/ibm-plex-mono-400.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/static/fonts/ibm-plex-mono-500.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:600;font-display:swap;src:url("/static/fonts/ibm-plex-mono-600.woff2") format("woff2")}

/* ───────────────────────────────────────────────────────────── tokens */
:root{
  --bg:#0A0C10;--panel:#0D1015;--panel2:#0C0E12;--raised:#11151C;--hover:#151A22;
  --line:#1B2028;--line2:#2A313B;
  --ink:#EAF1F3;--ink2:#C4D0D4;--muted:#AAB8BE;
  --accent:#2ED3C0;--accent-hi:#55DDCD;--accent-lo:#26B5A5;--accent-ink:#04211E;--accent-soft:#0E2826;--accent-line:#1D5650;
  --ok:#3fbf7f;--warn:#e0a93a;--off:#6b7688;--bad:#e5534b;--gold:#e4ae39;
  --good:#3fbf7f;--good-soft:#10261C;--warn-soft:#2A2012;--bad-soft:#2C1614;--gold-soft:#2A2310;--ref:#92B2F5;--ref-soft:#141D30;
  --st:#CF6A32;--sv:#FFD700;
  --r-consumer:#b0c3d9;--r-industrial:#5e98d9;--r-milspec:#4b69ff;--r-restricted:#8847ff;--r-classified:#d32ce6;--r-covert:#eb4b4b;--r-contraband:#e4ae39;--r-extraordinary:#e4ae39;--r-stock:#8a9aa3;
  --fn:#47B27B;--mw:#97C05F;--ft:#E0BD50;--ww:#E2984C;--bs:#D4624E;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --disp:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --radius:4px;--r-sm:3px;
  --shadow:0 16px 40px rgba(0,0,0,.42),0 1px 3px rgba(0,0,0,.3);
  --hdr:64px;--maxw:1280px;--gut:32px;
  --plot-bg:#0B0E12;--grid:#161B22;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:dark;
}
html[data-theme="light"]{
  --bg:#ECE5D6;--panel:#F5F0E4;--panel2:#E6DECC;--raised:#FAF6EE;--hover:#EFE8D9;
  --line:#D8CEB9;--line2:#C2B59C;
  --ink:#1B2322;--ink2:#3B4643;--muted:#58625F;
  --accent:#08796F;--accent-hi:#0A8B80;--accent-lo:#066259;--accent-ink:#FFFFFF;--accent-soft:#D6E8E1;--accent-line:#8EC3B9;
  --ok:#1F7A4B;--warn:#8F560B;--off:#5B6472;--bad:#B03226;--gold:#8A6300;
  --good:#1F7A4B;--good-soft:#DCEADB;--warn-soft:#F1E2C4;--bad-soft:#F2DAD2;--gold-soft:#EFE2BF;--ref:#3452A6;--ref-soft:#DDE2EF;
  --fn:#2F8A5B;--mw:#6A8F32;--ft:#9C7C14;--ww:#B2641F;--bs:#B0412F;
  --shadow:0 16px 40px rgba(60,45,20,.16),0 1px 3px rgba(60,45,20,.12);
  --plot-bg:#FAF6ED;--grid:#E5DCCA;
  color-scheme:light;
}

/* ───────────────────────────────────────────────────────────── base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr) + 16px)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-kerning:normal;overflow-x:hidden;min-height:100vh;display:flex;flex-direction:column}
main{flex:1;min-width:0}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-hi);text-decoration:underline;text-underline-offset:3px}
b,strong{font-weight:600}
h1,h2,h3,h4{margin:0;text-wrap:balance}
h1{font:600 clamp(1.75rem,1.4rem + 1vw,2.25rem)/1.15 var(--sans);letter-spacing:-.025em}
h2{font:600 20px/1.25 var(--sans);letter-spacing:-.015em}
h3{font:600 17px/1.3 var(--sans);letter-spacing:-.01em}
h4{font:600 15px/1.3 var(--sans)}
p{margin:0;text-wrap:pretty}
img{max-width:100%}
ul,ol{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus{outline:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
::selection{background:var(--accent);color:var(--accent-ink)}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
kbd{font:500 11px var(--mono);color:var(--ink2);border:1px solid var(--line2);border-radius:3px;padding:1px 5px;background:var(--raised)}
[hidden]{display:none!important}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px}
.skip{position:absolute;left:12px;top:-60px;z-index:200;background:var(--accent);color:var(--accent-ink);padding:10px 14px;border-radius:3px;font-weight:600}
.skip:focus{top:10px;color:var(--accent-ink)}
.mono,.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}.ink2{color:var(--ink2)}.small{font-size:14px}.tiny{font-size:13px}
.price{color:var(--accent);font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:500}
.prem{color:var(--gold);font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:500}
.refc{color:var(--ref)}
.spd{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.spd::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.spd-fast{color:var(--good)}.spd-mid{color:var(--warn)}.spd-slow{color:var(--bad)}.spd-na{color:var(--muted)}
.cheaper,.pricier,.flat{font-variant-numeric:tabular-nums;white-space:nowrap}
.cheaper{color:var(--ok)}.cheaper::before{content:"▼ "}.pricier{color:var(--bad)}.pricier::before{content:"▲ "}.flat{color:var(--off)}
.age-old{color:var(--warn)}

/* ───────────────────────────────────────────────────────────── layout */
.page{max-width:var(--maxw);margin:0 auto;padding:24px var(--gut) 64px;width:100%}
.page.wide{max-width:1400px}
.page-h{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin:4px 0 24px}
.page-h>div:first-child{flex:1;min-width:240px}
.page-h h1{margin-bottom:10px}
.lead{color:var(--ink2);font-size:16px;max-width:70ch}
.lead b{color:var(--ink);font-weight:500}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font:400 13px/1.5 var(--sans);color:var(--muted);margin-bottom:10px}
.crumbs a{color:var(--ink2)}
.crumbs a:hover{color:var(--ink)}
.crumbs span[aria-hidden]{opacity:.6}
.crumbs [aria-current]{color:var(--ink)}
.section{margin-top:48px}
.section-h{display:flex;align-items:baseline;gap:8px 12px;margin-bottom:16px;flex-wrap:wrap}
.section-h .sub{flex-basis:100%;order:5;color:var(--muted);font-size:14px;margin-top:-4px}
.section-h .more{margin-left:auto;font-size:14px;font-weight:500}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.stack{display:flex;flex-direction:column;gap:12px}
.spacer{flex:1}
.note{font-size:13px;color:var(--muted);margin-top:10px}
.eyebrow{font:600 12.5px var(--sans);color:var(--muted)}

/* ───────────────────────────────────────────────────────────── header */
.hdr{position:sticky;top:0;z-index:50;height:var(--hdr);display:flex;align-items:center;gap:16px;padding:0 var(--gut);background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.wm{display:inline-flex;flex-direction:column;gap:4px;color:var(--ink);text-decoration:none!important;flex:none}
.wm b{font:600 20px/1 var(--sans);letter-spacing:-.02em}
.wm b i{font-style:normal;color:var(--accent)}
.wm .strip{display:flex;gap:2px;width:100%}
.wm .strip span{flex:1;height:3px;border-radius:1px}
.wm:hover{color:var(--ink)}
.strip .s-fn{background:var(--fn)}.strip .s-mw{background:var(--mw)}.strip .s-ft{background:var(--ft)}.strip .s-ww{background:var(--ww)}.strip .s-bs{background:var(--bs)}
.nav{display:flex;gap:4px;margin-left:12px;height:100%}
.nav a{position:relative;display:flex;align-items:center;color:var(--ink2);font:500 14px/1 var(--sans);padding:0 10px;text-decoration:none;white-space:nowrap;transition:color .15s}
.nav a:hover{color:var(--ink);text-decoration:none}
.nav a[aria-current="page"]{color:var(--ink)}
.nav a[aria-current="page"]::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;background:var(--accent)}
.hdr-search{margin-left:auto;display:flex;align-items:center;gap:8px;width:340px;max-width:34vw;height:40px;padding:0 8px 0 12px;background:var(--panel2);border:1px solid var(--line2);border-radius:3px;color:var(--muted);cursor:text;font:400 14px var(--sans);text-align:left;transition:border-color .15s}
.hdr-search:hover{border-color:var(--muted);color:var(--ink2)}
.hdr-search>span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hdr-search svg{width:16px;height:16px;flex:none}
.icon-btn{width:40px;height:40px;flex:none;border-radius:3px;border:1px solid transparent;background:transparent;color:var(--ink2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,color .15s}
.icon-btn:hover{color:var(--ink);background:var(--raised)}
.icon-btn svg{width:20px;height:20px}
.icon-btn>span{display:flex}
.hdr-guide{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border-radius:3px;border:1px solid var(--line2);background:transparent;color:var(--ink2);font:500 13px var(--sans);cursor:pointer;flex:none;transition:background .15s,color .15s}
.hdr-guide:hover{background:var(--raised);color:var(--ink)}
.hdr-guide svg{width:16px;height:16px}
.only-phone{display:none!important}
html:not([data-theme="light"]) .icon-btn>.ico-l,html[data-theme="light"] .icon-btn>.ico-d{display:none}

/* ───────────────────────────────────────────────────────────── ticker */
.ticker{position:relative;display:flex;align-items:center;height:36px;border-bottom:1px solid var(--line);background:var(--panel2);overflow:hidden;font-size:13px}
.ticker-lab{flex:none;display:flex;align-items:center;gap:8px;padding:0 12px 0 var(--gut);height:100%;color:var(--muted);font:500 12px var(--sans);background:var(--panel2);z-index:1}
.ticker-lab em{font-style:normal}
.ticker-lab i{width:6px;height:6px;border-radius:50%;background:var(--gold)}
.ticker-track{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 32px,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,transparent,#000 32px,#000 calc(100% - 32px),transparent)}
.ticker-run{display:inline-flex;gap:28px;white-space:nowrap;padding-left:24px;animation:tick 110s linear infinite;will-change:transform}
.ticker.paused .ticker-run,.ticker:hover .ticker-run,.ticker:focus-within .ticker-run{animation-play-state:paused}
.ticker-run a{color:var(--ink2);display:inline-flex;gap:8px;align-items:center;text-decoration:none}
.ticker-run a:hover b{color:var(--ink);text-decoration:underline}
.ticker-run b{font-weight:500;color:var(--ink2)}
.ticker-run .rng{font-family:var(--mono);color:var(--muted)}
.ticker-pause{flex:none;height:100%;padding:0 var(--gut) 0 12px;border:0;background:var(--panel2);color:var(--muted);display:flex;align-items:center;gap:6px;font:500 12px var(--sans);cursor:pointer}
.ticker-pause:hover{color:var(--ink)}
.ticker-pause svg{width:14px;height:14px}
.ticker-pause .ico-play,.ticker-pause .l-play{display:none}
.ticker.paused .ticker-pause .ico-play,.ticker.paused .ticker-pause .l-play{display:inline}
.ticker.paused .ticker-pause .ico-pause,.ticker.paused .ticker-pause .l-pause{display:none}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ───────────────────────────────────────────────────────────── footer */
.ftr{border-top:1px solid var(--line);margin-top:48px}
.ftr-in{max-width:var(--maxw);margin:0 auto;padding:40px var(--gut) 24px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.ftr h3{font:600 13px var(--sans);color:var(--ink);margin-bottom:12px}
.ftr ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ftr ul a{color:var(--ink2);font-size:14px}
.ftr ul a:hover{color:var(--ink)}
.ftr .blurb{color:var(--muted);font-size:14px;max-width:34ch;margin-top:12px}
.ftr-legal{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut) 16px;color:var(--muted);font-size:13px}
.ftr-legal p{max-width:95ch}
.ftr-b{max-width:var(--maxw);margin:0 auto;padding:16px var(--gut) 24px;border-top:1px solid var(--line);display:flex;gap:8px 16px;flex-wrap:wrap;align-items:center;color:var(--muted);font-size:13px}
.ftr-b .spacer{flex:1}
.link-btn{background:none;border:0;padding:0;color:var(--accent);cursor:pointer;font:inherit;text-underline-offset:3px}
.link-btn:hover{text-decoration:underline;color:var(--accent-hi)}
.theme-l-dark{display:none}
html[data-theme="light"] .theme-l-dark{display:inline}html[data-theme="light"] .theme-l-light{display:none}
.spfoot{max-width:var(--maxw);margin:0 auto 16px;padding:14px var(--gut);display:flex;gap:12px 16px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--ink2)}

/* ───────────────────────────────────────────────────────────── buttons, chips, tags */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:3px;border:1px solid var(--line2);background:var(--raised);color:var(--ink);font:600 14px/1 var(--sans);letter-spacing:.01em;cursor:pointer;text-decoration:none!important;white-space:nowrap;user-select:none;transition:background-color .15s ease-out,border-color .15s ease-out,color .15s ease-out,box-shadow .15s ease-out}
.btn:hover{background:var(--hover);border-color:var(--muted);color:var(--ink)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.primary:hover{background:var(--accent-hi);border-color:var(--accent-hi);color:var(--accent-ink);box-shadow:0 10px 26px -14px rgba(46,211,192,.6)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--ink2)}
.btn.ghost:hover{background:var(--raised);color:var(--ink)}
.btn.sm{height:32px;padding:0 12px;font-size:13px}
.btn.lg{height:48px;padding:0 20px;font-size:15px}
.btn.icon{width:40px;padding:0}.btn.sm.icon{width:32px}
.btn svg{width:16px;height:16px;flex:none}
.chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:3px;border:1px solid var(--line2);background:transparent;color:var(--ink2);font:500 13px var(--sans);white-space:nowrap;text-decoration:none!important;transition:border-color .15s,color .15s,background .15s}
button.chip,a.chip{cursor:pointer}
button.chip:hover,a.chip:hover{border-color:var(--muted);color:var(--ink)}
.chip[aria-pressed="true"],.chip[aria-current="page"]{background:var(--accent-soft);border-color:var(--accent-line);color:var(--ink)}
.chip.mono{font-family:var(--mono)}
.chip svg{width:14px;height:14px}
.pill{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:4px;font:600 12px/1 var(--sans);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;white-space:nowrap;color:var(--c,var(--ink2));background:color-mix(in srgb,var(--c,var(--ink2)) 13%,transparent);border:1px solid color-mix(in srgb,var(--c,var(--ink2)) 36%,transparent)}
a.pill{text-decoration:none!important}
a.pill:hover{border-color:var(--c,var(--ink2))}
.pill.good{--c:var(--good)}.pill.warn{--c:var(--warn)}.pill.bad{--c:var(--bad)}.pill.ref{--c:var(--ref)}.pill.gold{--c:var(--gold)}.pill.accent{--c:var(--accent)}.pill.plain{--c:var(--muted)}
.tag{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:20px;padding:0 5px;border-radius:4px;font:600 11.5px/1 var(--sans);letter-spacing:.02em;-webkit-font-smoothing:antialiased;flex:none;color:#0A1013;background:var(--w,#9AA3B2);border:1px solid var(--w,#9AA3B2)}
.tag.fn{--w:var(--fn)}.tag.mw{--w:var(--mw)}.tag.ft{--w:var(--ft)}.tag.ww{--w:var(--ww)}.tag.bs{--w:var(--bs)}
html[data-theme="light"] .tag{color:#fff}
.tag-st,.tag-sv{display:inline-flex;align-items:center;height:20px;padding:0 6px;border-radius:4px;font:600 12px/1 var(--sans);-webkit-font-smoothing:antialiased;white-space:nowrap;flex:none}
.tag-st{color:#E8956A;background:rgba(207,106,50,.12);border:1px solid rgba(207,106,50,.5)}
.tag-sv{color:var(--sv);background:rgba(255,215,0,.08);border:1px solid rgba(255,215,0,.4)}
html[data-theme="light"] .tag-st{color:#9a4a1c}
html[data-theme="light"] .tag-sv{color:#7a6400;border-color:rgba(160,130,0,.5)}
.rar{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;color:var(--ink2);white-space:nowrap}
.rar i{width:8px;height:8px;border-radius:2px;background:var(--rc,var(--muted))}
.splabel{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:4px;font:600 12px/1 var(--sans);-webkit-font-smoothing:antialiased;color:var(--warn);background:var(--warn-soft);border:1px solid color-mix(in srgb,var(--warn) 40%,transparent);white-space:nowrap}
.info{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin:-4px 0;border-radius:50%;border:0;background:transparent;color:var(--muted);cursor:pointer;vertical-align:middle;padding:0}
.info:hover,.info[aria-expanded="true"]{color:var(--ink);background:var(--raised)}
.info svg{width:16px;height:16px}
.term{border:0;background:none;padding:0;font:inherit;color:inherit;cursor:help;text-decoration:underline dotted;text-decoration-color:var(--muted);text-underline-offset:3px;text-transform:inherit;letter-spacing:inherit}
.term:hover,.term[aria-expanded="true"]{text-decoration-color:var(--accent)}
.pop{position:absolute;z-index:120;max-width:280px;background:var(--raised);border:1px solid var(--line2);border-radius:4px;padding:10px 12px;font:400 13px/1.5 var(--sans);color:var(--ink2);box-shadow:var(--shadow);animation:popin .15s var(--ease)}

/* ───────────────────────────────────────────────────────────── cards, tables, forms */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);min-width:0}
a.card{display:block;color:inherit;text-decoration:none!important;transition:border-color .15s}
a.card:hover{border-color:var(--line2)}
.card-h{display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.card-h h2,.card-h h3{font:600 15px/1.3 var(--sans);letter-spacing:0}
.card-b{padding:16px}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.kpi{display:flex;flex-direction:column;gap:2px;min-width:0;padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.kpi b{font:500 26px var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--ink)}
.kpi span{font-size:13px;color:var(--muted)}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
table.tbl{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.tbl th{position:sticky;top:0;background:var(--panel);text-align:left;font:500 13px var(--sans);color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl th button{background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer;display:inline-flex;gap:4px;align-items:center}
.tbl th button:hover{color:var(--ink)}
.tbl th[aria-sort="ascending"] button::after{content:"↑"}.tbl th[aria-sort="descending"] button::after{content:"↓"}
.tbl td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr:hover td{background:var(--raised)}
.tbl .r{text-align:right}
.tbl .num{white-space:nowrap}
.tbl tr.rar-row td:first-child{box-shadow:inset 4px 0 0 var(--rc,var(--line))}
.input,.select{height:40px;width:100%;padding:0 12px;border-radius:3px;border:1px solid var(--line2);background:var(--panel2);color:var(--ink);font:400 15px var(--sans);transition:border-color .15s,box-shadow .15s}
.input:hover,.select:hover{border-color:var(--muted)}
textarea.input{height:auto;min-height:120px;padding:10px 12px;resize:vertical;line-height:1.5}
.input:focus,.select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);outline:none}
.input.err,.input[aria-invalid="true"]{border-color:var(--bad);box-shadow:0 0 0 3px var(--bad-soft)}
.select{appearance:none;-webkit-appearance:none;padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 17px) 17px,calc(100% - 12px) 17px;background-size:5px 5px;background-repeat:no-repeat}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label,.field>span{font-size:13px;font-weight:500;color:var(--ink2)}
.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;color:var(--ink2);min-height:32px;position:relative}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch span{position:relative;width:36px;height:20px;border-radius:10px;background:var(--line2);transition:background .15s;flex:none}
.switch span::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:var(--ink);transition:transform .15s var(--ease)}
.switch input:checked+span{background:var(--accent)}
.switch input:checked+span::after{transform:translateX(16px);background:var(--accent-ink)}
.switch input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.seg{position:relative;display:inline-flex;padding:3px;gap:2px;border-radius:4px;background:var(--panel2);border:1px solid var(--line);max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg>button,.seg>a{flex:none;display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border:0;border-radius:3px;background:transparent;color:var(--ink2);font:500 13px var(--sans);cursor:pointer;white-space:nowrap;text-decoration:none!important;transition:color .15s,background .15s}
.seg>button:hover,.seg>a:hover{color:var(--ink)}
.seg>[aria-pressed="true"],.seg>[aria-current="page"]{color:var(--ink);background:var(--raised);box-shadow:inset 0 0 0 1px var(--line2)}
.seg small{font:500 12px var(--mono);color:var(--muted)}
.seg svg{width:16px;height:16px}
.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line)}
.tabs::-webkit-scrollbar{display:none}
.tabs>button,.tabs>a{position:relative;display:inline-flex;align-items:center;height:40px;padding:0 12px;border:0;background:transparent;color:var(--ink2);font:500 14px var(--sans);cursor:pointer;white-space:nowrap;flex:none;text-decoration:none!important;transition:color .15s}
.tabs>button,.tabs>a{gap:6px}
.tabs>button:hover,.tabs>a:hover{color:var(--ink)}
.tabs>[aria-selected="true"],.tabs>[aria-current="page"]{color:var(--ink)}
.tabs>[aria-selected="true"]::after,.tabs>[aria-current="page"]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;background:var(--accent)}
.tabs>button:focus-visible{outline-offset:-2px}
.empty{border:1px dashed var(--line2);border-radius:var(--radius);padding:32px 20px;text-align:center;color:var(--ink2);display:flex;flex-direction:column;align-items:center;gap:8px}
.empty h3{color:var(--ink)}
.more-row{display:flex;justify-content:center;margin-top:20px}
.load-more .n{font-family:var(--mono);color:var(--muted);font-weight:500}

/* skin picture: never upscaled past native pixels */
.pic{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0}
.pic img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.pic.ph::after{content:"";width:46%;height:34%;border-radius:4px;background:repeating-linear-gradient(135deg,var(--line) 0 6px,transparent 6px 12px);opacity:.8}

/* skin tile (home, hubs, explore grid) */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.tile{position:relative;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;color:var(--ink);text-decoration:none!important;transition:border-color .15s;min-width:0;box-shadow:inset 4px 0 0 var(--rc,#8a9aa3)}
.tile:hover{border-color:var(--line2);color:var(--ink)}
.tile:hover .tile-n{text-decoration:underline;text-underline-offset:3px}
.tile-art{position:relative;aspect-ratio:4/3;padding:12px 16px 12px 20px;background:var(--panel2)}
.tile-b{padding:12px 12px 12px 16px;display:flex;flex-direction:column;gap:2px;min-width:0}
.tile-w{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile-n{font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile-p{display:flex;align-items:baseline;gap:8px;margin-top:4px;font-size:14px;color:var(--muted)}
.tile-p .price{font-size:15px}
.tile-f{display:flex;align-items:center;gap:8px;margin-top:2px;font-size:13px;flex-wrap:wrap}
.tile-f .prem{font-size:13px}
.shelf{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);gap:16px;overflow-x:auto;padding:2px 2px 12px;scroll-snap-type:x mandatory;scrollbar-width:thin}
.shelf>*{scroll-snap-align:start}
.rc-consumer{--rc:var(--r-consumer)}.rc-industrial{--rc:var(--r-industrial)}.rc-milspec{--rc:var(--r-milspec)}.rc-restricted{--rc:var(--r-restricted)}.rc-classified{--rc:var(--r-classified)}.rc-covert{--rc:var(--r-covert)}.rc-contraband{--rc:var(--r-contraband)}.rc-extraordinary{--rc:var(--r-extraordinary)}.rc-stock{--rc:var(--r-stock)}

/* market links: real <a href="/go/…"> anchors */
.mkt{display:flex;align-items:center;gap:8px;min-height:40px;padding:6px 12px;border-radius:3px;border:1px solid var(--line2);background:var(--raised);color:var(--ink);text-decoration:none!important;font:500 14px var(--sans);width:100%;text-align:left;transition:background .15s,border-color .15s;min-width:0}
.mkt:hover{border-color:var(--muted);background:var(--hover);color:var(--ink)}
.mkt .mki{width:20px;height:20px;border-radius:3px;flex:none;object-fit:contain;background:#fff;padding:2px}
.mkt i.mki{display:inline-flex;align-items:center;justify-content:center;font:600 12px var(--mono);font-style:normal;color:#0A0C10}
.mkt .mk-n{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.mkt .mk-n b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mkt .mk-n small{font:500 12px var(--mono);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mkt .go{margin-left:auto;color:var(--muted);flex:none;display:flex}
.mkt .go svg{width:14px;height:14px;display:block}
.mkt .splabel{margin-left:auto}
.mkt .splabel+.go{margin-left:6px}
.mkt.first{min-height:52px;background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.mkt.first:hover{background:var(--accent-hi);border-color:var(--accent-hi);color:var(--accent-ink)}
.mkt.first .mk-n b{font-weight:600}
.mkt.first .mk-n small,.mkt.first .go{color:var(--accent-ink);opacity:.8}
.mkt.sponsored{flex-wrap:wrap}

/* ───────────────────────────────────────────────────────────── overlays: sheet, palette, modal, toast */
.sheet-wrap,.pal-wrap,.modal-wrap{position:fixed;inset:0;background:rgba(3,7,9,.6);animation:fadein .15s}
html[data-theme="light"] .sheet-wrap,html[data-theme="light"] .pal-wrap,html[data-theme="light"] .modal-wrap{background:rgba(40,32,18,.34)}
.sheet-wrap{z-index:90}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:91;background:var(--panel);border-top:1px solid var(--line2);border-radius:10px 10px 0 0;box-shadow:var(--shadow);padding:8px 16px calc(16px + env(safe-area-inset-bottom));max-height:88vh;overflow-y:auto;animation:sheetin .22s var(--ease)}
.sheet::before{content:"";display:block;width:36px;height:4px;border-radius:2px;background:var(--line2);margin:4px auto 12px}
.sheet-nav{display:flex;flex-direction:column}
.sheet-nav a{display:flex;align-items:center;gap:12px;min-height:52px;padding:0 4px;border-bottom:1px solid var(--line);color:var(--ink);font-size:17px;font-weight:500;text-decoration:none}
.sheet-nav a[aria-current="page"]{color:var(--accent)}
.sheet-nav a svg{width:16px;height:16px;color:var(--muted);margin-left:auto}
.pal-wrap{z-index:110;display:flex;justify-content:center;align-items:flex-start;padding:10vh 16px 16px}
.pal{width:100%;max-width:640px;background:var(--panel);border:1px solid var(--line2);border-radius:6px;box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;max-height:78vh;animation:popin .15s var(--ease)}
.pal-in{display:flex;align-items:center;gap:10px;padding:0 8px 0 16px;height:56px;border-bottom:1px solid var(--line)}
.pal-in>svg{width:20px;height:20px;color:var(--muted);flex:none}
.pal-in input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--ink);font:400 17px var(--sans);outline:none}
.pal-in input::-webkit-search-cancel-button{display:none}
.pal-chips{display:flex;gap:6px;flex-wrap:wrap;padding:8px 16px 0}
.pal-chips:empty{display:none}
.pal-list{overflow-y:auto;padding:4px 8px 8px}
.pal-grp{font:500 12px var(--sans);color:var(--muted);padding:12px 8px 6px}
.pal-it{display:flex;align-items:center;gap:12px;padding:6px 8px;border-radius:3px;color:var(--ink);text-decoration:none!important;cursor:pointer;min-height:48px}
.pal-it[aria-selected="true"],.pal-it:hover{background:var(--raised);color:var(--ink)}
.pal-thumb{width:56px;height:40px;flex:none}
.pal-thumb.icon{display:flex;align-items:center;justify-content:center;color:var(--muted)}
.pal-thumb.icon svg{width:20px;height:20px}
.pal-t{flex:1;min-width:0}
.pal-t b{display:block;font-weight:500;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pal-t small{display:block;color:var(--muted);font-size:13px}
.pal-p{text-align:right;font-size:12px;color:var(--muted);white-space:nowrap}
.pal-p .price{display:block;font-size:14px}
.pal-f{display:flex;gap:16px;padding:10px 16px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);flex-wrap:wrap}
.pal mark{background:transparent;color:var(--accent);font-weight:600}
.modal-wrap{z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:10vh 16px 16px;overflow-y:auto;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.modal{width:100%;max-width:520px;background:var(--panel);border:1px solid var(--line2);border-radius:6px;box-shadow:var(--shadow);display:flex;flex-direction:column;animation:popin .18s var(--ease)}
.modal-h{display:flex;align-items:center;gap:12px;padding:16px 20px 8px}
.modal-h h2{flex:1;font:600 17px/1.25 var(--sans);letter-spacing:-.01em}
.modal-b{padding:4px 20px 16px;color:var(--ink2);font-size:15px}
.modal-b>p+*{margin-top:12px}
.modal-f{display:flex;gap:8px;justify-content:flex-end;padding:12px 20px 16px;flex-wrap:wrap}
.lg-sec{padding:12px 0;border-top:1px solid var(--line)}
.lg-sec:first-child{border-top:0;padding-top:0}
.lg-sec h3{font-size:14px;margin-bottom:8px}
.lg-row{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;font-size:14px;color:var(--ink2)}
.lg-sw{display:inline-block;width:14px;height:14px;border-radius:3px;vertical-align:-2px;margin-right:6px}
.lg-sw.hol{border:2px solid var(--accent);border-radius:50%;background:transparent}
.gd-mask{position:fixed;z-index:140;border-radius:4px;box-shadow:0 0 0 9999px rgba(3,7,9,.6);pointer-events:none;transition:all .2s var(--ease)}
html[data-theme="light"] .gd-mask{box-shadow:0 0 0 9999px rgba(40,32,18,.36)}
.gd-ring{position:fixed;z-index:141;border-radius:4px;border:2px solid var(--accent);pointer-events:none;transition:all .2s var(--ease)}
.gd-card{position:fixed;z-index:142;width:320px;max-width:calc(100vw - 32px);background:var(--panel);border:1px solid var(--line2);border-radius:6px;box-shadow:var(--shadow);padding:16px;animation:popin .18s var(--ease)}
.gd-card small{display:block;font:500 12px var(--sans);color:var(--muted);margin-bottom:4px}
.gd-card h2{font-size:17px;margin-bottom:6px}
.gd-card p{font-size:14px;color:var(--ink2)}
.gd-card .row{margin-top:16px;justify-content:flex-end}
.gd-card .row .link-btn{margin-right:auto;color:var(--muted);font-size:14px}
#toasts{position:fixed;right:20px;bottom:20px;z-index:130;display:flex;flex-direction:column;gap:8px;max-width:min(400px,calc(100vw - 32px))}
.toast{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:4px;background:var(--raised);border:1px solid var(--line2);box-shadow:var(--shadow);font-size:14px;animation:popin .2s var(--ease)}
.toast::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);flex:none}
@keyframes fadein{from{opacity:0}}
@keyframes popin{from{opacity:0;transform:translateY(6px)}}
@keyframes sheetin{from{transform:translateY(100%)}}

/* ───────────────────────────────────────────────────────────── charts (server-drawn SVG) */
.chart-svg{display:block;width:100%;height:auto;overflow:visible}
.ax{font:500 11px var(--mono);fill:var(--muted)}
.ax2{font:500 11px var(--sans);fill:var(--muted)}
.tagt{font:600 11px var(--sans);fill:#0A1013}
html[data-theme="light"] .tagt{fill:#fff}
.clt{font:500 11px var(--mono);fill:var(--gold)}
.bvt{font:500 11px var(--mono);fill:var(--accent)}
.pillt{font:500 11px var(--mono)}
.chart-host[data-hide-usual] .ly-usual{display:none}
/* labels keep ~11.5 px on screen at any chart width: --k = viewBox units per CSS pixel (site.js fitChart);
   pills and wear tags scale around their own centre instead, so their boxes still fit their words */
.chart-svg .ax,.chart-svg .ax2,.chart-svg .pillt,.chart-svg .ov .ovt{font-size:calc(11.5px * var(--k,1))}
.chart-svg .ov .ovt{stroke-width:calc(4px * var(--k,1))}
.c-compact .tagt{font-size:11px}
.sk-ch-h h2 .info{margin-left:2px;vertical-align:-3px}

/* ───────────────────────────────────────────────────────────── skin page */
.sk-nav{display:flex;align-items:center;gap:8px 16px;flex-wrap:wrap;margin-bottom:8px}
.sk-nav .crumbs{margin:0}
.sk-pn{margin-left:auto;display:flex;gap:8px}
.sk-pn a{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border-radius:3px;border:1px solid var(--line2);color:var(--ink2);font-size:14px;max-width:220px;text-decoration:none!important}
.sk-pn a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-pn a:hover{border-color:var(--muted);color:var(--ink)}
.sk-top{display:flex;align-items:flex-end;gap:16px 24px;flex-wrap:wrap;margin-bottom:20px}
.sk-top>div:first-child{flex:1;min-width:280px}
.sk-h1row{display:flex;align-items:center;gap:8px 16px;flex-wrap:wrap}
.sk-thumb{width:64px;height:48px;flex:none;display:none}
.sk-ans{margin-top:10px;font-size:17px;color:var(--ink2);max-width:80ch}
.sk-ans .price{font-size:17px}
.sk-ans b{color:var(--ink);font-weight:500}
.sk-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.sk-tb{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 20px;padding:8px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.sk-tb .sp{flex:1}
.sk-phases{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 0 20px;padding-bottom:2px}
.sk-phases::-webkit-scrollbar{display:none}
.sk-ph{flex:none;display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 12px 0 4px;border-radius:4px;border:1px solid var(--line);color:var(--ink2);font:500 14px var(--sans);text-decoration:none!important;white-space:nowrap}
.sk-ph .pic{width:52px;height:39px;flex:none}
.sk-ph small{font:500 12px var(--mono);color:var(--muted)}
.sk-ph:hover{border-color:var(--line2);color:var(--ink)}
.sk-ph[aria-current="page"]{border-color:var(--accent);color:var(--ink)}
.sk-main{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start}
.sk-chart{overflow:hidden}
.sk-ch-h{display:flex;align-items:flex-start;gap:8px;padding:14px 16px 0;flex-wrap:wrap}
.sk-ch-h h2{font-size:1.125rem}
.sk-h2l{font-size:14px;color:var(--muted);margin-top:2px}
.sk-plot{position:relative;padding:4px 8px 0;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:crosshair}
.dual>.c-compact,.sk-plot>.c-compact{display:none}
.sk-tip{position:absolute;z-index:3;pointer-events:none;width:214px;background:var(--raised);border:1px solid var(--line2);border-radius:4px;padding:10px 12px;box-shadow:var(--shadow);font-size:13px;transition:opacity .12s;opacity:0}
.sk-tip.on{opacity:1}
.sk-tip .t1{display:flex;align-items:center;gap:8px;font:500 12px var(--mono);color:var(--ink2)}
.sk-tip .t2{display:flex;align-items:baseline;gap:8px;margin:4px 0 6px}
.sk-tip .t2 b{font:500 20px var(--mono);color:var(--accent);letter-spacing:-.02em}
.sk-tip .t3{border-top:1px solid var(--line);padding-top:6px;color:var(--muted);display:flex;flex-direction:column;gap:2px}
.sk-tip .hint{font-size:12px;color:var(--muted);margin-top:6px}
/* float slider: a native range input over a track tinted by wear */
.fs{position:relative;height:42px;margin:2px 8px 0}
.fs-track{position:absolute;left:var(--fl,0%);right:var(--fr,0%);top:14px;height:6px;border-radius:3px;overflow:hidden;background:var(--line)}
.fs-track span{position:absolute;top:0;bottom:0;opacity:.9}
.fs-ticks{position:absolute;left:var(--fl,0%);right:var(--fr,0%);top:25px;height:14px;font:500 11px var(--mono);color:var(--muted)}
.fs-ticks span{position:absolute;transform:translateX(-50%)}
.fs input[type=range]{position:absolute;left:calc(var(--fl,0%) - 12px);top:4px;width:calc(100% - var(--fl,0%) - var(--fr,0%) + 24px);height:26px;margin:0;padding:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer;touch-action:none}
.fs input[type=range]::-webkit-slider-runnable-track{height:26px;background:transparent}
.fs input[type=range]::-moz-range-track{height:26px;background:transparent}
.fs input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:1px;border-radius:50%;background:var(--ink);border:3px solid var(--accent);box-shadow:0 1px 4px rgba(0,0,0,.4);cursor:grab}
.fs input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--ink);border:3px solid var(--accent);box-shadow:0 1px 4px rgba(0,0,0,.4);cursor:grab}
.fs input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px var(--accent-line)}
.w-fn{background:var(--fn)}.w-mw{background:var(--mw)}.w-ft{background:var(--ft)}.w-ww{background:var(--ww)}.w-bs{background:var(--bs)}
.sk-ctl{display:flex;align-items:center;gap:8px 16px;flex-wrap:wrap;padding:6px 16px 12px}
.sk-fin{display:flex;align-items:center;gap:8px}
.sk-fin label{font-size:13px;color:var(--ink2);font-weight:500}
.sk-fin input{width:104px;height:36px;font:500 15px var(--mono);text-align:center;padding:0 8px}
.sk-hint{font-size:13px;color:var(--muted);display:inline-flex;align-items:center;gap:6px}
.sk-hint .mono{color:var(--ink)}
.sk-legend{display:flex;align-items:center;gap:4px 16px;flex-wrap:wrap;margin-left:auto;font-size:13px;color:var(--ink2)}
.sk-legend .lg{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:4px 0;color:inherit;font:inherit}
.sk-legend button.lg{cursor:pointer}
.sk-legend button.lg:hover{color:var(--ink)}
.sk-legend .lg[aria-pressed="false"]{opacity:.5;text-decoration:line-through}
.sk-legend svg{width:16px;height:12px}
.sk-wr{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--line)}
.sk-w{position:relative;display:flex;flex-direction:column;gap:4px;padding:12px 16px;border:0;border-left:1px solid var(--line);background:transparent;text-align:left;color:var(--ink);font:inherit;cursor:pointer;min-width:0;transition:background .15s}
.sk-w:first-child{border-left:0}
.sk-w:hover{background:var(--raised)}
.sk-w[aria-pressed="true"]{background:var(--raised)}
.sk-w[aria-pressed="true"]::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--accent)}
.sk-w-h{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink2);white-space:nowrap;overflow:hidden}
.sk-w-r{font:500 15px var(--mono);color:var(--accent);white-space:nowrap}
.sk-w-f{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-w.nm{cursor:default;color:var(--muted)}
.sk-w.nm:hover{background:transparent}
.sk-w.nm .sk-w-r{color:var(--muted);font:400 13px var(--sans)}
.sk-w.ref .sk-w-r{color:var(--ref)}
.sk-rail{position:sticky;top:calc(var(--hdr) + 16px)}
.sk-ro{padding:20px}
.sk-ro-top{display:flex;align-items:flex-start;gap:8px}
.sk-ro-top>div:first-child{min-width:0;flex:1}
.sk-ro-art{width:96px;height:72px;flex:none;margin:-4px -4px 0 auto}
.sk-ro-b>span{white-space:nowrap}
.sk-ro-l{font-size:13px;color:var(--ink2)}
.sk-ro-l b{font:500 13px var(--mono);color:var(--ink)}
.sk-ro-p{display:flex;align-items:center;gap:12px;margin:4px 0}
.sk-ro-p b{font:500 44px/1.05 var(--mono);color:var(--accent);letter-spacing:-.04em;white-space:nowrap;cursor:copy}
.sk-ro-b{display:flex;gap:6px 8px;align-items:center;font-size:13px;color:var(--muted);flex-wrap:wrap}
.sk-ro-b .mono{color:var(--ink2)}
.sk-rows{margin-top:16px}
.sk-rows>div{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:8px 0;border-top:1px solid var(--line);font-size:14px}
.sk-rows>div>span:first-child{color:var(--ink2)}
.sk-rows b{font:500 14px var(--mono);text-align:right}
.sk-mks{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.sk-mks .mkt.first,.sk-mks .mkt.sponsored,.sk-mks .mkt.wide{grid-column:1/-1}
.sk-mk-note{margin-top:8px;font-size:12px;color:var(--muted)}
.sk-mks .mkt:not(.first):not(.sponsored) small{display:none}
.sk-det{margin-top:48px}
.sk-det>.tabs{margin-bottom:20px}
.tabpanel{min-height:120px}
html.js .tabpanel:not(.on){display:none}
html:not(.js) .tabpanel+.tabpanel{margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
.tp-h{display:none}
html:not(.js) .tp-h{display:block;margin-bottom:12px}
.sk-note{padding:8px 0 0;font-size:13px;color:var(--muted)}
.hist-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.hist-wrap{position:relative;padding:8px}
.hist-wrap .hist-svg:not(.on){display:none}
.sk-cl{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.sk-cl .card{padding:16px}
.sk-cl h4{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink2);font-weight:500;margin-bottom:8px}
.sk-cl .big{font:500 24px var(--mono);color:var(--gold);letter-spacing:-.02em}
.sk-cl p{font-size:14px;color:var(--ink2);margin-top:4px}
.sk-spr{display:flex;flex-direction:column;gap:8px;margin-top:20px}
.sk-spr div{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink2);flex-wrap:wrap}
.sk-tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.sk-tier{padding:16px;border-radius:var(--radius);border:1px solid var(--line);background:var(--panel)}
.sk-tier h4{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600}
.sk-tier h4 i{width:10px;height:10px;border-radius:50%;background:var(--tc,var(--gold));flex:none}
.sk-tier .big{font:500 20px var(--mono);color:var(--accent);margin:4px 0 2px}
.sk-tier p{font-size:13px;color:var(--ink2)}
.rungs{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-direction:column;gap:6px}
.rungs li{display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;align-items:baseline;font-size:13px;padding-top:6px;border-top:1px solid var(--line)}
.rungs .win{font-family:var(--mono);color:var(--ink2)}
.rungs b{font:500 14px var(--mono);color:var(--accent)}
.rungs small{grid-column:1/-1;color:var(--muted);font:400 12.5px var(--sans)}
.seedlook{display:flex;gap:8px 12px;align-items:flex-end;flex-wrap:wrap;margin-bottom:20px}
.seedlook .field{width:160px}
.seedres{flex:1 1 260px;min-height:40px;display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink2);flex-wrap:wrap}
.sk-bt .tbl-wrap{max-height:520px;overflow:auto}
.sk-bt tr.cur td{background:var(--accent-soft)}
.sk-bt tbody tr[data-b]{cursor:pointer}
.bar{display:inline-block;height:6px;border-radius:3px;background:var(--accent);opacity:.5;vertical-align:middle}
.bt-all td.price{font-family:var(--mono);font-weight:500}
.faq{max-width:760px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;padding:14px 0;font-weight:500;font-size:15px;min-height:48px}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{margin-left:auto;transition:transform .15s;color:var(--muted);flex:none;width:16px;height:16px}
.faq details[open] summary svg{transform:rotate(90deg)}
.faq p{color:var(--ink2);font-size:15px;padding:0 0 16px}
.sk-dock{display:none}

/* ───────────────────────────────────────────────────────────── home */
.hm-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center;padding:36px 0 8px}
.hm-hero>*{min-width:0}
.hm-hero h1{font-size:clamp(34px,3.8vw,52px);margin:0 0 12px;max-width:13ch}
.hm-lede{font-size:17px;color:var(--ink2);max-width:44ch}
.hm-search{display:flex;align-items:center;gap:12px;margin-top:24px;height:56px;padding:0 6px 0 16px;border-radius:4px;border:1px solid var(--line2);background:var(--panel2);transition:border-color .15s,box-shadow .15s}
.hm-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.hm-search>svg{color:var(--muted);flex:none;width:20px;height:20px}
.hm-search input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--ink);font:400 17px var(--sans);outline:none}
.hm-search .btn{height:44px}
.hm-ex{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;align-items:center}
.hm-ex .l{font-size:13px;color:var(--muted);margin-right:2px}
.hm-ex .chip{font-family:var(--mono);font-size:13px}
.hm-stats{display:flex;gap:6px 18px;flex-wrap:wrap;margin-top:20px;font-size:13px;color:var(--muted);align-items:center}
.hm-stats b{font:500 13px var(--mono);color:var(--ink2)}
.hm-stats .live{display:inline-flex;align-items:center;gap:6px}
.hm-stats .live i{width:6px;height:6px;border-radius:50%;background:var(--good)}
.tick-up{color:var(--good)!important}.tick-down{color:var(--warn)!important}
.hm-mp{padding:16px 16px 12px}
.hm-mp-top{display:flex;align-items:flex-start;gap:12px}
.hm-mp-top>div:first-child{min-width:0}
.hm-mp-art{width:118px;height:84px;flex:none;margin-left:auto}
.hm-mp-l{font-size:13px;color:var(--ink2)}
.hm-mp-l a{color:var(--ink);font-weight:600}
.hm-mp-l .mono{color:var(--ink)}
.hm-mp-p{display:flex;align-items:center;gap:10px;margin-top:2px}
.hm-mp-p b{font:500 40px/1.05 var(--mono);color:var(--accent);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.hm-mp-s{font-size:13px;color:var(--muted);margin-top:2px}
.hm-mp .seg{margin:12px 0 4px}
.hm-plot{position:relative;margin:6px -4px 0;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:crosshair}
.hm-mp-f{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--muted);padding-top:2px}
.demo:not(.on){display:none}
.hm-fm{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.hm-fc{display:flex;flex-direction:column;gap:6px;padding:14px;color:var(--ink);text-decoration:none!important}
.hm-fc-h{display:flex;align-items:center;gap:10px;min-width:0}
.hm-fc-h .t{flex:1;min-width:0}
.hm-fc-h .t b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-fc-h .t>span{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.hm-fc-img{width:64px;height:46px;flex:none}
.hm-fc-m{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:13px;color:var(--muted)}
.hm-fc-m .prem{font-size:17px}
.spark{display:block;width:100%;height:64px}
.hm-sk{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none!important;min-width:0}
.hm-sk:hover b{color:var(--accent)}
.hm-sk .im{width:52px;height:38px;flex:none}
.hm-sk b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-clean{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.hm-clean i{display:inline-block;width:70px;height:6px;border-radius:3px;background:var(--line2);position:relative;overflow:hidden}
.hm-clean i s{position:absolute;left:0;top:0;bottom:0;background:var(--accent);border-radius:3px}
html.js .swp:not(.on){display:none}

/* ───────────────────────────────────────────────────────────── hubs */
.hb-sw{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:0 0 20px;overflow-x:auto;scrollbar-width:none}
.hb-sw a{padding:10px 4px;margin-right:16px;color:var(--ink2);font:500 15px var(--sans);text-decoration:none!important;border-bottom:2px solid transparent;margin-bottom:-1px;min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}
.hb-sw a:hover{color:var(--ink)}
.hb-sw a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--accent)}
.hb-tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.hb-tools .input{flex:1 1 260px;max-width:380px}
.hb-tools .select{width:auto;min-width:160px}
.hb-tools .lbl{font-size:14px;color:var(--muted)}
.hb-count{font-size:14px;color:var(--ink2);margin-left:auto}
.hb-count b{color:var(--ink);font-family:var(--mono);font-weight:500}
.hb-sec{margin-top:32px}
.hb-sec:first-child{margin-top:8px}
.hb-sec h2 small{font:500 13px var(--sans);color:var(--muted);margin-left:8px}
.hb-wts{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.hb-wt{display:flex;flex-direction:column;border:1px solid var(--line);border-left:4px solid var(--rc,var(--line));border-radius:var(--radius);background:var(--panel);overflow:hidden;color:var(--ink);text-decoration:none!important;transition:border-color .15s ease-out}
.hb-wt:hover{border-color:var(--accent-line);border-left-color:var(--rc);color:var(--ink)}
.hb-wt .art{display:flex;align-items:center;justify-content:center;aspect-ratio:16/10;padding:12px 16px 4px}
.hb-wt .b{padding:8px 12px 12px;display:flex;flex-direction:column;gap:2px}
.hb-wt .b b{font-size:16px;font-weight:600}
.hb-wt .b span{font-size:14px;color:var(--muted)}
.hb-colls{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.hb-coll{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow:hidden;color:var(--ink);text-decoration:none!important;transition:border-color .15s ease-out}
.hb-coll:hover{border-color:var(--accent-line);color:var(--ink)}
.hb-coll .art{position:relative;height:124px;background:var(--panel2)}
.hb-coll .art>.pic{position:absolute;width:52%;height:84%;top:8%}
.hb-coll .art>.pic:nth-child(1){left:24%;z-index:3}
.hb-coll .art>.pic:nth-child(2){left:2%;top:18%;opacity:.6;z-index:2;transform:scale(.85)}
.hb-coll .art>.pic:nth-child(3){right:2%;left:auto;top:18%;opacity:.6;z-index:1;transform:scale(.85)}
.hb-coll .b{padding:10px 12px 12px}
.hb-coll .b b{display:block;font-size:16px;font-weight:600}
.hb-coll .b small{font-size:14px;color:var(--muted)}
.hb-rbar{display:flex;height:6px;border-radius:3px;overflow:hidden;margin-top:8px;gap:1px}
.hb-rbar span{background:var(--rc)}
.hb-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:0 0 24px}
.hb-fact{padding:14px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);display:flex;flex-direction:column;gap:2px;min-width:0}
.hb-fact span{font-size:13px;color:var(--muted)}
.hb-fact b{font:500 20px var(--mono);color:var(--ink)}
.hb-fact a{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-tbl .nm{display:flex;align-items:center;gap:10px;color:var(--ink);min-width:220px}
.hb-tbl .nm .th{width:56px;height:42px;flex:none}
.hb-tbl .nm:hover{color:var(--accent)}
[data-gone]{display:none!important}
.hb-out[data-view="table"] .tiles{display:none}
.hb-out:not([data-view="table"]) .hb-tbl{display:none}

/* ───────────────────────────────────────────────────────────── explore */
.ex-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-bottom:14px;padding-bottom:2px}
.ex-tabs::-webkit-scrollbar{display:none}
.ex-tabs .chip{height:36px;padding:0 14px}
.ex-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.ex-bar .input{flex:1 1 240px;max-width:360px}
.ex-bar .select{width:auto;min-width:150px}
.ex-adv{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:end;padding:16px;margin:0 0 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.ex-pr{display:flex;gap:6px;align-items:center}
.ex-pr .input{min-width:0}
.ex-count{font-size:14px;color:var(--ink2);margin:0 0 12px}
.ex-count b{color:var(--ink);font-family:var(--mono);font-weight:500}
.ex-nm{display:flex;align-items:center;gap:10px;color:var(--ink);min-width:230px}
.ex-nm .th{width:56px;height:42px;flex:none}
.ex-nm:hover{color:var(--accent)}
.ex-exp{width:34px;height:34px;border-radius:3px;border:1px solid var(--line2);background:transparent;color:var(--ink2);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:transform .15s}
.ex-exp:hover{color:var(--ink);border-color:var(--accent-line)}
.ex-exp[aria-expanded="true"]{transform:rotate(90deg);color:var(--accent)}
.ex-exp svg{width:16px;height:16px}
.ex-tbl td.x{width:46px;padding-right:0}
.ex-tbl tr.open td{background:var(--raised)}
.ex-prev td{background:var(--panel2)!important;padding:16px}
.ex-pv{display:grid;grid-template-columns:160px minmax(0,1fr) minmax(0,1.1fr);gap:14px 18px;align-items:center}
.ex-pv>.btn{grid-column:1/-1;justify-self:start}
@media (max-width:900px){.ex-pv{grid-template-columns:1fr}}
.ex-pv .art{height:120px}
.ex-pv dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 18px;margin:0}
.ex-pv dt{font-size:12px;color:var(--muted)}
.ex-pv dd{margin:0;font:500 14px var(--mono)}
.ex-sc{position:relative;padding:12px 14px 8px}
.ex-sc svg{display:block;width:100%;height:auto;user-select:none;-webkit-user-select:none}
.ex-sc circle{cursor:pointer}
.ex-hov{position:absolute;z-index:6;pointer-events:none;width:250px;background:var(--raised);border:1px solid var(--line2);border-radius:4px;box-shadow:var(--shadow);padding:10px;display:none}
.ex-hov .art{height:92px}
.ex-hov b{display:block;font-size:13.5px;margin-top:4px}
.ex-hov .kv{display:flex;gap:12px;margin-top:6px;font:500 12.5px var(--mono);flex-wrap:wrap}
.ex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}

/* ───────────────────────────────────────────────────────────── stickers */
.st-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.st-card{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);min-width:0}
.st-card .art{height:110px;display:flex;align-items:center;justify-content:center}
.st-card .art img{max-height:100%;max-width:100%;object-fit:contain}
.st-badge{width:84px;height:84px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:700 20px var(--sans);letter-spacing:.01em;color:var(--c,var(--ink2));background:color-mix(in srgb,var(--c,var(--ink2)) 10%,var(--raised));border:1px solid color-mix(in srgb,var(--c,var(--ink2)) 40%,transparent)}
.st-card b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-card .m{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);min-width:0}
.st-card .m span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-card .p{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.st-card .p .price{font-size:16px}
.st-card .p small{font-size:12px;color:var(--muted)}
.st-fin{--c:var(--muted)}
.st-fin.holo{--c:#b68cff}.st-fin.foil{--c:#7fc4d9}.st-fin.gold{--c:var(--gold)}.st-fin.glitter{--c:#e27bc0}.st-fin.lenticular{--c:#6fd3a8}.st-fin.embroidered{--c:#d9a36f}.st-fin.champion{--c:var(--gold)}
html[data-theme="light"] .st-fin.holo{--c:#6b3fb8}html[data-theme="light"] .st-fin.foil{--c:#2a6f84}html[data-theme="light"] .st-fin.glitter{--c:#a0306f}html[data-theme="light"] .st-fin.lenticular{--c:#1f7a53}
.st-albums{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.st-album{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);color:var(--ink);text-align:left;cursor:pointer;font:inherit}
.st-album:hover{border-color:var(--accent-line)}
.st-album b{font-size:15px}
.st-album span{font-size:13px;color:var(--muted)}

/* ───────────────────────────────────────────────────────────── patterns */
.pt-look{display:grid;grid-template-columns:minmax(0,1fr) 140px auto;gap:12px;align-items:end;padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);margin-bottom:12px}
.pt-res{padding:12px 16px;border:1px solid var(--line);border-left:4px solid var(--gold);border-radius:var(--radius);background:var(--panel);margin-bottom:24px}
.pt-res b{font-size:15px}
.pt-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.pt-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow:hidden;color:var(--ink);text-decoration:none!important;transition:border-color .15s}
.pt-card:hover{border-color:var(--accent-line);color:var(--ink)}
.pt-card .art{aspect-ratio:4/3;padding:12px 16px;background:radial-gradient(80% 70% at 50% 60%,var(--gold-soft),transparent 70%),var(--panel2)}
.pt-card .b{padding:10px 12px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.pt-card .b b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pt-card .b span{font-size:13px;color:var(--muted)}
.tier-list{display:flex;flex-direction:column}
.tier-row{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px 24px;padding:20px 0;border-top:1px solid var(--line)}
.tier-row:first-child{border-top:0}
.rk{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:22px;padding:0 6px;border-radius:2px;font:600 12px var(--mono);color:var(--tc,var(--ink2));background:color-mix(in srgb,var(--tc,var(--ink2)) 15%,transparent);border:1px solid color-mix(in srgb,var(--tc,var(--ink2)) 45%,transparent)}
.tier-row h2{font:600 17px var(--sans);text-transform:none;letter-spacing:0;margin:8px 0 2px}
.tier-row .sub{font-size:13px;color:var(--muted)}
.tier-row .from{font-size:14px;margin-top:6px;color:var(--ink2)}
.seeds{display:flex;gap:6px;flex-wrap:wrap}
.seeds a,.seeds span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:30px;padding:0 8px;border-radius:15px;border:1px solid var(--line2);font:500 13px var(--mono);color:var(--ink2)}
.seeds a{text-decoration:none!important;transition:border-color .12s,background .12s}
.seeds a:hover{border-color:var(--muted);color:var(--ink)}
.seeds .hit{border-color:var(--gold);background:var(--gold-soft);color:var(--ink);box-shadow:0 0 0 1px var(--gold)}
.t-1{--tc:var(--gold)}.t-2{--tc:#c0c7d0}.t-3{--tc:#c58a52}.t-4{--tc:var(--ink2)}
html[data-theme="light"] .t-2{--tc:#5d6671}html[data-theme="light"] .t-3{--tc:#8a5424}
.tier-rungs{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.tier-rungs>span{display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:0 10px;border:1px solid var(--line);border-radius:3px;font:500 13px var(--mono);color:var(--ink2);background:var(--panel)}
.tier-rungs b{color:var(--ink);font-weight:500}

/* ───────────────────────────────────────────────────────────── written pages */
.prose{max-width:760px}
.prose .lede{font-size:18px;color:var(--ink2);margin:0 0 24px}
.prose h2{margin:32px 0 10px}
.prose p,.prose li{color:var(--ink2);font-size:16px}
.prose p+p{margin-top:12px}
.prose ul{padding-left:20px;display:flex;flex-direction:column;gap:6px}
.prose b{color:var(--ink)}
.prose-wide{max-width:none}
.kpis+h2,.prose .kpis{margin-bottom:28px}
.contact{max-width:560px;display:flex;flex-direction:column;gap:14px;padding:20px;margin:8px 0 16px}
.formmsg{font-size:14px;color:var(--muted)}
.formmsg.ok{color:var(--good)}.formmsg.bad{color:var(--bad)}
.cmd{font-family:var(--mono);color:var(--accent);white-space:nowrap}
.cmd small{color:var(--muted);font-size:13px;margin-left:6px}
.bot-cta{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0 28px}

/* ───────────────────────────────────────────────────────────── responsive */
@media (max-width:1180px){
  .nav a{padding:0 8px}
  .hdr{gap:10px}.hdr-guide span{display:none}.hdr-guide{padding:0 8px}.hdr-search{width:220px}
  .sk-main{grid-template-columns:minmax(0,1fr) 320px}.sk-ro-p b{font-size:38px}.sk-w{padding:12px}.sk-w-f{display:none}
  .hm-fm{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1020px){
  :root{--gut:24px}
  .nav{display:none}
  .only-phone{display:inline-flex!important}
  .hdr-search{max-width:none;width:auto;flex:1;margin-left:12px;min-width:0}
  .hdr .only-phone.search{display:none!important}
  .ftr-in{grid-template-columns:1fr 1fr}
  .sk-main{grid-template-columns:minmax(0,1fr)}.sk-rail{position:static}
  .sk-wr{grid-template-columns:repeat(3,minmax(0,1fr))}.sk-w:nth-child(4){border-left:0}.sk-w:nth-child(n+4){border-top:1px solid var(--line)}.sk-w-f{display:block}
  .hm-hero{grid-template-columns:1fr;gap:22px;padding-top:16px}
  .ex-adv{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ex-pv{grid-template-columns:140px minmax(0,1fr)}.ex-pv>:last-child{grid-column:1/-1}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  :root{--gut:16px;--hdr:56px}
  h1{font-size:2rem}
  .page{padding-top:16px;padding-bottom:48px}
  .hdr{gap:4px}
  .hdr-search{display:none}
  .hdr .only-phone.search{display:inline-flex!important}
  .hdr-guide{width:40px;height:40px;padding:0;justify-content:center;border-color:transparent}
  .ticker-lab{padding-left:16px}.ticker-lab em{display:none}.ticker-pause{padding:0 16px}.ticker-pause .l-play,.ticker-pause .l-pause{display:none!important}
  .btn{height:44px}.btn.sm{height:36px}.btn.icon{width:44px}
  .tabs>button,.tabs>a{height:44px}
  .seg>button,.seg>a{height:36px}
  .input,.select{height:44px;font-size:16px}
  .chip{height:32px}
  .ftr-in{gap:24px}
  .ftr-in>div:first-child{grid-column:1/-1}
  .modal-wrap{padding:0;align-items:flex-end}
  .modal{max-width:none;border-radius:10px 10px 0 0;max-height:90vh;overflow-y:auto;animation:sheetin .22s var(--ease);padding-bottom:env(safe-area-inset-bottom)}
  .pal-wrap{padding:0;align-items:stretch}
  .pal{max-width:none;max-height:none;height:100%;border-radius:0;border:0}
  .pal-in input{font-size:16px}
  #toasts{left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));max-width:none}
  .shelf{grid-auto-columns:64%;gap:12px;margin:0 calc(-1 * var(--gut));padding:2px var(--gut) 12px}
  .section{margin-top:40px}
  .gd-card{left:16px!important;right:16px;width:auto;bottom:calc(16px + env(safe-area-inset-bottom));top:auto!important}
  .tiles,.hb-wts,.ex-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .tile-art{padding:8px 10px 8px 14px}
  .tile-b{padding:10px 10px 10px 14px}
  .tile-n{font-size:14px}
  .tile-w{font-size:13px}
  /* skin page */
  .sk-pn{display:none}
  .sk-h1row h1{flex:1 1 calc(100% - 80px);min-width:0;font-size:1.9rem}
  .sk-thumb{display:block}
  .sk-ans{font-size:15px}.sk-ans .price{font-size:15px}
  .sk-top{margin-bottom:16px}
  .sk-tb{padding:6px}.sk-tb .btn{flex:1 1 auto}.sk-tb .sp{display:none}
  .dual>.c-full,.sk-plot>.c-full{display:none}.dual>.c-compact,.sk-plot>.c-compact{display:block}
  .sk-wr{display:flex;overflow-x:auto;scrollbar-width:none}.sk-wr::-webkit-scrollbar{display:none}
  .sk-w{flex:0 0 42%;border-top:0!important;border-left:1px solid var(--line)!important}.sk-w:first-child{border-left:0!important}
  .sk-ctl .sk-hint{display:none}.sk-legend{margin-left:0}
  .sk-ro{padding:16px}.sk-ro-p b{font-size:36px}.sk-ro-art{width:92px;height:66px}
  .sk-det{margin-top:40px}
  .sk-dock{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;align-items:center;gap:8px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--panel);border-top:1px solid var(--line2);transition:transform .2s var(--ease)}
  .sk-dock.away{transform:translateY(115%)}
  .sk-dock b{font:500 22px var(--mono);color:var(--accent);letter-spacing:-.03em}
  .sk-dock .m{display:flex;flex-direction:column;line-height:1.25;min-width:0;flex:1}
  .sk-dock .m span{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .has-dock .ftr{padding-bottom:76px}
  /* home */
  .hm-lede{font-size:15px}
  .hm-search{height:54px;padding-left:14px}.hm-search input{font-size:16px}
  .hm-fm{grid-template-columns:1fr}
  .hm-mp-p b{font-size:34px}.hm-mp-art{width:92px;height:66px}
  /* hubs, explore, stickers, patterns */
  .hb-count{margin-left:0;width:100%}
  .hb-tools .input{max-width:none;flex-basis:100%}.hb-tools .select{flex:1;min-width:0}
  .ex-bar .input{max-width:none;flex-basis:100%}.ex-bar .select{flex:1 1 40%;min-width:0}.ex-bar .ex-pr{flex:1 1 40%}.ex-bar .hb-count{margin-left:0}
  .ex-tbl td.x{display:none!important}
  .ex-adv{grid-template-columns:minmax(0,1fr);gap:12px}
  .ex-pv{grid-template-columns:minmax(0,1fr)}.ex-pv .art{height:100px}.ex-pv dl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .st-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .pt-look{grid-template-columns:minmax(0,1fr) 110px}.pt-look .btn{grid-column:1/-1}
  .pt-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .tier-row{grid-template-columns:1fr;gap:10px}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi b{font-size:22px}
  /* tables become cards */
  table.tbl-cards thead{display:none}
  table.tbl-cards,table.tbl-cards tbody,table.tbl-cards tr,table.tbl-cards td{display:block;width:100%}
  table.tbl-cards tr{padding:10px 12px;border-bottom:1px solid var(--line)}
  table.tbl-cards td{display:flex;justify-content:space-between;gap:12px;padding:4px 0;border:0;text-align:right!important}
  table.tbl-cards td[data-l]::before{content:attr(data-l);color:var(--muted);text-align:left;font-size:14px}
  table.tbl-cards td.main{display:block;text-align:left!important}
  table.tbl-cards tr.rar-row td:first-child{box-shadow:none}
  table.tbl-cards tr.rar-row{box-shadow:inset 4px 0 0 var(--rc,var(--line))}
  .tbl-wrap:has(.tbl-cards){overflow:visible}
  .sk-bt .tbl-wrap:has(.tbl-cards){max-height:none}
  .bt-all th:nth-child(2),.bt-all td:nth-child(2),.bt-all th:nth-child(4),.bt-all td:nth-child(4),.bt-all th:nth-child(5),.bt-all td:nth-child(5){display:none}
  .bt-all td,.bt-all th{padding:9px 8px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .ticker-run{animation:none!important}
}
@media print{.hdr,.ticker,.ftr,.sk-dock,.sk-tb{display:none!important}}
/* home demo: its compact chart is stretched on wide screens, so its labels are drawn smaller to land at ~13px */


/* ───────────────────────────────────────────── skin page: reading tools (insight.js) */
.sk-kn{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;margin:0 0 20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--line);overflow:hidden}
.sk-kn>div{background:var(--panel);padding:12px 16px;min-width:0}
.sk-kn dt{font:500 13px var(--sans);color:var(--muted)}
.sk-kn dd{margin:4px 0 0;font:500 22px/1.15 var(--mono);letter-spacing:-.02em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-kn dd.price{color:var(--accent)}.sk-kn dd.prem{color:var(--gold)}.sk-kn dd.spd-fast{color:var(--good)}.sk-kn dd.spd-mid{color:var(--warn)}.sk-kn dd.spd-slow{color:var(--bad)}
.sk-kn dd.s{margin-top:2px;font:400 13px var(--sans);letter-spacing:0;color:var(--ink2)}
.sk-ts{margin:0 0 20px;padding:14px 16px 16px;border:1px solid color-mix(in srgb,var(--gold) 35%,var(--line));border-radius:var(--radius);background:linear-gradient(180deg,var(--gold-soft),var(--panel) 70%)}
.sk-ts-h{display:flex;align-items:baseline;gap:6px 12px;flex-wrap:wrap;margin-bottom:12px}
.sk-ts-h h2{font-size:1.125rem}
.sk-ts-h>span{font-size:14px;color:var(--ink2)}
.sk-ts-h .more{margin-left:auto;background:none;border:0;padding:4px 0;color:var(--accent);font:500 14px var(--sans);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.sk-ts-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.sk-tsi{position:relative;display:flex;flex-direction:column;gap:4px;padding:10px 12px 14px;border:1px solid var(--line2);border-radius:4px;background:var(--panel);color:var(--ink);text-align:left;font:inherit;cursor:pointer;overflow:hidden;min-width:0}
.sk-tsi:hover,.sk-tsi:focus-visible{border-color:var(--gold)}
.sk-tsi .n{font-size:13px;font-weight:500;color:var(--ink2);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sk-tsi .p{display:flex;align-items:center;gap:8px}
.sk-tsi .p .price{font:500 20px var(--mono);letter-spacing:-.02em}
.sk-tsi .x{font-size:13px;color:var(--muted)}
.sk-tsi .x .prem{font:600 14px var(--mono)}
.sk-tsi i{position:absolute;left:0;bottom:0;height:3px;background:var(--gold);opacity:.85}
.sk-tsi.t-1 i{opacity:1}.sk-tsi.t-3 i,.sk-tsi.t-4 i{opacity:.6}
.sk-tier.flash{animation:skFlash 1.6s var(--ease)}
@keyframes skFlash{0%,40%{box-shadow:0 0 0 2px var(--gold)}100%{box-shadow:0 0 0 0 transparent}}
.sk-w-t{font:400 12px var(--mono);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-w-t .cheaper,.sk-w-t .pricier{font-size:12px}
/* layers drawn over the price chart */
.ov .ovt{font:500 12px var(--mono);fill:var(--ink2);paint-order:stroke;stroke:var(--plot-bg);stroke-width:4px}
.ov .ovt.gold{fill:var(--gold)}
.tierdot{fill:var(--tc,var(--gold));stroke:var(--plot-bg);stroke-width:1.6}
.tierdot.off{fill:var(--plot-bg);stroke:var(--tc,var(--gold));stroke-width:2}
.tier-key{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px;font-size:13px;color:var(--ink2)}
.tier-key>span{display:inline-flex;align-items:center;gap:6px}
.tier-key i{width:10px;height:10px;transform:rotate(45deg);background:var(--tc,var(--gold));flex:none}
.tier-key b{font:500 13px var(--mono);color:var(--ink)}
.sk-plot.on-tier .sk-tip{opacity:0!important}
/* the one tooltip */
.viztip{position:fixed;z-index:60;max-width:300px;padding:10px 12px;background:var(--raised);border:1px solid var(--line2);border-radius:4px;box-shadow:var(--shadow);font-size:13px;line-height:1.45;color:var(--ink2);pointer-events:none}
.viztip .vt1{display:flex;align-items:center;gap:8px;font:500 12px var(--mono);color:var(--ink2)}
.viztip .vt2{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:4px 0}
.viztip .vt-p{font:500 18px var(--mono);color:var(--accent);letter-spacing:-.02em}
.viztip .vt-p.gold,.viztip .vt-gold{color:var(--gold)}
.viztip .vt3{display:flex;flex-direction:column;gap:2px;padding-top:6px;border-top:1px solid var(--line);color:var(--muted)}
.viztip .vt-hint{margin-top:6px;font-size:12px;color:var(--muted)}
.viztip .vt-go{display:inline-flex;align-items:center;min-height:40px;margin-top:8px;padding:0 12px;border-radius:3px;background:var(--accent);color:var(--accent-ink);font-weight:600;text-decoration:none;pointer-events:auto}
@media (hover:none){.viztip{pointer-events:auto}}
/* at a glance */
.sk-gl{margin-top:40px}
.sk-gl-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sk-gl .gl{padding:16px}
.sk-gl .gl.wide{grid-column:1/-1}
.sk-gl h3{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:12px}
.heat-zones{position:relative;height:24px}
.heat-zones span{position:absolute;top:0;display:flex;align-items:center;padding:0 0 2px 4px;background:none!important;border-bottom:3px solid var(--w-c,var(--line2));height:22px;overflow:hidden}
.heat-zones span+span{border-left:1px solid var(--line2)}
.heat-zones .w-fn{--w-c:var(--fn)}.heat-zones .w-mw{--w-c:var(--mw)}.heat-zones .w-ft{--w-c:var(--ft)}.heat-zones .w-ww{--w-c:var(--ww)}.heat-zones .w-bs{--w-c:var(--bs)}
.heat-wrap{position:relative}
.heat{display:block;width:100%;height:64px}
.heat .hc{fill:color-mix(in oklab,var(--line2) calc(var(--t) * 200%),var(--accent));cursor:pointer}
.heat .hc[style*="--t:0.5"],.heat .hc[style*="--t:0.6"],.heat .hc[style*="--t:0.7"],.heat .hc[style*="--t:0.8"],.heat .hc[style*="--t:0.9"],.heat .hc[style*="--t:1"]{fill:color-mix(in oklab,var(--gold) calc((var(--t) - .5) * 200%),var(--line2))}
.heat .hc:hover{stroke:var(--ink);stroke-width:2;vector-effect:non-scaling-stroke}
.heat .hc.old{opacity:.55}.heat .hc.est{opacity:.3}
.heat .hf{fill:var(--accent)}
.heat-mark{position:absolute;top:-6px;width:2px;height:58px;margin-left:-1px;background:var(--ink);border-radius:1px;pointer-events:none;transition:left .12s var(--ease)}
.heat-mark::before{content:"";position:absolute;top:-2px;left:-4px;border:5px solid transparent;border-top-color:var(--ink)}
.heat-lg{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;margin-top:10px;font-size:13px;color:var(--muted)}
.heat-ramp{display:inline-flex;align-items:center;gap:8px}
.heat-ramp i{display:inline-block;width:96px;height:8px;border-radius:4px;background:linear-gradient(90deg,var(--accent),var(--line2),var(--gold))}
.heat-fr{display:inline-flex;align-items:center;gap:8px}
.heat-fr b{display:inline-block;width:24px;height:5px;border-radius:2px;background:var(--accent)}
.hb{display:flex;flex-direction:column;gap:6px}
.hb-r{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:32px;padding:2px 0;border:0;background:none;color:var(--ink);font:inherit;text-align:left;cursor:default}
button.hb-r{cursor:pointer}
button.hb-r:hover .hb-t{background:var(--hover)}
.hb-t{position:relative;height:14px;border-radius:7px;background:var(--panel2);border:1px solid var(--line)}
.hb-t i{position:absolute;top:-1px;bottom:-1px;border-radius:7px;background:var(--w-c,var(--accent));min-width:8px}
.hb-t i.w-fn{--w-c:var(--fn)}.hb-t i.w-mw{--w-c:var(--mw)}.hb-t i.w-ft{--w-c:var(--ft)}.hb-t i.w-ww{--w-c:var(--ww)}.hb-t i.w-bs{--w-c:var(--bs)}
.hb-t i.spd-fast{background:var(--good)}.hb-t i.spd-mid{background:var(--warn)}.hb-t i.spd-slow{background:var(--bad)}.hb-t i.old{opacity:.5}
.hb-t em,.hb-k em{position:absolute;top:-5px;width:3px;height:22px;margin-left:-1px;border-radius:2px;background:var(--ink)}
.hb-v{font:500 14px var(--mono);white-space:nowrap;text-align:right}
.hb-ax{display:flex;justify-content:space-between;gap:8px;margin:8px 0 0 42px;font:400 12px var(--mono);color:var(--muted)}
.hb-k{position:relative;display:inline-flex;align-items:center;gap:8px;font-family:var(--sans)}
.hb-k em{position:relative;top:0;height:12px}
.sup-big b{display:block;font:500 28px/1.1 var(--mono);color:var(--ink);letter-spacing:-.02em}
.sup-big span{font-size:13px;color:var(--muted)}
.sup-bar{display:flex;height:14px;margin:14px 0 10px;border-radius:7px;overflow:hidden;gap:2px}
.sup-bar span{min-width:3px}
.sup-bar .w-fn{background:var(--fn)}.sup-bar .w-mw{background:var(--mw)}.sup-bar .w-ft{background:var(--ft)}.sup-bar .w-ww{background:var(--ww)}.sup-bar .w-bs{background:var(--bs)}
.sup-lg{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px}
.sup-lg>span{display:inline-flex;align-items:center;gap:6px}
.sup-lg b{font:500 14px var(--mono)}
/* history */
.hist-wrap.hx .hist-svg{display:none!important}
.hx-plot{min-height:220px}
.hx-svg{display:block;width:100%;height:auto;touch-action:pan-y}
.hx-ax{font:400 12px var(--mono);fill:var(--muted)}
.hx-lg{display:flex;flex-wrap:wrap;gap:6px 20px;padding:4px 4px 10px;font-size:14px}
.hx-k{display:inline-flex;align-items:center;gap:6px}
.hx-k b{font:500 15px var(--mono)}
.hx-rg{margin-left:auto}
.hx-rg button{height:30px;padding:0 10px}
/* similar skins */
.sk-sim{margin-top:40px}
.sk-sim-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.sk-sim-tabs .chip{height:36px;padding:0 12px;font-size:14px}
html.js .sk-sim-p:not(.on){display:none}
html:not(.js) .sk-sim-p+.sk-sim-p{margin-top:16px}
@media (max-width:1020px){.sk-gl-grid{grid-template-columns:1fr 1fr}}
@media (max-width:720px){
  .sk-kn{grid-template-columns:1fr 1fr}
  .sk-kn>div{padding:10px 12px}
  .sk-kn dd{font-size:18px}
  .sk-ts-row{grid-template-columns:1fr 1fr}
  .sk-gl-grid{grid-template-columns:1fr}
  .hx-rg{margin-left:0}
  .viztip{max-width:calc(100vw - 16px)}
}
@media (prefers-reduced-motion:reduce){.sk-tier.flash{animation:none}.heat-mark{transition:none}}
.fs-ticks span.clash{visibility:hidden}
/* ───────────────────────────────────────────── the seed inspector (pattern pages) */
.si{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:0;margin-bottom:12px;overflow:hidden}
.si-art{display:flex;align-items:center;justify-content:center;padding:24px;background:var(--panel2);border-right:1px solid var(--line)}
.si-art .pic{width:100%;aspect-ratio:4/3}
.si-b{padding:20px 24px;min-width:0}
.si-b h2{font-size:1.125rem;margin-bottom:12px}
.si-step{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.si-step .input{width:120px;height:48px;font:500 22px var(--mono);text-align:center}
.si-step .btn.icon{width:48px;height:48px;padding:0}
.si-step [data-step="-1"] svg{transform:rotate(180deg)}
.si-help{margin-top:8px;font-size:13px;color:var(--muted)}
.si-res{margin-top:16px;padding-top:16px;border-top:1px solid var(--line);min-height:120px}
.si-seed{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.si-n{font:500 44px/1 var(--mono);letter-spacing:-.03em;color:var(--ink)}
.si-tier{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:15px;border:1px solid color-mix(in srgb,var(--tc,var(--muted)) 55%,transparent);background:color-mix(in srgb,var(--tc,var(--muted)) 14%,transparent);font:600 14px var(--sans);color:var(--ink)}
.si-tier i{width:10px;height:10px;border-radius:50%;background:var(--tc,var(--muted))}
.si-tier.plain{--tc:var(--muted)}
.si-line{margin-top:10px;font-size:15px;color:var(--ink2)}
.si-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:12px}
.si-price>span:first-child{font-size:14px;color:var(--ink2)}
.si-price .price{font:500 28px var(--mono);letter-spacing:-.02em}
.si-price .prem{font:600 14px var(--mono)}
.si-x{font-size:14px;color:var(--ink2)}
.si-rungs{max-width:560px}
.si-rungs li.me{background:var(--gold-soft);margin:0 -8px;padding:6px 8px 4px;border-radius:3px}
.si-nav{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.si-err{color:var(--bad)}
@media (max-width:720px){.si{grid-template-columns:1fr}.si-art{border-right:0;border-bottom:1px solid var(--line);padding:16px}.si-art .pic{max-width:190px}.si-b{padding:16px}.si-n{font-size:36px}}
.sk-sim .shelf{grid-auto-columns:minmax(200px,232px)}
/* two price scales for skins with pattern tiers: the curve alone, or the curve plus every tier price */
.sk-plot:not(.sc-tiers)>svg[data-scale="tiers"],.sk-plot.sc-tiers>svg[data-scale="curve"]{display:none!important}
.sk-scale{padding:2px}
.sk-scale button{height:28px;padding:0 10px;font-size:13px}
.rdot{fill:var(--accent);stroke:var(--plot-bg);stroke-width:1.2}
.chart-svg .rdot{r:calc(3px * var(--k,1))}.chart-svg.c-compact .rdot{r:calc(2.6px * var(--k,1))}
.rdot.old{fill:var(--plot-bg);stroke:var(--accent);stroke-width:1.3;opacity:.8}
.rdot.est{fill:none;stroke:var(--muted);stroke-width:1.2;stroke-dasharray:2 1.6}

/* ───────────────────────────────────────────────────────────── Inspect (skin, pattern and Float lab pages) */
.ins{margin-top:32px;scroll-margin-top:calc(var(--hdr) + 12px)}
.ins-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px 16px;flex-wrap:wrap;margin-bottom:14px}
.ins-head .sub{color:var(--muted);font-size:14px;margin-top:4px;max-width:72ch}
.ins-links{display:flex;gap:8px;flex-wrap:wrap}
.ins-b{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr);gap:16px;align-items:start}
.ins-b.solo{grid-template-columns:minmax(0,820px)}
.ins-stage{position:relative;margin:0;padding:12px 12px 10px;display:flex;flex-direction:column;gap:8px}
.ins-stage:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ins-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:32px}
.ins-badge{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;color:var(--ink2)}
.ins-badge b{color:var(--ink);font-size:15px}
.ins-img{position:relative;aspect-ratio:4/3;max-height:460px;display:flex;align-items:center;justify-content:center;background:radial-gradient(70% 60% at 50% 55%,var(--accent-soft),transparent 72%),var(--panel2);border-radius:3px;overflow:hidden;cursor:zoom-in;touch-action:pan-y}
.ins-img .pic{width:100%;height:100%;padding:4%}
.ins-img .pic.ph b{font:500 56px var(--mono);color:var(--muted)}
.ins-img .pic.ph::after{display:none}
.ins-cap{font-size:13px;color:var(--muted);min-height:20px}
.ins-cap .link-btn{margin-left:4px}
.ins-sides{align-self:flex-start}
.ins-tier{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 10px;border-radius:13px;border:1px solid color-mix(in srgb,var(--tc,var(--muted)) 60%,transparent);background:color-mix(in srgb,var(--tc,var(--muted)) 16%,transparent);font:600 12.5px/1 var(--sans);color:var(--ink);white-space:nowrap;-webkit-font-smoothing:antialiased}
.ins-tier i{width:9px;height:9px;border-radius:50%;background:var(--tc,var(--muted));flex:none}
.ins-tier.plain{--tc:var(--muted)}
.ins-ctl{padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);display:flex;flex-direction:column;gap:14px;min-width:0}
.ins-lab{display:block;font-size:14px;font-weight:600;color:var(--ink);margin-bottom:8px}
.ins-lab .muted{font-weight:400;font-size:13px;margin-left:6px}
.ins-seedrow{display:flex;align-items:center;gap:8px}
.ins-seedrow .input{width:112px;height:48px;font:500 22px var(--mono);text-align:center;padding:0 8px}
.ins-seedrow .input.err{border-color:var(--bad);box-shadow:0 0 0 1px var(--bad)}
.ins-seedrow .btn.icon{width:48px;height:48px;padding:0}
.ins-seedrow [data-ins-step="-1"] svg{transform:rotate(180deg)}
.ins-range{width:100%;margin:12px 0 0;accent-color:var(--accent);height:28px;cursor:pointer}
.ins-help{margin-top:4px;font-size:13px;color:var(--muted)}
.ins-res{padding-top:14px;border-top:1px solid var(--line);min-height:96px}
.ins-rt{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px}
.ins-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:10px}
.ins-price>span:first-child{font-size:14px;color:var(--ink2)}
.ins-price .price{font:500 28px var(--mono);letter-spacing:-.02em}
.ins-x{font-size:14px;color:var(--ink2)}.ins-x .prem{font:600 14px var(--mono)}
.ins-line{margin-top:10px;font-size:15px;color:var(--ink2)}
.ins-rungs li.me{background:var(--gold-soft);margin:0 -8px;padding:6px 8px 4px;border-radius:3px}
.ins-rungs li.at{background:var(--accent-soft);margin:0 -8px;padding:6px 8px 4px;border-radius:3px}
.ins-list{grid-column:1/-1;padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);min-width:0}
.ins-lh{display:flex;align-items:baseline;gap:8px 12px;flex-wrap:wrap}
.ins-lh h3{font-size:16px}
.ins-lh .muted{font-size:13.5px}
.ins-chips{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 16px}
.ins-chip{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:6px 12px 6px 10px;border:1px solid var(--line2);border-radius:6px;background:var(--panel2);color:var(--ink);text-align:left;font:inherit;cursor:pointer;text-decoration:none!important;transition:border-color .15s,background .15s}
.ins-chip:hover{border-color:color-mix(in srgb,var(--tc,var(--muted)) 70%,transparent);color:var(--ink)}
.ins-chip i{width:10px;height:10px;border-radius:50%;background:var(--tc,var(--muted));flex:none}
.ins-chip span{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.ins-chip b{font-size:13.5px;font-weight:600;white-space:nowrap}
.ins-chip small{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}
.ins-chip em{font:500 12.5px var(--mono);font-style:normal;color:var(--muted);margin-left:2px}
.ins-chip[aria-pressed="true"]{border-color:var(--tc,var(--accent));background:color-mix(in srgb,var(--tc,var(--accent)) 18%,var(--panel2));box-shadow:inset 0 0 0 1px var(--tc,var(--accent))}
.ins-chip[aria-pressed="true"] em{color:var(--ink)}
.ins-sh{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin-bottom:12px}
.ins-sh h4{font-size:15px}
.ins-sh .muted{font-size:13.5px}
.ins-from{margin-left:auto;font-size:14px;color:var(--ink2)}
.ins-film{display:flex;flex-wrap:wrap;gap:8px}
.ins-film.pics{margin-bottom:12px}
.ins-card{position:relative;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;width:66px;height:58px;border:1px solid var(--line2);border-left:3px solid var(--tc,var(--gold));border-radius:6px;background:var(--panel2);color:var(--ink);text-decoration:none!important;font:inherit;cursor:pointer;transition:border-color .12s,background .12s,transform .12s}
.ins-card b{font:500 16px var(--mono);font-variant-numeric:tabular-nums}
.ins-card span{font-size:11.5px;color:var(--muted)}
.ins-card:hover{border-color:var(--muted);border-left-color:var(--tc,var(--gold));color:var(--ink);transform:translateY(-1px)}
.ins-card.on{background:var(--accent-soft);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.ins-card.on span{color:var(--ink2)}
.ins-card.pic-card{width:188px;height:auto;padding:6px 6px 8px;gap:6px}
.ins-card.pic-card .pic{aspect-ratio:4/3;background:var(--panel)}
.ins-card.pic-card span{font-size:13px;color:var(--ink2)}
.ins-card.pic-card span b{font-size:14px}
.ins-card.more{width:auto;padding:0 14px;flex-direction:row;gap:6px;font-size:13px;font-weight:600;color:var(--ink2);border-left-color:var(--line2)}
.ins-card.more span{font-size:12px}
.ins-set{--tc:var(--gold)}
.skel{display:block;border-radius:4px;background:linear-gradient(90deg,var(--panel2),var(--raised),var(--panel2));background-size:200% 100%;animation:skel 1.2s linear infinite}
.tb-skel{width:100%;height:58px}
@keyframes skel{from{background-position:200% 0}to{background-position:0 0}}
@media (max-width:900px){.ins-b{grid-template-columns:1fr}.ins-img{max-height:none}}
@media (max-width:720px){.ins-card{width:58px;height:52px}.ins-card.pic-card{width:calc(50% - 4px)}.ins-chip small{max-width:120px}.ins-price .price{font-size:24px}}

/* zoom viewer: fit first, never past the picture's own pixels */
.zv{position:fixed;inset:0;z-index:210;display:grid;grid-template-rows:auto 1fr auto;background:color-mix(in srgb,var(--bg) 96%,transparent);animation:popin .15s var(--ease)}
.zv-bar{display:flex;align-items:center;gap:8px;padding:10px 16px;padding-top:max(10px,env(safe-area-inset-top));border-bottom:1px solid var(--line);background:var(--panel)}
.zv-t{font-size:15px;display:flex;align-items:center;gap:8px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zv-max{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:11px;font:600 12px/1 var(--sans);color:var(--gold);background:var(--gold-soft);border:1px solid color-mix(in srgb,var(--gold) 50%,transparent);white-space:nowrap}
.zv-bar .sp{flex:1}
.zv-bar .btn.icon{font-size:18px;font-weight:500}
.zv-stage{position:relative;overflow:hidden;touch-action:none;cursor:grab;background:radial-gradient(60% 60% at 50% 50%,var(--accent-soft),transparent 70%)}
.zv-stage:active{cursor:grabbing}
.zv-stage img{position:absolute;left:0;top:0;max-width:none;transform-origin:0 0;user-select:none;-webkit-user-drag:none}
.zv-hint{margin:0;padding:8px 16px;padding-bottom:max(8px,env(safe-area-inset-bottom));font-size:13px;color:var(--muted);text-align:center;border-top:1px solid var(--line);background:var(--panel)}

/* ───────────────────────────────────────────────────────────── Patterns hub: lookup, tier browser, families */
.pl{padding:16px 20px;margin-bottom:8px}
.pl-h{display:flex;align-items:baseline;gap:8px 14px;flex-wrap:wrap;margin-bottom:12px}
.pl-h h2{font-size:17px}
.pl-h .muted{font-size:13.5px}
.pl-form{display:grid;grid-template-columns:minmax(0,1fr) 150px auto;gap:12px;align-items:end}
.pl-seed .input{font:500 17px var(--mono)}
.pl-res{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);min-height:56px;display:flex;flex-direction:column;gap:12px}
.pl-r{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pl-n{font:500 40px/1 var(--mono);color:var(--ink);letter-spacing:-.03em}
.pl-t{display:flex;flex-direction:column;align-items:flex-start;gap:6px;font-size:14px}
.tb-bar{display:flex;gap:10px 12px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.tb-bar .input{flex:1 1 240px;max-width:380px}
.tb-grid{display:grid;grid-template-columns:340px minmax(0,1fr);gap:16px;align-items:start}
.tb-list{max-height:680px;overflow:auto;padding:4px 6px 8px;overscroll-behavior:contain;scrollbar-width:thin}
.tb-grp h3{position:sticky;top:0;z-index:1;margin:0;padding:10px 8px 6px;font-size:13px;font-weight:600;color:var(--muted);background:var(--panel)}
.tb-it{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;align-items:center;padding:6px 8px;border-radius:6px;color:var(--ink);text-decoration:none!important;transition:background .12s}
.tb-it:hover{background:var(--raised);color:var(--ink)}
.tb-it[aria-current]{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
.tb-it .th{width:64px;height:48px}
.tb-it .tx{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.tb-it .tx b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-it .tx small{font-size:12.5px;color:var(--muted)}
.tb-detail{padding:16px 20px;min-height:320px;min-width:0}
.tbd-h{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;align-items:center}
.tbd-h .art{aspect-ratio:4/3;padding:8px;border-radius:3px;background:radial-gradient(80% 70% at 50% 60%,var(--gold-soft),transparent 70%),var(--panel2)}
.tbd-h h3{font-size:19px;margin-bottom:4px}
.tbd-h .muted{font-size:14px;margin-bottom:10px}
.fam-tabs{margin-bottom:12px}
.fam-tabs>button{gap:6px}
.fam-p{display:none}.fam-p.on{display:block}
html:not(.js) .fam-p{display:block;margin-bottom:24px}
.fam-sub{font-size:14px;margin:0 0 14px}
.fam-g{display:flex;align-items:baseline;gap:8px;font-size:16px;margin:0 0 12px}
.fam-g small{font:500 13px var(--sans);color:var(--muted)}
.pth .hb-sec{margin-top:24px}.pth .fam-p>.hb-sec:first-of-type{margin-top:4px}
@media (max-width:1020px){.tb-grid{grid-template-columns:1fr}.tb-list{max-height:320px}}
@media (max-width:720px){.pl-form{grid-template-columns:1fr 1fr}.pl-form .field:first-child{grid-column:1/-1}.tbd-h{grid-template-columns:120px minmax(0,1fr)}.tb-detail{padding:14px}.pl{padding:14px}}

/* pattern pages */
.pt-page .ins{margin-top:4px}
.pt-note{margin:16px 0 20px}
.tier-mult{display:grid;grid-template-columns:120px auto;align-items:center;gap:8px;margin-top:10px}
.tier-mult i{display:block;height:6px;border-radius:3px;background:var(--tc,var(--gold));box-shadow:0 0 0 1px color-mix(in srgb,var(--tc,var(--gold)) 40%,transparent)}
.tier-mult b{font:600 14px var(--mono)}
.seeds a.shot{border-color:var(--accent-line)}
.seeds a.shot::after{content:"";width:5px;height:5px;margin-left:5px;border-radius:50%;background:var(--accent)}
.tier-rungs a.muted{font-size:12.5px;text-decoration:none}.tier-rungs a.muted:hover{color:var(--ink);text-decoration:underline}
.pt-det{margin-top:16px;overflow:hidden}
.pt-det>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;cursor:pointer;list-style:none;min-height:56px}
.pt-det>summary::-webkit-details-marker{display:none}
.pt-det>summary span{display:flex;flex-direction:column;gap:2px}
.pt-det>summary b{font-size:15px}
.pt-det>summary small{font-size:13px;color:var(--muted)}
.pt-det>summary svg{transform:rotate(90deg);transition:transform .15s;flex:none;color:var(--muted)}
.pt-det[open]>summary svg{transform:rotate(-90deg)}
.pt-det>summary:hover b{color:var(--accent)}
.pt-lbf{padding:0 16px}
.pt-det>.note{padding:0 16px 16px}
.pt-cards.more{padding:0 16px 16px}
.lbf-k{display:inline-flex;align-items:center;gap:6px}
.lbf-k svg path{stroke-width:1.2}

/* ───────────────────────────────────────────────────────────── Compare tab */
.cmp-bar{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap}
.cmp-find{position:relative;flex:1 1 320px;max-width:520px}
.cmp-find>svg{position:absolute;left:12px;top:12px;width:16px;height:16px;color:var(--muted);pointer-events:none}
.cmp-find .input{padding-left:36px}
.cmp-max{font-size:13px}
.cmp-list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:30;max-height:360px;overflow:auto;padding:4px;border:1px solid var(--line2);border-radius:var(--radius);background:var(--raised);box-shadow:var(--shadow)}
.cmp-opt{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;padding:6px 8px;border:0;border-radius:4px;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer;min-height:48px}
.cmp-opt .th{width:56px;height:42px}
.cmp-opt b{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-opt[aria-selected="true"],.cmp-opt:hover{background:var(--hover)}
.cmp-sugg{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0 4px}
.cmp-sugg>.muted{font-size:13px;margin-right:2px}
.cmp-on{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.cmp-on:empty{display:none}
.cmp-tag{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 4px 0 10px;border-radius:16px;border:1px solid color-mix(in srgb,var(--cc) 60%,transparent);background:color-mix(in srgb,var(--cc) 14%,transparent);font-size:13px;font-weight:600;color:var(--ink)}
.cmp-tag i{width:10px;height:10px;border-radius:50%;background:var(--cc)}
.cmp-tag button{width:26px;height:26px;border:0;border-radius:50%;background:transparent;color:var(--ink2);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.cmp-tag button:hover{background:var(--raised);color:var(--ink)}
.cmp-tag button svg{width:14px;height:14px}
.cmp-plot{padding:12px}
.cmp-plot .empty{border:0}
.cmp-tbl{margin-top:12px}
.cmp-tbl td i{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--cc);margin-right:8px;vertical-align:middle}

:root{--cmp1:#B99BF2;--cmp2:#F07FC4;--cmp3:#DCE5E8}
html[data-theme="light"]{--cmp1:#6A42BF;--cmp2:#B0296F;--cmp3:#2E3836}
.cmp-dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}
.viztip .cmp-n{flex:1;min-width:0;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink2)}
.cmp-tbl td.main i{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--cc);margin-right:8px;vertical-align:middle}

/* ───────────────────────────────────────────────────────────── Float lab */
.lab-h{align-items:center}
.lab-jump{display:flex;align-items:center;gap:10px}
.lab-jump .muted{font-size:13px}
.lab-jump .seg>button{padding:0 8px}
.lab-jump .seg>button[disabled]{opacity:.35;cursor:not-allowed}
.lab-top{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,1fr);gap:16px;align-items:start}
.lab-stage .ins{margin-top:0}
.lab-ro{padding:18px;display:flex;flex-direction:column;gap:12px;position:sticky;top:calc(var(--hdr) + 12px)}
.lab-in{display:grid;grid-template-columns:1.4fr 1fr;gap:12px}
.lab-in .input{height:48px;font:500 20px var(--mono);text-align:center}
.lab-in .input.err{border-color:var(--bad);box-shadow:0 0 0 1px var(--bad)}
.lab-in .field>label{font-weight:600;color:var(--ink)}
.lab-in .field>label .muted{font-weight:400;font-size:12.5px;margin-left:4px}
.lab-err{font-size:12.5px;color:var(--bad);min-height:0}
.lab-err:empty{display:none}
.lab-rng{position:relative;padding-bottom:10px}
.lab-rng input{width:100%;accent-color:var(--accent);height:28px;margin:0;cursor:pointer}
.lab-zones{position:absolute;left:8px;right:8px;bottom:2px;height:4px;border-radius:2px;overflow:hidden;background:var(--line)}
.lab-zones span{position:absolute;top:0;bottom:0}
.lab-zones .w-fn{background:var(--fn)}.lab-zones .w-mw{background:var(--mw)}.lab-zones .w-ft{background:var(--ft)}.lab-zones .w-ww{background:var(--ww)}.lab-zones .w-bs{background:var(--bs)}
.lab-st{align-self:flex-start}
.lab-p{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:6px;border-top:1px solid var(--line)}
.lab-p>b{font:500 46px/1.05 var(--mono);color:var(--accent);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.lab-tags{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.lab-what{font-size:14px;color:var(--ink2);margin-top:-4px}
.lab-rows{margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.lab-rows>div{padding:10px 12px;border-left:1px solid var(--line);min-width:0}
.lab-rows>div:first-child{border-left:0}
.lab-rows dt{font-size:13px;color:var(--muted)}
.lab-rows dd{margin:4px 0 0;font:500 17px var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lab-rows dd .spd{font:500 14px var(--sans)}
.lab-rows dd .pill{font-size:11.5px;vertical-align:middle}
.lab-hint{font-size:13.5px;color:var(--ink2)}
.lab-hint:empty{display:none}
.lab-mks{margin-top:2px}
.lab-open{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;align-self:flex-start}
.lab-chart{margin-top:16px;padding:14px 14px 8px}
.lab-ch-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.lab-ch-h h2{font-size:18px}
.lab-ch-h .muted{font-size:13px;margin-top:2px}
.lab-plot{position:relative;padding:4px 4px 0;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize;border-radius:4px}
.lab-plot:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.lab-plot>.lab-v>.c-compact{display:none}
.lab-plot.no-pl circle[fill="var(--gold)"]{display:none}
.lbt{font:500 12px var(--mono);fill:var(--ink2)}.lbt.p{fill:var(--accent)}.lbt.g{fill:var(--gold)}.lbt.m{fill:var(--muted)}
.lab-more{margin-top:24px}
.lab-more .tabpanel{padding-top:16px}
.lab-bw{display:flex;align-items:flex-end;gap:4px;height:200px;padding:24px 0 0;overflow-x:auto;scrollbar-width:thin}
.lab-bar{position:relative;flex:1 0 44px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;border:0;background:none;padding:0;cursor:pointer;color:var(--muted);font:500 12px var(--mono)}
.lab-bar i{display:block;width:100%;border-radius:3px 3px 0 0;background:var(--accent-soft);border:1px solid var(--accent-line);border-bottom:0;transition:background .12s}
.lab-bar:hover i{background:color-mix(in srgb,var(--accent) 35%,var(--accent-soft))}
.lab-bar.old i{background:transparent;border-style:dashed}
.lab-bar.on i{background:var(--accent);border-color:var(--accent)}
.lab-bar b{position:absolute;top:-2px;font:500 13px var(--mono);color:var(--accent);white-space:nowrap}
.lab-bar span{flex:none}
.lab-tiers{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--panel)}
.lab-tr{display:grid;grid-template-columns:minmax(160px,1.3fr) 90px minmax(160px,1.2fr) minmax(120px,.8fr);gap:12px;align-items:center;padding:10px 14px;border:0;border-top:1px solid var(--line);background:none;color:var(--ink);text-align:left;font:inherit;cursor:pointer;min-height:52px}
.lab-tr:first-child{border-top:0}
.lab-tr:hover{background:var(--raised)}
.lab-tr.on{background:color-mix(in srgb,var(--tc,var(--gold)) 12%,transparent);box-shadow:inset 3px 0 0 var(--tc,var(--gold))}
.lab-tr .n{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}
.lab-tr .n i{width:10px;height:10px;border-radius:50%;background:var(--tc,var(--gold));flex:none}
.lab-tr .n b{font-size:14px}
.lab-tr .n small{font-size:12.5px;color:var(--muted);flex-basis:100%;padding-left:18px}
.lab-tr .c{font-size:13px}
.lab-tr .m{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.lab-mb{height:8px;border-radius:4px;background:var(--panel2);border:1px solid var(--line);overflow:hidden}
.lab-mb i{display:block;height:100%;background:var(--tc,var(--gold))}
.lab-tr .f{font-size:13.5px;color:var(--ink2);text-align:right}
.lab-look{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;max-width:420px}
.lab-look .field{flex:1}
.lab-lres{margin-top:14px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.lab-try{margin-top:12px}
.lab-det{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:0}
.lab-det>div{padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.lab-det dt{font-size:13px;color:var(--muted)}
.lab-det dd{margin:4px 0 0;font-size:15px}
.labi-find{position:relative;max-width:640px;margin-bottom:8px}
.labi-in{position:relative}
.labi-in>svg{position:absolute;left:14px;top:16px;width:18px;height:18px;color:var(--muted);pointer-events:none}
.labi-in .input{height:50px;padding-left:42px;font-size:16px}
.labi-list{position:absolute;left:0;right:0;top:54px;z-index:30;max-height:420px;overflow:auto;padding:4px;border:1px solid var(--line2);border-radius:var(--radius);background:var(--raised);box-shadow:var(--shadow)}
.labi-list .cmp-opt{text-decoration:none}
.labi-none{padding:12px}
.labi-all{columns:4 220px;column-gap:24px;list-style:none;margin:0;padding:0}
.labi-all li{padding:3px 0;font-size:14px;break-inside:avoid}
@media (max-width:1020px){.lab-top{grid-template-columns:1fr}.lab-ro{position:static}}
@media (max-width:720px){
  .lab-plot>.lab-v>.c-full{display:none}.lab-plot>.lab-v>.c-compact{display:block}
  .lab-p>b{font-size:38px}
  .lab-rows{grid-template-columns:1fr 1fr}.lab-rows>div:nth-child(3){grid-column:1/-1;border-left:0;border-top:1px solid var(--line)}
  .lab-tr{grid-template-columns:1fr auto;gap:6px 10px}.lab-tr .m{grid-column:1/-1}.lab-tr .f{text-align:left}
  .lab-jump{width:100%}.lab-jump .muted{display:none}
  .lab-in .field>label .muted{display:none}
}

/* ───────────────────────────────────────────────────────────── stickers: cards, table, panel, albums */
button.st-card{font:inherit;color:var(--ink);text-align:left;cursor:pointer;transition:border-color .15s,transform .12s}
button.st-card:hover{border-color:var(--accent-line);transform:translateY(-1px)}
.st-tbl .st-nm{display:flex;align-items:center;gap:10px;border:0;background:none;color:var(--ink);font:inherit;font-weight:500;cursor:pointer;padding:0;text-align:left}
.st-tbl .st-nm:hover{color:var(--accent)}
.st-tbl .th{width:56px;height:42px;display:flex;align-items:center;justify-content:center;flex:none}
.st-tbl .th img{max-width:100%;max-height:100%}
.st-tbl .st-badge{width:36px;height:36px;font-size:11px}
.stp-wrap{padding-top:6vh}
.stp{max-width:640px;padding:18px}
.stp-h{display:grid;grid-template-columns:128px minmax(0,1fr) auto;gap:16px;align-items:start}
.stp-art{height:108px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:var(--panel2)}
.stp-art img{max-width:100%;max-height:100%;object-fit:contain}
.stp-t h2{font-size:18px;line-height:1.3;margin-bottom:8px}
.stp-p{display:flex;align-items:center;gap:10px;margin-top:10px}
.stp-p .price{font:500 32px var(--mono);letter-spacing:-.03em}
.stp-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:16px 0 14px}
.stp-facts>div{padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel2)}
.stp-facts dt{font-size:12.5px;color:var(--muted)}
.stp-facts dd{margin:3px 0 0;font:500 16px var(--mono)}
.stp-mks{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.stp-mks .mkt.first{grid-column:1/-1}
.stp-tabs{margin-top:16px}
.stp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-top:12px;max-height:320px;overflow:auto;padding:2px}
.st-mini{display:flex;flex-direction:column;gap:3px;padding:10px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel2);color:var(--ink);font:inherit;text-align:left;cursor:pointer;min-width:0}
.st-mini:hover{border-color:var(--accent-line)}
.st-mini .art{height:64px;display:flex;align-items:center;justify-content:center}
.st-mini .art img{max-height:100%;max-width:100%}
.st-mini .st-badge{width:48px;height:48px;font-size:13px}
.st-mini b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-mini .muted{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.alb-bar{margin-bottom:16px}
.alb-bar .seg small{font:500 12px var(--mono);color:var(--muted)}
html.js .alb-set[data-off]{display:none}
html:not(.js) .alb-set+.alb-set{margin-top:32px}
.alb-sum{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:0 0 16px}
.alb-sum>div{padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.alb-sum dt{font-size:13px;color:var(--muted)}
.alb-sum dd{margin:4px 0 0;font-size:16px}
.alb-sum dd.price{font:500 24px var(--mono)}
.alb-book{border:1px solid color-mix(in srgb,var(--c,var(--line2)) 55%,var(--line));border-radius:10px;background:radial-gradient(120% 80% at 50% 0%,color-mix(in srgb,var(--c,var(--accent)) 10%,transparent),transparent 60%),var(--panel);padding:16px;box-shadow:inset 0 0 0 4px var(--panel2)}
.alb-cover{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:4px 6px 14px;margin-bottom:14px;border-bottom:1px dashed var(--line2)}
.alb-cover b{font-size:18px;letter-spacing:-.01em}
.alb-cover span{font:600 13px var(--sans);color:var(--c,var(--ink2))}
.alb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.alb-slot{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--ink);font:inherit;text-align:left;cursor:pointer;min-width:0;transition:border-color .15s,transform .12s}
.alb-slot:hover{border-color:var(--accent-line);transform:translateY(-1px)}
.alb-slot .art{height:92px;display:flex;align-items:center;justify-content:center}
.alb-slot .art img{max-width:100%;max-height:100%;object-fit:contain}
.alb-slot>b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.alb-slot .p{display:flex;align-items:baseline;justify-content:space-between;gap:6px}
.alb-slot .p small{font-size:12px;color:var(--muted)}
.alb-slot.empty{cursor:default;border-style:dashed;background:transparent}
.alb-slot.empty:hover{transform:none;border-color:var(--line)}
.alb-slot.empty .muted{font-size:12.5px}
.st-badge.ghost{opacity:.35;--c:var(--muted)}
.alb-others{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.alb-card{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);color:var(--ink);text-decoration:none!important;transition:border-color .15s}
.alb-card:hover{border-color:var(--accent-line);color:var(--ink)}
.alb-card .arts{display:flex;gap:6px;height:48px;align-items:center}
.alb-card .arts img{height:44px;width:auto}
.alb-card .arts:empty{display:none}
.alb-card b{font-size:15px}
.alb-card>span:last-child{font-size:13px;color:var(--muted)}
@media (max-width:720px){.stp-h{grid-template-columns:88px minmax(0,1fr) auto;gap:12px}.stp-art{height:76px}.stp-p .price{font-size:26px}.alb-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.alb-sum{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.alb-sum>div{padding:10px}.alb-sum dt{font-size:12px}.alb-sum dd{font-size:14px}.alb-sum dd.price{font-size:17px}.stp-mks{grid-template-columns:1fr}}

/* ───────────────────────────────────────────────────────────── hubs: grid / table, shelves, rarity layout */
.hb-cout[data-view="grid"] .hb-ctbl{display:none}
.hb-cout[data-view="table"] .hb-wts{display:none}
.hb-ctbl .nm,.hc-tbl .nm{display:flex;align-items:center;gap:10px;color:var(--ink);min-width:200px;font-weight:500}
.hb-ctbl .nm .th,.hc-tbl .nm .th{width:56px;height:42px;flex:none}
.hb-ctbl .nm:hover,.hc-tbl .nm:hover{color:var(--accent)}
.hb-wt-c{font-size:13px}
.sh-p{display:none}.sh-p.on{display:block}
html:not(.js) .sh-p{display:block}
.sh-sub{font-size:14px;margin:12px 0}
.hc-tabs{margin-bottom:16px}
.hc-out[data-view="grid"] .hc-tbl{display:none}
.hc-out[data-view="table"] .hb-colls{display:none}
.hc-tbl .hb-rbar{min-width:140px;margin-top:0}
html:not(.js) .hc-tbl{display:none}
.hb-out[data-view="rarity"]>.tiles,.hb-out[data-view="rarity"]>.hb-tbl,.hb-out[data-view="rarity"]>.more-row{display:none!important}
.hb-out:not([data-view="rarity"])>.hb-rar{display:none}
html:not(.js) .hb-out>.hb-rar{display:block}
html:not(.js) .hb-out>.tiles{display:none}
.hb-rs{margin-top:28px}
.hb-rs .shelf{grid-auto-columns:minmax(200px,232px)}
.hb-rs:first-child{margin-top:4px}
.hb-rs-h{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap;margin-bottom:12px}
.hb-rs-h h2{display:flex;align-items:center;gap:9px;font-size:18px}
.hb-rs-h h2 i{width:12px;height:12px;border-radius:3px;background:var(--rc,var(--muted))}
.hb-rs-h .muted{font-size:14px}
.hb-rs-h a{color:var(--ink2)}
.hb-rs-h a:hover{color:var(--ink)}
.hb-rchart{margin-top:28px}
.hb-rc{padding:0 16px 8px}

/* ───────────────────────────────────────────────────────────── explorer: saved views, scatter, preview */
.toast-act{margin-left:6px;height:28px;padding:0 10px;border:1px solid var(--accent-line);border-radius:4px;background:var(--accent-soft);color:var(--ink);font:600 13px var(--sans);cursor:pointer}
.toast-act:hover{border-color:var(--accent)}
.ex-views{display:contents}
.ex-sv{display:inline-flex;align-items:center;gap:2px;flex:none}
.ex-x{width:28px;height:28px;border:0;border-radius:50%;background:none;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.ex-x:hover{background:var(--raised);color:var(--ink)}
.ex-x svg{width:14px;height:14px}
.ex-saveform{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding:12px 14px;border:1px solid var(--accent-line);border-radius:var(--radius);background:var(--panel)}
.ex-saveform label{font-size:14px;font-weight:600}
.ex-saveform .input{flex:1 1 240px;max-width:380px}
.ex-saveform .muted{font-size:13px}
.ex-scw{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:16px;align-items:start}
.ex-sc svg{cursor:crosshair;user-select:none}
.ex-corner{fill:var(--accent)!important;font-weight:600}
.ex-key{display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;margin-top:8px;font-size:13px}
.ex-size{display:inline-flex;align-items:center;gap:14px}
.ex-size>span{display:inline-flex;align-items:center;gap:6px;font:500 12.5px var(--mono);color:var(--ink2)}
.ex-top{padding:14px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.ex-top h3{font-size:15px;margin-bottom:8px}
.ex-top ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px;font-size:13.5px}
.ex-top li a{display:block;color:var(--ink);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ex-top li a:hover{color:var(--accent)}
.ex-top li>span{display:flex;align-items:center;gap:8px;font-size:12.5px}
.ex-pvd{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:8px}
.ex-pvc{width:100%;max-width:460px;height:auto;display:block}
.ex-pvw{display:flex;gap:6px 14px;flex-wrap:wrap;font-size:13px}
.ex-pvw>span{display:inline-flex;align-items:center;gap:6px}
@media (max-width:1020px){.ex-scw{grid-template-columns:1fr}}

/* ───────────────────────────────────────────────────────────── 404 search, legal contents, contact states */
.nf-find{max-width:560px;margin:14px 0 18px;display:flex;flex-direction:column;gap:10px}
.nf-find .input{height:48px;font-size:16px}
.nf-hits{display:flex;flex-direction:column;gap:2px;padding:4px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.nf-hits .cmp-opt{text-decoration:none}
.page.doc{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:start}
.page.doc>.crumbs{grid-column:1/-1}
.doc-toc{position:sticky;top:calc(var(--hdr) + 20px);display:flex;flex-direction:column;gap:2px;padding:12px 0;border-left:1px solid var(--line)}
.doc-toc b{font-size:13px;color:var(--muted);padding:0 14px 6px;font-weight:600}
.doc-toc a{padding:6px 14px;margin-left:-1px;border-left:2px solid transparent;color:var(--ink2);font-size:14px;line-height:1.35;text-decoration:none}
.doc-toc a:hover{color:var(--ink)}
.doc-toc a[aria-current]{color:var(--ink);border-left-color:var(--accent)}
@media (max-width:900px){.page.doc{grid-template-columns:1fr;gap:12px}.doc-toc{position:static;flex-direction:row;flex-wrap:wrap;gap:6px;border-left:0;padding:0}.doc-toc b{display:none}.doc-toc a{border:1px solid var(--line2);border-radius:14px;padding:4px 10px;font-size:13px;margin:0}.doc-toc a[aria-current]{border-color:var(--accent)}}
.c-err{font-size:13px;color:var(--bad)}
.c-err:empty{display:none}
.contact [aria-invalid="true"]{border-color:var(--bad)}
.contact .field .muted{font-weight:400}
.c-draft{margin-top:4px}
.contact-done{padding:20px;display:flex;flex-direction:column;gap:12px;max-width:640px}
.contact-done h2{font-size:20px}
.contact-done blockquote{margin:0;padding:10px 14px;border-left:3px solid var(--accent-line);background:var(--panel2);color:var(--ink2);font-size:14px;white-space:pre-wrap}

/* ───────────────────────────────────────────────────────────── bot page: try the commands */
.botdemo{margin:8px 0 32px;padding:0;overflow:hidden;background:var(--panel)}
.bd-h{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--line);background:var(--panel2)}
.bd-h h2{font-size:16px;display:flex;align-items:center;gap:6px}
.bd-hash{color:var(--muted);font-weight:500;font-size:20px}
.bd-h .muted{font-size:13.5px}
.bd-log{max-height:520px;min-height:180px;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:14px;scroll-behavior:smooth}
.bd-msg{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;align-items:start}
.bd-av{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--raised);border:1px solid var(--line2);font-size:11px;font-weight:600;color:var(--ink2);overflow:hidden}
.bd-av.bot{background:var(--bg)}
.bd-av img{width:100%;height:100%}
.bd-msg b{font-size:14px}
.bd-msg p{margin:2px 0 0;font-size:14.5px;color:var(--ink2)}
.bd-msg.you p{color:var(--ink)}
.bd-app{display:inline-flex;align-items:center;height:16px;padding:0 5px;margin-left:4px;border-radius:3px;background:#5865F2;color:#fff;font:600 10.5px/1 var(--sans);vertical-align:1px}
.bd-embed{margin-top:6px;max-width:520px;padding:12px 14px;border-radius:4px;border-left:4px solid var(--accent);background:var(--panel2);display:flex;flex-direction:column;gap:8px}
.bd-t{font-weight:600;font-size:15px}
.bd-b{font-size:14px;color:var(--ink2)}
.bd-f{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px 14px;margin:0}
.bd-f dt{font-size:12.5px;font-weight:600;color:var(--ink)}
.bd-f dd{margin:2px 0 0;font-size:14px;color:var(--ink2)}
.bd-foot{font-size:12px;color:var(--muted)}
.bd-ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-size:14px}
.bd-curve{width:100%;height:auto;display:block}
.bd-chips{display:flex;gap:8px;flex-wrap:wrap;padding:12px 16px 0;border-top:1px solid var(--line)}
.bd-chips .chip{height:32px}
.bd-form{display:flex;gap:8px;padding:12px 16px 16px}
.bd-form .input{flex:1;font-size:15px}
@media (max-width:720px){.bd-log{max-height:440px}.bd-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.bd-chips .chip{flex:none}}

/* the 3D viewer's hook (VIEWER-APP): an empty slot beside Zoom; it takes no space until something is put in it */
.ins-tools{display:inline-flex;align-items:center;gap:8px}
.v3d-slot{display:inline-flex;align-items:center;gap:8px}
.v3d-slot:empty{display:none}

/* Collapsed explanations: the table first, the reasons one tap away */
.sk-why{margin:6px 0 0;font-size:13px;color:var(--muted)}
.sk-why summary{cursor:pointer;width:max-content;max-width:100%;color:var(--muted);text-decoration:underline dotted;text-underline-offset:3px}
.sk-why summary:hover{color:var(--ink)}
.sk-why p{margin:6px 0 0;max-width:72ch}

/* chart points: only a point with a link looks clickable; a tapped tip holds its link */
.viztip.live{pointer-events:auto}
.viztip .vt-m{font-family:var(--sans);font-weight:600;color:var(--ink)}
.chart-svg .tierdot.go,.chart-svg .ptm.go{cursor:pointer}
.chart-svg .tierdot:focus,.chart-svg .ptm:focus{outline:none}
.chart-svg .tierdot:focus-visible,.chart-svg .ptm:focus-visible{stroke:var(--ink);stroke-width:calc(2.4px * var(--k,1))}
.hx-svg .tierdot.go{cursor:pointer}
.hx-svg .tierdot:focus{outline:none}.hx-svg .tierdot:focus-visible{stroke:var(--ink);stroke-width:2.4}
.tier-go{margin-top:10px;gap:6px}
.ins-sh .tier-go{margin:0 0 0 auto}

/* ── Inspect tabs (skin pages): Wear · Pattern · 3D ── */
.ins-head.tabbed{align-items:center}
.ins-ht{display:flex;align-items:center;gap:10px 20px;flex-wrap:wrap}
.ins-tabs{border-bottom:0}
.ins-p[hidden]{display:none}
/* ── the Wear view: the skin at any float, live ── */
.iw{display:flex;flex-direction:column;gap:10px;margin:0;padding:14px 16px 14px}
.iw-top{display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;min-height:34px}
.iw-read{display:inline-flex;align-items:center;gap:8px}
.iw-read .num{font:500 18px var(--mono);font-variant-numeric:tabular-nums;color:var(--ink)}
.iw-read .price{font:600 18px var(--mono);font-variant-numeric:tabular-nums;color:var(--accent)}
.iw-views{display:grid;grid-template-columns:repeat(var(--n,1),minmax(0,1fr));gap:12px;justify-items:center;align-items:center}
.iw-views[data-n="2"]{--n:2}
.iw-v{width:100%;max-width:var(--iw-w,512px);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 55%,var(--accent-soft),transparent 68%)}
.iw-v img,.iw-v canvas{display:block;width:100%;height:auto;max-width:100%}
.iw-sides{display:none}
@media (max-width:760px){.iw-views[data-n="2"]{--n:1}.iw-views .iw-v:not(.on){display:none}.iw-sides{display:inline-flex}}
/* the whole 0-1 float scale: the skin's own range in its wear colours, grey outside it; the thumb stays inside */
.iw-sl{position:relative;height:56px;margin:4px 12px 0}
.iw-track{position:absolute;left:0;right:0;top:34px;height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.iw-track span{position:absolute;top:0;bottom:0}
.iw-tip{position:absolute;top:0;transform:translateX(-50%);display:inline-flex;align-items:center;gap:5px;padding:2px 7px;border:1px solid var(--line2);border-radius:4px;background:var(--raised);font-size:12px;line-height:18px;white-space:nowrap;pointer-events:none;box-shadow:var(--shadow)}
.iw-tip .num{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink)}
.iw-range{position:absolute;left:calc(var(--lo) - 12px);width:calc(var(--hi) - var(--lo) + 24px);top:24px;height:26px;margin:0;padding:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer;touch-action:none}
.iw-range::-webkit-slider-runnable-track{height:26px;background:transparent}
.iw-range::-moz-range-track{height:26px;background:transparent}
.iw-range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:1px;border-radius:50%;background:var(--ink);border:3px solid var(--accent);box-shadow:0 1px 4px rgba(0,0,0,.4);cursor:grab}
.iw-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--ink);border:3px solid var(--accent);box-shadow:0 1px 4px rgba(0,0,0,.4);cursor:grab}
.iw-range:focus{outline:none}
.iw-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px var(--accent-line)}
.iw-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 4px var(--accent-line)}
.v3d-panel{min-height:200px}
/* listing dots: individual listings on the price-by-float chart, coloured by market. Two validated hues (the two
   markets with most dots on the chart) and one neutral for every other market; the market row names them all. */
:root{--lst1:#3987e5;--lst2:#d95926;--lst0:#8E9CA3}
html[data-theme="light"]{--lst1:#2a78d6;--lst2:#eb6834;--lst0:#6B7471}
.ldot{fill:var(--lst0);stroke:var(--plot-bg);stroke-width:1.2}
.ldot.l1{fill:var(--lst1)}.ldot.l2{fill:var(--lst2)}
.chart-svg .ldot{opacity:.92}
.chart-svg .ldot.off{fill:none;stroke:var(--lst0);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.chart-svg .ldot.off.l1{stroke:var(--lst1)}.chart-svg .ldot.off.l2{stroke:var(--lst2)}
.chart-svg .ldot.go{cursor:pointer}
.chart-svg .ldot:focus{outline:none}
.chart-svg .ldot:focus-visible{stroke:var(--ink);stroke-width:calc(2.2px * var(--k,1))}
.vt-sw{display:inline-block;flex:none;width:9px;height:9px;border-radius:50%;background:var(--lst0)}
.vt-sw.l1{background:var(--lst1)}.vt-sw.l2{background:var(--lst2)}
.sk-lmk{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;padding:0 16px 14px;margin-top:-4px}
.sk-lmk[hidden]{display:none}
.sk-lmk .lmk-h{font-size:12px;color:var(--muted);margin-right:2px}
.sk-lmk .lmk{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:1px solid var(--line2);border-radius:3px;
  background:var(--panel2);color:var(--ink2);font:600 12px var(--sans);-webkit-font-smoothing:antialiased;cursor:pointer}
.sk-lmk .lmk b{font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.sk-lmk .lmk:hover{color:var(--ink);border-color:var(--muted)}
.sk-lmk .lmk[aria-pressed="false"]{opacity:.5;text-decoration:line-through}
.sk-lmk .lmk:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

/* ══ Big screens: every page uses the screen (owner, 2026-09-25) ═══════════════════════════════════════════
   Up to 1599 px the page keeps its reading width. From 1600 px the content spans the viewport minus a 3 vw
   gutter (never more than 10 % dead on a side); grids add columns instead of stretching (every card and
   column has a maximum useful size), and the skin page turns into a dashboard. */
.sk-plot{container-type:inline-size}
.sk-plot>.c-wide{display:none}
@container (min-width:1400px){.sk-plot>.c-full{display:none}.sk-plot>.c-wide{display:block}}
@media (min-width:1600px){
  :root{--gut:max(32px,3vw)}
  .page,.page.wide{max-width:none}
  .ftr-in,.ftr-legal,.ftr-b,.spfoot{max-width:none}
}
/* the skin page as a dashboard: key numbers | chart | price box, then Inspect, similar, at a glance, details */
@media (min-width:1800px){
  .sk{display:grid;grid-template-columns:minmax(300px,340px) minmax(0,1fr) minmax(360px,400px);column-gap:24px;align-items:start;
    grid-template-areas:"nav nav nav" "top top top" "tb tb tb" "ph ph ph" "kn chart rail" "ts chart rail" "ins ins sim" "gl gl gl" "det det det"}
  .sk:not(:has(>.sk-sim)){grid-template-areas:"nav nav nav" "top top top" "tb tb tb" "ph ph ph" "kn chart rail" "ts chart rail" "ins ins ins" "gl gl gl" "det det det"}
  .sk-main{display:contents}
  .sk-nav{grid-area:nav}.sk-top{grid-area:top}.sk-tb{grid-area:tb}.sk-phases{grid-area:ph;min-width:0}
  .sk-kn{grid-area:kn;grid-template-columns:1fr 1fr;align-self:start}.sk-kn>div:last-child:nth-child(odd){grid-column:1/-1}.sk-ts{grid-area:ts;align-self:start}
  .sk-chart{grid-area:chart;min-width:0}.sk-rail{grid-area:rail;align-self:stretch}
  .sk>.ins{grid-area:ins;min-width:0}.sk-gl{grid-area:gl;min-width:0}.sk-sim{grid-area:sim;min-width:0}.sk-det{grid-area:det;min-width:0}
  .sk>.ins,.sk-sim{margin-top:32px}
  .sk-ts-row{grid-template-columns:1fr}
  /* similar skins beside Inspect: one compact row per skin (picture left, words right), all of them visible */
  .sk-sim .shelf{grid-auto-flow:row;grid-template-columns:1fr;grid-auto-columns:auto;gap:8px;overflow:visible;padding:2px 0}
  .sk-sim .shelf>*:nth-child(n+9){display:none}
  .sk-sim .tile{flex-direction:row;align-items:center}
  .sk-sim .tile-art{width:120px;flex:none;padding:6px 8px}
  .sk-sim .tile-b{padding:8px 12px 8px 4px}
}
@media (min-width:3200px){
  .sk{grid-template-columns:minmax(300px,340px) minmax(0,1.25fr) minmax(380px,420px) minmax(0,1fr);
    grid-template-areas:"nav nav nav nav" "top top top top" "tb tb tb tb" "ph ph ph ph" "kn chart rail ins" "ts chart rail ins" "det det gl gl" "sim sim sim sim"}
  .sk:not(:has(>.sk-gl:not([hidden]))){grid-template-areas:"nav nav nav nav" "top top top top" "tb tb tb tb" "ph ph ph ph" "kn chart rail ins" "ts chart rail ins" "det det det det" "sim sim sim sim"}
  .sk>.ins{margin-top:0}
  .sk-sim .shelf{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
  .sk-sim .shelf>*:nth-child(n+9){display:flex}
  .sk-sim .tile{flex-direction:column;align-items:stretch}
  .sk-sim .tile-art{width:auto;padding:12px 16px 12px 20px}
  .sk-sim .tile-b{padding:12px 12px 12px 16px}
}

/* ══ Chart annotations (owner, 2026-09-25): the plot carries data only ═══════════════════════════════════
   Best value = an accent ring on the curve, its words in the Best value row under the chart; wear cliffs =
   a tick on the float axis in the cleaner wear's colour, their words in the band above the axis (site.js
   fitChart lays them out without overlaps). Everything is in the tooltip too; "Annotations" hides it all. */
.chart-svg .bv-o{fill:none;stroke:var(--accent);stroke-width:calc(2px * var(--k,1));r:calc(6.5px * var(--k,1));transition:r .12s}
.chart-svg .bv-i{fill:var(--accent);r:calc(2.2px * var(--k,1))}
.chart-svg .bvm.hl .bv-o{stroke-width:calc(2.6px * var(--k,1));r:calc(8.5px * var(--k,1))}
.chart-svg .an-t{stroke-width:calc(2.4px * var(--k,1));stroke-linecap:round}
.chart-svg .anlt{font:500 calc(12px * var(--k,1))/1 var(--sans);font-variant-numeric:tabular-nums;fill:var(--ink2);paint-order:stroke;stroke:var(--panel);stroke-width:calc(3px * var(--k,1));stroke-linejoin:round}
.chart-svg .anlt .anx{font-weight:600;fill:var(--gold)}
.chart-svg .anl.sh .anw{display:none}
.chart-host[data-hide-ann] .ann{display:none}
.sk-tip{width:auto;min-width:200px;max-width:260px}
.sk-tip .t4{display:flex;flex-direction:column;gap:3px;border-top:1px solid var(--line);margin-top:6px;padding-top:6px;color:var(--ink2);font-size:13px}
.sk-tip .t4>span{display:inline-flex;align-items:center;gap:6px}
.sk-tip .t-bv::before{content:"";width:9px;height:9px;border-radius:50%;border:2px solid var(--accent);flex:none}
.sk-bvr{display:flex;align-items:center;gap:6px 8px;flex-wrap:wrap;font-size:13px}
.sk-bvr .lbl{color:var(--muted);font-weight:500}
.sk-bvr .bvc{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 8px;border:1px solid var(--line2);border-radius:3px;background:none;color:var(--ink2);font:500 13px var(--sans);cursor:pointer}
.sk-bvr .bvc .mono{font-family:var(--mono);color:var(--ink)}
.sk-bvr .bvc:hover,.sk-bvr .bvc[aria-pressed="true"]{border-color:var(--accent)}
.sk-bvr .bvc:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.sk-bvr[hidden]{display:none}

/* ══ Final-product pass (owner, 2026-09-25): no banner boxes, no filled chips, nothing truncated, >= 12 px ═══
   Quiet cards (hairline, neutral surface); colour only on the data itself (numbers, wear tags, markers).
   Wear tags are outlined, their letters in the wear's colour. Every name wraps instead of being cut. */
h1{font-weight:500}h2{font-weight:500}h3,h4{font-weight:500}
.tag{min-width:30px;height:20px;padding:0 6px;border-radius:3px;font:600 12px/1 var(--sans);letter-spacing:.03em;color:var(--w,var(--ink2));background:transparent;border:1px solid color-mix(in srgb,var(--w,var(--ink2)) 70%,transparent)}
html[data-theme="light"] .tag{color:var(--w,var(--ink2))}
.pill{background:transparent;font-weight:500}
.pill.plain{color:var(--ink2);border-color:var(--line2)}
.splabel{background:transparent;font-weight:500}
.tag-st,.tag-sv{background:transparent}
.chip[aria-pressed="true"],.chip[aria-current="page"]{background:transparent;border-color:var(--accent);color:var(--ink);box-shadow:inset 0 0 0 1px var(--accent)}
.rk,.si-tier,.ins-tier,.cmp-tag,.zv-max,.st-badge{background:transparent}
.ins-chip[aria-pressed="true"]{background:transparent}
.ins-card{border-left:1px solid var(--line2)}
.ins-card::before{content:"";position:absolute;left:6px;top:6px;width:6px;height:6px;border-radius:50%;background:var(--tc,var(--gold))}
.ins-card.on{background:transparent}
.seeds .hit{background:transparent}
.toast-act{background:transparent}
.tb-it[aria-current]{background:var(--raised);box-shadow:inset 0 0 0 1px var(--accent-line)}
.lab-tr.on{background:var(--raised);box-shadow:none}
.pt-res{border-left:1px solid var(--line)}
.hb-wt{border-left:1px solid var(--line)}
.contact-done blockquote{border-left:1px solid var(--line2)}
kbd{font-size:12px}
.ax,.ax2,.clt,.bvt,.pillt{font-size:12px}
.chart-svg .ax,.chart-svg .ax2,.chart-svg .pillt,.chart-svg .ov .ovt{font-size:calc(12px * var(--k,1))}
.fs-ticks{font-size:12px}
.ins-card span,.lab-rows dd .pill{font-size:12px}
.st-tbl .st-badge{font-size:12px}
.bd-app{font-size:11px;height:16px}
/* the Pattern premiums strip: a quiet section, no tinted box, no headline inside a box */
.sk-ts{padding:0;border:0;background:none}
.sk-ts-h{margin-bottom:8px}
.sk-ts-h h2{font-size:15px;font-weight:500}
.sk-ts-h>span{font-size:13px;color:var(--muted)}
.sk-ts-h .more{font-size:13px}
.sk-ts-row{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.sk-tsi{padding:8px 10px 10px;border-color:var(--line)}
.sk-tsi .n{display:block;-webkit-line-clamp:unset;overflow:visible}
.sk-tsi .p .price{font-size:17px}
.sk-tsi i{height:2px}
/* nothing is cut: names wrap onto a second line instead of ending in an ellipsis */
.tile-w,.tile-n,.mkt .mk-n b,.mkt .mk-n small,.pal-t b,.sk-pn a span,.sk-w-f,.hm-fc-h .t b,.hm-sk b,.hb-fact a,.st-card b,.st-card .m span:last-child,.pt-card .b b,.sk-dock .m span,.sk-w-t,.ins-chip small,.zv-t,.tb-it .tx b,.cmp-opt b,.viztip .cmp-n,.lab-rows dd,.st-mini b,.st-mini .muted,.alb-slot>b,.ex-top li a{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
.ins-chip small,.viztip .cmp-n{max-width:none}
.sk-w-h{overflow:visible}
/* the wear row: tag and price on one line now that the wear is its tag */
.sk-w{padding:10px 14px}
/* light theme: every coloured word reaches 4.5:1 on every beige surface (tags, prices, premiums, speeds) */
html[data-theme="light"]{--fn:#256E48;--mw:#4E6924;--ft:#765E0F;--ww:#915119;--bs:#A83E2D;--gold:#7E5B00;--accent:#076C63;--good:#1C6F44;--warn:#8C540A}
/* rarity: a small square before the weapon line, not a thick coloured edge */
.tile{box-shadow:none}
.tile-w::before{content:"";flex:none;width:8px;height:8px;border-radius:2px;background:var(--rc,var(--muted))}
.tbl tr.rar-row td:first-child,table.tbl-cards tr.rar-row{box-shadow:none}
.tbl tr.rar-row td:first-child::before{content:"";display:inline-block;vertical-align:middle;width:8px;height:8px;border-radius:2px;background:var(--rc,var(--muted));margin-right:8px}
/* Float lab on big screens: the stage takes the width it can use, the readout keeps a useful width, and from
   2400 px the price chart sits beside them instead of growing into a 1,000 px tall picture */
@media (min-width:1600px){
  .lab-stage .ins-b.solo{grid-template-columns:minmax(0,1fr)}
  .lab-top{grid-template-columns:minmax(0,1fr) minmax(380px,600px)}
}
@media (min-width:2400px){
  .lab{display:grid;grid-template-columns:minmax(0,1fr) minmax(400px,600px) minmax(0,1.35fr);column-gap:16px;align-items:start}
  .lab>*{grid-column:1/-1;min-width:0}
  .lab-top{display:contents}
  .lab-stage{grid-column:1}.lab-ro{grid-column:2}
  .lab-chart{grid-column:3;grid-row:3;margin-top:0}
}
/* home on big screens: the demo chart keeps a readable size; from 2400 px the "Float moves these the most"
   cards stand beside the hero instead of under it */
@media (min-width:1600px){.hm-hero{grid-template-columns:minmax(0,1fr) minmax(0,1080px)}}
@media (min-width:2400px){
  .hm{display:grid;grid-template-columns:minmax(440px,640px) minmax(0,1100px) minmax(360px,1fr);column-gap:48px;align-items:start}
  .hm>*{grid-column:1/-1;min-width:0}
  .hm-hero{display:contents}
  .hm-hero>*{grid-row:1;padding-top:36px;align-self:center}
  .hm-hero>:first-child{grid-column:1}.hm-hero>:nth-child(2){grid-column:2}
  .hm-movers{grid-column:3;grid-row:1;align-self:center;margin-top:36px}
  .hm-movers .hm-fm{grid-template-columns:repeat(auto-fill,minmax(max(340px,calc(50% - 8px)),1fr))}
}
/* rarity squares never push a cell's content: they sit in the cell's left padding */
.tbl tr.rar-row td:first-child{position:relative;padding-left:22px}
.tbl tr.rar-row td:first-child::before{position:absolute;left:8px;top:50%;margin:-4px 0 0}
.hb-wt .b b::before{content:"";display:inline-block;vertical-align:middle;width:8px;height:8px;border-radius:2px;background:var(--rc,var(--muted));margin:-2px 8px 0 0}
.hb-wt:hover{border-left-color:var(--accent-line)}
/* hubs on big screens: the class groups flow side by side (cards keep their size) instead of leaving the
   right half of the screen empty under a short group */
@media (min-width:1600px){
  .hb-cout[data-view="grid"]{display:flex;flex-wrap:wrap;align-items:flex-start;column-gap:48px}
  .hb-cout[data-view="grid"]>.hb-sec{flex:0 1 auto;max-width:100%;min-width:0;margin-top:24px}
  .hb-cout[data-view="grid"] .hb-wts{display:flex;flex-wrap:wrap}
  .hb-cout[data-view="grid"] .hb-wt{width:216px;flex:none}
}
/* a skin picker never needs 3,000 px */
@media (min-width:1200px){.pl-form{grid-template-columns:minmax(0,640px) 150px auto 1fr}}
.lab-bar{max-width:120px}
/* Wear view, contract v3: the seed box next to the float readout; a side with no picture for this seed is not drawn */
.iw-seed{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.iw-seed .input{width:84px;height:32px;padding:0 6px;font:500 15px var(--mono);font-variant-numeric:tabular-nums;text-align:center}
.iw-v[hidden]{display:none}
.iw-views:has(>.iw-v[hidden]){--n:1}
.iw-sides button[disabled]{opacity:.4;cursor:not-allowed}
.iw .ins-cap:empty{display:none}
.iw-seed[hidden],.iw-sides[hidden]{display:none}

/* ══ Sticky boxes stay inside their own column (owner, 2026-09-25: the price box floated over At a glance) ══
   A sticky box sticks only inside a wrapper that ends where its section ends. On the skin page the rail is that
   wrapper: it stretches over its own grid rows (beside the chart) and the price card inside it is the sticky one,
   so it stops at the chart's bottom edge instead of sliding over the sections below. The Float lab readout, once
   it becomes a direct item of the page grid (2400 px and up), does not stick at all. */
.sk-rail{position:static;align-self:stretch}
.sk-ro{position:sticky;top:calc(var(--hdr) + 16px)}
@media (max-width:1020px){.sk-ro{position:static}}
@media (min-width:2400px){.lab-ro{position:static}}
/* ══ Chart data reads at every size (owner, 2026-09-25: "we can't see the data points very well anymore") ═══
   --k = viewBox units per CSS px, --m = marker scale (1 on a phone chart, up to 1.9 on a wide one), --dr = a reading
   dot's radius in CSS px, capped so neighbouring bands never merge (site.js fitChart). Lines thicken with the plot. */
.chart-svg .ly-line{stroke-width:calc(2px * var(--k,1))}
.chart-svg .rdot{r:calc(var(--dr,3px) * var(--k,1));stroke-width:calc(1.2px * var(--k,1) * var(--m,1))}
.chart-svg.c-compact .rdot{r:calc(var(--dr,2.6px) * var(--k,1))}
.chart-svg .rdot.old{stroke-width:calc(1.4px * var(--k,1) * var(--m,1))}
.chart-svg .rdot.est{stroke-width:calc(1.3px * var(--k,1) * var(--m,1))}
.chart-svg circle.ldot{r:calc(3.4px * var(--k,1) * var(--m,1));stroke-width:calc(1.1px * var(--k,1) * var(--m,1))}
.chart-svg .bv-o{r:calc(6.5px * var(--k,1) * var(--m,1));stroke-width:calc(2px * var(--k,1) * var(--m,1))}
.chart-svg .bv-i{r:calc(2.2px * var(--k,1) * var(--m,1))}
.chart-svg .bvm.hl .bv-o{r:calc(8.5px * var(--k,1) * var(--m,1))}
.chart-svg .hl-line{stroke-width:calc(2px * var(--k,1))}
.chart-svg .hdot{r:calc(2.6px * var(--k,1) * var(--m,1))}
/* ══ Charts are sharp at every size (owner, 2026-09-25: "too big, make it better, sharper and cleaner") ══════
   Words are the site's px size whatever the chart's size (fitChart's --k is no longer clamped); grid, axis and
   guide lines stay 1 px (non-scaling strokes); the home demo draws a wide version on a wide card (width, not
   height) and its plot never passes 340 px. */
.chart-svg line,.chart-svg .ly-usual,.chart-svg .ly-stale,.chart-svg .ly-interp,.hm-fc svg line,.hm-fc svg path{vector-effect:non-scaling-stroke}
.chart-svg{shape-rendering:geometricPrecision}
.chart-svg line{shape-rendering:crispEdges}
:root{--grid:#13181E}
html[data-theme="light"]{--grid:#E9E1D1}
.hm-plot{container-type:inline-size}
.hm-plot>.c-hwide{display:none}
@container (min-width:620px){.hm-plot>svg.c-compact:not(.c-hwide){display:none}.hm-plot>.c-hwide{display:block;max-height:340px}}
.chart-svg text.cx-hide{visibility:hidden}
.tagt{font-size:12px}
.hm-mp-p b{line-height:1.2}
.lab-p>b{line-height:1.2}
.sk-ro-p b{line-height:1.2}
/* phones: the five wears wrap into rows instead of a strip cut at the screen edge */
@media (max-width:720px){.sk-wr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}.sk-wr>.sk-w{border-left:0;border-top:1px solid var(--line)}.sk-wr>.sk-w:nth-child(even){border-left:1px solid var(--line)}}
/* nothing is cut at a screen edge: rows of tabs, phases, switches and shelves wrap instead of scrolling sideways
   (tables keep their own scroll box; a wide table is data, not a row of controls) */
.tabs,.sk-phases,.hb-sw,.ex-tabs,.bd-chips{flex-wrap:wrap;overflow:visible}
.tabs{row-gap:0}
.seg{flex-wrap:wrap;overflow:visible}
.shelf{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(auto-fill,minmax(min(100%,180px),1fr));overflow:visible;scroll-snap-type:none}
@media (max-width:720px){.bd-chips{flex-wrap:wrap;overflow:visible}}
.ins-chip b,.ins-chip small,.tb-chip b,.tb-chip small{line-height:1.3}
.tier-go.tier-more{margin-left:6px}

/* ── blue % / fade % range (pct.js): one slim row above the chart ─────────────────────────────── */
.sk-pct{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;padding:10px 16px 0;font-size:13px;color:var(--ink2)}
.sk-pct .pc-l{font:500 13px var(--sans);color:var(--ink)}
.sk-pct .pc-n{width:62px;height:30px;padding:0 6px;font:500 13px var(--mono);text-align:center}
.sk-pct .pc-dual{position:relative;flex:1 1 160px;min-width:140px;max-width:340px;height:30px}
.sk-pct .pc-track{position:absolute;left:8px;right:8px;top:13px;height:4px;border-radius:2px;background:var(--line2)}
.sk-pct .pc-fill{position:absolute;top:0;bottom:0;left:0;right:0;border-radius:2px;background:var(--accent)}
.sk-pct:not(.on) .pc-fill{opacity:.35}
.sk-pct input[type=range]{position:absolute;inset:0;width:100%;height:30px;margin:0;background:none;-webkit-appearance:none;appearance:none;pointer-events:none;z-index:2}
.sk-pct input[type=range]::-webkit-slider-runnable-track{background:none;border:0}
.sk-pct input[type=range]::-moz-range-track{background:none;border:0}
.sk-pct input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;pointer-events:auto;width:16px;height:16px;border-radius:50%;background:var(--panel);border:2px solid var(--accent);cursor:grab}
.sk-pct input[type=range]::-moz-range-thumb{pointer-events:auto;width:12px;height:12px;border-radius:50%;background:var(--panel);border:2px solid var(--accent);cursor:grab}
.sk-pct input[type=range]:focus{outline:none}
.sk-pct input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--accent-soft)}
.sk-pct input[type=range]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px var(--accent-soft)}
.sk-pct .pc-pre{display:inline-flex;flex-wrap:wrap;gap:2px}
.sk-pct .pc-pre button,.sk-pct .pc-clear{height:28px;padding:0 8px;border:0;border-radius:3px;background:none;color:var(--ink2);font:500 13px var(--sans);cursor:pointer;white-space:nowrap}
.sk-pct .pc-pre button:hover,.sk-pct .pc-clear:hover{color:var(--ink)}
.sk-pct .pc-pre button[aria-pressed="true"]{color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent);border-radius:0}
.sk-pct .pc-pre button:disabled{color:var(--muted);opacity:.55;cursor:default}
.sk-pct .pc-sum{margin-left:auto;font-size:13px;color:var(--muted);white-space:nowrap}
.sk-pct .pc-sum b{font:500 13px var(--mono);color:var(--ink)}
.sk-pct .pc-clear{height:24px;padding:0 4px;margin-left:4px;color:var(--accent);text-decoration:underline;text-underline-offset:2px}
@media (max-width:560px){.sk-pct{gap:4px 8px}.sk-pct .pc-n{width:52px}.sk-pct .pc-dual{flex:1 1 80px;min-width:80px;max-width:none}.sk-pct .pc-pre{flex-basis:100%}.sk-pct .pc-sum{margin-left:0;white-space:normal}}
/* a range on: the curve (every pattern) steps back, the listings in range come forward */
#sk-plot.pc-on .ly-line,#sk-plot.pc-on .ly-area,#sk-plot.pc-on .ly-stale,#sk-plot.pc-on .ly-interp,#sk-plot.pc-on .ov-dots{opacity:.4}
#sk-plot.pc-on .ldot{opacity:1}
.sk-lmk .lmk.pc-zero{opacity:.5}
.sk-tier .pc-tn{margin:2px 0 0;font-size:13px;color:var(--ink2)}
.pc-none{margin:0 0 12px;font-size:14px}
.ins-pc{margin:0 0 8px;font-size:14px;color:var(--ink2)}.ins-pc b{color:var(--ink)}
.ins-chip.pc-zero{opacity:.45}
.sk-rows [data-pc-row] a.price{color:var(--accent);text-decoration:none}
/* the selected seed: named in the price box, ringed on the chart (CSP.sel) */
.sk-ro-seed{display:flex;align-items:baseline;gap:6px 10px;flex-wrap:wrap;margin-top:6px;font-size:13px;color:var(--ink2)}
.sk-ro-seed[hidden]{display:none}
.sk-ro-seed .link-btn{margin-left:auto;font-size:12px}
.chart-svg .tierdot.sel{stroke:var(--ink);stroke-width:calc(2.2px * var(--k,1));paint-order:stroke}
.ins-card.on{outline:2px solid var(--accent);outline-offset:1px}
/* ══ ONE colour system (owner, 2026-09-26: "color code better all these fields and buttons ... smooth and not aggressive") ══
   Every meaning has ONE token, defined for dark (default), beige light, and the colour-blind switch in each (Colours ->
   "Colour-blind safe", html[data-cvd]). Colour is always a second channel: the word, tag, arrow or icon says it too.
   Colour sits on the data (tinted text, a dot, an icon, a hairline), never in a filled block.
   tests/test_colour_tokens.py resolves the token blocks below and checks every text token at WCAG AA (4.5:1) and every
   mark token at 3:1 on every surface of its theme, in both themes and both colour modes.
   TOKENS-BEGIN */
:root{
  /* money: one hue for prices; against the usual price, muted green / red; cheapest / most expensive marks */
  --c-price:var(--accent);--c-down:#5CC48E;--c-up:#EE8B7E;--c-lo:var(--c-down);--c-hi:var(--c-up);
  /* sell speed (the words Fast / Medium / Slow are always shown) */
  --c-fast:var(--good);--c-mid:var(--warn);--c-slow:var(--bad);
  /* float premium: calm below 1.3x, gold from 1.3x, hot from 2x */
  --c-prem:var(--gold);--c-prem-lo:#C7B283;--c-hot:#F29A62;
  /* freshness of a reading: within 2 days, within 3 weeks, older */
  --c-fresh:#6CCB9C;--c-aging:var(--warn);--c-stale:#EE8B7E;
  /* counts and supply depth (deep / some / thin) */
  --c-count:#B7ACF5;--c-count-2:#A29AD6;
  /* rarity labels: this much of the rarity colour mixed into the ink */
  --rar-mix:55%;
  /* pattern tiers: the chart's diamonds (gold, silver, bronze, plain) */
  --c-tier1:var(--gold);--c-tier2:#C0C7D0;--c-tier3:#C98E57;--c-tier4:var(--ink2);
  /* what a button does (icon tints; the label is always there). Order validated as a set with the dataviz method */
  --f-price:var(--accent);--f-inspect:#E0703E;--f-history:#4A94EA;--f-patterns:var(--gold);--f-compare:#DA6A94;--f-bands:#9C92EC;--f-lab:#E87A7A;
  /* item type (a dot before the word) */
  --t-knives:#9C92EC;--t-gloves:#E0703E;--t-rifles:#4A94EA;--t-snipers:#27AE82;--t-pistols:#D19A2A;--t-smgs:#DA6A94;--t-heavy:#4FA64F;--t-equip:var(--muted);
  /* marketplaces: a quiet brand hairline; the first (primary) one keeps the one strong fill */
  --mk-csfloat:#9FB0CC;--mk-skinport:#E8744A;--mk-dmarket:#2FC7AE;--mk-tradeit:#8C8CF5;--mk-steam:#6FA9DC;
}
html[data-theme="light"]{
  --c-down:#1C6F44;--c-up:#A53A2C;
  --c-prem-lo:#6B5A31;--c-hot:#A4460F;
  --c-fresh:#1C6F44;--c-stale:#A53A2C;
  --c-count:#5845B0;--c-count-2:#5E5496;--rar-mix:40%;
  --c-tier2:#5D6671;--c-tier3:#8A5424;
  --f-inspect:#B8481B;--f-history:#2A6CC4;--f-compare:#B23F6E;--f-bands:#4A3AA7;--f-lab:#B83434;
  --t-knives:#4A3AA7;--t-gloves:#B8481B;--t-rifles:#2A6CC4;--t-snipers:#0E7F58;--t-pistols:#8F6300;--t-smgs:#B23F6E;--t-heavy:#2F7A2F;
  --mk-csfloat:#4A5B78;--mk-skinport:#B8481B;--mk-dmarket:#0E7F6E;--mk-tradeit:#4040C8;--mk-steam:#1B4F80;
}
/* colour-blind safe: green / red pairs become blue / orange, the wear scale becomes blue, cyan, yellow, orange, pink */
html[data-cvd="1"]{
  --good:#6FA3EC;--ok:#6FA3EC;--warn:#E9C65C;--bad:#F0915C;
  --c-down:#6FA3EC;--c-up:#F0915C;--c-fresh:#6FA3EC;--c-stale:#F0915C;--c-hot:#F0915C;
  --fn:#6F9CE6;--mw:#55E1FF;--ft:#EFCA61;--ww:#E08A4E;--bs:#DF9EEE;
}
html[data-theme="light"][data-cvd="1"]{
  --good:#1F56A6;--ok:#1F56A6;--warn:#735600;--bad:#983A0C;
  --c-down:#1F56A6;--c-up:#983A0C;--c-fresh:#1F56A6;--c-stale:#983A0C;--c-hot:#983A0C;
  --fn:#11397B;--mw:#006B8C;--ft:#735600;--ww:#6D2000;--bs:#572263;
}
/* TOKENS-END */

/* money */
.price{color:var(--c-price)}
.cheaper{color:var(--c-down)}.pricier{color:var(--c-up)}
.p-lo,.p-hi{white-space:nowrap}
.p-lo::before,.p-hi::before{content:"";display:inline-block;width:0;height:0;border:4px solid transparent;margin-right:4px;vertical-align:.12em}
.p-lo::before{border-top:6px solid var(--c-lo);border-bottom:0}
.p-hi::before{border-bottom:6px solid var(--c-hi);border-top:0}
/* sell speed */
.spd-fast{color:var(--c-fast)}.spd-mid{color:var(--c-mid)}.spd-slow{color:var(--c-slow)}
.sk-kn dd.spd-fast{color:var(--c-fast)}.sk-kn dd.spd-mid{color:var(--c-mid)}.sk-kn dd.spd-slow{color:var(--c-slow)}
/* float premium scale (the x number says it) */
.prem{color:var(--c-prem)}.prem.c-flat{color:var(--c-prem-lo)}.prem.c-hot{color:var(--c-hot)}
.sk-kn dd.prem.c-hot{color:var(--c-hot)}.sk-kn dd.prem.c-flat{color:var(--c-prem-lo)}
/* wears: a float value or a wear word takes its wear's colour */
.wt-fn{color:var(--fn)}.wt-mw{color:var(--mw)}.wt-ft{color:var(--ft)}.wt-ww{color:var(--ww)}.wt-bs{color:var(--bs)}
[data-w="fn"]{--wc:var(--fn)}[data-w="mw"]{--wc:var(--mw)}[data-w="ft"]{--wc:var(--ft)}[data-w="ww"]{--wc:var(--ww)}[data-w="bs"]{--wc:var(--bs)}
.sk-ro-l b[data-w],.hm-mp-l .mono[data-w],[data-lab-fl][data-w],.fv[data-w]{color:var(--wc)}
.sk-fin[data-w] .input{box-shadow:inset 0 -2px 0 color-mix(in oklab,var(--wc) 80%,transparent);color:var(--wc)}
.sk-fin[data-w] .input:focus{box-shadow:inset 0 -2px 0 var(--wc)}
/* the float range chip: its two ends in their wears' colours, a hairline of the wear scale under it */
.pill.frng{position:relative}
.pill.frng .fe{font-family:var(--mono);font-variant-numeric:tabular-nums}
.pill.frng::after{content:"";position:absolute;left:8px;right:8px;bottom:2px;height:2px;border-radius:1px;opacity:.75;
  background:linear-gradient(90deg,var(--fn) 0 7%,var(--mw) 7% 15%,var(--ft) 15% 38%,var(--ww) 38% 45%,var(--bs) 45% 100%);
  background-size:var(--bw,100%) 100%;background-position:var(--bp,0%) 0;background-repeat:no-repeat}
/* freshness of a reading: a dot and a tinted word */
.pill.age::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.pill.c-fresh{--c:var(--c-fresh);border-color:color-mix(in oklab,var(--c-fresh) 35%,var(--line2))}
.pill.c-dim{--c:var(--c-aging);border-color:color-mix(in oklab,var(--c-aging) 35%,var(--line2))}
.pill.c-bad{--c:var(--c-stale);border-color:color-mix(in oklab,var(--c-stale) 35%,var(--line2))}
.age-old{color:var(--c-aging)}
.fr-fresh{color:var(--c-fresh)}.fr-aging{color:var(--c-aging)}.fr-stale{color:var(--c-stale)}
/* counts and supply depth */
.cnt,b.cnt,.lead b.cnt,.ex-count b.cnt{color:var(--c-count);font-variant-numeric:tabular-nums}
.dep-3{color:var(--c-count)}.dep-2{color:var(--c-count-2)}.dep-1{color:var(--muted)}
/* rarity: the item's rarity colour on its label, its collection chip and its cards */
.rar{color:color-mix(in oklab,var(--rc,var(--ink2)) var(--rar-mix),var(--ink))}
.pill.coll::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--rc,var(--muted));flex:none}
.tile{border-top-color:color-mix(in oklab,var(--rc,var(--line)) 45%,var(--line))}
.tile:hover{border-color:color-mix(in oklab,var(--rc,var(--line2)) 55%,var(--line2))}
.rd{display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--rc,var(--muted));flex:none}
/* pattern tiers */
.t-1{--tc:var(--c-tier1)}.t-2{--tc:var(--c-tier2)}.t-3{--tc:var(--c-tier3)}.t-4{--tc:var(--c-tier4)}
html[data-theme="light"] .t-2{--tc:var(--c-tier2)}html[data-theme="light"] .t-3{--tc:var(--c-tier3)}
/* item type: a dot before the word */
.ty{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.ty::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ty,var(--muted));flex:none}
.ty-knives{--ty:var(--t-knives)}.ty-gloves{--ty:var(--t-gloves)}.ty-rifles{--ty:var(--t-rifles)}.ty-sniper-rifles{--ty:var(--t-snipers)}
.ty-pistols{--ty:var(--t-pistols)}.ty-smgs{--ty:var(--t-smgs)}.ty-shotguns,.ty-machine-guns{--ty:var(--t-heavy)}.ty-equipment{--ty:var(--t-equip)}
/* what a button does: calm icon tints; the lit one takes its own colour as a hairline and a faint wash */
.f-price{--fc:var(--f-price)}.f-inspect{--fc:var(--f-inspect)}.f-history{--fc:var(--f-history)}.f-patterns{--fc:var(--f-patterns)}
.f-compare{--fc:var(--f-compare)}.f-bands{--fc:var(--f-bands)}.f-lab{--fc:var(--f-lab)}
.sk-tb .btn[class*="f-"] svg,.seg>[class*="f-"] svg{color:var(--fc)}
.sk-tb .btn{font-weight:500;transition:border-color .2s var(--ease),background .2s var(--ease),color .2s var(--ease),box-shadow .2s var(--ease)}
.sk-tb .btn[class*="f-"]:hover{border-color:color-mix(in oklab,var(--fc) 45%,var(--line2))}
.sk-tb .btn[aria-current="true"]{border-color:color-mix(in oklab,var(--fc) 70%,var(--line2));background:color-mix(in oklab,var(--fc) 9%,var(--raised));box-shadow:inset 0 -2px 0 var(--fc)}
.sk-tb .btn.buy{color:var(--accent);border-color:var(--accent-line);background:color-mix(in oklab,var(--accent) 8%,var(--raised))}
.sk-tb .btn.buy:hover{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 14%,var(--raised))}
.seg>[class*="f-"][aria-pressed="true"]{box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--fc) 60%,var(--line2))}
/* the details tabs carry the same function colours as the toolbar: a small dot, the open one underlined in it */
.tabs [data-tab]{--fc:var(--accent)}
.tabs [data-tab="history"]{--fc:var(--f-history)}.tabs [data-tab="cliffs"]{--fc:var(--c-prem)}.tabs [data-tab="patterns"]{--fc:var(--f-patterns)}
.tabs [data-tab="compare"]{--fc:var(--f-compare)}.tabs [data-tab="bands"]{--fc:var(--f-bands)}.tabs [data-tab="faq"]{--fc:var(--ref)}
.tabs [data-tab]::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--fc);flex:none;opacity:.85}
.tabs>[data-tab][aria-selected="true"]::after{background:var(--fc)}
/* previous / next skin: the neighbour's rarity square */
.sk-pn a .rd{margin:0 1px}
/* header: search, Colours (a square per wear), Guide */
.hdr-search svg,.icon-btn.search svg{color:var(--accent)}
.hdr-guide[data-legend] svg rect:nth-child(1){stroke:var(--fn)}.hdr-guide[data-legend] svg rect:nth-child(2){stroke:var(--ft)}
.hdr-guide[data-legend] svg rect:nth-child(3){stroke:var(--ww)}.hdr-guide[data-legend] svg rect:nth-child(4){stroke:var(--bs)}
.hdr-guide[data-guide] svg{color:var(--ref)}
html[data-cvd="1"] .hdr-guide[data-legend]{border-color:color-mix(in oklab,var(--accent) 45%,var(--line2))}
/* marketplaces: a quiet brand hairline on the left, the brand's colour on hover */
.mkt[data-go="csfloat"]{--mk:var(--mk-csfloat)}.mkt[data-go="skinport"]{--mk:var(--mk-skinport)}.mkt[data-go="dmarket"]{--mk:var(--mk-dmarket)}
.mkt[data-go="tradeit"]{--mk:var(--mk-tradeit)}.mkt[data-go="steam"]{--mk:var(--mk-steam)}
.mkt:not(.first){box-shadow:inset 2px 0 0 color-mix(in oklab,var(--mk,var(--line2)) 80%,transparent)}
.mkt:not(.first):hover{border-color:color-mix(in oklab,var(--mk,var(--muted)) 60%,var(--line2))}
.mkt:not(.first) .go{color:color-mix(in oklab,var(--mk,var(--muted)) 70%,var(--muted))}
/* breadcrumbs: a dot in the section's colour */
.crumbs a[href^="/weapons"]::before,.crumbs a[href^="/knives"]::before,.crumbs a[href^="/gloves"]::before,.crumbs a[href^="/stickers"]::before,
.crumbs a[href^="/patterns"]::before,.crumbs a[href^="/explore"]::before,.crumbs a[href^="/collections"]::before,.crumbs a[href^="/lab"]::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--sc,var(--muted));margin-right:6px;vertical-align:.1em}
.crumbs a[href^="/weapons"]{--sc:var(--t-rifles)}.crumbs a[href^="/knives"]{--sc:var(--t-knives)}.crumbs a[href^="/gloves"]{--sc:var(--t-gloves)}
.crumbs a[href^="/stickers"]{--sc:var(--f-compare)}.crumbs a[href^="/patterns"]{--sc:var(--f-patterns)}.crumbs a[href^="/explore"]{--sc:var(--accent)}
.crumbs a[href^="/collections"]{--sc:var(--ref)}.crumbs a[href^="/lab"]{--sc:var(--f-lab)}
.crumbs a[href^="/weapons/"]::before,.crumbs a[href^="/stickers/"]::before,.crumbs a[href^="/patterns/"]::before,.crumbs a[href^="/collections/"]::before{display:none}
/* the explore line and presets: each word and chip in the colour of the column it matches */
.k-price{color:var(--c-price)}.k-fast{color:var(--c-fast)}.k-prem{color:var(--c-prem)}
.term.k-price,.term.k-fast,.term.k-prem{text-decoration-color:currentColor}
.chip.kd::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--kd,var(--accent));flex:none}
.kd-all{--kd:var(--accent)}.kd-knives{--kd:var(--t-knives)}.kd-gloves{--kd:var(--t-gloves)}.kd-fast{--kd:var(--c-fast)}.kd-prem{--kd:var(--c-prem)}
.chip.kd[aria-pressed="true"]{border-color:color-mix(in oklab,var(--kd) 70%,var(--line2));box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--kd) 70%,var(--line2))}
#ex-more svg{color:var(--accent)}
#ex-nf:not(:empty){color:var(--accent);font-weight:500}
#ex-mode [data-mode="table"]{--fc:var(--f-bands)}#ex-mode [data-mode="scatter"]{--fc:var(--f-history)}#ex-mode [data-mode="grid"]{--fc:var(--f-inspect)}
#ex-mode [data-mode] svg{color:var(--fc)}
#ex-mode [data-mode][aria-pressed="true"]{box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--fc) 60%,var(--line2)),inset 0 -2px 0 var(--fc)}
/* ticker: the price range in the price colour, the multiplier on the premium scale */
.ticker-run .rng{color:var(--c-price)}
/* the Colours panel: class swatches (no inline colours) and the colour-blind switch */
.lg-sw.sw-fn{background:var(--fn)}.lg-sw.sw-mw{background:var(--mw)}.lg-sw.sw-ft{background:var(--ft)}.lg-sw.sw-ww{background:var(--ww)}.lg-sw.sw-bs{background:var(--bs)}
.lg-sw.sw-t1{background:var(--c-tier1)}.lg-sw.sw-t2{background:var(--c-tier2)}.lg-sw.sw-t3{background:var(--c-tier3)}
.lg-sw[class*="rc-"]{background:var(--rc)}
.lg-sw.sw-ty{border-radius:50%;background:var(--ty)}
.lg-cvd{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;padding:10px 12px;margin:4px 0 12px;border:1px solid var(--line2);border-radius:3px}
.lg-cvd p{margin:0;color:var(--muted);font-size:13px;flex:1 1 220px}
.chart-svg text.ax-prem{fill:var(--c-prem)}.chart-svg text.ax-spd{fill:var(--c-fast)}
/* home demo: the item picture fills the top-right of the card at a size worth looking at (owner, 2026-09-26). The card is a
   grid: words and the skin switch on the left, the picture beside both on the right, the chart under them; the picture's
   box keeps its 4:3 shape so switching the demo skin never moves anything */
.hm-mp{container-type:inline-size;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"txt art" "seg art" "body body";column-gap:16px}
.hm-mp>.demo.on:not([data-demo-body]),.hm-mp>.demo.on:not([data-demo-body])>.hm-mp-top{display:contents}
.hm-mp-top>div:first-child{grid-area:txt;min-width:0}
.hm-mp>.seg{grid-area:seg;align-self:end;justify-self:start}
.hm-mp>[data-demo-body]{grid-area:body;min-width:0}
.hm-mp-art{grid-area:art;align-self:center;width:clamp(150px,32cqw,250px);height:auto;aspect-ratio:4/3;margin:0}
.hm-mp-art .pic img{width:100%;height:100%;object-fit:contain}
@media (max-width:720px){.hm-mp{grid-template-areas:"txt art" "seg seg" "body body"}.hm-mp-art{width:clamp(112px,36cqw,170px);align-self:start}}
/* words inside the facts line and the key numbers keep their meaning's colour over the plain ink */
.sk-ans b.price{color:var(--c-price)}.sk-ans b.spd-fast{color:var(--c-fast)}.sk-ans b.spd-mid{color:var(--c-mid)}.sk-ans b.spd-slow{color:var(--c-slow)}
.sk-kn dd.dep-3{color:var(--c-count)}.sk-kn dd.dep-2{color:var(--c-count-2)}.sk-kn dd.dep-1{color:var(--ink2)}
.lead b.price{color:var(--c-price)}.lead b.prem{color:var(--c-prem)}.lead b.prem.c-hot{color:var(--c-hot)}.lead b.prem.c-flat{color:var(--c-prem-lo)}
