/* RCF8 cinematic entrance. Everything is scoped; the existing terminal remains unchanged. */
body.rcf8-locked {
  overflow: hidden;
}

body.rcf8-locked .app-shell,
body.rcf8-locked > .skip-link {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.rcf8-landing {
  --rcf8-crimson: #8f2634;
  --rcf8-silver: #eef2f4;
  --rcf8-muted: #aeb8c0;
  position: fixed;
  z-index: 10000;
  inset: 0;
  min-height: 100svh;
  overflow: hidden;
  isolation: isolate;
  color: var(--rcf8-silver);
  background: #05090d;
  font-family: "Arial Narrow", "Aptos Narrow", "Roboto Condensed", "Helvetica Neue Condensed", "Nimbus Sans Narrow", "Liberation Sans Narrow", sans-serif;
}

.rcf8-landing[hidden] {
  display: none;
}

.rcf8-media,
.rcf8-video,
.rcf8-tone,
.rcf8-vignette,
.rcf8-grid,
.rcf8-market-layer {
  position: absolute;
  inset: 0;
}

.rcf8-media {
  z-index: -6;
  background: #05090d url("./assets/rcf8-sydney-poster.webp") center 48% / cover no-repeat;
}

.rcf8-video {
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
  object-position: center 48%;
  image-rendering: auto;
  filter: contrast(1.035) saturate(1.025);
  backface-visibility: hidden;
  transform: translateZ(0);
  opacity: 0;
  animation: rcf8-video-in 1.15s ease-out forwards;
}

.rcf8-landing.is-poster-only .rcf8-video {
  display: none;
}

.rcf8-tone {
  z-index: -5;
  background:
    linear-gradient(90deg, rgba(3, 7, 12, .24), rgba(5, 10, 16, .045) 34%, rgba(5, 9, 14, .055) 67%, rgba(3, 6, 11, .2)),
    linear-gradient(180deg, rgba(3, 7, 12, .16), rgba(3, 7, 12, .015) 44%, rgba(3, 7, 12, .28));
  transition: background-color .7s ease, opacity .7s ease;
}

.rcf8-vignette {
  z-index: -4;
  box-shadow: inset 0 0 15vw 2.5vw rgba(0, 3, 8, .46);
  pointer-events: none;
}

.rcf8-grid {
  z-index: -3;
  opacity: 0;
  background-image:
    linear-gradient(rgba(187, 200, 210, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(187, 200, 210, .04) 1px, transparent 1px);
  background-size: 5.4vw 5.4vw;
  mask-image: linear-gradient(to bottom, transparent 12%, #000 38%, #000 82%, transparent 100%);
  animation: rcf8-grid-in 1.4s .4s ease-out forwards;
  transition: opacity .55s ease;
}

.rcf8-market-layer {
  z-index: -2;
  overflow: hidden;
  pointer-events: none;
}

.rcf8-market-line {
  position: absolute;
  left: -5%;
  top: 39%;
  width: 110%;
  height: 29%;
  overflow: visible;
  opacity: 0;
  animation: rcf8-atmosphere-in 1.4s 1.8s ease-out forwards;
  transition: opacity .45s ease, transform .8s cubic-bezier(.25, .8, .2, 1);
}

.rcf8-market-line path {
  fill: none;
  stroke: rgba(205, 213, 219, .24);
  stroke-width: 1.15;
  vector-effect: non-scaling-stroke;
  animation: rcf8-line-drift 24s ease-in-out 2.5s infinite alternate;
}

.rcf8-market-line path:last-of-type {
  stroke: rgba(136, 34, 50, .3);
  stroke-width: .8;
}

.rcf8-market-line circle {
  fill: #c1cbd1;
  opacity: .22;
  animation: rcf8-point-pulse 5.8s ease-in-out infinite;
}

.rcf8-market-line circle:nth-of-type(2) { animation-delay: 1.9s; }
.rcf8-market-line circle:nth-of-type(3) { animation-delay: 3.6s; }

.rcf8-candles {
  position: absolute;
  left: 4%;
  right: 4%;
  top: 45%;
  height: 27%;
  opacity: 0;
  animation:
    rcf8-atmosphere-in 1.4s 1.8s ease-out forwards,
    rcf8-candle-drift 30s 2.8s linear infinite alternate;
  transition: opacity .45s ease;
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 27%, transparent 42%, transparent 58%, #000 73%, #000 100%);
  mask-image: linear-gradient(90deg, #000 0%, #000 27%, transparent 42%, transparent 58%, #000 73%, #000 100%);
}

.rcf8-candle {
  position: absolute;
  left: var(--x);
  bottom: var(--base);
  width: 3px;
  height: var(--body);
  border: 1px solid rgba(199, 207, 213, .33);
  background: rgba(176, 188, 196, .08);
  transform: translateX(-50%);
}

.rcf8-candle::before {
  content: "";
  position: absolute;
  left: 50%;
  top: calc(var(--wick-top) * -1);
  bottom: calc(var(--wick-bottom) * -1);
  width: 1px;
  background: rgba(199, 207, 213, .28);
  transform: translateX(-50%);
}

.rcf8-candle.is-down {
  border-color: rgba(143, 38, 52, .46);
  background: rgba(143, 38, 52, .13);
}

.rcf8-candle.is-down::before {
  background: rgba(143, 38, 52, .38);
}

.rcf8-events {
  position: absolute;
  inset: 0;
  opacity: 0;
  animation: rcf8-atmosphere-in 1.2s 1.95s ease-out forwards;
}

.rcf8-event {
  position: absolute;
  left: var(--x);
  top: var(--y);
  height: 36px;
  border-left: 1px solid rgba(193, 202, 208, .17);
  color: rgba(214, 221, 225, .32);
  font: 560 .61rem/1.1 "SFMono-Regular", "Roboto Mono", "Aptos Mono", "Cascadia Mono", "IBM Plex Mono", Consolas, monospace;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.rcf8-event span {
  position: absolute;
  top: -14px;
  left: 5px;
}

.rcf8-live {
  position: absolute;
  z-index: 3;
  top: clamp(1.2rem, 3vw, 2.4rem);
  right: clamp(1.2rem, 3vw, 2.8rem);
  display: grid;
  justify-items: end;
  gap: .35rem;
  color: rgba(231, 237, 241, .72);
  font: 500 .7rem/1.35 "SFMono-Regular", "Roboto Mono", "Aptos Mono", "Cascadia Mono", "IBM Plex Mono", Consolas, monospace;
  letter-spacing: .075em;
  text-align: right;
  text-transform: uppercase;
  opacity: 0;
  animation: rcf8-copy-in .85s 1.65s ease-out forwards;
}

.rcf8-live strong {
  color: #f2f5f6;
  font-weight: 650;
  letter-spacing: .1em;
}

.rcf8-live-dot {
  display: inline-block;
  width: .46rem;
  height: .46rem;
  margin-right: .48rem;
  border-radius: 50%;
  background: #a93243;
  box-shadow: 0 0 0 0 rgba(169, 50, 67, .3);
  animation: rcf8-live-pulse 5s 2.6s ease-out infinite;
}

.rcf8-brand {
  position: absolute;
  z-index: 4;
  left: 47%;
  top: 43%;
  width: min(72vw, 900px);
  text-align: center;
  transform: translate(-50%, -50%);
  transition: opacity .55s ease, transform .75s cubic-bezier(.2, .8, .2, 1);
}

.rcf8-lockup {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(.8rem, 2.2vw, 1.9rem);
  width: 100%;
}

.rcf8-wing {
  width: clamp(56px, 9vw, 126px);
  height: 24px;
  overflow: visible;
  flex: 0 1 auto;
}

.rcf8-wing path {
  fill: none;
  stroke: rgba(223, 229, 232, .36);
  stroke-width: .8;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 220;
  stroke-dashoffset: 220;
  animation: rcf8-wing-draw .9s .7s cubic-bezier(.2, .8, .2, 1) forwards;
}

.rcf8-wing--right {
  transform: scaleX(-1);
}

.rcf8-wordmark {
  margin: 0;
  color: transparent;
  font-family: "Arial Narrow", "Aptos Narrow", "Roboto Condensed", "Helvetica Neue Condensed", "Nimbus Sans Narrow", "Liberation Sans Narrow", sans-serif;
  font-size: clamp(4.5rem, 10.5vw, 9.6rem);
  font-stretch: condensed;
  font-weight: 560;
  line-height: .82;
  letter-spacing: -.062em;
  text-shadow: none;
  filter: drop-shadow(0 2px 8px rgba(0, 3, 8, .44));
  opacity: 0;
  transform: translateY(8px);
  animation: rcf8-wordmark-in .8s 1s cubic-bezier(.2, .75, .2, 1) forwards;
}

.rcf8-wordmark .rcf8-letters {
  color: rgba(239, 243, 245, .69);
  -webkit-text-fill-color: rgba(239, 243, 245, .69);
  -webkit-text-stroke: .45px rgba(255, 255, 255, .15);
}

.rcf8-wordmark .rcf8-eight {
  display: inline-block;
  margin-left: .055em;
  color: rgba(143, 38, 52, .77);
  -webkit-text-fill-color: rgba(143, 38, 52, .77);
  -webkit-text-stroke: .4px rgba(196, 81, 96, .14);
  font-weight: 640;
}

.rcf8-subtitle {
  margin: clamp(1.15rem, 2.4vh, 1.7rem) 0 0;
  color: rgba(239, 243, 245, .88);
  font-size: clamp(.93rem, 1.55vw, 1.28rem);
  font-weight: 540;
  letter-spacing: clamp(.15em, .36vw, .28em);
  text-transform: uppercase;
  opacity: 0;
  animation: rcf8-copy-in .8s 1.3s ease-out forwards;
}

.rcf8-descriptor {
  margin: .72rem 0 0;
  color: rgba(194, 203, 209, .67);
  font: 500 clamp(.68rem, .95vw, .82rem)/1.5 "SFMono-Regular", "Roboto Mono", "Aptos Mono", "Cascadia Mono", "IBM Plex Mono", Consolas, monospace;
  letter-spacing: .2em;
  text-transform: uppercase;
  opacity: 0;
  animation: rcf8-copy-in .8s 1.6s ease-out forwards;
}

.rcf8-enter {
  position: relative;
  min-width: 194px;
  min-height: 45px;
  margin-top: clamp(1.6rem, 4vh, 2.5rem);
  padding: .76rem 1.15rem;
  border: 1px solid rgba(226, 232, 235, .42);
  border-radius: 0;
  color: rgba(242, 245, 246, .94);
  background: rgba(4, 9, 14, .23);
  backdrop-filter: blur(3px);
  font: 560 .76rem/1 "SFMono-Regular", "Roboto Mono", "Aptos Mono", "Cascadia Mono", "IBM Plex Mono", Consolas, monospace;
  letter-spacing: .115em;
  text-transform: uppercase;
  cursor: pointer;
  opacity: 0;
  animation: rcf8-copy-in .8s 2s ease-out forwards;
  transition: color .24s ease, border-color .24s ease, background-color .24s ease;
}

.rcf8-enter::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 23%;
  height: 1px;
  background: var(--rcf8-crimson);
  transition: width .35s ease;
}

.rcf8-enter:hover,
.rcf8-enter:focus-visible {
  border-color: rgba(239, 243, 245, .78);
  color: #fff;
  background: rgba(20, 27, 32, .46);
  outline: none;
}

.rcf8-enter:hover::after,
.rcf8-enter:focus-visible::after {
  width: 100%;
}

.rcf8-ribbon {
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  bottom: 0;
  min-height: 54px;
  border-top: 1px solid rgba(202, 211, 216, .16);
  background: rgba(3, 7, 11, .76);
  backdrop-filter: blur(8px);
  opacity: 0;
  transform: translateY(10px);
  animation: rcf8-ribbon-in .8s 2.2s ease-out forwards;
}

.rcf8-ribbon-track {
  display: flex;
  align-items: stretch;
  width: 100%;
  min-height: 54px;
  overflow: hidden;
}

.rcf8-ribbon-item {
  display: grid;
  grid-template-columns: auto auto auto;
  align-content: center;
  gap: .4rem;
  min-width: 0;
  flex: 1 1 0;
  padding: .55rem clamp(.65rem, 1.25vw, 1.2rem);
  border-right: 1px solid rgba(203, 211, 216, .13);
  color: inherit;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .2s ease;
}

.rcf8-ribbon-item:last-child {
  border-right: 0;
}

.rcf8-ribbon-item:hover,
.rcf8-ribbon-item:focus-visible {
  background: rgba(143, 38, 52, .12);
  outline: none;
}

.rcf8-ribbon-label {
  color: rgba(176, 188, 196, .7);
  font: 540 .64rem/1.25 "SFMono-Regular", "Roboto Mono", "Aptos Mono", "Cascadia Mono", "IBM Plex Mono", Consolas, monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.rcf8-ribbon-value {
  color: rgba(239, 243, 245, .94);
  font: 580 .78rem/1.15 "SFMono-Regular", "Roboto Mono", "Aptos Mono", "Cascadia Mono", "IBM Plex Mono", Consolas, monospace;
  font-variant-numeric: tabular-nums;
}

.rcf8-ribbon-direction {
  color: #9dabb3;
  font: 580 .74rem/1.15 "SFMono-Regular", "Roboto Mono", "Aptos Mono", "Cascadia Mono", "IBM Plex Mono", Consolas, monospace;
}

.rcf8-ribbon-direction.is-up,
.rcf8-ribbon-direction.is-down {
  color: #a84957;
}

.rcf8-atmosphere-note {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

.rcf8-landing.is-cta-hover .rcf8-grid {
  opacity: .16;
}

.rcf8-landing.is-cta-hover .rcf8-candles,
.rcf8-landing.is-cta-hover .rcf8-market-line {
  opacity: .28;
}

.rcf8-landing.is-cta-hover .rcf8-market-line {
  transform: translateX(1.2%);
}

.rcf8-landing.is-entering .rcf8-brand {
  opacity: 0;
  transform: translate(-50%, -54%) scale(.985);
}

.rcf8-landing.is-entering .rcf8-live,
.rcf8-landing.is-entering .rcf8-ribbon {
  opacity: 0;
  transition: opacity .3s ease;
}

.rcf8-landing.is-entering .rcf8-tone {
  opacity: 1;
  background-color: rgba(0, 3, 7, .45);
}

.rcf8-landing.is-entering .rcf8-grid {
  opacity: .22;
}

.rcf8-landing.is-entering .rcf8-candles {
  opacity: .34;
}

.rcf8-landing.is-entering .rcf8-market-line {
  opacity: .52;
  transform: scaleX(1.16);
}

body.rcf8-terminal-ready .app-shell {
  animation: rcf8-terminal-reveal .65s ease-out both;
}

@keyframes rcf8-video-in {
  to { opacity: 1; }
}

@keyframes rcf8-grid-in {
  to { opacity: .1; }
}

@keyframes rcf8-atmosphere-in {
  to { opacity: .17; }
}

@keyframes rcf8-wing-draw {
  to { stroke-dashoffset: 0; }
}

@keyframes rcf8-wordmark-in {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes rcf8-copy-in {
  to { opacity: 1; }
}

@keyframes rcf8-ribbon-in {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes rcf8-candle-drift {
  from { transform: translateX(-.5%); }
  to { transform: translateX(.8%); }
}

@keyframes rcf8-line-drift {
  from { transform: translateX(-.4%); }
  to { transform: translateX(.65%); }
}

@keyframes rcf8-point-pulse {
  0%, 78%, 100% { opacity: .16; r: 2.2px; }
  86% { opacity: .52; r: 3.2px; }
}

@keyframes rcf8-live-pulse {
  0%, 82%, 100% { box-shadow: 0 0 0 0 rgba(169, 50, 67, .3); }
  90% { box-shadow: 0 0 0 6px rgba(169, 50, 67, 0); }
}

@keyframes rcf8-terminal-reveal {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 760px) {
  .rcf8-media,
  .rcf8-video {
    background-position: 58% center;
    object-position: 58% center;
  }

  .rcf8-tone {
    background:
      linear-gradient(180deg, rgba(3, 7, 12, .23), rgba(3, 7, 12, .035) 42%, rgba(3, 7, 12, .34)),
      linear-gradient(90deg, rgba(3, 7, 12, .18), rgba(3, 7, 12, .04), rgba(3, 7, 12, .18));
  }

  .rcf8-vignette {
    box-shadow: inset 0 0 28vw 5vw rgba(0, 3, 8, .52);
  }

  .rcf8-grid {
    background-size: 18vw 18vw;
    opacity: .045;
  }

  .rcf8-brand {
    left: 50%;
    top: 43%;
    width: 92vw;
  }

  .rcf8-lockup {
    gap: .55rem;
  }

  .rcf8-wing {
    width: clamp(34px, 11vw, 52px);
  }

  .rcf8-wordmark {
    font-size: clamp(4.1rem, 23vw, 6rem);
  }

  .rcf8-subtitle {
    max-width: 18rem;
    margin-left: auto;
    margin-right: auto;
    font-size: .82rem;
    line-height: 1.55;
    letter-spacing: .17em;
  }

  .rcf8-descriptor {
    font-size: .63rem;
    letter-spacing: .13em;
  }

  .rcf8-live {
    top: 1rem;
    right: 1rem;
    font-size: .6rem;
  }

  .rcf8-events {
    display: none;
  }

  .rcf8-candles {
    left: 10%;
    right: 10%;
    top: 52%;
    opacity: .08;
  }

  .rcf8-candle:nth-child(n + 11) {
    display: none;
  }

  .rcf8-market-line {
    top: 48%;
    opacity: .09;
  }

  .rcf8-ribbon {
    min-height: 64px;
  }

  .rcf8-ribbon-track {
    min-height: 64px;
  }

  .rcf8-ribbon-item {
    grid-template-columns: 1fr auto;
    gap: .2rem .35rem;
    padding: .6rem .55rem;
  }

  .rcf8-ribbon-item:nth-child(n + 5) {
    display: none;
  }

  .rcf8-ribbon-label {
    grid-column: 1 / -1;
    font-size: .54rem;
    letter-spacing: .04em;
  }

  .rcf8-ribbon-value,
  .rcf8-ribbon-direction {
    font-size: .67rem;
  }
}

@media (max-height: 660px) and (min-width: 761px) {
  .rcf8-brand { top: 40%; }
  .rcf8-enter { margin-top: 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .rcf8-video {
    display: none;
  }

  .rcf8-grid,
  .rcf8-market-line,
  .rcf8-candles,
  .rcf8-events,
  .rcf8-live,
  .rcf8-wordmark,
  .rcf8-subtitle,
  .rcf8-descriptor,
  .rcf8-enter,
  .rcf8-ribbon {
    animation: none !important;
  }

  .rcf8-grid { opacity: .06; }
  .rcf8-market-line { opacity: .1; }
  .rcf8-candles { opacity: .07; }
  .rcf8-events { opacity: .08; }
  .rcf8-live,
  .rcf8-wordmark,
  .rcf8-subtitle,
  .rcf8-descriptor,
  .rcf8-enter,
  .rcf8-ribbon { opacity: 1; transform: none; }
  .rcf8-wing path { animation: none; stroke-dashoffset: 0; }
  .rcf8-live-dot { animation: none; }
}
