/* Shared progressive accessibility/media rules; preserve the selected theme. */
/* Low specificity lets designed card/hero heights keep their overrides. */
img{height:auto}
html{scroll-padding-bottom:var(--player-height,0px)}
body.has-player{padding-bottom:var(--player-height,140px)}
.public-site :is(button,a,input,select,textarea):focus-visible{scroll-margin-block:20px}
.form-notice[tabindex="-1"]:focus,.notice[tabindex="-1"]:focus{outline:3px solid #f7d88e;outline-offset:4px}
.now-playing>div{min-width:0;flex:1}
.persistent-player button:disabled{opacity:.4;cursor:default}
.persistent-player input[type="range"]{min-height:28px}
.photo-dialog .dialog-close{min-width:44px;min-height:44px}
@media(max-width:600px){.public-form input:not([type="checkbox"]),.public-form textarea,.public-form select,.site-search input,.site-search select{font-size:16px}.persistent-player{grid-template-columns:minmax(0,1fr) 154px 36px}.persistent-player button{min-width:32px;min-height:36px}.transport{gap:7px}}
@media(forced-colors:active){.button,.public-nav .nav-book{border:1px solid ButtonText}.art-placeholder{border:1px solid CanvasText}:focus-visible{outline:3px solid Highlight!important}}

@media(max-width:380px){.persistent-player{grid-template-columns:minmax(0,1fr) 44px}.now-playing{grid-column:1;grid-row:1}.player-controls{grid-column:1/-1;grid-row:2}#player-close{grid-column:2;grid-row:1}.now-playing strong,.now-playing small{max-width:none}.persistent-player button{min-width:44px;min-height:44px}.transport{gap:20px}}

/* Installer authorization is an ordinary checkbox, not a full-width text input. */
.install .checkbox-label{display:flex;align-items:flex-start;gap:12px;line-height:1.6}
.install .checkbox-label input[type="checkbox"]{width:20px;height:20px;min-height:20px;flex:0 0 20px;margin:2px 0 0;padding:0;accent-color:var(--gold)}
@media(max-width:600px){.install input:not([type="checkbox"]),.install select{font-size:16px}}

/* Final launch roster polish: the confirmed band has three members. Let the
   grid fill available space instead of reserving a visually empty fourth slot. */
.member-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1080px}
.member-card{min-width:0}
.member-card>a{display:block;height:100%}
.member-card:focus-within{border-color:var(--gold);box-shadow:0 0 0 2px #efcf8238}
.member-card h3,.member-card p{overflow-wrap:anywhere}
@media(max-width:820px){.member-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}}
@media(max-width:430px){.member-grid{grid-template-columns:1fr}.member-card{max-width:360px;width:100%;margin-inline:auto}.member-card a>div{padding:18px}.member-card h3{font-size:18px}}

/* Final narrow-screen commerce hardening. Keep long product/order text and
   navigation inside the viewport without changing the locked visual system. */
.shop-tools a,.pagination a,.order-reference strong,.order-item>*{min-width:0;overflow-wrap:anywhere}
.shop-tools a{min-height:44px;display:inline-flex;align-items:center}
.order-item{min-width:0}
.checkout-totals div>*{min-width:0}
@media(max-width:600px){
  .shop-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px;width:100%}
  .shop-tools a{padding:11px 0}
  .order-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start}
  .order-item>span{white-space:normal;text-align:right}
  .checkout-totals div{align-items:start}
  .checkout-totals dt,.checkout-totals dd{overflow-wrap:anywhere}
  .summary-total{align-items:flex-start}
}
@media(max-width:380px){
  .shop-tools{grid-template-columns:minmax(0,1fr)}
  .order-item{grid-template-columns:minmax(0,1fr)}
  .order-item>span{text-align:left}
}

/* Extra-small public-shell polish for 360-380px devices. */
@media(max-width:430px){
  .section-heading{flex-wrap:wrap}
  .section-heading>.text-link{white-space:normal;margin-top:0}
  .site-footer nav{gap:14px 18px}
  .site-footer nav a{min-height:44px;display:inline-flex;align-items:center}
}

/* Confirmed-lineup fallback cards use the real names/roles without inventing
   portraits or linking to unpublished member-detail routes. */
.member-card-factual{display:flex;flex-direction:column}
.member-card-factual>div{padding:20px}
.member-card-factual small{display:block;margin-top:10px;color:var(--muted);font-size:10px;letter-spacing:.04em}
@media(max-width:600px){.member-card-factual>div{padding:14px}}
@media(max-width:430px){.member-card-factual>div{padding:18px}}

/* The bundled hero is intentionally small concept artwork. Do not upscale it as
   if it were a production photograph; present it as contained identity art. */
.hero-artwork:has(.fallback-hero){display:flex;align-items:center;justify-content:flex-end;padding:7% 5% 9% 12%;background:radial-gradient(circle at 72% 44%,#1c5f8f55 0,transparent 34%),radial-gradient(circle at 78% 52%,#d6aa4a18 0,transparent 28%)}
.hero-artwork .fallback-hero{width:min(48%,420px);height:auto;max-height:78%;object-fit:contain;object-position:center;filter:drop-shadow(0 18px 42px #000c) saturate(1.08)}
@media(max-width:820px){.hero-artwork:has(.fallback-hero){padding:12% 1% 12% 24%}.hero-artwork .fallback-hero{width:min(58%,340px);max-height:72%}}
@media(max-width:600px){.hero-artwork:has(.fallback-hero){width:100%;right:-18%;padding:14% 0 18% 38%;opacity:.88}.hero-artwork .fallback-hero{width:min(72%,300px);max-height:66%}}