/* DOUBLE SPEED — Ocean / ice palette. Keep all four game modes and card motion. */
:root {
  color-scheme: dark;
  --ink: #edf6ff;
  --muted: #afcbe7;
  --blue-ice: #c8e7ff;
  --blue-electric: #6bc0ff;
  --blue-border: #527eac;
  --navy: #071c38;
  --blue-surface: #10345d;
  --white-surface: #f5fbff;
  color: var(--ink);
  background: #07192f;
}
body { background: radial-gradient(ellipse at 50% -24%, #164e8c 0, transparent 60%), #07192f; }
.topbar { border-color:#2e537d; }
.brand b,.brand-icon,.sparkle,.strip-diamond { color:#9cd6ff; }
.brand-icon,.icon-btn { border-color:#547ba7; }
.icon-btn,.subtle { color:#e4f2ff; }
.heading .eyebrow,.eyebrow { color:#b6dcff; }
.live-dot,.online-pulse { background:#81caff;box-shadow:0 0 11px #55baff; }
.heading h1 em { color:#a8daff; }
.heading p,.toolbar-note,.small { color:#a9c8e2; }
.table-top { background:radial-gradient(ellipse at 50% 45%,#1e6ba9 0,#15558b 61%,#0b3866 100%);border-color:#609bc9;box-shadow:inset 0 0 0 6px #0e3764,0 25px 55px #010d2170; }
.table-meta .name { color:#f2f8ff; }
.ai-avatar { background:#3778a8;color:#e0f4ff; }
.you-avatar { background:#e4f5ff;color:#124b80; }
.status-tag { background:#376f9d;color:#def1ff; }
.status-tag.human-tag { background:#90caff;color:#113c66; }
.deck-status { color:#bfdaf0; }
.deck-status strong { color:#fff; }
.centerline { color:#d2eaff; }
.centerline span { background:#5e9ec6; }
.playing-card { background:#fffefc;color:#183459;border-color:#f0f8ff;box-shadow:0 5px 0 #bed2e6,0 9px 16px #03172a74; }
.playing-card { touch-action:manipulation;-webkit-tap-highlight-color:transparent; }
.playing-card:not(:disabled):active { transform:translateY(-2px) scale(.985); }
.playing-card.tap-pending { border-color:#a7dcff;box-shadow:0 0 0 3px #a9dfff80,0 5px 0 #bed2e6; }
.playing-card:not(:disabled):hover { box-shadow:0 9px 0 #c6dceb,0 14px 17px #031a3478; }
.playing-card.selected { border-color:#82cbff;box-shadow:0 0 0 4px #b5e5ff,0 7px 22px #8bd2ff85; }
.playing-card.match-cue { animation-name:blue-match-glow; }
@keyframes blue-match-glow { to { box-shadow:0 0 0 3px #9ed9ff,0 5px 0 #c8dbea; } }
.card-placeholder { border-color:#6ca6d1;background:#addfff17;color:#95c8e9; }
.no-match-overlay { background:#082c53ed; }
.no-match-symbol { border-color:#acdfff;color:#e3f5ff; }
.no-match-overlay strong { color:#f3faff; }
.no-match-overlay small { color:#b9dfff; }
.loading-track { background:#335f88; }
.loading-track span { background:#bfe7ff; }
.bottom-strip, footer { color:#779fc4; }
.bottom-strip .stat-compact b { color:#c6e7ff; }
footer { border-color:#2b5077; }
.main-btn { background:#f3faff;color:#123c71;box-shadow:0 4px 0 #8bbce5; }
.main-btn:hover { background:#cfeaff; }
.main-btn:active { box-shadow:0 2px 0 #8bbce5; }
.rules-btn { background:#113c6d;border-color:#568ab6;color:#ebf6ff; }
.rules-btn:hover { background:#1b5289;border-color:#a5d7ff; }
.rules-btn span { color:#bbdfff; }
.online-bar { background:#103b65;border-color:#578cb9;color:#e1f3ff; }
.online-bar-code { color:#b5d3ed; }
.online-bar-code b { color:#f1f8ff; }
.online-bar button { border-color:#72acd9;color:#ebf7ff; }
.deck-stack::before,.deck-stack::after,.deck-stack .deck-face { border-color:#c9e7fb;box-shadow:0 2px 3px #06152d6b; }
.deck-stack::before,.deck-stack::after { background:#134b84; }
.deck-stack .deck-face { color:#ecf8ff;background:repeating-linear-gradient(45deg,#246cab 0 4px,#15538d 4px 8px);outline-color:#72b2e4; }
.tabletop-travel-back { color:#e1f4ff;border-color:#f2faff;box-shadow:inset 0 0 0 2px #8abbe4,inset 0 0 0 7px #154c85;background:repeating-linear-gradient(45deg,#2873ae 0 9px,#17548f 9px 18px); }
.playing-card.tabletop-travel { box-shadow:0 14px 25px #01152b73,0 4px 0 #b6d1e6; }
.playing-card.flying-card { box-shadow:0 15px 27px #03172b82,0 5px 0 #b5d2e6; }
@keyframes card-landed { 0% { transform:scale(1.045);box-shadow:0 10px 18px #051b3670,0 0 0 3px #abdcff; } 100% { transform:scale(1); } }
.result-overlay { background:radial-gradient(circle at center,#2166a7f5 0%,#072d59fa 76%);border-color:#9ccfff; }
.result-overline,.result-spark { color:#bde4ff; }
.result-overlay strong { color:#e6f6ff; }
.result-overlay p { color:#cfebff; }
.result-rematch { background:#e5f5ff;color:#104575;box-shadow:0 5px 0 #75a9d6; }
.result-rematch:hover { background:#fff; }
.result-overlay.defeat { background:radial-gradient(circle at center,#385c7cf5,#102845fb 76%);border-color:#8eaec8; }
.result-overlay.defeat .result-overline,.result-overlay.defeat strong { color:#e1f0ff; }
.result-overlay.tie { background:radial-gradient(circle at center,#285f92f5,#082d5afa 76%); }
dialog { background:#0d3056;border-color:#669aca;color:#ecf7ff;box-shadow:0 25px 70px #010b22a8; }
dialog::backdrop { background:#020d23c9; }
dialog ol { color:#d5e8f7; }
dialog .fine-print { color:#a4c5df; }
#settingsDialog select { background:#164676;color:#f3faff;border-color:#6b9bc4; }
.online-bar button,.share-row button,.join-row button { transition:background .16s; }

/* Optional player call, tucked below the user's remaining deck count. */
.deck-and-call { display:flex; flex-direction:column; align-items:flex-end; gap:7px; }
.no-match-call-wrap { flex:0 0 auto; }
.no-match-call-btn { min-height:40px; border-radius:10px; padding:0 15px; font-size:12px; font-weight:800; letter-spacing:.02em; color:#f0faff; background:#174e85; border:1px solid #91c7ed; box-shadow:inset 0 0 0 1px #8ac2ed1c; white-space:nowrap; transition:background .16s,border-color .16s; }
.no-match-call-btn:not(:disabled):hover { background:#236ca9; border-color:#d3edff; }
.no-match-call-btn:not(:disabled):active { background:#0d3e72; }
.no-match-call-btn:disabled { opacity:.48; cursor:default; }
.no-match-call-btn.hidden { display:none; }
.no-match-call-btn:focus-visible { outline:3px solid #bce4ff; outline-offset:3px; }
.no-match-feedback { pointer-events:none; position:absolute; z-index:6; top:50%; left:50%; width:max-content; max-width:min(380px,92%); min-width:min(305px,84%); display:flex; justify-content:center; align-items:center; gap:14px; padding:17px 23px; border-radius:16px; border:2px solid #b4e7ff; background:linear-gradient(135deg,#ffffff,#cbeeff); color:#104a80; box-shadow:0 0 0 6px #87cfff45,0 18px 55px #021329cb; opacity:0; visibility:hidden; transform:translate(-50%,-42%) scale(.9); transition:opacity .19s,transform .19s,visibility .19s; }
.no-match-feedback.visible { opacity:1; visibility:visible; transform:translate(-50%,-50%) scale(1); }
.call-feedback-icon { flex:0 0 auto; width:48px; height:48px; display:grid; place-items:center; border-radius:50%; background:#1766a9; color:#f6fdff; font-size:29px; font-weight:900; box-shadow:0 0 0 4px #a4d9f8; }
.call-feedback-copy { display:flex; flex-direction:column; gap:5px; }
.call-feedback-copy strong { color:inherit; font:900 clamp(21px,3vw,28px)/1 Outfit,sans-serif; letter-spacing:-.035em; }
.call-feedback-copy small { color:inherit; opacity:.85; font-size:10px; font-weight:900; letter-spacing:.08em; }
.no-match-feedback.wrong { background:linear-gradient(130deg,#153d6a,#09294e); border-color:#9cbfe2; color:#fff; box-shadow:0 0 0 6px #83aed844,0 18px 55px #03142bc9; }
.no-match-feedback.wrong .call-feedback-icon { background:#416c98; box-shadow:0 0 0 4px #80aace; }
.no-match-feedback.stale,.no-match-feedback.error { background:#153b63; border-color:#789dc4; color:#e8f5ff; }
.sharp-eyes-stats { display:flex; align-items:center; flex-wrap:wrap; gap:5px; font-size:10px; color:#87aed0; }
.sharp-eyes-stats>span { color:#a8d5fa; letter-spacing:.12em; }
.sharp-eyes-stats b { color:#cbeaff; font:800 15px Outfit,sans-serif; margin-left:5px; }
@media(max-width:550px) {
  .no-match-call-btn { font-size:11px; min-height:39px; padding:0 12px; }
  .sharp-eyes-stats { font-size:9px; }
  .no-match-feedback { gap:10px; padding:13px 15px; border-radius:12px; }
  .call-feedback-icon { width:40px; height:40px; font-size:24px; }
  .call-feedback-copy strong { font-size:21px; }
  .call-feedback-copy small { font-size:9px; }
}
@media(max-width:420px) {
  .game-buttons { flex-wrap:wrap; }
  .game-buttons .main-btn { flex:1 0 100%; }
}
@media(prefers-reduced-motion:reduce) { .no-match-feedback,.no-match-call-btn { transition:none; } }

/* Home screen: a blue arena with an icy-white challenge card. */
.home-screen { background:radial-gradient(ellipse at 67% 5%,#174f92 0%,transparent 46%),radial-gradient(ellipse at 5% 93%,#0d386b,transparent 44%),#061831; }
.home-topline { border-color:#4b74a66b; }
.home-brand,.home-brand b { color:#f1faff; }
.home-brand b { color:#9ed5ff; }
.home-brand-mark { border-color:#82bdec;color:#d6f0ff; }
.home-rules { background:#123762;color:#f1f8ff;border-color:#5487bd; }
.home-rules:hover { background:#20528b; }
.home-hero { border-color:#5c9ed7;background:radial-gradient(ellipse at 91% 42%,#3b98d4 0%,transparent 45%),linear-gradient(116deg,#1b5593 0%,#103d76 60%,#092e60 100%);box-shadow:inset 0 0 0 5px #0e3a6d,0 18px 48px #020f2b7d; }
.home-hero::after { background:repeating-linear-gradient(135deg,transparent,transparent 47px,#e5f5ff08 48px,#e5f5ff08 49px); }
.home-hero .mode-badge { border-color:#9bc8eb;color:#effbff;background:#07305ba8; }
.home-hero h2,.home-hero h2 em { color:#f5fbff; }
.home-hero h2 em { color:#b9e5ff; }
.home-lede { color:#e5f6ff; }
.home-lede strong { color:#fff; }
.home-hero-sub { color:#b9d5ec; }
.home-hero-tags span { background:#0a3460ad;border-color:#7eb9e5a1;color:#d8f0ff; }
.hero-speed-ring { border-color:#e9f8ff7d;box-shadow:0 0 70px #c2ebff29; }
.hero-art-flash { color:#fff;text-shadow:0 0 24px #a0dfff; }
.hero-playing-card { color:#0e3e73; }
.hero-card-middle { color:#d64b53; }
.home-section-eyebrow { color:#9ed5ff; }
.home-section-heading h3 { color:#f2faff; }
.home-section-aside { color:#84b4da; }
.home-mode-grid .mode-option { background:linear-gradient(135deg,#153e70,#0c2d57);border-color:#4f7fb0;box-shadow:0 9px 26px #020f2c78; }
.home-mode-grid .mode-option:hover,.home-mode-grid .mode-option:focus-visible { background:linear-gradient(135deg,#235991,#123f75);border-color:#c9eaff; }
.home-mode-grid .mode-icon { background:#255987;color:#d8efff; }
.home-mode-grid .mode-title { color:#fff; }
.home-mode-grid .mode-caption { color:#bdd5e9; }
.home-mode-grid .mode-arrow { color:#aee0ff; }
.home-mode-grid .mode-option-featured { background:linear-gradient(111deg,#f7fbff 0%,#e5f3ff 59%,#c2e2ff 100%);border-color:#faffff;box-shadow:0 8px 0 #427ab7,0 21px 38px #01152f9e;color:#0b315e; }
.home-mode-grid .mode-option-featured:hover,.home-mode-grid .mode-option-featured:focus-visible { background:linear-gradient(111deg,#fff 0%,#ecf7ff 59%,#d2edff 100%);border-color:#fff; }
.mode-option-featured .mode-kicker { color:#427bad; }
.feature-live-dot { background:#3389db;box-shadow:0 0 0 4px #73b6ef3e; }
.mode-option-featured .mode-title { color:#073969; }
.feature-exclamation { color:#4ba1e8; }
.mode-option-featured .mode-caption { color:#476889; }
.featured-cta { background:#1162bb;border-color:#115dac;color:#f9fdff;box-shadow:0 3px 0 #7aafd9; }
.mode-option-featured .featured-cta { color:#f9fdff; }
.feature-card { background:#fff;border-color:#fff;color:#105290;box-shadow:0 9px 20px #204b8047; }
.feature-card-two { color:#db4855; }
.feature-burst { color:#fff;text-shadow:0 0 15px #fff; }
.daily-card-date { color:#b6e2ff; }
.daily-card-best { color:#b3d3ef; }
.home-bottom-line { color:#80b4db; }
.home-bottom-line b { color:#c9ecff; }

/* Multiplayer room and controls. */
.mode-screen:not(.home-screen):not(.daily-screen) { background:radial-gradient(ellipse at 50% 18%,#194f87,#06172d 70%); }
.mode-badge { border-color:#7099c0;color:#c6e7ff; }
.lobby-panel { background:linear-gradient(140deg,#184a7e,#0c2b54);border-color:#689bce;box-shadow:0 26px 60px #020b219c; }
.lobby-back,.lobby-panel p { color:#c5ddf1; }
.lobby-panel h2 { color:#eff8ff; }
.friend-choices .main-btn { color:#0a417c; }
.join-row input,.share-row input { border-color:#719dc5;background:#09284e;color:#f2faff; }
.join-row button,.share-row button { background:#20548e;border-color:#79add7;color:#f1f8ff; }
.join-row button:hover,.share-row button:hover { background:#2b69a9; }
.waiting-panel { border-color:#5e93c1;background:#103864; }
.waiting-animation span { background:#cae9ff; }
#waitingText { color:#e5f6ff; }
.room-chip { color:#b0d1eb; }
.room-chip strong { background:#e9f6ff;color:#0d467e; }
.lobby-hint { color:#b0cee4; }
.lobby-error { color:#ffbdc5 !important; }

/* Daily Reflex: same functionality, blue table and white score card. */
.daily-screen { background:radial-gradient(ellipse at 50% -20%,#1b5395,transparent 60%),#07192f; }
.daily-header { border-color:#557fb16b; }
.daily-header-name { color:#c1dff4; }
.daily-header-name b { color:#aee0ff; }
.daily-intro h2,.daily-result h2 { color:#f1faff; }
.daily-intro h2 em { color:#a8daff; }
.daily-intro>p { color:#bfd9ee; }
.daily-intro-metrics { background:#103960;border-color:#5e89b8; }
.daily-intro-metrics>div+div { border-color:#5079a6; }
.daily-intro-metrics span,.daily-result-grid span { color:#9fc3e4; }
.daily-intro-metrics strong,.daily-result-grid strong { color:#f1f9ff; }
.daily-intro>small { color:#96b9d7; }
.daily-stat-label { color:#b0d3ec; }
.daily-stats strong { color:#edf8ff; }
.daily-stats strong small { color:#b5deff; }
.daily-progress-track { background:#285782; }
.daily-progress-track>span { background:#c4e6ff; }
.daily-felt { background:radial-gradient(ellipse at center,#2775b5,#104774);border-color:#74afe2;box-shadow:inset 0 0 0 6px #0c3869,0 19px 45px #010d267e; }
.daily-board-message { color:#e0f4ff; }
.daily-hint { color:#9dbbd8; }
.daily-playing-card.daily-correct { border-color:#7dcaff;box-shadow:0 0 0 5px #cae9ff,0 12px 23px #051d39; }
.daily-result .result-overline { color:#aedaff; }
.daily-trophy { color:#dff3ff;text-shadow:0 0 25px #91cfff; }
.daily-result-score { background:linear-gradient(120deg,#fff 0%,#ebf7ff 55%,#cce9ff 100%);color:#0b427c; }
.daily-result-score small { color:#426e99; }
.daily-result-grid>div { background:#12385f;border-color:#507fad; }
.daily-share-btn { background:#194d82;border-color:#6b9fd0;color:#f0f9ff; }
.daily-share-btn:hover { background:#2869ad; }
.daily-history { border-color:#416f9d; }
.daily-history-value,.daily-history-day { color:#a6c7e4; }
.daily-history-bar { background:#437eb6; }
.daily-history-col.current .daily-history-bar { background:#b9e2ff; }

@media (max-width:600px) {
  .daily-felt { box-shadow:inset 0 0 0 3px #0c3869; }
}