/* Selected Index layout: game screens left, mode list and action right. */
@media(min-width:761px) {
  #modes[data-mode-layout=index] { padding-block:clamp(64px,9vh,104px) clamp(76px,10vh,120px); }
  #modes[data-mode-layout=index] .arena-layout { grid-template-columns:1fr 1.12fr; gap:clamp(50px,7vw,100px); }
  #modes[data-mode-layout=index] .arena-info { grid-column:2; grid-row:1; align-items:flex-start; }
  #modes[data-mode-layout=index] .modes-preview { grid-column:1; grid-row:1; --phone-height:clamp(430px,58vh,530px); }
  #modes[data-mode-layout=index] .game-phone { left:50%; transform:translateX(-50%) rotate(4deg); }
  #modes[data-mode-layout=index] .game-phone[data-position=next] { transform:translateX(-84%) translateY(18px) rotate(-14deg) scale(.86); opacity:.32; filter:brightness(.5) saturate(.55); }
  #modes[data-mode-layout=index] .arena-select { grid-template-columns:1fr; gap:0; border-top:1px solid var(--line); }
  #modes[data-mode-layout=index] .arena-select button { display:grid; grid-template-columns:30px minmax(0,1fr) 22px; gap:7px 20px; min-height:103px; padding:20px 18px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:none; text-align:left; justify-items:start; box-shadow:none; }
  #modes[data-mode-layout=index] .arena-select button:hover { transform:none; background:#ffffff04; }
  #modes[data-mode-layout=index] .arena-select button[aria-pressed=true] { background:linear-gradient(90deg,#8a34452e,transparent); box-shadow:inset 2px 0 var(--red); }
  #modes[data-mode-layout=index] .mode-card-index { position:static; grid-column:1; grid-row:1/3; align-self:center; }
  #modes[data-mode-layout=index] .mode-card-name { grid-column:2; grid-row:1; font-size:29px; }
  #modes[data-mode-layout=index] [aria-pressed=true] .mode-card-name { color:var(--yellow); }
  #modes[data-mode-layout=index] .mode-card-description { grid-column:2; grid-row:2; max-width:370px; font-size:12px; }
  #modes[data-mode-layout=index] .mode-card-arrow { position:static; grid-column:3; grid-row:1/3; align-self:center; }
  #modes[data-mode-layout=index] .arena-cta { align-self:flex-start; }
}
