@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap');

:root{--paper:#f7f5ef;--ink:#19142a;--muted:#5f586e;--purple:#563bb0;--lime:#dcfb76;--line:#ded8e5}
html{scroll-behavior:smooth}
body.site-page{background:var(--paper);color:var(--ink);font:16px/1.55 system-ui,sans-serif}
h1,h2,h3,.brand{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:700;letter-spacing:-.045em}
[hidden]{display:none!important}
.site-nav{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line);text-align:left;z-index:5}
.site-nav .container{max-width:1200px}
.site-nav a{color:var(--ink);text-decoration:none}
.site-nav .brand{display:inline-flex;align-items:center;gap:.65rem;font-size:1.5rem}
.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--ink);color:var(--lime);font:700 22px/1 system-ui}
.site-nav .nav-link{padding:.55rem .85rem!important;border-radius:.6rem;font-weight:650;color:var(--muted)}
.site-nav .nav-link:hover,.site-nav .nav-link.active{color:#432b94;background:#eae4fa}
.site-nav .navbar-toggler{background:transparent;color:var(--ink);border:1px solid var(--line);padding:.4rem .65rem}
.site-nav .navbar-toggler:focus-visible,.btn:focus-visible{outline:3px solid #8160e4;outline-offset:3px}
.hero{position:relative;overflow:hidden;background:#211638;color:#fff;border-radius:1.7rem;isolation:isolate}
.hero .row{min-height:380px}
.hero-copy{position:relative;z-index:1}
.hero h1{font-size:clamp(3.3rem,8vw,7.3rem);line-height:.9;margin:.7rem 0 1.2rem}
.hero h1 span{display:block;color:var(--lime)}
.hero p{max-width:34ch;color:#ded3ef}
.eyebrow{font:700 .76rem/1.4 system-ui;letter-spacing:.15em;text-transform:uppercase}
.hero .eyebrow{color:#d8b9ff}
.hero-art{display:block;width:min(100%,435px);max-height:390px;margin:auto}
.btn-accent{--bs-btn-color:#171325;--bs-btn-bg:#dcfb76;--bs-btn-border-color:#dcfb76;--bs-btn-hover-color:#171325;--bs-btn-hover-bg:#e8ffa3;--bs-btn-hover-border-color:#e8ffa3;font-weight:750}
.library-title{font-size:clamp(2.15rem,5vw,3.6rem)}
.library-note{color:var(--muted)}
.game-card{background:#fff;border:1px solid var(--line);border-radius:1.15rem;overflow:hidden;box-shadow:0 3px 10px #2e194809;transition:transform .2s,box-shadow .2s}
.game-card:hover{transform:translateY(-3px);box-shadow:0 10px 22px #2e194815}
.game-art{min-height:115px;position:relative;display:grid;place-items:center;background-color:var(--art,#ded3fa);color:#251a3a;background-image:radial-gradient(#28153921 1px,transparent 1px);background-size:12px 12px}
.game-art b{font:700 3.2rem/1 'Space Grotesk',system-ui;letter-spacing:-.1em;transform:rotate(-8deg);text-shadow:3px 3px #ffffff82}
.game-card h3{font-size:1.48rem}
.game-card p{color:var(--muted);font-size:.92rem}
.game-tag{color:#51406a;font-size:.72rem;font-weight:750;text-transform:uppercase;letter-spacing:.08em}
.btn-play{--bs-btn-color:#fff;--bs-btn-bg:#2d2045;--bs-btn-border-color:#2d2045;--bs-btn-hover-bg:#503583;--bs-btn-hover-color:#fff;--bs-btn-hover-border-color:#503583;font-weight:700}
.btn-stats{--bs-btn-color:#4e358f;--bs-btn-bg:#f1ebfb;--bs-btn-border-color:#f1ebfb;--bs-btn-hover-bg:#e4d7fa;--bs-btn-hover-color:#301d66;font-weight:700}
.site-footer{color:var(--muted);border-top:1px solid var(--line)}
body.game-page{background:radial-gradient(ellipse at 50% 2%,#352651,#171122 65%);color:#f7f2ff;max-width:none;margin:0;padding:0;min-height:100vh}
.game-page main{margin:clamp(16px,4vw,45px) auto;padding:clamp(14px,4vw,32px);max-width:min(calc(100% - 24px),720px);background:#231a36;border:1px solid #ffffff20;border-radius:1.35rem;box-shadow:0 18px 55px #10091f52}
.game-page main h1{font-size:clamp(2.3rem,7vw,4.2rem);line-height:1.05}
.game-page main a{color:#e0fba1!important}
.game-page main button:not(.grid button):not(#board button){border-radius:.65rem}
.game-page main input:not([type=checkbox]),.game-page main select{background:#332744;color:#fff;border:1px solid #746487;border-radius:.6rem;padding:.45rem .65rem;max-width:100%}
.game-page main input::placeholder{color:#d4c7e4}
.game-page main #setup{max-width:360px}
.game-page main #board,.game-page main #own{max-width:100%}
.game-page main [role=status]{min-height:1.5em}
.stats-panel{background:#fff;border:1px solid var(--line);border-radius:1.3rem}
.stats-panel .table{--bs-table-color:var(--ink);--bs-table-bg:transparent;--bs-table-striped-bg:#f6f1fc;--bs-table-border-color:var(--line)}
@media(max-width:767px){.hero-art{max-height:230px}.hero .row{min-height:0}.site-nav .navbar-collapse{padding:.65rem 0}.hero{border-radius:1.2rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.game-card{transition:none}}