html,body{background:#000;width:100%;height:100%;margin:0;overflow:hidden}canvas{width:100vw;height:100dvh;display:block}.controls{left:50%;bottom:max(24px, env(safe-area-inset-bottom));letter-spacing:.02em;opacity:1;gap:8px;font:500 13px/1 system-ui,-apple-system,Segoe UI,sans-serif;transition:opacity .3s;display:flex;position:fixed;transform:translate(-50%)}.controls.is-hidden{opacity:0;visibility:hidden;transition:opacity .6s,visibility 0s linear .6s}.controls__button{color:#ffffffc7;min-height:32px;font:inherit;letter-spacing:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#00000073;border:1px solid #ffffff29;border-radius:999px;align-items:center;gap:8px;padding:0 14px;transition:color .15s,border-color .15s,background-color .15s;display:inline-flex}.controls__button[hidden]{display:none}.controls__button:hover{color:#fff;background:#ffffff14;border-color:#ffffff5c}.controls__button:focus-visible{outline-offset:2px;outline:2px solid #ffffffb3}.controls__pips{gap:3px;display:inline-flex}.controls__pips i{background:#ffffff38;border-radius:1px;width:4px;height:10px}.controls__pips i.is-on{background:#ffffffd9}