/* Homepage refinements; phone-only additions remain below the existing rules. */
html body#alienme-homepage .top-feature .feature-card .feature-right > .release-actions {
  gap: 14px !important;
  margin: 30px 0 0 !important;
}
html body#alienme-homepage .top-feature .feature-card .feature-right > .release-actions a.btn-secondary[href] {
  border: 1px solid #fff !important;
  background: #000 !important;
  background-image: none !important;
  color: #fff !important;
  opacity: 1 !important;
}
html body#alienme-homepage .top-feature .feature-card .feature-right > .release-platform-icons.am-stream-group {
  --am-home-stream-size: 44px;
  display: grid !important;
  grid-template-columns: repeat(6,var(--am-home-stream-size)) !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  text-align: center !important;
  transform: none !important;
  translate: none !important;
}
html body#alienme-homepage .top-feature .feature-card .feature-right > .release-platform-icons::before,
html body#alienme-homepage .top-feature .feature-card .feature-right > .release-platform-icons::after {
  display: none !important;
  content: none !important;
}
html body#alienme-homepage .top-feature .feature-card .release-platform-icons .am-stream-group__label {
  grid-column: 1 / -1 !important;
  position: static !important;
  margin: 0 !important;
  color: #fff !important;
  font: 400 14px/20px Inter,Arial,sans-serif !important;
}
html body#alienme-homepage .top-feature .feature-card .release-platform-icons :is(a,button).am-stream-platform {
  position: static !important;
  inset: auto !important;
  width: var(--am-home-stream-size) !important;
  min-width: var(--am-home-stream-size) !important;
  max-width: var(--am-home-stream-size) !important;
  height: var(--am-home-stream-size) !important;
  min-height: var(--am-home-stream-size) !important;
  max-height: var(--am-home-stream-size) !important;
  margin: 0 !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  border: 1px solid #fff !important;
  border-radius: 50% !important;
  background: #000 !important;
  background-image: none !important;
  color: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  translate: none !important;
  box-shadow: none !important;
}
html body#alienme-homepage .top-feature .feature-card .release-platform-icons .am-stream-platform svg {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  fill: currentColor !important;
}
html body#alienme-homepage .top-feature .feature-card .release-platform-icons .am-stream-platform:not([disabled]):is(:hover,:focus-visible),
html body#alienme-homepage .top-feature .feature-card .release-actions a:is(:hover,:focus-visible) {
  box-shadow: 0 0 0 1px #fff,0 0 14px rgba(255,255,255,.28) !important;
}
@media (min-width: 1121px) {
  /* Use the hero's full 1280px content width; retain the existing hero itself. */
  html body#alienme-homepage main#home-content,
  html body#alienme-homepage .ticker-wrap {
    width: 100% !important;
    max-width: 1280px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
  html body#alienme-homepage .updates-ticker {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
  /* Preserve the established desktop panel height after controls leave the flow. */
  html body#alienme-homepage .top-feature .feature-card {
    min-height: 452px !important;
  }
  /* The artwork's copy ends at 59% of its height. Anchor controls below it. */
  html body#alienme-homepage .top-feature .feature-card .feature-release-layout {
    position: static !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right {
    position: absolute !important;
    inset: 0 8% 0 47% !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    transform: none !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right > .release-actions {
    position: absolute !important;
    inset: 62.5% 0 auto !important;
    width: 100% !important;
    margin: 0 !important;
    flex-wrap: nowrap !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right > .release-actions a.btn-secondary[href] {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 10px 8px !important;
    font-size: clamp(9px,.82vw,12px) !important;
    white-space: nowrap !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right > .release-platform-icons.am-stream-group {
    --am-home-stream-size: clamp(36px,3.15vw,40px);
    position: absolute !important;
    inset: 75% 0 auto !important;
    width: 100% !important;
    margin: 0 !important;
  }
  html body#alienme-homepage #explore-all-link.home-explore-cta {
    justify-content: space-between !important;
    gap: 24px !important;
  }
  html body#alienme-homepage #explore-all-link.home-explore-cta .home-explore-intro {
    flex: 0 1 auto !important;
    max-width: none !important;
    white-space: nowrap !important;
  }
}
@media (max-width: 1120px) {
  /* Use the same charcoal welcome artwork as desktop, without the old overlay. */
  html body#alienme-homepage .top-feature > .panel.welcome::before {
    content: none !important;
    display: none !important;
    background: none !important;
  }
  html body#alienme-homepage .top-feature > .panel.welcome > .welcome-artwork {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    margin: 0 0 14px !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  html body#alienme-homepage .top-feature > .panel.welcome .welcome-artwork img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
  }
  html body#alienme-homepage .top-feature > .panel.welcome .welcome-subscribe-form {
    transform: none !important;
    translate: none !important;
  }
  html body#alienme-homepage .top-feature > .panel.welcome .welcome-social-circles {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-items: center !important;
    width: 100% !important;
    max-width: none !important;
    gap: 0 !important;
    margin: 18px 0 0 !important;
    padding: 0 !important;
    transform: none !important;
    translate: none !important;
  }
  html body#alienme-homepage .top-feature > .panel.welcome .welcome-social-circles > .social-circle {
    position: static !important;
    inset: auto !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 0 !important;
    margin: 0 !important;
    transform: none !important;
    translate: none !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right > .release-actions {
    position: static !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: none !important;
    gap: 8px !important;
    margin: 18px 0 0 !important;
    transform: none !important;
    translate: none !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right > .release-actions a.btn-secondary[href] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 10px 4px !important;
    font-size: clamp(10px, 2.9vw, 12px) !important;
    letter-spacing: .04em !important;
    white-space: nowrap !important;
    transform: none !important;
    translate: none !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right > .release-platform-icons.am-stream-group {
    position: static !important;
    inset: auto !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-items: center !important;
    width: 100% !important;
    column-gap: 4px !important;
    row-gap: 8px !important;
    margin: 18px 0 0 !important;
  }
  html body#alienme-homepage .top-feature .feature-card .release-platform-icons .am-stream-group__label {
    width: 100% !important;
    text-align: center !important;
  }
  html body#alienme-homepage .top-feature .feature-card .release-platform-icons :is(a,button).am-stream-platform {
    width: min(44px, 100%) !important;
    min-width: 0 !important;
    max-width: 44px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 1 / 1 !important;
    display: grid !important;
    place-items: center !important;
    padding: 5px !important;
  }
  html body#alienme-homepage .top-feature .feature-card .release-platform-icons .am-stream-platform > span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
}

