html,body{overscroll-behavior:none;height:100%;overflow:hidden}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:100%;position:fixed;inset:0}#app{position:fixed;inset:0}#court{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.hud{pointer-events:none;font-family:var(--pb-font-body);position:absolute;inset:0}.hud button{pointer-events:auto}.hud-top{top:max(12px, env(safe-area-inset-top));flex-direction:column;align-items:center;display:flex;position:absolute;left:0;right:0}.hud-panel{background:linear-gradient(180deg, var(--pb-hud-glass-top), var(--pb-hud-glass-bottom));border:3px solid var(--pb-white);box-shadow:0 5px 0 var(--pb-glass-lip);border-radius:24px;align-items:center;gap:10px;padding:6px 10px;display:flex}.hud-cell{flex-direction:column;align-items:center;display:flex}.hud-score{font-family:var(--pb-font-display);color:var(--pb-white);font-size:40px;line-height:1}.hud-bar{background:var(--pb-you-hud);border-radius:2px;width:26px;height:4px}.hud-bar[data-side=cpu]{background:var(--pb-cpu-hud)}.hud-dash{font-family:var(--pb-font-display);color:var(--pb-hud-muted);font-size:28px}.hud-tag{background:var(--pb-white);border:2px solid var(--pb-ink);letter-spacing:.06em;white-space:nowrap;border-radius:8px;margin-top:-6px;padding:2px 10px;font-size:11px;font-weight:900;position:relative}.hud-tip-slot{position:absolute;top:96px;left:24px;right:24px}.hud-tip{background:var(--pb-white);border:3px solid var(--pb-ink);box-shadow:0 4px 0 var(--pb-ink);border-radius:20px;align-items:center;gap:10px;padding:8px 14px 8px 8px;display:flex}.hud-tip-icon{border:2px solid var(--pb-ink);background:linear-gradient(#ffe14d,#ffb800);border-radius:14px;flex:none;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.hud-tip-words{flex-direction:column;line-height:1.15;display:flex}.hud-tip-title{letter-spacing:.06em;color:var(--pb-secondary-bottom);font-size:12px;font-weight:900}.hud-tip-text{font-size:17px;font-weight:900}.hud-hint{flex-direction:column;align-items:center;gap:2px;transition:opacity .15s;display:flex;position:absolute;top:618px;left:0;right:0}.hud-hint[hidden]{display:none}.hud-hint-title{letter-spacing:.02em;color:var(--pb-white);font-size:30px}.hud-chips{gap:6px;margin-top:6px;display:flex}.hud-chip{background:#0b1b3fd1;border-radius:10px;padding:3px 9px;font-size:13px;font-weight:900}.hud-chip[data-tone=dink]{color:#6ff0dd}.hud-chip[data-tone=drive]{color:#ffc24a}.hud-chip[data-tone=lob]{color:#c3b2ff}.hud-ring-hint{background:var(--pb-ink);color:var(--pb-gold);font-size:var(--pb-size-label);letter-spacing:.08em;white-space:nowrap;border-radius:12px;padding:6px 12px;position:absolute;bottom:100px;left:50%;transform:translate(-50%)}.hud-ring-hint[hidden]{display:none}.hud-toggle,.hud-pause{bottom:max(20px, env(safe-area-inset-bottom));background:linear-gradient(180deg, var(--pb-hud-glass-top), var(--pb-hud-glass-bottom));border:3px solid var(--pb-white);box-shadow:0 5px 0 var(--pb-glass-lip);transition:opacity .15s;position:absolute}.hud-toggle{border-radius:24px;gap:4px;padding:4px;display:flex;left:16px}.hud-seg{width:64px;height:52px;color:var(--pb-white);font-family:var(--pb-font-body);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:12px;font-weight:900;display:flex}.hud-seg[aria-pressed=true]{color:var(--pb-ink);background:linear-gradient(#fff,#dce6f7);box-shadow:inset 0 -4px #a9b8d3}.hud-seg:focus-visible,.hud-pause:focus-visible{outline:3px solid var(--pb-gold);outline-offset:3px}.hud-pause{width:64px;height:64px;color:var(--pb-white);cursor:pointer;border-radius:24px;justify-content:center;align-items:center;display:flex;right:16px}.hud.is-busy .hud-toggle,.hud.is-busy .hud-pause{opacity:.35;pointer-events:none}.hud-perfect{text-align:center;position:absolute;top:140px;left:0;right:0}.hud-perfect[hidden]{display:none}.hud-perfect-text{color:var(--pb-gold);font-size:72px;display:inline-block;transform:rotate(-5deg)}.hud-perfect.is-on .hud-perfect-text{animation:.7s ease-out both pb-pop}.hud-combo{background:linear-gradient(180deg, var(--pb-primary-top), var(--pb-primary-bottom));border:3px solid var(--pb-white);color:var(--pb-white);font-family:var(--pb-font-display);border-radius:10px;margin-top:4px;padding:4px 16px;font-size:22px;display:inline-block;transform:rotate(2deg)}.hud-combo[hidden]{display:none}.hud-rays{opacity:.5;background:repeating-conic-gradient(#ffe14dcc 0 8deg, transparent 8deg 24deg);z-index:-1;border-radius:50%;width:280px;height:280px;margin-left:-140px;position:absolute;top:40px;left:50%;-webkit-mask:radial-gradient(circle,#000 20%,#0000 70%);mask:radial-gradient(circle,#000 20%,#0000 70%)}.hud-perfect.is-on .hud-rays{animation:.7s ease-out both pb-fade}@keyframes pb-pop{0%{opacity:0;transform:rotate(-5deg)scale(.4)}25%{opacity:1;transform:rotate(-5deg)scale(1.15)}to{opacity:.9;transform:rotate(-5deg)scale(1)}}@keyframes pb-fade{0%{opacity:.8}to{opacity:0}}.fault{z-index:10;background:#06173a59;position:absolute;inset:0}.fault-banner{background:linear-gradient(180deg, var(--pb-fault-top), var(--pb-fault-bottom));border-block:4px solid var(--pb-white);place-items:center;height:84px;animation:.4s ease-out pb-shake;display:grid;position:absolute;top:104px;left:-10px;right:-10px;overflow:hidden;transform:rotate(-4deg)}.fault-title{color:var(--pb-white);font-size:52px;position:relative}.fault-rays{opacity:.25;background:repeating-conic-gradient(#ffffffe6 0 6deg, transparent 6deg 18deg);animation:12s linear infinite pb-spin;position:absolute;inset:-100%}.fault-zone{background:var(--pb-kitchen-alert);color:var(--pb-ink);letter-spacing:.08em;white-space:nowrap;border-radius:10px;padding:4px 14px;font-size:14px;position:absolute;top:172px;left:50%;transform:translate(-50%)}.fault-card{border-radius:var(--pb-radius-card);background:var(--pb-white);border:3px solid var(--pb-ink);box-shadow:0 var(--pb-lip-card) 0 var(--pb-neutral-shade);color:var(--pb-ink);padding:18px 20px;position:absolute;top:216px;left:20px;right:20px}.fault-card h2{font-family:var(--pb-font-display);margin:0 0 6px;font-size:30px;font-weight:400}.fault-card p{font-size:var(--pb-size-body);color:var(--pb-ink-soft);margin:0 0 12px}.fault-next{left:20px;right:20px;bottom:max(40px, env(safe-area-inset-bottom));justify-content:center;align-items:center;gap:10px;display:flex;position:absolute}.fault-ring{flex:none}.fault[data-calm=true] .fault-banner{animation:none}@keyframes pb-shake{0%{transform:rotate(-4deg)translate(-10px)}20%{transform:rotate(-4deg)translate(9px)}40%{transform:rotate(-4deg)translate(-6px)}60%{transform:rotate(-4deg)translate(4px)}to{transform:rotate(-4deg)}}@keyframes pb-spin{to{transform:rotate(360deg)}}.sheet{z-index:30;background:#06173a80;justify-content:center;align-items:flex-end;display:flex;position:absolute;inset:0}.sheet-body{width:100%;max-width:480px;padding:20px 20px max(24px, env(safe-area-inset-bottom));border-radius:var(--pb-radius-sheet) var(--pb-radius-sheet) 0 0;background:var(--pb-white);border:4px solid var(--pb-ink);border-bottom:0;gap:14px;display:grid}.sheet-body h2{font-family:var(--pb-font-display);color:var(--pb-ink);text-align:center;margin:0;font-size:30px;font-weight:400}@media (prefers-reduced-motion:reduce){.hud-perfect.is-on .hud-perfect-text,.hud-perfect.is-on .hud-rays,.fault-banner,.fault-rays{animation:none}}.phone-hint{display:none}@media (pointer:fine){#app{width:min(100vw,480px);box-shadow:0 0 0 4px var(--pb-ink), 0 24px 80px #00000059;left:50%;right:auto;transform:translate(-50%)}}@media (pointer:fine) and (width>=1100px){.phone-hint{width:260px;font-family:var(--pb-font-body);color:var(--pb-ink);text-align:center;-webkit-user-select:text;user-select:text;display:block;position:fixed;top:50%;left:calc(25vw - 250px);transform:translateY(-50%)}.phone-hint h2{font-family:var(--pb-font-display);margin:0 0 8px;font-size:32px;font-weight:400}.phone-hint p{margin:0 0 10px;font-size:16px}.phone-hint a{color:var(--pb-ink);font-weight:900}}.screen{z-index:25;font-family:var(--pb-font-body);color:var(--pb-ink);position:absolute;inset:0}.home{pointer-events:none}.home>*{pointer-events:auto}.home-logo{pointer-events:none;flex-direction:column;align-items:center;display:flex;position:absolute;top:96px;left:0;right:0;transform:rotate(-4deg)}.home-logo-top{color:var(--pb-gold);font-size:54px}.home-logo-bottom{font-size:74px}.home-rays{opacity:.45;z-index:-1;background:repeating-conic-gradient(#ffe14dcc 0 8deg, transparent 8deg 24deg);border-radius:50%;width:320px;height:320px;margin-left:-160px;position:absolute;top:-40px;left:50%;-webkit-mask:radial-gradient(circle,#000 20%,#0000 70%);mask:radial-gradient(circle,#000 20%,#0000 70%)}.home-ribbon{border:3px solid var(--pb-white);color:var(--pb-white);background:linear-gradient(180deg, var(--pb-fault-top), var(--pb-fault-bottom));font-family:var(--pb-font-display);letter-spacing:.04em;border-radius:10px;margin-top:10px;padding:4px 18px;font-size:22px}.home-sheet{min-height:402px;padding:18px 20px max(14px, env(safe-area-inset-bottom));background:var(--pb-white);border-top:4px solid var(--pb-ink);border-radius:34px 34px 0 0;flex-direction:column;gap:10px;display:flex;position:absolute;bottom:0;left:0;right:0}.home-play{flex:none;width:100%;height:80px}.home-label{font-size:var(--pb-size-label);letter-spacing:.1em;color:var(--pb-ink-muted);font-weight:900}.home-levels{gap:8px;display:flex}.home-level{flex-direction:column;flex:1;gap:4px;min-width:0;height:72px;padding:0 4px;font-size:22px}.home-level:disabled{font-size:18px}.home-lock{font-family:var(--pb-font-body);letter-spacing:0;text-transform:none;white-space:nowrap;align-items:center;gap:3px;font-size:11px;font-weight:900;display:inline-flex}.home-dots{gap:4px;display:inline-flex}.home-dots i{border:2px solid var(--pb-ink);background:0 0;border-radius:50%;width:9px;height:9px}.home-dots i.on{background:var(--pb-ink)}.home-rankings{flex:none;width:100%;height:52px;font-size:22px}.home-actions{gap:10px;margin-top:4px;display:flex}.home-howto{flex:1;height:62px;font-size:24px;position:relative}.home-new{background:var(--pb-gold);color:var(--pb-ink);font-size:11px;position:absolute;top:-9px;left:10px;transform:rotate(3deg)}.home-gear{flex:none;width:62px;height:62px;padding:0}.home-join{align-items:center;gap:10px;margin:-2px 0;display:flex}.home-join p{color:var(--pb-ink-soft);flex:1;margin:0;font-size:14px;font-weight:900}.pb-button.fb-button[data-variant]{--shade:#0b4fb0;background:#1877f2;flex:none;height:40px;padding:0 14px;font-size:16px}.browser-bar{z-index:5;padding:max(8px, env(safe-area-inset-top)) 12px 8px;background:var(--pb-ink);color:var(--pb-white);align-items:center;gap:10px;display:flex;position:absolute;top:0;left:0;right:0}.browser-bar p{flex:1;margin:0;font-size:14px;font-weight:800}.browser-bar .pb-button{flex:none;height:40px;font-size:16px}.rk-join{margin:10px 16px}.rk-join p{color:var(--pb-ink-soft)}.rk-join .sr-actions .pb-button.fb-button[data-variant]{width:100%;height:52px;font-size:20px}.rk-share{width:calc(100% - 32px);height:52px;margin:10px 16px;font-size:20px}.home-footer{text-align:center;color:var(--pb-ink-muted);margin:auto 0 0;font-size:13px;font-weight:800}.howto{background:linear-gradient(180deg, var(--pb-sky-top) 0%, var(--pb-sky-mid) 60%, var(--pb-sky-bottom) 100%);touch-action:pan-y;flex-direction:column;display:flex}.howto-cloud{pointer-events:none;background:#ffffffb3;border-radius:30px;width:140px;height:50px;position:absolute;top:60px;right:-30px}.howto-head{padding:max(20px, env(safe-area-inset-top)) 20px 8px;flex-direction:column;align-items:center;gap:8px;display:flex;position:relative}.howto-title{font-size:var(--pb-size-title)}.howto-stage{flex:1;min-height:0;padding:4px 20px 12px;overflow-y:auto}.howto-page{gap:12px;display:grid}.howto-card{border-radius:var(--pb-radius-card);background:var(--pb-white);border:3px solid var(--pb-ink);box-shadow:0 var(--pb-lip-card) 0 var(--pb-ink);align-items:center;gap:12px;padding:10px 14px 10px 10px;display:flex;position:relative}.howto-words{justify-items:start;gap:4px;display:grid}.howto-card h3{font-family:var(--pb-font-display);margin:0;font-size:22px;font-weight:400}.howto-card p{color:var(--pb-ink-soft);margin:0;font-size:14px;font-weight:800;line-height:1.25}.howto-tile{border:3px solid var(--pb-ink);background:var(--pb-tint-dink);border-radius:16px;flex:none;width:80px;height:84px;position:relative;overflow:hidden}.howto-tile[data-tone=drive]{background:var(--pb-tint-drive)}.howto-tile[data-tone=lob]{background:var(--pb-tint-lob)}.howto-tile[data-tone=info]{background:var(--pb-sky-bottom)}.howto-thumb{background:var(--pb-ink);opacity:.85;border-radius:50%;width:22px;height:22px;margin-left:-11px;animation:1.2s ease-in-out infinite pb-thumb;position:absolute;bottom:8px;left:50%}.howto-badge{background:linear-gradient(180deg, var(--pb-gold-top), var(--pb-gold-bottom));border:3px solid var(--pb-ink);width:32px;height:32px;font-family:var(--pb-font-display);border-radius:50%;place-items:center;font-size:18px;display:grid;position:absolute;top:-10px;left:-8px}.howto-perfect{background:var(--pb-ink)}.howto-perfect h3{color:var(--pb-gold)}.howto-perfect p{color:var(--pb-white)}.howto-power{border:2px solid var(--pb-white);background:linear-gradient(90deg, var(--pb-shot-dink), var(--pb-gold) 70%, var(--pb-fault-bottom));border-radius:7px;width:100%;height:14px}.howto-bottom{padding:8px 20px max(20px, env(safe-area-inset-bottom));gap:12px;display:grid}.howto-dots{justify-content:center;gap:8px;display:flex}.howto-dots i{background:#0b1b3f40;border-radius:50%;width:10px;height:10px}.howto-dots i.on{background:var(--pb-ink)}.howto-foot{grid-template-columns:1fr 2fr;gap:12px;display:grid}.howto-foot .pb-button{width:100%;padding:0 8px}.matchend{background:linear-gradient(180deg, var(--pb-sky-top) 0%, var(--pb-sky-mid) 60%, var(--pb-sky-bottom) 100%);flex-direction:column;display:flex}.me-top{padding:max(28px, env(safe-area-inset-top)) 20px 0;justify-items:center;gap:12px;display:grid}.me-banner{border:4px solid var(--pb-white);background:linear-gradient(180deg, var(--pb-fault-top), var(--pb-fault-bottom));border-radius:12px;padding:8px 36px}.matchend[data-result=loss] .me-banner{background:linear-gradient(180deg, var(--pb-secondary-top), var(--pb-secondary-bottom))}.me-title{font-size:44px}.me-stars{gap:8px;display:flex}.me-star svg polygon{fill:#c7d3ea}.me-star[data-earned=true] svg polygon{fill:var(--pb-gold)}.me-close{color:var(--pb-ink);font-size:20px;font-weight:900}.me-plates{grid-template-columns:1fr 1fr;gap:12px;width:100%;display:grid}.me-plate{border:3px solid var(--pb-ink);background:linear-gradient(180deg, var(--pb-white), var(--pb-neutral-bottom));border-radius:18px;align-items:center;gap:8px;padding:8px 12px;display:flex;position:relative}.me-plate[data-winner=true]{background:linear-gradient(180deg, var(--pb-gold-top), var(--pb-gold-bottom))}.me-crown{position:absolute;top:-16px;right:12px}.me-name{flex:1;font-size:15px;font-weight:900}.me-points{font-family:var(--pb-font-display);font-size:var(--pb-size-score-big);line-height:1}.me-stats{grid-template-columns:repeat(3,1fr);gap:8px;width:100%;display:grid}.me-stat{border:3px solid var(--pb-ink);background:var(--pb-white);border-radius:16px;justify-items:center;gap:2px;padding:8px 4px;display:grid}.me-stat-value{font-family:var(--pb-font-display);font-size:30px;line-height:1}.me-stat-label{letter-spacing:.04em;color:var(--pb-ink-muted);text-align:center;font-size:11px;font-weight:900}.me-tip{border:3px solid var(--pb-ink);background:var(--pb-white);border-radius:18px;width:100%;padding:8px 14px}.me-tip-title{letter-spacing:.06em;color:var(--pb-secondary-bottom);font-size:12px;font-weight:900}.me-tip-text{font-size:15px;font-weight:900;line-height:1.2}.me-actions{left:20px;right:20px;bottom:max(16px, env(safe-area-inset-bottom));gap:10px;display:grid;position:absolute}.me-actions .pb-button{width:100%}.me-home{height:48px;font-family:var(--pb-font-display);color:var(--pb-ink);cursor:pointer;background:0 0;border:0;font-size:20px;text-decoration:underline}.me-home:focus-visible{outline:3px solid var(--pb-gold);outline-offset:2px}.me-rank{font-family:var(--pb-font-display);color:var(--pb-ink);font-size:24px}.me-note{color:var(--pb-ink);opacity:.8;text-align:center;max-width:300px;font-size:16px}.me-links{grid-template-columns:1fr 1fr;display:grid}.sr-scrim{z-index:30;background:#06173a8c;align-items:flex-end;display:flex;position:absolute;inset:0}.sr-card{width:100%;padding:24px 20px max(16px, env(safe-area-inset-bottom));border-radius:34px 34px 0 0}.sr-card p{color:var(--pb-ink-soft)}.sr-actions{gap:6px;margin-top:16px;display:grid}.sr-actions .pb-button{width:100%;font-size:24px}.rankings{background:linear-gradient(180deg, var(--pb-sky-top) 0%, var(--pb-sky-mid) 60%, var(--pb-sky-bottom) 100%);flex-direction:column;display:flex}.rk-head{padding:max(20px, env(safe-area-inset-top)) 20px 8px;align-items:center;gap:12px;display:flex}.rk-back{flex:none;height:44px;padding:0 16px;font-size:18px}.rk-title{font-size:var(--pb-size-title)}.rk-tabs{grid-template-columns:1fr 1fr;gap:8px;margin:8px 20px 12px;display:grid}.rk-tab{border:3px solid var(--pb-ink);background:var(--pb-white);height:48px;color:var(--pb-ink);cursor:pointer;font-family:var(--pb-font-display);border-radius:16px;font-size:20px}.rk-tab[aria-selected=true]{background:linear-gradient(180deg, var(--pb-gold-top), var(--pb-gold-bottom))}.rk-tab:focus-visible{outline:3px solid var(--pb-gold);outline-offset:2px}.rk-list{flex:1;align-content:start;gap:6px;min-height:0;padding:0 20px 12px;display:grid;overflow-y:auto}.rk-row{border:3px solid var(--pb-ink);background:var(--pb-white);border-radius:16px;flex:none;align-items:center;gap:10px;height:56px;padding:0 12px;display:flex}.rk-row[data-own]{background:linear-gradient(180deg, var(--pb-gold-top), var(--pb-gold-bottom))}.rk-rank{text-align:center;width:34px;font-family:var(--pb-font-display);flex:none;font-size:20px}.rk-face{border:2px solid var(--pb-ink);object-fit:cover;background:var(--pb-tint-dink);border-radius:50%;flex:none;width:40px;height:40px}.rk-initial{font-family:var(--pb-font-display);place-items:center;font-size:20px;display:grid}.rk-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:16px;font-weight:900;overflow:hidden}.rk-score{font-family:var(--pb-font-display);flex:none;font-size:20px}.rk-empty{text-align:center;color:var(--pb-ink-soft);padding:24px 12px;font-size:16px;font-weight:900}.rk-pinned{padding:0 20px max(16px, env(safe-area-inset-bottom));flex:none}.rk-pinned:empty{display:none}.orient{z-index:100;background:var(--pb-ink);color:var(--pb-white);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex;position:fixed;inset:0}.orient[hidden]{display:none}.orient p{font-family:var(--pb-font-display);margin:0;font-size:28px}.orient-icon{border:4px solid var(--pb-gold);border-radius:10px;width:44px;height:72px;animation:1.6s ease-in-out infinite alternate pb-tilt}@keyframes pb-thumb{0%{opacity:.85;transform:translateY(0)}80%{opacity:.85;transform:translateY(-46px)}to{opacity:0;transform:translateY(-46px)}}@keyframes pb-tilt{0%{transform:rotate(-90deg)}to{transform:rotate(0)}}@media (prefers-reduced-motion:reduce){.howto-thumb,.orient-icon{animation:none}}