/* AMPOL ARENA V12.5 — real mobile layout + safe match controls */
.arena-danger-zone,
.arena-delete-match {
    display: grid;
    align-items: center;
    gap: 14px;
    border: 1px solid color-mix(in srgb, #ef4444 28%, var(--theme-line));
    border-radius: 18px;
    background: color-mix(in srgb, #ef4444 6%, var(--theme-panel-soft));
    padding: 16px;
}
.arena-danger-zone { grid-template-columns: minmax(0, 1.4fr) minmax(220px, .8fr) auto; }
.arena-delete-match { grid-template-columns: minmax(0, 1fr) auto; }
.arena-danger-zone b,
.arena-delete-match b { display: block; color: color-mix(in srgb, #fb7185 82%, var(--theme-text)); font-size: 12px; }
.arena-danger-zone p,
.arena-delete-match span { display: block; margin-top: 5px; color: var(--theme-muted); font-size: 9px; line-height: 1.8; }
.arena-danger-zone .btn-danger,
.arena-delete-match .btn-danger { min-height: 44px; white-space: nowrap; }

@media (max-width: 700px) {
    .arena-page { overflow: clip; padding-bottom: max(82px, env(safe-area-inset-bottom)); }
    .arena-shell { width: calc(100% - 24px); }
    .arena-section { padding-block: 34px; }
    .arena-kicker { gap: 7px; font-size: 8px; letter-spacing: .12em; }
    .arena-kicker::before { width: 24px; }
    .arena-title { font-size: clamp(1.75rem, 9vw, 2.35rem); line-height: 1.16; }
    .arena-copy { font-size: .76rem; line-height: 1.85; }
    .arena-hero--featured,
    .arena-hero--experience { min-height: auto; padding: 22px 0 28px; }
    .arena-hero--featured .arena-hero__copy,
    .arena-hero--experience .arena-hero__copy { padding: 16px; border-radius: 22px; background: color-mix(in srgb, var(--theme-panel) 88%, transparent); backdrop-filter: blur(14px); }
    .arena-hero__picture img { object-position: center top; }
    .arena-hero__fighters { inset-inline-end: -34%; bottom: 0; width: 115vw; opacity: .18; }
    .arena-hero__badges { gap: 6px; margin-bottom: 14px; }
    .arena-chip { min-height: 25px; padding: 4px 8px; font-size: 8px; }
    .arena-countdown { gap: 5px; margin-top: 18px; }
    .arena-countdown span { min-height: 58px; border-radius: 13px; }
    .arena-countdown b { font-size: 16px; }
    .arena-countdown small { font-size: 7px; letter-spacing: 0; }
    .arena-hero__actions { grid-template-columns: 1fr; margin-top: 18px; }
    .arena-hero__actions .arena-btn,
    .arena-btn { width: 100%; min-height: 46px; border-radius: 14px; font-size: 11px; }
    .arena-quicknav { top: 56px; margin-inline: -12px; padding: 6px 12px; }
    .arena-quicknav nav { scroll-padding-inline: 12px; scroll-snap-type: x proximity; border-radius: 0; border-inline: 0; padding: 7px 12px; }
    .arena-quicknav a { min-height: 38px; display: inline-flex; align-items: center; padding: 7px 11px; font-size: 9px; scroll-snap-align: center; }
    .arena-section-heading { gap: 12px; }
    .arena-section-heading h2 { font-size: 1.45rem; }
    .arena-section-heading .arena-copy { margin-top: 6px; }
    .arena-section-heading > span { align-self: flex-start; }
    .arena-tabs { width: 100%; scroll-snap-type: x mandatory; scroll-padding-inline: 8px; padding: 6px; }
    .arena-tab { min-height: 40px; display: inline-flex; align-items: center; scroll-snap-align: center; padding: 8px 12px; font-size: 10px; }
    .arena-stat-grid,
    .arena-admin-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .arena-stat,
    .arena-admin-metric { min-width: 0; padding: 13px; border-radius: 16px; }
    .arena-stat small,
    .arena-admin-metric small { font-size: 8px; }
    .arena-stat b,
    .arena-admin-metric b { margin-top: 6px; font-size: 15px; overflow-wrap: anywhere; }
    .arena-grid,
    .arena-team-grid,
    .arena-team-grid--rosters,
    .arena-killer-board { grid-template-columns: 1fr; gap: 12px; }
    .arena-card,
    .arena-panel,
    .arena-admin-console { border-radius: 20px; }
    .arena-card__media { aspect-ratio: 16 / 9.5; }
    .arena-card__body { padding: 15px; }
    .arena-card h3 { font-size: 16px; }
    .arena-card p { font-size: 10px; line-height: 1.8; }
    .arena-panel__head,
    .arena-admin-console__head { align-items: flex-start; flex-direction: column; padding: 14px; }
    .arena-panel__head h2,
    .arena-admin-console__head h2 { font-size: 1rem; }
    .arena-panel__body,
    .arena-admin-console__body { padding: 13px; }
    .arena-team-card--expand > summary { grid-template-columns: 52px minmax(0, 1fr) 28px; gap: 10px; padding: 12px; }
    .arena-team-card--expand .arena-team-logo { width: 52px; border-radius: 16px; }
    .arena-team-card--expand h3 { font-size: 12px; }
    .arena-match,
    .arena-match--duel { grid-template-columns: 1fr 66px 1fr; gap: 6px; padding: 11px 7px; text-align: center; }
    .arena-match__team,
    .arena-match__team:last-child { min-width: 0; justify-content: center; font-size: 9px; overflow-wrap: anywhere; }
    .arena-match__score { min-width: 0; order: initial; }
    .arena-match__score b { font-size: 15px; }
    .arena-match__score small,
    .arena-match__score time { font-size: 7px; }
    .arena-duel-team .arena-match__logo { width: 48px; }
    .arena-match-vs > div { width: 50px; font-size: 18px; }
    .arena-match-vs > b { font-size: 14px; }
    .arena-match-killers { grid-template-columns: 1fr; gap: 6px; }
    .arena-match-killers > span { grid-column: auto; }
    .arena-match-killers > div { grid-template-columns: 26px minmax(0, 1fr) auto; }
    .arena-live-stage { padding: 16px; border-radius: 20px; }
    .arena-live-stage h3 { font-size: 1.25rem; }
    .arena-standing-wrap,
    .arena-table-scroll { margin-inline: -13px; overflow-x: auto; padding-inline: 13px; overscroll-behavior-inline: contain; }
    .arena-standing { min-width: 620px; }
    .arena-standing th,
    .arena-standing td { padding: 11px 9px; font-size: 10px; white-space: nowrap; }
    .arena-bracket { margin-inline: -13px; padding: 6px 13px 20px; gap: 12px; scroll-snap-type: x mandatory; overscroll-behavior-inline: contain; }
    .arena-bracket__round { min-width: min(82vw, 290px); gap: 11px; }
    .arena-bracket__game { padding: 11px; border-radius: 15px; }
    .arena-bracket__game::after { display: none; }
    .arena-form-grid,
    .arena-choice-grid { grid-template-columns: 1fr; gap: 11px; }
    .arena-field--wide { grid-column: auto; }
    .arena-field > span { font-size: 10px; }
    .arena-field input,
    .arena-field select,
    .arena-field textarea { min-height: 46px; padding: 11px 12px !important; border-radius: 13px !important; font-size: 12px !important; }
    .arena-field textarea { min-height: 105px; }
    .arena-player-row,
    .arena-roster-row { grid-template-columns: 32px minmax(0, 1fr); align-items: start; padding: 10px; }
    .arena-player-row .arena-field,
    .arena-player-row .arena-field:nth-last-child(-n+2),
    .arena-roster-row .arena-field,
    .arena-roster-row .arena-field:nth-of-type(3) { grid-column: 2; }
    .arena-player-slot { width: 32px; border-radius: 10px; }
    .arena-protest-grid { grid-template-columns: 1fr; }
    .arena-protest-guide { padding: 16px; }
    .arena-live-launch { padding: 10px; }
    .arena-live-launch__card { max-height: calc(100dvh - 20px); overflow-y: auto; border-radius: 24px; }
    .arena-live-launch__caster { margin-top: 22px; }
    .arena-live-launch__versus { padding: 12px 4px; }
    .arena-broadcast-dock { margin-top: -18px; }
    .arena-broadcast-dock__card { grid-template-columns: auto minmax(0, 1fr); gap: 10px; border-radius: 18px; }
    .arena-broadcast-beacon { min-width: 56px; }
    .arena-broadcast-dock__caster { min-width: 0; }
    .arena-broadcast-dock__match,
    .arena-broadcast-dock__card > .arena-watch-live { grid-column: 1 / -1; }
    .arena-broadcast-dock__card > .arena-watch-live { width: 100%; }
    .arena-commentator-admin-grid { grid-template-columns: 1fr; }
    .arena-broadcast-console { padding: 16px; border-radius: 20px; }
    .arena-broadcast-console__head { align-items: flex-start; }
    .arena-broadcast-console__signal { display: none; }
    .arena-broadcast-stats { grid-template-columns: repeat(2, 1fr); }
    .arena-broadcast-match__summary { grid-template-columns: 1fr; }
    .arena-broadcast-match__caster { justify-self: start; }
    .ampol-admin-ui [data-arena-tabs] > .arena-tabs { position: sticky; z-index: 25; top: 58px; margin-inline: -12px; width: calc(100% + 24px); border-radius: 0; border-inline: 0; background: color-mix(in srgb, var(--theme-panel-strong) 94%, transparent); backdrop-filter: blur(18px); }
    .ampol-admin-ui .arena-schedule-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
    .ampol-admin-ui .arena-schedule-strip > div { padding: 10px; border-radius: 13px; }
    .ampol-admin-ui .arena-admin-team-card,
    .ampol-admin-ui .arena-admin-match-card { padding: 10px; border-radius: 17px; }
    .ampol-admin-ui .arena-admin-match-card > .arena-match { grid-template-columns: 1fr 62px 1fr; }
    .ampol-admin-ui .arena-player-stat-editor { padding: 10px; }
    .ampol-admin-ui .arena-player-stat-row { grid-template-columns: 1fr 1fr; padding: 9px; }
    .ampol-admin-ui .arena-player-stat-name { grid-column: 1 / -1; }
    .ampol-admin-ui .arena-player-stat-row .ampol-check-option { grid-column: 1 / -1; }
    .ampol-admin-ui .arena-secret { padding: 12px; }
    .ampol-admin-ui .arena-secret__value { min-width: 0; font-size: 12px; }
    .ampol-admin-ui .arena-pass-history > div { align-items: flex-start; flex-direction: column; }
    .ampol-admin-ui .arena-pass-history form,
    .ampol-admin-ui .arena-pass-history button { width: 100%; }
    .arena-danger-zone,
    .arena-delete-match { grid-template-columns: 1fr; padding: 13px; }
    .arena-danger-zone .btn-danger,
    .arena-delete-match .btn-danger { width: 100%; }
}

@media (max-width: 390px) {
    .arena-shell { width: calc(100% - 18px); }
    .arena-title { font-size: 1.7rem; }
    .arena-countdown span { min-height: 54px; }
    .arena-match,
    .arena-match--duel { grid-template-columns: 1fr 54px 1fr; }
    .arena-match-vs > div { width: 44px; }
    .arena-duel-team .arena-match__logo { width: 42px; }
    .arena-team-card--expand > summary { grid-template-columns: 46px minmax(0, 1fr) 26px; }
    .arena-team-card--expand .arena-team-logo { width: 46px; }
}