/* ── THE REFINED CASTLE PALETTE (owner 2026-10-15, from a designer's review of the colours) ──────────────────────────
   On top of the castle theme, only while <html data-palette="refined"> (index.html; ?palette=old shows the castle
   colours of before for a comparison, remembered in localStorage gz-palette; ?palette=refined comes back):
   1. Gold only for the main action of each screen: chosen tabs / options / pills are a raised stone block with a gold
      OUTLINE and cream words; progress bars are cream; the game tiles' hover ring is cream; the help button is stone.
      (On / off switches and check boxes keep their gold "on".)
   2. The neon wins green (--success, --bet) is an emerald.
   3. Team red is a deep crimson, errors a coral red (always with words), "waiting" orange instead of amber.
   4. The blue team is brighter.
   5. The four background shades are further apart (page 1 : panel 1.21 : card 1.50 : raised 1.99) and the faintest grey
      reads at 5.0 : 1 on a card (it was 3.95).
   Contrast figures: ../banner-work/palette-2026-10-15/README.txt. Undo: ../removed-features-backup/palette-2026-10-15/README.txt */

html[data-site-theme="castle"][data-palette="refined"] {
  /* 5. backgrounds, borders, greys */
  --bg-sidebar: #0b1222;
  --bg-sidebar-rgb: 11, 18, 34;
  --bg-primary: #121c34;
  --bg-primary-rgb: 18, 28, 52;
  --bg-input: #0c1427;
  --bg-secondary: #1d2b4a;
  --bg-secondary-rgb: 29, 43, 74;
  --bg-card: #283a60;
  --bg-card-rgb: 40, 58, 96;
  --bg-elevated: #364c7a;
  --bg-elevated-rgb: 54, 76, 122;
  --bg-elevated-hover: #41598c;
  --bg-popup: #182540;
  --bg-popup-rgb: 24, 37, 64;
  --bg-chip: #22324f;
  --bg-chip-rgb: 34, 50, 79;
  --bg-chip-hover: #2c3f63;
  --border-color: #34476e;
  --border-strong: #4f6797;
  --text-muted: #bcc6d9;
  --text-muted-2: #bcc6d9;
  --text-dim: #a3adc4;
  --text-disabled: rgba(188, 198, 217, 0.45);
  /* 1. cream for chosen words and progress */
  --castle-cream: #f4e7c5;
  --castle-cream-dark: #cbb98f;
  --progress: var(--castle-cream);
  --progress-dark: var(--castle-cream-dark);
  --ring-tile-hover: 0 0 0 2px rgba(244, 231, 197, 0.55);
  --glow-tile-hover: 0 0 16px rgba(244, 231, 197, 0.14);
  --ring-tile-inset: inset 0 0 0 2px rgba(244, 231, 197, 0.85);
  /* 2. emerald instead of the neon green */
  --success: #45d68f;
  --success-rgb: 69, 214, 143;
  --success-shade: #2fb877;
  --bet: #2bbd7e;
  --bet-rgb: 43, 189, 126;
  --bet-hover: #3bd08f;
  --bet-text: #04150d;
  /* 3. crimson team, coral errors, orange waiting; 4. a brighter blue team */
  --team-red: #b42041;
  --team-red-rgb: 180, 32, 65;
  --team-red-light: #ff7d9b;
  --team-blue: #3a8bff;
  --team-blue-rgb: 58, 139, 255;
  --team-blue-light: #8cc6ff;
  --danger: #ff8466;
  --danger-rgb: 255, 132, 102;
  --warning: #ff9636;
  --warning-rgb: 255, 150, 54;
  --warning-text: #ffb877;
}

