/* ══════════════ ROBOLS MATH — DESIGN SYSTEM ══════════════
   THREE colour systems, each with exactly one job:
   · CATEGORY (9 hues) → which branch of mathematics
   · BRASS             → rank, rating, achievement — nothing else
   · INK               → interactive chrome (nav, buttons, focus)
   Status green/red are deliberately brighter than the
   Algebra/Combinatorics hues so they never read as categories.
   ═════════════════════════════════════════════════════════ */
html[data-theme="light"]{
  --paper:#FCFBF8; --surface:#FFFFFF; --surface-2:#F4F3EE;
  --ink:#16181B; --ink-2:#585E66; --ink-3:#8B9199;
  --line:#E5E3DC; --line-2:#D1CFC6;
  --accent:#16181B; --accent-2:#EEEDE7;
  --brass:#8A6A28; --brass-2:#F6EFDC;
  --pos:#157F4E; --neg:#B03A2C;

  --alg:#0F6B4F;  --alg-bg:#E4F2EC;
  --geo:#8C6410;  --geo-bg:#F8F0DB;
  --trg:#0D6E86;  --trg-bg:#E1F0F4;
  --nt:#3345A0;   --nt-bg:#E8EAF8;
  --comb:#9C2E3D; --comb-bg:#F9E8EA;
  --calc:#A85218; --calc-bg:#FBEBE0;
  --lin:#6A3789;  --lin-bg:#F1E9F7;
  --log:#4A5A6B;  --log-bg:#EAEEF1;
  --triv:#9B2F72; --triv-bg:#F8E6F0;
}
html[data-theme="dark"]{
  --paper:#0B0D10; --surface:#14171B; --surface-2:#1B1F24;
  --ink:#F0EFEA; --ink-2:#9BA2AA; --ink-3:#6B727A;
  --line:#232830; --line-2:#343A43;
  --accent:#F0EFEA; --accent-2:#1E2228;
  --brass:#CBA765; --brass-2:#2C2617;
  --pos:#4FD09A; --neg:#E8776A;

  --alg:#4FC9A6;  --alg-bg:#0F2E26;
  --geo:#DCA83F;  --geo-bg:#332810;
  --trg:#4FBCD6;  --trg-bg:#0E2E38;
  --nt:#8496F2;   --nt-bg:#1A2046;
  --comb:#E8737F; --comb-bg:#361A20;
  --calc:#EC9257; --calc-bg:#3A2314;
  --lin:#BB8FD9;  --lin-bg:#291A38;
  --log:#93A6B8;  --log-bg:#1E252C;
  --triv:#E381BC; --triv-bg:#361A2C;
}

.t-alg{--c:var(--alg);--cbg:var(--alg-bg);}
.t-geo{--c:var(--geo);--cbg:var(--geo-bg);}
.t-trg{--c:var(--trg);--cbg:var(--trg-bg);}
.t-nt{--c:var(--nt);--cbg:var(--nt-bg);}
.t-comb{--c:var(--comb);--cbg:var(--comb-bg);}
.t-calc{--c:var(--calc);--cbg:var(--calc-bg);}
.t-lin{--c:var(--lin);--cbg:var(--lin-bg);}
.t-log{--c:var(--log);--cbg:var(--log-bg);}
.t-triv{--c:var(--triv);--cbg:var(--triv-bg);}

*{box-sizing:border-box;margin:0;padding:0;}

body{
  /* Fallback --c/--cbg so an unmapped category never renders an invalid
     colour; every t-* class overrides these. */
  --c:var(--ink-3); --cbg:var(--surface-2);
  background:var(--paper); font-family:'Archivo',sans-serif; font-size:15px; line-height:1.55;
  -webkit-font-smoothing:antialiased; color:var(--ink);
  transition:background .25s, color .25s;
}
h1,h2,h3{font-family:'Newsreader',serif;font-weight:500;letter-spacing:-.015em;line-height:1.12;}
a{color:inherit;text-decoration:none;}
button,input,select,textarea{font-family:inherit;color:inherit;}
button{cursor:pointer;background:none;border:none;}
::selection{background:var(--brass);color:var(--paper);}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;}

.app{container-type:inline-size; container-name:app; min-height:100vh; display:flex; flex-direction:column;}
.wrap{max-width:1000px; margin:0 auto; padding:0 32px; width:100%;}
/* Lets short pages still push the sticky mobile tab bar to the bottom. */
.app > .wrap{flex:1; display:flex; flex-direction:column;}

/* ═══ TOP NAV ═══ */
.nav{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(14px) saturate(1.2);border-bottom:1px solid var(--line);}
.nav-in{max-width:1000px;margin:0 auto;padding:0 32px;height:60px;display:flex;align-items:center;gap:32px;}
.brand{display:flex;align-items:baseline;gap:9px;flex-shrink:0;}
.brand .glyph{font-family:'Newsreader',serif;font-size:19px;font-weight:600;color:var(--brass);letter-spacing:-.03em;}
.brand .word{font-family:'Newsreader',serif;font-size:16.5px;font-weight:500;}
.nav-links{display:flex;gap:24px;flex:1;}
.nlink{font-size:13.5px;font-weight:500;color:var(--ink-2);padding:4px 0;position:relative;transition:color .15s;}
.nlink::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1.5px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .2s;}
.nlink:hover{color:var(--ink);}
.nlink.on{color:var(--ink);}
.nlink.on::after{transform:scaleX(1);}
.nav-right{display:flex;align-items:center;gap:14px;flex-shrink:0;margin-left:auto;}
.rate-tag{font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:500;color:var(--brass);letter-spacing:.04em;padding-right:14px;border-right:1px solid var(--line);}
.rate-tag[hidden]{display:none;}
.icb{width:26px;height:26px;display:grid;place-items:center;color:var(--ink-2);border-radius:4px;transition:.15s;}
.icb:hover{color:var(--ink);background:var(--surface-2);}
html[data-theme="dark"] .i-sun{display:none;}
html[data-theme="light"] .i-moon{display:none;}
.me{width:28px;height:28px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-2);transition:.15s;flex-shrink:0;overflow:hidden;}
.me:hover{border-color:var(--ink);color:var(--ink);}
.me img{width:100%;height:100%;object-fit:cover;display:block;}
.nav-signin{font-size:12.5px;font-weight:500;padding:7px 15px;border:1px solid var(--line-2);border-radius:3px;transition:.15s;white-space:nowrap;}
.nav-signin:hover{border-color:var(--ink);}
#nav-auth{display:flex;align-items:center;gap:12px;}
.nav-admin{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--brass);border:1px solid var(--brass);padding:4px 9px;border-radius:2px;transition:.15s;white-space:nowrap;}
.nav-admin:hover{background:var(--brass);color:var(--paper);}
.mob-only{display:none;}

