/* PayoutScore (owner 2026-10-11). Laid out like Mobbin's web app and Reddit; coloured and styled like the Vxe.io shot the
   owner loves (dribbble.com/shots/27706439): dark by default, a near-black ground, layered charcoal cards with a soft top
   highlight, coral-orange for active states, lime for live and paid, a lime-to-orange gradient on the main button, a
   glow bar on feature cards. Inter Tight, the WhitePips font (owner 2026-10-11), light weights: 400 text, 500 labels,
   600 headings.
   Custom dropdowns (ui.js). Icons are 1px strokes with sharp corners (Lucide). Motion is short and soft. */
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-tight-v9-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/inter-tight-v9-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  color-scheme:light;
  --bg:#F4F5F4; --elev:#FFFFFF; --tile:#FFFFFF; --tile-2:#EEF0EF; --field:#EEF0EF; --hover:rgba(0,0,0,.03);
  --inner:rgba(0,0,0,.05); --inner-2:rgba(0,0,0,.09); --line:#E3E6E4; --line-2:#D2D7D4; --dash:#B9C0BC;
  --label:#0C0F0E; --label-2:#4F5753; --label-3:#858D89;
  --ink:#004225; --ink-hi:#0A5634; --on-ink:#FFFFFF; --ink-text:#0B5A36; --ink-soft:rgba(0,66,37,.08);
  --card:#FFFFFF; --card-hl:none;
  --stroke:linear-gradient(180deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.05) 100%);
  --sel:#FFFFFF; --sel-ink:#0C0F0E; --sel-shadow:0 1px 3px rgba(0,0,0,.1),0 0 0 .5px rgba(0,0,0,.06);
  --pop:0 24px 60px -16px rgba(0,0,0,.22),0 0 0 1px rgba(0,0,0,.06);
  --paid:#0E7A45; --caution:#B26A00; --refused:#C9343A; --gold:#A8822C;
  --logo-a:#004225; --logo-b:#2E8B57;
  --font:"Inter Tight",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --gap:14px; --hdr:72px; --pill:999px; --minw:360px; --maxw:1320px; --pad:20px; --ease:cubic-bezier(.2,.8,.2,1);
  /* older names the components still use */
  --panel:var(--field); --card-2:var(--tile-2); --card-grad:var(--card); --card-edge:var(--card-hl);
  --accent:var(--ink); --accent-hi:var(--ink-hi); --accent-text:var(--label);
  --text:var(--label); --text-2:var(--label-2); --text-3:var(--label-3); --good:var(--paid); --warn:var(--caution); --bad:var(--refused);
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0A0B0B; --elev:#161818; --tile:#151717; --tile-2:#212423; --field:#0E0F0F; --hover:rgba(255,255,255,.035);
  --inner:rgba(255,255,255,.06); --inner-2:rgba(255,255,255,.1); --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.12); --dash:rgba(255,255,255,.22);
  --label:#F4F6F5; --label-2:#A7AEAA; --label-3:#6F7773;
  --ink:#0B4D2E; --ink-hi:#0F5C38; --on-ink:#FFFFFF; --ink-text:#5BB487; --ink-soft:rgba(11,77,46,.35);
  --card:#151716; --card-hl:none;
  --stroke:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.07) 30%,rgba(255,255,255,.03) 100%);
  --sel:#2C302E; --sel-ink:#FFFFFF; --sel-shadow:none;
  --pop:0 24px 60px -16px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.07);
  --paid:#56BC8A; --caution:#E9B04A; --refused:#F06A5F; --gold:#D9B45E;
  --logo-a:#17663F; --logo-b:#6DBE95;
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{margin:0;min-width:var(--minw);min-height:100vh;background:var(--bg);color:var(--label);font:400 15px/1.5 var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4,p{margin:0}
:focus-visible{outline:2px solid var(--label);outline-offset:2px}
::selection{background:rgba(0,66,37,.18)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ic{width:18px;height:18px;flex:none;display:inline-block}
.ic *{vector-effect:non-scaling-stroke}
.pos{color:var(--paid)} .neg{color:var(--refused)} .dim{color:var(--label-3)}

/* top bar: logo, text tabs, centred search, icon buttons, outlined pill, avatar menu */
/* page width: never narrower than --minw, never wider than --maxw (owner 2026-10-11); the top bar lines up with it */
.hdr{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:28px;height:var(--hdr);padding:0 max(var(--pad),calc((100% - var(--maxw)) / 2 + var(--pad)));background:var(--bg)}
.brand{display:flex;align-items:center;gap:10px;flex:none;font-weight:600;font-size:19.5px;letter-spacing:-.01em}
.brand svg{width:30px;height:30px;flex:none}
.tabs-top{display:flex;gap:22px;flex:none}
.tabs-top a,.menu-nav a{font-size:16px;font-weight:600;color:var(--label-3);white-space:nowrap}
.tabs-top a:hover,.tabs-top a[aria-current="page"],.menu-nav a[aria-current="page"]{color:var(--label)}
.search{flex:1 1 auto;max-width:560px;margin:0 auto;display:flex;align-items:center;gap:12px;height:46px;padding:0 12px 0 18px;border-radius:var(--pill);background:var(--field);color:var(--label)}
.search:focus-within{box-shadow:0 0 0 1px var(--line-2),0 0 0 4px var(--inner)}
.search .ic{width:19px;height:19px}
.search input{flex:1;min-width:0;border:0;background:none;color:var(--label);font-size:15.5px;outline:none}
.search input::placeholder{color:var(--label-3)}
.search kbd{font:500 12px var(--font);color:var(--label-3);border:1px solid var(--line-2);border-radius:7px;padding:1px 7px}
.hdr-end{display:flex;align-items:center;gap:6px;flex:none}
.icon-btn{position:relative;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:0;background:none;color:var(--label)}
.icon-btn:hover{background:var(--tile)}
.icon-btn .ic{width:21px;height:21px}
.icon-btn b{position:absolute;top:3px;right:2px;min-width:17px;height:17px;padding:0 5px;border-radius:var(--pill);background:var(--ink);color:var(--on-ink);font-size:10.5px;display:grid;place-items:center}
.icon-btn b[hidden]{display:none}
.hdr-cta{margin:0 6px}
.me-wrap{position:relative}
.me{width:40px;height:40px;border-radius:50%;padding:0;border:0;background:var(--tile);box-shadow:0 0 0 1px var(--line);overflow:hidden}
.me svg{width:100%;height:100%;display:block}
.menu{position:absolute;right:0;top:calc(100% + 10px);z-index:90;width:300px;padding:8px 0;border-radius:24px;background:var(--elev);box-shadow:var(--pop);
  opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top right;transition:opacity .18s var(--ease),transform .18s var(--ease)}
.menu.open{opacity:1;transform:none}
.menu-who{display:grid;gap:2px;padding:12px 20px 14px}
.menu-who b{font-size:16px;font-weight:600}
.menu-who span{font-size:14px;color:var(--label-2);margin-bottom:10px}
.menu-nav{display:none}
.menu-sec,.menu-theme,.menu-foot{border-top:1px solid var(--line)}
.menu-sec{display:grid;padding:6px 0}
.menu-sec > a,.menu-sec > button{display:flex;align-items:center;gap:12px;height:44px;padding:0 20px;border:0;background:none;font-size:15.5px;color:var(--label);text-align:left}
.menu-sec > a:hover,.menu-sec > button:hover{background:var(--tile)}
.menu-sec .ic{width:20px;height:20px}
.menu-sec em{margin-left:auto;font-style:normal;color:var(--label-2);font-variant-numeric:tabular-nums}
.menu-theme{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px;font-size:15.5px}
.theme-seg{display:flex;gap:2px;padding:3px;border-radius:var(--pill);background:var(--field)}
.theme-seg button{width:34px;height:30px;border:0;border-radius:var(--pill);background:none;color:var(--label-3);display:grid;place-items:center}
.theme-seg button .ic{width:17px;height:17px}
.theme-seg button[aria-pressed="true"]{background:var(--sel);color:var(--sel-ink);box-shadow:var(--sel-shadow)}
.menu-foot{display:flex;gap:16px;padding:12px 20px 6px;font-size:13px;color:var(--label-3)}
.menu-foot a:hover{color:var(--label)}
.live-dot{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--paid)}
.live-dot::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 25%,transparent)}
.content{display:block;min-width:0;max-width:var(--maxw);margin:0 auto;padding:8px var(--pad) 0;animation:rise .35s var(--ease) both}
.foot{max-width:var(--maxw);margin:56px auto 0;padding:26px var(--pad) 40px;border-top:1px solid var(--line);font-size:13px;color:var(--label-3);display:grid;gap:6px}
.foot nav{display:flex;flex-wrap:wrap;gap:6px 20px;margin-bottom:8px}
.foot nav a{color:var(--label-2);font-weight:500} .foot nav a:hover{color:var(--label)}
.foot b{color:var(--label-2)}