/* 1. a chosen tab, option or pill: raised stone, a gold outline, cream words (gold stays for the main action) */
html[data-site-theme="castle"][data-palette="refined"] :is(
  .category-tabs__pill,
  .blog-cat-btn.active, .search-modal-tab.active, .search-modal-search-row .catnav-dd-btn.is-filtered, .ogi-m-tab.active,
  .pfp-pill.is-active, .vfc-game.is-active, .slots-provider-btn-mobile.active, .wr-tab--active:not(.rwh__login),
  .acc-choice:is(.active, [aria-pressed="true"], [aria-checked="true"]), .acc-phone-dropdown-item.active,
  .ls-bar-btn:is(.is-active, [aria-pressed="true"]), .mn-mine-btn.active, .og-chip.og-chip:is(.is-active, [aria-pressed="true"]),
  .limbo-input-btn[aria-pressed="true"], .sg-narrow-btn.active, .cashier-overlay .wlt-coin--tile.is-on,
  .wlt-coin-list .wlt-coin.is-on:not(.wlt-coin--tile), .ppe-current__tile, .wlt-tab[aria-selected="true"]
) {
  background: var(--bg-elevated);
  border-color: transparent;
  color: var(--castle-cream);
  box-shadow:
    inset 0 0 0 2px var(--accent),
    inset 0 4px 0 rgba(255, 255, 255, 0.12),
    inset 0 -4px 0 rgba(0, 0, 0, 0.25);
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
}
@media (hover: hover) {
  html[data-site-theme="castle"][data-palette="refined"] :is(
    .blog-cat-btn.active, .search-modal-tab.active, .search-modal-search-row .catnav-dd-btn.is-filtered, .pfp-pill.is-active,
    .vfc-game.is-active, .slots-provider-btn-mobile.active, .wr-tab--active:not(.rwh__login),
    .acc-choice:is(.active, [aria-pressed="true"], [aria-checked="true"]), .acc-phone-dropdown-item.active,
    .ls-bar-btn:is(.is-active, [aria-pressed="true"]), .mn-mine-btn.active, .og-chip.og-chip:is(.is-active, [aria-pressed="true"]),
    .limbo-input-btn[aria-pressed="true"], .sg-narrow-btn.active, .cashier-overlay .wlt-coin--tile.is-on,
    .wlt-coin-list .wlt-coin.is-on:not(.wlt-coin--tile), .wlt-tab[aria-selected="true"]
  ):hover {
    background: var(--bg-elevated-hover);
    color: var(--castle-cream);
  }
}
/* the lobby tab bar: the sliding pill above is the chosen block; its tab's icon and name in cream */
html[data-site-theme="castle"][data-palette="refined"] .category-tabs > .lobby-tab.active {
  color: var(--castle-cream);
  text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
}
html[data-site-theme="castle"][data-palette="refined"] .category-tabs .category-tabs__pill {
  box-shadow:
    inset 0 0 0 2px var(--accent),
    inset 0 4px 0 rgba(255, 255, 255, 0.12),
    inset 0 -4px 0 rgba(0, 0, 0, 0.25),
    2px 2px 0 rgba(0, 0, 0, 0.35);
}
/* icons that were darkened for the gold fill get their own colour back */
html[data-site-theme="castle"][data-palette="refined"] :is(.pfp-pill.is-active, .slots-provider-btn-mobile.active, .wlt-coin.is-on) img {
  filter: none;
  opacity: 1;
}

/* 1. progress bars in cream */
html[data-site-theme="castle"][data-palette="refined"] .acc-progress__fill,
html[data-site-theme="castle"][data-palette="refined"] .wrw-friends__bar > span.is-on {
  background: var(--castle-cream);
}
html[data-site-theme="castle"][data-palette="refined"] :is(.rwp-bar__fill, .rwp-plate--max .rwp-bar__fill) {
  background: linear-gradient(90deg, var(--castle-cream-dark), var(--castle-cream));
}

/* 1. the help button: a stone block with a cream icon (gold is for the page's own main action) */
html[data-site-theme="castle"][data-palette="refined"] .lc-fab {
  background: var(--bg-elevated);
  color: var(--castle-cream);
  box-shadow: inset 0 0 0 2px var(--castle-ink), inset 0 3px 0 rgba(255, 255, 255, 0.12), 3px 3px 0 rgba(0, 0, 0, 0.42);
}
@media (hover: hover) {
  html[data-site-theme="castle"][data-palette="refined"] .lc-fab:hover { background: var(--bg-elevated-hover); }
}
html[data-site-theme="castle"][data-palette="refined"] .lc-fab :is(svg, img) { filter: none; color: var(--castle-cream); }