/* =============================================================
   gen.css — "SALOON FLOOR" skin
   32-bit/128-bit hybrid: Genesis plate bevels, Saturn flat shading,
   PS2 directional grade. Warm casino palette, no cold blues.
   Loaded after ps2.css — it repaints every surface.
   ============================================================= */

html.av2 {
  --g-wine: #4b1120;
  --g-wine2: #380c18;
  --g-wine3: #5d1a29;
  --g-wood: #2b1a10;
  --g-wood2: #3f2717;
  --g-wood3: #57351f;
  --g-forest: #142c1e;
  --g-forest2: #1f3c29;
  --g-forest3: #2c5340;
  --g-gold: #d8a63f;
  --g-gold2: #f2d489;
  --g-gold3: #8d6120;
  --g-cream: #f4e7c8;
  --g-cream2: #d9c49b;
  --g-cream3: #bfa87f;
  --g-clay: #a8452a;
  --g-ink: #180d08;
  --g-ink2: #2a1a11;

  --g-display: "Arial Black", "Segoe UI Black", "Impact", "Haettenschweiler", "Trebuchet MS", sans-serif;
  --g-body: "Verdana", "Tahoma", "Geneva", "Segoe UI", sans-serif;
  --g-mono: "Lucida Console", "Courier New", monospace;

  --p-void: #180d08;
  --p-sky: #2b1a10;
  --p-fog: #3f2717;
  --p-panel: #2b1a10;
  --p-panel2: #3f2717;
  --p-panel3: #57351f;
  --p-line: #6b4526;
  --p-line2: #8d6120;
  --p-bone: #f4e7c8;
  --p-bone2: #d9c49b;
  --p-dim: #a89070;
  --p-rust: #c8703a;
  --p-rust2: #a8452a;
  --p-gold: #d8a63f;
  --p-teal: #2c5340;
  --p-blood: #8c2b26;
  --p-sage: #4c7a3f;

  --ink: #f4e7c8;
  --dim: #bda882;
  --line: #6b4526;
  --panel: #2b1a10;
  --panel2: #3f2717;
  --silver: #2b1a10;
  --gold: #d8a63f;
  --green: #4c7a3f;
  --red: #8c2b26;
  --violet: #7a5a6a;
  --shadow: 0 4px 0 #180d08, 0 10px 22px rgba(0, 0, 0, .5);
}

/* ---------- 0. foundation: retire the old layers ---------- */

html.av2 #stars,
html.av2 #glow,
html.av2 #aurora,
html.av2 #magicbg,
html.av2 .v15-coins,
html.av2 .v15-aura,
html.av2 .v15-coin,
html.av2 .v15-horizon,
html.av2 .v15-sun,
html.av2 .v15-floor,
html.av2 #rail,
html.av2 .aside {
  display: none !important;
  animation: none !important;
}
html.av2 #wintabs .wt-scroll {
  display: flex !important;
  gap: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
html.av2 #wintabs .wt-scroll::-webkit-scrollbar { display: none; }
html.av2 .view.on { display: block !important; }

/* ---------- 1. environment: warm wood, faceted floor, filament light ---------- */

html.av2 body {
  background: #180d08 !important;
  color: var(--g-cream) !important;
  font-family: var(--g-body) !important;
  font-weight: 700;
  letter-spacing: .02em;
}

html.av2 body::before {
  background:
    radial-gradient(90% 52% at 50% -6%, rgba(216, 166, 63, .2) 0%, rgba(120, 74, 30, .1) 40%, transparent 72%),
    linear-gradient(180deg, #22120b 0%, #2b1810 34%, #241309 62%, #160c07 100%) !important;
}
html.av2 body::after {
  height: 44% !important;
  background-image:
    repeating-linear-gradient(90deg, rgba(216, 166, 63, .1) 0 2px, transparent 2px 58px),
    repeating-linear-gradient(0deg, rgba(216, 166, 63, .07) 0 2px, transparent 2px 58px),
    linear-gradient(0deg, rgba(24, 13, 8, .96), rgba(24, 13, 8, 0)) !important;
}

html.av2 #p-grain { opacity: .1 !important; mix-blend-mode: soft-light !important; }
html.av2 #p-vig {
  background:
    radial-gradient(112% 88% at 50% 40%, transparent 44%, rgba(20, 10, 6, .62) 100%) !important;
}

/* ---------- 2. frame: dark wood plinth with gold pinstripe ---------- */

html.av2 #win { max-width: 660px !important; padding: 8px 8px 0 !important; }
@media (min-width: 780px) {
  html.av2 #win { max-width: 1040px !important; padding: 16px 16px 0 !important; }
}

html.av2 #chrome {
  border: 3px solid #6b4526 !important;
  border-radius: 0 !important;
  background: #23140c !important;
  box-shadow:
    inset 0 0 0 2px #180d08,
    inset 0 0 0 4px rgba(216, 166, 63, .5),
    0 0 0 2px #0d0603,
    0 26px 60px rgba(0, 0, 0, .8) !important;
}

/* ---------- 3. title strip ---------- */

html.av2 #titlebar {
  padding: 5px 9px !important;
  gap: 9px !important;
  background:
    linear-gradient(180deg, #6b4526 0%, #4a2d19 46%, #331c0f 100%) !important;
  border-bottom: 2px solid #180d08 !important;
  color: var(--g-cream) !important;
  font-family: var(--g-body) !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 #titlebar::after {
  height: 3px !important;
  background:
    repeating-linear-gradient(90deg, var(--g-gold) 0 8px, #8d6120 8px 16px) !important;
  opacity: .85;
}
html.av2 #chrome { position: relative !important; }
html.av2 #titlebar .ticon {
  width: 14px !important;
  height: 14px !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #f2d489 0%, #d8a63f 50%, #8d6120 100%) !important;
  border: 2px solid #180d08 !important;
  box-shadow: inset 0 1px 0 rgba(255, 250, 230, .8) !important;
  animation: none !important;
}
html.av2 #titlebar .ttitle {
  font-family: var(--g-body) !important;
  font-size: 9px !important;
  font-weight: 900 !important;
  letter-spacing: .3em !important;
  color: #f4e7c8 !important;
  text-transform: uppercase;
}
html.av2 #titlebar .tbtns { gap: 5px !important; }
html.av2 #titlebar .tbtns b,
html.av2 #theme-toggle {
  width: 18px !important;
  height: 16px !important;
  font: 900 9px/1 var(--g-body) !important;
  color: #f4e7c8 !important;
  background: linear-gradient(180deg, #7d5230 0%, #4a2d19 52%, #2b1a10 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 240, 200, .3) !important;
  text-shadow: 1px 1px 0 #180d08 !important;
  cursor: pointer;
}
html.av2 #titlebar .tbtns b:active,
html.av2 #theme-toggle:active {
  transform: translateY(1px) !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, .6) !important;
}
html.av2 #titlebar .tbtns b.x {
  background: linear-gradient(180deg, #8c2b26 0%, #5e1a16 100%) !important;
  color: #ffe3cf !important;
}
html.av2 #theme-toggle { width: 24px !important; color: #f2d489 !important; }


