/* Release discovery: variance 8 / motion 6 / density 4.
   Public components use native CSS and progressive JavaScript enhancement. */
:root {
  --f-display: "Space Grotesk", system-ui, sans-serif;
  --f-body: "Public Sans", system-ui, sans-serif;
  --f-mono: "JetBrains Mono", monospace;
}
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.rr-main-pad { padding-top: 26px; }
.rr-header { background: rgb(246 248 247 / 96%); }
.rr-logo-symbol { border-radius: 10px 10px 10px 3px; }
.rr-search-link kbd { font: 500 10px var(--f-body); margin-left: 20px; padding: 3px 5px; border: 1px solid #ffffff50; border-radius: 4px; }
.discovery-hero { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); align-items: center; gap: 55px; padding: 22px 0 45px; }
.discovery-copy { padding-bottom: 24px; }
.discovery-copy h1 { margin: 0; max-width: 12ch; font: 700 clamp(54px, 6.7vw, 94px)/.99 var(--f-display); letter-spacing: -.072em; }
.discovery-copy h1 em { display: block; font-style: normal; color: var(--brand); }
.discovery-copy .home-eyebrow { margin-bottom: 26px; }
.discovery-copy .home-lead { max-width: 36ch; margin: 25px 0 28px; font-size: 17px; }
.discovery-copy .home-search-field { box-shadow: 0 8px 30px #18382a08; }
.discovery-calendar-link { display: inline-flex; align-items: center; gap: 22px; margin-top: 24px; color: var(--text-2); font-size: 12px; font-weight: 600; text-decoration: none; }
.discovery-calendar-link:hover { color: var(--brand); }
.discovery-calendar-link span { font-size: 21px; transition: transform .2s; }
.discovery-calendar-link:hover span { transform: translate(3px,3px); }
.discovery-hero.no-feature { display: block; padding: 40px 0 70px; }
.discovery-hero.no-feature .discovery-copy { max-width: 720px; }
.spotlight { min-width: 0; }
.spotlight-stage { position: relative; height: 390px; isolation: isolate; }
.spotlight-stage::before { content: ""; position: absolute; inset: 40px 2% 18px; border-radius: 50%; background: radial-gradient(ellipse, #d5e8dd 0%, #e9f1ec 52%, transparent 72%); z-index: -1; }
.spotlight-poster { position: absolute; top: 9px; left: 50%; width: 245px; height: 350px; border-radius: 14px; overflow: hidden; transform-origin: center 80%; box-shadow: 0 20px 36px -16px #15362570; transition: transform .65s cubic-bezier(.2,.75,.2,1), opacity .5s, filter .5s; }
.spotlight-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.spotlight-poster.is-active { transform: translateX(-50%) rotate(-3deg); z-index: 3; }
.spotlight-poster.is-active:hover { transform: translateX(-50%) translateY(-7px) rotate(0deg); }
.spotlight-poster.is-next { transform: translateX(-10%) translateY(14px) rotate(13deg) scale(.82); z-index: 1; filter: saturate(.65); opacity: .72; pointer-events: none; }
.spotlight-poster.is-previous { transform: translateX(-92%) translateY(12px) rotate(-16deg) scale(.82); z-index: 2; filter: saturate(.65); opacity: .72; pointer-events: none; }
.spotlight-caption-wrap { display: flex; gap: 16px; align-items: center; min-height: 92px; padding: 0 12px; }
.spotlight-caption { flex: 1; min-width: 0; }
.spotlight-meta { display: flex; gap: 9px; font-size: 11px; font-weight: 600; color: var(--brand); margin-bottom: 8px; }
.spotlight-meta span { color: var(--border-strong); }
.spotlight-caption a { color: var(--text); text-decoration: none; font: 700 clamp(20px, 2vw, 27px)/1.12 var(--f-display); letter-spacing: -.045em; display: flex; align-items: center; gap: 12px; }
.spotlight-caption a span { font-size: 22px; font-weight: 400; }
.spotlight-controls { display: flex; gap: 5px; }
.spotlight-controls button { width: 38px; height: 38px; border: 1px solid var(--border); border-radius: 50%; background: transparent; color: var(--text); cursor: pointer; transition: background .2s, transform .2s; }
.spotlight-controls button:hover { background: #e0ebe5; transform: translateY(-2px); }
.spotlight-selector { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); margin: 20px 12px 0; gap: 10px; }
.spotlight-selector button { display: flex; align-items: center; gap: 9px; padding: 12px 0; border: 0; border-top: 2px solid var(--border); color: var(--text-3); background: transparent; text-align: left; font: 500 10px var(--f-body); cursor: pointer; transition: border-color .25s, color .25s; }
.spotlight-selector button[aria-pressed="true"] { border-color: var(--brand); color: var(--brand); }
.spotlight-selector button > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.spotlight-index { font: 500 10px var(--f-mono); }
.discovery-worlds { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border: 1px solid var(--border); border-radius: 14px; margin: 10px 0 74px; background: var(--surface); overflow: hidden; }
.discovery-worlds a { display: flex; align-items: center; justify-content: space-between; padding: 23px 26px; color: var(--text); text-decoration: none; font: 600 17px var(--f-display); letter-spacing: -.03em; transition: background .25s, color .25s; }
.discovery-worlds a + a { border-left: 1px solid var(--border); }
.discovery-worlds a > span:last-child { color: var(--brand); font-size: 21px; transition: transform .25s; }
.discovery-worlds a:hover { background: #e7f0eb; color: var(--brand); }
.discovery-worlds a:hover > span:last-child { transform: translate(3px,-3px); }
.release-shelf { padding-bottom: 70px; }
.shelf-heading { display: flex; justify-content: space-between; align-items: end; gap: 22px; margin-bottom: 28px; }
.shelf-period { color: var(--text-3); font-size: 12px; margin: 0 0 10px; }
.shelf-heading h2 { margin: 0; font: 700 clamp(30px,3.5vw,44px)/1.05 var(--f-display); letter-spacing: -.055em; }
.shelf-filters { display: flex; gap: 4px; flex-wrap: wrap; padding-bottom: 2px; }
.shelf-filters button { border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--text-3); padding: 10px 12px; font: 600 12px var(--f-body); cursor: pointer; transition: background .2s, color .2s; }
.shelf-filters button[aria-pressed="true"] { background: var(--brand); color: white; }
.shelf-filters button:hover:not([aria-pressed="true"]) { background: var(--surface-2); }
.release-shelf-grid { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 20px; }
.release-tile { min-width: 0; }
.release-art { display: block; position: relative; overflow: hidden; aspect-ratio: 2/3; border-radius: 12px; background: var(--surface-2); transition: transform .4s, box-shadow .4s; }
.release-art img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .65s cubic-bezier(.2,.7,.2,1); }
.release-art-arrow { position: absolute; bottom: 14px; right: 14px; width: 34px; height: 34px; display: grid; place-items: center; background: white; border-radius: 50%; color: var(--brand); opacity: 0; transform: translateY(8px); transition: opacity .25s, transform .25s; }
.release-art:hover { transform: translateY(-5px); box-shadow: 0 20px 25px -20px #18382a99; }
.release-art:hover img { transform: scale(1.035); }
.release-art:hover .release-art-arrow, .release-art:focus-visible .release-art-arrow { opacity: 1; transform: none; }
.release-tile-meta { display: flex; flex-direction: column; gap: 4px; margin: 15px 0 9px; font-size: 10px; color: var(--text-3); }
.release-tile-meta span:first-child { color: var(--brand); font-weight: 600; }
.release-tile h3 { margin: 0; font: 600 16px/1.3 var(--f-display); letter-spacing: -.025em; }
.release-tile h3 a { text-decoration: none; color: var(--text); }
.quick-look-trigger { display: flex; gap: 18px; align-items: center; padding: 11px 0 4px; border: 0; background: transparent; color: var(--text-3); font: 500 11px var(--f-body); cursor: pointer; }
.quick-look-trigger span { font-size: 18px; color: var(--brand); }
.quick-look-trigger:hover { color: var(--brand); }
.shelf-empty { padding: 35px; border: 1px dashed var(--border-strong); border-radius: 12px; color: var(--text-2); }
#release-calendar { scroll-margin-top: 95px; }
.home-views .rr-h1 { letter-spacing: -.055em; }
.rr.dialog-open { overflow: hidden; }
.release-preview, .search-dialog { border: 1px solid var(--border); border-radius: 22px; padding: 0; background: var(--bg); color: var(--text); box-shadow: 0 35px 110px #0c271a40; max-height: min(88dvh,900px); overflow: auto; }
.release-preview { width: min(780px,calc(100% - 32px)); max-width: 780px; }
dialog::backdrop { background: #10271dd0; backdrop-filter: blur(9px); }
dialog[open] { animation: dialog-enter .3s cubic-bezier(.2,.7,.2,1) both; }
@keyframes dialog-enter { from { opacity: 0; transform: translateY(18px) scale(.98); } }
.dialog-close { position: absolute; top: 16px; right: 16px; z-index: 2; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--border); background: var(--surface); color: var(--text); font: 400 26px/1 var(--f-body); cursor: pointer; }
.dialog-close:hover { background: var(--surface-2); }
.release-preview-layout { display: grid; grid-template-columns: .85fr 1.15fr; }
.release-preview-cover { width: 100%; height: 100%; min-height: 440px; object-fit: cover; background: var(--surface-2); }
.release-preview-copy { padding: 58px 32px 34px; }
.release-preview-copy h2 { margin: 0; font: 700 clamp(27px,3vw,40px)/1.05 var(--f-display); letter-spacing: -.05em; }
.release-preview-copy .home-eyebrow { font-size: 10px; margin-bottom: 16px; }
.preview-date { color: var(--brand); font-size: 13px; font-weight: 600; margin: 18px 0; }
.preview-description { font-size: 14px; line-height: 1.65; color: var(--text-2); margin: 0 0 25px; }
.rr .preview-primary { background: var(--brand); color: #fff; border-color: var(--brand); gap: 22px; }
.rr .preview-primary:hover { background: #104a35; color: #fff; }
.preview-calendar { display: block; color: var(--text-2); font-size: 12px; margin-top: 18px; text-underline-offset: 4px; }
.search-dialog { width: min(690px,calc(100% - 32px)); max-width: 690px; padding: 30px; }
.search-dialog-heading h2 { font: 600 27px var(--f-display); letter-spacing: -.04em; margin: 0 0 22px; }
.command-search { width: 100%; max-width: none !important; }
.rr-search.command-search input { min-width: 0; padding: 14px; font-size: 16px; border: 0; box-shadow: none; background: transparent; }
.rr-search.command-search .live { position: static; margin-top: 12px; max-height: 45dvh; overflow-y: auto; box-shadow: none; }
.search-dialog-footer { display: flex; gap: 8px; align-items: center; color: var(--text-3); font-size: 10px; margin-top: 22px; }
.search-dialog-footer > span:first-child { margin-right: auto; }
.search-dialog-footer kbd { padding: 3px 5px; border: 1px solid var(--border); border-radius: 4px; font-size: 9px; }
@media (min-width: 861px) and (max-width: 1100px) { .rr-search-link { display: block; } .rr-search-link kbd { display: none; } }
@media (max-width: 1000px) {
  .discovery-hero { gap: 25px; }
  .discovery-copy h1 { font-size: clamp(50px,7vw,75px); }
  .spotlight-poster { width: 200px; height: 300px; }
  .spotlight-stage { height: 330px; }
  .release-shelf-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px 20px; }
  .shelf-heading { align-items: start; flex-direction: column; }
}
@media (max-width: 720px) {
  .discovery-hero { display: flex; flex-direction: column; align-items: stretch; gap: 25px; padding-top: 15px; }
  .discovery-copy { padding-bottom: 0; }
  .discovery-copy h1 { max-width: 13ch; font-size: clamp(53px,10vw,76px); }
  .discovery-copy .home-lead { max-width: 40ch; font-size: 16px; margin: 21px 0 25px; }
  .discovery-copy .home-eyebrow { margin-bottom: 20px; }
  .spotlight { padding: 0 5px; }
  .spotlight-stage { height: clamp(280px,78vw,340px); }
  .spotlight-poster { width: min(210px,42vw); height: auto; aspect-ratio: 21/31; }
  .spotlight-caption-wrap { min-height: 76px; padding: 0; }
  .spotlight-selector { margin: 15px 0 0; }
  .discovery-worlds { grid-template-columns: repeat(2,minmax(0,1fr)); margin-bottom: 50px; }
  .discovery-worlds a { padding: 19px 18px; font-size: 16px; }
  .discovery-worlds a:nth-child(3) { border-left: 0; }
  .discovery-worlds a:nth-child(n+3) { border-top: 1px solid var(--border); }
  .release-shelf-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px 15px; }
  .shelf-filters { gap: 1px; }
  .shelf-filters button { padding: 10px; font-size: 11px; }
  .release-preview-layout { grid-template-columns: 1fr; }
  .release-preview-cover { height: 240px; min-height: 0; object-position: center 25%; }
  .release-preview-copy { padding: 28px 24px; }
  .search-dialog { padding: 26px 18px 18px; }
  .search-dialog-footer > span:first-child { max-width: 27ch; line-height: 1.5; }
}
@media (prefers-reduced-transparency: reduce) { .rr-header { background: var(--bg); } dialog::backdrop { backdrop-filter: none; } }
@media (prefers-reduced-motion: reduce) { .spotlight-poster, .release-art, .release-art img, .discovery-worlds a { transition: none; } dialog[open] { animation: none; } }