/* ═══ NOTIFICATIONS ═══ */
.notif-wrap{position:relative;display:inline-flex;}
.notif-count{position:absolute;top:-3px;right:-4px;min-width:15px;height:15px;padding:0 4px;border-radius:8px;background:var(--brass);color:var(--paper);font-family:'JetBrains Mono',monospace;font-size:8.5px;display:grid;place-items:center;}
/* display:grid above outranks the hidden attribute, so it needs saying. */
.notif-count[hidden]{display:none;}
.notif-panel{display:none;position:absolute;top:34px;right:0;width:320px;max-height:400px;overflow-y:auto;background:var(--surface);border:1px solid var(--line-2);border-radius:4px;box-shadow:0 10px 32px rgba(0,0,0,.16);z-index:70;}
.notif-panel.show{display:block;}
.notif-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line);font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);}
.notif-head button{font-family:inherit;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);transition:color .15s;}
.notif-head button:hover{color:var(--ink);}
.notif{display:flex;gap:11px;padding:12px 14px;border-bottom:1px solid var(--line);transition:background .15s;}
.notif:last-child{border-bottom:none;}
.notif:hover{background:var(--surface-2);}
.notif.unread{background:var(--brass-2);}
.notif-icon{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--brass);flex-shrink:0;width:14px;}
.notif-main{min-width:0;}
.notif-title{display:block;font-size:13px;font-weight:500;}
.notif-body{display:block;margin-top:2px;font-size:12px;color:var(--ink-2);}
.notif-when{display:block;margin-top:4px;font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);}
.notif-empty{padding:22px 14px;text-align:center;color:var(--ink-3);font-size:13px;}

/* ═══ MOBILE BOTTOM TABS ═══ */
.tabs{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:45;
  background:color-mix(in srgb,var(--paper) 94%,transparent); backdrop-filter:blur(14px);
  border-top:1px solid var(--line); padding:7px 6px calc(7px + env(safe-area-inset-bottom));
}
.tabs .row{display:grid; grid-auto-flow:column; grid-auto-columns:1fr;}
.tab{display:flex;flex-direction:column;align-items:center;gap:4px;padding:5px 0;color:var(--ink-3);transition:color .15s;}
.tab svg{display:block;}
.tab span{font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.06em;text-transform:uppercase;}
.tab.on{color:var(--ink);}

/* ═══ MOBILE OVERFLOW SHEET ═══ */
.sheet{display:none;position:fixed;inset:0;z-index:60;background:color-mix(in srgb,var(--paper) 82%,transparent);backdrop-filter:blur(8px);}
.sheet.show{display:block;}
.sheet-in{position:absolute;left:14px;right:14px;bottom:14px;background:var(--surface);border:1px solid var(--line-2);border-radius:12px;overflow:hidden;}
.sheet-in a,.sheet-in button{display:block;width:100%;text-align:left;padding:15px 20px;font-size:14.5px;border-bottom:1px solid var(--line);font-family:inherit;}
.sheet-in :last-child{border-bottom:none;color:var(--ink-3);}

/* ═══ SHELL ═══ */
.page{padding:52px 0 96px;animation:fade .32s ease;flex:1;}
@keyframes fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.page{animation:none;}*{transition-duration:.01ms !important;}}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:10.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin-bottom:13px;}
.ptitle{font-size:38px;margin-bottom:8px;}
.plede{color:var(--ink-2);font-size:14.5px;max-width:460px;margin-bottom:38px;}
.shead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-bottom:13px;border-bottom:1px solid var(--line);margin-bottom:4px;}
.shead h2{font-size:15.5px;font-weight:500;}
.shead .more{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;}
.tp{display:inline-flex;align-items:center;gap:6px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--c);background:var(--cbg);padding:3px 8px;border-radius:2px;white-space:nowrap;}
.tp b{width:4px;height:4px;border-radius:50%;background:var(--c);display:block;}

/* ═══ BUTTONS ═══ */
.btn{font-size:12.5px;font-weight:500;padding:9px 20px;border-radius:3px;transition:.15s;white-space:nowrap;display:inline-block;text-align:center;}
.btn-solid{background:var(--ink);color:var(--paper);}
.btn-solid:hover{opacity:.85;}
.btn-line{border:1px solid var(--line-2);color:var(--ink);}
.btn-line:hover{border-color:var(--ink);}
.btn:disabled{opacity:.5;cursor:default;}
.btn-full{width:100%;}

/* ═══ HERO / HOME ═══ */
.hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:54px;align-items:start;padding-bottom:50px;}
.hero-grid h1{font-size:52px;letter-spacing:-.028em;margin-bottom:18px;max-width:12ch;}
.hero-grid h1 em{font-style:italic;color:var(--brass);font-weight:400;}
.hero-grid .sub{color:var(--ink-2);font-size:15.5px;max-width:400px;line-height:1.65;}

/* ═══ LIVE PROBLEM PANEL ═══ */
.live{border:1px solid var(--line);background:var(--surface);border-radius:3px;overflow:hidden;}
.live-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 20px;border-bottom:1px solid var(--line);background:var(--cbg);}
.live-src{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--c);}
.live-rate{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--brass);}
.live-body{padding:26px 22px 20px;display:flex;gap:16px;}
.spine{width:3px;background:var(--line);border-radius:2px;flex-shrink:0;position:relative;}
.spine i{position:absolute;bottom:0;left:0;right:0;background:var(--c);border-radius:2px;display:block;}
.live-q{font-family:'Newsreader',serif;font-size:17.5px;line-height:1.55;}
.live-q i{font-style:italic;}
.choices{padding:4px 22px 22px 41px;display:flex;flex-direction:column;gap:1px;}
.choice{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:10px 12px;border:1px solid transparent;border-radius:3px;transition:.14s;}
.choice:hover{background:var(--surface-2);}
.choice .key{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--ink-3);width:16px;height:16px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;flex-shrink:0;transition:.14s;}
.choice .val{font-family:'Newsreader',serif;font-size:16px;}
.choice.pick{border-color:var(--line-2);background:var(--surface-2);}
.choice.pick .key{background:var(--ink);border-color:var(--ink);color:var(--paper);}
.choice.right{border-color:var(--pos);background:color-mix(in srgb,var(--pos) 9%,transparent);}
.choice.right .key{background:var(--pos);border-color:var(--pos);color:var(--paper);}
.choice.wrong .key{border-color:var(--neg);color:var(--neg);}
.choice .mark{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.08em;}
.choice.right .mark{color:var(--pos);}
.choice.wrong .mark{color:var(--neg);}
.live-foot{padding:14px 22px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.live-foot .stat{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--ink-3);letter-spacing:.05em;}
.live-foot .stat.ok{color:var(--pos);}
.live-foot .stat.no{color:var(--neg);}
.numeric-entry{padding:4px 22px 22px 41px;}
.numeric-entry input{width:100%;max-width:260px;background:transparent;border:none;border-bottom:1px solid var(--line-2);padding:7px 0;font-family:'JetBrains Mono',monospace;font-size:15px;transition:border-color .15s;}
.numeric-entry input:focus{outline:none;border-bottom-color:var(--ink);}