/* ---------- 4. top navigation tabs: gold plates on dark wood ---------- */

html.av2 #wintabs {
  padding: 0 !important;
  background: linear-gradient(180deg, #2b1a10 0%, #1d1109 100%) !important;
  border-bottom: 2px solid #180d08 !important;
  box-shadow: inset 0 -2px 0 rgba(216, 166, 63, .28) !important;
}
html.av2 #wintabs .wt-scroll { display: flex !important; gap: 0 !important; }
html.av2 #wintabs .wt {
  font-family: var(--g-body) !important;
  font-weight: 900 !important;
  font-size: 9px !important;
  line-height: 1 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
  color: #bda882 !important;
  padding: 10px 12px 9px !important;
  border: 0 !important;
  border-right: 2px solid #180d08 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #3f2717 0%, #2b1a10 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 240, 200, .16) !important;
  text-shadow: 1px 1px 0 #180d08 !important;
  cursor: pointer;
  white-space: nowrap;
}
html.av2 #wintabs .wt:hover {
  color: #f4e7c8 !important;
  background: linear-gradient(180deg, #5b3720 0%, #3f2717 100%) !important;
}
html.av2 #wintabs .wt.on {
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #f2d489 0%, #d8a63f 46%, #a97b22 100%) !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 250, 225, .7),
    inset 0 -2px 0 #8d6120 !important;
  text-shadow: 0 1px 0 rgba(255, 245, 215, .55) !important;
}
html.av2 #wintabs .wt.on::after { display: none !important; }
html.av2 #wintabs .wt:active { transform: translateY(1px) !important; }

/* ---------- 5. top bar: the 50VS50 marquee ---------- */

html.av2 #top {
  padding: 9px 12px !important;
  gap: 12px !important;
  background:
    linear-gradient(180deg, #5d1a29 0%, #4b1120 44%, #330b15 100%) !important;
  border-bottom: 2px solid #180d08 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 220, 160, .18),
    inset 0 -10px 20px rgba(0, 0, 0, .35) !important;
}
html.av2 .brand {
  font-family: var(--g-display) !important;
  font-weight: 900 !important;
  font-size: 27px !important;
  line-height: .92 !important;
  letter-spacing: .01em !important;
  text-transform: uppercase;
  color: #f2d489 !important;
  -webkit-text-fill-color: #f2d489 !important;
  background: none !important;
  filter: none !important;
  animation: none !important;
  -webkit-text-stroke: 1px #180d08;
  text-shadow:
    0 2px 0 #8d6120,
    0 4px 0 #180d08,
    0 6px 10px rgba(0, 0, 0, .55) !important;
}
html.av2 .brand span {
  font-family: var(--g-display) !important;
  font-size: 15px !important;
  font-style: normal !important;
  letter-spacing: 0 !important;
  color: #f4e7c8 !important;
  -webkit-text-fill-color: #f4e7c8 !important;
  vertical-align: 3px;
  padding: 0 1px;
  -webkit-text-stroke: 1px #180d08;
}
html.av2 .brand small {
  display: block !important;
  font-family: var(--g-body) !important;
  font-weight: 900 !important;
  font-size: 6.5px !important;
  letter-spacing: .34em !important;
  color: #d9a08a !important;
  -webkit-text-fill-color: #d9a08a !important;
  margin-top: 4px !important;
  -webkit-text-stroke: 0;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 .streakbadge {
  font: 900 7.5px/1 var(--g-body) !important;
  letter-spacing: .16em !important;
  color: #f2d489 !important;
  background: linear-gradient(180deg, #5d1a29 0%, #3a0d18 100%) !important;
  border: 2px solid #8d6120 !important;
  border-radius: 0 !important;
  padding: 5px 7px !important;
  box-shadow: inset 0 1px 0 rgba(255, 230, 180, .22) !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}

/* balance: brass plate, engraved numerals */
html.av2 #top .balance {
  padding: 4px 10px 4px 5px !important;
  gap: 7px !important;
  background: linear-gradient(180deg, #f2d489 0%, #d8a63f 52%, #a97b22 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 250, 225, .7),
    inset 0 -2px 0 #8d6120,
    0 2px 0 #180d08 !important;
}
html.av2 #top .balance b {
  font-family: var(--g-display) !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  color: #2a1a11 !important;
  letter-spacing: .01em !important;
  text-shadow: 0 1px 0 rgba(255, 248, 220, .6) !important;
  font-variant-numeric: tabular-nums;
}
html.av2 #top .balance .usd {
  width: 19px !important;
  height: 19px !important;
  font: 900 12px/1 var(--g-display) !important;
  color: #f2d489 !important;
  background: linear-gradient(180deg, #5d1a29 0%, #330b15 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 220, 170, .35) !important;
  animation: gUsdSpin 11s steps(24) infinite !important;
}
html.av2 #top .balance .usd::after { display: none !important; }
@keyframes gUsdSpin {
  0%, 88% { transform: rotateY(0deg); }
  92% { transform: rotateY(90deg); }
  96% { transform: rotateY(0deg); }
  100% { transform: rotateY(0deg); }
}
html.av2 #top .balance .usd-tag {
  font: 900 6.5px/1 var(--g-body) !important;
  letter-spacing: .2em !important;
  color: #4a3010 !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 225, .5) !important;
}
html.av2 .addbtn {
  font: 900 9px/1 var(--g-body) !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
  color: #f9f0d6 !important;
  padding: 7px 10px !important;
  background: linear-gradient(180deg, #2c5340 0%, #1f3c29 54%, #142c1e 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow:
    inset 0 2px 0 rgba(190, 235, 190, .28),
    inset 0 -2px 0 #0e1f15,
    0 2px 0 #180d08 !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 .addbtn:active { transform: translateY(2px) !important; box-shadow: inset 0 3px 6px rgba(0, 0, 0, .55) !important; }

/* ---------- 6. ticker: brass reading rail ---------- */

html.av2 #ticker {
  margin: 0 !important;
  padding: 5px 0 !important;
  border: 0 !important;
  border-bottom: 2px solid #180d08 !important;
  border-radius: 0 !important;
  background: #1d1109 !important;
  color: #a8937a !important;
  font: 900 7.5px/1 var(--g-body) !important;
  letter-spacing: .26em !important;
  text-transform: uppercase;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, .7) !important;
}
html.av2 #ticker span {
  color: #d8a63f !important;
  text-shadow: 0 1px 0 #180d08 !important;
  animation: mq 46s linear infinite !important;
}
html.av2 #appbanner {
  background: linear-gradient(180deg, #f2d489 0%, #d8a63f 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  color: #2a1a11 !important;
  font: 900 9px/1.4 var(--g-body) !important;
  letter-spacing: .1em !important;
}


/* ---------- 7. stage ---------- */

html.av2 #main {
  padding: 12px !important;
  perspective: 1800px !important;
  perspective-origin: 50% -10% !important;
  background:
    radial-gradient(120% 70% at 50% 0%, rgba(216, 166, 63, .1), transparent 60%) !important;
}
html.av2 .view { animation: gIn .18s steps(3) !important; }
@keyframes gIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}

