/* ============================================================
   Company Presence — Produktionskomponente
   Konstruktion: visual-construction-guide.md
   Referenz: company-presence-blender-reference.png
   Identity: Glass #020912 · Eye #73F9FF · Smile #5CF6F3 · Metall/Aluminium.
   Workspace-Licht (--cp-workspace-*): Pool · Beam · Edge · Bounce · Glow.
   "Company changes no material. Company reflects its environment."
   ============================================================ */

.company-presence {
  /* Workspace-Licht — wechselt per Betriebsraum.
     Company changes no material. Company reflects its environment. */
  --company-accent: #00e5ff;
  --cp-workspace-glow:    var(--company-accent);
  --cp-workspace-halo:    var(--company-accent);
  --cp-workspace-energy:  var(--company-accent);
  --cp-workspace-bounce:  var(--company-accent);
  --cp-workspace-beam:    var(--company-accent);
  /* Leuchtstufen (intern) */
  --cp-ws-bright: color-mix(in srgb, var(--company-accent) 44%, white);
  --cp-ws-core:   color-mix(in srgb, var(--company-accent) 20%, white);
  /* @deprecated — Alias bis alle Referenzen migriert */
  --cp-glow: var(--cp-workspace-energy);

  /* Base Presence Amplitude (Focus dämpft auf 0.25) */
  --cp-presence-amp: 1;

  /* Identity (ändert sich nie) */
  --cp-eye: #73f9ff;
  --cp-smile: #5cf6f3;

  /* Theme-Stellschrauben (Dark = Default) */
  --cp-halo-opacity: 0.16;
  --cp-halo-core-opacity: 0.1;
  --cp-shadow-opacity: 0.55;
  --cp-glass-lift: 0;
  --cp-highlight-boost: 1;

  /* HUD-Ring: präzise technische Ebene, kein Glow. */
  --cp-dial-outer-line: color-mix(in srgb, var(--company-accent) 28%, transparent);
  --cp-dial-inner-line: color-mix(in srgb, var(--company-accent) 22%, transparent);
  --cp-dial-tick:       color-mix(in srgb, var(--company-accent) 40%, transparent);
  --cp-dial-halo-opacity: 0.1;

  /* Platform Material (Dark Default) */
  --cp-platform-side-top:     #2a3138;
  --cp-platform-side-mid:     #151a1f;
  --cp-platform-side-bot:     #060a0d;
  --cp-platform-top-ctr:      #1a2026;
  --cp-platform-top-mid:      #0f141a;
  --cp-platform-top-edge:     #060a0d;
  --cp-platform-shoulder-hi:  #4a525b;
  --cp-platform-shoulder-mid: #262d34;
  --cp-platform-shoulder-lo:  #0d1115;

  display: inline-grid;
  isolation: isolate;
  place-items: center;
  position: relative;
  width: var(--company-size);
}

.company-presence--sm { --company-size: 120px; }
.company-presence--md { --company-size: 188px; }
.company-presence--lg { --company-size: 280px; }

/* ---------- Base Presence Motion — Atmen + Schweben ----------
   Founder 2026-07-12: Der Orb war mathematisch animiert, aber unter der
   Wahrnehmungsschwelle (Scale ±0,15 %). Jetzt erkennbar LEBENDIG: die Amplitude
   der drei Kernbewegungen (Atmen · Schweben · Halo) angehoben, das Tempo bleibt
   langsam. Atmen (Scale) und Schweben (translateY) laufen mit UNTERSCHIEDLICHEN
   Perioden (28s / 22s) → sie beaten gegeneinander, die Quasiperiodizität bleibt.
   Ziel: nach 3–5 s erkennt ein aufmerksamer Nutzer Leben, ohne Ablenkung.
   `--cp-presence-amp` skaliert die Amplitude (thinking 0.25, reduced-motion aus). */
/* R2 (Idle-CPU, Founder 2026-07-19): Atmen/Schweben sind LEBENDIG-Signale und
   laufen nur bei echter Aktivität (working/thinking). Im Idle steht der Körper
   still — die Präsenz trägt allein der Eye-Blink. Zustand kommt aus der schon
   vorhandenen `company-presence--{state}`-Klasse (kein Timer). */
:is(.company-presence--working, .company-presence--thinking) {
  animation:
    cp-breathe calc(28s / var(--cp-speed, 1)) ease-in-out infinite,
    cp-float   calc(22s / var(--cp-speed, 1)) ease-in-out infinite;
}

/* Atmen: Scale ~0.995 → 1.008. Asymmetrische Haltepunkte (kein 50/50-Rhythmus). */
@keyframes cp-breathe {
  0%, 100% { scale: 1; }
  38%      { scale: calc(1 + 0.008 * var(--cp-presence-amp)); }
  72%      { scale: calc(1 - 0.005 * var(--cp-presence-amp)); }
}

/* Schweben: translateY 0 → -1.5px → 0, eigener Takt (22s). */
@keyframes cp-float {
  0%, 100% { translate: 0 0; }
  50%      { translate: 0 calc(-1.5px * var(--cp-presence-amp)); }
}

