.game-art--table-tennis{--art-text: var(--sketch-ink);--art-muted: var(--sketch-muted);--art-focus: #456f73;--tt-you: #9a5442;--tt-cpu: #456f73;--tt-accent: #456f73;--tt-ink: rgb(250 250 250 / .95);background-color:var(--sketch-paper);background-image:var(--sketch-grid);container-type:inline-size}.game-art--table-tennis .table-board{position:relative;width:100%;aspect-ratio:16 / 9;container-type:inline-size;overflow:hidden}.game-art--table-tennis .table-board:has(.table-ready,.table-over):after{content:"";position:absolute;inset:0;z-index:1;background:#fafafa85;pointer-events:none}.game-art--table-tennis .table-court{display:block;width:100%;height:100%;cursor:ew-resize;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;outline-offset:-5px;touch-action:pan-y}.game-art--table-tennis .table-board[data-phase=playing] .table-court{touch-action:none}.game-art--table-tennis .table-court:focus-visible{outline:3px solid var(--art-focus)}.game-art--table-tennis .table-court:focus:not(:focus-visible),.game-art--table-tennis .table-board[data-pointer=true] .table-court:focus-visible{outline:none}.game-art--table-tennis .table-hud{position:absolute;top:1.6cqw;left:1.6cqw;right:1.6cqw;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none;color:var(--art-text)}.game-art--table-tennis .table-chip{position:relative;display:flex;align-items:center;padding:6px 12px;background:var(--tt-ink);border:1px solid rgb(61 64 58 / .4);border-radius:3px}.game-art--table-tennis .table-score{gap:12px}.game-art--table-tennis .table-side{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:52px}.game-art--table-tennis .table-label{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-sans);font-size:var(--art-fs-label);font-weight:500;line-height:1.35;letter-spacing:0;color:var(--art-muted);white-space:nowrap}.game-art--table-tennis .table-serve-dot{width:8px;height:8px;border-radius:50%;background:#456f73;opacity:0}.game-art--table-tennis .table-side[data-serving=true] .table-serve-dot{opacity:1}.game-art--table-tennis .table-side strong{font-family:var(--font-mono);font-size:var(--art-fs-score);font-weight:700;line-height:1;font-variant-numeric:tabular-nums}.game-art--table-tennis .table-side.is-player strong{color:var(--tt-you)}.game-art--table-tennis .table-side.is-computer strong{color:var(--tt-cpu)}.game-art--table-tennis .table-colon{font-family:var(--font-mono);font-size:var(--art-fs-value);font-weight:600;color:var(--art-muted);line-height:1}.game-art--table-tennis .table-side em{position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%);padding:1px 8px;border-radius:3px;background:var(--tt-accent);color:#fafafa;font-family:var(--font-sans);font-size:var(--art-fs-label);font-style:normal;font-weight:600;line-height:1.35;white-space:nowrap;animation:tt-point .9s ease-in-out infinite}.game-art--table-tennis .table-board[data-match-point=player] .table-side.is-player,.game-art--table-tennis .table-board[data-match-point=computer] .table-side.is-computer{outline:2px solid var(--tt-accent);outline-offset:4px;border-radius:3px}@keyframes tt-point{50%{transform:translate(-50%) scale(1.08)}}.game-art--table-tennis .table-rally{flex-direction:column;align-items:flex-end;gap:2px;min-width:64px}.game-art--table-tennis .table-rally strong{font-family:var(--font-mono);font-size:var(--art-fs-value);font-weight:600;line-height:1;font-variant-numeric:tabular-nums}.game-art--table-tennis .table-banner{position:absolute;top:1.6cqw;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 20px;background:var(--tt-ink);border:1px solid var(--tt-you);border-radius:3px;font-family:var(--font-sans);text-align:center;white-space:nowrap;pointer-events:none;animation:tt-banner 2.4s ease-out both}.game-art--table-tennis .table-banner[data-side=computer]{border-color:var(--tt-cpu)}.game-art--table-tennis .table-banner strong{font-size:var(--art-fs-title);font-weight:600;line-height:1.2;letter-spacing:0;font-variant-numeric:tabular-nums;color:var(--tt-you)}.game-art--table-tennis .table-banner[data-side=computer] strong{color:var(--tt-cpu)}.game-art--table-tennis .table-banner span{font-size:var(--art-fs-body);font-weight:400;line-height:1.5;color:var(--art-muted)}@keyframes tt-banner{0%{opacity:0;transform:translate(-50%,-12px) scale(.9)}10%{opacity:1;transform:translate(-50%) scale(1.04)}18%{transform:translate(-50%) scale(1)}72%{opacity:1}to{opacity:0;transform:translate(-50%,-4px)}}.game-art--table-tennis .table-spark{transform-box:fill-box;transform-origin:center;opacity:0;animation:tt-spark .45s ease-out}.game-art--table-tennis .table-spark-ring{fill:none;stroke:#456f73;stroke-width:3}.game-art--table-tennis .table-spark-ray{stroke:#9a5442;stroke-width:3;stroke-linecap:round}.game-art--table-tennis .table-spark[data-smash=true] .table-spark-ring,.game-art--table-tennis .table-spark[data-smash=true] .table-spark-ray{stroke:var(--tt-accent)}.game-art--table-tennis .table-spark[data-side=computer] .table-spark-ring,.game-art--table-tennis .table-spark[data-side=computer] .table-spark-ray{stroke:var(--tt-cpu)}@keyframes tt-spark{0%{opacity:1;transform:scale(.35)}to{opacity:0;transform:scale(calc(1.5 * var(--spark, 1)))}}.game-art--table-tennis .table-smash-tag{fill:var(--tt-accent);stroke:#fafafa;stroke-width:4px;paint-order:stroke;font-family:var(--font-sans);font-weight:700;font-size:var(--art-fs-title);letter-spacing:0;opacity:0;animation:tt-tag .9s ease-out}@supports (font-size: calc(1px*10px/1px)){.game-art--table-tennis .table-smash-tag{font-size:calc(var(--art-fs-title) * 960 / 100cqw * 1px)}}@keyframes tt-tag{0%{opacity:0;transform:translateY(8px) scale(.8)}15%{opacity:1;transform:translateY(0) scale(1.1)}to{opacity:0;transform:translateY(-24px)}}.game-art--table-tennis .table-status{position:absolute;left:1.4cqw;bottom:1.4cqw;max-width:calc(100% - 160px);padding:4px 12px;border-radius:3px;background:var(--tt-ink);border:1px solid rgb(61 64 58 / .4);color:var(--art-text);font-family:var(--font-sans);font-size:var(--art-fs-body);font-weight:400;line-height:1.5;text-wrap:balance;pointer-events:none}.game-art--table-tennis .table-board:has(.table-over) .table-status{opacity:0}.game-art--table-tennis .table-serve{position:absolute;right:1.6cqw;bottom:1.4cqw;min-height:40px;padding:8px 24px;border:0;border-radius:3px;background:var(--tt-accent);color:#fafafa;font-family:var(--font-sans);font-size:var(--art-fs-action);font-weight:600;line-height:1.2;transition:opacity .2s,transform .2s}.game-art--table-tennis .table-serve:hover{background:#6d7464}.game-art--table-tennis .table-serve[data-available=false]{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(6px)}.game-art--table-tennis .table-serve[data-available=true]{animation:tt-serve 1.2s ease-in-out infinite}@keyframes tt-serve{50%{background:#6d7464}}.game-art--table-tennis .table-ready,.game-art--table-tennis .table-over{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-52%);width:min(86%,420px);padding:20px 24px 22px;text-align:center;background:var(--sketch-paper);border:1px solid #3d403a;border-radius:3px;z-index:2;animation:tt-panel .4s cubic-bezier(.2,1,.3,1)}@keyframes tt-panel{0%{opacity:0;transform:translate(-50%,-40%) scale(.92)}}.game-art--table-tennis .table-ready h2,.game-art--table-tennis .table-over h2{margin:0;font-family:var(--font-sans);font-size:var(--art-fs-title);font-weight:600;line-height:1.2;letter-spacing:0;color:var(--art-text)}.game-art--table-tennis .table-ready p{margin:8px 0 16px;font-family:var(--font-sans);font-size:var(--art-fs-body);font-weight:400;line-height:1.5;color:var(--art-text)}.game-art--table-tennis .table-over-score{display:flex;justify-content:center;align-items:baseline;gap:12px;margin:4px 0 8px;font-family:var(--font-mono);font-size:var(--art-fs-display);font-weight:700;line-height:1;font-variant-numeric:tabular-nums}.game-art--table-tennis .table-over-score i{font-style:normal;color:var(--art-muted)}.game-art--table-tennis .table-over-score [data-side=player]{color:var(--tt-you)}.game-art--table-tennis .table-over-score [data-side=computer]{color:var(--tt-cpu)}.game-art--table-tennis .table-over dl{display:flex;justify-content:center;gap:24px;margin:0 0 16px}.game-art--table-tennis .table-over dt{font-family:var(--font-sans);font-size:var(--art-fs-label);font-weight:500;line-height:1.35;color:var(--art-muted)}.game-art--table-tennis .table-over dd{margin:2px 0 0;font-family:var(--font-mono);font-size:var(--art-fs-value);font-weight:600;line-height:1;font-variant-numeric:tabular-nums}.game-art--table-tennis .table-over dl>div:nth-child(3) dd{font-family:var(--font-sans)}.game-art--table-tennis .table-ready button,.game-art--table-tennis .table-over button{min-height:40px;padding:8px 24px;border:0;border-radius:3px;background:var(--tt-accent);color:#fafafa;font-family:var(--font-sans);font-size:var(--art-fs-action);font-weight:600;line-height:1.2;cursor:pointer}.game-art--table-tennis .table-ready button:hover,.game-art--table-tennis .table-over button:hover{background:#6d7464}.game-art--table-tennis .table-ready button:disabled{opacity:.6;cursor:default}.game-art--table-tennis .table-ready button:focus-visible,.game-art--table-tennis .table-over button:focus-visible{outline:3px solid var(--art-focus);outline-offset:3px}.game-art--table-tennis .table-paused{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);padding:8px 24px;min-height:44px;border-radius:3px;background:var(--tt-accent);color:#fafafa;border:1px solid #3d403a;font-family:var(--font-sans);font-size:var(--art-fs-action);font-weight:600;line-height:1.2;letter-spacing:0;cursor:pointer}@media(max-width:520px){.game-art--table-tennis .table-chip{padding:4px 8px}.game-art--table-tennis .table-score{gap:8px}.game-art--table-tennis .table-side{min-width:40px}.game-art--table-tennis .table-rally{min-width:0}.game-art--table-tennis .table-banner span{display:none}.game-art--table-tennis .table-status{max-width:calc(100% - 110px);padding:2px 8px}.game-art--table-tennis .table-serve{padding:4px 14px}.game-art--table-tennis .table-ready,.game-art--table-tennis .table-over{padding:10px 16px 12px}.game-art--table-tennis .table-over-score{margin:0}.game-art--table-tennis .table-over dl{margin-bottom:8px;gap:16px}.game-art--table-tennis .table-ready p{display:none}.game-art--table-tennis .table-ready h2{margin-bottom:10px}.game-art--table-tennis .table-over dl>div:nth-child(3){display:none}}@media(max-width:360px){.game-art--table-tennis .table-banner{top:24cqw}.game-art--table-tennis .table-ready,.game-art--table-tennis .table-over{padding:8px 12px 10px}.game-art--table-tennis .table-over dl{margin-bottom:6px}.game-art--table-tennis .table-over button{min-height:40px;padding:4px 20px}}@media(prefers-reduced-motion:reduce){.game-art--table-tennis .table-board *,.game-art--table-tennis .table-ready,.game-art--table-tennis .table-over{animation:none!important;transition:none!important}}