/* ---------- 8. section heads: engraved plates ---------- */

html.av2 .vhead {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 10px !important;
  padding: 0 0 8px !important;
  border-bottom: 3px solid #180d08 !important;
  box-shadow: 0 3px 0 rgba(216, 166, 63, .45) !important;
}
html.av2 .vhead h2 {
  font-family: var(--g-display) !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  line-height: 1 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase;
  color: #f4e7c8 !important;
  -webkit-text-stroke: 1px #180d08;
  text-shadow: 0 2px 0 #180d08, 0 4px 8px rgba(0, 0, 0, .5) !important;
}
html.av2 .vhead h2::after { display: none !important; }
html.av2 .backbtn {
  font: 900 8.5px/1 var(--g-body) !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
  color: #f4e7c8 !important;
  padding: 7px 9px !important;
  background: linear-gradient(180deg, #7d5230 0%, #4a2d19 54%, #2b1a10 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 0 rgba(255, 240, 200, .26), 0 2px 0 #180d08 !important;
  text-shadow: 1px 1px 0 #180d08 !important;
  cursor: pointer;
}
html.av2 .backbtn:active { transform: translateY(2px) !important; box-shadow: inset 0 3px 6px rgba(0, 0, 0, .55) !important; }

/* ---------- 9. arena: burgundy marquee with faceted low-poly backdrop ---------- */

html.av2 .hero {
  position: relative !important;
  overflow: hidden !important;
  min-height: 148px !important;
  padding: 18px 16px 16px !important;
  margin-bottom: 12px !important;
  border: 3px solid #180d08 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, #6a1b2c 0%, #4b1120 46%, #2e0a13 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(216, 166, 63, .85),
    inset 0 3px 0 rgba(255, 220, 170, .3),
    inset 0 -18px 34px rgba(0, 0, 0, .5),
    0 5px 0 #180d08,
    0 14px 26px rgba(0, 0, 0, .55) !important;
}
/* faceted back wall: hard-stop wedges, no gradients that read as gloss */
html.av2 .hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  opacity: .5;
  background:
    conic-gradient(from 214deg at 26% 118%,
      rgba(216, 166, 63, .16) 0deg 38deg,
      transparent 38deg 96deg,
      rgba(255, 226, 170, .09) 96deg 132deg,
      transparent 132deg 190deg,
      rgba(216, 166, 63, .13) 190deg 232deg,
      transparent 232deg 300deg,
      rgba(255, 226, 170, .07) 300deg 360deg),
    conic-gradient(from 32deg at 82% -20%,
      rgba(255, 226, 170, .12) 0deg 52deg,
      transparent 52deg 140deg,
      rgba(216, 166, 63, .14) 140deg 208deg,
      transparent 208deg 300deg,
      rgba(255, 226, 170, .08) 300deg 360deg);
}
/* arena floor line + gold rule */
html.av2 .hero::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 10px !important;
  z-index: 0 !important;
  clip-path: none !important;
  opacity: 1 !important;
  background:
    repeating-linear-gradient(90deg, rgba(216, 166, 63, .8) 0 10px, transparent 10px 20px),
    linear-gradient(180deg, rgba(0, 0, 0, .5), rgba(0, 0, 0, .1)) !important;
}
html.av2 .hero > * { position: relative !important; z-index: 1 !important; }

