.echo-frame{padding-bottom:max(10px,env(safe-area-inset-bottom));border:2px solid #234d66;border-radius:4px;gap:8px;box-shadow:0 0 0 3px #0b1e32,0 24px 70px #0007}.echo-frame .scene-header{margin:14px 16px 0}.echo-frame .scene-header small{letter-spacing:.08em;margin-bottom:3px;font-size:10px}.echo-frame .scene-header strong{font-size:15px}.echo-frame .lab{image-rendering:pixelated}.echo-frame .shade{background:linear-gradient(#061d35bb,#061d3533 40%,#05172dcc)}.echo-navi-row{background:#06203de8;border:2px solid #47768d;align-items:center;gap:8px;min-height:64px;margin:0 14px;padding:6px 10px;display:flex;box-shadow:inset 0 0 0 2px #112e48}.echo-navi-image{width:48px;height:48px;image-rendering:pixelated;background-position:0 0;background-size:200% 200%;flex:none}.echo-speaker{color:#a3d7d5;letter-spacing:.05em;font-size:10px}.echo-line{color:#f8efd6;margin:3px 0 0;font-size:16px;line-height:1.4}.echo-start,.echo-results{color:#183d40;background:#f5edda;border:2px solid #dbc89b;margin:auto 14px 6px;padding:22px 18px;overflow-y:auto;box-shadow:4px 4px #172f3e}.echo-start h1{font-size:21px}.echo-start p{font-size:17px;line-height:1.65}.echo-start details{border-top:1px solid #b9c2ae;margin:12px 0;padding:10px 0;font-size:15px}.echo-start summary{cursor:pointer;margin-bottom:8px}.echo-start label{align-items:center;gap:10px;min-height:36px;margin:10px 0;display:flex}.echo-start select{font:inherit;color:#163f45;background:#fff8e8;border:1px solid #648782;padding:6px}.echo-start input[type=range]{accent-color:#245e60;width:145px}.echo-error{color:#9c4435;min-height:1.5em;font-size:13px!important}.echo-phase{background:#12334dea;border:2px solid #3e6c80;justify-content:space-between;align-items:center;margin:0 14px;padding:7px 10px;display:flex}.phase-kind{color:#d0efdf;font-size:18px}[data-phase=play] .echo-phase{background:#ecd6a2;border-color:#f9eecb}[data-phase=play] .phase-kind,[data-phase=play] .echo-clock{color:#183d45}.echo-clock{font-variant-numeric:tabular-nums;color:#c9ddd8;font-size:12px}.conveyor-stage{flex:1;min-height:185px;margin:0 6px;position:relative;overflow:hidden}.conveyor-art{shape-rendering:crispedges;width:100%;height:100%;display:block;overflow:hidden}.conveyor-art text{paint-order:stroke;stroke:#112934;stroke-width:.3px;font-family:Microsoft JhengHei,PingFang TC,sans-serif}.moving-sample{will-change:transform}.scan-sprite{image-rendering:pixelated;overflow:hidden}.moving-sample[data-judgment=miss] .tube-liquid{fill:#665769}.scan-beam{stroke-linecap:round}.echo-hud{color:#e0eddb;text-shadow:0 2px 2px #0b1827;justify-content:space-between;margin:0 18px;font-size:13px;display:flex}.echo-feedback{text-align:center;color:#f3d591;min-height:24px;font-size:17px;font-weight:700;line-height:1.4}.echo-operation{text-align:center;margin:0 14px}.echo-operation small{color:#b8d7ce;margin-top:4px;font-size:11px;display:block}.echo-control{color:#f0ecd4;letter-spacing:.06em;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#075365;border:3px solid #79c5c5;width:100%;min-height:66px;font-size:23px;box-shadow:inset 0 -5px #0a303e,0 2px #041e2d}.echo-control.your-turn{color:#18383a;background:#edbb54;border-color:#ffecad;box-shadow:inset 0 -5px #b28140}.echo-control.held{box-shadow:none;transform:translateY(2px)}.echo-toolbar{justify-content:space-between;align-items:center;gap:8px;margin:0 14px;display:flex}.echo-toolbar button{color:#e3ecd6;background:#173e50;border:1px solid #72968e;min-height:42px;padding:8px 10px;font-size:13px}.echo-toolbar label{align-items:center;gap:5px;min-width:0;font-size:12px;display:flex}.echo-toolbar input{accent-color:#cfdaae;width:86px;min-width:0}.echo-pause{z-index:4;text-align:center;background:#08243af2;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;display:flex;position:absolute;inset:0}.echo-pause h2,.echo-pause p{margin:0}.echo-pause button{color:#204d47;background:#f7eac8;border:2px solid #e6d098;min-width:170px;min-height:48px;padding:10px 18px}.echo-mode{color:#4d7160;font-size:16px}.echo-score{font-size:23px;font-weight:700}.echo-grades{grid-template-columns:1fr 1fr;gap:12px;font-size:16px;display:grid}.echo-result-note{color:#49665d;font-size:12px;line-height:1.5}@media (max-width:600px){.echo-frame{border:0;border-radius:0}}@media (max-height:650px){.echo-frame{gap:4px;padding-bottom:6px}.echo-frame .scene-header{margin-top:8px}.echo-frame .scene-header small{display:none}.echo-navi-row{min-height:53px;padding:4px 8px}.echo-navi-image{width:39px;height:39px}.echo-line{font-size:15px}.echo-speaker{font-size:9px}.echo-phase{padding:4px 8px}.phase-kind{font-size:16px}.conveyor-stage{min-height:178px}.echo-feedback{min-height:21px;font-size:15px}.echo-control{min-height:52px;font-size:21px}.echo-toolbar button{min-height:38px}.echo-start{padding:16px}.echo-start h1{font-size:20px}.echo-start p{margin:8px 0}.echo-start details{margin:6px 0;padding:6px 0}.echo-start label{margin:6px 0}}@media (prefers-reduced-motion:reduce){.echo-control.held{transform:none}}.echo-results h2{color:#60736a;margin:0 0 18px;font-size:14px;font-weight:400}.echo-rating{text-align:center;color:#30545a;margin:0 0 8px;font-size:clamp(28px,8vw,38px)}.echo-results[data-rating=high] .echo-rating{color:#925216}.echo-results .result-details{margin:16px 0;display:block}.result-details summary{cursor:pointer;font-size:15px}.echo-score{font-size:16px;line-height:1.5}.echo-grades{gap:8px;font-size:14px}.result-sticker{color:#865112;background:#ffda69;border:4px dashed #c57925;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:86px;height:86px;margin:12px auto;font-size:30px;display:flex;transform:rotate(-9deg);box-shadow:2px 4px #baab84}.result-sticker span{font-size:17px;font-weight:700}.echo-announcement{text-align:center}.announcement-icon{color:#426565;font-size:60px}.echo-announcement h1{font-size:20px}.echo-announcement button{min-height:44px;margin-top:20px;padding:8px 16px}.difficulty-prank{z-index:5;color:#fff0c9;pointer-events:none;background:#153c4ff5;border:3px solid #ffd180;align-items:center;gap:16px;padding:18px;font-size:24px;font-weight:700;animation:.18s ease-out prank-pop;display:flex;position:absolute;top:30%;left:14px;right:14px;box-shadow:4px 6px #041824}.difficulty-prank .echo-navi-image{width:70px;height:70px}@keyframes prank-pop{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.difficulty-prank{animation:none}}@media (max-height:650px){.echo-results{padding:16px}.echo-results h2{margin-bottom:10px}.result-details{margin:12px 0}.result-sticker{width:70px;height:70px;margin:8px auto}.echo-rating{font-size:29px}}.adventure-frame{background:#0d2636;flex-direction:column;max-width:560px;height:100svh;min-height:480px;margin:auto;display:flex;position:relative}.adventure-frame header{border-bottom:1px solid #36576c;justify-content:space-between;align-items:center;gap:8px;padding:9px 12px;display:flex}.adventure-frame small{color:#a9cdd0;font-size:11px}.adventure-frame h1{margin:3px 0 0;font-size:16px}.adventure-frame button{font:inherit;color:#fff1d2;cursor:pointer;background:#225354;border:1px solid #77a5a7;border-radius:8px;min-height:40px;padding:8px 12px;font-size:13px}.adventure-frame button:disabled{opacity:.5}.adventure-frame button:focus-visible,.joystick:focus-visible{outline-offset:2px;outline:3px solid #ffe387}.adventure-hud{font-variant-numeric:tabular-nums;background:#0a1c2c;justify-content:space-between;padding:8px 12px;font-size:13px;display:flex}.checkpoint{color:#ffe594}.adventure-stage{background:#061322;flex:1;min-height:140px;position:relative;overflow:hidden}.adventure-stage canvas{width:100%;height:100%;image-rendering:pixelated;touch-action:none;display:block}.adventure-overlay{background:#061323e8;flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;inset:0}.adventure-frame [hidden]{display:none!important}.adventure-speech{color:#c8e7dd;border-top:1px solid #446575;min-height:50px;margin:0;padding:7px 12px;font-size:13px;line-height:1.5}.adventure-controls{flex-shrink:0;justify-content:center;align-items:center;gap:26px;height:116px;padding:8px 12px;display:flex}.adventure-controls p{color:#c4dedc;font-size:13px;line-height:1.7}.joystick{touch-action:none;-webkit-user-select:none;user-select:none;background:radial-gradient(circle,#2a545a,#142f42);border:2px solid #719f9f;border-radius:50%;flex-shrink:0;width:100px;height:100px;position:relative}.joystick[aria-disabled=true]{opacity:.5}.joystick-arrows{text-align:center;color:#8db6b6;pointer-events:none;font-size:16px;line-height:30px;position:absolute;inset:4px}.joystick-knob{width:38px;height:38px;transform:translate(var(--stick-x,0px),var(--stick-y,0px));pointer-events:none;background:#4c8b80;border:2px solid #c6eddf;border-radius:50%;position:absolute;top:29px;left:29px;box-shadow:0 2px 5px #0008}.adventure-tools{padding:7px 12px calc(7px + env(safe-area-inset-bottom));background:#091a29;flex-shrink:0;font-size:12px}.adventure-tools summary{cursor:pointer;color:#98c3c6;min-height:24px;display:list-item}.adventure-tools>div{z-index:3;background:#0b2438f5;border:1px solid #7ca19f;border-radius:8px;padding:12px;position:absolute;bottom:40px;left:8px;right:8px;box-shadow:0 4px 20px #0009}.adventure-tools p{margin:0 0 9px;line-height:1.5}.adventure-tools label{align-items:center;gap:4px;margin-top:8px;display:inline-flex}.adventure-tools output{color:#aecbc9;margin-top:8px;display:block}.adventure-frame[data-status=dying] .adventure-speech{color:#ffd0a2}@media (max-width:340px){.adventure-frame h1{font-size:14px}.adventure-controls{gap:18px}.adventure-hud{padding-inline:9px;font-size:12px}}.header-actions{flex-shrink:0;gap:5px;display:flex}.header-actions button{padding-inline:7px;font-size:12px}.respawn-notice{z-index:1;pointer-events:none;white-space:nowrap;color:#fff1c8;text-shadow:0 2px 3px #061322,2px 0 #061322,-2px 0 #061322;margin:0;font-size:clamp(22px,6vw,32px);font-weight:800;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}.adventure-overlay{z-index:2}.birthday-host{width:100%}.birthday-host .story-frame{color:#f8f0df;overflow-wrap:anywhere;background:linear-gradient(150deg,#173740,#08212c);border-radius:20px;flex-direction:column;gap:18px;width:480px;max-width:100%;min-height:calc(100svh - 32px);max-height:none;padding:24px 26px;display:flex;box-shadow:0 16px 55px #0004}.story-frame.calm{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#21474a;background:radial-gradient(at 0 0,#daebe1,#0000 70%),#faf2df}.story-header{letter-spacing:.14em;font-size:11px}.story-main{flex-direction:column;flex:1;justify-content:center;gap:14px;display:flex}.story-main h1{margin:0;font-size:24px;line-height:1.5}.story-speaker{letter-spacing:.1em;color:#a7d5c7;font-size:13px}.calm .story-speaker{color:#557965}.story-navi{object-fit:contain;align-self:center;width:100%;height:clamp(120px,25svh,220px);margin-bottom:8px;display:block}.story-text p{margin:0 0 14px;font-size:18px;line-height:1.8}.story-text p:last-child{margin-bottom:0}.story-actions{flex-wrap:wrap;gap:10px;padding-top:10px;display:flex}.story-actions button{color:#fff7e7;min-width:120px;min-height:48px;font:inherit;background:#285f61;border:1px solid #285f61;border-radius:10px;flex:1;padding:11px 15px;font-size:16px}.story-actions .secondary{color:#aecfc3;background:0 0;border-color:#72978b}.calm .story-actions .secondary{color:#285f61;border-color:#94b8a1}.story-birthday-mark{color:#94b49e;letter-spacing:.08em;padding-bottom:14px;font-family:Georgia,serif;font-size:clamp(38px,10vw,66px)}.story-toolbox{color:#e9dcc3;background:#35505d;border:3px solid #8c9b9c;border-top-width:8px;border-radius:7px;align-self:center;min-height:60px;padding:12px 32px;font-size:16px;box-shadow:0 4px #060f19}.settlement .story-main{justify-content:flex-start;gap:12px}.settlement .ending-title{text-align:center;font-size:23px}.treasure-stage{aspect-ratio:1;background:radial-gradient(at 50% 85%,#88af8540,#0000 66%);align-self:center;width:min(100%,340px);position:relative}.treasure-animation{object-fit:contain;width:100%;height:100%;display:block}.treasure-open,.treasure-resume{color:#fff5dc;min-height:48px;font:inherit;cursor:pointer;background:#315955;border:1px solid #967142;border-radius:9px;align-self:center;padding:10px 24px}.treasure-open:disabled{opacity:.5}.gift-message{text-align:center;color:#fff8d8;z-index:2;background:#0c2539ee;border:1px solid #cdb36c;border-radius:4px;padding:15px 8px;position:absolute;bottom:8%;left:-3%;right:-3%;box-shadow:0 6px 24px #1a273960}.gift-message p{margin:0;font-size:18px;line-height:1.8}.gift-hint,.ending-note{text-align:center;margin:0;font-size:15px;line-height:1.7}.ending-results{color:#567064;margin-top:4px;font-size:13px;line-height:1.7}.ending-results p{margin:0}.story-frame [hidden]{display:none!important}.opening-scene{background-image:linear-gradient(#081e2bec,#081e2b99),var(--opening-lab)!important;background-position:50%!important;background-size:cover!important}.opening-scene .story-text{text-shadow:0 2px 4px #000}.opening-scene .story-main{justify-content:center}.birthday-host .adventure-frame{width:560px;max-width:100%;height:calc(100svh - 32px);min-height:480px}.birthday-host .adventure-frame [hidden]{display:none!important}.birthday-host .echo-toolbar,.birthday-host .echo-results .actions{flex-wrap:wrap}@media (max-width:600px){.birthday-host .story-frame{border-radius:0;gap:14px;width:100%;min-height:100svh;padding:20px}.birthday-host .adventure-frame{height:100svh}}@media (max-height:650px){.birthday-host .story-frame{gap:10px;padding:16px 18px}.story-main{gap:10px}.story-main h1{font-size:21px}.story-navi{height:115px;margin:0}.story-birthday-mark{padding-bottom:0;font-size:38px}.story-text p{margin-bottom:10px;font-size:17px;line-height:1.65}.settlement .story-main{gap:8px}.settlement .ending-title{font-size:20px}.treasure-stage{width:min(100%,230px)}.gift-message{padding:10px 6px}.gift-message p{font-size:15px}.story-actions{gap:8px;padding-top:4px}.story-actions button{padding:8px 10px;font-size:14px}.ending-results{font-size:12px}}@media (prefers-reduced-motion:no-preference){.gift-message{animation:.45s ease-out gift-message-enter}.opening-scene .story-navi{animation:2.5s ease-in-out infinite navi-float}.wake-slap .story-title{animation:.25s linear wake-slap}@keyframes navi-float{50%{transform:translateY(-5px)}}@keyframes wake-slap{25%{transform:translate(-8px)}75%{transform:translate(8px)}}@keyframes gift-message-enter{0%{opacity:0;transform:scale(.85)translateY(8px)}to{opacity:1;transform:none}}}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f7f0df;background:#0b1d24;font-family:Microsoft JhengHei,PingFang TC,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,input:focus-visible{outline-offset:3px;outline:3px solid #d89843}button:disabled{cursor:wait;opacity:.65}#app{min-height:100vh;place-items:center;min-height:100dvh;padding:16px;display:grid}.game-frame{isolation:isolate;width:420px;max-width:100%;height:calc(100vh - 32px);background:#13353d;border-radius:22px;flex-direction:column;height:calc(100dvh - 32px);min-height:520px;max-height:860px;display:flex;position:relative;overflow:hidden;box-shadow:0 24px 70px #0007}.lab,.shade{width:100%;height:100%;position:absolute;inset:0}.lab{object-fit:cover;z-index:-2}.shade{z-index:-1;pointer-events:none;background:linear-gradient(#08273572,#0827350d 35%,#082735aa)}.scene-header{margin:max(22px,env(safe-area-inset-top)) 22px 0;flex:none;justify-content:space-between;gap:12px;display:flex}.scene-header small{letter-spacing:.15em;color:#b8ddd1;margin-bottom:7px;font-size:11px;display:block}.scene-header strong{text-shadow:0 2px 8px #04232b;font-size:16px;font-weight:500}.build-label{color:#ebd09c;white-space:nowrap;padding-top:3px;font-size:11px}.actor-stage{flex:1;justify-content:center;min-height:0;padding:18px 0 30px;display:flex}.navi{object-fit:contain;filter:drop-shadow(0 8px 16px #08273580);width:60%;height:100%;min-height:0}.dialogue{margin:0 16px max(18px,env(safe-area-inset-bottom));color:#183d40;background:#f7f0df;border:1px solid #dcd0ae;border-radius:17px;flex:none;padding:23px 20px 17px;position:relative;box-shadow:0 12px 28px #001e2960}.speaker{color:#faf3e1;background:#245e60;border:1px solid #91b6a6;border-radius:8px;padding:8px 14px;font-size:14px;line-height:1.3;position:absolute;top:-17px;left:18px}.speaker span{color:#bbdbcc;margin-left:7px;font-size:11px}h1{margin:2px 0 8px;font-size:22px;line-height:1.5}.speech{overflow-wrap:anywhere;min-height:3.4em;margin:4px 0 18px;font-size:18px;line-height:1.7}.actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.actions button{color:#fff9ec;background:#226064;border:1px solid #226064;border-radius:10px;min-height:48px;padding:11px 16px;font-size:16px;line-height:1.4}.actions button.secondary{color:#24545a;background:0 0;border-color:#b7c4b0}.load-status{color:#49665d;min-height:1.6em;margin:0 0 8px;font-size:12px;line-height:1.6}.audio-controls{color:#365c57;align-items:center;gap:18px;margin-bottom:10px;font-size:13px;display:flex}.audio-controls label{align-items:center;gap:7px;min-height:36px;display:flex}.audio-controls input{accent-color:#245e60}.volume-label{flex:1}.volume-label input{width:100%;min-width:0;max-width:150px}@media (max-width:600px){#app{padding:0}.game-frame{width:100%;height:100vh;border-radius:0;height:100dvh;max-height:none}}@media (max-width:350px){.scene-header{margin-left:16px;margin-right:16px}.dialogue{margin-left:12px;margin-right:12px;padding-left:16px;padding-right:16px}.speaker span{display:none}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}.tube-legend{white-space:nowrap;border-radius:5px;padding:2px 7px;font-size:15px;font-weight:700}.tube-legend.purple{color:#4b2c73;background:#ddceef}.tube-legend.red{color:#8a2938;background:#f6ccd0}.playing .actor-stage{flex:0 0 58px;padding:4px 0}.playing .navi{width:50px}.rhythm-hud{justify-content:space-between;margin:0 22px 8px;font-size:16px;display:flex}.rhythm-canvas{background:#0c2431;border:1px solid #80a8a0;border-radius:12px;flex:1;min-height:100px;margin:0 16px 22px;position:relative;overflow:hidden}.rhythm-canvas canvas{display:block}.playing .dialogue{padding-top:20px;padding-bottom:12px}.playing .speech{min-height:1.5em;margin:0 0 4px;font-size:17px;line-height:1.5}.playing .audio-controls{margin-bottom:4px}.playing .actions{grid-template-columns:1fr;gap:6px;display:grid}.actions .rhythm-control{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#245e60;border:2px solid #5f9790;min-height:72px;font-size:20px;box-shadow:inset 0 -5px #144548}.actions .rhythm-control.held{color:#173b3d;box-shadow:none;background:#bcd5ad}.playing .actions .secondary{min-height:36px;padding:6px;font-size:13px}.result-details{grid-template-columns:1fr 1fr;gap:10px;margin:0 0 16px;font-size:15px;display:grid}@media (max-height:650px){.playing .actor-stage{display:none}.playing .scene-header{margin-top:12px;margin-bottom:8px}.playing .dialogue{margin-bottom:8px}.playing .rhythm-hud{margin-bottom:4px}.playing .rhythm-canvas{margin-bottom:16px}}