/* buttons: black pills (white in dark), outlined pills, soft grey pills */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 22px;border-radius:var(--pill);border:0;font-size:15px;font-weight:600;white-space:nowrap}
.btn .ic{width:16px;height:16px}
.btn-primary{background:var(--ink);color:var(--on-ink)}
.btn-primary:hover{background:var(--ink-hi)}
.btn-line,.btn-dark,.btn-ghost{background:var(--elev);color:var(--label);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn-line:hover,.btn-dark:hover,.btn-ghost:hover{background:var(--tile)}
.btn-ghost[aria-pressed="true"]{background:var(--ink);color:var(--on-ink);box-shadow:none}
.btn-soft{background:var(--field);color:var(--label)}
.btn-soft:hover{background:var(--tile-2)}
.btn-sm{height:38px;padding:0 18px;font-size:14px}
.btn-sm .ic{width:14px;height:14px}
.btn-block{width:100%}
.btn[aria-disabled="true"]{opacity:.4;pointer-events:none}
.link{color:var(--label);font-size:14.5px;font-weight:600;white-space:nowrap}
.link:hover{text-decoration:underline;text-underline-offset:3px}

/* home: Mobbin's browse columns, then the board */
.home{display:grid;grid-template-columns:minmax(0,1fr);gap:40px}

.sec-h{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.sec-h h2{font-size:24px;font-weight:600;letter-spacing:-.01em}

/* the board: segmented view toggle, underlined market tabs, sort, filter */
.board{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;scroll-margin-top:calc(var(--hdr) + 12px)}

.ttabs{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none;min-width:0}
.ttabs::-webkit-scrollbar{display:none}
.ttabs button{height:40px;padding:0;border:0;background:none;font-size:17px;font-weight:600;color:var(--label-3);white-space:nowrap;box-shadow:inset 0 -2px 0 transparent}
.ttabs button:hover{color:var(--label-2)}
.ttabs button[aria-pressed="true"]{color:var(--label);box-shadow:inset 0 -2px 0 var(--ink)}

.sel{position:relative;display:flex;align-items:center}

.c-cmp{width:42px;padding-left:14px!important}
.cmp{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--dash);background:none;display:grid;place-items:center;color:transparent;padding:0}
.cmp .ic{width:14px;height:14px}
.cmp:hover{border-color:var(--label-2)}
.cmp[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
.firm-cell{display:flex;align-items:center;gap:12px;min-width:190px}
.firm-cell b{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em}
.firm-cell small{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--label-3);margin-top:1px}
.firm-cell small em{font-style:normal;color:var(--label);font-weight:600}
.firm-cell:hover b{text-decoration:underline;text-underline-offset:3px}
.chip{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:var(--pill);background:var(--inner);font-size:12.5px;color:var(--label-2);margin:1px 4px 1px 0}
.cc{display:inline-flex;align-items:center;gap:6px}
.cc span{display:inline-grid;place-items:center;height:22px;padding:0 8px;border-radius:var(--pill);background:var(--inner);font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--label-2)}
.code{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;border-radius:var(--pill);border:1px dashed var(--dash);background:none;color:var(--label);font-size:13px;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.code b{color:var(--paid);font-weight:600}
.code .ic{width:14px;height:14px;color:var(--label-3)}
.code:hover{border-color:var(--accent-text)}
.c-act{text-align:right;padding-right:16px!important}

.step{display:inline-flex;align-items:center;height:22px;padding:0 9px;margin-left:6px;border-radius:var(--pill);background:var(--inner);font-size:12px;color:var(--label-2)}
.price s{color:var(--label-3);font-size:12.5px;margin-right:6px}
.price b{font-size:15px;font-weight:600}
.sub{display:block;font-size:12px;color:var(--label-3)}

.det-links{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}

.empty{padding:40px 16px;text-align:center;color:var(--label-3)}

.offer{display:grid;gap:14px}

/* firm logos, scores, stars */
.fi{--s:40px;position:relative;width:var(--s);height:var(--s);flex:none;display:grid;place-items:center;overflow:hidden;border-radius:30%;
  background:radial-gradient(120% 90% at 20% 0%,hsl(var(--h) 70% 66% / .9),transparent 60%),linear-gradient(150deg,hsl(var(--h) 58% 46%),hsl(var(--h) 62% 27%));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),inset 0 -6px 12px -6px rgba(0,0,0,.35),0 3px 8px -4px hsl(var(--h) 60% 25% / .55)}
