/* ============================================================
   LFT v3 — AI dial at 10. Builds on the v2 system.
   ============================================================ */
@import url("lft-styles-v2.css");

/* ---------- scroll progress beam ---------- */
.progress-beam {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  z-index: 60;
  background: var(--amber);
  transform: scaleX(0);
  transform-origin: left;
  pointer-events: none;
}

/* ---------- full-page blueprint grid ---------- */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    repeating-linear-gradient(0deg, rgba(168, 181, 196, 0.04) 0 1px, transparent 1px 72px),
    repeating-linear-gradient(90deg, rgba(168, 181, 196, 0.04) 0 1px, transparent 1px 72px);
}
.nav, .hero, .section, .final, footer { position: relative; z-index: 1; }

/* ---------- hero: boot line + decode ---------- */
.hero-boot {
  font-family: var(--mono);
  font-size: calc(13px * var(--scale));
  color: var(--muted);
  margin-top: 30px;
  letter-spacing: 0.04em;
}
.hero-boot .ok { color: var(--amber); }
.hero-boot .caret {
  display: inline-block;
  width: 8px;
  height: 14px;
  background: var(--muted);
  vertical-align: -2px;
  margin-left: 3px;
}
@media (prefers-reduced-motion: no-preference) {
  .hero-boot .caret { animation: caretblink 1s steps(1) infinite; }
  @keyframes caretblink { 50% { opacity: 0; } }
}
.hero h1 [data-decode] { white-space: nowrap; }

/* Viewport guard: kill any stray horizontal bleed (e.g. transient decode
   width on iOS Safari). overflow-x:hidden on the root keeps sticky nav. */
html { overflow-x: hidden; }
body { max-width: 100%; }

/* stronger glow at dial 10 */
.hero-glow {
  background: radial-gradient(ellipse at center,
    rgba(255, 157, 46, 0.09) 0%,
    rgba(13, 27, 46, 0.0) 58%);
}

/* ---------- kicker index ---------- */
.kicker .idx { color: var(--amber); }
html[data-amber="strict"] .kicker .idx { color: var(--muted); }

/* ---------- HUD corner brackets on cards ---------- */
.card { position: relative; }
.card::before, .card::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  pointer-events: none;
  opacity: 0.85;
}
.card::before {
  top: -1px;
  left: -1px;
  border-top: 1px solid var(--muted);
  border-left: 1px solid var(--muted);
}
.card::after {
  bottom: -1px;
  right: -1px;
  border-bottom: 1px solid var(--muted);
  border-right: 1px solid var(--muted);
}
html[data-amber="standard"] .card::before,
html[data-amber="standard"] .card::after {
  border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
}

/* card tilt (JS-driven) */
.card, .force-card { transition: transform 0.18s ease, box-shadow 0.25s ease; will-change: transform; }
.card.is-tilting, .force-card.is-tilting { box-shadow: 0 18px 48px rgba(0, 0, 0, 0.5); }

/* ---------- traveling beam on raised sections ---------- */
.section-raise { position: relative; overflow: hidden; }
.section-raise::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 240px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 157, 46, 0.8), transparent);
  opacity: 0;
}
@media (prefers-reduced-motion: no-preference) {
  html[data-motion="full"] .section-raise::after {
    opacity: 1;
    animation: beamtravel 7s linear infinite;
  }
  @keyframes beamtravel {
    from { transform: translateX(-260px); }
    to { transform: translateX(100vw); }
  }
}

/* ---------- orb auras ---------- */
.orb-aura {
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  background: conic-gradient(from 0deg,
    transparent 0deg,
    rgba(255, 157, 46, 0.0) 220deg,
    rgba(255, 157, 46, 0.75) 300deg,
    transparent 360deg);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
}
html[data-amber="strict"] .orb-aura {
  background: conic-gradient(from 0deg,
    transparent 0deg,
    rgba(168, 181, 196, 0.0) 220deg,
    rgba(168, 181, 196, 0.75) 300deg,
    transparent 360deg);
}
@media (prefers-reduced-motion: no-preference) {
  html[data-motion="full"] .orb-aura { animation: spin 5s linear infinite; }
}

/* ---------- perimeter radar sweep ---------- */
.peri-svg .sweep {
  fill: rgba(255, 157, 46, 0.06);
}
html[data-amber="strict"] .peri-svg .sweep { fill: rgba(168, 181, 196, 0.06); }
@media (prefers-reduced-motion: no-preference) {
  html[data-motion="full"] .peri-svg .sweep {
    animation: spin 9s linear infinite;
    transform-origin: 230px 205px;
    transform-box: view-box;
  }
}

/* ---------- flow svg data dots ---------- */
.flow-svg .data-dot { fill: var(--amber); }
html[data-amber="strict"] .flow-svg .data-dot { fill: var(--muted); }

/* ---------- stats glow ---------- */
.stat .v { text-shadow: 0 0 28px rgba(255, 157, 46, 0.35); }

/* ---------- final CTA: stronger field ---------- */
.final::before {
  background: radial-gradient(ellipse at center, rgba(255, 157, 46, 0.12), transparent 62%);
}

/* ---------- calm-mode kill switches ---------- */
html[data-motion="calm"] .orb-aura,
html[data-motion="calm"] .peri-svg .sweep,
html[data-motion="calm"] .section-raise::after,
html[data-motion="calm"] .hero-boot .caret {
  animation: none;
}
html[data-motion="calm"] .section-raise::after { opacity: 0; }
html[data-motion="calm"] .flow-svg .data-dot { display: none; }