:root{--ink: #3b4a5c;--ink-soft: #5d6e82;--mist: rgba(246, 249, 252, .72);--mist-hover: rgba(255, 255, 255, .9);--sky-top: #6f9ccb;--sky-bottom: #c3d6ea}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:Segoe UI,system-ui,-apple-system,Helvetica Neue,Arial,sans-serif;color:var(--ink);background-color:var(--sky-top);background:linear-gradient(180deg,var(--sky-top),var(--sky-bottom))}[hidden]{display:none!important}.screen{position:fixed;top:0;right:0;bottom:0;left:0}.intro{display:grid;place-items:center;overflow:auto;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))}.intro-card{max-width:34rem;text-align:center;padding:40px 32px;background:var(--mist);border-radius:24px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.intro-card h1{margin:0 0 20px;font-weight:300;font-size:2rem;letter-spacing:.04em}.notice{margin:0 0 12px;font-size:1.1rem;line-height:1.5}.about{margin:0 0 28px;font-size:1rem;line-height:1.5;color:var(--ink-soft)}button{font:inherit;color:var(--ink);cursor:pointer;border:1px solid rgba(255,255,255,.7);background:var(--mist);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .3s ease,transform .3s ease}button:hover{background:var(--mist-hover)}button:active{transform:scale(.98)}button:focus-visible{outline:3px solid #6f8fb0;outline-offset:3px}.primary{font-size:1.1rem;padding:14px 40px;border-radius:999px}.scene canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.buttons{position:absolute;left:0;right:0;bottom:0;padding:0 max(20px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));display:flex;flex-wrap:wrap;justify-content:center;gap:14px}.buttons button{flex:1 1 180px;max-width:260px;min-height:56px;padding:12px 20px;font-size:1rem;border-radius:18px}@media(max-width:640px){.buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-bottom:max(14px,env(safe-area-inset-bottom))}.buttons button{max-width:none;min-height:48px;padding:8px 10px;font-size:.9rem;line-height:1.2;border-radius:14px}}@media(max-height:520px)and (orientation:landscape){.buttons{display:flex;flex-wrap:nowrap;gap:10px;padding-bottom:max(10px,env(safe-area-inset-bottom))}.buttons button{flex:1 1 0;max-width:none;min-height:44px;padding:6px 10px;font-size:.9rem;line-height:1.2;border-radius:14px}.whisper{top:14%;font-size:clamp(1rem,2.4vw,1.4rem)}.intro-card{padding:20px 28px}.intro-card h1{font-size:1.5rem;margin-bottom:12px}.notice,.about{font-size:.95rem;margin-bottom:10px}}.whisper{position:absolute;left:50%;top:22%;transform:translate(-50%);width:min(90vw,40rem);margin:0;text-align:center;font-size:clamp(1.25rem,2.6vw,1.9rem);font-weight:300;line-height:1.4;letter-spacing:.02em;color:#fff;text-shadow:0 1px 14px rgba(40,70,110,.45);opacity:0;pointer-events:none}.mute{position:absolute;top:max(18px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right));width:44px;height:44px;padding:0;border-radius:50%;display:grid;place-items:center;opacity:.7}.mute:hover{opacity:1}.mute svg{width:22px;height:22px;fill:var(--ink);stroke:var(--ink);stroke-width:1.8;stroke-linecap:round}.mute .icon-off,.mute[aria-pressed=true] .icon-on{display:none}.mute[aria-pressed=true] .icon-off{display:block}@media(prefers-reduced-motion:reduce){button{transition:none}}