/*
  Ham Exam Arcade A1d1 Visual Refresh
  -----------------------------------
  One branded house style replaces the retired player-selectable themes.
  Individual games now tint the shared UI through body[data-game-id] accents.
*/

/* Single house style: maps all legacy theme states to the same arcade look. */
:root,
html[data-theme="arcade"],
html[data-theme="kids"],
html[data-theme="tech"],
html[data-theme="shack"]{
  --bg:#070818;
  --panel:#0e1433;
  --card:#111a3f;
  --text:#f7fbff;
  --btnText:#f7fbff;
  --muted:#b9c6e8;
  --line: rgba(120, 160, 255, .24);

  --accent:#22d3ee;
  --accent2:#facc15;
  --accent-2: var(--accent2);
  --acc: var(--accent);
  --acc2: var(--accent2);
  --street:#60a5fa;

  --good:#4ade80;
  --ok:#4ade80;
  --bad:#fb4b83;
  --warn:#fbbf24;
  --warning:#fbbf24;

  --btn:#14265a;
  --btn2:#0a1230;

  --shadow: 0 18px 48px rgba(0,0,0,.50);
  --radius:22px;
  --btnRadius:16px;

  --glow1: rgba(34,211,238,.16);
  --glow2: rgba(250,204,21,.10);

  --topbar: rgba(7, 10, 28, .86);
  --bgDecor:
    radial-gradient(1100px 760px at 12% 4%, rgba(132, 66, 255, .22), transparent 62%),
    radial-gradient(900px 620px at 88% 18%, rgba(34, 211, 238, .15), transparent 64%),
    radial-gradient(760px 560px at 52% 92%, rgba(250, 204, 21, .10), transparent 66%),
    linear-gradient(135deg, rgba(255,255,255,.035) 0 1px, transparent 1px 22px),
    linear-gradient(45deg, rgba(34,211,238,.035) 0 1px, transparent 1px 34px);

  --font-body: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-title: "Trebuchet MS", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --font-dot: "Courier New", "Lucida Console", Monaco, Consolas, monospace;
  --marqueeInk: color-mix(in oklab, var(--accent) 76%, white 24%);
  --marqueeGlow: color-mix(in oklab, var(--accent2) 62%, white 38%);

  --title-weight: 950;
  --title-letter: .02em;
}

/* Game flavors drawn from the existing banner/game identities. */
body[data-game-id="classic"]{ --accent:#38bdf8; --accent2:#facc15; --line:rgba(56,189,248,.28); --glow1:rgba(56,189,248,.18); --glow2:rgba(250,204,21,.12); --card:#13245b; --panel:#0d183e; --btn:#1b3f95; --btn2:#0a1e56; }
body[data-game-id="lives"]{ --accent:#ef4444; --accent2:#f59e0b; --line:rgba(239,68,68,.30); --glow1:rgba(239,68,68,.18); --glow2:rgba(245,158,11,.12); --card:#4a1717; --panel:#2b0f11; --btn:#8f1d1d; --btn2:#5d1218; }
body[data-game-id="streak"]{ --accent:#a855f7; --accent2:#22d3ee; --line:rgba(168,85,247,.30); --glow1:rgba(168,85,247,.18); --glow2:rgba(34,211,238,.13); --card:#21114f; --panel:#150b35; --btn:#4f1c8f; --btn2:#2e115f; }
body[data-game-id="bingo"]{ --accent:#22d3ee; --accent2:#a3e635; --line:rgba(34,211,238,.30); --glow1:rgba(34,211,238,.20); --glow2:rgba(163,230,53,.14); --card:#09294a; --panel:#071c34; --btn:#0d5f86; --btn2:#06334f; }
body[data-game-id="coax"]{ --accent:#84cc16; --accent2:#f97316; --line:rgba(132,204,22,.30); --glow1:rgba(132,204,22,.20); --glow2:rgba(249,115,22,.14); --card:#112b16; --panel:#0b2010; --btn:#246b20; --btn2:#123d18; }
body[data-game-id="scramble"]{ --accent:#f97316; --accent2:#facc15; --line:rgba(249,115,22,.30); --glow1:rgba(249,115,22,.20); --glow2:rgba(250,204,21,.14); --card:#4a1f0b; --panel:#2d1408; --btn:#9a3b10; --btn2:#5c2109; }
body[data-game-id="triage"]{ --accent:#fb923c; --accent2:#22c55e; --line:rgba(251,146,60,.30); --glow1:rgba(251,146,60,.20); --glow2:rgba(34,197,94,.14); --card:#3b210f; --panel:#241409; --btn:#8a4318; --btn2:#4f260d; }
body[data-game-id="stormline"]{ --accent:#60a5fa; --accent2:#facc15; --line:rgba(96,165,250,.32); --glow1:rgba(96,165,250,.22); --glow2:rgba(250,204,21,.16); --card:#10233f; --panel:#09172b; --btn:#1e4f8f; --btn2:#0d2d59; }
body[data-game-id="boss"]{ --accent:#22c55e; --accent2:#facc15; --line:rgba(34,197,94,.32); --glow1:rgba(34,197,94,.22); --glow2:rgba(250,204,21,.16); --card:#102d18; --panel:#0a1d10; --btn:#1f6d30; --btn2:#0e3e1d; }
body[data-game-id="subhunt"]{ --accent:#10b981; --accent2:#38bdf8; --line:rgba(16,185,129,.32); --glow1:rgba(16,185,129,.22); --glow2:rgba(56,189,248,.16); --card:#082b2f; --panel:#061b22; --btn:#0e6b66; --btn2:#083d45; }

html, body{
  color-scheme: dark;
}

body{
  background-color: var(--bg);
  min-height: 100vh;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.56;
  background:
    radial-gradient(circle at 20% 14%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 34%),
    radial-gradient(circle at 78% 8%, color-mix(in srgb, var(--accent2) 16%, transparent), transparent 30%),
    radial-gradient(circle at 50% 110%, rgba(86,49,255,.16), transparent 48%);
  filter:saturate(1.1);
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.18;
  background:
    repeating-linear-gradient(90deg, transparent 0 36px, rgba(255,255,255,.035) 36px 37px),
    repeating-linear-gradient(0deg, transparent 0 36px, rgba(255,255,255,.025) 36px 37px);
  mask-image: radial-gradient(circle at 50% 20%, black, transparent 76%);
}

/* Header: darker game-cabinet chrome with stronger logo presence. */
.topbar{
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.015)),
    color-mix(in srgb, var(--topbar) 96%, black 4%) !important;
  border-bottom:1px solid color-mix(in srgb, var(--accent) 34%, transparent) !important;
  box-shadow: 0 14px 38px rgba(0,0,0,.42), inset 0 -1px 0 rgba(255,255,255,.035);
}

.brand{
  position:relative;
}

.brand::after{
  content:"ON AIR";
  position:absolute;
  left:96px;
  bottom:-2px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--bad) 55%, transparent);
  background:rgba(251,75,131,.12);
  color:#ffd6e3;
  font-size:10px;
  font-family:var(--font-mono);
  font-weight:900;
  letter-spacing:.12em;
  text-shadow:0 0 8px rgba(251,75,131,.65);
}

.brandLogo{
  filter: drop-shadow(0 0 18px color-mix(in srgb, var(--accent2) 36%, transparent)) drop-shadow(0 10px 18px rgba(0,0,0,.45));
}

.headerBannerFrame{
  filter: drop-shadow(0 12px 26px rgba(0,0,0,.38));
}

.headerGamePill{
  border-radius:18px !important;
  border-color: color-mix(in srgb, var(--accent) 44%, rgba(255,255,255,.14)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.02)),
    radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 55%),
    rgba(6,11,31,.80) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 28px color-mix(in srgb, var(--accent) 24%, transparent),
    0 14px 26px rgba(0,0,0,.35) !important;
}

/* Shared panels and game screen chrome. */
.layout{
  gap:18px !important;
  padding:18px !important;
}

.panel,
.card,
.app,
dialog{
  border-color: color-mix(in srgb, var(--accent) 23%, rgba(255,255,255,.10)) !important;
  box-shadow: var(--shadow);
}

.panel{
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--accent) 11%, transparent), transparent 50%),
    var(--panel) !important;
  border-radius: var(--radius) !important;
}

.app{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    radial-gradient(800px 360px at 12% 0%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 62%),
    radial-gradient(700px 340px at 88% 0%, color-mix(in srgb, var(--accent2) 13%, transparent), transparent 64%),
    var(--card) !important;
  border-radius: calc(var(--radius) + 2px) !important;
}

.app::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(135deg, rgba(255,255,255,.04) 0 1px, transparent 1px 24px),
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--accent2) 14%, transparent), transparent 30%);
  opacity:.42;
  z-index:0;
}

.app > *{
  position:relative;
  z-index:1;
}

.card{
  background:
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.020)),
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 48%),
    color-mix(in srgb, var(--card) 92%, black 8%) !important;
  border-radius: var(--radius) !important;
}

.box,
.notice,
.aeaStatCard,
.aeaElmerBox--card{
  border-color: color-mix(in srgb, var(--accent) 22%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.018)),
    rgba(255,255,255,.035) !important;
  border-radius:18px !important;
}

/* Text treatment */
.title,
.qtext,
.dlgTitle,
h1, h2, h3{
  font-family: var(--font-title);
  letter-spacing: var(--title-letter);
}

.qtext,
.dlgTitle{
  color:#fff;
  text-shadow:
    0 0 12px color-mix(in srgb, var(--accent) 42%, transparent),
    0 2px 0 rgba(0,0,0,.28);
}

/* Buttons: arcade cabinet buttons, not office controls. */
button,
.btn,
.primary,
.secondary{
  border-radius: var(--btnRadius) !important;
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.14)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 8px 18px rgba(0,0,0,.22);
  transition: transform .14s ease, filter .14s ease, box-shadow .14s ease, border-color .14s ease;
}

button,
.btn{
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--btn) 82%, white 9%), color-mix(in srgb, var(--btn2) 92%, black 8%)) !important;
}

.primary,
button.primary,
.btn.primary{
  color:#071018 !important;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--accent2) 88%, white 12%), color-mix(in srgb, var(--accent) 72%, var(--accent2) 28%)) !important;
  border-color: color-mix(in srgb, var(--accent2) 72%, white 15%) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.22);
  font-weight:900;
}

.secondary,
button.secondary,
.btn.secondary{
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.015)),
    rgba(255,255,255,.030) !important;
}

button:hover,
.btn:hover,
.choice:hover{
  transform: translateY(-1px);
  filter: brightness(1.12) saturate(1.05) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 22px color-mix(in srgb, var(--accent) 20%, transparent),
    0 12px 24px rgba(0,0,0,.30);
}

button:active,
.btn:active{
  transform: translateY(1px);
}

