/* Live Trivia · Retro Gaming phone skin (owner decision 2026-10-05): the
   canvas's Pixel 1 · Attract Mode phone boards (PX1-P1 … P7), an 80s
   coin-op cabinet. Scoped to #trivia-content.pop-quiz.ltd-retroGaming and
   layered on the shared Pop Quiz structure, so no other screen is touched.
   Press Start 2P is self-hosted (SIL OFL, /fonts/OFL-PressStart2P.txt) and
   named only here, so no other phone downloads it.

   Legibility (owner review 2026-10-05): the question is at least 16 px, and
   nothing sits over the text (no scanlines over content, solid dark panels,
   bright colours on them), so the phone reads in daylight. Every motion is
   stepped (steps()) like the display, or a short drop with a bounce. */

@font-face {
    font-family: 'Press Start 2P';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/fonts/press-start-2p-regular-v1.woff2') format('woff2');
}

#trivia-content.pop-quiz.ltd-retroGaming {
    --rg-bg: #07031C; --rg-panel: #0B0730; --rg-qpanel: #0A0630; --rg-wall: #3348FF;
    --rg-red: #FF3158; --rg-pink: #FF5FD2; --rg-cyan: #2BE4FF; --rg-yellow: #FFE629;
    --rg-orange: #FF9A1F; --rg-green: #3DFF7C; --rg-white: #F5F2FF; --rg-lav: #B4AEE8;
    --rg-unlit: #1C1842; --rg-slot: #1A1250;
    --rg-inv-pink: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 7' shape-rendering='crispEdges'%3E%3Cpath d='M3 0h4v1h-4zM1 1h8v1h-8zM0 2h2v1h-2zM3 2h4v1h-4zM8 2h2v1h-2zM0 3h10v1h-10zM2 4h2v1h-2zM6 4h2v1h-2zM1 5h2v1h-2zM4 5h2v1h-2zM7 5h2v1h-2zM0 6h2v1h-2zM8 6h2v1h-2z' fill='%23FF5FD2'/%3E%3C/svg%3E");
    --rg-inv-cyan: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' shape-rendering='crispEdges'%3E%3Cpath d='M2 0h1v1h-1zM7 0h1v1h-1zM3 1h1v1h-1zM6 1h1v1h-1zM2 2h6v1h-6zM1 3h2v1h-2zM4 3h2v1h-2zM7 3h2v1h-2zM0 4h10v1h-10zM0 5h1v1h-1zM2 5h6v1h-6zM9 5h1v1h-1zM0 6h1v1h-1zM2 6h1v1h-1zM7 6h1v1h-1zM9 6h1v1h-1zM3 7h2v1h-2zM6 7h2v1h-2z' fill='%232BE4FF'/%3E%3Cpath d='M3 3h1v1h-1zM6 3h1v1h-1z' fill='%23FFFFFF'/%3E%3C/svg%3E");
    --rg-inv-green: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8' shape-rendering='crispEdges'%3E%3Cpath d='M4 0h2v1h-2zM2 1h6v1h-6zM1 2h8v1h-8zM0 3h2v1h-2zM3 3h1v1h-1zM6 3h1v1h-1zM8 3h2v1h-2zM0 4h10v1h-10zM2 5h1v1h-1zM4 5h2v1h-2zM7 5h1v1h-1zM1 6h1v1h-1zM3 6h1v1h-1zM6 6h1v1h-1zM8 6h1v1h-1zM0 7h1v1h-1zM9 7h1v1h-1z' fill='%233DFF7C'/%3E%3Cpath d='M2 3h1v1h-1zM4 3h2v1h-2zM7 3h1v1h-1z' fill='%23FFFFFF'/%3E%3C/svg%3E");
    --rg-coin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' shape-rendering='crispEdges'%3E%3Cpath d='M2 0h4v1h-4zM1 1h1v1h-1zM6 1h1v1h-1zM0 2h1v1h-1zM3 2h2v1h-2zM7 2h1v1h-1zM0 3h1v1h-1zM2 3h1v1h-1zM5 3h1v1h-1zM7 3h1v1h-1zM0 4h1v1h-1zM2 4h1v1h-1zM5 4h1v1h-1zM7 4h1v1h-1zM0 5h1v1h-1zM3 5h2v1h-2zM7 5h1v1h-1zM1 6h1v1h-1zM6 6h1v1h-1zM2 7h4v1h-4z' fill='%23FF9A1F'/%3E%3Cpath d='M2 1h4v1h-4zM1 2h2v1h-2zM5 2h2v1h-2zM1 3h1v1h-1zM3 3h2v1h-2zM6 3h1v1h-1zM1 4h1v1h-1zM3 4h2v1h-2zM6 4h1v1h-1zM1 5h2v1h-2zM5 5h2v1h-2zM2 6h4v1h-4z' fill='%23FFE629'/%3E%3C/svg%3E");

    font-family: 'Press Start 2P', ui-monospace, monospace;
    font-weight: 400;
    color: var(--rg-white);
    text-transform: uppercase;
    -webkit-font-smoothing: none;
    border-radius: 0;
    padding: 12px 10px 12px;
    /* The cabinet: a double maze wall round a dark field, faint scanlines in
       the field only (under the content, never over the text). */
    border: 6px solid var(--rg-wall);
    box-shadow: inset 0 0 0 6px var(--rg-bg), inset 0 0 0 9px var(--rg-wall), 0 0 10px rgba(51,72,255,0.6);
    background:
        repeating-linear-gradient(to bottom, rgba(0,0,0,0) 0 3px, rgba(0,0,0,0.16) 3px 6px),
        var(--rg-bg);
}
/* Every piece in the arcade face (Pop Quiz names Titan One and Space
   Grotesk on several). */
