.io-shell.casual-shell{max-width:none;height:100%}.io-shell .casual-stage{flex-direction:column;height:100%;display:flex}.io-shell .casual-stage-body{flex:1;min-height:0}.io-menu{width:100%;max-width:560px;margin-inline:auto}.io-root{--io-gap:8px;gap:var(--io-gap);min-height:0;padding-inline:env(safe-area-inset-left,0px) env(safe-area-inset-right,0px);touch-action:manipulation;flex:1;grid-template:"hud""board"minmax(0,1fr)"ctrl"/minmax(0,1fr);display:grid}.io-hud{grid-area:hud}.io-hud .casual-pill{padding-block:4px}.io-board-wrap{grid-area:board;place-items:center;min-width:0;min-height:0;display:grid;container-type:size}.io-board{aspect-ratio:1;border:3px solid var(--ink);width:min(100cqw,100cqh);height:min(100cqw,100cqh);box-shadow:0 0 0 2px #b8a26a, 0 0 28px #b8a26a73, 0 6px 0 var(--ink);touch-action:none;background:#080c0e;border-radius:14px;position:relative;overflow:hidden}.io-canvas{width:100%;height:100%;display:block}.io-overlay{text-align:center;color:#f5f5f7;z-index:2;background:#08080cc7;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:16px;display:flex;position:absolute;inset:0}.io-overlay h3{letter-spacing:.04em;font-size:clamp(22px,7cqw,40px);font-weight:900}.io-banner{pointer-events:none;z-index:1;letter-spacing:.08em;text-align:center;color:#fff;text-shadow:0 3px #000,0 0 24px #ffd2508c;flex-direction:column;justify-content:center;align-items:center;gap:.15em;padding-inline:12px;font-size:clamp(28px,9cqw,56px);font-weight:900;display:flex;position:absolute;inset:0}.io-banner-name{letter-spacing:.16em;text-transform:uppercase;max-width:100%;font-size:.38em}.io-toast{inset-inline:8px;z-index:3;color:#ffe45e;text-align:center;pointer-events:none;background:#000000b8;border:1px solid #ffffff4d;border-radius:999px;width:fit-content;max-width:100%;margin-inline:auto;padding:6px 14px;font-size:14px;font-weight:800;position:absolute;top:8px}.io-controls{grid-area:ctrl;justify-content:space-between;align-items:center;gap:12px;padding:4px 4px 8px;display:none}@media (pointer:coarse){.io-controls{display:flex}}.io-dpad{grid-template-rows:repeat(3,56px);grid-template-columns:repeat(3,56px);grid-template-areas:".u.""l.r"".d.";gap:4px;display:grid}.io-key,.io-fire{border:2px solid var(--ink);background:var(--surface);color:var(--ink);font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:none;box-shadow:var(--casual-shadow);place-items:center;font-size:22px;font-weight:900;display:grid}.io-key{border-radius:14px}.io-key:active{background:var(--game-accent,var(--primary));box-shadow:none;transform:translate(1px,1px)}.io-fire{color:#3a1c00;background:radial-gradient(circle at 35% 30%,#ffc56b,#f08a1c 70%);border-radius:50%;grid-template-rows:auto auto;align-content:center;width:88px;height:88px;line-height:1}.io-fire:active{box-shadow:none;filter:brightness(.95);transform:translate(1px,1px)}.io-fire-label{letter-spacing:.04em;font-size:13px}.io-keys{flex-wrap:wrap;grid-area:ctrl;justify-content:center;align-items:center;gap:6px 14px;font-size:14px;font-weight:700;display:flex}@media (pointer:coarse){.io-keys{display:none}}@media (orientation:landscape) and (max-height:520px){.io-root{grid-template:"hud hud hud""left board right"minmax(0,1fr)/auto minmax(0,1fr) auto;align-items:stretch}.io-controls{display:none}.io-hud .casual-pill{padding-block:2px}.io-hud{flex-direction:row;align-items:center;gap:8px;display:flex}.io-hud>div:last-child{flex:none;min-height:0}.io-hud>div:first-child{flex:1 1 0;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;min-width:0}.io-hud .casual-pill{padding-block:1px;font-size:11px}.io-hud .casual-pill *{line-height:1.1}}@media (orientation:landscape) and (max-height:520px) and (pointer:coarse){.io-controls{display:contents}.io-dpad{grid-area:left;grid-template-rows:repeat(3,48px);grid-template-columns:repeat(3,48px);align-self:center}.io-fire{grid-area:right;align-self:center;width:80px;height:80px}}@media (orientation:landscape) and (max-height:520px) and (pointer:fine){.io-keys{flex-direction:column;grid-area:left;width:120px}}@media (min-width:1024px){.game-player-frame:has(.io-shell){z-index:30;aspect-ratio:auto;width:min(100%,100dvh - 5.5rem);max-width:calc(100dvh - 5.5rem);height:calc(100dvh - 5.5rem);max-height:calc(100dvh - 5.5rem);position:sticky;top:3.75rem}.game-player-surface:has(>.io-shell){flex-direction:column;flex:auto;min-height:0;display:flex;overflow:hidden}.io-shell.casual-shell{flex:auto;height:auto;min-height:0}.io-shell .casual-stage,.io-shell .casual-stage-body,.io-root{flex:auto;height:100%;min-height:0}.io-shell .casual-stage-body{gap:6px;padding:6px}.io-shell .casual-band{display:none}.io-board-wrap{height:100%}}@media (min-width:1024px) and (pointer:fine){.io-root{grid-template-rows:auto minmax(0,1fr);grid-template-areas:"hud""board"}.io-hud{flex-direction:row;align-items:center;gap:8px}.io-hud>div:first-child{flex:auto;min-width:0}.io-hud>div:last-child{flex:none;min-height:0}.io-keys{display:none}}@media (min-width:744px) and (pointer:coarse){.io-dpad{grid-template-rows:repeat(3,64px);grid-template-columns:repeat(3,64px)}.io-fire{width:104px;height:104px}}@media (prefers-reduced-motion:reduce){.io-key,.io-fire{transition:none}.io-key:active,.io-fire:active{transform:none}}