main{opacity:1}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--wood-1000:#100906;--wood-950:#180e0a;--wood-900:#21130e;--wood-850:#2b1912;--wood-800:#3a2419;--wood-700:#543723;--brass-500:#cda565;--brass-300:#e4c787;--ivory-100:#fff4d5;--ivory-200:#f2dfb5;--ivory-300:#ddc695;--paper:#fff4d8;--paper-muted:#d6c7aa;--ink:#24150f;--accent:#dc714a;--accent-soft:#ffc78b;--scene-shadow:#241216;--scene-wide:none;--scene-tall:none;--line:#efd19733;--strong-line:#efd19775;--deep-shadow:0 34px 90px #05020185;--small-shadow:0 13px 28px #05020152;font-synthesis:none;text-rendering:optimizelegibility}html[data-song-theme=temple]{--accent:#dc6547;--accent-soft:#ffd083;--scene-shadow:#210b0d}html[data-song-theme=harbor]{--accent:#8bc1c4;--accent-soft:#dbefea;--scene-shadow:#06131f}*{box-sizing:border-box}html{background:var(--wood-950);scroll-behavior:smooth;min-width:320px;min-height:100%}body{min-width:320px;min-height:100dvh;color:var(--paper);background:radial-gradient(circle at 12% 2%, #cda5651f, transparent 32rem), radial-gradient(circle at 88% 86%, color-mix(in srgb, var(--accent) 13%, transparent), transparent 34rem), linear-gradient(145deg, #341f16 0%, var(--wood-950) 44%, #100b09 100%);-webkit-font-smoothing:antialiased;margin:0;font-family:Noto Serif TC,Songti TC,Microsoft JhengHei,PingFang TC,serif;overflow-x:hidden}body:before{z-index:-1;pointer-events:none;content:"";opacity:.25;background:linear-gradient(90deg,#0000 0 49.8%,#ffe3b10b 50%,#0000 50.2%),repeating-linear-gradient(8deg,#ffffff05 0 1px,#0000 1px 7px);position:fixed;inset:0}button,input{font:inherit}button,a,label,input,summary{scroll-margin-block:24px}button{color:inherit}button:disabled{cursor:not-allowed;opacity:.66}button:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible{outline:4px solid var(--accent-soft);outline-offset:4px}.game-screen:focus,.summary-screen:focus{outline:none}[hidden]{display:none!important}.ui-icon{fill:none;stroke:currentColor;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;width:1.45rem;height:1.45rem;display:block;overflow:visible}.app-frame{width:min(1280px,100%);min-height:100dvh;padding:0 clamp(18px, 4vw, 58px) max(30px, env(safe-area-inset-bottom));margin:0 auto}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:18px;min-height:92px;display:flex}.brand{min-height:58px;color:var(--paper);align-items:center;gap:14px;text-decoration:none;display:inline-flex}.brand>span:last-child{gap:3px;display:grid}.brand strong{letter-spacing:.16em;font-size:1.08rem}.brand small{color:var(--brass-300);letter-spacing:.13em;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.68rem}.brand-mark,.playing-medallion{color:var(--brass-300);background:radial-gradient(circle at 36% 30%, #fff1c829, transparent 34%), linear-gradient(145deg, var(--wood-700), var(--wood-950));box-shadow:inset 0 0 0 4px #1009064d, var(--small-shadow);border:1px solid #ebcb8b8f;border-radius:50%;flex:none;place-items:center;display:grid}.brand-mark{width:46px;height:46px}.brand-mark .ui-icon{width:26px;height:26px}.local-badge{color:#e4d4b7;letter-spacing:.08em;background:#1f120cc2;border:1px solid #e9c98947;border-radius:999px;align-items:center;gap:9px;min-height:44px;padding:8px 13px;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.78rem;display:inline-flex}.local-badge i{background:var(--accent-soft);width:8px;height:8px;box-shadow:0 0 12px color-mix(in srgb, var(--accent) 72%, transparent);border-radius:50%}.screen{padding-top:clamp(34px,5vw,70px)}.setup-grid{grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);align-items:start;gap:clamp(34px,5vw,72px);display:grid}.eyebrow{color:var(--brass-300);letter-spacing:.18em;margin:0 0 14px;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.79rem;font-weight:800}.hero-panel h1,.summary-stage h1{letter-spacing:.015em;max-width:11em;margin:0;font-size:clamp(2.8rem,5.25vw,5.15rem);font-weight:600;line-height:1.12}.hero-panel h1 em{color:var(--accent-soft);white-space:nowrap;text-shadow:0 8px 32px color-mix(in srgb, var(--accent) 28%, transparent);font-size:.92em;font-style:normal;display:inline-block}.hero-copy{color:#decfb6;max-width:35rem;margin:24px 0 28px;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:clamp(1rem,1.7vw,1.15rem);line-height:1.86}.record-window{background:linear-gradient(90deg, #ffe6b10f, transparent 16% 84%, #ffe6b10d), linear-gradient(155deg, var(--wood-700), var(--wood-950) 64%);height:clamp(270px,31vw,382px);box-shadow:inset 0 0 0 4px #0c0604b8, inset 0 0 0 7px #cda5652e, var(--deep-shadow);isolation:isolate;border:1px solid #efcf8d6b;border-radius:22px 22px 8px 8px;padding:10px;position:relative;overflow:hidden}.record-window:before,.record-window:after{z-index:5;pointer-events:none;content:"";position:absolute}.record-window:before{border:1px solid #ffe5a74d;border-radius:13px 13px 3px 3px;inset:10px;box-shadow:inset 0 0 70px #0502013d}.record-window:after{background:linear-gradient(#0000,#0804038c);height:45%;bottom:10px;left:10px;right:10px}.record-scene{z-index:0;background-color:var(--scene-shadow);background-image:var(--scene-wide);background-position:50%;background-size:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .7s;position:absolute;inset:10px}.record-light{z-index:1;pointer-events:none;background:radial-gradient(circle at 76% 26%, color-mix(in srgb, var(--accent-soft) 17%, transparent), transparent 29%), linear-gradient(90deg, #0000003d, transparent 28% 72%, #0000002e);position:absolute;inset:10px}.record-rail{z-index:7;border-top:2px solid #ecc77fb8;justify-content:space-around;align-items:center;height:18px;display:flex;position:absolute;bottom:22px;left:22px;right:22px}.record-rail i{border:2px solid var(--accent-soft);background:var(--wood-950);width:9px;height:9px;transform:translateY(-6px)rotate(45deg)}.record-seal{z-index:7;color:#f8e8c5;letter-spacing:.2em;background:#140a07d1;border:1px solid #ffe5a761;padding:8px 10px;font-size:.74rem;position:absolute;top:24px;left:24px}.song-identity{border-bottom:1px solid var(--line);grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;min-height:82px;padding:15px 4px;display:grid}.song-number{color:var(--brass-300);font-family:Georgia,serif;font-size:1.8rem}.song-identity>span:nth-child(2){gap:4px;min-width:0;display:grid}.song-identity strong{letter-spacing:.08em;font-size:1.08rem}.song-identity small{color:var(--paper-muted);text-overflow:ellipsis;white-space:nowrap;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.82rem;overflow:hidden}.tempo-chip{color:var(--accent-soft);letter-spacing:.08em;background:#190d09b3;border:1px solid #e5c78b33;border-radius:999px;padding:8px 11px;font-family:Microsoft JhengHei,sans-serif;font-size:.72rem}.setup-card{box-shadow:inset 0 1px 0 #fff3d514, inset 0 0 0 5px #0804032e, var(--deep-shadow);background:linear-gradient(145deg,#ffefc80b,#0000 34%),linear-gradient(160deg,#362218f7,#170d09fa);border:1px solid #eccd8f47;border-radius:24px 8px;padding:clamp(22px,3vw,34px)}.card-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:25px;padding-bottom:17px;display:flex}.card-heading>span{letter-spacing:.08em;font-size:1.38rem}.card-heading small,.control-group legend small{color:var(--paper-muted);font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem}.control-group{border:0;min-width:0;margin:0 0 23px;padding:0}.control-group legend{justify-content:space-between;align-items:center;width:100%;margin-bottom:11px;padding:0;display:flex}.control-group legend>span{letter-spacing:.05em;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:1rem;font-weight:800}.song-choices{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;display:grid}.song-choices button{color:#f0dfbf;cursor:pointer;text-align:left;background:#0b06046b;border:1px solid #eed29b33;border-radius:12px;grid-template-rows:62px auto;align-content:start;gap:8px;min-width:0;min-height:138px;padding:7px;transition:border-color .18s,transform .18s,background .18s;display:grid;position:relative;overflow:hidden}.song-choice-art{background-image:var(--choice-art,none);background-position:50%;background-size:cover;border-radius:7px 7px 2px 2px;width:100%;min-height:62px;display:block;box-shadow:inset 0 -22px 24px #08040359}.song-choices button>span:last-child{gap:3px;min-width:0;padding:0 4px 4px;display:grid}.song-choices button strong{font-size:.98rem;line-height:1.38}.song-choices button small{color:var(--paper-muted);text-overflow:ellipsis;white-space:nowrap;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.78rem;line-height:1.35;overflow:hidden}.song-choice-number{min-width:30px;color:var(--ivory-100);text-align:center;background:#120906c7;border:1px solid #ffe7b457;padding:3px 5px;font-family:Georgia,serif;font-size:.78rem;position:absolute;top:12px;left:12px}.song-choices button[aria-pressed=true]{border-color:var(--brass-300);box-shadow:0 0 0 2px #cda5652e, var(--small-shadow);background:#633f2575}.song-choices button[aria-pressed=true] .song-choice-art{box-shadow:inset 0 -22px 24px #0804032e,inset 0 0 0 2px #ffe6b16b}.choice-row{gap:9px;display:grid}.lane-choices,.pace-choices{grid-template-columns:repeat(3,minmax(0,1fr))}.cue-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.choice-row button{color:#ead9bb;cursor:pointer;background:#0a060457;border:1px solid #eed29b2e;border-radius:12px 4px;align-content:center;place-items:center;gap:4px;min-width:0;min-height:92px;padding:10px 7px;transition:border-color .16s,background .16s,transform .12s;display:grid;position:relative}.choice-row button:active{transform:translateY(2px)}.choice-row button[aria-pressed=true]{color:var(--ink);background:linear-gradient(165deg, var(--ivory-100), #d9bd80);border-color:#ebca86db;box-shadow:inset 0 -5px #51321c1f,0 9px 22px #07030257}.choice-row button strong{letter-spacing:.04em;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:1rem}.choice-row button span{font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem}.lane-preview,.beat-preview,.cue-preview{height:24px;color:var(--brass-300);justify-content:center;align-items:flex-end;gap:3px;font-style:normal;display:flex}.choice-row button[aria-pressed=true] .lane-preview,.choice-row button[aria-pressed=true] .beat-preview,.choice-row button[aria-pressed=true] .cue-preview{color:#6e4928}.lane-preview{width:46px}.lane-preview b{background:color-mix(in srgb, currentColor 17%, transparent);border:1px solid;border-radius:3px 3px 6px 6px;flex:1;height:22px;display:block}.beat-preview{align-items:center}.beat-preview b{border:2px solid;border-radius:50%;width:7px;height:7px}.beat-preview b:last-child{background:currentColor;width:11px;height:11px}.cue-preview{border-bottom:2px solid;align-items:center;width:52px;position:relative}.cue-preview b{background:color-mix(in srgb, currentColor 18%, transparent);border:2px solid;width:18px;height:14px;transform:translateY(-4px)rotate(45deg)}.cue-glide b{animation:2.4s ease-in-out infinite cue-demo}.comfort-row{grid-template-columns:1fr 1fr;gap:10px;margin:4px 0 22px;display:grid}.switch-control{cursor:pointer;background:#0a060438;border:1px solid #eed29b29;border-radius:11px 4px;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:11px;min-height:74px;padding:11px 12px;display:grid}.switch-control input{opacity:0;width:1px;height:1px;position:absolute}.switch-control:has(input:focus-visible){outline:4px solid var(--accent-soft);outline-offset:3px}.switch-track{background:#1a100c;border:1px solid #ffe8b838;border-radius:999px;width:46px;height:26px;transition:background .16s;position:relative}.switch-track:after{background:var(--ivory-200);content:"";border:1px solid #6f4a2959;border-radius:50%;width:18px;height:18px;transition:transform .16s;position:absolute;top:3px;left:3px}.switch-control input:checked+.switch-track{background:var(--accent)}.switch-control input:checked+.switch-track:after{transform:translate(20px)}.switch-control>span:last-child{gap:3px;min-width:0;display:grid}.switch-control strong{font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:1rem}.switch-control small{color:var(--paper-muted);font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem;line-height:1.35}.volume-control{gap:9px;margin-bottom:22px;display:grid}.volume-control>span{justify-content:space-between;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:1rem;display:flex}.volume-control output{color:var(--accent-soft)}.volume-control input{width:100%;min-height:44px;accent-color:var(--brass-500);cursor:pointer}.primary-action,.quiet-action{cursor:pointer;border-radius:14px 4px;width:100%;min-height:62px}.primary-action{color:var(--ink);letter-spacing:.08em;text-align:left;background:linear-gradient(100deg,#ffffff6b,#0000 38%),linear-gradient(155deg,#ffe9b5,#d6aa62);border:1px solid #f8dfaa;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:13px;padding:11px 17px;font-weight:800;transition:transform .12s,filter .16s,box-shadow .12s;display:grid;box-shadow:inset 0 -7px #512f1521,0 15px 32px #0804026b}.primary-action:active{transform:translateY(3px);box-shadow:inset 0 -3px #512f151f,0 8px 18px #0804025c}.action-icon{background:#4f2f181a;border:1px solid #462a1661;border-radius:50%;place-items:center;width:42px;height:42px;display:grid}.action-copy{gap:2px;display:grid}.action-copy b{font-size:1rem}.action-copy small{letter-spacing:0;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem;font-weight:700}.action-arrow{font-family:Georgia,serif;font-size:1.55rem}.primary-action:disabled{cursor:wait;filter:saturate(.4)}.primary-action.compact{text-align:center;justify-content:center;min-height:58px;display:flex}.quiet-action{color:var(--paper);background:#0a060470;border:1px solid #f1d59c4d;margin-top:10px}.setup-status{min-height:1.5em;color:var(--paper-muted);text-align:center;margin:12px 0 0;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem;line-height:1.55}.recent-card{border:1px solid var(--line);box-shadow:var(--small-shadow);background:#160d09b8;border-radius:8px 22px;grid-template-columns:minmax(210px,1fr) minmax(300px,1.5fr) auto;align-items:center;gap:22px;margin-top:38px;padding:23px 27px;display:grid}.recent-card h2{margin:0;font-size:1.06rem;font-weight:600}.recent-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.recent-metrics span{border-left:1px solid var(--line);gap:4px;padding-left:14px;display:grid}.recent-metrics strong{color:var(--ivory-100);font-size:.95rem}.recent-metrics small,.recent-metrics em{color:var(--paper-muted);font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem}.recent-metrics em{color:var(--accent-soft);font-style:normal}.text-button{color:#ddcdb2;cursor:pointer;text-underline-offset:4px;background:0 0;border:0;min-height:48px;padding:8px 12px;text-decoration:underline}.privacy-note{color:#b9aa91;text-align:center;margin:20px auto 0;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem;line-height:1.65}.music-credits{color:#c8b89d;text-align:center;width:min(720px,100%);margin:12px auto 0;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem;line-height:1.65}.music-credits summary{cursor:pointer;text-underline-offset:4px;min-height:48px;text-decoration:underline}.music-credits p{margin:0 0 6px}.music-credits a{color:var(--accent-soft)}body.is-playing{background:radial-gradient(circle at 50% -20%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 54%), var(--wood-1000);overflow:hidden}body.is-playing .app-frame{width:100%;max-width:none;height:100vh;height:100dvh;min-height:100vh;min-height:100dvh;padding:0 max(12px, env(safe-area-inset-right)) 0 max(12px, env(safe-area-inset-left))}body.is-playing .site-header{display:none}.game-screen{height:100vh;height:100dvh;min-height:100vh;min-height:100dvh;padding-top:max(10px, env(safe-area-inset-top));padding-bottom:max(10px, env(safe-area-inset-bottom));grid-template-rows:auto 10px minmax(0,1fr);gap:10px;display:grid;position:relative;overflow:hidden}.game-toolbar{justify-content:space-between;align-items:center;gap:16px;min-height:56px;display:flex}.now-playing{align-items:center;gap:11px;min-width:0;display:flex}.playing-medallion{width:44px;height:44px}.playing-medallion .ui-icon{width:24px;height:24px}.now-playing>span:last-child{gap:2px;min-width:0;display:grid}.now-playing small{color:var(--paper-muted);letter-spacing:.08em;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.74rem}.now-playing strong{letter-spacing:.08em;text-overflow:ellipsis;white-space:nowrap;font-size:1.06rem;overflow:hidden}.game-actions{flex:none;gap:8px;display:flex}.game-actions button{min-width:78px;min-height:52px;color:var(--paper);background:linear-gradient(160deg, #ffefc70e, transparent 45%), var(--wood-900);box-shadow:inset 0 -3px 0 #0502014d, var(--small-shadow);cursor:pointer;border:1px solid #eed0944a;border-radius:11px 3px;justify-content:center;align-items:center;gap:7px;padding:7px 12px;transition:transform .1s,border-color .15s,color .15s;display:flex}.game-actions button:active{transform:translateY(2px)}.game-actions button span{color:var(--brass-300)}.game-actions button b{font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.9rem}.game-actions .sound-off,.game-actions button[aria-pressed=true] .sound-on{display:none}.game-actions button[aria-pressed=true] .sound-off{display:block}.game-actions #finish-button{border-color:color-mix(in srgb, var(--accent) 42%, transparent)}.progress-shell{background:#130b08;border:1px solid #e2bc7540;border-radius:999px;position:relative;overflow:visible;box-shadow:inset 0 1px 5px #000000b8}.progress-shell>i{transform-origin:0;border-radius:inherit;background:linear-gradient(90deg, var(--accent), var(--brass-300), var(--accent-soft));width:100%;height:100%;box-shadow:0 0 13px color-mix(in srgb, var(--accent) 35%, transparent);transition:transform .24s linear;display:block;transform:scaleX(0)}.progress-shell>span{pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute;inset:0 4px}.progress-shell>span b{border:1px solid var(--brass-300);background:var(--wood-950);width:6px;height:6px;transform:rotate(45deg)}.instrument-shell{min-height:0;padding:8px 8px max(8px, env(safe-area-inset-bottom));background:linear-gradient(90deg, #ffeabe0e, transparent 12% 88%, #ffeabe0b), linear-gradient(155deg, var(--wood-700), var(--wood-1000) 62%);box-shadow:inset 0 0 0 4px #070302b8, inset 0 0 0 7px #cda56526, var(--deep-shadow);isolation:isolate;border:1px solid #eac88575;border-radius:22px 22px 9px 9px;grid-template-rows:minmax(0,1fr) auto;display:grid;position:relative;overflow:hidden}.instrument-shell:before{z-index:6;content:"";background:linear-gradient(90deg, transparent, var(--brass-300), transparent);opacity:.72;height:2px;position:absolute;top:0;left:8%;right:8%}.play-stage{background:var(--scene-shadow);contain:layout paint;cursor:pointer;isolation:isolate;touch-action:none;-webkit-user-select:none;user-select:none;border:1px solid #ffe5a840;border-bottom:0;border-radius:14px 14px 0 0;min-height:220px;position:relative;overflow:hidden}.stage-scene,.stage-light{pointer-events:none;position:absolute;inset:0}.stage-scene{z-index:0;--scene-zoom:1.015;transform:scale(var(--scene-zoom));background-color:var(--scene-shadow);background-image:var(--scene-wide);filter:brightness(.78)saturate(.9);background-position:50%;background-size:cover;transition:filter .9s,transform 4s;animation:16s ease-in-out infinite alternate scene-drift}.stage-scene:after{content:"";background:linear-gradient(#07030214 0%,#0703020d 46%,#070302a8 100%),linear-gradient(90deg,#05020145,#0000 22% 78%,#05020145);position:absolute;inset:0}.stage-light{z-index:1;opacity:.68;background:radial-gradient(circle at 72% 26%, color-mix(in srgb, var(--accent-soft) 22%, transparent), transparent 31%);animation:10s ease-in-out infinite alternate scene-light}html[data-song-theme=temple] .stage-light{background:radial-gradient(circle at 25% 20%,#ff7b4821,#0000 22%),radial-gradient(circle at 72% 24%,#ffbe6329,#0000 25%)}html[data-song-theme=harbor] .stage-light{background:radial-gradient(circle at 60% 22%,#cdf4f22e,#0000 30%)}html[data-song-section=departure] .stage-scene,html[data-song-section=gathering] .stage-scene,html[data-song-section=tide] .stage-scene{filter:brightness(.84)saturate(.94)}html[data-song-section=memory] .stage-scene,html[data-song-section=lanterns] .stage-scene,html[data-song-section=moonrise] .stage-scene{--scene-zoom:1.025;filter:brightness(.92)saturate(1.01)}html[data-song-section=homecoming] .stage-scene,html[data-song-section=blessing] .stage-scene,html[data-song-section=return] .stage-scene{--scene-zoom:1.03;filter:brightness(.98)saturate(1.04)}html[data-song-section=coda] .stage-scene{filter:brightness(.86)saturate(.9)}#game-canvas{z-index:2;width:100%;height:100%;min-height:220px;display:block;position:relative}.stage-caption{z-index:4;pointer-events:none;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;display:grid;position:absolute;top:13px;left:13px;right:13px}.stage-caption>span,.stage-caption>small{color:#f2e5cc;background:#110805db;border:1px solid #ffe2a640;min-height:42px;padding:9px 11px;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.9rem}.stage-caption .stage-guide-icon{width:42px;color:var(--accent-soft);border-radius:50%;place-items:center;padding:0;display:grid}.stage-caption>span:nth-child(2){border-radius:4px 12px;justify-self:start}.stage-caption>small{color:#ead4ad;border-radius:12px 4px}.lane-buttons{z-index:4;grid-template-columns:repeat(var(--lane-count,2), minmax(0, 1fr));touch-action:none;-webkit-user-select:none;user-select:none;border-top:1px solid #efcc8b38;gap:clamp(6px,.85vw,11px);padding-top:7px;display:grid;position:relative}.lane-key{--lane-color:#f4c86f;--lane-ink:#3a2417;min-width:56px;min-height:clamp(126px,19dvh,176px);color:var(--lane-ink);cursor:pointer;touch-action:none;background:linear-gradient(90deg,#6e4b261c,#0000 12% 88%,#6e4b261a),linear-gradient(#fff4d5 0%,#ead7ac 72%,#d6bc85 100%);border:1px solid #fff0c8;border-radius:4px 4px 15px 15px;align-content:center;place-items:center;gap:4px;padding:16px 8px 13px;transition:transform 90ms;display:grid;position:relative;overflow:hidden;transform:translateY(0);box-shadow:inset 0 -9px #57371921,inset 0 1px #ffffffdb,0 7px 16px #0402016b}.lane-key:before{content:"";background:linear-gradient(90deg, #8e672f, var(--lane-color), #8e672f);height:8px;position:absolute;top:0;left:0;right:0}.lane-key:after{pointer-events:none;border:4px solid var(--lane-ink);content:"";opacity:0;box-shadow:inset 0 0 0 2px var(--lane-color), 0 0 18px color-mix(in srgb, var(--lane-color) 56%, transparent);border-radius:3px 3px 11px 11px;transition:opacity 90ms linear,transform 90ms;position:absolute;inset:8px 4px 4px;transform:scale(.985)}.lane-key.lane-0{--lane-color:#e0ad4e;--lane-ink:#3a2417}.lane-key.lane-1{--lane-color:#72aa91;--lane-ink:#18362e}.lane-key.lane-2{--lane-color:#ce7656;--lane-ink:#45251d}.lane-key.lane-3{--lane-color:#819bc8;--lane-ink:#1d2f4e}.lane-key.is-ready:after,.lane-key[data-ready]:after{opacity:1;transform:scale(1)}.lane-key.is-ready .key-glyph{background:color-mix(in srgb, var(--lane-color) 18%, transparent)}.lane-key.is-pressed,.lane-key:active{transform:translateY(5px)}.lane-key.is-pressed:after,.lane-key:active:after{opacity:1;transform:scale(.97)}.key-glyph{border:4px solid;place-items:center;width:clamp(38px,4.5vw,50px);height:clamp(38px,4.5vw,50px);transition:background .1s linear;display:grid;position:relative}.glyph-0{border-radius:50%}.glyph-0 i{background:currentColor;border-radius:50%;width:7px;height:7px}.glyph-1{width:clamp(34px,4vw,44px);height:clamp(34px,4vw,44px);transform:rotate(45deg)}.glyph-2{border-radius:50% 50% 8px 8px}.glyph-3{border:0}.glyph-3 i,.glyph-3:before,.glyph-3:after{content:"";border:4px solid;border-radius:50%;width:18px;height:18px;position:absolute}.glyph-3 i{transform:translateY(-10px)}.glyph-3:before{transform:translate(-10px,8px)}.glyph-3:after{transform:translate(10px,8px)}.key-position{color:var(--lane-ink);letter-spacing:.08em;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.92rem;font-weight:900}.key-state{color:#4e3625;min-height:1.25em;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:clamp(.76rem,1.2vw,.9rem);font-weight:900;line-height:1.2}.lane-key.is-ready .key-state,.lane-key[data-ready] .key-state{color:var(--lane-ink);text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:2px}.key-caption{color:#3c5049;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem;font-weight:800}.pause-overlay{z-index:30;background:linear-gradient(#120a07e0,#070302f0),repeating-linear-gradient(8deg,#ffffff05 0 1px,#0000 1px 8px);place-items:center;padding:24px;display:grid;position:absolute;inset:0}.pause-overlay>div{background:linear-gradient(155deg, var(--wood-700), var(--wood-950));width:min(440px,100%);box-shadow:inset 0 0 0 5px #08040366, var(--deep-shadow);text-align:center;border:1px solid #f1d08f75;border-radius:20px 6px;padding:34px}.pause-mark{border:1px solid var(--brass-300);width:66px;height:66px;color:var(--brass-300);background:var(--wood-950);border-radius:50%;place-items:center;margin:0 auto 18px;display:grid}.pause-mark .ui-icon{width:34px;height:34px}.pause-overlay h2{margin:0 0 12px;font-size:clamp(1.8rem,4vw,2.65rem)}.pause-status{color:var(--paper-muted);margin:0 0 24px;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:1rem;line-height:1.65}.summary-screen{place-items:center;min-height:calc(100dvh - 92px);padding-bottom:40px;display:grid;position:relative;overflow:hidden}.summary-screen:before{z-index:-2;content:"";opacity:.22;background-image:var(--scene-wide);filter:saturate(.75);background-position:50%;background-size:cover;border-radius:24px 8px;position:absolute;inset:24px 0}.summary-screen:after{z-index:-1;content:"";background:radial-gradient(circle at 50% 28%,#442b186b,#0d0705eb 72%);border-radius:24px 8px;position:absolute;inset:24px 0}.summary-stage{text-align:center;width:min(780px,100%);padding:clamp(24px,5vw,48px)}.summary-halo{width:116px;height:116px;color:var(--accent-soft);background:radial-gradient(circle, color-mix(in srgb, var(--accent) 25%, transparent), transparent 66%);box-shadow:0 0 72px color-mix(in srgb, var(--accent) 18%, transparent);border:1px solid #ffe2a27a;border-radius:50%;place-items:center;margin:0 auto 24px;display:grid}.summary-halo .ui-icon{width:54px;height:54px}.summary-stage h1{max-width:none;font-size:clamp(2.7rem,6vw,5rem)}.summary-lead{color:#e4d4b8;margin:22px auto 30px;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:clamp(1rem,2vw,1.16rem);line-height:1.78}.summary-metrics{box-shadow:var(--small-shadow);background:#130a07cc;border:1px solid #efcc8947;border-radius:8px 22px;grid-template-columns:repeat(3,minmax(0,1fr));display:grid;overflow:hidden}.summary-metrics article{align-content:center;place-items:center;gap:6px;min-height:126px;padding:18px 10px;display:grid}.summary-metrics article+article{border-left:1px solid var(--line)}.summary-metrics strong{color:var(--accent-soft);font-family:Georgia,serif;font-size:clamp(2rem,4vw,3rem);font-weight:500}.summary-metrics span{color:var(--paper-muted);font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:.875rem}.summary-detail{color:#d0c0a4;min-height:1.6em;margin:22px 0;font-family:Microsoft JhengHei,PingFang TC,sans-serif;font-size:1rem}.summary-actions{grid-template-columns:1fr 1fr;gap:12px;width:min(520px,100%);margin:0 auto;display:grid}.summary-actions .quiet-action{margin:0}.visually-hidden{clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;width:1px!important;height:1px!important;position:absolute!important;overflow:hidden!important}@keyframes cue-demo{0%,18%{opacity:.55;transform:translateY(-11px)rotate(45deg)}72%,to{opacity:1;transform:translateY(-2px)rotate(45deg)}}@keyframes scene-drift{0%{transform:scale(var(--scene-zoom)) translate3d(-0.15%, 0, 0)}to{transform:scale(calc(var(--scene-zoom) + .01)) translate3d(0.15%, -0.3%, 0)}}@keyframes scene-light{0%{opacity:.56}to{opacity:.76}}@media (hover:hover){.song-choices button:hover,.choice-row button:hover,.game-actions button:hover{border-color:#f4d2909e}.song-choices button:hover{transform:translateY(-2px)}.primary-action:hover{filter:brightness(1.04)}.lane-key:hover:after{opacity:.45}}@media (max-width:980px){.setup-grid{grid-template-columns:1fr}.hero-panel h1{max-width:12em}.record-window{height:min(51vw,420px)}.recent-card{grid-template-columns:1fr}.recent-metrics span:first-child{border-left:0}}@media (max-width:640px){html{scroll-padding-bottom:calc(178px + env(safe-area-inset-bottom))}.app-frame{padding-left:14px;padding-right:14px}.setup-screen{padding-bottom:calc(156px + env(safe-area-inset-bottom))}.site-header{min-height:76px}.brand-mark{width:40px;height:40px}.brand strong{font-size:.96rem}.brand small{text-overflow:ellipsis;white-space:nowrap;max-width:12rem;font-size:.62rem;overflow:hidden}.local-badge{min-height:40px;padding:6px 9px;font-size:.68rem}.screen{padding-top:30px}.hero-panel h1,.summary-stage h1{font-size:clamp(2.5rem,13vw,3.7rem)}.hero-panel h1 em{font-size:.86em}.hero-copy{margin-top:18px;font-size:.98rem}.record-window{height:360px}.record-scene{background-image:var(--scene-tall);background-position:50%}.song-identity{grid-template-columns:auto minmax(0,1fr)}.tempo-chip{display:none}.setup-card{border-radius:20px 6px;padding:21px 15px}.song-choices{grid-template-columns:1fr}.song-choices button{grid-template-rows:auto;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:11px;min-height:82px;padding:7px}.song-choice-art{min-height:68px}.song-choice-number{top:11px;left:11px}#start-button{z-index:20;left:14px;right:14px;bottom:max(12px, env(safe-area-inset-bottom));width:auto;min-height:68px;position:fixed;box-shadow:0 0 0 8px #140b08f0,0 18px 42px #05020194}#silent-start-button:not([hidden]){z-index:21;left:14px;right:14px;bottom:calc(max(12px, env(safe-area-inset-bottom)) + 82px);background:var(--wood-800);width:auto;min-height:58px;margin:0;position:fixed;box-shadow:0 0 0 7px #140b08f0}.card-heading{gap:4px;display:grid}.choice-row{gap:6px}.choice-row button{min-height:90px;padding:9px 4px}.comfort-row{grid-template-columns:1fr}.switch-control{min-height:68px}.recent-card{padding:20px 16px}.recent-metrics{gap:3px}body.is-playing .app-frame{padding-right:max(8px, env(safe-area-inset-right));padding-left:max(8px, env(safe-area-inset-left))}.game-screen{padding-top:max(8px, env(safe-area-inset-top));padding-bottom:max(7px, env(safe-area-inset-bottom));grid-template-rows:auto 9px minmax(0,1fr);gap:7px}.game-toolbar{gap:8px}.playing-medallion{width:40px;height:40px}.now-playing strong{max-width:8.5rem;font-size:.94rem}.game-actions{gap:4px}.game-actions button{gap:4px;min-width:58px;min-height:50px;padding:5px 7px}.game-actions button b{font-size:.82rem}.instrument-shell{padding:6px 6px max(6px, env(safe-area-inset-bottom));border-radius:16px 16px 7px 7px}.stage-scene{background-image:var(--scene-tall);background-position:50%}.stage-caption{grid-template-columns:auto minmax(0,1fr);gap:6px;top:8px;left:8px;right:8px}.stage-caption>span,.stage-caption>small{min-height:40px;padding:7px 8px;font-size:.875rem}.stage-caption>small{grid-column:2;justify-self:start;min-height:auto;padding:4px 8px}.lane-buttons{gap:5px;padding-top:6px}.lane-key{border-radius:3px 3px 11px 11px;min-height:clamp(126px,20dvh,164px);padding-left:3px;padding-right:3px}.key-position{font-size:.86rem}.key-caption{text-overflow:ellipsis;white-space:nowrap;max-width:94%;font-size:.79rem;overflow:hidden}.summary-screen{min-height:calc(100dvh - 76px)}.summary-screen:before{background-image:var(--scene-tall)}.summary-stage{padding-left:8px;padding-right:8px}.summary-metrics article{min-height:106px;padding:12px 5px}.summary-metrics strong{font-size:clamp(1.75rem,9vw,2.5rem)}.summary-actions{grid-template-columns:1fr}}@media (max-width:430px){.site-header{align-items:center}.local-badge{max-width:7.5rem;line-height:1.3}.game-toolbar{grid-template-columns:minmax(0,1fr);display:grid}.now-playing{min-height:40px}.playing-medallion{width:38px;height:38px}.now-playing strong{max-width:none}.game-actions{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.game-actions button{width:100%;min-height:48px}.game-screen{grid-template-rows:auto 9px minmax(0,1fr)}.play-stage,#game-canvas{min-height:210px}.lane-key{min-height:clamp(112px,18dvh,150px)}.lane-buttons[style*="--lane-count: 4"] .key-position{display:none}}@media (max-height:700px) and (orientation:landscape){body.is-playing .app-frame{padding-right:max(10px, env(safe-area-inset-right));padding-left:max(10px, env(safe-area-inset-left))}.game-screen{padding-top:max(5px, env(safe-area-inset-top));padding-bottom:max(5px, env(safe-area-inset-bottom));grid-template-rows:48px 8px minmax(0,1fr);gap:6px}.game-toolbar{min-height:48px}.playing-medallion{width:38px;height:38px}.now-playing small{display:none}.game-actions button{min-height:48px}.instrument-shell{padding-bottom:max(5px, env(safe-area-inset-bottom));grid-template-rows:minmax(0,1fr) auto}.play-stage,#game-canvas{min-height:145px}.stage-scene{background-image:var(--scene-wide);background-position:50% 55%}.stage-caption{top:6px;left:7px;right:7px}.stage-caption>span,.stage-caption>small{min-height:36px;padding:6px 8px;font-size:.78rem}.stage-caption>span:nth-child(2){font-size:.9375rem}.stage-caption .stage-guide-icon{width:36px}.lane-key{grid-template-rows:auto auto auto;grid-template-columns:auto auto;align-content:center;column-gap:8px;min-height:clamp(82px,24dvh,102px);padding:7px 5px}.key-glyph{border-width:3px;grid-row:1/4;width:32px;height:32px}.glyph-1{width:29px;height:29px}.glyph-3 i,.glyph-3:before,.glyph-3:after{border-width:3px;width:13px;height:13px}.key-position,.key-state,.key-caption{justify-self:start}.summary-screen{min-height:calc(100dvh - 76px);padding-top:10px;padding-bottom:10px}.summary-stage{grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);grid-template-areas:"kicker metrics""title metrics""lead detail""privacy actions";align-items:center;gap:7px 22px;padding:12px;display:grid}.summary-halo{display:none}#summary-kicker{grid-area:kicker;margin:0}.summary-stage h1{grid-area:title;font-size:clamp(2rem,5.5vw,3rem);line-height:1.08}.summary-lead{grid-area:lead;margin:0;line-height:1.5}.summary-metrics{grid-area:metrics}.summary-detail{grid-area:detail;min-height:0;margin:0}.summary-actions{grid-area:actions;margin:0}.summary-stage>.privacy-note{text-align:left;grid-area:privacy;margin:0}.summary-metrics article{min-height:86px;padding:8px 5px}}@media (max-height:480px) and (orientation:landscape){.game-actions button b{display:none}.game-actions button{min-width:48px}.lane-key{min-height:78px}.key-caption{display:none}}@media (max-height:480px) and (orientation:landscape) and (min-width:700px){.game-actions button b{display:inline}.game-actions button{min-width:76px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}html[data-reduced-motion=true] *,html[data-reduced-motion=true] :before,html[data-reduced-motion=true] :after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation:none!important}html[data-reduced-motion=true] .stage-scene{transform:scale(var(--scene-zoom))!important}body.is-paused .stage-scene,body.is-paused .stage-light{animation-play-state:paused}@media (prefers-contrast:more){:root{--paper-muted:#f0e1c4;--line:#ffedc670}.stage-scene:after{background:linear-gradient(#0003,#000000c2)}.lane-key:after{box-shadow:inset 0 0 0 3px var(--lane-color), 0 0 0 2px CanvasText;border-width:5px}}@media (forced-colors:active){.record-scene,.stage-scene,.stage-light,.summary-screen:before{display:none}.lane-key,.game-actions button,.choice-row button,.primary-action{color:buttontext;forced-color-adjust:none;background:buttonface;border:2px solid buttontext}.lane-key.is-ready,.lane-key[data-ready]{outline-offset:-6px;outline:5px solid highlight}.lane-key .key-position,.lane-key .key-state,.lane-key .key-caption{color:buttontext}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline-color:highlight}.progress-shell{background:canvas;border:1px solid canvastext}#progress-bar{background:highlight}}
