/* Match decisions stay in one frame; only player choices stop the show. */
.auto-advance { display:flex;align-items:center;justify-content:center;gap:12px;min-height:42px;color:var(--bone);font-size:calc((12px) * var(--text-scale,1));letter-spacing:.08em; }
.auto-dot { width:7px;height:7px;border-radius:50%;background:var(--chroma-c); }
.ballot-direct { gap:10px; }
.ballot-steps { display:flex;align-items:stretch;gap:10px;flex-shrink:0; }
.ballot-step { display:flex;align-items:center;gap:10px;text-align:left;padding:9px 14px;border:1px solid #665b45;background:#211e19;color:var(--bone);min-width:180px;cursor:pointer; }
.ballot-step b { font:calc(25px * var(--text-scale,1)) 'Anton',sans-serif;opacity:.5; }
.ballot-step span { font-weight:700;font-size:calc((15px) * var(--text-scale,1)); }
.ballot-step small { display:block;font:calc(10px * var(--text-scale,1)) 'Space Mono',monospace;margin-top:3px; }
.ballot-step.current { background:var(--chroma-c);border-color:var(--chroma-c);color:var(--ink); }
.ballot-step:disabled { opacity:.65;cursor:default; }
.ballot-step.current:disabled { opacity:1; }
.ballot-steps .ballot-instruction { align-self:center;padding:0 8px;max-width:410px;font-size:calc((17px) * var(--text-scale,1));font-weight:700; }
.ballot-direct .ballot-workspace { grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:18px; }
.ballot-direct .take-index { gap:8px; }
.ballot-direct .take-choice { padding:10px 14px;gap:6px;justify-content:center;transition:border-color .12s,background .12s; }
.ballot-direct .take-choice-text { font-size:calc((16px) * var(--text-scale,1));line-height:1.15;overflow:visible; }
.ballot-direct .take-choice.inspecting { box-shadow:none; }
.ballot-direct .take-choice.ranked { border-color:var(--chroma-c);background:#39321f; }
.ballot-direct .take-choice-label strong { font-size:calc((15px) * var(--text-scale,1)); }
.ballot-direct .take-choice.cut-marked { border:2px solid #ff8b7b;background:#392120; }
.ballot-direct .own-take { opacity:.55;cursor:default; }
.own-note { font-size:calc((9px) * var(--text-scale,1)); }
.ballot-direct .take-spotlight { padding:14px;gap:10px;border-color:#50473e; }
.ballot-direct .take-reading .combo { font-size:calc((25px) * var(--text-scale,1));line-height:1.2; }
.ballot-direct .take-reading { padding:14px; }
.ballot-direct .cut-explanation { font-size:calc((11px) * var(--text-scale,1)); }
.ballot-summary button { font:inherit;background:#241f1b;color:#a9a096;border:1px solid #51473d;padding:6px 12px;cursor:pointer; }
.ballot-summary button.filled { color:var(--chroma-c);border-color:#817634; }
.ballot-summary button:disabled { cursor:default; }
.ballot-direct .round-action-bar { min-height:58px; }
.compose-prompt { flex-basis:24cqh;max-height:24cqh; }
.compose-prompt .prompt-quote { font-size:calc((23px) * var(--text-scale,1)); }
.compose-hand { gap:10px; }
.compose-hand .vhs .answer-text { font-size:calc((21px) * var(--text-scale,1)); }
.result-main { display:flex;overflow:hidden; }
.result-layout .result-combo { flex:1;display:flex;flex-direction:column;gap:14px;max-width:none; }
.result-rail .cut-banner { max-height:none;padding:12px; }
.result-rail .cut-banner .cut-title { font-size:calc((24px) * var(--text-scale,1)); }
.result-rail .final-board { overflow:visible; }
.result-layout .result-combo .quote { display:flex;align-items:center;font-size:calc((28px) * var(--text-scale,1)); }
.result-winner-tag { flex-wrap:wrap; }
.actbreak { width:min(100%,960px); }
.actbreak .final-board { margin-top:16px!important; }
.actbreak .final-row,.gover .final-row { padding:8px 14px; }
.actbreak .phase-sub { font-size:calc((16px) * var(--text-scale,1)); }
.lobby .menu-body.lobby-body { overflow:hidden;align-items:stretch;padding-top:14px;padding-bottom:10px; }
.lobby .lobby-left,.lobby .lobby-right { max-height:none;overflow:visible;min-height:0; }
.lobby .lobby-right { gap:10px; }
.lobby .panel-card { padding:14px 18px; }
.lobby .panel-head { margin-bottom:8px; }
.lobby .pack-toggle { padding:8px 10px; }
.lobby .pack-hint { margin-top:8px;font-size:calc((10px) * var(--text-scale,1)); }
.lobby .rule-line { padding:8px 0; }
.lobby .start-dock { margin-top:auto;flex-shrink:0; }
.lobby .big-start { padding:14px 20px;font-size:calc((20px) * var(--text-scale,1)); }
.lobby .seat-list { gap:5px; }
.lobby .seat { padding:6px 10px;min-height:43px; }
.lobby .seat-bark { display:none; }
.lobby .seat.empty { min-height:28px;padding:5px 10px; }
.lobby .seat-note { font-size:calc((10px) * var(--text-scale,1));line-height:1.4; }
@container(max-height:650px) {
 .ballot-step { padding:6px 10px;min-width:155px; }
 .ballot-step span { font-size:calc((13px) * var(--text-scale,1)); }
 .ballot-steps .ballot-instruction { font-size:calc((15px) * var(--text-scale,1)); }
 .ballot-direct .take-choice-text { font-size:calc((14px) * var(--text-scale,1)); }
 .ballot-direct .take-choice { padding:7px 10px; }
 .ballot-direct .take-reading .combo { font-size:calc((22px) * var(--text-scale,1)); }
 .lobby .panel-card { padding:10px 14px; }
 .lobby .rule-line { padding:5px 0; }
}

.round-heading > .f-mono { margin-left:auto; }
.decision-clock { flex:0 0 auto;display:flex;align-items:center;gap:9px;padding:5px 16px 7px;border:1px solid #897c31;border-bottom:4px solid var(--chroma-c);border-radius:4px;background:linear-gradient(90deg,#494022 var(--remaining),#201c17 var(--remaining));color:var(--chroma-c);min-width:190px;justify-content:center; }
.decision-clock strong { flex:none;white-space:nowrap;font:48px/1 'Anton',sans-serif;font-variant-numeric:tabular-nums;min-width:54px;text-align:center; }
.decision-clock-label { font-size:calc((10px) * var(--text-scale,1));line-height:1.3;letter-spacing:.08em; }
.decision-clock-unit { align-self:flex-end;margin-bottom:5px;font-size:calc((9px) * var(--text-scale,1)); }
.decision-clock.urgent { color:#fff3db;background:linear-gradient(90deg,#913029 var(--remaining),#411b18 var(--remaining));border-color:#ff8b7b; }
.round-heading .decision-clock ~ * { margin:0; }
.ballot-direct .round-heading,.round-compose .round-heading { min-height:60px; }

/* A fixed game canvas must never become a browser focus-scroll container. */
#res-frame, #res-stage { overflow:clip; }

.match-opening { height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px 6%;gap:18px;text-align:center;background:radial-gradient(ellipse at 50% 15%,#4a2620 0%,#110d0e 62%,#080708 100%);overflow:hidden; }
.opening-kicker { font-size:calc((13px) * var(--text-scale,1));letter-spacing:.25em;color:var(--chroma-c); }
.opening-title { font-size:clamp(52px,7cqw,96px);line-height:1;margin:0; }
.opening-tagline { font-size:calc((27px) * var(--text-scale,1));color:var(--bone); }
.opening-cast { width:100%;max-width:1080px;visibility:hidden;opacity:0;transition:opacity .5s; }
.show-cast .opening-cast { visibility:visible;opacity:1; }
.opening-cast h2 { font-size:calc((13px) * var(--text-scale,1));letter-spacing:.2em;margin:8px 0 18px; }
.opening-seats { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px; }
.opening-seat { min-width:0;display:flex;align-items:center;gap:12px;padding:14px 10px;border-top:2px solid var(--seat-color);background:#24201edb;text-align:left; }
.opening-seat > span:first-child { font-size:calc((11px) * var(--text-scale,1));opacity:.5; }
.opening-seat strong { font-size:calc((15px) * var(--text-scale,1));overflow-wrap:anywhere; }
.opening-stakes { margin-top:24px;font-size:calc((14px) * var(--text-scale,1));letter-spacing:.12em;color:var(--chroma-c); }
@media(prefers-reduced-motion:reduce){.opening-cast{transition:none;}}
body.reduce-motion .opening-cast{transition:none;}
/* Room launch and broadcast opening. The cast enters on “Places, everyone”. */
.tutorial-rule{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:calc((11px) * var(--text-scale,1))}
.tutorial-rule .btn{padding:7px 10px;font-size:calc((10px) * var(--text-scale,1))}
.room-launch-veil{background:#080707f5}
.room-launch{width:min(920px,90%);text-align:center;padding:30px;color:var(--bone)}
.room-launch> .f-mono{color:var(--chroma-c);letter-spacing:.15em;font-size:calc((12px) * var(--text-scale,1))}
.room-launch h2{font-size:56px;line-height:1.1;margin:18px 0;color:var(--bone)}
.room-countdown{font-size:120px;line-height:1.1;color:var(--chroma-c);font-variant-numeric:tabular-nums}
.launch-cast{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:22px 0}
.launch-cast>span{padding:12px;background:#28221e;text-align:left;font-size:calc((14px) * var(--text-scale,1));border-top:2px solid #776f61}
.launch-cast b{display:block;font:calc(10px * var(--text-scale,1)) 'Space Mono',monospace;margin-top:8px;color:#b5aa99}
.launch-cast .prepared{border-color:var(--chroma-c)}
.launch-cast .prepared b{color:var(--chroma-c)}
.match-opening{position:relative;isolation:isolate;padding:38px 6% 58px;gap:18px;background:radial-gradient(ellipse at 50% 25%,#60332c 0%,#241816 40%,#0e0b0b 80%);color:var(--bone)}
.opening-projector{position:absolute;z-index:-1;inset:0;background:conic-gradient(from 160deg at 50% -10%,transparent,#e8cb8540 12deg,transparent 27deg,transparent 310deg,#e8cb8525 333deg,transparent 347deg);opacity:.7;pointer-events:none}
.opening-kicker{flex-shrink:0;color:#e1c696;font-size:calc((12px) * var(--text-scale,1));letter-spacing:.25em}
.opening-marquee{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:24px;width:100%}
.opening-title{display:flex;flex-direction:column;gap:6px;font-size:clamp(65px,8.4cqw,112px);line-height:1.03;color:#fff1cc;text-shadow:0 4px 0 #1d110f,0 0 40px #e6bb6330;letter-spacing:.035em;animation:show-title-enter .6s cubic-bezier(.16,1,.3,1) both}
.opening-title .slay{color:#eb4938;text-shadow:0 4px 0 #471109,0 0 25px #ef37261a;font-size:1.12em}
.opening-tagline{font-size:calc((28px) * var(--text-scale,1));opacity:0;transition:opacity .4s;color:#f0dfba}
.show-punchline .opening-tagline{opacity:1}
.opening-tagline em{font-style:normal;color:#fff3d7}
.show-cast .opening-marquee{flex:0 0 auto;gap:8px}
.show-cast .opening-title{flex-direction:row;align-items:baseline;font-size:58px;gap:16px;animation:none}
.show-cast .opening-tagline{font-size:calc((21px) * var(--text-scale,1))}
.opening-cast{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:14px;opacity:1;visibility:visible;width:100%}
.opening-cast h2{color:#ddc9a5;margin:0;font-size:calc((12px) * var(--text-scale,1));letter-spacing:.22em}
.opening-seats{gap:12px}
.opening-seat{min-height:90px;border:1px solid #685343;border-top:3px solid var(--seat-color);background:linear-gradient(125deg,#342b25,#1d1917);padding:14px 12px;gap:10px;opacity:0;transform:translateY(10px);transition:opacity .35s,transform .35s}
.opening-seat.entered{opacity:1;transform:none}
.opening-seat.you{border-color:var(--chroma-c);box-shadow:0 0 16px #ead02315}
.opening-seat strong{font-size:calc((15px) * var(--text-scale,1));color:#f1e7d6;line-height:1.3}
.opening-seat strong small{display:block;font-size:calc((8px) * var(--text-scale,1));letter-spacing:.1em;margin-top:6px;color:#b4a58d}
.opening-seat.you strong small{color:var(--chroma-c)}
.opening-seat-number{font-size:calc((10px) * var(--text-scale,1));color:#a48a6c}
.opening-stakes{display:flex;justify-content:center;gap:0;font-size:calc((13px) * var(--text-scale,1));color:#f2d79e;margin:8px 0 0;animation:show-title-enter .35s ease-out both}
.opening-stakes b{padding:0 20px;border-right:1px solid #7d6245;letter-spacing:.12em}
.opening-stakes b:last-child{border:0}
.opening-caption{position:absolute;bottom:18px;left:8%;right:8%;font-size:calc((21px) * var(--text-scale,1));color:#f6ead4;min-height:30px}
.round-entrance{flex-direction:column;gap:20px;background:radial-gradient(ellipse,#4c2c20,#100b0b);color:#f6e8c7}
.round-entrance h1{font-size:130px;line-height:1;color:#f6e8c7;margin:0}
.round-entrance h1 em{font-style:normal;color:var(--chroma-c)}
.round-entrance>.f-mono{letter-spacing:.2em;font-size:calc((14px) * var(--text-scale,1))}
.round-entrance>.f-quote{font-size:calc((26px) * var(--text-scale,1))}
@keyframes show-title-enter{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.match-opening *{animation:none!important;transition:none!important;transform:none!important}}
body.reduce-motion .match-opening *{animation:none!important;transition:none!important;transform:none!important}
@container(max-height:650px){.match-opening{padding-top:24px}.show-cast .opening-title{font-size:48px}.opening-seat{min-height:73px;padding:8px}.opening-cast{gap:10px}.room-launch h2{font-size:42px}.room-countdown{font-size:90px}}
.lobby .panel-card{padding:10px 16px;flex-shrink:0}
.lobby .lobby-right{gap:8px}
.lobby .rule-line{padding:6px 0}
.lobby .seat.empty{height:30px;min-height:30px;box-sizing:border-box;padding:3px 10px}
.lobby .seat.empty .empty-dot{height:22px;width:22px;line-height:22px;flex:0 0 22px}
.lobby .seat-note{margin-top:5px;padding:8px;line-height:1.35}
.lobby .tutorial-rule{flex-shrink:0}

/* Green Room: cast and setup above an independent, always-visible ready bar. */
.lobby.cs-root {height:100cqh;min-height:0;overflow:hidden}
.lobby .lobby-topbar {padding:16px 28px;min-height:104px;box-sizing:border-box}
.lobby .menu-body.lobby-body {flex:1;min-height:0;width:100%;max-width:1180px;padding:16px 24px 12px;box-sizing:border-box;grid-template-columns:1.15fr 1fr;gap:28px;overflow:hidden}
.lobby .lobby-left {display:flex;flex-direction:column;min-width:0}
.lobby .seat-list {flex:1;min-height:0;display:grid;grid-template-rows:repeat(8,minmax(0,1fr));gap:5px}
.lobby .seat,.lobby .seat.empty {height:auto;min-height:0;box-sizing:border-box;padding:4px 10px;border-radius:5px}
.lobby .seat-name {white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:calc((14px) * var(--text-scale,1))}
.lobby .seat-tags {gap:4px}.lobby .seat-meta {gap:2px}
.lobby .seat-state {font-size:calc((10px) * var(--text-scale,1));white-space:nowrap}
.lobby .seat-tags .tag {font-size:calc((8px) * var(--text-scale,1));padding:1px 5px}
.lobby .seats-head {margin-bottom:10px;color:var(--bone)}
.lobby .cast-actions {flex:none;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:10px}
.lobby .cast-actions>span {font-size:calc((10px) * var(--text-scale,1));color:#b2aba0}
.lobby .lobby-right {gap:12px;min-width:0}
.lobby .panel-card {padding:14px 18px}
.lobby .rule-line {padding:8px 0}
.lobby .room-packs {margin-top:auto}
.lobby .room-packs .core-status {color:var(--chroma-b);font-size:calc((9px) * var(--text-scale,1))}
.lobby .room-packs p {font-size:calc((11px) * var(--text-scale,1));line-height:1.55;color:#b2aba0;margin:8px 0 0}
.lobby .tutorial-rule {display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:calc((11px) * var(--text-scale,1));padding:0 4px}
.lobby .room-ready-bar {flex:0 0 82px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:12px max(28px,calc((100% - 1132px)/2));border-top:1px solid #65582a;background:linear-gradient(90deg,#201b0e,#12100d);z-index:2}
.lobby .room-ready-status {display:flex;flex-direction:column;gap:6px;min-width:0}
.lobby .room-ready-status strong {font-size:calc((18px) * var(--text-scale,1));color:var(--bone)}
.lobby .room-ready-status>span {font-size:calc((11px) * var(--text-scale,1));color:#b2aba0}
.lobby .room-ready-bar .start-dock {margin:0;flex:none}
.lobby .big-start {min-width:290px;padding:16px 22px;font-size:calc((20px) * var(--text-scale,1));display:flex;justify-content:space-between;gap:24px}
.lobby .ctrl-hints {padding:8px 20px;min-height:40px;box-sizing:border-box}
.lobby button:focus-visible {outline:2px solid var(--chroma-c);outline-offset:3px}

.lobby .room-access {margin-top:auto}
.lobby .room-access .panel-head>span {font-size:calc((10px) * var(--text-scale,1));color:var(--chroma-b)}
.lobby .room-access p {margin:8px 0 0;font-size:calc((14px) * var(--text-scale,1));line-height:1.45;color:var(--bone)}
.lobby .room-access .preview-note {font-size:calc((10px) * var(--text-scale,1));color:#aaa294}
.home-foot {grid-template-columns:repeat(2,minmax(0,1fr))}

/* House rules: a bounded game settings sheet with one focus stop per row. */
.lobby .tutorial-rule {color:var(--bone)}
.lobby .room-visibility {font-size:calc((11px) * var(--text-scale,1));color:var(--chroma-b);padding:7px 10px;border:1px solid #504b43;border-radius:3px}
.house-rules-veil {padding:22px 34px;box-sizing:border-box;background:rgba(8,7,7,.96);color:var(--bone);display:flex;align-items:stretch;justify-content:center}
.house-rules-sheet {width:100%;max-width:1140px;height:100%;min-height:0;display:flex;flex-direction:column;background:#14110f;border:1px solid #494035;box-shadow:0 16px 70px #0008;padding:24px 28px;box-sizing:border-box}
.house-rules-header {display:flex;justify-content:space-between;align-items:center;gap:24px;padding-bottom:16px;border-bottom:2px solid var(--blood)}
.house-rules-header>div>span {font-size:calc((10px) * var(--text-scale,1));letter-spacing:.15em;color:#b6ada1}
.house-rules-header h2 {font-size:calc((38px) * var(--text-scale,1));line-height:1.1;margin:6px 0 0;color:var(--bone)}
.rules-length {display:flex;align-items:center;gap:12px;color:var(--chroma-c)}
.rules-length strong {font-size:48px;line-height:1}
.rules-length span {font-size:calc((11px) * var(--text-scale,1));max-width:135px;line-height:1.6}
.house-rules-grid {display:grid;grid-template-columns:1fr 1fr;gap:26px;flex:1;min-height:0;padding:15px 0 12px}
.house-rules-group {min-width:0;display:flex;flex-direction:column;gap:5px}
.house-rules-group h3 {font-size:calc((11px) * var(--text-scale,1));letter-spacing:.15em;margin:0 0 6px;color:#c5bbac}
.house-rules-group h3 span {color:var(--blood);margin-right:9px}
.house-rule-row {width:100%;min-height:43px;flex:1;max-height:50px;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:0 6px 0 14px;text-align:left;color:var(--bone);background:#211d18;border:1px solid #51483b;border-radius:3px}
.house-rule-row .rule-name {font-family:'Archivo Black',sans-serif;font-size:calc((14px) * var(--text-scale,1));line-height:1.2}
.house-rule-row .rule-setting {display:flex;align-items:center;flex:none;gap:0}
.house-rule-row strong {min-width:76px;text-align:center;font-family:'Space Mono',monospace;font-size:calc((16px) * var(--text-scale,1));color:var(--chroma-c)}
.house-rule-row .rule-arrow {width:32px;min-height:41px;display:grid;place-items:center;font-size:calc((25px) * var(--text-scale,1));color:#c0b5a0}
.house-rule-row:hover {background:#30281d}
.house-rule-row:focus,.house-rule-row:focus-visible {outline:2px solid var(--chroma-c)!important;outline-offset:1px!important;background:#403718;color:#fff6dc;box-shadow:inset 5px 0 var(--chroma-c)}
.house-rule-row.unavailable {opacity:.48}
.house-rule-row[aria-disabled="true"] .rule-arrow {visibility:hidden}
.rule-help {height:72px;flex:none;display:flex;flex-direction:column;justify-content:center;gap:5px;padding:8px 14px;background:#211c15;border-left:3px solid var(--chroma-c);box-sizing:border-box}
.rule-help strong {font-family:'Archivo Black',sans-serif;font-size:calc((13px) * var(--text-scale,1));color:var(--bone)}
.rule-help span {font-size:calc((14px) * var(--text-scale,1));line-height:1.3;color:#c4bdb0}
.rule-help em {font-size:calc((11px) * var(--text-scale,1));font-style:normal;color:#c4bdb0}
.house-rules-footer {display:flex;justify-content:space-between;align-items:center;gap:24px;flex:none;padding-top:14px}
.rules-controls {display:flex;gap:24px;color:#c4bdb0;font-size:calc((11px) * var(--text-scale,1))}
.rules-done {font-size:calc((16px) * var(--text-scale,1));min-width:155px;padding:12px 24px}
@container (max-height:620px) {
 .house-rules-veil {padding:12px 24px}
 .house-rules-sheet {padding:16px 22px}
 .house-rules-header {padding-bottom:10px}
 .house-rules-header h2 {font-size:calc((30px) * var(--text-scale,1))}
 .house-rule-row {min-height:35px;max-height:42px}
 .house-rule-row .rule-arrow {min-height:33px}
 .rule-help {height:62px}
 .house-rules-grid {padding:10px 0;gap:20px}
 .house-rules-footer {padding-top:10px}
}

/* Shared focus stays readable on the title, cards, and match controls. */
.cs-root button:focus-visible,.cs-root [role="button"]:focus-visible {outline:3px solid var(--chroma-c);outline-offset:3px}
body[data-input="controller"] .cs-root :focus {outline:3px solid var(--chroma-c);outline-offset:3px}
.intro .intro-skip {min-width:100px;min-height:42px;padding:10px 18px}
.splash .splash-tag {max-width:none;white-space:nowrap;font-size:calc((12px) * var(--text-scale,1));letter-spacing:.13em}
.home .menu-body {padding-bottom:20px}
/* Home: one Friends entry, with contained lists and controller text entry. */
.friends-entry {display:flex;justify-content:space-between;align-items:center;width:100%;gap:20px;margin-top:18px;padding:17px 20px;color:var(--bone);border:1px solid #51483c;background:#181410;border-radius:5px;text-align:left}
.friends-entry>span:first-child {display:flex;align-items:center;gap:12px;font-size:calc((16px) * var(--text-scale,1))}
.friends-entry>span:last-child {font-size:calc((11px) * var(--text-scale,1));color:#c5bdb0}.friends-entry b {margin-left:20px;color:var(--chroma-c);font-size:calc((20px) * var(--text-scale,1))}
.join-form .code-input {min-width:0;width:0}.code-keyboard-button {min-width:44px;font-size:calc((20px) * var(--text-scale,1));padding:7px 10px}
.home-panel-veil {background:rgba(8,7,7,.94);padding:24px;box-sizing:border-box;color:var(--bone)}
.friends-panel {width:min(1060px,94cqw);height:min(648px,92cqh);background:#181410;border:1px solid #655749;padding:22px 26px;box-sizing:border-box;display:flex;flex-direction:column;gap:16px}
.friends-panel header,.screen-keyboard header {display:flex;justify-content:space-between;align-items:center;gap:20px}
.friends-panel h2,.screen-keyboard h2 {font-size:calc((34px) * var(--text-scale,1));margin:0;color:var(--bone)}
.friends-panel header span {font-size:calc((10px) * var(--text-scale,1));color:#b8b0a4}
.friends-search {display:flex;gap:10px;flex:none}.friends-search input {flex:1;min-width:0;background:#0e0c0b;color:var(--bone);border:1px solid #685b47;font-size:calc((17px) * var(--text-scale,1));padding:10px 14px}
.friends-columns {display:grid;grid-template-columns:1.4fr 1fr;gap:24px;flex:1;min-height:0}
.friends-results {display:flex;flex-direction:column;gap:5px;min-height:0}
.friend-result {height:47px;min-height:0;flex:0 1 47px;display:flex;align-items:center;gap:12px;padding:5px 12px;text-align:left;border:1px solid #494034;color:var(--bone);background:#211c17}
.friend-result>span:nth-child(2) {display:flex;flex-direction:column;min-width:0;flex:1;gap:3px}
.friend-result strong {font-size:calc((14px) * var(--text-scale,1));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.friend-result small {font-size:calc((11px) * var(--text-scale,1));color:#c1b9aa}
.friend-result.selected {border-color:#b09b4d;background:#342b17}.friend-capacity {font-size:calc((12px) * var(--text-scale,1));color:#c4b998}
.friend-detail {padding:20px;display:flex;flex-direction:column;align-items:flex-start;background:#100e0c;border:1px solid #494034;min-width:0}
.friend-detail h3 {font-family:'Archivo Black',sans-serif;font-size:calc((21px) * var(--text-scale,1));overflow-wrap:anywhere;margin:16px 0 4px}
.friend-detail p {font-size:calc((14px) * var(--text-scale,1));color:#c5bdaf;margin:6px 0}.friend-detail .btn {margin-top:auto;min-width:180px}
.friend-detail p.f-mono {font-size:calc((11px) * var(--text-scale,1));line-height:1.4;margin-top:12px}
.friends-panel footer {display:flex;justify-content:space-between;align-items:center;gap:16px;flex:none}.friends-panel footer>div {display:flex;gap:10px}.friends-panel footer>span {font-size:calc((11px) * var(--text-scale,1));color:#c5bdaf}
.keyboard-veil {z-index:160}
.screen-keyboard {width:min(780px,92cqw);padding:24px 28px;background:#191511;border:1px solid #76623b;box-sizing:border-box}
.screen-keyboard-value {display:block;box-sizing:border-box;width:100%;margin:18px 0;height:56px;padding:10px 16px;background:#090807;color:var(--chroma-c);border:1px solid #77643a;font-size:calc((25px) * var(--text-scale,1));letter-spacing:.12em}
.screen-keys {display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:8px}
.screen-keys button {height:48px;background:#30291f;color:var(--bone);border:1px solid #756649;font-size:calc((22px) * var(--text-scale,1));border-radius:3px}
.screen-keyboard footer {display:flex;gap:12px;margin-top:18px}.screen-keyboard footer .gold {margin-left:auto;min-width:130px}.screen-keyboard p {font-size:calc((11px) * var(--text-scale,1));color:#bfb6a6;margin:16px 0 0}
.home-panel-veil button:focus-visible,.home-panel-veil input:focus-visible {outline:3px solid var(--chroma-c);outline-offset:2px}

/* Home: use the space released by moving stats into Profile. */
.home > .menu-body {padding-top:26px;padding-bottom:22px}
.home .home-hero {margin-bottom:26px}
.home .home-grid {gap:24px}
.home .big-action {min-height:220px;padding:24px;gap:10px}
.home .ba-sub {font-size:calc((14px) * var(--text-scale,1));max-width:none}
.home .play-extra {margin-top:24px;gap:24px}
.home .friends-entry {margin-top:24px}
.home .code-keyboard-button {background:#282320;color:var(--bone);border:1px solid #665b4d}

/* Public discovery: contained room list with fixed filters and details. */
.public-browser {padding:24px 40px;gap:20px;box-sizing:border-box;height:100%;min-height:0;overflow:hidden}
.public-header {display:flex;justify-content:space-between;align-items:center;gap:24px;flex-shrink:0}
.public-header h1 {font-size:calc((40px) * var(--text-scale,1));line-height:1;margin:0;color:var(--bone)}
.public-header p {margin:8px 0 0;font-size:calc((12px) * var(--text-scale,1));color:#b5ada1}
.public-filters {display:flex;align-items:stretch;gap:12px;flex-shrink:0}
.public-filters input {flex:1;min-width:0;background:#100e0c;border:1px solid #65594b;padding:10px 14px;font-size:calc((17px) * var(--text-scale,1));color:var(--bone)}
.public-filters button {white-space:nowrap;min-height:44px;font-size:calc((13px) * var(--text-scale,1))}
.public-filters button[aria-pressed=true] {border-color:var(--chroma-c);color:var(--chroma-c)}
.public-content {display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px;flex:1;min-height:0}
.public-results {display:flex;flex-direction:column;min-height:0;min-width:0}
.public-list-heading {display:flex;justify-content:space-between;padding:0 16px 12px;font-size:calc((12px) * var(--text-scale,1));color:#bbb2a5}
.public-rows {display:grid;grid-template-rows:repeat(5,minmax(0,1fr));gap:10px;flex:1;min-height:0}
.public-row {display:flex;align-items:center;gap:14px;border:1px solid #4a4035;border-radius:5px;background:#181410;color:var(--bone);padding:12px 16px;text-align:left;min-height:0;min-width:0}
.public-row.selected {border-color:var(--chroma-c);background:#292516}
.public-room-name {display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.public-room-name strong {font-size:calc((18px) * var(--text-scale,1));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.public-room-name small {font-size:calc((13px) * var(--text-scale,1));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c0b7aa}
.public-capacity {font-size:calc((24px) * var(--text-scale,1));white-space:nowrap}.public-capacity small {font-size:calc((16px) * var(--text-scale,1));color:#c0b7aa}
.public-detail {display:flex;flex-direction:column;min-height:0;min-width:0;padding:24px;border:1px solid #625441;background:#191510}
.public-state {color:var(--chroma-c);font-size:calc((13px) * var(--text-scale,1))}.public-detail h2 {font-size:calc((26px) * var(--text-scale,1));line-height:1.2;margin:18px 0 6px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.public-detail p {font-size:calc((15px) * var(--text-scale,1));color:#c0b7aa;line-height:1.4;margin:4px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.public-detail dl {margin:24px 0 12px;font-size:calc((16px) * var(--text-scale,1))}.public-detail dl>div {display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #3d352b}.public-detail dd {margin:0}
.public-join {margin-top:auto}.public-join p {font-size:calc((13px) * var(--text-scale,1));white-space:normal;margin-bottom:14px}.public-join .btn {width:100%;min-height:48px}
.public-pagination {display:flex;justify-content:center;align-items:center;gap:24px;flex-shrink:0}.public-pagination span {font-size:calc((13px) * var(--text-scale,1));min-width:160px;text-align:center}.public-pagination .btn {min-width:120px}
.public-empty {grid-row:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;border:1px dashed #625441}.public-empty h2,.public-empty p {margin:0}.public-empty p {font-size:calc((16px) * var(--text-scale,1))}
.public-browser button:focus-visible,.public-browser input:focus-visible {outline:3px solid var(--chroma-c);outline-offset:2px}

.public-browser {color:var(--bone)}

.public-room-scroll {position:relative;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#96834d #17130f;padding-right:8px;outline:none}
.public-room-scroll::-webkit-scrollbar {width:7px}.public-room-scroll::-webkit-scrollbar-track {background:#17130f}.public-room-scroll::-webkit-scrollbar-thumb {background:#96834d;border-radius:4px}
.public-room-track {position:relative;min-width:0}
.public-room-scroll .public-row {box-sizing:border-box;cursor:pointer}
.public-room-scroll:focus-visible .public-row.selected {outline:3px solid var(--chroma-c);outline-offset:0;background:#332e18}
.public-scroll-position {display:flex;justify-content:space-between;gap:16px;flex:none;padding:14px 4px 0;font-size:calc((12px) * var(--text-scale,1));color:#c0b7aa}
.public-results>.public-empty {flex:1}

.public-browser .public-room-scroll:focus {outline:none!important;box-shadow:none}
body[data-input="controller"] .public-room-scroll:focus .public-row.selected {outline:3px solid var(--chroma-c);outline-offset:0;background:#332e18}

/* Keep the complete Start menu within the fixed game canvas. */
.sysmenu-veil {padding:16px;box-sizing:border-box}
.sysmenu-card {width:min(520px,94cqw);max-height:94cqh;box-sizing:border-box}
.sysmenu-card:has(.pause-title)::before {height:10px}
.sysmenu-root {padding:16px 22px;min-height:0;box-sizing:border-box}
.sysmenu-root .pause-title {font-size:44px;margin:4px 0 10px}
.sysmenu-root .pause-title::after {height:3px;margin-top:6px}
.sysmenu-root .clap-kicker {font-size:calc((10px) * var(--text-scale,1));line-height:14px}
.sysmenu-id {padding:6px 12px;margin:6px 0 10px;min-height:48px}
.sysmenu-list {gap:5px;margin-top:0}
.sysmenu-list .sys-item {height:42px;min-height:42px;padding:8px 14px;font-size:calc((14px) * var(--text-scale,1));box-sizing:border-box}
.sysmenu-hint {margin-top:10px;font-size:calc((11px) * var(--text-scale,1));line-height:15px}
.sysmenu-card:has(.sysmenu-root.in-game) {width:min(720px,94cqw)}
.sysmenu-root.in-game .sysmenu-list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.sysmenu-root.in-game .sys-item {height:46px;min-height:46px}
.sysmenu-root.in-game .sys-item.primary {grid-column:1/-1}
.sysmenu-card .sys-panel {max-height:calc(94cqh - 4px)}

/* Game menu: fixed groups and a separate session-action footer. */
.game-menu-card {width:min(900px,94cqw);max-height:92cqh;border:1px solid #6c5b40;border-radius:6px;background:linear-gradient(145deg,#211b16,#0e0c0b);color:var(--bone);box-shadow:0 24px 80px #000b;animation:none}
.game-menu-root {padding:28px 32px;display:flex;flex-direction:column;gap:24px;min-height:0}
.game-menu-header {display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:20px;border-bottom:1px solid #534638}
.game-menu-header>div>span {font-size:calc((11px) * var(--text-scale,1));letter-spacing:.18em;color:#baae9b}.game-menu-header h2 {font-size:46px;line-height:1;margin:8px 0 0}
.game-menu-player {display:flex;align-items:center;gap:14px;max-width:55%;min-width:0}.game-menu-player strong {font-size:calc((17px) * var(--text-scale,1));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.game-menu-player svg {flex:none}
.game-menu-columns {display:grid;grid-template-columns:1fr 1fr;gap:32px;min-height:0}
.game-menu-group {display:flex;flex-direction:column;gap:8px;min-width:0}.game-menu-group h3 {font-size:calc((12px) * var(--text-scale,1));font-weight:400;letter-spacing:.18em;color:#baae9b;margin:0 0 4px}
.game-menu-action {display:flex;align-items:center;gap:14px;min-height:48px;box-sizing:border-box;padding:12px 16px;border:1px solid #504536;background:#ffffff04;border-radius:4px;color:var(--bone);font-family:'Archivo Black',sans-serif;font-size:calc((16px) * var(--text-scale,1));text-align:left;transition:background .12s,border-color .12s}
.game-menu-action:hover {border-color:#c5ac69;background:#342d20}.game-menu-action.primary {background:var(--chroma-c);color:var(--ink);border-color:var(--chroma-c)}.game-menu-action.primary .icn {color:var(--ink)}
.game-menu-value {margin-left:auto;color:var(--chroma-c);font-size:calc((14px) * var(--text-scale,1))}.game-menu-secondary {display:flex;flex-direction:column;gap:20px}.game-menu-group.info>div {display:grid;grid-template-columns:1fr 1fr;gap:8px}.game-menu-group.info .game-menu-action {font-size:calc((14px) * var(--text-scale,1));justify-content:center;padding:10px}
.game-menu-footer {border-top:1px solid #534638;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:16px}.game-menu-footer>span {font-size:calc((11px) * var(--text-scale,1));letter-spacing:.16em;color:#baae9b}.game-menu-footer>div {display:flex;gap:10px}.game-menu-footer .btn {font-size:calc((12px) * var(--text-scale,1));min-height:42px;padding:10px 14px}
.game-menu-card button:focus-visible {outline:3px solid var(--chroma-c);outline-offset:3px}.game-menu-action.primary:focus-visible {outline-color:var(--bone)}
.game-menu-confirm {padding:44px;display:flex;flex-direction:column;gap:24px}.game-menu-confirm h2 {font-size:calc((38px) * var(--text-scale,1));margin:0}.game-menu-confirm p {font-size:calc((18px) * var(--text-scale,1));margin:0;color:#c8beaf}.game-menu-confirm>div {display:flex;gap:16px;margin-top:16px}.game-menu-confirm .btn {min-width:180px;min-height:48px}
.game-menu-card .sys-panel {max-height:calc(92cqh - 2px)}

/* Menu subpanels: fixed actions and deliberate, controller-readable content. */
.sys-panel-footer {flex:none;display:flex;align-items:center;gap:16px;padding:16px 24px;border-top:1px solid #534638;background:#171310}
.sys-panel-footer>span {margin-right:auto;font-size:calc((12px) * var(--text-scale,1));color:#c8beaf}
.sys-panel-footer .btn {min-height:46px}
.game-menu-card .sys-panel-body .stat-row {grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:22px}
.game-menu-card .profile-banner {margin-bottom:20px}
.game-menu-card .empty-combos {padding:20px;margin-bottom:20px}
[data-menu-scroll] {overscroll-behavior:contain;scrollbar-color:#8c7853 #171310;scrollbar-width:thin}
[data-menu-scroll]:focus-visible {outline:2px solid var(--chroma-c);outline-offset:-4px}
.profile-editor {display:grid;grid-template-columns:200px 1fr;align-items:center;gap:30px;padding:14px 4px}
.profile-editor-preview {display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px;min-width:0}
.profile-editor-preview strong {font-size:calc((20px) * var(--text-scale,1));overflow-wrap:anywhere}
.profile-editor-preview>span {font-size:calc((11px) * var(--text-scale,1));color:#baae9b}
.profile-editor-choices {min-width:0}.profile-editor-choices .sec-label {color:#c8beaf}
.profile-glyphs {display:grid;grid-template-columns:repeat(6,48px);gap:12px;margin-bottom:26px}
.profile-glyphs .glyph {width:48px;height:48px}
.profile-colors {display:flex;gap:12px;padding:4px}.profile-colors .swatch {width:36px;height:36px}
.extras-screen .ctrl-hints,.credits2 .ctrl-hints {flex:none;min-height:44px;align-items:center;justify-content:center;color:#c8beaf;font-size:calc((12px) * var(--text-scale,1))}

/* Achievement collection: fixed filters, contained controller scrolling. */
.achievement-toolbar {flex:none;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 30px;border-bottom:1px solid #534638}
.achievement-overall {display:flex;align-items:center;gap:16px;color:var(--chroma-c);font-size:calc((13px) * var(--text-scale,1))}
.achievement-overall progress {width:160px;height:9px}
.achievement-filters {display:flex;gap:10px}.achievement-filters .btn {min-height:42px;font-size:calc((12px) * var(--text-scale,1))}
.achievement-filters [aria-pressed="true"] {background:var(--chroma-c);color:var(--ink);border-color:var(--chroma-c)}
.achievement-list {max-width:1160px;padding:20px 26px 30px}
.achievement-group {margin-bottom:24px}.achievement-group h2 {display:flex;justify-content:space-between;color:#d8cfbf;font-size:calc((13px) * var(--text-scale,1));letter-spacing:.12em;text-transform:uppercase;margin:0 0 14px}
.achievement-group h2 span {color:var(--chroma-c)}
.achievement-list .ach-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.achievement-list .ach-card {align-items:flex-start;min-height:122px;border-radius:4px;padding:18px;box-sizing:border-box}
.achievement-list .ach-card.locked {opacity:1;background:#15110e}
.achievement-list .ach-card.on {background:#242014;box-shadow:inset 3px 0 var(--chroma-c),inset 0 0 0 1px #7c7130}
.achievement-list .ach-icon {flex:none;font-size:calc((27px) * var(--text-scale,1));width:40px;line-height:42px;background:#ffffff06;border:1px solid #635746;border-radius:4px}
.achievement-list .ach-name {font-size:calc((17px) * var(--text-scale,1));line-height:1.3}.achievement-list .ach-desc {font-size:calc((14px) * var(--text-scale,1));line-height:1.4;color:#c8beaf;margin-top:6px}
.achievement-status {display:block;font-size:calc((10px) * var(--text-scale,1));letter-spacing:.12em;color:#aa9e89;margin-top:10px}.on .achievement-status {color:var(--chroma-c)}
.achievement-progress {display:flex;align-items:center;gap:14px;margin-top:12px;font-size:calc((12px) * var(--text-scale,1));color:#d8cfbf}.achievement-progress progress {width:150px;height:7px}
.achievement-screen progress {accent-color:var(--chroma-c)}.achievement-screen progress::-webkit-progress-bar {background:#433a2b}.achievement-screen progress::-webkit-progress-value {background:var(--chroma-c)}
.achievement-footer {flex:none;display:flex;align-items:center;justify-content:space-between;padding:14px 30px;border-top:1px solid #534638;color:#c8beaf;font-size:calc((11px) * var(--text-scale,1))}
.achievement-empty {padding:60px;text-align:center;color:var(--bone);font-size:calc((20px) * var(--text-scale,1))}
body.text-boost .achievement-list .ach-desc {font-size:calc((16px) * var(--text-scale,1))}

/* The screening is a show segment, not an empty answer card. */
.screening-entrance {position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;background:#0d0a08;color:var(--bone);opacity:calc(1 - var(--screening-exit));pointer-events:none}
.screening-aperture {position:absolute;inset:0;background:radial-gradient(ellipse at center,#4b3a2040 0%,#0d0a08 72%);clip-path:inset(calc((1 - var(--screening-arrival))*43%) 0);border-top:2px solid #6d5730;border-bottom:2px solid #6d5730}
.screening-close {position:absolute;top:10%;font-size:calc((14px) * var(--text-scale,1));letter-spacing:.24em;color:#c0aa84}
.screening-title-block {position:relative;text-align:center;opacity:var(--screening-arrival);transform:translateY(calc((1 - var(--screening-arrival))*16px));width:90%}
.screening-eyebrow {font-size:calc((16px) * var(--text-scale,1));letter-spacing:.34em;color:var(--chroma-c);margin-bottom:20px}
.screening-title-block h1 {font-size:clamp(64px,10cqw,122px);line-height:1;margin:0;letter-spacing:.01em;font-weight:400}
.screening-title-block h1 em {font-style:normal;color:var(--blood)}
.screening-title-block p {font-size:calc((28px) * var(--text-scale,1));margin:28px 0 0;color:#d4c7b3}
.screening-next {position:absolute;bottom:9%;font-size:calc((13px) * var(--text-scale,1));letter-spacing:.22em;color:#b5a68e;opacity:var(--screening-arrival)}
body.reduce-motion .screening-aperture {clip-path:none}
body.reduce-motion .screening-title-block {transform:none}
@media(prefers-reduced-motion:reduce){.screening-aperture{clip-path:none}.screening-title-block{transform:none}}

/* One continuous quote reveal: large read, then dock into the real play area. */
.prompt-to-hand {isolation:isolate}
.prompt-to-hand .compose-prompt {overflow:visible;position:relative;z-index:3;pointer-events:none}
.prompt-to-hand .compose-prompt .prompt-card {
  opacity:var(--quote-alpha);
  clip-path:inset(0 calc((1 - var(--quote-reveal))*50%) 0);
  transform:translateY(calc((1 - var(--quote-dock))*var(--quote-center))) translateY(calc((1 - var(--quote-dock))*-50%));
  padding:calc(12px + (1 - var(--quote-dock))*18px) calc(20px + (1 - var(--quote-dock))*10px);
}
.prompt-to-hand .compose-prompt .prompt-quote {font-size:calc(23px + (1 - var(--quote-dock))*25px);line-height:1.18}
.prompt-show-heading {position:absolute;top:8%;left:0;right:0;text-align:center;color:var(--chroma-c);letter-spacing:.24em;font-size:calc((14px) * var(--text-scale,1));opacity:calc(1 - var(--hand-progress));pointer-events:none}
.prompt-to-hand .round-heading,.prompt-to-hand .round-action-bar,.prompt-to-hand .compose-wait {opacity:var(--hand-progress);pointer-events:none}
.prompt-to-hand .compose-hand .hand-card {opacity:var(--card-progress);transform:translateY(calc((1 - var(--card-progress))*100px)) rotate(calc((1 - var(--card-progress))*3deg));pointer-events:none}
body.reduce-motion .prompt-to-hand .compose-hand .hand-card {transform:none}
body.reduce-motion .prompt-to-hand .compose-prompt .prompt-card {clip-path:none}
@media(prefers-reduced-motion:reduce){.prompt-to-hand .compose-hand .hand-card{transform:none}.prompt-to-hand .compose-prompt .prompt-card{clip-path:none}}

/* The screening hands the stage to the audience before ballots open. */
.ballot-entrance {position:relative;flex:1;min-height:0;width:100%;z-index:30;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#0d0a08;color:var(--bone);text-align:center;opacity:calc(1 - var(--ballot-out));overflow:hidden}
.ballot-entrance-kicker,.ballot-entrance-next {position:absolute;font-size:calc((14px) * var(--text-scale,1));letter-spacing:.22em;color:#b7a88e}.ballot-entrance-kicker{top:12%}.ballot-entrance-next{bottom:10%}
.ballot-entrance-title {opacity:var(--ballot-in);transform:translateY(calc((1 - var(--ballot-in))*16px));width:90%}
.ballot-entrance-title>.f-mono {color:var(--chroma-c);font-size:calc((16px) * var(--text-scale,1));letter-spacing:.3em}
.ballot-entrance h1 {font-size:clamp(64px,10cqw,122px);font-weight:400;line-height:1;margin:24px 0}.ballot-entrance h1 em{color:var(--chroma-c);font-style:normal}
.ballot-entrance p {font-size:calc((28px) * var(--text-scale,1));color:#d4c7b3;margin:0}
body.reduce-motion .ballot-entrance-title {transform:none}
@media(prefers-reduced-motion:reduce){.ballot-entrance-title{transform:none}}

/* Fitted wording occupies the sleeve's existing metadata line; no extra row. */
.card-fit-label { color: #625100; font-weight: 900; }
.card-fit-change { animation: card-fit-wording 650ms ease-out; }
@keyframes card-fit-wording { from { background-color: #f5d625; } to { background-color: transparent; } }
@media (prefers-reduced-motion: reduce) { .card-fit-change { animation: none; } }
body.reduce-motion .card-fit-change { animation: none; }

/* Keep the opening's large stacked title. Readiness is a supporting row below it. */
.opening-ready-row{position:absolute;bottom:78px;left:6%;right:6%;display:grid;grid-template-columns:repeat(var(--ready-seats),minmax(0,1fr));gap:12px;max-width:880px;margin:auto;align-items:start}
.opening-ready-player{min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px;color:#d8cbb7}
.opening-ready-avatar{position:relative;display:inline-flex;width:36px;height:36px}
.opening-ready-check{position:absolute;right:-6px;bottom:-3px;width:18px;height:18px;display:grid;place-items:center;border:2px solid #1b1412;border-radius:50%;background:#5d5043;color:#fff5db;font:700 calc(12px * var(--text-scale,1)) system-ui}
.opening-ready-check.ready{background:#bdcf91;color:#1b2414}
.opening-ready-name{font-size:calc((12px) * var(--text-scale,1));font-weight:650;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.opening-ready-state{font-size:calc((8px) * var(--text-scale,1));letter-spacing:.13em;color:#bdcf91}
.opening-ready-player.you .opening-ready-name{color:#fff1cc}
@container(max-height:650px){.opening-ready-row{bottom:62px;gap:8px}.opening-ready-player{gap:4px}.opening-ready-name{font-size:calc((11px) * var(--text-scale,1))}}

/* Startup shares the approved match-opening composition. */
.startup-menu-screen{width:100%;height:100%;min-height:0}
.startup-tagline{opacity:1;font-size:calc((20px) * var(--text-scale,1));color:#ddc9a5}
.startup-actions{position:absolute;bottom:82px;left:6%;right:6%;margin:auto;max-width:590px;display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:14px}
.startup-actions .btn{min-width:0;min-height:52px;justify-content:center;font-size:calc((20px) * var(--text-scale,1));padding:12px 20px}
.startup-actions .btn:focus-visible{outline:3px solid #ffe766;outline-offset:5px;box-shadow:0 0 20px #e6bb6328}
.startup-footer{position:absolute;bottom:24px;left:6%;right:6%;font-size:calc((10px) * var(--text-scale,1));letter-spacing:.18em;color:#aa9681}
@container(max-height:650px){.startup-actions{bottom:68px}.startup-actions .btn{min-height:46px;padding:9px 18px}.startup-footer{bottom:20px}.startup-tagline{font-size:calc((18px) * var(--text-scale,1))}}

/* Slow independent spotlight sweeps. Transform-only motion keeps the title still. */
.opening-projector.spotlights-idle,.opening-projector.spotlights-arriving{background:none;--spot-left-period:17s;--spot-right-period:23s}
.spotlight-beam{position:absolute;display:block;inset:-10% -30% -40%;transform-origin:50% 0;pointer-events:none;background:conic-gradient(from 160deg at 50% 0,transparent 0deg,#e8cb853b 12deg,transparent 27deg,transparent 360deg)}
.spotlight-beam.beam-right{background:conic-gradient(from 188deg at 50% 0,transparent 0deg,#e8cb8529 12deg,transparent 27deg,transparent 360deg)}
.spotlights-idle .beam-left{animation:spotlight-left-sweep var(--spot-left-period) ease-in-out -4s infinite}
.spotlights-idle .beam-right{animation:spotlight-right-sweep var(--spot-right-period) ease-in-out -13s infinite}
.spotlights-arriving .beam-left{transform:rotate(var(--spot-left-angle,0deg))}
.spotlights-arriving .beam-right{transform:rotate(var(--spot-right-angle,0deg))}
@keyframes spotlight-left-sweep{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(7deg)}}
@keyframes spotlight-right-sweep{0%,100%{transform:rotate(8deg)}50%{transform:rotate(-6deg)}}
/* Preserve the original static light composition for both reduced-motion controls. */
@media(prefers-reduced-motion:reduce){.opening-projector.spotlights-idle,.opening-projector.spotlights-arriving{background:conic-gradient(from 160deg at 50% -10%,transparent,#e8cb8540 12deg,transparent 27deg,transparent 310deg,#e8cb8525 333deg,transparent 347deg)}.spotlight-beam{display:none}}
body.reduce-motion .opening-projector.spotlights-idle,body.reduce-motion .opening-projector.spotlights-arriving{background:conic-gradient(from 160deg at 50% -10%,transparent,#e8cb8540 12deg,transparent 27deg,transparent 310deg,#e8cb8525 333deg,transparent 347deg)}
body.reduce-motion .spotlight-beam{display:none}

/* Three separate light-off beats, followed by a genuinely black projector lead-in. */
.opening-blackout{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;z-index:5}
.match-opening[data-lights-off="1"] .beam-left,.match-opening[data-lights-off="2"] .beam-left,.match-opening[data-lights-off="3"] .spotlight-beam{opacity:0}
.match-opening[data-lights-off="2"] .beam-right{opacity:0}
.opening-shutdown[data-lights-off="1"] .opening-marquee{filter:brightness(.8)}
.opening-shutdown[data-lights-off="2"] .opening-marquee{filter:brightness(.5)}
.opening-shutdown[data-lights-off="3"] .opening-blackout{opacity:1}
/* Reduced motion keeps the three-off sequence as dimming, without sweeping beams. */
@media(prefers-reduced-motion:reduce){.opening-shutdown[data-lights-off="1"] .opening-projector{opacity:.4}.opening-shutdown[data-lights-off="2"] .opening-projector{opacity:0}}
body.reduce-motion .opening-shutdown[data-lights-off="1"] .opening-projector{opacity:.4}
body.reduce-motion .opening-shutdown[data-lights-off="2"] .opening-projector{opacity:0}

.opening-start-prompt{position:absolute;bottom:18px;left:6%;right:6%;min-height:40px;display:flex;align-items:center;justify-content:center;color:#e1c696;letter-spacing:.12em;font-size:calc((13px) * var(--text-scale,1))}
.opening-start-button{font:inherit;letter-spacing:inherit;color:inherit;background:transparent;border:1px solid transparent;padding:8px 16px;min-height:40px;cursor:pointer}
.opening-start-button kbd{display:inline-block;font:700 calc(12px * var(--text-scale,1)) system-ui;letter-spacing:.04em;border:1px solid #bda979;padding:4px 8px;margin:0 5px;min-width:28px;color:#fff1cc;border-radius:3px}
.opening-start-button:hover,.opening-start-button:focus-visible{outline:2px solid #ffe766;outline-offset:2px;background:#e6bb6310}
.opening-start-button:disabled{opacity:.45;cursor:default}
.opening-start-button .opening-pad-key{display:none}
body[data-input="controller"] .opening-keyboard-key{display:none}
body[data-input="controller"] .opening-start-button .opening-pad-a{display:inline-block;border-radius:50%}
body[data-input="controller"][data-confirm="cross"] .opening-start-button .opening-pad-a{display:none}
body[data-input="controller"][data-confirm="cross"] .opening-start-button .opening-pad-cross{display:inline-block;border-radius:50%}

.opening-host-gate .spotlights-idle .spotlight-beam{animation-play-state:inherit}
body[data-dev-held="true"] .opening-host-gate .spotlights-idle .spotlight-beam{animation-play-state:paused}

/* Room invitation stays discreet until deliberately revealed. */
.opening-room-code{position:absolute;top:22px;right:28px;display:grid;justify-items:center;gap:5px;padding:8px 12px;min-width:106px;background:#100c0b66;border:1px solid #d4bb7928;color:#e1c696;cursor:pointer;z-index:2}
.opening-room-code>span{font-size:calc((9px) * var(--text-scale,1));letter-spacing:.16em}
.opening-room-code strong{font-size:calc((20px) * var(--text-scale,1));letter-spacing:.14em;line-height:1.1}
.opening-room-code small{font-size:calc((10px) * var(--text-scale,1));color:#c1b499}
.opening-room-code kbd{font:inherit;border:1px solid #8b7b57;padding:1px 3px;margin-right:3px}
.opening-room-code:hover,.opening-room-code:focus-visible{outline:2px solid #ffe766;outline-offset:3px;background:#292019}

/* Decorative beams must never create a focus-scrollable surface. */
.opening-host-gate{overflow:clip}

/* Act entrances share the waiting-room cast treatment and one centered title. */
.act-presentation{position:relative;isolation:isolate;width:100%;height:100%;overflow:clip;text-align:center;color:#fff1cc;background:radial-gradient(ellipse at 50% 25%,#60332c 0%,#241816 40%,#0e0b0b 80%)}
.act-presentation-main{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:0 6%}
.act-presentation-kicker{font-size:calc((13px) * var(--text-scale,1));letter-spacing:.25em;color:#e1c696}
.act-presentation-main h1{font-size:clamp(90px,12cqw,154px);line-height:1;margin:0;letter-spacing:.035em;text-shadow:0 4px 0 #1d110f,0 0 40px #e6bb6330}
.act-presentation-main h1 em{font-style:normal;color:#eb4938}
.act-presentation-detail{font-size:calc((13px) * var(--text-scale,1));letter-spacing:.16em;color:#cabb9f}
.act-presentation .act-cast{bottom:88px}
.act-cast-score{font-size:calc((10px) * var(--text-scale,1));letter-spacing:.1em;color:#e1c696}
.act-cast .eliminated{opacity:.5}
.act-presentation-menu{position:absolute;top:24px;right:28px}
.act-presentation-progress{position:absolute;bottom:22px;left:0;right:0;display:flex;justify-content:center}
.act-presentation-progress .auto-advance{margin:0}
@container(max-height:650px){.act-presentation .act-cast{bottom:76px}.act-presentation-main{gap:14px}.act-presentation-main h1{font-size:120px}}

/* The outgoing shutter and incoming black frame meet at full coverage. */
.act-presentation-main{opacity:calc(1 - var(--act-exit,0));transform:translateY(calc(var(--act-exit,0)*-18px))}
.act-presentation .act-cast,.act-presentation-progress{opacity:calc(1 - var(--act-exit,0))}
.act-exit-frame{position:absolute;inset:0;z-index:80;pointer-events:none;overflow:clip}
.act-exit-frame i{position:absolute;left:0;right:0;height:50.1%;background:#000;will-change:transform}
.act-exit-frame i:first-child{top:0;transform:translateY(calc((var(--act-exit,0) - 1)*100%))}
.act-exit-frame i:last-child{bottom:0;transform:translateY(calc((1 - var(--act-exit,0))*100%))}
.reel-arrival-frame{position:absolute;inset:0;background:#000;z-index:80;pointer-events:none}
body.reduce-motion .act-presentation-main{transform:none}
body.reduce-motion .act-exit-frame{background:#000;opacity:var(--act-exit,0)}
body.reduce-motion .act-exit-frame i{display:none}
@media(prefers-reduced-motion:reduce){.act-presentation-main{transform:none}.act-exit-frame{background:#000;opacity:var(--act-exit,0)}.act-exit-frame i{display:none}}

/* Player identity follows the waiting-room color through every gameplay HUD. */
.round-topbar .pip{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0;padding:0;min-width:100px;border-radius:4px;overflow:hidden;align-items:center}
.round-topbar.large-cast .pip{padding:0;gap:0;min-width:0}
.round-topbar .pip .av{display:none}
.round-topbar .pip .nm,.round-topbar.large-cast .pip .nm{grid-column:1/-1;width:100%;max-width:none;box-sizing:border-box;padding:5px 6px;background:var(--player-color);color:var(--player-ink);font-weight:700;font-size:calc((11px) * var(--text-scale,1));line-height:1.3}
.round-topbar .pip .take-meter{grid-row:2;grid-column:1;margin:5px 6px}
.round-topbar .pip .sc{grid-row:2;grid-column:2;margin:4px 6px 5px;min-width:18px;text-align:right}
.round-topbar .pip.is-you{border-color:var(--player-color);box-shadow:0 0 0 1px #fff3}

.quote-intro{opacity:calc(1 - var(--reel-title-out,0));transform:translateY(calc(var(--reel-title-out,0)*-12px))}
body.reduce-motion .quote-intro{transform:none}
@media(prefers-reduced-motion:reduce){.quote-intro{transform:none}}

/* Keep timer labels and digits at their natural width. */
.decision-clock-label,.decision-clock-unit{flex:none;white-space:nowrap;}

/* Collections turn pages; only the public room browser scrolls. */
.menu-pages{display:flex;flex:none;align-items:center;justify-content:center;gap:24px;padding:10px 24px;border-top:1px solid #534638;min-height:62px;box-sizing:border-box}
.menu-pages .btn{min-height:42px;display:flex;align-items:center;gap:10px;font-size:16px}.menu-pages>span{min-width:80px;text-align:center;font-size:16px}
.achievement-screen .paged-collection,.news-screen .paged-collection,.credits2 .paged-credits{overflow:hidden;min-height:0;flex:1;}
.achievement-screen .achievement-list{padding:16px 26px;display:flex}
.achievement-screen .achievement-group{margin:0;display:flex;flex-direction:column;flex:1;min-height:0}
.achievement-screen .achievement-group h2{flex:none;margin-bottom:10px}
.achievement-screen .ach-grid{flex:1;min-height:0;grid-template-rows:repeat(2,minmax(0,1fr));align-content:stretch}
.achievement-screen .ach-card{min-height:0;padding:14px;gap:12px}.achievement-screen .ach-meta{min-width:0}
.achievement-screen .achievement-progress{margin-top:8px}.achievement-screen .achievement-status{margin-top:6px}
.achievement-screen .ach-name{font-size:clamp(17px,calc(17px * var(--text-scale,1)),20px);line-height:1.2}
.achievement-screen .ach-desc{font-size:clamp(14px,calc(14px * var(--text-scale,1)),17px);line-height:1.3}
.news-screen .paged-collection{display:flex;align-items:center}.news-screen .news-list{width:100%}.news-screen .news-card{margin:0}
.credits2 .paged-credits{padding:24px 44px;display:flex;align-items:center;justify-content:center}
.paged-credits>*{display:none!important;width:100%;max-width:920px;box-sizing:border-box;margin:0!important}
.paged-credits[data-page="0"]>:nth-child(1),.paged-credits[data-page="1"]>:nth-child(2),.paged-credits[data-page="2"]>:nth-child(3),.paged-credits[data-page="3"]>:nth-child(4),.paged-credits[data-page="4"]>:nth-child(5),.paged-credits[data-page="5"]>:nth-child(6),.paged-credits[data-page="6"]>:nth-child(7),.paged-credits[data-page="7"]>:nth-child(8),.paged-credits[data-page="8"]>:nth-child(9){display:block!important}
.paged-collection .achievement-group,.news-screen .news-card,.paged-credits>*{animation:collection-page-in .16s ease-out}
@keyframes collection-page-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.paged-collection .achievement-group,.news-screen .news-card,.paged-credits>*{animation:none}}
body.reduce-motion .paged-collection .achievement-group,body.reduce-motion .news-screen .news-card,body.reduce-motion .paged-credits>*{animation:none}

.sys-panel:has(.profile-pages){height:78cqh}.sys-panel-body:has(.profile-pages){overflow:hidden;flex:1;display:flex;min-height:0}
.profile-pages{display:flex;flex-direction:column;gap:16px;flex:1;min-height:0}.profile-tabs{display:flex;gap:10px;flex:none}.profile-tabs .btn{flex:1;min-height:44px}
.profile-page{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;animation:collection-page-in .16s ease-out}
.profile-page .sec-label{flex:none;margin:0 0 16px}.profile-page .combo-card{padding:20px}.profile-page .combo-q{font-size:clamp(20px,calc(20px * var(--text-scale,1)),24px);line-height:1.25;overflow-wrap:anywhere}
.profile-page .combo-q .fill{font-size:inherit}.profile-page .hist-list{display:grid;gap:8px}.profile-page .hist-row{padding:12px;min-height:44px}.profile-pages .menu-pages{padding:8px 0;min-height:54px}
body.reduce-motion .profile-page{animation:none}@media(prefers-reduced-motion:reduce){.profile-page{animation:none}}

/* Keep home actions inside the available space, above the footer. */
.home > .menu-body{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:16px;padding:20px 20px 16px;box-sizing:border-box;overflow:hidden;}
.home .home-hero{margin:0;}
.home .home-grid{min-height:0;gap:20px;}
.home .big-action{min-height:0;padding:20px;gap:8px;}
.home .play-extra,.home .friends-entry{margin-top:0;}
.home .friends-entry{padding:12px 20px;}
.home .hero-title .slay{font-size:inherit!important;}
@container (max-height:650px){
 .home > .menu-body{gap:12px;padding-block:16px 12px;}
 .home .big-action{padding:16px;gap:6px;}
 .home .ba-glyph{font-size:28px;}
 .home .quick-join,.home .browse-bar{padding:10px 16px;}
 .home .hero-title{font-size:34px;}
 .home .friends-entry{padding-block:10px;}
}
/* Lobby rows own the tile height; avatars stay square within each row. */
.lobby .seat-list .seat{container-type:size;padding:0 8px;gap:10px;}
.lobby .seat-list .seat>.player-tile{height:100%;max-height:44px;min-width:0;flex:1 1 210px;grid-template-columns:min(42px,100cqh) minmax(0,1fr) auto;grid-template-rows:1fr 1fr;}
.lobby .seat-list .player-tile .pt-avatar{width:100%!important;height:100%!important;min-height:0;}
.lobby .seat-list .player-tile .nm{padding-block:0;display:flex;align-items:center;}
.lobby .seat-list .seat-meta{flex:0 0 auto;}

/* Dialogs use the stage overlay layer, not the home content stacking context. */
.home-panel-veil{position:absolute;z-index:150;overflow:hidden;}
.home-panel-veil.keyboard-veil{z-index:160;}
.friends-panel{width:min(1060px,100%);height:min(648px,100%);min-height:0;max-height:100%;}

/* Assigned collection avatars remain square in menu/profile wrappers too. */
.av-big,.game-menu-player .seed-av{border-radius:0;overflow:hidden;}

.opening-room-qr{display:block;width:clamp(128px,17cqw,180px);height:auto;aspect-ratio:1;background:#fff;margin:4px 0;}

/* Steam IDs are pasted/copied; keep the established invite box within its frame. */
.steam-invite-code .ic-code{font-size:20px;letter-spacing:.02em}
.code-input[maxlength="18"]{font-size:16px;letter-spacing:.03em}
.steam-room-row{display:flex;justify-content:space-between;gap:20px;width:100%;margin-bottom:12px;text-align:left}

/* Brief tutorial-skip pickup stays inside the existing Act I composition. */
.act-presentation-caption{margin:0;max-width:40ch;font-size:clamp(20px,2.4cqw,30px);line-height:1.25;color:#fff1cc}

/* Keep the take number and explicit Edit label inside all four ballot slots. */
.ballot-guided .round-action-bar.compact-ballot-bar .ballot-slot{flex-basis:148px}
.ballot-guided .take-edit-label{letter-spacing:.04em}

/* The review console advertises its edit controls without adding a row. */
.ballot-guided .compact-ballot-bar .ballot-task>.f-mono{font-size:calc(13px * var(--text-scale,1));line-height:1.25}
.ballot-guided .ballot-slot.filled>strong{text-decoration:underline;text-underline-offset:3px}
.ballot-guided .ballot-slot.current>strong{color:var(--bone)}