:root{--color-app-bg:#262626;--color-viewport-bg:#262626;--color-text:#d4d4d4;--color-text-dim:#7a7a7a;--font-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--font-size-small:11px;--letter-spacing-small:.02em;--space-2:8px;--space-3:12px;--space-4:16px}*,:before,:after{box-sizing:border-box}html,body{background:var(--color-app-bg);height:100%;color:var(--color-text);font-family:var(--font-mono);margin:0;overflow:hidden}.viewport{background:var(--color-viewport-bg);position:fixed;inset:0}.viewport canvas{touch-action:none;outline:none;width:100%;height:100%;display:block}.viewport-hint{left:var(--space-4);bottom:var(--space-3);font-size:var(--font-size-small);letter-spacing:var(--letter-spacing-small);color:var(--color-text-dim);pointer-events:none;-webkit-user-select:none;user-select:none;position:absolute}.viewport-hint-speed{transition:color .3s}.viewport-hint-speed.is-active{color:var(--color-text);transition:none}.viewport-message{padding:var(--space-4);text-align:center;color:var(--color-text);justify-content:center;align-items:center;font-size:13px;line-height:1.6;display:flex;position:absolute;inset:0}[hidden]{display:none!important}