html,body{touch-action:none;-webkit-user-select:none;user-select:none;background:#000;height:100%;margin:0;overflow:hidden}#view{width:100vw;height:100vh;display:block}#hud{color:#fff;pointer-events:none;background:#0000008c;border-radius:6px;padding:6px 8px;font:12px/1.35 ui-monospace,monospace;position:fixed;top:48px;left:8px}#stats{margin:4px 0 0}button{color:#fff;touch-action:none;background:#00000073;border:2px solid #fff9;font:600 14px system-ui,sans-serif}#hud-canvas{pointer-events:none;width:100vw;height:100vh;position:fixed;inset:0}body:not(.debug) #stats{display:none}#teleport{border-radius:8px;padding:8px 12px;position:fixed;top:8px;left:8px}#chat{color:#fff;text-shadow:1px 1px #000,-1px -1px #000,1px -1px #000,-1px 1px #000;pointer-events:none;width:min(46vw,420px);font:700 13px/1.35 Arial,sans-serif;position:fixed;top:150px;left:8px}#chat-input{color:#fff;width:100%;font:inherit;pointer-events:auto;background:#0009;border:1px solid #000;border-radius:4px;margin-top:4px;padding:4px 6px}#btn-chat{border-radius:8px;padding:8px 12px;position:fixed;top:8px;left:110px}@media (pointer:coarse){#chat{font-size:11px;top:30px;left:50%;transform:translate(-50%)}#btn-chat{opacity:.6;padding:4px 10px;font-size:11px;top:6px;left:calc(50% + 50px)}}#touch-ui{display:none}@media (pointer:coarse){#touch-ui{display:block}}#stick-base{pointer-events:none;background:#ffffff1a;border:2px solid #ffffff80;border-radius:50%;width:120px;height:120px;margin:-60px 0 0 -60px;display:none;position:fixed}#stick-knob{background:#fff9;border-radius:50%;width:50px;height:50px;position:absolute;top:35px;left:35px}#btn-jump,#btn-run{border-radius:50%;width:76px;height:76px;position:fixed}#btn-jump{bottom:28px;right:24px}#btn-run{bottom:52px;right:112px}#btn-run.active{background:#f08a24bf}#btn-enter{border-radius:10px;padding:10px 16px;position:fixed;bottom:124px;right:24px}#btn-enter[hidden],#btn-passenger[hidden]{display:none}#btn-passenger{border-radius:10px;padding:10px 16px;position:fixed;bottom:172px;right:24px}@media (pointer:coarse){#btn-enter{bottom:40px;right:200px}#btn-passenger{bottom:88px;right:200px}}#wasted{color:#b4191d;letter-spacing:4px;text-shadow:3px 3px #000;pointer-events:none;background:#00000059;place-items:center;font:700 64px/1 Georgia,serif;display:grid;position:fixed;inset:0}#wasted[hidden]{display:none}#btn-horn{border-radius:50%;width:76px;height:76px;position:fixed;bottom:140px;right:112px}#btn-horn[hidden]{display:none}#btn-attack,#btn-aim,#btn-crouch{border-radius:50%;width:72px;height:72px;position:fixed}#btn-attack{background:#a01e1e73;width:84px;height:84px;bottom:118px;right:24px}#btn-aim{bottom:214px;right:24px}#btn-crouch{bottom:124px;right:200px}#btn-aim.active{background:#f08a24bf}#btn-weapon{background:0 0;border:0;width:70px;height:70px;position:fixed;top:8px;right:150px}@media (pointer:fine){#btn-weapon{display:none}}[hidden]{display:none!important}@media (pointer:coarse){body:not(.debug) #hud{display:none}#teleport{opacity:.6;padding:4px 10px;font-size:11px;top:6px;left:50%;transform:translate(-50%)}#touch-ui button,#btn-enter{text-transform:uppercase;background:#0000008c;border:.7vmin solid #fff;border-radius:50%;width:13.5vmin;height:13.5vmin;padding:0;font:700 2.4vmin/1.1 system-ui,sans-serif;position:fixed}#btn-attack,#btn-run,#btn-gas,#btn-brake,#btn-left,#btn-right{width:19vmin!important;height:19vmin!important;bottom:4vmin!important}#btn-attack,#btn-gas{right:3vmin}#btn-run,#btn-brake{right:24vmin}#btn-left{left:3vmin;font-size:7vmin!important}#btn-right{left:24vmin;font-size:7vmin!important}#btn-weapon{width:20vmin;height:20vmin;top:6px;right:6px}body:not(.driving) #btn-gas,body:not(.driving) #btn-brake,body:not(.driving) #btn-left,body:not(.driving) #btn-right,body.driving #btn-attack,body.driving #btn-run,body.driving #btn-crouch,body.driving #btn-aim,body.driving #btn-weapon{display:none}#btn-jump{bottom:26vmin;right:4vmin}#btn-crouch,#btn-horn{bottom:26vmin;right:20vmin}#btn-aim{bottom:26vmin;right:36vmin}#btn-enter{top:auto;bottom:43vmin;right:4vmin}#touch-ui button,#btn-enter{white-space:normal;overflow:hidden}}.screen{z-index:60;color:#fff;-webkit-user-select:none;user-select:none;background:#140d06;font-family:Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;position:fixed;inset:0;overflow:hidden}#loading{z-index:55;transition:opacity .5s}#loading.done{opacity:0;pointer-events:none}.screen[hidden],.panel[hidden]{display:none}.stage{--u:calc(var(--h) / 100);width:max(100vw, 100dvh * var(--r));height:max(100dvh, 100vw / var(--r));background:var(--bg) center / 100% 100% no-repeat;--h:max(100dvh, 100vw / var(--r));position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);container-type:size}#loading .stage{--r:1.7768}#auth .stage{--r:2.1256}#auth .stage.register{background-image:url(/ui/register.webp)}.panel{align-items:stretch;gap:calc(var(--u) * 1.2);padding:calc(var(--u) * 3) calc(var(--u) * 4.4);box-sizing:border-box;border-radius:calc(var(--u) * 2.2);box-shadow:0 0 calc(var(--u) * 4) #0000008c;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:max(13px, calc(var(--u) * 1.95));-webkit-user-select:text;user-select:text;background:#120d08db;border:1.5px solid #f2b72abf;flex-direction:column;display:flex;position:absolute}.panel-login{width:26.4%;min-height:67.1%;top:55.6%;left:39.5%;transform:translateY(-50%)}.panel-register{width:32.4%;min-height:86.6%;padding-left:calc(var(--u) * 5.6);padding-right:calc(var(--u) * 5.6);gap:calc(var(--u) * .9);top:49.1%;left:36.2%;transform:translateY(-50%)}.panel .title{height:max(40px, calc(var(--u) * 9.2));margin-bottom:calc(var(--u) * .4);align-self:center}.panel-register .title{height:max(44px, calc(var(--u) * 10.4))}.panel .rule{height:1px;margin:calc(var(--u) * -.6) 9% 0;background:linear-gradient(90deg,#0000,#f2b72ae6 12% 88%,#0000)}.panel .lead{margin:0 0 calc(var(--u) * 1.6);text-align:center;line-height:1.35}.panel-register .lead{margin-bottom:calc(var(--u) * 1.8);font-size:1.05em}.field{height:max(38px, calc(var(--u) * 6.8));border-radius:calc(var(--u) * .9);background:#00000073;border:1px solid #fff3;align-items:center;display:flex;overflow:hidden}.field:focus-within{border-color:#f2b72ae6;box-shadow:0 0 0 2px #f2b72a40}.field svg{fill:#fff;flex:none;width:1.45em;height:1.45em;padding:0 .95em}.field input{color:#fff;min-width:0;height:100%;font:inherit;background:0 0;border:0;outline:none;flex:1;padding:0 .8em 0 0;font-size:max(16px,1em)}.field input::placeholder{color:#ffffffb3}.hint{margin:calc(var(--u) * -.5) 0 calc(var(--u) * .5) 4.1em;color:#ffffffbf;font-size:.68em}.error{text-align:center;color:#ff8a7a;min-height:1.2em;margin:0;font-size:.85em}.error.info{color:#a9c4e4}.btn{height:max(40px, calc(var(--u) * 6.6));border-radius:calc(var(--u) * .9);font:inherit;cursor:pointer;justify-content:center;align-items:center;gap:.6em;font-size:1.12em;font-weight:700;display:flex}.btn svg{fill:currentColor;width:1.3em;height:1.3em}.btn.primary{color:#15100a;background:linear-gradient(#f6c234,#eeac16);border:0}.btn.primary:hover{background:linear-gradient(#ffd04a,#f4b521)}.btn.outline{color:#fff;background:#00000059;border:1.5px solid #fff}.btn.outline:hover{background:#ffffff1a}.btn:disabled{opacity:.55;cursor:wait}.or{align-items:center;gap:.9em;font-size:.95em;display:flex}.or:before,.or:after{content:"";background:#ffffff59;flex:1;height:1px}.link{margin-top:calc(var(--u) * 1.2);color:#fff;font:inherit;text-underline-offset:3px;cursor:pointer;background:0 0;border:0;align-self:center;font-size:1.05em;text-decoration:underline}.server{text-align:center;color:#fff9;margin:0;font-size:.72em}.loading-ui{width:50.9%;left:24.5%;top:min(76.6%, calc(50% + 50dvh - var(--u) * 22 - 10px));flex-direction:column;align-items:center;display:flex;position:absolute}.loading-title{height:max(26px, calc(var(--u) * 6.2))}.bar{width:100%;height:max(14px, calc(var(--u) * 3.9));margin-top:calc(var(--u) * 1.4);padding:max(3px, calc(var(--u) * .45));box-sizing:border-box;border:max(2px, calc(var(--u) * .28)) solid #e6e6e6d9;background:#0a0806d9;border-radius:999px;box-shadow:0 2px 10px #0009}.bar-fill{background:linear-gradient(#ffe066,#f7c21d 45%,#e9a400);border-radius:999px;width:0;height:100%;transition:width .25s ease-out;box-shadow:0 0 8px #ffc82899}.tip{margin:calc(var(--u) * 1.8) 0 0;max-width:92%;font-size:max(13px, calc(var(--u) * 2.5));text-align:center;text-shadow:0 1px 4px #000;align-items:center;gap:1.1em;min-height:2.6em;line-height:1.3;display:flex}.tip svg{flex:none;width:1.9em;height:1.9em}.tip span{flex:1}#loading.failed .tip{color:#ff9a8a}#loading.failed .bar-fill{box-shadow:none;background:#b33}.fallback{text-align:center;font-family:Old English Text MT,UnifrakturMaguntia,serif;font-size:2.6em}@media (height<=640px),(width<=900px),(orientation:portrait){.stage{background-size:cover;width:100%;height:100%;top:0;left:0;transform:none}.panel,.panel-login,.panel-register{--u:8.6px;width:min(92vw,420px);min-height:0;max-height:calc(100dvh - 16px);padding:18px 22px;font-size:14px;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}.loading-ui{--u:8px;top:auto;left:50%;bottom:max(14px, env(safe-area-inset-bottom));width:min(88vw,640px);position:fixed;transform:translate(-50%)}.tip{font-size:13px}}@media (orientation:portrait){#auth .stage{background-position:80%}}@media (height<=520px){.panel,.panel-login,.panel-register{--u:6px;gap:7px;padding:12px 18px}.panel .hint,.panel .lead{display:none}}#gametext{color:#fff;letter-spacing:1px;text-align:center;text-shadow:2px 2px #000,-2px -2px #000,2px -2px #000,-2px 2px #000;pointer-events:none;z-index:30;max-width:90vw;font:700 clamp(22px,5vmin,44px)/1.15 Georgia,serif;position:fixed;top:62%;left:50%;transform:translate(-50%,-50%)}#dialog{z-index:40;background:#0000004d;place-items:center;display:grid;position:fixed;inset:0}#hudtext{color:#fff;text-shadow:1px 1px #000;pointer-events:none;z-index:25;background:#00000073;border-radius:4px;padding:4px 10px;font:700 clamp(12px,2.4vmin,18px)/1.3 Arial,sans-serif;position:fixed;bottom:2.5vmin;right:2.5vmin}#hudtext[hidden],#gametext[hidden],#dialog[hidden],#dialog [hidden]{display:none}.dialog-box{color:#c8d2e0;background:#000000d1;border:1px solid #000;flex-direction:column;width:min(92vw,420px);max-height:86vh;font:14px/1.4 Arial,sans-serif;display:flex}.dialog-title{color:#fff;background:#141414f2;padding:6px 10px;font-weight:700}.dialog-body{white-space:pre-wrap;padding:12px 10px;overflow-y:auto}.dialog-list{border:1px solid #333;outline:none;margin:8px;overflow-y:auto}.dialog-item{cursor:pointer;padding:7px 8px}.dialog-item.selected{color:#fff;background:#a02a2a}.dialog-input{color:#fff;font:inherit;background:#111;border:1px solid #555;margin:0 10px 10px;padding:6px}.dialog-buttons{justify-content:center;gap:12px;padding:8px 10px 12px;display:flex}.dialog-buttons button{color:#fff;min-width:96px;font:inherit;background:#1c1c1c;border:1px solid #777;border-radius:4px;padding:7px 14px}.dialog-buttons button:focus-visible,.dialog-buttons button:hover{border-color:#c03030}
