:root{color-scheme:dark;--bg:#181a18;--surface:#25312b;--text:#f4efdf;--muted:#d5d2c5;--outline:#a5aca0;--primary:#f4efdf;--on-primary:#321b18;--accent:#ffd19b;font:125%/1.6 system-ui,sans-serif;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0}a{color:var(--accent);text-underline-offset:.2em}button,select,textarea{font:inherit}button,.button,select{min-height:2.4rem}button,.button{border:1px solid var(--outline);border-radius:.5rem;padding:.6rem .85rem;cursor:pointer;line-height:1.4;background:var(--surface);color:var(--text);text-decoration:none}button:disabled{opacity:.55;cursor:default}.primary{background:var(--primary);color:var(--on-primary);border-color:var(--primary);font-weight:650}button:hover:enabled,.button:hover{outline:2px solid var(--accent)}:focus-visible{outline:3px solid #ffdc85;outline-offset:4px}header,main{max-width:1440px;margin:auto;padding:1.5rem 3rem}header{display:flex;justify-content:space-between;gap:1.5rem;border-bottom:1px solid #465363;flex-wrap:wrap}nav{display:flex;gap:1.25rem;flex-wrap:wrap}.wordmark{color:var(--text);font-weight:750;text-decoration:none;letter-spacing:.06em}.wordmark span{font-weight:400;color:var(--muted)}.hero{padding:3.5rem 0 4rem;max-width:45rem}.eyebrow{color:var(--accent);letter-spacing:.08em;font-weight:650}h1{font-size:clamp(2.25rem,5vw,4.25rem);line-height:1.12;letter-spacing:normal;margin:.6rem 0 1.25rem}h2{font-size:1.7rem;line-height:1.3}h3{font-size:1.2rem;line-height:1.4}p{max-width:68ch}.intro{font-size:1.2rem;max-width:43ch}.button{display:inline-flex;gap:3rem;align-items:center;margin:.5rem 0}.muted{color:var(--muted)}.section-heading,.play-header{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}.section-heading{border-top:1px solid var(--outline);padding-top:1rem}#play,#help,#exercise{scroll-margin-top:1rem}#status{border-left:4px solid var(--accent);padding:.75rem 1rem;background:var(--surface);max-width:none;min-height:3rem}.play-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(15rem,1fr);gap:2rem;margin-top:1rem}.board-scroll{overflow-x:auto;padding:5px;border:1px solid var(--outline);border-radius:.5rem}.board{display:grid;grid-template-columns:repeat(8,minmax(2.4rem,1fr));min-width:19.2rem}.square{border:1px solid #5a6776;border-radius:0;min-height:3.3rem;padding:.15rem;font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.25;background:#263646;color:#fff}.square.light{background:#ddd8e6;color:#171720}.square.selected{box-shadow:inset 0 0 0 4px #bb7800}.square.available{box-shadow:inset 0 0 0 3px #08745c}.square:focus-visible{outline-offset:-5px;z-index:1}.coordinate{font-weight:400}.legend{display:flex;gap:.5rem 1.25rem;flex-wrap:wrap}.controls{background:var(--surface);border:1px solid #465363;border-radius:.75rem;padding:1.25rem}.controls h3{margin-top:0}label{display:block;margin:.75rem 0 .3rem}select,textarea{display:block;width:100%;min-width:0;max-width:100%;background:#10161c;color:var(--text);border:1px solid var(--outline);border-radius:.3rem;padding:.5rem}select{white-space:normal}textarea{overflow-wrap:anywhere}.actions{display:flex;gap:.6rem;flex-wrap:wrap}.actions>*{flex:1 1 10rem}hr{border:0;border-top:1px solid #586579;margin:1.25rem 0}.evidence{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin:2rem 0}.evidence>div{min-width:0}.evidence button{margin:.75rem .25rem .75rem 0}.evidence li{padding:.5rem 0;overflow-wrap:anywhere}.prose{max-width:72ch;margin:4rem auto;padding-top:1.5rem;border-top:1px solid var(--outline)}summary{cursor:pointer;min-height:2.4rem;padding:.6rem}details{border:1px solid var(--outline);border-radius:.5rem;padding:.5rem 1rem}footer{border-top:1px solid var(--outline);padding:1rem 0 2rem;overflow-wrap:anywhere}.skip{position:absolute;top:-100px;left:1rem;background:var(--bg);padding:1rem;z-index:5}.skip:focus{top:0}[hidden]{display:none!important}
@media(max-width:1050px){header,main{padding:1.25rem}.play-layout{grid-template-columns:1fr}.square{min-height:3.6rem}.evidence{grid-template-columns:1fr}}
@media(max-width:450px){header,main{padding:1rem}.hero{padding:2rem 0}.wordmark span{display:block}h2{font-size:1.4rem}.controls{padding:.8rem}.square{min-height:3.5rem}.button{gap:1rem}.board{min-width:22rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){.square.selected{outline:4px solid Highlight}.square.available{outline:2px dashed Highlight}}
/* Keep intrinsic board and enlarged text widths inside their layout tracks. */
.play-layout>div{min-width:0}h1,h2,h3,p,a,button,label,summary{overflow-wrap:anywhere}
@media(max-width:1050px){.play-layout,.evidence{grid-template-columns:minmax(0,1fr)}}

/* Chapter presentation: shared palette, no remote assets or parallel game state. */
.hero{max-width:none;display:grid;grid-template-columns:minmax(0,2fr) minmax(8rem,1fr);gap:2rem;align-items:center}.hero>div{min-width:0}.chapter-symbol{width:100%;max-width:15rem;justify-self:center;fill:none;stroke:#f4efdf;stroke-width:5}.chapter-symbol ellipse{stroke:#ef6464;fill:#a51f2c}#chapter{max-width:70ch;margin-bottom:3rem}#chapter p{margin-bottom:2em}#story-choices{display:grid;margin-bottom:1.5rem}.view-controls{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}.view-controls [aria-pressed=true]{border:3px double var(--text)}.board-scroll:has(.fixed-3d){perspective:1100px;padding:3rem 1rem}.board.fixed-3d{transform:rotateX(22deg);transform-origin:center;transform-style:preserve-3d}.fixed-3d .square{box-shadow:0 5px 0 #121b15}.fixed-3d .square.selected{outline:4px solid #ffdc85}.fixed-3d .square.available{border:3px dashed #08745c}.square{background:#283c32;color:#f4efdf}.square.light{background:#e7e1cd;color:#181a18}
@media(max-width:600px){.hero{grid-template-columns:minmax(0,1fr)}.chapter-symbol{max-width:8rem}.board-scroll:has(.fixed-3d){padding:2rem .25rem}}

/* Studio breathing signature: decorative mark only; no gameplay timing. */
.chapter-symbol{animation:symbol-breathe 7s ease-in-out infinite}
@keyframes symbol-breathe{0%,100%{opacity:1}50%{opacity:.65}}
@media(prefers-reduced-motion:reduce){.chapter-symbol{animation:none;opacity:1}}
#cards{max-width:70ch;margin:2rem 0}#cards select{margin-bottom:1rem}#card-log li{margin:1rem 0}
