:root{color-scheme:light;--paper: #f5f1e8;--paper-strong: #fbf9f4;--ink: #203a37;--muted: #697875;--line: #d8d1c5;--accent: #c96b43;--accent-dark: #a84e2b;--focus: #125d87;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{min-width:320px;scroll-behavior:smooth}body{min-width:320px;margin:0;background:var(--paper);color:var(--ink)}button,select,input{font:inherit}button,select{min-height:44px}button{color:inherit;cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--focus);outline-offset:3px}button:disabled{cursor:not-allowed;opacity:.65}.shell{width:min(1240px,calc(100% - 48px));margin:0 auto;padding-bottom:34px}.topbar{position:relative;min-height:74px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-size:11px;font-weight:800;letter-spacing:.14em}.brand img{flex:0 0 auto}.top-actions,.game-actions{display:flex;align-items:center;gap:10px}.language-select,.quiet-button,.secondary-button{border:1px solid var(--line);background:transparent;padding:0 14px;color:var(--ink)}.language-select{min-width:62px}.quiet-button{font-size:12px;font-weight:700}.quiet-button:hover,.secondary-button:hover{background:#203a370f}.settings-popover{position:absolute;z-index:4;right:0;top:64px;width:min(280px,90vw);padding:14px 16px;border:1px solid var(--line);background:var(--paper-strong);box-shadow:0 12px 28px #203a371f}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:18px;min-height:44px;font-size:13px}.setting-row input{width:22px;height:22px;accent-color:var(--ink)}.hero{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:42px;align-items:end;padding:55px 0 48px}.eyebrow{margin:0;color:var(--accent-dark);font-size:10px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}h1,h2,p{margin-top:0}h1,.section-heading h2,.game-center h2,.rules-card h2,.pause-card h2{font-family:Georgia,Times New Roman,serif;font-weight:500}h1{margin:14px 0 12px;font-size:clamp(42px,6vw,76px);line-height:.98;letter-spacing:-.045em}.intro{margin:0;color:var(--muted);font-size:15px}.progress-card{border-left:1px solid var(--line);padding:4px 0 4px 26px}.progress-card strong{display:block;font-family:Georgia,Times New Roman,serif;font-size:42px;font-weight:500;line-height:1}.progress-card strong span{color:#9aa19a;font-size:20px}.progress-card small{display:block;margin-top:8px;color:var(--muted);font-size:10px;letter-spacing:.09em;text-transform:uppercase}.progress-track{height:3px;margin-top:16px;background:#e6dfd2}.progress-track i{display:block;height:100%;background:var(--accent);transition:width .25s ease}.layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);gap:30px;align-items:stretch}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:16px;border-bottom:1px solid var(--line);padding-bottom:11px}.section-heading h2{margin:0;font-family:Georgia,Times New Roman,serif;font-size:27px;font-weight:500}.section-heading p{margin:0;color:var(--muted);font-size:11px;text-align:right}.level-map{display:grid;grid-template-columns:repeat(4,minmax(52px,1fr));gap:12px}.level-button{min-width:52px;min-height:64px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:999px;background:var(--paper-strong);font-family:Georgia,Times New Roman,serif;font-size:18px;transition:transform .15s ease,background .15s ease}.level-button:hover{transform:translateY(-2px);border-color:var(--accent)}.level-button.selected{border-color:var(--ink);background:var(--ink);color:var(--paper-strong)}.level-button.done:not(.selected){border-color:var(--accent)}.level-button small{color:var(--accent);font:700 12px system-ui,sans-serif}.map-hint{margin:14px 0 0;color:var(--muted);font-size:12px;line-height:1.55}.game-card{position:relative;min-height:456px;overflow:hidden;display:flex;flex-direction:column;padding:21px 24px 22px;background:var(--ink);color:var(--paper-strong)}.game-card:before{position:absolute;top:-155px;right:-110px;width:320px;height:320px;border:1px solid rgba(245,241,232,.12);border-radius:50%;content:"";pointer-events:none}.game-card-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px}.game-card-head .eyebrow{color:#e6a07f}.level-meta{margin:6px 0 0;color:#fbf9f4ad;font-size:11px}.game-actions .quiet-button{border-color:#fbf9f44d;color:var(--paper-strong);padding:0 11px}.game-actions .quiet-button:hover{background:#fbf9f41a}.game-center{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:25px 0 10px}.game-center .eyebrow{color:#e6a07f}.game-center h2{max-width:520px;margin:12px 0;font-size:clamp(25px,3vw,38px);line-height:1.12}.step-label{max-width:500px;margin:4px auto 14px;color:#fbf9f4bd;font-size:13px;line-height:1.5}.mode-switch{display:grid;grid-template-columns:1fr 1fr;width:min(360px,100%);margin:8px 0 16px;border:1px solid rgba(251,249,244,.3)}.mode-switch button{min-height:44px;border:0;background:transparent;color:var(--paper-strong);font-size:12px}.mode-switch button[aria-pressed=true]{background:var(--paper-strong);color:var(--ink);font-weight:750}.primary-button,.secondary-button,.text-button{min-height:46px;padding:0 18px;font-size:12px;font-weight:750}.primary-button{border:0;background:var(--accent);color:#fff}.primary-button:hover{background:#d77a50}.game-center>.primary-button{width:min(360px,100%)}.game-card .secondary-button{margin-top:8px;border-color:#fbf9f461;color:var(--paper-strong)}.game-card .secondary-button:hover{background:#fbf9f414}.text-button{border:0;background:transparent;color:#fbf9f4d1;text-decoration:underline;text-underline-offset:3px}.listen-orb{min-width:130px;min-height:130px;display:grid;place-items:center;margin:12px 0;border:1px solid rgba(251,249,244,.35);border-radius:50%;font-size:26px;transition:transform .12s ease,background .12s ease}.listen-orb.active{transform:scale(1.06);background:#c96b4340;border-color:#e6a07f}.listen-orb.rest{color:#fbf9f4b3;font-size:14px}.count-number{margin:16px 0 0;color:#e6a07f;font-family:Georgia,Times New Roman,serif;font-size:clamp(86px,13vw,140px);line-height:1}.pads{display:grid;grid-template-columns:repeat(4,minmax(54px,1fr));gap:10px;width:min(410px,100%);margin:7px 0}.pad-button{min-width:54px;min-height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:1px solid rgba(251,249,244,.45);background:#fbf9f414;color:var(--paper-strong);touch-action:manipulation}.pad-button:hover:not(:disabled),.pad-button.lit{border-color:#e6a07f;background:#c96b4357}.pad-number{font:700 17px system-ui,sans-serif}.pad-shape{font-size:13px;line-height:1}.result-center{justify-content:center}.result-copy{max-width:510px;margin:4px auto 12px;color:#fbf9f4c7;font-size:14px;line-height:1.6}.result-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:10px}.pause-overlay{position:absolute;z-index:3;inset:0;display:grid;place-items:center;padding:20px;background:#162a27e6}.pause-card{width:min(320px,100%);padding:24px;border:1px solid rgba(251,249,244,.3);background:var(--ink);text-align:center}.pause-card h2{margin-bottom:17px;font-size:34px}.pause-card button{width:100%}.rules-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(250px,.7fr);gap:22px;margin-top:32px}.rules-card,.pad-guide{border-top:1px solid var(--line);padding-top:17px}.rules-card h2{margin:8px 0 12px;font-size:24px}.rules-card p{color:#566764;font-size:12px;line-height:1.68}.controls-copy{font-weight:700}.sound-note{color:var(--muted);font-size:11px!important}.pad-guide{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;align-content:start}.pad-guide .eyebrow{grid-column:1 / -1;margin-bottom:4px}.pad-guide div{min-height:42px;display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--line);font-size:12px}.pad-guide div>span{width:20px;color:var(--accent-dark);text-align:center}.pad-guide div>small{margin-left:auto;color:var(--muted)}.footer{margin-top:28px;border-top:1px solid var(--line);padding-top:14px;color:var(--muted);font-size:9px;font-weight:750;letter-spacing:.12em}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(max-width:850px){.hero{grid-template-columns:1fr;gap:22px;padding:40px 0 32px}.progress-card{border-left:0;border-top:1px solid var(--line);padding:14px 0 0}.layout{grid-template-columns:1fr}.game-card{min-height:420px}}@media(max-width:560px){.shell{width:min(100% - 28px,480px)}.topbar{min-height:66px}.brand{gap:7px;font-size:9px;letter-spacing:.1em}.brand img{width:36px;height:36px}.top-actions{gap:6px}.quiet-button,.language-select{padding:0 9px;font-size:11px}.hero{padding:34px 0 27px}h1{font-size:clamp(42px,12vw,60px)}.intro{font-size:13px;line-height:1.5}.section-heading{align-items:start;flex-direction:column;gap:6px}.section-heading h2{font-size:24px}.section-heading p{text-align:left}.level-map{grid-template-columns:repeat(4,minmax(52px,1fr));gap:8px}.level-button{min-height:58px;font-size:16px}.game-card{min-height:430px;padding:17px 14px}.game-card-head{align-items:start}.game-actions{gap:5px}.game-actions .quiet-button{padding:0 8px;font-size:10px}.pads{grid-template-columns:repeat(2,minmax(72px,1fr));width:min(290px,100%);gap:8px}.pad-button{min-height:58px}.rules-grid{grid-template-columns:1fr;margin-top:25px}.rules-card h2{font-size:22px}.pad-guide{grid-template-columns:1fr 1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}body.reduce-motion *,body.reduce-motion *:before,body.reduce-motion *:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}
