/* The scene is bounded by the existing pitch; scrolling and the feed stay available. */
.live-field{position:relative;isolation:isolate}
.mayhem-shot-overlay{position:absolute;inset:0;z-index:6;overflow:hidden;border-radius:inherit;pointer-events:none;background:#204f3a}
.scene-canvas{display:block;width:100%;height:100%}
.scene-lens{position:absolute;top:10px;left:12px;padding:5px 8px;background:#071a25b8;color:#e2e9e7;border-radius:5px;font:600 9px/1.2 system-ui;letter-spacing:.07em;text-transform:uppercase}
.scene-info{position:absolute;left:10px;right:10px;bottom:8px;display:flex;gap:4px;flex-direction:column;align-items:flex-start;filter:drop-shadow(0 2px 4px #000)}
.scene-info strong,.scene-info span{background:#0a1824e8;padding:4px 9px;border-radius:4px;font:600 11px/1.3 system-ui;color:#f0f4ef}
.scene-info span:empty{display:none}.scene-info span{font-size:10px;color:#b4c6cd}.scene-resolved[data-outcome=goal] .scene-info strong{background:#c2ef83;color:#142a25}
.scene-info strong,.scene-info span{max-width:100%;overflow-wrap:anywhere;box-sizing:border-box}
.scene-outcome{position:absolute;right:10px;top:8px;max-width:58%;padding:5px 10px;border-radius:6px;background:#eaf2f6;color:#16374b;font:900 clamp(16px,4vw,27px)/1.1 var(--display,system-ui);letter-spacing:.02em;text-align:center;box-shadow:0 3px 12px #0005}
.scene-outcome:empty{display:none}.scene-resolved[data-outcome=goal] .scene-outcome{background:#c2ef83;color:#142a25}
.scene-resolved[data-outcome=miss] .scene-outcome,.scene-resolved[data-outcome=post] .scene-outcome{background:#ffda9c;color:#733814}
.broadcast-score{position:sticky;top:0;z-index:8;background:#0d1924f5;backdrop-filter:blur(10px)}
.live-field .field-player i{animation:player-breathe 4s ease-in-out infinite alternate}.live-field .field-player:nth-child(2n) i{animation-delay:-2s}
@keyframes player-breathe{from{transform:rotate(-2deg) translateY(0)}to{transform:rotate(2deg) translateY(-1px)}}
@media(prefers-reduced-motion:reduce){.live-field .field-player i{animation:none}}
.live-field .field-player i{width:24px;height:34px;border:0;background:transparent;box-shadow:none;border-radius:0}.live-field .field-player i svg{height:100%;width:100%;overflow:visible}.live-field .field-player.B i{background:transparent;border:0}.live-field .field-player.off-field{display:none}.live-field .field-player small{display:block;max-width:65px}.live-field .field-player.active i{box-shadow:none;filter:drop-shadow(0 0 3px #d4f79c)}
.game-intro{padding-block:12px!important}.game-intro summary{color:var(--muted);font-size:12px;cursor:pointer}.game-intro h2{font-size:16px}.game-intro p{font-size:13px;max-width:70ch}
@media(max-width:520px){.live-field .field-player i{width:19px;height:28px}.live-field .field-player small{font-size:7px;max-width:48px}.scene-info strong{font-size:10px}.scene-lens{font-size:8px}.broadcast-score .sc{font-size:56px}.broadcast-score .tn{font-size:14px}}
/* Keep the quiet 2D intervals legible: one nearby name, with other names on focus. */
.live-field.ambient-active .field-player,.live-field.ambient-active .match-ball{transition:none}
.live-field .field-player{width:24px;height:34px;gap:0}
.live-field .field-player small{position:absolute;top:100%;left:50%;transform:translateX(-50%);max-width:90px;display:none;font:600 9px/1.2 var(--body);padding:3px 5px;background:#071b27ed;border-radius:4px;pointer-events:none}
.live-field .field-player.has-ball{z-index:4}.live-field .field-player.has-ball small,.live-field .field-player:hover small,.live-field .field-player:focus small{display:block}
.live-field:has(.field-player:hover) .field-player:not(:hover) small,.live-field:has(.field-player:focus) .field-player:not(:focus) small{display:none}
.live-field .field-player:focus{outline:2px solid #fff0aa;outline-offset:3px;border-radius:5px;z-index:5}
.live-field .match-ball{width:11px;height:11px;border:1px solid #edf7ed;background:radial-gradient(circle at 38% 38%,#1b2937 0 22%,transparent 25%),#fff;box-shadow:0 2px 4px #000b,0 0 0 3px #fff2;z-index:5}
@media(max-width:520px){.live-field .field-player{width:19px;height:28px}.live-field .field-player small{font-size:8px;max-width:76px}.live-field .match-ball{width:10px;height:10px}.scene-lens{max-width:44%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}

.scene-team{position:absolute;left:10px;bottom:68px;max-width:calc(100% - 36px);padding:6px 9px;border-left:5px solid #c4f97c;border-radius:4px;background:#081a27ed;color:#f5f8ed;font:700 12px/1.3 var(--body,system-ui);overflow-wrap:anywhere}.scene-team:empty{display:none}@media(max-width:520px){.scene-team{font-size:11px;bottom:64px}}
