.eyebrow { margin:0; color:#85c8fb; font-size:11px; font-weight:700; letter-spacing:.16em; }
.throne-stats { display:flex; align-items:center; gap:0; margin-bottom:22px; padding:15px 0; border-top:1px solid #435b76; border-bottom:1px solid #435b76; }
.throne-stats>div { display:flex; align-items:baseline; gap:12px; min-width:165px; padding-right:24px; }
.throne-stats>div+div { padding-left:24px; border-left:1px solid #39516a; }
.throne-stats span { color:#a7bdd0; font-size:12px; font-weight:600; }
.throne-stats strong { color:#f5f6f3; font-size:23px; font-variant-numeric:tabular-nums; line-height:1; }
.throne-stats small { min-width:0; overflow:hidden; color:#8fa8bd; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.throne-stats #current-run { color:var(--film-orange); }
#new-run { margin-left:auto; padding:8px 0 8px 12px; border:0; background:none; color:#96cbf5; font-size:12px; font-weight:700; }
#new-run:hover { color:#fff; text-decoration:underline; }
.throne-load { padding:80px 0; color:#aec2d4; text-align:center; }
.throne-arena[hidden] { display:none; }
.arena-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:24px; }
.arena-heading .eyebrow { color:#85c8fb; }
.arena-heading h2 { margin:6px 0 0; font-size:clamp(25px,3vw,34px); line-height:1.16; letter-spacing:-.04em; }
.arena-heading>p { max-width:210px; margin:0 0 2px; color:#a7bcd0; font-size:12px; line-height:1.5; text-align:right; }
.movie-pair { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.film-choice { display:grid; grid-template-columns:minmax(0,160px) minmax(0,1fr); grid-template-rows:auto 1fr auto; align-items:start; gap:0 19px; width:100%; min-width:0; min-height:298px; padding:15px; border:1px solid #4b6886; border-radius:10px; background:#203650; color:#f8f7f3; text-align:left; box-shadow:none; transition:border-color .18s,background .18s,transform .18s; }
.film-choice:hover { transform:translateY(-2px); background:#25405d; }
.film-choice:active { transform:translateY(0); }
.film-choice:focus-visible { outline:2px solid #88caff; outline-offset:3px; }
.champion-choice:hover { border-color:#ff9b5a; }
.challenger-choice:hover { border-color:#8acaff; }
.film-role { grid-column:1/-1; margin-bottom:12px; color:#ffad73; font-size:10px; font-weight:700; letter-spacing:.16em; }
.challenger-choice .film-role { color:#8acaff; }
.poster-frame { grid-column:1; grid-row:2/4; display:block; overflow:hidden; width:100%; aspect-ratio:2/3; border:1px solid #647387; border-radius:5px; background:#111a2a; }
.poster-frame img { display:block; width:100%; height:100%; object-fit:cover; }
.film-info { grid-column:2; grid-row:2; display:block; align-self:end; min-width:0; padding-bottom:14px; }
.film-info strong { display:block; overflow-wrap:anywhere; font-family:'Space Grotesk',Poppins,sans-serif; font-size:clamp(19px,2.1vw,25px); line-height:1.12; letter-spacing:-.035em; }
.film-info small { display:block; margin-top:7px; color:#a9c0d2; font-size:13px; }
.film-action { grid-column:2; grid-row:3; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 0 3px; border-top:1px solid #4d6883; color:#ffae75; font-size:12px; font-weight:700; white-space:nowrap; }
.challenger-choice .film-action { color:#8bcaff; }
.film-action span { font-size:19px; line-height:1; }
.versus { position:absolute; z-index:1; top:50%; left:50%; display:grid; place-items:center; width:38px; height:38px; border:1px solid #5d7791; border-radius:50%; background:#101e32; color:#d8e6ee; font-size:11px; font-weight:700; letter-spacing:.06em; transform:translate(-50%,-50%); pointer-events:none; }
.throne-status { min-height:27px; margin:22px 0 0; padding-top:16px; border-top:1px solid #425b76; color:#b5cde0; font-size:13px; line-height:1.5; }
.film-choice.is-new .poster-frame { animation:poster-enter .28s ease-out; }
@keyframes poster-enter { from { opacity:.45; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:800px) { .film-choice { grid-template-columns:minmax(0,125px) minmax(0,1fr); gap:0 12px; min-height:250px; } .film-info strong { font-size:19px; } .throne-stats>div { min-width:0; } }
@media(max-width:650px) { .throne-stats small { display:block; max-width:100%; } .throne-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:14px; } .throne-stats>div { display:block; padding:0 8px; } .throne-stats>div:first-child { padding-left:0; } .throne-stats>div+div { padding-left:12px; } .throne-stats span,.throne-stats strong { display:block; } .throne-stats strong { margin-top:4px; } #new-run { grid-column:1/-1; justify-self:start; margin:0; padding:4px 0; } .arena-heading { align-items:start; } .arena-heading>p { display:none; } .movie-pair { gap:12px; } .film-choice { display:flex; flex-direction:column; min-height:0; padding:10px; } .film-role { min-height:27px; margin-bottom:6px; font-size:9px; } .poster-frame { width:100%; } .film-info { align-self:stretch; flex:1; padding:11px 0 16px; } .film-info strong { font-size:clamp(15px,4vw,19px); } .film-info small { margin-top:5px; font-size:11px; } .film-action { width:100%; padding:11px 0 2px; font-size:10px; } .versus { top:39%; width:32px; height:32px; font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .film-choice,.film-choice.is-new .poster-frame { animation:none; transition:none; } }