:root{font-family:-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',sans-serif;color:#f0f3ff;background:#11192b;--muted:#a9b5cf;--mint:#bcf4c5;--line:#33405a}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 8% 10%,#263c59,transparent 60%),#11192b}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #f7d684;outline-offset:3px}[hidden]{display:none!important}main{max-width:1140px;margin:auto;padding:25px 30px}header,.section-top{display:flex;justify-content:space-between;align-items:center}a{color:inherit;text-decoration:none}header>div{display:flex;align-items:center;gap:18px;font-size:12px;color:var(--muted)}.brand{font:25px Jua,sans-serif;color:var(--mint)}button{border:1px solid var(--line);background:#24324a;border-radius:12px;padding:10px 14px}header button{font-size:11px}.intro{display:flex;align-items:end;justify-content:space-between;margin:35px 0 25px}.eyebrow{font-size:10px;letter-spacing:2px;color:#a7c5c5}h1{font:43px/1.12 Jua,sans-serif;margin:12px 0 0;letter-spacing:-1px}h1 em{font-style:normal;color:var(--mint)}.intro p{font-size:14px;line-height:1.8;color:var(--muted)}.layout{display:grid;grid-template-columns:minmax(0,580px) minmax(290px,1fr);gap:28px;align-items:start}.game{border:1px solid #40516a;border-radius:25px;padding:20px;background:#1b2840;box-shadow:0 15px 50px #0003}.scores{display:flex;gap:32px;margin:0 5px 17px;align-items:center}.scores small{display:block;font-size:10px;color:#a6b7d0;margin-bottom:5px}.scores strong{font:30px Jua,sans-serif}.scores .streak{margin-left:auto;text-align:right;color:var(--mint)}.board-shell{position:relative}.board-shell>#board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px;padding:8px;background:#101b30;border:1px solid #334561;border-radius:15px;touch-action:none}.cell{aspect-ratio:1;padding:0;border:0;border-radius:6px;background:#26334c;box-shadow:inset 0 1px 2px #ffffff05;transition:background .12s,transform .12s}.cell.filled,.mini{background:var(--color);box-shadow:inset 0 3px 0 #ffffff35,inset 0 -4px 0 #0002}.cell.ghost{background:var(--color);opacity:.48;outline:2px dashed #fff9;outline-offset:-3px}.cell.bad{background:#b46678}.cell.flash{animation:flash .45s}.cell.target{outline:2px dashed #c5e7ff;outline-offset:-4px}.cell:hover{filter:brightness(1.12)}#tray{display:flex;gap:10px;justify-content:space-around;margin-top:18px;touch-action:none}.piece{width:32%;height:94px;padding:12px;display:flex;justify-content:center;align-items:center;background:#142036;border:2px solid transparent;touch-action:none}.piece[aria-pressed=true]{border-color:#b6d7ff;background:#2b3d59;box-shadow:0 0 18px #7fa9ff16}.piece:disabled{background:#19253b}.shape{display:grid;gap:3px;pointer-events:none}.mini{width:19px;height:19px;border-radius:4px}.mini.empty{visibility:hidden}#guide{font-size:12px;text-align:center;line-height:1.7;min-height:40px;color:#b7d4ea;margin:15px 0 8px}.game-tools{display:flex;justify-content:space-between}.game-tools button{background:none;border:0;color:#a6b7d0;font-size:11px}.discovery,.album{border:1px solid #36445d;background:#202c43;border-radius:23px;padding:23px}.discovery h2{font:24px Jua,sans-serif;margin:18px 0 9px}.discovery p{font-size:12px;line-height:1.7;color:var(--muted)}#sparks{color:#e8d99d;font:20px Jua}.discovery canvas#memory{display:block;width:100%;max-height:170px;object-fit:contain;background:#152137;border-radius:12px;margin:16px 0}label{font-size:11px;display:block;margin:12px 0 8px}label small{color:#8999b2;margin-left:10px}input{width:100%;padding:12px;border-radius:10px;border:1px solid #3a4a64;background:#142037;color:#e8efff;font-size:12px}.primary{width:100%;margin-top:12px;background:var(--mint);color:#244238;border:none;font-weight:700;padding:15px;box-shadow:0 4px 0 #749b7e}#ai-status{font-size:11px;color:#aac0cf;line-height:1.7;margin-top:15px}#cancel{font-size:11px;margin-top:8px}.reading{display:block;text-align:left;width:100%;margin-top:10px;background:#293750;padding:13px}.reading strong{font:17px Jua,sans-serif;display:block;margin-bottom:6px}.reading span{font-size:11px;line-height:1.7;color:#bbcade}.reading[aria-pressed=true]{border-color:var(--mint)}.actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.actions button{flex:1;font-size:12px;background:#34475a}.art{width:100%;border-radius:12px;margin-top:16px}#creation h3{font:21px Jua}#creation p{font-size:12px}.album{margin-top:18px}.album h3{font:19px Jua;margin:0}.album p{font-size:11px;color:var(--muted)}#album{display:flex;flex-direction:column;gap:8px;margin-top:12px}#album button{text-align:left;font-size:12px;background:#17243a}#album-count{font-size:12px;color:var(--mint)}#burst{position:absolute;top:38%;left:0;right:0;text-align:center;font:35px Jua;color:#fff6b1;pointer-events:none;text-shadow:0 3px 20px #000;opacity:0}#burst.show{animation:burst 1s}#gameover{position:absolute;inset:0;border-radius:15px;background:#102039ef;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}#gameover span{color:#c5dcbe}#gameover h2{font:48px Jua;margin:15px}#gameover p{font-size:13px;line-height:1.8;color:#c0cce0}#again{background:var(--mint);color:#173d28;font-weight:700}footer{font-size:11px;color:#a1b1c7;line-height:1.9;text-align:center;margin:25px 0}footer span{font-size:10px;color:#7c90aa}@keyframes burst{0%{opacity:0;transform:scale(.7)}25%,70%{opacity:1;transform:scale(1)}100%{opacity:0;transform:translateY(-25px)}}@keyframes flash{50%{background:#fff5ac;transform:scale(.8)}}@media(max-width:760px){main{padding:17px 13px}.intro{margin:25px 0 20px}.intro p{display:none}h1{font-size:35px}.layout{grid-template-columns:1fr;gap:20px}.game{padding:13px}.board-shell>#board{gap:4px;padding:6px}.cell{border-radius:5px}.piece{height:82px}.mini{width:17px;height:17px}.scores strong{font-size:26px}.discovery{padding:20px}.brand{font-size:22px}header>div{gap:10px;font-size:10px}.eyebrow{font-size:8px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media(min-width:761px) and (max-height:900px){main{padding-top:18px}.intro{margin:18px 0}.intro h1{font-size:30px}.intro h1 br{display:none}.intro h1 em{margin-left:8px}.intro p{font-size:12px;margin:0}.board-shell{max-width:min(100%,calc(100dvh - 360px));margin:auto}.piece{height:64px}.mini{width:15px;height:15px}.scores{margin-bottom:12px}.scores strong{font-size:25px}.game{padding:15px}.discovery{padding:20px}.discovery canvas#memory{max-height:125px}}
@media(max-width:380px){.mini{width:12px;height:12px}.shape{gap:2px}.piece{padding:8px;height:72px}}

.intro h1{font-size:36px}.intro p{max-width:310px}
#sound{border-color:#8cae9f;color:#d0f7d5}#sound[aria-pressed=true]{background:#bcf4c5;color:#18372c}
.score-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 3px 12px;font-size:11px;color:#c3d6eb}
#score-state{font-size:10px;color:#a4b9d1;text-align:right;max-width:65%}
.board-shell{isolation:isolate}#board{position:relative;z-index:0}
#playhead{position:absolute;pointer-events:none;z-index:1;border:1px solid #d6f9e470;border-radius:5px;background:#d6f9e414;box-shadow:0 0 18px #c6f8de16}
#score-effects{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;border-radius:15px}
.score-particle{position:absolute;display:grid;place-items:center;transform:translate(-50%,-50%);border-radius:9px;color:var(--note-color);pointer-events:none}
.score-particle.scan,.score-particle.place{border:2px solid var(--note-color);box-shadow:0 0 12px var(--note-color)}
.score-particle.clear{font:clamp(22px,4.3vw,42px)/1 sans-serif;text-shadow:0 0 18px var(--note-color)}
#burst{z-index:3;font-size:27px}#gameover{z-index:4}
.score-strip{display:flex;align-items:center;gap:10px;font-size:9px;color:#8fa8c1;margin:12px 3px 0}
#score-steps{display:grid;grid-template-columns:repeat(8,1fr);gap:7px;flex:1}
#score-steps i{height:3px;border-radius:5px;background:#40536c}#score-steps i.current{background:#baf3cf;box-shadow:0 0 7px #baf3cf55}
#score-help{font-size:10px;color:#91a8bd;text-align:center;margin:8px 0 0}
.instrument-key{display:flex;justify-content:center;gap:16px;font-size:10px;margin:0 0 8px;color:#adc1d2}
.instrument-key span{color:var(--voice-color)}
@media(min-width:761px) and (max-height:900px){.intro h1{font-size:27px}.board-shell{max-width:min(100%,max(320px,calc(100dvh - 420px)))}.score-caption{margin-bottom:8px}.score-strip{margin-top:8px}#tray{margin-top:12px}#guide{margin-top:10px;min-height:35px}.intro p{font-size:11px}}
@media(max-width:760px){.intro h1{font-size:30px}.score-caption{font-size:10px}#score-state{font-size:9px}.instrument-key{gap:12px;font-size:9px}.score-particle.clear{font-size:30px}}
@media(max-width:380px){.intro h1{font-size:26px}.score-caption{gap:6px}.instrument-key{gap:9px}}
@media(prefers-reduced-motion:reduce){.score-particle{box-shadow:none!important;text-shadow:none!important}.score-particle.clear{font-size:25px}#burst.show{opacity:1}#playhead{display:none}}