:root{color-scheme:dark;--cream:#fbefd5;--muted:#c1c1ac;--gold:#eccb83;--ink:#102723;--panel:rgba(17,37,32,.94);font-family:ui-sans-serif,system-ui,-apple-system,sans-serif;color:var(--cream);background:#102723}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(90deg,rgba(9,26,24,.88),rgba(9,26,24,.65)),var(--scene) center/cover fixed}button,input,select{font:inherit}button{cursor:pointer;border:1px solid #647068;background:#253e36;color:var(--cream);border-radius:12px;min-height:46px;padding:11px 18px;transition:background .15s,transform .15s}button:hover{background:#385347}button:active{transform:translateY(1px)}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:4px}button:disabled{opacity:.52;cursor:default}button.primary{background:var(--gold);color:#243329;border-color:var(--gold);font-weight:700}button.primary:hover{background:#ffe2a2}.shell{max-width:1440px;margin:auto;padding:26px 42px}header{display:flex;align-items:center;gap:20px;margin-bottom:34px}.brand{display:flex;align-items:center;gap:12px;margin-right:auto}.brand img{width:46px;height:46px;border-radius:12px}.wordmark{font-family:Georgia,serif;font-size:30px;letter-spacing:5px}.brand small{display:block;color:var(--muted);font-size:11px;letter-spacing:2px;text-transform:uppercase}.nav{display:flex;gap:7px}.nav button{border-color:transparent;background:transparent;color:var(--muted)}.nav button.active{background:#344a3e;color:var(--cream);border-color:#66725c}.sound{padding:10px 13px}.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);font-weight:700}h1,h2,h3,p{margin-top:0}h1{font:42px/1.12 Georgia,serif;margin-bottom:12px}h2{font:28px Georgia,serif;margin-bottom:18px}h3{font:22px Georgia,serif;margin-bottom:8px}p{line-height:1.6;color:var(--muted)}.layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:36px;align-items:center}.play-space{min-width:0}.play-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}.play-heading h1{margin:6px 0 0}.pill{border:1px solid #657060;border-radius:30px;font-size:12px;padding:8px 12px;white-space:nowrap;color:var(--gold)}.board{position:relative;width:min(100%,620px);aspect-ratio:1;margin:0 auto;border-radius:6%;filter:drop-shadow(0 22px 28px #0007)}.board-art{width:100%;height:100%;position:absolute;inset:0}.connections{position:absolute;pointer-events:none}.board svg{position:absolute;inset:0;pointer-events:none;width:100%;height:100%}.point{position:absolute;width:19%;height:19%;min-height:0;padding:0;background:transparent!important;border:0;display:grid;place-items:center;border-radius:50%;transform:translate(-50%,-50%)!important;touch-action:manipulation}.point img{width:88%;height:88%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 4px 3px #0005)}.point .dot{width:10px;height:10px;background:#291d13;border-radius:50%;box-shadow:0 1px 1px #ffdf9c77}.point.selected:after,.point.target:after,.point.focus:after{content:'';position:absolute;inset:3px;border:3px solid #ffdb88;border-radius:50%;box-shadow:0 0 16px #ffce6866}.point.target:after{inset:21%;border:2px dashed #fff0be}.board-note{text-align:center;font-size:12px;color:#b8bfae;margin:18px 0 0}.panel{background:var(--panel);border:1px solid #536451;border-radius:24px;padding:26px;box-shadow:0 20px 45px #0002}.player{display:flex;align-items:center;gap:12px;border:1px solid #526255;border-radius:15px;padding:13px;margin:12px 0}.player.current{border-color:var(--gold);background:#3a4833}.player img{height:46px;width:46px;object-fit:contain;border-radius:50%}.player strong,.player small{display:block}.player small{color:var(--muted);font-size:12px;margin-top:4px}.stone-dot{height:32px;width:32px;background:radial-gradient(circle at 35% 25%,#62696a,#151819 60%);border:1px solid #88928a;border-radius:50%;margin:7px}.stone-dot.white{background:radial-gradient(circle at 35% 25%,white,#d3c8b4 80%)}.stack{display:grid;gap:10px}.divider{height:1px;background:#536451;margin:22px 0}.status{font-size:22px;font-family:Georgia,serif;margin:20px 0 8px;color:var(--cream)}.caption{color:#ecd6a6;font-style:italic;font-size:14px;min-height:24px}.toolbar{display:flex;gap:10px;flex-wrap:wrap}.intro{margin-bottom:26px;max-width:680px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.character{padding:0;overflow:hidden;display:flex;flex-direction:column}.character>img{display:block;width:100%;height:auto;object-fit:contain}.character .info{padding:19px;display:flex;flex-direction:column;flex:1}.character p{font-size:13px;min-height:42px;margin-bottom:16px}.character button{width:100%;margin-top:auto}.meta{display:flex;justify-content:space-between;margin:8px 0 16px;font-size:12px;color:var(--gold)}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.tabs .active{border-color:var(--gold);color:var(--gold)}.cosmetic img{width:100%;aspect-ratio:1.5;object-fit:contain;padding:15px;background:#ffffff09;border-radius:12px}.cosmetic{padding:18px}.cosmetic p{font-size:12px}.cosmetic button{width:100%}.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:22px 0}.stat{background:#ffffff08;padding:18px 10px;text-align:center;border-radius:12px}.stat strong{font:30px Georgia,serif;display:block;color:var(--gold)}.stat small{font-size:11px;color:var(--muted)}input,select{border:1px solid #728173;border-radius:10px;padding:13px;background:#152e27;color:var(--cream);width:100%;margin:8px 0 14px}label{font-size:14px}.notice{border-left:3px solid var(--gold);padding:10px 14px;background:#ffffff06;margin:20px 0;color:var(--muted);font-size:14px;line-height:1.6}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#f0d69f;color:#21332a;border-radius:12px;padding:13px 22px;box-shadow:0 4px 20px #0005;z-index:4;max-width:90vw}footer{display:flex;justify-content:space-between;gap:20px;margin-top:36px;font-size:11px;color:#a8b3a0}.loading{padding:60px}.lesson-title{margin-bottom:10px}.lesson .layout{align-items:start}.lesson .board{max-width:540px}progress{width:100%;height:7px;accent-color:var(--gold)}dialog{background:#142e27;border:1px solid #8b9574;border-radius:20px;color:var(--cream);max-width:430px;padding:28px}dialog::backdrop{background:#0009}.mobile-label{display:none}@media(min-width:1500px){.shell{padding-top:40px}}@media(max-width:1050px){.shell{padding:22px}.layout{grid-template-columns:minmax(0,1fr) 290px;gap:22px}.panel{padding:20px}.grid{grid-template-columns:repeat(3,1fr)}.brand small{display:none}.nav{gap:0}.nav button{padding:10px 12px}}@media(max-width:760px){.shell{padding:16px}header{flex-wrap:wrap;margin-bottom:25px;gap:12px}.brand{margin-right:auto}.wordmark{font-size:26px}.nav{order:3;flex-basis:100%;overflow:auto;justify-content:space-between}.nav button{font-size:13px;padding:10px 12px;white-space:nowrap}.layout{grid-template-columns:1fr;gap:24px}.play-heading{margin-bottom:18px}h1{font-size:32px}.board{max-width:510px}.layout>.panel{max-width:510px;width:100%;margin:auto}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.character .info{padding:14px}.character p{min-height:64px}.profile-grid{grid-template-columns:1fr}.board-note{margin-top:14px}footer{flex-direction:column;gap:6px;margin-top:26px}.panel{border-radius:18px}.pill{font-size:11px}.cosmetic{padding:14px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
details{border:1px solid #536451;border-radius:12px;padding:14px}summary{cursor:pointer;min-height:24px;color:var(--gold)}details[open] summary{margin-bottom:14px}input[readonly]{font-size:13px;letter-spacing:.3px}button[disabled]+input{opacity:.7}
@media(max-width:760px){.nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;overflow:visible}.nav button{width:100%}.play-heading{flex-wrap:wrap;align-items:flex-start}.play-heading>div{flex-basis:100%}.play-heading .pill{max-width:100%}}