/* ==========================================================
   v3-only HUD redesign: replace radar sweep with segmented
   orbital arcs, vertical scanner, crosshair, particle motes.
   Loaded AFTER cover-v2-extras.css so it overrides freely.
   ========================================================== */

/* Segmented orbital arcs — counter-rotating, broken (not full circles) */
.hv3__orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  pointer-events: none;
  filter: drop-shadow(0 0 6px rgba(204, 255, 0, 0.20));
}
.hv3__orbit--inner {
  width: 400px;
  height: 400px;
  margin: -200px 0 0 -200px;
  animation: hv3-spin-cw 38s linear infinite;
}
.hv3__orbit--outer {
  width: 540px;
  height: 540px;
  margin: -270px 0 0 -270px;
  animation: hv3-spin-ccw 64s linear infinite;
  opacity: 0.85;
}
@keyframes hv3-spin-cw {
  to { transform: rotate(360deg); }
}
@keyframes hv3-spin-ccw {
  to { transform: rotate(-360deg); }
}

/* Vertical scanline — thin lime line travels top → bottom across Dale */
.hv3__scanline {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 360px;
  height: 460px;
  margin: -230px 0 0 -180px;
  pointer-events: none;
  overflow: hidden;
  border-radius: 6px;
  z-index: 3;
}
.hv3__scanline::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -8px;
  height: 2px;
  background: linear-gradient(180deg,
    rgba(204, 255, 0, 0) 0%,
    rgba(204, 255, 0, 0.55) 45%,
    rgba(204, 255, 0, 0.95) 50%,
    rgba(204, 255, 0, 0.55) 55%,
    rgba(204, 255, 0, 0) 100%);
  box-shadow: 0 0 18px rgba(204, 255, 0, 0.6),
              0 0 6px rgba(204, 255, 0, 0.9);
  animation: hv3-scan 7.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
.hv3__scanline::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -32px;
  height: 64px;
  background: linear-gradient(180deg,
    rgba(204, 255, 0, 0) 0%,
    rgba(204, 255, 0, 0.05) 60%,
    rgba(204, 255, 0, 0.12) 100%);
  animation: hv3-scan 7.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes hv3-scan {
  0%   { transform: translateY(0);    opacity: 0; }
  8%   { opacity: 1; }
  92%  { opacity: 1; }
  100% { transform: translateY(490px); opacity: 0; }
}

/* Crosshair — faint guide lines through Dale's center */
.hv3__cross {
  position: absolute;
  left: 50%;
  top: 50%;
  pointer-events: none;
  background:
    linear-gradient(90deg,
      rgba(204, 255, 0, 0) 0%,
      rgba(204, 255, 0, 0.10) 8%,
      rgba(204, 255, 0, 0.16) 50%,
      rgba(204, 255, 0, 0.10) 92%,
      rgba(204, 255, 0, 0) 100%);
}
.hv3__cross--h {
  width: 480px;
  height: 1px;
  margin: 0 0 0 -240px;
}
.hv3__cross--v {
  width: 1px;
  height: 540px;
  margin: -270px 0 0 0;
  background:
    linear-gradient(180deg,
      rgba(204, 255, 0, 0) 0%,
      rgba(204, 255, 0, 0.10) 8%,
      rgba(204, 255, 0, 0.16) 50%,
      rgba(204, 255, 0, 0.10) 92%,
      rgba(204, 255, 0, 0) 100%);
}

/* Tick marks at the crosshair endpoints */
.hv3__cross--h::before,
.hv3__cross--h::after {
  content: '';
  position: absolute;
  top: -3px;
  width: 1px;
  height: 7px;
  background: rgba(204, 255, 0, 0.45);
}
.hv3__cross--h::before { left: 0; }
.hv3__cross--h::after  { right: 0; }
.hv3__cross--v::before,
.hv3__cross--v::after {
  content: '';
  position: absolute;
  left: -3px;
  width: 7px;
  height: 1px;
  background: rgba(204, 255, 0, 0.45);
}
.hv3__cross--v::before { top: 0; }
.hv3__cross--v::after  { bottom: 0; }

