/* ================= Eigene Easter-Egg-Designs (v48) =================
   Drei Looks nach dem Vorbild von Winter Arc und Trace:
     grom     PL-01, rotes Design      "POLSKA GUROM"            Donner, Einsatz
     cockpit  Volvo-Auszeichnung       "VOLVO S60 · 449 HP"      Instrumente, Sprint, Werksdaten
     herz     Like sechsmal            "SPREAD LOVE, NOT HATE"   Herzschlag
   Jeder Look hat vier Ebenen: Hintergrund (.lk-bg), Intro, Rahmen waehrend
   des Videos (.lk-hud) und Abspann. Welche sichtbar ist, steuert index.html
   ueber #egg[data-phase]. Die Ebenen baut egg-looks.js erst beim ersten
   Oeffnen. Bewegt werden fast nur transform und opacity; was der Browser neu
   zeichnen muss, ist klein oder laeuft nur waehrend des Intros. */

/* ---------- Gemeinsames Geruest ---------- */
.lk{display:none;position:absolute;inset:0;overflow:hidden;pointer-events:none}
#egg[data-look="grom"] .lk-grom,#egg[data-look="cockpit"] .lk-cockpit,#egg[data-look="herz"] .lk-herz{display:block}
.lk-bg{position:absolute;inset:0;z-index:0}
.lk-bg>i,.lk-bg>div{position:absolute;display:block}
#eggFx{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:0;transition:opacity .9s ease}
#egg.lk-an #eggFx{opacity:1}
#egg.lk-an[data-phase="outro"] #eggFx{opacity:.45}
#egg.lk-an{backdrop-filter:none;-webkit-backdrop-filter:none}
#egg.lk-an .egg-inner{transition:opacity .6s ease,transform .8s cubic-bezier(.2,.75,.25,1)}
#egg.lk-an[data-phase="intro"] .egg-inner,
#egg.lk-an[data-phase="outro"] .egg-inner{opacity:0;visibility:hidden;transform:translateY(10px);pointer-events:none}
.lk-intro,.lk-outro{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:clamp(10px,2.2vh,20px);padding:24px;text-align:center;opacity:0;transition:opacity .45s ease}
#egg[data-phase="intro"] .lk-intro{opacity:1}
#egg[data-phase="outro"] .lk-outro{opacity:1}
.lk-hud{position:absolute;inset:clamp(12px,2.6vw,26px);z-index:2;opacity:0;transition:opacity .7s ease;
  font:600 clamp(9px,1.15vw,11px)/1.2 'Rajdhani',system-ui,sans-serif;letter-spacing:.24em;text-transform:uppercase}
