/* =============================================================================
 * app.css — Scopario Design System (Brandbook final v8).
 * Enterprise-Vertrauen + analytische Präzision: Deep Navy als ruhige Basis,
 * Cyan zeigt Aktivität/Analyse, Amber markiert Risiko/Entscheidung.
 * Typografie: Manrope (Headlines) · Inter (UI) · IBM Plex Mono (Kennzahlen).
 * Ruhige SaaS-Flächen, klare Karten, viel Weißraum, Dark-Mode via [data-theme].
 *
 * Aufbau: (1) Markentokens sind die Quelle der Wahrheit. (2) Die historischen
 * --teal-/--amber-/--rose-Aliasse zeigen auf die Marke, damit alle bestehenden
 * Regeln (und die Stimulus-Controller) ohne Umbau markengetreu rendern.
 * ========================================================================== */
:root{
  /* ---- Markenpalette (verbindlich) ------------------------------------- */
  --navy:#0B152B;        /* Deep Navy — Headlines, Dark-UI, CTA, Vertrauen   */
  --navy-600:#1C2C4A;    /* aufgehellt: Hover/Verläufe auf Navy              */
  --cyan:#00C7C3;        /* Cyan — Primärakzent, Analyse, aktive Zustände    */
  --amber:#F5A623;       /* Amber — Risiko, Entscheidungspunkt, Warnung      */
  --slate:#7A869A;       /* Slate — Sekundärtext, Labels, neutrale Rahmen    */
  --light-gray:#F4F6F8;  /* Light Gray — Hintergründe, Kartenflächen         */
  --rich-blue:#2C6BD8;   /* Rich Blue — sekundärer Daten-/Kurvenakzent       */

  /* Cyan-Tonleiter (aus #00C7C3 abgeleitet) für Flächen/Text/Hover */
  --cyan-50:#E7FBFA;  --cyan-100:#C4F3F1; --cyan-200:#90E8E5; --cyan-300:#4FD9D5;
  --cyan-400:#14CBC7; --cyan-500:#00C7C3; --cyan-600:#00A5A2; --cyan-700:#0C7C7A; --cyan-800:#0B5E5D;
  /* Rich-Blue-Tonleiter */
  --blue-50:#EAF1FC; --blue-100:#D3E2F8; --blue-500:#2C6BD8; --blue-600:#2159C0; --blue-700:#1B47A0;

  /* ---- Legacy-Aliasse → Marke (nicht entfernen, extern referenziert) --- */
  --teal-50:var(--cyan-50);   --teal-100:var(--cyan-100); --teal-200:var(--cyan-200);
  --teal-300:var(--cyan-300); --teal-400:var(--cyan-400); --teal-500:var(--cyan-500);
  --teal-600:var(--cyan-600); --teal-700:var(--cyan-700); --teal-800:var(--cyan-800);
  --amber-100:#FDEECB; --amber-400:#F5A623; --amber-500:#E5951A; --amber-700:#9A6410;
  --rose-100:#FCE4E4;  --rose-500:#E5484D;  --rose-600:#D3373C; --rose-700:#B4262C;
  /* Violett — reserviert für den Angebotscheck (maximal unterscheidbar von Teal/Blau/Amber/Rose) */
  --violet-100:#EDE9FE; --violet-300:#C4B5FD; --violet-700:#6D28D9;

  /* ---- Neutrale / Flächen --------------------------------------------- */
  --ink:#17233B; --ink-2:#44566E; --muted:#7A869A; --line:#E4E9F0;
  --bg:#F4F6F8; --surface:#FFFFFF; --surface-2:#EDF1F6;
  --shadow:0 1px 2px rgba(11,21,43,.05), 0 10px 30px -16px rgba(11,21,43,.18);
  --radius:14px; --radius-sm:10px;

  /* ---- Typografie ----------------------------------------------------- */
  --sans:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --head:'Manrope','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --serif:var(--head);   /* Legacy-Alias: Headlines laufen jetzt in Manrope */
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
[data-theme="dark"]{
  --ink:#EAF0F8; --ink-2:#B4C0D2; --muted:#8493A9; --line:#243450;
  --bg:#0B152B; --surface:#12203C; --surface-2:#1A2A49;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 12px 34px -16px rgba(0,0,0,.6);
  /* Cyan-Flächen auf dunklem Grund abdunkeln, damit Text lesbar bleibt */
  --cyan-50:#123B45; --cyan-100:#15505A;
  --blue-50:#152A4A; --blue-100:#1C3A63;
  --amber-100:#3A2E12;
  --rose-100:#3A1D1F;
  --violet-100:#2A2145;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0 0 .3em;line-height:1.2;font-weight:700;letter-spacing:-.01em;font-family:var(--head)}
h1{font-size:2rem;font-weight:800;color:var(--navy);letter-spacing:-.02em}
[data-theme="dark"] h1{color:var(--ink)}
h2{font-size:1.15rem;display:flex;align-items:center;gap:.5rem}
h3{font-size:1.02rem}
h4{font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-top:1.1rem}
p{margin:.3rem 0}
a{color:inherit;text-decoration:none}
code{font-family:var(--mono);font-size:.85em;background:var(--surface-2);padding:.1em .4em;border-radius:6px;border:1px solid var(--line)}
.muted{color:var(--muted)}
.small{font-size:.82rem}
.center{text-align:center}
.ico{display:inline-flex;width:1.15em;height:1.15em;flex:none}
.ico svg{width:100%;height:100%}
.row{display:flex;gap:.6rem;align-items:center}
.row-between{display:flex;align-items:center;justify-content:space-between;gap:.6rem}
.clamp{overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* ---- Layout: Sidebar + Content ----------------------------------------- */
#app{display:grid;grid-template-columns:264px 1fr;min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;background:var(--surface);border-right:1px solid var(--line);
  padding:1.1rem;display:flex;flex-direction:column;gap:1rem}
.brand{display:flex;flex-direction:column;gap:.25rem;padding:.3rem .3rem .1rem;color:var(--navy)}
[data-theme="dark"] .brand{color:#fff}
.scopario-logo,.scopario-mark{display:block;height:auto}
.scopario-logo{width:auto}
.brand em{font-style:normal;font-size:.6rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);padding-left:.15rem}
.nav{display:flex;flex-direction:column;gap:.15rem}
.nav-foot{margin-top:auto;border-top:1px solid var(--line);padding-top:.8rem}
.nav-link{display:flex;align-items:center;gap:.7rem;padding:.6rem .75rem;border-radius:var(--radius-sm);color:var(--ink-2);font-weight:500}
.nav-link:hover{background:var(--surface-2)}
.nav-link.active{background:var(--cyan-50);color:var(--navy);font-weight:600;position:relative}
.nav-link.active::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:1.25rem;border-radius:0 3px 3px 0;background:var(--cyan-500)}
[data-theme="dark"] .nav-link.active{background:var(--cyan-50);color:var(--cyan-200)}
.nav-link .ico{color:currentColor}
.content{padding:2rem 2.4rem;max-width:1080px;width:100%}

/* ---- Buttons ----------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem 1rem;border-radius:var(--radius-sm);
  border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-weight:600;font-size:.9rem;cursor:pointer;transition:.15s}
.btn:hover{background:var(--surface-2);border-color:var(--cyan-300)}
.btn-primary{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:0 8px 20px -10px rgba(0,199,195,.55)}
.btn-primary:hover{background:var(--navy-600);border-color:var(--navy-600)}
[data-theme="dark"] .btn-primary{background:var(--cyan-500);border-color:var(--cyan-500);color:var(--navy);box-shadow:0 8px 20px -10px rgba(0,199,195,.6)}
[data-theme="dark"] .btn-primary:hover{background:var(--cyan-400);border-color:var(--cyan-400)}
.btn-block{width:100%}
.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}
.btn.ghost:hover{background:var(--surface-2)}
.btn.danger{color:var(--rose-600);border-color:var(--rose-100)}
.btn.danger:hover{background:var(--rose-100)}
.new-est{background:var(--navy);color:#fff;border:none;font-weight:700;box-shadow:0 8px 22px -10px rgba(0,199,195,.6)}
.new-est:hover{background:var(--navy-600)}
[data-theme="dark"] .new-est{background:var(--cyan-500);color:var(--navy)}
[data-theme="dark"] .new-est:hover{background:var(--cyan-400)}
.icon-btn{display:inline-flex;padding:.3rem;border-radius:8px;color:var(--muted)}
.icon-btn:hover{background:var(--surface-2)}
.back{margin-bottom:.4rem}

/* ---- Page head & cards ------------------------------------------------- */
.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.2rem}
.page-head .sub{color:var(--muted);margin-top:.1rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.3rem;box-shadow:var(--shadow);margin-bottom:1.2rem}
.card h2{margin-bottom:.2rem}

