*{box-sizing:border-box}:root{font-family:Avenir Next,Trebuchet MS,ui-rounded,sans-serif;color:#17343b;background:#dff5f7;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #17343b;--muted: #657980;--paper: rgb(255 251 239 / 90%);--paper-soft: rgb(255 252 242 / 74%);--line: rgb(255 255 255 / 70%);--sand: #f3ce82;--sun: #f5bd47;--sea: #2aa8cc;--guide-a: #c26e4f;--guide-b: #497fa3;--guide-c: #5b8c67}html,body,#app{width:100%;min-width:320px;height:100%;margin:0}body{overflow:hidden}button{font:inherit}.game-shell{position:relative;width:100%;height:100%;min-height:520px;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,#88d5e7,#b9e9e8 53%,#f3ce82)}.scene-host,.scene-host canvas{display:block;width:100%;height:100%}.hud{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;justify-content:space-between;gap:16px;padding:clamp(14px,2.4vw,28px);pointer-events:none}.top-row,.bottom-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.brand,.status,.prompt,.debug-help,.result-card{border:1px solid var(--line);background:var(--paper);box-shadow:0 12px 30px #21515b24;-webkit-backdrop-filter:blur(11px);backdrop-filter:blur(11px)}.brand{border-radius:999px;padding:9px 15px;color:var(--ink);font-size:.82rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.status{border-radius:999px;padding:9px 12px;color:var(--muted);font-size:.71rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.status:before{content:"";display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 3px #f5bd4733}.status[data-state=ready]:before{background:#2f9d67;box-shadow:0 0 0 3px #2f9d6733}.status[data-state=unavailable]:before{background:#7b8790;box-shadow:0 0 0 3px #7b87902e}.status[data-state=error]:before{background:#d94a4a;box-shadow:0 0 0 3px #d94a4a33}.prompt{align-self:flex-end;max-width:min(460px,86vw);border-radius:18px 18px 5px;padding:12px 16px;color:var(--ink);font-size:.96rem;font-weight:760;line-height:1.35}.prompt strong{display:block;margin-bottom:3px;color:#687b7d;font-size:.7rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.debug-help{border-radius:14px;padding:10px 12px;color:var(--muted);font-size:.78rem;font-weight:760;line-height:1.45}.guide-chorus{position:absolute;left:clamp(14px,1.5vw,22px);bottom:clamp(84px,10vh,112px);z-index:6;width:min(348px,calc(100vw - 36px));padding:14px;border:1px solid rgb(255 255 255 / 72%);border-radius:20px;background:linear-gradient(145deg,#fffcf1f0,#faf1d2db);box-shadow:0 18px 42px #2c525333;-webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);pointer-events:auto}.guide-title{display:flex;align-items:center;gap:8px;margin-bottom:5px;color:var(--ink);font-size:.77rem;font-weight:950;letter-spacing:.13em}.guide-title:before{content:"LIVE";display:inline-flex;align-items:center;min-height:18px;padding:0 6px;border-radius:999px;background:var(--ink);color:#fff9e9;font-size:.55rem;letter-spacing:.11em}.guide-subtitle{margin:0 0 12px;color:#657b7d;font-size:.72rem;font-weight:700;line-height:1.35}.guide-rows{display:grid;gap:7px}.guide-row{--guide-accent: #768a95;margin:0;padding:7px 8px 6px;border:0;border-left:4px solid var(--guide-accent);border-radius:11px;background:#ffffff78}.guide-row[data-guide=A]{--guide-accent: var(--guide-a)}.guide-row[data-guide=B]{--guide-accent: var(--guide-b)}.guide-row[data-guide=C]{--guide-accent: var(--guide-c)}.guide-row-controls{display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:7px}.guide-label{display:inline-grid;place-items:center;width:23px;height:23px;border-radius:50%;background:var(--guide-accent);color:#fffdf2;font-size:.7rem;font-weight:950;text-align:center}.guide-row input{width:100%;min-width:0;border:1px solid rgb(23 52 59 / 14%);border-radius:8px;padding:7px 8px;background:#ffffffa6;color:var(--ink);font:inherit;font-size:.74rem;outline:none}.guide-row input::placeholder{color:#849493}.guide-row input:focus-visible{border-color:var(--guide-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--guide-accent) 22%,transparent)}.guide-send{min-height:30px;border:0;border-radius:999px;padding:0 10px;background:var(--ink);color:#fffdf2;font-size:.6rem;font-weight:950;letter-spacing:.06em;cursor:pointer;transition:transform .14s ease,background-color .14s ease}.guide-send:hover{transform:translateY(-1px);background:var(--guide-accent)}.guide-send:focus-visible,.guide-toggle:focus-visible,.restart:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.guide-latest{max-height:2.7em;overflow:auto;margin:6px 0 0 32px;padding:4px 7px;border-radius:7px;background:#ffffff6b;color:#5f7476;font-size:.68rem;font-weight:700;line-height:1.35;overflow-wrap:anywhere}.guide-latest[data-has-message=false]{background:transparent;color:#9aa9a7;font-style:italic}.guide-feedback{min-height:1.1em;margin:8px 2px 0;color:#b04d3c;font-size:.68rem;font-weight:800}.guide-feedback[data-state=success]{color:#3b805d}.guide-toggle{display:none;align-items:center;justify-content:space-between;width:100%;border:0;padding:0;background:transparent;color:var(--ink);font-size:.74rem;font-weight:950;letter-spacing:.13em;text-align:left;cursor:pointer}.guide-toggle-icon{font-size:1rem;line-height:1;transition:transform .16s ease}.guide-chorus[data-collapsed=true] .guide-toggle{display:flex}.guide-chorus[data-collapsed=true] .guide-content{display:none}.guide-chorus[data-collapsed=false] .guide-toggle-icon{transform:rotate(180deg)}.result-wrap{position:absolute;inset:0;z-index:10;display:grid;place-items:center;padding:22px;background:#1433413d;opacity:0;visibility:hidden;transition:opacity .22s ease;pointer-events:none}.result-wrap[data-visible=true]{opacity:1;visibility:visible;pointer-events:auto}.result-card{position:relative;width:min(400px,92vw);overflow:hidden;border:2px solid rgb(255 255 255 / 78%);border-radius:28px;padding:28px;background:linear-gradient(145deg,#fffceff5,#ffefb5f2);text-align:center;box-shadow:0 22px 70px #122f3c47;transform:translateY(10px) scale(.96);transition:transform .26s cubic-bezier(.22,1,.36,1)}.result-wrap[data-visible=true] .result-card{transform:translateY(0) scale(1)}.result-card:before,.result-card:after{content:"";position:absolute;width:120px;height:18px;border-radius:50%;background:#e64d452e;transform:rotate(-24deg)}.result-card:before{top:18px;left:-40px}.result-card:after{right:-40px;bottom:28px;transform:rotate(24deg)}.result-card h1{position:relative;z-index:1;margin:0 0 9px;color:#17343b;font-size:clamp(2.1rem,7vw,3.2rem);line-height:.92;letter-spacing:-.04em}.result-card p{position:relative;z-index:1;margin:0 0 18px;color:#617376;font-weight:760}.stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}.stat{padding:11px 6px;border:1px solid rgb(23 52 59 / 8%);border-radius:14px;background:#ffffff75}.stat strong,.stat span{display:block}.stat strong{color:var(--ink);font-size:1.25rem}.stat span{margin-top:2px;color:#748687;font-size:.68rem;font-weight:850;text-transform:uppercase}.restart{position:relative;z-index:1;width:100%;min-height:48px;border:0;border-radius:14px;background:var(--ink);color:#fffdf2;font-weight:900;cursor:pointer}@media(max-width:640px),(max-aspect-ratio:.75){.game-shell{min-height:460px}.hud{padding:14px}.top-row,.bottom-row{align-items:stretch}.brand{max-width:65vw;overflow:hidden;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}.status{padding:8px 9px;font-size:.61rem;white-space:nowrap}.bottom-row{flex-direction:column-reverse}.prompt{align-self:stretch;max-width:none;font-size:.88rem}.guide-chorus{right:14px;left:auto;bottom:108px;width:min(300px,calc(100vw - 76px));max-height:min(54vh,420px);padding:11px 12px;border-radius:16px}.guide-toggle{display:flex}.guide-chorus[data-collapsed=true]{right:14px;left:14px;width:auto}.guide-title{display:none}.guide-subtitle{margin-bottom:9px;font-size:.68rem}.guide-row{padding:6px 7px 5px}.guide-row input{font-size:.7rem}.guide-send{padding:0 8px;font-size:.56rem}}@media(prefers-reduced-motion:reduce){.guide-send,.guide-toggle-icon,.result-wrap,.result-card{transition:none}.guide-send:hover{transform:none}}