/* ═══ ARCHIVE COMPOSITION BAR ═══ */
.comp{padding-bottom:52px;}
.comp-bar{display:flex;height:46px;gap:2px;margin-bottom:18px;}
.comp-seg{background:var(--c);border-radius:2px;opacity:.9;transition:opacity .18s,transform .18s;min-width:3px;}
.comp-seg:hover{opacity:1;transform:scaleY(1.08);}
.comp-key{display:grid;grid-template-columns:repeat(5,1fr);gap:11px 18px;margin-bottom:52px;}
.comp-key div{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-2);}
.comp-key i{width:9px;height:9px;border-radius:2px;background:var(--c);display:block;flex-shrink:0;}
.comp-key span{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3);margin-left:auto;}

/* ═══ STAT GROUPS ═══ */
.strip{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:52px;}
.strip div{padding:22px 0;}
.strip div + div{border-left:1px solid var(--line);padding-left:24px;}
.strip .n{font-family:'JetBrains Mono',monospace;font-size:22px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
.strip .l{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);margin-top:5px;}
.stat-line{display:grid;grid-template-columns:repeat(auto-fit,minmax(152px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden;margin-bottom:44px;}
.stat-line div{display:flex;align-items:baseline;gap:9px;padding:16px 18px;background:var(--paper);}
.stat-line .n{font-family:'JetBrains Mono',monospace;font-size:20px;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums;}
.stat-line .l{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);}

/* ═══ PROBLEM ROWS ═══ */
.filters{display:flex;gap:18px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:4px;}
.fchip{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-3);font-weight:500;padding:2px 0;border-bottom:1.5px solid transparent;transition:.15s;white-space:nowrap;}
.fchip i{width:6px;height:6px;border-radius:50%;background:var(--c,var(--ink-3));display:block;}
.fchip:hover{color:var(--ink);}
.fchip.on{color:var(--ink);border-bottom-color:var(--c,var(--ink));}
.prow{display:grid;grid-template-columns:4px 1fr auto auto;gap:20px;align-items:center;padding:17px 12px 17px 0;border-bottom:1px solid var(--line);transition:background .15s;width:100%;text-align:left;}
.prow:hover{background:var(--surface-2);}
.prow .sp{height:36px;background:var(--line);border-radius:2px;position:relative;overflow:hidden;}
.prow .sp i{position:absolute;bottom:0;left:0;right:0;background:var(--c);display:block;}
.prow .body{min-width:0;}
.prow .ttl{font-family:'Newsreader',serif;font-size:16.5px;margin-bottom:6px;display:block;}
.prow .meta{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--ink-3);letter-spacing:.06em;display:flex;gap:11px;align-items:center;flex-wrap:wrap;}
.prow .meta .done{color:var(--pos);}
.prow .meta .forfeited{color:var(--ink-3);font-style:italic;}
.prow .rate{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--brass);}
.prow .pct{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3);width:44px;text-align:right;}

/* ═══ LOCKED DISCUSSION ═══ */
.locked-note{display:flex;align-items:center;gap:11px;padding:26px 0;color:var(--ink-3);font-size:13.5px;}
.locked-note svg{flex-shrink:0;}
.live-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.giveup-note{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);}

/* ═══ THREADED COMMENTS ═══ */
.cmt-controls{display:flex;justify-content:flex-end;padding:30px 0 14px;border-bottom:1px solid var(--line);}
a.who-name{transition:color .15s;}
a.who-name:hover{color:var(--brass);}
.cmt-actions{display:flex;align-items:center;gap:6px;margin-top:9px;}
.vote{width:22px;height:22px;display:grid;place-items:center;border:1px solid transparent;border-radius:3px;color:var(--ink-3);transition:.14s;}
.vote:hover:not(:disabled){color:var(--ink);border-color:var(--line-2);}
.vote:disabled{opacity:.3;cursor:default;}
.vote.up.on{color:var(--pos);border-color:var(--pos);}
.vote.down.on{color:var(--neg);border-color:var(--neg);}
.cmt-score{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--ink-2);min-width:16px;text-align:center;}
.cmt-reply{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);margin-left:8px;transition:color .14s;}
.cmt-reply:hover{color:var(--ink);}
/* Each level indents behind a rule, so the nesting reads without boxes. */
.cmt.d1,.cmt.d2{margin-left:20px;padding-left:16px;border-left:1px solid var(--line);}
.reply-box{margin:14px 0 4px;}
.reply-input{width:100%;min-height:66px;padding:11px 13px;border:1px solid var(--line-2);border-radius:3px;font-family:inherit;font-size:14px;background:var(--surface);resize:vertical;margin-bottom:9px;}
.reply-input:focus{outline:none;border-color:var(--ink);}

/* ═══ REVEALED ANSWER ═══ */
.revealed{display:flex;align-items:baseline;gap:12px;margin-top:14px;padding:11px 14px;border:1px solid var(--pos);border-radius:3px;background:color-mix(in srgb,var(--pos) 8%,transparent);}
.revealed .lbl{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--pos);}
.revealed .val{font-family:'JetBrains Mono',monospace;font-size:16px;color:var(--pos);}
.choice:disabled{cursor:default;}

/* ═══ TAGS + SUGGESTION ═══ */
#tags-root .tagrow{padding:20px 0 0;}
.tag-suggest{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);border:1px dashed var(--line-2);padding:3px 9px;border-radius:2px;transition:.15s;}
.tag-suggest:hover{border-color:var(--ink);color:var(--ink);}
.suggest-box{margin-top:18px;padding:20px;border:1px solid var(--line);border-radius:4px;max-width:380px;}

/* ═══ NEXT ═══ */
#next-root{padding:22px 0 0;}
.next-btn{display:inline-flex;}
.all-done{font-family:'Newsreader',serif;font-size:18px;color:var(--pos);padding:6px 0;}

/* ═══ FASTEST SOLVERS ═══ */
.first-solvers-bar{padding:26px 0 0;}
.first-solvers{margin-top:16px;border-top:1px solid var(--line);}
.frow{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line);font-size:13.5px;}
.fpos{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--ink-3);}
.fname{font-weight:500;}
.fcountry{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.05em;color:var(--ink-3);}

/* ═══ DIFFICULTY VOTE ═══ */
.votebox{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:20px 0;border-bottom:1px solid var(--line);margin-top:26px;}
.vlabel{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);}
.vscale{display:flex;gap:5px;}
.vbtn{width:27px;height:27px;border:1px solid var(--line-2);border-radius:3px;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-2);transition:.14s;}
.vbtn:hover{border-color:var(--ink);color:var(--ink);}
.vbtn.on{background:var(--brass);border-color:var(--brass);color:var(--paper);}
.vnote{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-left:auto;}

/* ═══ NEW BADGE + FEATURED ═══ */
.newtag{font-family:'JetBrains Mono',monospace;font-size:8.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);border:1px solid var(--brass);padding:2px 6px;border-radius:2px;}
.featured-label{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--brass);margin-bottom:10px;}
.featured-open{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-left:12px;transition:color .15s;}
.featured-open:hover{color:var(--ink);}