#trivia-content.pop-quiz.ltd-retroGaming * { font-family: inherit; font-weight: 400; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-sticker {
    background: var(--rg-panel); color: var(--rg-white);
    border: 6px solid var(--rg-cyan); border-radius: 0;
    box-shadow: inset 0 0 0 6px #0E6F86, 0 0 10px rgba(43,228,255,0.45);
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-burst { clip-path: none; }

/* The marquee lettering: yellow, orange and red bands over two purple
   drops (the display's logo). */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-title,
#trivia-content.pop-quiz.ltd-retroGaming .pq-joined .pq-burst span,
#trivia-content.pop-quiz.ltd-retroGaming .trivia-final-rank,
#trivia-content.pop-quiz.ltd-retroGaming .pq-ready .pq-display::before {
    background: linear-gradient(to bottom, #FFE629 0 37.5%, #FF9A1F 37.5% 62.5%, #FF3158 62.5% 100%);
    background-size: 100% 1lh;
    -webkit-background-clip: text; background-clip: text;
    color: transparent;
    filter: drop-shadow(3px 3px 0 #7A1FB0) drop-shadow(3px 3px 0 #2A0650);
}

/* ── Join (P1) ── */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-title {
    font-size: 1.5rem; line-height: 1.4; border: 0; border-radius: 0; box-shadow: none; padding: 0;
    margin: 30px 4px 34px; transform: none; overflow-wrap: anywhere;
    animation: rgDrop 0.46s cubic-bezier(0.3, 1.5, 0.5, 1) both;
}
#trivia-content.pop-quiz.ltd-retroGaming #trivia-name-entry::before {
    content: 'ENTER YOUR NAME'; display: block; text-align: left; margin: 0 0 14px 2px;
    font-size: 12px; line-height: 12px; color: var(--rg-cyan); text-shadow: 0 0 10px rgba(43,228,255,0.5);
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-name-input {
    height: 64px; padding: 0 14px; text-align: left; text-transform: uppercase;
    background: var(--rg-slot); color: var(--rg-yellow); caret-color: var(--rg-yellow);
    border: 0; border-bottom: 6px solid var(--rg-yellow); border-radius: 0; box-shadow: none;
    font-family: inherit; font-weight: 400; font-size: 20px;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-name-input::placeholder { color: rgba(255,230,41,0.4); }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-join-btn {
    height: 72px; border: 0; border-radius: 0; font-size: 0; font-family: inherit;
    background: var(--rg-yellow); color: var(--rg-bg);
    box-shadow: inset 0 -8px 0 #9A5A00;
    clip-path: polygon(0 12px, 6px 12px, 6px 6px, 12px 6px, 12px 0, calc(100% - 12px) 0, calc(100% - 12px) 6px, calc(100% - 6px) 6px, calc(100% - 6px) 12px, 100% 12px, 100% calc(100% - 12px), calc(100% - 6px) calc(100% - 12px), calc(100% - 6px) calc(100% - 6px), calc(100% - 12px) calc(100% - 6px), calc(100% - 12px) 100%, 12px 100%, 12px calc(100% - 6px), 6px calc(100% - 6px), 6px calc(100% - 12px), 0 calc(100% - 12px));
    transition: none;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-join-btn::after { content: 'PRESS START'; font-size: 20px; line-height: 20px; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-join-btn:active { transform: translateY(6px); box-shadow: inset 0 -8px 0 var(--rg-yellow); }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-random-name-display {
    padding: 14px 18px; color: var(--rg-yellow); font-size: 20px; line-height: 1.3;
    background: var(--rg-slot); border: 0; border-bottom: 6px solid var(--rg-yellow); border-radius: 0; box-shadow: none;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-reroll-btn {
    color: var(--rg-cyan); border: 4px solid var(--rg-cyan); border-radius: 0;
    font-family: inherit; font-weight: 400; font-size: 12px; text-transform: uppercase; padding: 10px 16px;
}

/* You're in (P1): the marquee spins in, the name drops into a NEW
   CHALLENGER! box, the waiting line blinks. */
#trivia-content.pop-quiz.ltd-retroGaming .pq-joined .pq-burst {
    width: auto; height: auto; padding: 30px 0 0; background: none; color: transparent;
    font-size: 1.9rem; line-height: 1.25;
    animation: rgSpin 0.42s steps(6) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-joined .pq-burst span { transform: none; display: block; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-name-chip {
    display: inline-flex; flex-direction: column; align-items: center; gap: 12px;
    margin: 28px 0 30px; padding: 20px 22px 16px; max-width: 100%; box-sizing: border-box;
    background: #2A1800; color: var(--rg-yellow); font-size: 26px; line-height: 1.15; overflow-wrap: anywhere;
    border: 6px solid var(--rg-yellow); border-radius: 0;
    box-shadow: inset 0 0 0 6px var(--rg-orange), 0 0 14px rgba(255,180,0,0.45);
    transform: none;
    animation: rgDrop 0.46s 0.3s cubic-bezier(0.3, 1.5, 0.5, 1) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-name-chip::after {
    content: 'NEW CHALLENGER!'; font-size: 10px; line-height: 10px; color: var(--rg-red);
    animation: rgBlink 0.7s steps(1) infinite;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-waiting-joined p,
#trivia-content.pop-quiz.ltd-retroGaming .pq-wait-line {
    color: var(--rg-white); font-size: 12px; line-height: 20px; font-weight: 400;
    animation: rgSlideUp 0.42s 0.6s steps(6) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-waiting-joined p::after,
#trivia-content.pop-quiz.ltd-retroGaming .pq-wait-line::after {
    content: ''; display: block; width: 60px; height: 48px; margin: 22px auto 0;
    background: var(--rg-inv-cyan) center / contain no-repeat; image-rendering: pixelated;
    animation: rgBob 0.8s steps(1) infinite;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-waiting-joined .dots,
#trivia-content.pop-quiz.ltd-retroGaming .pq-wait-line .dots { animation: none; }

/* ── Question (P2) ── */
#trivia-content.pop-quiz.ltd-retroGaming #trivia-question { column-gap: 12px; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-bar {
    position: relative; height: 16px; margin: 0;
    background: var(--rg-unlit); border: 0; border-radius: 0;
    animation: rgDrop 0.36s cubic-bezier(0.3, 1.5, 0.5, 1) both;
}
/* The blocks: a smooth fill under a fixed gap mask. */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-bar::after {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background: repeating-linear-gradient(to right, rgba(0,0,0,0) 0 14px, var(--rg-bg) 14px 18px);
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-fill { border-radius: 0; background-color: var(--rg-green) !important; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-fill[data-level="warn"] { background-color: var(--rg-yellow) !important; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-fill[data-level="urgent"] { background-color: var(--rg-red) !important; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-text {
    --rg-c: var(--rg-green); --rg-d: #0F6B33;
    width: 84px; height: 52px; border-radius: 0; padding-left: 4px;
    font-family: inherit; font-weight: 400; font-size: 22px;
    color: var(--rg-c) !important; background: #05020F;
    border: 4px solid var(--rg-c); box-shadow: inset 0 0 0 4px var(--rg-d), 0 0 10px var(--rg-c);
    text-shadow: 0 0 8px var(--rg-c);
    animation: rgDrop 0.36s cubic-bezier(0.3, 1.5, 0.5, 1) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-text[data-level="warn"] { --rg-c: var(--rg-yellow); --rg-d: #8F7A00; background: #05020F; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-text[data-level="urgent"] { --rg-c: var(--rg-red); --rg-d: #8A0F2A; background: #05020F; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-text.pq-tick { animation: rgTick 0.28s steps(1); }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-timer-text[data-level="urgent"].pq-tick { animation: rgTickHard 0.28s steps(1); }
/* The question: CRT power-on, from a line. 16 px with room to breathe
   (owner review: the mock's 13 px was too small to read). */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-question-text {
    margin: 10px 0 10px; padding: 10px 8px;
    background: var(--rg-qpanel); color: var(--rg-white);
    border: 4px solid var(--rg-wall); border-radius: 0;
    box-shadow: inset 0 0 0 3px var(--rg-bg), inset 0 0 0 5px var(--rg-wall);
    font-size: 16px; line-height: 1.4; font-weight: 400; overflow-wrap: anywhere;
    transform-origin: 50% 50%;
    animation: rgCrt 0.42s 0.3s steps(1) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-options-grid { gap: 8px; margin: 0; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-options-grid[data-count="5"] { gap: 7px; }
/* Each answer: its colour (the button's own background, set by the page)
   shows only as the frame; a dark fill covers the rest. */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn {
    justify-content: flex-start; gap: 10px; min-height: 56px; padding: 4px 10px 4px 8px;
    border: 5px solid transparent; border-radius: 0; background-clip: border-box;
    box-shadow: inset 0 0 0 999px var(--rg-panel), 0 0 8px rgba(0,0,0,0.4);
    color: var(--rg-white); text-shadow: none; text-align: left; text-transform: uppercase;
    font-family: inherit; font-weight: 400; font-size: 14px; line-height: 1.35; overflow-wrap: anywhere;
    transition: none;
    animation: rgSlideIn 0.36s steps(6) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn:nth-child(1) { animation-delay: 0.55s; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn:nth-child(2) { animation-delay: 0.63s; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn:nth-child(3) { animation-delay: 0.71s; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn:nth-child(4) { animation-delay: 0.79s; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn:nth-child(5) { animation-delay: 0.87s; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn:active { transform: translateY(4px) scale(0.97); box-shadow: inset 0 0 0 999px var(--rg-panel); }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn.selected { box-shadow: inset 0 0 0 999px rgba(7,3,28,0.55); }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-options-grid[data-count="5"] .trivia-option-btn { min-height: 50px; font-size: 13px; }
/* The question takes more room than Pop Quiz's (a pixel face is wide), so
   the buttons give back height first: the rest of the screen is about 420 px
   with four answers, 430 px with five. */
@supports (height: 100dvh) {
    #trivia-content.pop-quiz.ltd-retroGaming .trivia-option-btn { min-height: clamp(46px, calc((100dvh - 420px) / 4), 60px); }
    #trivia-content.pop-quiz.ltd-retroGaming .trivia-options-grid[data-count="5"] .trivia-option-btn { min-height: clamp(44px, calc((100dvh - 430px) / 5), 52px); }
}
/* The letter: an arcade button in the answer's colour. */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-option-letter {
    width: 36px; height: 36px; border-radius: 0; padding-left: 3px; box-sizing: border-box;
    background-color: inherit; color: #07031C; text-shadow: none;
    font-family: inherit; font-weight: 400; font-size: 15px;
    box-shadow: inset -4px -4px 0 rgba(0,0,0,0.4), inset 4px 4px 0 rgba(255,255,255,0.55);
    clip-path: polygon(0 8px, 4px 8px, 4px 4px, 8px 4px, 8px 0, calc(100% - 8px) 0, calc(100% - 8px) 4px, calc(100% - 4px) 4px, calc(100% - 4px) 8px, 100% 8px, 100% calc(100% - 8px), calc(100% - 4px) calc(100% - 8px), calc(100% - 4px) calc(100% - 4px), calc(100% - 8px) calc(100% - 4px), calc(100% - 8px) 100%, 8px 100%, 8px calc(100% - 4px), 4px calc(100% - 4px), 4px calc(100% - 8px), 0 calc(100% - 8px));
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-options-grid[data-count="5"] .trivia-option-letter { width: 32px; height: 32px; font-size: 13px; }

/* ── Locked in (P3) ── */
#trivia-content.pop-quiz.ltd-retroGaming .pq-locked.show { padding-top: 24px; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-lock-card {
    margin: 0 8px; padding: 22px 14px; gap: 14px;
    background: #2A1800; border: 6px solid var(--rg-yellow);
    box-shadow: inset 0 0 0 6px var(--rg-orange), 0 0 14px rgba(255,180,0,0.45);
    transform: rotate(-3deg);
    animation: rgStamp 0.26s 0.2s steps(3) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-lock-card svg { display: none; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-lock-card .pq-display {
    font-size: 20px; line-height: 1.6; color: var(--rg-yellow); text-shadow: 0 0 12px rgba(255,230,41,0.6);
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-pick {
    margin: 44px 8px 28px; padding: 12px 14px; gap: 12px; display: flex;
    border: 5px solid transparent; border-radius: 0; background-clip: border-box;
    box-shadow: inset 0 0 0 999px var(--rg-panel);
    color: var(--rg-white); font-size: 15px; line-height: 1.4; text-shadow: none; overflow-wrap: anywhere;
    transform: rotate(2deg);
    animation: rgPopIn 0.28s 0.5s steps(4) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-pick::before {
    content: 'YOUR PICK'; position: absolute; top: -28px; left: 0; right: 0; text-align: center;
    font-size: 10px; line-height: 10px; color: var(--rg-lav);
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-pick { position: relative; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-pick .trivia-option-letter { width: 40px; height: 40px; font-size: 16px; }

/* ── Result (P4, P5) ── */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-result { padding: 30px 0 0; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-result-icon { margin: 0 auto 26px; }
#trivia-content.pop-quiz.ltd-retroGaming .rg-badge {
    --rg-c: var(--rg-green); --rg-d: #0F6B33;
    position: relative; width: 180px; height: 150px; margin: 0 auto; box-sizing: border-box;
    background: #05020F; border: 6px solid var(--rg-c);
    box-shadow: inset 0 0 0 6px var(--rg-d), 0 0 14px var(--rg-c);
}
#trivia-content.pop-quiz.ltd-retroGaming .rg-badge.rg-ok { animation: rgSpin 0.38s steps(6) both; }
#trivia-content.pop-quiz.ltd-retroGaming .rg-badge.rg-ko {
    --rg-c: var(--rg-red); --rg-d: #8A0F2A;
    animation: rgDrop 0.48s cubic-bezier(0.3, 1.5, 0.5, 1) both, rgShake 0.36s 0.5s steps(1) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .rg-badge .rg-cells {
    position: absolute; left: 18px; top: 21px; width: 132px; height: 96px;
    filter: drop-shadow(0 0 8px var(--rg-c));
}
#trivia-content.pop-quiz.ltd-retroGaming .rg-badge .rg-cells i {
    position: absolute; width: 12px; height: 12px; background: var(--rg-c);
}
/* The check draws itself pixel by pixel; the X is there at once. */
#trivia-content.pop-quiz.ltd-retroGaming .rg-badge.rg-ok .rg-cells i { animation: rgPixelOn 0.01s steps(1) both; }
#trivia-content.pop-quiz.ltd-retroGaming .trivia-result-text {
    font-size: 30px; line-height: 1.2; margin-bottom: 18px;
    color: var(--rg-green) !important; text-shadow: 4px 4px 0 #0F6B33, 0 0 18px rgba(61,255,124,0.6);
    animation: rgSlam 0.26s 0.55s steps(3) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-result-icon:has(.rg-ko) + .trivia-result-text {
    color: var(--rg-red) !important; text-shadow: 4px 4px 0 #8A0F2A, 0 0 18px rgba(255,49,88,0.6);
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-result-points {
    padding: 16px 20px 14px; font-family: inherit; font-size: 18px; line-height: 1.2;
    color: #D8D4F5; background: var(--rg-panel); border: 6px solid #9A96C8; border-radius: 0;
    box-shadow: inset 0 0 0 6px #36325A; transform: none;
    animation: rgPopIn 0.26s 0.85s steps(4) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-result-points.pq-earned {
    color: var(--rg-yellow); background: #2A1800; border-color: var(--rg-yellow);
    box-shadow: inset 0 0 0 6px var(--rg-orange); transform: rotate(-3deg);
}

/* ── Get ready (P6) ── */
#trivia-content.pop-quiz.ltd-retroGaming .pq-ready {
    margin: 50px 10px 0; padding: 30px 16px 28px; gap: 20px;
    animation: rgSwingIn 0.46s steps(7) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-ready .pq-display {
    display: flex; flex-direction: column; align-items: center; gap: 22px;
    font-size: 0; line-height: 0; color: var(--rg-white);
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-ready .pq-display::before { content: 'GET READY!'; font-size: 24px; line-height: 1.25; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-ready .pq-display::after { content: 'NEXT QUESTION'; font-size: 12px; line-height: 12px; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-dots { gap: 30px; height: 46px; align-items: flex-end; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-dots span {
    width: 40px; height: 32px; border: 0; border-radius: 0; image-rendering: pixelated;
    background: var(--rg-inv-pink) center bottom / contain no-repeat;
    animation: rgHop 0.6s steps(1) infinite;
}
#trivia-content.pop-quiz.ltd-retroGaming .pq-dots span:nth-child(1) { background: var(--rg-inv-pink) center bottom / contain no-repeat; animation-delay: 0s; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-dots span:nth-child(2) { background: var(--rg-inv-cyan) center bottom / contain no-repeat; animation-delay: 0.2s; }
#trivia-content.pop-quiz.ltd-retroGaming .pq-dots span:nth-child(3) { background: var(--rg-inv-green) center bottom / contain no-repeat; animation-delay: 0.4s; }

/* ── Game over (P7) ── */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-final-rank {
    font-size: 30px; line-height: 1.3; border: 0; border-radius: 0; box-shadow: none; transform: none;
    padding: 0; margin: 40px 0 34px;
    animation: rgDrop 0.52s cubic-bezier(0.3, 1.6, 0.5, 1) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .rg-final {
    display: flex; flex-direction: column; align-items: center; gap: 18px;
    margin: 0 10px; padding: 26px 12px 24px;
    background: #2A1800; border: 6px solid var(--rg-yellow);
    box-shadow: inset 0 0 0 6px var(--rg-orange), 0 0 16px rgba(255,180,0,0.5);
    animation: rgSpin 0.42s 0.4s steps(6) both;
}
#trivia-content.pop-quiz.ltd-retroGaming .rg-final-label { font-size: 12px; line-height: 12px; color: var(--rg-cyan); }
#trivia-content.pop-quiz.ltd-retroGaming .rg-final-value {
    font-size: 32px; line-height: 32px; color: var(--rg-yellow); text-shadow: 0 0 12px rgba(255,230,41,0.6);
    white-space: nowrap;
}
#trivia-content.pop-quiz.ltd-retroGaming .rg-thanks {
    margin-top: 34px; font-size: 12px; line-height: 12px; color: var(--rg-white);
    animation: rgBlink 1.2s steps(1) 1.2s infinite;
}
#trivia-content.pop-quiz.ltd-retroGaming .rg-invaders {
    display: flex; justify-content: center; gap: 30px; margin-top: 24px; height: 32px;
    animation: rgMarch 2s steps(1) infinite;
}
#trivia-content.pop-quiz.ltd-retroGaming .rg-invaders i { width: 40px; height: 32px; image-rendering: pixelated; }
#trivia-content.pop-quiz.ltd-retroGaming .rg-invaders i:nth-child(1) { background: var(--rg-inv-pink) center bottom / contain no-repeat; }
#trivia-content.pop-quiz.ltd-retroGaming .rg-invaders i:nth-child(2) { background: var(--rg-inv-cyan) center bottom / contain no-repeat; }
#trivia-content.pop-quiz.ltd-retroGaming .rg-invaders i:nth-child(3) { background: var(--rg-inv-green) center bottom / contain no-repeat; }

/* ── Score bar: 1UP and the score, in the page's flow under the answers ── */
#trivia-content.pop-quiz.ltd-retroGaming .trivia-score-bar {
    margin-top: 12px; padding: 8px 12px;
    background: #2A1800; border: 6px solid var(--rg-yellow); border-radius: 0;
    box-shadow: inset 0 0 0 6px var(--rg-orange);
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-score-label {
    display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
    font-size: 11px; line-height: 11px; letter-spacing: 0; color: var(--rg-white);
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-score-label::before {
    content: '1UP'; font-size: 10px; line-height: 10px; color: var(--rg-red);
    animation: rgBlink 1s steps(1) infinite;
}
#trivia-content.pop-quiz.ltd-retroGaming .trivia-score-value {
    font-family: inherit; font-weight: 400; font-size: 22px; line-height: 22px;
    color: var(--rg-yellow); text-shadow: 0 0 10px rgba(255,230,41,0.5);
}

/* ── Motion (stepped, like the display) ── */
@keyframes rgDrop { from { transform: translateY(-420px); } }
@keyframes rgSlideUp { from { transform: translateY(400px); } }
@keyframes rgSlideIn { from { transform: translateX(420px); } }
@keyframes rgSwingIn { from { transform: translateX(440px) rotate(14deg); } }
@keyframes rgSpin { from { transform: rotate(-180deg) scale(0); } }
@keyframes rgPopIn { from { transform: rotate(-20deg) scale(0); } }
@keyframes rgStamp { 0% { transform: rotate(-3deg) scale(2.4); } 100% { transform: rotate(-3deg) scale(1); } }
@keyframes rgSlam { 0% { transform: scale(2.6); } 100% { transform: scale(1); } }
@keyframes rgCrt {
    0% { transform: scale(0, 0.03); }
    20% { transform: scale(0.5, 0.03); }
    40% { transform: scale(1, 0.03); }
    60% { transform: scale(1, 0.35); }
    80% { transform: scale(1, 0.7); }
    100% { transform: scale(1, 1); }
}
@keyframes rgTick { 0% { transform: rotate(3deg) scale(1.03); } 50% { transform: rotate(3deg) scale(1.06); } 100% { transform: none; } }
@keyframes rgTickHard { 0% { transform: translateX(6px) rotate(3deg) scale(1.05); } 50% { transform: translateX(12px) rotate(6deg) scale(1.1); } 100% { transform: none; } }
@keyframes rgShake {
    0% { transform: translateX(-14px) rotate(-6deg); }
    33% { transform: translateX(14px) rotate(6deg); }
    66% { transform: translateX(-8px) rotate(-3deg); }
    100% { transform: none; }
}
@keyframes rgPixelOn { from { visibility: hidden; } to { visibility: visible; } }
@keyframes rgBlink { 0% { visibility: visible; } 72% { visibility: hidden; } 100% { visibility: hidden; } }
@keyframes rgBob { 0% { transform: none; } 50% { transform: translateY(-6px); } }
@keyframes rgHop { 0% { transform: translateY(-14px); } 33% { transform: none; } }
@keyframes rgMarch { 0% { transform: none; } 25% { transform: translateX(12px); } 50% { transform: translateX(24px); } 75% { transform: translateX(12px); } }
@media (prefers-reduced-motion: reduce) {
    #trivia-content.pop-quiz.ltd-retroGaming *, #trivia-content.pop-quiz.ltd-retroGaming *::before,
    #trivia-content.pop-quiz.ltd-retroGaming *::after { animation: none !important; transition: none !important; }
}
