.pong-dialog,.pong-entry{--pong-text:#f4f2ff;--pong-sub:#d4d1e9;--pong-bg:#101627;--pong-panel:#20283e;--pong-border:#7c85a7;font-family:inherit;font-size:1rem;line-height:1.65;color:var(--pong-text);box-sizing:border-box}.pong-dialog{position:fixed;inset:0;margin:0;padding:0;width:100vw;max-width:none;height:100dvh;max-height:none;border:0;border-radius:0;background:#101627;overflow:auto;overscroll-behavior:contain}.pong-dialog::backdrop{background:#080d19}.pong-dialog *,.pong-entry *{box-sizing:border-box}.pong-dialog h1,.pong-dialog h2,.pong-dialog p,.pong-dialog strong,.pong-dialog label,.pong-entry h2,.pong-entry p{opacity:1;color:#f4f2ff}.pong-dialog h1{font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.3;margin:.3rem 0}.pong-dialog h2{font-size:1.3rem;line-height:1.45;margin:0 0 1rem}.pong-dialog p,.pong-entry p{font-size:1rem;line-height:1.65;margin:.5rem 0 1rem}.pong-dialog button,.pong-dialog select,.pong-entry button{font:inherit;font-size:1rem;line-height:1.5;min-height:48px;border:1px solid #8e97b9;border-radius:.7rem;padding:.7rem 1rem;background:#29324b;color:#f4f2ff;opacity:1;cursor:pointer;text-align:center;display:flex;justify-content:center;align-items:center;white-space:normal;overflow-wrap:anywhere;gap:.5rem}.pong-dialog button:disabled{color:#eeeaff;background:#283148;border:1px dashed #9da6c3;opacity:1;cursor:default}.pong-dialog button:hover:not(:disabled),.pong-entry button:hover{background:#3c355b;border-color:#c9b5ff}.pong-dialog button:focus-visible,.pong-dialog select:focus-visible,.pong-dialog canvas:focus-visible,.pong-entry button:focus-visible{outline:3px solid #a3f0da;outline-offset:4px}.pong-dialog .pong-primary,.pong-entry .pong-primary{background:#a3f0da;color:#102b25;border-color:#d0ffef;font-weight:700}.pong-dialog .pong-primary:hover:not(:disabled),.pong-entry .pong-primary:hover{background:#ccffef;color:#102b25}.pong-dialog .pong-primary:disabled{color:#eeeaff;background:#283148;border-color:#9da6c3}.pong-shell{max-width:1650px;margin:auto;padding:1.5rem 2rem 2rem}.pong-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.pong-header-buttons{display:flex;justify-content:center;gap:.8rem;flex-wrap:wrap}.pong-dialog .pong-kicker{font-size:.875rem;letter-spacing:.12em;color:#cdbbff;font-weight:700;margin:0}.pong-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,300px);gap:1.5rem}.pong-match{min-width:0}.pong-scoreboard{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:.75rem;padding:1rem;background:#20283e;border:1px solid #7c85a7;border-radius:1rem}.pong-scoreboard>div{text-align:center;min-width:0;overflow-wrap:anywhere}.pong-scoreboard>div>span{display:block;font-size:1rem;color:#f4f2ff}.pong-scoreboard strong{font-size:2rem;line-height:1.3;display:block;font-variant-numeric:tabular-nums;color:#a3f0da}.pong-scoreboard>div:last-child strong{color:#d2b8ff}.pong-round span{font-size:.875rem!important;color:#d4d1e9!important}.pong-stage{position:relative;background:#080e1d;border:1px solid #7c85a7;border-top:1px solid #7c85a7;border-radius:1rem;overflow:hidden}.pong-stage canvas{display:block;width:100%;height:clamp(420px,65dvh,720px);touch-action:none;background:#080e1d}.pong-robot-name{position:absolute;top:.6rem;left:50%;translate:-50% 0;color:#e2d6ff;background:#171c32;padding:.1rem .6rem;border:1px solid #a590c0;border-radius:1rem;font-size:.875rem;line-height:1.6;pointer-events:none}.pong-state-banner{position:absolute;inset:auto 1rem 1.2rem;max-width:80%;margin:auto;background:#152534;border:1px solid #9bdacb;color:#f4f2ff;font-size:1.125rem;font-weight:600;text-align:center;padding:.8rem 1rem;border-radius:.8rem;pointer-events:none}.pong-state-banner.pong-banner-hidden{visibility:hidden}.pong-main-controls{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap;margin:1rem 0}.pong-main-controls>button{flex:1;min-width:150px;max-width:300px}.pong-dialog .pong-touch-hint{text-align:center;font-size:.875rem;color:#d4d1e9;margin:.7rem 0}.pong-controls>section{background:#20283e;border:1px solid #7c85a7;border-radius:1rem;padding:1.2rem;margin-bottom:1.2rem}.pong-spin-buttons{display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.3rem}.pong-spin-buttons>button{width:100%}.pong-spin-buttons>button[aria-pressed=true]{border:2px solid #a3f0da;background:#23403b;padding:calc(.7rem - 1px) calc(1rem - 1px);color:#f4f2ff}.pong-controls label{display:flex;flex-direction:column;gap:.6rem;font-size:1rem}.pong-controls select{width:100%}.pong-dialog .pong-secondary,.pong-entry .pong-secondary{font-size:.875rem;color:#d4d1e9}.pong-dialog .pong-practice{font-size:1rem;padding:1rem;border:1px solid #7c85a7;background:#20283e;border-radius:.8rem}.pong-entry{display:grid;grid-template-columns:180px minmax(0,1fr);align-items:center;gap:1.5rem;background:#20283e;border:1px solid #a18bcf;border-radius:1.1rem;padding:1.5rem;margin:1.5rem 0}.pong-entry h2{font-size:1.6rem;line-height:1.4;margin:0 0 .6rem}.pong-entry button{min-width:200px;max-width:100%}.pong-entry-art{height:165px;position:relative;isolation:isolate}.pong-entry-orbit{position:absolute;inset:25px 0;border:2px solid #a99ad9;border-radius:50%;rotate:-35deg}.pong-entry-ball{position:absolute;width:42px;height:42px;left:30px;top:24px;border-radius:50%;background:radial-gradient(circle at 30% 30%,white,#a3f0da);box-shadow:0 0 28px #a3f0da60}.pong-entry-paddle{position:absolute;left:70px;top:64px;width:75px;height:48px;border-radius:50%;rotate:-35deg;background:linear-gradient(#d0bdff,#8864b8);box-shadow:0 0 30px #c9afff33}.pong-entry-paddle:after{content:'';position:absolute;top:30px;left:28px;width:15px;height:55px;background:#9c8aab;border-radius:5px;z-index:-1}
@media(max-width:1100px){.pong-layout{grid-template-columns:minmax(0,1fr)}.pong-controls{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start}.pong-controls>section{margin:0}.pong-controls>.pong-practice{grid-column:1/-1}.pong-spin-buttons{flex-direction:row;flex-wrap:wrap}.pong-spin-buttons>button{flex:1;min-width:110px}.pong-header{flex-wrap:wrap}.pong-header-buttons{width:100%;justify-content:flex-end}}
@media(max-width:700px){.pong-shell{padding:1rem}.pong-header-buttons>button{flex:1}.pong-controls{grid-template-columns:1fr}.pong-controls>.pong-practice{grid-column:auto}.pong-stage canvas{height:clamp(320px,45dvh,510px)}.pong-scoreboard{gap:.5rem;padding:.85rem .6rem}.pong-scoreboard strong{font-size:1.8rem}.pong-main-controls{gap:.6rem}.pong-main-controls>button{min-width:130px}.pong-entry{grid-template-columns:1fr;gap:.8rem;padding:1.2rem}.pong-entry-art{height:130px;width:180px;margin:auto}.pong-entry button{width:100%;max-width:none}.pong-state-banner{max-width:none;inset-inline:.75rem;bottom:.75rem;font-size:1rem;padding:.7rem}}
@media(prefers-reduced-motion:reduce){.pong-dialog *,.pong-entry *{animation:none!important;transition:none!important}}