/* Look „Neon“ (Julian 05.10.2026, Ruling R57) – Vorbild unternehmen/attrappen/gehirn-neon.html.
   Gilt nur mit <html data-look="neon">; Mix (stil.css) bleibt unberührt.
   Aufbau wie look-galaxie.css: :where([data-look=neon]) ersetzt Grundregeln und lässt die Zustands-Regeln aus stil.css gewinnen,
   [data-look=neon] (volle Gewichtung) nur, wo der Look einen Zustand selbst zeichnet. Keine Animationen hier (keine @keyframes) –
   Bewegung macht deko.js auf EINER Leinwand (.deko): Glüh-Schleier, Gitter-Schimmer, Lichtstaub, Kern-Ringe.
   Zustandsfarben: arbeitet = Neon-Mint, wartet = Amber (immer mit Ring und Zahl), Gefahr = Orange-Rot; Pink/Violett sind nur Schmuck. */

:root[data-look=neon]{
  --bg:#07050b; --panel:#110b17; --panel-2:#160f1f; --line:#2a1b30; --line-2:#3f2747;
  --text:#f3e7f0; --muted:#c0a9ba; --dim:#6d5a69;
  --go:#4ff0c2; --wait:#ffb547; --stop:#ff6b4a;
  --pink:#ff3d9a; --pink-hi:#ff79bb; --pink-soft:#ff8cc0; --pink-deep:#2a0f22; --violet:#a77bff; --violet-soft:#c6a9ff;
  --display:"Bahnschrift","DIN Alternate","DIN Condensed","Avenir Next Condensed","Arial Narrow",sans-serif;
  --sans:"Avenir Next","Segoe UI Variable Text","Segoe UI",system-ui,sans-serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono",Consolas,monospace;
}

/* ---------- Grund: Pink-Schimmer (still) und feines Korn ---------- */
:where([data-look=neon]) body{
  background:
    radial-gradient(1100px 680px at 36% 22%,rgba(255,61,154,.1),transparent 62%),
    radial-gradient(900px 600px at 75% 105%,rgba(167,123,255,.08),transparent 60%),
    var(--bg)}
:where([data-look=neon]) body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.6;
  background: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='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.09'/%3E%3C/svg%3E")}