/* ═══ ADMIN PANEL ═══ */
.adm-toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,14px);opacity:0;transition:.22s;z-index:90;background:var(--pos);color:var(--paper);padding:12px 20px;border-radius:3px;font-size:13.5px;font-weight:500;box-shadow:0 8px 24px rgba(0,0,0,.2);max-width:90vw;}
.adm-toast.show{opacity:1;transform:translate(-50%,0);}
.contrib-status{font-family:'JetBrains Mono',monospace;font-size:8.5px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;padding:3px 8px;border-radius:2px;flex-shrink:0;width:76px;text-align:center;}
.contrib-status.accepted{background:color-mix(in srgb,var(--pos) 16%,transparent);color:var(--pos);}
.contrib-status.pending{background:var(--surface-2);color:var(--ink-3);}
.contrib-status.rejected{background:color-mix(in srgb,var(--neg) 14%,transparent);color:var(--neg);}
.adm-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:30px;}
.adm-strip > div{background:var(--paper);padding:16px 18px;}
.adm-strip .n{display:block;font-family:'JetBrains Mono',monospace;font-size:20px;color:var(--ink);}
.adm-strip .l{display:block;margin-top:4px;font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);}

.adm{border:1px solid var(--line);border-radius:3px;margin-bottom:10px;background:var(--surface);}
.adm > summary{display:flex;align-items:center;gap:12px;padding:15px 18px;cursor:pointer;list-style:none;user-select:none;}
.adm > summary::-webkit-details-marker{display:none;}
.adm > summary:hover{background:var(--surface-2);}
.adm-title{font-family:'Newsreader',serif;font-size:16px;flex:1;}
.adm-count{font-family:'JetBrains Mono',monospace;font-size:10px;background:var(--brass);color:var(--paper);padding:2px 7px;border-radius:9px;}
.adm-chev{color:var(--ink-3);transition:transform .18s;flex-shrink:0;}
.adm[open] > summary .adm-chev{transform:rotate(180deg);}
.adm[open] > summary{border-bottom:1px solid var(--line);}
.adm-body{padding:20px 18px 24px;}
.adm-note{font-size:12.5px;color:var(--ink-2);line-height:1.7;margin-bottom:16px;}
.adm-note code{font-family:'JetBrains Mono',monospace;font-size:11px;background:var(--surface-2);padding:1px 5px;border-radius:2px;}

.adm-split{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;}
.adm-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.adm-preview-label{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px;}

.adm-item{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);}
.adm-item.stacked{align-items:flex-start;flex-wrap:wrap;}
.adm-item:last-child{border-bottom:none;}
.adm-item.bad{opacity:.65;}
.adm-item-main{flex:1;min-width:0;}
.adm-item-title{display:block;font-size:14px;font-weight:500;}
.adm-item-title em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-left:6px;}
.adm-item-meta{display:block;margin-top:3px;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.05em;color:var(--ink-3);}
.adm-quote{margin-top:9px;padding:11px 13px;background:var(--surface-2);border-radius:3px;font-size:13.5px;color:var(--ink-2);width:100%;}
.adm-actions{display:flex;gap:8px;flex-wrap:wrap;flex-shrink:0;}
.adm-actions .btn{padding:7px 13px;font-size:12px;}
.adm-line,.adm-date{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--ink-3);flex-shrink:0;width:78px;}
.adm-line{width:40px;}
.adm-setting{width:88px;border:1px solid var(--line-2);border-radius:3px;padding:7px 10px;font-family:'JetBrains Mono',monospace;font-size:12.5px;background:var(--surface);}
.adm select[multiple]{height:auto;padding:8px 10px;background-image:none;}

/* ═══ BROWSE CONTROLS ═══ */
.browse-bar{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px;}
.searchfield{display:flex;align-items:center;gap:9px;flex:1;min-width:210px;border:1px solid var(--line-2);border-radius:3px;padding:0 12px;background:var(--surface);transition:border-color .15s;}
.searchfield:focus-within{border-color:var(--ink);}
.searchfield svg{color:var(--ink-3);flex-shrink:0;}
.searchfield input{flex:1;border:none;background:none;padding:11px 0;font-size:14px;outline:none;}
.searchfield input::-webkit-search-cancel-button{cursor:pointer;}
.tagfield{flex:0 1 240px;}

.browse-filters{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px;}
.segmented{display:inline-flex;border:1px solid var(--line-2);border-radius:3px;overflow:hidden;}
.segmented button{font-size:12px;font-weight:500;padding:7px 14px;color:var(--ink-2);border-right:1px solid var(--line-2);transition:.15s;}
.segmented button:last-child{border-right:none;}
.segmented button:hover:not(:disabled){background:var(--surface-2);color:var(--ink);}
.segmented button.on{background:var(--accent);color:var(--paper);}
.segmented button:disabled{opacity:.4;cursor:default;}
.minisel{border:1px solid var(--line-2);border-radius:3px;background:var(--surface);padding:7px 30px 7px 11px;font-size:12px;color:var(--ink-2);cursor:pointer;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%238B9199' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:12px;}
.minisel:hover{border-color:var(--ink);}
.browse-count{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);}
.active-filters{display:flex;gap:8px;flex-wrap:wrap;padding:0 0 14px;}

.prow .solvers{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3);width:44px;text-align:right;}

/* ═══ PAGER ═══ */
.pager{display:flex;align-items:center;justify-content:center;gap:18px;padding:30px 0 0;}
.pbtn{font-size:12.5px;font-weight:500;color:var(--ink-2);border:1px solid var(--line-2);border-radius:3px;padding:8px 15px;transition:.15s;}
.pbtn:hover:not(:disabled){border-color:var(--ink);color:var(--ink);}
.pbtn:disabled{opacity:.35;cursor:default;}
.pinfo{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);}

/* ═══ HOME SEARCH ═══ */
.home-search{padding:0 0 46px;}
.home-search .searchfield{max-width:520px;}
#home-results{margin-top:10px;}

/* ═══ TAGS ═══ */
.tagrow{display:flex;flex-wrap:wrap;gap:7px;padding:0 22px 18px 41px;}
.tagchip{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line);padding:3px 8px;border-radius:2px;transition:.15s;}
.tagchip:hover{border-color:var(--ink);color:var(--ink);}
.tagchip.on{border-color:var(--ink);color:var(--ink);}

/* ═══ LEADERBOARD ═══ */
.ltabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:4px;}
.ltab{font-size:13px;font-weight:500;color:var(--ink-3);padding:0 0 13px;position:relative;transition:color .15s;}
.ltab::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1.5px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .2s;}
.ltab:hover{color:var(--ink);}
.ltab.on{color:var(--ink);}
.ltab.on::after{transform:scaleX(1);}
.lrow{display:grid;grid-template-columns:44px 1fr 88px;gap:16px;align-items:center;padding:15px 12px 15px 0;border-bottom:1px solid var(--line);transition:background .15s;}
.lrow:hover{background:var(--surface-2);}
.lrow.self{background:var(--brass-2);}
.lrank{font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--ink-3);display:flex;align-items:center;gap:8px;}
.lrow.self .lrank{color:var(--brass);}
.who{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:500;min-width:0;}
a.who .whoname{transition:color .15s;}
a.who:hover .whoname{color:var(--brass);}
.init{width:26px;height:26px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;flex-shrink:0;font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--ink-2);overflow:hidden;}
.init img{width:100%;height:100%;object-fit:cover;display:block;}
.who .aff{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-3);letter-spacing:.06em;}
.lval{font-family:'JetBrains Mono',monospace;font-size:13.5px;text-align:right;font-variant-numeric:tabular-nums;}
.medal{width:13px;height:13px;flex-shrink:0;}

