:root{font-family:"Segoe UI",sans-serif;color:#f4fbff;background:#05060b;color-scheme:dark}*{box-sizing:border-box}body{margin:0;overflow:hidden}canvas{display:block;touch-action:none}#hud{position:fixed;z-index:3;left:24px;top:24px;width:min(350px,calc(100vw - 32px));max-height:calc(100dvh - 90px);overflow:auto;padding:22px;border:1px solid #93dcff36;border-radius:22px;background:#05080fee;box-shadow:0 20px 70px #0008}h1,p{margin:0}h1{font-size:38px;letter-spacing:-.045em}.eyebrow{font-size:12px;letter-spacing:.13em;color:#76e8ff;margin-bottom:7px}p{color:#b6c5d2;line-height:1.5;font-size:16px;margin:12px 0}.legend{display:flex;flex-wrap:wrap;gap:12px;font-size:14px}.cyan{color:#56efff}.amber{color:#ffc468}.violet{color:#bd76ff}button,select{padding:12px 16px;border:1px solid #527081;border-radius:12px;background:#142432;color:#eaffff;font:600 15px "Segoe UI",sans-serif;cursor:pointer}button:disabled{opacity:.5;cursor:default}button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffc468;outline-offset:3px}#enter{background:#a8f5ff;color:#071014}.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}#status{font-size:14px;color:#a9d3e1}.controls{display:grid;gap:12px;border-top:1px solid #ffffff22;padding-top:12px}label{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:16px}input{width:65%;accent-color:#56efff}details{margin-top:16px;border-top:1px solid #ffffff22;padding-top:14px}summary{cursor:pointer;font-size:15px}details p,.fine{font-size:14px}pre{white-space:pre-wrap;font-size:13px;line-height:1.5;color:#a8f5ff}#help{position:fixed;z-index:2;bottom:18px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 24px);padding:10px 16px;border-radius:14px;background:#071019e8;color:#bcd0dd;font-size:14px;text-align:center}body.in-vr #hud,body.in-vr #help{display:none}@media(max-width:600px){#hud{left:16px;top:12px;padding:16px;max-height:48dvh}h1{font-size:30px}#hud>p:nth-of-type(2){display:none}.controls{grid-template-columns:1fr 1fr}.controls label:first-child{grid-column:1/-1}#help{font-size:13px}}
.controls>*{min-width:0}select{max-width:100%;min-width:0}label{min-width:0}input{min-width:0}@media(max-width:600px){.controls{grid-template-columns:1fr}.controls label:first-child{grid-column:auto}}