/* Portraits complement the transcript; all animation is cosmetic and never delays a turn. */
#app{grid-template-rows:48px minmax(0,1fr)}main{min-height:0;overflow:clip}#record{min-height:0}
.portrait-toolbar{display:flex;align-items:center;gap:8px;padding:7px 14px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted);flex-shrink:0}.portrait-toolbar>span{flex:1}.portrait-toolbar button{font-size:11px;padding:4px 8px}.portrait-toolbar label{display:flex;align-items:center;gap:4px;white-space:nowrap}
#portrait-focus{display:flex;align-items:center;gap:14px;height:112px;flex-shrink:0;padding:8px 18px;border-bottom:1px solid var(--line);position:relative;overflow:hidden;background:linear-gradient(115deg,#293c36,#151e24 75%)}
#portrait-focus[data-environment=night]{background:radial-gradient(ellipse at 20% 0,#30475c,#141c29 70%)}#portrait-focus[data-environment=epilogue]{background:repeating-linear-gradient(90deg,transparent 0 80px,#83eed808 80px 82px),linear-gradient(100deg,#1a4445,#142528)}
#portrait-focus:before{content:"";position:absolute;inset:-30px;pointer-events:none;background:radial-gradient(circle at 16% 36%,#f6c87570 0 1px,transparent 2px),radial-gradient(circle at 43% 80%,#72dcca66 0 1px,transparent 2px),radial-gradient(circle at 75% 34%,#f6c87555 0 1px,transparent 2px);background-size:160px 130px;animation:portrait-dust 18s linear infinite;opacity:.45}
#portrait-focus[hidden]{display:none}.focus-art{height:96px;width:104px;flex-shrink:0;border:0;background:transparent;padding:0;position:relative}.portrait-canvas{width:100%;height:100%;object-fit:contain;display:block;transform-origin:50% 90%}.portrait-copy{min-width:0;position:relative;flex:1}.portrait-copy strong{font-size:15px;color:var(--accent2)}.portrait-copy p{margin:5px 0;color:var(--text);font-size:12px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.portrait-copy small{font-size:10px;color:var(--muted)}.portrait-badge{font-size:10px;color:var(--accent);border:1px solid #4fd1c533;border-radius:20px;padding:3px 7px;white-space:nowrap;position:relative}
.portrait-seat{width:100%;display:flex;align-items:center;gap:8px;padding:3px 7px;text-align:left;border:1px solid transparent;border-radius:8px;background:transparent;min-height:66px}.portrait-seat .seat-art{width:58px;height:58px;flex-shrink:0;background:radial-gradient(ellipse at center,#54756920,transparent);border-radius:8px}.portrait-seat .seat-info{min-width:0;flex:1}.portrait-seat strong{font:600 12px var(--mono);display:block;overflow:hidden;text-overflow:ellipsis}.portrait-seat small{font-size:10px;display:block;line-height:1.5;color:var(--muted)}.portrait-seat.you{border-color:#63b3ed45}.portrait-seat.active{background:#4fd1c50c;border-color:var(--accent)}.portrait-seat.active strong{color:var(--accent)}.portrait-seat.dead strong{color:#9ac9c4}.portrait-seat .seat-activity{font-size:9px;color:var(--accent2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.portrait-seat.ghost canvas,.focus-art.ghost canvas{opacity:.68;filter:drop-shadow(0 0 3px #58ddcb30)}
#portrait-dialog{width:min(860px,94vw);max-height:86vh;padding:0;border:1px solid #52736a;border-radius:14px;color:var(--text);background:var(--panel);box-shadow:0 20px 100px #0008}#portrait-dialog::backdrop{background:#07120dd9}.portrait-dialog-head{display:flex;align-items:center;gap:15px;padding:16px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel);z-index:2}.portrait-dialog-head h2{font-size:16px;flex:1;margin:0}.portrait-dialog-content{padding:18px 20px}.portrait-dialog-content>p{color:var(--muted);font-size:12px;line-height:1.5}.portrait-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}.portrait-role{display:flex;align-items:start;gap:8px;padding:10px;border:1px solid var(--line);border-radius:9px;background:var(--panel2)}.portrait-role canvas{width:62px;height:74px;flex-shrink:0}.portrait-role strong{font-size:12px;color:var(--accent2)}.portrait-role small{display:block;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:3px 0}.portrait-role p{font-size:11px;line-height:1.5;margin:4px 0}.portrait-detail{display:flex;gap:24px;align-items:center}.portrait-detail canvas{width:160px;height:180px;flex-shrink:0}.portrait-detail p{font-size:12px;line-height:1.6}.portrait-detail label{display:block;font-size:12px;color:var(--muted);margin:12px 0}.portrait-detail select{display:block;width:100%;margin-top:7px}.portrait-setup{width:58px;height:68px;flex-shrink:0}.character{align-items:center}
.portraits-still canvas,.portraits-still #portrait-focus:before{animation:none!important}.portraits-compact .portrait-seat{min-height:38px}.portraits-compact .seat-art{width:32px;height:32px}.portraits-compact .portrait-seat small{font-size:9px}
@keyframes portrait-talk{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-2px) rotate(.5deg)}}@keyframes portrait-dust{to{transform:translateY(-30px)}}
@media(prefers-reduced-motion:reduce){.portrait-canvas,#portrait-focus:before{animation:none!important}}
@media(max-width:1150px){#app.debug{grid-template-columns:230px minmax(250px,1fr) 300px}#app{grid-template-columns:230px minmax(0,1fr) 0}}
@media(max-width:760px){#debug{display:none!important}header{gap:7px}header h1{font-size:11px;letter-spacing:.05em}header .status{font-size:9px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}aside{padding:7px}.portrait-seat{padding:3px;gap:4px;min-height:48px}.portrait-seat .seat-art{width:36px;height:42px}.portrait-seat strong{font-size:10px}.portrait-seat small{font-size:9px}.portrait-seat .seat-activity{font-size:8px}.portrait-toolbar{padding:6px;flex-wrap:wrap;gap:5px}.portrait-toolbar>span{display:none}.portrait-toolbar label{font-size:9px}#portrait-focus{height:100px;padding:5px 8px;gap:6px}.focus-art{width:56px;height:76px}.portrait-copy strong{font-size:12px}.portrait-copy p{font-size:11px}.portrait-copy small{font-size:9px}.portrait-badge{display:none}#record{padding:9px}.ev.speech{display:block;padding:5px 0}.ev.speech .who{display:block;font-size:11px}.ev.speech .msg{font-size:12px}#action{padding:8px}.portrait-detail{gap:12px}.portrait-detail canvas{width:95px;height:120px}.portrait-gallery{grid-template-columns:1fr}.card{padding:7px;font-size:11px}}

#app.ingame:not(.debug) #debug{display:none}.ev.defense{display:flex;gap:10px;padding:6px 8px}.ev.defense .who{font-family:var(--mono);font-weight:700;min-width:96px}.ev.defense .msg{white-space:pre-wrap}@media(max-width:760px){.ev.defense{display:block}.ev.defense .who{display:block;min-width:0;font-size:11px}.ev.defense .msg{font-size:12px}}

@media(min-width:761px) and (max-width:1000px){#app.debug{grid-template-columns:230px minmax(0,1fr) 0}#app.ingame.debug #debug{display:none}}
/* Alignment colors: Hunters / Glitched / Sympathizers / Human. */
[data-alignment=hunter]{--alignment:#4cbb65}[data-alignment=glitched]{--alignment:#e6c74c}[data-alignment=sympathizer]{--alignment:#ef923e}[data-alignment=human]{--alignment:#df4b50}
[data-alignment] .portrait-canvas{filter:drop-shadow(1px 0 0 var(--alignment,transparent)) drop-shadow(-1px 0 0 var(--alignment,transparent)) drop-shadow(0 1px 0 var(--alignment,transparent)) drop-shadow(0 -1px 0 var(--alignment,transparent))}
.portrait-seat[data-alignment]{border-color:var(--alignment,transparent)}
/* Bottom dialogue panel, with the speaker standing above its left edge. */
#robot-dialogue{position:fixed;z-index:100;pointer-events:none;inset:auto 0 max(24px,env(safe-area-inset-bottom));margin:0 auto;width:min(1100px,94vw);max-width:none;max-height:none;padding:0;overflow:visible;box-sizing:border-box;border:0;background:transparent;color:var(--text)}
#robot-dialogue[open]{display:block}
#robot-dialogue.is-whisper .dialogue-line{font-style:italic}
.dialogue-art{position:absolute;left:12px;bottom:calc(100% - 12px);width:clamp(180px,24vw,280px);height:clamp(180px,24vw,280px);pointer-events:none}
.dialogue-art canvas{animation:portrait-talk .8s ease-in-out infinite}
.dialogue-copy{pointer-events:auto;position:relative;min-height:180px;padding:26px 32px 16px;box-sizing:border-box;border:2px solid var(--alignment,var(--accent));border-radius:12px;background:linear-gradient(135deg,#1c2b30,#111a21);box-shadow:0 10px 40px #0008,inset 0 0 0 4px #ffffff06}
.dialogue-nameplate{position:absolute;bottom:calc(100% - 2px);left:clamp(190px,25vw,290px);max-width:calc(100% - clamp(190px,25vw,290px) - 12px);padding:8px 20px;border:2px solid var(--alignment,var(--accent));border-radius:9px 9px 0 0;background:#1c2b30;box-shadow:0 -4px 18px #0003}
.dialogue-nameplate h2{margin:0;color:var(--alignment);font-size:20px;overflow-wrap:anywhere}
.dialogue-role{display:block;margin-top:3px;color:var(--muted);font-size:11px}
.dialogue-line{font-size:clamp(18px,2vw,24px);line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 18px;max-height:32dvh;overflow-y:auto}
.dialogue-copy button{display:block;margin-left:auto;padding:4px 0;border:0;background:transparent;font-size:11px;color:var(--muted)}
.dialogue-copy button::after{content:" ▾";color:var(--alignment);margin-left:8px}
@media(max-width:600px){#robot-dialogue{width:calc(100vw - 24px);bottom:max(12px,env(safe-area-inset-bottom))}.dialogue-art{left:0;width:160px;height:160px}.dialogue-copy{padding:20px 18px 12px;min-height:160px}.dialogue-nameplate{left:150px;max-width:calc(100% - 160px);padding:7px 12px}.dialogue-nameplate h2{font-size:16px}.dialogue-role{font-size:10px}.dialogue-line{font-size:18px;max-height:34dvh}.dialogue-copy button{font-size:10px}}
@media(max-height:500px){#robot-dialogue{bottom:10px}.dialogue-art{width:130px;height:130px}.dialogue-nameplate{left:140px;max-width:calc(100% - 150px)}.dialogue-copy{min-height:0;padding:16px 22px 10px}.dialogue-line{font-size:18px;max-height:30dvh;margin-bottom:8px}}

/* Repeated alpha outlines would turn the faded disguise into an opaque silhouette. */
[data-alignment] .portrait-canvas[data-claim-shadow="true"]{filter:none}
.claim-controls small{color:var(--muted)}

/* Keep the known identity explicit while the public claim stays in front. */

/* Full-width alignment bands keep category boundaries clear at every grid width. */
.role-alignment-group + .role-alignment-group{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.role-alignment-title{margin:0 0 10px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
#characters>.role-alignment-group:first-child{margin-top:14px}
.script-section{display:block}.script-section.role-alignment-group{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}

/* Layered speaking portraits animate their claim and shadow together in canvas. */
.dialogue-art canvas[data-claim-shadow="true"]{animation:none}

/* Paired dialogue keeps the speaker left and the listener or suspect right. */
.dialogue-accused{left:auto;right:12px;transform:scaleX(-1)}
.dialogue-accused[hidden]{display:none}
.dialogue-accused[data-alignment=unknown]{--alignment:transparent}
.dialogue-accused canvas{animation:none}
.dialogue-accusation:empty{display:none}
.dialogue-accusation{display:block;margin-top:6px;color:var(--accent2);font-size:12px}
.is-paired .dialogue-nameplate{position:static;max-width:none;padding:0 0 12px;margin-bottom:12px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;box-shadow:none}
@media(max-width:600px){.is-paired .dialogue-art{width:min(160px,44vw);height:min(160px,44vw)}.dialogue-accused{left:auto;right:0}}
@media(max-height:500px){.is-paired .dialogue-art{width:110px;height:110px}.is-paired .dialogue-nameplate{padding-bottom:6px;margin-bottom:6px}}

/* Interactive transcript references. */
.text-reference,.dialogue-copy .text-reference{display:inline;margin:0;padding:0;border:0;border-radius:2px;background:none;font:inherit;font-weight:400;text-transform:none;letter-spacing:normal;line-height:inherit;cursor:pointer;white-space:normal;text-align:inherit;vertical-align:baseline}
.text-reference.reference-name{color:var(--name-color);text-decoration:underline;text-underline-offset:.15em;font-style:normal}
.text-reference.reference-role{color:var(--alignment);font-style:italic}
.dialogue-copy .text-reference::after{content:none}
.text-reference:hover{background:#ffffff12}.text-reference:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.reference-preview{position:fixed;inset:auto;margin:0;padding:10px;width:max-content;max-width:min(340px,calc(100vw - 16px));box-sizing:border-box;border:1px solid #52736a;border-radius:16px;background:var(--panel,#162126);color:var(--text,#e3eded);box-shadow:0 8px 30px #0008;pointer-events:none;z-index:200}
.reference-preview[hidden]{display:none}.reference-preview .portrait-role{border:0;padding:0;background:none}
.reference-seat{display:flex;align-items:center;gap:10px}.reference-seat canvas{width:64px;height:74px;flex-shrink:0}.reference-seat strong{font:700 13px var(--mono)}.reference-seat small{display:block;font-size:11px;line-height:1.5;color:var(--muted)}
.portrait-role.reference-target{outline:2px solid var(--alignment);outline-offset:3px;scroll-margin:80px 0 16px}

/* Shared activity treatment: no motion when the player requests reduced motion. */
.processing-status { display:flex; align-items:center; flex-wrap:wrap; gap:8px; min-height:28px; }
.processing-dots { display:inline-flex; align-items:center; gap:3px; margin-right:5px; vertical-align:middle; }
.processing-dots i { width:4px; height:4px; background:var(--accent2); border-radius:50%; animation:processing-pulse 1.2s ease-in-out infinite; }
.processing-dots i:nth-child(2) { animation-delay:.15s; }
.processing-dots i:nth-child(3) { animation-delay:.3s; }
.processing-roster { display:flex; flex-wrap:wrap; gap:6px; }
.processing-chip { border:1px solid var(--accent2); border-radius:12px; padding:2px 8px; font-family:var(--mono); font-size:11px; }
.robot-progress { display:block; color:var(--muted); font-family:var(--mono); font-size:10px; line-height:1.5; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.robot-progress[hidden] { display:none; }
.dialogue-usage { margin:8px 0; font-size:11px; }
.is-processing:not(:has(.processing-dots))::after { content:' ◌'; display:inline-block; animation:processing-spin 1.3s linear infinite; }
@keyframes processing-pulse { 0%,80%,100% { opacity:.3; transform:translateY(0); } 40% { opacity:1; transform:translateY(-3px); } }
@keyframes processing-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .processing-dots i, .is-processing::after { animation:none !important; } }

.portraits-still .processing-dots i, .portraits-still .is-processing::after { animation:none !important; }

/* Mo is an oracle outside the player roster. */
.ev.mo_answer { border-left: 3px solid #83cbbb; background: #1d353644; padding: 12px; }
.ev.mo_answer .who, #robot-dialogue.is-mo h2 { color: #a2e1cc !important; }
.mo-consult { margin-top: 14px; border: 1px solid #577c75; border-radius: 8px; padding: 10px 14px; }
.mo-consult summary { cursor: pointer; color: #a2e1cc; }
.mo-consult p { max-width: 72ch; line-height: 1.5; }
.mo-consult textarea { min-height: 65px; margin-top: 8px; }
#robot-dialogue.is-mo .dialogue-nameplate { border-color: #83cbbb; }

/* Daily speaking order stays in physical seat order, including bodyless players. */
.table-round-order{font-size:10px;line-height:1.5;color:var(--muted);margin:0 0 10px}
.portrait-seat.round-first{border-top:2px solid var(--accent);border-top-left-radius:0;border-top-right-radius:0;margin-top:6px}
.portrait-seat.round-last{border-bottom:2px solid var(--accent);border-bottom-left-radius:0;border-bottom-right-radius:0;margin-bottom:6px}
.portrait-seat.current-speaker{background:#4fd1c518;box-shadow:inset 3px 0 var(--accent)}
.portrait-seat.current-speaker .seat-activity{white-space:normal;color:var(--accent);font-weight:600}

.ev.mo_answer .who { display: block; font-weight: 700; margin-bottom: 5px; font-family: var(--mono); }
.ev.mo_answer .msg { white-space: pre-wrap; }

/* Persistent public decisions and dead-vote availability. */
.portrait-seat{position:relative}
.seat-status{position:absolute;right:6px;bottom:4px;display:flex;align-items:center;gap:3px;color:var(--accent);pointer-events:auto}
.seat-status[hidden]{display:none}
.seat-status svg{width:18px;height:18px;display:block;overflow:visible}
.seat-ready{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.seat-skull{color:var(--muted)}
.skull-shape{fill:currentColor;stroke:none}
.skull-features{fill:none;stroke:var(--panel);stroke-width:2;stroke-linecap:round}
.has-dead-vote .seat-skull{color:var(--accent2)}
.has-dead-vote .skull-shape{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.has-dead-vote .skull-features{stroke:currentColor}

/* Telemetry overlays the top-right corner; do not reserve padding or height for it. */
.portrait-seat{flex-shrink:0;box-sizing:border-box}
.portrait-seat .robot-progress{position:absolute;right:7px;top:3px;height:20px;margin:0;font-size:8px;line-height:10px;text-align:right;white-space:pre;overflow:hidden}
.portrait-seat .robot-progress.is-processing::after{content:none;animation:none}

/* Transcript: speaker headers and quiet, explicitly labeled system activity. */
#record .record-dialogue{display:grid;grid-template-columns:1fr;gap:4px;margin:7px 0;padding:10px 12px;border:1px solid #ffffff0b;border-radius:8px;background:#ffffff04}
#record .record-dialogue .who{display:flex;align-items:center;gap:8px;min-width:0;width:fit-content;margin:0;padding:0;border:0;background:none;font:700 11px var(--mono);letter-spacing:.04em;text-align:left}
/* A prompted reply threads under the line that asked for it. */
#record .record-thread{display:grid;gap:2px;margin:6px 0 0 15px;padding-left:23px;border-left:2px solid #ffffff14}
#record .record-dialogue.record-reply{margin:0;padding:8px 0 4px;border:0;background:none}
#record .prompt-mention,.dialogue-line .prompt-mention{font:700 12px var(--mono);letter-spacing:.05em;cursor:default}
.dialogue-line .prompt-mention{font-size:inherit;line-height:inherit}
#record .record-reply-pass{padding:4px 0 2px;font-size:11.5px;font-style:italic;color:var(--muted)}
.stage-passes{padding-left:8px;border-left:1px solid #ffffff1a;font-size:11px;color:#7d8994}
.record-portrait{display:block;width:32px;height:32px;flex:none;object-fit:contain;background:#ffffff06;border-radius:6px}
#record .record-dialogue .msg{display:block;padding-left:40px;font-size:13px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
#record .record-system{display:flex;align-items:baseline;gap:10px;margin:5px 0;padding:7px 12px;border:0;border-left:2px solid #62747a55;border-radius:0;background:#0b121655;font-size:11px;font-weight:400;font-style:normal;line-height:1.6;letter-spacing:normal;text-transform:none;color:var(--muted)}
.record-event-label{flex:none;width:44px;font:500 9px var(--mono);letter-spacing:.05em;color:#9aafb5}
.record-event-text{min-width:0;overflow-wrap:anywhere}
#record .record-system.phase,#record .record-system.game_over{margin-top:16px;border-left-color:var(--accent);color:var(--accent)}
#record .record-system.execution,#record .record-system.death,#record .record-system.kill_switch{border-left-color:var(--danger);color:var(--danger)}
#record .record-dialogue.mo_answer{border-left:2px solid #83cbbb}
@media(max-width:760px){#record .record-thread{margin-left:6px;padding-left:12px}#record .record-dialogue{padding:8px}#record .record-dialogue .msg{padding-left:0;font-size:12px}#record .record-system{padding:6px 8px;gap:6px}.record-event-label{width:40px;font-size:8px}}

/* Compact distribution and reference controls. */
.portrait-toolbar #portrait-script{display:inline-flex;align-items:center;justify-content:center;width:32px;height:30px;padding:0;flex:none}
#portrait-script svg{display:block}
.distribution-summary{position:relative;flex:none}
#gameDistributionSummary{font-variant-numeric:tabular-nums;letter-spacing:.05em;min-height:30px}
.distribution-tooltip{display:none;position:absolute;right:0;top:100%;z-index:30;width:270px;max-width:calc(100vw - 32px);box-sizing:border-box;margin:0;padding:12px;background:var(--panel,#152027);color:var(--text);box-shadow:0 8px 24px #0008;font-size:12px;font-weight:normal;letter-spacing:normal}
.distribution-summary:not(.tooltip-dismissed):hover .distribution-tooltip,.distribution-summary:not(.tooltip-dismissed):focus-within .distribution-tooltip{display:block}
.portrait-settings{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.portrait-settings label{display:flex;align-items:center;gap:6px}
@media(max-width:760px){.distribution-tooltip{left:0;right:auto;max-width:calc(100vw - 174px)}}

/* Character inspector uses the same role links and cards as the record. */
.portrait-detail{align-items:flex-start;gap:24px}.detail-copy{flex:1;min-width:0}.detail-seat{display:block;color:var(--muted);font-size:11px;letter-spacing:.05em;margin-bottom:10px}
.detail-status{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}.detail-badge{padding:4px 8px;border:1px solid var(--line);border-radius:20px;background:var(--panel2);font-size:10px;color:var(--accent2)}
.detail-identity,.detail-ability-section{padding:14px 16px;border:1px solid var(--line);border-radius:9px;background:var(--panel2);margin-bottom:12px}.detail-identity p{margin:0}.detail-identity p+p{margin-top:10px}.detail-label{color:var(--muted)}.detail-qualifier{display:block;color:var(--muted);font-size:11px}.detail-unknown{color:var(--muted)}
.detail-ability-heading{margin:0 0 8px;font-size:11px;letter-spacing:.05em;color:var(--accent2)}.detail-ability-section p{margin:0;overflow-wrap:anywhere}.detail-reference-hint{display:block;font-size:10px;color:var(--muted);line-height:1.6}.portrait-detail label{padding-top:14px;border-top:1px solid var(--line)}.portrait-detail label[hidden]{display:none}.portrait-detail select{box-sizing:border-box;min-width:0}.detail-back{margin-bottom:14px}
@media(max-width:600px){.portrait-detail{flex-direction:column;gap:12px}.portrait-detail>canvas{align-self:center;width:130px;height:140px}.detail-copy{width:100%}.portrait-dialog-content{padding:14px}.detail-identity,.detail-ability-section{padding:12px}}

.portrait-dialog-head .detail-back{margin:0;font-size:11px;flex-shrink:0}
@media(max-width:600px){.portrait-dialog-head{flex-wrap:wrap;gap:8px;padding:12px}.portrait-dialog-head h2{flex-basis:100%}}

.distribution-tooltip > strong{display:block;margin-bottom:8px}
.distribution-tooltip .distribution-counts{display:flex;flex-wrap:wrap;gap:6px 12px;margin-bottom:8px}

/* Phones: one column. Seats become a swipeable strip above the transcript, and
   identity, private information and notes open as a drawer from the header. */
#btnInfo{display:none}
@media(max-width:760px){
  #app,#app.debug{grid-template-columns:minmax(0,1fr);grid-template-rows:48px auto minmax(0,1fr)}
  header{grid-column:1/-1;padding:0 10px}
  header h1{white-space:nowrap}
  header .status{min-width:0;flex:1}
  header .spacer{display:none}
  .portrait-toolbar{padding:4px 8px}
  #app.ingame #btnInfo{display:inline-block}
  header button{padding:6px 10px}
  aside#left{grid-row:2;border-right:0;border-bottom:1px solid var(--line);padding:6px 8px;overflow:hidden}
  #left>h3,#table-round-order{display:none}
  main{grid-row:3}
  #seats{display:flex;gap:4px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none}
  #seats::-webkit-scrollbar{display:none}
  #seats .portrait-seat{flex:0 0 66px;width:66px;flex-direction:column;justify-content:flex-start;gap:1px;padding:3px 2px 4px;min-height:0;text-align:center;scroll-snap-align:start}
  #seats .portrait-seat .seat-art{width:40px;height:40px}
  #seats .portrait-seat .seat-info{width:100%}
  #seats .portrait-seat small,#seats .portrait-seat .robot-progress{display:none}
  #seats .portrait-seat strong{font-size:10px}
  #seats .portrait-seat .seat-activity,#seats .portrait-seat.current-speaker .seat-activity{font-size:8px;white-space:nowrap}
  #seats .portrait-seat.current-speaker{box-shadow:inset 0 -3px var(--accent)}
  #seats .portrait-seat.round-first{margin:0 0 0 2px;border-top-width:1px;border-left:2px solid var(--accent);border-radius:0 8px 8px 0}
  #seats .portrait-seat.round-last{margin:0 2px 0 0;border-bottom-width:1px;border-right:2px solid var(--accent);border-radius:8px 0 0 8px}
  #seats .seat-status{top:3px;right:3px;bottom:auto}
  #seats .seat-status svg{width:14px;height:14px}
  #app.info-open aside#left{position:fixed;top:48px;left:0;right:0;bottom:0;z-index:45;overflow-y:auto;padding:10px 12px calc(16px + env(safe-area-inset-bottom));box-shadow:0 20px 40px #000a}
  #app.info-open #left>h3,#app.info-open #table-round-order{display:block}
  #portrait-focus{display:none}
  #action{max-height:48dvh;overflow-y:auto;overscroll-behavior:contain;padding-bottom:max(8px,env(safe-area-inset-bottom))}
  #action textarea{min-height:60px}
  /* 16px form text stops iOS Safari zooming the page on focus. */
  select,textarea,input:not([type=checkbox]):not([type=radio]):not([type=range]){font-size:16px}
}
/* Landscape phones: reclaim height for the transcript and the action panel. */
@media(max-height:500px){
  #app,#app.debug{grid-template-rows:40px minmax(0,1fr)}
  #portrait-focus{display:none}
  .portrait-toolbar{padding:3px 10px}
  #record{padding:8px 14px}
  #action{max-height:50dvh;overflow-y:auto;overscroll-behavior:contain;padding:8px 14px}
  .portrait-seat{min-height:44px}.portrait-seat .seat-art{width:38px;height:38px}
}
@media(max-height:500px) and (max-width:760px){
  #app,#app.debug{grid-template-rows:40px auto minmax(0,1fr)}
  #app.info-open aside#left{top:40px}
}

/* Role reference: an eye on every script card opens the full-resolution portrait, rules and a worked example. */
.portrait-role{position:relative}.portrait-role>div{padding-right:20px}
.role-info-button{position:absolute;top:5px;right:5px;z-index:2;display:grid;place-items:center;width:24px;height:24px;padding:0;border:1px solid #ffffff1c;border-radius:50%;background:#0b0d10d9;color:var(--muted);opacity:0;transform:scale(.8);transition:opacity .15s,transform .15s,color .15s,border-color .15s;cursor:pointer}
.role-info-button svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
:is(.character,.portrait-role):is(:hover,:focus-within) .role-info-button{opacity:1;transform:none}
.role-info-button:hover,.role-info-button:focus-visible{color:var(--text);border-color:var(--alignment,var(--accent))}
.role-info-button:focus-visible{outline:2px solid var(--alignment,var(--accent));outline-offset:1px}
@media (hover:none){.role-info-button{opacity:1;transform:none}}
.reference-preview .role-info-button{display:none}

#role-info{width:min(1180px,96vw);max-width:none;max-height:min(92vh,860px);padding:0;border:1px solid color-mix(in srgb,var(--alignment) 40%,var(--line));border-radius:16px;background:var(--panel);color:var(--text);box-shadow:0 30px 120px #000c,0 0 0 1px #ffffff05 inset;overflow:hidden}
#role-info[open]{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr)}
#role-info::backdrop{background:#05080bd9;backdrop-filter:blur(3px)}

/* Stage: the linkage hums behind the character (sweep, pulse rings, drifting motes). */
.role-info-stage{position:relative;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:30px 18px 22px;overflow:hidden;isolation:isolate;border-right:1px solid var(--line);background:radial-gradient(85% 50% at 50% 52%,color-mix(in srgb,var(--alignment) 22%,transparent),transparent 72%),linear-gradient(180deg,#141b21,#0d1116)}
.role-info-backdrop{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.role-info-backdrop:before{content:"";position:absolute;left:50%;top:48%;width:240%;aspect-ratio:1;translate:-50% -50%;background:conic-gradient(from 0deg,transparent 0 72%,color-mix(in srgb,var(--alignment) 16%,transparent) 94%,color-mix(in srgb,var(--alignment) 30%,transparent) 100%);animation:role-sweep 11s linear infinite;mask:radial-gradient(closest-side,#000 30%,transparent 100%)}
.role-info-backdrop:after{content:"";position:absolute;inset:-60px 0 0;background:radial-gradient(circle at 12% 30%,#f6c87566 0 1px,transparent 2px),radial-gradient(circle at 64% 72%,#72dcca5c 0 1.2px,transparent 2.2px),radial-gradient(circle at 38% 12%,color-mix(in srgb,var(--alignment) 70%,transparent) 0 1px,transparent 2px),radial-gradient(circle at 84% 44%,#f6c87544 0 1px,transparent 2px);background-size:110px 120px,150px 140px,90px 100px,170px 130px;animation:role-motes 22s linear infinite;opacity:.8}
.role-info-ring{position:absolute;left:50%;top:48%;width:70%;aspect-ratio:1;translate:-50% -50%;border:1px solid color-mix(in srgb,var(--alignment) 55%,transparent);border-radius:50%;opacity:0;animation:role-ring 6s ease-out infinite}
.role-info-ring:nth-child(2){animation-delay:2s}.role-info-ring:nth-child(3){animation-delay:4s}
.role-info-figure{position:relative;display:block;width:100%;max-width:260px;padding:0;border:0;border-radius:12px;background:none;cursor:pointer;animation:role-bob 4.2s ease-in-out infinite}
.role-info-figure:hover{border:0}.role-info-figure:focus-visible{outline:2px solid var(--alignment);outline-offset:6px}
.role-info-figure img,.role-info-figure canvas{display:block;width:100%;height:auto;max-height:min(46vh,340px);object-fit:contain;object-position:bottom;filter:drop-shadow(0 16px 14px #000a);user-select:none}
.role-info-figure img{opacity:0;transition:opacity .45s ease}
.role-info-figure img+img{position:absolute;inset:0;height:100%}
.role-info-figure img.on{opacity:1}
.role-info-expression{display:flex;align-items:center;gap:9px;font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.role-info-dots{display:flex;gap:4px}.role-info-dots i{width:5px;height:5px;border-radius:50%;background:#ffffff26;transition:background .3s,transform .3s}
.role-info-dots i.on{background:var(--alignment);transform:scale(1.3)}
.role-info-stage.held .role-info-expression{color:var(--text)}
@keyframes role-sweep{to{rotate:360deg}}
@keyframes role-ring{0%{scale:.55;opacity:0}15%{opacity:.55}100%{scale:1.65;opacity:0}}
@keyframes role-motes{to{background-position:0 -120px,0 -140px,0 -100px,0 -130px}}
@keyframes role-bob{0%,100%{translate:0 0}50%{translate:0 -4px}}
@media(prefers-reduced-motion:reduce){.role-info-backdrop:before,.role-info-backdrop:after,.role-info-ring,.role-info-figure{animation:none}.role-info-figure img{transition:none}}
.portraits-still .role-info-backdrop:before,.portraits-still .role-info-backdrop:after,.portraits-still .role-info-ring,.portraits-still .role-info-figure{animation:none}

/* Body: a shared header, then rules and strategy beside the worked example. */
.role-info-body{position:relative;overflow-y:auto;max-height:min(92vh,860px);padding:24px 28px 26px}
.role-info-close{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:32px;height:32px;padding:0;border-radius:50%;border-color:transparent;background:transparent;color:var(--muted)}
.role-info-close:hover{color:var(--text);border-color:var(--line);background:var(--panel2)}
.role-info-close svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.role-info-head{padding-right:40px}
.role-info-eyebrow{display:flex;align-items:center;gap:8px;margin:0;font:600 10.5px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--alignment)}
.role-info-eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--alignment);box-shadow:0 0 10px var(--alignment)}
#role-info h2{margin:6px 0 0;font-size:28px;font-weight:650;letter-spacing:-.015em;line-height:1.1}
.role-info-profile{margin:6px 0 0;max-width:72ch;color:var(--muted);font-size:13px;line-height:1.5;font-style:italic}
.role-info-columns{display:grid;gap:0 28px;margin-top:16px}
@media(min-width:1000px){.role-info-columns{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.role-info-col>:first-child{margin-top:0}
.role-info-ability{margin:0;padding:11px 14px;border-left:3px solid var(--alignment);border-radius:0 9px 9px 0;background:color-mix(in srgb,var(--alignment) 7%,var(--panel2));font-size:13.5px;line-height:1.55}
.role-info-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.role-info-chips:empty{display:none}
.role-info-chips span{padding:3px 10px;border:1px solid var(--line);border-radius:20px;background:#0e1216;font:11px var(--mono);color:#b8c2cc}
.role-info-section{margin-top:18px}.role-info-section h3{margin:0 0 7px}
.role-info-section ul{display:grid;gap:5px;margin:0;padding:0;list-style:none}
.role-info-section ul>li{position:relative;padding-left:17px;font-size:13px;line-height:1.5}
.role-info-section ul>li:before{content:"";position:absolute;left:2px;top:.68em;width:7px;height:2px;border-radius:1px;background:var(--alignment)}
.role-info-example{padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#0c1014}
.role-info-example>p{margin:0;font-size:12.5px;line-height:1.5;color:var(--muted)}
.role-info-log{display:grid;gap:5px;margin:9px 0;padding:0;list-style:none}
.role-info-log li{display:grid;grid-template-columns:62px minmax(0,1fr);gap:8px;align-items:baseline;padding:6px 10px;border-left:2px solid var(--priv);border-radius:0 6px 6px 0;background:#161226}
.role-info-log li.public{border-color:var(--accent2);background:#1c1a12}
.role-info-when{font:10px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#a0aec0;white-space:nowrap}
.role-info-when small{display:block;font-size:9px;color:var(--muted);letter-spacing:.08em}
.role-info-log code{font:11.5px/1.5 var(--mono);color:var(--priv);white-space:pre-wrap;overflow-wrap:anywhere}
.role-info-log li.public code{color:var(--text)}
.role-info-example>.role-info-takeaway{position:relative;padding-left:17px;color:var(--text)}
.role-info-takeaway:before{content:"→";position:absolute;left:0;color:var(--alignment)}
.role-info-fine ul>li{font-size:12px;color:var(--muted)}.role-info-fine ul>li:before{background:var(--line)}
@media(max-width:720px){
  #role-info{max-height:92dvh;overflow-y:auto}
  #role-info[open]{grid-template-columns:1fr}
  .role-info-stage{height:270px;flex:none;padding:20px 16px 12px;gap:8px;border-right:0;border-bottom:1px solid var(--line)}
  .role-info-figure{width:auto;height:200px;max-width:none}
  .role-info-figure img,.role-info-figure canvas{width:auto;height:100%;max-height:none}
  .role-info-figure img+img{left:0;right:0;margin:auto}
  /* The whole dialog scrolls; close sits over the portrait's top corner. */
  .role-info-body{position:static;max-height:none;overflow:visible;padding:18px 18px 24px}
  .role-info-close{top:10px;right:10px;background:#0b0d10cc;z-index:3}
  #role-info h2{font-size:24px}
  .role-info-log li{grid-template-columns:1fr;gap:3px}
}
@media(prefers-reduced-motion:reduce){.role-info-button{transition:none}}
.detail-actions[hidden]{display:none}.detail-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 16px}
.detail-action{display:inline-flex;align-items:center;gap:7px;margin:0;padding:7px 12px;border-radius:9px;font-size:12px}
.detail-action .icon{font-size:14px}
.detail-action-whisper:not(:disabled){color:var(--priv);border-color:color-mix(in srgb,var(--priv) 55%,transparent)}
.detail-action-prompt:not(:disabled){color:var(--prompt);border-color:color-mix(in srgb,var(--prompt) 55%,transparent)}
.detail-action:not(:disabled):hover{background:color-mix(in srgb,currentColor 12%,var(--panel2))}
.detail-action:disabled{opacity:.45;cursor:not-allowed}
.detail-actions-hint{flex-basis:100%;color:var(--muted);font-size:10.5px}

/* DOOMSAYER: a staged scene. The room darkens, the caller spells D-O-O-M, the doomed cower on the right, then fall. */
.doom-veil{position:fixed;inset:0;z-index:99;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 100%,#3a040c55 0,#16020699 45%,#040001e6 100%);animation:doom-veil-in 1.1s ease-out both}
.doom-veil::after{content:"";position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 78% 70%,#fff4ef 0,#ff2a36 28%,#5c000c 70%,#000 100%);mix-blend-mode:screen}
.doom-veil.struck::after{animation:doom-flash 1.1s cubic-bezier(.1,.9,.2,1) both}
.doom-veil.still,.doom-veil.still::after{animation:none}.doom-veil.still.struck{background:radial-gradient(ellipse 120% 90% at 50% 100%,#52040f66 0,#1c0207a8 45%,#050001ee 100%)}
#robot-dialogue.is-doom{--alignment:#c3172b}
#robot-dialogue.is-doom .dialogue-copy{border-color:#c3172b;background:radial-gradient(ellipse at 50% 120%,#4a0913 0,#1b070b 55%,#0b0406 100%);box-shadow:0 0 0 1px #ff304420,0 12px 60px #000c,0 0 70px #a3001a55,inset 0 0 40px #00000080;transition:box-shadow .6s}
#robot-dialogue.is-doom .dialogue-nameplate{border-color:#c3172b;background:#1b070b}
#robot-dialogue.is-doom.is-paired .dialogue-nameplate{background:none;border-bottom-color:#c3172b55}
#robot-dialogue.is-doom .dialogue-role{color:#d98a92;letter-spacing:.04em}
#robot-dialogue.is-doom .dialogue-line{margin:0}
#robot-dialogue.is-doom .dialogue-accusation{min-height:1.4em;margin-top:8px;font-size:14px;letter-spacing:.06em;text-transform:uppercase;animation:doom-rise .5s ease-out both}
#robot-dialogue.is-doom .dialogue-accusation:empty{display:block;visibility:hidden}
#robot-dialogue.doom-struck .dialogue-accusation{color:#ff5a66!important;text-shadow:0 0 12px #ff1a2b99}
#robot-dialogue.doom-void .dialogue-accusation{color:#8f8488!important;font-style:italic}
#robot-dialogue.is-doom:not(.doom-done) .dialogue-copy>button{visibility:hidden}
#robot-dialogue.is-doom .dialogue-copy>button::after{color:#ff4455}
/* The word itself. */
.doom-word{display:flex;justify-content:center;gap:.1em;margin:4px 0 14px;font:900 clamp(60px,9vw,120px)/1 "Georgia","Times New Roman",serif;letter-spacing:.08em;color:#ffe6e2;user-select:none}
.doom-letter{display:inline-block;opacity:0;text-shadow:0 0 6px #ff6a5a,0 0 22px #ff1a2b,0 0 60px #a0000f,0 5px 0 #3b0008}
.doom-letter.on{opacity:1;animation:doom-slam .55s cubic-bezier(.16,1,.3,1) both}
.doom-word.spoken .doom-letter{animation:doom-slam .55s cubic-bezier(.16,1,.3,1) both,doom-throb 2.4s ease-in-out .6s infinite}
.doom-word.spoken .doom-letter:last-child{animation:doom-slam-final .8s cubic-bezier(.16,1,.3,1) both,doom-throb 2.4s ease-in-out .8s infinite}
#robot-dialogue.doom-struck .doom-letter{animation:doom-sear 1.4s ease-out both,doom-throb 2.4s ease-in-out 1.4s infinite}
#robot-dialogue.doom-void .doom-letter{animation:doom-gutter 1.2s ease-out forwards}
/* The caller leans into the word. */
.is-doom .dialogue-art:not(.dialogue-accused)::before{content:"";position:absolute;inset:18% 8% 0;border-radius:50%;background:radial-gradient(#ff1a2b55,transparent 70%);filter:blur(12px);animation:doom-aura 2.4s ease-in-out infinite;z-index:-1}
/* The doomed: absent, then afraid and trembling, then struck down. */
.is-doom .dialogue-accused{opacity:0}
.doom-fear .dialogue-accused{animation:doom-appear .7s cubic-bezier(.2,.8,.2,1) both}
.doom-fear .dialogue-accused canvas{animation:doom-tremble .11s linear infinite}
.doom-fear .dialogue-accused::before{content:"";position:absolute;inset:10% 6% 0;border-radius:50%;background:radial-gradient(#6d0a1a66,transparent 70%);filter:blur(14px);z-index:-1}
.doom-struck .dialogue-accused canvas{animation:doom-fall 1.2s cubic-bezier(.2,.9,.25,1) both;filter:drop-shadow(0 0 10px #ff1a2b) drop-shadow(0 0 2px #ff5a66) grayscale(.45) brightness(.8)}
.doom-struck .dialogue-accused::after{content:"";position:absolute;left:50%;top:-40%;bottom:-6%;width:44%;translate:-50% 0;background:linear-gradient(90deg,transparent,#ff2a3690 35%,#fff4ef 50%,#ff2a3690 65%,transparent);filter:blur(3px);mix-blend-mode:screen;opacity:0;transform-origin:50% 0;animation:doom-bolt .9s cubic-bezier(.1,.9,.2,1) both}
#robot-dialogue.doom-jolt{animation:doom-jolt .32s cubic-bezier(.3,.6,.3,1)}
#robot-dialogue.doom-quake{animation:doom-quake .6s cubic-bezier(.3,.6,.3,1)}
@keyframes doom-veil-in{from{opacity:0}}
@keyframes doom-flash{0%{opacity:0}6%{opacity:.95}22%{opacity:.5}100%{opacity:0}}
@keyframes doom-rise{from{opacity:0;transform:translateY(6px)}}
@keyframes doom-slam{0%{opacity:0;transform:scale(3.4) translateY(-.12em);filter:blur(12px)}45%{opacity:1;transform:scale(.9);filter:blur(0)}70%{transform:scale(1.05)}100%{opacity:1;transform:none}}
@keyframes doom-slam-final{0%{opacity:0;transform:scale(4.6) translateY(-.15em);filter:blur(16px)}40%{opacity:1;transform:scale(.86);filter:blur(0);color:#fff}65%{transform:scale(1.1)}100%{opacity:1;transform:none}}
@keyframes doom-throb{0%,100%{text-shadow:0 0 6px #ff6a5a,0 0 22px #ff1a2b,0 0 60px #a0000f,0 5px 0 #3b0008}50%{text-shadow:0 0 10px #ff8a7a,0 0 34px #ff1a2b,0 0 90px #c0001a,0 5px 0 #3b0008}}
@keyframes doom-sear{0%{color:#fff;text-shadow:0 0 14px #fff,0 0 40px #ff3a44,0 0 120px #ff1a2b}100%{color:#ffe6e2}}
@keyframes doom-gutter{to{opacity:.35;color:#8f8488;text-shadow:0 0 6px #3a0a10,0 5px 0 #1a0508}}
@keyframes doom-aura{0%,100%{opacity:.55;scale:1}50%{opacity:1;scale:1.12}}
@keyframes doom-appear{0%{opacity:0;translate:0 14px;filter:brightness(0)}60%{opacity:1;filter:brightness(.6)}100%{opacity:1;translate:0 0;filter:none}}
@keyframes doom-tremble{0%{transform:translate(0,0)}25%{transform:translate(-1.5px,.5px)}50%{transform:translate(1px,-1px)}75%{transform:translate(1.5px,1px)}100%{transform:translate(0,0)}}
@keyframes doom-fall{0%{transform:scale(1.08);filter:brightness(4) saturate(0) drop-shadow(0 0 22px #fff)}12%{transform:translate(-6px,0) scale(1.02)}24%{transform:translate(5px,2px)}38%{transform:translate(-3px,4px)}100%{transform:translate(0,10px) rotate(-3deg)}}
@keyframes doom-bolt{0%{opacity:0;transform:scaleY(0)}10%{opacity:1;transform:scaleY(1)}35%{opacity:.8}100%{opacity:0;transform:scaleY(1)}}
@keyframes doom-jolt{0%,100%{translate:0 0}20%{translate:-5px 2px}45%{translate:4px -2px}70%{translate:-2px 1px}}
@keyframes doom-quake{0%,100%{translate:0 0}10%{translate:-12px 4px}22%{translate:10px -5px}36%{translate:-8px 3px}50%{translate:6px -2px}66%{translate:-3px 2px}82%{translate:2px -1px}}
@media(max-width:600px){.doom-word{font-size:clamp(48px,15vw,72px);margin-bottom:8px}}
@media(max-height:500px){.doom-word{font-size:52px;margin:0 0 6px}}
@media(prefers-reduced-motion:reduce){.doom-veil,.doom-veil::after,.doom-letter,.doom-letter.on,.is-doom .dialogue-accused,.is-doom .dialogue-accused canvas,.is-doom .dialogue-accused::after,.is-doom .dialogue-art::before,#robot-dialogue.doom-jolt,#robot-dialogue.doom-quake{animation:none!important}.is-doom.doom-fear .dialogue-accused{opacity:1}}
.portraits-still .doom-veil,.portraits-still .doom-veil::after,.portraits-still .doom-letter,.portraits-still .is-doom .dialogue-accused,.portraits-still .is-doom .dialogue-accused::after,.portraits-still .is-doom .dialogue-art::before,.portraits-still #robot-dialogue.doom-jolt,.portraits-still #robot-dialogue.doom-quake{animation:none!important}.portraits-still .is-doom.doom-fear .dialogue-accused{opacity:1}
/* KILL SWITCH: a clinical strike. The lights stutter on, both robots face off, the switch charges,
   DIE! snaps on in a glitch, then an arc seizes the target's chassis, or the whole rig sputters out. */
#robot-dialogue.is-kill{--alignment:#27c8f0;--kill-art:clamp(180px,24vw,280px);--kill-edge:12px}
.kill-veil{position:fixed;inset:0;z-index:99;pointer-events:none;background:repeating-linear-gradient(0deg,#7fe8ff08 0 1px,transparent 1px 3px),radial-gradient(ellipse 120% 90% at 50% 100%,#04304a55 0,#020c16b0 45%,#000207eb 100%);animation:kill-veil-in .6s steps(1) both}
.kill-veil::after{content:"";position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 76% 62%,#fff 0,#b8f6ff 22%,#1480c8 58%,#00060f 100%);mix-blend-mode:screen}
.kill-veil.struck::after{animation:kill-strobe 1s linear both}
.kill-veil.fizzle{animation:kill-veil-in .6s steps(1) both,kill-veil-sag 1s steps(1) forwards}
.kill-veil.still,.kill-veil.still::after{animation:none}.kill-veil.still.fizzle{opacity:.6}.kill-veil.still.struck{background:repeating-linear-gradient(0deg,#7fe8ff0d 0 1px,transparent 1px 3px),radial-gradient(ellipse 120% 90% at 50% 100%,#06405e66 0,#030f1cb8 45%,#000308ee 100%)}
#robot-dialogue.is-kill .dialogue-copy{border-color:#27c8f0;background:linear-gradient(#27c8f00a 1px,transparent 1px) 0 0/100% 6px,radial-gradient(ellipse at 50% 120%,#06324a 0,#07141f 55%,#03080d 100%);box-shadow:0 0 0 1px #5fe3ff22,0 12px 60px #000c,0 0 60px #0a8fd044,inset 0 0 40px #00000080;transition:box-shadow .15s}
#robot-dialogue.kill-struck:not(.kill-dead) .dialogue-copy{box-shadow:0 0 0 1px #bff4ff66,0 12px 60px #000c,0 0 110px #27c8f099,inset 0 0 50px #27c8f033}
#robot-dialogue.is-kill .dialogue-nameplate{border-color:#27c8f0;background:#07141f}
#robot-dialogue.is-kill.is-paired .dialogue-nameplate{background:none;border-bottom-color:#27c8f055}
#robot-dialogue.is-kill .dialogue-role{color:#86c9da;letter-spacing:.04em}
#robot-dialogue.is-kill .dialogue-line{margin:0}
#robot-dialogue.is-kill .dialogue-accusation{display:block;min-height:1.4em;margin-top:8px;font:700 13px/1.4 ui-monospace,"Cascadia Mono",Consolas,monospace;letter-spacing:.14em;text-transform:uppercase}
#robot-dialogue.is-kill .dialogue-accusation::before{content:"\25CE  ";color:#5fe3ff}
#robot-dialogue.is-kill:not(.kill-fired) .dialogue-accusation::after{content:"_";animation:kill-blink .5s steps(1) infinite}
#robot-dialogue.kill-struck .dialogue-accusation{color:#e9fdff!important;text-shadow:0 0 10px #27c8f0,0 0 2px #fff}
#robot-dialogue.kill-fizzle .dialogue-accusation{color:#6f8790!important;font-style:italic}
#robot-dialogue.kill-fizzle .dialogue-accusation::before{color:#4a5d64}
#robot-dialogue.is-kill:not(.kill-done) .dialogue-copy>button{visibility:hidden}
#robot-dialogue.is-kill .dialogue-copy>button::after{color:#5fe3ff}
/* The charge bar holds the stage until it discharges into the shout. */
.kill-word{position:relative;display:grid;place-items:center;height:clamp(60px,9vw,120px);margin:4px 0 14px;user-select:none}
.kill-charge{position:absolute;width:min(72%,520px);height:12px;border:1px solid #27c8f0aa;border-radius:2px;background:#021019;box-shadow:0 0 14px #27c8f033,inset 0 0 6px #000}
.kill-charge i{position:absolute;inset:1px auto 1px 1px;width:0;background:linear-gradient(90deg,#0d6fa8,#27c8f0 70%,#e9fdff);box-shadow:0 0 12px #27c8f0,0 0 30px #27c8f066;animation:kill-charge 1.3s cubic-bezier(.5,0,.9,.6) forwards}
.kill-charge b{position:absolute;right:0;bottom:calc(100% + 6px);font:700 11px/1 ui-monospace,"Cascadia Mono",Consolas,monospace;letter-spacing:.3em;color:#5fe3ff}
.kill-charge b::after{content:"ARMING";animation:kill-blink .35s steps(1) infinite}
.kill-armed .kill-charge{border-color:#e9fdff;box-shadow:0 0 22px #27c8f0aa,inset 0 0 6px #000}.kill-armed .kill-charge b::after{content:"ARMED";color:#e9fdff;animation:kill-blink .12s steps(1) infinite}
.kill-fired .kill-charge{animation:kill-discharge .22s ease-in forwards}
.kill-shout{position:relative;opacity:0;font:italic 900 clamp(60px,9vw,120px)/1 Impact,Haettenschweiler,"Arial Narrow Bold","Arial Black",sans-serif;letter-spacing:.06em;color:#effdff;text-shadow:0 0 8px #7feaff,0 0 26px #1fb8ff,0 0 70px #0a6cff;transform:skewX(-6deg)}
.kill-shout::before,.kill-shout::after{content:attr(data-text);position:absolute;inset:0;opacity:0;mix-blend-mode:screen;text-shadow:none}
.kill-shout::before{color:#00e5ff}.kill-shout::after{color:#ff2bd6}
.kill-fired .kill-shout{opacity:1;animation:kill-glitch-in .5s steps(1) both,kill-hum 3s steps(1) .6s infinite}
.kill-fired .kill-shout::before{animation:kill-split-a .5s steps(1) both}.kill-fired .kill-shout::after{animation:kill-split-b .5s steps(1) both}
.kill-struck:not(.kill-dead) .kill-shout{animation:kill-overload .14s steps(2) infinite}
.kill-struck:not(.kill-dead) .kill-shout::before{opacity:.8;animation:kill-split-a .2s steps(1) infinite}.kill-struck:not(.kill-dead) .kill-shout::after{opacity:.8;animation:kill-split-b .2s steps(1) infinite}
.kill-fizzle .kill-shout{animation:kill-sputter 1.1s steps(1) forwards}.kill-fizzle .kill-shout::before,.kill-fizzle .kill-shout::after{display:none}
/* The caller crackles while the switch charges; the target is locked in a reticle from the first frame. */
.is-kill .dialogue-art:not(.dialogue-accused)::before{content:"";position:absolute;inset:14% 6% 0;border-radius:50%;background:radial-gradient(#27c8f055,transparent 70%);filter:blur(10px);z-index:-1;animation:kill-crackle .18s steps(2) infinite}
.kill-fired .dialogue-art:not(.dialogue-accused)::before{background:radial-gradient(#bff4ffaa,#27c8f055 45%,transparent 72%)}
.kill-fizzle .dialogue-art:not(.dialogue-accused)::before,.kill-dead .dialogue-art:not(.dialogue-accused)::before{animation:none;opacity:.35}
.is-kill .dialogue-accused::before{content:"";position:absolute;inset:4%;z-index:1;--c:#5fe3ff;background:linear-gradient(var(--c),var(--c)) 0 0/22px 2px,linear-gradient(var(--c),var(--c)) 0 0/2px 22px,linear-gradient(var(--c),var(--c)) 100% 0/22px 2px,linear-gradient(var(--c),var(--c)) 100% 0/2px 22px,linear-gradient(var(--c),var(--c)) 0 100%/22px 2px,linear-gradient(var(--c),var(--c)) 0 100%/2px 22px,linear-gradient(var(--c),var(--c)) 100% 100%/22px 2px,linear-gradient(var(--c),var(--c)) 100% 100%/2px 22px;background-repeat:no-repeat;filter:drop-shadow(0 0 4px #27c8f0);animation:kill-lock .7s cubic-bezier(.2,.9,.2,1) both}
.kill-fired .dialogue-accused::before{--c:#e9fdff;animation:kill-lock-fire .3s steps(1) both}
.kill-dead .dialogue-accused::before,.kill-fizzle .dialogue-accused::before{animation:kill-release .5s steps(1) forwards}
@keyframes kill-release{0%{opacity:1}20%{opacity:0}40%{opacity:.8}60%,100%{opacity:0}}
.is-kill .dialogue-accused canvas{animation:kill-twitch 1.6s steps(1) infinite}
.kill-struck .dialogue-accused canvas{animation:kill-convulse .08s linear infinite;filter:brightness(1.7) saturate(.2) drop-shadow(0 0 14px #5fe3ff) drop-shadow(0 0 3px #fff)}
.kill-struck .dialogue-accused::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,#bff4ff55 0 2px,transparent 2px 7px);mix-blend-mode:screen;-webkit-mask:radial-gradient(closest-side,#000 55%,transparent);mask:radial-gradient(closest-side,#000 55%,transparent);animation:kill-static .1s steps(2) infinite}
.kill-dead .dialogue-accused canvas{animation:kill-crt .75s cubic-bezier(.3,.9,.3,1) both;filter:grayscale(.6) brightness(.72) drop-shadow(0 0 6px #27c8f0)}
.kill-dead .dialogue-accused::after{animation:kill-static .1s steps(2) 6 forwards;opacity:.35}
.kill-fizzle .dialogue-accused canvas{animation:none}
/* The arc: drawn from caller to target in a blink, strands flickering against each other. */
.kill-arc{display:none;position:absolute;z-index:2;left:calc(var(--kill-edge) + var(--kill-art)*.55);width:calc(100% - 2*var(--kill-edge) - var(--kill-art)*1.1);bottom:calc(100% - 12px + var(--kill-art)*.36);height:calc(var(--kill-art)*.3);overflow:visible;pointer-events:none;filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 10px #27c8f0) drop-shadow(0 0 26px #0a8fd0)}
.kill-struck:not(.kill-dead) .kill-arc{display:block;animation:kill-arc-life 1s linear forwards}
.kill-arc path{fill:none;stroke:#effdff;stroke-width:2.5;stroke-linejoin:bevel;stroke-dasharray:100;stroke-dashoffset:100;animation:kill-arc-draw .09s linear forwards,kill-arc-flick .11s steps(1) infinite}
.kill-arc path:nth-child(2){stroke:#7feaff;stroke-width:1.5;animation-delay:0s,.05s}.kill-arc path:nth-child(3){stroke:#bff4ff;stroke-width:1;animation-delay:.03s,.08s}
#robot-dialogue.kill-snap{animation:kill-snap .26s steps(4)}
#robot-dialogue.kill-shock{animation:kill-shock .9s linear}
@keyframes kill-veil-in{0%{opacity:0}8%{opacity:.8}14%{opacity:.1}24%{opacity:.9}32%{opacity:.4}46%,100%{opacity:1}}
@keyframes kill-veil-sag{0%{opacity:1}10%{opacity:.5}18%{opacity:.9}30%{opacity:.35}45%,100%{opacity:.6}}
@keyframes kill-strobe{0%{opacity:0}4%{opacity:1}10%{opacity:.08}16%{opacity:.9}24%{opacity:.12}34%{opacity:.5}100%{opacity:0}}
@keyframes kill-blink{50%{opacity:0}}
@keyframes kill-charge{0%{width:0}35%{width:28%}42%{width:26%}70%{width:71%}76%{width:68%}100%{width:calc(100% - 2px)}}
@keyframes kill-discharge{0%{transform:scaleX(1);filter:brightness(3)}100%{transform:scaleX(0) scaleY(3);opacity:0}}
@keyframes kill-glitch-in{0%{opacity:1;clip-path:inset(40% 0 42% 0);translate:-18px 0;color:#fff}15%{clip-path:inset(0 0 70% 0);translate:14px 0}30%{clip-path:inset(62% 0 0 0);translate:-8px 0}45%{clip-path:inset(10% 0 30% 0);translate:5px 0;color:#fff}60%{clip-path:none;translate:-2px 0}100%{clip-path:none;translate:0 0;color:#effdff}}
@keyframes kill-split-a{0%{opacity:.9;translate:-9px 0}30%{translate:6px -2px}60%{translate:-4px 1px}100%{opacity:0;translate:0 0}}
@keyframes kill-split-b{0%{opacity:.9;translate:9px 0}30%{translate:-5px 2px}60%{translate:3px -1px}100%{opacity:0;translate:0 0}}
@keyframes kill-hum{0%,100%{opacity:1}91%{opacity:.55}93%{opacity:1}96%{opacity:.7}}
@keyframes kill-overload{0%{color:#fff;text-shadow:0 0 14px #fff,0 0 40px #5fe3ff,0 0 110px #27c8f0}50%{color:#bff4ff;text-shadow:0 0 6px #7feaff,0 0 24px #1fb8ff,0 0 60px #0a6cff}}
@keyframes kill-sputter{0%{opacity:1}8%{opacity:.2}14%{opacity:.9}22%{opacity:.1}30%{opacity:.7;color:#8fb8c4;text-shadow:0 0 4px #27c8f0}38%{opacity:.15}52%{opacity:.5}100%{opacity:.4;color:#56707a;text-shadow:none;translate:0 5px}}
@keyframes kill-crackle{0%{opacity:.6;scale:1}50%{opacity:1;scale:1.08}}
@keyframes kill-lock{0%{opacity:0;inset:-14%}60%{opacity:1;inset:6%}75%{opacity:.2}85%{opacity:1}100%{opacity:1;inset:4%}}
@keyframes kill-lock-fire{0%{inset:12%;opacity:1}50%{opacity:.3}100%{inset:4%;opacity:1}}
@keyframes kill-twitch{0%,86%,100%{transform:none}88%{transform:translate(-3px,1px) rotate(-1deg)}91%{transform:translate(2px,0)}94%{transform:none}}
@keyframes kill-convulse{0%{transform:translate(0,0) skewX(0)}25%{transform:translate(-5px,2px) skewX(4deg)}50%{transform:translate(4px,-3px) skewX(-3deg)}75%{transform:translate(-2px,3px) skewX(2deg)}}
@keyframes kill-static{0%{background-position:0 0}50%{background-position:0 3px}}
@keyframes kill-crt{0%{transform:scale(1.06,.02);filter:brightness(5) saturate(0)}18%{transform:scale(1.1,.02);filter:brightness(5) saturate(0)}40%{transform:scale(1,1.04);filter:brightness(1.8) saturate(.2)}55%{transform:translate(-3px,0)}65%{transform:translate(2px,2px)}100%{transform:translate(0,8px) rotate(3deg)}}
@keyframes kill-arc-life{0%,82%{opacity:1}86%{opacity:.2}90%{opacity:.9}100%{opacity:0}}
@keyframes kill-arc-draw{to{stroke-dashoffset:0}}
@keyframes kill-arc-flick{50%{opacity:.25}}
@keyframes kill-snap{0%{translate:0 0;scale:1}25%{translate:-9px 0;scale:1.015}50%{translate:6px 0}75%{translate:-2px 0}100%{translate:0 0;scale:1}}
@keyframes kill-shock{0%,100%{translate:0 0}5%{translate:-7px 5px}10%{translate:7px -6px}15%{translate:-6px -4px}20%{translate:6px 5px}25%{translate:-5px 3px}30%{translate:5px -4px}40%{translate:-4px 2px}50%{translate:3px -3px}60%{translate:-2px 2px}70%{translate:2px -1px}85%{translate:-1px 1px}}
@media(max-width:600px){#robot-dialogue.is-kill{--kill-art:min(160px,44vw);--kill-edge:0px}.kill-word{height:clamp(48px,15vw,72px);margin-bottom:8px}.kill-shout{font-size:clamp(48px,15vw,72px)}}
@media(max-height:500px){#robot-dialogue.is-kill{--kill-art:110px}.kill-word{height:52px;margin:0 0 6px}.kill-shout{font-size:52px}}
@media(prefers-reduced-motion:reduce){.kill-veil,.kill-veil::after,.kill-charge,.kill-charge i,.kill-charge b::after,.kill-shout,.kill-shout::before,.kill-shout::after,.kill-arc,.kill-arc path,.is-kill .dialogue-art::before,.is-kill .dialogue-accused::before,.is-kill .dialogue-accused::after,.is-kill .dialogue-accused canvas,#robot-dialogue.is-kill .dialogue-accusation::after,#robot-dialogue.kill-snap,#robot-dialogue.kill-shock{animation:none!important}.kill-fired .kill-charge{display:none}}
.portraits-still .kill-veil,.portraits-still .kill-veil::after,.portraits-still .kill-charge,.portraits-still .kill-charge i,.portraits-still .kill-charge b::after,.portraits-still .kill-shout,.portraits-still .kill-shout::before,.portraits-still .kill-shout::after,.portraits-still .kill-arc,.portraits-still .kill-arc path,.portraits-still .is-kill .dialogue-art::before,.portraits-still .is-kill .dialogue-accused::before,.portraits-still .is-kill .dialogue-accused::after,.portraits-still .is-kill .dialogue-accused canvas,.portraits-still #robot-dialogue.kill-snap,.portraits-still #robot-dialogue.kill-shock{animation:none!important}.portraits-still .kill-fired .kill-charge{display:none}
@media(prefers-reduced-motion:reduce){.kill-dead .dialogue-accused::before,.kill-fizzle .dialogue-accused::before{opacity:0}}.portraits-still .kill-dead .dialogue-accused::before,.portraits-still .kill-fizzle .dialogue-accused::before{opacity:0}
/* DAWN: quieter than a strike. The night slowly lifts toward a cold horizon; the line hangs, then
   each body surfaces from the dark, already destroyed. */
#robot-dialogue.is-dawn{--alignment:#8b98c9}
.dawn-veil{position:fixed;inset:0;z-index:99;pointer-events:none;background:linear-gradient(#03040cf0 0,#0a0d22d0 50%,#1a1630a8 100%);animation:dawn-veil-in 1s ease-out both}
.dawn-veil::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 140% 55% at 50% 108%,#f2b88a66 0,#b0708055 35%,transparent 70%);opacity:0;animation:dawn-rise 5s ease-in-out .6s forwards}
.dawn-veil.still,.dawn-veil.still::after{animation:none}.dawn-veil.still::after{opacity:.8}
#robot-dialogue.is-dawn .dialogue-copy{border-color:#5a6594;background:linear-gradient(#0c0f22,#141427 70%,#201a2c);box-shadow:0 0 0 1px #9aa8ff14,0 12px 60px #000c,inset 0 0 40px #00000070}
#robot-dialogue.is-dawn .dialogue-nameplate{border-color:#5a6594;background:#0c0f22}
#robot-dialogue.is-dawn .dialogue-role{color:#9aa3c8;letter-spacing:.04em}
#robot-dialogue.is-dawn .dialogue-line{margin:0}
#robot-dialogue.is-dawn .dialogue-accusation{display:block;min-height:1.4em;margin-top:8px;font-size:14px;letter-spacing:.06em;color:#c9cfe6}
#robot-dialogue.is-dawn:not(.dawn-done) .dialogue-copy>button{visibility:hidden}
.dawn-claims{display:block;margin:6px 0 12px;text-align:center;font:italic 400 clamp(26px,3.4vw,40px)/1.2 "Georgia","Times New Roman",serif;letter-spacing:.14em;color:#d6dcf3;opacity:0;user-select:none}
.dawn-claiming .dawn-claims{animation:dawn-claims 1.4s cubic-bezier(.2,.7,.2,1) forwards}
/* The body: absent, then surfacing out of silhouette. */
.is-dawn .dialogue-art{opacity:0}
.dawn-found .dialogue-art{animation:dawn-surface 1.1s cubic-bezier(.2,.7,.2,1) forwards}
.dawn-found .dialogue-art canvas{filter:grayscale(.35) brightness(.85) drop-shadow(0 0 14px #8b98c955)}
.dawn-found .dialogue-accusation{animation:doom-rise .6s ease-out both}
@keyframes dawn-veil-in{from{opacity:0}}
@keyframes dawn-rise{to{opacity:.8}}
@keyframes dawn-claims{0%{opacity:0;letter-spacing:.4em;filter:blur(6px)}100%{opacity:1;letter-spacing:.14em;filter:none}}
@keyframes dawn-surface{0%{opacity:0;translate:0 10px;filter:brightness(0)}55%{opacity:1;filter:brightness(.35)}100%{opacity:1;translate:0 0;filter:none}}
@media(prefers-reduced-motion:reduce){.dawn-veil,.dawn-veil::after,.dawn-claiming .dawn-claims,.dawn-found .dialogue-art,.dawn-found .dialogue-accusation{animation:none!important}.dawn-veil::after{opacity:.8}.dawn-claiming .dawn-claims,.dawn-found .dialogue-art{opacity:1}}
.portraits-still .dawn-veil,.portraits-still .dawn-veil::after,.portraits-still .dawn-claiming .dawn-claims,.portraits-still .dawn-found .dialogue-art,.portraits-still .dawn-found .dialogue-accusation{animation:none!important}.portraits-still .dawn-claiming .dawn-claims,.portraits-still .dawn-found .dialogue-art{opacity:1}
/* PANIC RELAY: the dead name a living player. A relay arm hangs open for a breath, then snaps shut
   (the game ends) or droops, exactly as a bluff would. */
#robot-dialogue.is-panic{--alignment:#b07cf0}
.panic-veil{position:fixed;inset:0;z-index:99;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 100%,#2a0f4a44 0,#0f071c99 45%,#040208dd 100%);animation:doom-veil-in .7s ease-out both}
.panic-veil::after{content:"";position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 78% 66%,#fff 0,#d9b6ff 24%,#6a2fc0 60%,#000 100%);mix-blend-mode:screen}
.panic-veil.struck::after{animation:doom-flash .9s cubic-bezier(.1,.9,.2,1) both}
.panic-veil.still,.panic-veil.still::after{animation:none}
#robot-dialogue.is-panic .dialogue-copy{border-color:#8a5bd0;background:radial-gradient(ellipse at 50% 120%,#2a1446 0,#130a20 55%,#08050d 100%);box-shadow:0 0 0 1px #c9a0ff1c,0 12px 60px #000c,0 0 50px #6a2fc033,inset 0 0 40px #00000080}
#robot-dialogue.is-panic .dialogue-nameplate{border-color:#8a5bd0;background:#130a20}
#robot-dialogue.is-panic.is-paired .dialogue-nameplate{background:none;border-bottom-color:#8a5bd055}
#robot-dialogue.is-panic .dialogue-role{color:#b9a3d6;letter-spacing:.04em}
#robot-dialogue.is-panic .dialogue-line{margin:0}
#robot-dialogue.is-panic .dialogue-accusation{display:block;min-height:1.4em;margin-top:8px;font-size:14px;letter-spacing:.06em;text-transform:uppercase;animation:doom-rise .5s ease-out both}
#robot-dialogue.panic-tripped .dialogue-accusation{color:#f1e4ff!important;text-shadow:0 0 12px #b07cf0}
#robot-dialogue.panic-dud .dialogue-accusation{color:#8a8296!important;font-style:italic}
#robot-dialogue.is-panic:not(.panic-done) .dialogue-copy>button{visibility:hidden}
/* The relay: two contacts and an arm hinged on the left one. */
.panic-relay{position:relative;display:flex;align-items:center;justify-content:space-between;width:min(46%,220px);height:44px;margin:10px auto 14px;user-select:none}
.panic-relay i{width:12px;height:12px;border:2px solid #8a5bd0;border-radius:50%;background:#130a20;box-shadow:0 0 8px #6a2fc055;transition:background .2s,box-shadow .2s}
.panic-relay b{position:absolute;left:10px;right:10px;top:50%;height:3px;margin-top:-1.5px;border-radius:2px;background:#c9a0ff;box-shadow:0 0 8px #b07cf0;transform-origin:0 50%;rotate:-24deg;transition:rotate .5s cubic-bezier(.3,1.6,.5,1)}
.panic-armed .panic-relay b{animation:panic-quiver .16s steps(2) infinite}
.panic-tripped .panic-relay b{animation:none;rotate:0deg;background:#fff;box-shadow:0 0 14px #d9b6ff,0 0 30px #b07cf0;transition-duration:.12s}
.panic-tripped .panic-relay i{background:#f1e4ff;box-shadow:0 0 14px #d9b6ff,0 0 26px #b07cf0}
.panic-dud .panic-relay b{animation:none;rotate:-34deg;background:#5e5470;box-shadow:none;transition:rotate .9s ease-in,background .9s}
.panic-dud .panic-relay i{border-color:#4a4058;box-shadow:none}
/* The chosen: a slow pulse while the relay holds. */
.panic-armed:not(.panic-tripped):not(.panic-dud) .dialogue-accused canvas{animation:doom-tremble .14s linear infinite}
.panic-tripped .dialogue-accused canvas{filter:drop-shadow(0 0 12px #b07cf0) brightness(1.1)}
.panic-dud .dialogue-accused canvas{filter:grayscale(.25) brightness(.9)}
@keyframes panic-quiver{0%{rotate:-24deg}50%{rotate:-19deg}}
@media(prefers-reduced-motion:reduce){.panic-veil,.panic-veil::after,.panic-relay b,.panic-armed .panic-relay b,.is-panic .dialogue-accused canvas,#robot-dialogue.is-panic .dialogue-accusation{animation:none!important;transition:none!important}}
.portraits-still .panic-veil,.portraits-still .panic-veil::after,.portraits-still .panic-relay b,.portraits-still .panic-armed .panic-relay b,.portraits-still .is-panic .dialogue-accused canvas,.portraits-still #robot-dialogue.is-panic .dialogue-accusation{animation:none!important;transition:none!important}

/* EXECUTION: a dusk scene. The ballot fills in, the condemned appears afraid, then falls. */
.exec-veil{position:fixed;inset:0;z-index:99;pointer-events:none;background:linear-gradient(180deg,#120a24e0 0,#2a1238b8 38%,#6a2a1a80 78%,#c0602066 100%);animation:doom-veil-in 1.2s ease-out both}
.exec-veil::after{content:"";position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 22% 72%,#fff1dc 0,#ff8a3a 26%,#5a1410 68%,#000 100%);mix-blend-mode:screen}
.exec-veil.struck::after{animation:doom-flash 1s cubic-bezier(.1,.9,.2,1) both}
.exec-veil.still,.exec-veil.still::after{animation:none}
#robot-dialogue.is-exec{--alignment:#e8913a}
#robot-dialogue.is-exec .dialogue-copy{border-color:#e8913a;background:linear-gradient(180deg,#261631,#33191a 70%,#180d0b);box-shadow:0 0 0 1px #ffb46a22,0 12px 60px #000c,0 0 70px #c0602044,inset 0 0 40px #00000080}
#robot-dialogue.is-exec .dialogue-nameplate{border-color:#e8913a;background:#261631}
#robot-dialogue.is-exec .dialogue-nameplate h2{color:#ffc58a}
#robot-dialogue.is-exec .dialogue-role{color:#c9a58f;letter-spacing:.04em}
#robot-dialogue.is-exec .dialogue-line{margin:0}
#robot-dialogue.is-exec .dialogue-accusation{min-height:1.4em;margin-top:10px;font-size:15px;letter-spacing:.05em;text-transform:uppercase;animation:doom-rise .5s ease-out both}
#robot-dialogue.is-exec .dialogue-accusation:empty{display:block;visibility:hidden}
#robot-dialogue.exec-struck .dialogue-accusation{color:#ff9a5a!important;text-shadow:0 0 12px #ff5a1a88}
#robot-dialogue.is-exec:not(.exec-done) .dialogue-copy>button{visibility:hidden}
#robot-dialogue.is-exec .dialogue-copy>button::after{color:#ffb46a}
.exec-tally{margin:2px 0 4px;transition:opacity .5s,scale .5s;transform-origin:50% 0}
.exec-count{font-size:15px;color:#d9c2b2;letter-spacing:.03em}
.exec-count b{display:inline-block;min-width:1.2ch;font:900 34px/1 "Georgia","Times New Roman",serif;color:#ffe2c2;text-shadow:0 0 12px #ff8a3a88;vertical-align:-4px}
.exec-count span{font-weight:700}
.exec-tally.reached .exec-count b{color:#fff;text-shadow:0 0 10px #fff,0 0 26px #ff5a1a,0 0 60px #c0200a;animation:doom-slam .5s cubic-bezier(.16,1,.3,1)}
.exec-slots{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 14px}
.exec-slot{position:relative;display:grid;justify-items:center;align-content:start;gap:4px;width:64px;min-height:78px;padding-top:4px;box-sizing:border-box;border:1px dashed #e8913a55;border-radius:10px;background:#0000002a}
.exec-slot img{width:44px;height:44px;border-radius:50%;opacity:0}
.exec-slot small{max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:var(--name-color,#d9c2b2);opacity:0}
.exec-slot.need::after{content:"NEEDED";position:absolute;top:calc(100% + 3px);left:-6px;right:-6px;text-align:center;font-size:9px;letter-spacing:.14em;color:#e8913a99}
.exec-slot.on{border-style:solid;border-color:#ffb46a;background:radial-gradient(#ff8a3a2a,#00000033 70%);animation:exec-pop .45s cubic-bezier(.16,1,.3,1) both}
.exec-slot.on img,.exec-slot.on small{opacity:1}
.exec-slot.on::before{content:"YES";position:absolute;top:-8px;right:-6px;padding:1px 5px;border-radius:6px;background:#e8913a;color:#1a0d08;font:800 9px/1.4 system-ui,sans-serif;letter-spacing:.08em}
.exec-tally.reached .exec-slot.need{border-color:#fff1dc;box-shadow:0 0 18px #ff8a3a,inset 0 0 12px #ff8a3a66}
.exec-tally.reached .exec-slot.need::after{content:"THRESHOLD";color:#ffc58a}
.exec-tripwire{font:900 clamp(44px,7vw,88px)/1 Impact,"Arial Black",sans-serif;letter-spacing:.08em;color:#ffe2c2;text-align:center;text-shadow:0 0 10px #ff8a3a,0 0 40px #c0200a;animation:doom-slam .6s cubic-bezier(.16,1,.3,1) both}
.exec-cut .exec-tally{opacity:.35;scale:.94}
.exec-exam{margin:6px 0 0;color:#c9a58f;font-style:italic;letter-spacing:.03em;animation:doom-rise .7s ease-out both}
/* The condemned: absent during the count, then trembling on the block, then struck down. */
.is-exec .dialogue-art{opacity:0}
.is-exec .dialogue-art canvas{animation:none}
.exec-cut .dialogue-art{animation:doom-appear .6s cubic-bezier(.2,.8,.2,1) both}
.exec-cut:not(.exec-struck) .dialogue-art canvas{animation:doom-tremble .12s linear infinite}
.exec-cut .dialogue-art::before{content:"";position:absolute;inset:14% 6% 0;border-radius:50%;background:radial-gradient(#ff8a3a44,transparent 70%);filter:blur(14px);z-index:-1}
.exec-struck .dialogue-art canvas{animation:exec-fall 1.1s cubic-bezier(.2,.9,.25,1) both;filter:grayscale(.55) brightness(.75) drop-shadow(0 0 10px #ff5a1a)}
#robot-dialogue.exec-thud{animation:exec-thud .3s cubic-bezier(.3,.6,.3,1)}
#robot-dialogue.exec-slam{animation:doom-quake .6s cubic-bezier(.3,.6,.3,1)}
@keyframes exec-pop{0%{opacity:0;transform:translateY(-14px) scale(1.5)}60%{opacity:1;transform:scale(.94)}100%{transform:none}}
@keyframes exec-fall{0%{transform:scale(1.06);filter:brightness(3.5) saturate(0)}20%{transform:translate(-4px,0)}40%{transform:translate(3px,3px)}100%{transform:translate(0,12px) rotate(-4deg)}}
@keyframes exec-thud{0%,100%{translate:0 0}30%{translate:0 5px}60%{translate:0 -2px}}
@media(max-width:600px){.exec-slots{gap:8px}.exec-slot{width:54px;min-height:68px}.exec-slot img{width:36px;height:36px}.exec-slot small{max-width:50px}}

/* VICTORY: the verdict spelled out, then each seat turns over to its true role. */
.victory-veil{position:fixed;inset:0;z-index:99;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 100%,var(--victory-glow,#4cbb6533) 0,#050a0ccc 55%,#000000ee 100%);animation:doom-veil-in 1.2s ease-out both}
.victory-veil.still{animation:none}
body:has(#robot-dialogue[data-winner=human]) .victory-veil{--victory-glow:#df4b5040}
#robot-dialogue.is-victory{--alignment:#4cbb65;--victory-ink:#d8ffe0;--victory-glow:#4cbb65}
#robot-dialogue.is-victory[data-winner=human]{--alignment:#df4b50;--victory-ink:#ffe6c8;--victory-glow:#ff7a3a}
.is-victory .dialogue-art{display:none}
#robot-dialogue.is-victory .dialogue-copy{max-height:calc(100dvh - 90px);overflow-y:auto;border-color:var(--alignment);background:radial-gradient(ellipse at 50% -20%,color-mix(in srgb,var(--alignment) 22%,transparent),transparent 60%),linear-gradient(135deg,#141d22,#0b1014);box-shadow:0 0 0 1px #ffffff14,0 12px 60px #000c,0 0 80px color-mix(in srgb,var(--alignment) 35%,transparent)}
#robot-dialogue.is-victory .dialogue-nameplate{text-align:center;border-bottom-color:color-mix(in srgb,var(--alignment) 40%,transparent)}
#robot-dialogue.is-victory .dialogue-nameplate h2{color:var(--victory-ink)}
#robot-dialogue.is-victory .dialogue-line{margin:0}
.victory-reason{min-height:1.5em;margin:6px 0 0;text-align:center;color:#c8d2d6;font-size:15px}
.victory-reason:not(:empty){animation:doom-rise .6s ease-out both}
#robot-dialogue.is-victory:not(.victory-done) .dialogue-copy>button{visibility:hidden}
.victory-title{display:flex;flex-wrap:wrap;justify-content:center;margin:6px 0 4px;font:900 clamp(34px,6vw,78px)/1.05 "Georgia","Times New Roman",serif;letter-spacing:.06em;color:var(--victory-ink);user-select:none}
.victory-gap{width:.45em}
.victory-letter{display:inline-block;opacity:0;text-shadow:0 0 8px var(--victory-glow),0 0 30px color-mix(in srgb,var(--victory-glow) 70%,transparent),0 4px 0 #0008}
.victory-letter.on{opacity:1;animation:victory-drop .45s cubic-bezier(.16,1,.3,1) both}
.victory-title.spoken .victory-letter{animation:victory-drop .45s cubic-bezier(.16,1,.3,1) both,victory-shine 2.8s ease-in-out .5s infinite}
.victory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,120px));justify-content:center;gap:14px 10px;margin:18px 0 8px;padding:0;list-style:none}
.victory-seat{display:grid;justify-items:center;gap:2px;text-align:center;min-width:0}
.victory-seat strong{max-width:100%;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.victory-role,.victory-result{opacity:0;transition:opacity .4s .35s}
.victory-role{font-size:12px;color:var(--alignment);font-style:italic}
.victory-result{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#8a969b}
.victory-seat[data-result=won] .victory-result{color:#9be8ae}
.victory-seat[data-result=lost] .victory-result{color:#e0868a}
.victory-seat.flipped .victory-role,.victory-seat.flipped .victory-result{opacity:1}
.victory-flip{position:relative;display:block;width:100%;max-width:112px;aspect-ratio:1;perspective:600px}
.victory-face{position:absolute;inset:0;border:2px solid var(--alignment,#ffffff22);border-radius:50%;overflow:hidden;background:radial-gradient(#ffffff10,#00000055 70%);backface-visibility:hidden;transition:transform .7s cubic-bezier(.3,1.3,.5,1)}
.victory-face[data-alignment=unknown]{--alignment:#ffffff2a}
.victory-face canvas{display:block;width:100%;height:100%}
.victory-face.back{transform:rotateY(180deg)}
.victory-seat.flipped .victory-face.front{transform:rotateY(-180deg)}
.victory-seat.flipped .victory-face.back{transform:rotateY(0)}
.victory-seat.flipped[data-result=won] .victory-face.back{box-shadow:0 0 18px var(--alignment),inset 0 0 14px color-mix(in srgb,var(--alignment) 40%,transparent)}
.victory-seat[data-result=lost] .victory-face.back canvas{filter:grayscale(.6) brightness(.72)}
@keyframes victory-drop{0%{opacity:0;transform:translateY(-.5em) scale(1.8);filter:blur(8px)}55%{opacity:1;transform:scale(.94);filter:blur(0)}100%{opacity:1;transform:none}}
@keyframes victory-shine{0%,100%{filter:brightness(1)}50%{filter:brightness(1.35)}}
@media(max-width:600px){.victory-grid{grid-template-columns:repeat(auto-fit,minmax(70px,86px));gap:10px 6px}.victory-seat strong{font-size:11px}.victory-role{font-size:10px}.victory-title{font-size:clamp(28px,9vw,44px)}}
@media(prefers-reduced-motion:reduce){.exec-veil,.exec-veil::after,.victory-veil,.exec-slot.on,.exec-tripwire,.exec-exam,.exec-tally.reached .exec-count b,.is-exec .dialogue-art,.is-exec .dialogue-art canvas,#robot-dialogue.exec-thud,#robot-dialogue.exec-slam,.victory-letter,.victory-letter.on,.victory-title.spoken .victory-letter,.victory-reason{animation:none!important}.victory-face,.victory-role,.victory-result,.exec-tally{transition:none!important}.exec-cut .dialogue-art{opacity:1}}
.portraits-still .exec-veil,.portraits-still .exec-veil::after,.portraits-still .victory-veil,.portraits-still .exec-slot.on,.portraits-still .exec-tripwire,.portraits-still .exec-exam,.portraits-still .exec-tally.reached .exec-count b,.portraits-still .is-exec .dialogue-art,.portraits-still .is-exec .dialogue-art canvas,.portraits-still #robot-dialogue.exec-thud,.portraits-still #robot-dialogue.exec-slam,.portraits-still .victory-letter,.portraits-still .victory-title.spoken .victory-letter,.portraits-still .victory-reason{animation:none!important}.portraits-still .victory-face,.portraits-still .victory-role,.portraits-still .victory-result,.portraits-still .exec-tally{transition:none!important}.portraits-still .exec-cut .dialogue-art{opacity:1}
