.bridge-page{background:radial-gradient(ellipse at 65% -12%,#275a46 0,transparent 47%),#0b242b}
.bridge-page .game-head h1{font-size:clamp(26px,5.2vw,44px);line-height:1.13}
.bridge-page .game-head .button{flex-shrink:0}
.bridge-stage{background:#15494b;border-color:#90bba1;aspect-ratio:7/5}
.bridge-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.bridge-hud{position:absolute;top:13px;left:13px;display:flex;gap:6px}
.bridge-hud span,.bridge-feedback{background:linear-gradient(#284b41f5,#152f34f5);border:1px solid #a4dac080;color:#f5fff1;border-radius:10px;box-shadow:0 3px 0 #0a2026b8;font-weight:850}
.bridge-hud span{padding:5px 9px;min-width:42px;text-align:center;font-variant-numeric:tabular-nums}
#bridge-hearts{color:#ffc098}
.bridge-feedback{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);width:min(82%,248px);text-align:center;padding:7px 12px;font-size:13px}
.tilt-meter{position:relative;height:8px;margin-bottom:5px;border-radius:8px;background:linear-gradient(90deg,#e87b65,#ffcf73 22%,#84dc9a 36%,#84dc9a 64%,#ffcf73 78%,#e87b65)}
.tilt-meter span{position:absolute;left:50%;height:100%;border-left:1px solid #143f34}
.tilt-meter i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:14px;height:14px;border-radius:50%;background:#fff7dd;border:2px solid #1f504c}
.bridge-controls{grid-template-columns:1fr 1fr}
.bridge-page input[type=number]{width:70px;min-height:39px;padding:5px;border:1px solid #5d8699;border-radius:8px;background:#24475e;color:inherit}
body.bridge-page.distance .bridge-stage{width:min(100%,calc((100dvh - 130px) * 7 / 5))}
@media(max-width:540px){.bridge-hud{top:9px;left:9px;gap:4px}.bridge-hud span{font-size:12px;padding:4px;min-width:37px}.bridge-feedback{bottom:7px}}
