/* [project]/src/features/centauri/centauri.css [app-client] (css) */
.cc {
  --cc-page: #fff;
  --cc-deep: #f4f6fb;
  --cc-raise: #fff;
  --cc-line: #0f172a14;
  --cc-line-strong: #0f172a29;
  --cc-ink: var(--color-neutral-900);
  --cc-muted: var(--color-neutral-600);
  --cc-faint: var(--color-neutral-400);
  --cc-accent: var(--color-primary-500);
  --cc-accent-soft: var(--color-primary-600);
  --cc-heat: var(--color-secondary-500);
  --cc-shadow: 0 18px 44px -30px #0f172a73;
  --cc-amp: 1;
  --cc-mx: 0;
  --cc-my: 0;
  color: var(--cc-ink);
  isolation: isolate;
  background: linear-gradient(#fff 0%, #f6f8fd 40% 62%, #fff 100%);
  position: relative;
}

html:has(.cc) {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html:has(.cc) {
    scroll-behavior: auto;
  }
}

.cc-mono {
  font-family: var(--font-family-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}

@property --cc-glow-color {
  syntax: "<color>";
  inherits: false;
  initial-value: #3b82f624;
}

.cc-glow {
  background: radial-gradient(closest-side,
    var(--cc-glow-color, #3b82f624),
    color-mix(in srgb, var(--cc-glow-color, #3b82f624) 45%, transparent)
      52%,
    transparent 76%);
  pointer-events: none;
  border-radius: 9999px;
  transition: --cc-glow-color .7s cubic-bezier(.22, 1, .36, 1);
  position: absolute;
}

.cc-scene {
  contain: paint;
  place-items: center;
  height: 100svh;
  min-height: 34rem;
  padding-top: 4rem;
  padding-bottom: 3rem;
  display: grid;
  position: sticky;
  top: 0;
  overflow: hidden;
}

@property --p {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --cc-explode {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --cc-head {
  syntax: "<number>";
  inherits: true;
  initial-value: .5;
}

@property --cc-build {
  syntax: "<number>";
  inherits: true;
  initial-value: 1;
}

@property --cc-hot {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --cc-reel {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

@property --cc-swatch {
  syntax: "<color>";
  inherits: true;
  initial-value: #38bdf8;
}

.cc-stage {
  perspective: 1700px;
  perspective-origin: 50% 44%;
  place-items: center;
  width: 100%;
  display: grid;
}

.cc-model {
  --cc-u: 1px;
  --cc-rx: -8deg;
  --cc-ry: -26deg;
  --cc-scale: 1;
  --cc-explode: 0;
  --cc-head: .5;
  --cc-build: 1;
  --cc-hot: 0;
  --cc-reel: 0;
  --cc-swatch: #38bdf8;
  width: calc(300 * var(--cc-u));
  height: calc(320 * var(--cc-u));
  transform-style: preserve-3d;
  transform: scale(var(--cc-scale)) rotateX(var(--cc-rx)) rotateY(var(--cc-ry));
  transition: --cc-swatch .7s cubic-bezier(.22, 1, .36, 1);
  position: relative;
}

.cc-solid {
  width: var(--w);
  height: var(--h);
  margin-left: calc(var(--w) / -2);
  margin-top: calc(var(--h) / -2);
  transform-style: preserve-3d;
  position: absolute;
  top: 50%;
  left: 50%;
}

.cc-face {
  border: 1px solid #ffffff0f;
  position: absolute;
  inset: 0;
}

.cc-face--front {
  transform: translateZ(calc(var(--exz, 0px) * var(--cc-explode) * var(--cc-amp)))
    translateZ(calc(var(--d) / 2));
}

.cc-face--back {
  transform: translateZ(calc(var(--exz, 0px) * var(--cc-explode) * var(--cc-amp) * -1))
    rotateY(180deg) translateZ(calc(var(--d) / 2));
}

.cc-face--right {
  width: var(--d);
  margin-left: calc(var(--d) / -2);
  transform: translateX(calc(var(--exx, 0px) * var(--cc-explode) * var(--cc-amp)))
    rotateY(90deg) translateZ(calc(var(--w) / 2));
  left: 50%;
}

.cc-face--left {
  width: var(--d);
  margin-left: calc(var(--d) / -2);
  transform: translateX(calc(var(--exx, 0px) * var(--cc-explode) * var(--cc-amp) * -1))
    rotateY(-90deg) translateZ(calc(var(--w) / 2));
  left: 50%;
}

.cc-face--top {
  height: var(--d);
  margin-top: calc(var(--d) / -2);
  transform: translateY(calc(var(--exy, 0px) * var(--cc-explode) * var(--cc-amp) * -1))
    rotateX(90deg) translateZ(calc(var(--h) / 2));
  top: 50%;
}

.cc-face--bottom {
  height: var(--d);
  margin-top: calc(var(--d) / -2);
  transform: translateY(calc(var(--exy, 0px) * var(--cc-explode) * var(--cc-amp)))
    rotateX(-90deg) translateZ(calc(var(--h) / 2));
  top: 50%;
}

.cc-m-panel {
  background: linear-gradient(118deg, #ffffff29 0%, #ffffff05 34%, #0000004d 78%), repeating-linear-gradient(90deg, #ffffff0a 0 1px, #0000 1px 4px), linear-gradient(#333c52 0%, #1e2536 62%, #161b28 100%);
  border-color: #ffffff14;
}

.cc-m-vent {
  background: repeating-linear-gradient(#0000006b 0 3px, #ffffff0f 3px 6px), linear-gradient(120deg, #2b3348 0%, #171d2b 100%);
  border-color: #ffffff0f;
}

.cc-m-glass {
  background: linear-gradient(126deg,
      #ffffff57 0%,
      #ffffff14 26%,
      #fff0 44%,
      #ffffff24 62%,
      #fff0 80%),
    linear-gradient(180deg,
      #1e293b6b 0%,
      #1e293b33 40%,
      color-mix(in srgb, var(--cc-accent) 18%, transparent) 100%);
  border-color: #ffffff38;
  box-shadow: inset 0 0 40px #0f172a73;
}

.cc-m-base {
  background: linear-gradient(#1b2231 0%, #0f141f 100%);
}

.cc-m-steel {
  background: linear-gradient(#6d7d9c 0%, #39445f 55%, #222a3d 100%);
}

.cc-m-head {
  background: linear-gradient(160deg, #3d4863 0%, #1a2133 100%);
  border-color: #ffffff24;
}

.cc-m-plate {
  background: radial-gradient(ellipse at 50% 50%,
      color-mix(in srgb, var(--cc-accent) 20%, transparent) 0%,
      transparent 66%),
    repeating-linear-gradient(90deg,
      #ffffff0d 0 1px,
      transparent 1px 12px),
    linear-gradient(135deg, #2a3450 0%, #131b2b 100%);
  border-color: #94a3b84d;
}

.cc-m-print {
  background: repeating-linear-gradient(180deg,
      #00000052 0 1px,
      transparent 1px calc(4 * var(--cc-u))),
    linear-gradient(170deg,
      color-mix(in srgb, var(--cc-swatch) 78%, white) 0%,
      var(--cc-swatch) 52%,
      color-mix(in srgb, var(--cc-swatch) 62%, black) 100%);
  border-color: color-mix(in srgb, var(--cc-swatch) 40%, transparent);
}

.cc-gantry {
  --w: calc(272 * var(--cc-u));
  --h: calc(12 * var(--cc-u));
  --d: calc(16 * var(--cc-u));
  transform: translateY(calc(-74 * var(--cc-u) - 62 * var(--cc-u) * var(--cc-explode) * var(--cc-amp)))
    translateZ(calc(6 * var(--cc-u)));
}

.cc-head {
  --w: calc(46 * var(--cc-u));
  --h: calc(52 * var(--cc-u));
  --d: calc(40 * var(--cc-u));
  transform: translateX(calc((var(--cc-head) - .5) * 186 * var(--cc-u)))
    translateY(calc(-42 * var(--cc-u) - 40 * var(--cc-u) * var(--cc-explode) * var(--cc-amp)))
    translateZ(calc(8 * var(--cc-u) + 78 * var(--cc-u) * var(--cc-explode) * var(--cc-amp)));
}

.cc-nozzle {
  left: 50%;
  bottom: calc(-10 * var(--cc-u));
  width: calc(12 * var(--cc-u));
  height: calc(12 * var(--cc-u));
  margin-left: calc(-6 * var(--cc-u));
  background: linear-gradient(180deg,
    #64748b 0%,
    color-mix(in srgb, var(--cc-heat) calc(var(--cc-hot) * 100%), #334155) 100%);
  box-shadow: 0 0 calc(24 * var(--cc-u))
    color-mix(in srgb, var(--cc-heat) calc(var(--cc-hot) * 80%), transparent);
  transform: translateZ(calc(20 * var(--cc-u)));
  border-radius: 0 0 45% 45%;
  position: absolute;
}

.cc-bed {
  --w: calc(244 * var(--cc-u));
  --h: calc(224 * var(--cc-u));
  --d: calc(9 * var(--cc-u));
  transform: translateY(calc(96 * var(--cc-u) + 70 * var(--cc-u) * var(--cc-explode) * var(--cc-amp)))
    rotateX(90deg);
}

.cc-print {
  --w: calc(74 * var(--cc-u));
  --h: calc(86 * var(--cc-u));
  --d: calc(66 * var(--cc-u));
  transform-origin: 50% 100%;
  transform: translateY(calc(52 * var(--cc-u))) translateZ(calc(4 * var(--cc-u)))
    scaleY(clamp(.015, var(--cc-build), 1));
}

.cc-spool {
  --w: calc(96 * var(--cc-u));
  --h: calc(96 * var(--cc-u));
  background: radial-gradient(circle at 50% 50%,
    #0b1120 0 21%,
    color-mix(in srgb, var(--cc-swatch) 78%, black) 21% 34%,
    color-mix(in srgb, var(--cc-swatch) 96%, white) 34% 52%,
    color-mix(in srgb, var(--cc-swatch) 78%, black) 52% 70%,
    color-mix(in srgb, var(--cc-swatch) 96%, white) 70% 100%);
  border: calc(3 * var(--cc-u)) solid #e2e8f033;
  transform: translateX(calc(72 * var(--cc-u)))
    translateY(calc(-24 * var(--cc-u)))
    translateZ(calc(-94 * var(--cc-u) - 74 * var(--cc-u) * var(--cc-explode) * var(--cc-amp)))
    rotateY(90deg) rotate(calc(var(--cc-reel, 0) * 1turn));
  border-radius: 9999px;
}

.cc-screen {
  inset-inline-end: 7%;
  aspect-ratio: 4 / 3;
  border-radius: calc(4 * var(--cc-u));
  background: linear-gradient(140deg,
    color-mix(in srgb, var(--cc-accent) 52%, transparent),
    #040810e6);
  width: 26%;
  box-shadow: 0 0 calc(20 * var(--cc-u)) #3b82f659;
  border: 1px solid #ffffff2e;
  position: absolute;
  bottom: 7%;
}

.cc-shadow {
  --w: calc(380 * var(--cc-u));
  --h: calc(310 * var(--cc-u));
  transform: translateY(calc(178 * var(--cc-u))) rotateX(90deg);
  background: radial-gradient(#0f172a4d 0%, #0f172a29 34%, #0f172a0d 55%, #0000 72%);
  border-radius: 9999px;
}

@property --cc-fill {
  syntax: "<number>";
  inherits: true;
  initial-value: .5;
}

.cc-cube-root {
  --cc-u: 1px;
  --cc-rx: -16deg;
  --cc-ry: -34deg;
  --cc-scale: 1;
  --cc-fill: .5;
  width: calc(256 * var(--cc-u));
  height: calc(256 * var(--cc-u));
  transform-style: preserve-3d;
  transform: scale(var(--cc-scale)) rotateX(var(--cc-rx)) rotateY(var(--cc-ry));
  position: relative;
}

.cc-cube {
  --w: calc(256 * var(--cc-u));
  --h: calc(256 * var(--cc-u));
  --d: calc(256 * var(--cc-u));
}

.cc-fill {
  --w: calc(236 * var(--cc-u));
  --h: calc(236 * var(--cc-u));
  --d: calc(236 * var(--cc-u));
  transform-origin: 50% 100%;
  transform: translateY(calc(10 * var(--cc-u)))
    scaleY(clamp(.012, var(--cc-fill), 1));
}

.cc-m-wire {
  background: color-mix(in srgb, var(--cc-accent) 4%, transparent);
  border-color: color-mix(in srgb, var(--cc-accent) 55%, transparent);
  box-shadow: inset 0 0 60px
    color-mix(in srgb, var(--cc-accent) 7%, transparent);
}

.cc-m-fill {
  background: repeating-linear-gradient(180deg,
      #ffffff47 0 1px,
      transparent 1px calc(6 * var(--cc-u))),
    linear-gradient(180deg,
      color-mix(in srgb, var(--cc-accent) 72%, transparent) 0%,
      color-mix(in srgb, var(--cc-accent) 38%, transparent) 100%);
  border-color: color-mix(in srgb, var(--cc-accent) 45%, transparent);
}

@keyframes cc-walk {
  from {
    --cc-head: .14;
  }

  to {
    --cc-head: .86;
  }
}

@keyframes cc-reel {
  to {
    --cc-reel: 1;
  }
}

.cc-live {
  animation: 4.6s cubic-bezier(.45, 0, .55, 1) infinite alternate cc-walk, 26s linear infinite cc-reel;
}

[data-idle="true"] .cc-live, [data-idle="true"] .cc-streak, [data-idle="true"] .cc-cue-dot, [data-idle="true"] .cc-hotspot-dot:after {
  animation-play-state: paused;
}

.cc-hotspot {
  opacity: clamp(0,
    min((var(--p) - var(--from)) * 14, (var(--to) - var(--p)) * 14),
    1);
  transform: translateY(calc((1 - clamp(0, (var(--p) - var(--from)) * 14, 1)) * 14px));
  pointer-events: none;
  align-items: center;
  gap: .625rem;
  display: flex;
  position: absolute;
}

.cc-hotspot-dot {
  background: var(--cc-accent);
  width: .75rem;
  height: .75rem;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--cc-accent) 18%, transparent),
    0 0 0 5px #ffffffe6;
  border-radius: 9999px;
  flex: none;
  position: relative;
}

.cc-hotspot-dot:after {
  content: "";
  border: 1px solid color-mix(in srgb, var(--cc-accent) 55%, transparent);
  border-radius: 9999px;
  animation: 2.4s cubic-bezier(0, 0, .2, 1) infinite cc-ping;
  position: absolute;
  inset: -.5rem;
}

@keyframes cc-ping {
  0% {
    opacity: .9;
    transform: scale(.6);
  }

  80%, 100% {
    opacity: 0;
    transform: scale(1.5);
  }
}

[data-reveal] {
  opacity: 0;
  transition: opacity .9s cubic-bezier(.16, 1, .3, 1), transform 1.05s cubic-bezier(.16, 1, .3, 1);
  transition-delay: calc(var(--d, 0) * 90ms);
  transform: translateY(28px);
}

[data-reveal="in"] {
  opacity: 1;
  transform: none;
}

.cc-film {
  --cc-dir: 1;
  z-index: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
  transform: translateX(calc(var(--cc-dir) * 7%)) scale(1.16);
  pointer-events: none;
  position: absolute;
  inset: 0;
}

[dir="rtl"] .cc-film {
  --cc-dir: -1;
}

.cc-film-scrim {
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(to right,
    color-mix(in srgb, var(--cc-page) 92%, transparent) 0%,
    color-mix(in srgb, var(--cc-page) 60%, transparent) 27%,
    transparent 54%);
  position: absolute;
  inset: 0;
}

[dir="rtl"] .cc-film-scrim {
  background: linear-gradient(to left,
    color-mix(in srgb, var(--cc-page) 92%, transparent) 0%,
    color-mix(in srgb, var(--cc-page) 60%, transparent) 27%,
    transparent 54%);
}

@media (max-width: 63.9375rem) {
  .cc {
    --cc-band-h: 30svh;
    --cc-band-gap: 1rem;
  }

  .cc-film {
    height: var(--cc-band-h);
    inset: 0 0 auto;
    transform: none;
    -webkit-mask-image: linear-gradient(#000 76%, #0000 100%);
    mask-image: linear-gradient(#000 76%, #0000 100%);
  }

  .cc-film-scrim {
    display: none;
  }

  .cc-film-copy {
    margin-top: calc(var(--cc-band-h) - 4rem + var(--cc-band-gap));
    transform: translateY(calc(var(--p) *
          min(0px,
            100svh - var(--cc-band-h) - 3rem - var(--cc-band-gap) - 100%)));
    align-self: start;
  }
}

@property --cc-open {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}

.cc-cinema {
  --cc-card-w: min(72rem, 92vw);
  --cc-card-h: min(40.5rem, 51.75vw);
  --cc-open: calc(clamp(0, (var(--p) - .04) * 2.8, 1) - clamp(0, (var(--p) - .76) * 4, 1));
  --cc-inset-x: max(0px, (100vw - var(--cc-card-w)) / 2 * (1 - var(--cc-open)));
  --cc-inset-y: max(0px, (100svh - var(--cc-card-h)) / 2 * (1 - var(--cc-open)));
  clip-path: inset(var(--cc-inset-y) var(--cc-inset-x) var(--cc-inset-y) var(--cc-inset-x)
      round calc(1.75rem * (1 - var(--cc-open))));
  position: absolute;
  inset: 0;
}

.cc-scene--bleed {
  padding: 0;
}

.cc-bar {
  transition: opacity .42s, transform .5s cubic-bezier(.16, 1, .3, 1), background-color .5s, border-color .5s;
}

html.cc-cinema-open .cc-bar {
  opacity: 0;
  pointer-events: none;
}

.cc-strip {
  --cc-dir: -1;
  width: max-content;
  transform: translateX(calc(var(--cc-dir) * var(--p) * (100% - 100vw + 12rem)));
  display: flex;
}

[dir="rtl"] .cc-strip {
  --cc-dir: 1;
}

.cc-marquee {
  width: max-content;
  animation: 150s linear infinite cc-marquee;
  display: flex;
}

@keyframes cc-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

.cc-rule {
  background: linear-gradient(to right,
    transparent,
    var(--cc-line-strong),
    transparent);
  height: 1px;
  transform: scaleX(clamp(0, var(--p) * 2.2, 1));
  transform-origin: center;
}

.cc-progress {
  transform-origin: 0;
}

[dir="rtl"] .cc-progress {
  transform-origin: 100%;
}

.cc-chip {
  border: 1px solid var(--cc-line);
  box-shadow: var(--cc-shadow);
  font-size: var(--font-size-xs);
  color: var(--cc-muted);
  background: #ffffffeb;
  border-radius: 9999px;
  align-items: center;
  gap: .5rem;
  padding: .375rem .875rem;
  display: inline-flex;
}

.cc-card {
  border: 1px solid var(--cc-line);
  background: var(--cc-raise);
  box-shadow: var(--cc-shadow);
}

.cc-float {
  border: 1px solid var(--cc-line);
  background: #fffffff0;
  box-shadow: 0 24px 60px -32px #0f172a8c;
}

@keyframes cc-cue {
  0% {
    opacity: 0;
    transform: translateY(-40%);
  }

  35% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: translateY(150%);
  }
}

.cc-cue-dot {
  animation: 2s cubic-bezier(.65, 0, .35, 1) infinite cc-cue;
}

@keyframes cc-streak {
  from {
    transform: translateX(-130%);
  }

  to {
    transform: translateX(240%);
  }
}

.cc-streak {
  animation: cc-streak calc(2.6s / var(--sp, 1)) linear infinite;
  animation-delay: calc(var(--d, 0) * -.42s);
}

@media (prefers-reduced-motion: reduce) {
  .cc {
    --cc-amp: .12;
  }

  .cc-cue-dot, .cc-streak, .cc-marquee, .cc-live, .cc-hotspot-dot:after {
    animation: none;
  }

  [data-reveal] {
    transition-duration: .01ms;
    transform: none;
  }

  .cc-hotspot {
    transform: none;
  }
}

/*# sourceMappingURL=src_features_centauri_centauri_0l8l_g1.css.map*/