@font-face{font-family:Oswald;src:url('/assets/oswald.ttf') format('truetype');font-display:swap}
:root{color-scheme:light;--navy:#09283d;--ink:#0b2b42;--lime:#d9ff20;--ice:#d9eaf4;--muted:#526e80;--pink:#ff7d9d;font-family:Arial,sans-serif;color:var(--ink);background:#081b2b}*{box-sizing:border-box}body{margin:0;min-height:100dvh;display:grid;place-items:center;background:radial-gradient(ellipse at top,#24435a,#081923 70%);padding:16px}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible{outline:3px solid #00c9ef;outline-offset:3px}button:disabled{cursor:default}button[hidden],[hidden]{display:none!important}.game{width:min(100%,520px);border:1px solid #4c6c7e;border-radius:21px;overflow:hidden;background:var(--ice);box-shadow:0 25px 80px #0005}header{height:66px;display:flex;align-items:center;justify-content:space-between;padding:0 21px;background:#e8f2f9;border-bottom:1px solid #bbcfdc}.brand{font:italic 800 28px/1 Oswald,sans-serif;letter-spacing:-.8px;position:relative}.brand:after{content:'';position:absolute;left:0;bottom:-7px;width:55px;height:3px;background:#11b6cf}.scoreboard{display:grid;text-align:right;gap:7px;font-size:13px}.pill{font-size:8px;letter-spacing:1.4px;color:var(--muted)}.hud{text-align:center;padding:10px 10px 8px;background:#e8f2f9}.heading{font:700 29px/1.1 Oswald,sans-serif;letter-spacing:.5px}#instruction{font-size:11px;min-height:13px;margin:5px 0 0;color:var(--muted)}.arena{height:clamp(340px,57dvh,555px);position:relative;background:#17384d;overflow:hidden}#scene,#scene canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.scene-caption{position:absolute;bottom:0;left:0;width:100%;display:flex;justify-content:space-between;padding:24px 12px 9px;background:linear-gradient(transparent,#071a2c9c);color:#fff;font-size:8px;pointer-events:none}.net-overlay{padding:10px 12px 5px}.zones{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.zones button{height:66px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #9bb6c8;border-radius:10px;background:#f1f8fc;color:var(--ink);box-shadow:0 3px 0 #9bb6c855;transition:background .15s,transform .15s}.zones button:not(:disabled):hover{transform:translateY(-2px)}.zones button:disabled{opacity:.72}.zones button[aria-pressed=true]{background:var(--lime);border-color:#8bb621;box-shadow:0 3px 0 #91aa32;opacity:1}.dot{width:22px;height:22px;border:2px solid currentColor;border-radius:50%;display:block;flex-shrink:0}.zones button[aria-pressed=true] .dot{background:var(--navy);box-shadow:inset 0 0 0 4px var(--lime)}.zones small{font:600 15px Oswald,sans-serif;letter-spacing:.6px}.zones kbd{font:10px Arial;opacity:.5;display:block;margin-top:3px}.zones .bot-point small:after{content:'СОПЕРНИК';display:block;font-size:9px;line-height:1.1;letter-spacing:.3px;margin-top:3px}.zones .block-point{border-bottom:3px solid #20a9cd}.dock{padding:9px 12px 12px;min-height:67px}.panel{display:grid;grid-template-columns:1.15fr 1fr;gap:8px}.roles{display:flex;gap:5px}.roles button{display:flex;gap:6px;align-items:center;flex:1;justify-content:center;border:1px solid #afc4d1;border-radius:8px;background:#e8f2f8;font-size:12px;font-weight:700;padding:7px 4px}.roles button[aria-pressed=true]{background:#fff;border-color:#567885}.roles small{display:none}.shirt{border-radius:4px;padding:5px;color:white;font-weight:800}.blue{background:#164d93}.red{background:#e73d51}.primary{border:1px solid #9bbd28;border-radius:10px;background:var(--lime);color:var(--navy);min-height:48px;font:700 24px Oswald,sans-serif;box-shadow:0 3px 0 #9bbd28}.primary:disabled{opacity:.55}.play-icon{font-size:20px;margin-right:7px}.hint{grid-column:1/-1;text-align:center;font-size:9px;margin:2px 0 0;color:var(--muted)}#result{display:block}.result-copy{display:none}.result-actions{display:grid;grid-template-columns:1.6fr .8fr 1fr;gap:7px}.result-actions .primary{font-size:18px}.secondary{border:1px solid #a4becf;background:#edf5fa;border-radius:8px;color:var(--ink);font-weight:700;font-size:11px}.status{text-align:center;padding:10px 0;font-size:12px;color:var(--muted);min-height:38px}.status.error{color:#9c1f38}footer{display:flex;justify-content:space-between;gap:8px;padding:6px 12px 9px;font-size:8px;color:var(--muted)}.sport-plate{position:absolute;z-index:3;top:50%;left:50%;width:max-content;max-width:92%;min-width:150px;transform:translate(-50%,-50%) skew(-5deg);padding:17px 26px 19px;text-align:center;color:white;background:linear-gradient(110deg,#071e32f5,#103954f5);border-bottom:5px solid var(--lime);box-shadow:0 8px 24px #00182766;pointer-events:none}.sport-plate>*{display:block;transform:skew(5deg)}.sport-plate span{font:600 11px Oswald,sans-serif;letter-spacing:2px;color:var(--lime)}.sport-plate strong{font:700 italic clamp(36px,9vw,56px)/1.08 Oswald,sans-serif;letter-spacing:.4px;margin:8px 0}.sport-plate small{font:500 11px Oswald,sans-serif;letter-spacing:1px;color:#c8e4f4}.role-intro:not([hidden]){animation:role-slam 1.6s both}.countdown-overlay{padding:12px 26px 15px;min-width:145px}.countdown-overlay strong{font-size:82px;line-height:1;margin:4px 0 0}.countdown-overlay.urgent{border-color:#ffcc52}.countdown-overlay.urgent span{color:#ffcc52}.countdown-overlay.tick strong{animation:tick .28s ease-out}.action-result[data-stage=action]:not([hidden]){animation:result-pulse .95s ease-out 2}.action-result[data-stage=verdict]{border-color:var(--lime);animation:verdict-in .3s both}.action-result[data-stage=verdict][data-won=false]{border-color:var(--pink)}.action-result[data-stage=verdict][data-won=false] span{color:var(--pink)}.graphics-error{position:absolute;inset:0;z-index:10;background:var(--navy);color:white;padding:30px}.graphics-error button{padding:12px 22px}.graphics-detail{font-size:12px}.arena.loading:after{content:'Готовим площадку…';position:absolute;inset:0;display:grid;place-items:center;color:#fff;background:#123246}.error{color:#b92244}@keyframes role-slam{0%{opacity:0;transform:translate(-95%,-50%) skew(-12deg)}15%,85%{opacity:1;transform:translate(-50%,-50%) skew(-5deg)}100%{opacity:0;transform:translate(-20%,-50%) skew(-5deg)}}@keyframes tick{0%{opacity:.5;transform:skew(5deg) scale(.82)}100%{opacity:1;transform:skew(5deg) scale(1)}}@keyframes result-pulse{0%,100%{transform:translate(-50%,-50%) skew(-5deg) scale(1)}35%{transform:translate(-50%,-50%) skew(-5deg) scale(1.06)}}@keyframes verdict-in{from{opacity:0;transform:translate(-50%,-40%) skew(-5deg)}to{opacity:1;transform:translate(-50%,-50%) skew(-5deg)}}@media(max-width:560px){body{padding:0;display:block}.game{width:100%;border-radius:0;border:0;min-height:100dvh}.arena{height:clamp(320px,57dvh,555px)}header{height:58px;padding:0 14px}.brand{font-size:26px}.zones button{height:60px;gap:8px}footer{font-size:7px}.sport-plate strong{font-size:42px}.countdown-overlay strong{font-size:76px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

/* 05.1: one start action; roles are assigned by the server. */
#lobby{grid-template-columns:1fr}.result-actions{grid-template-columns:2fr 1fr}#scene[data-camera-hit="true"]{animation:camera-impact .3s ease-out}@keyframes camera-impact{0%{transform:translate(0,0)}18%{transform:translate(-7px,5px)}40%{transform:translate(5px,-3px)}65%{transform:translate(-3px,2px)}100%{transform:translate(0,0)}}

/* Entry screen and participant name — 06 */
.entry{width:min(100%,520px);border:1px solid #4c6c7e;border-radius:21px;overflow:hidden;background:#e8f2f9;box-shadow:0 25px 80px #0005}.entry-kicker{font:500 9px Oswald,sans-serif;letter-spacing:1.4px;color:var(--muted)}.entry-art{height:230px;position:relative;overflow:hidden;background:linear-gradient(90deg,#062a41dd,#062a4166),url('/assets/arena-05.webp') center 38%/cover}.entry-art:after{content:'';position:absolute;bottom:0;left:0;width:100%;height:4px;background:var(--lime)}.entry-art-copy{position:absolute;inset:0;padding:33px 30px;color:white}.entry-art-copy span{font:500 10px Oswald,sans-serif;letter-spacing:1.4px;color:#c1e2ed}.entry-art-copy strong{display:block;font:700 italic 50px/1.03 Oswald,sans-serif;margin-top:17px;letter-spacing:-.6px}.entry-net{position:absolute;width:70%;height:180px;right:-10%;top:25%;transform:rotate(-8deg);background-image:linear-gradient(#cee9f644 1px,transparent 1px),linear-gradient(90deg,#cee9f644 1px,transparent 1px);background-size:18px 18px;border-top:5px solid #dfeef799;opacity:.6}.entry-ball{position:absolute;width:69px;height:69px;border-radius:50%;right:34px;top:35px;transform:rotate(-20deg);background:conic-gradient(#ffd426 0deg 65deg,#1647aa 65deg 120deg,#ffd426 120deg 185deg,#1647aa 185deg 240deg,#ffd426 240deg 305deg,#1647aa 305deg);box-shadow:inset -8px -8px 12px #001a4a44,inset 5px 5px 9px #fff5,0 12px 22px #00152255}.entry-body{padding:26px 30px 24px}.entry-body h1{font:700 30px/1.15 Oswald,sans-serif;margin:0 0 7px}.entry-body>p{font-size:13px;color:var(--muted);margin:0 0 23px}#joinForm{display:grid;gap:8px}#joinForm label{font-size:12px;font-weight:700}#playerInput{min-width:0;width:100%;min-height:54px;border:1px solid #93b4c7;border-radius:9px;padding:0 15px;background:#f8fcff;color:var(--ink);font:600 18px Arial,sans-serif}#playerInput::placeholder{font-weight:400;color:#748fa0}#playerInput:focus{outline:3px solid #0eb1d13b;outline-offset:1px;border-color:#19869d}#playerInput[aria-invalid=true]{border-color:#b82343}#nameHint{font-size:10px;color:var(--muted)}.name-error{font-size:12px;line-height:1.45;color:#a2213c;margin:0}#joinButton{margin-top:9px;min-height:56px;font-size:25px;display:flex;align-items:center;justify-content:space-between;padding:8px 18px}.entry-rules{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:25px;font:500 10px Oswald,sans-serif;letter-spacing:.8px;color:#55768a}.entry-rules i{width:3px;height:3px;border-radius:50%;background:#9ab5c4}.scoreboard{min-width:0;max-width:235px}.scoreline{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:6px;font-size:12px;white-space:nowrap}.scoreline>span{min-width:0;overflow:hidden;text-overflow:ellipsis}#score{font-variant-numeric:tabular-nums;font-weight:700}#playerName{font-weight:700}#roleLabel:focus{outline:none}.sport-plate span{overflow-wrap:anywhere}header{gap:16px}.brand{flex-shrink:0}@media(max-width:560px){.entry{width:100%;min-height:100dvh;border:0;border-radius:0}.entry-art{height:230px}.entry-body{padding:26px 24px}.entry-art-copy{padding:31px 24px}.entry-art-copy strong{font-size:45px}.entry-ball{width:60px;height:60px;right:25px;top:38px}.entry-kicker{font-size:8px;letter-spacing:.8px}.scoreboard{max-width:calc(100% - 135px)}.scoreline{font-size:11px;gap:5px}}@media(max-width:350px){.entry-art-copy strong{font-size:40px}.entry-ball{width:52px;height:52px;right:18px}.entry-art-copy{padding-left:20px}.entry-body{padding:23px 20px}.entry-kicker{font-size:7px;letter-spacing:.4px}.scoreline{font-size:10px;gap:3px}}

/* Tutorial only on entry; compact player-facing copy. */
.tutorial{position:relative;background:#0b2940;border-bottom:3px solid var(--lime);aspect-ratio:4/3;overflow:hidden}.tutorial img{display:block;width:100%;height:100%;object-fit:contain}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.entry-body h1{margin-bottom:20px}.entry-body{padding-top:22px}.hud{min-height:66px;display:grid;place-content:center}.game .dock{padding-bottom:14px}.entry header{justify-content:center}

/* 07.1: entry fits the available screen; gameplay layout stays unchanged. */
body:has(.entry:not([hidden])){display:grid;place-items:center;padding:16px;min-height:100dvh}
.entry:not([hidden]){width:min(100%,520px,max(280px,calc((100dvh - 290px) * 4 / 3)));min-height:0}
.entry header{height:clamp(48px,8dvh,64px)}
.entry-body{padding:20px 24px 24px}.entry-body h1{font-size:28px;margin-bottom:16px}
#joinForm{gap:10px}#playerInput{min-height:52px}#joinButton{min-height:52px;margin-top:0}
@media(max-width:560px){body:has(.entry:not([hidden])){padding:8px}.entry:not([hidden]){width:min(100%,520px,max(280px,calc((100dvh - 274px) * 4 / 3)));border:1px solid #4c6c7e;border-radius:18px}.entry-body{padding:20px}.entry header{height:52px}}
@media(max-height:500px) and (min-width:520px){body:has(.entry:not([hidden])){padding:8px}.entry:not([hidden]){width:min(100%,760px);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(220px,1fr);border-radius:16px}.entry header{height:44px;grid-column:1/-1}.tutorial{border-bottom:0;border-right:3px solid var(--lime);align-self:center}.entry-body{align-self:center;padding:16px}.entry-body h1{font-size:26px;margin-bottom:14px}#joinButton{font-size:22px}#playerInput{font-size:17px}}

/* 07.2: participation starts the round; show the dock only for results or recovery. */
.game .dock:has(#lobby[hidden]):has(#result[hidden]):has(#status[hidden]){display:none}

/* Online rooms: the accepted match scene and animation styles are unchanged. */
.pool-overlay{min-width:210px;padding:17px 20px}.pool-overlay strong{font-size:clamp(23px,6vw,34px);line-height:1.15;max-width:350px}.pool-overlay b{font:700 62px/1 Oswald;display:block;margin:12px 0}.pool-overlay small{line-height:1.5;letter-spacing:.3px;max-width:310px}.pool-tools{padding:10px 12px 12px;font:500 12px Oswald;color:var(--muted);border-top:1px solid #b9cfdd}.pool-actions{display:flex;gap:8px;margin-top:8px}.pool-actions button{padding:8px 12px;min-height:40px}.pool-actions button:disabled{opacity:.5;cursor:default}#poolRoster{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}#poolRoster span{border:1px solid #b0c9d9;border-radius:15px;padding:4px 9px;background:#eef7fc}.bracket-panel{padding:12px;background:#e8f2f9}.bracket-panel h2{font:600 21px Oswald;margin:4px 0 12px}#bracketContent{display:flex;gap:10px;overflow:auto;max-height:420px}.bracket-round{min-width:170px;flex:1}.bracket-round h3{font:500 13px Oswald}.bracket-match{padding:10px;margin:8px 0;border:1px solid #afc9d9;border-radius:8px;background:#f7fcff;font:12px/1.6 Arial}.bracket-match.is-mine{border-color:#1985a5;border-width:2px}.bracket-match span{display:block;overflow-wrap:anywhere}.bracket-match .winner{font-weight:700}.bracket-match small{display:block;color:#53768c;margin-top:4px}.game[data-network="offline"] .heading{opacity:.65}.pool-overlay.disconnected{border-color:#ffcc52}