/* AURORA POKER — Visual Experience Refresh
   Presentation only. This file intentionally loads after every existing
   stylesheet so the new family language can be removed in one step without
   touching game logic, table geometry, Focus View behavior, or networking. */

:root {
  --ap-night-0: #03050d;
  --ap-night-1: #070b18;
  --ap-night-2: #0b1224;
  --ap-night-3: #111b31;
  --ap-surface: rgba(13, 20, 39, .78);
  --ap-surface-strong: rgba(10, 16, 31, .94);
  --ap-line: rgba(148, 170, 255, .17);
  --ap-line-strong: rgba(113, 224, 217, .38);
  --ap-text: #f5f7ff;
  --ap-muted: #9aa8c7;
  --ap-blue: #668cff;
  --ap-violet: #9a7cff;
  --ap-teal: #61dfd0;
  --ap-glow-blue: rgba(81, 117, 255, .20);
  --ap-glow-violet: rgba(154, 124, 255, .18);
  --ap-glow-teal: rgba(97, 223, 208, .16);

  --bg: var(--ap-night-0);
  --surface: var(--ap-surface-strong);
  --text: var(--ap-text);
  --muted: var(--ap-muted);
  --accent: var(--ap-teal);

  /* Existing components consume the tt-gold family as their sole emphasis
     channel. Reassigning that channel preserves state semantics while moving
     the product away from casino gold. */
  --tt-felt-hi: #172a48;
  --tt-felt: #0c1b31;
  --tt-felt-lo: #050914;
  --tt-felt-highlight: rgba(99, 223, 210, .10);
  --tt-rail-hi: #202b43;
  --tt-rail: #101728;
  --tt-rail-lo: #050812;
  --tt-rail-highlight: rgba(168, 184, 255, .14);
  --tt-rail-grain: rgba(107, 125, 177, .07);
  --tt-gold: var(--ap-teal);
  --tt-gold-dim: rgba(97, 223, 208, .27);
  --tt-gold-glow: rgba(97, 223, 208, .18);
  --tt-seat-surface: rgba(9, 15, 30, .89);
  --tt-seat-border: rgba(137, 157, 221, .18);
  --tt-seat-border-active: rgba(97, 223, 208, .62);
  --tt-avatar-ring: #829dff;
  --tt-avatar-bg: #0b1122;
  --tt-dealer-bg: linear-gradient(145deg, #eaf3ff, #89a5ff 56%, #6d68c8);
  --tt-dealer-text: #081021;
  --tt-dealer-border: rgba(198, 213, 255, .72);
  --tt-timer-track: rgba(126, 149, 224, .18);
  --tt-timer-normal: var(--ap-teal);
  --tt-btn-fold-from: #4a3547;
  --tt-btn-fold-to: #291d2c;
  --tt-btn-check-from: #293a59;
  --tt-btn-check-to: #17233c;
  --tt-btn-call-from: #466fe6;
  --tt-btn-call-to: #2845a8;
  --tt-btn-raise-from: #a07eff;
  --tt-btn-raise-to: #5f63dc;
  --tt-btn-raise-text: #fff;
  --tt-shadow-table: 0 28px 80px rgba(0, 0, 0, .72), 0 0 42px rgba(89, 103, 220, .09);
  --tt-shadow-pod: 0 12px 28px rgba(0, 0, 0, .52);
}

body {
  background:
    radial-gradient(circle at 16% 8%, rgba(70, 99, 211, .18), transparent 34%),
    radial-gradient(circle at 84% 18%, rgba(103, 67, 181, .14), transparent 30%),
    var(--ap-night-0);
}

/* Invite deep-link landing page shares the same after-dark palette. */
body.join-body {
  background:
    radial-gradient(circle at 15% 0%, rgba(83, 120, 239, .24), transparent 40%),
    radial-gradient(circle at 90% 28%, rgba(149, 91, 224, .17), transparent 42%),
    linear-gradient(155deg, #040713, #080e1f 58%, #040610);
  color: var(--ap-text);
}
.join-kicker { color: var(--ap-teal); }
.join-subtitle,
.join-install-card p { color: var(--ap-muted); }
.join-room-card,
.join-install-card {
  border-color: var(--ap-line);
  background: linear-gradient(150deg, rgba(17, 27, 51, .9), rgba(7, 12, 25, .94));
  box-shadow: 0 22px 58px rgba(0, 0, 0, .38), inset 0 1px rgba(255, 255, 255, .04);
}
.join-room-label { color: var(--ap-teal); }
.join-room-code { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; letter-spacing: .12em; }
.join-cta {
  border-color: rgba(129, 228, 219, .38);
  background: linear-gradient(135deg, #77e3d7, #668cde 58%, #7568ce);
  color: #06121b;
}
.join-install-action { border-color: var(--ap-line-strong); background: rgba(97, 223, 208, .08); color: #c9fff8; }
.join-note { color: #7fe3d5 !important; }

/* ── Aurora Poker front door / app shell ───────────────────────────────── */
#auroraShell {
  --ash-felt-950: var(--ap-night-0);
  --ash-felt-800: var(--ap-night-2);
  --ash-felt-650: #182a48;
  --ash-brass-300: #b9fff5;
  --ash-brass-500: var(--ap-teal);
  --ash-brass-700: #478fa3;
  --ash-parchment: var(--ap-text);
  --ash-ink-300: var(--ap-muted);
  --ash-ink-500: #71809f;
  --ash-win: #6ee7c4;
  --ash-loss: #d57994;
  --ash-line: var(--ap-line);
  --ash-font-display: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(ellipse 850px 620px at 8% -5%, rgba(74, 111, 242, .22), transparent 64%),
    radial-gradient(ellipse 720px 560px at 95% 10%, rgba(149, 91, 224, .18), transparent 62%),
    radial-gradient(ellipse 620px 440px at 52% 102%, rgba(66, 210, 196, .08), transparent 65%),
    linear-gradient(145deg, #050813, #080d1c 50%, #050711);
  isolation: isolate;
}
#auroraShell::before,
#auroraShell::after {
  content: '';
  position: fixed;
  border-radius: 999px;
  filter: blur(90px);
  pointer-events: none;
  z-index: 0;
  opacity: .45;
  animation: ap-aurora-drift 18s ease-in-out infinite alternate;
}
#auroraShell::before { width: 36vw; height: 24vw; min-width: 280px; min-height: 190px; left: -8vw; top: 18%; background: rgba(66, 105, 241, .18); }
#auroraShell::after { width: 32vw; height: 27vw; min-width: 250px; min-height: 210px; right: -7vw; top: 42%; background: rgba(128, 72, 208, .15); animation-delay: -8s; }
@keyframes ap-aurora-drift { to { transform: translate3d(4vw, -3vh, 0) scale(1.08); } }

#auroraShell .ash-frame { position: relative; z-index: 1; max-width: 1280px; }
#auroraShell .ash-main { max-width: 880px; padding-top: 44px; }
#auroraShell .ash-rail {
  border-right-color: rgba(145, 165, 230, .13);
  background: linear-gradient(180deg, rgba(8, 13, 27, .58), rgba(5, 8, 18, .24));
  backdrop-filter: blur(18px);
}
#auroraShell .ash-rail > button.active {
  color: #d8fffa;
  background: linear-gradient(90deg, rgba(97, 223, 208, .12), transparent);
  box-shadow: inset 2px 0 var(--ap-teal);
}

.ash-brand { gap: 12px; }
.ash-mark {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(144, 167, 255, .42);
  background:
    radial-gradient(circle at 35% 20%, rgba(185, 255, 245, .20), transparent 58%),
    linear-gradient(145deg, rgba(37, 53, 92, .88), rgba(12, 19, 38, .92));
  box-shadow: 0 0 22px rgba(89, 113, 235, .18), inset 0 1px rgba(255, 255, 255, .08);
}
.ash-mark::before { display: none; }
.ash-mark span {
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .08em;
  color: #cbfff8;
}
.ash-brand b { font-family: var(--ash-font-display); font-size: 14px; font-weight: 750; letter-spacing: .22em; }
.ash-brand small { color: #8ca4ff; font-size: 9px; font-weight: 800; letter-spacing: .32em; }

.ash-kicker { color: var(--ap-teal); font-size: 10px; letter-spacing: .28em; }
.ash-h1 { font-family: var(--ash-font-display); font-weight: 720; letter-spacing: -.035em; }
.ash-poker-title { margin-top: 8px; font-size: clamp(42px, 7vw, 72px); line-height: .95; letter-spacing: -.055em; }
.ash-poker-title span {
  color: transparent;
  background: linear-gradient(100deg, #d8fffa 0%, #84a0ff 48%, #b38cff 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
.ash-poker-subtitle { margin-top: 16px; font-size: clamp(15px, 2vw, 18px); color: #b2bdd7; letter-spacing: .01em; }

#auroraShell .ash-doors { grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 28px; }
#auroraShell .ash-door {
  min-height: 212px;
  border-radius: 22px;
  padding: 22px;
  border-color: rgba(142, 161, 224, .18);
  background:
    radial-gradient(circle at 88% 4%, rgba(109, 128, 216, .13), transparent 42%),
    linear-gradient(155deg, rgba(18, 28, 53, .92), rgba(8, 13, 27, .95));
  box-shadow: 0 22px 54px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .045);
  backdrop-filter: blur(16px);
}
#auroraShell .ash-door:hover {
  transform: translateY(-4px);
  border-color: rgba(105, 222, 214, .42);
  box-shadow: 0 28px 64px rgba(0, 0, 0, .44), 0 0 32px rgba(86, 110, 218, .09);
}
#auroraShell .ash-door.primary {
  border-color: rgba(112, 151, 255, .28);
  background:
    radial-gradient(circle at 90% 0%, rgba(115, 123, 255, .24), transparent 46%),
    radial-gradient(circle at 15% 110%, rgba(64, 210, 194, .11), transparent 46%),
    linear-gradient(155deg, rgba(20, 31, 59, .96), rgba(8, 13, 28, .98));
}
#auroraShell .ash-door.primary.ai {
  background:
    radial-gradient(circle at 90% 0%, rgba(161, 103, 233, .23), transparent 46%),
    radial-gradient(circle at 12% 112%, rgba(77, 129, 239, .12), transparent 45%),
    linear-gradient(155deg, rgba(24, 27, 57, .96), rgba(9, 12, 28, .98));
}
#auroraShell .ash-door.secondary {
  grid-column: 1 / -1;
  min-height: 106px;
  display: grid;
  grid-template-columns: minmax(180px, .7fr) 1fr auto;
  align-items: center;
  gap: 8px 24px;
  padding: 18px 22px;
}
#auroraShell .ash-door.secondary .door-kicker,
#auroraShell .ash-door.secondary h3 { grid-column: 1; }
#auroraShell .ash-door.secondary p { grid-column: 2; grid-row: 1 / 3; }
#auroraShell .ash-door.secondary .cta { grid-column: 3; grid-row: 1 / 3; margin: 0; }
#auroraShell .ash-door .suit { color: rgba(161, 179, 245, .055); font-size: 104px; }
#auroraShell .ash-door h3 { font-size: 21px; font-weight: 690; letter-spacing: -.015em; }
#auroraShell .ash-door p { color: #9ca9c7; font-size: 13px; max-width: 360px; }
#auroraShell .ash-door .door-kicker {
  position: relative;
  z-index: 1;
  font-family: var(--ash-font-mono);
  color: #84ddd4;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .17em;
  text-transform: uppercase;
}
#auroraShell .ash-door .cta,
#auroraShell .ash-door.primary .cta {
  border: 1px solid rgba(112, 224, 214, .32);
  background: rgba(82, 196, 190, .09);
  color: #c9fff8;
  padding: 8px 13px;
}
#auroraShell .ash-door.primary .cta::after { display: none; }