/* Workspace Accent — beeinflusst ausschließlich den äußeren Glow */
.company-presence--development { --company-accent: #00e5ff; }
.company-presence--procurement { --company-accent: #ffb547; }
.company-presence--finance { --company-accent: #4d8bff; }
.company-presence--hr { --company-accent: #b67cff; }
.company-presence--security { --company-accent: #ff7a59; }

/* Status-Akzente wirken ebenfalls nur auf den Glow */
.company-presence--waiting { --company-accent: #ffb547; }
.company-presence--blocked { --company-accent: #ff5d6c; }

/* Light Theme — Silhouette bleibt, Glow weicher, Reflexe heller.
   HUD-Ring wird DUNKLER statt heller (Akzent mit Ink abgemischt):
   Kontur vor Glow, gleiche Lesbarkeit wie im Dark Mode. */
.company-presence--light {
  --cp-halo-opacity: 0.32;
  --cp-halo-core-opacity: 0.20;
  --cp-shadow-opacity: 0.22;
  --cp-glass-lift: 0.05;
  --cp-highlight-boost: 1.3;
  --cp-dial-outer-line: color-mix(in srgb, var(--company-accent) 58%, rgba(10, 34, 42, 0.45));
  --cp-dial-inner-line: color-mix(in srgb, var(--company-accent) 46%, rgba(8, 30, 38, 0.55));
  --cp-dial-tick:       color-mix(in srgb, var(--company-accent) 68%, rgba(8, 30, 38, 0.55));
  --cp-dial-halo-opacity: 0.06;
  /* Platform Material Light — gleiche Familie, lesbar vor heller UI */
  --cp-platform-side-top:     #464f5b;
  --cp-platform-side-mid:     #313841;
  --cp-platform-side-bot:     #22282f;
  --cp-platform-top-ctr:      #363e48;
  --cp-platform-top-mid:      #2b323c;
  --cp-platform-top-edge:     #22282f;
  --cp-platform-shoulder-hi:  #66707d;
  --cp-platform-shoulder-mid: #424b56;
  --cp-platform-shoulder-lo:  #292f37;
}

/* Light: Strichstärke +12 % — mehr Zeichnung, weniger Glow */
.company-presence--light .cp-rear-dial__line      { stroke-width: 1.34; }
.company-presence--light .cp-rear-dial__inner-line { stroke-width: 0.84; }
.company-presence--light .cp-tick-marks line       { stroke-width: 1.40; }

.cp-svg {
  display: block;
  filter: drop-shadow(0 20px 34px rgba(0, 0, 0, var(--cp-shadow-opacity)));
  overflow: visible;
  width: 100%;
}

/* ---------- Layer 01 · Background Glow (Workspace-Wahrnehmungsfeld) ---------- */

.cp-background-glow__halo {
  fill: var(--cp-workspace-glow);
  filter: blur(34px);
  opacity: var(--cp-halo-opacity);
}

.cp-background-glow__core {
  fill: var(--cp-workspace-glow);
  filter: blur(22px);
  opacity: var(--cp-halo-core-opacity);
}

/* ---------- Layer 02 · Rear Dial (HUD: Ring → Ticks → Glow) ---------- */

.cp-rear-dial__halo {
  fill: none;
  stroke: var(--cp-workspace-halo);
  stroke-width: 5;
  filter: blur(5px);
  opacity: var(--cp-dial-halo-opacity);
}

.cp-rear-dial__line {
  fill: none;
  stroke: var(--cp-dial-outer-line);
  stroke-width: 1.2;
}

.cp-rear-dial__inner-line {
  fill: none;
  stroke: var(--cp-dial-inner-line);
  stroke-width: 0.75;
}

/* ---------- Layer 03 · Tick Marks (gestochen scharf, kein Blur) ---------- */

.cp-tick-marks line {
  stroke: var(--cp-dial-tick);
  stroke-linecap: butt;
  stroke-width: 1.25;
}

/* ---------- Layer 04 · Compass Blades ---------- */

/* Enge, weiche AO am Ring-Kontakt: Blade und Ring lesen als ein Bauteil */
.cp-blade__contact-shadow {
  fill: rgba(0, 0, 0, 0.28);
  filter: blur(4px);
}

/* Keine gezeichneten Konturen: Kanten entstehen nur aus Facetten-Kontrast,
   Ridge-Licht und Schatten. */
.cp-blade__silhouette {
  fill: #545b63;
}

/* Light Theme: Bevel-Kante heller und Fugen einen Tick schärfer —
   Metall-Chamfer statt Outline. Breite und Logik identisch zum Dark Theme. */
.company-presence--light .cp-blade__silhouette {
  fill: #7b838c;
}

.company-presence--light .cp-blade__seam {
  stroke: rgba(8, 12, 16, 0.3);
}

.cp-blade__facet {
  stroke: none;
  stroke-linejoin: round;
}

.cp-blade__facet--light { fill: url("#cp-blade-light"); }
.cp-blade__facet--dark { fill: url("#cp-blade-dark"); }
.cp-blade__facet--rim { fill: url("#cp-blade-rim"); }

/* Außenfasen — helle Fase auf der Lichtseite, dunkle auf der Schattenseite */
.cp-blade__bevel { stroke: none; }
.cp-blade__bevel--light { fill: url("#cp-bevel-light"); }
.cp-blade__bevel--shadow { fill: url("#cp-bevel-shadow"); }

/* Mittelrippe — Facettenpaar statt Linie: massives Bauteil */
.cp-blade__rib { stroke: none; }
.cp-blade__rib--light { fill: url("#cp-rib-light"); }
.cp-blade__rib--dark { fill: url("#cp-rib-dark"); }

/* Gefräste Fuge zwischen Fase und Hauptfläche — Mikrokontrast, keine Outline */
.cp-blade__seam {
  fill: none;
  stroke: rgba(10, 15, 20, 0.25);
  stroke-width: 0.7;
  filter: blur(0.2px);
}

/* satinierte lokale Reflexion auf der Lichtfläche — Sheen-Band, kein Glanz */
.cp-blade__sheen {
  fill: none;
  stroke: rgba(255, 255, 255, 0.1);
  stroke-linecap: round;
  stroke-width: 6;
  filter: blur(2.5px);
  opacity: calc(0.5 * var(--cp-highlight-boost));
}

/* Kontaktfase: kurzer Lichtabriss an der Ring-Schulter */
.cp-blade__contact-glint {
  fill: none;
  stroke: rgba(255, 255, 255, 0.42);
  stroke-linecap: round;
  stroke-width: 1;
  filter: blur(0.5px);
  opacity: calc(0.3 * var(--cp-highlight-boost));
}

/* AO-Abriss an der schattenseitigen Ring-Schulter — Gegenstück zum Glint.
   Lokaler Kontrast Ring↔Blade darf etwas dichter sein als die Highlights. */
.cp-blade__contact-ao {
  fill: none;
  stroke: rgba(0, 0, 0, 0.35);
  stroke-linecap: round;
  stroke-width: 1.1;
  filter: blur(0.8px);
}

/* Workspace-Bounce auf den unteren Kanten — Aluminium reflektiert Poolemission */
.cp-blade__bounce {
  fill: none;
  stroke: var(--cp-workspace-bounce);
  stroke-linecap: round;
  stroke-width: 1.2;
  filter: blur(1.5px);
  opacity: 0.18;
}

/* Süd liegt vom Key Light abgewandt — Lichtseiten leicht gedimmt */
.cp-blade--south .cp-blade__bevel--light,
.cp-blade--south .cp-blade__rib--light {
  opacity: 0.88;
}

.cp-blade--south .cp-blade__sheen {
  opacity: calc(0.4 * var(--cp-highlight-boost));
}

.cp-blade__ridge {
  fill: none;
  stroke: rgba(255, 255, 255, 0.38);
  stroke-linecap: round;
  stroke-width: 0.9;
  opacity: 0.45;
  filter: blur(0.3px);
}

.cp-blade__edge {
  fill: none;
  stroke: rgba(255, 255, 255, 0.42);
  stroke-linecap: round;
  stroke-width: 1;
  opacity: calc(0.36 * var(--cp-highlight-boost));
  filter: blur(0.3px);
}

.cp-blade__socket {
  fill: url("#cp-socket");
  stroke: rgba(220, 255, 255, 0.2);
  stroke-linejoin: round;
  stroke-width: 0.5;
  filter: drop-shadow(0 0 3px rgba(0, 229, 255, 0.26));
}

.cp-blade__tip-bounce {
  fill: var(--cp-workspace-bounce);
  filter: blur(4px);
  opacity: 0.22;
}

/* Südspitze wird vom Pool angestrahlt */
.cp-blade--south .cp-blade__facet--light { opacity: 0.94; }

/* ---------- Layer 05 · Metal Ring ---------- */

/* Weich und breit: Schatten, keine Kontur um den Ring */
.cp-ring__cast-shadow {
  fill: none;
  stroke: rgba(0, 0, 0, 0.3);
  stroke-width: 24;
  filter: blur(7px);
}

.cp-ring__band {
  fill: none;
  stroke: url("#cp-metal-band");
  stroke-width: 17;
}

/* feine Brush-Textur, leicht verdreht — dichter = kontinuierlicher Satin */
.cp-ring__brush {
  fill: none;
  stroke: rgba(255, 255, 255, 0.035);
  stroke-width: 10;
  stroke-dasharray: 0.6 1.8 0.4 2.2;
  transform: rotate(-4deg);
  transform-origin: 160px 156px;
}

.cp-ring__glint {
  fill: none;
  stroke-linecap: round;
  filter: blur(2.5px);
}

.cp-ring__glint--key {
  stroke: rgba(255, 255, 255, 0.24);
  stroke-width: 2.4;
  opacity: calc(0.26 * var(--cp-highlight-boost));
}

/* zweiter, kürzerer Lichtabriss — gefräste Kante statt perfektem Bogen */
.cp-ring__glint--key-echo {
  stroke: rgba(255, 255, 255, 0.18);
  stroke-width: 1.8;
  opacity: calc(0.24 * var(--cp-highlight-boost));
}

.cp-ring__hairline {
  fill: none;
  stroke: rgba(255, 255, 255, 0.07);
  stroke-width: 0.6;
}

/* Light Rig nach Vorlage: leicht warmes Rim-Light rechts … */
.cp-ring__glint--rim {
  stroke: rgba(255, 216, 180, 0.22);
  stroke-width: 2.4;
  opacity: 0.28;
}

/* … Workspace-Bounce unten — Ring reflektiert Poolemission */
.cp-ring__glint--bounce {
  stroke: var(--cp-workspace-bounce);
  stroke-width: 3;
  opacity: 0.16;
}

/* Torus-Rundung: dunkler zum Innenrand, Lichtkamm außen-mittig — weich */
.cp-ring__curvature-shadow {
  fill: none;
  stroke: rgba(0, 0, 0, 0.2);
  stroke-width: 4;
  filter: blur(2.5px);
}

.cp-ring__curvature-light {
  fill: none;
  stroke: rgba(255, 255, 255, 0.09);
  stroke-width: 3;
  filter: blur(2px);
}

/* Außenkante: helle Kante zum Licht, dunkle Kante im Schatten */
.cp-ring__outer-edge-light {
  fill: none;
  stroke: rgba(255, 255, 255, 0.5);
  stroke-linecap: round;
  stroke-width: 0.9;
  filter: blur(0.4px);
  opacity: calc(0.5 * var(--cp-highlight-boost));
}

.cp-ring__outer-edge-dark {
  fill: none;
  stroke: rgba(0, 0, 0, 0.32);
  stroke-linecap: round;
  stroke-width: 1;
  filter: blur(0.6px);
}

/* Kontaktlicht Ring↔Glas unten — schließt die Mikrokontrast-Kette
   helle Kante → Fläche → dunkle Fase → Kontaktlicht → Glas */
.cp-ring__contact-light {
  fill: none;
  stroke: rgba(160, 235, 255, 0.32);
  stroke-linecap: round;
  stroke-width: 0.8;
  filter: blur(0.8px);
}

/* Fasen in einer Dickenfamilie — gleicher Fräser innen wie außen */
.cp-ring__outer-bevel {
  fill: none;
  stroke: url("#cp-metal-outer");
  stroke-width: 1.6;
  filter: blur(0.3px);
}

.cp-ring__inner-bevel {
  fill: none;
  stroke: url("#cp-metal-inner");
  stroke-width: 1.6;
  filter: blur(0.4px);
}

/* Ring↔Glass: engere, etwas dichtere AO — lokale Tiefe statt Kontur.
   Trennt Hero (Glas) und Frame (Ring) sauber. */
.cp-ring__seat-shadow {
  fill: none;
  stroke: rgba(0, 0, 0, 0.44);
  stroke-width: 2.8;
  filter: blur(2px);
}

/* ---------- Layer 06 · Glass Sphere ---------- */

.cp-glass__base {
  fill: url("#cp-glass-base");
}

.cp-glass__depth {
  fill: url("#cp-glass-depth");
}

.cp-glass__bottom {
  fill: url("#cp-glass-bottom");
}

.cp-glass__fresnel {
  fill: url("#cp-glass-fresnel");
  mix-blend-mode: screen;
}

/* gerichtete Fresnel-Kante auf der Key-Seite — Licht, keine Kontur */
.cp-glass__rim-light {
  fill: none;
  stroke: rgba(234, 250, 255, 0.5);
  stroke-linecap: round;
  stroke-width: 1.4;
  filter: blur(1.4px);
  opacity: calc(0.4 * var(--cp-highlight-boost));
}

/* Light Theme hebt das Glas minimal an, Silhouette bleibt */
.company-presence--light .cp-glass__base {
  filter: brightness(calc(1 + var(--cp-glass-lift) * 4));
}

/* ---------- Layer 07/08 · Eyes & Smile (Identity, nie umfärben) ---------- */

/* Eye Scan: JS-driven bounded-random fixation via CSS custom properties.
   `translate` (CSS Transforms L2) composiert unabhängig von `transform: scaleY()`
   im Blink — beide Animationen überschreiben sich nicht. */
.cp-eyes {
  translate: var(--eye-dx, 0px) var(--eye-dy, 0px);
  transition: translate 520ms cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Klick-Verfolgen: der Ruhe-Blick ist bewusst träge (520ms); während der Orb dem
   Zeiger folgt, reagiert er deutlich schneller und wirkt dadurch lebendiger. */
.cp-eyes--tracking {
  transition: translate 200ms cubic-bezier(0.33, 0.8, 0.35, 1);
}

.cp-eyes__eye {
  fill: var(--cp-eye);
}

.cp-eyes__bloom {
  fill: var(--cp-eye);
  filter: blur(7px);
  opacity: 0.3;
}

/* Blink — CSS statt Framer Motion, damit transform-box: fill-box greift.
   Mitte der Gruppe = (160, 151.5) = exakt cy der Augen-Ellipsen. */
.cp-eyes--blink {
  transform-box: fill-box;
  transform-origin: center;
  animation: cp-eye-blink calc(6.4s / var(--cp-speed, 1)) ease-in-out infinite;
}

@keyframes cp-eye-blink {
  0%, 72% { transform: scaleY(1); }
  75%      { transform: scaleY(0.1); }
  78%, 100% { transform: scaleY(1); }
}

/* Nutzer-Reaktion (Founder 2026-07-12) — überschreibt den Ruhe-Blinzler für die Dauer der
   Reaktion (höhere Spezifität). Beide enden bei scaleY(1) → der Ruhe-Blinzler setzt nahtlos fort. */

/* Hover — „Ich habe dich bemerkt.": EIN etwas schnellerer Blinzler, sofort zurück. */
.cp-eyes--greet {
  animation: cp-blink-greet 360ms ease-in-out 1;
}
@keyframes cp-blink-greet {
  0%       { transform: scaleY(1); }
  45%      { transform: scaleY(0.1); }
  90%,100% { transform: scaleY(1); }
}

/* Klick — „Ich bin jetzt bei dir.": 3 Blinzler über ~2,5s, dann sanft zurück. Nicht hektisch. */
.cp-eyes--notice {
  animation: cp-blink-notice 2500ms ease-in-out 1;
}
@keyframes cp-blink-notice {
  0%       { transform: scaleY(1); }
  6%       { transform: scaleY(0.1); }
  12%      { transform: scaleY(1); }
  26%      { transform: scaleY(1); }
  32%      { transform: scaleY(0.1); }
  38%      { transform: scaleY(1); }
  56%      { transform: scaleY(1); }
  62%      { transform: scaleY(0.1); }
  68%      { transform: scaleY(1); }
  100%     { transform: scaleY(1); }
}

.cp-smile {
  fill: none;
  stroke: var(--cp-smile);
  stroke-linecap: round;
  stroke-width: 2.9;
  opacity: 0.68;
  filter: drop-shadow(0 0 3px rgba(92, 246, 243, 0.4));
}

/* ---------- Layer 08b · Knowledge Lens (Arbeitsrollen-Werkzeug, V3) ----------
   AD-082: das Werkzeug zeigt die aktive Arbeitsrolle — kein Outfit, kein Körper.
   Kein Accessoire, ein Werkzeug DES SYSTEMS: gleiche cyan Sprache, gleiche
   Lichtkante, gleiche Materialität wie der Orb. Zwei schwebende Ringe (keine
   Bügel — der Orb hat keinen Kopf), fast magnetisch gehalten. Gläser klar
   (die Augen sind Company und bleiben IMMER voll sichtbar), nur ein ganz
   feiner Cyan-Glow INNEN, als würde Company die Brille aktivieren.
   Auftritt (~0,6 s): Ringe schweben ein ○ ○ → haarfeine Brücke zeichnet ○─○ →
   setzt sich → kleiner Lichtimpuls. Abschluss: Glow verschwindet → Brille hebt
   sich → weg. */

.cp-lens { pointer-events: none; }

/* Innerer Cyan-Glow — transparente Mitte (Auge frei), zarter Ring INNEN. */
.cp-lens__glow { fill: url("#cp-lens-innerglow"); opacity: 0; }

/* Lichtreflex über dem Glas (geclippt, im rotierten Frame → diagonaler Lauf).
   Reines Licht (additiv) — verdeckt die Augen nie. */
.cp-lens__reflex {
  fill: url("#cp-lens-sheen");
  filter: blur(1.3px);
  opacity: 0;
}
.cp-lens__reflex--found { filter: blur(1px); }

/* Titan-/Silberrahmen — der „Ring". Etwas kräftiger, damit er auch klein auf
   dem Screen (sm-Orb im Panel) klar lesbar bleibt (Founder 2026-07-14). */
.cp-lens__rim {
  fill: none;
  stroke: url("#cp-lens-titanium");
  stroke-width: 2.3;
}

/* crisp cyan Lichtkante auf dem Rahmen (dieselbe Sprache wie der Orb) */
.cp-lens__edge {
  fill: none;
  stroke: rgba(155, 240, 255, 0.6);
  stroke-width: 1;
  opacity: 0;
}

/* Brücke — fein, aber kräftig genug fürs Herunterskalieren */
.cp-lens__bridge {
  fill: none;
  stroke: url("#cp-lens-titanium");
  stroke-linecap: round;
  stroke-width: 1.05;
}

/* ── Auftritt: die zwei Ringe schweben ein, magnetisch gehalten ──────── */
.cp-lens--on .cp-lens__rim,
.cp-lens--on .cp-lens__edge {
  animation: cp-lens-float-in calc(0.34s / var(--cp-speed, 1)) cubic-bezier(0.2, 0.85, 0.3, 1) both;
  transform-box: fill-box;
  transform-origin: center;
}
.cp-lens--on .cp-lens__unit--r .cp-lens__rim,
.cp-lens--on .cp-lens__unit--r .cp-lens__edge { animation-delay: calc(0.05s / var(--cp-speed, 1)); }

@keyframes cp-lens-float-in {
  0%   { opacity: 0; transform: scale(0.7) translateY(-2.5px); }
  70%  { opacity: 1; transform: scale(1.04); }
  100% { opacity: 1; transform: scale(1); }
}

/* Die haarfeine Brücke zeichnet sich zwischen den Ringen. */
.cp-lens--on .cp-lens__bridge {
  animation: cp-lens-draw calc(0.26s / var(--cp-speed, 1)) ease-out calc(0.32s / var(--cp-speed, 1)) both;
}

@keyframes cp-lens-draw {
  0%   { stroke-dasharray: 100; stroke-dashoffset: 100; opacity: 0; }
  20%  { opacity: 1; }
  100% { stroke-dasharray: 100; stroke-dashoffset: 0;   opacity: 1; }
}

/* Setzt sich → kleiner Lichtimpuls: der innere Glow blitzt einmal, dann ruhig. */
.cp-lens--on .cp-lens__glow {
  animation: cp-lens-glow-in calc(0.5s / var(--cp-speed, 1)) ease-out calc(0.44s / var(--cp-speed, 1)) both;
}

@keyframes cp-lens-glow-in {
  0%   { opacity: 0; }
  55%  { opacity: 1; }
  100% { opacity: 0.62; }
}

/* ── Betrieb: feiner Lichtreflex läuft über die Gläser ───────────────
   ~7 s Takt, Sweep ~0,8 s, sonst Ruhe. Rechts leicht versetzt → das
   Licht wandert über beide Gläser. Startet erst nach der Montage. */
.cp-lens--on .cp-lens__reflex {
  animation: cp-lens-reflex calc(7s / var(--cp-speed, 1)) ease-in-out calc(1.05s / var(--cp-speed, 1)) infinite;
}
.cp-lens--on .cp-lens__unit--r .cp-lens__reflex { animation-delay: calc(1.22s / var(--cp-speed, 1)); }

@keyframes cp-lens-reflex {
  0%   { translate: -20px 0; opacity: 0;   }
  3%   { opacity: 0.7; }
  11%  { translate: 20px 0;  opacity: 0;   }
  100% { translate: 20px 0;  opacity: 0;   }
}

/* Finden: der Reflex wird einmal heller — „Da ist etwas." (key-Remount) */
.cp-lens__reflex--found {
  animation: cp-lens-reflex-found calc(1.05s / var(--cp-speed, 1)) ease-out both;
}

@keyframes cp-lens-reflex-found {
  0%   { translate: -20px 0; opacity: 0; }
  18%  { opacity: 1; }
  100% { translate: 20px 0;  opacity: 0; }
}

/* ── Abschluss: Glow verschwindet → Brille hebt sich → weg ───────────── */
.cp-lens--off .cp-lens__glow {
  animation: cp-lens-fade-out calc(0.16s / var(--cp-speed, 1)) ease-in both;
}
.cp-lens--off {
  animation: cp-lens-lift calc(0.42s / var(--cp-speed, 1)) ease-in calc(0.12s / var(--cp-speed, 1)) both;
  transform-box: fill-box;
  transform-origin: center;
}

@keyframes cp-lens-fade-out { to { opacity: 0; } }

@keyframes cp-lens-lift {
  0%   { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-9px); }
}

/* reduced-motion: keine Montage, kein Reflex — fertiges Werkzeug statisch. */
.cp-lens--static,
.cp-lens--static * { animation: none !important; }
.cp-lens--static .cp-lens__glow { opacity: 0.62; }
.cp-lens--static .cp-lens__edge { opacity: 1; }

/* ── Pseudo-Vorbeugen (V3): NUR die innere Gesichtsgruppe senkt den Blick.
   Die äußere Orb-/Kompassform bleibt statisch und gibt Halt (Founder-Regel).
   Sehr langsam (~650 ms), setzt kurz nach der Brille ein, dann ruhige Lese-
   haltung. Keine sichtbare Verformung — eine Lesegeste, kein Zusammendrücken. */
.cp-face-nod,
.cp-face-features,
.cp-highlights-nod {
  transform-box: fill-box;
  transition: transform 650ms ease;
}
.cp-face-nod { transform-origin: 50% 24%; }
.cp-face-features { transform-origin: center; }
.cp-highlights-nod { transform-origin: center; }

.cp-svg[data-face-nod="on"] .cp-face-nod {
  transform: translateY(3.5px);
  transition-delay: 0.45s;
}
.cp-svg[data-face-nod="on"] .cp-face-features {
  transform: scaleY(0.975);
  transition-delay: 0.45s;
}
.cp-svg[data-face-nod="on"] .cp-highlights-nod {
  transform: translateY(-1.4px);
  transition-delay: 0.45s;
}

/* Konzentrierte Haltung: etwas weniger Schwebebewegung (Amplitude, nicht Tempo).
   thinking (0.25) bleibt die stärkere Dämpfung und gewinnt. */
.company-presence--role-bibliothekar:not(.company-presence--thinking) {
  --cp-presence-amp: 0.55;
}

/* Operations Controller: aufmerksam, aber ruhig — etwas gedämpft, nicht so tief
   wie der lesende Bibliothekar (der Orb wacht, er versenkt sich nicht). */
.company-presence--role-operations-controller:not(.company-presence--thinking) {
  --cp-presence-amp: 0.7;
}

/* Fortschritts-Quittung („Ah."): je übernommenem Kandidaten hebt sich der Orb
   minimal (2,5 px) und senkt sich wieder. Transition statt Keyframe — Atmen,
   Schweben und Blinzeln laufen unberührt weiter. Kein Konfetti. */
.cp-svg {
  transition: translate 320ms cubic-bezier(0.3, 0.7, 0.4, 1);
}

.cp-svg[data-role-pulse="on"] {
  translate: 0 -2.5px;
}

/* ---------- Layer 09 · Highlights (Reflection Cards) ---------- */

/* Catch Light Drift — der Lichtreflex verschiebt sich, nicht die Linse.
   47s / 61s: beide Primzahlen, synchronisieren nie mit 41 / 83 / 113 / 197.
   Max-Displacement: ~1.3px / ~0.8px — "man darf sie nicht sehen." */

.cp-highlight--white {
  fill: #ffffff;
  filter: blur(5px);
  opacity: calc(0.3 * var(--cp-highlight-boost));
}
/* R2: Highlight-Drift nur bei Aktivität — Idle friert den Reflex statisch. */
:is(.company-presence--working, .company-presence--thinking) .cp-highlight--white {
  animation: cp-catchlight-drift calc(47s / var(--cp-speed, 1)) ease-in-out infinite;
}

/* Rim-Reflex rechts — folgt dem leicht warmen Rim-Light der Vorlage */
.cp-highlight--rim {
  fill: #f3e6d8;
  filter: blur(4px);
  opacity: calc(0.22 * var(--cp-highlight-boost));
}
/* R2: Rim-Drift nur bei Aktivität. */
:is(.company-presence--working, .company-presence--thinking) .cp-highlight--rim {
  animation: cp-rimlight-drift calc(61s / var(--cp-speed, 1)) ease-in-out infinite;
}

@keyframes cp-catchlight-drift {
  0%   { translate:  0px     0px;   }
  17%  { translate:  0.8px  -0.4px; }
  38%  { translate:  1.2px   0.3px; }
  56%  { translate:  0.5px   0.8px; }
  74%  { translate: -0.3px   0.5px; }
  89%  { translate: -0.2px  -0.2px; }
  100% { translate:  0px     0px;   }
}

@keyframes cp-rimlight-drift {
  0%   { translate:  0px     0px;   }
  22%  { translate: -0.4px   0.5px; }
  45%  { translate:  0.2px   0.7px; }
  63%  { translate:  0.5px   0.2px; }
  81%  { translate:  0.3px  -0.4px; }
  91%  { translate: -0.1px  -0.2px; }
  100% { translate:  0px     0px;   }
}

.cp-highlight--cyan {
  fill: var(--cp-workspace-bounce);
  filter: blur(4px);
  opacity: 0.2;
}

/* ---------- Layer 10 · Beam ---------- */

.cp-beam__cone {
  fill: url("#cp-beam-fade");
  filter: blur(7px);
  opacity: 0.28;
}

/* schmaler Energiekern — der Beam zieht sichtbar aus dem Dock-Zentrum */
.cp-beam__core {
  fill: url("#cp-beam-core");
  filter: blur(2px);
  opacity: 0.5;
}

.cp-beam__hotspot {
  fill: var(--cp-ws-core);
  filter: blur(1.5px);
  opacity: 0.55;
}

/* ---------- Layer 11 · Platform ---------- */

/* Schatten zweistufig: weiter weicher Wurf + dunkler Kontakt-Kern */
.cp-platform__ground-shadow {
  fill: rgba(0, 0, 0, calc(var(--cp-shadow-opacity) * 0.7));
  filter: blur(9px);
}

.cp-platform__ground-shadow-core {
  fill: rgba(0, 0, 0, calc(var(--cp-shadow-opacity) * 0.9));
  filter: blur(4px);
}

.cp-platform__side {
  fill: url("#cp-platform-side");
}

.cp-platform__edge-light {
  fill: none;
  stroke: var(--cp-workspace-energy);
  stroke-opacity: 0.38;
  stroke-width: 1;
  filter: blur(0.5px);
}

.cp-platform__top {
  fill: url("#cp-platform-top");
}

/* gefräster Schulterradius an der Oberkante — Rundung statt Deckelkante */
.cp-platform__shoulder {
  fill: none;
  stroke: url("#cp-platform-shoulder");
  stroke-width: 2.6;
  filter: blur(0.8px);
}

.cp-platform__deck {
  fill: url("#cp-platform-top");
}

/* feine konzentrische Gravuren — technisch, nicht dekorativ */
.cp-platform__engraving {
  fill: none;
  stroke: rgba(0, 0, 0, 0.35);
  stroke-width: 0.7;
}

.cp-platform__engraving-light {
  fill: none;
  stroke: rgba(255, 255, 255, 0.05);
  stroke-width: 0.7;
}

/* dezente Lichtsegmente auf dem Deck — Interface, kein Ornament */
.cp-platform__segments {
  fill: none;
  stroke: var(--cp-workspace-energy);
  stroke-dasharray: 3 38.4;
  stroke-linecap: round;
  stroke-width: 1;
  opacity: 0.18;
}

.cp-platform__recess-shadow {
  fill: none;
  stroke: rgba(0, 0, 0, 0.4);
  stroke-width: 4;
  filter: blur(1.6px);
}

.cp-platform__recess {
  fill: none;
  stroke: rgba(0, 0, 0, 0.62);
  stroke-width: 2.4;
}

.cp-platform__recess-light {
  fill: none;
  stroke: rgba(255, 255, 255, 0.1);
  stroke-width: 0.8;
}

.cp-platform__inner-floor {
  fill: rgba(0, 0, 0, 0.42);
}

/* eigener Metallring um den Pool — der Glow liegt IN der Vertiefung */
.cp-platform__pool-ring {
  fill: none;
  stroke: rgba(205, 220, 232, 0.28);
  stroke-width: 1.5;
  filter: blur(0.4px);
}

/* aktiver Energiering am Dock-Kern */
.cp-platform__energy-ring {
  fill: none;
  stroke: var(--cp-workspace-energy);
  stroke-width: 1.1;
  filter: blur(0.6px);
  opacity: 0.42;
}

.cp-platform__pool {
  fill: url("#cp-pool");
  filter: blur(1.6px);
}

.cp-platform__pool-core {
  fill: var(--cp-ws-core);
  filter: blur(1.2px);
  opacity: 0.9;
}

/* ---------- Agent-Partikel ---------- */

.cp-particle circle {
  fill: var(--cp-workspace-energy);
  filter: drop-shadow(0 0 6px var(--cp-workspace-energy));
  opacity: 0.9;
}

.cp-particle--done circle { opacity: 0.45; }
.cp-particle--waiting circle { fill: #ffb547; filter: drop-shadow(0 0 6px #ffb547); }
.cp-particle--failed circle { fill: #ff5d6c; filter: drop-shadow(0 0 6px #ff5d6c); }

/* ---------- Motion Language — HUD Rotations ----------
   Rear Dial 113 s CW · Tick Layer 197 s CCW
   Beide linear (kein Easing — Präzisionsinstrument).
   Perioden sind Primzahlen → LCM ~235 Tage → nie derselbe Frame.
   transform-origin: 50% 50% = Zentrum des Bounding Box = SVG (160, 156)
   — identisch mit dem Zentrum von Ring und Glaskörper (konzentrisch).
   Reduced Motion: wird vom globalen Block unten auf 0.01ms gekürzt. */

.cp-rear-dial {
  transform-box: fill-box;
  transform-origin: center;
}

.cp-tick-marks {
  transform-box: fill-box;
  transform-origin: center;
}

/* R2: HUD-Rotation (optional/Identität) läuft nur bei Aktivität; Idle = statischer Ring. */
:is(.company-presence--working, .company-presence--thinking) .cp-rear-dial {
  animation: cp-hud-cw calc(113s / var(--cp-speed, 1)) linear infinite;
}
:is(.company-presence--working, .company-presence--thinking) .cp-tick-marks {
  animation: cp-hud-ccw calc(197s / var(--cp-speed, 1)) linear infinite;
}

@keyframes cp-hud-cw {
  to { transform: rotate(360deg); }
}

@keyframes cp-hud-ccw {
  to { transform: rotate(-360deg); }
}

/* ---------- Motion Language — Lens Calibration (11s) ----------
   Drei Schichten, eine Periode, unterschiedliche Delays:
   glass 0s · fresnel −1.7s · depth −3.1s.
   Keine Mathematik — ein Instrument justiert seine Optik.
   "Man darf sie nicht sehen. Man darf sie nur vermissen." */

.cp-glass {
  transform-box: fill-box;
  transform-origin: center;
}

/* R2: Glas-Kalibrierung (Sub-Pixel-Scale + Fresnel/Depth-Opacity, mix-blend-mode)
   ist verzichtbar — nur bei Aktivität. Im Idle bleibt der Blend STATISCH
   (einmaliges Composite), kein Per-Frame-Recompositing. */
:is(.company-presence--working, .company-presence--thinking) .cp-glass {
  animation: cp-lens-scale calc(11s / var(--cp-speed, 1)) ease-in-out infinite;
}

:is(.company-presence--working, .company-presence--thinking) .cp-glass__fresnel {
  animation: cp-lens-fresnel calc(11s / var(--cp-speed, 1)) ease-in-out infinite;
  animation-delay: calc(-1.7s / var(--cp-speed, 1));
}

:is(.company-presence--working, .company-presence--thinking) .cp-glass__depth {
  animation: cp-lens-depth calc(11s / var(--cp-speed, 1)) ease-in-out infinite;
  animation-delay: calc(-3.1s / var(--cp-speed, 1));
}

@keyframes cp-lens-scale {
  0%   { scale: 1 1; }           /* Ruhezustand */
  20%  { scale: 0.9985 1.001; }  /* Stabilisierung */
  45%  { scale: 1.0015 0.999; }  /* Feinkorrektur */
  68%  { scale: 0.999 1.0005; }  /* Überkompensation */
  86%  { scale: 1.0008 0.9995; } /* Rückführung */
  100% { scale: 1 1; }           /* Ruhezustand */
}

@keyframes cp-lens-fresnel {
  0%   { opacity: 1;    }
  20%  { opacity: 0.95; }
  45%  { opacity: 0.98; }
  68%  { opacity: 0.96; }
  86%  { opacity: 0.99; }
  100% { opacity: 1;    }
}

@keyframes cp-lens-depth {
  0%   { opacity: 1;    }
  20%  { opacity: 0.97; }
  45%  { opacity: 1;    }
  68%  { opacity: 0.98; }
  86%  { opacity: 0.99; }
  100% { opacity: 1;    }
}

/* ---------- Motion Language — Halo / Potential Field Drift (83s) ----------
   Der Halo ist das Wahrnehmungsfeld von Company — kein Licht, kein Status.
   Keine Phasen. Keine Geschichte. Er driftet. Er existiert.
   Scale erzeugt den Blur-Shift als Nebeneffekt (34px-Glow wird
   minimal diffuser/dichter). Kein explizites filter nötig.
   Composiert unabhängig vom state-basierten cp-halo-pulse auf der
   Kind-Ebene (.cp-background-glow__halo). */

.cp-background-glow {
  transform-box: fill-box;
  transform-origin: center;
}

/* R2: Halo-Drift (scale+opacity auf blur(34px)) war der größte Idle-Kostentreiber.
   Nur bei Aktivität; im Idle ruht der Halo bei statischer Opacity. Der
   state-getriebene cp-halo-pulse (working/blocked) bleibt unberührt (Energie). */
:is(.company-presence--working, .company-presence--thinking) .cp-background-glow {
  animation: cp-halo-drift calc(30s / var(--cp-speed, 1)) ease-in-out infinite;
}

/* Halo-Puls (Founder 2026-07-12): sichtbarer Opacity-Hub 0.82 → 1 — das dritte erkennbare
   Kernsignal neben Atmen/Schweben. Langsam (30s), amplitude über --cp-presence-amp gedämpft
   (thinking: 0.955–1). Scale bleibt Nebeneffekt (Blur-Shift). */
@keyframes cp-halo-drift {
  0%, 100% { opacity: calc(1 - 0.18 * var(--cp-presence-amp)); scale: 1;     }
  45%      { opacity: 1;                                       scale: 1.012; }
  78%      { opacity: calc(1 - 0.08 * var(--cp-presence-amp)); scale: 0.998; }
}

/* ---------- Animation-Hooks (Zustände docken hier an) ----------
   idle      → Schweben/Atmen (Framer, Wrapper) + Blinzeln (Eyes)
   working   → Pool-Puls
   thinking  → Halo-Puls
   found     → Halo-Pulse (Framer, BackgroundGlow)
   waiting   → Akzent kippt auf Warnfarbe (nur Glow)
   blocked   → Akzent kippt auf Gefahrfarbe (nur Glow)
   dock/undock → später: Wrapper-Transform
------------------------------------------------------------------ */

/* Process: Feld expandiert — pulsierend aktiv */
.company-presence--working .cp-background-glow__halo {
  animation: cp-halo-pulse 5.2s ease-in-out infinite;
}

/* Focus: Feld kontrahiert — kein Puls, leicht reduziert */
.company-presence--thinking .cp-background-glow__halo {
  opacity: calc(var(--cp-halo-opacity) * 0.8);
}
.company-presence--thinking {
  --cp-presence-amp: 0.25;
}

.company-presence--working .cp-platform__pool {
  animation: cp-pool-pulse 5.2s ease-in-out infinite;
}

.company-presence--blocked .cp-background-glow__halo {
  animation: cp-halo-pulse 4s ease-in-out infinite;
}

@keyframes cp-halo-pulse {
  0%, 100% { opacity: var(--cp-halo-opacity); }
  50% { opacity: calc(var(--cp-halo-opacity) * 1.7); }
}

@keyframes cp-pool-pulse {
  0%, 100% { opacity: 0.85; }
  50% { opacity: 1; }
}

/* ---------- Motion Language — Resolve Pulse ----------
   Separates Overlay — Halo und Core bleiben unangetastet.
   Der Impuls läuft nach außen und löst sich auf. Kein Zurückziehen.
   "Messung abgeschlossen. Neues Gleichgewicht übernommen."
   Gemountet via key-Remount (foundPulseKey), läuft einmal (forwards). */

.cp-resolve-pulse {
  fill: var(--cp-workspace-glow);
  transform-box: fill-box;
  transform-origin: center;
  pointer-events: none;
  animation: cp-resolve-pulse 650ms ease-out forwards;
}

@keyframes cp-resolve-pulse {
  0%   { opacity: 0;    scale: 1.000; }
  18%  { opacity: 0.35; scale: 1.015; }
  100% { opacity: 0;    scale: 1.060; }
}

/* ---------- Platform Pool — State Transport ----------
   Kommuniziert operative Energiedichte, nicht Emotion.
   Übergänge: 700ms ease-in-out (kein Reaktions-Sprung).
   transform-box auf Basis gesetzt damit scale-Transitions
   korrekt vom Element-Zentrum ausgehen. */

.cp-platform__pool,
.cp-platform__pool-core,
.cp-platform__energy-ring,
.cp-platform__pool-ring {
  transform-box: fill-box;
  transform-origin: center;
  transition: opacity 700ms ease-in-out, scale 700ms ease-in-out, filter 700ms ease-in-out;
}

.cp-platform__segments {
  transition: opacity 700ms ease-in-out;
}

/* Process — Energie expandiert: Pool klarer, Ring + Segmente deutlich aktiver */
.cp-platform--process .cp-platform__pool        { filter: blur(1.0px); }
.cp-platform--process .cp-platform__pool-core   { opacity: 1; }
.cp-platform--process .cp-platform__energy-ring { opacity: 0.75; }
.cp-platform--process .cp-platform__segments    { opacity: 0.40; }

/* Focus — Energie kontrahiert: Pool sichtbar kleiner, Segmente weg, Ring eng + hell */
.cp-platform--focus .cp-platform__pool        { filter: blur(0.5px); scale: 0.72; }
.cp-platform--focus .cp-platform__pool-core   { opacity: 1; scale: 0.72; }
.cp-platform--focus .cp-platform__energy-ring { opacity: 0.90; scale: 0.72; }
.cp-platform--focus .cp-platform__pool-ring   { scale: 0.72; }
.cp-platform--focus .cp-platform__segments    { opacity: 0; }

/* Resolve Pulse — kurze Pool-Entladung, dann zurück.
   Kein Erfolg. Kein Feiern. Energie verlässt das System. */
.cp-platform-resolve-pulse {
  fill: var(--cp-workspace-energy);
  transform-box: fill-box;
  transform-origin: center;
  pointer-events: none;
  animation: cp-platform-resolve 500ms ease-out forwards;
}

@keyframes cp-platform-resolve {
  0%   { opacity: 0.45; scale: 1 1;     filter: blur(1px);   }
  100% { opacity: 0;    scale: 2.4 2.0; filter: blur(3.5px); }
}

/* ---------- Preview ---------- */

.company-presence-preview {
  align-items: center;
  background:
    radial-gradient(circle at 50% 40%, rgba(0, 229, 255, 0.07), transparent 36%),
    linear-gradient(150deg, #0a0f14, #0d0f12 60%, #060809);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 18px;
  display: grid;
  min-height: 420px;
  padding: 36px;
  place-items: center;
}

/* ---------- Debug / Demo Controls ----------
   Selektoren greifen auf Wrapper-Ebene (data-Attribute auf dem
   Demo-Wrapper-Div), kaskadieren in alle Layer-Elemente.
   Nicht Teil der Produktions-API. ----------------------------------- */

[data-cp-paused] .company-presence,
[data-cp-paused] .cp-rear-dial,
[data-cp-paused] .cp-tick-marks,
[data-cp-paused] .cp-eyes--blink,
[data-cp-paused] .cp-glass,
[data-cp-paused] .cp-glass__fresnel,
[data-cp-paused] .cp-glass__depth,
[data-cp-paused] .cp-background-glow,
[data-cp-paused] .cp-highlight--white,
[data-cp-paused] .cp-highlight--rim,
[data-cp-paused] .cp-lens__reflex {
  animation-play-state: paused;
}

[data-cp-no-rear-dial] .cp-rear-dial         { animation: none; }
[data-cp-no-tick-layer] .cp-tick-marks       { animation: none; }
[data-cp-no-eye-blink] .cp-eyes--blink       { animation: none; }
[data-cp-no-lens-cal] .cp-glass              { animation: none; }
[data-cp-no-lens-cal] .cp-glass__fresnel     { animation: none; }
[data-cp-no-lens-cal] .cp-glass__depth       { animation: none; }
[data-cp-no-halo-drift] .cp-background-glow  { animation: none; }
[data-cp-no-catchlight] .cp-highlight--white { animation: none; }
[data-cp-no-catchlight] .cp-highlight--rim   { animation: none; }

[data-cp-force-reduced] .company-presence,
[data-cp-force-reduced] .company-presence * {
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.01ms !important;
}

/* ---------- Reduced Motion ---------- */

@media (prefers-reduced-motion: reduce) {
  .company-presence,
  .company-presence * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .cp-particle {
    opacity: 0;
  }
}