html,body,#root{margin:0;height:100%;background:#0b0d1a;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:none}.hud{position:fixed;inset:0;pointer-events:none;font-family:Georgia,Times New Roman,serif;color:#fff4e0;text-align:center}.hud h1{margin:0;font-weight:400;font-size:clamp(36px,7vw,72px);letter-spacing:.25em;text-indent:.25em}.hud p{margin:12px 0 0;font-size:clamp(14px,1.8vw,18px);opacity:.8}.hud kbd{font-family:inherit;border:1px solid rgba(255,244,224,.5);border-radius:4px;padding:1px 6px}.title,.msg,.final,.controls,.start{position:absolute;left:0;right:0;opacity:0;transition:opacity 1.6s ease}.title{top:38%}.title h1{font-size:clamp(44px,9vw,96px)}.controls{top:12%}.start{inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:radial-gradient(ellipse at center,#141e128c,#080c08d9);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none}.start.show{pointer-events:auto}.begin{font-family:Georgia,Times New Roman,serif;font-size:20px;letter-spacing:.2em;text-indent:.2em;color:#fff4e0;background:#ffe4aa14;border:1px solid rgba(255,228,170,.6);border-radius:999px;padding:12px 36px;cursor:pointer;transition:background .3s ease,box-shadow .3s ease}.begin:hover,.begin:focus-visible{background:#ffe4aa2e;box-shadow:0 0 24px #ffd28273;outline:none}.msg{top:18%;font-size:clamp(18px,2.6vw,28px);font-style:italic;letter-spacing:.05em}.fade{position:absolute;inset:0;background:#fff6ea;opacity:0;transition:opacity 2.5s ease}.final{top:50%;transform:translateY(-50%);color:#6b4a58}.final small{display:block;margin-top:28px;opacity:.6;font-size:14px}.show{opacity:1}.hud .hint{margin-top:6px;font-size:clamp(12px,1.4vw,15px);opacity:.6}canvas{cursor:grab}body.grabbing,body.grabbing canvas{cursor:grabbing}.goal{position:absolute;top:22px;left:26px;font-size:clamp(14px,1.6vw,17px);font-style:italic;letter-spacing:.04em;opacity:0;transition:opacity 1.6s ease;text-shadow:0 1px 8px rgba(0,0,0,.6)}.goal.show{opacity:.85}.prompt{position:absolute;left:50%;bottom:22%;transform:translate(-50%);white-space:nowrap;font-size:clamp(15px,1.8vw,19px);letter-spacing:.08em;opacity:0;transition:opacity .5s ease;text-shadow:0 1px 8px rgba(0,0,0,.7);-webkit-touch-callout:none}.prompt.touch-ui{bottom:max(120px,24%);padding:14px 28px;border-radius:999px;border:1.5px solid rgba(255,228,170,.7);background:#14161e73;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);font-size:18px}.say{position:absolute;left:50%;bottom:7%;transform:translate(-50%);width:min(680px,calc(100% - 32px));box-sizing:border-box;padding:18px 26px 14px;border-radius:14px;background:#0c0c149e;border:1px solid rgba(255,228,170,.25);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);opacity:0;transition:opacity .6s ease;cursor:pointer}.say.show{pointer-events:auto}.prompt.show,.say.show{opacity:1}.prompt.show{pointer-events:auto;cursor:pointer}.say p{margin:0;font-size:clamp(17px,2.2vw,22px);font-style:italic;opacity:1;line-height:1.45}.say small{display:block;margin-top:8px;text-align:right;font-size:12px;opacity:.5}.touch{position:absolute;inset:0;opacity:0;transition:opacity .8s ease;pointer-events:none}.touch.show{opacity:1}.touch.show .touch-btn{pointer-events:auto}.joy{position:absolute;width:110px;height:110px;margin:-55px 0 0 -55px;border-radius:50%;border:1.5px solid rgba(255,244,224,.45);background:#fff4e014;opacity:0;transition:opacity .2s ease}.joy.on{opacity:1}.joy .knob{position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:#ffecc88c}.touch-btn{position:absolute;right:max(22px,env(safe-area-inset-right,0px));width:74px;height:74px;border-radius:50%;border:1.5px solid rgba(255,244,224,.55);background:#14161e59;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);color:#fff4e0;font-family:Georgia,Times New Roman,serif;font-size:15px;letter-spacing:.06em;-webkit-tap-highlight-color:transparent}.touch-btn.jump{bottom:max(28px,env(safe-area-inset-bottom,0px))}.touch-btn.run{bottom:calc(max(28px,env(safe-area-inset-bottom,0px)) + 92px);right:calc(max(22px,env(safe-area-inset-right,0px)) + 30px);width:62px;height:62px;font-size:13px}.touch-btn.active{background:#ffd28273;border-color:#ffe4aaf2;box-shadow:0 0 16px #ffd28280}.touch-btn:active{transform:scale(.94)}.prompt .bar{display:block;width:160px;height:4px;margin:10px auto 0;border-radius:2px;background:#fff4e033;overflow:hidden}.prompt .bar span{display:block;height:100%;background:#ffd98a;box-shadow:0 0 10px #ffd282e6;transform-origin:left center;transition:transform .12s linear}.prompt.holding.show:not(.touch-ui){padding:14px 0}