:root{
  --bg:#12100c;
  --surface:#1d1a13;
  --text:#f7f3ea;
  --muted:#a99e88;
  --primary:#ff8a1f;
  --primary-text:#17130c;
  --border:#2f2a1f;
  --font-heading:'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-body:'Segoe UI', system-ui, -apple-system, sans-serif;
  --radius-md:12px;
  --radius-lg:20px;
  --space-md:16px;
  --space-lg:32px;
  --space-xl:64px;
  --motion-duration:0.5s;
  --motion-ease:cubic-bezier(0.2, 0.7, 0.2, 1);
  --content-max:72rem;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);line-height:1.6;display:grid;grid-template-columns:260px minmax(0,1fr);align-items:start;}
a{color:inherit;overflow-wrap:break-word;}
img{max-width:100%;}
h1,h2,h3,h4{overflow-wrap:break-word;}

/* Left rail: full height, stacked, sticky. */
.site-nav{grid-row:1/-1;align-self:stretch;position:sticky;top:0;height:100vh;overflow:auto;padding:var(--space-lg);background:var(--surface);border-right:1px solid var(--border);}
.site-nav-inner{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-lg);max-width:none;margin:0;}
.site-logo-link{margin:0;display:inline-flex;align-items:center;text-decoration:none;}
.site-logo{display:inline-flex;align-items:center;height:40px;margin:0;}
.site-logo img,.site-logo svg{height:40px;width:auto;max-width:200px;object-fit:contain;display:block;}
.nav-links{display:flex;flex-direction:column;align-items:flex-start;gap:0.75rem;width:100%;}
.nav-links a{color:var(--muted);text-decoration:none;font-weight:600;transition:color 0.2s var(--motion-ease);}
.nav-links a:hover{color:var(--text);}
.nav-cta{margin-top:auto;padding:0.6rem 1.2rem;border-radius:var(--radius-lg);font-weight:700;text-decoration:none;color:var(--primary-text) !important;background:var(--primary);text-align:center;}

/* Content sits in the right column. */
main,.site-footer{grid-column:2;}

.hero{padding:var(--space-xl) var(--space-lg);max-width:60rem;margin:0 auto;text-align:left;position:relative;}
.hero h1{font-family:var(--font-heading);font-size:clamp(2rem,4vw,3rem);line-height:1.1;margin:0 0 var(--space-md);}
.hero p{color:var(--muted);font-size:1.2rem;margin:0;max-width:42rem;}
.hero-badge{display:inline-block;margin-bottom:var(--space-md);padding:0.3rem 0.9rem;border:1px solid var(--border);border-radius:999px;font-size:0.8rem;color:var(--muted);}
.hero-graphic{position:absolute;top:var(--space-lg);right:var(--space-lg);width:96px;height:96px;opacity:0.4;pointer-events:none;}
.hero-graphic svg{width:100%;height:100%;}

.btn{display:inline-block;padding:0.85rem 1.75rem;border-radius:var(--radius-lg);text-decoration:none;font-weight:600;}
.btn-primary{background:var(--primary);color:var(--primary-text);}
.btn-secondary{background:transparent;color:var(--text);border:1px solid var(--border);}
.cta{display:flex;gap:var(--space-md);padding:0 var(--space-lg) var(--space-xl);flex-wrap:wrap;}

.features{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg);padding:0 var(--space-lg) var(--space-xl);max-width:64rem;margin:0 auto;}
@media (max-width:760px){.features{grid-template-columns:1fr;}}
.feature{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;}
.feature-media{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;background:var(--bg);overflow:hidden;}
.feature-media img{width:100%;height:100%;object-fit:cover;display:block;}
.feature-icon{width:64px;height:64px;color:var(--primary);}
.feature-icon svg{width:100%;height:100%;}
.feature-text{padding:var(--space-lg);flex:1 1 auto;min-width:0;}
.feature h3{margin:0 0 var(--space-md);font-family:var(--font-heading);}
.feature p{margin:0;color:var(--muted);}
.feature-foot{padding:var(--space-md) var(--space-lg) var(--space-lg);border-top:1px solid var(--border);}
.feature-btn{display:block;width:100%;text-align:center;}

.closing{text-align:left;max-width:60rem;margin:0 auto;padding:var(--space-xl) var(--space-lg);}
.closing h2{font-family:var(--font-heading);font-size:1.8rem;margin:0 0 var(--space-md);}
.closing p{color:var(--muted);max-width:42rem;margin:0 0 var(--space-lg);}

