/* Refreshed phones: same interaction model, the owner's Arena/EWC visual language.
   Palette values live in these token blocks; components only consume tokens. */
@font-face { font-family:'Arena Phone'; src:url('/screen/fonts/geist-latin.woff2') format('woff2'); font-weight:100 900; font-display:swap; }
.phone-styled {
  --bg:#101725; --bg-2:#0a111e; --surface:#1e2c41; --surface-2:#25354d; --surface-3:#35455d;
  --text:#f5f8ff; --text-dim:#bdcce0; --text-faint:#99acc6; --on-accent:#101725;
  --tint-ink:10,17,30; --tint-gold:120,182,255; --tint-orange:120,182,255;
  --tint-orange-soft:120,182,255; --tint-on-accent:16,23,37;
  --gold:#78b6ff; --gold-bright:#a8d1ff; --orange-soft:#78b6ff;
  --line:rgba(153,172,198,.28); --line-soft:rgba(153,172,198,.18);
  --line-strong:rgba(153,172,198,.45);
  --grad-gold:linear-gradient(110deg,#a8d1ff,#78b6ff);
  --grad-warm:linear-gradient(90deg,#78b6ff,#c8e1ff);
  --grad-num:linear-gradient(110deg,#c8e1ff,#78b6ff);
  --ewc-grad:linear-gradient(110deg,#f5f8ff,#78b6ff);
  --font-body:'Arena Phone',system-ui,Arial,sans-serif;
  --font-narrow:var(--font-body); --font-display:var(--font-body);
  --phone-art:none; --phone-radius:18px;
  --answer-color:var(--info);
  --gold-glow:rgba(var(--tint-gold),.18); --orange-glow:rgba(var(--tint-orange),.18);
  --shadow-gold:0 10px 28px -16px var(--gold-glow);
  background:var(--bg); color:var(--text); font-family:var(--font-body);
}
.phone-styled[data-phone-layout='ewc26'] {
  --bg:#231f20; --bg-2:#181516; --surface:#302a2b; --surface-2:#3b3435; --surface-3:#504749;
  --text:#f7f7f7; --text-dim:#d4cbcc; --text-faint:#b7adb0; --on-accent:#231f20;
  --tint-ink:24,21,22; --tint-on-accent:35,31,32;
  --tint-gold:209,178,110; --tint-orange:255,54,0; --tint-orange-soft:255,106,44;
  --gold-bright:#e6cd97; --orange-soft:#ff6a2c;
  --gold:var(--text);
  --line:rgba(247,247,247,.22); --line-soft:rgba(247,247,247,.12); --line-strong:rgba(247,247,247,.4);
  --grad-gold:linear-gradient(110deg,#e4cc92,#d1b26e,#be8c42);
  --grad-warm:linear-gradient(90deg,#ff5a1f,#e7af5e,#d1b26e);
  --grad-num:linear-gradient(110deg,#e6cd97,#ff6a2c);
  --ewc-grad:linear-gradient(95deg,#d1b26e,#ff3600 60%,#f7f7f7);
  --font-body:'EWC Board','Arena Phone',Arial,sans-serif;
  --font-narrow:'EWC Board Narrow','Arena Phone',Arial,sans-serif;
  --font-display:'EWC Board Headline','Arena Phone',Arial,sans-serif;
  --phone-art:var(--tb-brand-art,none); --phone-radius:12px;
}
.phone-styled[data-phone-layout='ewc26'].lang-ar {
  --font-display:'EWC Board Arabic','EWC Board',Arial,sans-serif;
  --font-narrow:'EWC Board Arabic','EWC Board','Arena Phone',Arial,sans-serif;
}
.phone-styled::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg,rgba(var(--tint-ink),.80),rgba(var(--tint-ink),.96)),var(--phone-art) center/cover;
}
.phone-styled > :is(.game-screen,.join-screen) { position:relative; }
.phone-styled .join-screen { overflow:auto; justify-content:safe center; padding:calc(env(safe-area-inset-top) + 24px) 20px calc(env(safe-area-inset-bottom) + 24px); gap:14px; }
.phone-styled .join-screen::before,.phone-styled .join-screen::after { display:none; }
.phone-styled .join-card { padding:24px; background:linear-gradient(155deg,var(--surface-2),var(--surface)); border-color:var(--line); border-radius:var(--phone-radius); box-shadow:var(--shadow); flex-shrink:0; }
.phone-styled :is(.join-tag,.game-signoff,.play-game-logo) { display:none !important; }
.phone-styled .join-logo-img { width:116px; max-height:30px; object-fit:contain; filter:none; margin:0; }
.phone-styled .join-brand-row { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.phone-styled .join-stage { display:none; }
.phone-styled .join-title { font-size:34px; line-height:1.15; margin:24px 0; color:var(--text); background:none; text-align:start; overflow-wrap:anywhere; }
.phone-styled #joinForm .join-title { font:700 34px/1.15 var(--font-narrow); }
.phone-styled .join-brief { padding:12px; margin:0 0 20px; background:var(--bg-2); border:1px solid var(--line-soft); border-radius:10px; text-align:start; font:400 14px/1.5 var(--font-body); overflow-wrap:anywhere; }
.phone-styled .join-name-input { position:relative; }
.phone-styled .join-name-input > svg { position:absolute; inset-inline-start:16px; top:50%; transform:translateY(-50%); width:20px; height:20px; color:var(--text-dim); pointer-events:none; }
.phone-styled #nameInput { padding-inline:48px 14px; min-height:56px; }
.phone-styled #nameInput:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
.phone-styled #nameInput[aria-invalid='true'] { border-color:var(--danger); outline-color:var(--danger); }
.phone-styled .join-name-meta { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:12px; margin-top:10px; font:400 13px/1.45 var(--font-body); color:var(--text-dim); }
.phone-styled #nameCount { white-space:nowrap; font-variant-numeric:tabular-nums; color:var(--text-faint); }
.phone-styled #joinBtn { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:56px; margin-top:20px; padding:14px 18px; border-radius:10px; white-space:normal; text-align:start; font-weight:700; }
.phone-styled .join-btn-arrow { width:20px; height:20px; flex:none; }
.phone-styled .join-busy { display:none; width:20px; height:20px; flex:none; border:3px solid currentColor; border-right-color:transparent; border-radius:50%; animation:spin .8s linear infinite; }
.phone-styled #joinBtn[aria-busy='true'] { opacity:.8; }
.phone-styled #joinBtn[aria-busy='true'] .join-btn-arrow { display:none; }
.phone-styled #joinBtn[aria-busy='true'] .join-busy { display:block; }
.phone-styled .join-error { min-height:42px; margin:14px 0 0; border:1px solid transparent; border-radius:10px; font:500 14px/1.4 var(--font-body); overflow-wrap:anywhere; color:var(--danger-soft); }
.phone-styled .join-error:empty { min-height:0; margin:0; border:0; }
.phone-styled .join-error:not(:empty) { padding:10px 12px; border-color:var(--danger); background:rgba(var(--tint-danger),.08); }
.phone-styled .join-footer { max-width:100%; padding:10px 14px; border:1px solid var(--line); border-radius:10px; background:var(--surface); text-align:center; font-size:14px; overflow-wrap:anywhere; }
/* EWC join follows the supplied charcoal/off-white artwork and typography. */
.phone-styled[data-phone-layout='ewc26'] .join-card { background:var(--bg); border-radius:4px; box-shadow:none; }
.phone-styled[data-phone-layout='ewc26'] .join-screen .join-logo-img { width:120px; max-height:30px; }
.phone-styled[data-phone-layout='ewc26'] :is(#joinForm,#noToken) .join-title {
  font:900 44px/1.1 var(--font-display); text-align:start; text-transform:uppercase; margin:20px 0 22px;
  background:none; -webkit-text-fill-color:var(--text); color:var(--text);
  text-shadow:none; filter:none; unicode-bidi:plaintext;
}
.phone-styled[data-phone-layout='ewc26'].lang-ar :is(#joinForm,#noToken) .join-title { font-size:42px; line-height:1.3; }
.phone-styled[data-phone-layout='ewc26'] .join-screen :is(.join-brief,.no-token-icon,.join-error,.join-footer) { border-radius:4px; }
.phone-styled[data-phone-layout='ewc26'] .join-screen .field > label { font-family:var(--font-narrow); }
.phone-styled[data-phone-layout='ewc26'] #nameInput { border-radius:2px; }
.phone-styled[data-phone-layout='ewc26'].lang-ar #nameInput { font-family:var(--font-narrow); }
.phone-styled[data-phone-layout='ewc26'] #joinBtn { background:var(--text); color:var(--bg); border-color:var(--text); border-radius:2px; box-shadow:none; font-family:var(--font-narrow); font-size:18px; text-transform:uppercase; transition:transform .12s ease,opacity .15s ease,filter .15s ease; }
.phone-styled .conn-dot { flex:none; box-shadow:none; }
.phone-styled #noToken { text-align:center; }
.phone-styled #noToken .join-logo-img { margin:0 auto; }
.phone-styled #noToken .join-title { font:700 32px/1.2 var(--font-narrow); text-align:center; margin:20px 0 14px; }
.phone-styled .no-token-icon { display:grid; place-items:center; width:88px; height:88px; margin:28px auto 0; border:1px solid var(--line-strong); border-radius:var(--phone-radius); background:var(--bg-2); color:var(--text); }
.phone-styled .no-token-icon svg { width:58px; height:58px; }
.phone-styled .no-token-text { margin:0; font:400 16px/1.55 var(--font-body); overflow-wrap:anywhere; }
.phone-styled .player-connection { background:rgba(var(--tint-ink),.88); }
.phone-styled .player-connection-card { padding:28px 22px; gap:18px; border-color:var(--line); border-radius:var(--phone-radius); background:linear-gradient(155deg,var(--surface-2),var(--surface)); }
.phone-styled .player-connection-icon { width:44px; height:44px; color:var(--gold); }
.phone-styled .player-connection-card h2 { font:700 26px/1.2 var(--font-narrow); }
.phone-styled .player-connection-card p { font-size:16px; overflow-wrap:anywhere; }
.phone-styled .player-connection-card .btn { border-radius:10px; }
.phone-styled .toast { border-radius:10px; background:var(--surface); font:600 14px/1.4 var(--font-body); overflow-wrap:anywhere; }
.phone-styled .toast.success { color:var(--success); }
.phone-styled .player-banner { flex:none; padding:10px 20px; font:600 14px/1.45 var(--font-body); overflow-wrap:anywhere; }
.phone-styled .waiting-pulse { flex:none; width:44px; height:44px; border:3px solid var(--line-strong); border-top-color:var(--text); background:none; animation:spin 1s linear infinite; }
/* One fixed launch well for every game. Only the cue changes; instructions and
   lobby controls below it retain their DOM, position and scroll offset. */
.phone-styled .game-stage.phone-launch-stage { justify-content:flex-start; overflow:hidden; gap:16px; }
.phone-styled .phone-launch { flex:0 0 142px; min-height:142px; width:100%; display:grid; grid-template-rows:52px 80px; gap:10px; margin:0; text-align:center; }
.phone-styled .phone-launch .phone-launch-label.stage-headline { display:flex; align-items:center; justify-content:center; min-width:0; font:700 23px/1.12 var(--font-narrow); text-transform:none; overflow-wrap:anywhere; unicode-bidi:plaintext; }
.phone-styled .phone-launch-cue { display:grid; place-items:center; min-width:0; }
.phone-styled .phone-launch .cd-num-play { margin:0; width:100%; font:900 60px/1 var(--font-display); font-variant-numeric:tabular-nums; animation:none; }
.phone-styled[data-phone-layout='ewc26'] .phone-launch .cd-num-play { font-size:72px; }
.phone-styled .phone-launch [hidden] { display:none !important; }
.phone-styled .phone-launch-body { flex:1 1 0; min-height:0; width:100%; max-width:420px; align-self:center; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--line-strong) transparent; }
.phone-styled .guide-card.guide-compact { display:grid; grid-template-columns:32px minmax(0,1fr); align-content:start; gap:0 10px; padding:16px; min-height:0; max-height:none; overflow:visible; animation:none; box-shadow:none; text-align:start; }
.phone-styled .guide-compact .guide-badge { grid-column:1; grid-row:1/3; align-self:center; width:32px; height:32px; font-size:18px; margin:0; }
.phone-styled .guide-compact :is(.guide-kicker,.guide-title) { grid-column:2; min-width:0; overflow-wrap:anywhere; }
.phone-styled .guide-compact .guide-kicker { display:none; }
.phone-styled .guide-compact .guide-title { grid-row:1/3; align-self:center; margin:0; font:700 21px/1.15 var(--font-narrow); }
.phone-styled .guide-compact .guide-goal { grid-column:1/-1; max-width:none; margin:12px 0; font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
.phone-styled .guide-compact .guide-steps { grid-column:1/-1; gap:8px; }
.phone-styled .guide-compact .guide-step { min-width:0; padding:8px 10px; gap:10px; animation:none; }
.phone-styled .guide-compact .guide-step-ico { display:none; }
.phone-styled .guide-compact .guide-step-t { min-width:0; font-size:14px; line-height:1.35; overflow-wrap:anywhere; }
.phone-styled .guide-compact .guide-demo-slot { grid-column:1/-1; min-width:0; }
/* The gesture occupies the three-step area, below the fixed launch slot. */
.play-body .gd-gesture { width:100%; padding:8px 6px; border:1px solid var(--line-soft); border-radius:10px; background:var(--bg-2); direction:ltr; }
.play-body .gdg-scenes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; list-style:none; margin:0; padding:0; }
.play-body .gdg-scene { min-width:0; text-align:center; }
.play-body .gdg-svg { display:block; width:100%; height:96px; overflow:hidden; }
.play-body .gdg-target { fill:none; stroke:var(--text-dim); stroke-width:2; }
.play-body .gdg-target-core { fill:var(--text-dim); }
.play-body .gdg-puck { fill:var(--surface-3); stroke:var(--text); stroke-width:2; }
.play-body .gdg-finger { fill:var(--surface); stroke:var(--text); stroke-width:2; stroke-linecap:round; }
.play-body .gdg-nail { fill:none; stroke:var(--text-dim); stroke-width:1; }
.play-body .gdg-knuckle { fill:none; stroke:var(--text-dim); stroke-width:1.5; }
.play-body .gdg-anchor { fill:none; stroke:var(--text-faint); stroke-width:1.5; stroke-dasharray:3 3; }
.play-body :is(.gdg-band,.gdg-back-arrow,.gdg-forward-arrow,.gdg-arrow-head) { fill:none; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.play-body :is(.gdg-band,.gdg-back-arrow,.gdg-arrow-head) { stroke:var(--text-dim); }
.play-body .gdg-back-arrow { stroke-dasharray:4 4; }
.play-body .gdg-forward-arrow { stroke:var(--text); }
.play-body .gdg-trajectory { fill:none; stroke:var(--text-faint); stroke-width:2; stroke-dasharray:1 7; stroke-linecap:round; }
.play-body .gdg-released { opacity:.45; }
.play-body .gdg-caption { min-height:48px; padding:4px 0 0; font:600 12px/1.25 var(--font-body); color:var(--text-dim); }
.play-body .gdg-action { display:flex; align-items:center; justify-content:center; gap:4px; min-height:18px; margin-bottom:4px; }
.play-body .gdg-action span { min-width:0; overflow-wrap:anywhere; unicode-bidi:plaintext; }
.play-body .gdg-step-n { display:grid; place-items:center; flex:none; width:16px; height:16px; border-radius:50%; background:var(--grad-num); color:var(--on-accent); font:700 10px/1 var(--font-body); }
.play-body .gdg-direction { display:block; font:700 11px/1.25 var(--font-body); color:var(--text); overflow-wrap:anywhere; unicode-bidi:plaintext; }
.play-body .gdg-press-motion { animation:gdgPress 4.8s ease-in-out infinite; }
.play-body .gdg-press-ring { fill:none; stroke:var(--text); stroke-width:1.5; opacity:.7; transform-origin:48px 47px; animation:gdgContact 4.8s ease-out infinite; }
.play-body .gdg-pull-motion { transform:translateY(24px); animation:gdgPull 4.8s ease-in-out infinite; }
.play-body .gdg-pull-band { transform-origin:48px 46px; animation:gdgBand 4.8s ease-in-out infinite; }
.play-body .gdg-flight { fill:var(--text); transform:translateY(-35px); animation:gdgFlight 4.8s ease-out infinite; }
.play-body .gd-gesture[data-running='false'] * { animation-play-state:paused; }
@keyframes gdgPress { 0%,35%,100% { transform:translateY(12px); } 8%,28% { transform:translateY(0); } }
@keyframes gdgContact { 0%,8%,30%,100% { opacity:0; transform:scale(.6); } 14% { opacity:.7; transform:scale(1); } 25% { opacity:0; transform:scale(1.5); } }
@keyframes gdgPull { 0%,28%,76%,100% { transform:translateY(0); } 60%,68% { transform:translateY(24px); } }
@keyframes gdgBand { 0%,28%,76%,100% { transform:scaleY(.05); } 60%,68% { transform:scaleY(1); } }
@keyframes gdgFlight { 0%,64% { opacity:0; transform:translateY(0); } 66% { opacity:1; transform:translateY(0); } 88% { opacity:1; transform:translateY(-53px); } 94%,100% { opacity:0; transform:translateY(-53px); } }
.phone-styled .phone-launch-body .tw-lobby-pick { flex:none; justify-content:flex-start; gap:12px; padding:0 0 4px; }
.phone-styled .tw-lobby-pick .stage-headline { font-size:28px; line-height:1.15; }
.phone-styled .tw-lobby-pick .stage-sub { max-width:100%; font-size:14px; line-height:1.4; }
.phone-styled .tw-lobby-pick .tw-pick { min-height:72px; padding:12px 16px; }
.phone-styled .tw-lobby-pick .tw-pick:is(.tw-selected,:focus-visible) { outline-offset:-3px; }
.phone-styled .tw-lobby-pick .tw-pick-name { font-size:23px; line-height:1.15; }
.phone-styled .tw-lobby-pick .tw-pick-grid { gap:10px; }
.phone-styled .tw-lobby-pick .tw-lobby-status { min-height:25px; }
.phone-styled .tw-lobby-pick .tw-lobby-status.pending { visibility:hidden; }
.phone-styled .field label { font-size:14px; color:var(--text-dim); }
.phone-styled input { min-height:52px; font:500 16px/1.3 var(--font-body); border-color:var(--line); background:var(--bg-2); border-radius:10px; }
.phone-styled .btn { min-height:52px; font-size:16px; letter-spacing:.015em; text-transform:none; }
.phone-styled .game-top { min-height:62px; padding:calc(env(safe-area-inset-top) + 14px) 20px 14px; flex-shrink:0; }
.phone-styled .game-logo-img { margin:0; width:92px; height:auto; max-height:26px; object-fit:contain; }
.phone-styled .me-tag { margin:0; margin-inline-start:auto; padding:7px 10px; max-width:52%; background:var(--surface); }
.phone-styled .me-name { font:600 13px/1.2 var(--font-body); color:var(--text-dim); letter-spacing:0; }
.phone-styled .game-stage { min-height:0; padding:20px; overflow-y:auto; gap:0; }
.phone-styled .game-bottom { flex-shrink:0; padding:10px 20px calc(env(safe-area-inset-bottom) + 14px); background:var(--bg-2); }
.phone-styled .stat-row { gap:10px; }
.phone-styled .stat-card { flex-direction:row; justify-content:space-between; gap:10px; padding:12px; border-radius:10px; background:var(--surface); }
.phone-styled .stat-card-label { font:600 12px/1.2 var(--font-body); letter-spacing:0; text-transform:none; color:var(--text-dim); }
.phone-styled .stat-card-value { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:700 22px/1 var(--font-narrow); }
.phone-styled .guide-card { border-radius:var(--phone-radius); background:var(--surface); border-color:var(--line); }
.phone-styled .guide-step { background:var(--bg-2); }
.phone-styled .guide-title { line-height:1.2; }
.phone-styled .guide-status { font-size:12px; letter-spacing:0; white-space:normal; }
.phone-styled .stage-sub { font-size:15px; line-height:1.5; }
.phone-styled .stage-headline { font-size:36px; line-height:1.1; overflow-wrap:anywhere; }
.phone-styled .stage-center { flex-shrink:0; }
/* Shared end-of-round/show scenes use the same contained card in every game.
   Ordinary correct/wrong answer feedback keeps its compact original layout. */
.phone-styled .phone-summary { flex:0 0 auto; width:100%; max-width:420px; min-width:0; margin:auto; padding:28px 22px; gap:16px; border:1px solid var(--line); border-radius:var(--phone-radius); background:var(--surface); box-shadow:none; overflow-wrap:anywhere; }
.phone-styled .phone-summary .q-meta { margin:0; font:600 15px/1.4 var(--font-body); color:var(--text-dim); }
.phone-styled .phone-summary .stage-headline { font:700 clamp(26px,8vw,34px)/1.15 var(--font-narrow); margin:0; }
.phone-styled .phone-summary .stage-sub { margin:0; font:400 15px/1.55 var(--font-body); }
.phone-styled .phone-summary .stage-icon { font-size:48px; line-height:1.2; }
.phone-styled .phone-summary .st-play-rank { max-width:100%; font:800 clamp(48px,16vw,72px)/1.1 var(--font-display); font-variant-numeric:tabular-nums; filter:none; }
.phone-styled .phone-summary .st-play-move { font:700 20px/1.2 var(--font-body); }
.phone-styled .phone-summary .st-play-gain { font:700 26px/1.2 var(--font-body); filter:none; }
.phone-styled .phone-award .result-emoji { font-size:48px; }
.phone-styled .phone-award .result-title { font:600 18px/1.3 var(--font-body); margin:0; }
.phone-styled .phone-award .result-points { font:700 clamp(24px,8vw,32px)/1.15 var(--font-narrow); margin:0; color:var(--text); background:none; -webkit-text-fill-color:currentColor; filter:none; max-width:100%; }
.phone-styled .phone-award .result-meta { font:500 16px/1.4 var(--font-body); margin:0; }
.phone-styled .phone-summary .recovery-score { padding:12px; border:1px solid var(--line); border-radius:8px; background:var(--bg-2); scroll-margin-block:20px; }
.phone-styled[data-phone-layout='ewc26'] .phone-summary { border-radius:4px; background:var(--bg); }
.phone-styled .q-prompt { flex-shrink:0; font:700 23px/1.25 var(--font-narrow); text-transform:none; overflow-wrap:anywhere; margin-bottom:16px; }
.phone-styled .q-timer-row { flex-shrink:0; margin-bottom:16px; }
.phone-styled .q-timer { width:48px; height:48px; border-width:2px; font:700 24px/1 var(--font-narrow); }
.phone-styled .answers-grid { flex:1 0 auto; gap:12px; grid-auto-rows:minmax(110px,1fr); }
.phone-styled .answer-tile {
  min-width:0; min-height:110px; padding:18px 12px; border-radius:var(--phone-radius);
  background:linear-gradient(145deg,color-mix(in srgb,var(--answer-color) 24%,var(--surface)),var(--surface)) !important;
  border:1px solid color-mix(in srgb,var(--answer-color) 58%,var(--surface));
  color:var(--text); font:700 18px/1.25 var(--font-body); overflow-wrap:anywhere;
  box-shadow:none; gap:12px;
}
.phone-styled .answer-tile .shape { color:var(--answer-color); font-size:28px; }
.phone-styled .answer-tile.chosen { outline:3px solid var(--text); outline-offset:-3px; }
.phone-styled .answer-tile.dim { opacity:.4; filter:none; }
.phone-styled .answer-tile.correct { border-color:var(--success); box-shadow:inset 0 0 0 2px var(--success); }
.phone-styled .locked-banner { flex-shrink:0; font-size:15px; margin-top:16px; padding:12px; color:var(--text); border-color:var(--line); }
.phone-styled .result-card { flex:0 0 auto; width:100%; max-width:380px; align-self:center; padding:16px 0; }
.phone-styled .result-title { line-height:1.1; overflow-wrap:anywhere; }
.phone-styled .result-meta { line-height:1.5; }
/* Polls keep a vertical vote list with stable space for the vote receipt. */
.phone-styled[data-phone-game='poll'] .answers-grid { grid-auto-rows:minmax(88px,1fr); }
.phone-styled[data-phone-game='poll'] .answer-tile { flex-direction:row; justify-content:flex-start; text-align:start; min-height:88px; padding:18px; gap:16px; }
.phone-styled[data-phone-game='poll'] .answer-tile .shape { flex:none; }
.phone-styled[data-phone-game='poll'] .answer-tile > span:last-child { min-width:0; unicode-bidi:plaintext; }
/* Higher / Lower: two clear decisions, then a compact bank-or-risk card. */
.phone-styled .hl-answers { flex:1 0 auto; gap:12px; }
.phone-styled .hl-btn {
  min-width:0; min-height:110px; padding:18px; border-radius:var(--phone-radius);
  border:1px solid color-mix(in srgb,var(--answer-color) 58%,var(--surface));
  background:linear-gradient(145deg,color-mix(in srgb,var(--answer-color) 24%,var(--surface)),var(--surface)) !important;
  color:var(--text); box-shadow:none; gap:12px;
}
.phone-styled .hl-btn-arrow { color:var(--answer-color); font-size:32px; }
.phone-styled .hl-btn-word { font:700 26px/1.2 var(--font-narrow); letter-spacing:0; overflow-wrap:anywhere; }
.phone-styled .hl-btn.chosen { outline:3px solid var(--text); outline-offset:-3px; }
.phone-styled .hl-btn.dim { opacity:.4; filter:none; }
.phone-styled .hl-ride-chip { flex:none; max-width:100%; font:600 15px/1.4 var(--font-body); letter-spacing:0; text-transform:none; overflow-wrap:anywhere; background:var(--surface); }
.phone-styled .hl-final-warn { flex:none; font-size:16px; letter-spacing:0; line-height:1.4; animation:none; }
.phone-styled .hl-bank-card { flex:0 0 auto; align-self:center; width:100%; max-width:380px; padding:24px 18px; gap:20px; border:1px solid var(--line); border-radius:var(--phone-radius); background:var(--surface); }
.phone-styled .hl-bank-title { font-size:36px; line-height:1.1; overflow-wrap:anywhere; }
.phone-styled .hl-bank-potrow { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px 12px; max-width:100%; }
.phone-styled .hl-bank-potlabel { grid-column:1/-1; font:600 15px/1.3 var(--font-body); letter-spacing:0; text-transform:none; }
.phone-styled .hl-bank-pot { min-width:0; font-size:clamp(32px,12vw,54px); overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.phone-styled .hl-bank-mult { font-size:24px; }
.phone-styled .hl-bank-btn { font:700 18px/1.3 var(--font-body); max-width:none; padding:16px; }
.phone-styled .hl-bank-hint { font-size:15px; line-height:1.5; max-width:none; overflow-wrap:anywhere; }
/* Last Fan Standing keeps status and survivor counts separate from the answers. */
.phone-styled[data-phone-game='lastfan'] .game-stage:has(.lf-chip) { justify-content:safe center; }
.phone-styled .lf-chip { flex:none; max-width:100%; font:600 14px/1.3 var(--font-body); letter-spacing:0; text-transform:none; overflow-wrap:anywhere; background:var(--surface); }
.phone-styled .lf-chip::before { flex:none; box-shadow:none; }
.phone-styled .lf-live-pill { max-width:100%; flex-wrap:wrap; justify-content:center; padding:12px 16px; gap:8px; background:var(--surface); border-color:var(--line); }
.phone-styled .lf-live-pill b { min-width:0; font-size:28px; overflow-wrap:anywhere; }
.phone-styled .lf-live-pill span { font:600 14px/1.4 var(--font-body); letter-spacing:0; text-transform:none; overflow-wrap:anywhere; }
.phone-styled .lf-out-round { font:600 15px/1.4 var(--font-body); letter-spacing:0; text-transform:none; }
.phone-styled .lf-phone-question-image { flex:none; max-height:160px; margin:0 0 16px; border-radius:var(--phone-radius); background:var(--surface); }
.phone-styled .answer-tile:has(.lf-phone-answer-image) { min-height:148px; padding:12px; gap:8px; }
.phone-styled .lf-phone-answer-image { width:100%; height:90px; flex:none; object-fit:contain; }
.phone-styled .lf-phone-unavailable { font-size:14px; }
/* Emoji slots preserve complete graphemes and wrap instead of clipping. */
.phone-styled .em-play-hero { flex:none; width:100%; min-width:0; padding:14px 10px; margin:0 0 12px; gap:10px; font-size:clamp(44px,13vw,62px); line-height:1.2; letter-spacing:0; background:var(--surface); border:1px solid var(--line); border-radius:var(--phone-radius); filter:none; animation:none; }
.phone-styled .em-play-hero .em-g { min-width:0; max-width:100%; }
.phone-styled .em-play-hero .em-g-hidden { width:1.1em; height:1.15em; min-width:1.1em; border-width:2px; border-color:var(--text-dim); border-radius:10px; }
.phone-styled .stage-center .em-play-hero { font-size:clamp(56px,20vw,86px); padding:20px 12px; }
.phone-styled .result-card .em-play-hero { font-size:40px; padding:0; background:none; border:0; margin:0 0 6px; }
.phone-styled .em-play-what { font:600 15px/1.4 var(--font-body); letter-spacing:0; text-transform:none; margin-bottom:14px; }
.phone-styled .em-answer-chip { max-width:100%; flex-wrap:wrap; justify-content:center; border-radius:var(--phone-radius); background:var(--surface); padding:12px 14px; gap:6px; font-size:16px; line-height:1.4; }
.phone-styled .em-answer-chip b { min-width:0; overflow-wrap:anywhere; unicode-bidi:plaintext; }
/* Media rounds use the same surfaces, with cues for the arena's picture/audio. */
.phone-styled .px-mini { width:144px; max-width:100%; border:1px solid var(--line); border-radius:var(--phone-radius); background:var(--surface); clip-path:none; box-shadow:none; overflow:hidden; }
.phone-styled .px-mini::before,.phone-styled .px-mini::after { display:none; }
.phone-styled .px-mini-lg { width:min(100%,240px); }
.phone-styled .px-mini .px-canvas { inset:12px; width:calc(100% - 24px); height:calc(100% - 24px); image-rendering:auto; }
.phone-styled .px-play-top { flex:none; display:grid; grid-template-columns:112px minmax(0,1fr); gap:16px; align-items:center; margin-bottom:16px; }
.phone-styled .px-play-top .px-mini { width:100%; }
.phone-styled .px-play-prompt { font-size:20px; line-height:1.3; text-align:start; margin-bottom:12px; unicode-bidi:plaintext; }
.phone-styled .px-play-side .q-timer-row { margin:0; }
.phone-styled .px-onwall { padding:12px; gap:10px; }
.phone-styled .px-onwall-ic { color:var(--text); opacity:1; }
.phone-styled .px-onwall-ic svg { display:block; width:36px; height:36px; }
.phone-styled .px-onwall-text { font:600 14px/1.3 var(--font-body); letter-spacing:0; overflow-wrap:anywhere; }
.phone-styled .px-fallback { padding:16px; }
.phone-styled .px-fallback-text { font:600 15px/1.4 var(--font-body); letter-spacing:0; text-align:center; overflow-wrap:anywhere; }
.phone-styled .result-card .px-mini { width:200px; margin-bottom:10px; }
.phone-styled :is(.sd-phone-icon,.cl-eye-icon) { width:80px; height:80px; display:grid; place-items:center; border:1px solid var(--line); border-radius:var(--phone-radius); background:var(--surface); color:var(--text); animation:none; }
.phone-styled :is(.sd-phone-icon,.cl-eye-icon) svg { display:block; width:48px; height:48px; }
.phone-styled .sd-play-hint { flex:none; padding:12px 16px; border-radius:var(--phone-radius); border-color:var(--line); background:var(--surface); font:600 15px/1.4 var(--font-body); gap:12px; }
.phone-styled .sd-hint-icon { flex:none; }
.phone-styled .sd-hint-icon svg { display:block; width:24px; height:24px; }
.phone-styled .cl-mini { width:100%; max-width:340px; height:10px; background:var(--surface-3); border:1px solid var(--line); }
/* Maps retain their coordinate system and a comfortably sized touch viewport. */
.phone-styled .mg-meta { flex:none; line-height:1.4; overflow-wrap:anywhere; unicode-bidi:plaintext; margin-bottom:8px; }
.phone-styled .mg-play-title { flex:none; font:700 32px/1.2 var(--font-narrow); overflow-wrap:anywhere; margin:4px 0 16px; }
.phone-styled .mg-play-photowrap { flex:none; max-height:none; margin-bottom:12px; background:var(--surface); border-color:var(--line); border-radius:var(--phone-radius); }
.phone-styled .mg-play-photo { max-height:180px; max-width:100%; object-fit:contain; }
.phone-styled .mg-play-hint { flex:none; font:500 15px/1.45 var(--font-body); text-transform:none; letter-spacing:0; margin:10px 0; overflow-wrap:anywhere; unicode-bidi:plaintext; }
.phone-styled .mg-play-asking { flex:1 0 auto; min-width:0; }
.phone-styled .mg-play-asking .mg-play-photo { max-height:96px; }
.phone-styled .mg-play-asking .q-timer-row { margin-bottom:12px; }
.phone-styled .mg-view { background:var(--surface); border-color:var(--line); border-radius:var(--phone-radius); }
.phone-styled .mg-play-asking .mg-view { min-height:200px; }
.phone-styled .mg-pin { border-color:var(--text); box-shadow:0 4px 14px -2px var(--gold-glow); }
.phone-styled .mg-pin::after { background:var(--text); }
.phone-styled .mg-lock { font:700 16px/1.3 var(--font-body); margin-top:8px; }
.phone-styled .mg-play-mapwrap { --mg-reveal-height:340px; flex:none; align-self:center; width:min(100%,calc(var(--mg-reveal-height) * var(--mg-map-aspect,1))); max-width:100%; aspect-ratio:var(--mg-map-aspect,1); border-radius:var(--phone-radius); background:var(--surface); border:0; box-shadow:0 0 0 1px var(--line); }
.phone-styled .mg-play-mapwrap .mg-mapimg { width:100%; height:100%; object-fit:contain; }
.phone-styled .mg-target { background:var(--text); border-color:var(--bg-2); box-shadow:0 0 0 4px var(--line-strong); }
.phone-styled .mg-result { padding:14px 0; gap:8px; }
.phone-styled .mg-result-line { font:700 22px/1.3 var(--font-narrow); letter-spacing:0; text-transform:none; overflow-wrap:anywhere; }
.phone-styled .mg-result-big { font:900 38px/1.1 var(--font-display); }
.phone-styled .mg-result-sub { font-size:15px; line-height:1.4; overflow-wrap:anywhere; }
.phone-styled .mg-result-pts { font-size:38px; margin-top:0; overflow-wrap:anywhere; }
.phone-styled .mg-pin-legend { flex:none; display:flex; flex-wrap:wrap; justify-content:center; gap:12px 20px; font:600 14px/1.4 var(--font-body); color:var(--text-dim); }
.phone-styled .mg-pin-legend > span { display:inline-flex; align-items:center; gap:8px; }
.phone-styled .mg-pin-legend > span::before { content:''; width:12px; height:12px; flex:none; border-radius:50%; background:var(--text); }
.phone-styled .mg-pin-legend .mg-legend-guess::before { background:var(--grad-warm); }
.phone-styled .mg-unavailable { padding:16px; font:500 15px/1.4 var(--font-body); color:var(--text-dim); text-align:center; overflow-wrap:anywhere; }
.phone-styled .mg-view > .mg-unavailable,.phone-styled .mg-play-mapwrap > .mg-unavailable { position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; }
.phone-styled .mg-unavailable[hidden] { display:none; }
.phone-styled .mg-map-broken :is(.mg-pin,.mg-target) { display:none; }
/* Deduction: readable categories, natural-height history and reachable search results. */
.phone-styled .game-stage:has(.wd-controls) { justify-content:flex-start; overflow-anchor:none; }
.phone-styled .wd-controls { position:sticky; top:0; z-index:40; flex:none; min-width:0; padding:14px; margin-bottom:16px; border:1px solid var(--line); border-radius:var(--phone-radius); background:var(--surface); }
.phone-styled :is(.wd-top,.wd-title,.wd-sub,.wd-searchbox,.wd-legend) { flex:none; min-width:0; }
.phone-styled .wd-top { justify-content:space-between; gap:12px; margin:0 0 12px; }
.phone-styled .wd-count-chip { background:var(--surface); color:var(--text); box-shadow:none; font:600 14px/1.4 var(--font-body); letter-spacing:0; text-transform:none; padding:8px 12px; overflow-wrap:anywhere; }
.phone-styled .wd-timer { flex:none; font:700 23px/1.2 var(--font-narrow); }
.phone-styled .wd-title { font:700 24px/1.2 var(--font-narrow); margin:0 0 12px; overflow-wrap:anywhere; }
.phone-styled .wd-sub { font-size:15px; line-height:1.5; margin-bottom:12px; }
.phone-styled .wd-controls .wd-top { margin:12px 0 0; }
.phone-styled .wd-searchbox { margin:0; }
.phone-styled .wd-sugg { position:absolute; top:calc(100% + 6px); margin:0; max-height:min(336px,40dvh); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--line-strong) var(--surface); background:var(--surface); border-color:var(--line-strong); border-radius:var(--phone-radius); box-shadow:var(--shadow); }
.phone-styled .wd-sugg-row { min-height:56px; padding:10px 12px; font:600 16px/1.3 var(--font-body); border-color:var(--line-soft); }
.phone-styled .wd-sugg-row:is(:active,.picked,.is-active) { background:var(--surface-2); }
.phone-styled .wd-sugg-name { min-width:0; overflow-wrap:anywhere; unicode-bidi:plaintext; }
.phone-styled .wd-sugg-empty { color:var(--text-dim); font-size:15px; }
.phone-styled .wd-legend { font-size:13px; line-height:1.5; color:var(--text-dim); margin-bottom:14px; }
.phone-styled .wd-history { flex:none; overflow:visible; min-width:0; gap:14px; padding:0; }
.phone-styled .wd-guess { padding:12px; border-radius:var(--phone-radius); background:var(--surface); border-color:var(--line); }
.phone-styled .wd-cells { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.phone-styled .wd-cell { min-width:0; min-height:78px; padding:10px 8px; gap:6px; }
.phone-styled .wd-cell-label { font:600 12px/1.3 var(--font-body); opacity:1; letter-spacing:0; text-transform:none; overflow-wrap:anywhere; }
.phone-styled .wd-cell-value { font:700 16px/1.3 var(--font-narrow); max-width:100%; }
.phone-styled .wd-cell.wd-miss { color:var(--text-dim); }
.phone-styled .wd-cell.wd-cell-item { padding:10px 8px; gap:6px; background:var(--bg-2); border-color:var(--line); }
.phone-styled .wd-cell-item:not(.no-photo) .wd-cell-icon { width:48px; height:48px; flex:none; border-radius:8px; }
.phone-styled .wd-cell-icon.wd-icon-blank { display:grid; place-items:center; width:48px; height:48px; background:var(--surface-2); border-radius:8px; font-size:24px; flex:none; }
.phone-styled .wd-cell-itemname { font:600 14px/1.3 var(--font-body); letter-spacing:0; text-transform:none; max-width:100%; }
.phone-styled .wd-answer-card { max-width:100%; padding:14px; background:var(--surface); border:1px solid var(--line); border-radius:var(--phone-radius); }
.phone-styled .wd-answer-name { font:700 25px/1.2 var(--font-narrow); overflow-wrap:anywhere; max-width:100%; }
.phone-styled .wd-icon-big { border-color:var(--line); }
.phone-styled .wd-watch { color:var(--text-dim); font-size:15px; line-height:1.5; }
/* Tap War keeps team identities while the neutral shell follows the selected layout. */
.phone-styled .tw-pickwrap { flex:1 0 auto; gap:18px; padding-block:12px; }
.phone-styled .tw-pick { min-height:100px; min-width:0; padding:20px; border-radius:var(--phone-radius); border:1px solid var(--answer-color); background:linear-gradient(145deg,color-mix(in srgb,var(--answer-color) 28%,var(--surface)),var(--surface)) !important; box-shadow:none; }
.phone-styled .tw-pick-name { min-width:0; font:700 27px/1.2 var(--font-narrow); overflow-wrap:anywhere; }
.phone-styled :is(.tw-pick-shape,.tw-pad-shape) { color:var(--answer-color); flex:none; }
.phone-styled .tw-hud { flex:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:0; margin-bottom:14px; }
.phone-styled .tw-hud-cell { min-width:0; gap:6px; padding:12px 6px; border:1px solid var(--line); border-radius:10px; background:var(--surface); }
.phone-styled .tw-hud-label { font:600 12px/1.3 var(--font-body); color:var(--text-dim); letter-spacing:0; text-transform:none; overflow-wrap:anywhere; }
.phone-styled .tw-hud-val { max-width:100%; font-size:26px; overflow-wrap:anywhere; }
.phone-styled .tw-power-chip { min-width:0; align-self:stretch; display:grid; place-items:center; text-align:center; font:700 14px/1.4 var(--font-body); padding:10px 6px; opacity:1; letter-spacing:0; border-radius:10px; overflow-wrap:anywhere; }
.phone-styled .tw-power-chip.on { animation:none; }
.phone-styled .tw-mini { flex:none; height:14px; margin-bottom:14px; }
.phone-styled .tw-pad-wrap { min-height:220px; flex:1 0 220px; }
.phone-styled .tw-pad { min-width:0; min-height:220px; padding:24px 18px; gap:12px; border:2px solid var(--answer-color); border-radius:var(--phone-radius); background:linear-gradient(145deg,color-mix(in srgb,var(--answer-color) 32%,var(--surface)),var(--surface)) !important; box-shadow:none; }
.phone-styled .tw-pad-label { font-size:64px; line-height:1.1; max-width:100%; overflow-wrap:anywhere; }
.phone-styled .tw-pad-team { font:600 18px/1.4 var(--font-body); letter-spacing:0; overflow-wrap:anywhere; max-width:100%; }
.phone-styled .tw-result-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; width:100%; }
.phone-styled .tw-result-cell { min-width:0; padding:14px 8px; background:var(--surface); border:1px solid var(--line); border-radius:10px; }
.phone-styled .tw-result-cell b { max-width:100%; overflow-wrap:anywhere; }
/* Reflex has an immediate cue, never a theme fade or animated signal transition. */
.phone-styled .rx-pad { flex:1 0 240px; min-height:240px; min-width:0; padding:24px 18px; gap:18px; border-radius:var(--phone-radius); color:var(--text); border:2px solid var(--danger); background:color-mix(in srgb,var(--danger) 20%,var(--surface)); box-shadow:none; animation:none; transition:none; }
.phone-styled .rx-pad-go { background:var(--success); color:var(--on-accent); border-color:var(--text); animation:none; transition:none; }
.phone-styled :is(.rx-pad-jumped,.rx-pad-done) { background:var(--surface); border-color:var(--line); color:var(--text); }
.phone-styled .rx-pad-big { font-size:clamp(40px,16vw,68px); line-height:1.12; overflow-wrap:anywhere; max-width:100%; }
.phone-styled .rx-pad-go .rx-pad-big { font-size:clamp(52px,22vw,88px); }
.phone-styled .rx-pad-sub { font:600 16px/1.5 var(--font-body); letter-spacing:0; text-transform:none; max-width:100%; }
.phone-styled .rx-time-label { font:600 16px/1.4 var(--font-body); letter-spacing:0; text-transform:none; }
.phone-styled .rx-time-num { display:flex; flex-wrap:wrap; justify-content:center; align-items:baseline; gap:8px; max-width:100%; font-size:56px; line-height:1.1; }
.phone-styled .rx-time-num b { min-width:0; overflow-wrap:anywhere; }
.phone-styled .rx-time-pts { font:700 18px/1.4 var(--font-body); letter-spacing:0; text-transform:none; }
.phone-styled .rx-tot { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; gap:12px; }
.phone-styled .rx-tot-cell { min-width:0; padding:14px 8px; border-radius:10px; border:1px solid var(--line); background:var(--surface); gap:8px; }
.phone-styled .rx-tot-cell:only-child { grid-column:1/-1; }
.phone-styled .rx-tot-label { font:600 13px/1.4 var(--font-body); letter-spacing:0; text-transform:none; color:var(--text-dim); overflow-wrap:anywhere; }
.phone-styled .rx-tot-cell b { max-width:100%; overflow-wrap:anywhere; }
/* Stage games remain watch-only, with the same phone surfaces and readable outcomes. */
.phone-styled .host-watch { flex:none; width:100%; display:flex; flex-direction:column; align-items:center; text-align:center; gap:20px; }
.phone-styled .host-watch-title { width:100%; font:700 30px/1.2 var(--font-narrow); overflow-wrap:anywhere; }
.phone-styled .host-mini-vs { width:100%; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; gap:12px; margin:0; }
.phone-styled .host-mini-card { min-width:0; padding:20px 12px; gap:12px; border-color:var(--line); border-radius:var(--phone-radius); background:var(--surface); }
.phone-styled .host-mini-card b { font:700 21px/1.25 var(--font-narrow); max-width:100%; overflow-wrap:anywhere; unicode-bidi:plaintext; }
.phone-styled .host-mini-members { font:500 14px/1.5 var(--font-body); letter-spacing:0; text-transform:none; max-width:100%; overflow-wrap:anywhere; unicode-bidi:plaintext; }
.phone-styled .host-mini-score { font-size:clamp(36px,12vw,52px); line-height:1.1; max-width:100%; margin-top:auto; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.phone-styled .host-mini-card.is-winner { border-color:var(--success); box-shadow:inset 0 0 0 1px var(--success); background:color-mix(in srgb,var(--success) 12%,var(--surface)); }
.phone-styled .host-score-changed { animation:phoneScoreChange 260ms ease-out; }
@keyframes phoneScoreChange { from { transform:translateY(4px); opacity:.5; } }
.phone-styled :is(.wh-phone-watch,.wh-phone-result) { gap:18px; width:100%; }
.phone-styled .wh-mini { flex:none; width:88px; height:88px; border:0; animation:none; background:var(--surface); padding:12px; color:var(--text); }
.phone-styled .wh-mini svg { display:block; width:100%; height:100%; }
.phone-styled .wh-mini.fast { animation:whSpin 1.6s linear infinite; }
.phone-styled .wh-watch-chip { max-width:100%; flex-direction:column; align-items:center; padding:14px 18px; gap:8px; border-radius:var(--phone-radius); background:var(--surface); }
.phone-styled .wh-watch-chip-label { font:600 13px/1.4 var(--font-body); letter-spacing:0; text-transform:none; }
.phone-styled .wh-watch-chip-name { font:700 23px/1.25 var(--font-narrow); min-width:0; max-width:100%; overflow-wrap:anywhere; unicode-bidi:plaintext; }
.phone-styled .wh-up { flex:none; width:100%; padding:24px 18px; border-radius:var(--phone-radius); border:1px solid var(--line); background:var(--surface); gap:20px; }
.phone-styled .wh-up::before { display:none; }
.phone-styled .wh-up-head { font-size:42px; line-height:1.15; width:100%; overflow-wrap:anywhere; animation:none; }
.phone-styled .wh-up-stage { font:600 21px/1.4 var(--font-narrow); letter-spacing:0; overflow-wrap:anywhere; max-width:100%; }
.phone-styled .wh-won-img { width:min(100%,240px); max-height:240px; object-fit:contain; padding:14px; border:1px solid var(--line); border-radius:var(--phone-radius); background:var(--surface); box-shadow:none; }
.phone-styled .wh-phone-media-fallback { display:grid; place-items:center; min-height:120px; width:100%; max-width:240px; padding:20px; border-radius:var(--phone-radius); border:1px solid var(--line); background:var(--surface); font:500 15px/1.5 var(--font-body); color:var(--text-dim); overflow-wrap:anywhere; }
.phone-styled .wh-won-kicker { font:600 15px/1.4 var(--font-body); letter-spacing:0; text-transform:none; }
.phone-styled .wh-won-prize { font-size:36px; line-height:1.2; max-width:100%; overflow-wrap:anywhere; }
.phone-styled .wh-yours { padding:12px 16px; max-width:100%; border:1px solid var(--line); border-radius:10px; background:var(--surface); font:600 16px/1.5 var(--font-body); overflow-wrap:anywhere; }
/* Shared final scenes and private prize receipts retain their full text. */
.phone-styled .prize-claim { flex:none; width:100%; padding:20px 16px; border-radius:var(--phone-radius); background:var(--surface); border-color:var(--line); box-shadow:none; }
.phone-styled .prize-claim-head { font-size:26px; line-height:1.2; overflow-wrap:anywhere; }
.phone-styled .prize-claim-prize { font:600 18px/1.4 var(--font-narrow); margin-top:10px; overflow-wrap:anywhere; }
.phone-styled .prize-claim-code { font-size:24px; line-height:1.4; padding:14px 10px; letter-spacing:.04em; background:var(--bg-2); user-select:all; }
.phone-styled .prize-claim-sub { font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
.phone-styled .lb-wrap { flex:1 0 auto; overflow:visible; padding:0; gap:12px; }
.phone-styled .lb-title { flex:none; font-size:30px; line-height:1.2; overflow-wrap:anywhere; margin-bottom:8px; }
.phone-styled .lb-row { min-width:0; display:grid; grid-template-columns:28px minmax(0,1fr) minmax(0,.65fr); gap:10px; padding:14px 12px; border-color:var(--line); background:var(--surface); border-radius:10px; }
.phone-styled .lb-row.me { background:var(--surface-2); border-color:var(--text-dim); }
.phone-styled .lb-rank { width:auto; min-width:0; font-size:20px; line-height:1.3; overflow-wrap:anywhere; }
.phone-styled .lb-name { white-space:normal; font-size:16px; line-height:1.4; overflow-wrap:anywhere; }
.phone-styled .lb-score { text-align:right; font-size:20px; line-height:1.3; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.phone-styled .podium-player { flex:none; width:100%; gap:18px; padding:16px 0; }
.phone-styled .podium-place { font-size:34px; line-height:1.2; overflow-wrap:anywhere; max-width:100%; }
.phone-styled .podium-prize { padding:14px 16px; background:var(--surface); border:1px solid var(--line); border-radius:var(--phone-radius); font-size:18px; line-height:1.5; max-width:100%; overflow-wrap:anywhere; }
.phone-styled .ss-hud { flex-shrink:0; gap:8px; margin-bottom:12px; }
.phone-styled .ss-stat { padding:10px 4px; border-radius:10px; background:var(--surface); border-color:var(--line); }
.phone-styled .ss-stat-label { color:var(--text-dim); font:600 11px/1.2 var(--font-body); letter-spacing:0; text-transform:none; margin-bottom:5px; overflow-wrap:anywhere; }
.phone-styled .ss-stat-value { font-size:22px; }
.phone-styled .ss-stat-value { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.phone-styled .ss-arena { min-height:180px; flex:1 0 180px; border-color:var(--line); border-radius:var(--phone-radius); }
.phone-styled .ss-hint { flex-shrink:0; font-size:14px; line-height:1.4; margin:12px 4px 0; }
.phone-styled .ss-recharge { flex-shrink:0; height:6px; margin-top:12px; }
.phone-styled .ss-recap { flex-shrink:0; gap:16px; padding-block:10px; }
.phone-styled .ss-recap-cell { padding:14px 8px; background:var(--surface); border-color:var(--line); border-radius:10px; }
.phone-styled .ss-recap-cell .ss-stat-label { margin:0; }
.phone-styled .ss-recap-title { line-height:1.1; overflow-wrap:anywhere; }
.phone-styled .ss-recap-rows { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:none; }
.phone-styled[data-phone-layout='ewc26'] :is(.stage-headline,.join-title) { font-size:44px; }
.phone-styled[data-phone-layout='ewc26'] .stat-card-value { font:900 28px/1 var(--font-display); }
.phone-styled :is(button,input):focus-visible { outline:3px solid var(--text); outline-offset:3px; }
@media(max-height:650px) {
  .phone-styled .game-stage { padding:14px 18px; }
  .phone-styled .game-stage.phone-launch-stage { gap:12px; }
  .phone-styled .phone-launch { flex-basis:122px; min-height:122px; grid-template-rows:42px 72px; gap:8px; }
  .phone-styled .phone-launch .phone-launch-label.stage-headline { font-size:21px; }
  .phone-styled .game-top { min-height:52px; padding-block:10px; }
  .phone-styled .q-prompt { font-size:20px; margin-bottom:10px; }
  .phone-styled .q-timer-row { margin-bottom:10px; }
  .phone-styled .answers-grid { grid-auto-rows:minmax(88px,1fr); }
  .phone-styled .answer-tile { min-height:88px; padding:12px; gap:8px; }
  .phone-styled .hl-btn { min-height:88px; padding:12px; gap:8px; }
  .phone-styled .hl-bank-card { padding:18px 14px; gap:14px; }
  .phone-styled .lf-phone-question-image { max-height:120px; margin-bottom:12px; }
  .phone-styled .em-play-hero { font-size:42px; padding:10px 8px; gap:8px; }
  .phone-styled .px-mini-lg { width:180px; }
  .phone-styled .mg-play-asking .mg-view { min-height:150px; }
  .phone-styled .mg-play-asking .mg-play-photo { max-height:72px; }
  .phone-styled .mg-play-mapwrap { --mg-reveal-height:220px; }
  .phone-styled .locked-banner { margin-top:10px; padding:10px; }
  .phone-styled .game-bottom { padding:8px 18px calc(env(safe-area-inset-bottom) + 10px); }
}
@media(prefers-reduced-motion:reduce) {
  .phone-styled *, .phone-styled *::before, .phone-styled *::after { animation:none !important; transition:none !important; }
}