/* Mobile layout, isolated from desktop and CMS visibility settings. */
@media(max-width:1050px){
  html{overflow-x:clip}
  body .hero-match-rank{min-width:0;padding:12px 8px;overflow-wrap:anywhere}
  body .hero-match-rank strong{font-size:24px}
  body .nav,body .nav.scrolled,body.subpage .nav:not(.scrolled){height:68px}
  body .nav .nav-inner{height:100%;grid-template-columns:minmax(0,1fr) auto auto;gap:12px}
  body .nav .nav-side{grid-column:2;grid-row:1;gap:6px}
  body .nav .menu-toggle{grid-column:3;grid-row:1;width:44px;height:44px;display:block}
  body .nav .nav-links{display:none}
  body .mobile-menu{top:68px;max-height:calc(100dvh - 68px);overflow-y:auto;overscroll-behavior:contain;padding:12px var(--pad) calc(24px + env(safe-area-inset-bottom));background:#090909}
  body .mobile-menu a{min-height:44px;line-height:1.5}
  body .mobile-menu .mobile-nav-sub{padding-left:14px;border-left:1px solid var(--line);margin-bottom:12px}
  body .mobile-menu .mobile-nav-sub a{font-size:13px!important;padding:10px 8px;color:var(--muted)}
}
@media(max-width:720px){
  :root{--pad:18px}
  html{scroll-padding-top:84px}
  body .nav .brand-symbol{width:32px;height:32px;flex-basis:32px}
  body .nav .brand{gap:8px}
  body .nav .brand-wordmark{width:66px}
  body .subpage,body main{min-width:0}
  body.subpage .page-hero{min-height:0;padding:100px 0 28px}
  body.subpage .page-hero h1{font-size:clamp(34px,10vw,44px)!important;line-height:1.08;letter-spacing:-.04em;overflow-wrap:anywhere}
  body.subpage .page-hero p{font-size:14px!important;line-height:1.75;max-width:100%;margin-top:16px;word-break:keep-all;overflow-wrap:anywhere}
  body .breadcrumb{margin-bottom:16px;font-size:10px}
  body .section-head{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:24px}
  body .section-title{font-size:clamp(28px,8vw,38px)!important;line-height:1.15}
  body .section-copy{max-width:100%;font-size:14px!important;line-height:1.75;word-break:keep-all;overflow-wrap:anywhere}
  body .page-section{padding-block:32px}
  body .filter-bar,body .team-switch{max-width:100%;gap:8px;flex-wrap:wrap}
  body .filter,body .team-switch button{min-height:44px;white-space:normal}
  body .roster-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  body .roster-card{min-width:0}
  body .roster-card .portrait{height:auto;min-height:0;width:100%;max-width:100%;aspect-ratio:3/4}
  body .roster-card .card-body{padding:14px 10px}
  body .roster-card .card-body h3{font-size:clamp(17px,5vw,22px)!important;overflow-wrap:anywhere}
  body .roster-links{gap:6px;flex-wrap:wrap}
  body .roster-links a.social-icon{width:36px;height:36px}
  body .team-e .te-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:none}
  body .team-e .te-poster{height:clamp(240px,72vw,340px)}
  body .team-e .te-caption{padding:36px 12px 18px}
  body .team-e .te-caption strong{font-size:clamp(20px,6vw,28px);overflow-wrap:anywhere}
  body .team-e .te-dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);overflow-y:auto}
  body .team-c .tc-toolbar{flex-wrap:wrap;gap:12px}
  body .team-c .tc-art{min-height:280px}
  body .team-c .tc-story{padding:22px 18px}
  body .team-b .tb-social,body .team-e .te-social{flex-wrap:wrap}
  body .news-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  body .news-grid .news-card{grid-column:auto;min-width:0}
  body .news-grid .news-card h3{font-size:20px;line-height:1.5}
  body .board-table{table-layout:fixed}
  body .board-table .col-pin{width:36px}
  body .board-table .col-date{width:82px;font-size:11px}
  body .board-table th,body .board-table td{padding:14px 8px}
  body .board-table .col-title{overflow-wrap:anywhere}
  body .board-table .col-title a{font-size:14px;line-height:1.6}
  body .about-manifesto,body .value-grid,body .ci-grid,body .contents-page-grid{grid-template-columns:minmax(0,1fr)}
  body .about-statement,body .ci-card{padding:24px}
  body .battle-title,body .battle-meta{flex-wrap:wrap;gap:12px}
  body .battle-title h2{font-size:28px;overflow-wrap:anywhere}
  body .battle-schedule-card footer{flex-wrap:wrap;gap:10px}
  body input:not([type=checkbox]):not([type=radio]):not([type=range]),body textarea,body select{font-size:16px}
  body .btn{min-height:44px;white-space:normal;text-align:center}
  body .footer-top{gap:24px 16px}
  body .footer-col a{padding-block:7px;margin:0;min-height:40px}
  body .footer-bottom{gap:16px;line-height:1.7}
  body .hero-video-editorial.hero-video-size-half{height:auto;min-height:580px}
  body .hero-video-editorial .hero-title{font-size:clamp(40px,13vw,64px)}
  body .hero-video-editorial .hero-video-description{font-size:14px;line-height:1.7;max-width:calc(100vw - 36px);margin-inline:auto;overflow-wrap:anywhere}
  body .hero-video-editorial .hero-actions{flex-wrap:wrap;gap:10px}
}
@media(max-width:360px){
  body .roster-grid,body .team-e .te-grid,body .team-e .te-group--staff .te-grid{grid-template-columns:minmax(0,1fr)}
  body .roster-card .portrait{max-height:340px}
}