.prose{max-width:46rem;margin:0;padding:var(--space-xl) var(--space-lg);}
.prose h1{font-family:var(--font-heading);font-size:2rem;margin:0 0 var(--space-lg);}
.prose h2{font-family:var(--font-heading);margin:var(--space-lg) 0 var(--space-md);}
.prose h3{font-family:var(--font-heading);font-size:1.05rem;margin:var(--space-lg) 0 var(--space-md);}
.prose p{color:var(--muted);margin:0 0 var(--space-md);}
.prose ul{color:var(--muted);margin:0 0 var(--space-md);padding-left:1.35rem;}
.prose li{margin:0 0 0.4rem;}
.prose li strong,.prose p strong{color:var(--text);}
.prose a:not(.btn){color:var(--primary);}
.legal-meta{font-size:0.85rem;}
.disclaimer{color:var(--muted);font-size:0.8rem;padding:0 var(--space-lg) var(--space-md);max-width:48rem;}

.game-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-lg);padding:0 var(--space-lg) var(--space-xl);max-width:64rem;margin:0 auto;}
@media (max-width:560px){.game-grid{grid-template-columns:1fr;}}
.game-tile{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--surface);text-decoration:none;color:var(--text);}
.game-thumb{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;background:var(--bg);overflow:hidden;}
.game-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.game-thumb span{width:64px;height:64px;color:var(--primary);}
.game-thumb svg{width:100%;height:100%;}
.game-name{padding:var(--space-md);font-weight:600;text-align:center;}
.game-detail{max-width:64rem;margin:0 auto;padding:var(--space-lg);}
.game-detail h1{font-family:var(--font-heading);margin:0 0 var(--space-lg);}
.game-frame{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border);background:#000;}
.game-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.game-embed{max-width:460px;margin:0 auto;}
.game-embed iframe{width:100%;height:860px;border:0;display:block;border-radius:var(--radius-md);overflow:hidden;}
.game-desc{color:var(--muted);max-width:46rem;margin:var(--space-lg) 0;}
.game-back{display:inline-block;margin-top:var(--space-md);color:var(--primary);text-decoration:none;}

.site-footer{border-top:1px solid var(--border);padding:var(--space-lg);}
.footer-cols{display:grid;gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));max-width:60rem;margin:0 auto var(--space-lg);}
.footer-brand p{color:var(--muted);font-size:0.85rem;margin:var(--space-md) 0 0;}
.footer-logo{display:inline-flex;height:28px;margin-bottom:var(--space-md);}
.footer-logo img,.footer-logo svg{height:28px;width:auto;max-width:200px;object-fit:contain;}
.footer-col h3{font-family:var(--font-heading);font-size:0.9rem;font-weight:700;margin:0 0 var(--space-md);}
.footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:0.4rem;}
.footer-col a{color:var(--muted);text-decoration:none;font-size:0.85rem;}
.footer-col a:hover{color:var(--primary);}
.footer-bottom{display:flex;flex-direction:column;gap:var(--space-lg);text-align:center;color:var(--muted);font-size:0.8rem;border-top:1px solid var(--border);padding-top:var(--space-lg);max-width:60rem;margin:0 auto;}
.block-page{min-height:60vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--space-lg);}

/* Stack the rail into a top bar on narrow screens. */
@media (max-width:860px){
  body{display:block;}
  .site-nav{position:relative;height:auto;overflow:visible;border-right:0;border-bottom:1px solid var(--border);}
  .site-nav-inner{flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--space-md);}
  .nav-links{flex-direction:row;flex-wrap:wrap;width:auto;}
  .nav-cta{margin-top:0;}
  main,.site-footer{grid-column:auto;}
}

.bg-animated{animation:bg-pan 18s ease infinite;}
@keyframes bg-pan{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}
/* Motion presets (phase 13). */
/* hero_stagger: transform-only entrance so the LCP hero copy paints immediately and never shifts layout. */
.motion-stagger > *{animation:rise var(--motion-duration) var(--motion-ease) both;}
.motion-stagger > *:nth-child(2){animation-delay:0.08s;}
.motion-stagger > *:nth-child(3){animation-delay:0.16s;}
.motion-stagger > *:nth-child(4){animation-delay:0.24s;}
@keyframes rise{from{transform:translateY(10px);}to{transform:none;}}
/* scroll_reveal: JS-gated so content stays visible if the script never runs. */
.motion-ready [data-reveal]{opacity:0;transform:translateY(14px);transition:opacity var(--motion-duration) var(--motion-ease),transform var(--motion-duration) var(--motion-ease);}
.motion-ready [data-reveal].is-visible{opacity:1;transform:none;}
/* hover_micro */
.motion-hover .btn{transition:transform 0.15s var(--motion-ease),box-shadow 0.15s var(--motion-ease);}
.motion-hover .btn:hover,.motion-hover .btn:focus-visible{transform:translateY(-2px);}
.motion-hover .feature{transition:transform 0.2s var(--motion-ease),border-color 0.2s var(--motion-ease);}
.motion-hover .feature:hover{transform:translateY(-3px);border-color:var(--primary);}
/* Always honor the OS preference. */
@media (prefers-reduced-motion: reduce){
  .bg-animated{animation:none;}
  .motion-stagger > *{animation:none;}
  .motion-ready [data-reveal]{opacity:1;transform:none;transition:none;}
  .motion-hover .btn,.motion-hover .feature{transition:none;}
}
/* Per-site hard off-switch. */
.motion-reduced .bg-animated{animation:none;}
.motion-reduced [data-reveal]{opacity:1 !important;transform:none !important;transition:none !important;}
.motion-reduced .motion-stagger > *{animation:none !important;}

