:root{color-scheme:dark;font:14px 'Segoe UI',sans-serif;color:#eceeea;background:#0c141c}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;justify-content:space-between;padding:20px 28px;border-bottom:1px solid #ffffff20;gap:16px}small{font-size:10px;letter-spacing:2px;color:#d8bb84}h1{font:28px Georgia,serif;margin:7px 0 0}nav,.row,#angles{display:flex;gap:8px;flex-wrap:wrap;align-items:center}a{color:#d8bb84;margin-right:16px}button{background:#ffffff08;color:#eceeea;border:1px solid #ffffff30;padding:10px 12px;border-radius:7px;font:inherit;cursor:pointer}button:hover{background:#ffffff18}button[aria-pressed=true],#load{background:#d8bb8424;border-color:#d8bb84;color:#f5dcae}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid #d8bb84;outline-offset:2px}main{display:grid;grid-template-columns:minmax(0,1fr) 300px;height:calc(100dvh - 97px);min-height:480px}#stage{position:relative;background:#000;min-width:0;min-height:350px;overflow:hidden}#screen{display:block;width:100%;height:100%;touch-action:none;cursor:grab}#hud,#hint{position:absolute;pointer-events:none;background:#101b25d9;padding:9px 14px;border-radius:8px;color:#c2ced8;font-size:12px}#hud{top:18px;right:18px}#hint{bottom:18px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;text-align:center}aside{overflow:auto;padding:24px;background:#14202b;border-left:1px solid #ffffff20}p{line-height:1.55;color:#aebec9;font-size:12px}#angles{margin-top:14px}#angles button{flex:1;padding:10px 8px}label{display:block;font-size:12px;color:#b8c6ce;margin:18px 0}input[type=range]{display:block;width:100%;accent-color:#d8bb84;margin:12px 0}.row{margin:10px 0}.row button{flex:1;font-size:12px}hr{border:0;border-top:1px solid #ffffff20;margin:24px 0}.fine{font-size:11px}#source{display:block;overflow-wrap:anywhere}#demo{margin-top:12px;font-size:12px}#error{position:absolute;top:65px;left:5%;right:5%;background:#3b2424;padding:16px;color:#ffdad0;border:1px solid #b57e72}output{font-variant-numeric:tabular-nums}[hidden]{display:none!important}body:fullscreen main{height:calc(100dvh - 97px)}@media(max-width:800px){header{padding:16px;flex-wrap:wrap}h1{font-size:23px}main{height:auto;display:flex;flex-direction:column}#stage{height:60dvh}aside{overflow:visible}#hint{font-size:10px}nav{font-size:12px}}

#enterVR{border-color:#d8bb84;color:#f5dcae}#vrStatus{border-left:2px solid #d8bb84;padding-left:10px;margin-top:0}