/* Inputs/selects follow the new cabinet style. */
select,
input[type="file"],
input[type="number"],
input[type="text"],
textarea{
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    rgba(4,8,25,.82) !important;
  color:var(--text) !important;
  border:1px solid color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.12)) !important;
  border-radius:14px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

/* Game menu cards use the same in-game title banners that appear after launch.
   A1d4 enlarges the banner selectors slightly and lets the art carry more of the menu. */
.homeGrid{
  gap:10px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  margin-top:0 !important;
}

.aeaHomeChoiceCompact{
  position:relative;
  min-height:0;
  aspect-ratio: 1200 / 192;
  overflow:hidden;
  padding:0 !important;
  display:block !important;
  border-radius:18px !important;
  border-color: color-mix(in srgb, var(--accent) 18%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(7,10,28,.02), rgba(7,10,28,.08)),
    var(--game-card-img, radial-gradient(circle at 22% 0%, color-mix(in srgb, var(--accent) 24%, transparent), transparent 45%)),
    linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.015)) !important;
  background-size: cover, contain, auto !important;
  background-repeat:no-repeat !important;
  background-position:center, center, center !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 12px 26px rgba(0,0,0,.30);
}

.aeaHomeChoiceCompact::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.24), transparent 18%, transparent 82%, rgba(0,0,0,.26)),
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--accent2) 16%, transparent), transparent 34%);
  opacity:.68;
}

.aeaHomeChoiceCompact::after{
  content: attr(data-tooltip);
  position:absolute;
  left:50%;
  bottom:calc(100% + 8px);
  transform:translateX(-50%) translateY(4px);
  z-index:20;
  width:max-content;
  max-width:min(520px, 86vw);
  padding:8px 10px;
  border-radius:12px;
  border:1px solid color-mix(in srgb, var(--accent) 34%, rgba(255,255,255,.14));
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.025)),
    rgba(4,8,25,.96);
  color:#f7fbff;
  font-size:12px;
  line-height:1.25;
  font-weight:800;
  letter-spacing:.01em;
  text-align:center;
  white-space:normal;
  opacity:0;
  pointer-events:none;
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.42));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 18px color-mix(in srgb, var(--accent) 18%, transparent);
  transition:opacity .14s ease, transform .14s ease;
}

.aeaHomeChoiceCompact:hover::after,
.aeaHomeChoiceCompact:focus-visible::after{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

/* No visible text on the menu banners. Details are available by mouseover title text. */
#homeChoices .aeaHomeChoiceTitle,
#homeChoices .aeaHomeChoiceHead,
#homeChoices .aeaHomeChoiceDesc,
#homeChoices .aeaGameBadge{
  display:none !important;
}

.aeaHomeChoiceLockIcon{
  position:absolute;
  top:8px;
  right:10px;
  z-index:2;
  font-size:18px;
  line-height:1;
  text-shadow:0 2px 4px rgba(0,0,0,.75), 0 0 12px rgba(255,214,227,.35);
}
.aeaHomeChoiceLockIcon:empty{ display:none; }

.aeaHomeChoiceCompact:hover,
.aeaHomeChoiceCompact:focus-visible{
  transform: translateY(-1px) scale(1.012);
  filter: brightness(1.07) saturate(1.02) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 0 18px color-mix(in srgb, var(--accent) 18%, transparent),
    0 16px 30px rgba(0,0,0,.36);
}

/* Home-menu sources: same title banners used inside each active game. */
#homeChoices button[data-game="classic"]{ --game-card-img:url("../img/header_titles/header_exam_cram.webp"); }
#homeChoices button[data-game="lives"]{ --game-card-img:url("../img/header_titles/header_3_lives_survival.webp"); }
#homeChoices button[data-game="streak"]{ --game-card-img:url("../img/header_titles/header_backscatter_board.webp"); }
#homeChoices button[data-game="bingo"]{ --game-card-img:url("../img/header_titles/header_signal_sweep.webp"); }
#homeChoices button[data-game="coax"]{ --game-card-img:url("../img/header_titles/header_coax_circuit.webp"); }
#homeChoices button[data-game="scramble"]{ --game-card-img:url("../img/header_titles/header_choice_scramble.webp"); }
#homeChoices button[data-game="triage"]{ --game-card-img:url("../img/header_titles/header_shack_triage.webp"); }
#homeChoices button[data-game="stormline"]{ --game-card-img:url("../img/header_titles/header_stormline_sprint.webp"); }
#homeChoices button[data-game="boss"]{ --game-card-img:url("../img/header_titles/header_ham_hunter.webp"); }
#homeChoices button[data-game="subhunt"]{ --game-card-img:url("../img/header_titles/header_steel_wake.webp"); }

@media (max-width: 980px){
  .homeGrid{
    grid-template-columns:1fr !important;
  }
  .aeaHomeChoiceCompact{
    aspect-ratio: 1200 / 216;
  }
}

@media (max-width: 620px){
  .aeaHomeChoiceCompact{
    aspect-ratio: 1200 / 274;
  }
  .aeaHomeChoiceLockIcon{
    top:6px;
    right:8px;
    font-size:16px;
  }
}


/* Home card title gets a bit more selling power. */
body[data-app-view="home"] .app > .card > .qtext:first-child{
  font-size:clamp(26px, 3.2vw, 42px);
  line-height:1.05;
  margin-bottom:10px;
  background:linear-gradient(90deg, #fff, color-mix(in srgb, var(--accent2) 85%, white 15%), color-mix(in srgb, var(--accent) 86%, white 14%));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:none;
}

/* Dialogs and options now follow the branded style. */
.dlgHead,
.dlgFoot{
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.00));
}

dialog{
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--accent) 11%, transparent), transparent 42%),
    color-mix(in srgb, var(--panel) 94%, black 6%) !important;
}

/* Hide old theme picker artifacts if any older cached markup survives. */
#themeDialog,
.themeGrid,
.themeCard{
  display:none !important;
}

/* Kids-theme-specific legacy fixes no longer need to visually override the house style. */
html[data-theme="kids"] #homeChoices .gameTag,
html[data-theme="kids"] #homeChoices .gameCardTag,
html[data-theme="kids"] #homeChoices .modeTag,
html[data-theme="kids"] #homeChoices .gameMetaTag,
html[data-theme="kids"] #homeChoices .aeaGameTag,
html[data-theme="kids"] #homeChoices .menuGameTag,
html[data-theme="kids"] #homeChoices .gameChoice .tag,
html[data-theme="kids"] #homeChoices .gameChoiceTag,
html[data-theme="kids"] #homeChoices .gameCard .tag,
html[data-theme="kids"] #homeChoices [class*="Tag"],
html[data-theme="kids"] #homeChoices [class*="tag"]{
  color:inherit !important;
}

/* Game-stage backgrounds keep their art, but absorb the current game accent. */
.app.triageStage,
.app.scrambleStage,
.app.survivalStage,
.app.coaxStage{
  border-color: color-mix(in srgb, var(--accent) 35%, rgba(255,255,255,.12)) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 34px color-mix(in srgb, var(--accent) 16%, transparent),
    var(--shadow) !important;
}

/* Result/review areas: make Study Points and score feel more like game rewards. */
.xpBar,
.spBar{
  height:16px !important;
  border-color: color-mix(in srgb, var(--accent) 36%, rgba(255,255,255,.14)) !important;
  box-shadow: inset 0 2px 6px rgba(0,0,0,.38), 0 0 18px color-mix(in srgb, var(--accent) 12%, transparent);
}

.xpFill,
.spFill{
  background: linear-gradient(90deg, var(--accent), var(--accent2)) !important;
  box-shadow:0 0 18px color-mix(in srgb, var(--accent) 45%, transparent);
}

/* Mobile: poster cards stay readable. */
@media (max-width: 720px){
  .layout{ padding:12px !important; gap:12px !important; }
  .aeaHomeChoiceCompact{ min-height:132px; }
  .aeaHomeChoiceHead.compact{ padding-top:58px; }
  .brand::after{ display:none; }
}

/* Respect reduced motion preference and in-app reduce motion. */
@media (prefers-reduced-motion: reduce){
  button,
  .btn,
  .choice{
    transition:none !important;
  }
  button:hover,
  .btn:hover,
  .choice:hover{
    transform:none !important;
  }
}

html[data-motion="0"] button,
html[data-motion="0"] .btn,
html[data-motion="0"] .choice{
  transition:none !important;
}
html[data-motion="0"] button:hover,
html[data-motion="0"] .btn:hover,
html[data-motion="0"] .choice:hover{
  transform:none !important;
}


/* A1d5: streamline Game Menu chrome */
.brand::after{ display:none !important; content:none !important; }

/* Home menu title now uses a cleaner arcade-marquee treatment. */
.aeaHomeMenuHead{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:0 0 14px;
  padding:12px 16px 14px;
  border:1px solid color-mix(in srgb, var(--accent) 24%, rgba(255,255,255,.12));
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)),
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 42%),
    rgba(8,12,34,.68);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.24);
}
.aeaHomeMenuKicker{
  color: color-mix(in srgb, var(--accent2) 78%, white 22%);
  font-family: var(--font-mono);
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
  opacity:.95;
}
.aeaHomeMenuTitle{
  font-family: var(--font-title);
  font-size: clamp(24px, 3vw, 40px);
  line-height:1.02;
  font-weight: 950;
  letter-spacing: .05em;
  text-transform:uppercase;
  color:#fff7d1;
  text-shadow:
    0 0 16px color-mix(in srgb, var(--accent2) 22%, transparent),
    0 2px 0 rgba(0,0,0,.35);
}

/* Older plain title styling is retired on the home menu. */
body[data-app-view="home"] .app > .card > .qtext:first-child{
  display:none !important;
}


/* A1d6: the banner grid speaks for itself. Hide the large home heading block. */
.aeaHomeMenuHead{ display:none !important; }
.homeGrid{ margin-top:0 !important; }


/* A1d7: locked menu buttons stay hoverable so tooltips work. Click still opens the locked-game explanation. */
#homeChoices .aeaHomeChoiceCompact[aria-disabled="true"]{
  cursor:not-allowed !important;
}
#homeChoices .aeaHomeChoiceCompact[aria-disabled="true"]:hover,
#homeChoices .aeaHomeChoiceCompact[aria-disabled="true"]:focus-visible{
  opacity:.82 !important;
}


/* A1d9: launch splash button should be an invisible click target.
   The splash artwork already contains the visible Open Arcade button.
   This override prevents the global arcade button style from drawing a dark
   button over the art. */
.launchSplashOverlay .launchOpenArcade,
.launchSplashOverlay .launchOpenArcade:hover,
.launchSplashOverlay .launchOpenArcade:active{
  position:absolute !important;
  left:38.75% !important;
  top:85.78% !important;
  width:22.5% !important;
  height:9.11% !important;
  display:block !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:24px !important;
  background:transparent !important;
  box-shadow:none !important;
  color:transparent !important;
  text-shadow:none !important;
  text-indent:-9999px !important;
  font-size:0 !important;
  line-height:0 !important;
  overflow:hidden !important;
  filter:none !important;
  transform:none !important;
  z-index:3 !important;
}