/* Age gate: 19+, Canada excluding Quebec. */
.ag-overlay{position:fixed;inset:0;z-index:9999;background:rgba(9,8,6,0.94);padding:24px;display:flex;align-items:center;justify-content:center;overflow:auto;}
.ag-box{background:var(--surface);border:1px solid var(--border);border-radius:14px;max-width:420px;width:100%;padding:32px 28px;text-align:center;box-shadow:0 18px 50px rgba(0,0,0,0.55);}
.ag-mark{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border:2px solid var(--primary);border-radius:50%;font-weight:700;font-size:17px;color:var(--primary);margin:0 0 16px;}
.ag-q{font-size:20px;font-weight:600;letter-spacing:-0.01em;margin:0 0 10px;color:var(--text);}
.ag-note{font-size:13.5px;line-height:1.55;color:var(--muted);margin:0 0 22px;}
.ag-actions{display:flex;flex-direction:column;gap:10px;}
.ag-btn{display:block;width:100%;padding:13px 18px;border-radius:9px;font-size:15px;font-weight:600;border:1px solid transparent;cursor:pointer;font-family:inherit;}
.ag-btn-yes{background:var(--primary);color:var(--primary-text);}
.ag-btn-no{background:transparent;color:var(--muted);border-color:var(--border);}
.ag-legal{font-size:12px;color:var(--muted);margin:18px 0 0;line-height:1.5;}
.ag-legal a{color:var(--primary);}

/* Responsible-play block, sits in the footer bottom bar. */
.rg-inner{max-width:760px;margin:0 auto;text-align:center;}
.rg-age{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:2px solid var(--primary);border-radius:50%;font-weight:700;font-size:15px;margin:0 0 14px;color:var(--primary);}
.rg-title{font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--muted);margin:0 0 10px;}
.rg-body,.rg-help{font-size:14px;line-height:1.65;color:var(--muted);margin:0 0 14px;}
.rg-help{margin-bottom:0;}
.rg-body strong{color:var(--text);}
.rg-help a{color:var(--primary);}

[hidden]{display:none !important;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
a,button{-webkit-tap-highlight-color:transparent;}
.btn,.nav-links a,.nav-cta,.nav-toggle,.game-tile,.site-logo-link{-webkit-user-select:none;user-select:none;}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}

/* Burger: only needed once the rail collapses into a top bar. */
.nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;padding:0;background:transparent;border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;}
.nav-toggle span{position:relative;display:block;width:20px;height:2px;background:currentColor;transition:background 0.2s var(--motion-ease);}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:currentColor;transition:transform 0.2s var(--motion-ease);}
.nav-toggle span::before{top:-6px;}
.nav-toggle span::after{top:6px;}
.nav-toggle[aria-expanded="true"] span{background:transparent;}
.nav-toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}

@media (max-width:860px){
  .nav-toggle{display:inline-flex;order:3;}
  .site-nav-inner{flex-wrap:nowrap;}
  .site-logo-link{flex:0 1 auto;min-width:0;}
  .nav-cta{order:2;margin-left:auto;}
  .nav-links{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:0;background:var(--surface);border-bottom:1px solid var(--border);box-shadow:0 18px 40px rgba(0,0,0,0.45);z-index:40;}
  .site-nav.is-open .nav-links{display:flex;}
  .nav-links a{padding:0.85rem var(--space-lg);border-top:1px solid var(--border);color:var(--text);}
}
@media (max-width:520px){
  .site-nav{padding:var(--space-md);}
  .nav-cta{padding:0.55rem 1rem;font-size:0.9rem;}
  .nav-links a{padding:0.85rem var(--space-md);}
  .hero,.closing,.prose{padding-left:var(--space-md);padding-right:var(--space-md);}
  .features,.game-grid{padding-left:var(--space-md);padding-right:var(--space-md);}
  .site-footer,.game-detail{padding:var(--space-md);}
}
@media (max-width:380px){
  .site-logo,.site-logo img,.site-logo svg{height:32px;}
  .nav-cta{padding:0.5rem 0.8rem;font-size:0.85rem;}
}
