/* Наглядный счёт через десяток */
.lesson-board{grid-template-columns:minmax(390px,1.25fr) minmax(190px,.75fr)}
.bridge-demo{min-width:0;padding:25px 18px;border-radius:22px;background:#f8fafc;text-align:center}
.dot-line{min-height:50px;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap}
.ten-frame{padding:5px;display:inline-flex;gap:4px;border:3px solid #22b97f;border-radius:12px}
.dot-line>.math-dot,.ten-frame>.math-dot{width:clamp(17px,2vw,24px);height:clamp(17px,2vw,24px);display:inline-block;border:2px solid #075e84;border-radius:50%;background:#19d8ef}
.dot-line .added,.dot-line .removed{border-color:#ee641f;background:#ffd43f}
.dot-line .removed{position:relative;opacity:.72}.dot-line .removed:after{content:"";position:absolute;left:-3px;right:-3px;top:45%;height:3px;border-radius:4px;background:#e34343;transform:rotate(-35deg)}
.bridge-equation{margin-top:22px;font:700 clamp(22px,3.1vw,36px)/1.25 Unbounded,sans-serif;letter-spacing:-.04em;white-space:nowrap}
.number-split{position:relative;width:120px;height:84px;margin:14px auto 0;font:700 23px Unbounded,sans-serif}.number-split b{position:absolute;left:50%;top:0;transform:translateX(-50%)}.number-split i:before,.number-split i:after{content:"";position:absolute;top:31px;width:42px;height:2px;background:var(--ink)}.number-split i:before{left:21px;transform:rotate(-43deg)}.number-split i:after{right:21px;transform:rotate(43deg)}.number-split span{position:absolute;bottom:0}.number-split span:nth-of-type(1){left:13px}.number-split span:nth-of-type(2){right:13px}
.bridge-explanation{padding:22px;border-radius:20px;background:#eaf0ff}.bridge-explanation b{font:700 19px Unbounded,sans-serif}.bridge-explanation p{margin:10px 0 0;color:#53617d;font-size:14px;line-height:1.65}

/* Непрерывный забег к развилке */
.game-hud #time-left{color:var(--yellow)}.game-hud #time-left.urgent{color:#ff765b}
.answer-gate{pointer-events:none}.answer-gate small{display:none}.answer-gate.gate-green{background:linear-gradient(135deg,#60dfad,#2fbd88)}.answer-gate.gate-orange{background:linear-gradient(135deg,#ff9a72,#ff704d)}.answer-gate.gate-yellow{background:linear-gradient(135deg,#ffd65c,#f2ae2f)}
.runner{width:108px;height:144px;bottom:4%;will-change:left,bottom;transition:left .2s ease,bottom .08s linear,transform .2s}.runner span.runner-sprite{width:100%;height:100%;display:block;background:url("runner-sprite.png") 0 0/200% 100% no-repeat;filter:drop-shadow(0 11px 7px rgba(0,0,0,.32));animation:runner-frames var(--stride,.29s) step-end infinite;transform-origin:50% 70%}.runner i{left:17px;right:17px;bottom:-4px}
.road.running .runner span.runner-sprite{animation-play-state:running}.road:not(.running) .runner span.runner-sprite{animation-play-state:paused}
.road.fast .runner span.runner-sprite{--stride:.18s}.road.slow .runner span.runner-sprite{--stride:.45s}.road.dash .runner span.runner-sprite{--stride:.1s;filter:drop-shadow(0 11px 7px rgba(0,0,0,.32)) drop-shadow(0 0 13px rgba(255,209,85,.85))}.road.dash .runner:before{content:"";position:absolute;left:-32px;right:-32px;top:38%;height:4px;border-radius:5px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);box-shadow:0 17px 0 rgba(255,209,85,.62),0 -17px 0 rgba(96,223,173,.62)}
.road.super-dash{box-shadow:inset 0 0 0 6px rgba(73,247,255,.72),inset 0 0 55px rgba(45,91,242,.45);animation:super-road-pulse .18s ease-in-out infinite alternate}.road.super-dash .runner span.runner-sprite{--stride:.055s;filter:drop-shadow(0 12px 7px rgba(0,0,0,.35)) drop-shadow(0 0 10px #fff) drop-shadow(0 0 25px #42efff)}.road.super-dash .runner:before{left:-85px;right:-85px;height:6px;background:linear-gradient(90deg,transparent,#fff 45% 55%,transparent);box-shadow:0 22px 0 #60dfad,0 -22px 0 #ffd155,0 42px 0 rgba(255,255,255,.72),0 -42px 0 rgba(45,91,242,.8)}.road.super-dash .runner:after{content:"СУПЕРРЫВОК ×5";position:absolute;left:50%;bottom:-28px;padding:5px 10px;border-radius:999px;background:#fff;color:#17358e;font:900 9px Manrope,sans-serif;letter-spacing:.08em;white-space:nowrap;transform:translateX(-50%);box-shadow:0 0 22px rgba(73,247,255,.9)}
.road.ultra-dash{box-shadow:inset 0 0 0 8px rgba(255,209,85,.94),inset 0 0 80px rgba(255,75,122,.62);animation:ultra-road-pulse .11s ease-in-out infinite alternate}.road.ultra-dash .problem-sign{background:linear-gradient(135deg,#ff4b7a,#6b4dff);box-shadow:0 0 0 10px rgba(255,209,85,.3),0 13px 0 rgba(9,20,48,.28)}.road.ultra-dash .runner span.runner-sprite{--stride:.035s;filter:drop-shadow(0 12px 7px rgba(0,0,0,.35)) drop-shadow(0 0 11px #fff) drop-shadow(0 0 34px #ffd155) drop-shadow(0 0 48px #ff4b7a)}.road.ultra-dash .runner:before{left:-130px;right:-130px;height:8px;background:linear-gradient(90deg,transparent,#fff 35% 65%,transparent);box-shadow:0 25px 0 #ffd155,0 -25px 0 #ff4b7a,0 50px 0 #60dfad,0 -50px 0 #6b4dff}.road.ultra-dash .runner:after{content:"СУПЕР ×3 РЫВОК";bottom:-31px;padding:6px 12px;background:#ffd155;color:#101a35;font-size:10px;box-shadow:0 0 30px #ff4b7a}
.road.teleporting{box-shadow:inset 0 0 0 8px rgba(159,109,255,.88),inset 0 0 90px rgba(91,52,205,.74);animation:teleport-road .72s ease}.road.teleporting .runner{transition:left .15s ease,bottom .06s linear;animation:teleport-runner .72s ease}.road.teleporting .runner span.runner-sprite{animation-play-state:paused;filter:drop-shadow(0 0 12px #fff) drop-shadow(0 0 35px #9f6dff)}.road.teleporting .runner:before{content:"";position:absolute;inset:-45px;border:5px solid rgba(255,255,255,.9);border-radius:50%;box-shadow:0 0 0 12px rgba(159,109,255,.38),0 0 45px #9f6dff;animation:teleport-ring .72s ease}.feedback.teleport-feedback{background:#7a51e8;color:#fff;box-shadow:0 0 0 8px rgba(159,109,255,.23),0 15px 35px rgba(0,0,0,.22)}
.road.no-lane .runner{filter:saturate(.85)}.road.no-lane .runner:after{content:"Выберите сторону";position:absolute;left:50%;bottom:-24px;padding:4px 8px;border-radius:999px;background:rgba(16,26,53,.82);color:#fff;font:800 8px Manrope,sans-serif;white-space:nowrap;transform:translateX(-50%)}
.road.time-warning .problem-sign{box-shadow:0 0 0 8px rgba(255,112,77,.25),0 13px 0 rgba(9,20,48,.28)}
.run-controls{padding:14px 4px 3px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.run-controls button{min-height:58px;padding:7px;border:1px solid rgba(255,255,255,.18);border-radius:15px;background:#1d2949;color:#fff;cursor:pointer;font:700 25px Unbounded,sans-serif;transition:.16s}.run-controls button small{display:block;margin-top:2px;color:#9eabcd;font:700 9px Manrope,sans-serif;text-transform:uppercase}.run-controls button:is(:hover,.pressed){border-color:var(--mint);background:#27406b;transform:translateY(-2px)}
.game-tip{padding-top:9px}.game-tip>span{max-width:730px}.game-tip>span strong{color:var(--yellow)}
@keyframes runner-frames{0%,24.99%{background-position:0 0;transform:scaleX(1)}25%,49.99%{background-position:0 0;transform:scaleX(-1)}50%,74.99%{background-position:100% 0;transform:scaleX(1)}75%,100%{background-position:100% 0;transform:scaleX(-1)}}
@keyframes super-road-pulse{to{filter:saturate(1.28) brightness(1.08)}}
@keyframes ultra-road-pulse{to{filter:saturate(1.55) brightness(1.16) hue-rotate(8deg)}}
@keyframes teleport-road{0%,100%{filter:none}35%{filter:brightness(1.42) hue-rotate(35deg)}55%{filter:brightness(.72) hue-rotate(-25deg)}}
@keyframes teleport-runner{0%{opacity:1;transform:translateX(-50%) scale(1)}32%{opacity:0;transform:translateX(-50%) scale(.25)}55%{opacity:0;transform:translateX(-50%) scale(1.7)}100%{opacity:1;transform:translateX(-50%) scale(1)}}
@keyframes teleport-ring{0%{opacity:0;transform:scale(.35)}45%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(1.8)}}

/* Девять уровней и общие чемпионы */
.level-bar{grid-template-columns:1fr;padding:18px}
.level-picker{display:grid;grid-template-columns:1fr;gap:15px}
.level-picker fieldset{min-width:0;margin:0;padding:12px;border:1px solid rgba(45,91,242,.12);border-radius:18px;background:#fafbff}
.level-picker legend{padding:0 6px;color:var(--blue);font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.level-options{display:grid;gap:8px}
.level-options.four-levels{grid-template-columns:repeat(4,minmax(0,1fr))}
.level-options.three-levels{grid-template-columns:repeat(3,minmax(0,1fr))}
.level-picker span{height:100%;min-height:72px}
.level-picker input:focus-visible+span{outline:3px solid var(--orange);outline-offset:2px}
.level-bar .start-button{width:min(100%,300px);min-height:56px;justify-self:end}
.champions-board{margin:0 0 18px;padding:18px;border:1px solid var(--line);border-radius:24px;background:#fff}
.champions-board>div:first-child{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.champions-board h3{margin:4px 0 12px;font:700 22px Unbounded,sans-serif}
.champions-board #champion-sync-state{margin-left:auto;color:#29936c;font-size:10px;font-weight:800;text-align:right}.champions-board #champion-sync-state.sync-error{color:#b46d22}
.champions-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.champions-list article{min-width:0;padding:11px 13px;border-radius:14px;background:#f4f6fb}
.champions-list small,.champions-list b,.champions-list span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.champions-list small{color:var(--blue);font-size:9px;font-weight:800;text-transform:uppercase}
.champions-list b{margin-top:3px;font-size:13px}
.champions-list span{margin-top:2px;color:var(--muted);font-size:10px}
.champion-dialog{max-width:520px;text-align:center}
.champion-dialog .champion-crown{width:82px;height:82px;margin:0 auto 18px;display:grid;place-items:center;border-radius:50%;background:var(--yellow);color:var(--ink);font-size:42px;box-shadow:0 0 0 13px rgba(255,209,85,.18)}
.champion-dialog h2{margin:8px 0 12px;font-size:clamp(32px,6vw,48px)}
.champion-dialog>p{margin:0 auto 22px;max-width:410px;color:var(--muted);line-height:1.55}
.champion-dialog form{display:grid;gap:10px;text-align:left}
.champion-dialog label{font-size:12px;font-weight:800}
.champion-dialog input{width:100%;min-height:58px;padding:13px 16px;border:2px solid var(--line);border-radius:15px;background:#f7f8fc;font-size:18px;font-weight:800}
.champion-dialog form button{min-height:54px;border:0;border-radius:15px;background:var(--orange);color:#fff;cursor:pointer;font-weight:800}
.champion-dialog form .champion-skip{min-height:42px;background:transparent;color:var(--muted);font-size:12px}

@media(max-width:850px){.lesson-board{grid-template-columns:1fr}.bridge-explanation{max-width:560px;margin:auto}.game-hud{grid-template-columns:repeat(4,1fr)}.level-options.four-levels{grid-template-columns:repeat(2,minmax(0,1fr))}.champions-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.bridge-demo{padding:20px 5px}.dot-line{gap:3px}.ten-frame{padding:3px;gap:2px}.bridge-equation{font-size:19px}.game-hud{grid-template-columns:repeat(2,1fr)}.runner{width:76px;height:101px}.run-controls{gap:5px}.run-controls button{min-height:54px;font-size:22px}.run-controls button small{font-size:8px}.road.no-lane .runner:after{display:none}.level-bar{padding:11px}.level-options.four-levels,.level-options.three-levels{grid-template-columns:1fr}.level-picker span{min-height:56px}.level-bar .start-button{width:100%}.champions-board{padding:14px}.champions-list{grid-template-columns:1fr}.champions-board>div:first-child{display:block}}
@media(prefers-reduced-motion:reduce){.runner span.runner-sprite{animation:runner-frames .7s steps(1,end) infinite!important}.runner{transition:left .01ms,bottom .08s linear!important}}