.launchSplashOverlay .launchOpenArcade:focus-visible{
  outline:4px solid rgba(255,240,190,.95) !important;
  outline-offset:4px !important;
  box-shadow:0 0 0 8px rgba(20,27,45,.82) !important;
}


/* A1d10: Exam Cram gets a first-pass banner-driven blue/gold identity. */
body[data-game-id="classic"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    radial-gradient(780px 360px at 12% 0%, rgba(56,189,248,.20), transparent 62%),
    radial-gradient(720px 300px at 88% 0%, rgba(250,204,21,.12), transparent 64%),
    linear-gradient(180deg, rgba(7,18,58,.96), rgba(10,20,62,.93)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 26%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.06);
}

body[data-game-id="classic"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 20%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 14px 32px rgba(0,0,0,.18);
}

body[data-game-id="classic"] .qtext,
body[data-game-id="classic"] .dlgTitle,
body[data-game-id="classic"] h1,
body[data-game-id="classic"] h2,
body[data-game-id="classic"] h3{
  color:#fff0b8 !important;
  letter-spacing:.03em;
  text-shadow:
    0 0 12px rgba(250,204,21,.14),
    0 2px 0 rgba(0,0,0,.34);
}

body[data-game-id="classic"] .hint strong,
body[data-game-id="classic"] summary strong,
body[data-game-id="classic"] .card strong{
  color:#ffe07b;
}

body[data-game-id="classic"] .box,
body[data-game-id="classic"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 28%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    linear-gradient(135deg, rgba(56,189,248,.05), rgba(250,204,21,.03)),
    rgba(255,255,255,.025) !important;
}
body[data-game-id="classic"] .box::before,
body[data-game-id="classic"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(56,189,248,.0), rgba(56,189,248,.95), rgba(250,204,21,.95), rgba(250,204,21,0));
  opacity:.88;
}

body[data-game-id="classic"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 20%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    linear-gradient(90deg, rgba(56,189,248,.10), rgba(250,204,21,.06)),
    rgba(8,16,46,.60) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="classic"] .stat,
body[data-game-id="classic"] .qhelpOffPill{
  border:1px solid color-mix(in srgb, var(--accent) 28%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    rgba(8,18,46,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="classic"] .qhelpOffPill{
  color:#ffe07b !important;
}

body[data-game-id="classic"] button,
body[data-game-id="classic"] .btn{
  color:#f6fbff !important;
  background:
    linear-gradient(180deg, rgba(42,93,210,.96), rgba(17,44,121,.98)) !important;
  border-color: rgba(124,188,255,.40) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 8px 18px rgba(0,0,0,.24),
    0 0 14px rgba(56,189,248,.12);
}
body[data-game-id="classic"] button:hover,
body[data-game-id="classic"] .btn:hover,
body[data-game-id="classic"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 0 18px rgba(56,189,248,.18),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="classic"] .primary,
body[data-game-id="classic"] button.primary,
body[data-game-id="classic"] .btn.primary{
  color:#10203e !important;
  background:
    linear-gradient(180deg, rgba(255,235,146,.98), rgba(244,191,42,.98)) !important;
  border-color: rgba(255,242,176,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.40);
}

body[data-game-id="classic"] .secondary,
body[data-game-id="classic"] button.secondary,
body[data-game-id="classic"] .btn.secondary{
  color:#eaf4ff !important;
  background:
    linear-gradient(180deg, rgba(24,45,105,.88), rgba(11,25,69,.92)) !important;
  border-color: rgba(96,165,250,.34) !important;
}

body[data-game-id="classic"] .choice{
  border-color: color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012)),
    rgba(11,22,60,.72) !important;
}

body[data-game-id="classic"] details.box > summary{
  list-style:none;
}
body[data-game-id="classic"] details.box > summary::-webkit-details-marker{
  display:none;
}
body[data-game-id="classic"] details.box > summary{
  padding-right:28px;
  position:relative;
}
body[data-game-id="classic"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#ffe07b;
  font-weight:900;
}
body[data-game-id="classic"] details.box:not([open]) > summary::after{
  content:"▸";
}

body[data-game-id="classic"] .imgwrap img{
  border:1px solid rgba(250,204,21,.26);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(56,189,248,.10);
}


/* A1d11: Exam Cram text pass — commit harder to the banner's gold text language. */
body[data-game-id="classic"]{
  --text:#ffe8a8;
  --muted:#f2dc9c;
}

body[data-game-id="classic"],
body[data-game-id="classic"] .card,
body[data-game-id="classic"] .box,
body[data-game-id="classic"] .notice,
body[data-game-id="classic"] .bar,
body[data-game-id="classic"] .hint,
body[data-game-id="classic"] p,
body[data-game-id="classic"] li,
body[data-game-id="classic"] summary,
body[data-game-id="classic"] label,
body[data-game-id="classic"] .qmeta,
body[data-game-id="classic"] .row,
body[data-game-id="classic"] .choice,
body[data-game-id="classic"] .stat{
  color:#ffe8a8 !important;
}

body[data-game-id="classic"] .hint,
body[data-game-id="classic"] p,
body[data-game-id="classic"] li,
body[data-game-id="classic"] summary,
body[data-game-id="classic"] label,
body[data-game-id="classic"] .qmeta,
body[data-game-id="classic"] .row,
body[data-game-id="classic"] .choice{
  color:#f4dfaa !important;
}

body[data-game-id="classic"] .qtext,
body[data-game-id="classic"] .dlgTitle,
body[data-game-id="classic"] h1,
body[data-game-id="classic"] h2,
body[data-game-id="classic"] h3,
body[data-game-id="classic"] .box > div[style*="font-weight:800"],
body[data-game-id="classic"] .bar .stat,
body[data-game-id="classic"] .qhelpOffPill{
  color:#fff1b8 !important;
}

body[data-game-id="classic"] .hint strong,
body[data-game-id="classic"] summary strong,
body[data-game-id="classic"] .card strong,
body[data-game-id="classic"] .box strong,
body[data-game-id="classic"] .notice strong{
  color:#ffd94f !important;
}

body[data-game-id="classic"] button,
body[data-game-id="classic"] .btn,
body[data-game-id="classic"] .secondary,
body[data-game-id="classic"] button.secondary,
body[data-game-id="classic"] .btn.secondary{
  color:#fff1b8 !important;
}

body[data-game-id="classic"] .primary,
body[data-game-id="classic"] button.primary,
body[data-game-id="classic"] .btn.primary{
  color:#10203e !important;
}


/* A1d12: 3-Lives Survival gets a banner-driven danger-zone pass. */
body[data-game-id="lives"]{
  --text:#ffe4c9;
  --muted:#f4ccb0;
}

body[data-game-id="lives"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)),
    radial-gradient(760px 340px at 10% 0%, rgba(239,68,68,.20), transparent 60%),
    radial-gradient(680px 280px at 88% 0%, rgba(245,158,11,.13), transparent 60%),
    linear-gradient(180deg, rgba(35,8,12,.97), rgba(22,7,10,.95)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 26%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="lives"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 24%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.18);
}

body[data-game-id="lives"],
body[data-game-id="lives"] .card,
body[data-game-id="lives"] .box,
body[data-game-id="lives"] .notice,
body[data-game-id="lives"] .bar,
body[data-game-id="lives"] .hint,
body[data-game-id="lives"] p,
body[data-game-id="lives"] li,
body[data-game-id="lives"] summary,
body[data-game-id="lives"] label,
body[data-game-id="lives"] .qmeta,
body[data-game-id="lives"] .row,
body[data-game-id="lives"] .choice,
body[data-game-id="lives"] .stat{
  color:#ffe4c9 !important;
}

body[data-game-id="lives"] .hint,
body[data-game-id="lives"] p,
body[data-game-id="lives"] li,
body[data-game-id="lives"] summary,
body[data-game-id="lives"] label,
body[data-game-id="lives"] .qmeta,
body[data-game-id="lives"] .row,
body[data-game-id="lives"] .choice{
  color:#f4ccb0 !important;
}

body[data-game-id="lives"] .qtext,
body[data-game-id="lives"] .dlgTitle,
body[data-game-id="lives"] h1,
body[data-game-id="lives"] h2,
body[data-game-id="lives"] h3,
body[data-game-id="lives"] .box > div[style*="font-weight:800"]{
  color:#fff0d8 !important;
  letter-spacing:.03em;
  text-shadow:
    0 0 12px rgba(245,158,11,.14),
    0 2px 0 rgba(0,0,0,.34);
}

body[data-game-id="lives"] .hint strong,
body[data-game-id="lives"] summary strong,
body[data-game-id="lives"] .card strong,
body[data-game-id="lives"] .box strong,
body[data-game-id="lives"] .notice strong{
  color:#ffb95f !important;
}

body[data-game-id="lives"] .box,
body[data-game-id="lives"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 28%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(239,68,68,.06), rgba(245,158,11,.04)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="lives"] .box::before,
body[data-game-id="lives"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(239,68,68,0), rgba(239,68,68,.96), rgba(245,158,11,.96), rgba(245,158,11,0));
  opacity:.88;
}

body[data-game-id="lives"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 22%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    linear-gradient(90deg, rgba(239,68,68,.11), rgba(245,158,11,.07)),
    rgba(32,9,14,.60) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="lives"] .stat,
