/* Built around the approved artwork: moonlit Boneyard → amber-lit City. */
:root {
  --bg: #0b1218;
  --card: #152129;
  --card-hi: #1d2b31;
  --ink: #eee6d7;
  --muted: #bbc3c5;
  --gold: #e4bd82;
  --gold-deep: #a7723e;
  --line: rgba(181, 196, 200, .15);
  --line-gold: rgba(202, 157, 100, .34);
  --gold-grad: linear-gradient(120deg, #f1dfbb, #d9ad71 62%, #bd864b);
  --gold-text: linear-gradient(105deg, #e8e4db 5%, #d4dde1 38%, #e8c390 76%, #d4a166);
  --display: "Baskerville", "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --radius: 10px;
}
body {
  background: linear-gradient(105deg, #101e2a 0%, #101b22 35%, #102322 67%, #251d17 100%);
  background-attachment: fixed;
}
header.site-head {
  background: linear-gradient(100deg, #111e29 0%, #111d22 54%, #302219 100%);
  border-bottom-color: rgba(216, 180, 128, .25);
}
.site-head .brand span {color: #e9dfce; font-family: Georgia, serif; font-size: clamp(15px, 2vw, 22px); letter-spacing: .065em;}
.ticker {background: linear-gradient(100deg, #172b3c, #172824 60%, #3c2c1c); color: #d5c4a9; border-color: rgba(205, 174, 132, .22);}
.all-pages-panel {background: #13212a; border-color: #65706c;}
.all-pages > summary {color: #e5c494;}
.nav > ul a {color: #e8e4dc;}
.nav > ul a:hover, .nav > ul a[aria-current] {color: #efcf9c;}
.hero.hero-approved {
  position: relative;
  isolation: isolate;
  padding: 0 0 52px;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 2% 12%, rgba(48, 91, 129, .62), transparent 51%),
    radial-gradient(ellipse at 96% 19%, rgba(170, 103, 38, .37), transparent 50%),
    radial-gradient(ellipse at 65% 70%, rgba(24, 79, 66, .34), transparent 55%),
    linear-gradient(105deg, #101e2a, #111c22 42%, #162723 73%, #292015);
}
.hero.hero-approved::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: url('/img/boneyard-corrected-zero-two.webp') center top / 1600px auto no-repeat;
  filter: blur(50px);
  opacity: .18;
  pointer-events: none;
}
.hero.hero-approved .wrap {max-width: 1480px; padding: 0; gap: 0;}
.hero.hero-approved h1 {position: relative; margin: 0; padding: 0;}
.hero.hero-approved h1 img {
  width: 100%; max-width: none; height: auto; border: 0; border-radius: 0;
  -webkit-mask-image: linear-gradient(to bottom, #000 98%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 98%, transparent 100%);
}
.hero.hero-approved .hero-copy {max-width: 850px; padding: 22px 28px 0;}
.hero.hero-approved .display {
  font-family: var(--display);
  font-size: clamp(31px, 5.2vw, 58px);
  line-height: 1.12;
  letter-spacing: -.025em;
  text-transform: none;
  margin: 12px 0 22px;
  text-shadow: 0 2px 22px rgba(0, 0, 0, .22);
}
.hero.hero-approved .eyebrow {color: #d3c7b4; font-size: 14px; letter-spacing: .045em;}
.hero.hero-approved .lede {color: #e0e4df; font-size: clamp(17px, 2.1vw, 20px); max-width: 660px;}
.hero.hero-approved .rack {display: none;}
.hero.hero-approved .fine {color: #b9c5c6;}
.hero.hero-approved .btns {margin-top: 26px;}
.hero.hero-approved::after {content: ""; position: absolute; left: 8%; right: 8%; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, #637b89 22%, #b28a57 76%, transparent);}
.btn-gold {box-shadow: 0 6px 22px rgba(185, 133, 66, .18); color: #201b15;}
.btn-line {background: rgba(16, 32, 39, .68); border-color: #8b8b76; color: #eee6d7;}
.btn-line:hover {background: #233c40; border-color: #d9b77f;}
.section {border-top-color: rgba(173, 191, 196, .15); background: transparent;}
.section:nth-of-type(even) {background: linear-gradient(110deg, rgba(32, 54, 70, .35), rgba(20, 38, 36, .2) 65%, rgba(79, 53, 28, .22));}
.felt, .page-head.felt {background: linear-gradient(110deg, #1b2c3b, #17292a 58%, #33281b);}
.steel {background: linear-gradient(110deg, #29343e, #1d2b2f 65%, #2a302e);}
.section h2, .page-head h1, .doc h1 {font-family: var(--display); text-transform: none; letter-spacing: -.02em; line-height: 1.15;}
.section h2 {font-size: clamp(31px, 4.4vw, 46px);}
.eyebrow {color: #d0b28a;}
.card, .launch-panel, .app-art-card, .event, .note, .notify, .callout, .soon li, .desk {
  background: linear-gradient(125deg, rgba(31, 49, 62, .94), rgba(24, 41, 41, .96) 70%, rgba(47, 41, 32, .94));
  border-color: rgba(166, 179, 176, .23);
  box-shadow: 0 10px 26px rgba(5, 11, 15, .13);
}
.card h3, .launch-panel h3 {color: #eee4d4;}
.card p {color: #c1cbcb;}
.current-game-clips video {border-color: #7f8882; box-shadow: 0 16px 32px #070e1466;}
.site-foot {background: linear-gradient(105deg, #0d1823, #102020 66%, #292016);}
.brand-connect {background: linear-gradient(100deg, #122331, #172c28 65%, #30251a);}
@media(max-width:600px) {
  .nav > ul a {background: rgba(45, 65, 75, .48); border-color: rgba(174, 192, 194, .18);}
  .all-pages > summary {background: rgba(37, 48, 49, .55);}
  .hero.hero-approved {padding-bottom: 36px;}
  .hero.hero-approved .hero-copy {padding: 18px 20px 0;}
  .hero.hero-approved .display {font-size: clamp(30px, 8vw, 42px);}
  .hero.hero-approved .eyebrow {font-size: 12px;}
  .hero.hero-approved::before {filter: none; background: none;}
}