.player{--accent:#3cf0ff;--accent-ink:#04161a;--pill-stroke:#3cf0ff;--pill-fill:#0a0e16e0;--pill-text:#e8fbff;--pill-radius:999px;--bar-h:92px;grid-template-rows:minmax(0, 1fr) calc(var(--bar-h) + env(safe-area-inset-bottom,0px));overscroll-behavior:none;background:var(--bg);width:100%;height:100%;color:var(--text);font-family:var(--font-ui);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;display:grid;position:relative;overflow:hidden}.player[data-theme=neon]{--accent:#ff4fd8;--accent-ink:#1e0418;--pill-stroke:#c14bff;--pill-fill:#140a28e6;--pill-text:#f3e6ff;--pill-radius:10px}.player--present{z-index:10;height:100dvh;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) 0 env(safe-area-inset-left,0px);position:fixed;inset:0}.player--present .bar{padding-left:20px;padding-right:20px}:where(.player) button{font:inherit;color:inherit;touch-action:manipulation;cursor:pointer}.stage{touch-action:manipulation;min-height:0;position:relative;overflow:hidden}.court-host{position:absolute;inset:12px 16px}.tilt{z-index:0;transform-origin:50% 62%;transition:transform .45s cubic-bezier(.4,0,.2,1);position:absolute;inset:0}.tilt--on{transform:perspective(1100px)translateY(-6%)rotateX(38deg)scale(1.1)}.vignette{z-index:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse 62% 58% at 50% 54%, transparent 55%, var(--bg) 100%);transition:opacity .45s;position:absolute;inset:0}.player[data-view="3d"] .vignette{opacity:1}.tilt-drift{position:absolute;inset:0}.tilt--on .tilt-drift{animation:14s ease-in-out infinite alternate tilt-drift}@keyframes tilt-drift{0%{transform:rotate(-4deg)}to{transform:rotate(4deg)}}.tp{border:1px solid var(--line);pointer-events:none;opacity:0;background:#151c28e6;border-radius:12px;max-width:min(30%,340px);padding:12px 16px 13px;transition:opacity .18s,transform .18s;position:absolute;top:16px;left:16px;transform:translateY(-4px);box-shadow:0 8px 24px #00000059}.tp--on{opacity:1;transform:none}.tp-label{letter-spacing:.08em;text-transform:uppercase;color:#ffd36b;margin-bottom:4px;font-size:12px;font-weight:700;display:block}.tp-text{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:20px;font-weight:600;line-height:1.3;display:-webkit-box;overflow:hidden}.top-right{align-items:center;gap:10px;display:flex;position:absolute;top:16px;right:16px}.seg{border:1px solid var(--line);background:#151c28e6;border-radius:14px;padding:4px;display:flex}.seg button{min-width:60px;min-height:44px;color:var(--muted);background:0 0;border:0;border-radius:10px;padding:0 14px;font-size:17px;font-weight:700}.seg button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}.close{border:1px solid var(--line);background:#151c28e6;border-radius:50%;width:54px;height:54px;font-size:22px;line-height:1}.pills{flex-wrap:wrap;justify-content:center;gap:14px;max-width:calc(100% - 32px);animation:.22s ease-out both pills-in;display:flex;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}@keyframes pills-in{0%{opacity:0;transform:translate(-50%,10px)}}.pill{border:2px solid color-mix(in srgb, var(--pill-stroke) 40%, transparent);border-radius:var(--pill-radius);background:var(--pill-fill);min-height:56px;color:var(--pill-text);white-space:nowrap;padding:0 28px;font-size:20px;font-weight:700;transition:transform .12s;box-shadow:0 8px 24px #0006}.pill--default{border-color:var(--pill-stroke);box-shadow:0 0 0 4px color-mix(in srgb, var(--pill-stroke) 18%, transparent), 0 8px 24px #0006}.pill:active{transform:scale(.96)}.bar{padding:0 calc(20px + env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,0px) calc(20px + env(safe-area-inset-left,0px));border-top:1px solid var(--line);background:var(--panel);align-items:center;gap:12px;display:flex}.ctl{background:var(--panel-2);border:0;border-radius:50%;flex:none;place-items:center;width:56px;height:56px;padding:0;display:grid}.ctl svg{fill:currentColor;width:26px;height:26px}.ctl--play{background:var(--accent);width:64px;height:64px;color:var(--accent-ink);box-shadow:0 0 0 5px color-mix(in srgb, var(--accent) 16%, transparent)}.ctl--play svg{width:30px;height:30px}.ctl:disabled{opacity:.35;cursor:default}.ctl:not(:disabled):active,.chip:active{transform:scale(.94)}.chip{border:1px solid var(--line);background:var(--panel-2);font-variant-numeric:tabular-nums;border-radius:12px;flex:none;min-width:72px;min-height:44px;margin-left:4px;padding:0 14px;font-size:18px;font-weight:700}.steps{flex:1;justify-content:flex-end;align-items:center;gap:18px;min-width:0;display:flex}.dots{flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;display:flex}.dot{box-sizing:border-box;border:2px solid #3a475c;border-radius:50%;width:14px;height:14px}.dot--done{background:#5b6b82;border-color:#5b6b82}.dot--current{background:var(--accent);border-color:var(--accent);transform:scale(1.25)}.dot--branch{background:linear-gradient(90deg,#3a475c 0 40%,#0000 40% 60%,#3a475c 60%);border:0}.dot--branch.dot--done{background:linear-gradient(90deg,#5b6b82 0 40%,#0000 40% 60%,#5b6b82 60%)}.dot--branch.dot--current{background:linear-gradient(90deg, var(--accent) 0 40%, transparent 40% 60%, var(--accent) 60%)}.step-label{max-width:40%;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:18px;font-weight:600;overflow:hidden}.step-label b{color:var(--text)}.player-missing{flex-direction:column;justify-content:center;align-items:center;gap:16px;font-size:20px;display:flex}.player-missing a{background:var(--panel-2);min-height:44px;color:var(--accent);border-radius:12px;align-items:center;padding:0 20px;font-weight:700;text-decoration:none;display:inline-flex}@media (prefers-reduced-motion:reduce){.tilt{transition:none}.tilt--on .tilt-drift,.pills{animation:none}.tp{transition:opacity .12s linear;transform:none}}