:root {
  --red:#eb0029; --red-bright:#ff3f61; --ink:#050507; --panel:#111116;
  --paper:#f3f0ea; --muted:#b8b8c1; --line:#36363e;
  font-family:Arial,Helvetica,sans-serif;
}
* { box-sizing:border-box; }
html,body { width:1920px; height:1080px; margin:0; overflow:hidden; }
body { background:transparent; color:var(--paper); }
button { font:inherit; color:inherit; }
::selection { background:var(--red); color:#fff; }
.lineup-broadcast { position:relative; width:100%; height:100%; padding:48px 58px; overflow:hidden; background:radial-gradient(circle at 90% 6%,rgba(235,0,41,.16),transparent 500px),#050507; opacity:1; transition:opacity .24s ease-out; }
.lineup-broadcast.is-loading { opacity:1; }
.lineup-broadcast.is-loading > header,.lineup-broadcast.is-loading .broadcast-content { opacity:.35; }
.broadcast-status { position:absolute; z-index:7; top:145px; right:58px; margin:0; color:var(--red-bright); font-size:11px; font-weight:900; letter-spacing:.09em; }
.broadcast-status[hidden] { display:none; }
.vote-banner { position:absolute; z-index:9; right:58px; bottom:18px; left:58px; min-height:72px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; padding:14px 26px; border-radius:12px; background:#eb0029; color:#fff; box-shadow:0 14px 34px rgba(0,0,0,.38); }
.vote-banner strong { justify-self:start; font-size:24px; letter-spacing:-.01em; }
.vote-banner span { grid-column:2; justify-self:center; font-size:31px; font-weight:950; letter-spacing:.02em; }
.mode-overlay .vote-banner { display:none; }
.mode-presentation .vote-banner,.mode-public .vote-banner { right:34px; bottom:18px; left:34px; }
.mode-public-root { width:100%; min-height:100%; background:#050507; }
.mode-public { min-width:1180px; min-height:900px; overflow:auto; background:#050507; }
.mode-public .lineup-broadcast { width:1400px; height:940px; margin:30px auto; padding:30px 34px 34px; border:1px solid #292930; border-radius:28px; }
.mode-public .lineup-broadcast > header { height:110px; grid-template-columns:160px minmax(0,1fr) 145px; }
.mode-public .lineup-broadcast > header img { width:145px; }
.mode-public .lineup-broadcast h1 { font-size:31px; }
.mode-public .broadcast-content { height:calc(100% - 198px); }
.lineup-broadcast > header { height:112px; display:grid; grid-template-columns:190px minmax(0,1fr) 180px; align-items:center; gap:25px; border-bottom:1px solid var(--line); }
.lineup-broadcast > header img { width:170px; max-height:66px; object-fit:contain; }
.lineup-broadcast > header span,.broadcast-overview > span,.position-detail header span { color:var(--red-bright); font-size:12px; font-weight:950; letter-spacing:.16em; }
.lineup-broadcast h1 { margin:5px 0 0; overflow:hidden; font-size:42px; letter-spacing:-.04em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.lineup-broadcast > header aside { text-align:right; }
.lineup-broadcast > header aside strong { display:block; font-size:47px; font-variant-numeric:tabular-nums; line-height:1; }
.lineup-broadcast > header aside small { display:block; margin-top:6px; color:var(--muted); font-size:10px; font-weight:900; letter-spacing:.12em; }
.broadcast-content { height:calc(100% - 112px); display:grid; grid-template-columns:minmax(0,1fr) 390px; gap:30px; padding-top:26px; }
.pitch-wrap { min-width:0; min-height:0; display:flex; align-items:center; justify-content:center; }
.pitch { position:relative; height:100%; max-height:752px; aspect-ratio:.82; overflow:hidden; border:2px solid rgba(255,255,255,.74); border-radius:24px; background:repeating-linear-gradient(0deg,#087239 0,#087239 11.1%,#096b36 11.1%,#096b36 22.2%); box-shadow:inset 0 0 90px rgba(0,0,0,.28),0 25px 70px rgba(0,0,0,.3); }
.pitch-lines { position:absolute; z-index:0; inset:0; pointer-events:none; }
.pitch-lines i { position:absolute; display:block; }
.pitch-lines .halfway { left:0; right:0; top:50%; height:2px; background:rgba(255,255,255,.5); }
.pitch-lines .circle { left:50%; top:50%; width:31%; aspect-ratio:1; border:2px solid rgba(255,255,255,.55); border-radius:50%; transform:translate(-50%,-50%); }
.pitch-lines .box { left:25%; width:50%; height:14%; border:2px solid rgba(255,255,255,.5); }
.pitch-lines .box.top { top:-2px; border-top:0; }
.pitch-lines .box.bottom { bottom:-2px; border-bottom:0; }
.pitch-player { position:absolute; z-index:2; left:var(--x); top:var(--y); width:184px; padding:0; border:0; background:none; text-align:center; cursor:pointer; transform:translate(-50%,-50%); transition:filter .18s ease-out,transform .18s ease-out; }
.pitch-player:hover,.pitch-player:focus-visible,.pitch-player.is-active { z-index:5; filter:brightness(1.1); transform:translate(-50%,calc(-50% - 5px)); }
.pitch-player:focus-visible { outline:3px solid #fff; outline-offset:4px; border-radius:10px; }
.pitch-player img { display:block; width:74px; height:83px; margin:auto; object-fit:contain; filter:drop-shadow(0 9px 10px rgba(0,0,0,.42)); }
.pitch-player div { width:max-content; min-width:124px; max-width:184px; margin:-7px auto 0; padding:7px 12px 8px; overflow:hidden; border-radius:8px; background:rgba(5,5,8,.96); box-shadow:0 7px 17px rgba(0,0,0,.32); }
.pitch-player strong,.pitch-player span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pitch-player strong { font-size:15px; line-height:1.05; text-transform:uppercase; }
.pitch-player span { margin-top:4px; color:var(--red-bright); font-size:12px; font-variant-numeric:tabular-nums; font-weight:950; }
.pitch-player.is-active div { background:var(--red); }
.pitch-player.is-active span { color:#fff; }
.broadcast-side { min-width:0; min-height:0; overflow:hidden; border:1px solid var(--line); border-radius:24px; background:var(--panel); }
.broadcast-overview,.position-detail { height:100%; padding:38px; }
.broadcast-overview { display:flex; flex-direction:column; }
.broadcast-overview > strong { display:block; margin-top:8px; font-size:72px; font-variant-numeric:tabular-nums; letter-spacing:-.04em; line-height:.95; }
.broadcast-overview > small { display:block; margin-top:9px; color:var(--muted); font-size:11px; font-weight:900; letter-spacing:.12em; }
.broadcast-overview hr { width:100%; margin:38px 0; border:0; border-top:1px solid var(--line); }
.broadcast-overview > p { margin:0; font-size:25px; font-weight:850; letter-spacing:-.02em; line-height:1.12; }
.broadcast-overview > p b { color:var(--red-bright); font-size:58px; font-variant-numeric:tabular-nums; line-height:1; }
.broadcast-hint { margin-top:auto; color:var(--muted); font-size:14px; line-height:1.45; }
.broadcast-hint strong { display:block; margin-bottom:9px; color:var(--paper); font-size:13px; letter-spacing:.06em; }
.broadcast-hint span { display:block; }
.position-detail[hidden] { display:none; }
.position-detail { flex-direction:column; }
.broadcast-side.detail-open .broadcast-overview { display:none; }
.broadcast-side.detail-open .position-detail { display:flex; }
.position-detail header { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.position-detail h2 { margin:7px 0 0; font-size:29px; letter-spacing:-.03em; line-height:1.04; }
.position-detail header button { flex:0 0 42px; width:42px; height:42px; border:1px solid #4a4a53; border-radius:50%; background:#202026; font-size:27px; line-height:1; cursor:pointer; }
.position-detail header button:hover,.position-detail header button:focus-visible { background:#313138; }
.position-detail > p { margin:28px 0 20px; color:var(--muted); font-size:14px; line-height:1.5; }
.position-detail ol { margin:0; padding:0; list-style:none; }
.position-detail li { min-height:92px; display:grid; grid-template-columns:25px 54px minmax(0,1fr) 58px; align-items:center; gap:9px; padding:8px 0; border-top:1px solid #303036; }
.position-detail li > b { color:#9999a3; font-size:17px; }
.position-detail li img { width:52px; height:67px; object-fit:contain; }
.position-detail li div { min-width:0; }
.position-detail li div strong,.position-detail li div span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.position-detail li div strong { font-size:15px; }
.position-detail li div span { margin-top:5px; color:#aaaab3; font-size:10px; font-weight:800; }
.position-detail li em { color:var(--paper); font-size:20px; font-variant-numeric:tabular-nums; font-style:normal; font-weight:950; text-align:right; }
.position-detail li.is-selected em,.position-detail li.is-selected > b,.position-detail li.is-selected div span { color:var(--red-bright); }
.position-detail .empty-ranking { display:block; min-height:0; padding:25px 0; color:var(--muted); }
.position-detail > small { display:block; margin-top:16px; color:#aaaab3; font-size:11px; font-weight:800; }
.detail-return { min-height:44px; margin-top:auto; padding:0; border:0; border-top:1px solid var(--line); background:transparent; color:var(--paper); font-size:11px; font-weight:900; letter-spacing:.08em; text-align:left; cursor:pointer; }
.detail-return:hover,.detail-return:focus-visible { color:var(--red-bright); }
.waiting-copy { position:absolute; z-index:2; inset:0; display:grid; place-content:center; text-align:center; }
.waiting-copy strong { font-size:42px; }
.waiting-copy span { margin-top:8px; color:var(--muted); }
.mode-presentation-root { width:100%; height:100%; background:#050507; }
.mode-presentation { position:fixed; transform-origin:0 0; background:#050507; }
.mode-presentation .lineup-broadcast { width:1400px; height:940px; margin:52px 0 0 62px; padding:30px 34px 34px; border:1px solid #292930; border-radius:28px; }
.mode-presentation .lineup-broadcast > header { height:110px; grid-template-columns:160px minmax(0,1fr) 145px; }
.mode-presentation .lineup-broadcast > header img { width:145px; }
.mode-presentation .lineup-broadcast h1 { font-size:31px; }
.mode-presentation .lineup-broadcast > header aside strong { font-size:40px; }
.mode-presentation .broadcast-status { top:146px; right:34px; }
.mode-presentation .pitch-slot-lcb { margin-left:-13px; }
.mode-presentation .pitch-slot-rcb { margin-left:13px; }
.mode-presentation .broadcast-content { height:calc(100% - 198px); }
.mode-overlay .lineup-broadcast { width:1290px; padding:35px 42px; background:transparent; }
.mode-overlay .lineup-broadcast > header { height:95px; padding:0 24px; border:1px solid #3a3a42; border-radius:20px 20px 0 0; background:rgba(8,8,11,.96); grid-template-columns:170px minmax(0,1fr) 150px; }
.mode-overlay .lineup-broadcast h1 { font-size:31px; }
.mode-overlay .lineup-broadcast > header aside strong { font-size:37px; }
.mode-overlay .broadcast-content { height:875px; grid-template-columns:1fr; gap:0; padding:0; }
.mode-overlay .pitch-wrap { width:100%; height:100%; }
.mode-overlay .pitch { width:100%; height:100%; max-height:none; aspect-ratio:auto; border-radius:0 0 24px 24px; border-color:#35353c; }
.mode-overlay .broadcast-side { display:none; }
.mode-overlay .pitch-player { width:178px; cursor:default; pointer-events:none; }
.mode-overlay .pitch-player img { width:94px; height:105px; }
.mode-overlay .pitch-player strong { font-size:17px; }
.mode-overlay .pitch-player span { font-size:13px; }