@media(max-width:720px){
  body .pub-cal-layout{grid-template-columns:minmax(0,1fr)}
  body .pub-cal-panel,body .pub-cal-side{min-width:0;width:100%;padding:12px}
  body .pub-cal-head,body .pub-cal-side-head{flex-wrap:wrap}
  body .pub-cal-nav{flex-wrap:wrap}
}

@media(max-width:720px){
  html{overflow-x:clip}
  body .hero-match-rank{min-width:0;padding:12px 8px;overflow-wrap:anywhere}
  body .hero-match-rank strong{font-size:24px}
}

@media(min-width:721px) and (max-width:1050px){
  body .hero-match-center{grid-template-columns:minmax(0,1fr)}
  body .hero-match-panel{grid-template-columns:90px minmax(0,1fr) 110px}
  body .hero-match-extra{display:none}
}

/* Mobile hero: content first, match information follows in normal flow. */
@media(max-width:720px){
  body .hero-video-editorial,body .hero-video-editorial.hero-video-size-half{position:relative;display:block;height:auto;min-height:0;max-height:none}
  body .hero-video-editorial .hero-video-editorial-inner{position:relative!important;display:block;height:auto;min-height:0;padding:0}
  body .hero-video-editorial .hero-video-editorial-copy{height:auto;min-height:0;padding:100px 18px 28px;overflow:visible}
  body .hero-video-editorial .hero-video-lockup{width:100%;max-height:none;padding:0;gap:0;transform:none!important}
  body .hero-video-editorial .hero-title.hero-title--motion{position:relative;top:auto;left:auto;margin:0 auto 16px!important;transform:none;font-size:clamp(40px,12vw,58px)}
  body .hero-video-editorial .hero-title--wordmark .hero-title-wordmark{width:clamp(150px,46vw,190px);max-width:100%;height:auto}
  body .hero-video-editorial .hero-title--wordmark.hero-title--motion .hero-title-line:nth-child(2){margin-top:6px}
  body .hero-video-editorial .hero-video-calligraphy{position:relative;left:auto;top:auto;width:76%;max-width:280px;margin:0 auto 20px!important;transform:none}
  body .hero-video-editorial .hero-video-calligraphy img{width:100%;height:auto;max-height:72px;object-fit:contain}
  body .hero-video-editorial .hero-video-caption{position:relative;left:auto;top:auto;bottom:auto;width:100%;margin:0;padding:0;transform:none!important}
  body .hero-video-editorial .hero-video-description{max-width:100%;font-size:13px;line-height:1.65}
  body .hero-video-editorial .hero-video-description p{margin:0 0 12px}
  body .hero-video-editorial .hero-actions{display:flex!important;position:relative;margin-top:20px;justify-content:center;gap:10px;opacity:1;visibility:visible}
  body .hero-video-editorial .hero-actions .btn{display:inline-flex;min-height:44px;padding:12px 16px;font-size:13px}
  body .hero-video-editorial .hero-bottom{position:relative;inset:auto;transform:none;width:100%;margin:0}
  body .hero-match-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  body .hero-match-tab{padding:12px 10px;min-height:44px}
  body .hero-match-panel{grid-template-columns:64px minmax(0,1fr);min-height:0}
  body .hero-match-rank{padding:14px 6px}
  body .hero-match-rank small{font-size:8px!important;letter-spacing:0;white-space:nowrap}
  body .hero-match-main{padding:14px 12px;min-width:0}
  body .hero-match-main small{font-size:11px!important;line-height:1.5}
  body .hero-match-main b{font-size:14px!important;line-height:1.5;white-space:normal}
  body .hero-match-main > span{font-size:10px!important}
  body .hero-match-link{grid-column:1/-1;min-height:44px;padding:10px 16px;border-top:1px solid var(--line);white-space:nowrap;display:flex;justify-content:space-between;align-items:center}
  body .hero-standing-list{grid-column:1/-1;border-top:1px solid var(--line)}
}
