/* RCB v3 / Lighting pass 01
 * Additive art-direction layer. Layout, typography metrics and content are unchanged.
 * Reference: limestone / antique gold / oxblood velvet / graphite / shaded foliage.
 * No image backgrounds, external textures, generated renders or new UI sections.
 */
:root {
  --ink: #141210;
  --wine: #47151d;
  --wine-light: #70303a;
  --green: #283a29;
  --gold: #c7a16a;
  --gold-bright: #ead2a8;
  --text: #eee5d6;
  --muted: #b3a699;
  --line: rgba(200, 166, 111, .23);
}
html { background: #19130f; }
::selection { background: #c7a16a; color: #1b130e; }
.world {
  --light-x: 0px;
  --light-y: 0px;
  --light-angle: 0deg;
  --halo-x: 74%;
  --halo-y: 46%;
  --light-strength: 1;
  background:
    radial-gradient(ellipse at 89% 12%, rgba(179, 146, 102, .31), transparent 51%),
    radial-gradient(ellipse at 63% 52%, rgba(133, 103, 71, .18), transparent 60%),
    radial-gradient(ellipse at 17% 36%, rgba(87, 24, 35, .64), transparent 68%),
    radial-gradient(ellipse at 87% 95%, rgba(46, 62, 39, .66), transparent 62%),
    #191613;
  isolation: isolate;
}
.world-light { z-index: 0; opacity: .4; filter: blur(48px); }
.light-wine {
  background: radial-gradient(circle, rgba(111, 28, 42, .72), transparent 66%);
}
.light-green {
  background: radial-gradient(circle, rgba(59, 78, 40, .47), transparent 66%);
}
.world-grid { opacity: .18; z-index: 0; }
.world-grain { z-index: 6; opacity: .045; mix-blend-mode: soft-light; }
.world-vignette {
  z-index: 5;
  background:
    linear-gradient(90deg, rgba(17, 9, 10, .73), rgba(15, 11, 9, .22) 43%, transparent 73%),
    linear-gradient(0deg, rgba(11, 15, 11, .58), transparent 35%),
    radial-gradient(ellipse at 70% 39%, transparent 35%, rgba(12, 9, 8, .38));
}
#crest-canvas, .css-3d-ready .world-fallback { position: absolute; z-index: 3; }
.rcb-atmosphere {
  position: absolute; inset: 0; z-index: 1; overflow: hidden;
  pointer-events: none; contain: layout paint style;
}
.rcb-atmosphere > div { position: absolute; pointer-events: none; }
.light-architecture {
  inset: -10% -5% -10% 39%;
  background: repeating-linear-gradient(90deg,
    transparent 0 14.5%, rgba(8, 10, 7, .16) 14.7%,
    rgba(232, 205, 161, .075) 15.05%, rgba(242, 221, 180, .012) 15.3%,
    transparent 15.8% 29%);
  mask-image: linear-gradient(0deg, transparent 0, #000 22%, #000 90%, transparent);
  transform: translate3d(calc(var(--light-x) * -.12), 0, 0) skewY(-6deg);
  opacity: .75;
}
.light-halo {
  inset: 0;
  background:
    radial-gradient(ellipse 30% 35% at var(--halo-x) var(--halo-y), rgba(227, 192, 137, .16), transparent 80%),
    radial-gradient(ellipse 16% 30% at 94% 5%, rgba(232, 211, 172, .24), transparent 80%);
  opacity: var(--light-strength);
}
.light-source {
  width: 70%; height: 79%; right: -25%; top: -37%;
  background: radial-gradient(ellipse, rgba(249, 226, 185, .36), rgba(181, 136, 78, .13) 34%, transparent 66%);
  transform: translate3d(var(--light-x), var(--light-y), 0);
}
.light-rays {
  inset: -15% -10% -20% 24%;
  transform-origin: 86% 0;
  transform: translate3d(var(--light-x), var(--light-y), 0) rotate(var(--light-angle));
  filter: blur(5px); opacity: .67; mix-blend-mode: screen;
}
.light-rays::before, .light-rays::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(151deg, rgba(249, 224, 182, .37), rgba(217, 186, 139, .1) 44%, transparent 77%);
}
.light-rays::before { clip-path: polygon(85% 0, 96% 0, 34% 100%, 2% 100%); }
.light-rays::after {
  clip-path: polygon(66% 0, 71% 0, 9% 100%, 0 100%);
  opacity: .55;
}
.light-shutter {
  top: -16%; right: -12%; width: 76%; height: 132%;
  background: repeating-linear-gradient(122deg, transparent 0 89px, rgba(16, 17, 10, .15) 91px 114px, transparent 120px 199px);
  mask-image: radial-gradient(ellipse at 86% 4%, #000 0, #0008 22%, transparent 68%);
  transform: translate3d(calc(var(--light-x) * -.45), calc(var(--light-y) * .3), 0);
  filter: blur(2px);
}
.light-drape {
  top: -15%; bottom: -20%; left: -8%; width: 25%;
  background:
    repeating-linear-gradient(92deg, rgba(8, 4, 4, .5) 0, rgba(8, 4, 4, .06) 11%, rgba(121, 52, 53, .26) 15%, rgba(19, 4, 7, .56) 23%, rgba(82, 24, 33, .16) 31%),
    linear-gradient(90deg, #381017, #541d28 57%, #281414);
  mask-image: linear-gradient(90deg, #000, #000 65%, transparent);
  transform: translate3d(calc(var(--light-x) * .2), 0, 0) rotate(-7deg);
  opacity: .55;
}
.light-drape-right {
  left: auto; right: -8%; width: 20%;
  transform: translate3d(calc(var(--light-x) * -.16), 0, 0) rotate(8deg) scaleX(-1);
  opacity: .39;
}
.webgl-ready .light-drape { display: none; }
.lighting-dust { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 4; pointer-events: none; }

/* Existing UI surfaces: reflected room light, not extra panels. */
.site-header { border-bottom-color: rgba(220, 183, 129, .17); }
.site-header.scrolled { background: rgba(24, 17, 14, .91); }
.desktop-nav a { color: #d4c7b7; }
.discipline-pill {
  background: linear-gradient(115deg, rgba(78, 45, 29, .2), rgba(24, 22, 16, .26));
  box-shadow: inset 0 1px 0 rgba(246, 223, 180, .055);
  color: #e8dbc6;
}
.brand-crest { filter: drop-shadow(0 1px 1px #080604) drop-shadow(0 0 13px #d5a86320); }
.hero h1 { filter: drop-shadow(0 5px 17px #160c0966); }
.hero h1 span:first-child { color: #eee5d6; }
.hero h1 span:last-child {
  color: #e2c38c;
  background: linear-gradient(112deg, #b8894f 1%, #dec18b 25%, #f2dfb6 56%, #c89d61 91%);
  background-clip: text; -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero-watermark { -webkit-text-stroke-color: rgba(205, 172, 115, .037); }
.button-gold {
  color: #27190f;
  background: linear-gradient(112deg, #b89259, #e9ce9b 64%, #c39b61);
  border-color: #dfbc81;
  box-shadow: inset 0 1px 0 #ffedcc77, 0 7px 28px #08060250, 0 0 27px #d8ae6610;
}
.button-gold:hover {
  background: linear-gradient(112deg, #cca56b, #f4dfb8 64%, #d1af77);
  box-shadow: inset 0 1px 0 #fff0dacc, 0 7px 30px #08060260, 0 0 30px #d8ae662c;
}
.hero-floor { box-shadow: 0 -1px 0 rgba(235, 202, 146, .025); }
.crest-caption, .caption-hairline { color: #ceb083; }
.section-game, .scroll-cue { color: #bbaf9e; }
.glass-panel {
  background:
    radial-gradient(ellipse at 83% 0, rgba(197, 155, 89, .14), transparent 65%),
    linear-gradient(116deg, rgba(62, 29, 28, .89), rgba(28, 32, 23, .94));
  box-shadow: inset 0 1px 0 rgba(242, 213, 164, .13), inset 1px 0 0 rgba(221, 185, 126, .03), 0 25px 60px #05080340;
}
.match-row:hover { background: rgba(217, 181, 117, .065); }
.empty-match-art { color: #d2ae75; }
.unknown-mark { color: #a4977d; background: linear-gradient(150deg, #d7b78714, #6a794812); }
.roster-slot, .player-card,
.roster-slot:nth-child(2n), .player-card:nth-child(2n) {
  background:
    radial-gradient(ellipse at 85% -10%, rgba(215, 180, 117, .18), transparent 63%),
    linear-gradient(139deg, rgba(71, 26, 32, .88), rgba(27, 36, 24, .88));
  box-shadow: inset 0 1px 0 rgba(240, 209, 158, .13), 0 15px 40px #09090422;
  border-color: rgba(188, 151, 96, .27);
}
.roster-slot:nth-child(3) {
  background:
    radial-gradient(ellipse at 78% 0, rgba(208, 173, 113, .22), transparent 69%),
    linear-gradient(141deg, rgba(85, 32, 36, .92), rgba(35, 42, 28, .92));
  border-color: rgba(203, 164, 106, .42);
}
.slot-emblem { color: #d0ac76; filter: drop-shadow(7px 8px 0 #090d0960) drop-shadow(0 0 17px #d9b17012); }
.roster-empty-label { color: #b0a293; }
.player-card:hover { border-color: #d7b17a; }
.player-shade { background: linear-gradient(transparent 30%, #171810 95%); }
.product-card {
  background:
    radial-gradient(ellipse at 81% -18%, rgba(205, 164, 100, .16), transparent 64%),
    linear-gradient(114deg, rgba(69, 30, 30, .94), rgba(30, 35, 25, .93));
  box-shadow: inset 0 1px 0 rgba(242, 211, 163, .13), 0 19px 40px #09080633;
}
.product-mark {
  background: radial-gradient(ellipse at 90% 0, #a7865333, transparent 68%), linear-gradient(140deg, #522731, #222c20);
  border-color: #be995c77;
  box-shadow: inset 0 1px 0 #ead0a344, 0 8px 24px #08050260;
}
.product-arrow { background: linear-gradient(140deg, #d4b17906, #caa15e10); }
.product-card:hover { box-shadow: inset 0 1px 0 #edd0a333, 0 22px 45px #09080650; }

/* Pointer-following reflection stays below text, never captures input. */
.product-card::before, .player-card::before, .match-row::before {
  content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: radial-gradient(260px circle at var(--surface-x, 75%) var(--surface-y, 10%), rgba(250, 223, 174, .09), transparent 76%);
  opacity: 0; transition: opacity .4s;
}
.match-row { position: relative; }
.product-card.light-hover::before, .player-card.light-hover::before, .match-row.light-hover::before,
.product-card:focus-visible::before, .player-card:focus-visible::before, .match-row:focus-visible::before { opacity: 1; }

.mobile-menu { background: rgba(31, 19, 17, .98); }
.motion-toggle { background: rgba(23, 22, 16, .88); }
.entrance { background: #160e0c; }
.gate { background: radial-gradient(ellipse at 100% 0, #c3995226, transparent 65%), linear-gradient(100deg, #211113, #481c24); }
.detail-dialog {
  background: radial-gradient(ellipse at 100% 0, #b18b5020, transparent 62%), linear-gradient(135deg, #312320, #1b2219);
  box-shadow: inset 0 1px 0 #e5c08c25, 0 30px 120px #0009;
}
.detail-dialog::backdrop { background: rgba(13, 11, 8, .76); }
.footer-bottom { color: #afa08f; }
.toast { background: #242219; border-color: #c7a16a55; }

/* Same twelve-layer fallback crest. Only its material and edge light change. */
.css-crest-layer svg { filter: none; }
.css-crest-layer.crest-front svg { filter: drop-shadow(0 1px 1px #f2d6a95c) drop-shadow(-7px 12px 12px #0807045c); }
.css-orbit {
  border-top-color: #e4c38a; border-right-color: #b68f51;
  border-bottom-color: #8f6f43; border-left-color: #c2a170;
  box-shadow: 1px -1px 0 #ebd3a270, 4px 4px 0 #634b2e, 0 -2px 19px #dcb47710;
}
.css-orbit-main::after {
  content: ''; position: absolute; top: 4.5%; right: 22%; width: 12%; height: 2px;
  border-radius: 50%; background: #ffe6b3; opacity: .5;
  transform: rotate(29deg); filter: blur(2px); box-shadow: 0 0 14px #efc27b;
}
.css-orbit-fine { opacity: .43; box-shadow: none; }
.css-orbit-cross { opacity: .2; box-shadow: none; }
.css-spark { opacity: .3; box-shadow: 0 0 8px #d2ac6333; }

@media(max-width:760px) {
  .world {
    background:
      radial-gradient(ellipse at 99% 29%, rgba(170, 138, 95, .25), transparent 55%),
      radial-gradient(ellipse at 16% 39%, rgba(82, 25, 35, .73), transparent 72%),
      radial-gradient(ellipse at 77% 96%, rgba(46, 62, 39, .6), transparent 67%), #1a1512;
  }
  .light-rays { inset: -6% -16% -10% 0; opacity: .38; filter: blur(3px); }
  .light-source { width: 110%; right: -59%; top: -16%; height: 74%; opacity: .8; }
  .light-architecture { left: 20%; opacity: .34; }
  .light-shutter { opacity: .6; }
  .light-drape { width: 30%; opacity: .3; }
  .light-drape-right { opacity: .19; }
  .light-halo { background: radial-gradient(ellipse 49% 31% at var(--halo-x) var(--halo-y), #dcc08e19, transparent 80%); }
  .world-vignette { background: linear-gradient(0deg, #0d120e5c, transparent 32%), linear-gradient(90deg, #160b105c, transparent 69%); }
  .hero h1 { filter: drop-shadow(0 3px 13px #150c0b88); }
}
@media(prefers-reduced-motion:reduce) {
  .light-rays, .light-source, .light-drape, .light-shutter, .light-architecture { transform: none; }
}
@media(forced-colors:active) {
  .rcb-atmosphere, .lighting-dust { display: none; }
  .hero h1 span:last-child { background: none; -webkit-text-fill-color: CanvasText; color: CanvasText; }
}
