/* ══ GENESIS — effects.css · Welle-2-Effekte (E1/E5/E8/E9) ══
   Debug: jeder Effekt via ?fx-off=cursor,margins,odometer,xray einzeln aus. */

/* ── E1 · Magnetischer Cursor + Staubschweif (nur pointer:fine) ── */
.fx-cursor, .fx-cursor * { cursor: none !important; }
.cur__dot {
  position: fixed; top: -3px; left: -3px; width: 6px; height: 6px;
  border-radius: 50%; background: var(--brass-disp);
  z-index: 90; pointer-events: none; opacity: 0;
}
.cur__ring {
  position: fixed; top: -16px; left: -16px; width: 32px; height: 32px;
  border: 1px solid color-mix(in srgb, var(--brass) 60%, transparent);
  border-radius: 50%; box-sizing: border-box;
  z-index: 90; pointer-events: none; opacity: 0;
  transition: width .25s var(--ease-out), height .25s var(--ease-out),
              top .25s var(--ease-out), left .25s var(--ease-out), border-color .25s;
}
.cur__ring.on {
  width: 44px; height: 44px; top: -22px; left: -22px;
  border-color: var(--brass-srf);
}
.cur__trail { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 89; pointer-events: none; }
.mag { transition: translate .3s var(--ease-out); }
@media (pointer: coarse) { .cur__dot, .cur__ring, .cur__trail { display: none; } }

/* ── Teil C · Ember-Schleier: fotografische Glut hinter dem Orb ──
   (Higgsfield-Still, multiply auf Papier; Opazität scroll-gekoppelt
   via --ev aus main.js; ?fx-off=ember) */