/* Newly added phone content stays out of the established desktop layout. */
html body#alienme-homepage .home-release-description-mobile,
html body#alienme-homepage .home-mobile-products {
  display: none !important;
}

@media (max-width: 700px) {
  /* Match the hero's outside edges; keep breathing room inside each panel. */
  html body#alienme-homepage main#home-content.wrap,
  html body#alienme-homepage .ticker-wrap {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
  html body#alienme-homepage .updates-ticker {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
    box-sizing: border-box !important;
  }
  html body#alienme-homepage .top-feature {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
  }
  html body#alienme-homepage .top-feature > .panel.welcome,
  html body#alienme-homepage .top-feature > .feature-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 18px max(18px, env(safe-area-inset-right)) 18px max(18px, env(safe-area-inset-left)) !important;
    box-sizing: border-box !important;
    background: #0e0e12 !important;
    border: 1px solid #2c2c32 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  html body#alienme-homepage .top-feature > .panel.welcome { order: 0 !important; }
  html body#alienme-homepage .top-feature > .feature-card { order: 1 !important; }

  /* Cover and release details share a compact header; controls span below. */
  html body#alienme-homepage .top-feature .feature-card .feature-release-layout--exact {
    display: grid !important;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.3fr) !important;
    grid-template-areas: "cover label" "cover title" "cover copy" "actions actions" "platforms platforms" !important;
    grid-template-rows: min-content min-content minmax(0, 1fr) auto auto !important;
    gap: 8px 16px !important;
    align-items: start !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-left {
    grid-area: cover !important;
    width: 100% !important;
    padding: 0 !important;
  }
  html body#alienme-homepage .top-feature .feature-card .cover-wrap {
    width: 100% !important;
    max-width: 180px !important;
    height: auto !important;
    aspect-ratio: 2 / 3 !important;
    margin: 0 auto !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right {
    display: contents !important;
    position: static !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-release-label {
    grid-area: label !important;
    margin: 0 !important;
    text-align: left !important;
    font: 600 10px/1.4 Inter, Arial, sans-serif !important;
    letter-spacing: .1em !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-release-title {
    grid-area: title !important;
    margin: 0 !important;
    font: 600 clamp(19px, 5.6vw, 28px)/1.2 Orbitron, Inter, sans-serif !important;
    text-align: left !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
  html body#alienme-homepage .top-feature .feature-card .release-copy {
    grid-area: copy !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }
  html body#alienme-homepage .top-feature .feature-card .release-copy p {
    margin: 0 0 8px !important;
    font: 400 12px/1.5 Inter, Arial, sans-serif !important;
  }
  html body#alienme-homepage .top-feature .feature-card .release-copy p strong { display: block; }
  html body#alienme-homepage .top-feature .feature-card .home-release-description-full { display: none !important; }
  html body#alienme-homepage .top-feature .feature-card .home-release-description-mobile { display: block !important; }
  html body#alienme-homepage .top-feature .feature-card .feature-right > .release-actions {
    grid-area: actions !important;
    margin: 8px 0 0 !important;
  }
  html body#alienme-homepage .top-feature .feature-card .feature-right > .release-platform-icons.am-stream-group {
    grid-area: platforms !important;
    margin: 8px 0 0 !important;
  }

  /* Reflow the collection panel around live copy, products, and existing actions. */
  html body#alienme-homepage #merch,
  html body#alienme-homepage #merch .merch-shopify-embed,
  html body#alienme-homepage #merch .drop-banner {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  html body#alienme-homepage #merch .drop-banner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0 !important;
    background: none !important;
    border: 0 !important;
  }
  html body#alienme-homepage #merch .drop-banner__media { display: none !important; }
  html body#alienme-homepage #merch .drop-banner__panel {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    padding: 24px max(18px, env(safe-area-inset-right)) 24px max(18px, env(safe-area-inset-left)) !important;
    background: radial-gradient(ellipse at 50% 0, rgba(166, 20, 45, .18), transparent 64%), #050506 !important;
    border: 1px solid rgba(194, 36, 64, .65) !important;
    border-radius: 0 !important;
    box-shadow: inset 0 0 20px rgba(175, 15, 38, .1), 0 0 12px rgba(150, 10, 30, .12) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  html body#alienme-homepage #merch .drop-banner__panel::after { display: none !important; }
  html body#alienme-homepage #merch .drop-banner__eyebrow,
  html body#alienme-homepage #merch .drop-banner__title,
  html body#alienme-homepage #merch .drop-banner__meta {
    display: block !important;
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    text-align: center !important;
    color: #f2f2f4 !important;
  }
  html body#alienme-homepage #merch .drop-banner__eyebrow {
    font: 500 9px/1.5 Inter, Arial, sans-serif !important;
    letter-spacing: .12em !important;
  }
  html body#alienme-homepage #merch .home-mobile-store-kicker {
    display: block;
    font: 600 11px/1.5 Inter, Arial, sans-serif;
    letter-spacing: .18em;
    text-transform: uppercase;
  }
  html body#alienme-homepage #merch .home-mobile-store-name {
    display: block;
    margin-top: 4px;
    font: 700 clamp(25px, 7vw, 36px)/1.2 Orbitron, Inter, sans-serif;
    text-transform: uppercase;
    letter-spacing: .02em;
  }
  html body#alienme-homepage #merch .drop-banner__meta {
    max-width: 32ch !important;
    font: 400 13px/1.5 Inter, Arial, sans-serif !important;
    color: #c9c8ce !important;
  }
  html body#alienme-homepage #merch .home-mobile-products:not([hidden]) {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
  html body#alienme-homepage #merch .home-mobile-products__track {
    display: flex;
    gap: 12px;
    width: 100%;
    min-width: 0;
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding: 3px 0;
  }
  html body#alienme-homepage #merch .home-mobile-products__track::-webkit-scrollbar { display: none; }
  html body#alienme-homepage #merch .home-mobile-product {
    flex: 0 0 84%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    scroll-snap-align: start;
    color: #fff;
    text-decoration: none;
    background: none;
    border: 0;
    box-shadow: none;
  }
  html body#alienme-homepage #merch .home-mobile-product img {
    display: block;
    width: 100%;
    height: clamp(140px, 43vw, 190px);
    object-fit: contain;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 6px;
    background: #fff;
    box-sizing: border-box;
  }
  html body#alienme-homepage #merch .home-mobile-product__name { font: 600 13px/1.4 Inter, Arial, sans-serif; }
  html body#alienme-homepage #merch .home-mobile-product__hint { font: 400 11px/1.4 Inter, Arial, sans-serif; color: #c9c8ce; }
  /* Keep the next image visible as a swipe cue without fragments of its caption. */
  html body#alienme-homepage #merch .home-mobile-product[data-caption-visible="false"] :is(.home-mobile-product__name, .home-mobile-product__hint) {
    visibility: hidden;
  }
  html body#alienme-homepage #merch .home-mobile-products__controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-top: 6px;
  }
  html body#alienme-homepage #merch .home-mobile-products__arrow {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.5);
    border-radius: 50%;
    background: #101014;
    color: #fff;
    font: 400 25px/1 Arial,sans-serif;
    box-shadow: none;
  }
  html body#alienme-homepage #merch .home-mobile-products__arrow:disabled { opacity: .35; }
  html body#alienme-homepage #merch .home-mobile-products__position { min-width: 40px; text-align: center; color: #d3d1d8; font: 400 12px/1.4 Inter, Arial, sans-serif; }
  html body#alienme-homepage #merch .home-mobile-products__track:focus-visible,
  html body#alienme-homepage #merch .home-mobile-product:focus-visible,
  html body#alienme-homepage #merch .home-mobile-products__arrow:focus-visible { outline: 2px solid #fff; outline-offset: -2px; }
  html body#alienme-homepage #merch .drop-banner__cta,
  html body#alienme-homepage #merch #am-notify-mount.am-notify-inline {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    transform: none !important;
    translate: none !important;
  }
  html body#alienme-homepage #merch .drop-banner__cta { gap: 10px !important; }
  /* Match the hero's solid red primary action, including its dark label. */
  html body#alienme-homepage #merch .drop-banner__cta .btn--primary,
  html body#alienme-homepage #merch .drop-banner__cta .btn--primary:is(:hover, :focus-visible, :active) {
    background: #c83838 !important;
    background-image: none !important;
    color: #000 !important;
    border: none !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .28) !important;
    font-weight: 600 !important;
    letter-spacing: .06em !important;
  }

  /* Restore Explore's original 10px page gutter inside the widened phone page. */
  html body#alienme-homepage #explore-heading {
    margin-left: 10px !important;
    margin-right: 10px !important;
  }
  html body#alienme-homepage #explore-tiles-carousel-wrap {
    width: auto !important;
    margin-left: 42px !important;
    margin-right: 42px !important;
  }
  html body#alienme-homepage #explore-all-link {
    margin-left: 42px !important;
    margin-right: 42px !important;
  }

}