#egg[data-phase="clip"] .lk-hud{opacity:1}
.lk-hud>span,.lk-hud>svg,.lk-hud>div{position:absolute;white-space:nowrap}
/* Plaetze im Rahmen. Oben rechts sitzt der Schliessknopf - dort nichts. */
.lk-hud .ol{left:12px;top:10px}.lk-hud .om{left:50%;top:10px;transform:translateX(-50%)}
.lk-hud .ul{left:12px;bottom:10px}.lk-hud .ur{right:12px;bottom:10px}.lk-hud .um{left:50%;bottom:10px;transform:translateX(-50%)}
.lk-hud .rm{right:12px;top:64px}
@keyframes lkAuf{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes lkEin{from{opacity:0}to{opacity:1}}
@keyframes lkLinie{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* ================= GROM · Donner ================= */
/* Farben am Fenster, nicht an der Ebene: Titel und Knoepfe liegen ausserhalb. */
#egg[data-look="grom"]{--g-w:#f3f1ee;--g-r:#dc143c;--g-grau:#9aa3af}
#egg[data-look="grom"]{background:#040506}
.lk-grom .g-nacht{inset:0;background:radial-gradient(ellipse 90% 70% at 50% 0%,#1c2431 0%,#0b0e13 48%,#040506 100%)}
.lk-grom .g-raster{inset:0;opacity:.5;
  background:linear-gradient(rgba(243,241,238,.035) 1px,transparent 1px) 0 0/56px 56px,
    linear-gradient(90deg,rgba(243,241,238,.035) 1px,transparent 1px) 0 0/56px 56px;
  -webkit-mask-image:radial-gradient(ellipse at 50% 50%,#000 25%,transparent 78%);
          mask-image:radial-gradient(ellipse at 50% 50%,#000 25%,transparent 78%)}
.lk-grom .g-streifen{left:0;right:0;top:0;height:5px;
  background:linear-gradient(180deg,var(--g-w) 0 50%,var(--g-r) 50% 100%);opacity:.85}
.lk-grom .g-blitzlicht{inset:0;opacity:0;
  background:radial-gradient(ellipse 70% 60% at 50% 18%,rgba(236,243,255,.95),rgba(186,202,228,.32) 45%,transparent 76%)}
.lk-grom.g-blitzt .g-blitzlicht{animation:gFlash .56s ease-out}
#egg[data-look="grom"][data-phase="intro"] .g-blitzlicht{animation:gFlash .7s .5s ease-out}
#egg[data-look="grom"][data-phase="outro"] .g-blitzlicht{animation:gFlash .8s ease-out}
@keyframes gFlash{0%{opacity:0}7%{opacity:.95}16%{opacity:.12}27%{opacity:.72}100%{opacity:0}}
/* v138: Gewitter - Blitze, Wolken und Ortslicht zeichnet egg-looks.js auf diese Leinwand. */
.lk-grom .g-gewitter{position:absolute;inset:0;width:100%;height:100%;display:block}
/* Flaggenlicht beim grossen Einschlag (12,7 s): weiss von oben, rot von unten. */
.lk-grom .g-flaggenlicht{inset:0;opacity:0;background:radial-gradient(ellipse 80% 45% at 50% 0%,rgba(243,241,238,.32),transparent 70%),
  radial-gradient(ellipse 80% 45% at 50% 100%,rgba(220,20,60,.42),transparent 70%)}
.lk-grom.g-flaggenlicht-an .g-flaggenlicht{animation:gFlaggenlicht 3.2s ease-out both}
@keyframes gFlaggenlicht{0%{opacity:0}12%{opacity:1}60%{opacity:.75}100%{opacity:.35}}
.lk-grom .g-wort{position:relative;font-family:'Black Ops One',Impact,'Arial Black',sans-serif;
  font-size:clamp(84px,18vw,232px);line-height:.88;letter-spacing:.05em;margin-right:-.05em;
  background:linear-gradient(180deg,var(--g-w) 0 51%,var(--g-r) 51% 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 10px 40px rgba(220,20,60,.28));opacity:0}
#egg[data-look="grom"][data-phase="intro"] .g-wort{animation:gWort .8s .62s cubic-bezier(.16,1,.3,1) forwards}
@keyframes gWort{0%{opacity:0;transform:scale(1.35,1.2);filter:blur(10px) drop-shadow(0 10px 40px rgba(220,20,60,.28))}
  60%{opacity:1}100%{opacity:1;transform:none;filter:blur(0) drop-shadow(0 10px 40px rgba(220,20,60,.28))}}
.lk-grom .g-flagge{display:flex;flex-direction:column;width:min(440px,72vw)}
.lk-grom .g-flagge i{display:block;height:7px;transform:scaleX(0);transform-origin:50% 50%}
.lk-grom .g-flagge i:first-child{background:var(--g-w)}
.lk-grom .g-flagge i:last-child{background:var(--g-r)}
#egg[data-look="grom"][data-phase="intro"] .g-flagge i{animation:lkLinie .7s 1.1s cubic-bezier(.2,.8,.2,1) forwards}
#egg[data-look="grom"][data-phase="intro"] .g-flagge i:last-child{animation-delay:1.22s}
.lk-grom .g-unter{display:flex;gap:1.1em;font:600 clamp(10px,1.3vw,13px)/1 'Rajdhani',system-ui,sans-serif;
  letter-spacing:.55em;margin-right:-.55em;color:var(--g-grau);opacity:0}
.lk-grom .g-unter b{color:var(--g-w)}
#egg[data-look="grom"][data-phase="intro"] .g-unter{animation:lkAuf .7s 1.5s ease forwards}
/* Rahmen: Einsatzbesprechung */
.lk-grom .lk-hud{color:var(--g-grau);
  background:
    linear-gradient(var(--g-w),var(--g-w)) left top/30px 1px no-repeat,
    linear-gradient(var(--g-w),var(--g-w)) left top/1px 30px no-repeat,
    linear-gradient(var(--g-w),var(--g-w)) right bottom/30px 1px no-repeat,
    linear-gradient(var(--g-w),var(--g-w)) right bottom/1px 30px no-repeat,
    linear-gradient(var(--g-r),var(--g-r)) left bottom/30px 1px no-repeat,
    linear-gradient(var(--g-r),var(--g-r)) left bottom/1px 30px no-repeat}
.lk-grom .g-op{display:flex;align-items:center;gap:9px;color:var(--g-w)}
.lk-grom .g-op i{width:9px;height:9px;background:var(--g-r);box-shadow:0 0 12px rgba(220,20,60,.8)}
.lk-grom .g-stempel{font-family:'Black Ops One',Impact,sans-serif;font-size:clamp(12px,1.6vw,16px);letter-spacing:.2em;
  color:var(--g-r);border:2px solid var(--g-r);padding:.35em .6em .25em;transform:rotate(-6deg);opacity:.9;
  box-shadow:inset 0 0 0 1px rgba(220,20,60,.25)}
.lk-grom .lk-outro strong{font-family:'Black Ops One',Impact,sans-serif;font-weight:400;
  font-size:clamp(64px,13vw,168px);line-height:.9;letter-spacing:.05em;margin-right:-.05em;
  background:linear-gradient(180deg,var(--g-w) 0 51%,var(--g-r) 51% 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lk-grom .lk-outro span{font:600 11px/1 'Rajdhani',system-ui,sans-serif;letter-spacing:.6em;margin-right:-.6em;color:var(--g-w)}
#egg[data-look="grom"] .egg-txt{font-family:'Black Ops One',Impact,sans-serif;font-weight:400;letter-spacing:.12em;
  font-size:clamp(22px,4.2vw,44px);color:var(--g-w);text-shadow:0 0 24px rgba(220,20,60,.45),0 2px 0 rgba(0,0,0,.7)}
#egg[data-look="grom"] .egg-txt::after{content:"";display:block;width:56%;height:6px;margin:.4em auto 0;
  background:linear-gradient(180deg,var(--g-w) 0 50%,var(--g-r) 50% 100%)}
#egg[data-look="grom"] #eggVid{border-radius:6px;border-color:rgba(243,241,238,.3);filter:contrast(1.06) saturate(.92);
  box-shadow:0 0 0 1px rgba(220,20,60,.28),0 0 80px rgba(220,20,60,.18),0 30px 80px rgba(0,0,0,.85)}
#egg[data-look="grom"] .egg-controls button{background:rgba(10,12,16,.92);border-color:rgba(243,241,238,.26);border-radius:3px;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase}
#egg[data-look="grom"] .egg-controls button:hover{background:rgba(220,20,60,.2);border-color:var(--g-r)}
#egg[data-look="grom"] .egg-hint{color:#8d96a3}
#egg[data-look="grom"] .egg-close:hover{background:rgba(220,20,60,.25);border-color:var(--g-r)}

#egg[data-look="herz"] .egg-txt i{font-style:italic}

/* ================= LOCKED IN · Winter Arc (v142) =================
   Eisblumen (egg-looks.js zeichnet sie auf .w-frost), der Titel friert ein,
   darunter der echte Tag im Winter Arc. Licht, Dunst und Schnee bleiben aus
   index.html (#egg.look-winter). Das alte Intro dort ist nur noch Rueckfall. */
#egg[data-look="winter"] .lk-winter{display:block}
#egg.lk-an .ew-intro{display:none}
#egg[data-look="winter"]{--w-eis:#e6f2fb;--w-blau:#9cc7ea;--w-grau:#8b9fae}
.lk-winter .w-frost{position:absolute;inset:0;width:100%;height:100%;display:block}
#egg[data-look="winter"][data-phase="clip"] .w-frost{animation:wAtem 7s ease-in-out infinite alternate}
@keyframes wAtem{from{opacity:1}to{opacity:.74}}
/* Auf den Schnitten des Films blitzt das Eis kurz auf. */
#egg[data-look="winter"] .lk-winter.w-glanz .w-frost{animation:wGlanz .75s ease-out}
@keyframes wGlanz{0%{filter:brightness(1)}18%{filter:brightness(2)}100%{filter:brightness(1)}}
/* Kalter Hauch am Rand; im Abspann friert das Fenster zu. */
.lk-winter .w-hauch{inset:0;opacity:0;transition:opacity 2.4s ease;
  background:radial-gradient(ellipse 78% 72% at 50% 50%,transparent 58%,rgba(196,222,247,.08) 84%,rgba(214,234,252,.15) 100%)}
#egg[data-look="winter"]:is([data-phase="intro"],[data-phase="clip"],[data-phase="outro"]) .w-hauch{opacity:1}
.lk-winter .w-zu{inset:0;opacity:0;transition:opacity 1.7s ease;
  background:radial-gradient(ellipse 66% 60% at 50% 50%,transparent 28%,rgba(205,228,250,.12) 66%,rgba(226,240,255,.24) 100%)}
#egg[data-look="winter"][data-phase="outro"] .w-zu{opacity:1}
/* Titel: jeder Buchstabe kommt aus dem Frost und wird scharf, danach ein kurzes Glitzern. */
.lk-winter .w-titel{display:flex;font:700 clamp(40px,8.6vw,112px)/1 'Rajdhani',system-ui,sans-serif;letter-spacing:.2em;
  margin-right:-.2em;color:var(--w-eis);text-shadow:0 0 30px rgba(170,210,245,.32),0 0 2px rgba(255,255,255,.55)}
.lk-winter .w-titel i{display:inline-block;font-style:normal;opacity:0}
.lk-winter .w-titel i.l{width:.32em}
#egg[data-look="winter"][data-phase="intro"] .w-titel i{animation:wFriert 1s cubic-bezier(.2,.8,.2,1) forwards,wFunkeln .6s ease-out forwards;
  animation-delay:calc(.25s + var(--i,0) * 70ms),calc(1.4s + var(--i,0) * 45ms)}
@keyframes wFriert{0%{opacity:0;filter:blur(10px);transform:translateY(-8px) scale(1.06)}55%{opacity:1}100%{opacity:1;filter:blur(0);transform:none}}
@keyframes wFunkeln{0%,100%{filter:brightness(1)}40%{filter:brightness(1.75)}}
.lk-winter .w-arc{display:flex;align-items:center;gap:12px;font:600 clamp(10px,1.25vw,13px)/1 'Rajdhani',system-ui,sans-serif;
  letter-spacing:.42em;margin-right:-.42em;text-transform:uppercase;color:var(--w-grau);opacity:0}
.lk-winter .w-arc b,.lk-winter .lk-hud b{color:var(--w-eis);font-weight:700;font-variant-numeric:tabular-nums}
.lk-winter .w-punkt{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--w-blau);box-shadow:0 0 9px var(--w-blau)}
#egg[data-look="winter"][data-phase="intro"] .w-arc{animation:lkAuf .7s 1s ease forwards}
/* Die 92 Tage: Oktober, November, Dezember. */
.lk-winter .w-kalender{position:relative;width:min(560px,84vw);padding-top:18px;opacity:0}
#egg[data-look="winter"][data-phase="intro"] .w-kalender{animation:lkEin .45s 1.2s ease forwards}
.lk-winter .w-leiste{display:grid;grid-template-columns:repeat(92,1fr);gap:2px;height:22px;align-items:end}
.lk-winter .w-leiste i{display:block;height:9px;border-radius:1px;background:rgba(156,199,234,.16);transform-origin:50% 100%}
.lk-winter .w-leiste i:is(:nth-child(1),:nth-child(32),:nth-child(62)){height:15px}
.lk-winter .w-leiste i.voll{background:rgba(222,238,252,.8)}
.lk-winter .w-leiste i.jetzt{height:22px;background:#fff;box-shadow:0 0 10px rgba(190,225,255,.95),0 0 24px rgba(160,205,250,.6)}
#egg[data-look="winter"][data-phase="intro"] .w-leiste i.voll{animation:wTag .3s both;animation-delay:calc(1.35s + var(--i,0) * var(--schritt,12ms))}
#egg[data-look="winter"][data-phase="intro"] .w-leiste i.jetzt{animation:wHeute 1.1s 2.45s cubic-bezier(.2,.8,.2,1) both}
@keyframes wTag{from{background:rgba(156,199,234,.16)}to{background:rgba(222,238,252,.8)}}
@keyframes wHeute{0%{opacity:.15;transform:scaleY(.4);box-shadow:none}35%{opacity:1;transform:scaleY(1.25)}100%{opacity:1;transform:none}}
.lk-winter .w-heute{position:absolute;top:0;transform:translateX(-50%);font:700 9px/1 'Rajdhani',system-ui,sans-serif;
  letter-spacing:.32em;margin-right:-.32em;text-transform:uppercase;color:var(--w-eis);white-space:nowrap}
#egg[data-look="winter"][data-phase="intro"] .w-heute{animation:lkEin .5s 2.6s ease both}
.lk-winter .w-monate{display:grid;grid-template-columns:31fr 30fr 31fr;margin-top:9px;font:600 9px/1 'Rajdhani',system-ui,sans-serif;
  letter-spacing:.4em;text-transform:uppercase;color:#64798a;text-align:left}
/* Rahmen waehrend des Films */
.lk-winter .lk-hud{color:var(--w-grau)}
.lk-winter .w-hud-arc{display:flex;align-items:center;gap:9px;color:var(--w-eis)}
/* Abspann: das Fenster friert zu. */
.lk-winter .lk-outro strong{font:700 clamp(30px,5.6vw,66px)/1 'Rajdhani',system-ui,sans-serif;letter-spacing:.16em;margin-right:-.16em;
  text-transform:uppercase;color:var(--w-eis);text-shadow:0 0 34px rgba(170,210,245,.35)}
.lk-winter .lk-outro span{font:600 11px/1 'Rajdhani',system-ui,sans-serif;letter-spacing:.46em;margin-right:-.46em;text-transform:uppercase;color:var(--w-grau)}
#egg[data-look="winter"][data-phase="outro"] .lk-outro strong{animation:wFriert 1.1s .2s cubic-bezier(.2,.8,.2,1) both}
#egg[data-look="winter"][data-phase="outro"] .lk-outro span{animation:lkAuf .7s .7s ease both}
@media (max-width:640px){.lk-winter .w-uhr{display:none}.lk-winter .w-arc{letter-spacing:.28em;margin-right:-.28em}}
@media (prefers-reduced-motion:reduce){
  .lk-winter *,.lk-winter{animation:none!important}
  .lk-winter .w-titel i{opacity:1}
}

/* ================= HORROR · "do you like horror?" (v144) =================
   Die Frage kriecht ueber die Seite (grusel.js/grusel.css). Hier das Fenster:
   Intro mit der Antwort, Film als Ueberwachungskamera, Beben an den
   Schreckstellen, Abspann. Kein Vollbildblitz - der Schreck ist ein roter
   Rand und ein kurzes Beben, die Helligkeit kommt nur aus dem Film. */
#egg[data-look="horror"] .lk-horror{display:block}
#egg[data-look="horror"]{--gr-rot:#b3121b;--gr-weiss:#e8e3d9;--gr-grau:#7c7f86;background:#000}
.lk-horror .gr-rauschen{inset:-40%;opacity:.05;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grKorn .5s steps(5) infinite}
@keyframes grKorn{0%{transform:translate(0,0)}20%{transform:translate(-7%,4%)}40%{transform:translate(5%,-6%)}60%{transform:translate(-3%,7%)}80%{transform:translate(6%,2%)}100%{transform:translate(0,0)}}
/* Eine Gluehbirne, die nicht mehr lange haelt. */
.lk-horror .gr-licht{left:50%;top:-12%;width:min(900px,120vw);height:70%;transform:translateX(-50%);
  background:radial-gradient(ellipse 45% 55% at 50% 20%,rgba(226,214,170,.16),rgba(120,90,40,.05) 55%,transparent 75%);
  animation:grBirne 5.2s steps(1) infinite}
@keyframes grBirne{0%,100%{opacity:1}11%{opacity:.3}12%{opacity:1}13%{opacity:.15}15%{opacity:.9}48%{opacity:.85}49%{opacity:.1}51%{opacity:1}83%{opacity:.6}84%{opacity:1}}
.lk-horror .gr-gesicht{left:50%;top:50%;width:min(62vh,560px);aspect-ratio:1;transform:translate(-50%,-50%) scale(1.1);opacity:0;
  background:url(/assets/egg-horror-gesicht.webp) center/cover no-repeat;
  -webkit-mask-image:radial-gradient(circle,#000 30%,transparent 70%);mask-image:radial-gradient(circle,#000 30%,transparent 70%)}
.lk-horror.gr-blitz .gr-gesicht{opacity:.55}
.lk-horror :is(.gr-antwort,.gr-unter){font-family:'Special Elite','Courier New',monospace;color:var(--gr-weiss)}
.lk-horror .gr-antwort{font-size:clamp(34px,6.4vw,78px);line-height:1;letter-spacing:.03em;opacity:0;
  text-shadow:2px 0 rgba(179,18,27,.8),-2px 0 rgba(0,170,190,.3),0 0 30px rgba(0,0,0,.9)}
.lk-horror .gr-unter{font-size:clamp(13px,1.6vw,17px);letter-spacing:.14em;color:#a49a8e;opacity:0}
#egg[data-look="horror"][data-phase="intro"] .gr-antwort{animation:grTippen .9s .35s steps(1) both}
#egg[data-look="horror"][data-phase="intro"] .gr-unter{animation:grTippen .8s 1.5s steps(1) both}
@keyframes grTippen{0%{opacity:0}10%{opacity:.8}18%{opacity:0}30%{opacity:1}38%{opacity:.3}50%,100%{opacity:1}}
/* v148 "zu hell": im Film nur noch Dunkelheit um das Bild - keine Gluehbirne,
   eine schwere Vignette ueber Film und Rand, Titel und Knoepfe gedaempft. */
#egg[data-look="horror"]:not([data-phase="intro"]) .gr-licht{opacity:0;animation:none}
/* v150: kein "Loading/Buffering video" im Horror - das Video liegt meist schon im Speicher
   (grusel.js), und ein kurz stehendes, dunkles Kamerabild passt hier besser als ein
   Kreisel. "Langsam", "Pause" und Fehler bleiben sichtbar. */
#egg[data-look="horror"][data-media="loading"] #eggState{visibility:hidden}
.lk-horror .gr-dunkel{position:absolute;inset:calc(-1 * clamp(12px,2.6vw,26px));pointer-events:none;
  background:radial-gradient(ellipse 54% 64% at 50% 50%,transparent 66%,rgba(0,0,0,.4) 84%,rgba(0,0,0,.85) 100%)}
/* v153: groesseres Video - der Titel darueber faellt weg (bleibt fuer Screenreader). */
#egg[data-look="horror"] .egg-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* v155 "noch etwas groesser": auf breiten Schirmen weniger Rand oben, ohne Hinweiszeile. */
@media (min-width:700px){
  #egg[data-look="horror"] .egg-inner{padding-top:22px;gap:10px}
  #egg[data-look="horror"] .egg-hint{display:none}
}
#egg[data-look="horror"] :is(.egg-controls,.egg-hint){opacity:.55;transition:opacity .3s}
#egg[data-look="horror"] .egg-controls:hover{opacity:1}
/* Rahmen: Ueberwachungskamera mit Zeilen, REC und der Uhrzeit des Besuchers. */
.lk-horror .lk-hud{color:var(--gr-grau);font-family:'Special Elite','Courier New',monospace;letter-spacing:.18em}
.lk-horror .gr-linien{position:absolute;inset:calc(-1 * clamp(12px,2.6vw,26px));pointer-events:none;opacity:.5;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px)}
.lk-horror .gr-rec{display:flex;align-items:center;gap:8px;color:var(--gr-weiss)}
.lk-horror .gr-rec i{width:9px;height:9px;border-radius:50%;background:#e01020;box-shadow:0 0 10px rgba(224,16,32,.8);animation:grRec 1.1s steps(1) infinite}
@keyframes grRec{0%,55%{opacity:1}56%,100%{opacity:0}}
/* Schreckstellen: kurzes Beben (v150: ohne roten Rand). */
#egg[data-look="horror"].gr-schreck .egg-inner{animation:grBeben .5s linear}
#egg[data-look="horror"].gr-zucken .egg-inner{animation:grBeben .3s linear}
@keyframes grBeben{0%,100%{transform:none}10%{transform:translate(-9px,4px) rotate(-.6deg)}20%{transform:translate(8px,-6px) rotate(.5deg)}
  30%{transform:translate(-6px,-3px)}40%{transform:translate(7px,5px) rotate(-.4deg)}55%{transform:translate(-4px,2px)}70%{transform:translate(3px,-2px)}85%{transform:translate(-1px,1px)}}
#egg[data-look="horror"] .egg-txt{font-family:'Special Elite','Courier New',monospace;font-weight:400;letter-spacing:.08em;color:var(--gr-weiss);
  text-shadow:2px 0 rgba(179,18,27,.7),-2px 0 rgba(0,170,190,.25),0 0 24px rgba(0,0,0,.9)}
#egg[data-look="horror"] .egg-txt i{animation:grTippen .7s steps(1) both;animation-delay:calc(var(--i,0) * 45ms)}
#egg[data-look="horror"] #eggVid{border-radius:2px;border-color:rgba(60,8,10,.5);filter:brightness(1.08) saturate(.85);
  box-shadow:0 0 0 1px rgba(0,0,0,.9),0 0 90px rgba(0,0,0,.95)}
#egg[data-look="horror"] .egg-controls button{background:rgba(8,8,9,.92);border-color:rgba(232,227,217,.18);border-radius:2px}
#egg[data-look="horror"] .egg-controls button:hover{background:rgba(179,18,27,.22);border-color:var(--gr-rot)}
#egg[data-look="horror"] .egg-close:hover{background:rgba(179,18,27,.3);border-color:var(--gr-rot)}
#egg[data-look="horror"] .egg-hint{color:#6c6f76}
/* v148 Abspann = Jumpscare: 0,35 s Schwarz, dann springt das Gesicht ins Bild,
   bebt, nach 1,1 s hart Schwarz (v150: ohne Rot). Den Schrei spielt egg-looks.js. */
.lk-horror .lk-outro{transition:none;padding:0;background:#000}
.lk-horror .gr-jump{position:absolute;inset:0;opacity:0;background:#000 url(/assets/egg-horror-schreck.webp) 50% 58%/auto 112% no-repeat;
  filter:contrast(1.2) saturate(1.1)}
/* v156: zweiter Film, eigenes Gesicht */
.lk-horror.gr-film2 .gr-jump{background-image:url(/assets/egg-horror2-schreck.webp);background-position:50% 50%}
.lk-horror.gr-sprung .gr-jump{animation:grSprung 1.1s linear both}
/* Das Gesicht rast aus der Ferne heran, bebt, waechst weiter - dann hart Schwarz. */
@keyframes grSprung{0%{opacity:1;transform:scale(.45);filter:contrast(1.2) brightness(1.5)}6%{transform:scale(1.12);filter:contrast(1.2) brightness(1.2)}
  10%{transform:scale(1.06) translate(-1.5%,1%) rotate(-1deg);filter:contrast(1.2)}14%{transform:scale(1.12) translate(1.5%,-1%) rotate(1deg)}
  18%{transform:scale(1.08) translate(-1%,1.5%)}23%{transform:scale(1.14) translate(1%,-.5%) rotate(.8deg)}30%{transform:scale(1.1) translate(-1.2%,-1%)}
  38%{transform:scale(1.16) translate(1%,1%) rotate(-.6deg)}48%{transform:scale(1.14) translate(-.6%,.5%)}60%{transform:scale(1.2) translate(.6%,-.6%)}
  74%{transform:scale(1.26) translate(-.4%,.4%)}88%{opacity:1;transform:scale(1.34)}89%,100%{opacity:0;transform:scale(1.34)}}
@media (prefers-reduced-motion:reduce){
  .lk-horror *,#egg[data-look="horror"] .egg-inner,#egg[data-look="horror"] .egg-txt i{animation:none!important}
  .lk-horror .gr-antwort,.lk-horror .gr-unter{opacity:1}
  .lk-horror.gr-blitz .gr-gesicht{opacity:0}
}

/* ================= CODE BLUE · EKG-Egg (v166 Filmszene, v168 Geraet im Raum) =================
   Intensivstation bei Nacht. v168: ein echtes Geraet im dunklen Zimmer -
   Gehaeuse mit Alarmlampe, Glas, Spiegelung darunter; 3D-Kamerafahrt mit
   Handkamera, die bei "Clear!" stillhaelt; rotes Alarmlicht im Raum bis zum
   ersten Schlag; unscharfe Stationslichter und ein Infusionsstaender im
   Vordergrund. Kanaele: EKG II gruen, Pleth cyan, CO2 gelb.
   Akte ueber .lk-puls[data-akt]: vf, cpr, laden, clear, schock, rosc, widmung. */
#egg[data-look="puls"] .lk-puls{display:block}
#egg[data-look="puls"]{--p-ekg:#3ff27f;--p-pleth:#3ad6ff;--p-co2:#ffd84a;--p-rot:#ff2f4d;--p-weiss:#eef3f8;--p-grau:#8a96a6;background:#000}
.lk-puls .p-grund{inset:0;background:radial-gradient(ellipse 90% 80% at 50% 45%,#0b1118 0%,#04070b 55%,#000 100%)}
/* Neonlicht der Station von oben, ganz leicht */
.lk-puls .p-licht{inset:0;background:radial-gradient(ellipse 60% 40% at 50% -10%,rgba(170,200,230,.08),transparent 70%)}
/* Unscharfe Lichter der Station: Geraete-LEDs, Flurlicht, ein Fenster */
.lk-puls .p-bokeh{inset:-6%;opacity:.8;filter:blur(6px);
  background:
    radial-gradient(circle at 9% 22%,rgba(63,242,127,.6) 0 5px,transparent 11px),
    radial-gradient(circle at 15% 72%,rgba(255,186,90,.38) 0 9px,transparent 19px),
    radial-gradient(circle at 85% 17%,rgba(90,170,255,.45) 0 7px,transparent 15px),
    radial-gradient(circle at 92% 63%,rgba(63,242,127,.45) 0 4px,transparent 9px),
    radial-gradient(circle at 79% 87%,rgba(255,80,96,.32) 0 6px,transparent 13px),
    radial-gradient(circle at 27% 91%,rgba(140,200,255,.26) 0 12px,transparent 25px),
    radial-gradient(circle at 69% 7%,rgba(255,230,180,.22) 0 16px,transparent 32px),
    radial-gradient(circle at 4% 47%,rgba(255,220,160,.2) 0 14px,transparent 29px),
    radial-gradient(circle at 96% 40%,rgba(255,170,80,.25) 0 10px,transparent 21px);
  transition:opacity 1.6s ease;animation:pBokeh 10.4s cubic-bezier(.35,0,.25,1) both}
/* Waehrend des Films treten die Lichter fast ganz zurueck */
#egg[data-look="puls"]:is([data-phase="clip"],[data-phase="outro"]) .p-bokeh{opacity:.18}
@keyframes pBokeh{from{transform:translate3d(-2.2%,.6%,0) scale(1.05)}to{transform:translate3d(1.4%,-.8%,0) scale(1)}}
/* Rotes Alarmlicht faerbt den Raum; aussen weich ein- und ausblenden, innen pulsieren */
.lk-puls .p-raum{inset:0;opacity:0;transition:opacity 1.8s ease}
.lk-puls .p-raum::before{content:'';position:absolute;inset:0;animation:pAlarmLicht 1.4s ease-in-out infinite;
  background:radial-gradient(ellipse 75% 55% at 50% 8%,rgba(255,36,64,.34),rgba(255,36,64,.09) 55%,transparent 82%)}
@keyframes pAlarmLicht{0%,100%{opacity:.3}50%{opacity:1}}
.lk-puls:is([data-akt="vf"],[data-akt="cpr"],[data-akt="laden"],[data-akt="clear"],[data-akt="schock"]) .p-raum{opacity:1;transition-duration:.6s}
/* Nach dem ersten Schlag: ruhiges, kuehles Licht vom Monitor */
.lk-puls .p-ruhe{inset:0;opacity:0;transition:opacity 2.4s ease;background:radial-gradient(ellipse 62% 52% at 50% 46%,rgba(63,242,127,.08),rgba(58,214,255,.03) 50%,transparent 75%)}
.lk-puls:is([data-akt="rosc"],[data-akt="widmung"]) .p-ruhe{opacity:1}
/* Schock: ein kurzer, gedaempfter Lichtschlag im Raum - kein weisser Vollbildblitz */
.lk-puls .p-blitz{inset:0;opacity:0;background:radial-gradient(ellipse 70% 60% at 50% 45%,rgba(200,220,255,.34),rgba(120,160,220,.1) 60%,transparent 100%)}
.lk-puls[data-akt="schock"] .p-blitz{animation:pBlitz .45s ease-out both}
@keyframes pBlitz{0%{opacity:1}100%{opacity:0}}
/* Kamera: Handkamera, Kompressionen, Schock - jede Bewegung auf eigener Ebene */
.lk-puls .lk-intro{display:block;padding:0}
.lk-puls .p-kamera{position:absolute;inset:0;display:grid;place-items:center;transition:opacity 1.2s ease}
.lk-puls[data-akt="widmung"] .p-kamera{opacity:.08}
.lk-puls .p-hand{animation:pHand 6.5s ease-in-out infinite alternate}
@keyframes pHand{from{transform:translate(-3px,2px) rotate(-.12deg)}to{transform:translate(3px,-2px) rotate(.1deg)}}
.lk-puls[data-akt="clear"] .p-hand{animation-play-state:paused}
.lk-puls:is([data-akt="cpr"],[data-akt="laden"]) .p-ruck{animation:pDruck .5455s ease-in-out infinite}
@keyframes pDruck{0%,100%{transform:none}35%{transform:translateY(1.4px)}}
.lk-puls[data-akt="schock"] .p-ruck{animation:pRuck .32s linear}
@keyframes pRuck{0%,100%{transform:none}25%{transform:translate(-6px,2px)}50%{transform:translate(5px,-3px)}75%{transform:translate(-2px,1px)}}
/* Das Geraet: Gehaeuse, Spiegelung auf der Ablage, 3D-Fahrt heran */
.lk-puls .p-geraet{position:relative;padding:16px 16px 30px;border-radius:22px;opacity:0;
  background:linear-gradient(180deg,#1d242d 0%,#12171d 55%,#0b0f13 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09),inset 0 -1px 0 rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.7),0 60px 120px rgba(0,0,0,.9);
  -webkit-box-reflect:below 12px linear-gradient(transparent 60%,rgba(255,255,255,.1))}
#egg[data-look="puls"][data-phase="intro"] .p-geraet{animation:pFahrt 10.4s cubic-bezier(.35,0,.25,1) both,lkEin 1.1s .1s ease forwards}
@keyframes pFahrt{
  0%{transform:perspective(1400px) translate3d(4%,1.5%,-190px) rotateY(-15deg) rotateX(5deg)}
  41%{transform:perspective(1400px) translate3d(1.2%,.3%,-55px) rotateY(-6deg) rotateX(2deg)}
  48%{transform:perspective(1400px) translate3d(1%,.2%,-46px) rotateY(-5.4deg) rotateX(1.8deg)}
  56%{transform:perspective(1400px) translate3d(.4%,0,8px) rotateY(-3deg) rotateX(1deg)}
  100%{transform:perspective(1400px) translate3d(0,-1%,40px) rotateY(0) rotateX(0)}}
/* Alarmlampe oben am Gehaeuse - leuchtet rot, solange der Alarm laeuft */
.lk-puls .p-lampe{position:absolute;left:50%;top:5px;width:22%;max-width:170px;height:5px;transform:translateX(-50%);border-radius:3px;
  background:#2a0c12;box-shadow:inset 0 1px 1px rgba(0,0,0,.7),0 1px 0 rgba(255,255,255,.05)}
.lk-puls .p-lampe i{position:absolute;inset:0;opacity:0;transition:opacity .9s ease}
.lk-puls .p-lampe i::before{content:'';position:absolute;inset:0;border-radius:3px;background:#ff3b55;
  box-shadow:0 0 10px #ff2f4d,0 0 36px rgba(255,47,77,.55);animation:pAlarmLicht 1.4s ease-in-out infinite}
.lk-puls:is([data-akt="vf"],[data-akt="cpr"],[data-akt="laden"],[data-akt="clear"],[data-akt="schock"]) .p-lampe i{opacity:1;transition-duration:.3s}
.lk-puls .p-fuss{position:absolute;left:20px;right:20px;bottom:8px;height:16px;display:flex;align-items:center;gap:12px}
.lk-puls .p-marke{font:700 9px/1 'Rajdhani',system-ui,sans-serif;letter-spacing:.34em;color:#56616d}
.lk-puls .p-tasten{display:flex;gap:6px;margin-left:auto}
.lk-puls .p-tasten i{display:block;width:22px;height:7px;border-radius:2px;background:#1a2128;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 1px 0 #000}
.lk-puls .p-led{width:6px;height:6px;border-radius:50%;background:#3ff27f;box-shadow:0 0 6px #3ff27f}
/* Der Bildschirm */
.lk-puls .p-monitor{position:relative;width:min(1000px,80vw);height:min(520px,54vh);display:flex;flex-direction:column;
  background:#03060a;border-radius:6px;overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.9),0 0 0 2px #06090c,0 0 70px rgba(63,242,127,.07);font-family:'Rajdhani',system-ui,sans-serif}
/* Glas: schwache Spiegelung und ein Hauch Pixelraster, sichtbar beim Heranfahren */
.lk-puls .p-glas{position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;
  background:linear-gradient(118deg,rgba(255,255,255,.075) 0%,rgba(255,255,255,.015) 27%,transparent 42%,transparent 80%,rgba(255,255,255,.035) 100%),
    repeating-linear-gradient(90deg,rgba(0,0,0,.1) 0 1px,transparent 1px 3px)}
.lk-puls[data-akt="schock"] .p-glas{animation:pGlas .32s ease-out}
@keyframes pGlas{0%{background-color:rgba(220,235,255,.2)}100%{background-color:transparent}}
.lk-puls .p-leiste{display:flex;align-items:center;gap:14px;height:30px;flex:none;padding:0 14px;background:#0c1218;
  border-bottom:1px solid rgba(160,180,200,.12);font-size:12px;font-weight:700;letter-spacing:.12em;color:#9fb0c2}
.lk-puls .p-alarmbalken{margin:0 auto;padding:3px 16px;border-radius:3px;background:var(--p-rot);color:#fff;font-weight:800;letter-spacing:.08em;
  animation:pAlarm 1s steps(1) infinite}
@keyframes pAlarm{0%,50%{opacity:1}51%,100%{opacity:.35}}
.lk-puls:is([data-akt="rosc"],[data-akt="widmung"]) .p-alarmbalken{visibility:hidden}
.lk-puls .p-code{color:#ffcf4a;font-variant-numeric:tabular-nums}
.lk-puls .p-code b{font-weight:700}
.lk-puls .p-uhr{font-variant-numeric:tabular-nums;color:#c9d4df}
.lk-puls .p-feld{flex:1;display:grid;grid-template-columns:1fr minmax(150px,24%);min-height:0}
.lk-puls .p-kurven{position:relative;border-right:1px solid rgba(160,180,200,.1)}
.lk-puls .p-ekg{position:absolute;left:0;top:4px;width:100%;height:calc(100% - 8px);display:block}
.lk-puls .p-k{position:absolute;left:10px;font-size:11px;font-weight:800;letter-spacing:.1em;transition:opacity .5s ease}
.lk-puls .p-k small{font-size:9px;opacity:.7}
.lk-puls .p-k1{top:6px;color:var(--p-ekg)}.lk-puls .p-k2{top:39%;color:var(--p-pleth)}.lk-puls .p-k3{top:68%;color:var(--p-co2)}
.lk-puls .p-werte{display:grid;grid-template-rows:1.5fr 1fr 1fr 1fr;min-height:0;transition:opacity .5s ease}
.lk-puls .p-wert{position:relative;text-align:left;display:flex;flex-wrap:wrap;align-items:baseline;align-content:center;column-gap:6px;padding:4px 14px;border-bottom:1px solid rgba(160,180,200,.08)}
.lk-puls .p-wert small{flex-basis:100%;font-size:11px;font-weight:800;letter-spacing:.12em}
.lk-puls .p-wert b{font-size:clamp(24px,3vw,40px);line-height:.95;font-weight:600;font-variant-numeric:tabular-nums}
.lk-puls .p-wert.hr b{font-size:clamp(40px,5.2vw,70px)}
.lk-puls .p-wert.nbp b{font-size:clamp(18px,2.2vw,30px)}
.lk-puls .p-wert em{font-style:normal;font-size:10px;font-weight:700;opacity:.7}
.lk-puls .p-grenzen{position:absolute;right:12px;top:9px;font-size:9px;line-height:1.25;font-weight:700;text-align:right;opacity:.5}
.lk-puls .p-awrr{position:absolute;right:12px;bottom:8px;font-size:9px;font-weight:700;letter-spacing:.08em;opacity:.75}
.lk-puls .p-awrr b{font-size:inherit!important;font-weight:800}
.lk-puls .hr{color:var(--p-ekg)}.lk-puls .spo2{color:var(--p-pleth)}.lk-puls .nbp{color:#e9eef4}.lk-puls .co2{color:var(--p-co2)}
/* Herzsymbol: blinkt mit jeder erkannten R-Zacke */
.lk-puls .p-herz{display:inline-block;margin-left:6px;font-style:normal;opacity:.12;transform-origin:50% 60%}
.lk-puls .p-herz.schlag{animation:pHerz .34s ease-out}
@keyframes pHerz{0%{opacity:1;transform:scale(1.35)}100%{opacity:.12;transform:none}}
/* NBP: waehrend der Messung sinkt der Manschettendruck */
.lk-puls .p-nbp.misst{font-style:italic;opacity:.75}
/* CPR-Rueckmeldung wie am Defibrillator: Takt, Tiefe, Zielbereich 5-6 cm */
.lk-puls .p-cpr{position:absolute;left:12px;bottom:10px;display:flex;align-items:center;gap:9px;padding:5px 10px;border-radius:4px;
  border:1px solid rgba(255,255,255,.18);background:rgba(4,8,12,.82);font-size:11px;font-weight:800;letter-spacing:.14em;color:#e9eef4;opacity:0;transition:opacity .3s}
.lk-puls .p-cpr small{font-size:9px;letter-spacing:.04em;opacity:.7}
.lk-puls .p-tiefe{position:relative;display:block;width:7px;height:22px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden}
.lk-puls .p-tiefe::before{content:'';position:absolute;left:0;right:0;top:56%;height:18%;background:rgba(63,242,127,.35)}
.lk-puls .p-tiefe i{position:absolute;inset:0;background:#e9eef4;transform-origin:50% 0;transform:scaleY(.05)}
.lk-puls:is([data-akt="cpr"],[data-akt="laden"]) .p-cpr{opacity:1}
.lk-puls:is([data-akt="cpr"],[data-akt="laden"]) .p-tiefe i{animation:pTiefe .5455s ease-in-out infinite}
@keyframes pTiefe{0%,100%{transform:scaleY(.05)}40%{transform:scaleY(.66)}}
/* Defibrillator unten im Kurvenfeld: laden, "PRESS SHOCK", ausgeloest */
.lk-puls .p-defi{position:absolute;right:12px;bottom:10px;display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:4px;
  background:rgba(255,200,60,.08);border:1px solid rgba(255,200,60,.25);font-size:11px;font-weight:700;letter-spacing:.12em;color:#ffcf4a;
  opacity:0;transition:opacity .3s,box-shadow .3s,border-color .3s}
.lk-puls:is([data-akt="laden"],[data-akt="clear"],[data-akt="schock"]) .p-defi{opacity:1}
.lk-puls[data-akt="clear"] .p-defi{border-color:rgba(255,207,74,.7);box-shadow:0 0 26px rgba(255,200,60,.22)}
.lk-puls .p-defi b{font-weight:900}.lk-puls .p-defi em{font-style:normal;color:#ffe6a3}
.lk-puls .p-ladung{display:block;width:90px;height:6px;border-radius:3px;background:rgba(255,207,74,.15);overflow:hidden}
.lk-puls .p-ladung i{display:block;height:100%;transform-origin:0 50%;transform:scaleX(0);background:#ffcf4a}
.lk-puls[data-akt="laden"] .p-ladung i{animation:pLaden .9s cubic-bezier(.4,0,.2,1) forwards}
.lk-puls[data-akt="clear"] .p-ladung i{transform:scaleX(1)}
@keyframes pLaden{to{transform:scaleX(1)}}
.lk-puls .p-bereit,.lk-puls .p-geschockt{display:none;color:#fff}
.lk-puls[data-akt="clear"] .p-bereit{display:inline;animation:pAlarm .5s steps(1) infinite}
/* Nach dem Schock bleibt die Meldung stehen, solange das Feld ausblendet */
.lk-puls:is([data-akt="schock"],[data-akt="rosc"],[data-akt="widmung"]) .p-geschockt{display:inline}
.lk-puls:is([data-akt="schock"],[data-akt="rosc"],[data-akt="widmung"]) :is(.p-ladung,.p-defi em){display:none}
/* "Clear!": alles tritt zurueck, nur der Defibrillator bleibt hell */
.lk-puls[data-akt="clear"] :is(.p-werte,.p-k){opacity:.4}
/* Infusionsstaender im Vordergrund, unscharf - faehrt schneller als das Geraet vorbei */
.lk-puls .p-vorne{position:absolute;left:6%;top:-10%;bottom:-10%;width:26px;z-index:2;border-radius:13px;opacity:.95;filter:blur(9px);
  background:linear-gradient(90deg,#010203 0%,#0a0e12 42%,#1c2834 52%,#05070a 68%,#010203 100%);
  animation:pVorne 10.4s cubic-bezier(.35,0,.25,1) both}
.lk-puls .p-vorne::before{content:'';position:absolute;left:-36px;top:13%;width:96px;height:150px;border-radius:26px 26px 36px 36px;
  background:radial-gradient(ellipse at 62% 38%,rgba(160,205,235,.17),rgba(16,24,32,.7) 58%,rgba(3,5,7,.95))}
@keyframes pVorne{from{transform:translateX(30px)}to{transform:translateX(-90px)}}
/* Untertitel wie im Kino; Ort als Titelzeile, der Ruf "Clear!" lauter */
.lk-puls .p-untertitel{position:absolute;left:50%;bottom:calc(11vh + 22px);z-index:3;transform:translateX(-50%);max-width:80vw;text-align:center;opacity:0;
  font:500 clamp(16px,1.7vw,22px)/1.3 'Rajdhani',system-ui,sans-serif;letter-spacing:.04em;color:#f3f0e8;text-shadow:0 2px 8px #000,0 0 2px #000}
.lk-puls .p-untertitel[data-art="ort"]{font-size:clamp(11px,1.15vw,14px);font-weight:700;letter-spacing:.36em;margin-right:-.36em;color:#c9d2dc}
.lk-puls .p-untertitel[data-art="ruf"]{font-size:clamp(22px,2.5vw,34px);font-weight:700;letter-spacing:.08em}
.lk-puls .p-untertitel.an{animation:lkEin .35s ease forwards}
/* Widmung, wie eine Titelkarte; die zweite Zeile kommt einen Atemzug spaeter */
.lk-puls .p-widmung{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;opacity:0;pointer-events:none}
.lk-puls .p-widmung em{font:italic 400 clamp(28px,3.6vw,50px)/1.2 Georgia,'Times New Roman',serif;color:#f4efe6;text-shadow:0 0 30px rgba(0,0,0,.9)}
.lk-puls[data-akt="widmung"] .p-widmung{animation:pWidmung 2.6s ease forwards}
.lk-puls[data-akt="widmung"] .p-widmung em+em{opacity:0;animation:lkAuf .9s .5s ease forwards}
@keyframes pWidmung{0%{opacity:0}30%,82%{opacity:1}100%{opacity:0}}
/* Kinobalken und Filmkorn liegen ueber allem, auch ueber dem Film */
.lk-puls .p-balken{position:absolute;left:0;right:0;z-index:4;height:11vh;background:#000;transform:scaleY(0);
  transition:transform 1s cubic-bezier(.2,.8,.2,1),height .8s ease}
.lk-puls .p-balken.oben{top:0;transform-origin:50% 0}.lk-puls .p-balken.unten{bottom:0;transform-origin:50% 100%}
#egg[data-look="puls"]:is([data-phase="intro"],[data-phase="clip"],[data-phase="outro"]) .p-balken{transform:scaleY(1)}
#egg[data-look="puls"][data-phase="clip"] .p-balken{height:5vh}
.lk-puls .p-korn{position:absolute;inset:-40%;z-index:4;opacity:.06;mix-blend-mode:screen;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grKorn .5s steps(5) infinite}
/* Waehrend des Films: nichts lenkt ab - nur eine stille Zeile im unteren Balken */
.lk-puls .lk-hud{z-index:5;inset:0}
.lk-puls .p-ehren{bottom:calc(2.5vh - 6px)!important;font:600 10px/1 'Rajdhani',system-ui,sans-serif;letter-spacing:.42em;margin-right:-.42em;
  text-transform:uppercase;color:#7e8a98}
#egg[data-look="puls"] .egg-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#egg[data-look="puls"] .egg-hint{display:none}
#egg[data-look="puls"] .egg-inner{padding-top:calc(5vh + 14px);padding-bottom:calc(5vh + 12px);gap:12px}
#egg[data-look="puls"] #eggVid{border-color:rgba(255,255,255,.06);border-radius:4px;box-shadow:0 30px 80px rgba(0,0,0,.85)}
#egg[data-look="puls"] .egg-controls button{background:rgba(8,10,14,.9);border-color:rgba(255,255,255,.14)}
#egg[data-look="puls"] .egg-controls button:hover{background:rgba(63,242,127,.12);border-color:rgba(63,242,127,.5)}
/* Abspann (v174): Dank wie auf Marcelos Vorlage - Monitorraster in Tuerkis,
   eine leuchtende Herzlinie, in der Mitte zeichnet sich der Stab mit Fluegeln
   und Schlangen; dann "REAL HEROES" und der Dank. */
.lk-puls .lk-outro{display:block;padding:0;background:radial-gradient(ellipse 80% 70% at 50% 40%,#0a222a 0%,#06151b 50%,#020709 100%)}
.lk-puls .p-raster{position:absolute;inset:0;opacity:0;
  background-image:linear-gradient(rgba(110,215,235,.17) 1px,transparent 1px),linear-gradient(90deg,rgba(110,215,235,.17) 1px,transparent 1px);
  background-size:46px 46px;background-position:center;
  -webkit-mask-image:radial-gradient(ellipse 80% 75% at 50% 42%,#000 35%,transparent 100%);
          mask-image:radial-gradient(ellipse 80% 75% at 50% 42%,#000 35%,transparent 100%)}
#egg[data-look="puls"][data-phase="outro"] .p-raster{animation:lkEin .9s ease forwards}
.lk-puls .p-linie{position:absolute;inset:0;width:100%;height:100%;display:block}
.lk-puls .p-stab{position:absolute;left:50%;top:15vh;height:42vh;width:28vh;transform:translateX(-50%);overflow:visible;
  filter:drop-shadow(0 0 3px rgba(170,240,252,.9)) drop-shadow(0 0 14px rgba(70,200,235,.55))}
.lk-puls .p-stab :is(.h,.kopf,.kugel){fill:none;stroke:#c8f6ff;stroke-linecap:round;stroke-linejoin:round}
.lk-puls .p-stab .d{fill:none;stroke:#06161c;stroke-linecap:round;stroke-linejoin:round}
.lk-puls .p-stab :is(.kopf,.kugel){fill:#06161c;stroke-width:2.2}
.lk-puls .p-stab .kugel{stroke-width:2.8}
/* Die Koepfe erscheinen erst, wenn die Schlangen oben angekommen sind */
.lk-puls .p-stab .kopfgruppe{opacity:0}
#egg[data-look="puls"][data-phase="outro"] .p-stab .kopfgruppe{animation:lkEin .4s 2.35s ease forwards}
.lk-puls .p-stab .auge{fill:#c8f6ff;opacity:0}
.lk-puls .p-stab .flaeche{fill:#06161c;opacity:0}
.lk-puls .p-stab [pathLength]{stroke-dasharray:1;stroke-dashoffset:1}
#egg[data-look="puls"][data-phase="outro"] .p-stab [pathLength]{animation:pZeichnen var(--z,1.2s) var(--d,1s) cubic-bezier(.45,0,.25,1) forwards}
#egg[data-look="puls"][data-phase="outro"] .p-stab :is(.flaeche,.auge){animation:lkEin .7s 2.2s ease forwards}
@keyframes pZeichnen{to{stroke-dashoffset:0}}
.lk-puls .p-worte{position:absolute;left:0;right:0;top:60vh;display:flex;flex-direction:column;align-items:center;gap:10px;padding:0 24px;text-align:center}
.lk-puls .p-worte strong{font:700 clamp(30px,4.4vw,60px)/1 'Rajdhani',system-ui,sans-serif;letter-spacing:.3em;margin-right:-.3em;text-transform:uppercase;
  color:#effcff;text-shadow:0 0 18px rgba(110,220,245,.65),0 0 2px rgba(235,252,255,.75);opacity:0}
.lk-puls .p-worte em{max-width:min(760px,90vw);font:italic 400 clamp(17px,1.9vw,26px)/1.35 Georgia,'Times New Roman',serif;color:#cfeef4;text-wrap:balance;opacity:0}
.lk-puls .p-worte span{margin-top:4px;font:700 11px/1 'Rajdhani',system-ui,sans-serif;letter-spacing:.42em;margin-right:-.42em;text-transform:uppercase;color:#6f9ba6;opacity:0}
#egg[data-look="puls"][data-phase="outro"] .p-worte strong{animation:lkAuf 1s 2.8s ease forwards}
#egg[data-look="puls"][data-phase="outro"] .p-worte em{animation:lkAuf .9s 3.4s ease forwards}
#egg[data-look="puls"][data-phase="outro"] .p-worte span{animation:lkAuf .8s 4s ease forwards}
@media (max-width:640px){
  .lk-puls .p-monitor{width:88vw;height:50vh}
  .lk-puls .p-geraet{padding:9px 8px 22px;border-radius:14px}
  .lk-puls .p-fuss{left:12px;right:12px;bottom:4px}
  .lk-puls .p-feld{grid-template-columns:1fr 36%}
  .lk-puls .p-leiste{gap:8px;padding:0 8px;font-size:10px}
  .lk-puls :is(.p-ort,.p-grenzen,.p-vorne,.p-marke,.p-tasten,.p-cpr>span,.p-defi em){display:none}
  .lk-puls .p-alarmbalken{padding:3px 8px}
  /* schmal: CPR-Anzeige oben rechts im Kurvenfeld, Defibrillator unten ueber die ganze Breite */
  .lk-puls .p-cpr{left:auto;right:8px;bottom:auto;top:6px;padding:4px 7px}
  .lk-puls .p-defi{left:8px;right:8px;bottom:8px;justify-content:space-between;gap:8px}
  .lk-puls .p-ladung{flex:1;width:auto}
}
@media (prefers-reduced-motion:reduce){
  .lk-puls *,.lk-puls,.lk-puls *::before{animation:none!important}
  .lk-puls .p-geraet,.lk-puls .p-raster,.lk-puls .p-worte :is(strong,em,span),.lk-puls .p-stab :is(.flaeche,.auge,.kopfgruppe){opacity:1}
  .lk-puls .p-stab [pathLength]{stroke-dashoffset:0}
}

/* ================= COCKPIT · Volvo S60 T8 (v68: echte Werte, voll animiert) =================
   Ablauf im Intro ueber .lk-cockpit[data-akt] (egg-looks.js, COCKPIT):
     start  Start-Knopf pulsiert und wird gedrueckt
     kraft  Kombiinstrument faehrt hoch: 709 Nm, 449 HP, 91 km; Leistungsfluss 310 + 145 = 455 PS
     ampel  Startampel, drei rote Lichter
     launch 0-100 km/h in Echtzeit (4,6 s), Strasse und Streifen beschleunigen
     ziel   4.60 s leuchtet auf
   Waehrend des Videos: Datenblatt links, Leistungsfluss rechts, am Handy eine
   Laufzeile. Ruhezustand jedes Teils = Endzustand; Animationen laufen nur im
   jeweiligen Akt. */
#egg[data-look="cockpit"]{--c-hell:#d9efff;--c-blau:#5cb4ff;--c-orange:#ff6a1a;--c-rot:#ff2d3a;--c-strom:#35d6ff;--c-gruen:#48f59a}
#egg[data-look="cockpit"]{background:#040608}
.lk-cockpit .c-himmel{inset:0;background:linear-gradient(180deg,#020305 0%,#070b12 45%,#141a26 58%,#2a1f1a 63%,#06080b 64%,#040608 100%)}
.lk-cockpit .c-stadt{left:0;right:0;top:52%;height:12%;
  background:radial-gradient(ellipse 40% 100% at 30% 100%,rgba(255,150,70,.22),transparent 70%),
    radial-gradient(ellipse 35% 100% at 72% 100%,rgba(120,170,255,.16),transparent 70%)}
/* v146: Die Strasse zeichnet egg-looks.js als Nachtfahrt auf #eggFx
   (nasse Fahrbahn, Laternen mit Spiegelung, eigene Scheinwerfer). */
/* Beim Sprint hellt der Horizont auf. */
.lk-cockpit .c-stadt{transition:opacity 1.2s ease;opacity:.75}
.lk-cockpit:is([data-akt="launch"],[data-akt="ziel"]) .c-stadt{opacity:1}

/* ---------- Akt start: Motorstart-Knopf ---------- */
.lk-cockpit .c-zuendung{position:absolute;left:50%;top:50%;width:clamp(118px,15vw,156px);aspect-ratio:1;border-radius:50%;
  display:grid;place-items:center;transform:translate(-50%,-50%);
  background:radial-gradient(circle at 50% 38%,#1a2433 0,#0d131c 58%,#070a10 72%);
  box-shadow:0 0 0 2px rgba(120,180,255,.34),0 0 0 9px rgba(10,14,20,.9),0 0 0 10px rgba(120,180,255,.14),0 0 46px rgba(60,150,255,.28);
  opacity:0;visibility:hidden;transition:opacity .35s ease,transform .45s ease,visibility 0s .45s}
.lk-cockpit[data-akt="start"] .c-zuendung{opacity:1;visibility:visible;transition:none;animation:cDruck .8s .5s ease-out both}
@keyframes cDruck{0%{opacity:0;transform:translate(-50%,-50%) scale(.82)}30%{opacity:1;transform:translate(-50%,-50%) scale(1)}
  72%{transform:translate(-50%,-50%) scale(1)}84%{transform:translate(-50%,-50%) scale(.9)}100%{transform:translate(-50%,-50%) scale(1)}}
.lk-cockpit:not([data-akt="start"]) .c-zuendung{transform:translate(-50%,-50%) scale(1.5)}
.lk-cockpit .c-zuendung span{display:flex;flex-direction:column;align-items:center;gap:3px;font:700 clamp(11px,1.3vw,13px)/1 'Orbitron',Rajdhani,sans-serif;
  letter-spacing:.2em;margin-right:-.2em;color:#eaf5ff;text-transform:uppercase;text-shadow:0 0 12px rgba(92,180,255,.8)}
.lk-cockpit .c-zuendung small{margin-top:5px;font:500 8px/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.3em;color:#6f879b}
.lk-cockpit .c-puls{position:absolute;inset:0;border-radius:50%;border:2px solid var(--c-blau);opacity:0}
.lk-cockpit[data-akt="start"] .c-puls{animation:cPuls .9s ease-out infinite}
.lk-cockpit[data-akt="start"] .c-puls+.c-puls{animation-delay:.45s}
@keyframes cPuls{from{opacity:.75;transform:scale(1)}to{opacity:0;transform:scale(1.7)}}

/* ---------- v146 Akt start: zuerst die Tagfahrlichter ----------
   Zwei Scheinwerfer links und rechts vom Start-Knopf - das Gesicht des
   Autos. Das T-foermige Licht laeuft von innen nach aussen an, ein
   waagrechter Lichtschein zieht durchs Bild, dann der Knopf. Bei "kraft"
   fahren die Lichter an der Kamera vorbei. Nur transform, opacity und
   stroke-dashoffset werden bewegt. */
.lk-cockpit .c-licht{position:absolute;left:50%;top:50%;width:min(1080px,94vw);transform:translate(-50%,-50%);
  display:flex;justify-content:space-between;align-items:center;opacity:0;visibility:hidden;pointer-events:none}
.lk-cockpit .c-lampe{display:block;width:clamp(120px,24vw,300px)}
.lk-cockpit .c-lampe.r{transform:scaleX(-1)}
.lk-cockpit .c-lampe svg{display:block;width:100%;height:auto;overflow:visible}
.lk-cockpit .c-gehaeuse{fill:rgba(8,12,18,.8);stroke:rgba(150,180,215,.16);stroke-width:1.2}
.lk-cockpit .c-drl-pfad{fill:none;stroke:#eef7ff;stroke-width:4.5;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0}
.lk-cockpit .c-drl{filter:drop-shadow(0 0 4px #d9efff) drop-shadow(0 0 14px rgba(140,200,255,.85))}
.lk-cockpit .c-flare{position:absolute;left:-20%;right:-20%;top:50%;height:3px;margin-top:-1px;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(150,205,255,.35) 18%,rgba(225,242,255,.95) 50%,rgba(150,205,255,.35) 82%,transparent);
  filter:blur(1.5px);box-shadow:0 0 22px 4px rgba(120,190,255,.35)}
.lk-cockpit[data-akt="start"] .c-licht{opacity:1;visibility:visible}
.lk-cockpit[data-akt="start"] .c-drl-pfad{animation:cDrl .6s .15s cubic-bezier(.3,.7,.2,1) both}
.lk-cockpit[data-akt="start"] .c-lampe.r .c-drl-pfad{animation-delay:.24s}
.lk-cockpit[data-akt="start"] .c-flare{animation:cFlare 1.1s .55s ease-out both}
@keyframes cDrl{from{stroke-dashoffset:100;opacity:.2}to{stroke-dashoffset:0;opacity:1}}
@keyframes cFlare{0%{opacity:0;transform:scaleX(.2)}22%{opacity:1;transform:scaleX(1)}100%{opacity:.18;transform:scaleX(1)}}
.lk-cockpit[data-akt="kraft"] .c-licht{visibility:visible;animation:cLichtWeg .9s cubic-bezier(.5,0,.8,.4) both}
@keyframes cLichtWeg{from{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(1.9)}}
/* Waehrend des Films: kleine Tagfahrlichter oben, sie blitzen auf den Schnitten auf. */
.lk-cockpit .c-drl-hud{top:-4px;display:flex;justify-content:space-between;align-items:center;opacity:.28;transition:opacity .5s ease;
  width:calc(24 * clamp(8px,1.2vw,14px) + 92px + 2 * clamp(46px,5vw,64px) + 44px)}   /* links und rechts neben der Drehzahlleiste */
@media (max-width:640px){.lk-cockpit .c-drl-hud{display:none}}
.lk-cockpit .c-drl-hud .c-lampe{width:clamp(46px,5vw,64px)}
.lk-cockpit .c-drl-hud .c-gehaeuse{fill:none;stroke:rgba(150,180,215,.25)}
.lk-cockpit .c-drl-hud .c-drl{filter:drop-shadow(0 0 3px rgba(190,225,255,.7))}
.lk-cockpit.c-drl-an .c-drl-hud{opacity:1;transition:none;animation:cDrlHud .7s ease-out both}
@keyframes cDrlHud{0%{opacity:1;filter:brightness(1.8)}100%{opacity:.28;filter:none}}

/* ---------- Buehne: Kombiinstrument, darunter Leistungsfluss oder Sprint ---------- */
.lk-cockpit .c-buehne{display:flex;flex-direction:column;align-items:center;gap:clamp(8px,2vh,20px);opacity:0;transition:opacity .5s ease}
.lk-cockpit:not([data-akt="start"]) .c-buehne{opacity:1}
.lk-cockpit .c-cluster{display:flex;align-items:center;gap:clamp(4px,1.6vw,26px);transition:opacity .7s ease}
.lk-cockpit[data-akt="kraft"] .c-cluster{animation:cInstrumentEin 1.1s ease-out both}
@keyframes cInstrumentEin{from{opacity:0;transform:translateY(20px) scale(.87)}to{opacity:1;transform:none}}
.lk-cockpit:is([data-akt="ampel"],[data-akt="launch"],[data-akt="ziel"]) .c-cluster{opacity:.5}
.lk-cockpit .c-instrument{position:relative;width:clamp(200px,24vw,310px);aspect-ratio:1}
.lk-cockpit .c-instrument::before,.lk-cockpit .c-dial::before{content:"";position:absolute;inset:-6%;border-radius:50%;
  background:radial-gradient(circle,rgba(20,30,44,.9) 0 58%,rgba(10,14,20,.95) 70%,rgba(0,0,0,0) 72%);
  box-shadow:0 0 0 1px rgba(120,180,255,.18),0 0 60px rgba(60,150,255,.15)}
.lk-cockpit .c-dial{position:relative;width:clamp(104px,12.5vw,168px);aspect-ratio:1}
.lk-cockpit .c-dial svg,.lk-cockpit svg.c-tacho{position:relative;width:100%;height:100%;overflow:visible}
.lk-cockpit .c-titel{position:absolute;left:50%;top:104%;transform:translateX(-50%);white-space:nowrap;
  font:600 clamp(8px,.85vw,10px)/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.24em;margin-right:-.24em;color:#7f93a6;text-transform:uppercase}

/* Skalen: Striche und Zahlen erscheinen einzeln beim Hochfahren. */
.lk-cockpit :is(.c-tacho,.c-dial svg) .c-skala line{stroke:var(--c-hell);stroke-width:1.4}
.lk-cockpit .c-dial svg .c-skala line{stroke-width:1}
.lk-cockpit :is(.c-tacho,.c-dial svg) .c-skala line.g{stroke-width:3}
.lk-cockpit .c-dial svg .c-skala line.g{stroke-width:2}
.c-tacho .c-skala line.rot{stroke:var(--c-rot)}
.lk-cockpit :is(.c-tacho,.c-dial svg) .c-skala text{font-family:'Orbitron',Rajdhani,sans-serif;font-size:11px;font-weight:500;fill:#9fb8cc;text-anchor:middle}
.lk-cockpit .c-dial svg .c-skala text{font-size:7.5px}
.lk-cockpit[data-akt="kraft"] :is(.c-tacho,.c-dial svg) .c-skala :is(line,text){animation:lkEin .25s both;animation-delay:calc(.1s + var(--i,0) * 9ms)}
.lk-cockpit[data-akt="kraft"] .c-dial svg .c-skala :is(line,text){animation-delay:calc(.2s + var(--i,0) * 14ms)}
.lk-cockpit :is(.c-tacho,.c-dial svg) .c-bahn{fill:none;stroke:rgba(120,170,220,.16);stroke-width:7}
.lk-cockpit .c-dial svg .c-bahn,.lk-cockpit .c-dial svg .c-fuell{stroke-width:5}
.c-tacho .c-rotzone{fill:none;stroke:rgba(255,45,58,.55);stroke-width:7}
.c-tacho .c-fuell{fill:none;stroke:url(#cVerlauf);stroke-width:7;stroke-linecap:round;stroke-dasharray:1000;stroke-dashoffset:102;
  filter:drop-shadow(0 0 6px rgba(92,180,255,.8))}
.lk-cockpit[data-akt="kraft"] .c-tacho .c-fuell{animation:cFuell 2.2s .3s both}
@keyframes cFuell{0%,16%{stroke-dashoffset:1000;animation-timing-function:cubic-bezier(.4,0,.2,1)}
  42%{stroke-dashoffset:0;animation-timing-function:cubic-bezier(.4,0,.6,1)}
  62%{stroke-dashoffset:1000;animation-timing-function:cubic-bezier(.3,0,.1,1)}
  92%{stroke-dashoffset:84;animation-timing-function:ease-in-out}100%{stroke-dashoffset:102}}
.c-tacho .c-zeiger{transform:rotate(107.46deg)}
.c-tacho .c-zeiger path{fill:var(--c-orange);filter:drop-shadow(0 0 6px rgba(255,106,26,.9))}
.lk-cockpit[data-akt="kraft"] .c-tacho .c-zeiger{animation:cZeiger 2.2s .3s both}
@keyframes cZeiger{0%,16%{transform:rotate(-135deg);animation-timing-function:cubic-bezier(.4,0,.2,1)}
  42%{transform:rotate(135deg);animation-timing-function:cubic-bezier(.4,0,.6,1)}
  62%{transform:rotate(-135deg);animation-timing-function:cubic-bezier(.3,0,.1,1)}
  92%{transform:rotate(111deg);animation-timing-function:ease-in-out}100%{transform:rotate(107.46deg)}}
.lk-cockpit :is(.c-tacho,.c-dial svg) .c-nabe{fill:#0b1119;stroke:var(--c-orange);stroke-width:2}
/* Kleine Anzeigen: Drehmoment in Orange wie der Benziner, Reichweite im Stromblau. */
.lk-cockpit .c-dial .c-fuell{fill:none;stroke-linecap:round;stroke-dasharray:1000;stroke-dashoffset:var(--rest)}
.lk-cockpit .c-nm{--farbe:var(--c-orange)}.lk-cockpit .c-ev{--farbe:var(--c-strom)}
.lk-cockpit .c-dial .c-fuell{stroke:var(--farbe);filter:drop-shadow(0 0 5px var(--farbe))}
.lk-cockpit .c-dial .c-zeiger{transform:rotate(var(--nach))}
.lk-cockpit .c-dial .c-zeiger path{fill:var(--farbe);filter:drop-shadow(0 0 5px var(--farbe))}
.lk-cockpit .c-dial .c-nabe{stroke:var(--farbe)}
.lk-cockpit[data-akt="kraft"] .c-dial .c-fuell{animation:cDialFuell 1.5s cubic-bezier(.25,.8,.25,1) both;animation-delay:.35s}
.lk-cockpit[data-akt="kraft"] .c-dial .c-zeiger{animation:cDialZeiger 1.5s cubic-bezier(.25,.8,.25,1) both;animation-delay:.35s}
.lk-cockpit[data-akt="kraft"] .c-ev :is(.c-fuell,.c-zeiger){animation-delay:.5s}
@keyframes cDialFuell{from{stroke-dashoffset:1000}to{stroke-dashoffset:var(--rest)}}
@keyframes cDialZeiger{0%{transform:rotate(var(--von))}64%{transform:rotate(calc(var(--nach) + 7deg))}100%{transform:rotate(var(--nach))}}
.lk-cockpit .c-anzeige,.lk-cockpit .c-wert{position:absolute;left:50%;transform:translate(-50%,-50%);display:flex;align-items:baseline;gap:5px;color:#fff}
.lk-cockpit .c-anzeige{top:80%}.lk-cockpit .c-wert{top:78%}
.lk-cockpit :is(.c-anzeige,.c-wert) b{font:900 clamp(28px,3.6vw,44px)/1 'Orbitron',Rajdhani,sans-serif;font-variant-numeric:tabular-nums;
  text-shadow:0 0 20px rgba(92,180,255,.6);min-width:3ch;text-align:right}
.lk-cockpit .c-wert b{font-size:clamp(15px,1.7vw,22px);text-shadow:0 0 14px var(--farbe)}
.lk-cockpit :is(.c-anzeige,.c-wert) small{font:700 12px/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.2em;color:var(--c-blau)}
.lk-cockpit .c-wert small{font-size:8px;color:var(--farbe)}

/* Unter dem Instrument: Leistungsfluss (kraft) und Sprint (ampel/launch/ziel) auf demselben Platz. */
.lk-cockpit .c-unten{display:grid;justify-items:center;align-items:start;margin-top:clamp(10px,2vh,18px)}
.lk-cockpit .c-unten>*{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity .45s ease,transform .6s cubic-bezier(.2,.8,.2,1),visibility 0s .45s}
.lk-cockpit[data-akt="kraft"] .c-fluss,
.lk-cockpit:is([data-akt="ampel"],[data-akt="launch"],[data-akt="ziel"]) .c-launch{opacity:1;visibility:visible;transform:none;
  transition:opacity .45s ease,transform .6s cubic-bezier(.2,.8,.2,1),visibility 0s}
.lk-cockpit .c-fluss{display:flex;align-items:stretch;gap:clamp(5px,1.2vw,14px)}
.lk-cockpit .c-quelle{display:flex;flex-direction:column;gap:7px;min-width:clamp(78px,10vw,124px);padding:10px 12px;border-radius:10px;text-align:left;
  border:1px solid rgba(159,212,255,.18);background:linear-gradient(rgba(159,212,255,.07),rgba(159,212,255,.01))}
.lk-cockpit[data-akt="kraft"] .c-quelle{animation:lkAuf .6s both;animation-delay:.9s}
.lk-cockpit[data-akt="kraft"] .c-quelle.strom{animation-delay:1.15s}
.lk-cockpit[data-akt="kraft"] .c-quelle.system{animation-delay:1.4s}
.lk-cockpit[data-akt="kraft"] .c-op{animation:lkEin .4s both;animation-delay:1.1s}
.lk-cockpit[data-akt="kraft"] .c-op+.c-quelle+.c-op{animation-delay:1.35s}
.lk-cockpit .c-quelle small{font:600 9px/1 'Rajdhani',sans-serif;letter-spacing:.2em;color:#8fa7bb;text-transform:uppercase}
.lk-cockpit .c-quelle b{font:900 clamp(18px,2.3vw,28px)/1 'Orbitron',Rajdhani,sans-serif;color:#fff;font-variant-numeric:tabular-nums}
.lk-cockpit .c-quelle em{font:700 10px/1 'Orbitron',Rajdhani,sans-serif;font-style:normal;letter-spacing:.14em;margin-left:5px;color:var(--farbe)}
.lk-cockpit .c-balken{display:block;height:4px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden}
.lk-cockpit .c-balken i{display:block;height:100%;border-radius:inherit;transform-origin:0 50%;transform:scaleX(var(--anteil));
  background:var(--farbe);box-shadow:0 0 8px var(--farbe)}
.lk-cockpit .benzin{--farbe:var(--c-orange)}.lk-cockpit .strom{--farbe:var(--c-strom)}
.lk-cockpit .system{--farbe:#ffffff}
.lk-cockpit .c-quelle.system{border-color:rgba(255,255,255,.34);background:linear-gradient(rgba(255,255,255,.1),rgba(255,255,255,.02))}
.lk-cockpit[data-akt="kraft"] .c-quelle .c-balken i{animation:cBalken 1s cubic-bezier(.2,.8,.2,1) both;animation-delay:1.05s}
.lk-cockpit[data-akt="kraft"] .c-quelle.strom .c-balken i{animation-delay:1.3s}
.lk-cockpit[data-akt="kraft"] .c-quelle.system .c-balken i{animation-delay:1.55s}
@keyframes cBalken{from{transform:scaleX(0)}}
.lk-cockpit .c-op{align-self:center;font:700 clamp(15px,1.8vw,20px)/1 'Orbitron',Rajdhani,sans-serif;color:#6f879b}

/* Sprint: Startampel, Stoppuhr, Tempo, Fortschritt. */
.lk-cockpit .c-launch{display:flex;flex-direction:column;align-items:center;gap:9px}
.lk-cockpit .c-l-kopf{display:flex;align-items:center;gap:14px;font:600 10px/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.3em;color:#9fb8cc;text-transform:uppercase}
.lk-cockpit .c-ampel{display:flex;gap:6px}
.lk-cockpit .c-ampel i{display:block;width:10px;height:10px;border-radius:50%;background:#1c2633;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.lk-cockpit[data-akt="ampel"] .c-ampel i{animation:cAmpel .15s both}
.lk-cockpit[data-akt="ampel"] .c-ampel i:nth-child(2){animation-delay:.25s}
.lk-cockpit[data-akt="ampel"] .c-ampel i:nth-child(3){animation-delay:.5s}
@keyframes cAmpel{to{background:var(--c-rot);box-shadow:0 0 10px var(--c-rot)}}
.lk-cockpit:is([data-akt="launch"],[data-akt="ziel"]) .c-ampel i{background:var(--c-gruen);box-shadow:0 0 10px var(--c-gruen)}
.lk-cockpit .c-l-werte{display:flex;align-items:baseline;gap:6px;color:#fff}
.lk-cockpit .c-l-werte b{display:inline-block;font:900 clamp(34px,5.2vw,62px)/1 'Orbitron',Rajdhani,sans-serif;font-variant-numeric:tabular-nums;
  text-shadow:0 0 24px rgba(92,180,255,.55)}
.lk-cockpit .c-l-zeit{min-width:4.2ch;text-align:right}
.lk-cockpit .c-l-tempo{min-width:3ch;text-align:right}
.lk-cockpit .c-l-werte small{font:700 11px/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.2em;color:var(--c-blau)}
.lk-cockpit .c-l-werte small:first-of-type{margin-right:clamp(14px,3vw,34px)}
.lk-cockpit .c-l-bahn{position:relative;width:clamp(220px,32vw,400px);height:6px;border-radius:3px;background:rgba(255,255,255,.08)}
.lk-cockpit .c-l-fort{position:absolute;inset:0;border-radius:inherit;transform-origin:0 50%;transform:scaleX(1);
  background:linear-gradient(90deg,var(--c-blau),#9fd4ff 70%,var(--c-orange));box-shadow:0 0 12px rgba(92,180,255,.6)}
.lk-cockpit .c-l-marken{display:flex;justify-content:space-between;width:clamp(220px,32vw,400px);font:500 9px/1 'Orbitron',Rajdhani,sans-serif;color:#6f879b}
.lk-cockpit .c-l-notiz{font:600 9px/1 'Rajdhani',sans-serif;letter-spacing:.24em;color:#7f93a6;text-transform:uppercase;opacity:0}
.lk-cockpit[data-akt="ziel"] .c-l-zeit{color:#ffd2b8;text-shadow:0 0 26px rgba(255,106,26,.85);animation:cStempel .6s cubic-bezier(.2,1.4,.3,1) both}
@keyframes cStempel{0%{transform:scale(1)}40%{transform:scale(1.16)}100%{transform:scale(1)}}
.lk-cockpit[data-akt="ziel"] .c-l-notiz{animation:lkAuf .6s .15s both}
.lk-cockpit .c-modell{font:500 clamp(12px,1.5vw,16px)/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.6em;margin-right:-.6em;color:#9fb8cc}
.lk-cockpit .c-modell b{color:#fff;font-weight:700}
.lk-cockpit[data-akt="kraft"] .c-modell{animation:lkAuf .7s 1.7s ease both}

/* ---------- Rahmen waehrend des Videos ---------- */
.lk-cockpit .lk-hud{color:#9fb8cc;font-family:'Orbitron',Rajdhani,sans-serif;font-weight:500;letter-spacing:.24em}
.lk-cockpit .c-drehzahl{left:50%;top:6px;transform:translateX(-50%);display:flex;gap:4px}
.lk-cockpit .c-drehzahl i{display:block;width:clamp(8px,1.2vw,14px);height:5px;border-radius:1px;background:#1c2633;
  animation:cDrehzahl 2.6s ease-in-out infinite;animation-delay:calc(var(--i) * 45ms)}
.lk-cockpit .c-drehzahl i:nth-child(-n+14){--c:#5cb4ff}
.lk-cockpit .c-drehzahl i:nth-child(n+15):nth-child(-n+20){--c:#ffb020}
.lk-cockpit .c-drehzahl i:nth-child(n+21){--c:#ff2d3a}
@keyframes cDrehzahl{0%,100%{background:#1c2633;box-shadow:none}45%,55%{background:var(--c);box-shadow:0 0 8px var(--c)}}
.lk-cockpit .c-gang{display:flex;flex-direction:column;align-items:flex-start;gap:4px;font:700 clamp(24px,3vw,34px)/1 'Orbitron',Rajdhani,sans-serif;
  color:#fff;letter-spacing:0;text-shadow:0 0 18px rgba(92,180,255,.7)}
.lk-cockpit .c-gang small{font:500 9px/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.3em;color:#7f93a6;text-shadow:none}
.lk-cockpit .c-ps{color:var(--c-orange);font-weight:700}
/* Datenblatt links, Leistungsfluss rechts - nur, wo neben dem Hochkant-Video Platz ist. */
.lk-cockpit .c-blatt,.lk-cockpit .c-seite{top:50%;display:none;flex-direction:column;gap:clamp(5px,1.1vh,10px);width:clamp(176px,16vw,232px);
  white-space:normal;transform:translateY(-50%);overflow:hidden;padding:4px 0}
.lk-cockpit .c-blatt{left:0}.lk-cockpit .c-seite{right:0}
.lk-cockpit .c-kopf{font:600 9px/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.34em;color:var(--c-blau);padding-bottom:8px;
  border-bottom:1px solid rgba(92,180,255,.25);text-transform:uppercase}
.lk-cockpit .c-seite .c-kopf{text-align:right}
.lk-cockpit .c-zeile{display:flex;flex-direction:column;gap:4px;padding:8px 10px;
  border-left:2px solid var(--farbe,rgba(92,180,255,.45));background:linear-gradient(90deg,rgba(92,180,255,.09),transparent)}
.lk-cockpit .c-seite .c-zeile{align-items:flex-end;text-align:right;border-left:0;border-right:2px solid var(--farbe,rgba(92,180,255,.45));
  background:linear-gradient(270deg,rgba(92,180,255,.09),transparent)}
.lk-cockpit .c-zeile small{font:600 8.5px/1 'Rajdhani',sans-serif;letter-spacing:.24em;color:#7f93a6;text-transform:uppercase}
/* Werte und Notizen in richtiger Schreibweise (Nm, km/h, kWh) - der Rahmen
   schreibt sonst alles gross. */
.lk-cockpit .c-zeile b{font:800 clamp(15px,1.45vw,19px)/1.1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.04em;color:#eef7ff;text-transform:none}
.lk-cockpit .c-zeile em{font:500 9.5px/1.25 'Rajdhani',sans-serif;font-style:normal;letter-spacing:.1em;color:#6f879b;text-transform:none}
.lk-cockpit .c-zeile .c-balken{width:100%;margin-top:3px}
.lk-cockpit .c-seite .c-balken i{transform-origin:100% 50%}
#egg[data-look="cockpit"][data-phase="clip"] .c-blatt .c-zeile{animation:cZeile .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(.5s + var(--i) * .12s)}
#egg[data-look="cockpit"][data-phase="clip"] .c-seite .c-zeile{animation:cZeileR .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(.7s + var(--i) * .12s)}
#egg[data-look="cockpit"][data-phase="clip"] .c-seite .c-balken i{animation:cBalken 1.2s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(1.1s + var(--i) * .15s)}
@keyframes cZeile{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
@keyframes cZeileR{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
/* Ein Lichtband faehrt langsam ueber das Datenblatt. */
.lk-cockpit .c-blatt::after{content:"";position:absolute;inset:0;pointer-events:none;transform:translateY(-100%);
  background:linear-gradient(180deg,transparent 42%,rgba(92,180,255,.1) 50%,transparent 58%)}
#egg[data-look="cockpit"][data-phase="clip"] .c-blatt::after{animation:cScan 4.2s 1.6s linear infinite}
@keyframes cScan{from{transform:translateY(-100%)}to{transform:translateY(100%)}}
/* Am Handy: eine Laufzeile unten statt der Spalten. */
.lk-cockpit .c-ticker{left:50%;bottom:10px;width:min(84vw,340px);height:18px;transform:translateX(-50%);overflow:hidden;text-align:center}
.lk-cockpit .c-ticker span{position:absolute;inset:0;opacity:0;font:600 10px/18px 'Orbitron',Rajdhani,sans-serif;letter-spacing:.14em;color:#b9cfe1;text-transform:none;
  animation:cTicker 16.8s infinite;animation-delay:calc(var(--i) * 2.8s)}
.lk-cockpit .c-ticker b{font-weight:900;color:var(--c-orange);letter-spacing:.06em}
@keyframes cTicker{0%{opacity:0;transform:translateY(8px)}3%,14%{opacity:1;transform:none}17%,100%{opacity:0;transform:translateY(-8px)}}
@media (min-width:900px) and (min-height:560px){
  .lk-cockpit .c-blatt,.lk-cockpit .c-seite{display:flex}
  .lk-cockpit .c-ticker{display:none}
}
.lk-cockpit .lk-outro strong{font:900 clamp(38px,7vw,92px)/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.14em;margin-right:-.14em;color:#e6f2ff;
  text-shadow:0 0 30px rgba(92,180,255,.5)}
.lk-cockpit .lk-outro span{font:500 12px/1 'Orbitron',Rajdhani,sans-serif;letter-spacing:.4em;margin-right:-.4em;color:var(--c-orange)}
.lk-cockpit .c-outro-daten{font:600 10px/1 'Orbitron',Rajdhani,sans-serif;font-style:normal;letter-spacing:.24em;margin-right:-.24em;color:#7f93a6}
#egg[data-look="cockpit"][data-phase="outro"] .c-outro-daten{animation:lkAuf .7s .3s both}
#egg[data-look="cockpit"] .egg-txt{font-family:'Orbitron',Rajdhani,sans-serif;font-weight:700;letter-spacing:.16em;
  font-size:clamp(18px,3.3vw,34px);color:#eaf5ff;text-shadow:0 0 20px rgba(92,180,255,.55)}
#egg[data-look="cockpit"] #eggVid{border-radius:12px;border-color:rgba(120,190,255,.36);
  box-shadow:0 0 0 1px rgba(0,0,0,.85),0 0 70px rgba(60,150,255,.2),0 30px 80px rgba(0,0,0,.88)}
#egg[data-look="cockpit"] .egg-controls button{background:rgba(8,12,18,.9);border-color:rgba(120,190,255,.3);
  font-family:'Orbitron',Rajdhani,sans-serif;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase}
#egg[data-look="cockpit"] .egg-controls button:hover{background:rgba(92,180,255,.14);border-color:var(--c-blau)}
#egg[data-look="cockpit"] .egg-hint{color:#8397a8}
#egg[data-look="cockpit"] .egg-close:hover{background:rgba(92,180,255,.2);border-color:var(--c-blau)}
/* Handy: drei Anzeigen nebeneinander, kleiner; Leistungsfluss kompakter. */
@media (max-width:560px){
  /* 40 + 2 x 22 + Abstaende + Ueberstand der Ringe (6 %) bleiben unter 100vw. */
  .lk-cockpit .c-instrument{width:40vw}
  .lk-cockpit .c-dial{width:22vw}
  .lk-cockpit .c-cluster{gap:2.4vw}
  .lk-cockpit .c-titel{letter-spacing:.12em;margin-right:-.12em;font-size:7px}
  .lk-cockpit .c-quelle{min-width:0;padding:8px}
  .lk-cockpit .c-quelle small{font-size:7.5px;letter-spacing:.1em}
}
@media(max-height:600px){.lk-cockpit .c-instrument{width:min(32vh,210px)}.lk-cockpit .c-dial{width:min(18vh,120px)}
  .lk-cockpit .lk-intro{gap:8px}.lk-cockpit .c-unten{margin-top:6px}}

/* ================= HERZ · Spread love ================= */
#egg[data-look="herz"]{--h-weiss:#fff4f7;--h-rosa:#ff9ebd;--h-tief:#12070c}
#egg[data-look="herz"]{background:#0b0508}
.lk-herz .h-grund{inset:0;background:radial-gradient(ellipse 70% 60% at 50% 42%,#2a0f1b 0%,#140810 50%,#070305 100%)}
.lk-herz .h-bokeh{inset:-10%;opacity:.8;
  background:radial-gradient(circle at 18% 30%,rgba(255,170,200,.18) 0 6%,transparent 12%),
    radial-gradient(circle at 82% 22%,rgba(255,255,255,.12) 0 4%,transparent 9%),
    radial-gradient(circle at 70% 78%,rgba(255,150,190,.14) 0 7%,transparent 14%),
    radial-gradient(circle at 26% 80%,rgba(255,230,240,.1) 0 5%,transparent 10%);
  filter:blur(6px);animation:hSchweben 16s ease-in-out infinite alternate}
@keyframes hSchweben{to{transform:translate3d(3%,-3%,0) scale(1.04)}}
.lk-herz .h-glow{left:50%;top:44%;width:min(70vw,720px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(255,200,220,.2),transparent 62%);animation:hGlow 1.6s ease-in-out infinite}
@keyframes hGlow{0%,100%{opacity:.55}14%{opacity:1}28%{opacity:.7}42%{opacity:.95}}
.lk-herz .h-buehne{position:relative;width:min(640px,86vw);height:clamp(120px,20vh,190px)}
.lk-herz svg.h-ekg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.lk-herz .h-ekg path{fill:none;stroke:var(--h-weiss);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round;
  stroke-dasharray:1000;stroke-dashoffset:1000;filter:drop-shadow(0 0 8px rgba(255,170,200,.9));vector-effect:non-scaling-stroke}
#egg[data-look="herz"][data-phase="intro"] .h-ekg path{animation:hEkg 1.25s .2s cubic-bezier(.45,0,.3,1) forwards,hEkgAus .6s 1.35s ease forwards}
@keyframes hEkg{to{stroke-dashoffset:0}}
@keyframes hEkgAus{to{opacity:0}}
.lk-herz svg.h-herz{position:absolute;left:50%;top:50%;width:clamp(96px,13vw,150px);height:auto;transform:translate(-50%,-50%) scale(0);
  filter:drop-shadow(0 0 22px rgba(255,160,195,.85)) drop-shadow(0 0 60px rgba(255,120,170,.45))}
.h-herz path{fill:url(#hVerlauf)}
#egg[data-look="herz"][data-phase="intro"] svg.h-herz{animation:hHerz 1.6s 1.3s cubic-bezier(.2,.9,.3,1.2) forwards}
@keyframes hHerz{0%{transform:translate(-50%,-50%) scale(0)}30%{transform:translate(-50%,-50%) scale(1.08)}
  42%{transform:translate(-50%,-50%) scale(.94)}54%{transform:translate(-50%,-50%) scale(1.12)}
  70%{transform:translate(-50%,-50%) scale(.98)}100%{transform:translate(-50%,-50%) scale(1)}}
.lk-herz .h-wort{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500;font-size:clamp(34px,6vw,76px);line-height:1;
  color:var(--h-weiss);letter-spacing:.02em;text-shadow:0 0 30px rgba(255,160,195,.55);opacity:0}
.lk-herz .h-wort em{font-style:italic;font-weight:600}
#egg[data-look="herz"][data-phase="intro"] .h-wort{animation:wWort 1s 1.9s cubic-bezier(.2,.8,.2,1) forwards}
.lk-herz .lk-hud{color:#e3b5c4}
.lk-herz svg.h-puls{left:0;right:0;bottom:0;width:100%;height:36px;overflow:visible;
  -webkit-mask-image:linear-gradient(90deg,#000 0 36%,transparent 43% 57%,#000 64%);
          mask-image:linear-gradient(90deg,#000 0 36%,transparent 43% 57%,#000 64%)}
.lk-herz .h-puls path{fill:none;stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.lk-herz .h-puls .grund{stroke:rgba(255,190,210,.16)}
.lk-herz .h-puls .lauf{stroke:var(--h-weiss);stroke-dasharray:90 1110;filter:drop-shadow(0 0 5px rgba(255,160,195,.9));
  animation:hLauf 3.2s linear infinite}
@keyframes hLauf{from{stroke-dashoffset:1200}to{stroke-dashoffset:0}}
.lk-herz .lk-hud .ul,.lk-herz .lk-hud .ur{bottom:46px}
.lk-herz .h-klein{display:inline-block;width:12px;height:11px;margin-right:9px;vertical-align:-1px;animation:hGlow 1.6s ease-in-out infinite}
.lk-herz .lk-outro strong{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:600;
  font-size:clamp(48px,8.4vw,110px);line-height:1;color:var(--h-weiss);text-shadow:0 0 40px rgba(255,160,195,.55)}
.lk-herz .lk-outro span{font-size:clamp(26px,4vw,40px);filter:drop-shadow(0 0 16px rgba(255,255,255,.6))}
#egg[data-look="herz"] .egg-txt{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:600;letter-spacing:.05em;
  font-size:clamp(26px,4.6vw,50px);color:var(--h-weiss);text-shadow:0 0 30px rgba(255,160,195,.6)}
#egg[data-look="herz"] #eggVid{border-radius:22px;border-color:rgba(255,215,228,.46);
  box-shadow:0 0 0 7px rgba(255,255,255,.035),0 0 100px rgba(255,150,190,.28),0 30px 80px rgba(0,0,0,.62)}
#egg[data-look="herz"] .egg-controls button{background:rgba(32,12,20,.72);border-color:rgba(255,210,225,.34);color:var(--h-weiss)}
#egg[data-look="herz"] .egg-controls button:hover{background:rgba(255,158,189,.18);border-color:var(--h-rosa)}
#egg[data-look="herz"] .egg-hint{color:#d6a8b8}
#egg[data-look="herz"] .egg-close:hover{background:rgba(255,158,189,.22);border-color:var(--h-rosa)}

/* Beschriftungen einheitlich in Grossbuchstaben - die Vorlagen schreiben
   normal, damit Vorleseprogramme nicht buchstabieren. */
.lk-cockpit .c-modell,.lk-outro span,
.lk-grom .lk-outro strong,.lk-cockpit .lk-outro strong{text-transform:uppercase}
/* Die gezeichnete Flagge im Titel steht wie ein Buchstabe in der Zeile. */
#egg .egg-txt i .plflag{width:1.1em;height:.72em;vertical-align:-.02em}

/* v50: PL-01 entfaltet sich aus konzentrischen Signalringen. */
.g-orbit{position:absolute;width:min(68vw,620px);aspect-ratio:1;pointer-events:none}
.g-orbit i{position:absolute;inset:0;border:1px solid #e4edf42b;border-radius:50%;opacity:0}
.g-orbit i:nth-child(2){inset:12%;border-style:dashed;border-color:#dc143c66}
.g-orbit i:nth-child(3){inset:24%;border-color:#ffffff50}
#egg[data-look="grom"][data-phase="intro"] .g-orbit i{animation:gSignal 2.8s cubic-bezier(.16,1,.3,1) both}
#egg[data-look="grom"][data-phase="intro"] .g-orbit i:nth-child(2){animation-delay:.2s}
#egg[data-look="grom"][data-phase="intro"] .g-orbit i:nth-child(3){animation-delay:.4s}
@keyframes gSignal{0%{opacity:0;transform:scale(.25) rotate(-35deg)}30%{opacity:.8}100%{opacity:0;transform:scale(1.5) rotate(20deg)}}
html[data-mobile-budget="true"] .g-orbit{display:none}

/* ---------- Kleine Bildschirme ---------- */
@media (max-width:560px){
  .lk-hud .ur,.lk-hud .rm{display:none}
  .lk-hud .om{top:34px}
  .lk-cockpit .c-drehzahl{top:40px}
  .lk-cockpit .c-drehzahl i{width:7px}
}
/* ---------- Sparsamer Modus am Telefon: Dauerbewegungen im Hintergrund aus ---------- */
html[data-mobile-budget="true"] :is(.lk-herz .h-bokeh,.lk-herz .h-glow,.lk-cockpit .c-drehzahl i,.lk-cockpit .c-blatt::after){animation:none}
html[data-mobile-budget="true"] .lk-herz .h-bokeh{filter:none}
/* ---------- Reduzierte Bewegung: alles steht, das Intro entfaellt ohnehin ---------- */
@media (prefers-reduced-motion:reduce){
  .lk *,.lk{animation:none!important;transition:none!important}
  #egg.lk-an .egg-inner,#eggFx{transition:none!important}
  /* Volvo-Laufzeile: ohne Bewegung steht der erste Wert fest da. */
  .lk-cockpit .c-ticker span:first-child{opacity:1}
}
