/* hero.v2.css: the /work hero's page stylesheet (the Midnight Atlas stage). GENERATED by scripts/build-work-hero.mjs, without the
   sources' comments: edit the sources, never this file. They are components/backdrop-orbits/tools/work/base.css, midnight-atlas.css, stage.css, stage-midnight-atlas.css.
   It loads after the vendored engine, skin and stage add-on and before hero-examples.vN.css and nav-capsule (last).
   scripts/check-component-drift.mjs fails when it stops matching them. */
.hero > .hero-top, .hero-top > .hero-copy, .hero-top > .hero-show { pointer-events: none; }
.hero-copy > *, .hero-show > * { pointer-events: auto; }
.hero .hero-fig { cursor: pointer; }
.hero .backdrop-orbits {
  --backdrop-orbits-x: calc(var(--backdrop-orbits-paint-anchor-x, 68.6%) + var(--backdrop-orbits-paint-anchor-w, 640px) * .11);
  --backdrop-orbits-y: calc(var(--backdrop-orbits-paint-anchor-y, 45%) - var(--backdrop-orbits-paint-anchor-h, 460px) * .2);
  --backdrop-orbits-r1: calc(var(--backdrop-orbits-paint-anchor-w, 640px) * .45);
  --backdrop-orbits-r2: calc(var(--backdrop-orbits-paint-anchor-w, 640px) * .54);
  --backdrop-orbits-r3: calc(var(--backdrop-orbits-paint-anchor-w, 640px) * .62);
  --backdrop-orbits-tilt: 61.5deg;
  --backdrop-orbits-roll: 19deg;
  --backdrop-orbits-perspective: 2000px;
  --backdrop-orbits-lift: 16px;
  --backdrop-orbits-speed: .55;
  --backdrop-orbits-far: .74;
  --backdrop-orbits-far-ring: .55;
  --backdrop-orbits-inset-top: calc(var(--masthead-h, 64px) + 1px);
}
.hero .backdrop-orbits-veil { background: linear-gradient(90deg, rgb(254 250 243 / .76) 0, rgb(254 250 243 / .76) 40%, rgb(254 250 243 / 0) 49%); }
@media (min-width: 1024px) and (max-height: 800px) {
  .hero .backdrop-orbits {
    --backdrop-orbits-y: calc(var(--backdrop-orbits-paint-anchor-y, 45%) - var(--backdrop-orbits-paint-anchor-h, 460px) * .1);
    --backdrop-orbits-tilt: 65deg;
  }
}
@media (min-width: 641px) and (max-width: 1023px) {
  .hero .backdrop-orbits-veil { background: linear-gradient(rgb(254 250 243 / .72) 0, rgb(254 250 243 / .72) 40%, rgb(254 250 243 / 0) 50%); }
}
@media (max-width: 640px) {
  .hero .backdrop-orbits {
    --backdrop-orbits-front: off;
    --backdrop-orbits-x: calc(100% - 64px);
    --backdrop-orbits-y: 116px;
    --backdrop-orbits-r1: 40px;
    --backdrop-orbits-r2: 58px;
    --backdrop-orbits-r3: 76px;
    --backdrop-orbits-tilt: 62deg;
    --backdrop-orbits-roll: 28deg;
    --backdrop-orbits-perspective: 1100px;
    --backdrop-orbits-lift: 10px;
    --backdrop-orbits-speed: .8;
    --backdrop-orbits-tip-dock: top;
  }
  .hero .hero-copy { --backdrop-orbits-avoid: none; }
  .hero .hero-copy h1 { pointer-events: none; }
  .hero .backdrop-orbits-veil { background: linear-gradient(90deg, rgb(254 250 243 / .7) 0, rgb(254 250 243 / .7) 50%, rgb(254 250 243 / 0) 72%); }
}
@media (max-width: 380px) {
  .hero .backdrop-orbits {
    --backdrop-orbits-x: calc(100% - 50px);
    --backdrop-orbits-y: 104px;
    --backdrop-orbits-r1: 32px;
    --backdrop-orbits-r2: 46px;
    --backdrop-orbits-r3: 60px;
  }
}
.hero {
  color: #EEF0F6;
  background:
    linear-gradient(90deg, #E9C77F00 3%, #E9C77F80 26%, #F3DA9AB8 50%, #E9C77F80 74%, #E9C77F00 97%) 0 6px / 100% 1px no-repeat,
    radial-gradient(62% 104px at 50% 0, #2A3D75B3, #2A3D7500 100%),
    radial-gradient(40% 52% at 72% 46%, #1E2F5E8C, #1E2F5E00 72%),
    linear-gradient(176deg, #0B1634, #0A1430 58%, #081129);
  --backdrop-orbits-midnight-atlas-serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
}
.hero .eyebrow { color: #E9C77F; }
.hero .eyebrow::before { background: #E9C77F; }
.hero-copy h1 { color: #F7F2E6; }
.hero-sub { color: #C9D0E0; }
.hero .btn-amber { box-shadow: 0 12px 30px -12px #F5A83C80, inset 0 1px 0 #FFFFFF66; }
.hero .btn-ghost { color: #F4F1E8; border-color: #E9C77F59; background: #FFFFFF0D; }
.hero .btn-ghost:hover { border-color: #E9C77FC4; background: #FFFFFF17; }
.hero .btn-ghost .i { color: #F2C066; }
.hero-note { color: #B9C2D6; }
.hero-note li::before { background: #E9C77F; }
.hero-cap { color: #C3CADB; }
.sheet .hero a:focus-visible { outline-color: #F3DA9A; }
.hero .hero-next {
  --button-clock-ring: #F3DA9A;
  --button-clock-muted: #FFFFFFD9;
  --button-clock-face-top: #24335F;
  --button-clock-face: #16224A;
  --button-clock-face-bottom: #0F1939;
}
.hero .hero-next .button-clock-face {
  box-shadow: inset 0 1px 0 #FFFFFF33, inset 0 -1px 0 #00000040, 0 0 0 1px #F3DA9A3D, 0 10px 18px -10px #000000A6,
    0 8px 24px -10px #F0A63C85, 0 0 34px -10px #F0A63C4D;
}
.hero .hero-next::before {
  content: ""; position: absolute; inset: -9px -14px -9px -11px; z-index: -1; border-radius: 999px; pointer-events: none;
  background: linear-gradient(180deg, #F3DA9A14, #F3DA9A05 60%, #F3DA9A0D);
  box-shadow: inset 0 0 0 1px #F3DA9A1F;
}
.sheet.scene-curtain {
  --scene-curtain-tab: #0B1532;
  --scene-curtain-tab-mark: #E9C77F;
  --scene-curtain-tab-line: #E9C77F59;
  --scene-curtain-tab-shadow: 0 12px 20px -10px rgba(5, 10, 28, .7);
  --scene-curtain-shadow: 0 36px 70px -22px rgba(6, 12, 32, .5);
}
.hero .hero-hem::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, #7A562000, #7A5620 6%, #E9C77F 24%, #C9A04E 42%, #F3DA9A 58%, #C9A04E 76%, #7A5620 94%, #7A562000);
}
.hero .hx::before { background: radial-gradient(50% 46% at 52% 56%, #F3C77A2E, transparent 72%), radial-gradient(56% 46% at 34% 30%, #6F8FE01F, transparent 72%); }
.hero .hx .b { box-shadow: 0 0 0 1px #F3DA9A2E, 0 .5em 1em -.5em #00000080, 0 2.4em 4.4em -1.6em #000000B3, 0 0 3em -.4em #F0A63C2E; }
.hero .hx .p { box-shadow: 0 0 0 1px #F3DA9A47, -.4em 1.4em 2.4em -1em #000000B3, 0 .3em .6em -.2em #00000080; }
.hero .hx .k { box-shadow: 0 0 0 1px #F3DA9A33, 0 1em 2.2em -.6em #000000A6; }
.hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] {
  --backdrop-orbits-far: .9;
  --backdrop-orbits-midnight-atlas-rose-size: clamp(124px, 19cqh, 172px);
  --backdrop-orbits-midnight-atlas-rose-x: max(84px, 7cqw);
  --backdrop-orbits-midnight-atlas-rose-y: calc(100cqh - var(--backdrop-orbits-midnight-atlas-rose-size) * .5 - 26px);
}
.hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-veil {
  background:
    linear-gradient(90deg, #E9C77F00 3%, #E9C77F80 26%, #F3DA9AB8 50%, #E9C77F80 74%, #E9C77F00 97%) 0 6px / 100% 1px no-repeat,
    radial-gradient(62% 104px at 50% 0, #2A3D75B3, #2A3D7500 100%),
    linear-gradient(0deg, #060D22 0, #060D22B8 26px, #060D2200 112px),
    radial-gradient(max(280px, calc(var(--backdrop-orbits-paint-anchor-w, 620px) * .5)) 50px at var(--backdrop-orbits-paint-anchor-x, 69%) calc(var(--backdrop-orbits-paint-anchor-y, 45%) + var(--backdrop-orbits-paint-anchor-h, 460px) / 2 + 31px),
      #081129C7 0, #0811298C 50%, #08112900 100%),
    radial-gradient(41% 43% at 21% 47%, #081129D6 0, #081129C7 66%, #08112900 100%);
}
html:not(.js) .hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 112px; z-index: 0; pointer-events: none; background: linear-gradient(0deg, #060D22, #060D2200); }
@media (min-width: 641px) and (max-width: 1023px) {
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] { --backdrop-orbits-midnight-atlas-rose: none; }
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-veil {
    background:
      linear-gradient(90deg, #E9C77F00 3%, #E9C77F80 26%, #F3DA9AB8 50%, #E9C77F80 74%, #E9C77F00 97%) 0 6px / 100% 1px no-repeat,
      radial-gradient(70% 84px at 50% 0, #2A3D75A6, #2A3D7500 100%),
      linear-gradient(0deg, #060D22 0, #060D22B8 26px, #060D2200 112px),
      radial-gradient(max(280px, calc(var(--backdrop-orbits-paint-anchor-w, 550px) * .5)) 50px at var(--backdrop-orbits-paint-anchor-x, 50%) calc(var(--backdrop-orbits-paint-anchor-y, 70%) + var(--backdrop-orbits-paint-anchor-h, 400px) / 2 + 31px),
        #081129C7 0, #0811298C 50%, #08112900 100%),
      linear-gradient(#081129CC 0, #081129BF 40%, #08112900 52%);
  }
}
@media (max-width: 640px) {
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] {
    --backdrop-orbits-midnight-atlas-rose: none;
    --backdrop-orbits-midnight-atlas-gem-small: 22px;
    --backdrop-orbits-x: calc(100% - 60px);
    --backdrop-orbits-y: 114px;
    --backdrop-orbits-r1: 42px;
    --backdrop-orbits-r2: 59px;
    --backdrop-orbits-r3: 76px;
    --backdrop-orbits-tilt: 64deg;
  }
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-hub-core { width: 32px; height: 32px; }
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-hub-core svg { width: 12px; height: 12px; }
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-midnight-atlas-rete { width: 56px; height: 56px; }
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-veil {
    background:
      linear-gradient(90deg, #E9C77F00 3%, #E9C77F80 26%, #F3DA9AB8 50%, #E9C77F80 74%, #E9C77F00 97%) 0 6px / 100% 1px no-repeat,
      radial-gradient(70% 84px at 50% 0, #2A3D75A6, #2A3D7500 100%),
      linear-gradient(0deg, #060D22 0, #060D22B8 20px, #060D2200 72px),
      linear-gradient(90deg, #081129C2 0, #081129B3 52%, #08112900 76%);
  }
  .hero-copy h1 { text-shadow: 0 0 1px #070E24, 0 1px 3px #070E24B3; }
}
.hero { --backdrop-orbits-stage-halo: #FFFDF9; --backdrop-orbits-stage-ghost: #FFFFFF; --backdrop-orbits-stage-accent: #F5A83C; }
.hero[data-hero-look="atlas"] { --backdrop-orbits-stage-halo: #F8F3E9; --backdrop-orbits-stage-accent: #B8862F; }
.hero[data-hero-look="gilded-atlas"] { --backdrop-orbits-stage-halo: #F8F2E6; --backdrop-orbits-stage-accent: #B8862F; }
.hero[data-hero-look="orrery"], .hero[data-hero-look="orrery-chart"],
.hero[data-hero-look="engraved-orrery"], .hero[data-hero-look="astrolabe"] { --backdrop-orbits-stage-halo: #FBF6EA; --backdrop-orbits-stage-accent: #F6A62A; }
.hero[data-hero-look="space"] { --backdrop-orbits-stage-halo: #070B20; --backdrop-orbits-stage-ghost: #141A3A; --backdrop-orbits-stage-ink: #F7F3EA; --backdrop-orbits-stage-text: #C6CEE1; --backdrop-orbits-stage-muted: #B3BDD5; }
.hero .backdrop-orbits-veil { display: none !important; }
.hero .hero-copy h1, .hero .hero-sub, .hero .hero-note, .hero .eyebrow {
  text-shadow: 0 0 .5px var(--backdrop-orbits-stage-halo), 0 0 1px var(--backdrop-orbits-stage-halo), 0 0 1.5px var(--backdrop-orbits-stage-halo),
    0 0 2.5px var(--backdrop-orbits-stage-halo), 0 0 4px var(--backdrop-orbits-stage-halo);
}
.hero .eyebrow::before { box-shadow: 0 0 0 2px var(--backdrop-orbits-stage-halo); }
.hero .hero-note li::before { box-shadow: 0 0 0 2px var(--backdrop-orbits-stage-halo); }
.hero .btn-ghost { background: var(--backdrop-orbits-stage-ghost); }
.hero-show { justify-items: center; align-content: center; row-gap: 0; }
.hero .hero-stage {
  --hero-stage-pad: 1.15em;
  --hero-stage-plate-h: 54px;
  --hero-stage-plate-font: 15px;
  --hero-stage-plate-up: .58;
  position: relative; display: grid; justify-items: center; box-sizing: border-box;
  font-size: clamp(6px, min(100cqw / 46 * .78, (100vh - var(--masthead-h)) * .4 / 33), 12.2px);
  padding: calc(var(--hero-stage-plate-h) * (1 - var(--hero-stage-plate-up)) + 5px) var(--hero-stage-pad) var(--hero-stage-pad);
  margin: calc(var(--hero-stage-plate-h) * var(--hero-stage-plate-up)) 0 28px;
}
.hero .hero-stage::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; border-radius: 4px;
  background: color-mix(in srgb, #FFFDF9 86%, transparent);
  box-shadow: inset 0 0 0 1px #10192E26, 0 18px 40px -26px rgb(46 32 10 / .4);
}
.hero .backdrop-orbits-stage-view {
  font-size: 1em;
  --backdrop-orbits-stage-follow: 26deg;
  --backdrop-orbits-stage-lite: follow;
  cursor: pointer;
  line-height: 1.5;
}
@media (max-width: 1023px), (pointer: coarse) {
  .hero .backdrop-orbits-stage-view { --backdrop-orbits-stage-lite: still; }
}
.hero :where(.hero-stage:not(.hero-stage-float)) .hero-stage-plate {
  position: absolute; z-index: 2; left: 50%; top: 0; translate: -50% calc(var(--hero-stage-plate-up) * -100%);
  box-sizing: border-box; width: min(29em, calc(100% - 2.2em)); height: var(--hero-stage-plate-h);
  font-size: var(--hero-stage-plate-font); display: grid; place-items: center; padding: 0 1em; border-radius: 3px;
  background: #FFFFFF; box-shadow: 0 0 0 1px #10192E2E, 0 8px 18px -10px rgb(46 32 10 / .45);
  pointer-events: none;
}
.hero :where(.hero-stage:not(.hero-stage-float)) .backdrop-orbits-stage-caption { margin: 0; max-width: none; width: 100%; height: 100%; display: grid; align-content: center; text-align: center; font-size: 1em; line-height: 1.32; font-variant-numeric: lining-nums; color: var(--backdrop-orbits-stage-text, #3E4A63); }
.hero :where(.hero-stage:not(.hero-stage-float)) .backdrop-orbits-stage-caption-text { display: block; }
.hero :where(.hero-stage:not(.hero-stage-float)) :is(.backdrop-orbits-stage-caption-time, .backdrop-orbits-stage-caption-name) {
  font-size: .74em; letter-spacing: .14em; text-transform: uppercase; line-height: 1.35;
}
.hero :where(.hero-stage:not(.hero-stage-float)) .backdrop-orbits-stage-caption-name { color: var(--backdrop-orbits-stage-ink, #10192E); }
.hero :where(.hero-stage:not(.hero-stage-float)) .backdrop-orbits-stage-caption-name::after { content: none; }
.hero :where(.hero-stage:not(.hero-stage-float)) .backdrop-orbits-stage-caption-line { display: block; margin-top: 1px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero .hero-stage-note {
  position: absolute; z-index: 2; left: 50%; top: 100%; translate: -50% -1px; margin: 0; width: max-content; max-width: calc(100% - 2.4em); padding: 3px 12px 4px; box-sizing: border-box;
  font-size: 11.5px; line-height: 1.35; text-align: center; text-wrap: balance; color: var(--backdrop-orbits-stage-muted, #4A5468);
  background: #FFFFFF; border-radius: 0 0 3px 3px; box-shadow: 0 0 0 1px #10192E1F;
}
.hero .hero-stage-marks { display: none; }
.hero .backdrop-orbits-stage-item .hx { margin: 0; }
.hero :where(.hero-stage:not(.hero-stage-float)) .hero-stage-print-cap { display: none; }
@media print {
  .hero .backdrop-orbits-stage-view > .backdrop-orbits-stage-item { display: none !important; }
  .hero .backdrop-orbits-stage-view > .backdrop-orbits-stage-item:first-child {
    display: grid !important; opacity: 1 !important; visibility: visible !important; transform: none !important; transition: none !important;
    content-visibility: visible !important;
  }
  .hero :where(.hero-stage:not(.hero-stage-float)) .backdrop-orbits-stage-caption-text { display: none !important; }
  .hero :where(.hero-stage:not(.hero-stage-float)) .hero-stage-print-cap { display: block; }
  .hero :where(.hero-stage:not(.hero-stage-float)) :is(.hero-stage-print-time, .hero-stage-print-name) { font-size: .74em; letter-spacing: .14em; text-transform: uppercase; line-height: 1.35; }
  .hero :where(.hero-stage:not(.hero-stage-float)) .hero-stage-print-name { font-weight: 700; }
  .hero :where(.hero-stage:not(.hero-stage-float)) .hero-stage-print-line { display: block; margin-top: 1px; }
}
@media (min-width: 1024px) and (max-height: 700px) {
  .hero .hero-stage { --hero-stage-plate-h: 48px; --hero-stage-plate-font: 14px; }
}
@media (min-width: 1600px) and (min-height: 860px) {
  .hero .hero-stage { font-size: clamp(6px, min(100cqw / 46 * .94, (100vh - var(--masthead-h)) * .44 / 33), 14px); --hero-stage-plate-h: 58px; --hero-stage-plate-font: 16px; }
  .hero .hero-stage-note { font-size: 12.5px; }
}
.hero .backdrop-orbits[data-backdrop-orbits][data-backdrop-skin] {
  --backdrop-orbits-x: var(--backdrop-orbits-paint-anchor-x, 68%);
  --backdrop-orbits-y: calc(var(--backdrop-orbits-paint-anchor-y, 48%) - 30px);
  --backdrop-orbits-r1: calc((var(--backdrop-orbits-paint-anchor-h, 360px) * .5 + 100px) / cos(var(--backdrop-orbits-tilt)));
  --backdrop-orbits-r2: calc(var(--backdrop-orbits-r1) * 1.1);
  --backdrop-orbits-r3: calc(var(--backdrop-orbits-r1) * 1.5);
  --backdrop-orbits-r4: calc(var(--backdrop-orbits-r1) * 2.05);
  --backdrop-orbits-tilt: 44deg;
  --backdrop-orbits-roll: -12deg;
  --backdrop-orbits-perspective: 2200px;
  --backdrop-orbits-lift: 16px;
  --backdrop-orbits-speed: .5;
  --backdrop-orbits-far: .82;
  --backdrop-orbits-far-ring: .7;
  --backdrop-orbits-front: off;
  --backdrop-orbits-inset-top: calc(var(--masthead-h, 64px) + 1px);
}
.hero .hero-copy, .hero .hero-copy > *, .hero .eyebrow, .hero .hero-copy h1, .hero .hero-sub, .hero .hero-cta, .hero .hero-note,
.hero .backdrop-orbits-stage-caption, .hero .hero-stage-note { --backdrop-orbits-avoid: none; }
.backdrop-orbits[data-backdrop-skin="daylight"] .backdrop-orbits-body.is-featured .backdrop-orbits-card {
  filter: none;
  border-color: color-mix(in srgb, var(--backdrop-orbits-daylight-accent) 85%, transparent);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 4px color-mix(in srgb, var(--backdrop-orbits-daylight-accent) 22%, transparent), 0 0 22px 2px color-mix(in srgb, var(--backdrop-orbits-daylight-accent) 40%, transparent), 0 22px 34px -18px rgb(74 46 16 / .6);
}
.backdrop-orbits[data-backdrop-skin="daylight"] .backdrop-orbits-body.is-featured .backdrop-orbits-icon {
  color: #fff; background: radial-gradient(circle at 35% 28%, #FFC874, var(--backdrop-orbits-daylight-ember) 78%);
}
@media (min-width: 1200px) and (max-height: 780px) {
  .hero .backdrop-orbits[data-backdrop-orbits][data-backdrop-skin] { --backdrop-orbits-tilt: 40deg; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  .hero .hero-stage { font-size: clamp(6px, min(100cqw / 46 * .7, (100vh - var(--masthead-h)) * .36 / 33), 12.2px); --hero-stage-plate-font: 14px; --hero-stage-plate-h: 50px; }
  .hero .backdrop-orbits[data-backdrop-orbits][data-backdrop-skin] { --backdrop-orbits-tilt: 36deg; }
  .hero .backdrop-orbits-stage-view { --backdrop-orbits-stage-follow: 288deg; }
}
@media (min-width: 641px) and (max-width: 1023px) {
  .hero .hero-stage { font-size: min(100cqw / 46 * .74, 10px); margin-bottom: 18px; }
  .hero .hero-next { margin-bottom: calc(var(--nav-dock-h, 62px) + 10px + env(safe-area-inset-bottom, 0px) + 16px); }
  .hero .backdrop-orbits-stage-view { --backdrop-orbits-stage-follow: 16deg; }
  .hero .backdrop-orbits[data-backdrop-orbits][data-backdrop-skin] {
    --backdrop-orbits-r1: calc((var(--backdrop-orbits-paint-anchor-h, 330px) * .5 + 105px) / cos(var(--backdrop-orbits-tilt)));
    --backdrop-orbits-tilt: 40deg;
    --backdrop-orbits-y: calc(var(--backdrop-orbits-paint-anchor-y, 70%) - 26px);
  }
}
@media (max-width: 640px), (min-width: 641px) and (max-width: 1023px) and (max-height: 1160px) {
  .hero { grid-template-rows: auto 1fr auto; --hero-stage-room: 48px; }
  .hero::before { content: ""; grid-area: 1 / 1 / 3 / 2; min-height: calc(100svh - var(--masthead-h) - var(--hero-stage-room)); pointer-events: none; }
  .hero > .hero-top { display: contents; }
  .hero .hero-copy { grid-area: 1 / 1; position: relative; z-index: 1; min-width: 0; padding: 24px var(--pad) 0; }
  .hero .hero-next { grid-area: 2 / 1; align-self: start; margin: 22px 0 0; }
  .hero .hero-show { grid-area: 3 / 1; position: relative; z-index: 1; min-width: 0; padding: 0 var(--pad); }
  .hero .hero-stage { margin-top: calc(var(--hero-stage-plate-h) * var(--hero-stage-plate-up) + var(--hero-stage-room)); }
}
@media (min-width: 641px) and (max-width: 1023px) and (max-height: 1160px) {
  .hero .hero-stage { font-size: max(6px, min(100cqw / 46 * .74, 10px, (100svh - var(--masthead-h) - 220px) / 35.3)); }
}
@media (min-width: 641px) and (max-width: 1023px) and (max-height: 1160px) and (orientation: portrait) {
  .hero .backdrop-orbits-stage-view { --backdrop-orbits-stage-follow: 290deg; }
}
@media (max-width: 640px) {
  .hero .hero-copy h1 { font-size: clamp(27px, 7.2vw, 30px); margin: 10px 0 10px; }
  .hero .hero-sub { font-size: 15.5px; line-height: 1.5; }
  .hero .hero-cta { margin-top: 14px; }
  .hero .hero-note { margin-top: 10px; font-size: 12.5px; gap: 4px 16px; }
  .hero { --hero-stage-room: 72px; }
  .hero .hero-copy { padding-top: 12px; }
  .hero .hero-next { margin-top: 18px; }
  .hero .hero-stage {
    font-size: calc(100cqw / 46 * .8);
    --hero-stage-pad: 6px; --hero-stage-plate-h: 58px; --hero-stage-plate-font: 13px; --hero-stage-plate-up: .62;
  }
  .hero :where(.hero-stage:not(.hero-stage-float)) .hero-stage-plate { width: calc(100% + 16px); }
  .hero :where(.hero-stage:not(.hero-stage-float)) .backdrop-orbits-stage-caption-line { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-wrap: balance; }
  .hero .backdrop-orbits-stage-view { --backdrop-orbits-stage-follow: 275deg; }
  .hero .hero-stage:not(.hero-stage-float) .hero-stage-note { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; box-shadow: none; }
  .hero .backdrop-orbits[data-backdrop-orbits][data-backdrop-skin] {
    --backdrop-orbits-x: var(--backdrop-orbits-paint-anchor-x, 50%);
    --backdrop-orbits-y: calc(var(--backdrop-orbits-paint-anchor-y, 70%) - 44px);
    --backdrop-orbits-r1: calc(hypot(var(--backdrop-orbits-paint-anchor-w, 260px) * .5, var(--backdrop-orbits-paint-anchor-h, 190px) * .5) + 30px);
    --backdrop-orbits-r2: calc(var(--backdrop-orbits-r1) * 1.25);
    --backdrop-orbits-r3: calc(var(--backdrop-orbits-r1) * 1.65);
    --backdrop-orbits-r4: calc(var(--backdrop-orbits-r1) * 2.3);
    --backdrop-orbits-tilt: 28deg;
    --backdrop-orbits-body-scale: 1.2;
    --backdrop-orbits-roll: -4deg;
    --backdrop-orbits-perspective: 1300px;
    --backdrop-orbits-lift: 10px;
    --backdrop-orbits-speed: .5;
    --backdrop-orbits-tip-dock: top;
  }
}
.hero .hero-stage.hero-stage-float::before {
  inset: -9% -8%; border: 0; outline: 0; border-radius: 50%; box-shadow: none;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--backdrop-orbits-stage-halo) 60%, transparent) 52%, color-mix(in srgb, var(--backdrop-orbits-stage-halo) 0%, transparent));
}
.hero .hero-stage-float .backdrop-orbits-stage-view { opacity: var(--hero-stage-float-alpha, .86); cursor: zoom-in; }
.hero .hero-stage-float .hero-stage-note {
  translate: -50% 4px; padding: 0; background: none; box-shadow: none; border-radius: 0; max-width: calc(100% - 1em);
  text-shadow: 0 0 .5px var(--backdrop-orbits-stage-halo), 0 0 1px var(--backdrop-orbits-stage-halo), 0 0 1.5px var(--backdrop-orbits-stage-halo),
    0 0 2.5px var(--backdrop-orbits-stage-halo), 0 0 4px var(--backdrop-orbits-stage-halo);
}
@media (prefers-reduced-motion: no-preference) {
  .hero .hero-stage-float .backdrop-orbits-stage-view.is-live:not(.is-still):not(.is-lite) > .backdrop-orbits-stage-item:is(.is-shown, .is-leaving) {
    animation: hero-stage-float-drift 9s ease-in-out infinite alternate;
  }
}
.hero .hero-stage-float .backdrop-orbits-stage-view:is(.is-stopped, .is-zoomed) > .backdrop-orbits-stage-item { animation-play-state: paused !important; }
@keyframes hero-stage-float-drift { from { translate: 0 0; } to { translate: 0 -6px; } }
.hero > .backdrop-orbits-stage-zoom {
  position: absolute; z-index: 4;
  --backdrop-orbits-stage-zoom-reach: screen;
  --backdrop-orbits-stage-zoom-top: calc(var(--masthead-h, 64px) + 16px); --backdrop-orbits-stage-zoom-bottom: 16px; --backdrop-orbits-stage-zoom-side: 24px;
  --backdrop-orbits-stage-zoom-dim: rgb(4 8 22 / .42);
}
.hero > .backdrop-orbits-stage-zoom.is-screen { position: fixed; }
@media (max-width: 1199px) {
  .hero > .backdrop-orbits-stage-zoom { --backdrop-orbits-stage-zoom-bottom: calc(var(--nav-dock-h, 62px) + 10px + env(safe-area-inset-bottom, 0px) + 12px); }
}
@media (max-width: 640px) {
  .hero > .backdrop-orbits-stage-zoom { --backdrop-orbits-stage-zoom-side: 8px; }
  .hero .hero-stage-float .backdrop-orbits-stage-view { --backdrop-orbits-stage-zoom-fill: 1; }
  .hero .hero-stage-float .hero-stage-note { font-size: 11.5px; }
  .hero .hero-stage.hero-stage-float { margin-bottom: 50px; }
}
@media print {
  .hero .hero-stage-float .backdrop-orbits-stage-view { opacity: 1; }
  .hero .hero-stage-float .hero-stage-note { text-shadow: none; }
}
.hero[data-hero-look="midnight-atlas"] {
  --backdrop-orbits-stage-halo: #0A1330;
  --backdrop-orbits-stage-ghost: #16203F;
  --backdrop-orbits-stage-accent: #E9C77F;
  --backdrop-orbits-stage-ink: #F7F2E6; --backdrop-orbits-stage-text: #C9D0E0; --backdrop-orbits-stage-muted: #B9C1D4;
}
.hero[data-hero-look="midnight-atlas"] .backdrop-orbits[data-backdrop-skin="midnight-atlas"] { --backdrop-orbits-midnight-atlas-shade: 0; }
.hero[data-hero-look="midnight-atlas"] :is(.hero-sub, .hero-note, .eyebrow) {
  text-shadow:
    1px 0 0 var(--backdrop-orbits-stage-halo), -1px 0 0 var(--backdrop-orbits-stage-halo), 0 1px 0 var(--backdrop-orbits-stage-halo), 0 -1px 0 var(--backdrop-orbits-stage-halo),
    .7px .7px 0 var(--backdrop-orbits-stage-halo), -.7px .7px 0 var(--backdrop-orbits-stage-halo), .7px -.7px 0 var(--backdrop-orbits-stage-halo), -.7px -.7px 0 var(--backdrop-orbits-stage-halo),
    1.5px 0 1px var(--backdrop-orbits-stage-halo), -1.5px 0 1px var(--backdrop-orbits-stage-halo), 0 1.5px 1px var(--backdrop-orbits-stage-halo), 0 -1.5px 1px var(--backdrop-orbits-stage-halo),
    1.05px 1.05px 1px var(--backdrop-orbits-stage-halo), -1.05px 1.05px 1px var(--backdrop-orbits-stage-halo), 1.05px -1.05px 1px var(--backdrop-orbits-stage-halo), -1.05px -1.05px 1px var(--backdrop-orbits-stage-halo),
    0 0 .5px var(--backdrop-orbits-stage-halo), 0 0 1px var(--backdrop-orbits-stage-halo), 0 0 1.5px var(--backdrop-orbits-stage-halo), 0 0 2.5px var(--backdrop-orbits-stage-halo), 0 0 4px var(--backdrop-orbits-stage-halo);
}
.hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] {
  --backdrop-orbits-midnight-atlas-gem: 54px;
  --backdrop-orbits-midnight-atlas-far-size: .8;
}
.hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-name { font-size: 14.5px; letter-spacing: .13em; }
@media (min-width: 1600px) and (min-height: 860px) {
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] { --backdrop-orbits-midnight-atlas-gem: 60px; }
}
.hero[data-hero-look="midnight-atlas"] .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-shadows::before,
.hero[data-hero-look="midnight-atlas"] .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-shadows::after {
  content: ""; position: absolute; left: 0; right: 0; pointer-events: none; will-change: transform;
}
.hero[data-hero-look="midnight-atlas"] .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-shadows::before {
  top: 0; height: 104px;
  background:
    linear-gradient(90deg, #E9C77F00 3%, #E9C77F80 26%, #F3DA9AB8 50%, #E9C77F80 74%, #E9C77F00 97%) 0 6px / 100% 1px no-repeat,
    radial-gradient(62% 104px at 50% 0, #2A3D75B3, #2A3D7500 100%);
}
.hero[data-hero-look="midnight-atlas"] .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-shadows::after {
  bottom: 0; height: 112px;
  background: linear-gradient(0deg, #060D22 0, #060D22B8 26px, #060D2200 112px);
}
.hero[data-hero-look="midnight-atlas"] .hero-stage::before {
  border-radius: 0;
  background:
    radial-gradient(90% 80% at 50% 42%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-hi) 42%, transparent), color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-hi) 0%, transparent) 100%),
    color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep) 78%, transparent);
  border: 2px solid color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold) 92%, transparent);
  outline: 1px solid color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold-hi) 58%, transparent); outline-offset: -6px;
  box-shadow: inset 0 0 0 4px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep) 70%, transparent),
    0 0 0 1px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep) 85%, transparent),
    0 0 46px -12px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-glow) 34%, transparent), 0 24px 48px -24px rgb(1 3 12 / .85);
}
.hero[data-hero-look="midnight-atlas"] .hero-stage-marks { display: block; position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.hero[data-hero-look="midnight-atlas"] .hero-stage-marks svg {
  position: absolute; width: 17px; height: 17px; margin: -8.5px; overflow: visible;
  fill: var(--backdrop-orbits-midnight-atlas-gold-hi); stroke: var(--backdrop-orbits-midnight-atlas-night-deep); stroke-width: 1.4; paint-order: stroke;
}
.hero[data-hero-look="midnight-atlas"] .hero-stage-marks svg circle { fill: var(--backdrop-orbits-midnight-atlas-lamp); stroke: none; }
.hero[data-hero-look="midnight-atlas"] .hero-stage-marks svg:nth-child(1) { left: 1px; top: 1px; }
.hero[data-hero-look="midnight-atlas"] .hero-stage-marks svg:nth-child(2) { right: 1px; top: 1px; }
.hero[data-hero-look="midnight-atlas"] .hero-stage-marks svg:nth-child(3) { left: 1px; bottom: 1px; }
.hero[data-hero-look="midnight-atlas"] .hero-stage-marks svg:nth-child(4) { right: 1px; bottom: 1px; }
.hero[data-hero-look="midnight-atlas"] .hero-stage-plate {
  border-radius: 1.5px; padding: 0 1.8em;
  background:
    radial-gradient(circle at 13px 50%, var(--backdrop-orbits-midnight-atlas-card) 0 1.6px, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold-dark) 70%, transparent) 2.3px, transparent 3px),
    radial-gradient(circle at calc(100% - 13px) 50%, var(--backdrop-orbits-midnight-atlas-card) 0 1.6px, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold-dark) 70%, transparent) 2.3px, transparent 3px),
    linear-gradient(180deg, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold-hi) 62%, #fff), var(--backdrop-orbits-midnight-atlas-gold-hi) 34%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold) 55%, var(--backdrop-orbits-midnight-atlas-gold-hi)));
  outline: .8px solid color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-card) 55%, transparent); outline-offset: -4px;
  box-shadow: inset 0 0 0 1px var(--backdrop-orbits-midnight-atlas-gold-dark), inset 0 1px 0 1px rgb(255 252 240 / .55),
    0 0 0 1px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep) 85%, transparent),
    0 0 22px -4px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-glow) 50%, transparent), 0 12px 20px -10px rgb(1 3 12 / .75);
}
.hero[data-hero-look="midnight-atlas"] .backdrop-orbits-stage-caption {
  color: var(--backdrop-orbits-midnight-atlas-card); font-family: var(--backdrop-orbits-midnight-atlas-serif);
  text-shadow: 0 1px 0 rgb(255 250 232 / .5);
}
.hero[data-hero-look="midnight-atlas"] :is(.backdrop-orbits-stage-caption-time, .backdrop-orbits-stage-caption-name) {
  font-size: .82em; font-weight: 700; text-transform: none; font-variant-caps: all-small-caps; letter-spacing: .13em; color: var(--backdrop-orbits-midnight-atlas-card);
}
.hero[data-hero-look="midnight-atlas"] .backdrop-orbits-stage-caption-time {
  font-variant-caps: normal; text-transform: uppercase; font-size: .7em; font-weight: 600; letter-spacing: .14em;
  color: color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-card) 74%, var(--backdrop-orbits-midnight-atlas-gold-dark));
}
.hero[data-hero-look="midnight-atlas"] .backdrop-orbits-stage-caption-line { font-style: italic; letter-spacing: .01em; }
.hero[data-hero-look="midnight-atlas"] .hero-stage-note {
  translate: -50% -2px; border-radius: 0 0 2px 2px; font-family: var(--backdrop-orbits-midnight-atlas-serif); font-style: italic; font-size: 12.5px;
  color: color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-ivory) 86%, var(--backdrop-orbits-midnight-atlas-gold-hi)); background: var(--backdrop-orbits-midnight-atlas-card);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold) 72%, transparent), inset 0 0 0 2px var(--backdrop-orbits-midnight-atlas-card),
    inset 0 0 0 2.6px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold) 30%, transparent), 0 8px 14px -8px rgb(1 3 12 / .7);
}
.hero[data-hero-look="midnight-atlas"] .hero-stage.hero-stage-float::before {
  inset: -13% -10%; border: 0; outline: 0; border-radius: 50%; box-shadow: none;
  background:
    radial-gradient(closest-side, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep) 78%, transparent) 46%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep) 40%, transparent) 72%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep) 0%, transparent) 100%),
    radial-gradient(closest-side, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-glow) 0%, transparent) 62%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-glow) 16%, transparent) 80%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-glow) 0%, transparent) 100%);
}
.hero[data-hero-look="midnight-atlas"] .hero-stage-float .hero-stage-note {
  translate: -50% 4px; padding: 0; background: none; box-shadow: none; border-radius: 0;
  color: color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-ivory) 86%, var(--backdrop-orbits-midnight-atlas-gold-hi));
  text-shadow:
    1px 0 0 var(--backdrop-orbits-stage-halo), -1px 0 0 var(--backdrop-orbits-stage-halo), 0 1px 0 var(--backdrop-orbits-stage-halo), 0 -1px 0 var(--backdrop-orbits-stage-halo),
    .7px .7px 0 var(--backdrop-orbits-stage-halo), -.7px .7px 0 var(--backdrop-orbits-stage-halo), .7px -.7px 0 var(--backdrop-orbits-stage-halo), -.7px -.7px 0 var(--backdrop-orbits-stage-halo),
    0 0 1.5px var(--backdrop-orbits-stage-halo), 0 0 2.5px var(--backdrop-orbits-stage-halo), 0 0 4px var(--backdrop-orbits-stage-halo);
}
.hero[data-hero-look="midnight-atlas"] > .backdrop-orbits-stage-zoom { --backdrop-orbits-stage-zoom-dim: color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep, #060D22) 46%, transparent); }
.backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-body.is-featured .backdrop-orbits-icon > svg.backdrop-orbits-midnight-atlas-aureole {
  will-change: rotate; animation: backdrop-orbits-stage-midnight-atlas-aureole 72s linear infinite;
}
@keyframes backdrop-orbits-stage-midnight-atlas-aureole { to { rotate: 1turn; } }
@media (prefers-reduced-motion: reduce) {
  .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-body.is-featured .backdrop-orbits-icon > svg.backdrop-orbits-midnight-atlas-aureole { animation: none; }
}
html.still .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-body.is-featured .backdrop-orbits-icon > svg.backdrop-orbits-midnight-atlas-aureole,
.backdrop-orbits[data-backdrop-skin="midnight-atlas"].is-still .backdrop-orbits-body.is-featured .backdrop-orbits-icon > svg.backdrop-orbits-midnight-atlas-aureole,
.backdrop-orbits[data-backdrop-skin="midnight-atlas"].is-paused .backdrop-orbits-body.is-featured .backdrop-orbits-icon > svg.backdrop-orbits-midnight-atlas-aureole,
.backdrop-orbits[data-backdrop-skin="midnight-atlas"].is-lite .backdrop-orbits-body.is-featured .backdrop-orbits-icon > svg.backdrop-orbits-midnight-atlas-aureole { animation-play-state: paused; }
.backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-stage-beam {
  --backdrop-orbits-stage-beam: 3.4px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold) 0%, transparent) 4%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold) 85%, transparent) 30%,
    var(--backdrop-orbits-midnight-atlas-gold-hi) 72%, var(--backdrop-orbits-midnight-atlas-lamp));
  box-shadow: 0 0 0 1.1px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-night-deep) 92%, transparent), 0 0 0 2.2px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-gold) 42%, transparent),
    0 0 14px 2px color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-glow) 45%, transparent);
}
.backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-stage-packet {
  background: radial-gradient(closest-side, #fff, var(--backdrop-orbits-midnight-atlas-lamp) 38%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-glow) 55%, transparent) 62%, color-mix(in srgb, var(--backdrop-orbits-midnight-atlas-glow) 0%, transparent));
}
@media (max-width: 640px) {
  .hero .backdrop-orbits[data-backdrop-skin="midnight-atlas"] { --backdrop-orbits-midnight-atlas-gem-small: 34px; }
  .hero[data-hero-look="midnight-atlas"] .hero-stage-marks svg { width: 13px; height: 13px; margin: -6.5px; }
  .hero[data-hero-look="midnight-atlas"] .hero-stage::before { outline-offset: -4px; }
  .hero[data-hero-look="midnight-atlas"] .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-shadows::before {
    height: 84px;
    background:
      linear-gradient(90deg, #E9C77F00 3%, #E9C77F80 26%, #F3DA9AB8 50%, #E9C77F80 74%, #E9C77F00 97%) 0 6px / 100% 1px no-repeat,
      radial-gradient(70% 84px at 50% 0, #2A3D75A6, #2A3D7500 100%);
  }
  .hero[data-hero-look="midnight-atlas"] .backdrop-orbits[data-backdrop-skin="midnight-atlas"] .backdrop-orbits-shadows::after {
    height: 72px; background: linear-gradient(0deg, #060D22 0, #060D22B8 20px, #060D2200 72px);
  }
}
@media print {
  .hero[data-hero-look="midnight-atlas"] { color: #14213D; background: none; }
  .hero[data-hero-look="midnight-atlas"] :is(.hero-bg, .hero-next) { display: none; }
  .hero[data-hero-look="midnight-atlas"] :is(.eyebrow, .hero-copy h1, .hero-sub, .hero-note, .backdrop-orbits-stage-caption) { text-shadow: none; }
  .hero[data-hero-look="midnight-atlas"] .eyebrow { color: #A1520B; }
  .hero[data-hero-look="midnight-atlas"] .eyebrow::before { background: #A1520B; box-shadow: none; }
  .hero[data-hero-look="midnight-atlas"] .hero-copy h1 { color: #10192E; }
  .hero[data-hero-look="midnight-atlas"] .hero-sub { color: #3E4A63; }
  .hero[data-hero-look="midnight-atlas"] .hero-note { color: #4E5B75; }
  .hero[data-hero-look="midnight-atlas"] .btn-ghost { color: #10192E; border-color: #10192E59; }
  .hero[data-hero-look="midnight-atlas"] .hero-stage-note { color: #3E4A63; }
  .hero[data-hero-look="midnight-atlas"] .hero-stage-float .hero-stage-note { color: #3E4A63; text-shadow: none; }
}