.play-stage{aspect-ratio:4/5;background:var(--play-bg)}.play-poster{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:0;width:100%;height:100%;padding:0;display:block;position:absolute;inset:0}.play-poster img,.play-poster .play-art{object-fit:cover;width:100%;height:100%;transition:scale .7s var(--spring);position:absolute;inset:0}.play-poster .play-art{place-items:center;display:grid}.play-poster:hover img,.play-poster:hover .play-art{scale:1.03}.play-stage{transition:translate .35s var(--spring), box-shadow .35s var(--spring)}@media (hover:hover){.play-stage:has(.play-poster:hover){box-shadow:0 0 0 3px color-mix(in srgb, var(--play-accent) 70%, transparent), 0 24px 48px -20px #00000073;translate:0 -4px}}.play-go{left:50%;top:var(--play-go,50%);background:var(--play-accent);width:max-content;max-width:calc(100% - 40px);color:var(--play-ink);text-align:left;box-shadow:0 0 0 6px color-mix(in srgb, var(--play-accent) 26%, transparent), 0 14px 34px -10px color-mix(in srgb, var(--play-accent) 70%, #00000080);transition:scale .25s var(--spring), box-shadow .25s var(--spring);border-radius:999px;align-items:center;gap:12px;padding:9px 28px 9px 9px;display:inline-flex;position:absolute;translate:-50% -50%}.play-go-icon{background:var(--play-ink);width:52px;height:52px;color:var(--play-accent);border-radius:50%;flex:none;place-items:center;display:grid;position:relative}.play-go-icon:after{content:"";border-radius:inherit;box-shadow:0 0 0 0 color-mix(in srgb, var(--play-ink) 45%, transparent);animation:2.2s ease-out infinite play-breathe;position:absolute;inset:0}.play-go svg{fill:currentColor;width:20px;height:20px;margin-left:3px}.play-go-text{gap:1px;min-width:0;display:grid}.play-go-text b{font:800 clamp(22px, 5.6vw, 27px) / 1.05 var(--body);letter-spacing:-.01em}.play-go-text small{font:600 clamp(12.5px, 3.4vw, 14px) / 1.25 var(--body);opacity:.82;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.play-poster:hover .play-go,.play-poster:focus-visible .play-go{box-shadow:0 0 0 9px color-mix(in srgb, var(--play-accent) 32%, transparent), 0 18px 40px -10px color-mix(in srgb, var(--play-accent) 80%, #00000080);scale:1.06}.play-poster:active .play-go{scale:.96}.play-poster:focus-visible{outline:3px solid var(--play-accent);outline-offset:-6px}@keyframes play-breathe{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--play-ink) 45%, transparent)}70%,to{box-shadow:0 0 0 14px color-mix(in srgb, var(--play-ink) 0%, transparent)}}@media (prefers-reduced-motion:reduce){.play-go-icon:after{animation:none}.play-stage,.play-go{transition:none}}.play-duel{left:50%;top:calc(var(--play-go,50%) + 56px);color:#fff;width:max-content;max-width:calc(100% - 40px);font:700 14px / 1.3 var(--body);text-align:center;overflow-wrap:anywhere;background:#0a0a149e;border-radius:999px;padding:6px 14px;position:absolute;translate:-50%}.play-duel-up{top:auto;bottom:calc(100% - var(--play-go,50%) + 58px)}.play-duel-name{text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom;max-width:100%;display:inline-block;overflow:hidden}.play-layer{z-index:2000;background:var(--play-bg);touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;contain:strict;width:100%;height:100dvh;position:fixed;inset:0;overflow:hidden}.play-layer:fullscreen{height:100%}.play-game{place-items:center;display:grid;position:absolute;inset:0;container-type:size}.play-layer:not(.play-fit) .play-game>:first-child{aspect-ratio:auto!important;width:100%!important;max-width:none!important;height:100%!important;max-height:none!important;box-shadow:none!important;border-radius:0!important;margin:0!important}.play-fit .play-game>:first-child{width:min(100cqw, calc(100cqh * var(--play-ratio)))!important;max-width:none!important;height:auto!important;aspect-ratio:var(--play-ratio)!important;box-shadow:none!important;border-radius:0!important;margin:0!important}.play-frame{touch-action:none;border:0;width:100%;height:100%;display:block}.play-loader{z-index:5;background:radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--play-accent) 26%, transparent), transparent 62%), radial-gradient(var(--dots) 1.1px, transparent 1.3px) 0 0 / 22px 22px, var(--paper);color:var(--ink);place-items:center;padding:24px;transition:opacity .3s;display:grid;position:absolute;inset:0}.play-loader.done{opacity:0;pointer-events:none}.play-loader-card{text-align:center;justify-items:center;gap:14px;width:min(320px,100%);display:grid}.play-loader-face{filter:drop-shadow(0 10px 14px #0f0f1e2e);width:92px;height:auto;animation:1.6s ease-in-out infinite play-bob}.play-loader-eyes{transition:transform .4s var(--spring)}@keyframes play-bob{50%{translate:0 -6px}}.play-loader-name{max-width:100%;font:800 clamp(22px, 6vw, 28px) / 1.15 var(--body);letter-spacing:-.01em;overflow-wrap:anywhere;margin:0}.play-loader-bar{background:var(--card);width:100%;height:14px;box-shadow:inset 0 0 0 1.5px var(--ink);border-radius:999px;padding:3px}.play-loader-bar i{background:var(--play-accent);height:100%;box-shadow:inset 0 0 0 1.5px var(--ink);transform-origin:0;will-change:transform;border-radius:999px;display:block;transform:scaleX(.03)}.play-loader-line{width:100%;font:600 14px / 1.3 var(--body);color:var(--ink-soft);justify-content:space-between;gap:12px;margin:0;display:flex}.play-loader-line span{overflow-wrap:anywhere;text-align:start;min-width:0}.play-loader-line b{color:var(--ink);font-variant-numeric:tabular-nums;flex:none}@media (prefers-reduced-motion:reduce){.play-loader-face{animation:none}}html[data-playing] body>.shell,html[data-playing] body>.rail,html[data-playing] .topbar{visibility:hidden;content-visibility:hidden}html[data-playing],html[data-playing] body{overscroll-behavior:none}.play-ghost{z-index:4;color:#fff;max-width:calc(100% - 120px);font:700 13px / 1.2 var(--body);white-space:nowrap;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0c0c168c;border-radius:999px;align-items:center;gap:7px;padding:5px 12px 5px 8px;display:inline-flex;position:absolute;left:50%;translate:-50%}.play-ghost-top{top:calc(env(safe-area-inset-top,0px) + 8px)}.play-ghost-bottom{bottom:calc(env(safe-area-inset-bottom,0px) + 74px)}.play-ghost-dot{background:hsl(var(--ghost-hue) 80% 62%);width:10px;height:10px;box-shadow:0 0 0 3px hsl(var(--ghost-hue) 80% 62% / .3);border-radius:50%;flex:none}.play-ghost-name{text-overflow:ellipsis;opacity:.85;min-width:0;overflow:hidden}.play-ghost b{font-variant-numeric:tabular-nums;flex:none}.play-ghost.done{background:#0c0c1666}.play-room{top:calc(env(safe-area-inset-top,0px) + var(--room-top,74px));left:calc(env(safe-area-inset-left,0px) + 8px);z-index:4;pointer-events:none;flex-direction:column;align-items:flex-start;gap:3px;max-width:min(100% - 16px,320px);margin:0;padding:0;list-style:none;transition:opacity .12s;display:flex;position:absolute}.play-room[data-away]{opacity:0}.play-room li{color:#fff;max-width:100%;font:600 11.5px / 1.3 var(--body);white-space:nowrap;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0508079e;border-radius:999px;align-items:center;gap:6px;padding:3px 9px 3px 6px;display:flex;overflow:hidden}.play-room li.done{background:#05080773}.play-room-dot{background:hsl(var(--ghost-hue) 80% 62%);border-radius:50%;flex:none;width:8px;height:8px}.play-room-who{opacity:.85;min-width:0;display:flex;overflow:hidden}.play-room-who>span{white-space:pre;flex:none}.play-room-who>.play-room-name{text-overflow:ellipsis;flex:0 auto;min-width:2.4em;overflow:hidden}.play-room b{font-variant-numeric:tabular-nums;flex:none}@media (max-height:500px){.play-room{max-width:min(32vw,260px)}.play-room li{white-space:normal;border-radius:10px;align-items:flex-start}.play-room li:nth-child(n+4){display:none}.play-room-dot{margin-top:4px}.play-room-who{display:block}.play-room-who>span{white-space:pre-wrap;display:inline}.play-room-who>.play-room-name{vertical-align:bottom;white-space:nowrap;min-width:0;max-width:8.5em;display:inline-block}}