.ember-veil {
  position: fixed; left: 68%; top: 43%; z-index: 0;
  width: min(72vmin, 740px); aspect-ratio: 1.78;
  translate: -50% -50%;
  pointer-events: none;
  opacity: var(--ev, 0);
  mix-blend-mode: multiply;
}
.ember-veil img {
  width: 100%; height: 100%; object-fit: cover;
  -webkit-mask-image: radial-gradient(50% 50% at 50% 50%, #000 28%, transparent 70%);
  mask-image: radial-gradient(50% 50% at 50% 50%, #000 28%, transparent 70%);
}
body.fx-off-ember .ember-veil, body.no-webgl .ember-veil { display: none; }

/* ── P3/P4 · Deko-Rauten + Neural-Web (fx-nodes.js, ?fx-off=nodes) ── */
.nodes__cv { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.hs-deco { width: var(--hd, 12px); height: var(--hd, 12px); pointer-events: none; }
.hs-deco i {
  display: block; width: 100%; height: 100%;
  border: 1px solid color-mix(in srgb, var(--brass) 62%, transparent);
  background: color-mix(in srgb, var(--brass-srf) 14%, transparent);
  transform: rotate(45deg);
}
@media (max-width: 760px) { .hs-deco { display: none; } }

/* ── P5 · Wortmarke: endloser Sheen-Lauf S→I (?fx-off=sheen) ── */
.nav__mark { position: relative; }
.nav__mark::after {
  content: "SOVEREIGN\00a0AI";
  position: absolute; inset: 0; pointer-events: none;
  color: transparent;
  background: linear-gradient(102deg,
      transparent 34%,
      color-mix(in srgb, var(--brass-srf) 55%, #fff8e6) 45%,
      #fff3d4 50%,
      color-mix(in srgb, var(--brass-srf) 55%, #fff8e6) 55%,
      transparent 66%) 0 0 / 260% 100% no-repeat;
  -webkit-background-clip: text; background-clip: text;
  animation: markSheen 5.6s linear infinite;
}
body.fx-off-sheen .nav__mark::after { display: none; }
@keyframes markSheen {
  0%        { background-position: 132% 0; }
  46%, 100% { background-position: -32% 0; }
}

/* ── P9 · Gold-Finish: satter Verlauf + warmer Schimmer (AA-Large ≥3:1) ── */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .hero__l3 b, .pilot__h2 b {
    background: linear-gradient(178deg, #ad7d18 8%, var(--brass-disp) 52%, #8f6a15 94%);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}
.hero__l3 b, .pilot__h2 b,
.proof__it:first-child dd b, .ctl__count b,
.pipe__st:nth-child(6) .pipe__no {
  text-shadow: 0 2px 26px color-mix(in srgb, var(--brass-srf) 42%, transparent);
}

/* ── E5 · Marginalien-Spur (linke Kante — rechts läuft die Rail) ── */
.marg {
  position: fixed; left: .35rem; top: 0; bottom: 0; z-index: 40;
  display: none; pointer-events: none;
  writing-mode: vertical-rl; transform: rotate(180deg);
  font-size: .74rem; letter-spacing: .14em;   /* P6: präsenter */
  color: color-mix(in srgb, var(--fg-dim) 55%, var(--fg-faint));
}
@media (min-width: 1280px) { .marg { display: flex; justify-content: space-between; align-items: center; } }
.marg__top, .marg__clock {
  opacity: .8; transition: opacity .24s var(--ease-out), translate .24s var(--ease-out);
}
.marg__top.swap { opacity: 0; translate: 0 -8px; }
.marg__clock { font-variant-numeric: tabular-nums; }

/* ── E8 · Odometer-Trommeln ── */
.odo { display: inline-block; font-variant-numeric: tabular-nums; white-space: nowrap; }
.odo__d, .odo__c {
  display: inline-block; height: 1em; line-height: 1;
  overflow: hidden; vertical-align: bottom;
}
.odo__d { width: 1ch; }
.odo__r {
  display: block;
  transition-property: transform;
  transition-timing-function: cubic-bezier(.16, 1, .3, 1);
}
.odo__r span { display: block; height: 1em; line-height: 1; text-align: center; }
.odo__r--live { transition: transform .38s var(--ease-out); }

/* ── E9 · Röntgen-Hover auf der Konsole (P8: sichtbar inszeniert) ── */
.cq-f { position: relative; }
.cq-f[tabindex] { outline-offset: 2px; cursor: pointer; touch-action: manipulation; }
.cq-f[tabindex]:focus-visible { outline: 2px solid var(--brass); }
/* Affordance: durchleuchtbare Werte tragen eine gepunktete Messing-Linie */
.cq-f[data-fi] .cq-f__v {
  text-decoration: underline dotted color-mix(in srgb, var(--brass) 60%, transparent);
  text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.cq-f[data-fi]:hover { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brass) 45%, transparent); }
.console__xhint { color: var(--fg-dim); font-size: var(--fs-micro); }
.cq-f__scan {
  position: absolute; inset: 0; overflow: hidden;
  pointer-events: none; opacity: 0;
}
.cq-f.on .cq-f__scan { opacity: 1; }
.cq-f__scan::before {                       /* kräftiger Messing-Scan-Balken */
  content: ""; position: absolute; top: 0; bottom: 0; left: -26%; width: 22%;
  background: linear-gradient(90deg, transparent,
    color-mix(in srgb, var(--brass-srf) 72%, transparent) 42%,
    color-mix(in srgb, var(--brass) 80%, transparent) 50%,
    color-mix(in srgb, var(--brass-srf) 72%, transparent) 58%, transparent);
}
.cq-f__scan::after {                        /* Nachglühen: die Zeile bleibt „belichtet" */
  content: ""; position: absolute; inset: 0;
  background: color-mix(in srgb, var(--brass-srf) 16%, transparent);
  opacity: 0;
}
.cq-f.on .cq-f__scan::before { animation: xrScan 1.05s var(--ease-out) forwards; }
.cq-f.on .cq-f__scan::after { animation: xrWash .45s ease-out .3s forwards; }
@keyframes xrScan { to { left: 104%; } }
@keyframes xrWash { to { opacity: 1; } }
.xray {
  position: absolute; top: calc(100% + .4rem); left: 0; right: 0; z-index: 6;
  padding: .8rem 1rem;
  background: var(--paper, #f6f2e8); color: #1b1813;
  border: 1px solid rgba(27, 24, 19, .22); border-left: 3px solid var(--brass-srf);
  box-shadow: 0 14px 36px rgba(27, 24, 19, .26);
  font-size: .72rem; letter-spacing: .04em;
}
.xray__lbl { display: block; color: #7b5e28; margin-bottom: .35rem; }
.xray__txt { margin: 0; color: #5d574a; overflow-wrap: anywhere; }
.xray__txt mark {
  background: color-mix(in srgb, #c9a96b 38%, transparent);
  color: #1b1813; padding: 0 .15em;
}

/* ── Reduced Motion: Effekte degradieren statisch ── */
@media (prefers-reduced-motion: reduce) {
  .cq-f.on .cq-f__scan { opacity: 0; }
  .marg__top { transition: none; }
  .odo__r { transition: none !important; }
  .nav__mark::after { animation: none; opacity: 0; }   /* P5: Sheen aus */
}