/* AGENCY HQ: the live pages (HQ, an agent's dossier, Transparency, the holder perks), on top of
   home.css: its bar, buttons, type, palette and both shifts. The top of each page stays night,
   like the home page's hero; the rest follows the shift. Every number is set in Archivo, every
   label in the pixel face; a gain and a loss are equally loud, and each carries its sign as a
   character as well as a colour. Pixel art is drawn pixelated at whole or half steps. */

:root{--up:#5ef0b4;--down:#ff8a7a;--paper:#b994ff;--live:#14f195}
:root[data-theme="light"]{--up:#08774d;--down:#b8372a;--paper:#6d28c9}
.px{image-rendering:pixelated}

.hq-page [hidden],.hq-band [hidden]{display:none!important}
.recruits > .board-empty,.recruits > .refused,.policy > .board-empty,.policy > .fail{grid-column:1/-1}
/* What shows when: HQ not configured (offline), configured and loading or drawn, or failing. */
html[data-hq="offline"] .when-live,html[data-hq="error"] .when-live{display:none!important}
html:not([data-hq="offline"]) .when-offline{display:none!important}
html:not([data-hq="error"]) .when-error{display:none!important}

/* ── the top: night, over the room's picture ───────────────────────────── */
.hq-top{position:relative;isolation:isolate;overflow:hidden;color:#f2edff;background:#0b0716;border-bottom:3px solid var(--mint);
  --text:#f2edff;--text-soft:#d4cbef;--text-faint:#a79dca;--line:#2d2049;--line-2:#5a4a86;--card:#140d26;--bg-2:#100a1f;--mint-text:#5ef0b4;--violet-text:#b994ff;--gold-text:#f5c542;
  --up:#5ef0b4;--down:#ff8a7a;--paper:#b994ff;--shadow-ink:rgba(0,0,0,.55)}
/* The room's picture fills the top right and melts into the night on its left and bottom edges,
   so the title sits on the calm left third and the numbers on plain ink. */
.hq-art{position:absolute;z-index:-2;top:0;right:0;width:min(100%,1680px);height:auto;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34%),linear-gradient(180deg,#000 62%,transparent 98%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0,#000 34%),linear-gradient(180deg,#000 62%,transparent 98%);mask-composite:intersect}
.hq-top::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,rgba(11,7,22,.86) 0%,rgba(11,7,22,.62) 32%,rgba(11,7,22,.1) 60%,rgba(11,7,22,0) 100%)}
.hq-top .wrap{position:relative;padding-top:18px;padding-bottom:40px}
.hq-top .crumb{display:inline-flex;align-items:center;gap:8px;font:400 9px/1 var(--pixel);text-transform:uppercase;color:#c0b5dc;text-decoration:none;padding:10px 0}
.hq-top .crumb:hover{color:var(--mint)}
.hq-head{min-height:clamp(250px,26vw,380px);display:flex;align-items:flex-end;padding:10px 0 26px}
.hq-head > div{max-width:600px}
.hq-top h1{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(48px,6.4vw,92px);line-height:.92;letter-spacing:.01em;margin:14px 0 16px;color:#fff;text-shadow:4px 4px 0 #2a1650}
.hq-top h1 em{font-style:normal;color:var(--mint);text-shadow:4px 4px 0 #0a4a33}
.hq-top .lead{max-width:560px;margin-bottom:14px;text-shadow:0 1px 3px #0b0716,0 0 12px rgba(11,7,22,.9)}
.stamp{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0;font:400 9px/1.6 var(--pixel);text-transform:uppercase;color:var(--text-faint)}
@media (max-width:760px){
  .hq-top.plain .wrap{margin-top:0;padding-top:12px}
  .hq-art{position:relative;display:block;width:calc(100% + 32px);max-width:none;margin:0 -16px;height:auto;z-index:-2;
    -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}
  .hq-top::before{display:none}
  .hq-top .wrap{padding-top:0;margin-top:-18vw}
  .hq-head{min-height:0;padding-top:0}
  .hq-top .crumb{display:none}
}

/* The dossier's top: the night sky, without the room's picture. */
.hq-top.plain{background:radial-gradient(2px 2px at 68% 14%,#cfc6ea 50%,transparent 51%),radial-gradient(2px 2px at 84% 30%,#cfc6ea 50%,transparent 51%),
  radial-gradient(3px 3px at 91% 12%,#5ef0b4 50%,transparent 51%),radial-gradient(3px 3px at 58% 36%,#b994ff 50%,transparent 51%),
  radial-gradient(70% 60% at 80% 100%,rgba(153,69,255,.22),transparent 70%),#0b0716}
.hq-top.plain::before{display:none}
.hq-top.plain .wrap{padding-top:18px;padding-bottom:44px}
.dossier-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:8px 0 18px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.grid-main{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:30px;align-items:start;margin-top:34px}
@media (max-width:980px){.grid-main{grid-template-columns:minmax(0,1fr)}}
.desk.compact{gap:0}
.desk.compact .desk-row{box-shadow:none;border-top:1px solid var(--line);background:none;padding:12px 0}
.desk.compact .desk-row:first-child{border-top:0}
.desk.compact .desk-row.decision{box-shadow:none}
.log-scroll{max-height:720px;overflow:auto;padding-right:6px}

/* The live pill: offline, connecting, live, reconnecting, down. */
.live-pill{display:inline-flex;align-items:center;gap:9px;margin:0;font:400 9px/1 var(--pixel);text-transform:uppercase;color:var(--text-faint);
  padding:8px 11px 7px 9px;background:rgba(11,7,22,.82);box-shadow:inset 0 0 0 2px var(--line-2)}
.live-pill::before{content:"";width:8px;height:8px;background:currentColor;flex:none}
.live-pill[data-state="live"]{color:var(--mint);box-shadow:inset 0 0 0 2px rgba(20,241,149,.55)}
.live-pill[data-state="live"]::before{animation:blink 1.2s steps(1) infinite}
.live-pill[data-state="online"]{color:var(--mint);box-shadow:inset 0 0 0 2px rgba(20,241,149,.55)}
.live-pill[data-state="connecting"],.live-pill[data-state="reconnecting"]{color:var(--gold)}
.live-pill[data-state="down"]{color:var(--down)}
@keyframes blink{50%{opacity:.25}}

/* ── marks: mode, side, rank, strategy, status ─────────────────────────── */
.mode{display:inline-block;flex:none;font:400 7px/1 var(--pixel);letter-spacing:.04em;text-transform:uppercase;padding:4px 5px 3px;white-space:nowrap;vertical-align:middle}
.mode-live{background:var(--live);color:#04160e}
.mode-paper{color:var(--paper);box-shadow:inset 0 0 0 1.5px currentColor;background:repeating-linear-gradient(135deg,transparent 0 3px,color-mix(in srgb,var(--paper) 16%,transparent) 3px 5px)}
.mode-chain{background:var(--gold);color:#241800}
.side{display:inline-block;font:400 8px/1 var(--pixel);text-transform:uppercase;padding:5px 6px 4px;white-space:nowrap}
.side.buy{background:var(--mint);color:#04160e}
.side.sell{background:var(--bad);color:#1f0703}
.side.hold{color:var(--text-soft);box-shadow:inset 0 0 0 2px var(--line-2)}
.side.decided{color:var(--violet-text);box-shadow:inset 0 0 0 2px currentColor;background:none}
.rank-chip{display:inline-flex;align-items:center;gap:6px;font:400 8px/1.2 var(--pixel);text-transform:uppercase;color:var(--text);padding:3px 7px 3px 4px;background:var(--bg-2);box-shadow:inset 0 0 0 1.5px var(--line-2);white-space:nowrap}
.rank-chip img{width:auto;height:18px}
.rank-chip.r-field{box-shadow:inset 0 0 0 1.5px #b8bfd0}
.rank-chip.r-special{box-shadow:inset 0 0 0 1.5px var(--gold)}
.rank-chip.r-senior{box-shadow:inset 0 0 0 1.5px #5ab8ff}
.rank-chip.r-director{box-shadow:inset 0 0 0 1.5px var(--violet)}
.rank-paper{color:var(--paper);margin-left:2px}
.strat-chip{display:inline-flex;align-items:center;gap:6px;font:600 12.5px/1 var(--sans);color:var(--text-soft);white-space:nowrap}
.strat-chip img{height:20px;width:auto}
.status-chip{font:400 7px/1 var(--pixel);text-transform:uppercase;padding:4px 5px 3px;color:var(--mint-text);box-shadow:inset 0 0 0 1.5px currentColor}
.status-chip.st-paused{color:var(--gold-text)}
.status-chip.st-retired{color:var(--text-faint)}
.amt{white-space:nowrap}
.amt.up{color:var(--up)}
.amt.down{color:var(--down)}
.amt .unit{font:600 .5em/1 var(--sans);letter-spacing:.04em;color:var(--text-faint);margin-left:1px}
.tx{font:400 12px/1 var(--mono);color:var(--violet-text);text-decoration:none;white-space:nowrap}
a.tx:hover{color:var(--mint-text)}
.tx.none{color:var(--text-faint);font-style:italic}
.addr{font:400 13px/1.3 var(--mono);color:var(--violet-text);overflow-wrap:anywhere}
.sym{font-weight:800;color:var(--text);text-decoration:none}
a.sym:hover{color:var(--mint-text)}
.coin-links{display:inline-flex;gap:12px;flex-wrap:wrap;font:400 9px/1.6 var(--pixel);text-transform:uppercase}
.coin-links a{color:var(--text);text-decoration:none;box-shadow:inset 0 -3px 0 var(--mint)}
.coin-links a:hover{color:var(--mint-text)}
time.ago{white-space:nowrap}

/* ── stat cards ─────────────────────────────────────────────────────────── */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:12px;margin:0}
.stat{display:flex;flex-direction:column;gap:8px;min-width:0;background:var(--card);padding:14px 16px 15px;box-shadow:0 0 0 2px var(--line-2)}
:root[data-theme="light"] .stat{box-shadow:0 0 0 2px var(--line)}
.hq-top .stat{background:rgba(20,13,38,.92);box-shadow:0 0 0 2px #3d2d63}
.stat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.stat-label{font:400 8px/1.6 var(--pixel);text-transform:uppercase;color:var(--text-faint)}
.stat-value{font:800 clamp(24px,2.3vw,31px)/1.05 var(--sans);letter-spacing:-.01em;color:var(--text);min-height:32px}
.stat-value .amt .unit{font-size:12px}
.stat-sub{font-size:13px;line-height:1.45;color:var(--text-faint)}
.stat-sub b{color:var(--text-soft);font-weight:600}
.stat.skel .stat-value{color:var(--line-2)}
.stat.key{box-shadow:0 0 0 2px var(--line-2),inset 0 3px 0 var(--k,var(--line-2))}
.hero-stats{margin-top:6px}
/* The summary: four cards a row (the record first: realized, unrealized, win rate, drawdown);
   per mode, six. Phones take two a row. */
.stats.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.stats.five{grid-template-columns:repeat(5,minmax(0,1fr))}
.stats.six{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:1180px){.stats.five,.stats.six{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.stats.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.stats.five,.stats.six{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:360px){.stats.four,.stats.five,.stats.six{grid-template-columns:minmax(0,1fr)}}
.mode-rows{display:grid;gap:18px}
.mode-row h3{display:flex;align-items:center;gap:10px;margin:0 0 10px;font:400 10px/1.4 var(--pixel);text-transform:uppercase;color:var(--text)}
.note-line{font-size:13.5px;color:var(--text-faint);margin:12px 0 0}
.mode-row h3 .mode-count{margin-left:auto;font:400 8px/1.4 var(--pixel);color:var(--text-faint)}
.mode-none{margin:0;padding:14px 16px;font-size:14.5px;color:var(--text-soft);background:var(--card);box-shadow:inset 0 0 0 2px var(--line-2)}
.hq-top .mode-none{background:rgba(20,13,38,.92)}
.stats.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:640px){.stats.three{grid-template-columns:minmax(0,1fr)}}

/* ── "coming online" and "not answering" ─────────────────────────────── */
.coming{position:relative;max-width:900px;background:rgba(20,13,38,.94);padding:24px 26px 22px;box-shadow:0 0 0 3px var(--gold),10px 10px 0 3px rgba(0,0,0,.55);margin:6px 3px 3px}
.coming-tag{display:inline-block;font:400 9px/1 var(--pixel);text-transform:uppercase;color:#241800;background:var(--gold);padding:7px 9px 6px;margin:0 0 14px;clip-path:var(--corners)}
.coming-tag.bad{background:var(--bad);color:#1f0703}
.coming-title{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(30px,3.4vw,44px);line-height:1;margin:0 0 12px;color:#fff}
.coming-list{list-style:none;margin:16px 0 14px;padding:0;display:grid;gap:10px}
.coming-list li{position:relative;padding-left:22px;color:var(--text-soft);font-size:15px}
.coming-list li::before{content:"";position:absolute;left:0;top:.45em;width:10px;height:10px;box-shadow:inset 0 0 0 2px var(--gold)}
.coming .fine{margin-top:4px}
@media (max-width:520px){.coming{padding:20px 16px 18px}}

/* The line every page with numbers carries. */
.past-strip{margin:0;background:var(--bg-2);border-bottom:3px solid var(--line);padding:12px 0;font-size:14px;color:var(--text-soft)}
.past-strip .wrap{display:block}
.past-strip b{color:var(--text)}
.past-strip b::before{content:"!";display:inline-grid;place-content:center;width:18px;height:18px;margin-right:9px;font:400 10px/1 var(--pixel);color:#241800;background:var(--gold);vertical-align:1px}

/* ── sections, panels, controls ────────────────────────────────────────── */
.hq-sec{padding:72px 0;border-bottom:3px solid var(--line)}
.hq-sec.alt{background:var(--bg-2)}
@media (max-width:600px){.hq-sec{padding:52px 0}}
.hq-sec h2{font-size:clamp(36px,4.6vw,60px)}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px}
.sec-head h2{margin-bottom:12px}
.sec-note{font:400 9px/1.6 var(--pixel);text-transform:uppercase;color:var(--text-faint);margin:0 0 18px}
.hq-sec .sub{margin-bottom:26px}
.controls{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.seg{display:inline-flex;flex-wrap:wrap;padding:3px;background:var(--card);box-shadow:inset 0 0 0 2px var(--line-2)}
:root[data-theme="light"] .seg{box-shadow:inset 0 0 0 2px var(--line)}
.seg button{font:400 9px/1 var(--pixel);text-transform:uppercase;color:var(--text-soft);background:none;border:0;padding:10px 11px 9px;min-height:38px;cursor:pointer}
.seg button:hover{color:var(--text)}
.seg button[aria-pressed="true"]{background:var(--mint);color:#04160e}
.panel{--accent:var(--line-2);background:var(--card);padding:20px 22px;margin:3px;min-width:0;box-shadow:0 0 0 3px var(--accent),8px 8px 0 3px var(--shadow-ink)}
.panel-title{margin:0 0 16px;font:400 11px/1.6 var(--pixel);text-transform:uppercase;color:var(--text)}
.panel-title::before{content:"";display:inline-block;width:10px;height:10px;margin-right:10px;vertical-align:0;background:var(--accent)}
.panel-title .aside-note{display:block;margin-top:4px;padding-left:20px;font:400 13px/1.35 var(--sans);text-transform:none;color:var(--text-faint)}
@media (max-width:520px){.panel{padding:18px 14px}}
.board-empty{margin:0;padding:22px 20px;color:var(--text-faint);font-size:15px;background:var(--card);box-shadow:inset 0 0 0 2px var(--line);list-style:none}
.refused{font-size:13.5px;color:var(--gold-text);margin:12px 0 0;padding:10px 12px;box-shadow:inset 3px 0 0 var(--gold);background:var(--card)}
/* Positions with no recent price, which HQ values down (API.md, positions). */
.stale-note{font-size:13.5px;line-height:1.5;color:var(--text-soft);margin:12px 0 0;padding:10px 12px;box-shadow:inset 3px 0 0 var(--gold);background:var(--card)}
.mode-row > .stale-note{margin-top:10px}
.recruit-stale{margin:10px 0 0;font-size:12.5px;line-height:1.4;color:var(--gold-text)}
.tbl .sub-line.stale{color:var(--gold-text)}
.more{margin-top:18px}
.fail{color:var(--down);font-size:14px;margin:10px 0 0}

/* ── the ticker tape ───────────────────────────────────────────────────── */
.tape{position:relative;overflow:hidden;background:#0b0716;color:#f2edff;border-bottom:2px solid #2d2049;white-space:nowrap}
.tape-track{display:inline-flex;gap:0;padding:9px 0 8px;animation:tape var(--tape-s,60s) linear infinite}
.tape:hover .tape-track{animation-play-state:paused}
@keyframes tape{to{transform:translateX(-50%)}}
.tape-item{display:inline-flex;align-items:center;gap:8px;padding:0 22px;font:600 13px/1 var(--sans);color:#d4cbef;border-right:2px solid #2d2049}
.tape-item b{color:#fff;font-weight:800}
.tape-item a{color:#fff;text-decoration:none}
.tape-item a:hover{color:var(--mint)}
.tape-item .amt.up{color:#5ef0b4}
.tape-item .amt.down{color:#ff8a7a}
.tape-item .mode-paper{color:#b994ff}
@media (prefers-reduced-motion:reduce){.tape{overflow-x:auto}.tape-track{animation:none}}

/* ── Agent of the Month ───────────────────────────────────────────────── */
.boards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
@media (max-width:900px){.boards{grid-template-columns:minmax(0,1fr)}}
.board{--accent:var(--mint);background:var(--card);margin:3px;min-width:0;box-shadow:0 0 0 3px var(--accent),8px 8px 0 3px var(--shadow-ink);display:flex;flex-direction:column}
.board-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:2px solid var(--line)}
.board-head h3{font:400 11px/1.3 var(--pixel);text-transform:uppercase;color:var(--text);display:flex;align-items:center;gap:10px;margin:0}
.board-head h3::before{content:"";width:10px;height:10px;background:var(--accent)}
.board-body{flex:1}
.board-body > .board-empty{box-shadow:none;background:none}
.podium{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:10px;padding:24px 14px 0;overflow:hidden;
  background:radial-gradient(3px 3px at 16% 18%,#cfc6ea 50%,transparent 51%),radial-gradient(3px 3px at 82% 12%,#cfc6ea 50%,transparent 51%),radial-gradient(2px 2px at 60% 26%,#fff 50%,transparent 51%),
    radial-gradient(70% 70% at 50% 100%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 72%),#0b0716;color:#f2edff;
  --text:#f2edff;--text-soft:#d4cbef;--text-faint:#a79dca;--up:#5ef0b4;--down:#ff8a7a;--bg-2:#100a1f;--line-2:#5a4a86}
.pod{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0;text-decoration:none;color:inherit}
.pod .portrait{max-width:100%;height:auto;margin-bottom:6px}
.pod-name{font:800 14px/1.2 var(--sans);color:#fff;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pod-no{font:400 7px/1.5 var(--pixel);color:#a79dca;text-transform:uppercase}
.pod-value{font:800 17px/1.2 var(--sans);margin:2px 0 8px}
.pod .rank-chip{margin-bottom:10px;background:#100a1f}
.pod-block{width:100%;display:grid;place-content:center;font:400 22px/1 var(--pixel);color:#1b1430;clip-path:polygon(0 6px,6px 6px,6px 0,calc(100% - 6px) 0,calc(100% - 6px) 6px,100% 6px,100% 100%,0 100%);
  box-shadow:inset 0 -6px 0 rgba(0,0,0,.22),inset 0 4px 0 rgba(255,255,255,.35)}
.pod.p1 .pod-block{height:92px;background:var(--gold)}
.pod.p2 .pod-block{height:64px;background:#c9cfdd}
.pod.p3 .pod-block{height:46px;background:#d28a52}
a.pod:hover .pod-name{color:var(--mint)}
.pod.empty .pod-block{background:#2d2049;color:#5a4a86}
.board-rows{list-style:none;margin:0;padding:6px 0 8px;counter-reset:row 3}
.board-rows li{counter-increment:row}
.board-rows a{display:grid;grid-template-columns:34px 30px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 18px;color:var(--text);text-decoration:none;border-top:1px solid var(--line)}
.board-rows a::before{content:counter(row);font:400 10px/1 var(--pixel);color:var(--text-faint)}
.board-rows a:hover{background:var(--bg-2)}
.headshot{display:flex;align-items:flex-start;justify-content:center;width:30px;height:34px;overflow:hidden;background:#0b0716;box-shadow:inset 0 -3px 0 #1a1130}
.headshot .portrait{flex:none;width:auto;height:53px;margin-top:2px}
.board-rows .row-who{min-width:0;display:flex;flex-direction:column;gap:3px}
.board-rows .row-who b{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-rows .row-who span{font:400 7px/1.4 var(--pixel);text-transform:uppercase;color:var(--text-faint)}
.board-rows .amt{font-weight:800}
.board-foot{padding:10px 18px 14px;font-size:13px;color:var(--text-faint);border-top:1px solid var(--line);margin:0}

/* ── recruits ───────────────────────────────────────────────────────────── */
.recruits{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:26px 22px}
.recruit{--accent:var(--mint);display:flex;flex-direction:column;min-width:0;margin:3px;background:var(--card);color:var(--text);text-decoration:none;box-shadow:0 0 0 3px var(--accent),8px 8px 0 3px var(--shadow-ink);transition:transform .1s steps(2)}
.recruit:hover{color:var(--text);transform:translateY(-3px)}
.recruit-pad{position:relative;height:150px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;
  background:radial-gradient(3px 3px at 18% 22%,#cfc6ea 50%,transparent 51%),radial-gradient(3px 3px at 80% 18%,var(--accent) 50%,transparent 51%),
    radial-gradient(60% 80% at 50% 100%,color-mix(in srgb,var(--accent) 34%,transparent),transparent 72%),#0b0716}
.recruit-pad::before{content:"";position:absolute;left:0;right:0;bottom:0;height:28px;border-top:3px solid var(--accent);background:url(floor-tile-256.png) 0 0/128px 128px repeat;image-rendering:pixelated}
.recruit-pad .portrait{position:relative;z-index:1;margin-bottom:14px}
.recruit-pad .mode{position:absolute;top:10px;left:10px;z-index:2}
.recruit-pad .new{position:absolute;top:10px;right:10px;z-index:2;font:400 7px/1 var(--pixel);text-transform:uppercase;color:#1b1430;background:var(--gold);padding:4px 5px 3px}
.recruit-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:9px;flex:1}
.recruit-no{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;font:400 8px/1.4 var(--pixel);text-transform:uppercase;color:var(--text-faint)}
.recruit h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:28px;line-height:1;margin:0;color:var(--text);overflow-wrap:anywhere}
.recruit-chips{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
.recruit-nums{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto;padding-top:10px;border-top:2px dashed var(--line)}
.recruit-nums dt{font:400 7px/1.5 var(--pixel);text-transform:uppercase;color:var(--text-faint);margin:0}
.recruit-nums dd{margin:2px 0 0;font:800 17px/1.2 var(--sans);color:var(--text)}
.recruit-foot{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;color:var(--text-faint)}

/* ── the trading desk ──────────────────────────────────────────────────── */
.desk{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.desk-row{--accent:var(--line-2);display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:start;gap:4px 14px;padding:12px 16px 12px 12px;background:var(--card);
  box-shadow:inset 4px 0 0 var(--accent),0 0 0 1px var(--line)}
.desk-row.buy{--accent:var(--mint)}
.desk-row.sell{--accent:var(--bad)}
.desk-row.decision{--accent:var(--violet)}
.desk-row .face{grid-row:span 2;display:flex;align-items:flex-end;justify-content:center;height:56px;background:#0b0716;box-shadow:inset 0 -6px 0 #1a1130;overflow:hidden}
.desk-row .face .portrait{flex:none}
.desk-row.solo{grid-template-columns:minmax(0,1fr) auto;padding-left:16px}
.desk-row.solo .desk-reason,.desk-row.solo .rug{grid-column:1 / -1}
.desk-who{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font:400 8px/1.5 var(--pixel);text-transform:uppercase;color:var(--text-faint)}
.desk-who a{font:800 14.5px/1.2 var(--sans);text-transform:none;color:var(--text);text-decoration:none}
.desk-who a:hover{color:var(--mint-text)}
.desk-what{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:6px;font-size:15px}
.desk-what .amt{font-weight:800}
.trigger{font:400 7px/1 var(--pixel);text-transform:uppercase;padding:4px 5px 3px;color:var(--gold-text);box-shadow:inset 0 0 0 1.5px currentColor}
.trigger.t-stop_loss,.trigger.t-daily_limit{color:var(--down)}
.trigger.t-take_profit{color:var(--up)}
.trigger.t-strategy{color:var(--text-faint)}
.desk-reason{grid-column:2 / -1;margin:2px 0 0;font-size:14px;color:var(--text-soft);white-space:pre-line;overflow-wrap:anywhere}
.rug{grid-column:2 / -1;display:flex;flex-wrap:wrap;gap:4px 10px;margin:4px 0 0;font-size:12.5px;color:var(--text-faint)}
.rug b{font:400 7px/1.6 var(--pixel);text-transform:uppercase;color:var(--up)}
.rug b.no{color:var(--text-faint)}
.rug b.fail{color:var(--down)}
.rug span{overflow-wrap:anywhere}
.rug span::before{content:"✓ ";color:var(--up)}
.rug span.f::before{content:"✕ ";color:var(--down)}
.desk-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px;text-align:right;font-size:12.5px;color:var(--text-faint)}
.desk-row.fresh{animation:fresh 1.8s steps(6) 1}
@keyframes fresh{0%{box-shadow:inset 4px 0 0 var(--accent),0 0 0 3px var(--accent)}100%{box-shadow:inset 4px 0 0 var(--accent),0 0 0 1px var(--line)}}
@media (max-width:560px){
  .desk-row{grid-template-columns:40px minmax(0,1fr);padding:12px 12px 12px 10px}
  .desk-side{grid-column:2;flex-direction:row;justify-content:space-between;align-items:center;width:100%}
  .desk-row.solo{grid-template-columns:minmax(0,1fr)}
  .desk-row.solo .desk-side{grid-column:1}
}

/* ── ranks and strategies ─────────────────────────────────────────────── */
.rank-ladder{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;align-items:stretch}
.rank-ladder li{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;gap:12px;padding:20px 10px 16px;background:var(--card);box-shadow:0 0 0 2px var(--line-2);min-width:0}
:root[data-theme="light"] .rank-ladder li{box-shadow:0 0 0 2px var(--line)}
.rank-ladder img{height:auto;max-width:100%}
.rank-ladder h3{font:400 10px/1.4 var(--pixel);text-transform:uppercase;color:var(--text);margin:0}
.rank-ladder p{margin:4px 0 0;font:600 14px/1.3 var(--sans);color:var(--text-soft)}
@media (max-width:900px){.rank-ladder{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:520px){.rank-ladder{grid-template-columns:repeat(2,minmax(0,1fr))}.rank-ladder li:last-child{grid-column:1/-1}}
.strats{list-style:none;margin:0 0 30px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:800px){.strats{grid-template-columns:minmax(0,1fr)}}
.strats li{--accent:var(--mint);display:grid;grid-template-columns:96px minmax(0,1fr);gap:0 18px;align-items:center;background:var(--card);box-shadow:0 0 0 2px var(--line-2);min-width:0}
:root[data-theme="light"] .strats li{box-shadow:0 0 0 2px var(--line)}
.strats img{display:block;align-self:end;justify-self:center;width:auto;height:84px;margin:12px 0 0}
.strats li > div{padding:14px 16px 14px 0}
.strats h3{font:800 18px/1.3 var(--sans);color:var(--text);margin:0 0 4px}
.strats h3 code{font-size:11px;margin-left:6px;vertical-align:2px}
.strats p{margin:0;font-size:14.5px}

/* ── tables: aligned figures, stacked into cards on a phone ────────────── */
.tbl-wrap{overflow-x:auto;margin:0 -4px;padding:0 4px}
.tbl{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.tbl th{font:400 7.5px/1.5 var(--pixel);text-transform:uppercase;color:var(--text-faint);text-align:left;padding:9px 10px;border-bottom:2px solid var(--line);white-space:nowrap}
.tbl td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle;color:var(--text-soft)}
.tbl .num{text-align:right}
.tbl td.num{color:var(--text);font-weight:600}
.tbl tr:last-child td{border-bottom:0}
.tbl .sub-line{display:block;font-size:12px;color:var(--text-faint);font-weight:400}
@media (max-width:700px){
  .tbl.stack thead{display:none}
  .tbl.stack,.tbl.stack tbody,.tbl.stack tr{display:block}
  .tbl.stack tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 12px;padding:12px 0;border-bottom:1px solid var(--line)}
  .tbl.stack tr:last-child{border-bottom:0}
  .tbl.stack td{border:0;padding:4px 0;text-align:left;min-width:0}
  .tbl.stack td::before{content:attr(data-label);display:block;font:400 7px/1.6 var(--pixel);text-transform:uppercase;color:var(--text-faint)}
  .tbl.stack td.wide{grid-column:1/-1}
}

/* ── a dossier ─────────────────────────────────────────────────────────── */
.dossier-top{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:0;margin:3px;background:var(--card);box-shadow:0 0 0 3px var(--accent,var(--mint)),10px 10px 0 3px var(--shadow-ink)}
.dossier-pad{position:relative;display:flex;align-items:flex-end;justify-content:center;min-height:300px;overflow:hidden;
  background:radial-gradient(3px 3px at 16% 16%,#cfc6ea 50%,transparent 51%),radial-gradient(3px 3px at 76% 12%,#cfc6ea 50%,transparent 51%),radial-gradient(3px 3px at 86% 38%,var(--accent,var(--mint)) 50%,transparent 51%),
    radial-gradient(60% 70% at 50% 100%,color-mix(in srgb,var(--accent,var(--mint)) 34%,transparent),transparent 72%),#0b0716}
.dossier-pad::before{content:"";position:absolute;left:0;right:0;bottom:0;height:44px;border-top:3px solid var(--accent,var(--mint));background:url(floor-tile-256.png) 0 0/256px 256px repeat;image-rendering:pixelated}
.dossier-pad .portrait{position:relative;z-index:1;margin-bottom:30px}
.dossier-pad .rank-art{position:absolute;z-index:2;top:14px;right:14px;width:auto;height:64px}
.dossier-pad .mode{position:absolute;z-index:2;top:14px;left:14px;font-size:9px;padding:6px 7px 5px}
.dossier-id{padding:22px 26px 24px;min-width:0;display:flex;flex-direction:column;gap:12px}
.dossier-no{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0;font:400 9px/1.5 var(--pixel);text-transform:uppercase;color:var(--text-faint)}
.dossier-id h1{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(42px,5.4vw,72px);line-height:.92;margin:0;color:var(--text);overflow-wrap:anywhere}
.dossier-chips{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.progress-box{padding:12px 14px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.progress-line{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;margin:0 0 8px;font-size:13.5px;color:var(--text-soft)}
.progress-line b{color:var(--text)}
.progress{position:relative;height:16px;background:var(--card);box-shadow:inset 0 0 0 2px var(--line-2)}
.progress i{position:absolute;left:3px;top:3px;bottom:3px;width:calc((100% - 6px) * var(--p,0));background:repeating-linear-gradient(90deg,var(--mint) 0 10px,transparent 10px 13px);transition:width .6s steps(8)}
.dossier-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 16px;margin:0;border-top:2px solid var(--line)}
.dossier-facts dt,.dossier-facts dd{margin:0;padding:9px 0;border-bottom:2px solid var(--line)}
.dossier-facts dt{font:400 8px/1.9 var(--pixel);text-transform:uppercase;color:var(--text-faint);white-space:nowrap}
.dossier-facts dd{font-size:14.5px;color:var(--text);min-width:0;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
.dossier-facts .full{font:400 12.5px/1.4 var(--mono);color:var(--text-soft);overflow-wrap:anywhere;user-select:all;flex-basis:100%}
@media (max-width:820px){
  .dossier-top{grid-template-columns:minmax(0,1fr)}
  .dossier-pad{min-height:250px}
  .dossier-id{padding:20px 18px 22px}
}
@media (max-width:520px){.dossier-facts{grid-template-columns:minmax(0,1fr)}.dossier-facts dt{border-bottom:0;padding-bottom:0}.dossier-facts dd{padding-top:4px}}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;align-items:start}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;align-items:start}
@media (max-width:980px){.grid-3{grid-template-columns:minmax(0,1fr)}}
@media (max-width:900px){.grid-2{grid-template-columns:minmax(0,1fr)}}
.stack-gap{display:grid;gap:30px}

/* The limits: what this cat is not allowed to do. */
.limits{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.limits li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;font-size:14.5px;color:var(--text-soft)}
.limits li::before{content:"X";display:grid;place-content:center;width:20px;height:20px;font:400 9px/1 var(--pixel);color:#1f0703;background:var(--bad);margin-top:1px}
.limits b{color:var(--text)}

/* A log: decisions, fees, transfers, promotions. */
.log{list-style:none;margin:0;padding:0;display:grid}
.log li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 12px;align-items:baseline;padding:10px 0;border-top:1px solid var(--line);font-size:14px;color:var(--text-soft)}
.log li:first-child{border-top:0}
.log .log-text{min-width:0}
.log .amt{font-weight:800;color:var(--text)}
.log .amt.up{color:var(--up)}
.log .amt.down{color:var(--down)}
.log .log-side{display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:12.5px;color:var(--text-faint);white-space:nowrap}
.log.scroll{max-height:460px;overflow:auto;padding-right:6px}

/* ── the equity chart (drawn in SVG by hq-chart.js) ───────────────────── */
.chart{position:relative;min-height:260px}
.chart svg{display:block;width:100%;height:260px;overflow:visible}
.chart .grid-line{stroke:var(--line);stroke-width:1;shape-rendering:crispEdges}
.chart .axis-text{fill:var(--text-faint);font:500 11px var(--sans);font-variant-numeric:tabular-nums}
.chart .area{fill:var(--mint);opacity:.1}
.chart .line{fill:none;stroke:var(--mint);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.chart .ref{stroke:var(--gold);stroke-width:1;shape-rendering:crispEdges}
.chart .ref-text{fill:var(--gold-text);font:500 11px var(--sans)}
.chart .dot{fill:var(--mint);stroke:var(--card);stroke-width:2}
.chart .cross{stroke:var(--text-faint);stroke-width:1;shape-rendering:crispEdges}
.chart svg:focus-visible{outline:3px solid var(--mint);outline-offset:4px}
.chart-tip{position:absolute;top:0;left:0;z-index:2;pointer-events:none;background:#0b0716;color:#f2edff;padding:8px 10px;font-size:13px;line-height:1.35;box-shadow:0 0 0 2px #5a4a86;white-space:nowrap;transform:translate(-50%,-110%)}
.chart-tip b{display:block;font:800 15px/1.2 var(--sans)}
.chart-empty{display:grid;place-content:center;height:220px;color:var(--text-faint);font-size:14.5px;text-align:center;padding:0 20px}
details.table-view{margin-top:12px}
details.table-view summary{cursor:pointer;font:400 8px/1.6 var(--pixel);text-transform:uppercase;color:var(--text-faint)}
details.table-view .tbl-wrap{max-height:260px;overflow:auto;margin-top:8px}

/* ── Transparency ─────────────────────────────────────────────────────── */
.inv-top .hq-art{width:min(82%,1500px);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 42%),linear-gradient(180deg,#000 60%,transparent 98%);mask-image:linear-gradient(90deg,transparent 0,#000 42%),linear-gradient(180deg,#000 60%,transparent 98%)}
@media (max-width:760px){.inv-top .hq-art{width:calc(100% + 32px);-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 55%,transparent 100%)}}
.cia-card{--accent:var(--gold);display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px 24px;align-items:center}
.cia-card img{width:112px;height:112px;image-rendering:pixelated;box-shadow:0 0 0 3px var(--gold)}
.cia-card .mint{display:block;font:400 14px/1.45 var(--mono);color:var(--text);background:var(--bg-2);padding:10px 12px;box-shadow:inset 0 0 0 2px var(--gold);overflow-wrap:anywhere;user-select:all;margin:8px 0 10px}
.cia-card .mint[data-empty="true"]{color:var(--text-faint);font-style:italic;user-select:none;box-shadow:inset 0 0 0 2px var(--line-2)}
@media (max-width:560px){.cia-card{grid-template-columns:minmax(0,1fr)}.cia-card img{width:84px;height:84px}}
.policy{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px;margin:0 0 20px}
.flow-in{color:var(--up)}
.flow-out{color:var(--down)}
.how{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:800px){.how{grid-template-columns:minmax(0,1fr)}}
.how li{background:var(--card);padding:18px 20px;box-shadow:0 0 0 2px var(--line-2);min-width:0}
:root[data-theme="light"] .how li{box-shadow:0 0 0 2px var(--line)}
.how h3{font:800 17px/1.3 var(--sans);color:var(--text);margin:0 0 6px;display:flex;gap:10px;align-items:center}
.how h3::before{content:"";width:10px;height:10px;flex:none;background:var(--mint)}
.how p{margin:0;font-size:14.5px}
.risks,.never{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.risks li,.never li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;font-size:15.5px;color:var(--text-soft);align-items:start}
.risks li::before{content:"!";display:grid;place-content:center;width:24px;height:24px;font:400 11px/1 var(--pixel);color:#1f0703;background:var(--bad)}
.never li::before{content:"X";display:grid;place-content:center;width:24px;height:24px;font:400 11px/1 var(--pixel);color:#04160e;background:var(--mint)}
.risks b,.never b{color:var(--text)}

/* ── perks ─────────────────────────────────────────────────────────────── */
.steps-3{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;counter-reset:st}
@media (max-width:860px){.steps-3{grid-template-columns:minmax(0,1fr)}}
.steps-3 > li{counter-increment:st;position:relative;background:var(--card);padding:20px 20px 20px;box-shadow:0 0 0 2px var(--line-2);display:flex;flex-direction:column;gap:12px;min-width:0}
:root[data-theme="light"] .steps-3 > li{box-shadow:0 0 0 2px var(--line)}
.steps-3 > li[data-on="true"]{box-shadow:0 0 0 3px var(--mint)}
.steps-3 > li::before{content:counter(st);width:40px;height:40px;display:grid;place-content:center;font:400 16px/1 var(--pixel);color:#04160e;background:var(--mint);clip-path:var(--corners)}
.steps-3 h3{font:800 19px/1.3 var(--sans);color:var(--text);margin:0}
.steps-3 p{margin:0;font-size:14.5px}
.sign-msg{font:400 12.5px/1.55 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;color:var(--text);background:var(--bg-2);padding:12px 14px;box-shadow:inset 0 0 0 1px var(--line);margin:0;max-height:220px;overflow:auto}
.perk-result{margin-top:26px}
.tier{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.tier-name{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(36px,4.4vw,56px);line-height:1;color:var(--gold-text);margin:0}
.perk-list{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.perk-list li{position:relative;padding-left:20px;color:var(--text-soft)}
.perk-list li::before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;background:var(--gold)}
.skins{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:14px}
@media (max-width:1100px){.skins{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:560px){.skins{grid-template-columns:repeat(2,minmax(0,1fr))}}
.skins li{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 10px 14px;background:var(--card);box-shadow:0 0 0 2px var(--line-2);text-align:center;min-width:0}
:root[data-theme="light"] .skins li{box-shadow:0 0 0 2px var(--line)}
.skins .pad{display:flex;align-items:flex-end;justify-content:center;width:100%;height:132px;background:radial-gradient(60% 80% at 50% 100%,rgba(153,69,255,.3),transparent 72%),#0b0716;box-shadow:inset 0 -10px 0 #1a1130}
.skins .pad img{width:auto;height:106px;margin-bottom:8px}
.skins li.perk .pad{background:radial-gradient(60% 80% at 50% 100%,rgba(245,197,66,.34),transparent 72%),#0b0716}
.skins h3{font:400 9px/1.4 var(--pixel);text-transform:uppercase;color:var(--text);margin:0}
.skins p{margin:0;font-size:13px;color:var(--text-faint)}
.skins .lock{font:400 7px/1 var(--pixel);text-transform:uppercase;color:var(--gold-text);box-shadow:inset 0 0 0 1.5px currentColor;padding:4px 5px 3px}
.vote{--accent:var(--violet)}
.soon{display:inline-block;font:400 8px/1 var(--pixel);text-transform:uppercase;color:#fff;background:var(--violet);padding:6px 7px 5px;margin-bottom:12px}
.wallet-line{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font-size:14px;color:var(--text-soft)}

/* ── the home page's HQ band and the floor's link ─────────────────────── */
.hq-band{background:#0b0716;color:#f2edff;border-bottom:3px solid var(--line);padding:26px 0;
  --text:#f2edff;--text-soft:#d4cbef;--text-faint:#a79dca;--line:#2d2049;--line-2:#5a4a86;--card:#140d26;--bg-2:#100a1f;--up:#5ef0b4;--down:#ff8a7a;--paper:#b994ff;--mint-text:#5ef0b4}
.hq-band .wrap{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr) auto;gap:18px 26px;align-items:center}
.hq-band h2{font-size:clamp(26px,2.6vw,34px);margin:6px 0 4px;color:#fff}
.hq-band h2 em{color:var(--mint)}
.hq-band p{margin:0;font-size:14px}
.hq-band .live-pill{font-size:9px;margin-bottom:10px}
.hq-band .stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media (max-width:1180px){.hq-band .stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hq-band .stat{padding:11px 13px 12px;gap:6px}
.hq-band .stat-value{font-size:22px;min-height:0}
.hq-band .past{font-size:12px;color:var(--text-faint);margin-top:6px}
@media (max-width:980px){.hq-band .wrap{grid-template-columns:minmax(0,1fr)}}
.band-soon{grid-column:1/-1;margin:0;padding:14px 16px;font-size:14.5px;color:var(--text-soft);box-shadow:inset 0 0 0 2px var(--gold);background:var(--card)}
.band-go{display:flex;flex-direction:column;align-items:flex-start;gap:6px}

/* The perks page's top: the words, and the two perk skins on a strip of floor. */
.perks-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 40px;align-items:end;margin:14px 0 34px}
.perks-head .lead{max-width:620px;margin-bottom:0}
.perks-cast{position:relative;display:flex;align-items:flex-end;gap:4px;padding:0 18px 22px}
.perks-cast::before{content:"";position:absolute;left:0;right:0;bottom:0;height:34px;border-top:3px solid var(--gold);background:url(floor-tile-256.png) 0 0/128px 128px repeat;image-rendering:pixelated}
.perks-cast img{position:relative;z-index:1;width:auto;height:auto}
@media (max-width:900px){.perks-head{grid-template-columns:minmax(0,1fr)}.perks-cast{justify-content:center}.perks-cast img{width:calc(var(--w,160px) * .75)}}
.perk-status{min-height:1.6em;margin:16px 0 0;color:var(--text-soft);font-size:14.5px}
.stat-value .amt.small{display:block;font-size:17px;line-height:1.3;white-space:normal}

/* ── phones ────────────────────────────────────────────────────────────── */
@media (max-width:560px){
  .stat-head{flex-direction:column-reverse;align-items:flex-start;gap:6px}
  .stat{padding:12px 12px 13px}
  .stat-value{font-size:23px;min-height:0}
  .podium{gap:4px;padding:18px 6px 0}
  .pod-name{font-size:12.5px}
  .pod-value{font-size:15px}
  .pod .rank-chip{padding:3px 5px 3px 4px}
  .pod .rank-chip > span:not(.rank-paper){display:none}
  .board-rows a{padding:9px 12px;gap:8px;grid-template-columns:22px 30px minmax(0,1fr) auto}
  .recruits{gap:18px}
  .hq-top h1{font-size:clamp(32px,10.4vw,56px)}
  .hq-head > div{min-width:0}
  .recruit-body{padding:12px 12px 13px;gap:8px}
  .recruit h3{font-size:24px}
  .recruit-nums{gap:6px}
  .recruit-nums dd{font-size:15px}
  .recruit-foot{flex-direction:column;gap:2px}
  .recruit-chips{gap:6px 8px}
}
/* Between 401 and 560 px a recruit is a row: its kitten beside its figures. */
@media (min-width:401px) and (max-width:560px){
  .recruit{flex-direction:row}
  .recruit-pad{width:118px;height:auto;flex:none}
  .recruit-pad .new{top:auto;bottom:38px;right:auto;left:8px}
}
@media (max-width:400px){.recruit-pad{height:132px}}
.perks-coming{margin:0 3px 30px}
.hq-sec h2.panel-title{font-size:11px;line-height:1.6;letter-spacing:0;margin:0 0 16px}
/* The tiers, from HQ: each with the $CIA it needs and its perks; the visitor's own marked. */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
@media (max-width:860px){.tiers{grid-template-columns:minmax(0,1fr)}}
.tiers > .board-empty,.tiers > .fail{grid-column:1/-1}
.tier-card{background:var(--card);padding:20px 22px;margin:3px;box-shadow:0 0 0 2px var(--line-2);min-width:0}
:root[data-theme="light"] .tier-card{box-shadow:0 0 0 2px var(--line)}
.tier-card.mine{box-shadow:0 0 0 3px var(--gold),8px 8px 0 3px var(--shadow-ink)}
.tier-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.tier-head h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:32px;line-height:1;color:var(--text);margin:0}
.tier-min{margin:0;font:800 15px/1.3 var(--sans);color:var(--gold-text)}
.tier-yours{font:400 7px/1 var(--pixel);text-transform:uppercase;color:#241800;background:var(--gold);padding:5px 6px 4px}
#hq-mode{display:inline-flex;gap:5px}

/* Accents and small settings as classes, not style attributes: the HQ pages' policy refuses
   inline styles as well as inline scripts. */
.hq-page .ac-mint{--accent:#14f195}.hq-page .ac-tear{--accent:#5ab8ff}.hq-page .ac-hoodie{--accent:#8b5cf6}.hq-page .ac-violet{--accent:#9945ff}
.hq-page .ac-pink{--accent:#ff4fd8}.hq-page .ac-gold{--accent:#f5c542}.hq-page .ac-bad{--accent:#ff6b5a}
.cta.gap-top{margin-top:30px}
.kicker.kicker-gold{color:var(--gold)}
.coming-title.on-card{color:var(--text)}
.cast-holder{--w:178px}.cast-nightops{--w:149px}