/* Lot 19: one reserved area per piece of information. The portraits are rendered
   by the WebGL canvas below these transparent selection frames. */
.game-lobby{display:flex;flex-direction:column;align-items:center;padding:clamp(14px,3vh,30px) 4vw 12px;gap:14px;background:linear-gradient(180deg,#030b13f7,#07111b80 27%,#07111b12 48%,#030b14de 76%,#030b14 100%)}
.game-title{position:static;flex:none;text-align:center;inset:auto}
.game-title h1{font:400 clamp(28px,4vh,48px)/.95 var(--serif);letter-spacing:4px}
.game-title h1 span{font-size:.47em;letter-spacing:5px;margin-top:8px}
.game-lobby .character-lineup,.game-lobby.online .character-lineup{position:relative;inset:auto;transform:none;flex:1;min-height:145px;width:min(100%,1320px);display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(5px,.9vw,13px)}
.game-lobby .character-choice{border:1px solid #a0b3c43b;border-radius:3px;background:linear-gradient(0deg,#050d16e6 0 44px,transparent 85px);box-shadow:inset 0 0 30px #07111b22;overflow:hidden;transition:border-color .18s,box-shadow .18s}
.game-lobby .character-choice:before{inset:0;background:linear-gradient(135deg,#a6bdcc0c,transparent 45%);opacity:1}
.game-lobby .character-choice:after{content:'';width:12px;height:12px;bottom:auto;left:auto;right:12px;top:12px;border:1px solid #a7bcc864;border-radius:50%;background:#07121b99;transform:none}
.game-lobby .character-choice.selected{border-color:#d9bb7e;box-shadow:inset 0 0 0 1px #d9bb7e40,0 0 24px #dec4830a}
.game-lobby .character-choice.selected:after{background:#e3ca93;box-shadow:inset 0 0 0 3px #14222c;border-color:#e3ca93}
.game-lobby .character-choice:hover{border-color:#b5cad09e}
.game-lobby .character-choice.selected:hover{border-color:#efdbb1}
.game-lobby .choice-name{height:54px;padding:0 3px;font:500 clamp(11px,1.45vw,15px)/1.2 'Trebuchet MS',Arial,sans-serif;letter-spacing:.2px;color:#aab6c0}
.game-lobby .selected .choice-name{color:#f2e3c5}
.game-lobby .lobby-controls{position:static;inset:auto;transform:none;flex:none;width:min(630px,100%)}
.game-lobby .game-rules{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}
.game-lobby .game-rules button{position:relative;display:flex;align-items:center;justify-content:flex-start;gap:14px;min-height:58px;padding:11px 17px;border:1px solid #9eafbe45;border-radius:3px;background:linear-gradient(#1b2c37e6,#0c1925e6);color:#aebdc9;font:600 clamp(13px,1.7vw,16px)/1.2 'Trebuchet MS',Arial,sans-serif;box-shadow:inset 0 1px #ffffff09,0 4px 14px #0003}
.game-lobby .game-rules button>.hud-icon{width:29px;height:29px;stroke-width:1.45}
.game-lobby .game-rules button i{margin-left:auto;flex:none;width:7px;height:7px;border-radius:50%;background:#8197a13b}
.game-lobby .game-rules button[aria-selected=true]{border-color:#ccb580;color:#f6e5c1;background:linear-gradient(#344047,#1c2a33);box-shadow:inset 0 -2px #cbb17a,0 4px 15px #0003}
.game-lobby .game-rules button[aria-selected=true] i{background:#e8ca88;box-shadow:0 0 8px #e8ca8855}
.game-lobby .game-rules button:hover{background:linear-gradient(#2e404c,#182b38);color:#f4eee1}
#mode-description{min-height:35px;max-width:580px;margin:9px auto 8px;text-align:center;color:#a8b6c1;font:400 12px/1.45 'Trebuchet MS',Arial,sans-serif;letter-spacing:0;text-wrap:pretty}
.game-lobby .lobby-mode{display:flex;gap:2px;width:max-content;margin:0 auto 9px;padding:3px;border:1px solid #7c919f3b;border-radius:3px;background:#0a1721}
.game-lobby .lobby-mode button{padding:6px 21px;border:0;border-radius:1px;font:500 11px/1.2 Arial,sans-serif;color:#91a3b1;letter-spacing:.2px}
.game-lobby .lobby-mode .active{background:#33414b;color:#f6ebd3;box-shadow:0 1px 3px #0005}
.game-lobby .embark-row{gap:10px}
.game-lobby .embark-row input{width:40%;border:1px solid #8095a347;border-radius:3px;padding:10px 13px;background:#0c1923c9;color:#dbe5ea;font-size:13px}
.game-lobby .primary{width:60%;min-height:46px;font-size:13px;letter-spacing:1.2px;padding:12px 20px;border-radius:3px;background:linear-gradient(#e6d6b3,#baa477);border-color:#ead6a9;box-shadow:inset 0 1px #fff8,0 4px 12px #0005}
.game-lobby .status{margin:5px 0 0;min-height:0;font:11px/1.4 Arial,sans-serif}
.game-lobby .status:empty{display:none}
.game-lobby #server-url{padding:9px 12px;border:1px solid #8095a347;border-radius:3px}
.game-lobby .lobby-footer{position:static;flex:none;width:100%;display:flex;align-items:center;gap:16px;justify-content:space-between;font:10px/1.3 Arial,sans-serif;color:#8a9caa}
.game-lobby .lobby-footer>div{gap:16px}
/* Clear top row: survivors / secret role, clock, camera and pause. */
#hud{--hud-edge:24px;font-family:'Trebuchet MS','Segoe UI',Arial,sans-serif}
.hud-top{position:absolute;inset:0 0 auto;height:108px;background:linear-gradient(#020b15ab,transparent);pointer-events:none}
.clock-block{top:19px;min-width:88px;padding:7px 12px 8px;border:0;border-radius:3px;background:#08121b87}
.clock-block:before{display:none}
.clock-block strong{font:500 27px/1 Arial,sans-serif;letter-spacing:1px;margin-bottom:9px}
.phase-track{width:64px;gap:3px}.phase-track i{height:2px;background:#afbdc43d}.phase-track i.passed{background:#d7c190}
.survivors{top:26px;left:var(--hud-edge);padding:0;border:0;gap:7px;align-items:center;color:#ece9df}
.survivors b{font:600 21px/1 Arial,sans-serif}.survivors .hud-icon{width:17px;height:19px}
.hud-top .role-seal{position:absolute;left:calc(var(--hud-edge) + 64px);top:22px;display:flex;gap:7px;align-items:center;padding:7px 10px;border-left:2px solid #a6c7bb;background:linear-gradient(90deg,#122b2cbf,#12232c75);color:#d3e2d6;border-radius:0 2px 2px 0;max-width:calc(50vw - 138px)}
.hud-top .role-seal .hud-icon{width:18px;height:18px;stroke-width:1.5}
.hud-top .role-seal strong{font:600 11px/1 Arial,sans-serif;letter-spacing:1px;text-transform:uppercase}
.hud-top .role-seal.is-traitor{border-color:#d09782;background:linear-gradient(90deg,#382623c9,#2c202775);color:#f1c1ac}
.role-seal.announced{animation:role-reveal 1.7s ease-out}@keyframes role-reveal{from{filter:brightness(1.8)}to{filter:brightness(1)}}
.hud-actions{top:21px;right:var(--hud-edge);gap:8px;border:0;padding:0}
.hud-actions button{height:33px;min-width:33px;justify-content:center;gap:7px;border:1px solid #b8c9d144;border-radius:3px;padding:6px 8px;background:#0916208c;color:#dfebed}
.hud-actions button:hover{background:#30434de6;border-color:#bcd3db99}
.hud-actions kbd{font:10px Arial,sans-serif;color:#aebdc4}
.objective{left:var(--hud-edge);top:65px;max-width:34vw}
.objective #deck-label{font:10px/1.35 Arial,sans-serif;color:#b0c1ca;letter-spacing:.2px;text-transform:uppercase;font-style:normal}
.escape-task{top:84px;max-width:80vw;width:max-content;margin:0;padding:8px 15px;background:linear-gradient(90deg,transparent,#07121ccd 15% 85%,transparent);color:#e6d8b9;font:600 12px/1.4 'Trebuchet MS',Arial,sans-serif;border:0}
.phase-banner{top:clamp(205px,30vh,265px);bottom:auto;width:min(430px,76vw);padding:14px 20px;background:linear-gradient(90deg,transparent,#091720b8 18% 82%,transparent)}
.phase-banner strong{font:400 18px/1.4 'Trebuchet MS',Arial,sans-serif;letter-spacing:0;color:#ede8dc}
.phase-banner small{font:600 10px/1.3 Arial,sans-serif;letter-spacing:1px;color:#c7b78d}
.phase-banner:after{display:none}
#traitor-hud{top:103px;left:var(--hud-edge);width:250px;max-width:40vw;padding:0 12px 10px 0;background:linear-gradient(90deg,#07121b8f,transparent);pointer-events:none}
.rescue-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;font:600 9px/1.2 Arial,sans-serif;letter-spacing:1px;color:#aebdc4;margin:0 0 8px}.rescue-heading b{color:#d8e6d2;font:600 11px Arial,sans-serif;letter-spacing:0}
#traitor-hud .rescue-progress{height:5px;border:0;border-radius:2px;background:#c3d1d033}
#traitor-hud .rescue-progress i{background:#b9ccae;border-radius:2px}
#traitor-hud .rescue-counts{margin-top:10px;gap:12px;justify-content:space-between}
#traitor-hud .rescue-counts>span{gap:5px;font:11px Arial,sans-serif;color:#b9c6cb;white-space:nowrap}
#traitor-hud .rescue-counts .hud-icon{width:21px;height:23px;color:#d6c49b}
#traitor-hud .rescue-counts b{font-weight:400}
#traitor-hud .rescue-counts .complete,#traitor-hud .rescue-counts .complete .hud-icon{color:#bad8ad}
#traitor-hud .role-allies{margin:0 0 8px;font:11px/1.4 Arial,sans-serif;color:#e2baaa}
#traitor-hud .carry-note{font:11px/1.4 Arial,sans-serif;margin:10px 0 0;color:#f0d89f}
#traitor-hud .carry-note:empty,#traitor-hud .traitor-strike:empty{display:none}
#traitor-hud .traitor-strike,#traitor-hud .report-wait{font:11px/1.4 Arial,sans-serif;margin:10px 0 0;color:#b6c5cb}
#traitor-hud .report-body{pointer-events:auto;margin-top:12px;border:1px solid #d8c6a366;border-radius:3px;padding:8px 10px;background:#152935ed;color:#efe1c6;font:12px Arial,sans-serif}
.survival-kit{left:var(--hud-edge)}
.equipment-icons{margin:12px 0 0 28px;min-height:48px}
#drink-item{position:relative;width:52px;height:48px;pointer-events:auto;display:block;padding:3px 5px;border:1px solid #9aadb457;border-radius:3px;background:linear-gradient(#263640a6,#08151dc9);box-shadow:0 2px 7px #0004}
#drink-item img{width:31px;height:40px;display:block;margin:auto;filter:drop-shadow(0 2px 3px #0008)}
#drink-item kbd{position:absolute;top:4px;left:4px;font:9px/1 Arial,sans-serif;color:#c8d2d2;border:0;padding:0}
#drink-item b{position:absolute;right:4px;bottom:3px;min-width:14px;padding:2px;background:#0a1725d9;color:#f0e6ce;font:600 11px/1 Arial,sans-serif;border-radius:2px}
#drink-item:hover:not(:disabled){border-color:#d9bc7c;background:#3d4544}
#drink-item:disabled{cursor:default;opacity:.36}
.navigation{bottom:273px}.navigation span{font-size:11px;letter-spacing:1.2px;color:#f0dfbc;text-shadow:0 1px 4px #000}
@media(max-width:900px){.game-lobby .lobby-footer a{display:none}.game-lobby .lobby-footer>div{gap:12px}}
@media(max-width:750px){#hud{--hud-edge:18px}.hud-top .role-seal{left:72px;top:24px;padding:6px 8px;max-width:calc(50vw - 119px);gap:5px}.hud-top .role-seal strong{font-size:10px;letter-spacing:.5px}.hud-top .role-seal .hud-icon{width:15px;height:15px}.hud-actions button{padding:6px;gap:4px}.clock-block strong{font-size:25px}#traitor-hud{width:230px;max-width:44vw}.rescue-counts{gap:8px}.phase-banner strong{font-size:16px}.game-lobby{gap:11px;padding-inline:4vw}.game-lobby .game-rules button{min-height:52px;padding:9px 12px;gap:10px}.game-lobby .game-rules .hud-icon{width:24px;height:26px}.game-lobby .lobby-footer{font-size:9px}.game-lobby .choice-name{font-size:12px}.navigation{bottom:270px}}
@media(max-height:600px){.game-lobby{padding-top:10px;gap:8px}.game-title h1{font-size:25px}.game-title h1 span{margin-top:4px}.game-lobby .character-lineup{min-height:85px}.game-lobby .choice-name{height:40px;font-size:11px}.game-lobby .game-rules button{min-height:42px;padding-block:7px}.game-lobby .game-rules .hud-icon{height:23px}.game-lobby #mode-description{font-size:11px;min-height:29px;margin-block:5px}.game-lobby .lobby-mode{margin-bottom:6px}.game-lobby .lobby-mode button{padding-block:4px}.game-lobby .primary{min-height:38px;padding-block:8px}.game-lobby .lobby-footer{font-size:9px}.navigation{display:none}.phase-banner{top:185px;bottom:auto;font-size:14px}}
@media(max-width:490px){.hud-top .role-seal{top:63px;left:var(--hud-edge);max-width:145px}.objective{top:100px;max-width:41vw}.escape-task{top:133px;font-size:11px}#traitor-hud{top:138px;max-width:55vw}.game-lobby .game-rules button{font-size:12px;gap:8px}.game-lobby .game-rules button i{display:none}.game-lobby .lobby-footer>div{gap:8px}.game-lobby .lobby-footer{gap:8px}.game-lobby .choice-name{font-size:10px}.game-lobby .character-choice:after{right:7px;top:7px;width:9px;height:9px}}
@media(prefers-reduced-motion:reduce){.role-seal.announced{animation:none}}

/* Lot 20: shared game chrome, from embarkation to the final result. */
:root{--ui-face:'Trebuchet MS','Segoe UI',Arial,sans-serif;--ui-gold:#d8bf8d;--ui-line:#9aadb447;--ui-text:#e2e9e9;--ui-muted:#9eafb9;--ui-panel:#101d27}
.modal{background:#030b14a8;backdrop-filter:blur(3px);padding:20px;overflow:auto}
.dialog,dialog{font-family:var(--ui-face);color:var(--ui-text);background:linear-gradient(145deg,#1b2b36f5,#0c1823fa);border:1px solid var(--ui-line);border-top:2px solid #bda67a;border-radius:4px;outline:0;box-shadow:0 26px 100px #0009;padding:32px;max-height:calc(100dvh - 40px);overflow:auto}
.dialog:before{display:none}.dialog h2,dialog h2{font:600 30px/1.15 var(--ui-face);letter-spacing:.2px;margin:12px 0 16px}.dialog>p:not(.eyebrow),dialog>p,.help-grid p{font:13px/1.6 var(--ui-face);color:#aebec7}.dialog .eyebrow,dialog .eyebrow{font:600 10px/1.4 var(--ui-face);color:var(--ui-gold);letter-spacing:1.7px}.help-grid b{font:600 12px/1.4 var(--ui-face);color:var(--ui-gold)}.help-note{border-color:var(--ui-line)}
.primary,.dialog .primary,dialog .primary{border:1px solid #ead6a9;outline:0;border-radius:3px;background:linear-gradient(#e6d6b3,#baa477);color:#182028;box-shadow:inset 0 1px #fff8,0 4px 12px #0005;font:600 13px/1.3 var(--ui-face);letter-spacing:1.2px;padding:13px 20px;min-height:46px}
.primary:hover:enabled,.dialog .primary:hover:enabled{background:linear-gradient(#f4e8cd,#d1ba8b);color:#101c25}.primary:active:enabled{transform:translateY(1px)}
.secondary,.dialog .secondary,.drop-carry{border:1px solid var(--ui-line);border-radius:3px;background:linear-gradient(#253640,#14242f);color:#cddadd;font:500 13px/1.3 var(--ui-face);padding:12px 16px;box-shadow:inset 0 1px #ffffff08}.secondary:hover:enabled,.drop-carry:hover:enabled{border-color:#bdad88;background:#30434c;color:#f3e9d5}
.dialog .text-button,dialog .text-button{font:12px/1.4 var(--ui-face);color:var(--ui-muted);text-decoration:none;padding:9px 14px;border-bottom:1px solid #94a9b12b;border-radius:2px}.dialog .text-button:hover{color:#f0e4c9;background:#7b949b13}dialog .close{color:#cddadd;border:1px solid var(--ui-line);border-radius:3px;background:#12232e;width:32px;height:32px;font:24px/1 Arial,sans-serif}
/* End-of-round title treatment: the sea and lifeboat remain visible. */
#results{background:linear-gradient(180deg,#020b12d6 0%,#03101967 46%,#020a12eb 100%);backdrop-filter:none;align-items:center}
#results .result-dialog{--result-accent:#e9d4a3;width:min(880px,94vw);max-height:calc(100dvh - 40px);padding:42px 55px 24px;border:0;border-radius:0;outline:0;background:none;box-shadow:none;overflow:auto;animation:result-arrive .7s ease-out both}
#results .result-dialog:before,#results .result-dialog:after{content:'';display:block;position:absolute;pointer-events:none;width:70px;height:35px;border-color:#c8af796b;border-style:solid}
#results .result-dialog:before{left:0;top:0;border-width:1px 0 0 1px;margin:0}
#results .result-dialog:after{right:0;bottom:0;border-width:0 1px 1px 0}
.result-emblem{display:grid;place-items:center;position:relative;width:58px;height:58px;margin:0 auto 16px;color:var(--result-accent);filter:drop-shadow(0 2px 6px #000)}
.result-emblem:before,.result-emblem:after{content:'';position:absolute;top:27px;width:100px;height:5px;border-block:1px solid #d7bd7f73;transform:scaleX(1);animation:result-rule .9s ease-out both}
.result-emblem:before{right:78px;transform-origin:right}.result-emblem:after{left:78px;transform-origin:left}
.result-emblem svg{width:48px;height:48px;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round}
#results .result-dialog .eyebrow{font:500 11px/1.6 var(--ui-face);letter-spacing:3px;color:var(--result-accent);margin:0 0 14px;text-shadow:0 2px 7px #000}
#results .result-dialog h2{font:400 clamp(40px,6.8vw,84px)/1.06 var(--serif);letter-spacing:3px;text-transform:uppercase;color:#f0e5cc;margin:12px 0 20px;text-shadow:0 2px 0 #533e2160,0 5px 25px #000}
#results .result-dialog>p:not(.eyebrow){max-width:520px;margin:0 auto;color:#c8d2d2;font:14px/1.7 var(--ui-face);text-shadow:0 2px 6px #000}
#results .result-stats{max-width:510px;margin:50px auto 25px;padding:18px 0;border-block:1px solid #c6ac7552;gap:12px}
#results .result-stats>div{flex:1}#results .result-stats>div+div{border-left:1px solid #c6ac7526}
#results .result-stats strong{font:400 30px/1 var(--serif);font-variant-numeric:tabular-nums;color:#f0e5cc;letter-spacing:.5px}
#results .result-stats span{font:10px/1.4 var(--ui-face);letter-spacing:1.6px;color:#afbebf;margin-top:9px}
#results .primary,#results .secondary{display:block;width:min(330px,100%);margin:12px auto;letter-spacing:1.4px}
#results .text-button{margin-top:4px}#results button:focus-visible{outline:2px solid #f3deb2;outline-offset:4px}
#results[data-outcome=defeat] .result-dialog,#results[data-outcome=death] .result-dialog{--result-accent:#b5b9b8}
#results[data-outcome=defeat] h2,#results[data-outcome=death] h2{color:#d7dcdc}
.interact-prompt.informational{color:#c6c9c3}.interact-prompt kbd[hidden]{display:none}
@keyframes result-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes result-rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-height:650px){#results .result-dialog{padding:20px 28px 12px}.result-emblem{width:38px;height:38px;margin-bottom:8px}.result-emblem svg{width:34px;height:34px}.result-emblem:before,.result-emblem:after{top:18px}#results .result-dialog h2{font-size:44px;margin:10px 0 14px}#results .result-stats{margin:20px auto 14px;padding:12px 0}#results .primary,#results .secondary{margin-block:8px}}
@media(max-width:600px){#results .result-dialog{padding-inline:15px}#results .result-dialog h2{letter-spacing:1px}.result-emblem:before,.result-emblem:after{width:65px}#results .result-dialog .eyebrow{letter-spacing:1.5px;font-size:10px}#results .result-stats span{font-size:8px;letter-spacing:.8px}}
@media(prefers-reduced-motion:reduce){#results .result-dialog,.result-emblem:before,.result-emblem:after{animation:none}}
#meeting .vote-person{grid-template-columns:27px minmax(0,1fr) 22px;column-gap:5px;border-radius:3px}#meeting .vote-person>span,#meeting .vote-person>small{grid-column:2}#meeting .vote-tally{grid-column:3;grid-row:1/3;align-self:center;text-align:center;padding:4px 0;font:600 13px/1 Arial,sans-serif;font-variant-numeric:tabular-nums;color:#7c939e;border-left:1px solid #a8bac11f}#meeting .vote-tally.has-votes{color:#ecd499}#meeting .vote-skip{border-radius:3px}
#traitor-hud .carry-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:12px}#traitor-hud .carry-note{margin:0;flex:1;min-width:110px}#traitor-hud .drop-carry{pointer-events:auto;padding:6px 8px;font-size:11px;white-space:nowrap}#traitor-hud .drop-carry kbd{font:10px Arial,sans-serif;margin-right:5px;color:#e5d2a6}
@media(max-height:600px){.dialog,dialog{padding:22px}.result-emblem{width:48px;height:48px;margin-bottom:12px}.result-emblem svg{width:26px;height:26px}.result-dialog h2{font-size:32px}.result-stats{margin:16px 0;padding:12px 0}.result-stats strong{font-size:23px}}

.toast{font:13px/1.5 var(--ui-face);color:#eee2c5;background:#142530f5;border:1px solid #a8b8c148;border-left:2px solid var(--ui-gold);border-radius:3px;padding:11px 20px}.intro #skip-intro{font:12px/1.2 var(--ui-face);padding:10px 12px;border:1px solid var(--ui-line);border-radius:3px;background:#172731bd;color:#dbe4e4}.intro #skip-intro:hover{background:#34444d;border-color:#c1ae84}#deduction-caption{font:500 clamp(16px,2vw,23px)/1.6 var(--ui-face);color:#e9e6dc;letter-spacing:.1px}

/* Explicit grid rows prevent the self badge flowing into a third row. */
#meeting .vote-person{grid-template-rows:minmax(14px,auto) minmax(12px,auto);row-gap:1px}
#meeting .vote-person>span{grid-column:2;grid-row:1;align-self:center;line-height:1.2}
#meeting .vote-person>small{grid-column:2;grid-row:2;align-self:center;line-height:1.2;min-height:0;margin:0}
#meeting .vote-person img{grid-column:1;grid-row:1/3}

.game-lobby .choice-name{font-size:clamp(11px,1.12vw,16px);padding-inline:3px}
@media(max-width:760px){.game-lobby .character-lineup,.game-lobby.online .character-lineup{grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}.game-lobby .choice-name{font-size:10px}.game-lobby .character-choice:after{right:5px;top:7px;width:8px;height:8px}}

/* A single, legible role reveal; gameplay and the 50-second search continue. */
.role-announcement{position:absolute;z-index:8;left:50%;top:50%;transform:translate(-50%,-50%);width:min(570px,calc(100vw - 40px));padding:28px 24px 30px;text-align:center;pointer-events:none;color:#f5e9cb;--role-accent:#b7d3c4;background:linear-gradient(90deg,#07131be8,#0e2028f5 20% 80%,#07131be8);border-block:1px solid #c0b08a88;box-shadow:0 14px 60px #0006;text-shadow:0 2px 8px #000;animation:role-arrive .3s ease-out}
.role-announcement[data-role="traitor"]{--role-accent:#e0a78e;background:linear-gradient(90deg,#190e13e8,#291b22f5 20% 80%,#190e13e8)}
.role-announcement-mark{display:flex;justify-content:center;align-items:center;gap:20px;margin-bottom:15px;color:var(--role-accent)}
.role-announcement-mark:before,.role-announcement-mark:after{content:"";height:1px;width:72px;background:currentColor;opacity:.55}
.role-announcement-mark svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.role-announcement .role-announcement-kicker{margin:0 0 8px;font:500 13px/1.4 var(--ui-face);letter-spacing:.26em;color:var(--role-accent)}
.role-announcement h2{margin:0;font:400 clamp(40px,6vw,72px)/1.12 var(--serif);letter-spacing:.055em;color:#fff0cf}
.role-announcement .role-announcement-task{margin:21px 0 5px;font:500 clamp(14px,1.65vw,18px)/1.45 var(--ui-face);color:#f3ead7}
.role-announcement .role-announcement-goal{margin:0;font:400 clamp(12px,1.4vw,15px)/1.5 var(--ui-face);color:#c3bcb0}
.role-announcement.leaving{opacity:0;transition:opacity .6s linear}
@keyframes role-arrive{from{opacity:0}to{opacity:1}}
@media(max-height:600px){.role-announcement{padding:18px 20px}.role-announcement-mark{margin-bottom:9px}.role-announcement-mark svg{width:28px;height:28px}.role-announcement h2{font-size:44px}.role-announcement .role-announcement-task{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.role-announcement{animation:none}.role-announcement.leaving{transition:none}}

/* Last ten seconds: keep the words legible throughout a restrained red pulse. */
.escape-task.urgent{font-size:16px;letter-spacing:.02em;color:#ff6268;border-bottom:2px solid #ff4954;text-shadow:0 1px 3px #000,0 0 12px #c82032a0;animation:escape-alarm .85s ease-in-out infinite;font-weight:800}
@keyframes escape-alarm{0%,100%{opacity:1}50%{opacity:.48}}
@media(prefers-reduced-motion:reduce){.escape-task.urgent{animation:none}}

/* An empty BR ending is deliberately one short line, with navigation intact. */
#results[data-outcome=empty]{background:linear-gradient(#020a12e8,#06131bba,#020a12ed)}
#results[data-outcome=empty] .result-emblem,#results[data-outcome=empty] .eyebrow,#results[data-outcome=empty] #result-description,#results[data-outcome=empty] .result-stats,#results[data-outcome=empty] .result-dialog:before,#results[data-outcome=empty] .result-dialog:after{display:none}
#results[data-outcome=empty] .result-dialog{padding:28px 20px;width:min(650px,100%);min-width:0}
#results[data-outcome=empty] .result-dialog h2{font-size:clamp(32px,5.5vw,60px);text-transform:none;letter-spacing:.025em;margin:0 0 42px;color:#ede7d9}