/* Cinematic lighting and shallow parallax over a realistic anatomical bitmap. */
.nk-cinematic {
  --nk-ivory: #f4efe8;
  --nk-coral: #f28d88;
  --nk-mint: #83e0d0;
  --nk-rotate-x: 0deg;
  --nk-rotate-y: 0deg;
  --nk-lift: 0px;
  --nk-light-x: 48%;
  --nk-shadow-scale: 1;
  width: min(100%, 460px);
  margin: 0 auto;
  color: var(--nk-ivory);
  isolation: isolate;
  contain: layout style;
}
.nk-cinematic__stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1.025;
  overflow: visible;
  perspective: 900px;
  perspective-origin: 50% 48%;
  border-radius: 48%;
  background: radial-gradient(ellipse at 50% 42%, #17212c65 0, #090e1800 65%);
  touch-action: pan-y;
}
.nk-cinematic__atmosphere,
.nk-cinematic__rim,
.nk-cinematic__vignette,
.nk-cinematic__glass,
.nk-cinematic__traces,
.nk-cinematic__image,
.nk-cinematic__fallback { position: absolute; pointer-events: none; }
.nk-cinematic__atmosphere {
  inset: 9% 3% 6%;
  border-radius: 50%;
  background: radial-gradient(ellipse at var(--nk-light-x) 47%, #f28d8810 0, #83e0d00a 42%, transparent 68%);
}
.nk-cinematic__rim {
  inset: 18% 7% 13%;
  border-radius: 50%;
  border: 1px solid #f4efe807;
  transform: rotate(-18deg);
  box-shadow: inset 0 1px 0 #f4efe805, 0 14px 50px #83e0d006;
}
.nk-cinematic__rig {
  position: absolute;
  inset: 0;
  transform-style: preserve-3d;
  transform: translateY(var(--nk-lift)) rotateX(var(--nk-rotate-x)) rotateY(var(--nk-rotate-y));
  transform-origin: 50% 54%;
  opacity: .92;
}
.nk-cinematic--ready .nk-cinematic__rig { opacity: 1; }
.nk-cinematic[data-playing="true"] .nk-cinematic__rig { will-change: transform; }
.nk-cinematic__image {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transform: translateZ(0);
  filter: drop-shadow(1px 12px 12px #02040a85);
  user-select: none;
  -webkit-user-drag: none;
}
.nk-cinematic__fallback { display: none; inset: 8%; width: 84%; height: 84%; transform: translateZ(0); }
.nk-cinematic[data-asset="unavailable"] .nk-cinematic__fallback { display: block; }
.nk-cinematic[data-asset="unavailable"] .nk-cinematic__image { visibility: hidden; }
.nk-cinematic__traces { width: 100%; height: 100%; inset: 0; }
.nk-cinematic__traces--rear { transform: scale(.99); opacity: .86; }
.nk-cinematic__traces--surface { transform: translateZ(8px); mix-blend-mode: screen; }
.nk-cinematic__contact {
  position: absolute;
  left: 19%;
  right: 16%;
  bottom: 7%;
  height: 10%;
  border-radius: 50%;
  background: radial-gradient(ellipse, #02050be0 0, #03080e63 38%, transparent 72%);
  transform: scaleX(var(--nk-shadow-scale));
  pointer-events: none;
}
.nk-cinematic__glass--rear {
  inset: 16% 15% 12%;
  border-radius: 48% 52% 51% 49%;
  background: linear-gradient(145deg, #f4efe804 0, transparent 43%, #83e0d003 81%, transparent);
  border-left: 1px solid #83e0d008;
  transform: translateZ(-21px) rotate(-8deg);
}
.nk-cinematic__glass--front {
  inset: 13% 8% 9%;
  border-radius: 50%;
  border-bottom: 1px solid #83e0d00c;
  border-right: 1px solid #f4efe806;
  transform: translateZ(15px) rotate(12deg);
  opacity: .45;
}
.nk-cinematic__vignette { inset: 0; border-radius: inherit; box-shadow: inset 0 0 25px #090e1830; }
.nk-cinematic__caption {
  position: relative;
  margin: -2px auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  text-align: center;
  font: inherit;
  font-size: 12px;
  line-height: 1.45;
  letter-spacing: .01em;
  color: #c4c1bd;
}
.nk-cinematic__caption > span { white-space: nowrap; }
.nk-cinematic__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 8px 11px;
  border: 1px solid #f4efe81a;
  border-radius: 100px;
  color: #e1dbd4;
  background: #090e1866;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.nk-cinematic__toggle:hover { border-color: #83e0d05c; color: var(--nk-ivory); background: #83e0d00a; }
.nk-cinematic__toggle:focus-visible { outline: 2px solid var(--nk-mint); outline-offset: 4px; }
.nk-cinematic__toggle:disabled { opacity: .45; cursor: default; }
.nk-cinematic__toggle-symbol { font-size: 11px; width: 10px; line-height: 1; font-weight: 600; }
.nk-cinematic-brand { display: inline-flex; width: 44px; height: 44px; flex: none; align-items: center; justify-content: center; }
.nk-cinematic-brand img { width: 100%; height: 100%; object-fit: contain; display: block; filter: drop-shadow(0 2px 3px #02050b70); }
@media (max-width: 430px) {
  .nk-cinematic { width: min(100%, 260px); }
  .nk-cinematic__caption { font-size: 12px; gap: 5px 8px; }
  .nk-cinematic__toggle { min-height: 44px; padding: 8px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .nk-cinematic:not([data-playing="true"]) .nk-cinematic__rig { transform: none; will-change: auto; }
}

/* Ren grows with the selected track; every entrance ends in a still full pose. */
.nr-hero { --nr-energy: 249 193 94; --nr-energy-light: 255 226 160; --nr-energy-secondary: 197 88 35; width: min(100%, 440px); margin: 0 auto; contain: layout style; color: #f4efe8; }
.nr-hero[data-track="resident"] { --nr-energy: 114 221 205; --nr-energy-light: 206 255 236; --nr-energy-secondary: 54 139 151; }
.nr-hero[data-track="fellow"] { --nr-energy: 183 153 249; --nr-energy-light: 236 220 255; --nr-energy-secondary: 114 79 182; }
.nr-hero__stage {
  position: relative; isolation: isolate; width: 100%; aspect-ratio: 1 / 1;
  overflow: hidden; border-radius: 28px;
  background: radial-gradient(ellipse at 52% 43%, rgb(var(--nr-energy) / .07) 0, rgb(var(--nr-energy-secondary) / .04) 38%, transparent 70%);
  touch-action: pan-y;
}
.nr-hero__aura { position: absolute; inset: 7% 9% 10%; border-radius: 50%; opacity: .52; background: radial-gradient(ellipse, rgb(var(--nr-energy) / .13), rgb(var(--nr-energy-secondary) / .06) 42%, transparent 70%); }
.nr-hero__orbit { position: absolute; inset: 6% 9% 9%; border: 1px solid rgb(var(--nr-energy) / .23); border-left-color: rgb(var(--nr-energy-light) / .62); border-right-color: rgb(var(--nr-energy) / .03); border-radius: 50%; transform: rotate(-12deg); opacity: .48; }
.nr-hero__orbit--outer::before, .nr-hero__orbit--inner::after { content: ''; position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #ffce7a; top: 17%; left: 11%; box-shadow: 0 0 8px #ffc26080; }
.nr-hero__orbit--inner { inset: 11% 4% 20%; transform: rotate(24deg); border-color: rgb(var(--nr-energy) / .06); border-bottom-color: rgb(var(--nr-energy) / .23); opacity: .6; }
.nr-hero__orbit--inner::after { top: auto; left: auto; right: 14%; bottom: 10%; width: 3px; height: 3px; }
.nr-hero__character { position: absolute; z-index: 2; inset: 5% 9% 14%; transform-origin: 56% 86%; }
.nr-hero__image { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 12px 10px #03060c66); }
.nr-hero__fallback { display: none; position: absolute; inset: 18%; place-items: center; border: 1px solid #f5bd5570; border-radius: 50%; color: #ffcf7b; background: #c87d1817; font-size: 6rem; }
.nr-hero[data-asset="unavailable"] .nr-hero__image { display: none; }
.nr-hero[data-asset="unavailable"] .nr-hero__fallback { display: grid; }
.nr-hero__floor { position: absolute; z-index: 0; bottom: 9%; left: 15%; width: 70%; height: 10%; border-radius: 50%; background: radial-gradient(ellipse, rgb(var(--nr-energy) / .19) 0, rgb(var(--nr-energy-secondary) / .08) 35%, transparent 70%); }
.nr-hero__landing { position: absolute; z-index: 3; bottom: 8%; left: 14%; width: 72%; height: 12%; border: 2px solid #fac867; border-radius: 50%; opacity: 0; }
.nr-hero__ribbon { position: absolute; left: 2%; top: 34%; width: 95%; height: 26%; border-radius: 50%; border: 1px solid transparent; border-top: 3px solid rgb(var(--nr-energy)); transform: rotate(-20deg); opacity: .16; }
.nr-hero__ribbon--rear { border-left-color: rgb(var(--nr-energy) / .19); border-top-color: rgb(var(--nr-energy-light) / .7); }
.nr-hero__ribbon--front { z-index: 3; top: 47%; height: 21%; border-top: none; border-bottom: 2px solid rgb(var(--nr-energy-light)); opacity: 0; }
.nr-hero__speedlines { position: absolute; inset: 0; transform: rotate(-20deg); pointer-events: none; }
.nr-hero[data-track="resident"] .nr-hero__speedlines { transform: rotate(-14deg); }
.nr-hero[data-track="fellow"] .nr-hero__speedlines { transform: rotate(12deg); }
.nr-hero__speedlines i { position: absolute; left: 5%; top: calc(38% + var(--streak) * 8%); width: 86%; height: 2px; background: linear-gradient(90deg, transparent, rgb(var(--nr-energy-secondary) / .19), rgb(var(--nr-energy) / .6), #fff0cb, transparent); opacity: 0; }
.nr-hero__sparks { position: absolute; z-index: 3; inset: 0; pointer-events: none; }
.nr-hero__sparks i { position: absolute; left: calc(12% + var(--spark) * 14%); top: calc(24% + var(--spark) * 7%); width: 5px; height: 11px; border-radius: 1px; background: rgb(var(--nr-energy-light)); clip-path: polygon(56% 0, 6% 58%, 47% 58%, 29% 100%, 96% 36%, 57% 36%); opacity: 0; }
.nr-hero[data-track="fellow"] .nr-hero__sparks i { width: 5px; height: 5px; border-radius: 50%; clip-path: none; }
.nr-hero__signature { position: absolute; z-index: 4; left: 5%; right: 5%; bottom: 2%; display: flex; justify-content: center; gap: 10px; align-items: baseline; color: #f4efe8; font-family: "Avenir Next", Avenir, "Segoe UI", sans-serif; font-style: italic; font-size: 25px; font-weight: 750; line-height: 1.15; letter-spacing: -.035em; white-space: nowrap; }
.nr-hero__signature>.brand-wordmark-rush { color: rgb(var(--nr-energy-light)); font-size: 44px; line-height: 1.05; }
.nr-hero__caption { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 8px 0; color: #d2d8df; font-size: 14px; line-height: 1.5; }
.nr-hero__control { display: inline-flex; flex: none; align-items: center; gap: 7px; min-height: 44px; padding: 9px 12px; border: 1px solid #e7b65c30; border-radius: 100px; background: #e7b65c08; color: #f3d499; font: inherit; font-size: 12px; line-height: 1.3; cursor: pointer; }
.nr-hero__control:hover:not(:disabled) { background: #e7b65c15; border-color: #e7b65c70; }
.nr-hero__control:focus-visible { outline: 2px solid #ffce7a; outline-offset: 4px; }
.nr-hero__control:disabled { color: #aca79b; cursor: default; }
.nr-hero__control>span:first-child { font-size: 14px; line-height: 1; }
.nr-hero[data-motion="playing"] .nr-hero__character { will-change: transform, opacity; }
@media (max-width: 760px) {
  .nr-hero { width: min(100%, 300px); }
  .nr-hero__stage { border-radius: 20px; }
  .nr-hero__caption { flex-wrap: wrap; justify-content: center; font-size: 13px; gap: 8px; padding: 8px 2px 0; text-align: center; }
  .nr-hero__control { font-size: 12px; padding: 8px 12px; }
  .nr-hero__signature { font-size: 21px; gap: 9px; }
  .nr-hero__signature>.brand-wordmark-rush { font-size: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  .nr-hero__character { transform: none !important; opacity: 1 !important; will-change: auto !important; }
  .nr-hero__speedlines, .nr-hero__sparks, .nr-hero__landing, .nr-hero__ribbon--front { display: none; }
}