/* Baseline Games Hub — G01 Indigo Circuit palette authority.
   This file changes colour only. Existing geometry, typography, spacing,
   component ownership and game mechanics remain authoritative elsewhere. */
html[data-app="games"],
body[data-app="games"]{
  --g01-deep:#080D22;
  --g01-mid:#1E2759;
  --g01-centre:#4656A6;
  --g01-active:#526BC2;
  --g01-focus:#8CA7FF;
  --g01-card:#1A244D;
  --g01-ink:#F2F5FF;
  --g01-muted:#D5DEF7;
  --g01-placeholder:#AFC0ED;
  --g01-mirror:linear-gradient(90deg,#080D22 0%,#1E2759 25%,#4656A6 50%,#1E2759 75%,#080D22 100%);
  /* The active centre is fractionally darker than the approved preview so
     normal-sized white labels remain above WCAG AA contrast. */
  --g01-mirror-active:linear-gradient(90deg,#0B1330 0%,#2A3672 25%,#5666BC 50%,#2A3672 75%,#0B1330 100%);

  /* Compatibility aliases used by the existing Hub and every embedded game. */
  --games-teal-deep:var(--g01-deep);
  --games-teal:var(--g01-mid);
  --games-teal-soft:var(--g01-centre);
  --games-orange-deep:#2A3672;
  --games-orange:var(--g01-active);
  --games-gold:var(--g01-focus);
  --games-ink:var(--g01-ink);
  --games-cream:var(--g01-ink);
  --games-muted:var(--g01-muted);
  --games-page-gradient:var(--g01-mirror);
  --games-key-gradient:var(--g01-mirror);
  --games-card-gradient:var(--g01-card);
  --games-panel-gradient:var(--g01-card);
  --games-page-deep:var(--g01-deep);
  --games-page-mid:var(--g01-mid);
  --games-page-soft:var(--g01-centre);
  --games-page-light:var(--g01-focus);
  --games-accent:var(--g01-focus);
  --games-card:var(--g01-card);
  --games-card-strong:var(--g01-card);
  --games-panel:var(--g01-card);
  --games-control:var(--g01-mirror);
  --games-control-active:var(--g01-active);
  --games-play-deep:var(--g01-deep);
  --games-surface-1:var(--g01-card);
  --games-surface-2:var(--g01-card);
  --games-surface-3:var(--g01-card);
  --games-surface-soft:rgba(82,107,194,.22);
  --games-border:rgba(140,167,255,.38);
  --games-border-strong:rgba(140,167,255,.72);

  --bg:var(--g01-deep);
  --bg-2:var(--g01-mid);
  --bg-3:#2A3672;
  --ink:var(--g01-ink);
  --muted:var(--g01-muted);
  --accent:var(--g01-focus);
  --accent-2:var(--g01-ink);
  --accent-3:var(--g01-active);
  --accent-4:var(--g01-focus);
  --accent-soft:rgba(140,167,255,.22);
  --border:var(--games-border);
  --border-2:var(--games-border-strong);
  --ring:var(--g01-focus);
  --shadow:0 22px 48px -30px rgba(2,5,17,.88);
  --shadow-soft:0 18px 38px -26px rgba(2,5,17,.78);
  --glow:0 24px 60px -42px rgba(140,167,255,.68);
  --glow-soft:0 0 0 3px rgba(140,167,255,.20);
  --tip-bg:rgba(8,13,34,.98);
  --tip-ink:var(--g01-ink);
  --tip-border:rgba(140,167,255,.62);
  --link:var(--g01-focus);
  --link-hover:var(--g01-ink);
  --scroll-track:var(--g01-deep);
  --scroll-thumb:var(--g01-active);
  --scroll-thumb-hover:var(--g01-focus);

  --header-gradient:var(--g01-mirror);
  --page-bg:var(--g01-mirror);
  --homebar-bg:var(--g01-mirror);
  --homebar-border:var(--g01-focus);
  --banner-pill-bg:var(--g01-mirror);
  --banner-pill-solid:var(--g01-mid);
  --banner-pill-ink:var(--g01-ink);
  --banner-pill-border:var(--g01-focus);
  --auth-flyout-bg:var(--g01-mirror);
  --card-bg:var(--g01-card);
  --filter-bg:var(--g01-card);
  --showall-bg:var(--g01-mirror);
  --showall-border:rgba(140,167,255,.62);

  --bl-flyout-bg-image:var(--g01-mirror);
  --bl-flyout-bg-color:var(--g01-mid);
  --bl-flyout-control-bg-image:var(--g01-mirror);
  --bl-flyout-control-bg-color:var(--g01-mid);
  --bl-flyout-field-bg:var(--g01-card);
  --bl-flyout-field-ink:var(--g01-ink);
  --bl-flyout-field-placeholder:var(--g01-placeholder);
  --bl-flyout-ink:var(--g01-ink);
  --bl-surface-card-solid:var(--g01-card);
  --bl-surface-recipe-card-solid:var(--g01-card);
  --bl-surface-panel-solid:var(--g01-card);
  --bl-surface-control-solid:var(--g01-mid);
  --bl-surface-input-solid:var(--g01-card);
  --bl-surface-active-solid:var(--g01-active);
  --bl-surface-ink:var(--g01-ink);
  --bl-slider-track-solid:var(--g01-active);
  --bl-slider-thumb-solid:var(--g01-focus);
  --bl-slider-border-solid:var(--g01-ink);
  --bl-dropdown-panel-solid:var(--g01-mid);
  --bl-dropdown-control-solid:var(--g01-mid);
  --bl-dropdown-active-solid:var(--g01-active);
  --bl-dropdown-ink:var(--g01-ink);

  color:var(--g01-ink)!important;
  background:var(--g01-mirror)!important;
  background-color:var(--g01-deep)!important;
  color-scheme:dark;
}

/* The page, banner and tab rail each receive the same true mirrored gradient. */
html[data-app="games"],
html[data-app="games"] body[data-app="games"],
html[data-app="games"] body[data-app="games"] .bl-scroll,
html[data-app="games"] body[data-app="games"] .bl-homebar,
html[data-app="games"] body[data-app="games"] .hero,
html[data-app="games"] body[data-app="games"] .tabs{
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  background-color:var(--g01-deep)!important;
  background-size:100% 100%!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"]::before,
html[data-app="games"] body[data-app="games"]::after{
  content:none!important;
  display:none!important;
}

/* Reading cards stay one flat colour. No per-card decorative gradients. */
html[data-app="games"] body[data-app="games"] :is(
  .card,.game-card,.game-shell,.game-panel,.game-row,.summary-box,.bank-box,
  .games-list-group,.game-summary-item,.game-stat-card,.trackcoin-stat-card,
  .progress-shell,.skill-item,.empty-box,.game-info-details,
  .game-summary-details,.game-summary-body,.formula-box,.word-box,.solution-box,
  .clue-bar,.upgrade-item,.bonus-item,
  .word-board-shell,.make24-board-shell,.pairs-board-shell,.rule-shift-shell,.track-coin-shell,
  .darts-focused-shell,.darts-game-card,.darts-tier-panel,.darts-category-card,
  .badminton-focused-panel .badminton-game-card,.badminton-tier-panel,
  .badminton-situation,.badminton-feedback,.badminton-progress-box,
  .realm-window,.realm-drawer,.realm-overlay-screen,.realm-hud-card,.realm-xp-shell,
  .realm-loading-card,.jrpg-map-card,.jrpg-side-hud>section,.jrpg-party-mini,
  .jrpg-enemy-card,.jrpg-battle-party-card,.jrpg-battle-console,.jrpg-modal,
  .jrpg-story-panel,.jrpg-manage-card,.jrpg-resource-ribbon span,.jrpg-stat-grid span,
  .jrpg-equipment-grid label,.jrpg-ability-chips span,.jrpg-inventory-summary span,
  .jrpg-inventory-columns section,.jrpg-inventory-discipline,.jrpg-settings-note,
  .basecamp-service>header,.basecamp-item-grid article,.basecamp-trade-list article
){
  background:var(--g01-card)!important;
  background-image:none!important;
  background-color:var(--g01-card)!important;
  border-color:var(--games-border)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .card,.game-card,.game-row,.summary-box,.games-list-group,.game-summary-item,
  .darts-focused-shell,.badminton-focused-panel,.jrpg-side-hud>section,
  .jrpg-modal,.basecamp-service
) :is(h1,h2,h3,h4,h5,h6,p,li,strong,label,span){
  color:inherit!important;
  -webkit-text-fill-color:currentColor!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .note,.inline-note,.game-row p,.game-row-meta,.game-summary-item p,
  .darts-muted,.badminton-focused-panel p
){
  color:var(--g01-muted)!important;
  -webkit-text-fill-color:var(--g01-muted)!important;
}

/* Every interface button is an individual mirrored-gradient control. */
html[data-app="games"] body[data-app="games"] :is(
  .tab,.mobile-game-key,.action,.compact-action,.secondary,.ghost,.auto-next-toggle,
  .game-row-info-button,.bl-info-button,.game-info-button,.tier-button,.tier-btn,
  .game-info-details summary,.game-summary-details summary,.stat-pill,.skill-alert,
  .darts-game-selector,.darts-tier-button,.darts-choice,.darts-routine-list button,
  .darts-category-card,.darts-selector-info,
  .badminton-game-selector,.badminton-tier-button,.badminton-choice,.badminton-zone-grid button,
  .badminton-selector-info,
  .realm-mini-action,.realm-close-btn,.realm-tab-btn,.realm-fab__icon,.realm-audio-controls button
),
html[data-app="games"] body[data-app="games"] #ninjaPanel .jrpg-game button,
html[data-app="games"] body[data-app="games"] #ninjaPanel .basecamp-service button,
html[data-app="games"] body[data-app="games"] #ninjaPanel #realmBasecampScreen .realm-location-button{
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  background-color:var(--g01-mid)!important;
  border-color:rgba(140,167,255,.62)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
  text-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .tab,.mobile-game-key,.action,.compact-action,.secondary,.ghost,.auto-next-toggle,
  .game-row-info-button,.bl-info-button,.game-info-button,.tier-button,.tier-btn,
  .game-info-details summary,.game-summary-details summary,.stat-pill,.skill-alert,
  .darts-game-selector,.darts-tier-button,.darts-choice,.darts-category-card,.darts-selector-info,
  .badminton-game-selector,.badminton-tier-button,.badminton-choice,.badminton-zone-grid button,
  .badminton-selector-info,
  .realm-mini-action,.realm-close-btn,.realm-tab-btn
):is(:hover,:active,[aria-pressed="true"],[aria-selected="true"],.is-active,.is-selected),
html[data-app="games"] body[data-app="games"] #ninjaPanel .jrpg-game button:is(:hover,:active,.is-active),
html[data-app="games"] body[data-app="games"] #ninjaPanel .basecamp-service button:is(:hover,:active,.is-selected),
html[data-app="games"] body[data-app="games"] #ninjaPanel #realmBasecampScreen .realm-location-button:is(:hover,:active){
  background:var(--g01-mirror-active)!important;
  background-image:var(--g01-mirror-active)!important;
  border-color:var(--g01-focus)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(button,input,select,textarea):disabled,
html[data-app="games"] body[data-app="games"] [aria-disabled="true"]{
  opacity:.58!important;
  filter:saturate(.55)!important;
  cursor:not-allowed!important;
}

/* Keyboard users receive a two-colour focus ring that remains visible against
   every point in the mirror gradient and the flat card surface. */
html[data-app="games"] body[data-app="games"] :is(button,a,input,select,textarea,[tabindex]):not(.bl-protected-access-overlay *):focus-visible{
  outline:3px solid var(--g01-ink)!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 6px var(--g01-focus)!important;
}

/* Inputs and compact status surfaces remain dark and readable. */
html[data-app="games"] body[data-app="games"] :is(
  input:not([type="range"]),select,textarea,.text-input,.game-input,.status,.badge,
  .pill,.chip,.game-save-status,.realm-save-status,.games-save-tooltip,[role="tooltip"]
):not(.bl-protected-access-overlay *){
  background:var(--g01-card)!important;
  background-image:none!important;
  background-color:var(--g01-card)!important;
  border-color:var(--games-border-strong)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
  caret-color:var(--g01-focus)!important;
}
html[data-app="games"] body[data-app="games"] :is(input,textarea):not(.bl-protected-access-overlay *)::placeholder{
  color:var(--g01-placeholder)!important;
  -webkit-text-fill-color:var(--g01-placeholder)!important;
  opacity:1!important;
}
html[data-app="games"] body[data-app="games"] :is(.error,.is-error,[data-state="error"]){
  background:#4C2540!important;
  background-image:none!important;
  border-color:#E49AB8!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(.loading,.empty,.empty-state,[data-state="loading"],[data-state="empty"]){
  background:var(--g01-card)!important;
  background-image:none!important;
  border-color:rgba(140,167,255,.46)!important;
  color:var(--g01-muted)!important;
}

/* Banner controls, page dropdown, Account, Voice and Binaural all use the
   mirrored gradient as complete, independent components. */
html[data-app="games"] body[data-app="games"] :is(
  .bl-pages-btn,.bl-protected-key,#bl-beats-toggle,#bl-voice-toggle,#bl-auth-toggle
){
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  background-color:var(--g01-mid)!important;
  border-color:var(--g01-focus)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .bl-pages-menu,.bl-pages-link,#bl-auth-flyout .card,#bl-beats-flyout .card,
  #bl-voice-flyout .card,.bl-flyout,#bl-auth-flyout button,#bl-beats-flyout button,
  #bl-voice-flyout button,.bl-flyout .bl-select-btn,.bl-flyout .bl-select-menu,
  .bl-flyout .bl-select-menu [role="option"]
){
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  background-color:var(--g01-mid)!important;
  background-size:100% 100%!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
  border-color:rgba(140,167,255,.62)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  #bl-auth-flyout .bl-auth-input-shell,#bl-auth-flyout input,
  #bl-beats-flyout input:not([type="range"]),#bl-beats-flyout select,
  #bl-voice-flyout input:not([type="range"])
){
  background:var(--g01-card)!important;
  background-image:none!important;
  background-color:var(--g01-card)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(.bl-btn-icon,.bl-btn-label,#blProtectedKey svg){
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
  stroke:currentColor!important;
}
html[data-app="games"] body[data-app="games"] #bl-auth-flyout input:-webkit-autofill,
html[data-app="games"] body[data-app="games"] #bl-auth-flyout input:-webkit-autofill:hover,
html[data-app="games"] body[data-app="games"] #bl-auth-flyout input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--g01-ink)!important;
  box-shadow:0 0 0 1000px var(--g01-card) inset!important;
  -webkit-box-shadow:0 0 0 1000px var(--g01-card) inset!important;
}

/* Games overview: one flat card colour, G01 artwork, gradient metadata pills. */
html[data-app="games"] body[data-app="games"] #gamesList .game-row{
  background:var(--g01-card)!important;
  background-image:none!important;
  background-color:var(--g01-card)!important;
  border-color:rgba(140,167,255,.42)!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] #gamesList .game-row-meta :is(strong,.inline-note){
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  background-color:var(--g01-mid)!important;
  border-color:rgba(140,167,255,.46)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] #gamesList .game-card-art{
  background:var(--g01-card)!important;
  background-image:none!important;
  border-color:rgba(140,167,255,.52)!important;
}