html.av2 .hlog {
  font-family: var(--g-display) !important;
  font-weight: 900 !important;
  font-size: 42px !important;
  line-height: .9 !important;
  letter-spacing: .005em !important;
  text-transform: uppercase;
  color: #f2d489 !important;
  -webkit-text-fill-color: #f2d489 !important;
  background: none !important;
  filter: none !important;
  animation: none !important;
  -webkit-text-stroke: 2px #180d08;
  paint-order: stroke fill;
  text-shadow:
    0 3px 0 #8d6120,
    0 6px 0 #180d08,
    0 9px 14px rgba(0, 0, 0, .6) !important;
}
html.av2 .hsub {
  font-family: var(--g-body) !important;
  font-weight: 900 !important;
  font-size: 8px !important;
  line-height: 1.6 !important;
  letter-spacing: .3em !important;
  text-transform: uppercase;
  color: #f0c9a8 !important;
  margin-top: 8px !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 .hrow { margin-top: 14px !important; gap: 9px !important; align-items: center !important; flex-wrap: wrap !important; }

/* jackpot: engraved brass readout */
html.av2 .jpticker {
  padding: 5px 12px !important;
  background: linear-gradient(180deg, #2a1a11 0%, #180d08 100%) !important;
  border: 2px solid #8d6120 !important;
  border-radius: 0 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 224, 170, .18),
    inset 0 0 0 1px #180d08,
    0 2px 0 #180d08 !important;
}
html.av2 .jpticker small {
  font: 900 6.5px/1 var(--g-body) !important;
  letter-spacing: .28em !important;
  color: #c79a52 !important;
  text-transform: uppercase;
}
html.av2 .jpticker span {
  font-family: var(--g-mono) !important;
  font-weight: 900 !important;
  font-size: 17px !important;
  letter-spacing: .04em !important;
  color: #f2d489 !important;
  text-shadow: 0 2px 0 #180d08, 0 0 14px rgba(216, 166, 63, .3) !important;
  font-variant-numeric: tabular-nums;
}
html.av2 .hbtn {
  font: 900 10px/1 var(--g-body) !important;
  letter-spacing: .16em !important;
  text-transform: uppercase;
  color: #2a1a11 !important;
  padding: 9px 13px !important;
  background: linear-gradient(180deg, #f7e0a6 0%, #d8a63f 48%, #a97b22 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 252, 232, .8),
    inset 0 -2px 0 #8d6120,
    0 3px 0 #180d08 !important;
  text-shadow: 0 1px 0 rgba(255, 248, 220, .5) !important;
}
html.av2 .hbtn:active { transform: translateY(2px) !important; box-shadow: inset 0 3px 7px rgba(90, 50, 10, .55) !important; }


/* ---------- 10. casino floor: chunky 2.5D game plates ---------- */

html.av2 .grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 9px !important;
  margin-bottom: 14px !important;
  transform: none !important;
  perspective: 900px !important;
}
@media (min-width: 620px) {
  html.av2 .grid { grid-template-columns: repeat(3, 1fr) !important; gap: 11px !important; }
}
@media (min-width: 900px) {
  html.av2 .grid { grid-template-columns: repeat(4, 1fr) !important; }
}
html.av2 .grid::before {
  content: "CASINO FLOOR\00a0\00a0\2022\00a0\00a0PICK YOUR TABLE";
  grid-column: 1 / -1 !important;
  font-family: var(--g-display) !important;
  font-weight: 900 !important;
  font-size: 10px !important;
  letter-spacing: .2em !important;
  color: #d8a63f !important;
  text-shadow: 0 1px 0 #180d08 !important;
  padding: 2px 0 4px !important;
  border-bottom: 2px solid #4a2d19;
  margin-bottom: 2px;
}

html.av2 .tile {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 10px !important;
  overflow: visible !important;
  border: 3px solid #2b1a10 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, #f6ecd2 0%, #e8d7b2 54%, #d3bd93 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(216, 166, 63, .75),
    inset 0 3px 0 rgba(255, 253, 238, .85),
    inset 0 -4px 0 rgba(122, 92, 52, .45),
    0 5px 0 #2b1a10,
    0 9px 14px rgba(0, 0, 0, .5) !important;
  transform: translateZ(0) !important;
  transform-origin: 50% 100% !important;
  transition: transform .1s steps(2), box-shadow .1s steps(2);
}
html.av2 .tile:hover {
  border-color: #180d08 !important;
  background: linear-gradient(180deg, #fff6de 0%, #eedfbc 54%, #dcc79c 100%) !important;
  box-shadow:
    inset 0 0 0 2px #d8a63f,
    inset 0 3px 0 rgba(255, 255, 246, .95),
    inset 0 -4px 0 rgba(122, 92, 52, .45),
    0 7px 0 #2b1a10,
    0 12px 18px rgba(0, 0, 0, .55) !important;
  transform: translateY(-2px) rotateX(3deg) !important;
}
html.av2 .tile:active {
  transform: translateY(3px) !important;
  box-shadow:
    inset 0 0 0 2px #d8a63f,
    inset 0 4px 8px rgba(90, 60, 20, .4),
    0 2px 0 #2b1a10 !important;
}
html.av2 .tile::after,
html.av2 .tile:after { display: none !important; }
/* gold selection notch, stepped like a Genesis cursor */
html.av2 .tile::before {
  content: "" !important;
  position: absolute !important;
  left: -3px !important;
  top: -3px !important;
  bottom: -3px !important;
  width: 6px !important;
  background: #8d6120 !important;
  transition: background .1s steps(2);
}
html.av2 .tile:hover::before { background: var(--g-gold) !important; }

html.av2 .tile .ico {
  position: relative !important;
  width: 40px !important;
  height: 40px !important;
  flex: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, #2c5340 0%, #1f3c29 58%, #142c1e 100%) !important;
  box-shadow:
    inset 0 2px 0 rgba(190, 235, 190, .3),
    inset 0 -3px 0 #0e1f15,
    0 2px 0 rgba(43, 26, 16, .6) !important;
  color: #f2d489 !important;
  filter: none !important;
}
html.av2 .tile .ico svg { width: 26px !important; height: 26px !important; filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, .6)); }
html.av2 .tile:hover .ico {
  background: linear-gradient(180deg, #3a6b52 0%, #2c5340 58%, #1f3c29 100%) !important;
  filter: none !important;
  transform: none !important;
}
html.av2 .tile .nm {
  font-family: var(--g-display) !important;
  font-weight: 900 !important;
  font-size: 11px !important;
  line-height: 1.05 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase;
  color: #2a1a11 !important;
  text-shadow: 0 1px 0 rgba(255, 252, 236, .8) !important;
}
html.av2 .tile .sub {
  font-family: var(--g-body) !important;
  font-weight: 900 !important;
  font-size: 6.5px !important;
  line-height: 1.5 !important;
  letter-spacing: .1em !important;
  color: #6b4526 !important;
  margin-top: 4px !important;
  text-transform: uppercase;
}


/* ---------- 11. panels: cream signboard in a wood frame ---------- */

html.av2 .panel {
  padding: 10px 11px !important;
  margin-bottom: 10px !important;
  border: 3px solid #2b1a10 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, #f6ecd2 0%, #e9dab6 62%, #ddc9a0 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(216, 166, 63, .7),
    inset 0 3px 0 rgba(255, 253, 240, .8),
    inset 0 -4px 0 rgba(122, 92, 52, .35),
    0 4px 0 #2b1a10,
    0 8px 16px rgba(0, 0, 0, .45) !important;
  color: #3a2413 !important;
}
html.av2 .panel .ph {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin: 0 0 9px !important;
  padding: 5px 8px !important;
  border: 2px solid #2b1a10 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #7d5230 0%, #4a2d19 100%) !important;
  font-family: var(--g-body) !important;
  font-weight: 900 !important;
  font-size: 8px !important;
  letter-spacing: .18em !important;
  text-transform: uppercase;
  color: #f2d489 !important;
  text-shadow: 1px 1px 0 #180d08 !important;
  box-shadow: inset 0 1px 0 rgba(255, 240, 200, .3), 0 2px 0 rgba(43, 26, 16, .5) !important;
}
html.av2 .panel .ph > span:first-child {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  color: #f2d489 !important;
}
html.av2 .panel .ph > span:first-child::before {
  content: "" !important;
  width: 5px !important;
  height: 9px !important;
  background: var(--g-gold) !important;
  box-shadow: 2px 0 0 #180d08 !important;
  display: inline-block !important;
}
html.av2 .panel .ph > span:last-child { color: #e0b96a !important; }
html.av2 #main,
html.av2 .view { color: #3a2413 !important; }
html.av2 #main .panel b,
html.av2 #main .panel strong { color: #2a1a11 !important; }

/* kill the old blue inline text without touching the intentional accents */
html.av2 #main [style*="#33507e"],
html.av2 #main [style*="#123b7a"],
html.av2 #main [style*="#0b2f6e"],
html.av2 #main [style*="#5d6e8f"],
html.av2 .modal [style*="#33507e"],
html.av2 .modal [style*="#123b7a"] { color: #5c3a22 !important; }
html.av2 #main .hint,
html.av2 #main .mstat span,
html.av2 #main .mstat b { color: #4a2d19 !important; }
html.av2 #main .mstat b { font-family: var(--g-display) !important; }
html.av2 #main .hint::before { color: #8d6120 !important; }

/* ---------- 12. buttons ---------- */

html.av2 .btn,
html.av2 .btn.blue {
  font-family: var(--g-body) !important;
  font-weight: 900 !important;
  font-size: 10px !important;
  line-height: 1 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
  color: #2a1a11 !important;
  padding: 10px 13px !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #f7e6b8 0%, #dfc48c 50%, #c1a069 100%) !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 253, 240, .85),
    inset 0 -3px 0 rgba(122, 92, 52, .55),
    0 3px 0 #180d08 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 226, .6) !important;
  cursor: pointer;
}
html.av2 .btn:active {
  transform: translateY(2px) !important;
  box-shadow: inset 0 3px 7px rgba(90, 60, 20, .45), 0 1px 0 #180d08 !important;
}
html.av2 .btn.gold {
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #fbeec4 0%, #d8a63f 46%, #a97b22 100%) !important;
  border-color: #180d08 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 253, 235, .9),
    inset 0 -3px 0 #8d6120,
    0 3px 0 #180d08 !important;
}
html.av2 .btn.green {
  color: #f2f7e2 !important;
  background: linear-gradient(180deg, #3a6b52 0%, #2c5340 52%, #1b3927 100%) !important;
  border-color: #180d08 !important;
  box-shadow:
    inset 0 2px 0 rgba(200, 240, 200, .3),
    inset 0 -3px 0 #0e1f15,
    0 3px 0 #180d08 !important;
  text-shadow: 1px 1px 0 #142c1e !important;
}
html.av2 .btn.red {
  color: #ffe4d8 !important;
  background: linear-gradient(180deg, #a8452a 0%, #7c2a1c 52%, #5c1a12 100%) !important;
  border-color: #180d08 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 200, 170, .3),
    inset 0 -3px 0 #3d0e08,
    0 3px 0 #180d08 !important;
  text-shadow: 1px 1px 0 #3d0e08 !important;
}
html.av2 .btn.small { font-size: 8.5px !important; padding: 8px 9px !important; }
html.av2 .btn:disabled { filter: grayscale(.55) brightness(.86) !important; opacity: 1 !important; }
html.av2 .btnrow { gap: 7px !important; }

/* bet controls */
html.av2 .betbar { gap: 6px !important; margin-bottom: 8px !important; }
html.av2 .betval {
  padding: 4px 9px !important;
  background: linear-gradient(180deg, #2a1a11 0%, #180d08 100%) !important;
  border: 2px solid #8d6120 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, .7), inset 0 0 0 1px #0d0603 !important;
}
html.av2 .betval span {
  font: 900 6.5px/1 var(--g-body) !important;
  letter-spacing: .22em !important;
  color: #c79a52 !important;
}
html.av2 .betval b {
  font-family: var(--g-mono) !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  color: #f2d489 !important;
  text-shadow: 0 2px 0 #180d08 !important;
  font-variant-numeric: tabular-nums;
}
html.av2 .betadj {
  width: 36px !important;
  height: 36px !important;
  font: 900 16px/1 var(--g-display) !important;
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #f7e6b8 0%, #dfc48c 50%, #c1a069 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 0 rgba(255, 253, 240, .85), inset 0 -3px 0 rgba(122, 92, 52, .55), 0 3px 0 #180d08 !important;
}
html.av2 .betadj:active { transform: translateY(2px) !important; box-shadow: inset 0 3px 7px rgba(90, 60, 20, .45) !important; }
html.av2 .quick { gap: 5px !important; }
html.av2 .quick button {
  font: 900 8px/1 var(--g-body) !important;
  letter-spacing: .1em !important;
  color: #f4e7c8 !important;
  padding: 8px 0 !important;
  background: linear-gradient(180deg, #5b3720 0%, #3f2717 54%, #2b1a10 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 0 rgba(255, 240, 200, .22), 0 2px 0 #180d08 !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 .quick button:active { transform: translateY(2px) !important; box-shadow: inset 0 3px 6px rgba(0, 0, 0, .55) !important; }

/* chip buttons: stacked casino chips */
html.av2 .chipsrow { gap: 6px !important; margin-bottom: 8px !important; }
html.av2 .chipsrow button {
  font: 900 9px/1 var(--g-body) !important;
  letter-spacing: .06em !important;
  color: #f4e7c8 !important;
  padding: 7px 10px !important;
  background: linear-gradient(180deg, #5d1a29 0%, #3a0d18 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 50px !important;
  box-shadow:
    inset 0 0 0 2px rgba(216, 166, 63, .55),
    inset 0 2px 0 rgba(255, 220, 170, .22),
    0 3px 0 #180d08 !important;
  transform: none !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 .chipsrow button.on {
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #fbeec4 0%, #d8a63f 52%, #a97b22 100%) !important;
  box-shadow:
    inset 0 0 0 2px #180d08,
    inset 0 2px 0 rgba(255, 253, 235, .9),
    0 3px 0 #180d08 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 226, .6) !important;
  transform: none !important;
}

html.av2 .msg {
  font: 900 9px/1.5 var(--g-body) !important;
  letter-spacing: .1em !important;
  text-transform: uppercase;
  color: #5c3a22 !important;
  padding: 7px 4px !important;
  min-height: 16px;
}
html.av2 .msg.win { color: #2c5340 !important; text-shadow: 0 1px 0 rgba(255, 253, 240, .7); }
html.av2 .msg.lose { color: #8c2b26 !important; }
html.av2 .msg::first-letter { font-size: 1.15em; }


/* ---------- 13. table surfaces: green baize with a gold rail ---------- */

html.av2 .cards,
html.av2 .rtable {
  border: 3px solid #2b1a10 !important;
  border-radius: 0 !important;
  background-image:
    repeating-linear-gradient(46deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(-46deg, rgba(0, 0, 0, .16) 0 1px, transparent 1px 4px),
    radial-gradient(130% 96% at 50% -8%, #35624a 0%, #24452f 58%, #16301f 100%) !important;
  background-blend-mode: overlay, overlay, normal !important;
  box-shadow:
    inset 0 0 0 2px rgba(216, 166, 63, .55),
    inset 0 3px 18px rgba(0, 0, 0, .65),
    0 4px 0 #2b1a10,
    0 10px 18px rgba(0, 0, 0, .5) !important;
}
html.av2 .rtable { box-shadow: inset 0 0 0 2px rgba(216, 166, 63, .55), inset 0 3px 16px rgba(0, 0, 0, .65), 0 4px 0 #2b1a10, 0 14px 22px -10px #000 !important; }
html.av2 .rtable .rcell {
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #35624a 0%, #24452f 100%) !important;
  color: #f0e6c8 !important;
  box-shadow: inset 0 2px 0 rgba(200, 240, 200, .2) !important;
  text-shadow: 1px 1px 0 #142c1e !important;
}
html.av2 .rtable .rcell:hover { background: linear-gradient(180deg, #427a5c 0%, #2c5340 100%) !important; box-shadow: inset 0 2px 0 rgba(220, 255, 220, .3) !important; }
html.av2 .rtable .rcell:active { transform: translateY(2px) !important; }
html.av2 .cards .card { border-radius: 0 !important; box-shadow: 0 3px 0 rgba(24, 13, 8, .8) !important; filter: saturate(.9) brightness(1) !important; }
html.av2 .wheelwrap { perspective: 1200px !important; }
html.av2 .wheel {
  border: 5px solid #6b4526 !important;
  box-shadow:
    0 0 0 3px #180d08,
    inset 0 0 0 3px rgba(216, 166, 63, .6),
    0 12px 22px rgba(0, 0, 0, .6) !important;
  filter: saturate(.92) brightness(1) contrast(1.02) !important;
  transform: rotateX(12deg) !important;
}
html.av2 .wheel .hub {
  background: linear-gradient(180deg, #f7e6b8 0%, #d8a63f 52%, #8d6120 100%) !important;
  border: 2px solid #180d08 !important;
  box-shadow: inset 0 2px 0 rgba(255, 253, 235, .8), 0 3px 0 rgba(24, 13, 8, .8) !important;
  color: #2a1a11 !important;
}
html.av2 .wheel .pointer { border-top-color: #d8a63f !important; }
html.av2 .v15-ball::before {
  background: radial-gradient(circle at 34% 28%, #fffdf2, #efe3c4 46%, #a89a72 84%) !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .8) !important;
}
html.av2 .minesgrid { perspective: 900px !important; }
html.av2 .minesgrid button,
html.av2 .minesgrid > * {
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #3f2717 0%, #2b1a10 100%) !important;
  box-shadow: inset 0 2px 0 rgba(255, 240, 200, .18), 0 3px 0 #180d08 !important;
  color: #e0c894 !important;
}
html.av2 .minesgrid button.open {
  background: linear-gradient(180deg, #3a6b52 0%, #24452f 100%) !important;
  border-color: #180d08 !important;
  color: #f2f7e2 !important;
  box-shadow: inset 0 2px 0 rgba(200, 240, 200, .3), 0 3px 0 #180d08 !important;
}
html.av2 .minesgrid button.bomb {
  background: linear-gradient(180deg, #a8452a 0%, #6f2517 100%) !important;
  border-color: #180d08 !important;
  box-shadow: inset 0 2px 0 rgba(255, 200, 170, .3), 0 3px 0 #180d08 !important;
}
html.av2 .towers { perspective: 1000px !important; perspective-origin: 50% 120% !important; }
html.av2 .towers > * {
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #7d5230 0%, #4a2d19 100%) !important;
  box-shadow: inset 0 2px 0 rgba(255, 240, 200, .22), 0 4px 0 #180d08 !important;
  color: #f4e7c8 !important;
}
html.av2 .towers > *:hover { background: linear-gradient(180deg, #9a6740 0%, #5b3720 100%) !important; transform: translateZ(6px) !important; }
html.av2 .bigmult,
html.av2 .totalpill {
  font-family: var(--g-display) !important;
  font-weight: 900 !important;
  color: #f2d489 !important;
  letter-spacing: .01em !important;
  -webkit-text-stroke: 1px #180d08;
  text-shadow: 0 3px 0 #8d6120, 0 6px 12px rgba(0, 0, 0, .6) !important;
  font-variant-numeric: tabular-nums;
  animation: none !important;
}
html.av2 .graphbox {
  border: 2px solid #8d6120 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #2a1a11 0%, #180d08 100%) !important;
  box-shadow: inset 0 3px 12px rgba(0, 0, 0, .8) !important;
}
html.av2 .bead { background: #2a1a11 !important; border: 2px solid #180d08 !important; border-radius: 0 !important; }
html.av2 .bead > * { border-radius: 0 !important; box-shadow: none !important; }
html.av2 .history > *,
html.av2 #history-list > * {
  background: #efe2c2 !important;
  border-bottom: 1px solid #c3ab7c !important;
  color: #4a2d19 !important;
  text-shadow: none !important;
}
html.av2 .history > *:nth-child(odd) { background: #e4d3ab !important; }

/* ---------- 14. duel arena cards ---------- */

html.av2 .duel-card {
  border: 3px solid #2b1a10 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #f6ecd2 0%, #e2d0a8 100%) !important;
  box-shadow:
    inset 0 0 0 2px rgba(216, 166, 63, .7),
    inset 0 3px 0 rgba(255, 253, 240, .8),
    0 4px 0 #2b1a10,
    0 8px 14px rgba(0, 0, 0, .45) !important;
}
html.av2 .duel-card .di { filter: saturate(.9) brightness(1) !important; }
html.av2 .duel-card .dn {
  font-family: var(--g-display) !important;
  font-weight: 900 !important;
  font-size: 10px !important;
  letter-spacing: .04em !important;
  text-transform: uppercase;
  color: #2a1a11 !important;
  text-shadow: 0 1px 0 rgba(255, 252, 236, .8) !important;
}
html.av2 .duel-card .dp {
  font: 900 6.5px/1.4 var(--g-body) !important;
  letter-spacing: .14em !important;
  color: #6b4526 !important;
  text-transform: uppercase;
}
html.av2 .duel-card:hover .di { filter: saturate(1) brightness(1.03) !important; }
html.av2 .duel-card.on {
  border-color: #180d08 !important;
  background: linear-gradient(180deg, #fbeec4 0%, #d8a63f 100%) !important;
  box-shadow:
    inset 0 0 0 2px #180d08,
    inset 0 3px 0 rgba(255, 253, 235, .9),
    0 4px 0 #2b1a10,
    0 10px 18px rgba(0, 0, 0, .5) !important;
}
html.av2 .duel-card.on .di { filter: saturate(1.05) brightness(1.04) !important; }
html.av2 .dpickbar {
  border: 2px solid #180d08 !important;
  background: linear-gradient(180deg, #3f2717 0%, #2b1a10 100%) !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 0 rgba(255, 240, 200, .16) !important;
}
html.av2 .dpick-b {
  font: 900 9px/1 var(--g-body) !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
  color: #e0c894 !important;
  background: linear-gradient(180deg, #5b3720 0%, #3f2717 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 0 rgba(255, 240, 200, .18) !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 .dpick-b.on {
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #fbeec4 0%, #d8a63f 100%) !important;
  border-color: #180d08 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 226, .6) !important;
}
html.av2 .roomrow {
  border-bottom: 1px solid #c3ab7c !important;
  background: #efe2c2 !important;
  color: #4a2d19 !important;
  text-shadow: none !important;
}
html.av2 .roomrow .rg { color: #8c2b26 !important; }
html.av2 .roomrow .rj {
  font: 900 8px/1 var(--g-body) !important;
  letter-spacing: .1em !important;
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #f7e6b8 0%, #d8a63f 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: 0 2px 0 #180d08 !important;
}
html.av2 .pvpfeed, html.av2 #pv-live, html.av2 #pv-feed { color: #5c3a22 !important; text-shadow: none !important; }
html.av2 #dstage .ds-wrap, html.av2 .ds-stage {
  border-color: #2b1a10 !important;
  background: linear-gradient(180deg, #2f2016 0%, #180d08 100%) !important;
  box-shadow: inset 0 0 0 2px rgba(216, 166, 63, .5) !important;
}
html.av2 #ds-fa .ds-fig svg,
html.av2 #ds-fb .ds-fig svg { filter: saturate(.95) brightness(1.02) contrast(1.03) !important; }
html.av2 .ds-fight-floor {
  background-image:
    repeating-linear-gradient(90deg, rgba(216, 166, 63, .2) 0 2px, transparent 2px 30px),
    repeating-linear-gradient(0deg, rgba(216, 166, 63, .14) 0 2px, transparent 2px 30px) !important;
}


/* ---------- 15. cashier modal + popups ---------- */

html.av2 .modal { background: rgba(20, 10, 6, .8) !important; }
html.av2 .mbox {
  border: 3px solid #6b4526 !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, #2b1a10 0%, #1d1109 100%) !important;
  box-shadow:
    inset 0 0 0 2px #180d08,
    inset 0 0 0 4px rgba(216, 166, 63, .45),
    0 24px 60px rgba(0, 0, 0, .85) !important;
  color: #f0e2c2 !important;
}
html.av2 .mtitle {
  padding: 7px 10px !important;
  background: linear-gradient(180deg, #7d5230 0%, #4a2d19 100%) !important;
  border-bottom: 2px solid #180d08 !important;
  font: 900 9px/1 var(--g-body) !important;
  letter-spacing: .26em !important;
  text-transform: uppercase;
  color: #f2d489 !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 .mtitle b {
  color: #ffe3cf !important;
  background: linear-gradient(180deg, #8c2b26 0%, #5e1a16 100%) !important;
  border: 2px solid #180d08 !important;
  padding: 2px 5px !important;
  font-family: var(--g-body) !important;
}
html.av2 .mbody { color: #e6d5ae !important; }
html.av2 .ctabs { background: #1d1109 !important; border-bottom: 2px solid #180d08 !important; }
html.av2 .ctabs button {
  font: 900 8px/1 var(--g-body) !important;
  letter-spacing: .16em !important;
  text-transform: uppercase;
  color: #bda882 !important;
  padding: 9px 11px !important;
  background: linear-gradient(180deg, #3f2717 0%, #2b1a10 100%) !important;
  border: 0 !important;
  border-right: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html.av2 .ctabs button.on {
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #f2d489 0%, #d8a63f 100%) !important;
  box-shadow: inset 0 2px 0 rgba(255, 250, 225, .7) !important;
}
html.av2 .csec {
  background: #180d08 !important;
  border-bottom: 2px solid #4a2d19 !important;
  color: #d8a63f !important;
  font: 900 7.5px/1.4 var(--g-body) !important;
  letter-spacing: .2em !important;
  text-transform: uppercase;
  padding: 5px 8px !important;
}
html.av2 .qrow {
  border: 2px solid #4a2d19 !important;
  background: #2a1a11 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 240, 200, .1) !important;
}
html.av2 .qrow .qt { color: #f0e2c2 !important; }
html.av2 .qrow .qf { color: #bda882 !important; }
html.av2 .mini {
  font: 900 8.5px/1 var(--g-body) !important;
  letter-spacing: .1em !important;
  text-transform: uppercase;
  color: #f4e7c8 !important;
  padding: 7px 9px !important;
  background: linear-gradient(180deg, #5b3720 0%, #3f2717 54%, #2b1a10 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 0 rgba(255, 240, 200, .22), 0 2px 0 #180d08 !important;
  text-shadow: 1px 1px 0 #180d08 !important;
}
html.av2 .mini:active { transform: translateY(2px) !important; box-shadow: inset 0 3px 6px rgba(0, 0, 0, .6) !important; }
html.av2 .mini.gold {
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #fbeec4 0%, #d8a63f 50%, #a97b22 100%) !important;
  border-color: #180d08 !important;
  box-shadow: inset 0 2px 0 rgba(255, 253, 235, .9), 0 2px 0 #180d08 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 226, .6) !important;
}
html.av2 #popstack > *,
html.av2 .pop {
  background: linear-gradient(180deg, #f6ecd2 0%, #dfcaa0 100%) !important;
  border: 3px solid #2b1a10 !important;
  border-radius: 0 !important;
  color: #2a1a11 !important;
  box-shadow: 0 4px 0 #2b1a10, 0 10px 22px rgba(0, 0, 0, .6) !important;
  font-family: var(--g-body) !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}
html.av2 .bar { background: #180d08 !important; border: 2px solid #4a2d19 !important; border-radius: 0 !important; }
html.av2 .bar > i { background: linear-gradient(180deg, #f2d489 0%, #d8a63f 52%, #8d6120 100%) !important; }

/* ---------- 16. bottom navigation: console footer strip ---------- */

html.av2 #taskbar {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 6px 10px !important;
  background:
    linear-gradient(180deg, #6b4526 0%, #4a2d19 46%, #2b1a10 100%) !important;
  border-top: 3px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow:
    inset 0 2px 0 rgba(255, 220, 170, .28),
    0 -3px 0 rgba(216, 166, 63, .35) !important;
}
html.av2 #startbtn {
  font: 900 9px/1 var(--g-display) !important;
  letter-spacing: .18em !important;
  text-transform: uppercase;
  color: #2a1a11 !important;
  padding: 8px 12px !important;
  background: linear-gradient(180deg, #fbeec4 0%, #d8a63f 50%, #a97b22 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 0 rgba(255, 253, 235, .9), inset 0 -3px 0 #8d6120, 0 3px 0 #180d08 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 226, .6) !important;
}
html.av2 #startbtn:active { transform: translateY(2px) !important; box-shadow: inset 0 3px 7px rgba(90, 60, 20, .5) !important; }
html.av2 .tb-item {
  font: 900 8px/1 var(--g-body) !important;
  letter-spacing: .16em !important;
  text-transform: uppercase;
  color: #f0e2c2 !important;
  padding: 7px 9px !important;
  background: linear-gradient(180deg, #3f2717 0%, #2b1a10 100%) !important;
  border: 2px solid #180d08 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 2px 0 rgba(255, 240, 200, .18), 0 2px 0 #180d08 !important;
  text-shadow: 1px 1px 0 #180d08 !important;
  cursor: pointer;
}
html.av2 .tb-item:active { transform: translateY(2px) !important; box-shadow: inset 0 3px 6px rgba(0, 0, 0, .6) !important; }
html.av2 .tb-clock {
  font: 900 9px/1 var(--g-mono) !important;
  letter-spacing: .1em !important;
  color: #f2d489 !important;
  text-shadow: 0 1px 0 #180d08 !important;
}
html.av2 .sidegrid .panel { margin-bottom: 8px !important; }
html.av2 #buddy-list > *,
html.av2 .buddies .bd { color: #4a2d19 !important; border-bottom: 1px solid #c3ab7c !important; }
html.av2 #online-count { color: #2c5340 !important; }

/* ---------- 17. light mode: parchment + brass ---------- */

html.av2[data-mode="light"] body {
  background: #e7d7b4 !important;
  color: #2a1a11 !important;
}
html.av2[data-mode="light"] body::before {
  background:
    radial-gradient(90% 52% at 50% -6%, rgba(255, 248, 220, .96) 0%, rgba(226, 206, 168, .6) 44%, transparent 74%),
    linear-gradient(180deg, #f0e3c4 0%, #e4d3ad 46%, #d5c096 78%, #c4ad81 100%) !important;
}
html.av2[data-mode="light"] body::after {
  background-image:
    repeating-linear-gradient(90deg, rgba(110, 72, 34, .12) 0 2px, transparent 2px 58px),
    repeating-linear-gradient(0deg, rgba(110, 72, 34, .09) 0 2px, transparent 2px 58px),
    linear-gradient(0deg, rgba(196, 173, 129, .7), rgba(196, 173, 129, 0)) !important;
}
html.av2[data-mode="light"] #p-grain { opacity: .12 !important; mix-blend-mode: multiply !important; }
html.av2[data-mode="light"] #p-vig {
  background: radial-gradient(112% 88% at 50% 40%, transparent 46%, rgba(120, 88, 46, .34) 100%) !important;
}
html.av2[data-mode="light"] #chrome {
  border-color: #8d6120 !important;
  background: #d9c49b !important;
  box-shadow:
    inset 0 0 0 2px #f4e7c8,
    inset 0 0 0 4px rgba(141, 97, 32, .6),
    0 0 0 2px #6b4526,
    0 22px 48px rgba(70, 46, 20, .4) !important;
}
html.av2[data-mode="light"] #titlebar {
  background: linear-gradient(180deg, #f7e6b8 0%, #d8a63f 48%, #a97b22 100%) !important;
  border-bottom-color: #6b4526 !important;
  color: #2a1a11 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 226, .7) !important;
}
html.av2[data-mode="light"] #titlebar .ttitle { color: #2a1a11 !important; }
html.av2[data-mode="light"] #titlebar .tbtns b,
html.av2[data-mode="light"] #theme-toggle {
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #fdf3d6 0%, #dfc48c 100%) !important;
  border-color: #6b4526 !important;
  box-shadow: inset 0 1px 0 #fffdf4 !important;
  text-shadow: none !important;
}
html.av2[data-mode="light"] #titlebar .tbtns b.x { background: linear-gradient(180deg, #c0503f 0%, #912f24 100%) !important; color: #fff1e8 !important; }
html.av2[data-mode="light"] #theme-toggle { color: #6b4526 !important; }
html.av2[data-mode="light"] #wintabs { background: #d9c49b !important; border-bottom-color: #8d6120 !important; }
html.av2[data-mode="light"] #wintabs .wt {
  color: #5c3a22 !important;
  background: linear-gradient(180deg, #eadcbb 0%, #d9c49b 100%) !important;
  border-right-color: #8d6120 !important;
  text-shadow: 0 1px 0 rgba(255, 252, 236, .7) !important;
}
html.av2[data-mode="light"] #wintabs .wt:hover { color: #2a1a11 !important; background: linear-gradient(180deg, #f7e6b8 0%, #e4d3ad 100%) !important; }
html.av2[data-mode="light"] #wintabs .wt.on { color: #2a1a11 !important; }
html.av2[data-mode="light"] #top {
  background: linear-gradient(180deg, #8c2b26 0%, #6d1f1b 50%, #4e1512 100%) !important;
}
html.av2[data-mode="light"] #main { background: none !important; }
html.av2[data-mode="light"] .vhead h2 { color: #2a1a11 !important; -webkit-text-stroke: 0; text-shadow: 0 2px 0 rgba(255, 252, 236, .8) !important; }
html.av2[data-mode="light"] .backbtn {
  color: #2a1a11 !important;
  background: linear-gradient(180deg, #fdf3d6 0%, #dfc48c 100%) !important;
  border-color: #6b4526 !important;
  text-shadow: 0 1px 0 #fffdf4 !important;
}
html.av2[data-mode="light"] .grid::before { color: #6b4526 !important; text-shadow: 0 1px 0 rgba(255, 252, 236, .8) !important; border-bottom-color: #a97b22 !important; }
html.av2[data-mode="light"] .tile,
html.av2[data-mode="light"] .panel,
html.av2[data-mode="light"] .duel-card {
  background: linear-gradient(180deg, #fdf7e6 0%, #f0e3c4 60%, #e4d3ad 100%) !important;
  border-color: #6b4526 !important;
  color: #3a2413 !important;
  box-shadow:
    inset 0 0 0 2px rgba(169, 123, 34, .7),
    inset 0 3px 0 #fffdf4,
    inset 0 -4px 0 rgba(141, 97, 32, .3),
    0 4px 0 #6b4526,
    0 8px 14px rgba(90, 60, 20, .28) !important;
}
html.av2[data-mode="light"] .tile .nm { color: #2a1a11 !important; }
html.av2[data-mode="light"] .tile .sub { color: #6b4526 !important; }
html.av2[data-mode="light"] .msg { color: #5c3a22 !important; }
html.av2[data-mode="light"] .cards,
html.av2[data-mode="light"] .rtable {
  background-image:
    repeating-linear-gradient(46deg, rgba(255, 255, 255, .07) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(-46deg, rgba(0, 0, 0, .12) 0 1px, transparent 1px 4px),
    radial-gradient(130% 96% at 50% -8%, #3f7355 0%, #2c5340 58%, #1b3927 100%) !important;
}
html.av2[data-mode="light"] #history-list > *,
html.av2[data-mode="light"] .history > * { background: #fdf7e6 !important; color: #4a2d19 !important; border-bottom-color: #d0bc94 !important; }

/* ---------- 18. motion + phone ---------- */

@media (prefers-reduced-motion: reduce) {
  html.av2 #top .balance .usd { animation: none !important; }
  html.av2 .view { animation: none !important; }
  html.av2 #ticker span { animation-duration: 100s !important; }
  html.av2 .tile:hover { transform: none !important; }
}
@media (max-width: 430px) {
  html.av2 #win { padding: 4px 4px 0 !important; }
  html.av2 #top { padding: 8px 9px !important; gap: 8px !important; }
  html.av2 .brand { font-size: 22px !important; }
  html.av2 .brand span { font-size: 12px !important; vertical-align: 2px; }
  html.av2 .brand small { font-size: 6px !important; letter-spacing: .3em !important; }
  html.av2 #top .balance b { font-size: 14px !important; }
  html.av2 #wintabs .wt { padding: 9px 10px 8px !important; font-size: 8px !important; letter-spacing: .1em !important; }
  html.av2 #main { padding: 9px !important; perspective: none !important; }
  html.av2 .grid { gap: 7px !important; }
  html.av2 .grid::before { font-size: 8.5px !important; letter-spacing: .14em !important; }
  html.av2 .tile { padding: 8px !important; gap: 8px !important; box-shadow:
    inset 0 0 0 2px rgba(216, 166, 63, .75),
    inset 0 2px 0 rgba(255, 253, 238, .85),
    inset 0 -3px 0 rgba(122, 92, 52, .45),
    0 4px 0 #2b1a10 !important; }
  html.av2 .tile .ico { width: 34px !important; height: 34px !important; }
  html.av2 .tile .ico svg { width: 22px !important; height: 22px !important; }
  html.av2 .tile .nm { font-size: 10px !important; }
  html.av2 .tile .sub { font-size: 6px !important; }
  html.av2 .hero { min-height: 124px !important; padding: 14px 12px 13px !important; }
  html.av2 .hlog { font-size: 30px !important; -webkit-text-stroke: 1.5px #180d08; }
  html.av2 .hsub { font-size: 6.5px !important; letter-spacing: .2em !important; }
  html.av2 .jpticker span { font-size: 15px !important; }
  html.av2 .panel { padding: 8px !important; }
  html.av2 .vhead h2 { font-size: 13px !important; }
  html.av2 #p-grain { opacity: .07 !important; }
  html.av2 #taskbar { padding: 5px 7px !important; gap: 5px !important; }
  html.av2 .tb-item { padding: 6px 7px !important; font-size: 7px !important; }
  html.av2 #startbtn { padding: 7px 9px !important; font-size: 8px !important; }
}
@media (max-width: 360px) {
  html.av2 .grid { grid-template-columns: 1fr !important; }
}