:where([data-look=neon]) :focus-visible{outline-color:#fff;box-shadow:0 0 0 6px rgba(255,61,154,.4)}

/* ---------- Kopf ---------- */
:where([data-look=neon]) .brand h1{display:flex;align-items:center;gap:10px;font:600 19px/1 var(--display);letter-spacing:.16em;color:#fff;
  text-shadow:0 0 12px rgba(255,61,154,.75)}
:where([data-look=neon]) .brand h1::before{content:"";flex:none;width:24px;height:24px;border-radius:50%;border:1.4px dashed var(--pink);
  background:radial-gradient(circle,var(--pink-hi) 0 3px,#2a0f22 3.5px 5.5px,transparent 6px);box-shadow:0 0 10px rgba(255,61,154,.55)}
:where([data-look=neon]) .brand p{padding-left:34px;color:var(--muted)}
:where([data-look=neon]) .status{border-radius:999px;border-color:var(--line-2);background:rgba(9,6,13,.9)}
:where([data-look=neon]) .clock{color:var(--pink-soft)}
:where([data-look=neon]) .halt{border-color:var(--stop);color:#ff9479;background:rgba(255,107,74,.08);box-shadow:0 0 14px rgba(255,107,74,.18)}
@media (hover:hover){:where([data-look=neon]) .halt:hover{background:rgba(255,107,74,.16)}}
[data-look=neon] body.halted .halt{border-color:var(--pink);color:var(--pink-soft);background:rgba(255,61,154,.08);box-shadow:none}
:where([data-look=neon]) .gear{border-color:var(--line-2);background:var(--panel)}
:where([data-look=neon]) .haltbar{border-color:rgba(255,107,74,.55);background:rgba(255,107,74,.08)}

/* ---------- Gehirn: Netz im Neonlicht ---------- */
:where([data-look=neon]) .galaxy{background:radial-gradient(circle at 50% 34%,rgba(255,61,154,.12),transparent 62%),linear-gradient(180deg,rgba(17,11,23,.6),rgba(7,5,11,.4));
  border-color:var(--line)}
:where([data-look=neon]) .deko{position:absolute;inset:0;z-index:-1;width:100%;height:100%;pointer-events:none;transition:opacity 300ms var(--ease)}
[data-look=neon] body.halted .deko{opacity:.28}
/* Bahnen */
:where([data-look=neon]) .orbit{stroke:rgba(255,121,187,.16)}
:where([data-look=neon]) .orbit.tools{stroke:rgba(255,255,255,.08);stroke-dasharray:2 8}
:where([data-look=neon]) .orbit.tick{stroke:rgba(255,121,187,.28)}
:where([data-look=neon]) .orbit.halo{stroke:rgba(255,61,154,.22)}
:where([data-look=neon]) .orbit.satorb{stroke:rgba(255,121,187,.32);stroke-width:1.6;stroke-dasharray:0 6}
:where([data-look=neon]) .arc.firm{stroke:rgba(255,61,154,.6);stroke-width:1.4}
:where([data-look=neon]) .arc.priv{stroke:rgba(167,123,255,.7);stroke-width:1.4;stroke-dasharray:5 6}
:where([data-look=neon]) .arm-n{stroke:rgba(255,61,154,.17)}
:where([data-look=neon]) .arm-l,:where([data-look=neon]) .br-l{stroke:var(--pink-hi)}
:where([data-look=neon]) .br-n{stroke:rgba(255,121,187,.22)}
/* Agenten */
:where([data-look=neon]) .sat i{background:#e9c9dc;box-shadow:0 0 5px rgba(255,140,200,.5)}
[data-look=neon] .sat[data-st=wartet] i{box-shadow:0 0 8px rgba(255,181,71,.55)}
[data-look=neon] .sat.tool i{box-shadow:none;opacity:.55}
:where([data-look=neon]) .sat b{box-shadow:0 0 6px 2px rgba(79,240,194,.8),0 0 16px 5px rgba(79,240,194,.32)}
/* Lichtpunkte: Agent arbeitet (Mint) */
:where([data-look=neon]) .lp{box-shadow:0 0 6px 2px rgba(79,240,194,.8)}
:where([data-look=neon]) .komet{box-shadow:0 0 10px 3px #fff,0 0 22px 7px rgba(79,240,194,.5)}
/* Sektionen: dunkle Scheiben mit Neonrand und Symbol, Zustandspunkt am Rand */
:where([data-look=neon]) .orb{background:radial-gradient(circle at 50% 30%,#24122a,#0d0812 72%);border:1px solid rgba(255,61,154,.5);
  box-shadow:0 0 0 3px rgba(7,5,11,.85),0 0 16px rgba(255,61,154,.2),inset 0 0 12px rgba(255,61,154,.12)}
:where([data-look=neon]) .orb::before{inset:4px;border-color:rgba(255,61,154,.14)}
:where([data-look=neon]) .orb::after{content:"";position:absolute;inset:27%;background:var(--pink-soft);mask-repeat:no-repeat;mask-position:center;mask-size:contain}
:where([data-look=neon]) .cdot{left:auto;top:auto;right:-2px;bottom:-2px;margin:0;width:11px;height:11px;border:2px solid var(--bg);opacity:0}
[data-look=neon] .node.hot .cdot{opacity:1;box-shadow:0 0 8px rgba(79,240,194,.85)}
[data-look=neon] .node.hot .orb{box-shadow:0 0 0 3px rgba(7,5,11,.85),0 0 20px rgba(79,240,194,.3),inset 0 0 12px rgba(79,240,194,.12)}
:where([data-look=neon]) .nglow{box-shadow:0 0 0 1px rgba(255,181,71,.8),0 0 22px 4px rgba(255,181,71,.42)}
:where([data-look=neon]) .nhov{border-color:var(--pink-hi)}
:where([data-look=neon]) .nbadge{box-shadow:0 0 0 2px var(--bg),0 0 12px rgba(255,181,71,.6)}
:where([data-look=neon]) .nlabel{border-radius:5px;border-color:var(--line-2);background:rgba(9,6,13,.9);font:600 11.5px/16px var(--display);letter-spacing:.04em}
/* Kern: dunkle Scheibe mit Neonrand; die drehenden Ringe malt deko.js. Zustand wie in Mix: Rand, Glühring, Zeichen im Kern */
:where([data-look=neon]) .core-deco{border:0;background:transparent}
:where([data-look=neon]) .core-disc{border:1.5px solid rgba(255,61,154,.78);background:radial-gradient(circle at 50% 30%,#431235 0%,#1a0916 55%,#0b060e 100%);
  box-shadow:0 0 0 5px rgba(255,61,154,.07),0 0 34px rgba(255,61,154,.38),inset 0 0 26px rgba(255,61,154,.3)}
:where([data-look=neon]) .core-name{color:#fff;letter-spacing:.14em;text-shadow:0 0 14px rgba(255,61,154,.95)}
:where([data-look=neon]) .core-glow{inset:-5px;box-shadow:0 0 0 2px rgba(79,240,194,.95),0 0 26px 6px rgba(79,240,194,.35)}
[data-look=neon] .galaxy[data-state=halt] .core-disc{filter:grayscale(.9) brightness(.65)}
/* Zustände, Legende, Anzeige */
:where([data-look=neon]) .st{border-color:var(--line-2);font-family:var(--sans)}
[data-look=neon] .st[aria-current=true]{background:rgba(22,15,31,.96)}
[data-look=neon] .galaxy:not(.wide) .states{border-color:rgba(255,61,154,.35);background:rgba(9,6,13,.92)}
[data-look=neon] .galaxy.wide .states{border-top-color:var(--line);background:rgba(7,5,11,.9)}
:where([data-look=neon]) .legend{border-top-color:var(--line);background:rgba(7,5,11,.9)}
:where([data-look=neon]) .lg-firma i{border-top-color:var(--pink)}
:where([data-look=neon]) .lg-priv i{border-top-color:var(--violet)}
:where([data-look=neon]) .lg-agent i{background:#e9c9dc}
:where([data-look=neon]) .readout{border-color:rgba(255,61,154,.45);background:rgba(13,8,18,.95);box-shadow:0 0 24px rgba(255,61,154,.15)}
:where([data-look=neon]) .ro-h{color:var(--pink-soft)}

/* ---------- Reiter und Überschriften ---------- */
:where([data-look=neon]) .tabs{background:rgba(7,5,11,.96);border-bottom-color:var(--line)}
[data-look=neon] .tab[aria-selected=true]{color:#fff;background:rgba(255,61,154,.1);border-color:var(--pink);box-shadow:0 0 14px rgba(255,61,154,.22)}
:where([data-look=neon]) .ph h2{font-size:16px;letter-spacing:.14em}
:where([data-look=neon]) .pill{box-shadow:0 0 14px rgba(255,181,71,.45)}
[data-look=neon] .pill.zero{box-shadow:none}

/* ---------- Karten „Braucht dich“ ---------- */
:where([data-look=neon]) .card{border-radius:13px;border-color:var(--line-2);background:linear-gradient(180deg,rgba(255,61,154,.06),transparent 45%),var(--panel)}
:where([data-look=neon]) .card::before{box-shadow:0 0 10px rgba(255,181,71,.6)}
[data-look=neon] .card.erledigt{background:var(--panel);border-color:var(--line)}
[data-look=neon] .card.erledigt::before{box-shadow:none}
:where([data-look=neon]) .card h3{color:#fff}
:where([data-look=neon]) .card-meta .tag{color:var(--pink-soft)}

/* ---------- Knöpfe ---------- */
:where([data-look=neon]) .btn{border-color:var(--line-2);background:rgba(255,255,255,.025)}
@media (hover:hover){:where([data-look=neon]) .btn:not(:disabled):hover{border-color:rgba(255,61,154,.6)}}
[data-look=neon] .btn.primary{background:var(--pink);border-color:var(--pink);color:#17060f;box-shadow:0 0 16px rgba(255,61,154,.35)}
@media (hover:hover){[data-look=neon] .btn.primary:not(:disabled):hover{background:var(--pink-hi)}}
[data-look=neon] .btn.line{background:transparent;border-color:rgba(255,61,154,.65);color:var(--pink-soft)}
[data-look=neon] .btn.danger{background:var(--stop);border-color:var(--stop);color:#1a0603}
:where([data-look=neon]) .skill{border-color:var(--line-2);background:linear-gradient(135deg,rgba(255,61,154,.07),transparent 55%),var(--panel)}
:where([data-look=neon]) .skill .ic{color:var(--pink-soft)}
@media (hover:hover){[data-look=neon] .skill:hover{border-color:rgba(255,61,154,.6)}}

/* ---------- Heute, Läufe, Sprechen ---------- */
:where([data-look=neon]) :is(.top3,.plan,.runlist){border-color:var(--line-2);background:rgba(17,11,23,.88)}
:where([data-look=neon]) .plan .nx{border-color:var(--pink);color:var(--pink-soft)}
[data-look=neon] .chk[aria-checked=true] .box{background:var(--pink);border-color:var(--pink)}
:where([data-look=neon]) .voice{border-color:var(--line-2);background:linear-gradient(135deg,rgba(255,61,154,.06),transparent 55%),var(--panel)}

/* ---------- Eingabe „Ins Gehirn“ ---------- */
:where([data-look=neon]) .composer{border-top-color:rgba(255,61,154,.38);background:rgba(10,6,14,.96);box-shadow:0 -12px 34px rgba(0,0,0,.55),0 -1px 0 rgba(255,61,154,.16)}
:where([data-look=neon]) .field{border-radius:12px;border-color:var(--line-2);background:#0c0711}
[data-look=neon] .field:focus-within{border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,61,154,.25)}
:where([data-look=neon]) .field label{color:var(--pink-soft)}
:where([data-look=neon]) .field textarea::placeholder{color:#9c8597}
:where([data-look=neon]) .csend{border-color:var(--pink);background:var(--pink);color:#17060f;box-shadow:0 0 18px rgba(255,61,154,.38)}
:where([data-look=neon]) .cmic{border-color:var(--line-2);background:var(--panel)}
:where([data-look=neon]) .ferr{border-color:rgba(255,107,74,.55);background:rgba(255,107,74,.08)}

/* ---------- Hinweis-Karte, Blätter, Fenster ---------- */
:where([data-look=neon]) .ncard{border-color:rgba(255,61,154,.55);background:rgba(20,12,26,.97);box-shadow:0 10px 40px rgba(0,0,0,.6),0 0 22px rgba(255,61,154,.2)}
:where([data-look=neon]) .nk{color:var(--pink-soft)}
:where([data-look=neon]) dialog::backdrop{background:rgba(3,1,6,.72)}
:where([data-look=neon]) .panel{border-color:var(--line-2);box-shadow:0 -20px 60px rgba(0,0,0,.6),0 -1px 0 rgba(255,61,154,.35)}
:where([data-look=neon]) .porb{border-color:rgba(255,61,154,.55);background:radial-gradient(circle at 50% 30%,#24122a,#0d0812 72%);color:var(--pink-soft)}
[data-look=neon] .porb.coremini{border-color:var(--pink);color:#fff;text-shadow:0 0 8px rgba(255,61,154,.9);box-shadow:0 0 16px rgba(255,61,154,.35)}
:where([data-look=neon]) .kick{color:var(--pink-soft)}
:where([data-look=neon]) .ptitle h2,:where([data-look=neon]) #frageDlg h2{color:#fff}
:where([data-look=neon]) .agent .hd{background:var(--pink-deep);color:var(--pink-soft)}
:where([data-look=neon]) .loglist .lid{color:var(--pink-soft)}
:where([data-look=neon]) .checks li::before{color:var(--go)}
[data-look=neon] .kz dd.live{text-shadow:0 0 12px rgba(79,240,194,.4)}
[data-look=neon] .kz dd.warn{text-shadow:0 0 12px rgba(255,181,71,.4)}

/* ---------- PC ---------- */
@media (min-width:1024px) and (min-height:560px){
  :where([data-look=neon]) .galaxy{border-radius:18px}
  :where([data-look=neon]) .composer{border-color:rgba(255,61,154,.45);background:rgba(13,8,18,.94);box-shadow:0 0 30px rgba(255,61,154,.12),0 10px 30px rgba(0,0,0,.4)}
}

/* ---------- Sektions-Symbole (aus dem Sprite in index.html, als Maske; Farbe = Hintergrund des ::after) ---------- */
:where([data-look=neon]) .node[data-id=fuehrung] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5l2.1 7.4 7.4 2.1-7.4 2.1-2.1 7.4-2.1-7.4L2.5 12l7.4-2.1z'/%3E%3Ccircle cx='12' cy='12' r='1.2'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=produkt] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.8l8 4.4v9.6l-8 4.4-8-4.4V7.2z'/%3E%3Cpath d='M4 7.2l8 4.4 8-4.4M12 11.6v9.6'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=daten] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.3 15.3L21 21'/%3E%3Cpath d='M8 12.6v-1.8M10.5 12.6V8.2M13 12.6V9.8'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=marketing] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10v4a1 1 0 001 1H7l7.5 4.5v-15L7 9H4.5a1 1 0 00-1 1z'/%3E%3Cpath d='M18 9a4 4 0 010 6'/%3E%3Cpath d='M7.2 15l1.3 5'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=kunden] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.2'/%3E%3Cpath d='M3 19.5c.6-3.3 3-5.2 6-5.2s5.4 1.9 6 5.2'/%3E%3Cpath d='M15.5 5.1a3 3 0 010 5.8M17.6 14.6c1.9.6 3.1 2.3 3.4 4.9'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=finanzen] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='6' rx='7' ry='2.7'/%3E%3Cpath d='M5 6v4c0 1.5 3.1 2.7 7 2.7s7-1.2 7-2.7V6'/%3E%3Cpath d='M5 10v4c0 1.5 3.1 2.7 7 2.7s7-1.2 7-2.7v-4'/%3E%3Cpath d='M5 14v4c0 1.5 3.1 2.7 7 2.7s7-1.2 7-2.7v-4'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=recht] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5v17M7.5 20.5h9M5 6.5h14'/%3E%3Cpath d='M5 6.5L2.6 13h4.8zM19 6.5L16.6 13h4.8z'/%3E%3Cpath d='M2.6 13a2.4 2.4 0 004.8 0M16.6 13a2.4 2.4 0 004.8 0'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=betrieb] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.8l7.5 3v5.6c0 4.6-3.2 8.3-7.5 9.8-4.3-1.5-7.5-5.2-7.5-9.8V5.8z'/%3E%3Cpath d='M8.8 12l2.2 2.2 4.4-4.6'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=ideen] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.2 17.5h5.6M10.2 20.5h3.6'/%3E%3Cpath d='M12 3a6 6 0 00-3.6 10.8c.4.4.7.9.7 1.5v.2h5.8v-.2c0-.6.3-1.1.7-1.5A6 6 0 0012 3z'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=erinnerungen] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 16.5V11a6 6 0 0112 0v5.5l1.5 2h-15z'/%3E%3Cpath d='M10 20.5a2 2 0 004 0'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=mindset] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20c-2.4-2-3.4-4.6-3.4-7.3S10 7.2 12 5c2 2.2 3.4 4.9 3.4 7.7S14.4 18 12 20z'/%3E%3Cpath d='M12 20c-4.5 0-8-2.6-8.5-6 2.6-.2 4.6.5 6.2 2'/%3E%3Cpath d='M12 20c4.5 0 8-2.6 8.5-6-2.6-.2-4.6.5-6.2 2'/%3E%3C/svg%3E")}
:where([data-look=neon]) .node[data-id=ziele] .orb::after{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='5'/%3E%3Ccircle cx='12' cy='12' r='1.4'/%3E%3C/svg%3E")}