/* ═══ CONTRIBUTE ═══ */
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:54px;margin-bottom:56px;}
.cblock h3{font-size:20px;margin-bottom:9px;}
.cblock p.note{color:var(--ink-2);font-size:13.5px;margin-bottom:26px;line-height:1.65;max-width:38ch;}
.crow{display:flex;gap:13px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--ink-2);flex-wrap:wrap;}
.crow .nm{color:var(--ink);font-weight:500;flex-shrink:0;}
.crow .when{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-3);flex-shrink:0;}

/* ═══ ACHIEVEMENT SEALS (§7.7 — SVG rings, never emoji) ═══ */
/* ══════════════ BADGES ══════════════ */
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px;padding:22px 0 0;}
.badge{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:16px 10px;border:1px solid var(--line);border-radius:3px;transition:border-color .15s;}
.badge:hover{border-color:var(--line-2);}
.badge svg{flex-shrink:0;}
.badge-name{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);line-height:1.45;}
.badge-next{font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.05em;color:var(--ink-3);}
.badge.lock{opacity:.34;}
.badge.lock .badge-name{color:var(--ink-3);}
.badges-card{max-width:640px;}
.badge-group{margin-bottom:26px;}
.badge-group h3{font-size:13px;font-family:'JetBrains Mono',monospace;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);font-weight:500;}
.badge-group .badges{padding-top:12px;}
@media (max-width:520px){.badges{grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:8px;}}

/* ═══ TOP-VOTED SOLUTIONS ═══ */
.solrow{display:grid;grid-template-columns:44px 1fr;gap:15px;align-items:start;padding:15px 0;border-bottom:1px solid var(--line);transition:background .15s;}
.solrow:last-child{border-bottom:none;}
.solrow:hover{background:var(--surface-2);}
.solscore{font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--pos);text-align:right;padding-top:2px;}
.solbody{min-width:0;}
.soltext{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;}
.solmeta{display:block;margin-top:5px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--c);}

/* ═══ ACTIVITY FEED ═══ */
.arow{display:grid;grid-template-columns:8px 1fr auto;gap:15px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);font-size:13.5px;transition:background .15s;}
.arow:hover{background:var(--surface-2);}
.arow:last-child{border-bottom:none;}
.adot{width:7px;height:7px;border-radius:50%;background:var(--c);}
.arow .d{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--ink-3);}
.arow .d.up{color:var(--pos);}
.arow .d.dn{color:var(--neg);}
.arow em{font-style:normal;font-family:'Newsreader',serif;font-size:15px;}

/* ═══ ABOUT ═══ */
.about-lede{font-family:'Newsreader',serif;font-size:22px;line-height:1.5;max-width:26ch;margin-bottom:44px;letter-spacing:-.01em;}
.ablock{display:grid;grid-template-columns:180px 1fr;gap:38px;padding:28px 0;border-top:1px solid var(--line);}
.ablock h3{font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);padding-top:4px;}
.ablock p{color:var(--ink-2);font-size:14.5px;line-height:1.75;max-width:60ch;}
.ablock p + p{margin-top:14px;}
.ablock b{color:var(--ink);font-weight:500;}
.legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:46px;}

/* ═══ DISCUSSION ═══ */
.backlink{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);display:inline-block;margin-bottom:26px;transition:color .15s;}
.backlink:hover{color:var(--ink);}
.cmt{padding:16px 0;border-bottom:1px solid var(--line);}
.cmt:last-child{border-bottom:none;}
.cmt-meta{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.06em;color:var(--ink-3);display:flex;gap:12px;margin-bottom:7px;}
.cmt-meta .who-name{color:var(--ink-2);}
.cmt-body{font-family:'Newsreader',serif;font-size:15.5px;line-height:1.6;white-space:pre-wrap;}

/* ═══ FORMS (§7.10 — underline only, never filled boxes) ═══ */
.fld{margin-bottom:22px;}
.fld label{display:block;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px;}
.fld input,.fld select,.fld textarea{width:100%;background:transparent;border:none;border-bottom:1px solid var(--line-2);padding:7px 0;font-size:14px;transition:border-color .15s;border-radius:0;}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-bottom-color:var(--ink);}
.fld textarea{min-height:64px;resize:vertical;font-family:'Newsreader',serif;font-size:15.5px;}
.fld input::placeholder,.fld textarea::placeholder{color:var(--ink-3);font-family:'Archivo',sans-serif;font-size:13.5px;}
.fld select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;padding-right:22px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%238B9199' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 0 center;background-size:13px;
}
.fld select option{background:var(--surface);color:var(--ink);}

/* ═══ AUTH ═══ */
.auth-page{padding:64px 0 96px;display:flex;justify-content:center;flex:1;}
.auth-card{width:100%;max-width:392px;}
.auth-card h1{font-size:29px;margin-bottom:8px;}
.auth-card .lede{color:var(--ink-2);font-size:13.5px;margin-bottom:32px;}
.auth-tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:30px;}
.auth-tab{font-size:13.5px;font-weight:500;color:var(--ink-3);padding:0 0 11px;position:relative;transition:color .15s;}
.auth-tab::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1.5px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .2s;}
.auth-tab:hover{color:var(--ink);}
.auth-tab.on{color:var(--ink);}
.auth-tab.on::after{transform:scaleX(1);}
.auth-divider{display:flex;align-items:center;gap:12px;margin:22px 0;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--line);}
.auth-links{margin-top:20px;display:flex;justify-content:center;gap:16px;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;}
.auth-links a{color:var(--ink-3);transition:color .15s;}
.auth-links a:hover{color:var(--ink);}
.msg{font-size:12.5px;margin-bottom:18px;line-height:1.5;}
.msg:empty{display:none;}
.msg.error{color:var(--neg);}
.msg.success{color:var(--pos);}
.msg.info{color:var(--ink-2);}
.gbtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;font-size:13px;font-weight:500;padding:10px 20px;border:1px solid var(--line-2);border-radius:3px;transition:.15s;}
.gbtn:hover{border-color:var(--ink);}
.gbtn svg{flex-shrink:0;}

/* ═══ PROFILE ═══ */
.phead{display:flex;align-items:flex-start;gap:24px;margin-bottom:42px;}
/* overflow:hidden + object-fit:cover means any aspect ratio crops to a
   centred circle rather than distorting. */
