/* Game Theme only. Palette: COMMON/roomplay-palettes.html / truth-detector.
   bg #F0CB19 (yellow, dark ink #17191F), surface/accent #272723 (white text), secondary #E88629 (dark ink only).
   Success/error tokens are unchanged; they sit on dark surfaces so they stay readable on the yellow page. */
:root {
  /* Answer and gender tones: COMMON/roomplay-palettes.html / truth-detector (correct, wrong, male, female). */
  --rp-correct: #77c15c;
  --rp-correct-ink: #17191f;
  --rp-wrong: #fd826a;
  --rp-wrong-ink: #17191f;
  --rp-male: #005a9d;
  --rp-female: #95255c;
  --bg-primary: #f0cb19;
  --bg-secondary: #272723;
  --bg-card: #272723;
  --text-primary: #17191f;
  --text-secondary: #3d3a2a;
  --text-placeholder: #6b6448;
  --accent-purple: #272723;
  --accent-purple-dark: #272723;
  --accent-blue: #272723;
  --accent-teal: #272723;
  --accent-teal-dark: #272723;
  --td-ink: #17191f;
  --td-surface: #272723;
  --td-on-surface: #ffffff;
  --td-on-surface-muted: #c9c6b8;
  --td-orange: #e88629;
  --settings-accent: #272723;
  --settings-accent-dark: #272723;
  --onboarding-accent: #272723;
  --onboarding-accent-dark: #272723;
  --onboarding-shadow: transparent;
  --onboarding-shadow-hover: transparent;
  --packs-accent: #272723;
  --packs-feedback-rgb: 39, 39, 35;
}
html, body[data-rp-game="truth-detector"], .page-loader { background: var(--bg-primary); }
body[data-rp-game="truth-detector"] { color: var(--td-ink); }
[data-rp-game="truth-detector"] .loader-spinner { border-color: rgba(39, 39, 35, .2); border-top-color: var(--td-surface); }

