.matchup{margin:10px auto 64px;padding:clamp(20px,4vw,46px);border:1px solid var(--line);border-radius:18px;background:linear-gradient(140deg,var(--paper-deep),var(--paper));box-shadow:0 18px 50px rgba(0,0,0,.08)}
.matchup-intro{max-width:760px;margin:0 auto 28px;text-align:center}.matchup-intro .eyebrow{color:var(--red);letter-spacing:.17em}.matchup-intro h2{margin:10px 0 12px;font:600 clamp(2rem,4.8vw,3.4rem)/1.08 var(--serif);letter-spacing:-.05em}.matchup-intro p:last-child{margin:0;color:var(--muted);font:400 1.02rem/1.55 var(--sans)}
.matchup-card{overflow:hidden;max-width:1000px;margin:auto;border:1px solid var(--line);border-radius:14px;background:var(--cream)}
.matchup-topline{display:flex;justify-content:space-between;gap:15px;padding:15px 22px;font:700 .72rem/1.2 var(--sans);letter-spacing:.11em;color:var(--ink)}.matchup-topline span{display:inline-flex;align-items:center;gap:8px}.matchup-key{width:10px;height:10px;border-radius:50%;display:inline-block}.matchup-key--blue{background:#25688c}.matchup-key--coral{background:#c25345}
.matchup-legend{display:flex;flex-wrap:wrap;gap:9px 22px;padding:0 22px 14px;color:var(--muted);font:600 .7rem/1.3 var(--sans)}.matchup-legend span{display:inline-flex;align-items:center;gap:7px}.matchup-line-key{display:inline-block;width:26px;border-top:3px dashed #f3e7c8}.matchup-line-key--blocked{border-color:#f38676}.matchup-line-key--movement{border-color:#ffd77d}
.matchup-pitch{display:block;width:100%;height:auto;background:#153c32}.matchup-field{fill:#174d3f}.matchup-field-line{fill:none;stroke:#c0e2ce;stroke-width:2;opacity:.62}.matchup-field-dot{fill:#c0e2ce}.matchup-lane{fill:none;stroke:#ffd77d;stroke-width:6;stroke-linecap:round;stroke-dasharray:10 12;opacity:.68}.matchup-pass{fill:none;stroke:#fff6dc;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:13 10;opacity:.84}
.matchup-blocked{fill:none;stroke:#f38676;stroke-width:5;stroke-linecap:round;stroke-dasharray:9 10;opacity:.9}.matchup-block-mark line{stroke:#fff6dc;stroke-width:5;stroke-linecap:round}
.matchup-pitch [data-player] circle{fill:#25688c;stroke:#e2f5fc;stroke-width:3;filter:drop-shadow(0 4px 5px rgba(0,0,0,.27))}.matchup-pitch [data-team="coral"] circle{fill:#c25345;stroke:#ffe3d5}.matchup-pitch [data-player] text{font:700 13px var(--sans);text-anchor:middle;fill:#fff;pointer-events:none}.matchup-pitch [data-player].is-focus circle{stroke:#ffdf82;stroke-width:5}.matchup-ball{fill:#fff;stroke:#153c32;stroke-width:3;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4))}
.matchup-narrative{display:grid;grid-template-columns:72px 1fr;gap:18px;align-items:start;min-height:112px;padding:22px 26px 12px;border-top:1px solid var(--line)}.matchup-count{padding-top:5px;color:var(--red);font:700 .8rem var(--sans);letter-spacing:.1em}.matchup-narrative h3{margin:0 0 5px;font:600 1.4rem/1.15 var(--serif)}.matchup-narrative p{max-width:700px;margin:0;color:var(--muted);font:400 .94rem/1.48 var(--sans)}
.matchup-controls{display:flex;justify-content:flex-end;gap:9px;padding:12px 25px 23px}.matchup-controls button{min-width:105px;border:1px solid var(--line);border-radius:6px;padding:10px 12px;background:var(--paper);color:var(--ink);font:600 .82rem var(--sans);cursor:pointer}.matchup-controls [data-play]{background:var(--red);border-color:var(--red);color:var(--white)}.matchup-controls button:hover{border-color:var(--red-dark)}.matchup-controls button:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.matchup-caption,.matchup-noscript{max-width:1000px;margin:14px auto 0;color:var(--muted);font:.78rem/1.45 var(--sans)}
.prose .phase-diagram{width:100%;margin:2rem 0 2.3rem!important;transform:none;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--paper-deep)}.phase-diagram__head{display:grid;gap:3px;padding:15px 18px}.phase-diagram__head span{color:var(--red);font:700 .65rem var(--sans);letter-spacing:.12em}.phase-diagram__head strong{font:600 1.18rem/1.2 var(--serif)}.phase-diagram svg{display:block;width:100%;height:auto;background:#153c32}.phase-diagram__field{fill:#174d3f}.phase-diagram__field-line{fill:none;stroke:#c0e2ce;stroke-width:2;opacity:.53}.phase-diagram__pass{fill:none;stroke:#fff1d7;stroke-width:4;stroke-dasharray:10 8}.phase-diagram__blocked{fill:none;stroke:#f38676;stroke-width:4;stroke-dasharray:8 8}.phase-diagram__run{fill:none;stroke:#ffd77d;stroke-width:4;stroke-dasharray:8 8}.phase-diagram__player circle{fill:#25688c;stroke:#e2f5fc;stroke-width:2.5}.phase-diagram__player--coral circle{fill:#c25345;stroke:#ffe3d5}.phase-diagram__player text{font:700 12px var(--sans);fill:#fff;text-anchor:middle}.phase-diagram figcaption{margin:0;padding:13px 18px;color:var(--muted);font:400 .83rem/1.5 var(--sans)}
@media(max-width:640px){.matchup{width:calc(100% - 24px);padding:12px 12px 18px;margin-bottom:38px;border-radius:12px}.matchup-intro{padding:15px 8px 3px}.matchup-intro h2{font-size:2rem}.matchup-topline{padding:12px;font-size:.58rem;letter-spacing:.03em}.matchup-legend{padding:0 12px 12px;gap:6px 12px;font-size:.6rem}.matchup-line-key{width:18px}.matchup-narrative{grid-template-columns:1fr;gap:5px;min-height:153px;padding:16px}.matchup-count{padding:0}.matchup-narrative h3{font-size:1.2rem}.matchup-controls{justify-content:space-between;padding:5px 12px 14px}.matchup-controls button{min-width:0;flex:1;padding:9px 7px;font-size:.74rem}}
@media(prefers-reduced-motion:reduce){.matchup-pitch *{animation:none!important;transition:none!important}}
@media print{.matchup{box-shadow:none;break-inside:avoid}.matchup-controls{display:none}}