.pav{width:74px;height:74px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;flex-shrink:0;font-family:'Newsreader',serif;font-size:26px;font-weight:500;overflow:hidden;position:relative;}
.pav img{width:100%;height:100%;object-fit:cover;display:block;grid-area:1/1;}
.pav.editable{cursor:pointer;}
.pav-hint{
  position:absolute;inset:0;display:grid;place-items:center;
  background:color-mix(in srgb,var(--ink) 62%,transparent);color:var(--paper);
  font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.11em;text-transform:uppercase;
  opacity:0;transition:opacity .15s;
}
.pav.editable:hover .pav-hint,
.pav.editable:focus-within .pav-hint{opacity:1;}
.phead .nm{font-size:30px;margin-bottom:7px;}
.phead .meta{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3);letter-spacing:.06em;display:flex;gap:16px;flex-wrap:wrap;}
.phead .meta b{color:var(--brass);font-weight:500;}
.phead-actions{margin-left:auto;display:flex;gap:10px;flex-shrink:0;}
.mrow{display:grid;grid-template-columns:14px 132px 1fr 40px;gap:14px;align-items:center;padding:13px 0;border-bottom:1px solid var(--line);}
.mrow:last-child{border-bottom:none;}
.mrow .dot{width:8px;height:8px;border-radius:50%;background:var(--c);}
.mrow .t{font-size:13.5px;color:var(--ink-2);}
.mrow .t em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-3);margin-left:6px;}
.shead .more{cursor:pointer;transition:color .15s;}
.shead button.more:hover{color:var(--ink);}
.mtrack{height:3px;background:var(--line);position:relative;border-radius:2px;overflow:hidden;}
.mtrack i{position:absolute;left:0;top:0;bottom:0;background:var(--c);display:block;}
.mrow .p{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ink-3);text-align:right;font-variant-numeric:tabular-nums;}

/* profile detail rows (view mode) */

/* ═══ MODAL (onboarding) ═══ */
.modal-overlay{position:fixed;inset:0;background:color-mix(in srgb,var(--paper) 80%,transparent);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:100;}
.modal-card{background:var(--surface);border:1px solid var(--line-2);border-radius:3px;padding:34px;width:100%;max-width:412px;max-height:88vh;overflow-y:auto;}
.modal-card h2{font-size:23px;margin-bottom:7px;}
.modal-card .lede{color:var(--ink-2);font-size:13.5px;margin-bottom:28px;}
.modal-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:8px;}

.state{color:var(--ink-3);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:44px 0;text-align:center;}

/* ══════════ MOBILE (container queries, single 700px breakpoint) ══════════ */
@container app (max-width:700px){
  .wrap{padding:0 18px;}
  .nav-in{padding:0 18px;height:54px;gap:12px;}
  .nav-links{display:none;}
  .nav-right{gap:10px;}
  .brand .word{font-size:15px;}
  .mob-only{display:grid;}
  .tabs{display:block;}
  /* .app is the query container, so it cannot be styled from inside its
     own  block. The space the fixed bar needs is reserved
     below the last child instead. */
  .site-foot{margin-bottom:calc(60px + env(safe-area-inset-bottom));}
  .page{padding:30px 0 26px;}

  .ptitle{font-size:29px;}
  .plede{font-size:13.5px;margin-bottom:26px;}
  .hero-grid{grid-template-columns:1fr;gap:28px;padding-bottom:38px;}
  .hero-grid h1{font-size:34px;max-width:none;}
  .hero-grid .sub{font-size:14.5px;}

  .live-body{padding:20px 16px 16px;}
  .live-q{font-size:16px;}
  .choices{padding:2px 16px 16px 33px;}
  .numeric-entry{padding:2px 16px 16px 33px;}
  .live-top,.live-foot{padding-left:16px;padding-right:16px;}
  .live-foot{flex-direction:column;align-items:stretch;gap:10px;}
  .live-foot .btn{width:100%;}
  .live-src{font-size:9.5px;}

  .strip{grid-template-columns:1fr 1fr;margin-bottom:38px;}
  .strip div{padding:16px 0;}
  .strip div + div{border-left:none;padding-left:0;}
  .strip div:nth-child(2),.strip div:nth-child(4){border-left:1px solid var(--line);padding-left:18px;}
  .strip div:nth-child(3),.strip div:nth-child(4){border-top:1px solid var(--line);}
  .strip .n{font-size:19px;}

  .stat-line{margin-bottom:32px;}
  .stat-line div{padding:13px 16px;flex:1 1 auto;}
  .stat-line .n{font-size:17px;}
  .stat-line .l{font-size:9px;}

  .comp-bar{height:34px;}
  .comp-key{grid-template-columns:1fr 1fr;gap:9px 14px;margin-bottom:38px;}
  .comp-key div{font-size:11.5px;}
  .comp{padding-bottom:38px;}

  .filters{gap:14px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;}
  .filters::-webkit-scrollbar{display:none;}
  /* Row drops the solve-% column; the spine grows so the category colour
     stays legible (§6). */
  .prow{grid-template-columns:4px 1fr auto auto;gap:14px;padding:15px 0;}
  .prow .ttl{font-size:15.5px;}
  .prow .sp{height:42px;}
  .prow .pct{display:none;}
  .prow .rate{font-size:12px;}
  .prow .solvers{width:auto;min-width:24px;font-size:10.5px;}

  .browse-bar{gap:9px;}
  .searchfield,.tagfield{flex:1 1 100%;min-width:0;}
  .browse-filters{gap:9px;}
  .segmented button{padding:7px 11px;font-size:11.5px;}
  .browse-count{margin-left:0;width:100%;}
  .pager{gap:12px;}

  .lrow{grid-template-columns:34px 1fr 62px;gap:10px;padding:13px 0;}
  .who{font-size:13.5px;gap:10px;}
  .who .aff{display:none;}
  .init{width:24px;height:24px;font-size:9px;}

  .adm-strip{grid-template-columns:repeat(2,1fr);}
  .adm-split,.adm-row{grid-template-columns:1fr;gap:18px;}
  .adm-item{flex-wrap:wrap;}
  .adm-actions{width:100%;}

  .cmt.d1,.cmt.d2{margin-left:10px;padding-left:12px;}
  .frow{grid-template-columns:32px 1fr auto;gap:10px;font-size:13px;}
  .suggest-box{max-width:none;}
  .votebox{gap:11px;}
  .vscale{gap:4px;}
  .vbtn{width:25px;height:25px;font-size:10px;}
  .vnote{margin-left:0;width:100%;}

  .cgrid{grid-template-columns:1fr;gap:40px;margin-bottom:38px;}
  .cblock p.note{max-width:none;}
  .crow{font-size:12.5px;gap:9px;}
  .crow .when{margin-left:0;}

  .seals{grid-template-columns:repeat(3,1fr);gap:20px 10px;}
  .arow{grid-template-columns:8px 1fr;row-gap:5px;}
  .arow .d{grid-column:2;justify-self:start;}

  .about-lede{font-size:19px;max-width:none;}
  .ablock{grid-template-columns:1fr;gap:12px;padding:22px 0;}
  .ablock p{font-size:13.5px;}
  .two-col{grid-template-columns:1fr;gap:36px;}
  .tagrow{padding:0 16px 14px 33px;}

  .phead{gap:16px;margin-bottom:28px;flex-wrap:wrap;}
  .pav{width:58px;height:58px;font-size:21px;}
  .phead .nm{font-size:24px;}
  .phead .meta{font-size:10px;gap:12px;}
  .phead-actions{margin-left:0;width:100%;}
  .phead-actions .btn{flex:1;}
  /* Bar drops to its own line; the percentage stays on the label's line
     rather than being pushed to a third row by auto-placement. */
  .mrow{grid-template-columns:14px 1fr auto;gap:11px;row-gap:9px;}
  .mrow .p{grid-row:1;grid-column:3;}
  .mrow .mtrack{grid-row:2;grid-column:1/-1;}


  .auth-page{padding:36px 0 40px;}
  .modal-card{padding:26px 22px;}
}