body[data-game-id="lives"] .qhelpOffPill{
  border:1px solid color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    rgba(42,12,17,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="lives"] .qhelpOffPill{
  color:#ffca75 !important;
}

body[data-game-id="lives"] button,
body[data-game-id="lives"] .btn{
  color:#fff3e6 !important;
  background:
    linear-gradient(180deg, rgba(160,32,40,.96), rgba(101,19,26,.98)) !important;
  border-color: rgba(255,166,125,.34) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(239,68,68,.12);
}
body[data-game-id="lives"] button:hover,
body[data-game-id="lives"] .btn:hover,
body[data-game-id="lives"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 0 18px rgba(239,68,68,.16),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="lives"] .primary,
body[data-game-id="lives"] button.primary,
body[data-game-id="lives"] .btn.primary{
  color:#26120d !important;
  background:
    linear-gradient(180deg, rgba(255,214,128,.98), rgba(244,141,36,.98)) !important;
  border-color: rgba(255,230,168,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="lives"] .secondary,
body[data-game-id="lives"] button.secondary,
body[data-game-id="lives"] .btn.secondary{
  color:#fff0df !important;
  background:
    linear-gradient(180deg, rgba(75,18,25,.90), rgba(45,11,17,.95)) !important;
  border-color: rgba(239,68,68,.28) !important;
}

body[data-game-id="lives"] .choice{
  border-color: color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    rgba(45,12,18,.72) !important;
}

body[data-game-id="lives"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="lives"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="lives"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#ffca75;
  font-weight:900;
}
body[data-game-id="lives"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="lives"] .imgwrap img{
  border:1px solid rgba(245,158,11,.26);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(239,68,68,.10);
}


/* A1d13: Backscatter Board gets a banner-driven quiz-show pass. */
body[data-game-id="streak"]{
  --text:#e9ddff;
  --muted:#cfc2ef;
}

body[data-game-id="streak"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    radial-gradient(760px 340px at 12% 0%, rgba(168,85,247,.22), transparent 62%),
    radial-gradient(680px 300px at 88% 0%, rgba(34,211,238,.15), transparent 64%),
    radial-gradient(520px 260px at 52% 105%, rgba(250,204,21,.08), transparent 68%),
    linear-gradient(180deg, rgba(22,9,58,.97), rgba(12,9,35,.95)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 28%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="streak"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 24%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.18);
}

body[data-game-id="streak"],
body[data-game-id="streak"] .card,
body[data-game-id="streak"] .box,
body[data-game-id="streak"] .notice,
body[data-game-id="streak"] .bar,
body[data-game-id="streak"] .hint,
body[data-game-id="streak"] p,
body[data-game-id="streak"] li,
body[data-game-id="streak"] summary,
body[data-game-id="streak"] label,
body[data-game-id="streak"] .qmeta,
body[data-game-id="streak"] .row,
body[data-game-id="streak"] .choice,
body[data-game-id="streak"] .stat{
  color:#e9ddff !important;
}

body[data-game-id="streak"] .hint,
body[data-game-id="streak"] p,
body[data-game-id="streak"] li,
body[data-game-id="streak"] summary,
body[data-game-id="streak"] label,
body[data-game-id="streak"] .qmeta,
body[data-game-id="streak"] .row,
body[data-game-id="streak"] .choice{
  color:#d7cdf4 !important;
}

body[data-game-id="streak"] .qtext,
body[data-game-id="streak"] .dlgTitle,
body[data-game-id="streak"] h1,
body[data-game-id="streak"] h2,
body[data-game-id="streak"] h3,
body[data-game-id="streak"] .box > div[style*="font-weight:800"]{
  color:#fff0a8 !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 12px rgba(250,204,21,.16),
    0 0 18px rgba(168,85,247,.12),
    0 2px 0 rgba(0,0,0,.36);
}

body[data-game-id="streak"] .hint strong,
body[data-game-id="streak"] summary strong,
body[data-game-id="streak"] .card strong,
body[data-game-id="streak"] .box strong,
body[data-game-id="streak"] .notice strong{
  color:#ffe066 !important;
}

body[data-game-id="streak"] .box,
body[data-game-id="streak"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(168,85,247,.07), rgba(34,211,238,.045)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="streak"] .box::before,
body[data-game-id="streak"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(168,85,247,0), rgba(168,85,247,.96), rgba(34,211,238,.95), rgba(250,204,21,.88), rgba(250,204,21,0));
  opacity:.88;
}

body[data-game-id="streak"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 24%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(90deg, rgba(168,85,247,.11), rgba(34,211,238,.08)),
    rgba(18,10,48,.64) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="streak"] .stat,
body[data-game-id="streak"] .qhelpOffPill{
  border:1px solid color-mix(in srgb, var(--accent2) 30%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    rgba(22,12,56,.74);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="streak"] .qhelpOffPill{
  color:#ffe066 !important;
}

body[data-game-id="streak"] button,
body[data-game-id="streak"] .btn{
  color:#f7edff !important;
  background:
    linear-gradient(180deg, rgba(95,40,170,.96), rgba(58,24,112,.98)) !important;
  border-color: rgba(189,142,255,.36) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(168,85,247,.13);
}
body[data-game-id="streak"] button:hover,
body[data-game-id="streak"] .btn:hover,
body[data-game-id="streak"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 20px rgba(168,85,247,.18),
    0 0 14px rgba(34,211,238,.10),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="streak"] .primary,
body[data-game-id="streak"] button.primary,
body[data-game-id="streak"] .btn.primary{
  color:#21143d !important;
  background:
    linear-gradient(180deg, rgba(255,231,128,.98), rgba(235,183,34,.98)) !important;
  border-color: rgba(255,240,168,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="streak"] .secondary,
body[data-game-id="streak"] button.secondary,
body[data-game-id="streak"] .btn.secondary{
  color:#f2eaff !important;
  background:
    linear-gradient(180deg, rgba(45,24,91,.92), rgba(25,14,55,.96)) !important;
  border-color: rgba(34,211,238,.28) !important;
}

body[data-game-id="streak"] .choice{
  border-color: color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(25,13,62,.74) !important;
}

body[data-game-id="streak"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="streak"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="streak"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#22d3ee;
  font-weight:900;
}
body[data-game-id="streak"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="streak"] .imgwrap img{
  border:1px solid rgba(34,211,238,.26);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(168,85,247,.12);
}


/* A1d14: Signal Sweep gets a banner-driven signal-console pass. */
body[data-game-id="bingo"]{
  --text:#d7fbff;
  --muted:#b9edf4;
}

body[data-game-id="bingo"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    radial-gradient(760px 340px at 12% 0%, rgba(34,211,238,.23), transparent 62%),
    radial-gradient(680px 300px at 88% 0%, rgba(163,230,53,.14), transparent 64%),
    radial-gradient(520px 260px at 52% 105%, rgba(253,224,71,.075), transparent 68%),
    linear-gradient(180deg, rgba(4,28,56,.97), rgba(4,18,38,.96)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="bingo"] .app::before{
  background:
    linear-gradient(135deg, rgba(34,211,238,.055) 0 1px, transparent 1px 22px),
    repeating-linear-gradient(90deg, transparent 0 38px, rgba(163,230,53,.035) 38px 39px),
    radial-gradient(circle at 100% 0%, rgba(163,230,53,.16), transparent 30%) !important;
  opacity:.46;
}

body[data-game-id="bingo"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 26%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.18);
}

body[data-game-id="bingo"],
body[data-game-id="bingo"] .card,
body[data-game-id="bingo"] .box,
body[data-game-id="bingo"] .notice,
body[data-game-id="bingo"] .bar,
body[data-game-id="bingo"] .hint,
body[data-game-id="bingo"] p,
body[data-game-id="bingo"] li,
body[data-game-id="bingo"] summary,
body[data-game-id="bingo"] label,
body[data-game-id="bingo"] .qmeta,
body[data-game-id="bingo"] .row,
body[data-game-id="bingo"] .choice,
body[data-game-id="bingo"] .stat{
  color:#d7fbff !important;
}

body[data-game-id="bingo"] .hint,
body[data-game-id="bingo"] p,
body[data-game-id="bingo"] li,
body[data-game-id="bingo"] summary,
body[data-game-id="bingo"] label,
body[data-game-id="bingo"] .qmeta,
body[data-game-id="bingo"] .row,
body[data-game-id="bingo"] .choice{
  color:#b9edf4 !important;
}

body[data-game-id="bingo"] .qtext,
body[data-game-id="bingo"] .dlgTitle,
body[data-game-id="bingo"] h1,
body[data-game-id="bingo"] h2,
body[data-game-id="bingo"] h3,
body[data-game-id="bingo"] .box > div[style*="font-weight:800"]{
  color:#dfff6b !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 12px rgba(163,230,53,.18),
    0 0 18px rgba(34,211,238,.12),
    0 2px 0 rgba(0,0,0,.36);
}

body[data-game-id="bingo"] .hint strong,
body[data-game-id="bingo"] summary strong,
body[data-game-id="bingo"] .card strong,
body[data-game-id="bingo"] .box strong,
body[data-game-id="bingo"] .notice strong{
  color:#eaff7a !important;
}

body[data-game-id="bingo"] .box,
body[data-game-id="bingo"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(34,211,238,.075), rgba(163,230,53,.048)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="bingo"] .box::before,
body[data-game-id="bingo"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(34,211,238,0), rgba(34,211,238,.98), rgba(163,230,53,.96), rgba(253,224,71,.88), rgba(253,224,71,0));
  opacity:.9;
}

body[data-game-id="bingo"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 24%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(90deg, rgba(34,211,238,.12), rgba(163,230,53,.08)),
    rgba(4,26,52,.66) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="bingo"] .stat,
body[data-game-id="bingo"] .qhelpOffPill{
  border:1px solid color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    rgba(5,28,54,.74);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="bingo"] .qhelpOffPill{
  color:#eaff7a !important;
}

body[data-game-id="bingo"] button,
body[data-game-id="bingo"] .btn{
  color:#eafbff !important;
  background:
    linear-gradient(180deg, rgba(12,113,155,.96), rgba(6,57,91,.98)) !important;
  border-color: rgba(91,220,255,.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(34,211,238,.14);
}
body[data-game-id="bingo"] button:hover,
body[data-game-id="bingo"] .btn:hover,
body[data-game-id="bingo"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 20px rgba(34,211,238,.20),
    0 0 14px rgba(163,230,53,.11),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="bingo"] .primary,
body[data-game-id="bingo"] button.primary,
body[data-game-id="bingo"] .btn.primary{
  color:#092538 !important;
  background:
    linear-gradient(180deg, rgba(224,255,122,.98), rgba(149,214,34,.98)) !important;
  border-color: rgba(238,255,168,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="bingo"] .secondary,
body[data-game-id="bingo"] button.secondary,
body[data-game-id="bingo"] .btn.secondary{
  color:#eafbff !important;
  background:
    linear-gradient(180deg, rgba(8,54,90,.92), rgba(4,31,57,.96)) !important;
  border-color: rgba(163,230,53,.28) !important;
}

body[data-game-id="bingo"] .choice{
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(4,30,58,.74) !important;
}

body[data-game-id="bingo"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="bingo"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="bingo"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#a3e635;
  font-weight:900;
}
body[data-game-id="bingo"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="bingo"] .imgwrap img{
  border:1px solid rgba(163,230,53,.28);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(34,211,238,.13);
}


/* A1d15: Coax Circuit gets a banner-driven circuit-board pass. */
body[data-game-id="coax"]{
  --text:#e8ffd0;
  --muted:#ccecae;
}

body[data-game-id="coax"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    radial-gradient(760px 340px at 12% 0%, rgba(132,204,22,.22), transparent 62%),
    radial-gradient(680px 300px at 88% 0%, rgba(249,115,22,.15), transparent 64%),
    radial-gradient(520px 260px at 52% 105%, rgba(250,204,21,.075), transparent 68%),
    linear-gradient(180deg, rgba(7,42,17,.97), rgba(5,25,13,.96)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="coax"] .app::before{
  background:
    linear-gradient(90deg, rgba(132,204,22,.050) 0 1px, transparent 1px 32px),
    linear-gradient(0deg, rgba(132,204,22,.035) 0 1px, transparent 1px 32px),
    linear-gradient(135deg, rgba(249,115,22,.045) 0 1px, transparent 1px 24px),
    radial-gradient(circle at 100% 0%, rgba(249,115,22,.15), transparent 30%) !important;
  opacity:.46;
}

body[data-game-id="coax"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 26%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.18);
}

body[data-game-id="coax"],
body[data-game-id="coax"] .card,
body[data-game-id="coax"] .box,
body[data-game-id="coax"] .notice,
body[data-game-id="coax"] .bar,
body[data-game-id="coax"] .hint,
body[data-game-id="coax"] p,
body[data-game-id="coax"] li,
body[data-game-id="coax"] summary,
body[data-game-id="coax"] label,
body[data-game-id="coax"] .qmeta,
body[data-game-id="coax"] .row,
body[data-game-id="coax"] .choice,
body[data-game-id="coax"] .stat{
  color:#e8ffd0 !important;
}

body[data-game-id="coax"] .hint,
body[data-game-id="coax"] p,
body[data-game-id="coax"] li,
body[data-game-id="coax"] summary,
body[data-game-id="coax"] label,
body[data-game-id="coax"] .qmeta,
body[data-game-id="coax"] .row,
body[data-game-id="coax"] .choice{
  color:#ccecae !important;
}

body[data-game-id="coax"] .qtext,
body[data-game-id="coax"] .dlgTitle,
body[data-game-id="coax"] h1,
body[data-game-id="coax"] h2,
body[data-game-id="coax"] h3,
body[data-game-id="coax"] .box > div[style*="font-weight:800"]{
  color:#dfff8c !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 12px rgba(132,204,22,.20),
    0 0 18px rgba(249,115,22,.10),
    0 2px 0 rgba(0,0,0,.36);
}

body[data-game-id="coax"] .hint strong,
body[data-game-id="coax"] summary strong,
body[data-game-id="coax"] .card strong,
body[data-game-id="coax"] .box strong,
body[data-game-id="coax"] .notice strong{
  color:#ffb15c !important;
}

body[data-game-id="coax"] .box,
body[data-game-id="coax"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(132,204,22,.075), rgba(249,115,22,.048)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="coax"] .box::before,
body[data-game-id="coax"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(132,204,22,0), rgba(132,204,22,.98), rgba(249,115,22,.96), rgba(250,204,21,.88), rgba(250,204,21,0));
  opacity:.9;
}

body[data-game-id="coax"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 24%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(90deg, rgba(132,204,22,.12), rgba(249,115,22,.08)),
    rgba(7,35,16,.66) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="coax"] .stat,
body[data-game-id="coax"] .qhelpOffPill{
  border:1px solid color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    rgba(8,38,17,.74);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="coax"] .qhelpOffPill{
  color:#ffb15c !important;
}

body[data-game-id="coax"] button,
body[data-game-id="coax"] .btn{
  color:#f1ffe3 !important;
  background:
    linear-gradient(180deg, rgba(38,125,35,.96), rgba(17,70,24,.98)) !important;
  border-color: rgba(171,235,96,.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(132,204,22,.14);
}
body[data-game-id="coax"] button:hover,
body[data-game-id="coax"] .btn:hover,
body[data-game-id="coax"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 20px rgba(132,204,22,.20),
    0 0 14px rgba(249,115,22,.11),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="coax"] .primary,
body[data-game-id="coax"] button.primary,
body[data-game-id="coax"] .btn.primary{
  color:#1b1a0d !important;
  background:
    linear-gradient(180deg, rgba(255,190,108,.98), rgba(239,123,28,.98)) !important;
  border-color: rgba(255,220,160,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="coax"] .secondary,
body[data-game-id="coax"] button.secondary,
body[data-game-id="coax"] .btn.secondary{
  color:#efffe0 !important;
  background:
    linear-gradient(180deg, rgba(17,74,27,.92), rgba(7,43,17,.96)) !important;
  border-color: rgba(249,115,22,.28) !important;
}

body[data-game-id="coax"] .choice{
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(7,36,17,.74) !important;
}

body[data-game-id="coax"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="coax"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="coax"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#f97316;
  font-weight:900;
}
body[data-game-id="coax"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="coax"] .imgwrap img{
  border:1px solid rgba(249,115,22,.28);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(132,204,22,.13);
}

/* Coax Circuit board pieces and puzzle area: gently pull them into the theme without changing mechanics. */
body[data-game-id="coax"] .coaxBoard,
body[data-game-id="coax"] .coaxGrid,
body[data-game-id="coax"] .coaxPuzzle,
body[data-game-id="coax"] .coaxStage{
  border-color: color-mix(in srgb, var(--accent) 28%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 0 24px rgba(132,204,22,.08);
}


/* A1d16: Choice Scramble gets a banner-driven kitchen-chaos pass. */
body[data-game-id="scramble"]{
  --text:#fff0d6;
  --muted:#f3d5ab;
}

body[data-game-id="scramble"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    radial-gradient(760px 340px at 12% 0%, rgba(249,115,22,.24), transparent 62%),
    radial-gradient(680px 300px at 88% 0%, rgba(250,204,21,.15), transparent 64%),
    radial-gradient(520px 260px at 52% 105%, rgba(239,68,68,.075), transparent 68%),
    linear-gradient(180deg, rgba(61,24,7,.97), rgba(32,13,6,.96)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="scramble"] .app::before{
  background:
    linear-gradient(135deg, rgba(249,115,22,.050) 0 1px, transparent 1px 24px),
    repeating-linear-gradient(90deg, transparent 0 42px, rgba(250,204,21,.030) 42px 43px),
    radial-gradient(circle at 100% 0%, rgba(250,204,21,.15), transparent 30%) !important;
  opacity:.44;
}

body[data-game-id="scramble"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 26%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.18);
}

body[data-game-id="scramble"],
body[data-game-id="scramble"] .card,
body[data-game-id="scramble"] .box,
body[data-game-id="scramble"] .notice,
body[data-game-id="scramble"] .bar,
body[data-game-id="scramble"] .hint,
body[data-game-id="scramble"] p,
body[data-game-id="scramble"] li,
body[data-game-id="scramble"] summary,
body[data-game-id="scramble"] label,
body[data-game-id="scramble"] .qmeta,
body[data-game-id="scramble"] .row,
body[data-game-id="scramble"] .choice,
body[data-game-id="scramble"] .stat{
  color:#fff0d6 !important;
}

body[data-game-id="scramble"] .hint,
body[data-game-id="scramble"] p,
body[data-game-id="scramble"] li,
body[data-game-id="scramble"] summary,
body[data-game-id="scramble"] label,
body[data-game-id="scramble"] .qmeta,
body[data-game-id="scramble"] .row,
body[data-game-id="scramble"] .choice{
  color:#f3d5ab !important;
}

body[data-game-id="scramble"] .qtext,
body[data-game-id="scramble"] .dlgTitle,
body[data-game-id="scramble"] h1,
body[data-game-id="scramble"] h2,
body[data-game-id="scramble"] h3,
body[data-game-id="scramble"] .box > div[style*="font-weight:800"]{
  color:#ffe58b !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 12px rgba(250,204,21,.18),
    0 0 18px rgba(249,115,22,.12),
    0 2px 0 rgba(0,0,0,.36);
}

body[data-game-id="scramble"] .hint strong,
body[data-game-id="scramble"] summary strong,
body[data-game-id="scramble"] .card strong,
body[data-game-id="scramble"] .box strong,
body[data-game-id="scramble"] .notice strong{
  color:#ffd34f !important;
}

body[data-game-id="scramble"] .box,
body[data-game-id="scramble"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(249,115,22,.075), rgba(250,204,21,.048)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="scramble"] .box::before,
body[data-game-id="scramble"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(249,115,22,0), rgba(249,115,22,.98), rgba(250,204,21,.96), rgba(239,68,68,.82), rgba(239,68,68,0));
  opacity:.9;
}

body[data-game-id="scramble"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 24%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(90deg, rgba(249,115,22,.12), rgba(250,204,21,.08)),
    rgba(51,20,8,.66) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="scramble"] .stat,
body[data-game-id="scramble"] .qhelpOffPill,
body[data-game-id="scramble"] .scrambleHeatPill{
  border:1px solid color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    rgba(54,21,8,.74);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="scramble"] .qhelpOffPill,
body[data-game-id="scramble"] .scrambleHeatPill{
  color:#ffd34f !important;
}

body[data-game-id="scramble"] button,
body[data-game-id="scramble"] .btn{
  color:#fff2df !important;
  background:
    linear-gradient(180deg, rgba(182,72,18,.96), rgba(108,39,9,.98)) !important;
  border-color: rgba(255,180,96,.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(249,115,22,.14);
}
body[data-game-id="scramble"] button:hover,
body[data-game-id="scramble"] .btn:hover,
body[data-game-id="scramble"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 20px rgba(249,115,22,.20),
    0 0 14px rgba(250,204,21,.11),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="scramble"] .primary,
body[data-game-id="scramble"] button.primary,
body[data-game-id="scramble"] .btn.primary{
  color:#241205 !important;
  background:
    linear-gradient(180deg, rgba(255,224,112,.98), rgba(245,159,36,.98)) !important;
  border-color: rgba(255,238,168,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="scramble"] .secondary,
body[data-game-id="scramble"] button.secondary,
body[data-game-id="scramble"] .btn.secondary{
  color:#fff1dc !important;
  background:
    linear-gradient(180deg, rgba(88,34,10,.92), rgba(50,20,8,.96)) !important;
  border-color: rgba(250,204,21,.28) !important;
}

body[data-game-id="scramble"] .choice{
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(52,20,8,.74) !important;
}

body[data-game-id="scramble"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="scramble"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="scramble"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#facc15;
  font-weight:900;
}
body[data-game-id="scramble"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="scramble"] .imgwrap img{
  border:1px solid rgba(250,204,21,.28);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(249,115,22,.13);
}

/* Choice Scramble already has a kitchen stage image. This pass keeps the art but warms the UI chrome. */
body[data-game-id="scramble"] .app.scrambleStage{
  border-color: color-mix(in srgb, var(--accent) 36%, rgba(255,255,255,.12)) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 34px rgba(249,115,22,.16),
    var(--shadow) !important;
}


/* A1d17: Shack Triage gets a banner-driven workbench diagnostics pass. */
body[data-game-id="triage"]{
  --text:#fff1dc;
  --muted:#f0d1ad;
}

body[data-game-id="triage"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    radial-gradient(760px 340px at 12% 0%, rgba(251,146,60,.22), transparent 62%),
    radial-gradient(680px 300px at 88% 0%, rgba(34,197,94,.14), transparent 64%),
    radial-gradient(520px 260px at 52% 105%, rgba(250,204,21,.075), transparent 68%),
    linear-gradient(180deg, rgba(50,27,10,.97), rgba(26,15,8,.96)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.05);
}

/* Preserve the existing workbench photo but give its chrome the new triage palette. */
body[data-game-id="triage"] .app.triageStage{
  border-color: color-mix(in srgb, var(--accent) 36%, rgba(255,255,255,.12)) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 34px rgba(251,146,60,.14),
    var(--shadow) !important;
}

body[data-game-id="triage"] .app::before{
  background:
    linear-gradient(135deg, rgba(251,146,60,.052) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(90deg, transparent 0 44px, rgba(34,197,94,.028) 44px 45px),
    radial-gradient(circle at 100% 0%, rgba(34,197,94,.13), transparent 30%) !important;
  opacity:.42;
}

body[data-game-id="triage"] .card,
body[data-game-id="triage"] .triage{
  border:1px solid color-mix(in srgb, var(--accent) 26%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.20);
}

body[data-game-id="triage"],
body[data-game-id="triage"] .card,
body[data-game-id="triage"] .box,
body[data-game-id="triage"] .notice,
body[data-game-id="triage"] .bar,
body[data-game-id="triage"] .hint,
body[data-game-id="triage"] p,
body[data-game-id="triage"] li,
body[data-game-id="triage"] summary,
body[data-game-id="triage"] label,
body[data-game-id="triage"] .qmeta,
body[data-game-id="triage"] .row,
body[data-game-id="triage"] .choice,
body[data-game-id="triage"] .stat{
  color:#fff1dc !important;
}

body[data-game-id="triage"] .hint,
body[data-game-id="triage"] p,
body[data-game-id="triage"] li,
body[data-game-id="triage"] summary,
body[data-game-id="triage"] label,
body[data-game-id="triage"] .qmeta,
body[data-game-id="triage"] .row,
body[data-game-id="triage"] .choice{
  color:#f0d1ad !important;
}

body[data-game-id="triage"] .qtext,
body[data-game-id="triage"] .dlgTitle,
body[data-game-id="triage"] h1,
body[data-game-id="triage"] h2,
body[data-game-id="triage"] h3,
body[data-game-id="triage"] .box > div[style*="font-weight:800"]{
  color:#ffce86 !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 12px rgba(251,146,60,.18),
    0 0 18px rgba(34,197,94,.10),
    0 2px 0 rgba(0,0,0,.36);
}

body[data-game-id="triage"] .hint strong,
body[data-game-id="triage"] summary strong,
body[data-game-id="triage"] .card strong,
body[data-game-id="triage"] .box strong,
body[data-game-id="triage"] .notice strong{
  color:#7cff9f !important;
}

body[data-game-id="triage"] .box,
body[data-game-id="triage"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(251,146,60,.075), rgba(34,197,94,.048)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="triage"] .box::before,
body[data-game-id="triage"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(251,146,60,0), rgba(251,146,60,.98), rgba(34,197,94,.94), rgba(250,204,21,.82), rgba(250,204,21,0));
  opacity:.9;
}

body[data-game-id="triage"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 24%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(90deg, rgba(251,146,60,.12), rgba(34,197,94,.08)),
    rgba(47,26,12,.66) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="triage"] .stat,
body[data-game-id="triage"] .qhelpOffPill,
body[data-game-id="triage"] .triageStatusPill,
body[data-game-id="triage"] .triageEvidencePill{
  border:1px solid color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    rgba(45,25,12,.74);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="triage"] .qhelpOffPill,
body[data-game-id="triage"] .triageStatusPill,
body[data-game-id="triage"] .triageEvidencePill{
  color:#7cff9f !important;
}

body[data-game-id="triage"] button,
body[data-game-id="triage"] .btn{
  color:#fff2e0 !important;
  background:
    linear-gradient(180deg, rgba(151,72,24,.96), rgba(83,41,14,.98)) !important;
  border-color: rgba(255,184,116,.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(251,146,60,.14);
}
body[data-game-id="triage"] button:hover,
body[data-game-id="triage"] .btn:hover,
body[data-game-id="triage"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 20px rgba(251,146,60,.20),
    0 0 14px rgba(34,197,94,.11),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="triage"] .primary,
body[data-game-id="triage"] button.primary,
body[data-game-id="triage"] .btn.primary{
  color:#102012 !important;
  background:
    linear-gradient(180deg, rgba(151,255,177,.98), rgba(49,202,100,.98)) !important;
  border-color: rgba(194,255,210,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="triage"] .secondary,
body[data-game-id="triage"] button.secondary,
body[data-game-id="triage"] .btn.secondary{
  color:#fff1df !important;
  background:
    linear-gradient(180deg, rgba(75,39,16,.92), rgba(42,23,11,.96)) !important;
  border-color: rgba(34,197,94,.28) !important;
}

body[data-game-id="triage"] .choice{
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(45,24,12,.74) !important;
}

/* Diagnostic pass/fail buttons keep their meaning, just get cleaner cabinet lights. */
body[data-game-id="triage"] button.triagePass,
body[data-game-id="triage"] .triagePass{
  border-color: rgba(80,255,132,.72) !important;
  box-shadow:
    inset 0 0 0 2px rgba(80,255,132,.34),
    0 0 18px rgba(34,197,94,.18) !important;
}
body[data-game-id="triage"] button.triageFail,
body[data-game-id="triage"] .triageFail{
  border-color: rgba(255,106,106,.72) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255,106,106,.34),
    0 0 18px rgba(239,68,68,.16) !important;
}

body[data-game-id="triage"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="triage"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="triage"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#22c55e;
  font-weight:900;
}
body[data-game-id="triage"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="triage"] .imgwrap img{
  border:1px solid rgba(34,197,94,.26);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(251,146,60,.13);
}


/* A1d18: Stormline Sprint gets a banner-driven storm and lightning pass. */
body[data-game-id="stormline"]{
  --text:#e8f4ff;
  --muted:#c6d8ee;
}

body[data-game-id="stormline"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    radial-gradient(760px 340px at 12% 0%, rgba(96,165,250,.22), transparent 62%),
    radial-gradient(680px 300px at 88% 0%, rgba(250,204,21,.15), transparent 64%),
    radial-gradient(520px 260px at 52% 105%, rgba(14,165,233,.075), transparent 68%),
    linear-gradient(180deg, rgba(9,28,56,.97), rgba(5,16,34,.96)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.48),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="stormline"] .app::before{
  background:
    linear-gradient(115deg, transparent 0 20%, rgba(250,204,21,.055) 20.4% 20.8%, transparent 21.2% 100%),
    linear-gradient(135deg, rgba(96,165,250,.052) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(90deg, transparent 0 42px, rgba(96,165,250,.032) 42px 43px),
    radial-gradient(circle at 100% 0%, rgba(250,204,21,.15), transparent 30%) !important;
  opacity:.44;
}

body[data-game-id="stormline"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 26%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.20);
}

body[data-game-id="stormline"],
body[data-game-id="stormline"] .card,
body[data-game-id="stormline"] .box,
body[data-game-id="stormline"] .notice,
body[data-game-id="stormline"] .bar,
body[data-game-id="stormline"] .hint,
body[data-game-id="stormline"] p,
body[data-game-id="stormline"] li,
body[data-game-id="stormline"] summary,
body[data-game-id="stormline"] label,
body[data-game-id="stormline"] .qmeta,
body[data-game-id="stormline"] .row,
body[data-game-id="stormline"] .choice,
body[data-game-id="stormline"] .stat{
  color:#e8f4ff !important;
}

body[data-game-id="stormline"] .hint,
body[data-game-id="stormline"] p,
body[data-game-id="stormline"] li,
body[data-game-id="stormline"] summary,
body[data-game-id="stormline"] label,
body[data-game-id="stormline"] .qmeta,
body[data-game-id="stormline"] .row,
body[data-game-id="stormline"] .choice{
  color:#c6d8ee !important;
}

body[data-game-id="stormline"] .qtext,
body[data-game-id="stormline"] .dlgTitle,
body[data-game-id="stormline"] h1,
body[data-game-id="stormline"] h2,
body[data-game-id="stormline"] h3,
body[data-game-id="stormline"] .box > div[style*="font-weight:800"]{
  color:#fff19b !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 12px rgba(250,204,21,.20),
    0 0 18px rgba(96,165,250,.12),
    0 2px 0 rgba(0,0,0,.38);
}

body[data-game-id="stormline"] .hint strong,
body[data-game-id="stormline"] summary strong,
body[data-game-id="stormline"] .card strong,
body[data-game-id="stormline"] .box strong,
body[data-game-id="stormline"] .notice strong{
  color:#ffe45f !important;
}

body[data-game-id="stormline"] .box,
body[data-game-id="stormline"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(96,165,250,.075), rgba(250,204,21,.048)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="stormline"] .box::before,
body[data-game-id="stormline"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(96,165,250,0), rgba(96,165,250,.98), rgba(250,204,21,.96), rgba(255,255,255,.55), rgba(255,255,255,0));
  opacity:.9;
}

body[data-game-id="stormline"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 24%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(90deg, rgba(96,165,250,.12), rgba(250,204,21,.08)),
    rgba(8,25,52,.68) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="stormline"] .stat,
body[data-game-id="stormline"] .qhelpOffPill,
body[data-game-id="stormline"] .stormPill,
body[data-game-id="stormline"] .stormlinePill{
  border:1px solid color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    rgba(8,27,56,.76);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="stormline"] .qhelpOffPill,
body[data-game-id="stormline"] .stormPill,
body[data-game-id="stormline"] .stormlinePill{
  color:#ffe45f !important;
}

body[data-game-id="stormline"] button,
body[data-game-id="stormline"] .btn{
  color:#eef7ff !important;
  background:
    linear-gradient(180deg, rgba(36,88,158,.96), rgba(14,48,100,.98)) !important;
  border-color: rgba(140,196,255,.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(96,165,250,.14);
}
body[data-game-id="stormline"] button:hover,
body[data-game-id="stormline"] .btn:hover,
body[data-game-id="stormline"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 20px rgba(96,165,250,.20),
    0 0 14px rgba(250,204,21,.12),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="stormline"] .primary,
body[data-game-id="stormline"] button.primary,
body[data-game-id="stormline"] .btn.primary{
  color:#17243a !important;
  background:
    linear-gradient(180deg, rgba(255,239,128,.98), rgba(237,187,31,.98)) !important;
  border-color: rgba(255,244,172,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="stormline"] .secondary,
body[data-game-id="stormline"] button.secondary,
body[data-game-id="stormline"] .btn.secondary{
  color:#eaf5ff !important;
  background:
    linear-gradient(180deg, rgba(17,50,93,.92), rgba(8,29,59,.96)) !important;
  border-color: rgba(250,204,21,.28) !important;
}

body[data-game-id="stormline"] .choice{
  border-color: color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(8,27,56,.74) !important;
}

body[data-game-id="stormline"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="stormline"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="stormline"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#facc15;
  font-weight:900;
}
body[data-game-id="stormline"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="stormline"] .imgwrap img{
  border:1px solid rgba(250,204,21,.28);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(96,165,250,.13);
}

/* Stormline scene chrome: keep the yard/storm art, tighten the surrounding cabinet. */
body[data-game-id="stormline"] .stormlineStage,
body[data-game-id="stormline"] .stormStage,
body[data-game-id="stormline"] .yardStage{
  border-color: color-mix(in srgb, var(--accent) 36%, rgba(255,255,255,.12)) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 34px rgba(96,165,250,.16),
    0 0 24px rgba(250,204,21,.08) !important;
}


/* A1d19: Ham Hunter gets a banner-driven signal-hunt pass. */
body[data-game-id="boss"]{
  --text:#eaffd8;
  --muted:#cfeab8;
}

body[data-game-id="boss"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    radial-gradient(760px 340px at 12% 0%, rgba(34,197,94,.23), transparent 62%),
    radial-gradient(680px 300px at 88% 0%, rgba(250,204,21,.15), transparent 64%),
    radial-gradient(520px 260px at 52% 105%, rgba(132,204,22,.075), transparent 68%),
    linear-gradient(180deg, rgba(6,43,20,.97), rgba(4,24,13,.96)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="boss"] .app::before{
  background:
    radial-gradient(circle at 18% 24%, rgba(34,197,94,.09), transparent 12%),
    radial-gradient(circle at 72% 18%, rgba(250,204,21,.06), transparent 10%),
    linear-gradient(135deg, rgba(34,197,94,.052) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(90deg, transparent 0 42px, rgba(132,204,22,.030) 42px 43px),
    radial-gradient(circle at 100% 0%, rgba(250,204,21,.14), transparent 30%) !important;
  opacity:.44;
}

body[data-game-id="boss"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 28%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.20);
}

body[data-game-id="boss"],
body[data-game-id="boss"] .card,
body[data-game-id="boss"] .box,
body[data-game-id="boss"] .notice,
body[data-game-id="boss"] .bar,
body[data-game-id="boss"] .hint,
body[data-game-id="boss"] p,
body[data-game-id="boss"] li,
body[data-game-id="boss"] summary,
body[data-game-id="boss"] label,
body[data-game-id="boss"] .qmeta,
body[data-game-id="boss"] .row,
body[data-game-id="boss"] .choice,
body[data-game-id="boss"] .stat{
  color:#eaffd8 !important;
}

body[data-game-id="boss"] .hint,
body[data-game-id="boss"] p,
body[data-game-id="boss"] li,
body[data-game-id="boss"] summary,
body[data-game-id="boss"] label,
body[data-game-id="boss"] .qmeta,
body[data-game-id="boss"] .row,
body[data-game-id="boss"] .choice{
  color:#cfeab8 !important;
}

body[data-game-id="boss"] .qtext,
body[data-game-id="boss"] .dlgTitle,
body[data-game-id="boss"] h1,
body[data-game-id="boss"] h2,
body[data-game-id="boss"] h3,
body[data-game-id="boss"] .box > div[style*="font-weight:800"]{
  color:#fff08a !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 12px rgba(250,204,21,.20),
    0 0 18px rgba(34,197,94,.12),
    0 2px 0 rgba(0,0,0,.36);
}

body[data-game-id="boss"] .hint strong,
body[data-game-id="boss"] summary strong,
body[data-game-id="boss"] .card strong,
body[data-game-id="boss"] .box strong,
body[data-game-id="boss"] .notice strong{
  color:#ffe45f !important;
}

body[data-game-id="boss"] .box,
body[data-game-id="boss"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 34%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(34,197,94,.078), rgba(250,204,21,.048)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="boss"] .box::before,
body[data-game-id="boss"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(34,197,94,0), rgba(34,197,94,.98), rgba(250,204,21,.96), rgba(255,255,255,.45), rgba(255,255,255,0));
  opacity:.9;
}

body[data-game-id="boss"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 24%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(90deg, rgba(34,197,94,.12), rgba(250,204,21,.08)),
    rgba(6,36,17,.68) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="boss"] .stat,
body[data-game-id="boss"] .qhelpOffPill,
body[data-game-id="boss"] .hunterPill,
body[data-game-id="boss"] .bossPill,
body[data-game-id="boss"] .foxPill{
  border:1px solid color-mix(in srgb, var(--accent) 34%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    rgba(6,37,17,.76);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="boss"] .qhelpOffPill,
body[data-game-id="boss"] .hunterPill,
body[data-game-id="boss"] .bossPill,
body[data-game-id="boss"] .foxPill{
  color:#ffe45f !important;
}

body[data-game-id="boss"] button,
body[data-game-id="boss"] .btn{
  color:#efffe5 !important;
  background:
    linear-gradient(180deg, rgba(33,126,55,.96), rgba(14,70,31,.98)) !important;
  border-color: rgba(126,235,151,.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(34,197,94,.14);
}
body[data-game-id="boss"] button:hover,
body[data-game-id="boss"] .btn:hover,
body[data-game-id="boss"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 20px rgba(34,197,94,.20),
    0 0 14px rgba(250,204,21,.11),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="boss"] .primary,
body[data-game-id="boss"] button.primary,
body[data-game-id="boss"] .btn.primary{
  color:#14230f !important;
  background:
    linear-gradient(180deg, rgba(255,238,126,.98), rgba(233,185,31,.98)) !important;
  border-color: rgba(255,244,172,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="boss"] .secondary,
body[data-game-id="boss"] button.secondary,
body[data-game-id="boss"] .btn.secondary{
  color:#eaffd8 !important;
  background:
    linear-gradient(180deg, rgba(15,78,34,.92), rgba(7,43,20,.96)) !important;
  border-color: rgba(250,204,21,.28) !important;
}

body[data-game-id="boss"] .choice{
  border-color: color-mix(in srgb, var(--accent) 34%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(6,37,17,.74) !important;
}

body[data-game-id="boss"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="boss"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="boss"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#facc15;
  font-weight:900;
}
body[data-game-id="boss"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="boss"] .imgwrap img{
  border:1px solid rgba(250,204,21,.28);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(34,197,94,.13);
}

/* Ham Hunter map/combat chrome: tune any existing local classes without touching logic. */
body[data-game-id="boss"] .hunterMap,
body[data-game-id="boss"] .hamHunterMap,
body[data-game-id="boss"] .foxMap,
body[data-game-id="boss"] .bossStage,
body[data-game-id="boss"] .huntStage{
  border-color: color-mix(in srgb, var(--accent) 36%, rgba(255,255,255,.12)) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 34px rgba(34,197,94,.16),
    0 0 24px rgba(250,204,21,.08) !important;
}


/* A1d20: Steel Wake gets a banner-driven sonar-depths pass. */
body[data-game-id="subhunt"]{
  --text:#d9fff6;
  --muted:#b7eade;
}

body[data-game-id="subhunt"] .app{
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    radial-gradient(760px 340px at 12% 0%, rgba(16,185,129,.22), transparent 62%),
    radial-gradient(680px 300px at 88% 0%, rgba(56,189,248,.16), transparent 64%),
    radial-gradient(520px 260px at 52% 105%, rgba(14,165,233,.08), transparent 68%),
    linear-gradient(180deg, rgba(4,39,47,.98), rgba(3,20,31,.97)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 32%, rgba(255,255,255,.10)) !important;
  box-shadow:
    0 22px 54px rgba(0,0,0,.48),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body[data-game-id="subhunt"] .app::before{
  background:
    radial-gradient(circle at 50% 42%, rgba(56,189,248,.09), transparent 14%),
    radial-gradient(circle at 50% 42%, transparent 0 22%, rgba(16,185,129,.055) 22.3% 22.9%, transparent 23.2% 100%),
    radial-gradient(circle at 50% 42%, transparent 0 38%, rgba(56,189,248,.040) 38.2% 38.8%, transparent 39.2% 100%),
    linear-gradient(135deg, rgba(16,185,129,.048) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(90deg, transparent 0 42px, rgba(56,189,248,.028) 42px 43px),
    radial-gradient(circle at 100% 0%, rgba(56,189,248,.13), transparent 30%) !important;
  opacity:.46;
}

body[data-game-id="subhunt"] .card{
  border:1px solid color-mix(in srgb, var(--accent) 28%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 32px rgba(0,0,0,.20);
}

body[data-game-id="subhunt"],
body[data-game-id="subhunt"] .card,
body[data-game-id="subhunt"] .box,
body[data-game-id="subhunt"] .notice,
body[data-game-id="subhunt"] .bar,
body[data-game-id="subhunt"] .hint,
body[data-game-id="subhunt"] p,
body[data-game-id="subhunt"] li,
body[data-game-id="subhunt"] summary,
body[data-game-id="subhunt"] label,
body[data-game-id="subhunt"] .qmeta,
body[data-game-id="subhunt"] .row,
body[data-game-id="subhunt"] .choice,
body[data-game-id="subhunt"] .stat{
  color:#d9fff6 !important;
}

body[data-game-id="subhunt"] .hint,
body[data-game-id="subhunt"] p,
body[data-game-id="subhunt"] li,
body[data-game-id="subhunt"] summary,
body[data-game-id="subhunt"] label,
body[data-game-id="subhunt"] .qmeta,
body[data-game-id="subhunt"] .row,
body[data-game-id="subhunt"] .choice{
  color:#b7eade !important;
}

body[data-game-id="subhunt"] .qtext,
body[data-game-id="subhunt"] .dlgTitle,
body[data-game-id="subhunt"] h1,
body[data-game-id="subhunt"] h2,
body[data-game-id="subhunt"] h3,
body[data-game-id="subhunt"] .box > div[style*="font-weight:800"]{
  color:#9dfff0 !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 12px rgba(16,185,129,.20),
    0 0 18px rgba(56,189,248,.13),
    0 2px 0 rgba(0,0,0,.38);
}

body[data-game-id="subhunt"] .hint strong,
body[data-game-id="subhunt"] summary strong,
body[data-game-id="subhunt"] .card strong,
body[data-game-id="subhunt"] .box strong,
body[data-game-id="subhunt"] .notice strong{
  color:#7ddcff !important;
}

body[data-game-id="subhunt"] .box,
body[data-game-id="subhunt"] .notice{
  position:relative;
  border-color: color-mix(in srgb, var(--accent) 34%, rgba(255,255,255,.10)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.016)),
    linear-gradient(135deg, rgba(16,185,129,.078), rgba(56,189,248,.050)),
    rgba(255,255,255,.022) !important;
}
body[data-game-id="subhunt"] .box::before,
body[data-game-id="subhunt"] .notice::before{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(16,185,129,0), rgba(16,185,129,.98), rgba(56,189,248,.96), rgba(255,255,255,.42), rgba(255,255,255,0));
  opacity:.9;
}

body[data-game-id="subhunt"] .bar{
  border:1px solid color-mix(in srgb, var(--accent2) 24%, rgba(255,255,255,.10)) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(90deg, rgba(16,185,129,.12), rgba(56,189,248,.08)),
    rgba(4,35,43,.70) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

body[data-game-id="subhunt"] .stat,
body[data-game-id="subhunt"] .qhelpOffPill,
body[data-game-id="subhunt"] .steelPill,
body[data-game-id="subhunt"] .wakePill,
body[data-game-id="subhunt"] .sonarPill,
body[data-game-id="subhunt"] .subPill{
  border:1px solid color-mix(in srgb, var(--accent) 34%, rgba(255,255,255,.10));
  border-radius:999px;
  padding:6px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018)),
    rgba(4,35,43,.76);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-game-id="subhunt"] .qhelpOffPill,
body[data-game-id="subhunt"] .steelPill,
body[data-game-id="subhunt"] .wakePill,
body[data-game-id="subhunt"] .sonarPill,
body[data-game-id="subhunt"] .subPill{
  color:#7ddcff !important;
}

body[data-game-id="subhunt"] button,
body[data-game-id="subhunt"] .btn{
  color:#e6fff8 !important;
  background:
    linear-gradient(180deg, rgba(16,111,106,.96), rgba(7,63,73,.98)) !important;
  border-color: rgba(105,226,221,.38) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    0 8px 18px rgba(0,0,0,.25),
    0 0 14px rgba(16,185,129,.14);
}
body[data-game-id="subhunt"] button:hover,
body[data-game-id="subhunt"] .btn:hover,
body[data-game-id="subhunt"] .choice:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 20px rgba(16,185,129,.20),
    0 0 14px rgba(56,189,248,.12),
    0 12px 24px rgba(0,0,0,.30);
}

body[data-game-id="subhunt"] .primary,
body[data-game-id="subhunt"] button.primary,
body[data-game-id="subhunt"] .btn.primary{
  color:#082c31 !important;
  background:
    linear-gradient(180deg, rgba(129,244,255,.98), rgba(49,186,231,.98)) !important;
  border-color: rgba(189,248,255,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="subhunt"] .secondary,
body[data-game-id="subhunt"] button.secondary,
body[data-game-id="subhunt"] .btn.secondary{
  color:#d9fff6 !important;
  background:
    linear-gradient(180deg, rgba(8,70,78,.92), rgba(4,40,50,.96)) !important;
  border-color: rgba(16,185,129,.30) !important;
}

body[data-game-id="subhunt"] .choice{
  border-color: color-mix(in srgb, var(--accent) 34%, rgba(255,255,255,.12)) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(4,35,43,.74) !important;
}

body[data-game-id="subhunt"] details.box > summary{
  list-style:none;
  position:relative;
  padding-right:28px;
}
body[data-game-id="subhunt"] details.box > summary::-webkit-details-marker{ display:none; }
body[data-game-id="subhunt"] details.box > summary::after{
  content:"▾";
  position:absolute;
  right:2px;
  top:0;
  color:#38bdf8;
  font-weight:900;
}
body[data-game-id="subhunt"] details.box:not([open]) > summary::after{ content:"▸"; }

body[data-game-id="subhunt"] .imgwrap img{
  border:1px solid rgba(56,189,248,.28);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 18px rgba(16,185,129,.13);
}

/* Steel Wake radar/periscope chrome: tune existing local classes without touching patrol logic. */
body[data-game-id="subhunt"] .subStage,
body[data-game-id="subhunt"] .steelWakeStage,
body[data-game-id="subhunt"] .radarStage,
body[data-game-id="subhunt"] .sonarStage,
body[data-game-id="subhunt"] .scopeStage,
body[data-game-id="subhunt"] .subBoard,
body[data-game-id="subhunt"] .radarBoard,
body[data-game-id="subhunt"] .sonarBoard{
  border-color: color-mix(in srgb, var(--accent) 36%, rgba(255,255,255,.12)) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 34px rgba(16,185,129,.16),
    0 0 24px rgba(56,189,248,.10) !important;
}


/* A1d21: Steel Wake end/debrief summary now matches the sonar theme. */
body[data-game-id="subhunt"] .card.subSummary{
  background:
    linear-gradient(180deg, rgba(255,255,255,.050), rgba(255,255,255,.016)),
    radial-gradient(820px 320px at 12% 0%, rgba(16,185,129,.16), transparent 60%),
    radial-gradient(740px 300px at 88% 0%, rgba(56,189,248,.14), transparent 62%),
    linear-gradient(180deg, rgba(6,36,43,.95), rgba(4,22,30,.97)) !important;
  border:1px solid color-mix(in srgb, var(--accent) 36%, rgba(255,255,255,.12)) !important;
  box-shadow:
    0 24px 54px rgba(0,0,0,.46),
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 28px rgba(16,185,129,.10) !important;
}

body[data-game-id="subhunt"] .card.subSummary .qtext{
  color:#a8fff0 !important;
  letter-spacing:.035em;
  text-shadow:
    0 0 14px rgba(16,185,129,.20),
    0 0 18px rgba(56,189,248,.14),
    0 2px 0 rgba(0,0,0,.38);
}

body[data-game-id="subhunt"] .card.subSummary .summaryGrid{
  gap:18px;
}

body[data-game-id="subhunt"] .card.subSummary .summaryCol{
  background:
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.012)),
    rgba(4,35,43,.42);
  border:1px solid color-mix(in srgb, var(--accent) 24%, rgba(255,255,255,.10));
  border-radius:16px;
  padding:12px 14px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 8px 20px rgba(0,0,0,.18);
}

body[data-game-id="subhunt"] .card.subSummary .summaryColTitle{
  color:#7ddcff !important;
  letter-spacing:.07em;
}

body[data-game-id="subhunt"] .card.subSummary .hint,
body[data-game-id="subhunt"] .card.subSummary ul.hint,
body[data-game-id="subhunt"] .card.subSummary li{
  color:#d9fff6 !important;
}

body[data-game-id="subhunt"] .card.subSummary ul.hint li{
  margin:6px 0;
}

body[data-game-id="subhunt"] .card.subSummary .aeaSummaryStack{
  gap:14px;
}

body[data-game-id="subhunt"] .card.subSummary .aeaSummaryStack > .box,
body[data-game-id="subhunt"] .card.subSummary .aeaSummaryStack > .card,
body[data-game-id="subhunt"] .card.subSummary .aeaMissReview,
body[data-game-id="subhunt"] .card.subSummary .aeaHighScoreBox{
  background:
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.014)),
    linear-gradient(135deg, rgba(16,185,129,.070), rgba(56,189,248,.050)),
    rgba(4,35,43,.52) !important;
  border:1px solid color-mix(in srgb, var(--accent) 30%, rgba(255,255,255,.10)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 10px 24px rgba(0,0,0,.18);
}

body[data-game-id="subhunt"] .card.subSummary .xpBar,
body[data-game-id="subhunt"] .card.subSummary .spBar{
  background: rgba(2,20,28,.74) !important;
  border-color: color-mix(in srgb, var(--accent2) 32%, rgba(255,255,255,.14)) !important;
  box-shadow:
    inset 0 2px 6px rgba(0,0,0,.42),
    0 0 18px rgba(56,189,248,.10) !important;
}

body[data-game-id="subhunt"] .card.subSummary .xpFill,
body[data-game-id="subhunt"] .card.subSummary .spFill{
  background: linear-gradient(90deg, #10b981, #38bdf8) !important;
  box-shadow:
    0 0 18px rgba(16,185,129,.22),
    0 0 12px rgba(56,189,248,.16) !important;
}

body[data-game-id="subhunt"] .card.subSummary .aeaActionZone{
  background:
    linear-gradient(180deg, rgba(255,255,255,.040), rgba(255,255,255,.012)),
    rgba(4,28,34,.64) !important;
  border:1px solid color-mix(in srgb, var(--accent) 26%, rgba(255,255,255,.10)) !important;
}

body[data-game-id="subhunt"] .card.subSummary .aeaActionZone button#primaryBtn{
  color:#082c31 !important;
  background:
    linear-gradient(180deg, rgba(129,244,255,.98), rgba(49,186,231,.98)) !important;
  border-color: rgba(189,248,255,.90) !important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

body[data-game-id="subhunt"] .card.subSummary .aeaActionZone button#secondaryBtn{
  color:#d9fff6 !important;
  background:
    linear-gradient(180deg, rgba(8,70,78,.92), rgba(4,40,50,.96)) !important;
  border-color: rgba(16,185,129,.30) !important;
}


/* A1d22: dialog action buttons, especially Search popup links, need true button layout. */
.btn,
a.btn,
button.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  text-decoration:none !important;
  line-height:1.15;
  white-space:nowrap;
}

a.btn:visited,
a.btn:hover,
a.btn:focus,
a.btn:active{
  text-decoration:none !important;
}

.dlgFoot{
  align-items:center;
  flex-wrap:wrap;
}

.dlgFoot .btn,
.dlgFoot button,
.dlgFoot a.btn{
  min-height:52px;
  padding:12px 22px;
}

#hintOpenGoLink,
#hintOpenCancelBtn{
  min-width:160px;
}

@media (max-width: 640px){
  .dlgFoot{
    justify-content:stretch;
  }
  .dlgFoot .btn,
  .dlgFoot button,
  .dlgFoot a.btn,
  #hintOpenGoLink,
  #hintOpenCancelBtn{
    width:100%;
    min-width:0;
  }
}


/* A2 project notice, intentionally quiet so it protects the package without shouting over gameplay. */
.arcadeCopyrightNote{
  margin-top:12px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
  background:rgba(255,255,255,.045);
}
.arcadeCopyrightNote strong{ color:var(--text); }
.linkButton{
  appearance:none;
  border:0;
  background:transparent;
  color:var(--accent);
  padding:0;
  margin:4px 0 0;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}
.linkButton:hover{ text-decoration:underline; }

/* Public-release visibility pass: make About & Feedback a real secondary action,
   not a tiny copyright-note link. */
.aboutFeedbackButton{
  display:flex;
  width:auto;
  margin:8px auto 0;
  padding:7px 12px !important;
  font-size:12px;
  line-height:1.2;
  font-weight:900;
  letter-spacing:.01em;
}
.aboutFrame{ min-height: min(72vh, 760px); }

/* A2 final balance pass: give the home game-banner menu a little more breathing room
   after adding the quiet About/Credits notice to the left Stats & Guide panel. */
body[data-app-view="home"] #homeChoices.homeGrid{
  gap:16px 14px !important;
  padding:4px 6px 8px !important;
  box-sizing:border-box;
}