.ash-secondary-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.ash-secondary-links button {
  min-height: 40px;
  border: 1px solid rgba(137, 157, 220, .16);
  border-radius: 999px;
  padding: 9px 15px;
  background: rgba(15, 23, 44, .58);
  color: #a9b5d0;
  font-family: var(--ash-font-mono);
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
}
.ash-secondary-links button:hover,
.ash-secondary-links button:focus-visible { border-color: rgba(97, 223, 208, .4); color: #d9fffa; }

#auroraShell .ash-tile,
#auroraShell .ash-ledger,
#auroraShell .ash-ticket,
#auroraShell .agd-card,
#auroraShell .agd-qa,
#auroraShell .agd-tip {
  border-color: var(--ap-line);
  background: linear-gradient(155deg, rgba(16, 25, 48, .84), rgba(7, 12, 25, .94));
}
#auroraShell .ash-mobile-nav {
  background: rgba(5, 9, 19, .9);
  border-top-color: var(--ap-line);
}
#auroraShell .ash-mobile-nav button.active { color: #c8fff8; background: rgba(97, 223, 208, .09); }
#auroraShell .ash-seat-coin {
  color: #07111a;
  background: linear-gradient(145deg, #b9fff5, #6dc8d0 60%, #727ee1);
  box-shadow: 0 0 0 1px rgba(199, 255, 248, .34), 0 8px 22px rgba(0, 0, 0, .38);
}

