html,body{margin:0;height:100%;overflow:hidden}body{background:var(--gb-page-bg, #0c0e13);color:var(--gb-text, #e9edf4);font-family:var(--gb-font, system-ui, sans-serif);display:grid;place-items:center;transition:background-color 1.5s ease;-webkit-user-select:none;user-select:none}body.is-idle,body.is-idle *{cursor:none!important}.gb-l-stage{width:min(100vw,100vh);width:min(100vw,100dvh);aspect-ratio:1;will-change:transform}.gb-l-stage canvas{display:block;width:100%;height:100%;border-radius:6px}.gb-l-info{--board: min(100vw, 100dvh);position:fixed;left:50%;top:calc((100dvh - var(--board)) / 2 + var(--board) * .795);transform:translate(-50%,8px);margin:0;padding:7px 16px;border-radius:999px;background:color-mix(in srgb,var(--gb-panel-bg, #151922) 82%,transparent);color:var(--gb-muted, #8b94a7);font-size:13px;letter-spacing:.08em;text-transform:lowercase;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .8s ease,transform .8s ease}.gb-l-info.is-on{opacity:1;transform:translate(-50%)}.gb-l-bar{position:fixed;top:max(14px,env(safe-area-inset-top));right:max(14px,env(safe-area-inset-right));display:flex;align-items:center;gap:8px;padding:6px;border-radius:999px;background:color-mix(in srgb,var(--gb-panel-bg, #151922) 88%,transparent);border:1px solid var(--gb-border, #2b3242);box-shadow:0 8px 30px #00000059;transition:opacity .6s ease,transform .6s ease}body.is-idle .gb-l-bar{opacity:0;transform:translateY(-8px);pointer-events:none}.gb-l-home{color:var(--gb-text, #e9edf4);text-decoration:none;font-size:13px;font-weight:700;padding:0 8px 0 10px}.gb-l-home:hover{color:var(--gb-accent, #ff4d6d)}.gb-l-modes{display:flex;background:var(--gb-control-bg, #222837);border-radius:999px;padding:3px}.gb-l-modes button,.gb-l-btn{font:inherit;font-size:13px;border:0;cursor:pointer;color:var(--gb-muted, #8b94a7);background:transparent}.gb-l-modes button{padding:6px 14px;border-radius:999px;transition:background-color .2s,color .2s}.gb-l-modes button[aria-checked=true]{background:var(--gb-accent, #ff4d6d);color:var(--gb-accent-text, #1a0a10)}.gb-l-btn{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:var(--gb-text, #e9edf4)}.gb-l-btn:hover,.gb-l-modes button:hover:not([aria-checked=true]){color:var(--gb-accent, #ff4d6d)}.gb-l-modes button:focus-visible,.gb-l-btn:focus-visible,.gb-l-home:focus-visible{outline:2px solid var(--gb-accent, #ff4d6d);outline-offset:2px}@media (max-width: 420px){.gb-l-home{display:none}}.gb-l-sound .icon-off,.gb-l-sound.is-off .icon-on{display:none}.gb-l-sound.is-off .icon-off{display:block}body.is-locked .gb-l-stage{filter:grayscale(1) brightness(.55)}body.is-locked .gb-l-modes{display:none}.gb-l-lock{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(360px,calc(100vw - 32px));padding:22px 24px;border-radius:16px;background:color-mix(in srgb,var(--gb-panel-bg, #151922) 94%,transparent);border:1px solid var(--gb-border, #2b3242);box-shadow:0 30px 80px #00000080;text-align:center;font-size:14px;line-height:1.5;color:var(--gb-muted, #8b94a7);-webkit-user-select:text;user-select:text}.gb-l-lock[hidden]{display:none}.gb-l-lock p{margin:0 0 14px}.gb-l-lock .gb-l-lock-title{margin-bottom:6px;font-size:17px;font-weight:700;color:var(--gb-text, #e9edf4)}.gb-l-lock-btn{display:inline-block;padding:10px 28px;border-radius:999px;background:var(--gb-accent, #ff4d6d);color:var(--gb-accent-text, #1a0a10);font-weight:700;text-decoration:none}