.fi::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.22),transparent 46%);pointer-events:none}
.fi svg{position:relative;z-index:1;width:54%;height:54%;color:#fff;filter:drop-shadow(0 1px 1px rgba(0,0,0,.28))}
.fi.xs{--s:22px} .fi.sm{--s:30px} .fi.md{--s:38px} .fi.lg{--s:56px} .fi.xl{--s:76px}
.score{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:26px;padding:0 9px;border-radius:var(--pill);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--tone);background:color-mix(in srgb,var(--tone) 15%,transparent)}
.tone-good{--tone:var(--paid)} .tone-warn{--tone:var(--caution)} .tone-bad{--tone:var(--refused)}
.stars{display:inline-flex;gap:1px;color:var(--gold);vertical-align:-1px}
.stars svg{width:12px;height:12px}
.stars .off{color:var(--line-2)}
.tag{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 9px;border-radius:var(--pill);font-size:11.5px;font-weight:600;color:var(--tone,var(--label-2));background:color-mix(in srgb,var(--tone,#8E8E93) 15%,transparent);white-space:nowrap}
.tag .ic{width:11px;height:11px}
.avatar{--s:28px;width:var(--s);height:var(--s);flex:none;display:block;border-radius:50%}
.avatar.xs{--s:20px} .avatar.sm{--s:28px} .avatar.md{--s:38px} .avatar.lg{--s:56px} .avatar.xl{--s:76px}

/* live payouts, rule changes, community */
.duo{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:start}
.card{border-radius:24px;background:var(--elev);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}

.chg{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;padding:13px 16px;border-top:1px solid var(--line)}
.chg:first-child{border-top:0}
.chg p{font-size:14px;color:var(--label)}
.chg small{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:12.5px;color:var(--label-3)}
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.post{display:grid;gap:10px;align-content:start;padding:18px;border-radius:22px;background:var(--card-grad);box-shadow:var(--card-edge)}
.post:hover{background:var(--tile-2)}
.post-h{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--label-3);min-width:0}
.post-h b{color:var(--label);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.post h3{font-size:15.5px;font-weight:600;line-height:1.35;letter-spacing:-.01em}
.post-f{display:flex;gap:14px;font-size:13px;color:var(--label-3)}
.post-f span{display:flex;align-items:center;gap:5px}
.post-f .ic{width:15px;height:15px}

/* compare bar */
.cmp-bar{position:sticky;bottom:18px;z-index:40;justify-self:center;width:min(760px,100%);display:flex;align-items:center;gap:12px;padding:8px 8px 8px 22px;border-radius:var(--pill);background:#0B2318;color:#fff;box-shadow:0 20px 50px -16px rgba(0,40,20,.5),0 0 0 1px rgba(255,255,255,.08)}
.cmp-bar[hidden]{display:none}
.cb-l b{display:block;font-size:14.5px;font-weight:600}
.cb-l span{font-size:12.5px;color:rgba(255,255,255,.55)}
.cb-firms{display:flex;gap:6px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}
.cb-f{display:flex;align-items:center;gap:8px;height:38px;padding:0 6px 0 8px;border-radius:var(--pill);background:rgba(255,255,255,.1);font-size:13.5px;font-weight:500;white-space:nowrap}
.cb-f button{width:26px;height:26px;border:0;border-radius:50%;background:none;color:rgba(255,255,255,.6);display:grid;place-items:center;padding:0}
.cb-f button:hover{color:#fff;background:rgba(255,255,255,.12)}
.cb-f .ic{width:13px;height:13px}
.cb-clear{border:0;background:none;color:rgba(255,255,255,.7);font-size:13.5px;font-weight:500;padding:6px}
.cb-clear:hover{color:#fff}
.cmp-bar .btn-primary{background:#fff;color:#004225}
.cmp-bar .btn-primary:hover{background:#E6EFE9}

.toast{position:fixed;left:50%;bottom:calc(92px + env(safe-area-inset-bottom,0px));transform:translate(-50%,12px);opacity:0;z-index:95;background:var(--ink);color:var(--on-ink);font-size:14px;font-weight:600;padding:12px 20px;border-radius:var(--pill);box-shadow:0 20px 50px -20px rgba(0,0,0,.9);transition:opacity .25s var(--ease),transform .25s var(--ease);pointer-events:none;max-width:calc(100% - 32px);text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ---------- inner pages (firm, community, payouts, compare, rule changes, docs) ---------- */
.wrap{min-width:0}
.mono,.num{font-variant-numeric:tabular-nums}
.muted{color:var(--label-3)}
.ic-sm{width:14px;height:14px}
.sec{padding-block:26px}
.sec-tight{padding-block:26px}
.page-head{position:relative;padding:28px 0 12px}
.page-head .wrap{display:grid;gap:12px}
.page-head h1{font-size:clamp(32px,3.6vw,48px);font-weight:600;letter-spacing:-.01em;line-height:1.05}
.page-head .lede{color:var(--label-2);font-size:16px;max-width:66ch}
.eyebrow,.label{font-size:14px;font-weight:500;color:var(--label-2)}
.crumbs{display:flex;gap:8px;font-size:13.5px;color:var(--label-3)} .crumbs a:hover{color:var(--label)}
.sec-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:14px 28px;margin-bottom:16px}
.sec-head > div{display:grid;gap:6px;max-width:700px}
.sec-head h2{font-size:22px;font-weight:600;letter-spacing:-.01em;line-height:1.2}
.sec-head p{color:var(--label-2);font-size:14.5px}
.box{background:var(--tile);border-radius:24px}
.card-pad{padding:20px}
.grid-2{display:grid;gap:20px}
@media (min-width:1100px){ .grid-2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} }
.hint{font-size:13px;color:var(--label-3)}
.btn-lg{height:52px;padding:0 28px;font-size:15.5px;border-radius:var(--pill)}
.link{display:inline-flex;align-items:center;gap:6px}
.badge{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:var(--pill);font-size:12px;font-weight:600;white-space:nowrap;color:var(--tone,var(--label-2));background:color-mix(in srgb,var(--tone,#8E8E93) 14%,transparent)}
.badge .ic{width:13px;height:13px}
.t-good{--tone:var(--paid)} .t-warn{--tone:var(--caution)} .t-bad{--tone:var(--refused)} .t-accent{--tone:var(--accent-text)} .t-plain{--tone:var(--label-2)}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tags .tag{height:26px;padding:0 11px;font-size:12.5px;font-weight:500;border-radius:var(--pill)}
.code em{font-style:normal;color:var(--paid);font-weight:600}
.code[data-done]{border-color:var(--paid);border-style:solid}
.nocode{font-size:13px;color:var(--label-3)}
.ring{--s:44px;position:relative;width:var(--s);height:var(--s);display:inline-grid;place-items:center;flex:none}
.ring svg{position:absolute;inset:0;width:100%;height:100%}
.ring .bg{stroke:var(--line-2)}
.ring .fg{stroke:var(--tone)}
.ring b{position:relative;font-size:calc(var(--s)*.33);font-weight:600;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.ring small{display:block;font-size:calc(var(--s)*.09);font-weight:600;color:var(--label-3);margin-top:4px;text-align:center}
.ring-good{--tone:var(--paid)} .ring-warn{--tone:var(--caution)} .ring-bad{--tone:var(--refused)}

/* forms */
.field{display:grid;gap:7px;min-width:0}
.field > span,.field > label{font-size:14px;font-weight:500;color:var(--label-2);display:flex;justify-content:space-between;gap:8px}
.field output{font-size:13px;font-weight:600;color:var(--label);letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums}
.input,.field select,.field textarea,.composer select,.composer textarea,.reply textarea{width:100%;height:44px;border:1px solid var(--line-2);border-radius:var(--pill);background:var(--bg);padding:0 16px;color:var(--label);font-size:14.5px}
.field textarea,.composer textarea,.reply textarea{height:auto;min-height:96px;padding:12px 16px;border-radius:20px;resize:vertical;line-height:1.5}
.input::placeholder,textarea::placeholder{color:var(--label-3)}
.input:focus,.field select:focus,.field textarea:focus,.composer select:focus,.composer textarea:focus,.reply textarea:focus{outline:none;border-color:var(--label-3);box-shadow:0 0 0 3px var(--inner)}
.field select,.composer select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:34px;background-repeat:no-repeat;background-position:right 12px center;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 256 256' fill='%2371757D'%3E%3Cpath d='M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z'/%3E%3C/svg%3E")}
input[type=range]{width:100%;accent-color:var(--accent)}
input[type=checkbox],input[type=radio]{accent-color:var(--accent)}
.filters{display:grid;gap:14px 16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));align-items:end;padding:18px;border-radius:22px;background:var(--card-grad);box-shadow:var(--card-edge);margin-bottom:14px}
.toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:14px}
.count{font-size:13.5px;color:var(--label-3)}
.err{color:var(--refused);font-size:13px}
.form-msg{font-size:14px;color:var(--label-2);min-height:1.2em}
.seg{display:inline-flex;flex-wrap:wrap;gap:2px;padding:4px;border-radius:var(--pill);background:var(--field)}
.seg button,.seg label{position:relative;display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 16px;border-radius:var(--pill);border:0;background:none;color:var(--label-3);font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg [aria-pressed="true"],.seg [aria-selected="true"],.seg label:has(input:checked){background:var(--sel);color:var(--sel-ink);box-shadow:var(--sel-shadow)}
.seg label:has(input:focus-visible){outline:2px solid var(--accent-text)}
.seg small{font-size:12px;color:var(--label-3);font-variant-numeric:tabular-nums}

/* tables */
.table-wrap{position:relative;overflow-x:auto;border-radius:24px;background:var(--elev);box-shadow:inset 0 0 0 1px var(--line);scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
.t{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:14px}
.t th{text-align:left;font-size:12.5px;font-weight:500;color:var(--label-3);padding:13px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.t th.n,.t td.n{text-align:right}
.t td{padding:13px 14px;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:middle}
.t tbody tr:last-child td{border-bottom:0}
.t tbody tr:hover td{background:var(--hover)}
.t .sub{display:block;font-size:12px;color:var(--label-3);margin-top:2px}
.t .strike{color:var(--label-3);text-decoration:line-through;font-size:12.5px;margin-right:6px}
.t .price{font-weight:600;font-size:15px}
.fc{display:flex;align-items:center;gap:12px;min-width:0}
.fc b,.fc a.fn{display:block;font-weight:600;font-size:14.5px;color:var(--label)}
.fc a.fn:hover{text-decoration:underline;text-underline-offset:3px}
.fc small{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--label-3)}
.more-row{display:flex;justify-content:center;margin-top:16px}

/* firm profile */
.prof{display:grid;gap:24px;align-items:start}
@media (min-width:1180px){ .prof{grid-template-columns:minmax(0,1fr) 360px} }
.prof-id{display:grid;gap:22px;justify-items:start}
.prof-id h1{font-size:clamp(34px,4vw,52px);letter-spacing:-.01em;line-height:1.04}
.prof-meta{display:flex;flex-wrap:wrap;gap:16px 44px;margin-top:20px}
.prof-meta div{display:grid;gap:4px}
.prof-meta span{font-size:14px;color:var(--label-2)}
.prof-meta b{display:flex;align-items:center;gap:6px;font-size:16px;font-weight:500}
.prof-meta .ic{width:16px;height:16px}
.prof-sum{color:var(--label-2);font-size:15.5px;max-width:64ch}
.scorecard{display:grid;gap:16px;padding:22px;background:var(--tile)!important;box-shadow:none!important}
.scorecard-top{display:flex;align-items:center;gap:18px}
.statgrid{display:grid;grid-template-columns:1fr 1fr;margin:0;border-top:1px solid var(--line)}
.statgrid div{padding:12px 0;border-bottom:1px solid var(--line)}
.statgrid div:nth-child(odd){padding-right:12px;border-right:1px solid var(--line)}
.statgrid div:nth-child(even){padding-left:14px}
.statgrid dt{font-size:12px;color:var(--label-3)}
.statgrid dd{margin:4px 0 0;font-size:17px;font-weight:600;font-variant-numeric:tabular-nums}
.tabs{position:sticky;top:var(--hdr);z-index:30;margin:24px calc(var(--pad) * -1) 0;padding:0 var(--pad);background:var(--bg);border-bottom:1px solid var(--line)}
.tabs .wrap{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.tabs a{padding:14px 0;margin-right:26px;font-size:16px;font-weight:600;color:var(--label-3);border-bottom:2px solid transparent;white-space:nowrap}
.tabs a:hover{color:var(--label)}
.tabs a.on{color:var(--label);border-bottom-color:var(--label)}
.anchor{scroll-margin-top:calc(var(--hdr) + 64px)}
.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));margin:0;border-radius:18px;background:var(--bg);overflow:hidden}
.rules div{padding:14px 16px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.rules dt{font-size:12px;color:var(--label-3)}
.rules dd{margin:5px 0 0;font-size:14px;font-weight:500}
.factor{display:grid;gap:8px;padding:14px 0;border-bottom:1px solid var(--line)}
.factor:last-child{border-bottom:0}
.factor-top{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.factor-top b{font-weight:600;font-size:14.5px}
.factor-top span{font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums}
.factor p{font-size:13px;color:var(--label-3)}
.bar{height:8px;border-radius:99px;background:var(--line);overflow:hidden}
.bar i{display:block;height:100%;border-radius:99px;background:var(--accent-text);transition:width .5s cubic-bezier(.2,.8,.2,1)}
.formula,.eq{font:500 13px/1.8 ui-monospace,"SF Mono",SFMono-Regular,Menlo,monospace;color:var(--label-2);padding:16px 18px;border-radius:18px;background:var(--bg);white-space:pre-wrap;overflow-x:auto}
.formula b,.eq b{color:var(--label)}
.eq{white-space:pre-wrap;color:var(--label);background:var(--tile)}
.review{display:grid;gap:6px;padding:14px 0;border-bottom:1px solid var(--line)}
.review:first-child{padding-top:0}
.review:last-child{border-bottom:0;padding-bottom:0}
.review-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--label-3)}
.review p{font-size:14.5px;color:var(--label-2)}
.changes{list-style:none;margin:0;padding:0}
.changes li{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:4px 16px;align-items:start;padding:14px 0;border-bottom:1px solid var(--line)}
.changes li:first-child{padding-top:4px}
.changes li:last-child{border-bottom:0}
.changes time{font-size:13px;color:var(--label-3);padding-top:2px;font-variant-numeric:tabular-nums}
.changes .what{display:block;color:var(--label-2);font-size:14px;margin-top:2px}
.changes a.fn{font-weight:600;font-size:14px}
.changes a.fn:hover{text-decoration:underline;text-underline-offset:3px}
.month{font-size:12px;font-weight:600;color:var(--label-3);padding:22px 0 4px}
.hist{display:grid;gap:10px}
.hist-plot{position:relative;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:8px;align-items:end;height:170px;border-bottom:1px solid var(--line-2)}
.hist-bar{position:relative;height:100%;display:flex;align-items:flex-end;justify-content:center;outline:none}
.hist-bar i{display:block;width:100%;max-width:44px;min-height:2px;border-radius:6px 6px 0 0;background:var(--accent-text)}
.hist-bar.bad i{background:var(--refused)}
.hist-bar span{position:absolute;bottom:calc(var(--h) + 6px);font-size:12.5px;font-weight:600;color:var(--label-2)}
.hist-bar:hover i,.hist-bar:focus-visible i{filter:brightness(1.2)}
.hist-x{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:8px;font-size:11.5px;color:var(--label-3);text-align:center}
.tip{position:absolute;z-index:5;pointer-events:none;background:var(--ink);color:var(--on-ink);font-size:12.5px;font-weight:600;padding:6px 11px;border-radius:var(--pill);white-space:nowrap;transform:translate(-50%,-100%)}
.fgrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.fcard{display:grid;gap:16px;padding:20px;border-radius:22px;background:var(--card-grad);box-shadow:var(--card-edge);align-content:start}
.fcard-top{display:flex;gap:12px;align-items:center}
.fcard-top div{flex:1;min-width:0}
.fcard-top h3{font-size:16px;font-weight:600} .fcard-top h3 a:hover{text-decoration:underline;text-underline-offset:3px}
.fcard-top p{font-size:13px;color:var(--label-3);margin-top:2px}
.fstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;border-radius:18px;background:var(--bg)}
.fstats div{padding:10px 12px;min-width:0}
.fstats div + div{border-left:1px solid var(--line)}
.fstats dt{font-size:11.5px;color:var(--label-3)}
.fstats dd{margin:4px 0 0;font-weight:600;font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
.fcard-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}

/* payout proof cards */
.proofs{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));align-items:start}
.proof{display:grid;gap:14px;padding:20px;border-radius:22px;background:var(--card-grad);box-shadow:var(--card-edge)}
.proof-top{display:flex;align-items:center;gap:10px}
.proof-top div{min-width:0;flex:1}
.proof-top b{display:block;font-weight:600;font-size:14.5px}
.proof-top small{font-size:12.5px;color:var(--label-3)}
.proof-amt{font-size:30px;font-weight:600;letter-spacing:-.01em;line-height:1;font-variant-numeric:tabular-nums}
.proof-amt small{display:block;font-size:12px;font-weight:600;color:var(--label-3);margin-bottom:6px}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;margin:0}
.kv dt{font-size:12px;color:var(--label-3)}
.kv dd{margin:3px 0 0;font-size:13.5px;font-variant-numeric:tabular-nums}
.proof-why{padding:12px 16px;border-radius:16px;background:rgba(255,90,82,.09);box-shadow:inset 0 0 0 1px rgba(255,90,82,.25);font-size:13.5px}
.proof-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:12px;font-size:12.5px;color:var(--label-3)}
.proof-foot span{display:inline-flex;align-items:center;gap:6px}
.tiles{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));margin:0 0 16px}
.tile{padding:20px;border-radius:22px;background:var(--card-grad);box-shadow:var(--card-edge)}
.tile dt{font-size:13px;color:var(--label-3)}
.tile dd{margin:8px 0 0;font-size:26px;font-weight:600;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.tile dd small{font-size:13px;color:var(--label-3);font-weight:500;letter-spacing:0;margin-left:6px}

/* community */
.feed-layout{display:grid;gap:20px;align-items:start}
@media (min-width:1180px){ .feed-layout{grid-template-columns:minmax(0,1fr) 320px} .side-r{position:sticky;top:calc(var(--hdr) + 20px)} }
.feed{display:grid;gap:12px;min-width:0}
.feed-tabs{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.feed-h{font-size:26px;font-weight:600;letter-spacing:-.01em}
.feed-nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.feed-nav::-webkit-scrollbar{display:none}
.feed-nav a{display:flex;align-items:center;gap:8px;flex:none;height:40px;padding:0 16px 0 14px;border-radius:var(--pill);border:1px solid var(--line);color:var(--label-2);font-size:14px;font-weight:600;white-space:nowrap}
.feed-nav a .ic{width:18px;height:18px}
.feed-nav a small{font-size:12px;font-weight:500;color:var(--label-3)}
.feed-nav a:hover{color:var(--label);border-color:var(--line-2)}
.feed-nav a[aria-current="true"]{border-color:transparent;background:var(--ink);color:var(--on-ink)}
.feed-nav a[aria-current="true"] small{color:inherit;opacity:.6}
.side-r{display:grid;gap:12px;min-width:0}
.box{padding:16px}
.box h3{font-size:15px;font-weight:600;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.box-row{display:flex;align-items:center;gap:10px;padding:9px 0}
.box-row + .box-row{border-top:1px solid var(--line)}
.box-row > div{min-width:0;flex:1}
.box-row b{display:block;font-size:14px;font-weight:600}
.box-row small{display:block;font-size:12.5px;color:var(--label-3)}
.space-link{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
.space-link > span{min-width:0}
.space-link b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.space-link:hover b{text-decoration:underline;text-underline-offset:3px}
.space-link[aria-current="true"] b{text-decoration:underline;text-underline-offset:3px}
.rules-list{margin:0;padding-left:18px;display:grid;gap:6px;color:var(--label-2);font-size:14px}
.composer{display:grid;gap:12px;padding:18px;border-radius:22px;background:var(--card-grad);box-shadow:var(--card-edge)}
.composer-row{display:flex;gap:12px;align-items:flex-start}
.composer textarea{min-height:64px}
.composer-foot{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.composer-foot .opts{display:flex;gap:8px;flex-wrap:wrap}
.composer-foot select{height:36px;width:auto;font-size:13.5px}
article.post{gap:12px;padding:18px}
.post.official{box-shadow:inset 0 0 0 1px var(--line-2)}
.post-head{display:flex;align-items:center;gap:10px;min-width:0}
.post-who{min-width:0;flex:1;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13px;color:var(--label-3)}
.post-who b{font-size:14px;color:var(--label);font-weight:600}
.post-who a:hover b{text-decoration:underline;text-underline-offset:3px}
.post-type{margin-left:auto}
article.post h3{font-size:17px;line-height:1.35;letter-spacing:-.015em}
article.post h3 a:hover{text-decoration:underline;text-underline-offset:3px}
.post-body{color:var(--label-2);font-size:14.5px;line-height:1.6}
.post-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.act{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:var(--pill);border:0;background:var(--inner);color:var(--label-2);font-size:13.5px;font-weight:500}
.act:hover{background:var(--inner-2);color:var(--label)}
.act .ic{width:16px;height:16px}
.act[aria-pressed="true"]{background:var(--ink);color:var(--on-ink)}
.vote{display:inline-flex;align-items:center;height:36px;border-radius:var(--pill);background:var(--inner);overflow:hidden}
.vote button{display:grid;place-items:center;width:36px;height:100%;border-radius:50%;border:0;background:none;color:var(--label-3)}
.vote button .ic{width:16px;height:16px}
.vote button:hover{background:var(--inner-2);color:var(--label)}
.vote b{min-width:34px;text-align:center;font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums}
.vote[data-v="1"]{background:var(--ink);color:var(--on-ink)}
.vote[data-v="1"] button{color:inherit}
.vote[data-v="-1"] b,.vote[data-v="-1"] .down{color:var(--refused)}
.space{display:inline-flex;align-items:center;gap:6px;color:var(--label-2);font-weight:500}
.space:hover{color:var(--label)}
.poll{display:grid;gap:8px}
.poll-opt{position:relative;display:flex;justify-content:space-between;align-items:center;height:42px;padding:0 16px;border-radius:var(--pill);background:var(--bg);overflow:hidden;font-size:14px}
.poll-opt i{position:absolute;inset:0 auto 0 0;background:var(--inner-2)}
.poll-opt span,.poll-opt b{position:relative}
.poll-opt b{font-weight:600;font-variant-numeric:tabular-nums}
.mini-chart{border-radius:18px;background:var(--bg);padding:10px}
.mini-chart svg{display:block;width:100%;height:120px}
.thread{display:grid;gap:2px;border-top:1px solid var(--line);padding-top:10px}
.cmt{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:10px 0}
.cmt.official .cmt-body{border-left:2px solid var(--accent-text);padding-left:10px}
.cmt-head{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;font-size:12.5px;color:var(--label-3)}
.cmt-head b{color:var(--label);font-size:13.5px;font-weight:600}
.cmt p{font-size:14px;color:var(--label-2);margin-top:3px}
.cmt-actions{display:flex;gap:12px;align-items:center;margin-top:4px;font-size:12.5px;color:var(--label-3)}
.cmt-actions span{display:inline-flex;align-items:center;gap:4px}
.cmt-actions button{all:unset;cursor:pointer} .cmt-actions button:hover{color:var(--label)}
.reply{display:flex;gap:10px;align-items:flex-start;padding-top:6px}
.reply textarea{min-height:42px;height:42px;font-size:14px}
div.empty{padding:28px;border-radius:22px;border:1px dashed var(--line-2);color:var(--label-2);text-align:center}

/* community, laid out like Reddit (owner 2026-10-11): feeds and firm spaces on the left, a flat post list in the
   middle with grey action pills and Join buttons, panels on the right */
.c3{display:grid;grid-template-columns:236px minmax(0,1fr) 330px;gap:26px;align-items:start;padding-top:8px}
.c-left{position:sticky;top:calc(var(--hdr) + 8px);max-height:calc(100vh - var(--hdr) - 16px);overflow-y:auto;padding:0 16px 24px 0;border-right:1px solid var(--line);scrollbar-width:none}
.c-left::-webkit-scrollbar{display:none}
.c-nav{display:grid;gap:2px}
.c-nav a,.c-add{display:flex;align-items:center;gap:12px;height:38px;padding:0 12px;border-radius:10px;font-size:15px;color:var(--label)}
.c-nav a .ic,.c-add .ic{width:20px;height:20px}
.c-nav a small{margin-left:auto;font-size:12.5px;color:var(--label-3);font-variant-numeric:tabular-nums}
.c-nav a:hover,.c-add:hover{background:var(--hover)}
.c-nav a[aria-current="true"]{background:var(--tile);font-weight:600}
.c-add{margin-top:2px;color:var(--label-2)}
.c-sec{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.c-sec-h{display:flex;align-items:center;justify-content:space-between;width:100%;height:36px;padding:0 12px;border:0;background:none;font-size:14.5px;font-weight:600;color:var(--label)}
.c-sec-h .ic{width:16px;height:16px;transition:transform .2s var(--ease)}
.c-sec-h[aria-expanded="false"] .ic{transform:rotate(-90deg)}
.c-space{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;border-radius:10px}
.c-space:hover{background:var(--hover)}
.c-space a{display:flex;align-items:center;gap:10px;min-width:0;height:38px;padding-left:10px;font-size:14.5px}
.c-space a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-space a[aria-current="true"]{font-weight:600}
.star{width:32px;height:32px;border:0;border-radius:50%;background:none;color:var(--label-2);display:grid;place-items:center}
.star:hover{color:var(--label);background:var(--tile)}
.star .ic{width:18px;height:18px}
.star[aria-pressed="true"]{color:var(--label)}
.star[aria-pressed="true"] svg{fill:currentColor}
.c3 .feed{gap:0;grid-template-columns:minmax(0,1fr)}
.feed-top{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:6px}
.feed-top p{font-size:14.5px;margin-top:2px}
.feed-sort{gap:24px;margin:8px 0 14px;border-bottom:1px solid var(--line)}
.c3 .composer{padding:12px 14px;margin-bottom:10px;border-radius:24px}
.composer-row{align-items:center}
.composer-row .input{background:var(--elev)}
.composer-more{display:none;gap:10px;margin-top:12px}
.composer:focus-within .composer-more,.composer:has(#c-title:not(:placeholder-shown)) .composer-more{display:grid;animation:rise .25s var(--ease) both}
#posts{display:grid}
article.post{position:relative;display:grid;gap:10px;padding:14px 16px 12px;border-radius:20px;background:none}
article.post:hover{background:var(--hover)}
#posts > article.post + article.post,.feed > article.post + article.post{margin-top:9px}
#posts > article.post + article.post::before,.feed > article.post + article.post::before{content:"";position:absolute;left:16px;right:16px;top:-5px;height:1px;background:var(--line)}
article.post .post-head{gap:10px}
article.post .post-who{gap:6px;font-size:13.5px;color:var(--label-2)}
article.post .post-who b{font-size:14px}
article.post .post-who .by{color:var(--label-2)}
article.post .post-who .by:hover,article.post .space:hover b{text-decoration:underline;text-underline-offset:3px}
article.post .post-type{margin-left:auto;background:none;padding:0 4px;color:var(--label-3)}
.join{height:30px;padding:0 14px;font-size:13.5px}
.join[aria-pressed="true"]{background:var(--elev);color:var(--label);box-shadow:inset 0 0 0 1px var(--line-2)}
article.post h3{font-size:19px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
article.post:not(.open) .post-body{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
article.post .post-body{font-size:15px;color:var(--label-2)}
article.post .vote,article.post .act{height:36px;background:var(--field);color:var(--label)}
article.post .act:hover{background:var(--tile-2)}
article.post .act .ic,article.post .vote .ic{width:18px;height:18px}
article.post .act{font-weight:600}
article.post .vote[data-v="1"]{background:var(--ink);color:var(--on-ink)}
.c3 .side-r{position:sticky;top:calc(var(--hdr) + 8px)}
.c3 .box{border-radius:20px;padding:16px 18px}
.c3 .box h3{font-size:16px;font-weight:600;letter-spacing:-.01em;color:var(--label);margin-bottom:6px}
.top-post{display:grid;gap:4px;padding:12px 0}
.top-post + .top-post{border-top:1px solid var(--line)}
.tp-h{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--label-2)}
.tp-h b{color:var(--label);font-weight:600}
.tp-t{font-size:15px;font-weight:600;line-height:1.35;color:var(--label)}
.top-post:hover .tp-t{text-decoration:underline;text-underline-offset:3px}
.tp-f{font-size:13px;color:var(--label-3)}
.c-legal{display:flex;flex-wrap:wrap;gap:6px 12px;padding:8px 4px;font-size:13px;color:var(--label-3)}
.c-legal a:hover{color:var(--label)}
.c-legal span{flex-basis:100%}
@media (max-width:1280px){ .c3{grid-template-columns:220px minmax(0,1fr)} .c3 .side-r{display:none} }
@media (max-width:960px){
  .c3{grid-template-columns:minmax(0,1fr);gap:8px}
  .c-left{position:static;max-height:none;overflow:visible;padding:0;border:0}
  .c-nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
  .c-nav::-webkit-scrollbar{display:none}
  .c-nav a{flex:none;height:40px;padding:0 16px 0 14px;border-radius:var(--pill);box-shadow:inset 0 0 0 1px var(--line);font-size:14.5px}
  .c-nav a[aria-current="true"]{background:var(--ink);color:var(--on-ink);box-shadow:none}
  .c-nav a[aria-current="true"] small{color:inherit;opacity:.6}
  .c-add,.c-sec{display:none}
  article.post{padding:14px 4px 12px}
  #posts > article.post + article.post::before{left:4px;right:4px}
}

/* compare */
.cmp-pick{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));margin-bottom:16px}
.cmp-t{width:100%;min-width:660px;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:14px}
.cmp-t th,.cmp-t td{padding:13px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.cmp-t thead th{vertical-align:bottom}
.cmp-t tbody th{font-size:13px;font-weight:500;color:var(--label-3);width:200px}
.cmp-t tbody tr:last-child th,.cmp-t tbody tr:last-child td{border-bottom:0}
.cmp-head{display:flex;align-items:center;gap:12px}
.cmp-head .badge{justify-self:start}
.cmp-head a{font-weight:600;font-size:15px} .cmp-head a:hover{text-decoration:underline;text-underline-offset:3px}
.best{color:var(--paid);font-weight:600}
.best::after{content:"Best";margin-left:8px;font-size:11px;font-weight:600;padding:2px 8px;border-radius:var(--pill);background:rgba(52,208,127,.14);vertical-align:1px}
.cmp-group th{font-size:12px!important;font-weight:600!important;color:var(--label)!important;padding-top:22px!important}

/* submit */
.submit{display:grid;gap:20px}
@media (min-width:1180px){ .submit{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:start} .submit .aside{position:sticky;top:calc(var(--hdr) + 20px)} }
.form-grid{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
.form-grid .full{grid-column:1/-1}
.files{font-size:12.5px;color:var(--label-2);display:grid;gap:4px}

/* docs: how we score, about */
.doc{display:grid;gap:32px}
@media (min-width:1100px){ .doc{grid-template-columns:210px minmax(0,1fr);gap:48px} .toc{position:sticky;top:calc(var(--hdr) + 20px);align-self:start} }
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.toc a{display:block;padding:8px 14px;border-radius:var(--pill);color:var(--label-2);font-size:14.5px} .toc a:hover{background:var(--card);color:var(--label)}
.prose{display:grid;gap:36px;max-width:76ch;min-width:0}
.prose section{display:grid;gap:12px;scroll-margin-top:calc(var(--hdr) + 20px)}
.prose h2{font-size:22px;font-weight:600;letter-spacing:-.01em}
.prose p,.prose li{color:var(--label-2);font-size:15.5px}
.prose ul{margin:0;padding-left:1.2em;display:grid;gap:6px}
.prose strong{color:var(--label);font-weight:600}
.prose a{color:var(--label);text-decoration:underline;text-underline-offset:3px}
.bands{width:100%;border-collapse:collapse;font-size:14.5px}
.bands th,.bands td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left}
.bands th{font-size:12.5px;font-weight:500;color:var(--label-3)}
.copy-line{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.copy-line .addr{font-size:16px;font-weight:600;user-select:all}

@media (max-width:860px){
  .page-head{padding:24px 20px}
  .tabs{margin:14px -12px 0;padding:0 12px}
  .card-pad{padding:16px}
  .changes li{grid-template-columns:1fr auto} .changes time{grid-column:1/-1}
  .fstats{grid-template-columns:repeat(2,minmax(0,1fr))} .fstats div:nth-child(3){border-left:0} .fstats div:nth-child(n+3){border-top:1px solid var(--line)}
  .form-grid{grid-template-columns:1fr}
  .statgrid dd{font-size:15px}
  .prof-id{gap:14px}
}

/* custom dropdowns (ui.js) */
.dd-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden}
.sel > .ic{display:none}
.dd-sel{position:relative;display:inline-flex;min-width:0}
.field .dd-sel,.cmp-pick .dd-sel{display:flex;width:100%}
.dd-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;height:40px;padding:0 14px 0 18px;border:0;border-radius:var(--pill);background:var(--elev);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--label);font-size:15px;font-weight:500;text-align:left;white-space:nowrap}
.dd-btn > span{overflow:hidden;text-overflow:ellipsis}
.dd-btn .ic{width:14px;height:14px;color:var(--label-3);transition:transform .2s var(--ease)}
.dd-btn:hover{background:var(--tile)}
.dd-sel.open .dd-btn{background:var(--tile)}
.dd-sel.open .dd-btn .ic{transform:rotate(180deg)}
.field .dd-btn,.composer .dd-btn{height:44px;background:var(--bg);box-shadow:inset 0 0 0 1px var(--line-2)}
.composer .dd-btn{height:38px;font-size:13.5px}
.dd-menu{position:absolute;left:0;top:calc(100% + 6px);z-index:80;min-width:100%;width:max-content;max-width:min(340px,calc(100vw - 32px));max-height:320px;overflow-y:auto;padding:6px;
  border-radius:20px;background:var(--elev);box-shadow:var(--pop);
  opacity:0;transform:translateY(-4px) scale(.98);transform-origin:top left;transition:opacity .16s var(--ease),transform .16s var(--ease);scrollbar-width:thin}
.dd-sel.up .dd-menu{top:auto;bottom:calc(100% + 6px);transform-origin:bottom left}
.dd-sel.open .dd-menu{opacity:1;transform:none}
.dd-opt{display:flex;align-items:center;justify-content:space-between;gap:16px;height:38px;padding:0 12px 0 14px;border-radius:var(--pill);font-size:14px;color:var(--label-2);cursor:pointer;white-space:nowrap}
.dd-opt .ic{width:15px;height:15px;opacity:0;color:var(--accent-text)}
.dd-opt[data-active]{background:var(--tile);color:var(--label)}
.dd-opt[aria-selected="true"]{color:var(--label)}
.dd-opt span{flex:1}
.dd-opt[aria-selected="true"] .ic{opacity:1}
.dd-opt[aria-disabled="true"]{opacity:.4;cursor:default}

/* switch (board: fast payers only) */

/* motion: short, soft, and off for reduced motion */
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:.35}to{opacity:1}}
a,button,.btn,.ttabs button,.seg button,.seg label,.act,.vote button,.code,.cmp,.icon-btn,.wallet,.me,.feed-nav a,.toc a,.dd-btn,.dd-opt,.cb-f button,.t td,.input,.field select,.field textarea,.composer textarea,.search{
  transition:background-color .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease),opacity .18s var(--ease)}
.btn:active,.icon-btn:active,.me:active,.seg button:active,.act:active,.vote button:active,.code:active,.cmp:active,.dd-btn:active,.feed-nav a:active{transform:scale(.97)}
.fcard,a.post,.tile,.proof{transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.fcard:hover,a.post:hover{transform:translateY(-2px)}
#posts > *,#r-list,#p-body{animation:fade .28s var(--ease) both}

.slide:not([hidden]){animation:rise .5s var(--ease) both}
.cmp-bar:not([hidden]){animation:rise .3s var(--ease) both}
[data-thread-box]:not([hidden]){animation:rise .25s var(--ease) both}

/* responsive */
@media (max-width:1280px){  .posts{grid-template-columns:1fr 1fr} .posts .post:nth-child(3){display:none}  }
@media (max-width:1180px){ .hdr-cta{display:none} .tabs-top{gap:18px} }
@media (max-width:1100px){ .duo{grid-template-columns:1fr}  }
@media (max-width:960px){
  :root{--hdr:64px; --pad:16px}
  .hdr{gap:12px}
  .tabs-top,.search{display:none}
  .hdr-end{margin-left:auto}
  .menu-nav{display:grid;gap:2px;padding:8px 20px 12px;border-top:1px solid var(--line)}
  .menu-nav a{display:flex;align-items:center;height:40px;font-size:17px}
  .content{padding-top:4px}
  .foot{margin-top:40px}
  .tabs{margin:20px -16px 0;padding:0 16px}
  .page-head{padding-top:16px}

  .ttabs{gap:22px}
  .ttabs button{font-size:16px}

  .cmp-bar{gap:10px;padding:6px 6px 6px 18px}
  .cb-firms{display:none}
  .cb-l{flex:1}
}
@media (max-width:760px){

  .firm-cell{min-width:0}
  .code{max-width:100%}

  .posts{grid-template-columns:1fr} .posts .post:nth-child(3){display:grid}
  .cmp-bar .btn{padding:0 12px}
}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *,*::before,*::after{transition:none!important;animation:none!important} }
.post .proof,.post .mini-chart,.post .poll-opt{background:var(--elev)}
article.post.official{box-shadow:none}

/* Home page in the community layout (owner 2026-10-11: "follow this style entirely, the same structure"). Titles, tabs and
   post text share one left edge (16px in from the column, where the post padding puts it). */
.home3 .feed-top,.mkt-row,.sort-row{margin-left:16px;margin-right:16px}
.mkt-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;margin-bottom:4px}
.mkt-row::-webkit-scrollbar{display:none}
.mkt-row button{display:flex;align-items:center;gap:7px;flex:none;height:38px;padding:0 14px 0 11px;border-radius:var(--pill);border:1px solid var(--line-2);background:none;color:var(--label);font-size:13.5px;font-weight:500;white-space:nowrap}
.mkt-row button .ic{width:17px;height:17px}
.mkt-row button small{font-size:12.5px;font-weight:500;color:var(--label-3);font-variant-numeric:tabular-nums}
.mkt-row button:hover{border-color:var(--label-3)}
.mkt-row button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
.mkt-row button[aria-pressed="true"] small{color:inherit;opacity:.7}
.sort-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;margin-bottom:14px;border-bottom:1px solid var(--line)}
.sort-row .feed-sort{margin:0;border:0}
.sort-row .muted{font-size:13.5px;font-weight:500;white-space:nowrap}
.home3 .finder{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px 16px}
.finder-ic{display:grid;place-items:center;width:44px;height:44px;flex:none;border-radius:50%;background:var(--elev);color:var(--label-2)}
.finder-ic .ic{width:20px;height:20px}
.finder .input{flex:1 1 220px;width:auto;background:var(--elev)}
.finder .opts{display:flex;gap:8px;flex-wrap:wrap}
.finder .opts:empty{display:none}
.finder .dd-btn{height:44px;background:var(--elev);box-shadow:inset 0 0 0 1px var(--line-2);font-size:14px}
.fhead{gap:12px}
.fh-main{flex:1;min-width:0}
.fh-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.fh-name b{font-size:16px;font-weight:600}
.fh-name a:hover b{text-decoration:underline;text-underline-offset:3px}
.fh-meta{display:flex;flex-wrap:wrap;align-items:center;gap:0 6px;margin-top:2px;font-size:13.5px;color:var(--label-2);white-space:nowrap}
.fh-meta i{font-style:normal;color:var(--label-3)}
.fh-meta .ic{width:14px;height:14px;margin-right:2px;vertical-align:-2px}
.fstat{display:flex;align-items:center;gap:20px;padding:14px 18px;border-radius:18px;box-shadow:inset 0 0 0 1px var(--line)}
.fstat dl{flex:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 18px;margin:0;min-width:0}
.fstat dt{font-size:12.5px;font-weight:500;color:var(--label-3)}
.fstat dd{margin:3px 0 0;font-size:14.5px;font-weight:600;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fstat dd small{font-size:12px;font-weight:500;color:var(--label-3)}
.fpost h3 s{color:var(--label-3);font-weight:500}
.fpost .post-actions .buy{margin-left:auto}
.code-act{border:1px dashed var(--dash)!important;background:none!important;letter-spacing:.03em}
.code-act em,.box .code em{font-style:normal;color:var(--paid);font-weight:600}
.code-act[data-done] .copy-val::after{content:" copied";color:var(--label-3);font-weight:500}
#list > .more{display:flex;margin:12px auto 0}
.box-row b a:hover,a.box-row:hover b{text-decoration:underline;text-underline-offset:3px}
.box-row .amt{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.box .code{height:32px;padding:0 10px;font-size:12.5px;background:var(--elev);flex:none}
.box-more{display:inline-flex;margin-top:8px;font-size:13.5px;font-weight:600;color:var(--ink)}
.box-more:hover{text-decoration:underline;text-underline-offset:3px}
.home3 .cmp-bar{margin-top:14px}
/* Both side columns scroll on their own when taller than the window (owner 2026-10-11: the right side did not scroll). */
.c3 .side-r{max-height:calc(100vh - var(--hdr) - 16px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;padding-bottom:16px}
.c3 .side-r::-webkit-scrollbar{display:none}
:root[data-theme="dark"] .box-more{color:var(--paid)}
@media (max-width:960px){
  .home3 .feed-top,.mkt-row,.sort-row{margin-left:4px;margin-right:4px}
  .fstat{flex-direction:column;align-items:flex-start;gap:12px}
  .fstat dl{grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .finder-ic{display:none}
  .sort-row .muted{display:none}
  .mkt-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
}

/* Vxe-style surfaces (owner 2026-10-11: "I love this kind of colours and the UI styling"): charcoal cards with a soft top
   highlight, a darker inset for figures, coral for what is selected, lime for live and paid, one gradient button. */
::selection{background:rgba(46,160,105,.3)}
.search{box-shadow:inset 0 0 0 1px var(--line)}
.btn-primary{box-shadow:none}
.hdr-cta,.cmp-bar .btn-primary,.fpost .buy{background:var(--ink);color:var(--on-ink);box-shadow:none}
.hdr-cta:hover,.cmp-bar .btn-primary:hover,.fpost .buy:hover{background:var(--ink-hi)}
.box,.c3 .composer,article.post,.proof,.fcard,.cmp-bar{background:var(--card);box-shadow:var(--card-hl)}
.box{position:relative}
.c3 .side-r .box:first-child::before,.home3 .finder::before{content:none}
.c3 .composer{position:relative;border-radius:24px}

.c3 .composer .input{background:var(--field);border-color:var(--line)}
article.post{border-radius:22px;padding:18px 20px}
article.post:hover{background:var(--card);box-shadow:var(--card-hl),0 0 0 1px var(--line-2)}
#posts > article.post + article.post,.feed > article.post + article.post,#list > article.post + article.post{margin-top:12px}
#posts > article.post + article.post::before,.feed > article.post + article.post::before,#list > article.post + article.post::before{display:none}
.home3 .feed-top,.mkt-row,.sort-row{margin-left:0;margin-right:0}
.fstat{background:var(--field);box-shadow:inset 0 0 0 1px var(--line)}

.act,article.post .act,article.post .vote{background:var(--tile-2);color:var(--label)}
article.post .act:hover{background:var(--inner-2)}
.act[aria-pressed="true"],article.post .act[aria-pressed="true"]{background:var(--ink);color:var(--on-ink)}
.join{background:none;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.join:hover{background:color-mix(in srgb,var(--ink) 12%,transparent)}
.join[aria-pressed="true"]{background:var(--tile-2);color:var(--label-2);box-shadow:none}
.mkt-row button{background:var(--tile);border-color:var(--line)}
.mkt-row button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink)}
.c-nav a[aria-current="true"]{background:var(--tile-2)}
.c-nav a[aria-current="true"] .ic{color:var(--ink)}
.star[aria-pressed="true"]{color:var(--gold)}
.ring .bg{stroke:var(--line-2)}
.cmp-bar{color:var(--label)}
.cb-l span,.cb-clear{color:var(--label-2)}
.cb-f{background:var(--tile-2)}
.cb-f button{color:var(--label-2)}
.box-more{color:var(--ink)}
:root[data-theme="dark"] .box-more{color:var(--ink)}
.badge.t-good{--tone:var(--paid)}
.mkt-row button,.act,.join,.btn,.c-nav a,.box,article.post{transition:background .2s var(--ease),box-shadow .2s var(--ease),color .2s var(--ease),filter .2s var(--ease)}
@media (max-width:960px){
  article.post{padding:16px}
  .home3 .feed-top,.mkt-row,.sort-row{margin-left:0;margin-right:0}
}

/* Vxe, closer still (owner 2026-10-11: "copy the exact UI styling"): titled panels with an icon and a grey subtitle, rows
   as inset cards, chips outlined with a status dot, the sort control as a segmented track, the market switch as a
   floating bar with a coral pill, light type. */
.c3 .box{border-radius:26px;padding:18px}
.c3 .box h3{display:flex;align-items:center;gap:9px;font-size:18px;font-weight:500;letter-spacing:-.01em;margin-bottom:2px}
.c3 .box h3 > .ic{width:21px;height:21px;color:var(--label)}
.c3 .box h3 .badge{margin-left:auto}
.box-sub{font-size:13px;color:var(--label-3);margin-bottom:12px}
.c3 .box .box-row,.c3 .box .top-post{margin-top:8px;padding:12px 14px;border-radius:16px;background:var(--tile-2);box-shadow:inset 0 0 0 1px var(--line);border:0}
:root[data-theme="dark"] .c3 .box .box-row,:root[data-theme="dark"] .c3 .box .top-post{background:linear-gradient(180deg,#1F1F1F,#191919)}
.c3 .box .box-row + .box-row,.c3 .box .top-post + .top-post{border-top:0}
.box-more{margin-top:12px}
.badge{background:transparent;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--label);font-weight:500}
.badge:not(:has(.ic))::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--tone,var(--label-3));flex:none}
.badge.t-plain{color:var(--label-2)}
.sort-row{border-bottom:0;margin-top:12px}
.c3 .feed-sort,.sort-row .feed-sort{display:inline-flex;gap:2px;padding:4px;border-radius:var(--pill);background:var(--field);box-shadow:inset 0 0 0 1px var(--line)}
.c3 .feed-sort button{height:36px;padding:0 18px;border-radius:var(--pill);font-size:14px;font-weight:400;color:var(--label-2);box-shadow:none}
.c3 .feed-sort button:hover{color:var(--label)}
.c3 .feed-sort button[aria-pressed="true"]{background:var(--sel);color:var(--sel-ink);box-shadow:var(--sel-shadow)}
:root[data-theme="dark"] .c3 .feed-sort button[aria-pressed="true"]{background:#3A3A3A;color:#fff}
.mkt-row{display:inline-flex;flex-wrap:wrap;gap:2px;padding:5px;border-radius:24px;background:var(--card);box-shadow:var(--card-hl)}
.mkt-row button{border:0;background:none;color:var(--label-2);font-weight:400}
.mkt-row button:hover{color:var(--label);background:var(--hover)}
.mkt-row button small{color:var(--label-3)}
.mkt-row button[aria-pressed="true"]{background:var(--ink);color:var(--on-ink)}
.feed-h{font-weight:500}
article.post h3,.fh-name b{font-weight:500}
.fstat dd{font-weight:500}
.fstat dt{font-weight:400}
.fstat{border-radius:18px}
.act,article.post .act,article.post .vote{box-shadow:inset 0 0 0 1px var(--line);font-weight:500}
:root[data-theme="dark"] .act,:root[data-theme="dark"] article.post .act{background:linear-gradient(180deg,#262626,#1E1E1E)}
.join{background:color-mix(in srgb,var(--ink) 10%,transparent);height:30px;font-weight:500}
.dd-btn{box-shadow:inset 0 0 0 1px var(--line-2)}
:root[data-theme="dark"] .dd-btn,:root[data-theme="dark"] .finder .dd-btn{background:linear-gradient(180deg,#2A2A2A,#232323)}
.c3 .composer .input{border:1px solid var(--line)}
.c-nav a[aria-current="true"]{background:linear-gradient(90deg,color-mix(in srgb,var(--ink) 16%,transparent),transparent 85%),var(--tile-2);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 30%,transparent)}
.c-nav a,.c-space a{font-weight:400}
.c-sec-h{font-weight:500}
.brand{font-weight:600}
.tabs-top a,.menu-nav a{font-weight:500}
@media (max-width:960px){
  .mkt-row{display:flex;flex-wrap:nowrap;overflow-x:auto}
}
.c3 .box h3{justify-content:flex-start}
.mkt-row,.sort-row .feed-sort{justify-self:start;max-width:100%}
.c3 .box .box-row > div{min-width:0}
.c3 .box .box-row > div b,.c3 .box .box-row > div small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c3 .side-r{grid-template-columns:minmax(0,1fr)}

/* Background and strokes (owner 2026-10-11: "make the background and the stroke much better"): a warm glow behind the top
   of the page, a frosted top bar, and 1px gradient strokes that are bright at the top edge and fade down, as in Vxe;
   figures get a warm corner, selected pills a coral rim. */
:root[data-theme="dark"] body{background:radial-gradient(1200px 560px at 50% -200px,rgba(255,255,255,.055),transparent 70%),radial-gradient(900px 520px at 100% -160px,rgba(46,160,105,.06),transparent 70%),var(--bg);background-attachment:fixed}
:root:not([data-theme="dark"]) body{background:radial-gradient(1200px 560px at 50% -200px,#FFFFFF,transparent 70%),var(--bg);background-attachment:fixed}
.hdr{background:color-mix(in srgb,var(--bg) 74%,transparent);-webkit-backdrop-filter:saturate(1.3) blur(16px);backdrop-filter:saturate(1.3) blur(16px)}
.box,article.post,.c3 .composer,.mkt-row,.c3 .feed-sort,.fstat,.search,.dd-btn,.act,.cmp-bar,.menu,.dd-menu,.proof,.fcard,.mkt-row button[aria-pressed="true"],.c-nav a[aria-current="true"],.c3 .box .box-row,.c3 .box .top-post,.c3 .composer .input{position:relative}
.box::after,article.post::after,.c3 .composer::after,.mkt-row::after,.c3 .feed-sort::after,.fstat::after,.search::after,.dd-btn::after,.act::after,.cmp-bar::after,.menu::after,.dd-menu::after,.proof::after,.fcard::after,
.mkt-row button[aria-pressed="true"]::after,.c-nav a[aria-current="true"]::after,.c3 .box .box-row::after,.c3 .box .top-post::after{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:var(--stroke);pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.mkt-row button[aria-pressed="true"]::after,.c-nav a[aria-current="true"]::after{content:none}
.box,article.post,.c3 .composer,.mkt-row,.c3 .feed-sort,.fstat,.search,.dd-btn,.act,article.post .act,article.post .vote,.c3 .box .box-row,.c3 .box .top-post,.c-nav a[aria-current="true"]{box-shadow:var(--card-hl)}
.c3 .composer .input{box-shadow:none;border:1px solid var(--line)}
article.post:hover{box-shadow:var(--card-hl),0 18px 40px -28px rgba(0,0,0,.9)}
article.post:hover::after{background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,.07) 40%,rgba(255,255,255,.04))}
:root:not([data-theme="dark"]) article.post:hover::after{background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.08))}
.mkt-row button[aria-pressed="true"]{box-shadow:none}
.dd-btn:hover::after,.act:hover::after,.search:focus-within::after{background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,.08))}
:root:not([data-theme="dark"]) .dd-btn:hover::after,:root:not([data-theme="dark"]) .act:hover::after,:root:not([data-theme="dark"]) .search:focus-within::after{background:linear-gradient(180deg,rgba(0,0,0,.22),rgba(0,0,0,.1))}
.code-act::after{display:none}

/* Type scale (owner 2026-10-11: "really good alignment in font sizes and boldness"): one size and weight per role,
   400 for reading, 500 for names, titles and controls, 600 only for the brand. Controls share one 36px height. */
body{font-size:14.5px;line-height:1.5}
.brand{font-size:19px;font-weight:600;letter-spacing:-.02em}
.tabs-top a{font-size:15px;font-weight:500}
.feed-h{font-size:28px;font-weight:500;letter-spacing:-.02em;line-height:1.2}
.feed-top p,.feed-top .muted{font-size:14px;color:var(--label-3);margin-top:4px}
article.post h3{font-size:18px;font-weight:500;line-height:1.35;letter-spacing:-.01em}
article.post .post-body,.post-body{font-size:14.5px;line-height:1.6;color:var(--label-2)}
.fh-name b,article.post .post-who b{font-size:15px;font-weight:500}
.fh-meta,article.post .post-who{font-size:13px;color:var(--label-3)}
.c3 .box h3{font-size:16px;font-weight:500}
.box-sub{font-size:12.5px;color:var(--label-3)}
.box-row b,.tp-t,.c3 .box .tp-t{font-size:14px;font-weight:500;line-height:1.4}
.box-row small,.tp-h,.tp-f{font-size:12.5px;font-weight:400}
.tp-h b{font-weight:500}
.box-row .amt{font-size:14px;font-weight:500}
.fstat dt{font-size:12px;font-weight:400}
.fstat dd{font-size:15px;font-weight:500}
.c-nav a,.c-add,.c-space a{font-size:14.5px;font-weight:400}
.c-nav a[aria-current="true"]{font-weight:500}
.c-nav a small{font-size:12px;font-weight:400}
.c-sec-h{font-size:13px;font-weight:500;color:var(--label-2)}
.btn,.btn-sm,.join,.act,.dd-btn,.mkt-row button,.c3 .feed-sort button,.box .code,.code{font-weight:500}
.mkt-row button,.c3 .feed-sort button,.act,article.post .act,article.post .vote,.fpost .buy{height:36px;font-size:13.5px}
.fpost .buy{padding:0 18px}
.join{height:30px;font-size:13px}
.badge{height:24px;font-size:12px;font-weight:500}
.sort-row .muted{font-size:13px;font-weight:400}
.box-more{font-size:13.5px;font-weight:500}

/* Premium green, static (owner 2026-10-11: "I don't like the orange or yellow, it should be a static colour, a British,
   premium green"); premium grey gradient cards with gradient strokes; less height everywhere; the left menu selection a
   plain, fully rounded pill. */
:root{--hdr:62px}
.search{height:40px}
.icon-btn{width:38px;height:38px}
.me{width:36px;height:36px}
.hdr .btn-sm{height:36px}
.join{color:var(--ink-text);background:var(--ink-soft);box-shadow:none}
.join:hover{background:color-mix(in srgb,var(--ink-text) 18%,transparent)}
.join[aria-pressed="true"]{background:var(--tile-2);color:var(--label-2)}
.box-more,:root[data-theme="dark"] .box-more{color:var(--ink-text)}
.c-nav{gap:1px}
.c-nav a,.c-add{height:34px;gap:11px;padding:0 12px;border-radius:var(--pill);font-size:14px}
.c-nav a .ic,.c-add .ic{width:18px;height:18px}
.c-nav a[aria-current="true"]{background:var(--inner);box-shadow:none;font-weight:500}
.c-nav a[aria-current="true"] .ic{color:var(--ink-text)}
.c-sec{margin-top:10px;padding-top:10px}
.c-sec-h{height:32px}
.c-space{border-radius:var(--pill)}
.c-space a{height:34px;font-size:14px;gap:10px}
.c-space .fi.sm{--s:24px}
.star{width:30px;height:30px}
.star .ic{width:16px;height:16px}
.mkt-row{padding:4px}
.mkt-row button{height:34px}
.c3 .feed-sort button{height:32px}
.finder .input,.finder .dd-btn{height:40px}
.finder-ic{width:40px;height:40px}
.home3 .finder{padding:10px 14px}
article.post{padding:16px 18px;gap:10px}
.fstat{padding:12px 16px}
.mkt-row button,.act,article.post .act,article.post .vote,.fpost .buy{height:34px}
.c3 .box{padding:16px}
.c3 .box .box-row,.c3 .box .top-post{padding:10px 12px;margin-top:6px}
.c3 .box h3{font-size:15.5px}
