:root{
  --bg:#0d0e10; --bg2:#15161a; --card:#1b1c20; --line:rgba(205,212,220,.16); --line2:rgba(205,212,220,.3);
  --ink:#eef1f5; --mut:#a9b0b9; --dim:#7c838c; --amb:#d7dce2; --gold:#e6c27a;
  --chrome:linear-gradient(180deg,#fdfdfe 0%,#c9cfd6 38%,#8a939d 52%,#e4e8ec 100%);
  --panel:linear-gradient(160deg,#25272c,#141518); --field:#0b0c0e; --yel:#f2c94c; --bad:#ff6d5c; --good:#63d196;
  --c:#a8998b; --u:#63d196; --r:#4fa3e8; --e:#b37bff; --l:#ffd27a; --m:#f2c6ff;
  --po:#63d196; --pi:#f2c94c; --out:#857a70;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink)}
body{font:16px/1.5 'IBM Plex Sans',system-ui,-apple-system,Segoe UI,sans-serif;min-height:100vh;
  background:radial-gradient(circle,rgba(255,255,255,.035) 1px,transparent 1.6px) 0 0/6px 6px,radial-gradient(120% 60% at 50% -10%,#2a1c0c 0%,var(--bg) 55%);background-attachment:fixed}
a{color:var(--amb)}
button{font:inherit;color:inherit}
.cond{font-family:'Barlow Condensed','Arial Narrow',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:.9}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:11px}
.marker{font-family:'Permanent Marker',cursive;font-weight:400}
.wrap{max-width:860px;margin:0 auto;padding-inline:16px;padding-block:0 80px}

/* top bar */
.top{position:sticky;top:0;z-index:20;background:rgba(11,10,9,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.top .in{max-width:1180px;margin:0 auto;padding:10px 24px;display:flex;align-items:center;gap:14px}
@media (max-width:700px){.top .in{padding:10px 16px}}
.brand{display:flex;align-items:baseline;gap:8px;text-decoration:none;color:var(--ink)}
.brand b{font:800 26px/1 'Barlow Condensed',sans-serif;letter-spacing:.02em}
.brand span{font:700 10px 'JetBrains Mono',monospace;letter-spacing:.14em;color:var(--amb)}
.nav{display:flex;gap:4px;margin-left:auto;overflow-x:auto}
.nav a{padding:7px 12px;border-radius:999px;color:var(--mut);text-decoration:none;font-weight:600;font-size:14px;white-space:nowrap}
.nav a.on{background:var(--ink);color:#120d08}
.who{font:700 11px 'JetBrains Mono',monospace;letter-spacing:.1em;color:var(--mut);text-transform:uppercase;white-space:nowrap}

/* blocks */
.hero{padding:44px 0 22px;display:flex;flex-direction:column;gap:12px}
.hero h1{font-size:clamp(52px,12vw,96px);margin:0}
.hero p{margin:0;color:var(--mut);max-width:60ch}
.panel{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:14px;min-width:0}
.panel+.panel{margin-top:16px}
.panel h2{margin:0;font-size:34px}
.panel h3{margin:0;font-size:24px}
.sub{color:var(--mut);margin:0;font-size:15px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:640px){.grid2{grid-template-columns:minmax(0,1fr)}}
.stack{display:flex;flex-direction:column;gap:14px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spacer{flex:1}

/* forms */
label.f{display:flex;flex-direction:column;gap:6px;min-width:0}
label.f>span{font-weight:600;font-size:15px}
label.f>small,.hint{color:var(--dim);font-size:13px}
input[type=text],input[type=email],input[type=password],input[type=number],select,textarea{
  width:100%;min-width:0;background:#0f0d0b;border:1px solid var(--line2);border-radius:12px;color:var(--ink);padding:12px 14px;font:inherit;font-size:16px}
textarea{min-height:90px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--amb);outline-offset:1px;border-color:transparent}
.btn{height:48px;padding:0 22px;border-radius:999px;border:0;background:var(--amb);color:#1a1006;font:800 20px 'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line2)}
.btn.small{height:36px;font-size:16px;padding:0 14px}
.btn:disabled{opacity:.4;cursor:default}
.btn:focus-visible,.chip:focus-visible,.mv:focus-visible{outline:2px solid #fff;outline-offset:3px}
.chip{height:38px;padding:0 14px;border-radius:999px;border:1px solid var(--line2);background:transparent;color:var(--mut);font-weight:600;font-size:14px;cursor:pointer}
.chip.on{background:var(--amb);border-color:var(--amb);color:#1a1006}
.chip.u.on{background:#4fa3e8;border-color:#4fa3e8;color:#06121d}
.err{color:var(--bad);font-size:14px}
.ok{color:var(--good);font-size:14px}
.tabs{display:flex;gap:6px}

/* seat picker */
.seats{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.seat{height:64px;border-radius:14px;border:1px solid var(--line2);background:#0f0d0b;font:800 26px 'Barlow Condensed',sans-serif;text-transform:uppercase;cursor:pointer;color:var(--ink)}
.seat:disabled{opacity:.35;cursor:default}
.seat small{display:block;font:700 9px 'JetBrains Mono',monospace;letter-spacing:.12em;color:var(--dim)}

/* sheet */
.steps{display:flex;gap:4px;margin:18px 0 6px}
.steps i{flex:1;height:5px;border-radius:3px;background:var(--line)}
.steps i.done{background:var(--amb)}
.steps i.cur{background:var(--ink)}
.stephead{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin:8px 0 14px}
.stephead h2{margin:0;font-size:clamp(38px,8vw,56px)}
.save{font:700 11px 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.navbar{position:sticky;bottom:0;margin-top:18px;padding:12px 0 calc(12px + env(safe-area-inset-bottom,0px));background:linear-gradient(transparent,var(--bg) 30%);display:flex;gap:10px;justify-content:space-between}

.seedlist{display:flex;flex-direction:column;gap:6px}
.seedrow{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 10px;border-radius:12px;background:#0f0d0b;border:1px solid var(--line)}
.seedrow .n{font:800 26px/1 'Barlow Condensed',sans-serif;text-align:center}
.seedrow .t b{display:block;font-weight:600}
.seedrow .t small{color:var(--dim);font-size:12.5px}
.seedrow.po .n{color:var(--po)} .seedrow.pi .n{color:var(--pi)} .seedrow.out .n{color:var(--out)}
.seedrow.flash{border-color:var(--amb)}
.zone{font:700 10px 'JetBrains Mono',monospace;letter-spacing:.12em;text-transform:uppercase;margin:8px 0 2px}
.mvs{display:flex;gap:6px}
.mv{width:40px;height:40px;border-radius:10px;border:1px solid var(--line2);background:#1c1814;color:var(--ink);font-size:18px;cursor:pointer}
.mv:disabled{opacity:.25;cursor:default}

.ourow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.ourow small{color:var(--dim)}
.lockb{width:40px;height:38px;border-radius:10px;border:1px solid var(--line2);background:transparent;color:var(--dim);cursor:pointer;font-size:17px}
.lockb.on{background:var(--yel);border-color:var(--yel);color:#1a1006}
.lockb:disabled{opacity:.25;cursor:default}

.bracket{display:flex;flex-direction:column;gap:10px}
.mu{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.tm{min-height:52px;padding:6px 10px;border-radius:12px;border:1px solid var(--line2);background:#0f0d0b;color:var(--ink);text-align:left;cursor:pointer;display:flex;flex-direction:column;justify-content:center}
.tm small{color:var(--dim);font:700 10px 'JetBrains Mono',monospace;letter-spacing:.1em}
.tm b{font-weight:600}
.tm.on{border-color:var(--amb);background:rgba(249,180,55,.14)}
.tm:disabled{opacity:.35;cursor:default}
.lbl{font:700 11px 'JetBrains Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--amb)}

/* review / status */
.miss{padding:12px 14px;border-radius:12px;background:rgba(255,109,92,.1);border:1px solid rgba(255,109,92,.35);font-size:14px}
.done{padding:12px 14px;border-radius:12px;background:rgba(99,209,150,.1);border:1px solid rgba(99,209,150,.35);font-size:14px}
.status{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.st{padding:10px 12px;border-radius:12px;background:#0f0d0b;border:1px solid var(--line)}
.st b{display:block;font:800 22px 'Barlow Condensed',sans-serif;text-transform:uppercase}
.st small{font:700 10px 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.st.in small{color:var(--good)}
.big{font:800 54px/.9 'Barlow Condensed',sans-serif}
.kv{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 14px;font-size:15px}
.kv>span:nth-child(odd){color:var(--mut)}
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th,.tbl td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{font:700 10.5px 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.scroll{overflow-x:auto}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;font:700 11px 'JetBrains Mono',monospace;letter-spacing:.06em}
.pb{background:rgba(242,201,76,.16);color:var(--yel)} .pv{background:rgba(255,210,122,.16);color:var(--l)}
dl.glos{margin:0;display:grid;grid-template-columns:minmax(0,180px) minmax(0,1fr);gap:10px 18px}
dl.glos dt{font-weight:700}
dl.glos dd{margin:0;color:var(--mut)}
@media (max-width:560px){dl.glos{grid-template-columns:minmax(0,1fr)} dl.glos dd{margin-bottom:6px}}
.toc{display:flex;gap:6px;flex-wrap:wrap}
.foot{color:var(--dim);font-size:13px;text-align:center;padding:30px 0}

/* info: pack odds */
.oddsg{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr) minmax(0,1fr);gap:0;align-items:center}
.oddsg>*{padding:10px 8px;border-bottom:1px solid var(--line)}
.ohead{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;border-bottom:1px solid var(--line2)!important}
.ohead .cond{font-size:26px}
.ohead small{color:var(--dim);font-size:12px}
.ohead small b{color:var(--ink);font-weight:700}
.orar{font-size:15px}
.oval{text-align:center;font:800 22px 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums}
.mpk{position:relative;width:74px;height:104px;border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;overflow:hidden}
.mpk.bt{background:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1.6px) 0 0/5px 5px,#2b2d31;box-shadow:inset 0 0 0 2px #f2c94c,0 8px 18px rgba(0,0,0,.5)}
.mpk.bt i{position:absolute;left:50%;bottom:-34px;width:62px;height:62px;margin-left:-31px;border:2px solid #f2c94c;border-radius:50%}
.mpk.bt b{font:400 17px 'Permanent Marker',cursive;color:#fff;transform:rotate(-4deg)}
.mpk.bt small{font:700 7px 'JetBrains Mono',monospace;letter-spacing:.1em;color:#f2c94c;text-transform:uppercase}
.mpk.vt{background:linear-gradient(160deg,#34343a,#141417);box-shadow:inset 0 0 0 2px #d6b064,inset 0 0 0 5px #1a1a1e,inset 0 0 0 6px #7a6230,0 8px 18px rgba(0,0,0,.5)}
.mpk.vt i{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle,#e6c27a 0 6px,#1a1a1e 7px 11px,#d6b064 12px 13px,transparent 14px),repeating-conic-gradient(#d6b064 0 3deg,#141417 3deg 12deg);order:2}
.mpk.vt b{font:800 13px 'Barlow Condensed',sans-serif;color:#e6c27a;text-transform:uppercase;order:1}
.mpk.vt small{font:700 7px 'JetBrains Mono',monospace;letter-spacing:.1em;color:#e6c27a;text-transform:uppercase;order:3}
@media (max-width:420px){.oval{font-size:19px}.ohead .cond{font-size:21px}}

/* compact pass */
.hero.sm{padding:22px 0 12px;gap:8px}
.hero.sm h1{font-size:clamp(40px,9vw,64px)}
.panel{padding:16px 18px;gap:10px}
.panel+.panel,.panel.gift{margin-top:12px}
.panel h2{font-size:28px}
.wrapt{flex-wrap:wrap}
.hrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 24px;align-items:start}
.hrow>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.big.md{font-size:36px}
.dots{display:flex;flex-wrap:wrap;gap:5px;margin:4px 0}
.dt{padding:3px 8px;border-radius:999px;font:700 11px 'JetBrains Mono',monospace;letter-spacing:.04em;background:#0f0d0b;border:1px solid var(--line);color:var(--dim)}
.dt.in{background:rgba(99,209,150,.14);border-color:rgba(99,209,150,.45);color:var(--good)}
.dt.wk{border-color:rgba(249,180,55,.45);color:var(--amb)}
.key{display:inline-block;width:9px;height:9px;border-radius:50%;margin:0 4px 0 8px;border:1px solid var(--line2);vertical-align:-1px}
.key.in{background:var(--good);border-color:var(--good)}.key.wk{border-color:var(--amb)}
.kv.sm{font-size:13.5px;gap:2px 12px}
.earn{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 12px}
.earn>*{padding:8px 0;border-bottom:1px solid var(--line)}
.earn>div b{display:block;font-size:14.5px}
.earn>div small{color:var(--dim);font-size:12.5px;line-height:1.35;display:block}
.earn>.pill{align-self:center;white-space:nowrap}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{cursor:pointer;padding:9px 0;font-weight:600;list-style:none;display:flex;justify-content:space-between}
.acc summary::after{content:'+';color:var(--dim);font-weight:700}
.acc details[open] summary::after{content:'–'}
.acc summary::-webkit-details-marker{display:none}
.acc p{margin:0 0 10px;color:var(--mut);font-size:14px}
.seedrow{padding:5px 10px}
.mv{width:36px;height:36px}
.ourow{padding:5px 0}

.earn2 .er{padding:8px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.earn2 .et{display:flex;justify-content:space-between;align-items:center;gap:10px}
.earn2 .et b{font-size:14.5px}
.earn2 .pill{white-space:normal;text-align:right;font-size:10.5px;flex:0 1 auto}
.earn2 small{color:var(--dim);font-size:12.5px;line-height:1.35}
.nav a{padding:7px 12px}
.hrow>.kv{display:grid}

/* ===================== Theme: The Vault (chrome) ===================== */
body{background:repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px),radial-gradient(120% 60% at 50% -10%,rgba(190,200,215,.12),transparent 55%),var(--bg);background-attachment:fixed}
.cond,.brand b{font-family:'Oswald','Barlow Condensed','Arial Narrow',sans-serif;font-weight:700;letter-spacing:.03em}
.hero h1,.stephead h2{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.mono{color:#c4cad1}
.top{background:rgba(13,14,16,.9);border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(255,255,255,.04)}
.brand b{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand span{color:var(--mut);text-transform:uppercase}
.nav a.on{background:var(--chrome);color:#111317;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:inset 0 0 0 3px var(--bg),inset 0 0 0 4px rgba(205,212,220,.22),0 10px 24px rgba(0,0,0,.35);position:relative}
.panel::after{content:"";position:absolute;inset:7px;pointer-events:none;border-radius:4px;
  background:radial-gradient(circle at 4px 4px,#c9cfd6 0 1.6px,transparent 2.2px) 0 0/8px 8px no-repeat,radial-gradient(circle at 4px 4px,#c9cfd6 0 1.6px,transparent 2.2px) 100% 0/8px 8px no-repeat,radial-gradient(circle at 4px 4px,#c9cfd6 0 1.6px,transparent 2.2px) 0 100%/8px 8px no-repeat,radial-gradient(circle at 4px 4px,#c9cfd6 0 1.6px,transparent 2.2px) 100% 100%/8px 8px no-repeat;opacity:.75}
.btn{background:var(--chrome);color:#111317;border-radius:6px;font-family:'Oswald',sans-serif;font-weight:700;letter-spacing:.06em;box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 2px 0 #5d646c,0 6px 14px rgba(0,0,0,.4);text-shadow:0 1px 0 rgba(255,255,255,.5)}
.btn:active{transform:translateY(1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 0 #5d646c}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:none;text-shadow:none;border:1px solid var(--line2)}
.chip{border-radius:6px}
.chip.on{background:var(--chrome);border-color:#c9cfd6;color:#111317}
input[type=text],input[type=email],input[type=password],input[type=number],select,textarea{background:var(--field);border-radius:6px;box-shadow:inset 0 1px 3px rgba(0,0,0,.6)}
.seat{background:var(--field);border-radius:8px;font-family:'Oswald',sans-serif;font-weight:700}
.seat:not(:disabled):hover{border-color:#c9cfd6}
.tm,.seedrow,.st{background:var(--field)}
.tm.on{border-color:#d7dce2;background:rgba(215,220,226,.12)}
.steps i.done{background:var(--chrome)}
.lockb.on{background:var(--gold);border-color:var(--gold)}
.dt.wk{border-color:rgba(215,220,226,.5);color:var(--amb)}
.key.wk{border-color:var(--amb)}
.lbl{color:#c4cad1}
.zone{letter-spacing:.14em}
.mpk.vt{filter:saturate(1.15)}
.miss{border-radius:6px}.done{border-radius:6px}
::selection{background:rgba(215,220,226,.3)}
@media (max-width:440px){.brand span{display:none}.nav a{padding:6px 9px;font-size:13.5px}}

/* launch gift, Vault theme */
.gift2{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center;overflow:hidden;
  background:radial-gradient(60% 90% at 18% 60%,rgba(230,194,122,.22),transparent 70%),var(--panel)!important}
.g2-packs{position:relative;width:150px;height:128px}
.gp{position:absolute;bottom:4px;width:62px;height:88px;border-radius:7px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.gp.bt{background:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1.6px) 0 0/5px 5px,#2b2d31;box-shadow:inset 0 0 0 2px #f2c94c,0 8px 16px rgba(0,0,0,.55)}
.gp.bt i{position:absolute;left:50%;bottom:-30px;width:54px;height:54px;margin-left:-27px;border:2px solid #f2c94c;border-radius:50%}
.gp.bt b{font:400 14px 'Permanent Marker',cursive;color:#fff;transform:rotate(-5deg)}
.gp.b1{left:0;transform:rotate(-14deg)}.gp.b2{left:20px;transform:rotate(-6deg)}.gp.b3{left:40px;transform:rotate(2deg)}
.gp.vt{left:70px;width:74px;height:104px;flex-direction:column;gap:3px;background:linear-gradient(160deg,#34343a,#141417);
  box-shadow:inset 0 0 0 2px #d6b064,inset 0 0 0 5px #1a1a1e,inset 0 0 0 6px #7a6230,0 0 26px rgba(230,194,122,.45),0 10px 20px rgba(0,0,0,.6);transform:rotate(8deg)}
.gp.vt i{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle,#e6c27a 0 6px,#1a1a1e 7px 11px,#d6b064 12px 13px,transparent 14px),repeating-conic-gradient(#d6b064 0 3deg,#141417 3deg 12deg);order:2}
.gp.vt b{font:700 12px 'Oswald',sans-serif;color:#e6c27a;text-transform:uppercase;letter-spacing:.06em;order:1}
.g2-x{position:absolute;z-index:3;font:700 12px 'JetBrains Mono',monospace;padding:2px 7px;border-radius:999px;box-shadow:0 2px 6px rgba(0,0,0,.5)}
.g2-x.bt{left:6px;top:4px;background:#f2c94c;color:#16171a}
.g2-x.vt{right:-2px;top:0;background:linear-gradient(180deg,#f6dd9c,#b8893a);color:#1a1006}
.g2-sheen{position:absolute;inset:-10px;z-index:4;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.32) 50%,transparent 65%) -160px 0/100% 100% no-repeat;animation:g2sheen 4.5s ease-in-out infinite}
@keyframes g2sheen{0%,55%{background-position:-160px 0}100%{background-position:200px 0}}
.g2-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.g2-tag{align-self:flex-start;font:700 10px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#111317;background:var(--chrome);padding:3px 9px;border-radius:4px;box-shadow:inset 0 1px 0 #fff}
.g2-h{font-size:32px;line-height:.95;background:linear-gradient(180deg,#fff,#c9cfd6 60%,#e6c27a);-webkit-background-clip:text;background-clip:text;color:transparent}
.g2-copy small{color:var(--mut);font-size:13px;line-height:1.4}
.g2-link{font-size:13px;color:var(--mut)}
@media (max-width:420px){.gift2{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center}.g2-copy{align-items:center}.g2-tag{align-self:center}.g2-h{font-size:28px}}
@media (prefers-reduced-motion:reduce){.g2-sheen{animation:none;display:none}}

/* packs page */
.packrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.pkc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px;border-radius:8px;background:var(--field);border:1px solid var(--line)}
.pkc>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.gp.solo{position:relative;left:auto;bottom:auto;transform:none}
.gp.vt.solo{width:62px;height:88px}
.cnt{font:700 13px 'JetBrains Mono',monospace;color:#f2c94c}.cnt.gold{color:var(--gold)}
.ripstage{min-height:60vh}

/* ===================== QA pass: fixes + phone polish ===================== */
/* the review box's .done style was leaking onto finished step markers (tall blocks instead of 5px bars) */
.steps i.done{padding:0;border:0;border-radius:3px}
/* headings and labels wrap evenly instead of leaving one word behind */
.hero h1,.stephead h2,.panel h2,.panel h3,.g2-h,.cond{text-wrap:balance}
.hero p,.sub,.lbl,.hint,.miss,.done{text-wrap:pretty}
/* over/unders: the win total never splits from its number */
.ourow small{white-space:nowrap;display:inline-block}
.ourow>span:first-child{min-width:0;line-height:1.3}
/* packs page: keep the count beside the blurb, not orphaned below it */
.pkc small.hint{line-height:1.35}
@media (max-width:640px){
  /* bracket buttons: one line each (seed + team), shorter rows */
  .tm{min-height:42px;padding:5px 10px;flex-direction:row;flex-wrap:wrap;align-items:center;align-content:center;justify-content:flex-start;gap:0 7px}
  .tm small{flex:none;min-width:0;font-size:9.5px;letter-spacing:.06em}
  .tm b{white-space:nowrap;font-size:14.5px}
  .tm:disabled:not([data-v]) b{font-size:12.5px;color:var(--dim);white-space:normal}
  .bracket{gap:6px}.mu{gap:6px}
  /* review + read-only sheet: label above its answer so answers get the full width */
  .tbl th[style*="38%"]{display:block;width:auto!important;padding:9px 2px 1px;border-bottom:0;letter-spacing:.08em}
  .tbl th[style*="38%"]+td{display:block;padding:0 2px 9px}
  .stephead{margin:6px 0 10px}
  .navbar .btn{min-width:110px}
}
.btn{white-space:nowrap}
/* top nav on phones: tighter pills and a soft fade at the edge when the extra items (Everyone, Commish) scroll */
@media (max-width:440px){
  .top .in{gap:10px}
  .nav{gap:2px;padding-right:14px;-webkit-mask:linear-gradient(90deg,#000 calc(100% - 16px),transparent);mask:linear-gradient(90deg,#000 calc(100% - 16px),transparent);scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
  .nav a{padding:6px 8px;font-size:13px}
}

/* ===================== perf pass: smoother scrolling on phones ===================== */
/* touch screens: the sticky top bar drops its backdrop blur (re-blurred on every scroll frame) for a near-solid fill */
@media (hover:none) and (pointer:coarse){.top{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(13,14,16,.97)}}
/* binder thumbnails hold their looping sheens while the page scrolls and while off screen: see perf.js */
/* earn table: pack art with a count badge */
.earn2 .et{align-items:center}
.earn2 .etx{display:flex;flex-direction:column;gap:2px;min-width:0}
.eps{display:flex;align-items:flex-end;gap:14px;flex:none;padding:4px 8px 6px 0}
.epc{position:relative;width:40px;height:56px;flex:none;display:block}
.epm{position:absolute;left:0;top:0;width:74px;height:104px;transform:scale(.5405);transform-origin:0 0}
.epm .mpk{box-shadow:none}
.epm .mpk.bt{box-shadow:inset 0 0 0 2px #f2c94c,0 6px 12px rgba(0,0,0,.45)}
.epm .mpk.vt{box-shadow:inset 0 0 0 2px #d6b064,inset 0 0 0 5px #1a1a1e,inset 0 0 0 6px #7a6230,0 6px 12px rgba(0,0,0,.45)}
.epc em{position:absolute;right:-8px;bottom:-7px;min-width:20px;height:20px;padding:0 5px;box-sizing:border-box;border-radius:10px;background:#f6ece2;color:#111317;font:800 12px/20px 'Inter Tight','Inter',system-ui,sans-serif;font-style:normal;text-align:center;font-variant-numeric:tabular-nums;box-shadow:0 0 0 2px #121010,0 2px 6px rgba(0,0,0,.5)}
.epn{font:700 9.5px 'JetBrains Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);align-self:center}
.pkfoil{display:inline-flex;align-items:center;gap:6px;font:700 10.5px 'JetBrains Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:#ecd27a}
.pkfoil .tsm{display:inline-block;width:14px;height:14px;border-radius:50%;background:conic-gradient(#f8e7a0,#bdeeff,#f6c3ff,#fff4c4,#b5ffe0,#f8e7a0);box-shadow:0 0 0 1.5px #ecd27a}
.pklegend{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0 4px;padding-bottom:6px}
.pklegend>span:not(.epc){font-size:12.5px;margin-right:10px}
.pklegend small{color:var(--dim);font-size:12px}
@media (max-width:420px){.eps{gap:12px;padding-right:6px}}

/* brand stamp: onyx & gold card-set stamp, ruby series banner (brand round 3: C1 + S1). Size it with font-size on .pst (= the PTIS cap size). */
.logo{display:flex;align-items:center;flex:none;text-decoration:none;padding:5px 4px 5px 2px}
.pst{position:relative;display:inline-block;transform:rotate(-5deg);font-size:28px;line-height:1;vertical-align:middle;font-style:normal}
.pst .pc{display:inline-flex;align-items:stretch;border-radius:.162em;overflow:hidden;background:#1c1813;box-shadow:0 0 0 max(1px,.031em) #e6c27a,0 .09em .22em rgba(0,0,0,.5)}
.pst .pm{display:flex;align-items:center;padding:.131em .343em .111em .374em}
.pst b{display:block;font:italic 700 1em/1 Oswald,'Barlow Condensed','Arial Narrow',sans-serif;color:#f4ead6;-webkit-text-fill-color:#f4ead6;background:none;letter-spacing:.02em;transform:skewX(-8deg)}
.pst .pe{display:flex;align-items:center;justify-content:center;padding:0 .162em 0 .374em;margin-left:-1px;background:#e6c27a;clip-path:polygon(.222em 0,100% 0,100% 100%,0 100%)}
.pst small{font:700 .162em 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.12em;color:#1a1006;writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap}
.pst .ps{position:absolute;left:50%;bottom:-1.2em;transform:translateX(-50%);padding:.4em 1.12em .32em;background:#8e1b2b;box-shadow:0 0 0 .16em #e6c27a;font:700 .126em/1 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.18em;color:#e6c27a;white-space:nowrap}
@media (max-width:440px){.pst{font-size:21px}}
.signst{padding:6px 0 30px}
.signst .pst{font-size:clamp(56px,16vw,88px)}