/* Final approved mobile pass, 2026-10-13. */
html body#alienme-homepage .home-release-player { display: contents; }
html body#alienme-homepage .home-release-player__skip { display: none; }
@media (max-width: 700px) {
  html body#alienme-homepage #merch .drop-banner__cta .btn--primary,
  html body#alienme-homepage #merch .drop-banner__cta .btn--primary:is(:hover,:focus-visible,:active) { color: #fff !important; }
  html body#alienme-homepage .hero-cta .cta.primary { border: 1px solid #000 !important; }
  html body#alienme-homepage .top-feature .feature-card .feature-release-label { font-size: 14px !important; font-weight: 700 !important; }
  html body#alienme-homepage #merch-official-store-heading { color: #d16b75 !important; }
  html body#alienme-homepage #merch .drop-banner__eyebrow,
  html body#alienme-homepage #merch .home-mobile-store-kicker { color: #b9b8c1 !important; }
  html body#alienme-homepage #merch .home-mobile-store-name { color: #fff !important; }
  html body#alienme-homepage #merch .drop-banner__meta { color: #c9c8ce !important; }
  html body#alienme-homepage .top-feature .feature-card .release-actions .btn-secondary,
  html body#alienme-homepage .top-feature .feature-card .release-platform-icons :is(a,button).am-stream-platform { border-color: #53535e !important; color: #fff !important; }
  html body#alienme-homepage .top-feature .feature-card .release-actions .btn-secondary:focus-visible,
  html body#alienme-homepage .top-feature .feature-card .release-platform-icons :is(a,button).am-stream-platform:focus-visible { outline: 2px solid #fff !important; outline-offset: 3px; }
  html body#alienme-homepage .updates-ticker :is(.ticker-label,.ticker-text b) { color: #dabdff !important; text-shadow: 0 0 3px #b67aff,0 0 9px #8e41d9 !important; }
  html body#alienme-homepage .updates-ticker .ticker-dot { background: #dabdff !important; box-shadow: 0 0 4px #b67aff,0 0 9px #8e41d9 !important; }
  html body#alienme-homepage .updates-ticker .ticker-bulletin .ticker-text b::before { content: ""; display: inline-block; width: 5px; height: 5px; margin-right: 6px; vertical-align: middle; border-radius: 50%; background: #dabdff; box-shadow: 0 0 4px #b67aff,0 0 9px #8e41d9; }
  html body#alienme-homepage #am-concierge-trigger .am-concierge-icon::after { content: none !important; display: none !important; }
  html body#alienme-homepage .top-feature .feature-card .home-release-player { display: flex !important; grid-area: player !important; position: static !important; width: 100% !important; min-width: 0 !important; min-height: 44px; margin: 0 !important; padding: 0 !important; align-self: center !important; align-items: center; justify-content: space-between; gap: 6px; }
  html body#alienme-homepage .top-feature .feature-card .home-release-player #coverPlayBtn,
  html body#alienme-homepage .top-feature .feature-card .home-release-player .home-release-player__skip { display: inline-flex !important; position: static !important; inset: auto !important; transform: none !important; width: 44px !important; min-width: 44px !important; height: 44px !important; min-height: 44px !important; margin: 0 !important; padding: 0 !important; align-items: center; justify-content: center; border: 1px solid #777781 !important; border-radius: 50% !important; color: #fff !important; background: rgba(0,0,0,.82) !important; font: 18px/1 Arial,sans-serif !important; box-shadow: none !important; cursor: pointer; }
  html body#alienme-homepage .top-feature .feature-card .home-release-player .home-release-player__skip:disabled { opacity: .45 !important; cursor: default; }
  html body#alienme-homepage .home-release-player button:focus-visible { outline: 2px solid #fff !important; outline-offset: 2px; }
}

