:root{--ink: #e9e4d8;--muted: #9aa3b2;--gold: #d8b06a;--panel: rgba(8, 12, 20, .62);--line: rgba(233, 228, 216, .16)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#050810;color:var(--ink);font:14px/1.5 Iowan Old Style,Palatino Linotype,Palatino,"Noto Serif TC",Songti TC,serif}#scene{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;display:block;touch-action:none}#intro{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:16px;z-index:5;background:radial-gradient(ellipse at 50% 60%,#05081026,#050810bf 75%);transition:opacity 1.8s ease,visibility 1.8s}#intro.gone{opacity:0;visibility:hidden}#intro .card{text-align:center;max-width:520px}.eyebrow{letter-spacing:.35em;text-transform:uppercase;font-size:11px;color:var(--gold);margin:0 0 14px}h1{font-weight:400;font-size:clamp(38px,8vw,64px);letter-spacing:.04em;margin:0;line-height:1.05}h1 span{display:block;font-size:.42em;letter-spacing:.5em;color:var(--muted);margin-top:12px;padding-left:.5em}.sub{color:var(--muted);margin:22px 0 30px}button{font:inherit;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:999px;padding:8px 16px;cursor:pointer;transition:border-color .2s,color .2s,background .2s}button:hover,button:focus-visible{border-color:var(--gold);color:var(--gold);outline:none}#enter{padding:13px 30px;letter-spacing:.12em;border-color:#d8b06a99;background:#d8b06a14}#hud{opacity:0;transition:opacity 2s ease 2s;pointer-events:none}body.entered #hud{opacity:1}body.clean #hud{opacity:0!important;transition-delay:0s}body.clean #hud *{pointer-events:none!important}#hud>*{pointer-events:auto}#title{position:fixed;top:18px;left:20px;letter-spacing:.08em;font-size:15px}#title span{color:var(--muted);margin-left:8px;letter-spacing:.3em;font-size:12px}#hint{position:fixed;bottom:22px;left:50%;transform:translate(-50%);margin:0;color:var(--muted);font-size:13px;text-align:center;width:max-content;max-width:calc(100vw - 32px);transition:opacity 2s;pointer-events:none!important}#hint.gone{opacity:0}#controls{position:fixed;bottom:16px;right:16px;display:flex;gap:8px}#controls button{background:var(--panel);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:13px}#mixer{position:fixed;bottom:62px;right:16px;width:260px;padding:14px 16px 10px;border-radius:14px;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transform:translateY(8px);pointer-events:none!important;transition:opacity .25s,transform .25s}#mixer.open{opacity:1;transform:none;pointer-events:auto!important}.mixrow{display:grid;grid-template-columns:112px 1fr;align-items:center;gap:10px;margin:6px 0;font-size:13px;color:var(--muted)}.mixrow input{width:100%;accent-color:var(--gold)}.keys{color:var(--muted);font-size:11px;margin:10px 0 0}kbd{border:1px solid var(--line);border-radius:4px;padding:0 5px;font:11px ui-monospace,monospace}@media(max-width:600px){#hint{bottom:64px}#mixer{width:calc(100vw - 32px)}}