/* Modal chrome follows G01; game worlds and semantic gameplay feedback keep
   their functional artwork and status colours. */
html[data-app="games"] body[data-app="games"] :is(
  .modal-overlay,.game-modal-overlay,.popover-overlay,.dialog-overlay,.realm-loading-screen
){
  background:rgba(4,7,22,.88)!important;
  background-image:none!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .modal,.game-modal,.popover,[role="dialog"]
):not(.bl-protected-access-dialog){
  background:var(--g01-card)!important;
  background-image:none!important;
  border-color:var(--g01-focus)!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .darts-memory-veil,.darts-memory-arena,.darts-pressure-track span,
  .darts-routine-list li,.badminton-freeze-scene,.badminton-contact-panel,
  .badminton-contact-light,.badminton-pattern-strip,.badminton-pressure-track span,
  .badminton-xp-block,.badminton-roadmap span,.badminton-scene-caption,
  .badminton-tactical-scene
){
  background:var(--g01-card)!important;
  background-image:none!important;
  border-color:var(--games-border)!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(#dartsGameCard,#badmintonGameCard):fullscreen{
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
}

/* G01 completion authority.
   The Hub's canonical and independently-loaded game styles pre-date G01.
   These selectors cover their remaining UI surfaces without changing layout,
   typography, game logic, or realistic/semantic artwork. */

/* Information bars, progress summaries and idle/status panels are interface
   cards. Their bodies are flat; their clickable summary rows are controls. */
html[data-app="games"] body[data-app="games"] :is(
  .progress-shell,.round-status-card,.empty-box,.skill-item,
  .game-info-details,.game-summary-details,.game-summary-body,
  .formula-box,.word-box,.solution-box,.clue-bar,.upgrade-item,.bonus-item
){
  background:var(--g01-card)!important;
  background-image:none!important;
  background-color:var(--g01-card)!important;
  border-color:var(--games-border)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:currentColor!important;
  box-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .game-info-details summary,.game-summary-details summary,.stat-pill,.skill-alert
){
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  background-color:var(--g01-mid)!important;
  border-color:rgba(140,167,255,.62)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
  text-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .game-info-details summary,.game-summary-details summary,.stat-pill,.skill-alert
):is(:hover,:focus-visible,[aria-expanded="true"],.is-active,.is-ready){
  background:var(--g01-mirror-active)!important;
  background-image:var(--g01-mirror-active)!important;
  border-color:var(--g01-focus)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .game-info-details,.game-summary-details
)[open] summary{
  border-bottom-color:rgba(140,167,255,.46)!important;
}

/* Experience and neutral progress indicators use the same cool palette. */
html[data-app="games"] body[data-app="games"] :is(.xp-bar,.meter,.darts-pressure-bar,.badminton-timer-bar){
  background:var(--g01-deep)!important;
  background-image:none!important;
  border-color:rgba(140,167,255,.42)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .xp-fill,.meter-fill,.darts-pressure-bar>span,.badminton-timer-bar>span
){
  background:linear-gradient(90deg,#526BC2 0%,#8CA7FF 50%,#526BC2 100%)!important;
  background-image:linear-gradient(90deg,#526BC2 0%,#8CA7FF 50%,#526BC2 100%)!important;
}
html[data-app="games"] body[data-app="games"] progress{accent-color:var(--g01-focus)!important}

/* Darts: instructional and calculation chrome is G01. The realistic board's
   red/green scoring segments remain sport-owned content. */
html[data-app="games"] body[data-app="games"] :is(
  .darts-scenario-header,.darts-situation-card,.darts-scenario-facts span,
  .darts-coaching-note,.darts-calculation-note,.darts-visual-intro,
  .darts-stage-copy,.darts-memory-veil,.darts-memory-arena,
  .darts-routine-list li,.darts-sequence-readout,.darts-series-progress,
  .darts-fact-list label,.darts-confidence-control,.darts-calibration-result,
  .darts-comparison div,.darts-xp-block,.darts-tier-panel
){
  background:var(--g01-card)!important;
  background-image:none!important;
  background-color:var(--g01-card)!important;
  border-color:var(--games-border)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:currentColor!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .darts-choice,.darts-game-selector,.darts-tier-button,.darts-category-card,
  .darts-routine-list button,.darts-selector-info
){
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  background-color:var(--g01-mid)!important;
  border-color:rgba(140,167,255,.62)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .darts-choice,.darts-game-selector,.darts-tier-button,.darts-category-card,
  .darts-routine-list button,.darts-selector-info
):is(:hover,:focus-visible,.is-selected,.is-active,[aria-expanded="true"]){
  background:var(--g01-mirror-active)!important;
  background-image:var(--g01-mirror-active)!important;
  border-color:var(--g01-focus)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .darts-board-frame,.darts-visual-intro__art,.darts-visual-intro__art--memory
){
  background:radial-gradient(circle at 50% 45%,rgba(140,167,255,.32),#1A244D 66%,#080D22 100%)!important;
  background-image:radial-gradient(circle at 50% 45%,rgba(140,167,255,.32),#1A244D 66%,#080D22 100%)!important;
  border-color:rgba(140,167,255,.46)!important;
}
html[data-app="games"] body[data-app="games"] .darts-memory-veil::after{
  background:linear-gradient(90deg,transparent 0%,rgba(82,107,194,.34) 50%,rgba(8,13,34,.30) 100%)!important;
}
html[data-app="games"] body[data-app="games"] .darts-category-icon,
html[data-app="games"] body[data-app="games"] .darts-game-selector::before{
  background:var(--g01-active)!important;
  background-color:var(--g01-active)!important;
  border-color:var(--g01-focus)!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] .darts-simulated-mark{
  fill:var(--g01-focus)!important;
  stroke:var(--g01-deep)!important;
}
html[data-app="games"] body[data-app="games"] .darts-board-zone.is-highlight{
  filter:brightness(1.55) drop-shadow(0 0 9px #8CA7FF)!important;
  stroke:#F2F5FF!important;
}
html[data-app="games"] body[data-app="games"] .darts-sequence-dots>span{
  background:var(--g01-card)!important;
  background-image:none!important;
  border-color:var(--games-border)!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] .darts-sequence-dots>span.is-current{
  background:var(--g01-active)!important;
  border-color:var(--g01-focus)!important;
}

/* Badminton: menus, coaching panels and scene backplates use G01. Court,
   player and shuttle illustrations keep their functional visual meaning. */
html[data-app="games"] body[data-app="games"] :is(
  .badminton-situation,.badminton-progress-box,.badminton-tier-panel,
  .badminton-pattern-strip,.badminton-xp-block,.badminton-roadmap span,
  .badminton-scene-caption
){
  background:var(--g01-card)!important;
  background-image:none!important;
  background-color:var(--g01-card)!important;
  border-color:var(--games-border)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:currentColor!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .badminton-choice,.badminton-game-selector,.badminton-tier-button,
  .badminton-zone-grid button,.badminton-selector-info
){
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  background-color:var(--g01-mid)!important;
  border-color:rgba(140,167,255,.62)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .badminton-choice,.badminton-game-selector,.badminton-tier-button,
  .badminton-zone-grid button,.badminton-selector-info
):is(:hover,:focus-visible,.is-selected,.is-active,[aria-expanded="true"]){
  background:var(--g01-mirror-active)!important;
  background-image:var(--g01-mirror-active)!important;
  border-color:var(--g01-focus)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .badminton-court-shell,.badminton-freeze-scene,.badminton-contact-panel,
  .badminton-tactical-scene
){
  background:radial-gradient(circle at 50% 42%,rgba(140,167,255,.30),#1A244D 68%,#080D22 100%)!important;
  background-image:radial-gradient(circle at 50% 42%,rgba(140,167,255,.30),#1A244D 68%,#080D22 100%)!important;
  border-color:rgba(140,167,255,.46)!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .badminton-pattern-strip span,.badminton-scene-caption span,.badminton-contact-light
){
  background:var(--g01-active)!important;
  background-image:none!important;
  border-color:var(--g01-focus)!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] .badminton-contact-light.is-contact{
  background:var(--g01-focus)!important;
  color:var(--g01-deep)!important;
  box-shadow:0 0 0 11px rgba(140,167,255,.22)!important;
}
html[data-app="games"] body[data-app="games"] .badminton-court-zone.is-highlight{
  fill:var(--g01-focus)!important;
  filter:drop-shadow(0 0 9px rgba(140,167,255,.88))!important;
}
html[data-app="games"] body[data-app="games"] .badminton-distractor{
  background:rgba(140,167,255,.34)!important;
  border-color:var(--g01-focus)!important;
}

/* The site's cards are flat reading surfaces. Remove the inherited glossy
   pseudo-layer, offset shadow and hover lift that made Games cards appear to
   have a second coloured card behind them. */
html[data-app="games"] body[data-app="games"] :is(
  .card,.game-card,.game-row,.game-panel,.summary-box,.round-status-card,
  .empty-box,.skill-item,.trackcoin-stat-card,.game-summary-details,
  .game-summary-body,.progress-shell,.darts-game-card,.darts-tier-panel,
  .badminton-game-card,.badminton-tier-panel
){
  box-shadow:none!important;
  filter:none!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .card,.game-card,.game-row,.game-panel,.summary-box,.round-status-card,
  .empty-box,.skill-item,.trackcoin-stat-card,.game-summary-details,
  .progress-shell,.darts-game-card,.darts-tier-panel,
  .badminton-game-card,.badminton-tier-panel
)::before,
html[data-app="games"] body[data-app="games"] :is(
  .card,.game-card,.game-row,.game-panel,.summary-box,.round-status-card,
  .empty-box,.skill-item,.trackcoin-stat-card,.game-summary-details,
  .progress-shell,.darts-game-card,.darts-tier-panel,
  .badminton-game-card,.badminton-tier-panel
)::after{
  content:none!important;
  display:none!important;
  box-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] #gamesList .game-row:is(:hover,:focus-visible,.is-selected){
  transform:none!important;
  box-shadow:none!important;
  filter:none!important;
}
html[data-app="games"] body[data-app="games"] :is(
  .tab,.action,.compact-action,.secondary,.ghost,.game-toggle-btn,
  .mobile-game-key,.game-row-info-button,.game-info-button,.bl-info-button,
  .tier-btn,.darts-choice,.darts-tier-button,.darts-game-selector,
  .badminton-choice,.badminton-tier-button,.badminton-game-selector
){box-shadow:none!important}

/* Pairs must never dim the content merely because a resolved card is disabled.
   Both card faces and their symbols are fully opaque, unfiltered and use a
   high-contrast G01 foreground in every interaction state. */
html[data-app="games"] body[data-app="games"] .memory-card,
html[data-app="games"] body[data-app="games"] .memory-card[disabled]{
  background:var(--g01-deep)!important;
  background-image:none!important;
  border-color:var(--g01-focus)!important;
  color:var(--g01-ink)!important;
  opacity:1!important;
  filter:none!important;
  box-shadow:none!important;
  mix-blend-mode:normal!important;
}
html[data-app="games"] body[data-app="games"] .memory-card-face,
html[data-app="games"] body[data-app="games"] .memory-card-face *{
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
  filter:none!important;
  visibility:visible!important;
  mix-blend-mode:normal!important;
  text-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] .memory-card-back{
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  opacity:1!important;
}
html[data-app="games"] body[data-app="games"] .memory-card-front{
  background:var(--g01-card)!important;
  background-image:none!important;
  opacity:0!important;
}
html[data-app="games"] body[data-app="games"] .memory-card:is(.is-open,.is-matched) .memory-card-back{
  opacity:0!important;
}
html[data-app="games"] body[data-app="games"] .memory-card:is(.is-open,.is-matched) .memory-card-front{
  opacity:1!important;
  transform:scale(1)!important;
}
html[data-app="games"] body[data-app="games"] .memory-card.is-matched{
  outline:3px solid var(--g01-focus)!important;
  outline-offset:2px!important;
}

/* Core game boards use G01 chrome too. Gameplay states and Rule Shift's named
   colour discrimination remain semantic content, but their enclosing panels,
   timers, controls and neutral pieces no longer expose the retired palette. */
html[data-app="games"] body[data-app="games"] :is(
  .trackcoin-scene,.trackcoin-game-status,.trackcoin-idle-cue,.trackcoin-idle-card,
  .trackcoin-status,.trackcoin-lane,.ruleshift-idle-card,.ruleshift-complete-card,
  .ruleshift-rule-card,.ruleshift-choice-card,.mobile-game-keypad,
  .mobile-word-keypad,.mobile-make24-keypad
){
  background:var(--g01-card)!important;
  background-image:none!important;
  background-color:var(--g01-card)!important;
  border-color:var(--games-border)!important;
  color:var(--g01-ink)!important;
  box-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] .trackcoin-lane{
  background:radial-gradient(circle at 50% 42%,rgba(140,167,255,.28),#1A244D 62%,#080D22 100%)!important;
  background-image:radial-gradient(circle at 50% 42%,rgba(140,167,255,.28),#1A244D 62%,#080D22 100%)!important;
}
html[data-app="games"] body[data-app="games"] .trackcoin-cup{
  background:linear-gradient(180deg,#4656A6 0%,#1E2759 55%,#080D22 100%)!important;
  background-image:linear-gradient(180deg,#4656A6 0%,#1E2759 55%,#080D22 100%)!important;
  border-color:var(--g01-focus)!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] .trackcoin-cup::before{
  background:linear-gradient(180deg,#526BC2 0%,#1E2759 100%)!important;
  background-image:linear-gradient(180deg,#526BC2 0%,#1E2759 100%)!important;
  border-color:var(--g01-focus)!important;
}
html[data-app="games"] body[data-app="games"] .trackcoin-item-token{
  background:radial-gradient(circle at 35% 28%,#F2F5FF 0%,#8CA7FF 36%,#526BC2 68%,#1E2759 100%)!important;
  background-image:radial-gradient(circle at 35% 28%,#F2F5FF 0%,#8CA7FF 36%,#526BC2 68%,#1E2759 100%)!important;
  border-color:var(--g01-ink)!important;
  box-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] :is(.number-chip,.ruleshift-token){
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  border-color:var(--g01-focus)!important;
  color:var(--g01-ink)!important;
  box-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] .ruleshift-timer-bar{
  background:var(--g01-deep)!important;
  background-image:none!important;
  border-color:var(--games-border)!important;
}
html[data-app="games"] body[data-app="games"] .ruleshift-timer-fill{
  background:linear-gradient(90deg,#526BC2 0%,#8CA7FF 50%,#526BC2 100%)!important;
  background-image:linear-gradient(90deg,#526BC2 0%,#8CA7FF 50%,#526BC2 100%)!important;
}

/* Correct/incorrect feedback remains semantic, but uses cool accessible tones
   instead of the retired warm Games palette. */
html[data-app="games"] body[data-app="games"] :is(.darts-feedback,.badminton-feedback).is-correct{
  background:#173E39!important;
  background-image:none!important;
  border-color:#72C7AF!important;
  color:var(--g01-ink)!important;
}
html[data-app="games"] body[data-app="games"] :is(.darts-feedback,.badminton-feedback).is-wrong{
  background:#4C2540!important;
  background-image:none!important;
  border-color:#E49AB8!important;
  color:var(--g01-ink)!important;
}

/* Force both the page scroller and independently scrolling game lists to use
   Indigo Circuit instead of the legacy orange thumb. */
html[data-app="games"],
html[data-app="games"] body[data-app="games"],
html[data-app="games"] body[data-app="games"] :is(
  .bl-scroll,.darts-game-selectors,.badminton-game-selectors,
  #ninjaPanel .realm-drawer-pane:not([hidden])
){
  scrollbar-color:var(--g01-active) var(--g01-deep)!important;
}
html[data-app="games"] body[data-app="games"] ::-webkit-scrollbar-track{
  background:var(--g01-deep)!important;
}
html[data-app="games"] body[data-app="games"] ::-webkit-scrollbar-thumb{
  background:var(--g01-active)!important;
  border-color:var(--g01-deep)!important;
}
html[data-app="games"] body[data-app="games"] ::-webkit-scrollbar-thumb:hover{
  background:var(--g01-focus)!important;
}
html[data-app="games"] body[data-app="games"] #ninjaPanel .realm-drawer-pane:not([hidden])::-webkit-scrollbar-track{
  background:var(--g01-deep)!important;
}
html[data-app="games"] body[data-app="games"] #ninjaPanel .realm-drawer-pane:not([hidden])::-webkit-scrollbar-thumb{
  background:var(--g01-active)!important;
  border-color:var(--g01-deep)!important;
}

@media (max-width:520px){
  html[data-app="games"] body[data-app="games"] :is(
    .card,.game-card,.game-row,.summary-box
  ){border-radius:16px!important}
  html[data-app="games"] body[data-app="games"] .game-row{
    min-width:0!important;
    overflow-wrap:anywhere!important;
  }
  html[data-app="games"] body[data-app="games"] :is(
    .game-row-info-button,.bl-info-button,.game-info-button
  ){
    min-width:44px!important;
    width:44px!important;
    min-height:44px!important;
    height:44px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  html[data-app="games"] body[data-app="games"] *,
  html[data-app="games"] body[data-app="games"] *::before,
  html[data-app="games"] body[data-app="games"] *::after{
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
}

/* Detect The Word belongs to Indigo Circuit too. Blank tiles and the feedback
   key must not inherit the retired cream/orange Games palette. Semantic states
   remain distinct through cool green, circuit blue and deep indigo. */
html[data-app="games"] body[data-app="games"] .letter-cell{
  background:var(--g01-card)!important;
  background-image:none!important;
  border-color:rgba(140,167,255,.48)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
  box-shadow:none!important;
}
html[data-app="games"] body[data-app="games"] :is(.letter-cell.correct,.word-feedback-dot--correct){
  background:#2F665D!important;
  background-image:none!important;
  border-color:#72C7AF!important;
  color:#F2F5FF!important;
  -webkit-text-fill-color:#F2F5FF!important;
}
html[data-app="games"] body[data-app="games"] :is(.letter-cell.present,.word-feedback-dot--present){
  background:#526BC2!important;
  background-image:none!important;
  border-color:#A9BCFF!important;
  color:#F2F5FF!important;
  -webkit-text-fill-color:#F2F5FF!important;
}
html[data-app="games"] body[data-app="games"] :is(.letter-cell.absent,.word-feedback-dot--absent){
  background:#1E2759!important;
  background-image:none!important;
  border-color:#657BD0!important;
  color:#DCE4FF!important;
  -webkit-text-fill-color:#DCE4FF!important;
}
html[data-app="games"] body[data-app="games"] .word-feedback-legend span{
  background:var(--g01-mirror)!important;
  background-image:var(--g01-mirror)!important;
  border-color:rgba(140,167,255,.62)!important;
  color:var(--g01-ink)!important;
  -webkit-text-fill-color:var(--g01-ink)!important;
  box-shadow:none!important;
}