/* Put phone playback controls in the open column beside the cover. */
@media (max-width: 700px) {
  html body#alienme-homepage .top-feature .feature-card .feature-release-layout--exact {
    grid-template-areas: "cover label" "cover title" "cover copy" "cover player" "actions actions" "platforms platforms" !important;
    grid-template-rows: min-content min-content auto minmax(44px, 1fr) auto auto !important;
  }
}
/* White section lettering with a crisp amber outline; quiet closing invitation. */
@media (max-width: 700px) {
  html body#alienme-homepage #merch-official-store-heading,
  html body#alienme-homepage #explore-heading {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: none !important;
    min-height: 64px !important;
    height: auto !important;
    margin: 20px 10px 16px !important;
    padding: 10px 12px !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #fff !important;
    -webkit-text-stroke: .65px #dda654;
    paint-order: stroke fill;
    text-shadow: none !important;
    font: 700 clamp(18px, 5.4vw, 24px)/1.25 Orbitron, Inter, sans-serif !important;
    letter-spacing: .045em !important;
    text-align: center !important;
    text-transform: uppercase !important;
    overflow-wrap: normal !important;
  }
  @supports not (-webkit-text-stroke: .65px #dda654) {
    html body#alienme-homepage #merch-official-store-heading,
    html body#alienme-homepage #explore-heading { color: #fff !important;
      text-shadow: -1px 0 #dda654, 1px 0 #dda654, 0 -1px #dda654, 0 1px #dda654 !important; }
  }
}
/* Mobile brand cleanup and the approved collection artwork. */
html body#alienme-homepage .home-collection-art { display: none !important; }
@media (max-width: 700px) {
  html body#alienme-homepage header#am-public-header .compact-titlebar__brand::before {
    background-image: url('/assets/branding/alienme-nav-logo-clean-20261013.webp') !important;
    background-size: 104px 26px !important;
    background-position: left center !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
    image-rendering: auto;
  }
  html body#alienme-homepage .top-feature .feature-card .home-release-player #coverPlayBtn {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  html body#alienme-homepage #merch .drop-banner__panel > .home-collection-art {
    display: block !important;
    align-self: stretch !important;
    width: calc(100% + max(18px, env(safe-area-inset-left)) + max(18px, env(safe-area-inset-right))) !important;
    max-width: none !important;
    height: auto !important;
    margin-top: -24px !important;
    margin-left: calc(-1 * max(18px, env(safe-area-inset-left))) !important;
    margin-right: calc(-1 * max(18px, env(safe-area-inset-right))) !important;
    margin-bottom: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    object-fit: contain !important;
  }
  html body#alienme-homepage #merch .drop-banner__panel > .drop-banner__title,
  html body#alienme-homepage #merch .drop-banner__panel > .drop-banner__meta {
    display: none !important;
  }
}
/* Carry the collection landscape into the lower store corners. */
html body#alienme-homepage .home-section-heading__text { display: contents; }
@media (max-width: 700px) {
  html body#alienme-homepage #merch .drop-banner__panel { isolation: isolate; }
  html body#alienme-homepage #merch .drop-banner__panel::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: auto 0 0 !important;
    width: 100% !important;
    height: clamp(80px, 30vw, 150px) !important;
    background: url('/assets/optimized/home/first-contact-terrain-corners-20261013.webp') center bottom / 100% auto no-repeat !important;
    opacity: .55 !important;
    pointer-events: none !important;
    z-index: 0 !important;
    -webkit-mask-image: linear-gradient(to top, #000 0%, #000 65%, transparent 100%);
    mask-image: linear-gradient(to top, #000 0%, #000 65%, transparent 100%);
  }
  html body#alienme-homepage #merch .drop-banner__panel > * { z-index: 1; }
  html body#alienme-homepage #merch-official-store-heading,
  html body#alienme-homepage #explore-heading {
    position: relative !important;
    padding: 12px 22px !important;
    border: 0 !important;
    border-top: 1px solid rgba(207, 151, 75, .35) !important;
    border-bottom: 1px solid rgba(207, 151, 75, .24) !important;
    background: linear-gradient(110deg, rgba(115, 65, 27, .11), #101014 45%, rgba(115, 65, 27, .08)) !important;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
    font-size: clamp(18px, 5.2vw, 23px) !important;
    font-weight: 600 !important;
    letter-spacing: .045em !important;
  }
  html body#alienme-homepage #merch-official-store-heading::before,
  html body#alienme-homepage #explore-heading::before,
  html body#alienme-homepage #merch-official-store-heading::after,
  html body#alienme-homepage #explore-heading::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    width: 24px !important;
    height: 10px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    pointer-events: none !important;
    transform: none !important;
    box-shadow: none !important;
  }
  html body#alienme-homepage #merch-official-store-heading::before,
  html body#alienme-homepage #explore-heading::before {
    top: -1px !important;
    left: 0 !important;
    border-top: 1px solid #bd8c4a !important;
    border-left: 1px solid #bd8c4a !important;
  }
  html body#alienme-homepage #merch-official-store-heading::after,
  html body#alienme-homepage #explore-heading::after {
    bottom: -1px !important;
    right: 0 !important;
    border-bottom: 1px solid #bd8c4a !important;
    border-right: 1px solid #bd8c4a !important;
  }
  html body#alienme-homepage .home-section-heading__text {
    display: block;
    color: #e8e5df;
    -webkit-text-stroke: 0;
    background: linear-gradient(180deg, #fff 5%, #dedcd8 48%, #b8b5b1 55%, #f1ede7 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none;
  }
}