/* Particle motes — tiny data fragments drifting around Dale */
.hv3__motes {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.hv3__mote {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: rgba(204, 255, 0, 0.7);
  box-shadow: 0 0 8px rgba(204, 255, 0, 0.55);
  opacity: 0;
  animation: hv3-mote-drift var(--t, 12s) ease-in-out infinite;
  animation-delay: var(--d, 0s);
}
.hv3__mote--big {
  width: 4px;
  height: 4px;
  background: rgba(204, 255, 0, 0.85);
  box-shadow: 0 0 12px rgba(204, 255, 0, 0.7),
              0 0 3px rgba(204, 255, 0, 1);
}
@keyframes hv3-mote-drift {
  0%   { transform: translate(0, 0)        scale(0.6); opacity: 0; }
  20%  { opacity: 0.9; }
  50%  { transform: translate(-14px, -22px) scale(1);  opacity: 1; }
  80%  { opacity: 0.7; }
  100% { transform: translate(8px, -40px)  scale(0.5); opacity: 0; }
}

/* Hide the original v2 sweep/ring/reticle elements if any survive in DOM */
.hv2__hud-sweep,
.hv2__hud-ring,
.hv2__hud-reticle { display: none !important; }

/* ==========================================================
   SIMPLIFY: strip the tactical HUD chrome entirely.
   Just Dale + chat + a glow behind the chat.
   ========================================================== */
.hv3__orbit,
.hv3__scanline,
.hv3__cross,
.hv3__motes,
.hv2__hud-net,
.hv2__hud-status,
.hv2__hud-tele { display: none !important; }
/* Show all chips at all viewports, layered ABOVE Dale */
.hv2__hud-node {
  display: flex !important;
  z-index: 10 !important;
}
.hv2__hud { z-index: 6 !important; }

/* Dale — flush with viewport right edge, sized to match target, gently floating */
.hv2__dale {
  left: auto !important;
  right: calc(-3% + 76px) !important;
  top: 50% !important;
  width: 240px !important;
  max-width: 18vw !important;
  opacity: 1 !important;
  filter: drop-shadow(0 30px 80px rgba(204,255,0,0.22)) !important;
  transform: translate(0, calc(-50% + 24px)) !important;
  animation: hv3-dale-float 6.5s ease-in-out infinite !important;
  z-index: 4 !important;
}
@keyframes hv3-dale-float {
  0%, 100% { transform: translate(0, calc(-50% + 24px)); }
  50%      { transform: translate(0, calc(-50% + 10px)); }
}

/* The chat lights up — soft lime halo radiating from behind */
.hv2__chat {
  isolation: isolate;
  left: 50% !important;
  right: auto !important;
  transform: translate(calc(-50% + 113px), calc(-50% + 38px)) !important;
  animation: none !important;
  width: 600px !important;
  max-width: 57vw !important;
  z-index: 5 !important;
}
.hv2__chat-body {
  padding-bottom: 54px !important;
}
.hv2__chat::before {
  content: '';
  position: absolute;
  inset: -80px -90px;
  background:
    radial-gradient(ellipse at center,
      rgba(204, 255, 0, 0.32) 0%,
      rgba(204, 255, 0, 0.18) 22%,
      rgba(204, 255, 0, 0.08) 45%,
      rgba(204, 255, 0, 0) 70%);
  filter: blur(12px);
  z-index: -1;
  pointer-events: none;
  animation: hv3-chat-glow 4.5s ease-in-out infinite;
}
.hv2__chat::after {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 18px;
  box-shadow:
    0 0 0 1px rgba(204, 255, 0, 0.18),
    0 0 40px rgba(204, 255, 0, 0.25),
    0 0 80px rgba(204, 255, 0, 0.18),
    0 20px 60px rgba(0, 0, 0, 0.5);
  pointer-events: none;
  z-index: -1;
}
@keyframes hv3-chat-glow {
  0%, 100% { opacity: 0.85; transform: scale(1); }
  50%      { opacity: 1;    transform: scale(1.04); }
}

@media (max-width: 1280px) {
  .hv2__dale {
    width: 280px !important;
    right: 3% !important;
  }
}
@media (max-width: 1100px) {
  .hv2__dale {
    width: 220px !important;
    right: -2% !important;
    display: block !important;
  }
}
@media (max-width: 820px) {
  .hv2__dale { display: none !important; }
}

/* Responsive: scale orbital chrome down on tablet, hide on phone */
@media (max-width: 1280px) {
  .hv3__orbit--inner { width: 340px; height: 340px; margin: -170px 0 0 -170px; }
  .hv3__orbit--outer { width: 460px; height: 460px; margin: -230px 0 0 -230px; }
  .hv3__scanline { width: 300px; height: 400px; margin: -200px 0 0 -150px; }
  .hv3__cross--h { width: 420px; margin-left: -210px; }
  .hv3__cross--v { height: 460px; margin-top: -230px; }
}
@media (max-width: 1100px) {
  .hv3__orbit,
  .hv3__scanline,
  .hv3__cross,
  .hv3__motes { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hv3__orbit--inner,
  .hv3__orbit--outer,
  .hv3__scanline::before,
  .hv3__scanline::after,
  .hv3__mote { animation: none; }
  .hv3__mote { opacity: 0.6; }
}

/* ============================================================
   V6.1 MOBILE DENSITY PASS
   CSS only. No HTML change. New breakpoint: 640px.
   Cascade note: index.html's inline <style> loads AFTER all three
   stylesheets, and sets several of these properties with !important
   at max-width:1100px. Selectors below are deliberately scoped to a
   parent (.cv-top / .hv2) to raise specificity above those inline
   rules, since source order alone would lose.
   ============================================================ */
@media (max-width: 640px) {

  /* --- C1: nav CTA never wraps again --- */
  /* beats inline `.cv-nav__cta { font-size/padding !important }` (0-1-0) */
  .cv-top .cv-nav--right .cv-nav__cta {
    white-space: nowrap !important;
    font-size: 13px !important;
    padding: 10px 16px !important;
    min-height: 46px !important;   /* tap target floor is 44px; 46 gives
                                      subpixel headroom - measured 43.99 at 44 */
    box-sizing: border-box !important;
    gap: 6px !important;
    flex: 0 0 auto !important;
  }
  .cv-top .cv-nav--right .cv-nav__cta svg {
    width: 11px !important;
    height: 11px !important;
    flex: 0 0 auto !important;
  }

  /* --- C2: LINK label + badge, scaled down, never hidden --- */
  .cv-top .cv-nav--right .cv-nav__link--new {
    font-size: 10px !important;
    white-space: nowrap !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
  }
  .cv-top .cv-nav--right .cv-nav__link--new .cv-nav__link-new {
    font-size: 9px !important;
    letter-spacing: 0.04em !important;
    padding: 2px 5px !important;
    margin-left: 5px !important;
    white-space: nowrap !important;
  }

  /* --- C1/C2 support: let the wordmark yield space, not overflow --- */
  header.cv-top {
    padding: 10px 14px !important;
    gap: 10px !important;
  }
  .cv-top .cv-logo {
    flex: 0 1 auto !important;
    min-width: 0 !important;
  }
  .cv-top .cv-logo img {
    max-width: 100% !important;
  }
  .cv-top .cv-nav--right {
    gap: 10px !important;
    min-width: 0 !important;
  }

  /* --- C3: eyebrow pill. Tracking is the main offender, cut it first. --- */
  .hv2 .hv2__pitch .hv2__eyebrow {
    font-size: 10px !important;
    letter-spacing: 0.02em !important;
    padding: 8px 12px !important;
    border-radius: 14px !important;   /* 999px reads as a lozenge once it is 2 rows */
    flex-wrap: wrap !important;
    align-items: center !important;
    row-gap: 8px !important;
    margin-bottom: 20px !important;
  }
  /* badge onto its own row without touching the HTML */
  .hv2 .hv2__pitch .hv2__eyebrow .hv2__eyebrow-new {
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    align-self: flex-start !important;
    width: auto !important;
    font-size: 0.62rem !important;
    padding: 3px 8px !important;
  }

  /* --- C4: hero paragraph. Trailing SEO sentence STAYS in the DOM. --- */
  /* beats inline `.hv2__lede { font-size:1.05rem !important }` (0-1-0) */
  .hv2 .hv2__pitch .hv2__lede {
    font-size: 0.9rem !important;    /* was 1.05rem at this width, -14.3% */
    line-height: 1.45 !important;
    margin-bottom: 26px !important;
  }
}