:root {
  --bg: #1F1F2E;
  --bg-2: #1F1F2E;
  --card: #2E2E3D;
  --brand: #2E2E3D;
  --line: #494B63;
  --line-soft: rgba(86, 98, 140, .19);
  --accent: #FABF26;
  --accent-2: #FFD700;
  --accent-soft: #524B33;
  --title: #FFFFFF;
  --text: #BCBCC2;
  --muted: #A3A3AD;
  --yellow: #FABF26;
  --ok: #66FF66;
  --no: #FF6666;
  --ink: #000000;
  --track: #666666;
  --foot: #141414;
}

body { background: linear-gradient(135deg, #1F1F2E, #2D2D3F); background-color: #1F1F2E; }
.skip { color: var(--ink); }

.btn-primary { color: var(--ink); }
.btn-primary:hover { background: #FFCB45; }
.btn-secondary { background: transparent; border-color: var(--yellow); color: #fff; }
.btn-secondary:hover { border-color: #FFCB45; background: rgba(250, 191, 38, .1); }

.nav.is-solid, .nav.is-open { background: #1F1F2E; border-bottom-color: var(--line-soft); }
.nav-links a { color: rgba(255, 255, 255, .86); }
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--yellow); }
.flag, .burger { background: var(--card); border-color: var(--line); }

.hero.world::after { background:
    linear-gradient(90deg, rgba(31, 31, 46, .8) 0%, rgba(31, 31, 46, .55) 48%, rgba(31, 31, 46, .4) 100%),
    linear-gradient(180deg, rgba(31, 31, 46, .35) 0%, rgba(31, 31, 46, .2) 55%, var(--bg) 100%); }
.hero.world .hero-art::before { background: radial-gradient(circle, rgba(250, 191, 38, .16) 0%, rgba(250, 191, 38, .05) 45%, transparent 70%); }
.hero-art img { filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .5)); }

.promo2 { background: var(--yellow); border-color: #E0A814; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .7); }
.promo-ic { background: rgba(0, 0, 0, .12); border-color: rgba(0, 0, 0, .2); color: var(--ink); }
.promo-text { color: var(--ink); }
.promo-code { background: rgba(0, 0, 0, .08); border-color: rgba(0, 0, 0, .55); color: var(--ink); }
.btn-light { background: #1F1F2E; color: #fff; }
.btn-light:hover { background: #2E2E3D; }
.btn-light:focus-visible { outline-color: #1F1F2E; }
.promo-copy.is-done { background: #1F1F2E; color: var(--ok); }

.picker { background: rgba(86, 98, 140, .19); border-color: var(--line-soft); box-shadow: 0 30px 70px -40px rgba(0, 0, 0, .8); }
.rs-track { background: var(--track); }
.rs-fill { background: var(--accent-2); }
.rs-dot { background: #8A8A8F; }
.rs-dot.on { background: #6B5400; }
#ram-slider::-webkit-slider-thumb { background: #fff; border-color: var(--accent-2); box-shadow: 0 6px 16px rgba(0, 0, 0, .55); }
#ram-slider::-moz-range-thumb { background: #fff; border-color: var(--accent-2); box-shadow: 0 6px 16px rgba(0, 0, 0, .55); }
#ram-slider:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 6px rgba(250, 191, 38, .35), 0 6px 16px rgba(0, 0, 0, .55); }
.rs-ticks span.sel b { color: var(--accent-2); }

.mini { background: var(--bg-2); border-color: var(--line-soft); }
.mini:hover { border-color: var(--line); }
.mini-price::after { color: #E2E2E6; }
.mini[aria-pressed="true"] { background: rgba(250, 191, 38, .14); border-color: var(--yellow); box-shadow: inset 0 0 0 1px var(--yellow); }
.mini[aria-pressed="true"]::after { background-color: var(--yellow); }

.picker-card { background: var(--card); border-color: rgba(250, 191, 38, .45); }
.pc-k { color: var(--yellow); }
.runs { background: rgba(0, 0, 0, .22); border-color: var(--line); }
.plan-top { border-bottom-color: var(--line); }
.plan-ram { color: var(--accent-2); }
.plan-features li { color: #DDDDDD; }
.plan-features svg { background: var(--accent-soft); color: var(--accent-2); }

.gp { background: var(--bg-2); border-color: var(--line-soft); }
.gl-plan { background: var(--card); border-color: var(--line); }
.gsearch input { background: var(--card); border-color: var(--line); }
.gonly { color: #E6E6EA; }
.gonly .sw { background: var(--track); border-color: #7A7A80; }
.gonly .sw::after { background: #E6E6EA; }
.gonly input:checked + .sw::after { background: var(--ink); }
.gscroll { scrollbar-color: #5F5F70 transparent; }
.game-item { --flash-on: rgba(102, 255, 102, .2); --flash-off: rgba(255, 102, 102, .2); background: var(--card); border-color: var(--line-soft); }
.game-item.supported .gi-mark { background: rgba(102, 255, 102, .14); }
.game-item.unsupported { background: #262636; }
.game-item.unsupported .gi-mark { background: rgba(255, 102, 102, .14); }
.game-item.unsupported .taid { color: #B4B4BC; }
.game-item.unsupported .game-req { color: #FFA8A8; }

.band-world::after { background: linear-gradient(180deg, var(--bg) 0%, rgba(31, 31, 46, .55) 20%, rgba(31, 31, 46, .55) 80%, #262635 100%), linear-gradient(90deg, rgba(31, 31, 46, .45), rgba(31, 31, 46, .7)); }
.feat { --tone: var(--line); background: var(--card); box-shadow: 0 4px 20px rgba(0, 0, 0, .1); }
.feat.t1, .feat.t2, .feat.t3, .feat.t4, .feat.t5, .feat.t6 { --tone: var(--line); --tile: var(--accent-soft); --ic: var(--accent-2); }
.hw-card h3 { color: var(--accent-2); }
.hw-card p { color: #fff; }

.faq { background: var(--card); border-color: var(--line-soft); }
.faq[open] { border-color: var(--line); }

.foot { background: var(--foot); border-top-color: #262626; }
.foot-h { color: var(--yellow); }
.foot-about, .foot-list a, .foot-loc, .foot-bottom { color: rgba(255, 255, 255, .74); }
.foot-list a:hover { color: var(--yellow); }
.foot-list .foot-ck { color: rgba(255, 255, 255, .74); }
.foot-list .foot-ck:hover { color: var(--yellow); }
.foot-strip { background: #1E1E1E; border-color: #2E2E2E; }
.foot-bottom { border-top-color: #262626; }

:root { --bg: #0A0C22; --bg-2: #0F1230; }
body { background: var(--bg); background-color: var(--bg); }
.sec.alt { background: var(--bg-2); }
.nav.is-solid, .nav.is-open { background: var(--bg); }
.hero.world::after { background:
    linear-gradient(90deg, rgba(10, 12, 34, .78) 0%, rgba(10, 12, 34, .5) 48%, rgba(10, 12, 34, .38) 100%),
    linear-gradient(180deg, rgba(10, 12, 34, .35) 0%, rgba(10, 12, 34, .2) 55%, var(--bg) 100%); }
.hero.world .hero-art::before { background: radial-gradient(circle, rgba(110, 123, 255, .42) 0%, rgba(110, 123, 255, .12) 45%, transparent 70%); }
.band-world::after { background: linear-gradient(180deg, var(--bg) 0%, rgba(10, 12, 34, .3) 20%, rgba(10, 12, 34, .3) 80%, var(--bg) 100%), linear-gradient(90deg, rgba(10, 12, 34, .45), rgba(10, 12, 34, .7)); }
.foot { background: #070919; }
