/* Comeback's look (Doug picked it on 1 Oct, mockup cb-a in /mockups/looks.html): a late-night game show.
   Red velvet, gold signs and buttons, cream answer cards, a row of marquee bulbs along the top and a soft spotlight.
   Anton (tall condensed capitals) for titles, prompts and buttons; Inter for everything else.
   Everything here is scoped to body[data-mode="comeback"] and only re-dresses app.css: same layout and motion,
   new colors, type and a few touches. Letter Line's look is looks/letters.css. */
@font-face { font-family: Anton; src: url(/fonts/Anton.woff2) format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: Inter; src: url(/fonts/Inter.woff2) format('woff2'); font-weight: 400 800; font-display: swap; }

html:has(> body[data-mode="comeback"]) { background: #22030a; }
body[data-mode="comeback"] {
  --bg: #22030a;
  --bg2: #4a0612;
  --panel: #3a0610;
  --panel2: #57101d;
  --line: #9a6a3a;
  --ink: #2a0409;
  --text: #fff4d6;
  --soft: #f1cfb4;
  --accent: #ffd76a;
  --pink: #c8102e;
  --teal: #f3d79a;
  --violet: #c8962a;
  --good: #7ee08f;
  --radius: 6px;
  --gold-deep: #7a4b00;
  --wine: #3a0710;
  --sign: Anton, Impact, 'Arial Narrow Bold', sans-serif;
  color-scheme: dark;
  font: 500 18px/1.45 Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background:
    radial-gradient(42% 52% at 50% 0%, #fff6d930, transparent 72%),
    repeating-linear-gradient(90deg, #00000000 0, #00000026 18px, #00000000 36px),
    radial-gradient(120% 70% at 50% 0%, #8e1022 0%, #4a0612 55%, #22030a 100%);
  background-color: #22030a;
  background-attachment: fixed;
}

/* Marquee bulbs along the top of every page: a lit row, and every other bulb flashing brighter in turn. */
body[data-mode="comeback"]::before, body[data-mode="comeback"]::after {
  content: ''; position: fixed; z-index: 25; top: 0; height: 18px; pointer-events: none;
}
body[data-mode="comeback"]::before {
  left: 0; right: 0;
  background: radial-gradient(circle, #ffe9a3 0 4px, #c8962a 5px, transparent 6px) 0 0 / 22px 18px;
  filter: drop-shadow(0 0 6px #ffd76a);
}
body[data-mode="comeback"]::after {
  left: -22px; right: -22px;
  background: radial-gradient(circle, #fffdf2 0 3px, #fff3c4cc 4px, transparent 7px) 0 0 / 44px 18px;
  animation: cbChase 1.4s steps(1, end) infinite;
}
@keyframes cbChase { 50% { transform: translateX(22px); } }

/* ---------- type: Anton for signs, Inter for reading ---------- */
body[data-mode="comeback"] :is(h1, h2, .title, .prompt, button, .tag, .rc-num, .big-code, .vs, .ribbon, .big-pts, .logo-word,
  .mast-name, .mast-sub, .pts, .num, .js-n, .letter, .rank, .sc, .gain, .tv-big, .mode-badge b, .flash-card, .qr p, .block, .ptimer > b, .ring b) {
  font-family: var(--sign); font-weight: 400; text-transform: uppercase; letter-spacing: .03em;
}
body[data-mode="comeback"] h1, body[data-mode="comeback"] h2 { color: var(--accent); text-shadow: 0 2px 0 var(--gold-deep); letter-spacing: .02em; }
body[data-mode="comeback"] a { color: var(--accent); }

/* ---------- buttons, boxes, cards ---------- */
body[data-mode="comeback"] button {
  border: 0; border-radius: 6px; color: var(--wine); font-size: 22px; letter-spacing: .08em;
  background: var(--accent) linear-gradient(180deg, #fff1bd 0%, #ffd76a 55%, #f0b93a 100%);
  box-shadow: 0 4px 0 var(--gold-deep), 0 0 20px #ffd76a55;
}
body[data-mode="comeback"] button:active:not(:disabled) { box-shadow: 0 1px 0 var(--gold-deep), 0 0 14px #ffd76a44; }
body[data-mode="comeback"] button.pink { color: var(--wine); text-shadow: none; background: var(--accent) linear-gradient(180deg, #fff1bd 0%, #ffd76a 55%, #f0b93a 100%); box-shadow: 0 4px 0 var(--gold-deep), 0 0 28px #ffd76a99; }
body[data-mode="comeback"] button.teal { color: var(--wine); background: #fff4d6 linear-gradient(180deg, #fffaf0, #f3d79a); box-shadow: 0 4px 0 var(--gold-deep); }
body[data-mode="comeback"] button.quiet { background: #2a040999; color: var(--text); border: 2px solid #ffd76a80; box-shadow: none; font-size: 17px; letter-spacing: .1em; }
body[data-mode="comeback"] button.small { font-size: 16px; }
body[data-mode="comeback"] input, body[data-mode="comeback"] textarea {
  background: #fff4d6; color: var(--wine); border: 3px solid var(--accent); border-radius: 6px; box-shadow: inset 0 3px 0 #3a071014, 0 0 18px #ffd76a2e;
}
body[data-mode="comeback"] input::placeholder, body[data-mode="comeback"] textarea::placeholder { color: #8a5a4a; }
body[data-mode="comeback"] .card { background: linear-gradient(165deg, #57101de6, #2a0409e6); border: 2px solid #ffd76a59; border-radius: 8px; box-shadow: 0 10px 28px #0007, inset 0 1px 0 #ffd76a26; }
body[data-mode="comeback"] .tag { background: #2a0409; color: var(--accent); border: 2px solid var(--accent); border-radius: 4px; box-shadow: 0 0 14px #ffd76a33; letter-spacing: .16em; }
body[data-mode="comeback"] .tag.pink { background: var(--pink); color: #fff4d6; }

/* timers */
body[data-mode="comeback"] .ptimer #secs { background: #2a0409; border-color: #ffd76a80; font-size: 20px; }
body[data-mode="comeback"] .ptimer.urgent #secs { background: var(--pink); color: #fff4d6; border-color: var(--accent); }
body[data-mode="comeback"] .ring .ring-track { fill: #2a0409cc; stroke: #ffd76a2e; }
body[data-mode="comeback"] .ring.urgent .ring-fill { stroke: #ff4d66; }

/* logo and masthead: the show's name lit up in gold */
body[data-mode="comeback"] .logo-word { color: var(--accent); text-shadow: 0 3px 0 var(--gold-deep), 0 0 24px #ffb30088; letter-spacing: .02em; }
.masthead { display: none; }
body[data-mode="comeback"] .masthead { display: flex; flex-direction: column; align-items: center; text-align: center; line-height: 1; min-width: 0; }
body[data-mode="comeback"] .mast-name { font-size: 34px; color: var(--accent); text-shadow: 0 3px 0 var(--gold-deep), 0 0 24px #ffb30088; letter-spacing: .03em; }
body[data-mode="comeback"] .mast-sub { margin-top: 4px; font-size: 11px; letter-spacing: .26em; color: #ffb3b3; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- phone ---------- */
body[data-mode="comeback"] .phone { padding-top: 28px; }
body[data-mode="comeback"] .phone .back-row .masthead { flex: 1; }
body[data-mode="comeback"] .phone h1 { font-size: 32px; line-height: 1.1; }
body[data-mode="comeback"] .phone .prompt {
  font-size: 26px; line-height: 1.15; text-align: center; color: #fff4d6; background: #2a0409cc;
  border: 3px solid var(--accent); border-radius: 6px; padding: 18px; box-shadow: 0 0 26px #ffd76a2e, inset 0 0 30px #0000006b;
}
body[data-mode="comeback"] .phone .prompt::before { display: none; }
body[data-mode="comeback"] .phone .choice {
  font-family: Inter, system-ui, sans-serif; font-weight: 700; text-transform: none; letter-spacing: 0; font-size: 20px;
  color: var(--wine); background: linear-gradient(#fff4d6, #f3d79a); border: 0; border-radius: 6px; box-shadow: 0 4px 0 var(--gold-deep);
}
body[data-mode="comeback"] .phone .choice.c1 { background: linear-gradient(#fff4d6, #efcb84); }
body[data-mode="comeback"] .phone .choice .letter { color: #fff4d6; background: var(--pink); border: 0; box-shadow: 0 2px 0 #5a0412; font-size: 21px; }
body[data-mode="comeback"] .phone .choice.c1 .letter { color: var(--accent); background: #2a0409; }
body[data-mode="comeback"] .phone .choice.picked { background: #fffaf0; box-shadow: 0 0 0 4px var(--accent), 0 0 26px #ffd76aaa, 0 4px 0 var(--gold-deep); }
body[data-mode="comeback"] .phone .choice .stamp { border-width: 2px; color: var(--ink); }
body[data-mode="comeback"] .phone .choice .muted { color: #7a4a3a; }
body[data-mode="comeback"] .phone .me .pts { color: var(--wine); border: 0; box-shadow: 0 2px 0 var(--gold-deep), 0 0 12px #ffd76a55; font-size: 18px; padding: 2px 12px; }
body[data-mode="comeback"] .phone .mini-board > div { background: #2a040999; border: 1px solid #ffd76a26; border-radius: 6px; }
body[data-mode="comeback"] .phone .mini-board .me-row { background: #ffd76a26; box-shadow: inset 0 0 0 2px var(--accent); }
body[data-mode="comeback"] .phone .mini-board .sc { font-size: 22px; }
body[data-mode="comeback"] .phone .result { color: var(--wine); background: linear-gradient(#fff4d6, #f3d79a); border: 0; border-radius: 6px; box-shadow: 0 4px 0 var(--gold-deep); }
body[data-mode="comeback"] .phone .result.c1 { background: linear-gradient(#fff4d6, #efcb84); }
body[data-mode="comeback"] .phone .result .by { color: #5a2a20; }
body[data-mode="comeback"] .phone .result .vc { color: #6a3a2a; }
body[data-mode="comeback"] .phone .result .by .pts { color: var(--wine); background: var(--accent); border: 2px solid var(--gold-deep); }
body[data-mode="comeback"] .phone .result .muted { color: #7a4a3a; }
body[data-mode="comeback"] .phone .result.win { box-shadow: 0 0 0 4px var(--accent), 0 0 26px #ffd76aaa, 0 4px 0 var(--gold-deep); }
body[data-mode="comeback"] .phone .result.mine { outline: 2px dashed #7a4b00; outline-offset: -7px; }
body[data-mode="comeback"] .phone :is(.moment-card, .rank-card) { background: linear-gradient(165deg, #5a0a18, #2a0409); border: 2px solid #ffd76a59; border-radius: 8px; box-shadow: 0 10px 28px #0007; }
body[data-mode="comeback"] .phone :is(.moment-card.win, .rank-card.p1) { border-color: var(--accent); background: radial-gradient(90% 70% at 50% 0%, #b3142c, #4a0612 70%, #2a0409); box-shadow: 0 0 40px #ffd76a44; }
body[data-mode="comeback"] .phone .big-pts { font-size: 46px; text-shadow: 0 3px 0 var(--gold-deep), 0 0 20px #ffb30066; }
body[data-mode="comeback"] .phone .big-pts small { font-family: Inter, sans-serif; text-transform: none; }
body[data-mode="comeback"] .phone .rank-card .ribbon { color: var(--wine); border: 0; border-radius: 4px; box-shadow: 0 3px 0 #0007; }
body[data-mode="comeback"] .flash-card { background: var(--accent); color: var(--wine); border: 0; border-radius: 8px; box-shadow: 0 6px 0 var(--gold-deep), 0 0 40px #ffd76a; letter-spacing: .06em; font-size: 30px; }
body[data-mode="comeback"] .phone .mode-chip { color: var(--text); background: linear-gradient(165deg, #5a0a18, #2a0409); border: 2px solid #ffd76a4d; box-shadow: 0 4px 0 #0007; }
body[data-mode="comeback"] .phone .mode-chip .mode-name { font-size: 24px; letter-spacing: .05em; }
body[data-mode="comeback"] .phone .mode-chip .mode-blurb { font-family: Inter, sans-serif; text-transform: none; letter-spacing: 0; font-weight: 500; }
body[data-mode="comeback"] .phone .mode-chip.on { border-color: var(--accent); background: radial-gradient(100% 80% at 50% 0%, #a3122a, #3a0610); box-shadow: 0 0 0 3px var(--accent), 0 0 30px #ffd76a66; }
body[data-mode="comeback"] .phone .mode-chip .mode-check { border-width: 2px; }
body[data-mode="comeback"] .phone .pick-label { color: var(--soft); }
body[data-mode="comeback"] .phone .level-chip { background: linear-gradient(165deg, #5a0a18, #2a0409); border: 2px solid #ffd76a4d; border-radius: 8px; }
body[data-mode="comeback"] .phone .level-chip b { font-size: 20px; letter-spacing: .05em; }
body[data-mode="comeback"] .phone .level-chip small { font-family: Inter, sans-serif; text-transform: none; letter-spacing: 0; }
body[data-mode="comeback"] .phone .level-chip.on { border-color: var(--accent); background: radial-gradient(100% 80% at 50% 0%, #a3122a, #3a0610); box-shadow: 0 0 0 3px var(--accent), 0 0 24px #ffd76a55; }
body[data-mode="comeback"] .screen .mode-badge .level-pill { border-radius: 6px; color: var(--accent); }
body[data-mode="comeback"] .screen .mode-badge .level-pill.lv-hard { background: var(--accent); color: var(--wine); border-color: var(--accent); }
body[data-mode="comeback"] .phone details summary { color: var(--soft); }
body[data-mode="comeback"] .phone .who { border-bottom-color: #ffd76a33; }

/* ---------- shared screen ---------- */
body[data-mode="comeback"] .screen { padding-top: calc(1.5vh + 16px); padding-bottom: 1.4vh; }
/* The living background becomes two spotlights sweeping slowly over the stage; the party shapes stay home. */
body[data-mode="comeback"] .screen .floaty, body[data-mode="comeback"] .screen .b3 { display: none; }
body[data-mode="comeback"] .screen .blob { border-radius: 0; top: -12vh; height: 125vh; transform-origin: 50% 0; animation: cbBeam 22s ease-in-out infinite alternate; }
body[data-mode="comeback"] .screen .b1 { left: 4vw; width: 46vw; background: radial-gradient(50% 75% at 50% 0%, #fff3cf2e, #fff3cf00 70%); }
body[data-mode="comeback"] .screen .b2 { left: auto; right: 4vw; bottom: auto; width: 46vw; background: radial-gradient(50% 75% at 50% 0%, #ffd76a24, #ffd76a00 70%); animation-duration: 27s; animation-delay: -11s; }
@keyframes cbBeam { from { transform: rotate(14deg); } to { transform: rotate(-14deg); } }
body[data-mode="comeback"] .screen header { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1vw; }
body[data-mode="comeback"] .screen header > .row:last-child { justify-self: end; }
body[data-mode="comeback"] .screen header #where .logo-word { display: none; }
body[data-mode="comeback"] .screen .mast-name { font-size: clamp(30px, 3.6vw, 60px); }
body[data-mode="comeback"] .screen .mast-sub { font-size: clamp(12px, 1.05vw, 18px); }
body[data-mode="comeback"] .screen .title { color: var(--accent); text-shadow: 0 5px 0 var(--gold-deep), 0 0 40px #ffb30066; letter-spacing: .02em; line-height: 1; }
body[data-mode="comeback"] .screen .prompt {
  color: #fff4d6; text-align: center; line-height: 1.12; letter-spacing: .02em; text-shadow: 0 3px 0 #0007;
  background: #2a0409cc; border: 3px solid var(--accent); border-radius: 8px; padding: .22em .7em;
  box-shadow: 0 0 40px #ffd76a2e, inset 0 0 40px #00000080;
}
body[data-mode="comeback"] .screen .lead, body[data-mode="comeback"] .screen .context { color: var(--soft); }
body[data-mode="comeback"] .screen .big-code {
  color: var(--wine); border: 0; border-radius: 10px; letter-spacing: .16em; padding: .1em .32em .08em;
  background: linear-gradient(180deg, #fff1bd, #ffd76a 60%, #e9b443);
  box-shadow: 0 0 0 6px #2a0409, 0 0 0 9px var(--accent), 0 10px 0 9px var(--gold-deep), 0 0 70px #ffd76a77;
}
body[data-mode="comeback"] .screen .qr { border: 5px solid var(--accent); border-radius: 10px; box-shadow: 0 0 40px #ffd76a55, 0 8px 0 var(--gold-deep); }
body[data-mode="comeback"] .screen .qr p { color: var(--wine); font-size: clamp(16px, 1.4vw, 24px); letter-spacing: .08em; }
body[data-mode="comeback"] .screen .mode-badge { background: linear-gradient(165deg, #5a0a18, #2a0409); border: 3px solid var(--accent); border-radius: 10px; box-shadow: 0 0 40px #ffd76a44; }
body[data-mode="comeback"] .screen .mode-badge b { color: var(--accent); text-shadow: 0 3px 0 var(--gold-deep); letter-spacing: .03em; }
body[data-mode="comeback"] .mode-now small, body[data-mode="comeback"] .mode-badge small { color: var(--soft); }
body[data-mode="comeback"] .join-steps .js-n { background: var(--accent); color: var(--wine); border: 0; box-shadow: 0 0 14px #ffd76a77; }
body[data-mode="comeback"] .screen .crowd-chip { background: #2a0409cc; border: 2px solid #ffd76a59; }

/* Round title card: a velvet stage card framed by a ring of bulbs. */
body[data-mode="comeback"] .screen .round-card {
  border: 4px solid var(--accent); border-radius: 14px;
  background: radial-gradient(110% 90% at 30% 0%, #b3142c, #4a0612 60%, #22030a);
  box-shadow: 0 0 0 8px #2a0409, 0 0 70px #ffd76a55, 0 30px 80px #0009;
}
body[data-mode="comeback"] .screen .round-card.r2 { background: radial-gradient(110% 90% at 30% 0%, #8e1022, #3a0610 60%, #1a0207); }
body[data-mode="comeback"] .screen .round-card.r3 { background: radial-gradient(110% 90% at 30% 0%, #c41a36, #5a0a18 60%, #22030a); }
body[data-mode="comeback"] .screen .round-card::after { content: ''; position: absolute; inset: 10px; border: 7px dotted #ffe9a3; border-radius: 8px; filter: drop-shadow(0 0 5px #ffd76a); pointer-events: none; }
body[data-mode="comeback"] .screen .round-card .rc-art, body[data-mode="comeback"] .screen .round-card .rc-text { z-index: 1; }
body[data-mode="comeback"] .screen .rc-num { color: var(--accent); letter-spacing: .2em; }
body[data-mode="comeback"] .screen .rc-num span { color: var(--soft); }

/* Answer cards: cream cards on a gold edge. */
body[data-mode="comeback"] .acard { color: var(--wine); background: linear-gradient(#fff4d6, #f3d79a); border: 0; border-radius: 8px; box-shadow: 0 8px 0 var(--gold-deep), 0 22px 44px #0008; }
body[data-mode="comeback"] .acard.c1 { background: linear-gradient(#fff4d6, #efcb84); }
body[data-mode="comeback"] .acard .letter { color: #fff4d6; background: var(--pink); border: 3px solid var(--accent); box-shadow: 0 3px 0 #5a0412, 0 0 16px #ffd76a66; }
body[data-mode="comeback"] .acard.c1 .letter { color: var(--accent); background: #2a0409; }
body[data-mode="comeback"] .acard.hid { color: var(--soft); background: #ffffff10; border: 3px dashed #ffd76a66; box-shadow: none; }
body[data-mode="comeback"] .acard .muted { color: #7a4a3a; }
body[data-mode="comeback"] .screen .vs { color: var(--wine); border: 4px solid var(--gold-deep); background: radial-gradient(circle at 35% 30%, #fff3c4, #ffd76a 60%, #c8962a); box-shadow: 0 6px 0 #5a0412, 0 0 40px #ffd76a88; }
body[data-mode="comeback"] .screen .acard .vbar { background: #2a0409; border: 2px solid var(--gold-deep); }
body[data-mode="comeback"] .screen .acard .vbar i { background: linear-gradient(90deg, #a00d26, #e8344e); }
body[data-mode="comeback"] .screen .acard.c1 .vbar i { background: linear-gradient(90deg, #6a4206, #a8741a); }
body[data-mode="comeback"] .screen .acard .vbar b { color: #fff4d6; text-shadow: 0 1px 2px #000c; }
body[data-mode="comeback"] .screen .acard .by { color: #5a2a20; }
body[data-mode="comeback"] .screen .acard .by .who { color: var(--wine); }
body[data-mode="comeback"] .screen .acard .pts { color: var(--wine); background: var(--accent); border: 2px solid var(--gold-deep); box-shadow: 0 2px 0 var(--gold-deep); }
body[data-mode="comeback"] .screen .acard.win { box-shadow: 0 0 0 6px var(--accent), 0 8px 0 var(--gold-deep), 0 0 80px #ffd76acc; }
body[data-mode="comeback"] .screen .twins-moment { background: radial-gradient(100% 80% at 50% 0%, #b3142c, #2a0409); border: 5px solid var(--accent); border-radius: 14px; box-shadow: 0 10px 0 #1a0207, 0 0 60px #ffd76a77; }

/* Scores and the end */
body[data-mode="comeback"] .screen .bar-row { background: #2a0409b3; border: 2px solid #ffd76a33; border-radius: 8px; }
body[data-mode="comeback"] .screen .bar-row.lead-row { background: #ffd76a1f; border-color: #ffd76a99; box-shadow: 0 0 30px #ffd76a2e; }
body[data-mode="comeback"] .screen .bar-row .rank { color: var(--soft); }
body[data-mode="comeback"] .screen .bar-row.lead-row .rank { color: var(--accent); }
body[data-mode="comeback"] .screen .bar-row .track { background: #ffffff14; border: 2px solid var(--gold-deep); }
body[data-mode="comeback"] .screen .bar-row .sc { font-size: 1.12em; letter-spacing: .04em; }
body[data-mode="comeback"] .screen .podium .block { color: var(--wine); border: 4px solid var(--gold-deep); border-radius: 8px 8px 3px 3px; }
body[data-mode="comeback"] .screen .podium .p1 .block { background: linear-gradient(180deg, #fff1bd, #ffd76a 60%, #e9b443); box-shadow: inset 0 8px 0 #ffffff66, 0 0 50px #ffd76a77, 0 10px 0 #0005; }
body[data-mode="comeback"] .screen .podium .sc { font-family: var(--sign); letter-spacing: .04em; font-size: clamp(18px, 1.9vw, 32px); }
body[data-mode="comeback"] .screen .acard.best-line { border: 0; box-shadow: 0 5px 0 var(--gold-deep), 0 14px 30px #0007; }
body[data-mode="comeback"] .screen .acard.best-line .by { color: #5a2a20; }
body[data-mode="comeback"] .screen footer { color: var(--soft); }

/* ---------- Comeback's home ---------- */
body[data-mode="comeback"] .home { padding-top: 32px; }
body[data-mode="comeback"] .home .top .logo-word { font-size: 1.15em; }
body[data-mode="comeback"] .home .lead { color: var(--text); }
body[data-mode="comeback"] .home .hero::before { background: radial-gradient(circle, #ffd76a33, transparent 65%); }
body[data-mode="comeback"] .home .play-now { border-color: var(--accent); background: radial-gradient(100% 80% at 50% 0%, #a3122a, #3a0610); box-shadow: 0 0 40px #ffd76a44, 0 10px 28px #0007; }
body[data-mode="comeback"] .home .choices h2 { font-size: 28px; }
body[data-mode="comeback"] .home .steps li { background: linear-gradient(165deg, #57101de6, #2a0409e6); border: 2px solid #ffd76a40; border-radius: 8px; }
body[data-mode="comeback"] .home .steps .num { background: var(--accent); color: var(--wine); border: 0; box-shadow: 0 0 14px #ffd76a77; }
body[data-mode="comeback"] .more-games { border-color: #ffd76a66; background: #2a040999; }

/* Room for the masthead on a 720p TV: a little less air between blocks, a smaller code, faces and winner line.
   On the phone the masthead sits between Back and Add TV, so those two get a little narrower. */
body[data-mode="comeback"] .screen main { gap: 2vh; padding: 1.4vh 0; }
body[data-mode="comeback"] .screen footer { margin-top: .6vh; }
body[data-mode="comeback"] .screen main[data-phase="lobby"] .person .avatar { width: clamp(56px, 6vw, 96px); height: auto; }
body[data-mode="comeback"] .screen main[data-phase="end"] .end-top .title { font-size: clamp(32px, min(4.4vw, 8vh), 72px); }
body[data-mode="comeback"] .screen main[data-phase="end"] .end-top .trophy { width: clamp(56px, 6vw, 96px); }
body[data-mode="comeback"] .screen main[data-phase="write"] .person .avatar { width: clamp(56px, 5.6vw, 88px); height: auto; }
body[data-mode="comeback"] .screen main[data-phase="write"] .prompt.topic { font-size: clamp(30px, 4vw, 64px); }
body[data-mode="comeback"] .screen main[data-phase="end"] .answers.best { gap: 1.2vh; }
body[data-mode="comeback"] .screen main[data-phase="end"] .acard.best-line { padding: .8vh 1.4vw; }
body[data-mode="comeback"] .screen main[data-phase="end"] .podium .p1 .block { height: 10vh; }
body[data-mode="comeback"] .screen main[data-phase="end"] .podium .p2 .block { height: 8vh; }
body[data-mode="comeback"] .screen main[data-phase="end"] .podium .p3 .block { height: 6.4vh; }
/* Anton is tall: prompts a step smaller than app.css's so a two-line prompt and ten answers still fit. */
body[data-mode="comeback"] .screen .prompt { font-size: clamp(26px, 3.4vw, 56px); }
body[data-mode="comeback"] .screen main[data-phase="reveal"] .prompt { font-size: clamp(22px, 2.6vw, 42px); }
body[data-mode="comeback"] .screen .big-code { font-size: clamp(56px, 7.2vw, 132px); }
body[data-mode="comeback"] .phone .back-row { gap: 6px; }
body[data-mode="comeback"] .phone .back-row > button { font-size: 14px; letter-spacing: .06em; padding: 6px 10px; flex: none; }
body[data-mode="comeback"] .phone .mast-name { white-space: nowrap; }
body[data-mode="comeback"] .phone .mast-sub { font-size: 9px; letter-spacing: .14em; }

/* ---------- pop-ups: leave the game, add a TV, invite ---------- */
body[data-mode="comeback"] .leave-ask { background: #120105d9; }
body[data-mode="comeback"] .tv-pop { background: #120105d9; }
body[data-mode="comeback"] .tv-pop .tv-card { background: linear-gradient(165deg, #57101d, #2a0409); color: var(--text); border: 2px solid var(--accent); border-radius: 10px; box-shadow: 0 0 40px #ffd76a44; }
body[data-mode="comeback"] .tv-pop .tv-big { color: var(--accent); font-size: 48px; letter-spacing: .16em; text-shadow: 0 3px 0 var(--gold-deep); }
body[data-mode="comeback"] .tv-hint .tv-code { color: var(--accent); }
body[data-mode="comeback"] .invite-box textarea { color: var(--wine); background: #fff4d6; border-color: var(--accent); }

/* Short screens (a phone held sideways): a smaller sign so the game keeps its room. */
@media (max-height: 500px) {
  body[data-mode="comeback"] .phone .mast-name { font-size: 26px; }
  body[data-mode="comeback"] .phone .mast-sub { font-size: 10px; margin-top: 2px; }
  body[data-mode="comeback"] .phone h1 { font-size: 28px; }
}
/* The phone's top row also holds the screen lock now: the show's name shrinks to fit narrow phones. */
body[data-mode="comeback"] .phone .back-row .mast-name { font-size: clamp(20px, 7vw, 34px); }