/* ErfassungAI Admin - lokales, offline-festes Stylesheet (kein Build, kein CDN). */
:root{
  color-scheme:dark;
  --bg:#0e1116; --panel:#171b22; --ink:#e6e9ef; --muted:#9099a6; --line:#2a313c;
  --brand:#5b9bff; --brand-d:#3f7fe0; --ok:#56d27e; --okbg:#10331e;
  --warn:#f0b429; --warnbg:#352a10; --danger:#f3736b; --dangerbg:#3a1c1c;
  --soft:#222834; --shadow:0 1px 3px rgba(0,0,0,.5),0 1px 2px rgba(0,0,0,.4);
}
*{box-sizing:border-box}
/* Aurora-Grundton der Dashboard-Buehne, app-weit: alle Seiten liegen auf demselben
   dunklen Farbverlauf statt auf flachem Grau. */
body{margin:0;color:var(--ink);min-height:100vh;
  font:14px/1.5 -apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:
    radial-gradient(60% 80% at 8% -10%,rgba(59,127,224,.10),transparent 60%),
    radial-gradient(55% 75% at 100% 0%,rgba(180,107,255,.08),transparent 55%),
    radial-gradient(70% 90% at 50% 115%,rgba(86,210,126,.05),transparent 60%),
    linear-gradient(180deg,#0d1017,#0a0d12);
  background-attachment:fixed}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
code{background:var(--soft);padding:1px 5px;border-radius:4px;font-size:.85em}
.mono{font-family:"Cascadia Code",Consolas,monospace}
.small{font-size:.82em}
.muted{color:var(--muted)}
.ellip{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nowrap{white-space:nowrap}

/* Topbar: Glasleiste mit Blur + Gradient-Logo */
.topbar{display:flex;align-items:center;gap:24px;
  background:rgba(15,19,27,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.06);padding:0 22px;height:56px;position:sticky;top:0;z-index:5}
.brand{display:flex;align-items:center;gap:10px;font-weight:600}
.logo{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;
  background:linear-gradient(135deg,#5b9bff,#8d6bff);color:#fff;font-weight:700;font-size:12px;
  letter-spacing:.5px;box-shadow:0 0 14px -3px rgba(110,140,255,.65)}
/* 8-Bit-Frida als Logo: Pixel bleiben scharf, Verlauf weicht dem Portraet */
.logo.pix{background:linear-gradient(135deg,rgba(91,155,255,.16),rgba(141,107,255,.16));
  padding:2px}
.logo.pix img{width:100%;height:100%;display:block;image-rendering:pixelated}
.brandname{font-size:15px}
.mainnav{display:flex;gap:4px;flex:1}
.mainnav a{padding:7px 13px;border-radius:8px;color:var(--muted);font-weight:500;transition:background .15s,color .15s}
.mainnav a:hover{background:rgba(255,255,255,.05);text-decoration:none;color:var(--ink)}
.mainnav a.active{background:rgba(91,155,255,.12);color:#bcd6ff;box-shadow:inset 0 0 0 1px rgba(91,155,255,.22)}
.userbox{display:flex;align-items:center;gap:10px}
.uname{font-weight:600}
.inline{display:inline}

/* Content */
.content{max-width:1280px;margin:24px auto;padding:0 22px}
.pagetitle{font-size:23px;font-weight:700;letter-spacing:-.4px;margin:4px 0 18px;width:fit-content;
  background:linear-gradient(92deg,#eef4ff,#bcd2ff 60%,#d7c3ff);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.pagehead{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;gap:16px;flex-wrap:wrap}
.foot{max-width:1280px;margin:30px auto;padding:0 22px;color:#5f6878;font-size:.8em;text-align:center}
/* Hardware-/Leistungshinweis (Erfassungsseite) */
.hw-note{margin-top:10px;padding:10px 13px;border-radius:9px;font-size:.85em;line-height:1.55;
  background:rgba(91,155,255,.06);border:1px solid rgba(91,155,255,.20);color:var(--muted)}
.hw-note b{color:var(--ink)}

/* Historien-Vorschlaege (lernende Korrekturen) */
.banner.hist{background:rgba(141,107,255,.10);color:#cbb8ff;border:1px solid rgba(141,107,255,.35)}
.badge.hist{background:rgba(141,107,255,.16);color:#b79bff}
.hist-rows{display:grid;gap:6px;margin-top:8px}
.hist-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:7px 10px;
  border-radius:8px;background:rgba(13,17,25,.45)}
.hist-row .hist-actions{margin-left:auto}
.hist-row form{display:flex;gap:6px}

/* Lauf-Seite: Pruefliste mit allen Auftragseckdaten (Sammel-Freigabe) */
table.runcheck td{vertical-align:top;padding-top:9px;padding-bottom:9px}
table.runcheck .nowrap{white-space:nowrap}
table.runcheck .badge{margin:1px 2px 1px 0}

.foot a{color:#8494ac;text-decoration:none;border-bottom:1px dotted rgba(132,148,172,.5)}
.foot a:hover{color:var(--brand);border-bottom-color:var(--brand);text-decoration:none}

/* Cards: Glas-Panels mit Innen-Highlight (Dashboard-Buehne im Kleinen) */
.card{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 45%),#12161f;
  border:1px solid rgba(255,255,255,.07);border-radius:14px;
  box-shadow:0 16px 44px -28px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.03);
  padding:18px;margin-bottom:18px}
.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.card h2{font-size:11.5px;letter-spacing:1.8px;text-transform:uppercase;color:#93a6c6;
  margin:0 0 14px;font-weight:700}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:18px}
.card.stat{text-align:left;transition:transform .2s,border-color .2s}
.card.stat:hover{transform:translateY(-2px);border-color:rgba(91,155,255,.30)}
.stat-num{font-size:30px;font-weight:800;letter-spacing:-.6px;line-height:1.1;width:fit-content;
  background:linear-gradient(92deg,#f2f6ff,#b9d0ff);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.stat-label{color:var(--muted);margin-top:4px}
.card.stat.danger .stat-num{background:linear-gradient(92deg,#ffc0ba,#f3736b);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.card.center{text-align:center;padding:40px}
.errcode{font-size:54px;font-weight:800;color:var(--danger)}

/* Tables */
/* Breite Tabellen werden in .tablewrap gekapselt, das bei Bedarf horizontal scrollt.
   Die Tabelle selbst bleibt eine echte display:table -> gleiche Zeilenhoehen ueber alle
   Zellen (auch die Aktions-Zelle), kein Herausragen aus der Karte. */
.tablewrap{width:100%;overflow-x:auto}
table.grid{width:100%;border-collapse:collapse}
table.grid th{text-align:left;font-size:.76em;text-transform:uppercase;letter-spacing:.7px;
  color:#7f8ca1;border-bottom:1px solid rgba(255,255,255,.10);padding:8px 10px;white-space:nowrap}
table.grid td{padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.05);vertical-align:middle}
table.grid tbody tr{transition:background .15s}
table.grid tbody tr:hover{background:rgba(91,155,255,.055)}
tr.rowmuted{opacity:.55}
/* Aktions-Zelle bleibt eine echte Tabellenzelle (kein display:flex auf dem <td>),
   damit sie auf die Zeilenhoehe streckt; Buttons werden inline mit Abstand gesetzt. */
.actions{white-space:nowrap}
.actions>*{display:inline-block;vertical-align:middle}
.actions>*+*{margin-left:6px}
.empty{padding:14px 2px}

/* Badges */
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.76em;font-weight:600;
  background:var(--soft);color:var(--muted);white-space:nowrap}
.badge.ok{background:var(--okbg);color:var(--ok)}
.badge.danger{background:var(--dangerbg);color:var(--danger)}
.badge.soft{background:var(--soft);color:var(--ink)}
.badge.muted{background:var(--soft);color:var(--muted)}
.badge.warn{background:var(--warnbg);color:var(--warn)}
.role-admin{background:#1b2740;color:var(--brand)}
.role-admin_gst{background:#2a1f40;color:#b79bff}
.role-reviewer{background:var(--okbg);color:var(--ok)}
.role-viewer{background:var(--soft);color:var(--muted)}
.env-fat{background:var(--warnbg);color:var(--warn)}
.env-prod{background:var(--dangerbg);color:var(--danger)}
.status-done,.status-submitted,.status-draft{background:var(--okbg);color:var(--ok)}
.status-pending,.status-processing,.status-skipped,.status-duplikat{background:var(--soft);color:var(--muted)}
.status-partial,.status-review{background:var(--warnbg);color:var(--warn)}
.status-error{background:var(--dangerbg);color:var(--danger)}
.err{color:var(--danger)}

/* Buttons: Glas als Grundform, Gradient + Glow fuer die Primaeraktion */
.btn{display:inline-block;padding:8px 15px;border-radius:9px;border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.03);color:var(--ink);font-weight:600;cursor:pointer;font-size:.9em;
  line-height:1.2;transition:border-color .15s,background .15s,box-shadow .15s,filter .15s}
.btn:hover{text-decoration:none;border-color:rgba(91,155,255,.45);background:rgba(91,155,255,.08)}
.btn.small{padding:5px 10px;font-size:.82em}
.btn.block{width:100%}
.btn-primary{background:linear-gradient(135deg,#4c8dff,#7d6bff);border-color:transparent;color:#fff;
  box-shadow:0 6px 18px -8px rgba(100,130,255,.65)}
.btn-primary:hover{filter:brightness(1.08);box-shadow:0 8px 24px -8px rgba(100,130,255,.8);
  background:linear-gradient(135deg,#4c8dff,#7d6bff)}
.btn-warn{background:var(--warn);border-color:transparent;color:#201804}
.btn-warn:hover{filter:brightness(.95)}
.btn-ghost{background:transparent}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* Banners */
.banner{padding:11px 14px;border-radius:9px;margin-bottom:16px;font-size:.92em}
.banner.warn{background:var(--warnbg);color:var(--warn);border:1px solid #5a4a1e}
.banner.error{background:var(--dangerbg);color:var(--danger);border:1px solid #5a2a2a}

/* Forms */
.form h2{border-top:1px solid var(--line);padding-top:14px;margin-top:6px}
.form h2:first-of-type{border-top:0;padding-top:0}
.formgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
label{display:block;font-weight:600;font-size:.85em;color:var(--ink)}
input,select,textarea{width:100%;margin-top:5px;padding:8px 10px;border:1px solid rgba(255,255,255,.10);
  border-radius:9px;font:inherit;background:rgba(8,11,17,.65);color:var(--ink);font-weight:400;
  transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(91,155,255,.22)}
input:disabled{background:var(--soft);color:var(--muted)}
input::placeholder{color:var(--muted)}
.formactions{display:flex;gap:10px;margin-top:18px}
/* Feld-Hinweis: gehoert UNTER das Eingabefeld, nie zwischen Label und Input -
   lange Hinweise im Labeltext schoben das Feld sonst aus der Zeilenflucht. */
.hint{display:block;margin-top:5px;font-weight:400;font-size:.86em;color:var(--muted);line-height:1.35}

/* Status-Kacheln IM Karteninneren (Erfassung): Dashboard-Optik, eine Stufe leiser -
   kein verschachteltes Glas-Panel, sondern dunkle Einleger mit Label oben. */
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:6px}
.ministat{padding:12px 14px;border-radius:11px;background:rgba(8,11,17,.5);
  border:1px solid rgba(255,255,255,.06)}
.ministat .stat-label{font-size:.8em;text-transform:uppercase;letter-spacing:.8px;margin-top:0}
.ministat-val{margin-top:7px;font-weight:600;font-size:.95em;line-height:1.45}
.checkrow{display:flex;align-items:center;gap:8px;margin-top:9px;font-weight:400}
.upload-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.mt0{margin-top:0}

/* Aufklapper (Lernwissen: NL-Gruppen; Rohdaten) - Details bleiben erreichbar,
   ueberfordern aber nicht mehr auf einen Blick (Nutzerwunsch 2026-07-08). */
details.fold{border:1px solid rgba(255,255,255,.06);border-radius:11px;
  background:rgba(8,11,17,.35);margin-bottom:10px}
details.fold>summary{cursor:pointer;padding:10px 14px;list-style:none;
  display:flex;gap:10px;align-items:center;flex-wrap:wrap}
details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary::before{content:"▸";color:var(--muted);transition:transform .15s}
details.fold[open]>summary::before{transform:rotate(90deg)}
details.fold>.fold-body{padding:2px 14px 12px}

/* Key/Value */
dl.kv{display:grid;grid-template-columns:160px 1fr;gap:6px 16px;margin:0}
dl.kv dt{color:var(--muted);font-weight:600}
dl.kv dd{margin:0}

/* Login: dieselbe Aurora-Buehne wie das Dashboard - erster Eindruck = Premium */
.login-bg{display:grid;place-items:center;min-height:100vh;position:relative;overflow:hidden;padding:20px;
  background:
    radial-gradient(50% 60% at 18% 8%,rgba(59,127,224,.17),transparent 60%),
    radial-gradient(45% 55% at 85% 12%,rgba(180,107,255,.13),transparent 60%),
    radial-gradient(55% 60% at 50% 112%,rgba(86,210,126,.10),transparent 65%),
    linear-gradient(180deg,#0d1119,#090c11)}
.login-bg::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(34% 46% at 30% 22%,rgba(91,155,255,.14),transparent 70%),
             radial-gradient(36% 50% at 74% 80%,rgba(86,210,126,.09),transparent 70%);
  animation:plBreathe 9s ease-in-out infinite}
.login-card{position:relative;width:370px;max-width:100%;padding:34px 32px;text-align:center;
  border-radius:20px;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 45%),rgba(15,20,30,.88);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.login-logo{margin-bottom:10px}
.login-logo .logo{width:52px;height:52px;font-size:17px;border-radius:15px;display:inline-grid;
  background:linear-gradient(135deg,#5b9bff,#8d6bff);
  box-shadow:0 0 28px -4px rgba(120,140,255,.7)}
.login-card h1{font-size:20px;margin:10px 0 2px;letter-spacing:-.3px;width:fit-content;
  margin-left:auto;margin-right:auto;
  background:linear-gradient(92deg,#eef4ff,#bcd2ff 60%,#d7c3ff);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.login-card form{text-align:left;margin-top:18px;display:flex;flex-direction:column;gap:13px}
.login-hint{margin:16px 0 0;padding:10px 13px;border-radius:11px;font-size:.8em;line-height:1.55;
  color:#9fb0c8;background:rgba(91,155,255,.07);border:1px solid rgba(91,155,255,.16);text-align:left}
.login-hint b{color:#bcd6ff}
.login-alt{margin:14px 0 0;font-size:.82em;color:var(--muted)}

/* --- FRIDA-Wortmarke: Buchstaben steigen gestaffelt auf, dann wandert ein
   Licht-Schimmer durch den Schriftzug; die Bedeutung blendet verzoegert ein. --- */
.frida-mark{display:flex;justify-content:center;gap:3px;margin:12px 0 4px;line-height:1;
  font-size:46px;font-weight:800;letter-spacing:10px;padding-left:10px}
.frida-mark span{
  background:linear-gradient(110deg,#eef4ff 20%,#9cc0ff 40%,#d7c3ff 52%,#eef4ff 64%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:fridaIn .65s cubic-bezier(.2,.9,.3,1.25) backwards,
            fridaShine 5.5s linear 1.2s infinite;
  text-shadow:0 0 34px rgba(120,150,255,.25)}
.frida-mark span:nth-child(1){animation-delay:.08s,1.2s}
.frida-mark span:nth-child(2){animation-delay:.16s,1.2s}
.frida-mark span:nth-child(3){animation-delay:.24s,1.2s}
.frida-mark span:nth-child(4){animation-delay:.32s,1.2s}
.frida-mark span:nth-child(5){animation-delay:.40s,1.2s}
@keyframes fridaIn{from{opacity:0;transform:translateY(16px) scale(.9);filter:blur(7px)}
  to{opacity:1;transform:none;filter:blur(0)}}
@keyframes fridaShine{0%{background-position:120% 0}100%{background-position:-100% 0}}
.frida-sub{margin:2px 0 0;font-size:.95em;color:#8b94a4;letter-spacing:.5px;
  animation:fridaFade .6s ease .65s backwards}
.frida-sub b{color:#bcd6ff;font-weight:700}
.frida-tag{margin:7px 0 0;font-size:.8em;color:#67707f;
  animation:fridaFade .6s ease .85s backwards}
@keyframes fridaFade{from{opacity:0;transform:translateY(7px)}}
@media (prefers-reduced-motion:reduce){
  .frida-mark span,.frida-sub,.frida-tag{animation:none}
}

/* --- Flags, XML-Detailansicht (Auftrags-Detail) ------------------------- */
.badge.flag-artifact{background:var(--soft);color:var(--muted)}
.badge.flag-warning{background:var(--warnbg);color:var(--warn)}
.badge.flag-info{background:var(--okbg);color:var(--ok)}
.badge.flag-error{background:var(--dangerbg);color:var(--danger)}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
@media (max-width:760px){.cols2{grid-template-columns:1fr}}
.row-gap{display:flex;gap:8px;align-items:center}
.mtop{margin-top:10px}
tr.rowsel{background:#2a2410}
pre.xml{background:#0f172a;color:#dbe4f3;border-radius:9px;padding:14px 16px;
  overflow:auto;max-height:460px;font-size:12.5px;line-height:1.5;margin:10px 0 0;
  white-space:pre;border:1px solid #1e293b}
details summary{cursor:pointer;color:var(--muted);user-select:none}
details[open] summary{margin-bottom:6px}

/* --- Organisation: Inline-'+'-Formulare (CSS-only via <details>) --------- */
.inline-add{display:inline-block}
.inline-add>summary{list-style:none;cursor:pointer;display:inline-block}
.inline-add>summary::-webkit-details-marker{display:none}
.inline-add>summary::marker{content:""}
.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}
.inline-form input[type=text],.inline-form select{padding:7px 9px;border:1px solid var(--line);
  border-radius:7px;font-size:.92em;min-width:220px}
.pagehead .inline-add>summary{margin:0}

/* --- Dashboard: "So funktioniert's" Premium-Pipeline (Vanilla, kein CDN) -- */
.pl{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.07);border-radius:20px;
  padding:30px 26px 22px;margin-bottom:20px;
  background:
    radial-gradient(90% 120% at 12% -10%,rgba(59,127,224,.16),transparent 60%),
    radial-gradient(80% 120% at 100% 0%,rgba(180,107,255,.14),transparent 55%),
    linear-gradient(180deg,#0f1420,#0b0e15)}
.pl{box-shadow:0 20px 60px -30px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.04)}
.pl-glow{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(38% 60% at 30% 18%,rgba(91,155,255,.20),transparent 70%),
            radial-gradient(40% 60% at 76% 92%,rgba(86,210,126,.14),transparent 70%);
  animation:plBreathe 9s ease-in-out infinite}
@keyframes plBreathe{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:.9;transform:scale(1.05)}}

.pl-head{position:relative;z-index:2;text-align:center;max-width:640px;margin:0 auto}
.pl-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;
  letter-spacing:2.4px;text-transform:uppercase;color:#93a6c6}
.pl-live{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:plLive 1.8s ease-out infinite}
@keyframes plLive{0%{box-shadow:0 0 0 0 rgba(86,210,126,.6)}70%,100%{box-shadow:0 0 0 7px rgba(86,210,126,0)}}
.pl-title{font-size:27px;line-height:1.15;font-weight:700;margin:11px 0 6px;letter-spacing:-.5px;
  background:linear-gradient(92deg,#eef4ff,#bcd2ff 55%,#d7c3ff);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.pl-sub{color:#8b94a4;margin:0;font-size:.96em}
.pl-sub b{color:var(--ok);font-weight:600}
.pl-sub code{background:rgba(91,155,255,.12);color:#bcd6ff;border:1px solid rgba(91,155,255,.22)}

.pl-stage{position:relative;z-index:2;margin:20px auto 6px;max-width:1120px}
.pl-svg{display:block;width:100%;height:auto;overflow:visible}
.pl-rail{fill:none;stroke:rgba(255,255,255,.09);stroke-width:2.5;stroke-linecap:round}
.pl-flow{fill:none;stroke:url(#plgrad);stroke-width:3.5;stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(120,150,255,.55))}
.pl-layer{position:absolute;inset:0;overflow:visible}

.pl-st{position:absolute;left:0;top:0;transform:translate(-50%,-50%);z-index:4;
  display:flex;flex-direction:column;align-items:center;gap:9px;
  transition:transform .35s cubic-bezier(.2,.8,.2,1)}
/* Icon-Kachel OPAK (dunkle Basis unter dem Glas-Schimmer): Linie + Komet scheinen
   nicht mehr durch die Station hindurch. */
.pl-st .ic{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;color:#8a95a8;
  background:linear-gradient(rgba(255,255,255,.035),rgba(255,255,255,.035)),#0d1119;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 20px -12px rgba(0,0,0,.8);
  transition:color .35s,border-color .35s,background .35s,box-shadow .35s,transform .35s}
.pl-st .ic svg{width:23px;height:23px;display:block}
.pl-st b{font-size:.77em;font-weight:600;color:#7b8494;letter-spacing:.2px;white-space:nowrap;transition:color .35s}
.pl-st.on{transform:translate(-50%,-50%) scale(1.08)}
.pl-st.on .ic{color:#fff;border-color:var(--c);
  background:linear-gradient(rgba(255,255,255,.06),rgba(255,255,255,.06)),#0d1119;
  box-shadow:0 0 0 1px var(--c),0 0 24px 1px var(--c),0 14px 30px -10px rgba(0,0,0,.7)}
.pl-st.on b{color:#eef2f8}
.pl-st.done .ic{color:#b9c2d2;border-color:rgba(255,255,255,.15)}
.pl-st.done b{color:#98a2b3}

/* Komet + Schweif laufen HINTER den Stationen (z-index unter .pl-st=4): der Funke
   taucht hinter jedem Icon ab, statt davor "im Weg" zu stehen. */
.pl-comet{position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;z-index:3;
  pointer-events:none;transform:translate(-50%,-50%);
  background:radial-gradient(circle at 34% 30%,#fff,#a9cbff 50%,#5b9bff);
  box-shadow:0 0 14px 4px rgba(140,180,255,.85),0 0 34px 10px rgba(91,155,255,.45)}
.pl-tail{position:absolute;left:0;top:0;width:12px;height:12px;border-radius:50%;z-index:2;
  pointer-events:none;transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(150,190,255,.9),rgba(91,155,255,0) 70%)}

.pl-foot{position:relative;z-index:2;display:flex;gap:16px;align-items:stretch;flex-wrap:wrap;
  margin:14px auto 0;max-width:1120px}
.pl-console{flex:1 1 320px;min-height:86px;border-radius:12px;padding:12px 15px;
  background:rgba(6,9,14,.7);border:1px solid rgba(255,255,255,.07);
  box-shadow:inset 0 0 40px rgba(0,0,0,.45);
  font:12.5px/1.8 "Cascadia Code",Consolas,monospace;overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end}
.pl-console .ln{color:#7c8aa0;opacity:.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  animation:plLineIn .42s ease}
@keyframes plLineIn{from{opacity:0;transform:translateY(9px)}}
.pl-console .ln.cur{opacity:1;color:#8ff0b4}
.pl-console .ln.cur::after{content:"▏";margin-left:1px;color:#8ff0b4;animation:plCaret 1.05s steps(1) infinite}
@keyframes plCaret{50%{opacity:0}}

.pl-badges{display:flex;flex-direction:column;gap:8px;justify-content:center}
.pl-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;white-space:nowrap;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);font-size:.82em;font-weight:600;color:#c3ccda}
.pl-badge.ok{background:rgba(86,210,126,.08);border-color:rgba(86,210,126,.25);color:#9fe6bb}
.pl-dot{width:7px;height:7px;border-radius:50%}
.pl-dot.b{background:#5b9bff}.pl-dot.v{background:#b46bff}.pl-dot.g{background:#56d27e}

@media (max-width:760px){
  .pl-title{font-size:21px}
  .pl-st .ic{width:40px;height:40px;border-radius:12px}
  .pl-st .ic svg{width:19px;height:19px}
  .pl-st b{font-size:.64em}
}
@media (prefers-reduced-motion:reduce){
  .pl-glow,.pl-live{animation:none}
  .pl-comet,.pl-tail{display:none}
  .pl-console .ln{animation:none;transform:none!important}
  .pl-console .ln.cur::after{animation:none}
}

/* --- Dashboard: Fähigkeiten-Raster (h2 erbt den Eyebrow-Stil von .card h2) -- */
.feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:14px}
/* display:grid schlaegt das hidden-Attribut (UA-Regel) - ohne diese Zeile blieb das
   Kachel-Raster trotz Laufband immer sichtbar und der Umschalter wirkte sinnlos. */
.feat-grid[hidden],.feat-ticker[hidden]{display:none}
.feat{display:flex;gap:12px;align-items:flex-start;padding:14px;border:1px solid var(--line);
  border-radius:12px;background:#12161d;position:relative;
  transition:border-color .2s,transform .2s,box-shadow .2s}
.feat:hover{border-color:#33415a;transform:translateY(-2px);box-shadow:0 10px 26px -16px rgba(0,0,0,.8)}
.feat .fi{flex:0 0 auto;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;
  color:var(--brand);background:rgba(91,155,255,.10);border:1px solid rgba(91,155,255,.20)}
.feat .fi svg{width:20px;height:20px;display:block}
.feat-t{font-weight:700;font-size:.9em;margin:1px 0 3px;color:var(--ink);
  line-height:1.3;padding-right:64px}
/* Status-Badge einheitlich oben rechts in der Kachel (bricht nie unter den Titel) */
.feat .badge{position:absolute;top:12px;right:12px;margin:0}
.feat-d{color:var(--muted);font-size:.83em;line-height:1.5;margin:0}

/* --- Korrekturseite (editierbare Freigabe) ---------------------------------- */
.banner.ok{background:var(--okbg);color:var(--ok);border:1px solid rgba(86,210,126,.35)}
.editgrid{display:grid;grid-template-columns:1fr 1fr;gap:2px 14px}
.editgrid.four{grid-template-columns:repeat(4,1fr)}
.editgrid .field.span2{grid-column:span 2}
.field label{display:block;font-size:.74em;letter-spacing:.5px;text-transform:uppercase;
  color:var(--muted);margin-top:9px}
.field label .muted{text-transform:none;letter-spacing:0}
.field label.check{display:flex;align-items:center;gap:8px;text-transform:none;
  font-size:.9em;color:var(--ink);margin-top:12px}
.field label.check input{width:auto;margin:0}
table.editpos input{margin-top:0;padding:6px 8px;font-size:.88em}
table.editpos td{padding:6px 6px}
table.editpos td.center{text-align:center;vertical-align:middle}
.w-s{width:62px}.w-m{width:110px}.w-l{width:170px}
.w-auto{width:auto!important}
.release-bar{display:flex;align-items:center;gap:14px;margin:4px 0 18px}

/* --- Upload-Zone (Erfassung per Datei) -------------------------------------- */
.upload-zone{flex:1 1 320px;display:block;position:relative;border:1.5px dashed rgba(91,155,255,.4);
  border-radius:12px;padding:22px 16px;text-align:center;cursor:pointer;
  background:rgba(91,155,255,.04);transition:border-color .2s,background .2s}
.upload-zone:hover{border-color:var(--brand);background:rgba(91,155,255,.09)}
.upload-zone input[type=file]{position:absolute;inset:0;width:100%;height:100%;
  opacity:0;cursor:pointer;margin:0}
.upload-zone .upload-hint{color:var(--muted);font-size:.92em;pointer-events:none}

/* --- Kundenliste: Suche + A-Z ------------------------------------------------- */
.cust-toolbar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:16px;
  position:sticky;top:64px;z-index:4;padding:10px 12px;border-radius:12px;
  background:rgba(13,17,25,.85);backdrop-filter:blur(10px);border:1px solid var(--line)}
.cust-toolbar input[type=search]{flex:1 1 300px;margin-top:0;padding:10px 14px;
  border-radius:10px;font-size:.95em}
.alpha-index{display:flex;gap:2px;flex-wrap:wrap}
.alpha-index a{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;
  font-size:.82em;font-weight:700;color:var(--ink);text-decoration:none;
  border:1px solid transparent;transition:border-color .15s,background .15s,opacity .15s}
.alpha-index a:hover{border-color:rgba(91,155,255,.45);background:rgba(91,155,255,.10)}
.alpha-index a.dim{opacity:.25;pointer-events:none}
.cust-group{scroll-margin-top:86px}
.alpha-badge{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;
  margin-right:8px;font-size:13px;letter-spacing:0;
  background:linear-gradient(135deg,rgba(76,141,255,.25),rgba(125,107,255,.25));
  border:1px solid rgba(91,155,255,.35);color:#cfe0ff}

/* --- Hilfeseite -------------------------------------------------------------- */
.help-steps{margin:8px 0 0;padding-left:22px;display:grid;gap:12px;max-width:860px}
.help-steps li{line-height:1.6}
.help-steps ul{margin:6px 0 0;padding-left:18px;display:grid;gap:6px}
.help-list{margin:8px 0 0;padding-left:20px;display:grid;gap:8px;max-width:860px}
.help-list li{line-height:1.55}
@media (max-width:900px){
  .editgrid.four{grid-template-columns:1fr 1fr}
}

/* Quelldokumente am Lauf: direkt in FRIDA oeffnen (PDF inline im Browser-Tab) */
.filelist{display:flex;flex-wrap:wrap;gap:8px}
.filechip{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--line);
  border-radius:9px;background:var(--soft);font-size:.86rem;text-decoration:none;color:var(--ink);
  max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filechip:hover{border-color:var(--accent);color:var(--accent)}

/* FRIDA-Bestaetigungsdialog (ersetzt Browser-confirm, Designbruch-Fix 2026-07-03) */
.fmodal-backdrop{position:fixed;inset:0;background:rgba(8,10,16,.62);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;z-index:1000;animation:fmodal-in .12s ease-out}
.fmodal{background:var(--card,#171a23);border:1px solid rgba(255,255,255,.14);border-radius:12px;
  max-width:440px;width:calc(100% - 48px);padding:0;box-shadow:0 18px 60px rgba(0,0,0,.55)}
.fmodal-head{padding:14px 18px 0;font-weight:700}
.fmodal-body{padding:10px 18px 4px;color:var(--muted,#9aa3b2);font-size:.94em;line-height:1.5}
.fmodal-foot{display:flex;justify-content:flex-end;gap:10px;padding:14px 18px 16px}
@keyframes fmodal-in{from{opacity:0}to{opacity:1}}

/* Benutzer-Tabellen: Zellen mit Zweitzeile (E-Mail unter dem Namen) machen die Zeile
   hoeher - vertical-align:middle versetzt dann die Inputs gegeneinander. Alles oben
   ausrichten; reine Textzellen (.txt) bekommen einen Ausgleich auf die Input-Textzeile. */
table.grid.vtop td{vertical-align:top}
table.grid.vtop td.txt{padding-top:18px}

/* --- Dashboard: Verlaufsgraph (Komet-Stil: Glas, Leuchten, polierter Finish) ----- */
.trend-stage{position:relative}
.trend-stage svg{display:block;width:100%;height:200px;overflow:visible}
.trend-grid{stroke:rgba(255,255,255,.07);stroke-width:1}
.trend-base{stroke:rgba(255,255,255,.12);stroke-width:1}
.trend-lbl{fill:#7b8494;font-size:11px;font-family:inherit}
.trend-line{fill:none;stroke:url(#trgrad);stroke-width:3;stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(120,150,255,.55))}
.trend-area{fill:url(#trarea);opacity:.8}
.trend-guide{stroke:rgba(140,180,255,.35);stroke-width:1;stroke-dasharray:3 4}
.trend-dot{fill:#fff;stroke:rgba(140,180,255,.9);stroke-width:2;
  filter:drop-shadow(0 0 8px rgba(140,180,255,.85))}
.trend-tip{position:absolute;z-index:6;pointer-events:none;min-width:200px;max-width:300px;
  background:rgba(10,13,20,.92);backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 13px;
  box-shadow:0 12px 40px rgba(0,0,0,.55),0 0 24px rgba(91,155,255,.12);
  font-size:.86em;line-height:1.5;animation:fmodal-in .1s ease-out}
.trend-tip .tt-day{font-weight:700;color:#eef2f8}
.trend-tip .tt-sum{color:var(--muted);margin-bottom:6px}
.trend-tip .tt-run{display:flex;gap:7px;align-items:baseline;color:#c6cdda}
.trend-tip .tt-run .dot{width:7px;height:7px;border-radius:50%;flex:0 0 auto;
  position:relative;top:-1px}
.trend-tip .dot.ok{background:var(--ok);box-shadow:0 0 8px rgba(86,210,126,.7)}
.trend-tip .dot.bad{background:var(--danger);box-shadow:0 0 8px rgba(243,115,107,.7)}
.trend-tip .dot.dup{background:#8a95a8;box-shadow:0 0 8px rgba(138,149,168,.5)}
.trend-tip .tt-leer{color:var(--muted);font-style:italic}

/* --- Dashboard: Feature-Laufband (kompakt statt Kachel-Wand) -------------------- */
.feat-ticker{position:relative;overflow:hidden;padding:6px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.feat-track{display:flex;gap:10px;width:max-content;animation:feat-scroll 70s linear infinite}
.feat-ticker:hover .feat-track{animation-play-state:paused}
.feat-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;
  border:1px solid rgba(255,255,255,.09);border-radius:999px;background:#12161d;
  white-space:nowrap;font-size:.88em;font-weight:600;color:#c6cdda;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}
@keyframes feat-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){
  .feat-track{animation:none;flex-wrap:wrap;width:auto}
  .feat-ticker{mask-image:none;-webkit-mask-image:none}
}