/* Phone-only visual corrections. Desktop and Plan data/rendering stay unchanged. */
@font-face{font-family:"Barlow Condensed Club";src:url('../assets/fonts/barlow-condensed/BarlowCondensed-ExtraBoldItalic.ttf') format('truetype');font-style:italic;font-weight:800;font-display:swap}
@font-face{font-family:"HAT District Display";src:url('../assets/fonts/noto-sans-tc/District-Black.ttf') format('truetype');font-style:normal;font-weight:900;font-display:swap}
.gateway-footer{display:none}
@media(max-width:700px){
 /* Selected concept02: a centered club entrance with paired actions. */
 .gateway.gateway-stadium{padding:20px 22px 16px;gap:18px}
 .gateway-stadium .gateway-brand-logo{width:168px;height:168px;order:0}
 .gateway-stadium .gateway-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:min(430px,100%);margin:auto;padding:18px 0}
 .gateway-stadium .gateway-brand{gap:12px;position:relative;padding-top:0}
 .gateway-stadium .gateway-brand::before{content:"";display:block;position:static;order:1;width:44px;height:3px;flex:none;transform:skewX(-28deg);background:var(--pink);box-shadow:9px 0 0 #ff008d50,-9px 0 0 #ff008d50}
 .gateway-stadium .gateway-kicker{order:2}.gateway-stadium h1{order:3}.gateway-stadium .gateway-subtitle{order:4}.gateway-stadium .location-badges{order:5}
 .gateway-stadium .district-name{font-family:"HAT District Display","Microsoft JhengHei",sans-serif;font-weight:900;font-size:20px;letter-spacing:.08em}
 .gateway-stadium .district-suffix{display:inline}
 .gateway-stadium .gateway-kicker{font-size:16px;font-weight:750;letter-spacing:.09em;line-height:1.45}
 .gateway-stadium h1{font-family:"Barlow Condensed Club","Arial Narrow",sans-serif;font-weight:800;font-style:italic;font-size:clamp(42px,13.7vw,64px);letter-spacing:-.035em;line-height:1.02}
 .gateway-stadium h1 span{margin-left:.07em}
 .gateway-stadium .gateway-subtitle{font-size:15px;letter-spacing:.07em;line-height:1.5}
 .gateway-stadium .location-badges{gap:9px;margin:8px 0 7px;grid-template-columns:repeat(2,minmax(0,1fr))}
 .gateway-stadium .location-badges span{min-height:50px;padding:10px 12px;gap:9px;isolation:isolate;clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);border-color:#c359927a;background:linear-gradient(135deg,#ff008d24,transparent 40%),linear-gradient(0deg,#100914eb,#19131eeb);font-size:19px;font-weight:750;letter-spacing:.08em;text-shadow:none;box-shadow:inset 3px 0 0 var(--pink),inset 0 1px 0 #ffffff12}
 .gateway-stadium .location-badges span::before{content:"📍";display:inline;width:auto;height:auto;flex-shrink:0;background:none;clip-path:none;font-size:16px;line-height:1;filter:none}
 .gateway-stadium .location-badges span::after{left:auto;right:9px;top:8px;bottom:auto;width:13px;height:3px;transform:skewX(-28deg);background:#ff008d;box-shadow:-4px 5px 0 #ff008d55;opacity:.85}
 .gateway-stadium .district-light{display:none}
 .gateway-stadium .entry-button{min-height:66px;gap:8px;padding:14px 15px;font-size:18px;font-weight:800;letter-spacing:.01em}
 .gateway-stadium .entry-button .arrow{flex:0 0 20px;width:20px;height:20px}
 .gateway-stadium .entry-button .ui-arrow{width:20px;height:20px}
 .gateway-stadium .gateway-footer{display:block;margin:0;text-align:center;font-size:10px;font-weight:500;letter-spacing:.08em;line-height:1.6;color:#dbc4d3c9}
 @media(max-height:700px){
  .gateway.gateway-stadium{padding-block:12px;gap:12px}
  .gateway-stadium .gateway-brand-logo{width:150px;height:150px}
  .gateway-stadium .gateway-actions{padding:8px 0}.gateway-stadium .gateway-brand{gap:8px}
  .gateway-stadium .location-badges{margin-block:4px}.gateway-stadium .location-badges span{min-height:46px}
  .gateway-stadium .entry-button{min-height:60px}
 }
 /* Keep the footer branding and copyright beside each other on phones. */
 .footer-row{flex-wrap:nowrap;gap:8px;text-align:left}
 .footer-brand{gap:6px;flex:none}.footer-brand img{width:28px;height:28px}.footer-brand strong{font-size:12px;white-space:nowrap}
 .footer-row>span:last-child{width:auto;min-width:0;font-size:clamp(9.5px,2.8vw,12px);line-height:1.5;text-align:right}
 /* District cards follow their content height, without a reserved empty top. */
 .district-grid .feature-card{min-height:0;padding:18px 14px;justify-content:flex-start}
 .district-grid h3{margin:0 0 12px}.district-grid p{min-height:0}.district-grid p+p{margin-top:14px}
 /* Title and controls share row one; the account link has its own second row. */
 #home-instagram{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}
 #home-instagram .ig-heading{display:contents}
 #home-instagram .ig-heading h2{grid-column:1;grid-row:1;align-self:center;font-size:clamp(17px,4.5vw,20px);line-height:1.3;white-space:nowrap}
 #home-instagram .ig-controls{grid-column:2;grid-row:1;gap:8px;align-self:center;margin:0}
 #home-instagram .ig-heading .ig-link{grid-column:1/-1;grid-row:2;justify-self:start;font-size:15px;line-height:1.5}
 #home-instagram .ig-track,#home-instagram .ig-status{grid-column:1/-1;min-width:0;margin:0}
 #home-page .hero-intro{column-gap:14px;row-gap:16px}
 #home-page .hero-copy h1{align-self:center;font-size:clamp(34px,9.5vw,42px);line-height:1.1}
 #home-page .hero-description{margin:0}
 #home-page .home-kit{width:88%;justify-self:end;transform:translateX(-6px)}
 #home-page .home-kit figcaption{margin-top:8px;line-height:1.4}
 #home-page .hero-copy .cta{margin-top:10px}
 /* An absolute inner disc cannot stretch Safari's auto-height aspect-ratio box. */
 #member-student .member-progress-ring{position:relative;width:min(210px,100%);height:auto;min-height:0;aspect-ratio:1 / 1;padding:0;flex:0 0 auto}
 #member-student .member-progress-ring>.member-progress-center{position:absolute;inset:11px;width:auto;height:auto;min-width:0;min-height:0;padding:10px;gap:6px}
 #member-student .member-progress-count{font-size:40px;line-height:1.05;max-width:100%;text-align:center;white-space:normal;overflow-wrap:anywhere}
 #member-student .member-progress-label{font-size:10px;line-height:1.4;max-width:100%;text-align:center}
 @media(max-width:360px){
  .gateway-stadium .entry-button{padding-inline:12px;font-size:16px}
  #home-instagram.instagram-showcase{padding:14px;gap:8px}
  #home-instagram .ig-heading h2{font-size:15px}
 }
}
