:root{color-scheme:dark;font:15px/1.4 system-ui,sans-serif;background:#10191f;color:#edf4f7}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;position:fixed;top:0;left:0;width:100%;height:100vh;height:var(--viewer-height,100dvh);overflow:hidden}main{position:absolute;top:env(safe-area-inset-top,0px);right:env(safe-area-inset-right,0px);bottom:env(safe-area-inset-bottom,0px);left:env(safe-area-inset-left,0px);overflow:auto;overscroll-behavior:contain;background:#0c1318}#surface{position:relative;min-width:100%;min-height:100%}#stage{position:absolute;width:960px;height:720px;transform-origin:0 0;background:#8a8a8a}iframe{display:block;width:960px;height:720px;border:0}button{min-height:44px;min-width:44px;padding:8px 12px;border:1px solid #627984;border-radius:9px;background:#253943;color:inherit;font:inherit;cursor:pointer}button:hover{background:#34515e}button:focus-visible{outline:3px solid #7de2fc;outline-offset:2px}button[aria-pressed=true]{background:#86dbef;color:#10202b}button:disabled{opacity:.45;cursor:default}.floating{position:fixed;z-index:5;top:calc(6px + env(safe-area-inset-top,0px));right:calc(6px + env(safe-area-inset-right,0px));box-shadow:0 2px 10px #0008;background:#172b35ed}#panExit{top:calc(56px + env(safe-area-inset-top,0px));background:#8bdff1;color:#10202b}header{position:fixed;z-index:6;top:calc(6px + env(safe-area-inset-top,0px));right:calc(6px + env(safe-area-inset-right,0px));width:min(470px,calc(100% - 12px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));max-height:calc(var(--viewer-height,100dvh) - 12px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;padding:12px;border:1px solid #536c79;border-radius:12px;background:#17242cf5;box-shadow:0 5px 25px #0008}.identity{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.identity strong{font-size:16px}nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap}output{min-width:44px;text-align:center;font-variant-numeric:tabular-nums}#hint{margin:10px 0 0;color:#c1d7e0;font-size:13px}#panLayer{position:absolute;inset:0;cursor:grab;touch-action:none;background:#5dbdd608}#panLayer:active{cursor:grabbing}dialog{max-width:560px;width:calc(100% - 24px);max-height:calc(var(--viewer-height,100dvh) - 24px);overflow:auto;border:1px solid #637d8b;border-radius:14px;padding:22px;background:#1c2e38;color:#edf4f7}dialog::backdrop{background:#000a}h1{font-size:21px;margin-top:0}li{margin:10px 0}form{text-align:right}@media(max-height:420px){header{padding:8px}.identity{margin-bottom:5px}.identity strong{font-size:14px}nav{gap:5px}nav button{font-size:13px;padding:6px 9px}}
