/* ADIMASTER RELEASE 182
   Desktop-only identity, editorial HUD and transmission-deck refinement.
   The mobile experience, globe, hero and persistent player are untouched. */

@media (min-width: 761px) {
  /* The transparent AM artwork and its original airplane are separate assets. */
  body[data-route="artist"] .artistStoryIntroR76 .r162IdentityEmblem > i {
    position: absolute !important;
    z-index: 6 !important;
    top: 16% !important;
    right: 17% !important;
    bottom: auto !important;
    left: auto !important;
    width: clamp(13px, .88vw, 17px) !important;
    height: clamp(13px, .88vw, 17px) !important;
    display: block !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: url("../gateway/am-plane.webp") center / contain no-repeat !important;
    box-shadow: none !important;
    filter: drop-shadow(0 0 4px rgba(80, 232, 247, .57)) !important;
    pointer-events: none !important;
  }

  /* Keep mobile wording untouched while finishing desktop localization. */
  html[data-artist-lang="pl"] body[data-route="artist"] .r162DeckHeading > .r162DeckSector,
  html[data-artist-lang="de"] body[data-route="artist"] .r162DeckHeading > .r162DeckSector {
    font-size: 0 !important;
  }

  html[data-artist-lang="pl"] body[data-route="artist"] .r162DeckHeading > .r162DeckSector::after,
  html[data-artist-lang="de"] body[data-route="artist"] .r162DeckHeading > .r162DeckSector::after {
    content: "SEKTOR 02" !important;
    display: inline-block !important;
    color: rgba(149, 192, 226, .84) !important;
    font-size: 10px !important;
    font-weight: 820 !important;
    line-height: 1.2 !important;
    letter-spacing: .13em !important;
  }

  /* Structural gradients stay on edges; narrative copy remains unboxed. */
  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] {
    min-height: 373px !important;
    padding: 30px 31px 72px !important;
    border-color: rgba(var(--r176-channel), .42) !important;
    background:
      linear-gradient(90deg, rgba(var(--r176-channel), .29), transparent 69%) 29px 61px / min(138px, 35%) 1px no-repeat,
      linear-gradient(270deg, rgba(var(--r176-channel), .25), transparent 79%) calc(100% - 24px) calc(100% - 34px) / min(132px, 37%) 1px no-repeat,
      radial-gradient(214px 144px at 95% 4%, rgba(var(--r176-channel), .095), transparent 76%),
      radial-gradient(300px 142px at 4% 100%, rgba(var(--r176-channel), .055), transparent 79%),
      linear-gradient(147deg, rgba(5, 16, 29, .985), rgba(4, 10, 21, .991) 61%, rgba(8, 8, 23, .984)) !important;
    box-shadow:
      inset 0 0 0 1px rgba(var(--r176-channel), .062),
      inset 0 15px 30px rgba(var(--r176-channel), .026),
      0 14px 34px rgba(0, 0, 0, .22) !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > .artistStoryKickerR75 {
    margin-bottom: 11px !important;
    font-size: 9px !important;
    font-weight: 740 !important;
    letter-spacing: .19em !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > h3 {
    margin: 0 78px 15px 0 !important;
    font-size: clamp(29px, 1.94vw, 37px) !important;
    font-weight: 780 !important;
    line-height: 1.05 !important;
    letter-spacing: -.028em !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > p[data-r76-i18n] {
    position: relative !important;
    z-index: 4 !important;
    max-width: none !important;
    font-size: clamp(12.35px, .725vw, 13.75px) !important;
    font-weight: 415 !important;
    line-height: 1.59 !important;
    letter-spacing: .011em !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > p[data-r76-i18n]:nth-of-type(1) {
    margin: 0 !important;
    padding: 1px 0 0 11px !important;
    border: 0 !important;
    background: none !important;
    color: rgba(222, 234, 243, .91) !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > p[data-r76-i18n]:nth-of-type(1)::before {
    content: "" !important;
    position: absolute !important;
    top: 4px !important;
    bottom: 3px !important;
    left: 0 !important;
    width: 1px !important;
    background: linear-gradient(180deg, rgba(var(--r176-channel), .68), rgba(var(--r176-channel), .16) 66%, transparent) !important;
    box-shadow: 0 0 5px rgba(var(--r176-channel), .17) !important;
    pointer-events: none !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > p[data-r76-i18n]:nth-of-type(1)::first-line {
    color: rgba(235, 243, 250, .96) !important;
    font-weight: 550 !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > p[data-r76-i18n]:nth-of-type(2) {
    margin: 12px 0 0 !important;
    padding: 12px 0 0 11px !important;
    border: 0 !important;
    background:
      linear-gradient(90deg, rgba(var(--r176-channel), .39), rgba(var(--r176-channel), .11) 54%, transparent 91%) top left / 100% 1px no-repeat !important;
    color: rgba(180, 199, 215, .92) !important;
    font-size: clamp(11.85px, .68vw, 12.9px) !important;
    font-weight: 415 !important;
    line-height: 1.54 !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > p[data-r76-i18n]:nth-of-type(2)::before {
    content: "" !important;
    position: absolute !important;
    top: 13px !important;
    bottom: 2px !important;
    left: 0 !important;
    width: 1px !important;
    background: linear-gradient(180deg, rgba(var(--r176-channel), .31), transparent 81%) !important;
    pointer-events: none !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > .r162ModuleSigil {
    top: 23px !important;
    right: 25px !important;
    width: 60px !important;
    height: 60px !important;
    background:
      radial-gradient(circle at 38% 32%, rgba(var(--r176-channel), .16), transparent 58%),
      rgba(4, 12, 24, .83) !important;
    box-shadow:
      inset 0 0 15px rgba(var(--r176-channel), .085),
      0 0 15px rgba(var(--r176-channel), .12) !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > .r176DomainDepth > i {
    height: 67px !important;
    opacity: .69 !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > .r166DomainTelemetry {
    right: 31px !important;
    bottom: 39px !important;
    left: 31px !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] > .r162ModuleSignal {
    right: 29px !important;
    bottom: 17px !important;
    left: 31px !important;
  }

  /* A quieter rail and an editorial caption surface complete each artwork. */
  body[data-route="artist"] .artistIntelligenceR49 {
    min-height: 332px !important;
    grid-template-rows: 31px 248px !important;
  }

  body[data-route="artist"] .artistStats .statCard,
  body[data-route="artist"] .artistStats .statCard:hover {
    min-height: 248px !important;
  }

  body[data-route="artist"] #artistRail {
    height: 248px !important;
    min-height: 248px !important;
    flex-basis: 248px !important;
    padding-bottom: 4px !important;
    scrollbar-color: rgba(112, 199, 229, .34) transparent !important;
    scrollbar-width: thin !important;
  }

  body[data-route="artist"] #artistRail::-webkit-scrollbar {
    display: block !important;
    height: 3px !important;
  }

  body[data-route="artist"] #artistRail::-webkit-scrollbar-track {
    border-radius: 10px !important;
    background: rgba(39, 89, 123, .15) !important;
  }

  body[data-route="artist"] #artistRail::-webkit-scrollbar-thumb {
    border-radius: 10px !important;
    background:
      linear-gradient(90deg, rgba(107, 218, 242, .45), rgba(143, 157, 243, .34), rgba(180, 119, 229, .42)) !important;
  }

  body[data-route="artist"] #artistRail > .card,
  body[data-route="artist"] #artistRail > .card:hover {
    height: 243px !important;
    min-height: 243px !important;
    max-height: 243px !important;
    border-color: rgba(108, 199, 235, .33) !important;
    background:
      linear-gradient(270deg, rgba(163, 119, 240, .40), transparent 77%) calc(100% - 11px) calc(100% - 1px) / 71% 1px no-repeat,
      radial-gradient(155px 100px at 5% 0%, rgba(56, 145, 193, .10), transparent 76%),
      linear-gradient(158deg, rgba(7, 19, 33, .989), rgba(4, 10, 20, .991) 77%) !important;
  }

  body[data-route="artist"] #artistRail .cover {
    height: 153px !important;
    min-height: 153px !important;
    max-height: 153px !important;
    flex-basis: 153px !important;
    border-bottom: 1px solid rgba(104, 200, 234, .33) !important;
  }

  body[data-route="artist"] #artistRail .cover img {
    filter: saturate(1.09) contrast(1.045) brightness(1.035) !important;
  }

  body[data-route="artist"] #artistRail .cardBody {
    min-height: 0 !important;
    padding: 8px 10px 7px !important;
    gap: 4px !important;
    background: linear-gradient(180deg, rgba(60, 120, 162, .072), transparent 43px) !important;
  }

  body[data-route="artist"] #artistRail .cardTitle {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: rgba(235, 245, 251, .97) !important;
    font-size: clamp(11.4px, .72vw, 13px) !important;
    font-weight: 720 !important;
    line-height: 1.23 !important;
    letter-spacing: .003em !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body[data-route="artist"] #artistRail .cardSub {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: rgba(164, 185, 199, .88) !important;
    font-size: clamp(8.25px, .51vw, 9.45px) !important;
    line-height: 1.30 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  body[data-route="artist"] #artistRail .metaRow {
    margin-top: 2px !important;
    padding-top: 0 !important;
  }

  body[data-route="artist"] #artistRail .chip {
    padding: 2px 6px !important;
    font-size: 8px !important;
  }
}

