*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{background:#222e2d;color:#fff4df;font-family:"Inter Variable",sans-serif}canvas{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;display:block;touch-action:none;outline-offset:-5px}.vignette{position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(9,21,23,.3),transparent 25%,transparent 75%,rgba(9,21,23,.32))}.identity{position:absolute;top:42px;left:46px;pointer-events:none;text-shadow:0 2px 18px #16232199}.eyebrow{font-size:11px;letter-spacing:.23em;font-weight:600}h1{font-family:"Instrument Serif",serif;font-size:clamp(36px,4.2vw,62px);line-height:1.05;font-weight:400;letter-spacing:-.025em;margin:14px 0 10px}.identity p{font-size:13px;line-height:1.6;margin:0;color:#fff1dd}.scene-note{position:absolute;right:40px;top:45px;display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.16em;background:#172725b8;border:1px solid #fff2;padding:11px 14px;border-radius:4px;pointer-events:none}.dot{width:5px;height:5px;border-radius:50%;background:#f1c287;box-shadow:0 0 10px #f2b665}.controls{position:absolute;right:40px;bottom:max(35px,env(safe-area-inset-bottom));display:flex;gap:7px}button{font:500 12px "Inter Variable",sans-serif;min-height:44px;border:1px solid #fff3;background:#172725df;color:#fff4df;border-radius:5px;padding:0 16px;cursor:pointer;backdrop-filter:blur(14px)}button:hover{background:#35423c}button:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid #ffe4a2;outline-offset:3px}#settings{background:#eac78f;color:#26352f;border-color:#f2dbae}#settings span{margin-left:14px}.panel{position:absolute;right:40px;bottom:94px;width:276px;padding:20px;border:1px solid #fff3;background:#152823ed;border-radius:7px;backdrop-filter:blur(18px)}.panel label{display:block;font-size:12px;margin-bottom:12px}.panel label>span{display:block}.panel output{float:right;color:#e9ca98;font-variant-numeric:tabular-nums}input[type=range]{width:100%;margin:12px 0 0;accent-color:#e5bf83;min-height:44px}.panel p{margin:0;font-size:11px;color:#dedfcf}.credit{position:absolute;left:46px;bottom:39px;margin:0;font-size:11px;color:#fff0d9;text-shadow:0 1px 8px #12211c}.fallback{position:absolute;left:20%;right:20%;top:45%;padding:25px;background:#152820;line-height:1.7;border:1px solid #eee4}.capture .controls,.capture .panel{display:none}.capture *{transition:none!important}[hidden]{display:none!important}@media(max-width:600px){.identity{top:max(26px,env(safe-area-inset-top));left:24px;right:20px}.eyebrow{font-size:10px;letter-spacing:.16em}h1{font-size:38px;margin:12px 0 8px}.identity p{font-size:12px;max-width:295px}.scene-note{display:none}.controls{left:18px;right:18px;bottom:max(47px,env(safe-area-inset-bottom));gap:6px;justify-content:center}.controls button{padding:0 11px;flex:1;font-size:11px}#settings span{margin-left:4px}.panel{left:18px;right:18px;width:auto;bottom:102px;padding:15px 17px}.panel label{display:grid;grid-template-columns:105px 1fr;align-items:center;gap:10px;margin-bottom:2px;min-height:44px}.panel label>span{font-size:12px}.panel output{float:none;display:block;font-size:11px;margin-top:3px}.panel input[type=range]{margin:0;min-width:0}.panel p{margin-top:5px}.panel p{font-size:11px}.credit{left:0;right:0;bottom:20px;text-align:center;font-size:10px}.fallback{left:7%;right:7%;top:42%}}