/* ── Create / join preflight and multiplayer lobby ─────────────────────── */
.home-overlay {
  background:
    radial-gradient(ellipse 720px 520px at 12% 0%, rgba(70, 106, 235, .22), transparent 65%),
    radial-gradient(ellipse 620px 500px at 92% 18%, rgba(143, 83, 218, .17), transparent 64%),
    linear-gradient(145deg, #040711, #080d1c 56%, #050711);
}
.home-box {
  width: min(1040px, 94vw);
  border: 1px solid var(--ap-line);
  border-radius: 24px;
  padding: 28px;
  background: linear-gradient(145deg, rgba(15, 23, 45, .90), rgba(7, 12, 25, .94));
  box-shadow: 0 32px 90px rgba(0, 0, 0, .56), inset 0 1px rgba(255, 255, 255, .04);
  backdrop-filter: blur(22px);
}
.home-brand {
  color: var(--ap-text);
  font-size: clamp(2rem, 6vw, 4rem);
  letter-spacing: -.04em;
  text-transform: uppercase;
}
.home-sub { color: #a8b5d0; font-size: .92rem; }
.home-flow-intro { text-align: left; margin: 2px 0 4px; }
.home-eyebrow,
.home-card-kicker {
  display: block;
  color: var(--ap-teal);
  font: 800 .62rem/1.2 ui-monospace, "SFMono-Regular", Menlo, monospace;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.home-flow-intro h2 { margin-top: 7px; font-size: clamp(1.45rem, 3vw, 2.3rem); letter-spacing: -.035em; }
.home-flow-intro p { margin-top: 5px; color: var(--ap-muted); font-size: .8rem; }
.home-name-field { display: grid; grid-template-columns: auto minmax(180px, 340px); align-items: center; gap: 12px; text-align: left; }
.home-name-field > span {
  color: #8e9bb9;
  font: 750 .62rem/1 ui-monospace, "SFMono-Regular", Menlo, monospace;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.home-step input,
.home-step select {
  border-color: rgba(138, 159, 224, .20);
  background: rgba(5, 10, 23, .72);
  color: var(--ap-text);
}
.home-step input:focus,
.home-step select:focus { outline: 2px solid rgba(97, 223, 208, .42); outline-offset: 1px; }
.home-access-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); gap: 14px; text-align: left; }
.home-access-card {
  display: flex;
  flex-direction: column;
  gap: 11px;
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--ap-line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 95% 0%, rgba(92, 112, 219, .13), transparent 42%),
    linear-gradient(150deg, rgba(17, 27, 51, .84), rgba(7, 12, 25, .92));
  box-shadow: 0 16px 38px rgba(0, 0, 0, .22);
}
.home-access-card h3 { margin-top: -4px; font-size: 1.08rem; color: var(--ap-text); }
.home-card-copy { color: var(--ap-muted); font-size: .73rem; line-height: 1.5; }
.home-create-card { border-color: rgba(104, 144, 255, .25); }
.home-join-card { border-color: rgba(156, 124, 255, .22); }
.home-cfg { margin-top: auto; }
.home-cfg label { color: #8391ae; }
.home-btn,
.lobby-btn-brass {
  border: 1px solid rgba(129, 228, 219, .36);
  border-radius: 12px;
  background: linear-gradient(135deg, #77e3d7, #668cde 58%, #7568ce);
  color: #06121b;
  box-shadow: 0 10px 28px rgba(70, 105, 210, .18);
}
.home-btn:hover,
.home-btn:focus-visible,
.lobby-btn-brass:hover,
.lobby-btn-brass:focus-visible { filter: brightness(1.08); outline: 2px solid rgba(194, 255, 248, .42); outline-offset: 2px; }
.home-join-row { margin-top: auto; flex-direction: column; }
.home-join-row input {
  min-height: 54px;
  text-align: center;
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .2em;
}
.home-join-row .home-btn { width: 100%; }
.home-back { color: #91a0bf; }
#homeStep-name.guest-join .home-create-card { display: none; }
#homeStep-name.guest-join .home-access-grid { grid-template-columns: minmax(0, 480px); justify-content: center; }
#homeStep-name.guest-join .home-join-row .home-btn { width: 100%; }

.welcome-card {
  border-color: var(--ap-line);
  background: linear-gradient(145deg, rgba(19, 29, 55, .84), rgba(8, 13, 27, .92));
}
.welcome-card:hover { border-color: rgba(97, 223, 208, .42); }
.welcome-card.friends { border-color: rgba(100, 140, 255, .30); }

.lobby-table-scroll {
  background:
    radial-gradient(ellipse at 50% 40%, rgba(72, 112, 221, .16), transparent 42%),
    linear-gradient(145deg, #070c19, #050812);
}
.lobby-felt {
  background: radial-gradient(ellipse 64% 56% at 50% 40%, #1c3152, #0d1c34 66%, #050914);
  box-shadow: inset 0 0 0 6px var(--tt-rail), inset 0 0 0 7px var(--tt-gold-dim), inset 0 8px 30px rgba(0, 0, 0, .58), var(--tt-shadow-table);
}
.lobby-deck {
  border-left-color: var(--ap-line);
  background: linear-gradient(160deg, rgba(16, 25, 48, .96), rgba(7, 12, 25, .98));
}
.lobby-deck::after { color: rgba(136, 154, 233, .04); }
.lobby-deck-title { color: var(--ap-text); font-family: inherit; }
.lobby-code-value { color: #c8fff8; font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; letter-spacing: .12em; }
.lobby-code-label,
.lobby-rotation-label,
.lobby-start-help,
.lobby-leave-link { color: #7585a5; }
.lobby-btn-brass::after { display: none; }
.lobby-status-line { color: var(--ap-text); }
.lobby-status-sub { color: var(--ap-muted); }
.lobby-dot { background: var(--ap-teal); box-shadow: 0 0 12px var(--ap-glow-teal); }
.rot-tile { border-color: var(--ap-line); background: rgba(10, 17, 34, .9); }

/* ── Live table: same geometry, Aurora-after-dark paint ────────────────── */
body.aurora-gameplay-active .app {
  background:
    radial-gradient(ellipse at 50% 28%, rgba(61, 91, 176, .12), transparent 40%),
    radial-gradient(ellipse at 8% 80%, rgba(73, 202, 192, .06), transparent 30%),
    linear-gradient(145deg, #03050c, #070b16 54%, #03040a);
}

@media (orientation: landscape) {
  body.aurora-gameplay-active .app .board-stage {
    background: linear-gradient(180deg, var(--tt-rail-hi), var(--tt-rail) 32%, var(--tt-rail-lo));
    box-shadow:
      inset 0 1px rgba(199, 211, 255, .14),
      inset 0 3px 7px rgba(0, 0, 0, .5),
      inset 0 -12px 28px rgba(0, 0, 0, .74),
      0 0 0 1px rgba(121, 145, 228, .18),
      var(--tt-shadow-table);
  }
  body.aurora-gameplay-active .app .board-stage::before {
    border-color: rgba(97, 223, 208, .27);
    box-shadow: 0 0 16px rgba(85, 144, 213, .12);
  }
  body.aurora-gameplay-active .app .board-stage::after { opacity: .28; }
  body.aurora-gameplay-active .app .premium-table-content {
    background:
      radial-gradient(circle at 50% 38%, rgba(99, 223, 210, .10), transparent 34%),
      radial-gradient(ellipse at 50% 18%, rgba(124, 147, 255, .12), transparent 39%),
      radial-gradient(ellipse at 50% 62%, rgba(80, 69, 154, .08), transparent 58%),
      linear-gradient(150deg, var(--tt-felt-hi), var(--tt-felt) 56%, var(--tt-felt-lo));
    box-shadow: inset 0 0 74px rgba(2, 6, 16, .78), inset 0 0 0 2px rgba(255, 255, 255, .035), 0 0 0 1px var(--tt-gold-dim);
  }
  body.aurora-gameplay-active .app #tableLightingOverlay {
    opacity: .18;
    background:
      radial-gradient(ellipse at 50% 31%, rgba(133, 169, 255, .42), transparent 45%),
      radial-gradient(ellipse at 50% 50%, transparent 53%, rgba(0, 0, 0, .62) 100%);
  }
  body.aurora-gameplay-active .opp-pill {
    background: linear-gradient(180deg, rgba(18, 27, 49, .97), rgba(7, 12, 25, .98));
    border-color: rgba(132, 153, 221, .20);
    box-shadow: var(--tt-shadow-pod), inset 0 1px rgba(255, 255, 255, .055);
  }
  body.aurora-gameplay-active .opp-pill .pill-avatar {
    border-color: #829dff;
    box-shadow: 0 0 0 3px rgba(7, 12, 25, .96), 0 6px 14px rgba(0, 0, 0, .48);
  }
  body.aurora-gameplay-active .opp-pill .pill-stack { color: #c1cbe1; }
  body.aurora-gameplay-active .opp-pill.is-active {
    background: linear-gradient(180deg, rgba(21, 43, 61, .98), rgba(8, 17, 31, .98));
    border-color: rgba(97, 223, 208, .76);
    box-shadow: 0 0 0 1px rgba(97, 223, 208, .16), 0 0 23px rgba(71, 208, 198, .20), 0 10px 26px rgba(0, 0, 0, .5);
  }
  body.aurora-gameplay-active .app .hero-id,
  body.aurora-gameplay-active .app .cd-hero-head {
    background: linear-gradient(180deg, rgba(21, 30, 55, .98), rgba(8, 13, 27, .98));
    border-color: rgba(129, 151, 255, .42);
    box-shadow: 0 0 0 1px rgba(97, 223, 208, .06), 0 10px 28px rgba(0, 0, 0, .48);
  }
  body.aurora-gameplay-active .app .hero-chips,
  body.aurora-gameplay-active .app .cd-hero-stack { color: #d4ddf0; }
  body.aurora-gameplay-active .app .hero-zone .esg-row { border-left-color: rgba(129, 151, 255, .28); }
  body.aurora-gameplay-active .app .board-card.placeholder {
    background: rgba(27, 45, 75, .30);
    border-color: rgba(116, 143, 217, .18);
  }
  .aurora-context-dock .btn-act {
    border: 1px solid rgba(255, 255, 255, .08);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .24), inset 0 1px rgba(255, 255, 255, .10);
  }
  .aurora-context-dock .btn-act.raise {
    background: linear-gradient(160deg, var(--tt-btn-raise-from), var(--tt-btn-raise-to));
    color: var(--tt-btn-raise-text);
    box-shadow: 0 10px 24px rgba(91, 93, 219, .28), inset 0 1px rgba(255, 255, 255, .17);
  }
}

.aurora-assistant-btn,
.aurora-pot-rail,
.aurora-assistant-panel {
  --ax-gold: var(--ap-teal);
  --ax-gold-hi: #b9fff5;
  --ax-line: rgba(97, 223, 208, .25);
  --ax-surface: rgba(8, 13, 27, .95);
  background: linear-gradient(155deg, rgba(17, 26, 49, .96), rgba(6, 11, 23, .97));
  border-color: rgba(116, 151, 225, .24);
}
.aurora-assistant-btn { box-shadow: 0 12px 30px rgba(0, 0, 0, .42), 0 0 22px rgba(77, 107, 216, .08); }
.aurora-assistant-btn__tag { background: rgba(97, 223, 208, .11); color: #b9fff5; }
.aurora-pot-rail__eyebrow { color: var(--ap-teal); }

.aurora-card-focus__backdrop {
  background:
    radial-gradient(ellipse at 50% 44%, rgba(42, 71, 119, .28), transparent 43%),
    rgba(3, 5, 13, .94);
  backdrop-filter: blur(22px) saturate(.5);
  -webkit-backdrop-filter: blur(22px) saturate(.5);
}
.aurora-card-focus__close,
.aurora-card-focus__preview {
  border-color: rgba(137, 162, 242, .27);
  background: rgba(9, 15, 30, .76);
  box-shadow: 0 12px 32px rgba(0, 0, 0, .34);
}
.aurora-card-focus__preview-label { color: #c1cee7; }

.aurora-orientation-gate {
  background:
    radial-gradient(ellipse at 25% 15%, rgba(87, 123, 237, .22), transparent 42%),
    radial-gradient(ellipse at 80% 75%, rgba(137, 84, 209, .17), transparent 42%),
    linear-gradient(145deg, #050814, #080e1d);
}
.aurora-gate-brand { color: var(--ap-teal); }
.aurora-gate-icon { border-color: #87a2ff; box-shadow: 0 0 24px rgba(102, 140, 255, .18); }
.aurora-gate-icon::after { background: var(--ap-teal); }

/* Setup/control centre follows the same system without changing its layout. */
.lgs {
  border-color: var(--ap-line);
  background:
    radial-gradient(ellipse at 50% -20%, rgba(80, 113, 218, .22), transparent 48%),
    linear-gradient(165deg, rgba(13, 21, 42, .99), rgba(5, 9, 20, .99));
}
.lgs-game.on,
.lgs-mode.on { border-color: rgba(97, 223, 208, .46); background: linear-gradient(135deg, rgba(22, 47, 62, .92), rgba(15, 22, 42, .95)); }
.lgs-game.on strong { color: #b9fff5; }
.lgs-card { border-color: var(--ap-line); background: rgba(14, 22, 43, .84); }
.lgs-seg.on { background: linear-gradient(135deg, #78e1d6, #6c84de); border-color: transparent; color: #06121b; }
.lgs-summary { background: linear-gradient(180deg, rgba(14, 22, 43, .9), rgba(6, 10, 22, .96)); }

/* ── Responsive preflight: deliberate mobile composition ──────────────── */
@media (max-width: 720px) {
  #auroraShell .ash-main { padding-top: calc(18px + env(safe-area-inset-top)); }
  .ash-poker-title { font-size: clamp(38px, 13vw, 58px); }
  #auroraShell .ash-doors { grid-template-columns: 1fr; margin-top: 22px; }
  #auroraShell .ash-door { min-height: 154px; }
  #auroraShell .ash-door.secondary {
    grid-column: auto;
    min-height: 126px;
    display: flex;
    align-items: flex-start;
    gap: 5px;
  }
  #auroraShell .ash-door.secondary .cta { margin-top: 8px; }
  .ash-secondary-links { margin-bottom: 4px; }
  .home-overlay { padding: 10px; align-items: flex-start; }
  .home-box { width: 100%; max-height: calc(100dvh - 20px); padding: 18px; border-radius: 20px; }
  .home-access-grid { grid-template-columns: 1fr; }
  .home-name-field { grid-template-columns: 1fr; gap: 6px; }
  .home-access-card { padding: 17px; }
  .home-join-row { flex-direction: column; }
}

@media (orientation: landscape) and (max-height: 450px) {
  .home-flow-intro h2 { font-size: 1.3rem; }
  .home-flow-intro p { display: none; }
  .home-access-card { padding: 13px; gap: 7px; }
  .home-card-copy { display: none; }
  .home-box { border-radius: 18px; }

  /* Countdown's full 4/3/2/1 board is the one composition where the board
     and opponent rail compete for the same shallow phone-height budget.
     Compact the pods before shrinking cards or hiding poker information:
     names, stacks, state and turn emphasis all remain visible, while the
     avatar overhang and empty padding no longer force the rail off-screen. */
  body.aurora-gameplay-active .app.cd-mode .opp-pill {
    min-height: 36px;
    padding: 2px 5px 3px;
    border-radius: 12px;
  }
  body.aurora-gameplay-active .app.cd-mode .opp-pill .pill-avatar {
    width: 20px;
    height: 20px;
    margin-top: -9px;
  }
  body.aurora-gameplay-active .app.cd-mode .opp-pill .pill-name { font-size: .61rem; }
  body.aurora-gameplay-active .app.cd-mode .opp-pill .pill-stack { font-size: .54rem; }
  body.aurora-gameplay-active .app.cd-mode { --mix-arc-h: 66px; }
}

@media (orientation: landscape) and (max-height: 380px) {
  /* The extreme tier has a smaller hero dock, so it needs less reclaimed
     rail space than the standard short-phone tier above. */
  body.aurora-gameplay-active .app.cd-mode { --mix-arc-h: 48px; }
}

@media (prefers-reduced-motion: reduce) {
  #auroraShell::before,
  #auroraShell::after { animation: none; }
}