/* ── Preview additions: title, topics and a pending schedule ── */
.live-main{flex:1;min-width:0;}
.live-title{font-family:'Newsreader',serif;font-size:15px;font-weight:600;margin-bottom:7px;}
.live-tags{display:flex;flex-wrap:wrap;gap:7px;padding:0 22px 18px;}
.live-tags .tagchip{cursor:default;}
.live-sched{padding:11px 22px;border-top:1px solid var(--line);font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--brass);}

/* ── Destructive confirmations read as such ── */
.btn.danger{border-color:var(--neg);color:var(--neg);}
.btn.danger:hover{background:var(--neg);color:var(--paper);}

/* ── Moderation log ── */
.adm-log-item{display:flex;align-items:baseline;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);}
.adm-log-when{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.05em;color:var(--ink-3);white-space:nowrap;flex-shrink:0;min-width:104px;}
.adm-log-body{flex:1;min-width:0;font-size:13.5px;}
.adm-log-actor{font-weight:500;}
.adm-log-actor em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-left:5px;}
.adm-log-act{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--c,var(--ink-2));margin:0 5px;}
.adm-log-remark{display:block;margin-top:4px;font-size:13px;color:var(--ink-2);font-style:italic;}

/* ── Topic chips input ── */
.taginput{display:flex;flex-wrap:wrap;align-items:center;gap:7px;padding:8px 10px;border:1px solid var(--line-2);border-radius:3px;background:var(--surface);}
.taginput:focus-within{border-color:var(--ink-3);}
.taginput-chips{display:contents;}
.taginput-chip{display:inline-flex;align-items:center;gap:6px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line-2);background:var(--surface-2);padding:4px 5px 4px 8px;border-radius:2px;}
.taginput-chip.new{border-color:var(--brass);color:var(--brass);}
.taginput-chip i{font-style:normal;font-size:8px;opacity:.7;}
.taginput-chip button{border:none;background:none;color:inherit;font-size:13px;line-height:1;padding:0 2px;cursor:pointer;opacity:.6;}
.taginput-chip button:hover{opacity:1;}
.taginput-field{flex:1;min-width:130px;border:none;background:none;color:var(--ink);font-family:inherit;font-size:13.5px;padding:3px 0;outline:none;}
.taginput-hint{margin-top:5px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.05em;color:var(--brass);min-height:12px;}

/* ── Bookmarks ── */
/* The star lives beside the row rather than inside it: the row is an anchor,
   and a button nested in a link is neither valid nor reliably clickable. */
.prow-wrap{display:flex;align-items:stretch;gap:0;}
.prow-wrap .prow{flex:1;min-width:0;}
.prow-star{display:flex;align-items:center;justify-content:center;width:34px;flex-shrink:0;border:none;background:none;color:var(--ink-3);border-bottom:1px solid var(--line);cursor:pointer;transition:color .15s;}
.prow-star:hover{color:var(--brass);}
.prow-star.on{color:var(--brass);}
.prow-star:disabled{opacity:.5;cursor:default;}
.prow-wrap:hover{background:var(--surface-2);}
#bookmark-btn.on{border-color:var(--brass);color:var(--brass);}

/* ── Brand mark ── */
/* The artwork is dark line art over an opaque white disc, so the dark theme
   inverts it: the disc goes near-black against the paper and the lines read
   white, which is the same figure rather than a different one. */
.brand{align-items:center;}
.brand .glyph{height:23px;width:auto;display:block;flex-shrink:0;}
[data-theme="dark"] .brand .glyph{filter:invert(1);}
/* Tighter on phones: the nav is already crowded there, and the mark is
   wider than the letter it replaces. */
@media (max-width:640px){.brand{gap:7px;}.brand .glyph{height:18px;}}

/* ── Offences ── */
.adm-item-title em.banned{color:var(--neg);}
.adm-item.stacked.bad{opacity:1;border-left:2px solid var(--neg);padding-left:11px;}

/* ── Home hero quote ── */
/* Set apart from the sentence that follows it: it is someone else's line, and
   reading as body copy would flatten it into the site's own voice. */
.hero-grid .hero-quote{font-family:'Newsreader',serif;font-style:italic;font-size:17px;line-height:1.5;color:var(--ink);max-width:400px;margin-bottom:14px;padding-left:14px;border-left:2px solid var(--brass);}
@media (max-width:900px){.hero-grid .hero-quote{font-size:16px;}}

/* ══════════════ ANALYTICS ══════════════ */
.antiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden;margin-top:8px;}
.antile{background:var(--paper);padding:18px 20px;}
.antile .n{display:block;font-family:'JetBrains Mono',monospace;font-size:25px;font-weight:500;letter-spacing:-.02em;}
.antile .l{display:block;margin-top:5px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);}
.antile .s{display:block;margin-top:6px;font-size:12px;color:var(--ink-2);}
.anote{color:var(--ink-2);font-size:13.5px;margin:-8px 0 16px;max-width:620px;}
.anfoot{margin-top:46px;padding-top:18px;border-top:1px solid var(--line);font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.06em;color:var(--ink-3);}

.chart{width:100%;height:auto;display:block;overflow:visible;}
.chart .grid{stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke;}
.chart .axis{font-family:'JetBrains Mono',monospace;font-size:9px;fill:var(--ink-3);}

.anbars{display:flex;flex-direction:column;gap:9px;}
.anbar{display:grid;grid-template-columns:minmax(90px,1.1fr) 3fr minmax(64px,auto);gap:14px;align-items:center;}
.anbar-l{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.anbar-t{height:8px;background:var(--surface-2);border-radius:2px;overflow:hidden;}
.anbar-t i{display:block;height:100%;background:var(--c);border-radius:2px;transition:width .3s;}
.anbar-v{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--ink-3);text-align:right;white-space:nowrap;}

.antable-wrap{overflow-x:auto;}
.antable{width:100%;border-collapse:collapse;font-size:13px;min-width:600px;}
.antable th{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3);font-weight:500;text-align:right;padding:0 0 11px;border-bottom:1px solid var(--line);}
.antable th:first-child{text-align:left;}
.antable td{padding:12px 0;border-bottom:1px solid var(--line);text-align:right;font-family:'JetBrains Mono',monospace;font-size:12px;}
.antable td:first-child{text-align:left;font-family:'Archivo',sans-serif;font-size:13.5px;}
.antable td.brass{color:var(--brass);}
.antable .tp{display:inline-flex;align-items:center;gap:7px;}
.antable .tp b{width:7px;height:7px;border-radius:50%;background:var(--c);display:inline-block;}

.angrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:34px;}
.anpanel h3{font-size:15px;margin-bottom:14px;}

@media (max-width:640px){
  .antile .n{font-size:21px;}
  .anbar{grid-template-columns:minmax(72px,1fr) 2fr auto;gap:10px;}
}

/* ── Social accounts ── */
.socials{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin-top:16px;}
.social{display:flex;align-items:center;gap:11px;padding:13px 15px;border:1px solid var(--line);border-radius:3px;transition:.15s;}
.social:hover{border-color:var(--ink);background:var(--surface-2);}
.social svg{flex-shrink:0;color:var(--ink-2);transition:color .15s;}
.social:hover svg{color:var(--ink);}
.social-n{font-size:13.5px;font-weight:500;}
.social-h{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.04em;color:var(--ink-3);}
@media (max-width:520px){.social-h{display:none;}}

/* One-attempt warning on multiple choice */
.one-shot{padding:0 22px 4px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);}
.ansingle{display:flex;align-items:baseline;gap:14px;padding:20px 0;}
.ansingle .n{font-family:'JetBrains Mono',monospace;font-size:30px;font-weight:500;}
.ansingle .l{font-size:13px;color:var(--ink-3);}

/* ══════════════ LEGAL PAGES ══════════════ */
.legal{max-width:760px;}
.legal-meta{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);margin-top:-14px;}
.legal-toc{display:flex;flex-wrap:wrap;gap:8px 16px;margin:30px 0 8px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.legal-toc a{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);transition:color .15s;}
.legal-toc a:hover{color:var(--ink);}
.legal h2{font-size:21px;margin:42px 0 12px;scroll-margin-top:80px;}
.legal h3{font-size:15.5px;margin:26px 0 8px;color:var(--ink-2);}
.legal p{margin-bottom:13px;color:var(--ink-2);font-size:14.5px;line-height:1.7;}
.legal ul{margin:0 0 15px 20px;color:var(--ink-2);font-size:14.5px;line-height:1.7;}
.legal li{margin-bottom:7px;}
.legal b{color:var(--ink);font-weight:500;}
.legal-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 34px;margin-bottom:18px;}
.legal-foot{display:flex;gap:22px;flex-wrap:wrap;margin-top:52px;padding-top:20px;border-top:1px solid var(--line);}
.ulink{text-decoration:underline;text-underline-offset:2px;color:var(--ink);}
.ulink:hover{color:var(--brass);}

/* Consent checkbox on sign-up and onboarding */
.consent{display:flex;align-items:flex-start;gap:10px;margin:4px 0 18px;font-size:13px;color:var(--ink-2);line-height:1.5;}
.consent input{margin-top:2px;flex-shrink:0;width:15px;height:15px;accent-color:var(--brass);cursor:pointer;}
.consent label{cursor:pointer;}

/* ══════════════ SITE FOOTER ══════════════ */
.site-foot{margin-top:70px;border-top:1px solid var(--line);background:var(--surface);}
.site-foot.compact{margin-top:56px;}
.site-foot.compact .foot-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;padding:18px 32px;}
.site-foot.compact .foot-links{flex-direction:row;flex-wrap:wrap;gap:18px;}
.site-foot.compact .foot-legal{padding:0;margin:0;max-width:none;}
@media (max-width:760px){
  .site-foot.compact .foot-in{padding:16px 22px;gap:8px 16px;}
  .site-foot.compact .foot-links{gap:14px;}
}
.foot-in{max-width:1000px;margin:0 auto;padding:38px 32px 30px;display:grid;grid-template-columns:1.4fr 1fr;gap:44px;}
.foot-brand{font-family:'Newsreader',serif;font-size:17px;font-weight:600;display:block;margin-bottom:10px;}
.foot-about p{color:var(--ink-2);font-size:13.5px;line-height:1.7;max-width:52ch;}
.foot-links{display:flex;flex-direction:column;gap:9px;align-items:flex-start;}
.foot-links a{font-size:13px;color:var(--ink-2);transition:color .15s;}
.foot-links a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:2px;}
.foot-legal{max-width:1000px;margin:0 auto;padding:0 32px 34px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;color:var(--ink-3);}
@media (max-width:760px){
  .foot-in{grid-template-columns:1fr;gap:28px;padding:30px 22px 22px;}
  .foot-legal{padding:0 22px 26px;}
}

/* Problems on hold in the admin list */
.adm-item.held{opacity:.72;}
.adm-item-title em.held-tag{color:var(--brass);}

/* The proposer's solution, set apart from the statement in the review queue */
.adm-quote.solution{border-left:2px solid var(--brass);background:var(--brass-2);}
.adm-quote.solution .adm-item-meta{margin-bottom:6px;}

/* Founding Mathlete toggle in the users list */
.adm-check{display:inline-flex;align-items:center;gap:7px;flex-shrink:0;cursor:pointer;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);}
.adm-check input{width:14px;height:14px;accent-color:var(--brass);cursor:pointer;}
.adm-check:hover{color:var(--ink-2);}
.adm-item-title em.founding{color:var(--brass);}

/* ══════════════ TAP-TO-REVEAL TOOLTIPS ══════════════ */
/* A title attribute is hover-only, so on a phone the text was unreachable. */
[data-tip]{cursor:help;}
.tip-pop{position:absolute;z-index:200;max-width:min(280px,calc(100vw - 24px));padding:9px 12px;
  background:var(--ink);color:var(--paper);border-radius:4px;font-size:12.5px;line-height:1.45;
  box-shadow:0 6px 20px rgba(0,0,0,.28);opacity:0;visibility:hidden;transition:opacity .13s;
  pointer-events:none;}
.tip-pop.show{opacity:1;visibility:visible;}

/* ══════════════ BADGE CATALOGUE ══════════════ */
.badge-intro{max-width:660px;margin-bottom:8px;}
.badge-intro p{color:var(--ink-2);font-size:14.5px;line-height:1.7;margin-bottom:12px;}
.badge-intro b{color:var(--ink);font-weight:500;}
.badge-tally{color:var(--ink-2);font-size:13.5px;padding:16px 0 0;border-top:1px solid var(--line);margin-top:22px;}
.cat-badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden;margin-top:14px;}
.cat-badge{display:flex;gap:14px;padding:16px 18px;background:var(--paper);align-items:flex-start;}
.cat-badge.got{background:var(--surface);}
.cat-badge-icon{flex-shrink:0;padding-top:1px;}
.cat-badge-main{min-width:0;}
.cat-badge-name{display:block;font-size:14px;font-weight:500;}
.cat-badge-name em.got-tag{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--pos);margin-left:7px;}
.cat-badge-desc{display:block;margin-top:3px;font-size:13px;color:var(--ink-2);line-height:1.5;}
.tier-list{display:flex;flex-wrap:wrap;gap:5px 10px;margin-top:8px;}
.tier{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.05em;color:var(--ink-3);}
.tier b{color:var(--brass);font-weight:500;margin-right:4px;}
.tier-one{display:inline-block;margin-top:8px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);}
.cat-badge-progress{display:block;margin-top:7px;font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.05em;color:var(--brass);}