/* ---- Callouts (Didaktik) ----------------------------------------------- */
.callout{display:flex;gap:.8rem;padding:.9rem 1.05rem;border-radius:var(--radius-sm);margin:.9rem 0;
  background:var(--amber-100);border:1px solid #F3DCAE;color:var(--amber-700)}
.callout .ico{flex:none;width:1.3rem;height:1.3rem;margin-top:.1rem;color:var(--amber-700)}
.callout strong{display:block;margin-bottom:.15rem}
.callout.calc{background:var(--cyan-50);border-color:var(--cyan-100);color:var(--cyan-800)}
.callout.calc .ico{color:var(--cyan-600)}
.callout.info{background:var(--cyan-50);border-color:var(--cyan-100);color:var(--cyan-800)}
.callout.info .ico{color:var(--cyan-600)}
.callout.warn{background:var(--rose-100);border-color:#F3C9C9;color:var(--rose-700)}
.callout.warn .ico{color:var(--rose-600)}
[data-theme="dark"] .callout.warn{background:rgba(229,72,77,.12);border-color:rgba(229,72,77,.3);color:#F4A9AB}
[data-theme="dark"] .callout{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.25);color:var(--amber-400)}
[data-theme="dark"] .callout.calc,[data-theme="dark"] .callout.info{background:rgba(0,199,195,.1);border-color:rgba(0,199,195,.25);color:var(--cyan-200)}
.callout code{background:rgba(0,0,0,.06)}

/* ---- Toolbar / inputs -------------------------------------------------- */
.toolbar{display:flex;gap:.7rem;margin-bottom:1rem;flex-wrap:wrap}
.input{width:100%;padding:.6rem .8rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font:inherit;font-size:.92rem}
.input:focus{outline:none;border-color:var(--teal-500);box-shadow:0 0 0 3px var(--teal-100)}
[data-theme="dark"] .input:focus{box-shadow:0 0 0 3px rgba(0,199,195,.25)}
textarea.input{resize:vertical;min-height:90px}
textarea.mono{font-family:var(--mono);font-size:.86rem;min-height:180px}
select.input{cursor:pointer}
.search{max-width:none;flex:1;min-width:200px}
.toolbar .input:not(.search){max-width:210px}
.field{display:flex;flex-direction:column;gap:.35rem;margin:.8rem 0}
.field>span{font-weight:600;font-size:.9rem}
.field.inline{flex-direction:row;align-items:center;gap:.8rem}
.field.inline input[type=range]{flex:1}
.field-hint{margin-top:-.1rem}
.counter{align-self:flex-end;color:var(--muted);font-size:.78rem;font-style:normal}

/* Projekttyp-Katalog (Erklär-Referenz beim Anlegen) */
.type-catalog{margin:.2rem 0 1rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface-2,transparent)}
.type-catalog>summary{cursor:pointer;padding:.6rem .8rem;font-weight:600;font-size:.9rem;list-style:none}
.type-catalog>summary::-webkit-details-marker{display:none}
.type-catalog>summary::before{content:'▸';display:inline-block;margin-right:.5rem;color:var(--muted);transition:transform .15s}
.type-catalog[open]>summary::before{transform:rotate(90deg)}
.type-catalog-body{padding:.2rem .9rem .8rem;display:grid;gap:.7rem}
.tc-cat-label{font-family:var(--head);font-weight:700;font-size:.82rem;color:var(--cyan-700);letter-spacing:.01em;margin-bottom:.2rem}
.tc-list{list-style:none;margin:0;padding:0;display:grid;gap:.1rem}
/* FESTE Spaltenbreiten: jedes li ist ein eigenes Grid — nur identische
   Spalten je Zeile richten Faktor + Beschreibung über alle Zeilen bündig aus. */
.tc-list li{display:grid;grid-template-columns:15.5rem 3.4rem 1fr;gap:.15rem .9rem;align-items:baseline;font-size:.82rem;padding:.22rem 0}
.tc-list li+li{border-top:1px solid color-mix(in srgb, var(--line) 45%, transparent)}
.tc-name{font-weight:600}
.tc-factor{font-family:var(--mono);font-size:.72rem;color:var(--cyan-700);text-align:right;background:var(--surface-2,rgba(0,0,0,.04));border:1px solid var(--line);border-radius:99px;padding:.05rem .45rem;justify-self:end;white-space:nowrap}
.tc-desc{line-height:1.45}
@media(max-width:720px){.tc-list li{grid-template-columns:1fr auto}.tc-desc{grid-column:1/-1;padding-bottom:.15rem}}

/* ---- Cards grid / project cards ---------------------------------------- */
.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.project-card{display:flex;flex-direction:column;gap:.5rem;transition:.15s}
.project-card:hover{transform:translateY(-2px);border-color:var(--teal-200);box-shadow:0 12px 28px -16px rgba(13,148,136,.4)}
.pc-top{display:flex;justify-content:space-between;gap:.5rem}
.pc-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:.5rem;border-top:1px solid var(--line)}
.total{font-weight:700;color:var(--cyan-700);font-family:var(--mono)}

