body{background:#bfd3dc url('/arena-theme/arena-enhanced.jpg') center top / 100% auto fixed no-repeat;min-height:100vh}
header.public-header{background:rgba(248,246,239,.94);border-bottom:1px solid #ffffff66}
.public-event{background:rgba(255,254,249,.96);box-shadow:0 8px 28px #0003}
.instagram-home{background:rgba(248,246,239,.94);border-radius:16px;margin-bottom:28px;box-shadow:0 10px 32px #0003}
.public-event~.instagram-home{margin-top:16px;padding-top:20px}
footer{background:rgba(248,246,239,.96)}
@media(max-width:800px){.instagram-home{width:90%;padding:16px;border-radius:12px}.public-event~.instagram-home{margin-top:12px;padding-top:16px}.instagram-feed-heading h2{font-size:28px}.instagram-hero{box-shadow:none}}

@media(max-width:800px){body{background-position:center top;background-size:100% auto}}

/* Show the full portrait arena on desktop without stretching it across the screen. */
@media(min-width:801px){body{background-color:#343631;background-size:cover;background-position:center center}}

/* Pan from the arena ceiling to the ring as the page scrolls. */
body{background-position:center var(--arena-progress,0%)}
@media(prefers-reduced-motion:reduce){body{background-attachment:scroll;background-position:center top}}

/* Navy button treatment for the local arena preview. */
.button,button,.primary,.membership-actions .button,.membership-actions .free-membership-button{background:#142b50;color:#fff;border-color:#142b50}
.button:hover,button:hover,.primary:hover,.membership-actions .button:hover{background:#203e6b;color:#fff;border-color:#203e6b}
.free-membership-button:before{background:#142b50}
.free-membership-button{background:linear-gradient(#142b50,#142b50) padding-box,conic-gradient(from var(--membership-border-angle),#57e987,#f6e95f,#ffad66,#d177ef,#7785ff,#20bfff,#29d4c0,#57e987) border-box!important;color:#fff!important}

/* Balance the event artwork and membership controls on phones. */
@media(max-width:600px){
 .public-event{gap:12px;padding:12px}
 .public-event>img{flex-basis:112px;width:112px;max-width:112px;height:144px;background:transparent}
 .public-event h2{font-size:16px}
 .public-event-details{font-size:12px}
 .public-event .public-event-schedule{font-size:11px}
 .instagram-intro .home-trial-offer{padding:12px}
 .membership-actions .free-membership-button{min-height:0;padding:12px 10px;font-size:17px;line-height:1.2;gap:5px}
 .membership-actions .free-membership-button span{font-size:10px;line-height:1.3}
 .membership-account-actions .button{min-height:42px;padding:9px 12px;font-size:16px;border-radius:10px}
 .home-trial-offer>.membership-actions:first-child{margin-bottom:12px}
}

/* Preserve the full lead Instagram image at every screen size. */
.instagram-hero{aspect-ratio:auto;height:auto;align-self:start}
.instagram-hero img{display:block;width:100%;height:auto;object-fit:contain}

/* Keep membership button copy in three deliberate rows. */
@media(max-width:760px){
 .membership-actions .free-membership-button{font-size:clamp(11px,3.4vw,19px);padding:12px 6px;white-space:nowrap;overflow-wrap:normal}
 .membership-actions .free-membership-button span{font-size:clamp(7px,2.05vw,11px);white-space:nowrap;max-width:none}
 .membership-actions .free-membership-button .trial-claimed-count{font-size:12px}
}

/* Keep the arena inside a viewport layer so no page scroll exposes its edges. */
body{background:#343631;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:#343631 url('/arena-theme/arena-enhanced.jpg') center var(--arena-progress,0%) / cover no-repeat}
@media(prefers-reduced-motion:reduce){body::before{background-position:center center}}
/* Move a composited image layer instead of repainting its background each frame. */
body::before{bottom:auto;height:var(--arena-height,100lvh);background-position:center top;background-size:100% 100%;transform:translate3d(0,var(--arena-y,0px),0);will-change:transform}

@media(min-width:761px){.membership-actions .free-membership-button{font-size:22px;white-space:normal;overflow-wrap:anywhere;padding:18px 14px}.membership-actions .free-membership-button span{font-size:12px;white-space:normal;max-width:100%}}

/* Every page needs an opaque reading surface over the detailed arena art. */
#app>main#content{background:var(--paper);color:var(--ink);border-radius:16px;margin-top:16px;margin-bottom:24px;box-shadow:0 8px 28px #0003}
#app>main.admin-shell{background:var(--paper)}
header,header.public-header,footer,.public-event{background:var(--paper)}
#app>main.instagram-home{background:var(--paper)}
@media(max-width:800px){#app>main#content{width:90%;border-radius:12px;margin-top:12px}}

/* Keep ticking digits from wrapping or changing the mobile ad height. */
@media(max-width:600px){
 .public-event [data-public-countdown]{display:block;white-space:nowrap;overflow-wrap:normal;font-variant-numeric:tabular-nums;min-height:1.3em;margin-top:3px;font-size:16px;line-height:1.3}
}