*{box-sizing:border-box}body{margin:0;background:#101427;color:#fff2da;font-family:system-ui,"Microsoft YaHei",sans-serif;overflow:hidden}#world,canvas{position:fixed;inset:0;width:100%;height:100%}header{position:fixed;top:28px;left:36px;right:36px;display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:3px}header a{color:inherit;text-decoration:none;font-size:18px;letter-spacing:1px}button{font:inherit;color:inherit;background:#fff2da12;border:1px solid #fff2da55;border-radius:30px;padding:13px 24px;cursor:pointer;touch-action:none}button:hover,button:active{background:#fff2da30}#intro,#ending{position:fixed;left:9vw;top:24vh}h1{font-family:serif;font-size:clamp(42px,6vw,90px);font-weight:500;line-height:1.2;letter-spacing:5px;margin:20px 0 30px}p{font-size:14px;letter-spacing:3px;color:#dcc7cd}small{display:block;margin-top:24px;color:#b9b6c9;font-size:12px}#story{position:fixed;top:18%;left:50%;transform:translateX(-50%);font-size:18px;letter-spacing:3px;text-shadow:0 2px 12px #000;pointer-events:none;transition:opacity .5s;text-align:center;width:85%}footer{position:fixed;bottom:35px;left:36px;right:36px;display:flex;gap:24px;align-items:center;font-size:12px;letter-spacing:2px}#progress{flex:1;height:2px;background:#ffffff25}#progress i{display:block;height:100%;width:0;background:#ffca86}#controls{position:fixed;bottom:78px;right:36px;display:none;gap:8px}#ending{background:#131528b0;padding:28px;backdrop-filter:blur(15px);border-radius:12px}body.playing #intro{display:none}body.playing #controls{display:flex}@media(max-width:600px){header{left:18px;right:18px;top:18px}header span{display:none}footer{left:18px;right:18px;bottom:22px}#controls{right:18px;bottom:65px}#controls button{padding:15px}#intro,#ending{left:7vw;top:25vh}small{max-width:270px;line-height:1.8}}

.heist #ending{top:auto;left:6vw;bottom:13vh;padding:24px 30px;max-width:450px}.heist #ending h1{font-size:42px;letter-spacing:2px;margin:14px 0 22px}.heist #ending p{font-size:12px;letter-spacing:1px}.heist:has(#ending:not([hidden])) #controls{display:none}

@media(max-width:600px){.heist #controls{left:14px;right:14px;gap:5px;justify-content:center;flex-wrap:wrap}.heist #controls button{padding:12px 13px;font-size:13px}.heist #ending{left:5vw;right:5vw;bottom:18vh;max-width:none;padding:22px}.heist #ending h1{font-size:32px}.heist #ending button{padding:10px 12px;font-size:12px;margin:3px}.heist #story{font-size:14px;letter-spacing:1px;top:15%}.heist footer{gap:8px;font-size:10px;letter-spacing:0}}

.heist.finale #controls{display:none}.heist #ending:not([hidden]){animation:finale-reveal .45s ease-out}@keyframes finale-reveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.heist #ending:not([hidden]){animation:none}}

.record-option{display:block;margin-top:16px;font-size:12px;color:#c6bdc9;letter-spacing:0}.record-option input{accent-color:#da836a;margin-right:8px}
.heist header{gap:14px}.heist header>a:first-child{margin-right:auto;white-space:nowrap}.heist header span{margin-right:auto}.heist #record-download{font-size:12px;letter-spacing:0;padding:10px 14px;border:1px solid #fff2da55;border-radius:24px;background:#101427b0;white-space:nowrap}.heist #stop-recording{letter-spacing:0;white-space:nowrap;padding:10px 14px}.heist #record-download[hidden]{display:none}@media(max-width:600px){.heist header{gap:6px;flex-wrap:wrap}.heist header>a:first-child{font-size:15px}.heist header button{padding:9px 12px;letter-spacing:0}.heist #record-download{font-size:11px;padding:9px 10px}}