/* Actions: black primary (box artwork), black outline secondary. */
[data-rp-game="truth-detector"] .btn-play,
[data-rp-game="truth-detector"] .btn-next-slide,
[data-rp-game="truth-detector"] .btn-join.active { color: var(--td-on-surface); background: var(--td-surface); border-color: transparent; box-shadow: none; }
[data-rp-game="truth-detector"] .btn-play:disabled { color: var(--td-ink); background: rgba(39, 39, 35, .18); opacity: 1; }
[data-rp-game="truth-detector"] .btn-join,
[data-rp-game="truth-detector"] .btn-play.outlined,
[data-rp-game="truth-detector"] .btn-skip,
[data-rp-game="truth-detector"] .btn-additional-settings,
[data-rp-game="truth-detector"] .btn-copy { color: var(--td-ink); border: 2px solid var(--td-surface); background: transparent; box-shadow: none; }
[data-rp-game="truth-detector"] .btn-back { color: var(--td-ink); }
[data-rp-game="truth-detector"] .dot { background: rgba(39, 39, 35, .25); }
[data-rp-game="truth-detector"] .dot.active { background: var(--td-surface); }
[data-rp-game="truth-detector"] .input,
[data-rp-game="truth-detector"] .packs-summary { color: var(--td-on-surface); background: var(--td-surface); }
[data-rp-game="truth-detector"] .packs-summary .summary-text { color: var(--td-on-surface-muted); }
[data-rp-game="truth-detector"] .packs-summary strong { color: var(--td-orange); }
[data-rp-game="truth-detector"] .error-message { color: #8a1c1c; }

/* Lobby. */
[data-rp-game="truth-detector"] .room-code-display { color: var(--td-orange); background: var(--td-surface); }
[data-rp-game="truth-detector"] .lobby-hint,
[data-rp-game="truth-detector"] .lobby-status { color: var(--text-secondary); }
[data-rp-game="truth-detector"] .player-item { color: var(--td-on-surface); background: var(--td-surface); }
[data-rp-game="truth-detector"] .player-name { color: var(--td-on-surface); }
[data-rp-game="truth-detector"] .player-avatar { color: var(--td-ink); background: var(--td-orange); }
[data-rp-game="truth-detector"] .player-host { color: var(--td-orange); }

/* Game. */
[data-rp-game="truth-detector"] .round-badge { color: var(--td-on-surface); background: var(--td-surface); }
[data-rp-game="truth-detector"] .timer-badge:not(.warning) { color: var(--td-ink); background: var(--td-orange); }
[data-rp-game="truth-detector"] .question-text { color: var(--td-ink); }
[data-rp-game="truth-detector"] .phase-hint,
[data-rp-game="truth-detector"] .waiting-text { color: var(--text-secondary); }
[data-rp-game="truth-detector"] .yes-btn,
[data-rp-game="truth-detector"] .no-btn { color: var(--td-on-surface); background: var(--td-surface); border-color: var(--td-surface); }
[data-rp-game="truth-detector"] .yesno-btn.selected { color: var(--td-ink); background: var(--td-orange); border-color: var(--td-surface); box-shadow: none; }
[data-rp-game="truth-detector"] .number-btn { color: var(--td-on-surface); background: var(--td-surface); border-color: var(--td-surface); }
[data-rp-game="truth-detector"] .number-btn.selected { color: var(--td-ink); background: var(--td-orange); border-color: var(--td-surface); box-shadow: none; }
[data-rp-game="truth-detector"] .answer-feedback:not(:empty) { display: inline-block; padding: 6px 14px; border-radius: 999px; background: var(--td-surface); }
[data-rp-game="truth-detector"] .mini-score-item { color: var(--td-on-surface); background: var(--td-surface); }
[data-rp-game="truth-detector"] .mini-score-name { color: var(--td-on-surface); }
[data-rp-game="truth-detector"] .mini-score-value { color: var(--td-orange); }
[data-rp-game="truth-detector"] .mini-score-avatar-letter { color: var(--td-ink); background: var(--td-orange); }

/* Round reveal (shared RevealResults) on the yellow page: dark cards, ink headings. */
[data-rp-game="truth-detector"] .rr-context-text { color: var(--td-ink); }
[data-rp-game="truth-detector"] .rr-context-subtext { color: var(--text-secondary); }
[data-rp-game="truth-detector"] .td-yes-count { color: var(--td-ink); }
[data-rp-game="truth-detector"] .rr-option { background: var(--td-surface); border-color: var(--td-surface); }
[data-rp-game="truth-detector"] .rr-option-text,
[data-rp-game="truth-detector"] .rr-lb-name,
[data-rp-game="truth-detector"] .rr-lb-score { color: var(--td-on-surface); }
[data-rp-game="truth-detector"] .rr-voters-label,
[data-rp-game="truth-detector"] .rr-vote-count { color: var(--td-on-surface-muted); }
[data-rp-game="truth-detector"] .rr-voter { color: var(--td-on-surface); background: rgba(255, 255, 255, .12); }
[data-rp-game="truth-detector"] .rr-leaderboard-title { color: var(--text-secondary); }
[data-rp-game="truth-detector"] .rr-lb-row { background: var(--td-surface); border-color: var(--td-surface); }
[data-rp-game="truth-detector"] .rr-lb-row.rr-leading { border-color: var(--td-orange); }
[data-rp-game="truth-detector"] .rr-lb-pos { color: var(--td-on-surface-muted); background: rgba(255, 255, 255, .12); }

/* Final results. */
[data-rp-game="truth-detector"] .winner-name { color: var(--td-ink); }
[data-rp-game="truth-detector"] .score-item { color: var(--td-on-surface); background: var(--td-surface); border-color: var(--td-surface); }
[data-rp-game="truth-detector"] .score-item.leading { border-color: var(--td-orange); background: var(--td-surface); }
[data-rp-game="truth-detector"] .score-name { color: var(--td-on-surface); }
[data-rp-game="truth-detector"] .score-value { color: var(--td-orange); }
[data-rp-game="truth-detector"] .score-position:not(.gold):not(.silver):not(.bronze) { color: var(--td-on-surface); background: rgba(255, 255, 255, .12); }

/* Overlays and popups. */
[data-rp-game="truth-detector"] .connection-overlay { background: rgba(240, 203, 25, .96); }
[data-rp-game="truth-detector"] .connection-text { color: var(--td-ink); }
[data-rp-game="truth-detector"] .connection-spinner { border-color: rgba(39, 39, 35, .2); border-top-color: var(--td-surface); }
/* Exit confirmation and settings popups: colours go through the shared --rp-dialog-* tokens
   (assets/css/confirm-dialog.css). */
[data-rp-game="truth-detector"] {
  --rp-dialog-overlay: rgba(39, 39, 35, .72);
  --rp-dialog-bg: var(--td-surface);
  --rp-dialog-title: var(--td-on-surface);
  --rp-dialog-text: var(--td-on-surface-muted);
  --rp-dialog-primary-bg: var(--td-orange);
  --rp-dialog-primary-text: var(--td-ink);
  --rp-dialog-secondary-border: var(--td-on-surface);
  --rp-dialog-secondary-text: var(--td-on-surface);
  --rp-dialog-control-btn-bg: rgba(255, 255, 255, .14);
}

/* Onboarding: animated flat SVG characters (static copies via <picture> for reduced motion). */
[data-rp-game="truth-detector"] #onboarding-screen .slide-icon { width: min(240px, 55vw); margin-bottom: 18px; font-size: 0; line-height: 0; }
[data-rp-game="truth-detector"] #onboarding-screen .slide-icon picture,
[data-rp-game="truth-detector"] #onboarding-screen .slide-icon img { display: block; width: 100%; height: auto; }
[data-rp-game="truth-detector"] .slide-title { color: var(--td-ink); }
[data-rp-game="truth-detector"] .slide-text { color: var(--text-secondary); }
@media (max-height: 600px) {
  [data-rp-game="truth-detector"] #onboarding-screen .slide-icon { width: 120px; margin-bottom: 8px; }
}

/* Light motion, same rhythm as «Я никогда не» (cutout-theme.css): spring press/settle, 260–440 ms one-shots.
   Decorative only: never delays answers, timer or scoring; fully off under prefers-reduced-motion. */
@media (prefers-reduced-motion: no-preference) {
  [data-rp-game="truth-detector"] {
    --td-press: 100ms;
    --td-settle: 240ms;
    --td-spring: cubic-bezier(.2, .9, .3, 1.25);
  }
  [data-rp-game="truth-detector"] button:not(:disabled) {
    transition: scale var(--td-settle) var(--td-spring), translate var(--td-settle) var(--td-spring),
      background-color 150ms ease, border-color 150ms ease, color 150ms ease;
  }
  [data-rp-game="truth-detector"] button:not(:disabled):active { scale: .96; translate: 0 2px; transition-duration: var(--td-press); }
  [data-rp-game="truth-detector"] .btn-back:active { scale: .88; }
  [data-rp-game="truth-detector"] .dot { transition: background-color 180ms ease, scale 180ms var(--td-spring); }
  [data-rp-game="truth-detector"] .dot.active { scale: 1.12; }

  /* Onboarding character arrives on every slide change. */
  [data-rp-game="truth-detector"] .onboarding-slide.active .slide-icon { animation: td-character-arrive 380ms var(--td-spring) both; }

  /* Packs: shared touch classes from packs.js. */
  [data-rp-game="truth-detector"] .pack-card { transition: transform var(--td-settle) var(--td-spring), border-color 150ms ease; }
  [data-rp-game="truth-detector"] .pack-card.packs-touch-press:not(.locked) { transform: scale(.965); transition-duration: var(--td-press); }
  [data-rp-game="truth-detector"] .pack-card.packs-touch-pop:not(.locked) { animation: td-pop 320ms var(--td-spring); }
  [data-rp-game="truth-detector"] .pack-card.packs-touch-pop:not(.locked) .pack-art { animation: td-nod 360ms ease-out; }

  /* Lobby: room code lands like a stamp. */
  [data-rp-game="truth-detector"] #lobby-screen.active .room-code-display { animation: td-stamp-in 360ms var(--td-spring) both; }

  /* Round: question card arrives, each phase block slides in when it is shown. */
  [data-rp-game="truth-detector"] #game-screen.active .question-text { animation: td-paper-arrive 280ms var(--td-spring) both; }
  [data-rp-game="truth-detector"] #answer-phase,
  [data-rp-game="truth-detector"] #guess-phase,
  [data-rp-game="truth-detector"] #waiting-phase { animation: td-paper-arrive 280ms var(--td-spring) both; }
  [data-rp-game="truth-detector"] #guess-phase .number-btn { animation: td-pop-in 260ms var(--td-spring) both; }
  [data-rp-game="truth-detector"] #guess-phase .number-btn:nth-child(2) { animation-delay: 30ms; }
  [data-rp-game="truth-detector"] #guess-phase .number-btn:nth-child(3) { animation-delay: 60ms; }
  [data-rp-game="truth-detector"] #guess-phase .number-btn:nth-child(4) { animation-delay: 90ms; }
  [data-rp-game="truth-detector"] #guess-phase .number-btn:nth-child(n+5) { animation-delay: 120ms; }

  /* Answer: chosen button stamps, the question leans towards it (Yes right, No left). */
  [data-rp-game="truth-detector"] .yesno-btn.selected,
  [data-rp-game="truth-detector"] .number-btn.selected { animation: td-answer-stamp 260ms var(--td-spring); }
  [data-rp-game="truth-detector"] #game-screen:has(#btn-yes.selected) .question-text { --td-dir: 1; animation: td-card-answer 440ms ease-out; }
  [data-rp-game="truth-detector"] #game-screen:has(#btn-no.selected) .question-text { --td-dir: -1; animation: td-card-answer 440ms ease-out; }
  [data-rp-game="truth-detector"] .answer-feedback.success,
  [data-rp-game="truth-detector"] .answer-feedback.fail { animation: td-stamp-in 360ms var(--td-spring); }

  /* Final standings and popups. */
  [data-rp-game="truth-detector"] #results-screen.active .winner-icon { animation: td-nod 420ms ease-out 200ms both; }
  [data-rp-game="truth-detector"] #results-screen.active .score-item { animation: td-paper-arrive 280ms var(--td-spring) both; }
  [data-rp-game="truth-detector"] #results-screen.active .score-item:nth-child(2) { animation-delay: 60ms; }
  [data-rp-game="truth-detector"] #results-screen.active .score-item:nth-child(3) { animation-delay: 120ms; }
  [data-rp-game="truth-detector"] #results-screen.active .score-item:nth-child(n+4) { animation-delay: 180ms; }
  [data-rp-game="truth-detector"] .confirm-dialog-overlay.active .confirm-dialog-modal,
  [data-rp-game="truth-detector"] .settings-popup-overlay.active .settings-popup-modal { animation: td-paper-arrive 280ms var(--td-spring); }
}
@keyframes td-character-arrive {
  from { opacity: 0; scale: .82; rotate: -10deg; }
  to { opacity: 1; scale: 1; rotate: 0deg; }
}
@keyframes td-pop { 0% { transform: scale(.965); } 55% { transform: scale(1.018); } 100% { transform: scale(1); } }
@keyframes td-pop-in { from { opacity: 0; scale: .7; } to { opacity: 1; scale: 1; } }
@keyframes td-nod { 0%, 100% { rotate: 0deg; } 35% { rotate: -8deg; } 70% { rotate: 5deg; } }
@keyframes td-paper-arrive { from { opacity: 0; translate: 0 12px; scale: .97; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes td-stamp-in { from { opacity: 0; scale: 1.45; } to { opacity: 1; scale: 1; } }
@keyframes td-answer-stamp { 0% { scale: .94; } 65% { scale: 1.025; } 100% { scale: 1; } }
@keyframes td-card-answer {
  0%, 100% { transform: translateX(0) rotate(0); }
  35% { transform: translateX(calc(var(--td-dir, 1) * 12px)) rotate(calc(var(--td-dir, 1) * 3deg)); }
  70% { transform: translateX(calc(var(--td-dir, 1) * -3px)) rotate(calc(var(--td-dir, 1) * -.5deg)); }
}

/* Pack choice arrow: COMMON/roomplay-palettes.html / truth-detector secondary #E88629 (the accent is too dark for the ink outline). */
:root {
    --packs-cue-color: #E88629;
}

/* Like / dislike under the question while this phone waits (shared content-report.css).
   The page is yellow, so the thumbs use the dark ink and the pressed one the dark surface. */
:root {
    --rp-report-text: var(--td-ink);
    --rp-report-muted: var(--text-secondary);
    --rp-report-accent: var(--td-surface);
    --rp-report-accent-ink: var(--td-on-surface);
}
.td-card-vote { margin-top: 10px; }
.td-card-vote .rp-card-vote__btn { color: rgb(61 58 42 / 70%); }
.td-card-vote .rp-card-vote__btn:active { background: rgba(39, 39, 35, .1); }
.td-card-vote .rp-card-vote__btn[aria-pressed="true"] { color: var(--td-surface); }

/* «Сообщить об ошибке» sheet (shared content-report.css) in this game's palette (roomplay-palettes.html). */
:root {
  --rp-report-surface: #272723;
  --rp-report-text: #ffffff;
  --rp-report-muted: #c9c6b8;
  --rp-report-line: rgb(255 255 255 / 14%);
  --rp-report-chip: rgb(255 255 255 / 8%);
  --rp-report-accent: #f0cb19;
  --rp-report-accent-ink: #17191f;
}

/* «Кто как ответил?»: dark button on the yellow page, orange Premium badge, dark answers sheet with correct/wrong pills. */
[data-rp-game="truth-detector"] .td-who-answered-btn { background: var(--td-surface); color: var(--td-on-surface); box-shadow: 0 6px 18px rgba(23, 25, 31, .25); }
[data-rp-game="truth-detector"] .td-who-answered-btn:focus-visible { outline: 3px solid var(--td-ink); outline-offset: 3px; }
[data-rp-game="truth-detector"] .td-premium-badge { background: var(--td-orange); color: var(--td-ink); }
[data-rp-game="truth-detector"] .td-answers-card { background: var(--td-surface); color: var(--td-on-surface); }
[data-rp-game="truth-detector"] .td-answers-row { background: rgba(255, 255, 255, .07); }
[data-rp-game="truth-detector"] .td-answers-pill.is-yes { background: var(--rp-correct); color: var(--rp-correct-ink); }
[data-rp-game="truth-detector"] .td-answers-pill.is-no { background: var(--rp-wrong); color: var(--rp-wrong-ink); }
[data-rp-game="truth-detector"] .td-answers-pill.is-none { background: rgba(255, 255, 255, .12); color: var(--td-on-surface-muted); }
[data-rp-game="truth-detector"] .td-answers-card .btn-play { background: var(--td-orange); color: var(--td-ink); }