@media (min-width: 971px) and (max-width: 1250px) {
  body[data-route="artist"] .artistStoryModuleR76[data-r76-step="01"],
  body[data-route="artist"] .artistStoryModuleR76[data-r76-step="02"] {
    min-height: 362px !important;
    padding: 29px 28px 69px !important;
  }

  body[data-route="artist"] .artistStoryModuleR76[data-r76-step="03"] {
    min-height: 304px !important;
    padding: 29px 31px 67px !important;
  }

  body[data-route="artist"] .artistIntelligenceR49 {
    min-height: 319px !important;
    grid-template-rows: 30px 234px !important;
  }

  body[data-route="artist"] .artistStats .statCard,
  body[data-route="artist"] .artistStats .statCard:hover {
    min-height: 234px !important;
  }

  body[data-route="artist"] #artistRail {
    height: 234px !important;
    min-height: 234px !important;
    flex-basis: 234px !important;
  }

  body[data-route="artist"] #artistRail > .card,
  body[data-route="artist"] #artistRail > .card:hover {
    height: 229px !important;
    min-height: 229px !important;
    max-height: 229px !important;
  }

  body[data-route="artist"] #artistRail .cover {
    height: 142px !important;
    min-height: 142px !important;
    max-height: 142px !important;
    flex-basis: 142px !important;
  }
}

@media (min-width: 761px) and (max-width: 970px) {
  body[data-route="artist"] .artistStoryModuleR76[data-r76-step] {
    min-height: 303px !important;
    padding: 28px 29px 66px !important;
  }

  body[data-route="artist"] .artistIntelligenceR49 {
    min-height: 489px !important;
    grid-template-rows: 30px 175px minmax(229px, auto) !important;
  }

  body[data-route="artist"] .artistStats .statCard,
  body[data-route="artist"] .artistStats .statCard:hover {
    min-height: 175px !important;
  }

  body[data-route="artist"] #artistRail {
    height: 218px !important;
    min-height: 218px !important;
    flex-basis: 218px !important;
  }

  body[data-route="artist"] #artistRail > .card,
  body[data-route="artist"] #artistRail > .card:hover {
    height: 213px !important;
    min-height: 213px !important;
    max-height: 213px !important;
  }

  body[data-route="artist"] #artistRail .cover {
    height: 132px !important;
    min-height: 132px !important;
    max-height: 132px !important;
    flex-basis: 132px !important;
  }
}