/* ---- Badges / chips / pills -------------------------------------------- */
.badge{display:inline-flex;align-items:center;gap:.3rem;padding:.15rem .55rem;border-radius:20px;font-size:.75rem;font-weight:600;background:var(--surface-2);color:var(--ink-2);white-space:nowrap}
.badge.soft{background:var(--teal-50);color:var(--teal-700)}
.badge.type{background:var(--blue-50);color:var(--blue-700)}
[data-theme="dark"] .badge.type{background:rgba(44,107,216,.18);color:#9DBDF3}
/* Angebotscheck / Vergleich — hebt „Challenge"-Projekte in der Projektliste ab */
.badge.compare{background:var(--violet-100);color:var(--violet-700)}
[data-theme="dark"] .badge.compare{color:var(--violet-300)}
.badge.status.draft{background:#f1f5f9;color:#64748b}
.badge.status.in_progress{background:var(--amber-100);color:var(--amber-700)}
.badge.status.completed{background:var(--teal-100);color:var(--teal-700)}
.badge.q-high{background:var(--rose-100);color:var(--rose-700)}
.badge.q-mid{background:var(--amber-100);color:var(--amber-700)}
.badge.q-low{background:var(--teal-100);color:var(--teal-700)}
/* Vergleichsmatrix (Angebotscheck): Ampel-Hintergrund je Zelle + „fehlt"-Markierung */
.ttable td.mx-q-low{background:var(--teal-50)}
.ttable td.mx-q-mid{background:var(--amber-100)}
.ttable td.mx-q-high{background:var(--rose-100)}
.ttable td.mx-missing{background:var(--rose-100);color:var(--rose-700);font-weight:600}
.ttable td.mx-soft{color:var(--muted)}
.ttable tr.mx-total td{border-top:2px solid var(--line);background:var(--surface-2)}
[data-theme="dark"] .ttable td.mx-q-low{background:rgba(13,148,136,.14)}
[data-theme="dark"] .ttable td.mx-q-mid{background:rgba(217,119,6,.14)}
[data-theme="dark"] .ttable td.mx-q-high,[data-theme="dark"] .ttable td.mx-missing{background:rgba(225,29,72,.14)}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0}
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .6rem;border-radius:20px;background:var(--surface-2);border:1px solid var(--line);font-size:.8rem;font-weight:500}
.chip.soft{background:var(--teal-50);border-color:var(--teal-100);color:var(--teal-700)}
.chip.warn{background:var(--amber-100);border-color:#f6e6b8;color:var(--amber-700)}
.size-pill{display:inline-flex;align-items:center;justify-content:center;min-width:1.7rem;height:1.4rem;padding:0 .3rem;border-radius:6px;font-size:.72rem;font-weight:800;background:var(--teal-600);color:#fff}
.size-pill{font-family:var(--mono)}
.size-pill.XS{background:var(--slate)}.size-pill.S{background:var(--rich-blue)}.size-pill.M{background:var(--cyan-600)}.size-pill.L{background:var(--amber-500)}.size-pill.XL{background:var(--rose-500)}

/* ---- Empty state ------------------------------------------------------- */
.empty{text-align:center;padding:2.6rem 1.3rem}
.empty-ic{width:3rem;height:3rem;margin:0 auto .6rem;color:var(--muted);opacity:.6}
.empty-ic .ico{width:100%;height:100%}
.empty .btn{margin-top:.8rem}
.empty-inline{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:1.4rem;color:var(--muted);text-align:center}
.empty-inline .ico{width:2rem;height:2rem;opacity:.5}

/* ---- Modal ------------------------------------------------------------- */
.modal-backdrop{position:fixed;inset:0;background:rgba(19,32,41,.45);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:50;padding:1rem}
.modal{background:var(--surface);border-radius:var(--radius);padding:1.5rem;width:min(520px,100%);box-shadow:0 24px 60px -20px rgba(0,0,0,.4);max-height:92vh;overflow:auto}
.modal-actions{display:flex;justify-content:flex-end;gap:.6rem;margin-top:1.1rem}

/* ---- Wizard-Rail (nummerierte Progress-Rail, eigenständige Optik) ------ */
.rail{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1rem 1.3rem 1.1rem;margin-bottom:1.4rem}
.rail-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.9rem}
.rail-project{font-family:var(--head);font-weight:800;font-size:1rem;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rail-pos{font-family:var(--mono);font-size:.72rem;color:var(--muted);letter-spacing:.08em;white-space:nowrap}

/* Sauberer Stepper: verbundene Punkte, eine Akzentfarbe (Cyan) */
.stepper{display:grid;grid-template-columns:repeat(6,1fr);list-style:none;margin:0;padding:0}
.step{position:relative;min-width:0}
.step>a{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:.1rem .3rem;text-decoration:none}
.step:not(:first-child)::before{content:'';position:absolute;top:calc(.1rem + .87rem - 1px);left:-50%;width:100%;height:2px;background:var(--line);z-index:0}
.step.done::before,.step.cur::before{background:var(--cyan-400)}
.step-dot{position:relative;z-index:1;width:1.75rem;height:1.75rem;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.78rem;font-weight:600;background:var(--surface);border:2px solid var(--line);color:var(--muted);transition:.15s}
.step.done .step-dot{background:var(--cyan-500);border-color:var(--cyan-500);color:#fff}
.step.cur .step-dot{border-color:var(--cyan-600);color:var(--cyan-700);box-shadow:0 0 0 4px var(--cyan-50)}
.step>a:hover .step-dot{border-color:var(--cyan-400)}
.step-label{font-family:var(--head);font-weight:700;font-size:.88rem;letter-spacing:-.01em;color:var(--muted);text-align:center}
.step.done .step-label{color:var(--ink-2)}
.step.cur .step-label{color:var(--cyan-700)}
.step-sub{font-size:.68rem;color:var(--muted);text-align:center;line-height:1.25}
.radar-note{margin-top:.7rem;padding-top:.65rem;border-top:1px solid var(--line)}
.radar-note .ai-tag{margin-bottom:.35rem}
.radar-note p{margin:0;line-height:1.5}
@media(max-width:720px){.step-sub{display:none}.step-label{font-size:.8rem}}
@media (max-width:920px){.rail-steps{grid-template-columns:repeat(3,1fr)}.rail-sub{display:none}}
.wizard-foot{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.2rem;flex-wrap:wrap}
.wizard-foot>div{display:flex;gap:.6rem}

/* ---- Tabs -------------------------------------------------------------- */
.tabs{display:inline-flex;gap:.2rem;background:var(--surface-2);padding:.25rem;border-radius:var(--radius-sm);margin:.7rem 0}
.tab{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .8rem;border:none;background:transparent;border-radius:8px;font:inherit;font-weight:600;font-size:.86rem;color:var(--muted);cursor:pointer}
.tab.active{background:var(--surface);color:var(--teal-700);box-shadow:var(--shadow)}

/* ---- Bullets / lists --------------------------------------------------- */
.bullets{margin:.3rem 0;padding-left:1.1rem}
.bullets li{margin:.25rem 0}
.bullets.suggest li,.bullets.open li{list-style:none;position:relative;padding-left:1.1rem}
.bullets.suggest li::before{content:'→';position:absolute;left:0;color:var(--teal-600);font-weight:700}
.bullets.open li::before{content:'?';position:absolute;left:0;color:var(--amber-500);font-weight:800}
.bullets.check li{list-style:none;position:relative;padding-left:1.3rem}
.bullets.check li::before{content:'✓';position:absolute;left:0;color:var(--teal-600);font-weight:800}
.steps-list{counter-reset:s;list-style:none;padding:0;margin:0}
.steps-list li{counter-increment:s;position:relative;padding:.5rem 0 .5rem 2.4rem;border-bottom:1px solid var(--line)}
.steps-list li:last-child{border-bottom:none}
.steps-list li::before{content:counter(s);position:absolute;left:0;top:.5rem;width:1.7rem;height:1.7rem;background:var(--teal-600);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem}
.steps-list b{display:block}

/* ---- Scale grid & drivers ---------------------------------------------- */
.scale-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin:.6rem 0}
.scale{text-align:left;padding:.85rem;border:1.5px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);cursor:pointer;transition:.15s;display:flex;flex-direction:column;gap:.2rem}
.scale:hover{border-color:var(--teal-300,#5eead4)}
.scale.sel{border-color:var(--teal-600);background:var(--teal-50)}
[data-theme="dark"] .scale.sel{background:rgba(0,199,195,.1)}
.scale b{font-size:.95rem}
.disclose{margin-top:.7rem;border-top:1px solid var(--line);padding-top:.6rem}
.disclose summary{cursor:pointer;font-weight:600;color:var(--teal-700);font-size:.9rem;display:flex;align-items:center;gap:.4rem;list-style:none}
.disclose summary::-webkit-details-marker{display:none}
.disclose[open] summary{margin-bottom:.6rem}
.ttable{width:100%;border-collapse:collapse;margin:.4rem 0}
.ttable th,.ttable td{border:1px solid var(--line);padding:.4rem .6rem;text-align:left;font-size:.86rem}
.ttable th{background:var(--surface-2);font-weight:600}
.drivers{display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.4rem;margin:.8rem 0}
.driver label{font-weight:600;font-size:.9rem;display:flex;align-items:center;gap:.35rem}
.drv-val{color:var(--teal-700);font-size:.85rem}
.tip{display:inline-flex;width:1.05rem;height:1.05rem;align-items:center;justify-content:center;border-radius:50%;background:var(--surface-2);color:var(--muted);font-size:.72rem;cursor:help;border:1px solid var(--line)}
.scale-ends{display:flex;justify-content:space-between;margin-top:.15rem}
input[type=range]{width:100%;accent-color:var(--teal-600);margin:.4rem 0 0}
.uncertainty{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;border-radius:var(--radius-sm);background:var(--surface-2);margin-top:1rem;border-left:4px solid var(--muted)}
.uncertainty.high{border-left-color:var(--rose-500)}
.uncertainty.medium{border-left-color:var(--amber-500)}
.uncertainty.low{border-left-color:var(--teal-500)}

/* ---- Klärungsfragen ---------------------------------------------------- */
.clar{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.85rem;margin:.6rem 0;background:var(--surface-2)}
.clar-head{display:flex;gap:.7rem;align-items:flex-start}
.clar-n{flex:none;width:1.6rem;height:1.6rem;background:var(--teal-600);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.82rem}
.opts{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.6rem;padding-left:2.3rem}
.opt{padding:.35rem .75rem;border:1px solid var(--line);border-radius:20px;background:var(--surface);font:inherit;font-size:.82rem;font-weight:500;cursor:pointer;transition:.12s}
.opt:hover{border-color:var(--teal-400,#2dd4bf)}
.opt.sel{background:var(--teal-600);border-color:var(--teal-600);color:#fff}

/* ---- WBS --------------------------------------------------------------- */
.total-card .totals{display:flex;align-items:baseline;gap:.7rem;flex-wrap:wrap;margin:.4rem 0}
.big{font-size:1.7rem;font-weight:800;color:var(--cyan-700);letter-spacing:-.02em;font-family:var(--mono)}
.big.amber{color:var(--amber-700)}
.agg-grid{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.agg-side{text-align:right;padding:.4rem .7rem;background:var(--surface-2);border-radius:var(--radius-sm)}
.agg-side .strike{font-size:1.2rem;text-decoration:line-through;color:var(--muted)}
.corr-control{margin:.9rem 0 .3rem;padding-top:.7rem;border-top:1px solid var(--line)}
.corr-control .field.inline{margin:.2rem 0}
.wbs-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:1.2rem;align-items:start}
.tree{margin-top:.5rem}
.tree-comp{margin-bottom:.5rem}
.tree-row{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.5rem .6rem;border-radius:8px}
.tree-row.comp{font-weight:700;background:var(--surface-2);margin-bottom:.2rem}
.tree-row.wp{padding-left:1.4rem;border:1px solid transparent}
.tree-row.wp:hover{background:var(--surface-2)}
.tree-row.wp.sel{background:var(--teal-50);border-color:var(--teal-200)}
[data-theme="dark"] .tree-row.wp.sel{background:rgba(0,199,195,.12)}
.tree-row.out{opacity:.5;text-decoration:line-through}
.tw-meta{display:flex;align-items:center;gap:.5rem;font-size:.82rem}
.details-card{position:sticky;top:1rem}
.wp-title{display:flex;justify-content:space-between;align-items:center;gap:.6rem}
.pp-row{display:flex;gap:1.4rem;margin:.7rem 0;padding:.7rem;background:var(--surface-2);border-radius:var(--radius-sm)}
.pp{display:flex;flex-direction:column}
.pp b{font-size:1.15rem;color:var(--cyan-700);font-family:var(--mono)}

/* ---- Planung: Szenarien / Meilensteine / Risiken ----------------------- */
.plan-card{display:flex;flex-direction:column;gap:.4rem;text-align:left}
.pl-ic{width:2.4rem;height:2.4rem;border-radius:12px;background:var(--teal-50);color:var(--teal-600);display:flex;align-items:center;justify-content:center}
.pl-ic .ico{width:1.3rem;height:1.3rem}
.plan-card .btn{margin-top:auto}
.scen-list{display:flex;flex-direction:column;gap:.8rem}
.scen{border:1px solid var(--line);border-radius:var(--radius-sm);padding:1rem}
.scen.reco{border-color:var(--teal-500);box-shadow:0 0 0 1px var(--teal-500) inset}
.scen .ok{color:var(--teal-600)}
.scen-grid{display:flex;gap:2rem;margin:.5rem 0}
.scen-grid b{display:block;font-size:1rem}
.timeline{position:relative;padding-left:.5rem}
.mstone{display:flex;gap:.9rem;padding-bottom:1rem;position:relative}
.mstone:not(:last-child)::before{content:'';position:absolute;left:1rem;top:2.1rem;bottom:0;width:2px;background:var(--teal-200)}
.ms-flag{flex:none;width:2rem;height:2rem;border-radius:50%;background:var(--teal-600);color:#fff;display:flex;align-items:center;justify-content:center;z-index:1}
.ms-flag .ico{width:1rem;height:1rem}
.ms-body{flex:1;border:1px solid var(--line);border-radius:var(--radius-sm);padding:.8rem 1rem}
.ms-sec{margin-top:.5rem}
.risk-group{margin-bottom:1rem}
.rg-head{display:flex;align-items:center;gap:.5rem;color:var(--ink-2);border-left:3px solid var(--muted);padding-left:.6rem}
.rg-head.critical,.rg-head.high{border-left-color:var(--rose-500)}
.rg-head.medium{border-left-color:var(--amber-500)}
.risk{border:1px solid var(--line);border-left:4px solid var(--muted);border-radius:var(--radius-sm);padding:.85rem 1rem;margin:.6rem 0}
.risk.critical,.risk.high{border-left-color:var(--rose-500)}
.risk.medium{border-left-color:var(--amber-500)}
.risk-sec{margin-top:.5rem}
.risk-sec .small{letter-spacing:.05em}

/* ---- Export ------------------------------------------------------------ */
.export-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:1.2rem;align-items:start}
.artifact{display:flex;align-items:center;gap:.8rem;padding:.8rem;border:1px solid var(--line);border-radius:var(--radius-sm);margin:.5rem 0;cursor:pointer}
.artifact:hover{border-color:var(--teal-200)}
.artifact input{width:1.1rem;height:1.1rem;accent-color:var(--teal-600)}
.af-body{flex:1;display:flex;flex-direction:column}
.export-side .card{margin-bottom:1rem}
.ok-card{display:flex;align-items:center;gap:.7rem;border-color:var(--teal-200);background:var(--teal-50)}
[data-theme="dark"] .ok-card{background:rgba(0,199,195,.1)}
.ok-card .ok{color:var(--teal-600);width:1.6rem;height:1.6rem}

/* ---- Offer detail ------------------------------------------------------ */
.offer-grid{display:grid;grid-template-columns:1.5fr .8fr;gap:1.2rem;align-items:start}
.dropzone{border:2px dashed var(--line);border-radius:var(--radius-sm);padding:1.6rem;text-align:center;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:.4rem;cursor:pointer}
.dropzone:hover{border-color:var(--teal-400,#2dd4bf)}
.dropzone .ico{width:2rem;height:2rem;opacity:.6}
.meta-rows{margin-top:.8rem;border-top:1px solid var(--line);padding-top:.6rem;display:flex;flex-direction:column;gap:.3rem}

/* ---- History ----------------------------------------------------------- */
.hist-list{display:flex;flex-direction:column}
.hist{display:flex;gap:.9rem;align-items:center;padding:.75rem .3rem;border-bottom:1px solid var(--line)}
.hist:last-child{border-bottom:none}
.hist-ic{flex:none;width:2.1rem;height:2.1rem;border-radius:10px;background:var(--teal-50);color:var(--teal-600);display:flex;align-items:center;justify-content:center}
.hist-ic .ico{width:1.1rem;height:1.1rem}
.hist-body{display:flex;flex-direction:column;flex:1}
.hist-ts{white-space:nowrap}

/* ---- Settings ---------------------------------------------------------- */
.seg{display:inline-flex;gap:.2rem;background:var(--surface-2);padding:.25rem;border-radius:var(--radius-sm)}
.seg-btn{padding:.4rem 1rem;border:none;background:transparent;border-radius:8px;font:inherit;font-weight:600;cursor:pointer;color:var(--muted)}
.seg-btn.sel{background:var(--surface);color:var(--teal-700);box-shadow:var(--shadow)}

/* ---- Help extras ------------------------------------------------------- */
.workflow{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.wf{background:var(--teal-50);color:var(--teal-700);padding:.4rem .8rem;border-radius:20px;font-weight:600;font-size:.85rem}
.faq{border-bottom:1px solid var(--line);padding:.2rem 0}
.faq summary{cursor:pointer;font-weight:600;padding:.6rem 0;list-style:none;display:flex;justify-content:space-between}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';color:var(--teal-600);font-weight:700}
.faq[open] summary::after{content:'–'}
.faq>div{padding:0 0 .8rem;color:var(--ink-2)}

/* ---- Toast ------------------------------------------------------------- */
#toast{position:fixed;bottom:1.4rem;left:50%;transform:translate(-50%,120%);background:var(--ink);color:#fff;padding:.7rem 1.2rem;border-radius:var(--radius-sm);box-shadow:0 12px 30px -10px rgba(0,0,0,.4);z-index:100;transition:transform .25s;font-weight:500;font-size:.9rem}
#toast.show{transform:translate(-50%,0)}

/* ---- Methoden-Abgleich (Triangulation) --------------------------------- */
.consensus{border-left:5px solid var(--teal-500)}
.consensus.high{border-left-color:var(--teal-500)}
.consensus.medium{border-left-color:var(--amber-500)}
.consensus.low{border-left-color:var(--rose-500)}
.mbars{display:flex;flex-direction:column;gap:.55rem;margin:.6rem 0 1rem}
.mbar{display:grid;grid-template-columns:180px 1fr;gap:.7rem;align-items:center}
.mbar-label{font-size:.85rem;font-weight:600;text-align:right;color:var(--ink-2)}
.mbar-track{position:relative;height:26px;background:var(--surface-2);border-radius:6px;overflow:hidden}
.mbar-p80{position:absolute;left:0;top:0;height:100%;background:var(--teal-100)}
.mbar-p50{position:absolute;left:0;top:0;height:100%;background:var(--teal-500);opacity:.55}
.mbar-p80.consensus-bar{background:var(--amber-100)}
.mbar-p50.consensus-bar{background:var(--amber-500);opacity:.7}
.mbar-val{position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:.78rem;font-weight:600;color:var(--ink);font-family:var(--mono)}
.method-list{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:.4rem}
.method{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.9rem;background:var(--surface-2)}
.method .pp-row{background:var(--surface);margin:.5rem 0}

/* ---- Scope-Radar --------------------------------------------------------- */
.radar-top{display:grid;grid-template-columns:1fr auto;gap:1.2rem;align-items:center;margin:.6rem 0 1rem;padding:.9rem 1rem;background:var(--surface-2);border-radius:var(--radius-sm)}
.radar-meter{display:flex;flex-direction:column;gap:.3rem;min-width:200px}
.meter-track{height:10px;background:var(--line);border-radius:6px;overflow:hidden}
.meter-fill{height:100%;border-radius:6px;background:var(--muted);transition:width .4s}
.meter-fill.q-low{background:var(--teal-500)}
.meter-fill.q-mid{background:var(--amber-500)}
.meter-fill.q-high{background:var(--rose-500)}
.radar-tiles{display:flex;gap:.6rem}
.radar-tile{display:flex;flex-direction:column;align-items:center;padding:.5rem .9rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);min-width:5.2rem}
.radar-tile b{font-size:1.3rem;color:var(--cyan-700);font-family:var(--mono)}
.radar-tile span{font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.radar-cols{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
@media (max-width:920px){.radar-top{grid-template-columns:1fr}.radar-cols{grid-template-columns:1fr}}

/* ---- Monte-Carlo / Simulation ------------------------------------------ */
.histo-wrap{margin:.6rem 0 1rem;padding:.5rem .2rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface-2)}
.tornado-row{display:grid;grid-template-columns:1fr 120px 42px;gap:.5rem;align-items:center;margin:.3rem 0}
.tornado-label{font-size:.82rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tornado-track{height:12px;background:var(--surface-2);border-radius:6px;overflow:hidden}
.tornado-bar{height:100%;background:var(--teal-500);border-radius:6px}
.method.excluded{opacity:.62;border-style:dashed}
.method.excluded .pp b{color:var(--muted)}

/* ---- Risiko-Register ----------------------------------------------------- */
.risk-quant{display:flex;gap:1.2rem;flex-wrap:wrap;margin:.5rem 0;padding:.5rem .7rem;background:var(--surface-2);border-radius:var(--radius-sm)}
.risk-quant label{display:flex;align-items:center;gap:.4rem;font-size:.84rem;font-weight:600}
.input.rq{width:5.2rem;padding:.3rem .5rem;text-align:right}
.emv-summary{display:flex;align-items:baseline;gap:.8rem;padding:.7rem 1rem;background:var(--teal-50);border:1px solid var(--teal-100);border-radius:var(--radius-sm);margin:.6rem 0;color:var(--teal-800)}
[data-theme="dark"] .emv-summary{background:rgba(0,199,195,.1);border-color:rgba(0,199,195,.25);color:var(--teal-200)}

/* ---- FP-Arbeitsblatt ----------------------------------------------------- */
.input.fp-count{width:4.6rem;text-align:right}
.input.fp-cx{width:8.5rem}

/* ---- Angebotsbasis (Export) ---------------------------------------------- */
.offer-basis{border:2px solid var(--teal-500);background:var(--teal-50)}
[data-theme="dark"] .offer-basis{background:rgba(0,199,195,.08)}
.ob-kicker{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-700);font-weight:800}

/* ---- Administration ------------------------------------------------------ */
.prompt-item{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.6rem .8rem;margin:.5rem 0;border-top:1px solid var(--line)}
.prompt-item summary{display:flex;align-items:center;gap:.6rem}
.prompt-edit{min-height:220px;font-size:.8rem;margin-top:.5rem}

/* ---- Kalibrierung -------------------------------------------------------- */
.cal-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:.7rem 0}
.cal-stats .mini-card{display:flex;flex-direction:column;gap:.15rem}
@media (max-width:920px){.cal-stats{grid-template-columns:1fr 1fr}}

/* ---- Methodik-Seite ---------------------------------------------------- */
.method-viz{display:flex;justify-content:center;padding:.6rem 0 1rem;margin:.4rem 0;border-bottom:1px solid var(--line)}
.mini-card{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.9rem;background:var(--surface-2)}
.mini-card .badge{margin-bottom:.4rem}
.tlink{color:var(--teal-700);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.method-viz svg text{font-family:var(--sans)}

/* ---- Responsive -------------------------------------------------------- */
@media (max-width:920px){
  #app{grid-template-columns:1fr}
  .sidebar{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center}
  .sidebar .nav{flex-direction:row;flex-wrap:wrap}
  .nav-foot{margin:0;border:none;padding:0}
  .new-est{order:9}
  .wbs-grid,.export-grid,.offer-grid,.grid-2,.grid-3,.scale-grid,.drivers{grid-template-columns:1fr}
  .details-card{position:static}
  .content{padding:1.2rem}
}

/* ---- Auth-Seiten (Login/Registrierung) --------------------------------- */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem;
  background:radial-gradient(120% 120% at 50% -20%,var(--cyan-50),var(--bg) 55%)}
.auth-card{width:min(430px,100%);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:0 1px 2px rgba(11,21,43,.05),0 24px 60px -28px rgba(11,21,43,.35);padding:2.2rem 2rem;border-top:3px solid var(--cyan-500)}
.auth-brand{display:flex;align-items:center;gap:.6rem;color:var(--navy);margin-bottom:1rem}
[data-theme="dark"] .auth-brand{color:#fff}
.auth-card h1{font-size:1.4rem;color:var(--navy);margin:.6rem 0 .2rem}
[data-theme="dark"] .auth-card h1{color:var(--ink)}
.auth-foot{margin-top:1.1rem;text-align:center;color:var(--muted);font-size:.88rem}
.field-error{color:var(--rose-600);font-size:.8rem}
.form-error{background:var(--rose-100);color:var(--rose-700);padding:.6rem .8rem;border-radius:var(--radius-sm);font-size:.86rem;margin:.6rem 0}

/* ---- Betreiber-Admin ---------------------------------------------------- */
.nav-section{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:.3rem .75rem .15rem}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1.2rem}
.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.2rem;box-shadow:var(--shadow)}
.stat-card .big{font-size:1.9rem;font-weight:800;letter-spacing:-.02em;color:var(--cyan-700)}
.stat-card .lbl{color:var(--muted);font-size:.82rem;margin-top:.1rem}
.atable{width:100%;border-collapse:collapse;font-size:.9rem}
.atable th{text-align:left;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:.5rem .6rem;border-bottom:2px solid var(--line)}
.atable td{padding:.6rem .6rem;border-bottom:1px solid var(--line)}
.atable tr:hover td{background:var(--surface-2)}
.plan-badge{display:inline-flex;align-items:center;padding:.15rem .6rem;border-radius:20px;font-size:.74rem;font-weight:700}
.plan-badge.free{background:#f1f5f9;color:#64748b}
.plan-badge.business{background:var(--teal-100);color:var(--teal-700)}
.plan-badge.enterprise{background:var(--blue-50);color:var(--blue-700)}

/* ---- Projekt-DNA: Komplexitätstreiber mit Erklärung & Skala ------------ */
.driver{padding:.6rem 0}
.driver + .driver{border-top:1px solid var(--line)}
.driver-label{font-weight:600}
.driver-help{margin:.25rem 0 .55rem;color:var(--muted);font-size:.82rem;line-height:1.45}
.driver-dir{display:inline-block;margin-left:.2rem;font-weight:600;font-size:.7rem;padding:.05rem .42rem;border-radius:6px;white-space:nowrap}
.driver-dir.up{color:var(--amber-700);background:var(--amber-100)}
.driver-dir.down{color:var(--cyan-800);background:var(--cyan-50)}
.driver-ends{display:flex;justify-content:space-between;gap:.6rem;margin-top:.3rem;color:var(--muted);font-size:.72rem}

/* ---- KI-/Regelbasiert-Kennzeichnung im Wizard --------------------------- */
.ai-tag{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:600;padding:.15rem .55rem;border-radius:999px;white-space:nowrap}
.ai-tag.ai-on{color:var(--cyan-800);background:var(--cyan-50);border:1px solid var(--cyan-200)}
.ai-tag.ai-off{color:var(--slate);background:var(--surface-2);border:1px solid var(--line)}
.ai-legend{margin:.5rem 0 0;line-height:1.5;border-left:3px solid var(--cyan-200);padding-left:.7rem}

/* ---- Warte-/Modus-Overlay für KI-Aufrufe ------------------------------- */
.ai-overlay{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;background:rgba(11,21,43,.45);backdrop-filter:blur(3px);padding:1rem}
.ai-overlay.show{display:flex}
.ai-overlay-card{display:flex;gap:1rem;align-items:center;background:var(--surface);border-radius:var(--radius);padding:1.3rem 1.6rem;box-shadow:0 24px 60px -20px rgba(0,0,0,.4);max-width:min(460px,92vw)}
.ai-overlay-card b{font-family:var(--head);font-size:1.02rem}
.ai-overlay-card p{margin:.2rem 0 0}
.ai-overlay-card.ai{border:1px solid var(--cyan-300)}
.ai-overlay-card.rules{border:1px solid var(--line)}
.ai-overlay-card.warn{border:1px solid var(--amber-400)}
.ai-spinner{width:2.1rem;height:2.1rem;border-radius:50%;border:3px solid var(--cyan-100);border-top-color:var(--cyan-500);animation:ai-spin .7s linear infinite;flex:none}
@keyframes ai-spin{to{transform:rotate(360deg)}}
.ai-gear{font-size:1.9rem;line-height:1;flex:none}
.ai-overlay-card.rules .ai-gear{color:var(--slate)}
.ai-overlay-card.warn .ai-gear{color:var(--amber-500)}

/* ---- Projekt-Tabelle & Übersicht-KPIs ---------------------------------- */
.atable td.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.atable th.num{text-align:right}
.atable .p-name{font-weight:600;color:var(--ink)}
.atable a.p-name:hover{color:var(--cyan-700)}
.atable .p-desc{color:var(--muted);font-size:.78rem;margin-top:.1rem;max-width:34ch}
/* Reifegrad-Zelle: schmaler Fortschrittsbalken + Schritt-Label */
.rg{min-width:130px}
.rg .meter-track{height:6px;margin-top:.35rem}
.rg .rg-lbl{font-size:.78rem;color:var(--ink-2);display:flex;justify-content:space-between;gap:.6rem}
.rg .rg-lbl .rg-num{color:var(--muted);font-family:var(--mono)}
.est-p50{font-weight:700}
.est-p80{color:var(--muted);font-size:.78rem}
/* KPI-Karten: Zusatzzeile unter der großen Zahl */
.stat-card .unit{font-size:1rem;font-weight:700;color:var(--muted);margin-left:.15rem}
.stat-card .kpi-sub{color:var(--muted);font-size:.74rem;margin-top:.35rem}
.stat-card.kpi-ai .big{color:var(--cyan-700)}

/* ---- Glossar-Tooltip: gestrichelt unterstrichener Begriff + Hover-Erklärung */
.term{border-bottom:1px dotted var(--cyan-600);cursor:help;position:relative;font-weight:600;color:inherit}
.term:focus{outline:none}
.term::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%);
    width:max-content;max-width:280px;background:var(--navy);color:#fff;padding:.55rem .7rem;border-radius:8px;
    font-size:.76rem;font-weight:400;line-height:1.45;white-space:normal;text-align:left;
    box-shadow:0 14px 34px -12px rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:opacity .12s ease;z-index:60;pointer-events:none}
.term::before{content:'';position:absolute;left:50%;bottom:calc(100% + 3px);transform:translateX(-50%);
    border:6px solid transparent;border-top-color:var(--navy);opacity:0;visibility:hidden;transition:opacity .12s ease;z-index:60}
.term:hover::after,.term:focus::after,.term:hover::before,.term:focus::before{opacity:1;visibility:visible}

/* ---- WIRKUNG-Panel: Multiplikator-Aufschlüsselung (Treiber/Typ/Größe) ---- */
.wk-block{margin-top:1rem}
.wk-block .wk-title{font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:.4rem}
.wk-table{width:100%;border-collapse:collapse;font-size:.86rem}
.wk-table td{padding:.34rem .2rem;border-bottom:1px solid var(--line);vertical-align:top}
.wk-table .wk-delta{text-align:right;font-family:var(--mono);white-space:nowrap;font-weight:600}
.wk-table .wk-dir{text-align:right;white-space:nowrap;width:1%}
.wk-row.base td,.wk-row.result td{background:var(--surface-2)}
.wk-row.result td{border-top:2px solid var(--line);border-bottom:none}
.wk-row.up .wk-delta{color:var(--amber-700)}
.wk-row.down .wk-delta{color:var(--cyan-700)}
.wk-row.neutral .wk-delta{color:var(--muted)}
.wk-swatch{display:inline-block;width:.7rem;height:.7rem;border-radius:3px;vertical-align:-1px;margin-right:.1rem}
.wk-swatch.up{background:var(--amber-500)}
.wk-swatch.down{background:var(--cyan-500)}
.wk-swatch.neutral{background:var(--line)}

/* ---- Aufklapp-Affordanz: Chevron an <details class="disclose"> ----------- */
.disclose summary::before{content:'';display:inline-block;width:0;height:0;border-left:6px solid currentColor;
    border-top:5px solid transparent;border-bottom:5px solid transparent;transition:transform .15s ease;flex:none}
.disclose[open] summary::before{transform:rotate(90deg)}
.disclose summary:hover{color:var(--cyan-800)}
.disclose summary .hint{margin-left:auto;font-weight:400;font-size:.78rem;color:var(--muted)}

/* ---- Monte-Carlo: Legende unter dem Histogramm ------------------------- */
.mc-legend{display:flex;flex-wrap:wrap;gap:.4rem 1rem;margin:.5rem 0 0;font-size:.8rem}
.mc-legend .mc-key{display:inline-flex;align-items:center;gap:.4rem;color:var(--ink-2)}
.mc-legend .mc-line{display:inline-block;width:1.3rem;height:0;border-top:2px dashed currentColor;flex:none}

/* ---- Kalibrier-Kennzeichnung (Konsens-Banner + Notizen) ---------------- */
.calib-banner{display:flex;gap:.6rem;align-items:flex-start;margin:.2rem 0 .9rem;padding:.65rem .8rem;border-radius:var(--radius-sm);
    background:var(--cyan-50);border:1px solid var(--cyan-200);color:var(--cyan-800);font-size:.86rem;line-height:1.45}
[data-theme="dark"] .calib-banner{background:rgba(0,199,195,.1);border-color:rgba(0,199,195,.28);color:var(--cyan-200)}
.calib-banner .calib-ic{flex:none;font-weight:800;color:var(--cyan-600)}
.calib-note{display:flex;gap:.4rem;align-items:center;margin:.5rem 0 0;font-size:.8rem;color:var(--cyan-800);font-weight:600}
[data-theme="dark"] .calib-note{color:var(--cyan-200)}

/* ---- Bias-Korrektur (Schalter + „Basis → mit Bias") -------------------- */
.bias-card{border-left:3px solid var(--cyan-400)}
.bias-card.off{border-left-color:var(--line);opacity:.92}
.switch{display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;user-select:none}
.switch input{position:absolute;opacity:0;width:0;height:0}
.switch .switch-track{position:relative;width:2.4rem;height:1.35rem;border-radius:999px;background:var(--line);transition:.18s;flex:none}
.switch .switch-thumb{position:absolute;top:2px;left:2px;width:1.05rem;height:1.05rem;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:.18s}
.switch input:checked+.switch-track{background:var(--cyan-500)}
.switch input:checked+.switch-track .switch-thumb{transform:translateX(1.05rem)}
.switch input:focus-visible+.switch-track{outline:2px solid var(--cyan-600);outline-offset:2px}
.switch .switch-text{font-family:var(--mono);font-size:.72rem;font-weight:700;letter-spacing:.06em;color:var(--muted);min-width:2rem}
.switch input:checked~.switch-text{color:var(--cyan-700)}
.bias-flow{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-top:.3rem}
.bias-node{display:flex;flex-direction:column;gap:.1rem;padding:.5rem .8rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface)}
.bias-node b{font-size:1.15rem;font-family:var(--head)}
.bias-node.accent{border-color:var(--cyan-300);background:var(--cyan-50)}
[data-theme="dark"] .bias-node.accent{background:rgba(0,199,195,.1);border-color:rgba(0,199,195,.28)}
.bias-arrow{font-family:var(--mono);font-weight:700;color:var(--amber-500);font-size:.9rem}
.bias-src{align-self:center}
.bias-slider{margin-top:.7rem;padding-top:.7rem;border-top:1px dashed var(--line)}
.bias-slider input[type=range]{width:100%;margin:.35rem 0 .1rem}
.bias-slider #bias-pct-lbl{font-family:var(--mono);color:var(--cyan-700)}
@media(max-width:520px){.bias-flow{gap:.4rem}.bias-node{flex:1 1 40%}}

/* ---- Angebotscheck: Upload, Consent, Dokumentliste --------------------- */
.consent{display:flex;gap:.55rem;align-items:flex-start;margin:.5rem 0 .8rem;font-size:.86rem;line-height:1.45;cursor:pointer}
.consent input{margin-top:.2rem;flex:none}
.dropzone{display:flex;flex-direction:column;align-items:center;gap:.35rem;text-align:center;padding:1.6rem 1rem;
    border:2px dashed var(--line);border-radius:var(--radius);background:var(--surface);transition:.15s;cursor:pointer}
.dropzone:hover,.dropzone:focus-visible,.dropzone.over{border-color:var(--violet-700);background:var(--violet-100)}
.dropzone:focus-visible{outline:2px solid var(--cyan-600);outline-offset:2px}
.dropzone .dz-ico{font-size:1.6rem;line-height:1;color:var(--violet-700)}
.offer-docs{display:grid;gap:.6rem;margin-top:.9rem}
.offer-doc{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.7rem .85rem;background:var(--surface)}
.offer-doc.failed{border-color:var(--rose-100);background:var(--rose-100)}
[data-theme="dark"] .offer-doc.failed{background:rgba(211,55,60,.12)}
.offer-doc .od-name{font-weight:600;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.offer-doc .ttable{margin-top:.4rem}

/* ---- Auswählbare Szenario-Karten -------------------------------------- */
.scen-card{display:flex;flex-direction:column;gap:.3rem;text-align:left;width:100%;margin:0;cursor:pointer;
    font:inherit;color:inherit;appearance:none;background:var(--surface);border:1.5px solid var(--line);
    border-radius:var(--radius);padding:.9rem 1rem;transition:.15s}
.scen-card:hover{border-color:var(--cyan-300);box-shadow:var(--shadow)}
.scen-card:focus-visible{outline:2px solid var(--cyan-600);outline-offset:2px}
.scen-card.chosen{border-color:var(--cyan-500);box-shadow:0 0 0 3px var(--cyan-50)}
[data-theme="dark"] .scen-card.chosen{box-shadow:0 0 0 3px rgba(0,199,195,.15)}
.scen-card .scen-pick{font-size:.72rem;color:var(--muted);margin-top:.1rem}
.scen-card.chosen .scen-pick{color:var(--cyan-700);font-weight:600}

/* ---- Begriffs-Legende je Wizard-Seite --------------------------------- */
.glossary-legend{margin:1.1rem 0 .2rem;border:1px dashed var(--line);border-radius:var(--radius-sm);background:var(--surface)}
.glossary-legend>summary{cursor:pointer;padding:.55rem .8rem;font-weight:600;font-size:.85rem;color:var(--cyan-700);list-style:none}
.glossary-legend>summary::-webkit-details-marker{display:none}
.glossary-legend .leg-body{padding:.2rem .9rem .8rem;display:grid;gap:.45rem}
.leg-item{display:grid;grid-template-columns:minmax(4.5rem,7rem) 1fr;gap:.7rem;font-size:.82rem;line-height:1.4}
.leg-item b{font-family:var(--mono);color:var(--ink-2)}
.leg-item span{color:var(--muted)}
@media(max-width:520px){.leg-item{grid-template-columns:1fr}.leg-item b{color:var(--cyan-700)}}

/* ---- „Was passiert hier?"-Erklärbox je Schritt ------------------------ */
.step-intro{display:flex;gap:.6rem;align-items:flex-start;margin:0 0 1.1rem;padding:.7rem .9rem;border-radius:var(--radius-sm);
    background:var(--cyan-50);border:1px solid var(--cyan-200);color:var(--ink-2);line-height:1.5}
[data-theme="dark"] .step-intro{background:rgba(0,199,195,.08);border-color:rgba(0,199,195,.24)}
.step-intro .si-ic{flex:none;font-size:1.05rem;line-height:1.4}
.step-intro .si-body{font-size:.9rem}
.step-intro .si-body b{color:var(--cyan-800)}
[data-theme="dark"] .step-intro .si-body b{color:var(--cyan-200)}

/* ---- Regel-Erklärung (Scope-Radar & Co.) ------------------------------ */
.rules-box{margin-top:.8rem;border:1px dashed var(--line);border-radius:var(--radius-sm);background:var(--surface)}
.rules-box>summary{cursor:pointer;padding:.5rem .7rem;font-weight:600;font-size:.82rem;color:var(--cyan-700);list-style:none}
.rules-box>summary::-webkit-details-marker{display:none}
.rules-body{padding:.1rem .8rem .7rem}
.rules-list{margin:.3rem 0;padding-left:1.05rem;display:grid;gap:.35rem}
.rules-list li{font-size:.82rem;line-height:1.45;color:var(--ink-2)}

/* ---- „In einfachen Worten" — Ergebnis-Erklärung ----------------------- */
.plain{border-left:3px solid var(--amber-400);background:var(--amber-100)}
[data-theme="dark"] .plain{background:var(--amber-100)}
.plain h4{margin:0 0 .4rem}
.plain ul{margin:.3rem 0 0;padding-left:1.1rem;display:grid;gap:.35rem}
.plain li{font-size:.9rem;line-height:1.5}
.plain .say{margin-top:.7rem;padding:.6rem .8rem;border-radius:var(--radius-sm);background:var(--surface);border:1px solid var(--line);font-style:italic}

/* ---- Druck / PDF (Angebotscheck-Bericht, Konzept §8.3 export) ---------- */
@media print{
  #app{display:block}
  .sidebar,.back,.rail,.wizard-foot,.step-intro,.glossary-legend,.callout.warn.flash,#ai-overlay{display:none!important}
  .content{padding:0;max-width:none}
  body{background:#fff}
  .card{box-shadow:none;border:1px solid #ddd;break-inside:avoid}
  details.disclose{display:none}
}