/* ============================================================================
   TCGC Design-System v2.0 — calm premium dark. Eine Token-Quelle für alles:
   Elevations-Stufen (--s0..--s3), EINE Linienfarbe (--line), semantische
   Farben mit -soft-Flächen, Radius- & Typo-Skala. Tabellarische Ziffern für
   Zahlen. Bestehende Klassennamen bleiben gültig (Aliase unten).
   ========================================================================== */
:root{
  /* Flächen (Elevation) */
  --s0:#0a0d12; --s1:#10141c; --s2:#151b26; --s3:#1a2230;
  --bg:var(--s0); --bar:var(--s1); --panel:var(--s1); --card:var(--s2);
  /* Linien & Ränder: EINE Quelle statt 14 hartkodierter Hex-Varianten */
  --line:#1d2636; --bd:#27334a;
  /* Text */
  --fg:#e8edf5; --mut:#9aa4b6; --mut2:#7b8699;   /* v7.0 A11y: Kontrast auf WCAG-AA angehoben */
  /* Semantik (+ -soft Flächen, ersetzen Hex-Alpha-Suffix-Wildwuchs) */
  --ok:#1aa97a; --okf:#7fd9bb; --ok-soft:rgba(26,169,122,.12);
  --warn:#e69f00; --warnf:#f0c98a; --warn-soft:rgba(230,159,0,.11);
  --bad:#e8703a; --badf:#f0a583; --bad-soft:rgba(232,112,58,.11);
  --acc:#3b82f6; --acc2:#60a5fa; --acc-soft:rgba(59,130,246,.13);
  --violet:#a855f7; --violetf:#d8b4fe; --violet-soft:rgba(168,85,247,.12);
  --up:var(--ok); --down:var(--bad);
  /* v4.0 Marken-Identitaet: Signatur-Gradient (Teal->Violett) = wiedererkennbarer ACV-Akzent */
  --brand-1:#2dd4bf; --brand-2:#7c5cff;
  --brand-grad:linear-gradient(135deg,var(--brand-1),var(--brand-2));
  /* Radius-Skala (v9 §D.1: DURCHGESETZT — r-sm 7→8; Mapping: 8,9→r-sm · 12→r · 16→r-lg;
     Mikro-Radien ≤6px bleiben hart — unter dem Skalen-Floor) */
  --r-sm:8px; --r:10px; --r-lg:14px; --r-pill:20px;
  /* Typo-Skala (px): 8 Stufen + 2 Display (v9 §D.1).
     Mapping-Regel: 11.5→12 · 12.5→12 oder 13 (Kontext) · 13.5→14 · 14.5→14 ·
     Floor 10px (Chart-Achsen 9→10) */
  --t-nano:10px; --t-cap:11px; --t-sm:12px; --t-base:13px; --t-md:14px;
  --t-lg:16px; --t-xl:20px; --t-2xl:24px; --t-display:34px; --t-hero:40px;
  /* Spacing (v9 §D.1). Odd-Mapping: 7,9→8 · 5→4 · 14→12 · 15,18,22→nächste Stufe ·
     6px und 10px bleiben hart (äquidistant — kein stiller ±2px-Sprung in hunderten Zeilen) */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px;
  --ease:cubic-bezier(.4,.14,.3,1);
  /* v8 §7.1 Motion-Tokens — v9: die EINZIGEN Durations (.12–var(--dur-fast)→fast · .2–var(--dur)→dur · ≥var(--dur-slow)→slow) */
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --dur-fast:.15s; --dur:.25s; --dur-slow:.4s;
  /* Shadow-Skala (v9 §D.1), an s0–s3 gekoppelt */
  --sh-1:0 1px 2px rgba(0,0,0,.3);    /* Karten ruhend */
  --sh-2:0 8px 24px rgba(0,0,0,.45);  /* Hover/Popover/Toast */
  --sh-3:0 24px 70px rgba(0,0,0,.65); /* Modal/cmdk/notepop */
  /* Farb-Lücken als Token (v9 §D.1) */
  --line-strong:#33425e; --link-hover:#cfe0ff; --acc-border:#3b82f6aa;
  /* native Widgets (Selects/Scrollbars/Checkboxen) dunkel — Windows-Sides! */
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--fg);
  font:var(--t-md)/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  accent-color:var(--acc);scrollbar-color:var(--bd) var(--s0);
  display:flex;flex-direction:column;height:100vh;overflow:hidden}
/* dezenter Tiefen-Glow hinter allem — macht die Fläche lebendig, kostet nichts */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(1100px 500px at 18% -10%, rgba(59,130,246,.07), transparent 60%),
             radial-gradient(900px 420px at 95% 0%, rgba(26,169,122,.05), transparent 55%)}
#bar,#procbar,#ticker,#crumb,#view{position:relative;z-index:1}
b{font-weight:700}
.grow{flex:1 1 auto}
.mut{color:var(--mut)}
.num,.tnum{font-variant-numeric:tabular-nums}

/* ---- Header ---- */
#bar{flex:0 0 auto;background:var(--bar);border-bottom:1px solid var(--bd);
  display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-4);flex-wrap:wrap;
  box-shadow:0 2px 14px rgba(0,0,0,.35);z-index:30}
.brand{font-weight:800;letter-spacing:-.2px;display:flex;align-items:center;gap:var(--sp-2);cursor:pointer;flex-shrink:0}
.dot{width:9px;height:9px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(26,169,122,.5)}
@keyframes beat{0%{box-shadow:0 0 0 0 rgba(26,169,122,.5)}70%{box-shadow:0 0 0 9px rgba(26,169,122,0)}100%{box-shadow:0 0 0 0 rgba(26,169,122,0)}}
.dot.live{animation:beat 1.8s ease-out infinite}
.dot.busy{background:var(--warn);animation:beat 1s ease-out infinite}
.dot.err{background:var(--bad);animation:none}
/* Lade-/Prozess-Leiste (dauerhaft laufende Hintergrund-Jobs + Fortschritt) */
/* Kein max-height-Transition-von-0-Muster mehr: das blieb in gedrosselten
   Rendering-Kontexten am Offset 0 haengen (Leiste dauerhaft auf ~1px kollabiert,
   real beobachtet). Leer -> display:none, sonst natuerliche Hoehe. */
/* v6.1: Prozessleiste tritt zurück (s0, dünne Linie, ruhigere Typo) —
   harmoniert mit Ticker/Crumb darunter; der Fortschritt bleibt die 2px-Unterlinie
   (dieselbe Sprache wie die aktiven Tab-Unterstriche darüber). */
#procbar{flex:0 0 auto;display:flex;align-items:stretch;background:var(--s0);border-bottom:1px solid var(--line);
  overflow:hidden;max-height:36px;z-index:25}
#procbar:empty{display:none}
#procbar.active{box-shadow:inset 0 -2px 0 rgba(59,130,246,.14)}
.proc{position:relative;display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-3) 6px;font-size:var(--t-cap);
  border-right:1px solid var(--line);color:var(--mut);white-space:nowrap;overflow:hidden;max-width:46vw}
.pb-track{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.05)}
.pb-fill{position:absolute;left:0;bottom:0;height:2px;background:var(--acc);transition:width .9s linear}
.pb-fill.pb-done{background:var(--ok)}
.pb-fill.pb-pulse{background:var(--ok);animation:pbpulse 2.2s ease-in-out infinite}
@keyframes pbpulse{0%,100%{opacity:.35}50%{opacity:.9}}
.pb-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.pb-dot.run{background:var(--warn);animation:beat 1s ease-out infinite}
.pb-dot.watch{background:var(--ok)}
.pb-dot.idle{background:var(--mut2)}
.pb-ico{font-size:var(--t-sm);flex-shrink:0}
.pb-lbl{font-weight:700;color:var(--fg);flex-shrink:0}
.pb-detail{color:var(--mut);overflow:hidden;text-overflow:ellipsis}
.proc.on .pb-lbl{color:var(--warnf)}
#total{font-weight:800;font-size:var(--t-xl);letter-spacing:-.3px;flex-shrink:0}
@keyframes flash{0%{color:var(--acc2)}100%{color:var(--fg)}}
#total.flash{animation:flash 1.3s ease-out}
/* v6.1 TOP-LEISTEN-HARMONIE (Owner-Feedback): EIN System für Nav/Subnav/Proz/
   Ticker — Unterstrich-Tabs statt Pillen (ruhiger), Nav+Subnav verschmelzen auf
   s1 zu EINEM Block, Prozess-/Ticker-Zeilen treten auf s0 dahinter zurück. */
#nav{display:flex;gap:var(--sp-1);flex-wrap:wrap;align-self:stretch}
#nav a{position:relative;display:flex;align-items:center;color:var(--mut);
  text-decoration:none;font-weight:600;font-size:var(--t-base);padding:var(--sp-2) 11px;
  white-space:nowrap;border-radius:6px 6px 0 0;transition:color var(--dur-fast)}
#nav a:hover{color:var(--fg)}
#nav a.on{color:#eaf1ff}
#nav a.on::after{content:'';position:absolute;left:9px;right:9px;bottom:-1px;height:2px;
  border-radius:2px;background:var(--brand-grad,linear-gradient(90deg,var(--acc),var(--acc2)))}
/* Subnav: gleiche Fläche wie der Header (s1) → liest sich als zweite Tab-Ebene */
#subnav{display:none;gap:2px;flex-wrap:wrap;padding:0 var(--sp-4);background:var(--bar);
  border-bottom:1px solid var(--line)}
#subnav.show{display:flex}
#subnav a{position:relative;color:var(--mut);text-decoration:none;font-weight:600;
  font-size:var(--t-sm);padding:var(--sp-2) 10px var(--sp-2);white-space:nowrap;transition:color var(--dur-fast)}
#subnav a:hover{color:var(--fg)}
#subnav a.on{color:var(--acc2)}
#subnav a.on::after{content:'';position:absolute;left:8px;right:8px;bottom:0;height:2px;
  border-radius:2px;background:var(--acc2)}
/* v6.1: Live-Mesh (Hub) — Knoten + pulsierende Datenfluss-Linien */
.mesh-diagram{display:flex;align-items:stretch;gap:0;margin:var(--sp-1) 0 10px}
.mesh-master{display:flex;align-items:center;flex:none}
.mesh-box{background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);padding:var(--sp-2) var(--sp-3);min-width:130px}
.mesh-box.master{background:linear-gradient(135deg,#16223a,var(--s2));border-color:#2a3b5e}
.mesh-name{font-weight:700;font-size:var(--t-base);display:flex;align-items:center;gap:6px}
.mesh-meta{font-size:var(--t-cap);margin-top:1px}
.mesh-stats{display:flex;gap:10px;font-size:var(--t-cap);margin-top:var(--sp-1);font-variant-numeric:tabular-nums}
.mesh-nodes{display:flex;flex-direction:column;gap:var(--sp-2);flex:1;min-width:0}
.mesh-node{display:flex;align-items:center;min-width:0}
.mesh-node .mesh-box{opacity:.75}
.mesh-node.on .mesh-box{opacity:1}
.mesh-wire{position:relative;flex:0 0 56px;height:2px;background:var(--line);margin:0 2px;border-radius:2px}
.mesh-wire i{display:none;position:absolute;top:-2.5px;left:0;width:7px;height:7px;border-radius:50%;background:var(--acc2);box-shadow:0 0 8px var(--acc2)}
.mesh-wire.live{background:#2a3b5e}
.mesh-wire.live i{display:block;animation:meshflow 1.4s linear infinite}
@keyframes meshflow{0%{left:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:calc(100% - 7px);opacity:0}}
.mesh-events{border-top:1px solid var(--line);padding-top:var(--sp-2);display:flex;flex-direction:column;gap:3px;max-height:150px;overflow:auto}
.mesh-ev{font-size:var(--t-sm);font-variant-numeric:tabular-nums}
.mesh-tag{font-weight:600}
.mesh-tag.up{color:var(--acc2)}
.mesh-tag.down{color:var(--okf)}
.mesh-tag.upd{color:#e8cf8a}
.mesh-tag.chat{color:var(--mut)}
@media (max-width:720px){.mesh-wire{flex-basis:22px}.mesh-box{min-width:104px}}
/* v6.0: Rückfragen-Tab */
.q-row{display:flex;gap:10px;align-items:center;padding:var(--sp-2) 0;border-bottom:1px solid var(--line)}
.q-row:last-child{border-bottom:0}
.q-text{flex:1;font-size:var(--t-md);line-height:1.45}
.q-btns{display:flex;gap:6px;flex:none}
.q-btns button{min-width:54px}
.chips{display:flex;gap:var(--sp-1);flex-wrap:wrap;align-items:center}
/* ===== v9 §D.2 .chip-BASIS =================================================
   EINE Pill-Grundform für alle 18 Chip-/Badge-/Pill-Varianten. Die Varianten-
   Regeln weiter unten bleiben als Aliase bestehen (eigene Farben/Paddings
   überschreiben per Kaskade) — aber FORM (Pill), Grundtypo und Inline-Layout
   kommen nur noch von hier. Der .inv-chip-Formwiderspruch (Pill-Label vs.
   eckiger Button) und .ptab-vs-.tg enden: Filter-Toggles app-weit = Pill. */
.chip,.badge,.tag,.trend,.brain-pill,.rowflag,.eu-chip,.inv-chip,.ck-chip,.tchip,
.ptab,.tg,.hstat,.cg-pill,.council-chip,.mv-bucket,.sbx-status,.node-badge,.deal-badge{
  display:inline-flex;align-items:center;gap:var(--sp-1);max-width:100%;
  font-size:var(--t-cap);line-height:1.4;white-space:nowrap;
  border:1px solid transparent;border-radius:var(--r-pill);
  padding:2px var(--sp-2);color:var(--mut)}
/* Modifier (für neue v9-Flächen; bestehende Zustandsklassen ok/warn/bad/on
   der Varianten bleiben unverändert gültig) */
.chip--ok{border-color:rgba(26,169,122,.4);color:var(--okf);background:var(--ok-soft)}
.chip--warn{border-color:rgba(230,159,0,.4);color:var(--warnf);background:var(--warn-soft)}
.chip--bad{border-color:rgba(232,112,58,.4);color:var(--badf);background:var(--bad-soft)}
.chip--acc{border-color:var(--acc-border);color:var(--acc2);background:var(--acc-soft)}
.chip--violet{border-color:rgba(168,85,247,.4);color:var(--violetf);background:var(--violet-soft)}
.chip--interactive{cursor:pointer;transition:border-color var(--dur-fast) var(--ease),
  background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
.chip--interactive:hover{border-color:var(--acc);color:var(--fg)}
.chip--sm{font-size:var(--t-nano);padding:1px var(--sp-2)}
.chip--md{font-size:var(--t-sm);padding:var(--sp-1) var(--sp-3)}
/* v6.1: Chips randlos + leiser (Fläche statt Linie) — Warn-Zustände bleiben farbig */
.chip{background:var(--line)}
.chip.ok{border-color:#1aa97a55;color:var(--okf)}
.chip.bad{border-color:#e8703a55;color:var(--badf)}
.chip.warn{border-color:#e8a13a55;color:var(--warnf)}
.eu-chip{margin-top:3px;font-size:var(--t-cap);font-weight:600;line-height:1.3;
  color:var(--mut);border:1px solid var(--bd);padding:1px 6px;cursor:help}
.eu-chip.fresh{border-color:#1aa97a55;color:var(--okf)}
.eu-chip.pc{border-color:#e0b34155;color:#e8cf8a}      /* v5.0: SOLD-abgeleitet (PriceCharting) */
.eu-chip.pc.fresh{border-color:#e0b341aa}
button{font:inherit;font-size:var(--t-sm);font-weight:600;background:transparent;color:var(--fg);
  border:1px solid var(--bd);border-radius:var(--r-sm);padding:6px var(--sp-3);cursor:pointer;transition:var(--dur-fast);white-space:nowrap}
button:hover{border-color:var(--acc);color:var(--link-hover)}
button.primary{background:#1aa97a1a;border-color:#1aa97a66;color:var(--okf)}
button.amber{background:#e8a13a14;border-color:#e8a13a66;color:var(--warnf)}
/* v7.0: echte Hover-States für primary/amber (vorher hob nur die generische
   button:hover-Regel Rahmen/Farbe an — der Hintergrund blieb tot). */
button.primary:hover{background:#1aa97a30;border-color:#1aa97a;color:#eafff6}
button.amber:hover{background:#e8a13a2b;border-color:#e8a13a;color:#fff4e3}
button.sm{font-size:var(--t-cap);padding:var(--sp-1) var(--sp-2)}
button:active{transform:translateY(1px)}
button:disabled{opacity:.5;cursor:default}
button:focus-visible{outline:2px solid var(--acc);outline-offset:1px}

/* ---- Breadcrumb ---- */
#crumb{flex:0 0 auto;padding:var(--sp-2) var(--sp-5);color:var(--mut);font-size:var(--t-sm);
  border-bottom:1px solid var(--line);background:var(--s1);display:none}
#crumb.show{display:block}
#crumb a{color:var(--acc2);text-decoration:none}
#crumb a:hover{text-decoration:underline}
#crumb .sep{color:var(--mut2);margin:0 var(--sp-2)}

/* ---- Main / Views ---- */
#view{flex:1 1 auto;overflow:auto;padding:var(--sp-5) var(--sp-5) 40px}
.boot{display:flex;flex-direction:column;align-items:center;justify-content:center;height:60vh;color:var(--mut);gap:var(--sp-3)}
@keyframes s{to{transform:rotate(360deg)}}
.spin{width:32px;height:32px;border:3px solid #243047;border-top-color:var(--ok);border-radius:50%;animation:s 1s linear infinite}
/* Legacy-Reiter: #view wird zum Flex-Column, der iframe füllt den Rest exakt
   (kein fester 100vh-Wert → keine Doppel-Scrollbar bei Breadcrumb/Header-Umbruch). */
#view.legacy-mode{display:flex;flex-direction:column;overflow:hidden}
.legacy-frame{width:100%;flex:1 1 auto;min-height:0;border:0;border-radius:var(--r);background:var(--bg)}
.legacy-note{flex:0 0 auto;margin:0 0 var(--sp-3);padding:var(--sp-2) 13px;border:1px solid #2a3b5e;border-radius:var(--r);
  background:#16223a;color:#bcd0f0;font-size:var(--t-base)}

/* KPI band */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--sp-3);margin-bottom:var(--sp-5)}
.kpi{background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4)}
.kpi .k{color:var(--mut);font-size:var(--t-sm);text-transform:uppercase;letter-spacing:.4px}
.kpi .v{font-size:var(--t-2xl);font-weight:800;letter-spacing:-.4px;margin-top:var(--sp-1)}
.kpi .sub{font-size:var(--t-sm);color:var(--mut);margin-top:3px}
.pos{color:var(--up)} .neg{color:var(--down)}

/* sections + cards */
h2.sec{font-size:var(--t-base);text-transform:uppercase;letter-spacing:.6px;color:var(--mut);
  margin:var(--sp-5) 0 10px;font-weight:700}
.grid{display:grid;gap:var(--sp-3)}
.grid.c2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4)}
.card h3{margin:0 0 10px;font-size:var(--t-md);font-weight:700;display:flex;align-items:center;gap:var(--sp-2)}

/* allocation bars */
.bar-row{display:flex;align-items:center;gap:10px;padding:var(--sp-1) 0;cursor:pointer}
.bar-row:hover .bar-name{color:var(--link-hover)}
.bar-name{width:120px;flex-shrink:0;font-size:var(--t-base);font-weight:600}
.bar-track{flex:1;height:9px;background:var(--line);border-radius:6px;overflow:hidden;display:block}
.bar-fill{display:block;height:100%;min-width:3px;background:linear-gradient(90deg,var(--acc),var(--acc2));border-radius:6px;transition:width var(--dur-slow) cubic-bezier(.22,1,.36,1)}
.bar-val{width:96px;text-align:right;font-variant-numeric:tabular-nums;font-size:var(--t-sm);color:var(--mut)}

/* lists */
.row{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-top:1px solid var(--line);font-size:var(--t-base)}
.row:first-child{border-top:0}
.row .l{color:var(--fg)} .row .r{color:var(--mut);font-variant-numeric:tabular-nums}
.tag{font-size:var(--t-cap);padding:1px 6px;border:1px solid var(--bd);color:var(--mut)}

/* tables */
table{width:100%;border-collapse:collapse;font-size:var(--t-base)}
th,td{text-align:left;padding:var(--sp-2) 10px;border-bottom:1px solid var(--line)}
th{color:var(--mut);font-weight:600;font-size:var(--t-sm);text-transform:uppercase;letter-spacing:.3px}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
tr:hover td{background:#16203010}

/* sources matrix */
.srcgrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5)}
@media (max-width:760px){.srcgrid{grid-template-columns:1fr}}
.srccol h3{display:flex;align-items:center;gap:var(--sp-2);justify-content:space-between}
.src{display:flex;align-items:center;gap:10px;padding:var(--sp-2) 0;border-top:1px solid var(--line)}
.src:first-of-type{border-top:0}
.src .nm{flex:1;font-weight:600}
.src .st{font-size:var(--t-cap);color:var(--mut);font-variant-numeric:tabular-nums}
.st.queued{color:var(--warnf)} .st.running{color:var(--acc2)} .st.done{color:var(--okf)} .st.error{color:var(--badf)}

/* panels (health/help) */
.panel{position:fixed;top:50px;z-index:40;width:min(440px,92vw);background:var(--panel);
  border:1px solid var(--bd);border-radius:var(--r);padding:var(--sp-3) var(--sp-4);box-shadow:var(--sh-2);
  display:none;font-size:var(--t-base);line-height:1.5}
#health{left:14px} #help{right:14px}
.panel.show{display:block}
.panel h4{margin:0 0 var(--sp-2);font-size:var(--t-base);display:flex;align-items:center;gap:var(--sp-2)}
.panel .x{margin-left:auto;cursor:pointer;color:var(--mut);border:1px solid var(--bd);border-radius:6px;padding:1px var(--sp-2)}
.panel ul{margin:6px 0 0;padding-left:var(--sp-5)} .panel li{margin:var(--sp-1) 0}
.panel .row .k{color:var(--mut)}

/* toast */
#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#16223a;
  border:1px solid var(--bd);border-radius:var(--r);padding:10px var(--sp-4);color:var(--fg);
  box-shadow:var(--sh-2);opacity:0;transition:var(--dur);pointer-events:none;max-width:80vw;z-index:50;text-align:center}
#toast.show{opacity:1}

/* inventory */
.inv-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:-4px 0 var(--sp-3)}
.inv-search{background:var(--card);border:1px solid var(--bd);border-radius:var(--r-sm);color:var(--fg);
  font:inherit;font-size:var(--t-base);padding:var(--sp-2) 11px;min-width:220px;outline:none}
.inv-search:focus{border-color:var(--acc)}
.inv-chip{gap:6px;font-size:var(--t-sm);color:var(--mut);
  border:1px solid var(--bd);padding:var(--sp-1) 11px;cursor:pointer}
.inv-chip input{accent-color:var(--acc)}
.inv-addform{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin:0 0 var(--sp-3);padding:var(--sp-3);
  background:var(--card);border:1px solid var(--bd);border-radius:var(--r)}
.inv-addform input{background:var(--bg);border:1px solid var(--bd);border-radius:var(--r-sm);color:var(--fg);
  font:inherit;font-size:var(--t-base);padding:var(--sp-2) 10px;outline:none}
.inv-addform input:focus{border-color:var(--acc)}
.inv-input{width:84px;background:var(--bg);border:1px solid #2a3850;border-radius:6px;color:var(--fg);
  font:inherit;font-size:var(--t-sm);padding:var(--sp-1) var(--sp-2);text-align:right;outline:none;font-variant-numeric:tabular-nums}
.inv-input:focus{border-color:var(--acc);background:#0d1726}
.inv-input:disabled{opacity:.5}
tr.inv-group td{background:#0e1726;color:var(--mut);font-weight:700;font-size:var(--t-sm);
  text-transform:uppercase;letter-spacing:.4px;border-top:1px solid var(--bd)}
tfoot td{border-top:2px solid var(--bd);font-size:var(--t-md);padding-top:10px}
.ov{color:var(--acc2);font-size:var(--t-cap);cursor:help}
.acc{color:var(--acc2)}
.badge{font-size:var(--t-cap);padding:2px var(--sp-2);border:1px solid var(--bd);color:var(--mut)}
.badge.ok{border-color:#1aa97a55;color:var(--okf);background:#1aa97a14}
.badge.warn{border-color:#e8a13a55;color:var(--warnf);background:#e8a13a12}
.badge.acc{border-color:#3b82f655;color:var(--acc2);background:#3b82f614}
.badge.mut{color:var(--mut)}
tr.inv-open{cursor:pointer}
tr.inv-open:hover td{background:#16223a55}

/* drill-down: set grid */
.setgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--sp-3)}
.setcard{background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);padding:var(--sp-3);cursor:pointer;transition:var(--dur-fast)}
.setcard:hover{border-color:var(--acc);transform:translateY(-2px)}
.setlogo{height:64px;display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-2)}
.setlogo img{max-height:64px;max-width:100%;object-fit:contain}
.setlogo.big{height:96px;width:200px;flex:0 0 auto}
.setlogo.big img{max-height:96px}
.setname{font-weight:700;font-size:var(--t-md);margin-bottom:var(--sp-2);min-height:34px}
.setmeta{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--sp-2)}
.setrow{display:flex;justify-content:space-between;align-items:center;font-size:var(--t-sm);padding:3px 0;border-top:1px solid var(--line);gap:var(--sp-2)}
.setrow .mut{color:var(--mut)}
.setrow .strend{flex:none;opacity:.9}
.setrow .strend svg.spark{display:block}
.trend{font-size:var(--t-cap);font-weight:700;padding:1px 6px;border:1px solid transparent}
.trend.pos{color:var(--okf);background:#1aa97a14;border-color:#1aa97a55}
.trend.neg{color:var(--badf);background:#e8703a14;border-color:#e8703a55}
.trend.mut{color:var(--mut);background:#8a93a614;border-color:#8a93a633}
.hero-trend .strend, .hero-trend svg.spark{vertical-align:middle}
/* set hero + chase singles */
.sethero{display:flex;gap:var(--sp-5);align-items:center;background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);padding:var(--sp-4);margin-bottom:var(--sp-3);flex-wrap:wrap}
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:var(--sp-3)}
.cardtile{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:var(--sp-3);cursor:pointer;text-align:center;transition:var(--dur-fast)}
.cardtile:hover{border-color:var(--acc);transform:translateY(-2px)}
.cardtile img{width:100%;max-width:172px;border-radius:var(--r);background:#0d1726;aspect-ratio:.72;object-fit:contain}
.ctname{font-size:var(--t-sm);font-weight:600;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctprice{font-size:var(--t-sm);color:var(--okf);font-variant-numeric:tabular-nums}
.prodhero{display:flex;gap:var(--sp-5);align-items:flex-start;flex-wrap:wrap}
.prodimg{width:240px;max-width:100%;border-radius:var(--r-lg);background:#0d1726;border:1px solid var(--bd)}

/* sparkline */
svg.spark{vertical-align:middle}
.empty{color:var(--mut2);font-size:var(--t-base);padding:var(--sp-2) 0}
/* reduced-motion: EIN konsolidierter Block am Dateiende (v8 §7.1) */

/* ---- News (Welle 7) ---- */
.badge.src{border-color:#3b82f655;color:var(--acc2);background:#3b82f610}
.badge.pos{border-color:#1aa97a55;color:var(--okf);background:#1aa97a14}
.badge.neg{border-color:#e8703a55;color:var(--badf);background:#e8703a14}
.badge.neu{color:var(--mut)}
.badge.new{border-color:#60a5fa;color:#d6e4ff;background:#3b82f630;font-weight:700;letter-spacing:.3px}
.chip.pos{border-color:#1aa97a55;color:var(--okf)}
.chip.neg{border-color:#e8703a55;color:var(--badf)}
.chip.neu{color:var(--mut)}
.chip-n{display:inline-block;margin-left:6px;padding:0 var(--sp-1);border-radius:var(--r-sm);background:#ffffff14;color:var(--mut);font-size:var(--t-nano);font-variant-numeric:tabular-nums}
.pol{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--mut2);flex:0 0 auto}
.pol.pos{background:var(--up)} .pol.neg{background:var(--down)} .pol.mut{background:var(--mut2)}

.sentbands{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--sp-3);margin-bottom:6px}
.sentband{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:var(--sp-3) var(--sp-3)}
.sb-game{font-weight:700;font-size:var(--t-base);margin-bottom:var(--sp-2)}
.sb-bar{height:7px;border-radius:6px;background:#ffffff12;overflow:hidden}
.sb-fill{display:block;height:100%;border-radius:6px;background:var(--mut);transition:width var(--dur-slow) ease}
.sb-fill.pos{background:var(--up)} .sb-fill.neg{background:var(--down)} .sb-fill.neu{background:var(--mut)}
.sb-meta{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-2);margin-top:var(--sp-2);font-size:var(--t-sm)}

.themebar{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:6px}

.news-controls{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin:var(--sp-4) 0 var(--sp-3)}
.ptabs{display:flex;flex-wrap:wrap;gap:6px}
.ptab{background:var(--card);border:1px solid var(--bd);color:var(--mut);padding:var(--sp-1) var(--sp-3);font-size:var(--t-sm);cursor:pointer;transition:var(--dur-fast)}
.ptab:hover{color:var(--fg);border-color:#3b4a63}
.ptab.on{background:#3b82f61f;border-color:var(--acc-border);color:var(--acc2)}
.pt-n{opacity:.7;font-variant-numeric:tabular-nums}
.news-toggles{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tg{background:var(--card);border:1px solid var(--bd);color:var(--mut);padding:var(--sp-1) 11px;font-size:var(--t-sm);cursor:pointer;transition:var(--dur-fast)}
.tg:hover{color:var(--fg)}
.tg.on{background:#3b82f61f;border-color:var(--acc-border);color:var(--acc2)}
.news-game{background:var(--card);border:1px solid var(--bd);color:var(--fg);border-radius:var(--r-sm);padding:var(--sp-1) var(--sp-2);font-size:var(--t-sm)}

.newsfeed{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:var(--sp-3)}
.newscard{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:var(--sp-3) var(--sp-3);display:flex;flex-direction:column;gap:var(--sp-2)}
.newscard.mine{border-left:3px solid var(--acc)}
.nc-head{display:flex;align-items:center;gap:var(--sp-2)}
.nc-spacer{flex:1}
.nc-eng{font-size:var(--t-sm);font-variant-numeric:tabular-nums}
.nc-text{font-size:var(--t-base);line-height:1.45;color:var(--fg)}
.nc-foot{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-2);font-size:var(--t-sm)}
.nc-set{color:var(--acc2);text-decoration:none;font-weight:600}
.nc-set:hover{text-decoration:underline}
.nc-set-plain{color:var(--mut);font-weight:600}
.nc-link{color:var(--mut);text-decoration:none;white-space:nowrap}
.nc-link:hover{color:var(--fg)}
.nc-hot{font-variant-numeric:tabular-nums}

/* Disclaimer an Signal-Entscheidungspunkten (Welle 8) */
.disclaimer{font-size:var(--t-cap);color:var(--mut2);border-top:1px solid var(--bd);margin-top:var(--sp-4);padding-top:var(--sp-2);line-height:1.5}
.disclaimer b{color:var(--mut)}

/* P8: Inventar-Flags + Filter-Buttons */
button.inv-chip{background:var(--card);border:1px solid var(--bd);color:var(--mut);border-radius:var(--r-pill);padding:var(--sp-1) 10px;font-size:var(--t-sm);cursor:pointer}
button.inv-chip:hover{color:var(--fg)}
button.inv-chip.on{background:#3b82f61f;border-color:var(--acc-border);color:var(--acc2)}
.rowflag{font-size:var(--t-nano);padding:1px 6px;margin-left:6px;border:1px solid var(--bd)}
.rowflag.susp{border-color:#e8703a66;color:var(--badf);background:#e8703a14}
.rowflag.unval{color:var(--mut2)}
.rowflag.corr{border-color:#3b82f655;color:var(--acc2)}

/* P7: Szenario / Was-wäre-wenn */
.scen-presets{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin:0 0 var(--sp-3)}
.scen-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 2px;border-top:1px solid var(--line)}
.scen-row:first-of-type{border-top:0}
.scen-game{flex:0 0 150px;font-size:var(--t-base);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scen-slider{flex:1 1 auto;accent-color:var(--acc);min-width:120px}
.scen-pct{flex:0 0 52px;text-align:right;font-size:var(--t-sm);font-variant-numeric:tabular-nums}
.scen-vals{flex:0 0 200px;text-align:right;font-size:var(--t-sm);font-variant-numeric:tabular-nums}
.sell-pick{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin:0 0 10px}
.sell-pick select{flex:1 1 260px;min-width:200px}
#sellOut .row .r{font-variant-numeric:tabular-nums}

/* P6: „Heute zu tun"-Aktionskarte */
.actions-card .act-row{display:flex;align-items:center;gap:10px;padding:var(--sp-2) 2px;border-top:1px solid var(--line);text-decoration:none;color:var(--fg)}
.actions-card .act-row:first-of-type{border-top:0}
.actions-card a.act-row:hover{background:#ffffff08}
.act-title{font-size:var(--t-base);font-weight:600;white-space:nowrap;max-width:38%;overflow:hidden;text-overflow:ellipsis}
.act-note{flex:1 1 auto;font-size:var(--t-sm);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.act-vk{flex:0 0 auto;font-size:var(--t-sm);font-variant-numeric:tabular-nums;min-width:78px;text-align:right}

/* P6: ⌘K Command-Palette */
#cmdk{position:fixed;inset:0;background:#0008;z-index:80;display:none;align-items:flex-start;justify-content:center}
#cmdk.show{display:flex}
.cmdk-box{margin-top:11vh;width:min(620px,92vw);background:var(--bar);border:1px solid var(--bd);border-radius:var(--r-lg);
  box-shadow:var(--sh-3);overflow:hidden}
.cmdk-box input{width:100%;box-sizing:border-box;background:transparent;border:0;border-bottom:1px solid var(--bd);
  color:var(--fg);font:inherit;font-size:var(--t-lg);padding:var(--sp-4) var(--sp-5);outline:none}
.cmdk-list{max-height:52vh;overflow:auto}
.cmdk-item{display:flex;align-items:center;gap:10px;padding:10px var(--sp-5);cursor:pointer;border-top:1px solid #141c2a}
.cmdk-item.sel,.cmdk-item:hover{background:#3b82f61f}
.cmdk-item .ci-label{flex:1 1 auto;font-size:var(--t-md);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmdk-item .ci-sub{flex:0 0 auto;font-size:var(--t-cap);color:var(--mut)}
.cmdk-empty{padding:var(--sp-4) var(--sp-5);color:var(--mut2);font-size:var(--t-base)}

/* P4/P5: Momentum-Signale je gehaltenem Set + Backtest-Validierung */
.momgrid{display:flex;flex-direction:column;gap:0}
.momrow{display:flex;align-items:center;gap:10px;padding:var(--sp-2) 2px;border-top:1px solid var(--line)}
.momrow:first-child{border-top:0}
.mom-set{flex:1 1 auto;font-size:var(--t-base);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mom-hist{flex:0 0 auto;font-size:var(--t-cap);font-variant-numeric:tabular-nums;min-width:96px;text-align:right;opacity:.85}
.mom-vk{flex:0 0 auto;font-size:var(--t-sm);font-variant-numeric:tabular-nums;min-width:84px;text-align:right}
.bt-note{background:#e8a13a14;border:1px solid #e8a13a55;color:var(--warnf);border-radius:var(--r);
  padding:var(--sp-2) 13px;margin:0 0 11px;font-size:var(--t-sm);line-height:1.5}
.bt-note b{color:#f0c98a}

/* Wert-Ehrlichkeit: Inventar-Coverage-Zeile */
.inv-summary{font-size:var(--t-base);margin:-2px 0 var(--sp-3);color:var(--fg)}
.inv-summary b{font-variant-numeric:tabular-nums}

/* Co-Developer: Notiz-/Feedback-Modus (#bFeedback: Badge-Anker auch nach dem
   Tester-Move in den Header — v8 §1.5) */
#bNote,#bFeedback{position:relative}
#bNote.on{background:#a855f71f;border-color:#a855f7aa;color:#d8b4fe}
.badge-num{position:absolute;top:-6px;right:-6px;min-width:16px;height:16px;padding:0 var(--sp-1);border-radius:var(--r-sm);
  background:#e8703a;color:#fff;font-size:var(--t-nano);font-weight:700;line-height:16px;text-align:center}
body.fb-mode #view, body.fb-mode #crumb{cursor:crosshair}
body.fb-mode #view *:hover{outline:1.5px dashed #a855f7aa;outline-offset:1px}
#notepop{position:fixed;z-index:60;width:320px;background:var(--bar);border:1px solid #a855f7aa;border-radius:var(--r);
  padding:var(--sp-3);box-shadow:var(--sh-3);display:none}
#notepop.show{display:block}
#notepop .np-ctx{font-size:var(--t-cap);color:var(--mut);margin-bottom:var(--sp-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#notepop textarea{width:100%;box-sizing:border-box;background:var(--card);border:1px solid var(--bd);border-radius:var(--r-sm);
  color:var(--fg);font:inherit;font-size:var(--t-base);padding:var(--sp-2);resize:vertical}
#notepop .np-row{display:flex;justify-content:flex-end;gap:var(--sp-2);margin-top:var(--sp-2)}
#notesList .note-item{border:1px solid var(--bd);border-radius:var(--r);padding:10px var(--sp-3);margin-bottom:var(--sp-2);background:var(--card)}
.note-item .ni-note{font-size:var(--t-base);line-height:1.45;white-space:pre-wrap}
.note-item .ni-meta{font-size:var(--t-cap);margin-top:var(--sp-1)}
.note-item .ni-act{display:flex;gap:var(--sp-2);margin-top:var(--sp-2)}
.note-item .ni-act button{font-size:var(--t-sm);padding:3px 10px}

/* Warn-Banner (Welle 9): Inventarquelle nicht ladbar ≠ leer */
.warnbanner{background:#e8703a18;border:1px solid #e8703a66;color:var(--badf);border-radius:var(--r);padding:10px var(--sp-3);margin:0 0 var(--sp-3);font-size:var(--t-base);line-height:1.5}
.warnbanner b{color:#f0a583}
.warnbanner.data-integrity .di-row{display:flex;align-items:center;gap:10px;margin-top:var(--sp-2)}
.warnbanner.data-integrity .di-row span{flex:1}
.warnbanner.data-integrity .di-row button{flex:none}
/* A11y: Fokus-Ring für tastaturbedienbare Karten/Zeilen */
.setcard:focus-visible,.cardtile:focus-visible,.bar-row:focus-visible,tr.inv-open:focus-visible,.prodrow.clk:focus-visible{outline:2px solid var(--acc2);outline-offset:2px}

/* ===== Inventar-Browse (TCG → Set → Produkt) ===== */
.inv-head{display:flex;align-items:center;gap:10px;margin:0 0 var(--sp-2)}
.bfacets{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;margin:2px 0 var(--sp-3)}
.bfacet{display:flex;flex-direction:column;gap:3px;font-size:var(--t-cap);color:var(--mut2)}
.bfacet.grow{flex:1;min-width:160px}
.bfacet span{padding-left:2px;letter-spacing:.02em;text-transform:uppercase;font-size:var(--t-nano)}
.bfacet select,.bfacet input{background:var(--card);border:1px solid var(--bd);color:var(--fg);
  border-radius:var(--r-sm);padding:var(--sp-2) var(--sp-2);font-size:var(--t-sm);min-width:140px}
.bfacet select:focus,.bfacet input:focus{outline:none;border-color:var(--acc)}
.bcrumb{display:block;font-size:var(--t-sm);color:var(--mut);margin:0 0 var(--sp-3)}
.bcrumb a{color:var(--acc2);text-decoration:none;cursor:pointer}
.bcrumb a:hover{text-decoration:underline}
.bcrumb .sep{color:var(--mut2);margin:0 var(--sp-2)}
.bcrumb .cur{color:var(--fg)}
.bhero{height:104px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.bhero img{max-height:104px;max-width:100%;object-fit:contain}
.bhero.big{height:132px}
.bhero.big img{max-height:132px}
/* echte Produktfotos: in eine helle, abgerundete Bühne setzen → wirkt wie Galerie */
.bhero.pic{background:linear-gradient(180deg,#f7f9fc,#e9eef5);border-radius:var(--r);padding:var(--sp-2);border:1px solid var(--bd)}
.bhero.pic img{mix-blend-mode:normal;width:100%;height:100%;object-fit:contain}
/* Spiel-Logo (oberste Ebene): groß, transparent auf dunkler Karte */
.bhero.logo{height:132px}
.bhero.logo img{max-height:132px;width:100%;object-fit:contain;border-radius:var(--r)}
.bhero.ph{border-radius:var(--r);background:linear-gradient(160deg,color-mix(in srgb,var(--ac) 26%,var(--card)),var(--card));
  border:1px solid color-mix(in srgb,var(--ac) 40%,var(--bd))}
.bhero.ph span{font-weight:800;font-size:var(--t-2xl);letter-spacing:.04em;color:color-mix(in srgb,var(--ac) 75%,var(--fg))}
.bhero.langtile span.langflag{font-size:58px;line-height:1;filter:drop-shadow(0 2px 6px rgba(0,0,0,.4))}
.bhero.big.ph span{font-size:var(--t-2xl)}
.bcard .setname{min-height:38px}
.banalyse{color:var(--acc2);text-decoration:none;font-size:var(--t-sm)}
.banalyse:hover{text-decoration:underline}
/* Produkt-Liste (L3) — nach Typ gruppiert */
.prodgroup{display:flex;justify-content:space-between;align-items:baseline;margin:var(--sp-4) 0 var(--sp-2);
  font-size:var(--t-sm);font-weight:700;color:var(--mut);text-transform:uppercase;letter-spacing:.04em;
  border-bottom:1px solid var(--bd);padding-bottom:var(--sp-1)}
.prodgroup span:last-child{font-variant-numeric:tabular-nums;color:var(--fg)}
.prodlist{display:flex;flex-direction:column;gap:var(--sp-2)}
.prodrow{display:flex;align-items:center;gap:var(--sp-3);background:var(--card);border:1px solid var(--bd);
  border-radius:var(--r);padding:10px var(--sp-3)}
/* v8 §5.2 (F3): Thumbs 42×60 → 56×78 — Produkt erkennbar ohne Klick */
.prodrow .bhero{height:56px;width:78px;flex:0 0 auto;margin:0}
.prodrow .bhero img{max-height:56px}
.prodrow .bhero.ph{height:56px;width:78px}
.prodrow .bhero.ph span{font-size:var(--t-lg)}
.prodrow.clk{cursor:pointer;transition:var(--dur-fast)}
.prodrow.clk:hover{border-color:var(--acc)}
.pr-main{flex:1;min-width:0}
.pr-title{font-size:var(--t-base);font-weight:600;margin-bottom:3px}
.pr-tags{font-size:var(--t-sm);color:var(--mut);display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.pr-vals{text-align:right;flex:0 0 auto}
.pr-w{font-weight:700;font-variant-numeric:tabular-nums}
.pr-pnl{font-size:var(--t-sm);font-variant-numeric:tabular-nums}
.prodfoot{display:flex;align-items:center;gap:var(--sp-3);margin-top:var(--sp-3);padding-top:10px;border-top:1px solid var(--bd);
  font-size:var(--t-sm);color:var(--mut);font-variant-numeric:tabular-nums}
.prodfoot .grow,.inv-head .grow{flex:1}
/* Rechnungs-Verknüpfung: Kandidaten-Picker */
.lp-row td{background:#0c1320;border-top:none}
.linkpick{display:flex;flex-wrap:wrap;gap:6px;padding:var(--sp-1) 0}
.linkpick button{text-align:left;max-width:100%}
/* Equity-Curve (Wert-Entwicklung + TCGC-Index) */
.equity-card h3{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.eq-ctl{display:inline-flex;gap:var(--sp-1)}
.eq-head{display:flex;align-items:baseline;gap:var(--sp-3);margin:2px 0 6px}
.eq-head b{font-size:var(--t-xl);letter-spacing:-.3px}
.eq-legend{font-size:var(--t-sm);color:var(--mut);display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.eq-k{width:14px;height:3px;border-radius:2px;display:inline-block}
.eq-port-k{background:var(--acc)}
.eq-idx-k{background:var(--mut2)}
.eq-svg{width:100%;height:200px;display:block}
.eq-grid{stroke:#1e2a40;stroke-width:1}
.eq-axt{fill:var(--mut2);font-size:var(--t-nano)}
.eq-port{fill:none;stroke:var(--acc);stroke-width:2;vector-effect:non-scaling-stroke}
/* v8.0 Datenpunkte auf allen Kurven — Hover zeigt Datum + €/$ (native title) */
.eq-dot{fill:var(--acc2);opacity:.5;cursor:crosshair;transition:opacity var(--dur-fast)}
.eq-dot:hover{opacity:1}
.eq-idx{fill:none;stroke:var(--mut2);stroke-width:1.5;stroke-dasharray:4 3;vector-effect:non-scaling-stroke}
.eq-benchrow{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-2)}
.eq-bench{font-size:var(--t-sm)}
.eq-note{font-size:var(--t-cap);margin-top:var(--sp-2);font-style:italic}
.perf-basis{font-size:var(--t-cap);font-style:italic;margin-left:6px}
.kpi .v.ok{color:var(--okf)} .kpi .v.warn{color:var(--warnf)} .kpi .v.bad{color:var(--badf)}
.kindrow{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.kindbtn{white-space:nowrap}
.inv-create{margin:0 0 6px;padding:10px var(--sp-3);border:1px solid var(--bd);border-radius:var(--r);background:#0d1526}
.inv-prodfind{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.beleg-panel{margin:0 0 var(--sp-3)}
.beleg-view{margin-top:var(--sp-2)}
.beleg-frame{width:100%;height:72vh;border:1px solid var(--bd);border-radius:var(--r);background:#fff}
a.linklike{color:var(--acc2);text-decoration:none;font-size:var(--t-cap);padding:var(--sp-1) var(--sp-2)}
.badge.bad{border-color:#e8703a66;color:var(--badf);background:#e8703a16}
.inv-import{margin:0 0 var(--sp-3)}
.inv-import input[type=file]{font-size:var(--t-sm);color:var(--mut);max-width:260px}
.inv-imp-row{gap:10px}
.inv-imp-row .l{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.inv-imp-row select.impkind{padding:2px 6px}
.today-card{border-left:3px solid var(--warn);background:linear-gradient(90deg,#e69f000a,transparent)}
.today-card .today-row .l{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.today-card .today-row{border-top:1px solid var(--line);padding:var(--sp-2) 2px}
.today-card .today-row:first-of-type{border-top:0}
code{background:#0c1320;border:1px solid var(--bd);border-radius:4px;padding:1px var(--sp-1);font-size:var(--t-cap)}

/* ============================ Brain — ML-Engine ============================ */
.inp{background:var(--bg);border:1px solid var(--bd);border-radius:var(--r-sm);color:var(--fg);padding:6px var(--sp-2);font-size:var(--t-sm);font-family:inherit}
.inp:focus{border-color:var(--acc);outline:none}
/* v8 §1.4: .brain-subnav entfernt — Brain-Subs leben im globalen #subnav (renderNav) */
.gap-row{align-items:flex-start}
/* Intelligenz-Index */
.brain-iq .iq-big{font-size:var(--t-hero);font-weight:800;line-height:1;letter-spacing:-1px}
.brain-iq .iq-big.ok{color:var(--okf)} .brain-iq .iq-big.warn{color:var(--warnf)}
.brain-iq .iq-big .mut{font-size:var(--t-lg);font-weight:600}
/* Konfidenz-Balken */
.confbar{display:inline-block;width:120px;height:8px;border-radius:5px;background:var(--line);overflow:hidden;vertical-align:middle;margin-left:6px}
.confill{display:block;height:100%}
.confill.ok{background:var(--okf)} .confill.warn{background:var(--warnf)} .confill.bad{background:var(--badf)}
/* Reliability-Histogramm */
.relhist{display:flex;gap:var(--sp-1);align-items:flex-end;height:54px}
.relbar{flex:1;background:#141d2e;border-radius:3px 3px 0 0;display:flex;align-items:flex-end;height:100%}
.relbar>span{display:block;width:100%;background:var(--acc2);border-radius:3px 3px 0 0;min-height:2px}
/* Cone-Chart */
.cone-svg{width:100%;height:auto;display:block}
.cone-zero{stroke:#3a4459;stroke-width:1;stroke-dasharray:3 3}
.cone-b90 polygon{fill:var(--acc2);opacity:.13;stroke:none}
.cone-b50 polygon{fill:var(--acc2);opacity:.26;stroke:none}
.cone-med polyline{fill:none;stroke:var(--acc2);stroke-width:2}
.cone-dot{fill:var(--acc2)}
.cone-one{padding:var(--sp-5) var(--sp-1);font-size:var(--t-base)}
/* Empfehlungs-Karten */
.rec-card{border-left:3px solid var(--bd)}
.rec-card.rec-buy{border-left-color:var(--okf)} .rec-card.rec-sell{border-left-color:var(--badf)}
.rec-card.rec-watch{border-left-color:var(--warnf)}
.rec-top{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.rec-name{font-weight:700;font-size:var(--t-md)}
.rec-qty{margin-left:auto;font-size:var(--t-xl)} .rec-qty b{font-size:var(--t-2xl)}
.rec-meta{font-size:var(--t-sm);margin:var(--sp-1) 0}
.rec-conf{font-size:var(--t-sm);margin:var(--sp-1) 0 6px}
.rec-rat{margin:6px 0 var(--sp-2);padding-left:var(--sp-5);font-size:var(--t-sm);color:var(--mut)} .rec-rat li{margin:2px 0}
.rec-act{display:flex;gap:var(--sp-2);align-items:center}
.rec-act a{text-decoration:none}
/* Prognose-Grid */
.fc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--sp-3)}
.fc-card{cursor:pointer;transition:border-color var(--dur-fast)}
.fc-card:hover{border-color:var(--acc)}
.fc-top{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:3px}
.fc-name{font-weight:700;font-size:var(--t-md)}
.fc-band{font-size:var(--t-base);margin-top:6px}
/* Forensik */
.anom-card{border-left:3px solid var(--bd)} .anom-card.anom-warn{border-left-color:var(--warnf)}
.anom-top{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:3px}
.anom-name{font-weight:700;font-size:var(--t-md)} .anom-conf{margin-left:auto}
/* Feedback + Einstellungen */
.fb-form{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center}
.set-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--sp-3)}
.set-grid label{display:flex;flex-direction:column;gap:var(--sp-1);font-size:var(--t-sm);color:var(--mut)}
.anom-act{margin-top:var(--sp-2)}
/* Daten-Akquise (Prozess-Seite) */
.acq-growth{margin:var(--sp-1) 0}
.acq-vw{display:inline-block;width:90px;height:7px;border-radius:5px;background:var(--line);overflow:hidden;vertical-align:middle}
.acq-vw>span{display:block;height:100%;background:var(--acc2)}
.acq-btns{display:flex;gap:var(--sp-2);flex-wrap:wrap}
/* PokeCenter — Ära-Gruppen + Karten-Tabelle (Roh/PSA9/PSA10) */
.poke-sec{margin:var(--sp-5) 0 6px;font-size:var(--t-lg)}
.era-h{margin:var(--sp-3) 0 6px;font-size:var(--t-sm);color:var(--mut);border-bottom:1px solid var(--bd);padding-bottom:3px}
.spec-dot{font-size:var(--t-sm)}
.pc-table{display:flex;flex-direction:column;gap:6px}
.pc-row{display:grid;grid-template-columns:100px minmax(150px,1.5fr) repeat(3,minmax(70px,.7fr)) minmax(104px,1.05fr);gap:var(--sp-3);align-items:center;
  background:var(--card);border:1px solid var(--bd);border-radius:var(--r-sm);padding:var(--sp-2) var(--sp-3);cursor:pointer;transition:border-color var(--dur-fast)}
.pc-row:hover{border-color:var(--acc)}
/* v4.1: Kartenbilder in der Set-Übersicht DEUTLICH größer (40×56 → 92×129)
   + sanfter Hover-Zoom, damit Details ohne Klick erkennbar sind. */
.pc-thumb{width:92px;height:129px;object-fit:contain;border-radius:var(--r-sm);background:#0c1320;
  transition:transform var(--dur-fast) ease;transform-origin:left center}
.pc-row:hover .pc-thumb{transform:scale(1.7);box-shadow:var(--sh-2);position:relative;z-index:5}
.pc-id b{font-size:var(--t-md)}
.pc-val{text-align:right}
.pc-lbl{font-size:var(--t-nano);color:var(--mut);text-transform:uppercase;letter-spacing:.3px}
.pc-num{font-size:var(--t-md);font-weight:600}
.pc-sub{font-size:var(--t-cap);font-weight:600;margin-top:1px;letter-spacing:.1px}
.pc-grade-cell .pc-lbl{color:var(--acc2)}
@media (max-width:720px){.pc-row{grid-template-columns:72px 1fr repeat(3,minmax(56px,1fr));}.pc-row .pc-val:nth-child(6){display:none}
  .pc-thumb{width:64px;height:90px}.pc-row:hover .pc-thumb{transform:none;box-shadow:none}}
/* Prozess-Tiefe: Level, gewichtete Sub-Balken, Faktor-Kuchen, Datenarten */
.iq-lvl{font-size:var(--t-base);margin:2px 0 2px;color:var(--fg)}
.iq-sub{margin:var(--sp-2) 0}
.iq-sub-h{display:flex;justify-content:space-between;font-size:var(--t-sm);margin-bottom:3px}
.iq-bar{height:7px;border-radius:5px;background:var(--line);overflow:hidden}
.iq-bar>span{display:block;height:100%;background:var(--acc2)}
.donut{width:170px;height:170px;display:block}
.kuchen{display:flex;gap:var(--sp-4);align-items:center;flex-wrap:wrap}
.kuchen-leg{flex:1;min-width:200px;font-size:var(--t-sm)}
.kuchen-leg .dot{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px;vertical-align:middle}
.dart{margin:var(--sp-2) 0}
.dart-h{display:flex;justify-content:space-between;font-size:var(--t-base)}
.dart-h .r{color:var(--mut);font-size:var(--t-sm)}
.relbar2{height:6px;border-radius:4px;background:var(--line);overflow:hidden;margin:3px 0}
.relbar2>span{display:block;height:100%;background:var(--acc2)}
/* Brain-Karte auf der Übersicht */
.brain-ov{display:flex;gap:var(--sp-5);align-items:center;flex-wrap:wrap}
.brain-ov-iq b{font-size:var(--t-display);font-weight:800;letter-spacing:-1px}
.brain-ov-iq b.ok{color:var(--okf)} .brain-ov-iq b.warn{color:var(--warnf)}
.brain-ov-recs{display:flex;gap:6px;flex-wrap:wrap;flex:1}
.brain-pill{font-size:var(--t-sm);padding:3px var(--sp-2);border:1px solid var(--bd);color:var(--mut)}
.brain-pill.ok{border-color:#1aa97a55;color:var(--okf);background:#1aa97a12}
.brain-pill.bad{border-color:#e8703a66;color:var(--badf);background:#e8703a14}
/* Verkaufs-Cockpit */
.sell-card{border-left:3px solid var(--bd)}
.sell-card.sell-bad{border-left-color:var(--badf)} .sell-card.sell-warn{border-left-color:var(--warnf)}
.sell-top{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.sell-name{font-weight:700;font-size:var(--t-md)}
.sell-meta{font-size:var(--t-sm);margin:var(--sp-1) 0}
.sell-action{font-size:var(--t-base);margin:var(--sp-1) 0}
.sell-rat{margin:6px 0 0;padding-left:var(--sp-5);font-size:var(--t-sm);color:var(--mut)} .sell-rat li{margin:2px 0}

/* ===== Tester-Feedback-Panel ===== */
#feedback{right:14px}
.fb-l{display:block;font-size:var(--t-cap);color:var(--mut);margin:var(--sp-2) 0 3px;font-weight:600}
.fb-in{width:100%;box-sizing:border-box;background:var(--card);border:1px solid var(--bd);border-radius:var(--r-sm);
  color:var(--fg);padding:var(--sp-2) var(--sp-2);font:inherit;font-size:var(--t-base)}
.fb-in:focus{outline:none;border-color:var(--acc2)}
textarea.fb-in{resize:vertical}
.fb-stars{display:flex;gap:var(--sp-1);font-size:var(--t-2xl);cursor:pointer;color:var(--bd);user-select:none}
.fb-stars span.on{color:var(--warn)} .fb-stars span:hover{color:var(--warnf)}
.fb-row{display:flex;gap:var(--sp-2);margin-top:13px;flex-wrap:wrap}
body.tester #bFeedback{background:var(--acc);color:#fff;border-color:var(--acc)}
.sess-box{margin-top:var(--sp-4);padding-top:13px;border-top:1px solid var(--bd)}
#bSessionEnd{background:var(--ok);color:#fff;border-color:var(--ok)}
#sessChip{font-size:var(--t-sm)}

/* ===== Intro / Tour-Overlay ===== */
#intro{position:fixed;inset:0;z-index:120;background:rgba(8,11,16,.80);
  display:flex;align-items:center;justify-content:center;padding:var(--sp-5)}
#intro[hidden]{display:none}
.intro-card{width:min(560px,94vw);background:var(--panel);border:1px solid var(--bd);border-radius:var(--r-lg);
  padding:var(--sp-6) 28px var(--sp-5);box-shadow:var(--sh-3);text-align:center;animation:introIn var(--dur) ease}
@keyframes introIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.intro-prog{display:flex;gap:6px;justify-content:center;margin-bottom:var(--sp-3)}
.intro-prog i{width:7px;height:7px;border-radius:50%;background:var(--bd);transition:background var(--dur)}
.intro-prog i.on{background:var(--acc2)} .intro-prog i.done{background:var(--ok)}
.intro-emoji{font-size:var(--t-hero);line-height:1;margin-bottom:6px}
.intro-card h3{margin:0 0 10px;font-size:var(--t-xl)}
.intro-body{font-size:var(--t-md);line-height:1.6;color:var(--fg);text-align:left;max-height:48vh;overflow:auto}
.intro-body b{color:var(--acc2)}
.intro-body ul{margin:var(--sp-2) 0;padding-left:var(--sp-5)} .intro-body li{margin:var(--sp-1) 0}
.intro-body .tip{color:var(--mut);font-size:var(--t-sm);margin-top:10px}
.intro-nav{display:flex;align-items:center;gap:var(--sp-2);margin-top:var(--sp-5)}
.intro-nav .grow{flex:1}
button.ghost{background:transparent;border:1px solid var(--bd);color:var(--mut)}
button.ghost:hover{color:var(--fg);background:var(--line)}

/* ===== Entscheidungs-Cockpit „Heute — Was tun?" ===== */
.cockpit{margin:0 0 var(--sp-4)}
.cockpit.card{border:1px solid #3b82f64d;background:#3b82f60a}
.cockpit h3{margin:0 0 10px}
.ck-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
.ck-col{min-width:0}
.ck-h{font-size:var(--t-sm);font-weight:700;letter-spacing:.2px;margin-bottom:6px;padding-bottom:var(--sp-1);border-bottom:1px solid var(--bd)}
.ck-h.ok{color:var(--okf)} .ck-h.sell{color:var(--badf)} .ck-h.warn{color:var(--warnf)}
.ck-row{display:block;text-decoration:none;color:var(--fg);padding:var(--sp-2) var(--sp-2);border-radius:var(--r-sm);margin-bottom:var(--sp-1);background:var(--card);border:1px solid var(--bd)}
.ck-row:hover{border-color:var(--acc)}
.ck-main{display:block;font-size:var(--t-base)}
.ck-num{display:block;font-size:var(--t-sm);font-weight:600;margin-top:2px}
.ck-why{display:block;font-size:var(--t-cap);line-height:1.35;margin-top:2px}
.ck-empty{font-size:var(--t-sm);padding:var(--sp-2)}
@media (max-width:900px){.ck-cols{grid-template-columns:1fr}}

/* ============================================================================
   v2.0 „Living Terminal" — Puls-Ticker, Feed, Sandbox, Council, Skeletons
   ========================================================================== */

/* Live-Ticker (Header-Unterkante): die jüngsten Feed-Ereignisse laufen durch */
#ticker{flex:0 0 auto;min-height:27px;display:none;align-items:center;gap:10px;background:var(--s0);
  border-bottom:1px solid var(--line);padding:var(--sp-1) var(--sp-4);font-size:var(--t-sm);
  color:var(--mut);overflow:hidden;white-space:nowrap}
#ticker.show{display:flex}
#ticker .tk-label{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;
  font-weight:700;color:var(--acc2);font-size:var(--t-cap);letter-spacing:.4px}
#ticker .tk-dot{width:7px;height:7px;border-radius:50%;background:var(--acc);animation:beat 2s ease-out infinite}
#ticker .tk-items{flex:1 1 auto;overflow:hidden;position:relative;height:18px}
#ticker .tk-item{position:absolute;inset:0;display:flex;align-items:center;gap:var(--sp-2);
  opacity:0;transform:translateY(8px);transition:opacity var(--dur-slow) var(--ease),transform var(--dur-slow) var(--ease)}
#ticker .tk-item.on{opacity:1;transform:none}
#ticker .tk-item .t-ts{color:var(--mut2);font-variant-numeric:tabular-nums;flex:0 0 auto}
#ticker .tk-item .t-title{overflow:hidden;text-overflow:ellipsis}
#ticker .tk-item.ok .t-title{color:var(--okf)}
#ticker .tk-item.warn .t-title{color:var(--warnf)}
#ticker .tk-item.bad .t-title{color:var(--badf)}
#ticker a{color:inherit;text-decoration:none}
#ticker a:hover{color:var(--fg)}

/* Skeleton-Shimmer (ersetzt „lädt…"-Texte) */
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.skel{border-radius:var(--r);background:linear-gradient(90deg,var(--s2) 25%,var(--s3) 37%,var(--s2) 63%);
  background-size:400% 100%;animation:shimmer 1.4s linear infinite}
.skel.sk-line{height:13px;margin:var(--sp-2) 0}
.skel.sk-kpi{height:74px}
.skel.sk-card{height:120px}
.skel.sk-row{height:40px;margin:6px 0}

/* View-Einblendung: Inhalte steigen sanft ein (lebendig, nicht hektisch) */
@keyframes riseIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
#view>.vwrap{animation:riseIn var(--dur) var(--ease)}

/* Feed-Seite (#/puls) */
.feedwrap{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:var(--sp-3)}
@media (max-width:980px){.feedwrap{grid-template-columns:1fr}}
.fstream{display:flex;flex-direction:column;gap:6px}
.fevent{display:flex;align-items:flex-start;gap:10px;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r);padding:var(--sp-2) var(--sp-3);animation:riseIn var(--dur) var(--ease)}
.fevent .fe-ico{flex:0 0 22px;text-align:center;font-size:var(--t-md);line-height:1.5}
.fevent .fe-main{flex:1;min-width:0}
.fevent .fe-title{font-size:var(--t-base);font-weight:600}
.fevent.ok .fe-title{color:var(--okf)}
.fevent.warn .fe-title{color:var(--warnf)}
.fevent.bad .fe-title{color:var(--badf)}
.fevent .fe-detail{font-size:var(--t-sm);color:var(--mut);margin-top:1px;overflow-wrap:anywhere}
.fevent .fe-meta{flex:0 0 auto;text-align:right;font-size:var(--t-cap);color:var(--mut2);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.fevent .fe-src{display:block;color:var(--mut)}
.ffilters{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 var(--sp-3)}
.fstat-row{display:flex;justify-content:space-between;gap:var(--sp-2);padding:var(--sp-1) 0;
  border-top:1px solid var(--line);font-size:var(--t-sm)}
.fstat-row:first-of-type{border-top:0}
.fstat-row .n{font-variant-numeric:tabular-nums;color:var(--fg);font-weight:600}
.flivebadge{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-cap);
  color:var(--okf);border:1px solid rgba(26,169,122,.33);border-radius:var(--r-pill);
  padding:2px 10px;background:var(--ok-soft)}
.flivebadge .tk-dot{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:beat 2s ease-out infinite}

/* Council — daily_note lebt NUR noch im Hero (#heroRead, v8 §3.6); .council-note entfiel */
.council-games{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.cg-pill{gap:var(--sp-2);font-size:var(--t-sm);
  border:1px solid var(--line);padding:var(--sp-1) var(--sp-3);color:var(--mut)}
.cg-pill b{color:var(--fg)}
.cg-pill .st-bullish{color:var(--okf)} .cg-pill .st-bearish{color:var(--badf)}
.cg-pill .st-neutral{color:var(--mut)}
.cg-agree{font-size:var(--t-nano);color:var(--mut2);font-variant-numeric:tabular-nums}
.council-chip{padding:2px var(--sp-2);border:1px solid var(--line);color:var(--mut)}
.council-chip.ja{border-color:rgba(26,169,122,.4);color:var(--okf);background:var(--ok-soft)}
.council-chip.nein{border-color:rgba(232,112,58,.4);color:var(--badf);background:var(--bad-soft)}
.council-chip.unsicher{border-color:rgba(230,159,0,.4);color:var(--warnf);background:var(--warn-soft)}

/* Sandbox (#/sandbox) */
.sbx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:var(--sp-3)}
.sbx-card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);
  padding:var(--sp-3) var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2);animation:riseIn var(--dur) var(--ease)}
.sbx-top{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.sbx-title{font-weight:700;font-size:var(--t-md)}
.sbx-status{padding:2px var(--sp-2);border:1px solid var(--line);color:var(--mut)}
.sbx-status.active{border-color:rgba(59,130,246,.4);color:var(--acc2);background:var(--acc-soft)}
.sbx-status.idea{border-color:rgba(168,85,247,.4);color:var(--violetf);background:var(--violet-soft)}
.sbx-status.promoted{border-color:rgba(26,169,122,.4);color:var(--okf);background:var(--ok-soft)}
.sbx-status.rejected{border-color:rgba(232,112,58,.4);color:var(--badf);background:var(--bad-soft)}
.sbx-status.done{border-color:rgba(26,169,122,.4);color:var(--okf)}
.sbx-hyp{font-size:var(--t-sm);color:var(--mut);line-height:1.5}
.sbx-verdict{font-size:var(--t-base);line-height:1.5;border-left:3px solid var(--acc);
  background:var(--acc-soft);border-radius:var(--r-sm);padding:var(--sp-2) 11px}
.sbx-metrics{font-size:var(--t-sm);color:var(--mut);font-variant-numeric:tabular-nums}
.sbx-act{display:flex;gap:var(--sp-2);align-items:center;margin-top:2px;flex-wrap:wrap}
.sbx-origin{font-size:var(--t-nano);color:var(--mut2);margin-left:auto}
.sbx-fb{background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4)}
.sbx-fb textarea{width:100%;box-sizing:border-box;background:var(--s0);border:1px solid var(--bd);
  border-radius:var(--r-sm);color:var(--fg);font:inherit;font-size:var(--t-base);padding:var(--sp-2) 11px;resize:vertical}
.sbx-fb textarea:focus{outline:none;border-color:var(--acc)}
.sbx-fb-item{border-top:1px solid var(--line);padding:var(--sp-2) 0;font-size:var(--t-sm)}
.sbx-fb-item:first-of-type{border-top:0}
.sbx-fb-item .who{color:var(--violetf);font-weight:600;margin-right:6px}

/* Autonomie-Protokoll */
.auto-row{display:flex;align-items:center;gap:10px;padding:6px 0;border-top:1px solid var(--line);font-size:var(--t-sm)}
.auto-row:first-of-type{border-top:0}
.auto-act{flex:0 0 auto;font-weight:600;color:var(--acc2)}
.auto-act.skip{color:var(--mut2)}
.auto-tgt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auto-ts{flex:0 0 auto;color:var(--mut2);font-variant-numeric:tabular-nums;font-size:var(--t-cap)}

/* Bewegung reduzieren → EIN konsolidierter Block am Dateiende (v8 §7.1) */

/* View-Wechsel: nur Opacity (kein Transform auf dem Scroll-Container) */
@keyframes fadeView{from{opacity:.4}to{opacity:1}}
#view.anim{animation:fadeView var(--dur) var(--ease)}

/* ===== v3.0 Mesh: Node-Badge, Login, Hub ===== */
.node-badge{font-size:var(--t-nano);font-weight:800;letter-spacing:.6px;text-decoration:none;
  padding:3px var(--sp-2);flex-shrink:0}
.node-badge.master{color:var(--okf);background:var(--ok-soft);border:1px solid rgba(26,169,122,.35)}
.node-badge.side{color:var(--acc2);background:var(--acc-soft);border:1px solid rgba(59,130,246,.35)}
/* v8.1 Standalone: dezentes LOKAL-Badge (neutral, kein Alarm — bewusster Modus) */
.node-badge.standalone{color:var(--mut);background:var(--s2);border:1px solid var(--line)}
/* v8.1 Erst-Start-Wahl: zwei große, freundliche Modus-Knöpfe */
.choice-btn{display:block;width:100%;text-align:left;margin-top:10px;padding:var(--sp-3) var(--sp-3);
  border-radius:var(--r);font-size:var(--t-base);font-weight:600;cursor:pointer}
.choice-btn .mut{display:block;font-weight:400;font-size:var(--t-cap);margin-top:2px}
.choice-btn:not(.primary){background:var(--s2);border:1px solid var(--line);color:var(--fg)}
.choice-btn:not(.primary):hover{background:var(--s3)}
.login-wrap{display:flex;align-items:center;justify-content:center;min-height:70vh}
.login-card{width:min(420px,92vw);background:var(--card);border:1px solid var(--bd);
  border-radius:var(--r-lg);padding:28px 30px;box-shadow:var(--sh-3);
  animation:riseIn var(--dur) var(--ease)}
.login-logo{font-size:var(--t-hero);line-height:1;margin-bottom:var(--sp-2)}
.login-card h2{margin:0 0 6px;font-size:var(--t-xl)}
.pres-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--mut2);
  margin-right:var(--sp-2);vertical-align:middle}
.pres-dot.on{background:var(--ok);box-shadow:0 0 0 3px var(--ok-soft)}
.hub-chat{display:flex;flex-direction:column;min-height:380px}
.hub-msgs{flex:1;overflow:auto;max-height:46vh;display:flex;flex-direction:column;gap:var(--sp-2);
  padding:6px 2px;margin-bottom:10px}
.hub-msg{max-width:86%;background:var(--s3);border:1px solid var(--line);
  border-radius:var(--r) var(--r) var(--r) 4px;padding:var(--sp-2) 11px;font-size:var(--t-base)}
.hub-msg.mine{align-self:flex-end;background:var(--acc-soft);border-color:rgba(59,130,246,.3);
  border-radius:var(--r) var(--r) 4px var(--r)}
.hub-msg.claude{border-color:rgba(168,85,247,.45);background:var(--violet-soft)}
.hub-msg .hm-who{display:block;font-size:var(--t-nano);font-weight:700;color:var(--mut);margin-bottom:2px}
.hub-msg .hm-text{display:block;line-height:1.45;overflow-wrap:anywhere}
.hub-msg .hm-ts{display:block;font-size:var(--t-nano);color:var(--mut2);margin-top:3px;text-align:right}
.hub-send{display:flex;gap:var(--sp-2);align-items:center}
.hub-send .fb-in{flex:1}

/* ===== v4.0 Market-Movers ===== */
.mv-winsel{display:inline-flex;gap:var(--sp-1)}
.mv-buckets{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 var(--sp-3)}
.mv-bucket{color:var(--mut);border:1px solid var(--line);
  padding:2px 10px;background:var(--s2)}
.mv-bucket b{color:var(--fg);margin-left:2px}
.mv-row{display:flex;align-items:center;gap:10px;padding:var(--sp-2) var(--sp-1);border-top:1px solid var(--line);
  text-decoration:none;color:var(--fg);transition:background var(--dur-fast)}
.mv-row:first-of-type{border-top:0}
.mv-row:hover{background:var(--acc-soft)}
.mv-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--t-base)}
.mv-ret{flex:0 0 auto;font-variant-numeric:tabular-nums;font-weight:700;font-size:var(--t-base);min-width:64px;text-align:right}
.mv-impact{flex:0 0 auto;font-variant-numeric:tabular-nums;font-size:var(--t-cap);min-width:96px;text-align:right}
.mv-spark{flex:0 0 auto;width:54px;text-align:right}

/* ===== v4.0 Persoenliche Design-Note ===== */
/* Header-Wortmarke: ACV in Signatur-Gradient, klare Marken-Praesenz */
#brand b#brandName{background:var(--brand-grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;font-weight:800}
.node-badge.master{background:linear-gradient(135deg,rgba(45,212,191,.16),rgba(124,92,255,.16));
  border-color:rgba(124,92,255,.4);color:var(--brand-1)}
/* Signature-Hero auf der Uebersicht */
.hero{position:relative;display:flex;align-items:center;gap:var(--sp-5);overflow:hidden;
  background:linear-gradient(120deg,var(--s2),var(--s1) 60%);border:1px solid var(--bd);
  border-radius:var(--r-lg);padding:var(--sp-5) var(--sp-6);margin:0 0 var(--sp-4);animation:riseIn var(--dur) var(--ease)}
.hero-mark{flex:0 0 auto;filter:drop-shadow(0 6px 18px rgba(124,92,255,.35))}
.brandmark{display:block}
.hero-body{flex:1;min-width:0;z-index:1}
.hero-label{font-size:var(--t-cap);letter-spacing:1.2px;color:var(--mut);font-weight:700}
.hero-value{font-size:var(--t-hero);font-weight:800;letter-spacing:-1px;line-height:1.05;margin:2px 0 var(--sp-1);
  font-variant-numeric:tabular-nums;background:linear-gradient(180deg,var(--fg),#aebbcf);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-meta{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;font-size:var(--t-base)}
.hero-pnl{font-weight:700;font-variant-numeric:tabular-nums}
.hero-read{font-size:var(--t-sm);margin-top:var(--sp-2);line-height:1.5;max-width:70ch;font-style:italic;opacity:.92}
.hero-glow{position:absolute;right:-80px;top:-80px;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(124,92,255,.20),transparent 70%);pointer-events:none}
@media (max-width:560px){.hero-value{font-size:var(--t-2xl)}.hero{padding:var(--sp-4)}}
/* v9 §D.2 Affordance-Ehrlichkeit: Hover-Lift/Border-Aufhellung NUR auf
   interaktiven Selektoren — statische Karten/KPIs bleiben ruhig (vorher
   reagierte JEDE .card/.kpi und log Klickbarkeit vor). */
.card{transition:border-color var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.clk:hover,[data-game]:hover,a.card:hover,.setcard:hover,.cardtile:hover,.fc-card:hover{border-color:var(--line-strong)}
/* gebrandeter Empty-State */
.empty.branded{display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);padding:30px;text-align:center}
.empty.branded .e-mark{opacity:.5}

/* ===== 🌐 Live-Markt (v7.0) — plattformübergreifende Angebote je Produkt ===== */
.lm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:var(--sp-3);margin-top:10px}
.lm-card{padding:var(--sp-3) var(--sp-3)}
.lm-head{display:flex;flex-direction:column;gap:3px;margin-bottom:var(--sp-2);border-bottom:1px solid var(--line);padding-bottom:var(--sp-2)}
.lm-offers{display:flex;flex-direction:column;gap:var(--sp-1)}
.lm-offer{display:flex;align-items:center;gap:var(--sp-2);padding:6px var(--sp-2);border-radius:var(--r-sm);
  background:var(--line);text-decoration:none;color:inherit;transition:background var(--dur-fast),transform var(--dur-fast);
  flex-wrap:wrap;row-gap:var(--sp-1)}
a.lm-offer:hover{background:var(--bar);transform:translateX(2px)}
.lm-plat{font-size:var(--t-sm);min-width:88px;font-weight:600}
.lm-loc{font-size:var(--t-sm);min-width:46px;color:var(--mut)}
.lm-price{font-size:var(--t-base);margin-left:auto;white-space:nowrap}
.lm-go{font-size:var(--t-cap);color:var(--acc2);white-space:nowrap;font-weight:600}
.deal-badge{font-size:var(--t-cap);padding:1px var(--sp-2);font-weight:600}
@media (max-width:720px){.lm-grid{grid-template-columns:1fr}.lm-plat{min-width:74px}}

/* ===== v7.0 Mobile-Pass — Telefon-Breite nutzbar machen ===== */
@media (max-width:640px){
  #chips,#ticker{display:none}                 /* Sekundär-Info: Platz für Inhalt */
  #nav{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  #nav::-webkit-scrollbar{display:none}
  #subnav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  #subnav::-webkit-scrollbar{display:none}
  .grid.c2{grid-template-columns:1fr}
  input,select,textarea{font-size:16px}        /* bewusst hart: iOS-Auto-Zoom-Schwelle, kein Token */
  .hero-value{font-size:var(--t-2xl)}
  #heroSpark{display:none}                     /* v8 §3.1: Hero ohne Sparkline auf Telefon */
  .bar-pnl{display:none}                       /* v8 §3.4: 120+96+84px sprengen 380px */
  table{font-size:var(--t-sm)}
  .vwrap{padding-left:2px;padding-right:2px}
}

/* ===== v7.1.1 Demo-Modus — NUR kritische Werte ausblenden ===== */
/* Politik (Owner): möglichst viel zeigen — verdeckt wird NUR, was eigenen
   €-BESTAND, GEWINN oder EK zeigt/ableitbar macht. Öffentliche Marktpreise
   (PokeCenter, Deals, Live-Markt, Movers-%, Graded, Sprach-Spreads) und
   Stückzahlen bleiben sichtbar. .mny (generischer Geldwert) ist daher NICHT
   mehr pauschal verdeckt — nur .mny-c (eurC()/mnyWrap = kritisch) plus die
   Container, deren Inhalt nicht über eurC() läuft. Verschleiern statt
   entfernen: Layout bleibt stabil. */
body.demo-hide .mny-c,
body.demo-hide #total,
body.demo-hide .hero-value,
body.demo-hide .inv-summary b,
body.demo-hide .mv-impact,                                  /* €-Hebel aufs eigene Portfolio */
body.demo-hide #scenProj, body.demo-hide #scenPnl,
body.demo-hide #scenNet, body.demo-hide #scenDelta,
body.demo-hide .scen-vals,                                  /* Szenario = Portfolio-Projektion */
body.demo-hide .inv-input[data-field="ek"],                 /* EK-Inputs: value erreicht kein .mny-c */
body.demo-hide .inv-input[data-le],
body.demo-hide #sellSet, body.demo-hide #sellOut {          /* Verkaufs-Rechner = Bestand×Preis±EK */
  filter: blur(8px);
  -webkit-filter: blur(8px);
  user-select: none;
  transition: filter var(--dur-fast);
}
body.demo-hide .mny-c:hover { filter: blur(8px); }   /* auch bei Hover verdeckt */
/* iframes: CSS kann nicht in deren Dokumente hinein — das ELEMENT blurren reicht
   (Beleg-PDF mit echten Rechnungssummen, Legacy-Report mit Portfolio-Summen). */
body.demo-hide .beleg-frame { filter: blur(12px); pointer-events: none; }
body.demo-hide iframe.legacy-frame { filter: blur(10px); pointer-events: none; }
/* Fluchtwege schließen: CSV-Download (Klartext-EK/Werte) + Original-PDF in neuem Tab */
body.demo-hide a[href="/api/inventory-export.csv"] { display: none; }
body.demo-hide .beleg-panel a[href*="/api/invoices/"] { display: none; }

/* v7.1 Demo-Knopf — dauerhaft beschriftet + akzentuiert (statt unscheinbarem Emoji);
   AN-Zustand unübersehbar: gefüllter Akzent + Puls + Akzentlinie unter dem Header,
   damit während einer Vorführung IMMER klar ist, dass die Werte verdeckt sind. */
#bDemo { background: var(--acc-soft); border-color: var(--acc); color: var(--acc2); font-weight: 700; }
#bDemo:hover { background: rgba(59,130,246,.24); border-color: var(--acc2); color: #eaf2ff; }
#bDemo.on { background: var(--acc); border-color: var(--acc2); color: #fff;
  animation: demoPulse 2.2s ease-out infinite; }
#bDemo.on:hover { background: var(--acc2); color: #fff; }
@keyframes demoPulse {
  0%   { box-shadow: 0 0 0 0 rgba(59,130,246,.55); }
  70%  { box-shadow: 0 0 0 8px rgba(59,130,246,0); }
  100% { box-shadow: 0 0 0 0 rgba(59,130,246,0); }
}
body.demo-hide #bar { box-shadow: inset 0 -2px 0 var(--acc), 0 2px 14px rgba(0,0,0,.35); }

/* ===== v8.0 Social-Puls + Sold-Chips ===== */
.sp-bars{display:flex;gap:2px;align-items:flex-end;height:46px;margin:6px 0 10px}
.sp-bar{flex:1;min-width:2px;background:var(--acc-soft);border-top:2px solid var(--acc);border-radius:2px 2px 0 0;cursor:crosshair;transition:background var(--dur-fast)}
.sp-bar:hover{background:rgba(59,130,246,.35)}
.sold-chip{border-color:#1aa97a55;color:var(--okf)}

/* v8.0 Topbar-Suche — die ⌘K-Palette sichtbar machen (Tester-Signal) */
.tb-search{display:flex;align-items:center;gap:var(--sp-2);background:#0d1420;border:1px solid var(--bd);
  border-radius:var(--r-pill);padding:var(--sp-1) var(--sp-3);color:var(--mut);font-weight:500;min-width:150px}
.tb-search:hover{border-color:var(--acc);color:var(--fg);background:#101a2a}
.tb-search kbd{font:var(--t-cap) ui-monospace,monospace;border:1px solid var(--bd);border-radius:4px;
  padding:0 var(--sp-1);color:var(--mut2);margin-left:auto}
.tbs-hint{font-size:var(--t-sm)}
@media (max-width:760px){.tb-search{min-width:0}.tbs-hint,.tb-search kbd{display:none}}

/* ============================================================================
   v8 „Elegantes Supertool" — Phase A/B: Icon-System, .seg, Hero-Stats,
   Cockpit-Ampel, Heute-Module (§2, §3, §7 des V8_DESIGN_SPEC)
   ========================================================================== */
/* §2.1 Icons: dezent entsättigt — aber NICHT in Tabellen (Paint-Kosten je
   Stacking-Context bei hunderten Zeilen) */
.ico{display:inline-block;margin-right:var(--sp-1);font-size:.95em}
:not(td):not(th)>.ico{filter:saturate(.85)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}

/* §2.2 Subnav: Icon führt, Label folgt */
#subnav a .sn-txt{margin-left:2px}

/* §7.2 .seg — wiederverwendbare Segmented-Control (Wert-Tabs, Markt-Tabs, eq-Fenster) */
.seg{display:inline-flex;gap:2px;background:var(--s1);border:1px solid var(--line);
  border-radius:var(--r-pill);padding:2px;margin-bottom:var(--sp-2)}
.seg button{border:0;background:transparent;color:var(--mut);font-size:var(--t-sm);
  font-weight:600;padding:var(--sp-1) var(--sp-3);border-radius:var(--r-pill);cursor:pointer}
.seg button.on{background:var(--acc-soft);color:var(--acc2)}
.seg button.mut{opacity:.45}                       /* leeres Pane → Tab gedimmt, klickbar */
.seg button .n{margin-left:var(--sp-1);font-size:var(--t-nano);border-radius:var(--r-pill);
  padding:0 6px;background:var(--line);font-variant-numeric:tabular-nums}
.seg button .n.warn{background:var(--warn-soft);color:var(--warnf)}

/* §3.1 Hero-Stats-Chips + Sparkline */
.hero-stats{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:10px}
.hstat{gap:6px;font-size:var(--t-sm);color:var(--mut);
  background:var(--s1);border:1px solid var(--line);
  padding:var(--sp-1) 11px;text-decoration:none}
.hstat b{color:var(--fg);font-variant-numeric:tabular-nums}
.hstat.ok{border-color:rgba(26,169,122,.33)} .hstat.warn{border-color:rgba(230,159,0,.4)}
#heroSpark{flex:0 0 auto;align-self:center;opacity:.92;z-index:1}

/* §3.2 Cockpit: Ampel-Zeile + CSS-Collapse (alle Zeilen sind gerendert — D5/§8) */
.ck-state{display:flex;gap:var(--sp-2);margin-bottom:10px;flex-wrap:wrap}
.ck-chip{font-weight:700;padding:var(--sp-1) var(--sp-3);border:1px solid var(--bd);
  cursor:pointer;background:var(--s2);color:var(--fg)}
.ck-chip.buy{background:var(--ok-soft);color:var(--okf)}
.ck-chip.sell{background:var(--bad-soft);color:var(--badf)}
.ck-chip.watch{background:var(--warn-soft);color:var(--warnf)}
.ck-chip.none{background:transparent;color:var(--mut)}
/* v9 §B.1-Fix: Sichtbarkeit nach €-Materialität statt Off-by-one (nth-child zählt
   ab .ck-h!). Server-`pinned`-Zeilen (über Materialitäts-Schwelle) sind IMMER offen;
   geclampt werden nur unpinned ab Zeile 4 (= nth-child 5). */
.ck-col:not(.open) .ck-row:not(.pinned):nth-child(n+5){display:none}
.ck-col:not(.open) .ck-why{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ck-more{margin-top:2px}
.ck-colfoot{margin-top:6px;font-size:var(--t-sm)}
.ck-colfoot a{color:var(--acc2);text-decoration:none}
.ck-colfoot a:hover{text-decoration:underline}

/* §3.4 Bestand: P&L-Spalte + Drill-Chevron an der Allokations-Zeile */
.bar-pnl{width:84px;flex-shrink:0;text-align:right;font-variant-numeric:tabular-nums;font-size:var(--t-sm)}
.bar-row{position:relative;padding-right:var(--sp-3)}
.bar-row::after{content:'›';position:absolute;right:0;color:var(--mut2);font-weight:700}
.bar-row:hover::after{color:var(--acc2)}

/* §3.5 Markt heute: Movers-Zweispalter */
.mv2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.mv2-h{font-size:var(--t-sm);font-weight:700;color:var(--mut);text-transform:uppercase;
  letter-spacing:.4px;margin:2px 0 var(--sp-1)}
@media (max-width:720px){.mv2{grid-template-columns:1fr}}

/* §3.3 kopflose Equity-Controls im Kurve-Pane */
.eq-ctl-row{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;margin:0 0 6px}
.eq-ctl-row .seg{margin-bottom:0}

/* §3.6 Intelligenz-Footer (icon-first Querlinks) */
.intel-foot{margin-top:var(--sp-2);font-size:var(--t-sm);display:flex;gap:10px;flex-wrap:wrap}
.intel-foot a{color:var(--acc2);text-decoration:none}
.intel-foot a:hover{text-decoration:underline}

/* §7.3 statische Disclosure (Produktblatt-Listen) — natives <details>; Motion-Utility
   heißt .reveal (D10, Phase-C-Block unten) */
.fold{border:0;margin:var(--sp-3) 0 0}
.fold-h{display:flex;gap:var(--sp-2);align-items:center;cursor:pointer;font-size:var(--t-base);
  text-transform:uppercase;letter-spacing:.6px;color:var(--mut);list-style:none}
.fold-h::-webkit-details-marker{display:none}      /* Safari: sonst Doppel-Pfeil */
.fold-h::before{content:'›';transition:transform var(--dur-fast) var(--ease)}
.fold[open] .fold-h::before{transform:rotate(90deg)}

/* ============================================================================
   v8 Phase C — Navigation, ⋯-Menü, ⌘K, Skelette, Motion (§1.3-§1.5, §4.2-§4.3,
   §7.4-§7.6 des V8_DESIGN_SPEC)
   ========================================================================== */
/* §1.3/§7.5 Waren-Subnav: 4 icon-geführte Gruppen; Sekundär-Einträge (.sec) zeigen
   ihr Label nur aktiv — Mobile (<720px) IMMER (Touch hat keine title-Tooltips) */
#subnav .subdiv{width:1px;height:16px;background:var(--line);margin:0 6px;align-self:center}
#subnav a.sec .sn-txt{display:none}
#subnav a.sec.on .sn-txt{display:inline}
@media (max-width:720px){#subnav a.sec .sn-txt{display:inline}}

/* §1.5 Header: ⋯-Menü (statisches Markup in index.html, IDs unverändert) */
.more-wrap{position:relative;display:inline-flex;flex-shrink:0}
#bMore{position:relative;min-width:38px;font-weight:800;letter-spacing:1px}
#moreMenu{position:absolute;top:calc(100% + 6px);right:0;z-index:45;min-width:176px;
  display:none;flex-direction:column;gap:2px;background:var(--bar);border:1px solid var(--bd);
  border-radius:var(--r);padding:6px;box-shadow:var(--sh-2)}
#moreMenu.show{display:flex}
#moreMenu button{position:relative;display:flex;align-items:center;gap:var(--sp-2);width:100%;
  border:0;background:transparent;text-align:left;padding:var(--sp-2) 10px;border-radius:var(--r-sm)}
#moreMenu button:hover{background:var(--s2);border:0}
#moreMenu .badge-num{position:static;margin-left:auto;flex-shrink:0}
/* Button-Labels weichen auf schmalen Fenstern — NUR direkte Header-Knöpfe,
   Menü-Einträge behalten ihr Label */
@media (max-width:1180px){#bar>button .btn-lbl{display:none}}

/* §4.2 ⌘K: Treffer-Icons (fester Anker vor dem Label) */
.cmdk-item .ci-ico{flex:0 0 22px;text-align:center}

/* §4.3/§7.4 Skeleton-first + Entry-Choreografie */
.skel.sk-hero{height:96px;border-radius:var(--r-lg)}
.sk-ghost{font-size:var(--t-2xl);opacity:.25;margin:2px 0 10px}
.sk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--sp-3)}
#view .card,#view .kpi,#view .setcard,#view .cardtile{
  animation:riseIn var(--dur) var(--ease) backwards;animation-delay:var(--d,0ms)}
/* Browse-Grids: nur die ersten 24 animieren (100+ Compositing-Layer ruckeln) */
.setgrid>:nth-child(n+25){animation:none}

/* §7.6 animierte Disclosure (Beleg-Box, Subnav-Gleiten) — NICHT .fold (D10) */
.reveal{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--dur) var(--ease)}
.reveal.open{grid-template-rows:1fr}
.reveal>*{overflow:hidden;min-height:0}

/* §7.6 Ticker-Crossfade: altes Item gleitet nach oben hinaus, neues kommt von unten;
   .t-ico = fester 18px-Anker fürs Feed-Icon */
#ticker .tk-item.out{opacity:0;transform:translateY(-8px)}
#ticker .tk-item:not(.on){pointer-events:none}     /* unsichtbares Zweit-Item fängt keine Klicks */
#ticker .tk-item .t-ico{flex:0 0 18px;text-align:center}

/* ============================================================================
   v8 Phase D/E — Waren-Browse (Kacheln/Drillbar/Typ-Chips, §5.2/§7.5) +
   Produktblatt-Pyramide (§5.1) + 🛒 Marktplatz-Tracker
   ========================================================================== */
/* §5.2/D8: Kacheln bild-dominant — Bild full-bleed, Wert als .valtag-Overlay */
.bcard{padding:0;overflow:hidden}
.bcard .bhero{height:150px;margin:0;border-radius:var(--r-lg) var(--r-lg) 0 0;position:relative;overflow:hidden}
.bcard .bhero.big{height:150px}
.bcard .bhero.big img{max-height:150px}
.bcard .bhero.logo img,.bcard .bhero.pic img{object-fit:contain}
.bcard .bbody{padding:10px var(--sp-3) var(--sp-3)}
.bcard .setname{margin-bottom:var(--sp-1)}
.bhero{position:relative}
.valtag{position:absolute;top:8px;right:8px;z-index:2;font-weight:700;font-size:var(--t-sm);padding:3px var(--sp-2);
  border-radius:var(--r-pill);background:color-mix(in srgb,var(--bg) 75%,transparent);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--line)}
.tilechips{display:flex;gap:var(--sp-1);flex-wrap:wrap;margin-top:6px;align-items:center}
.tilechips .chip.pos{color:var(--okf)} .tilechips .chip.neg{color:var(--badf)}
.bcard .bhero img{transition:transform var(--dur) var(--ease)}
.bcard:hover .bhero img{transform:scale(1.03)}

/* §5.2/D2: sticky Drillbar = Crumb + Ebenen-Summe (#view ist der Scroll-Container).
   top kompensiert das #view-padding-top (v9: BEIDE hängen an --sp-5 — gekoppelt!) —
   sonst bleibt beim Pinnen ein Sichtstreifen, in dem Zeilen ÜBER der Leiste
   durchscrollen (380px-Pass). */
.drillbar{position:sticky;top:calc(-1*var(--sp-5));z-index:6;display:flex;align-items:center;gap:10px;padding:var(--sp-2) 2px;
  background:color-mix(in srgb,var(--bg) 88%,transparent);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.drillbar .bcrumb{margin:0}
.drillbar b{font-variant-numeric:tabular-nums}
.drillbar .chip.warn{cursor:pointer;border-color:#e8a13a55;color:var(--warnf)}
.btools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 10px}
.btools .seg{margin-bottom:0}
.btools .inv-search{min-width:230px}
/* §2.5/D7: Typ-Chips (statt Facetten-Selects) — Mobile: horizontal scrollen */
.typrow{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 var(--sp-3)}
.typrow .tchip{cursor:pointer;border:1px solid var(--bd);background:var(--card)}
.typrow .tchip.on{border-color:var(--acc);color:var(--acc2);background:var(--acc-soft)}
@media (max-width:720px){.typrow{overflow-x:auto;flex-wrap:nowrap;padding-bottom:var(--sp-1)}}

/* §5.1: Produktblatt — Held-Zahl (Stückpreis) + Bild-Zoom (sealed wie single) */
.prodmain{min-width:260px;flex:1}
.prodprice{display:flex;align-items:baseline;gap:10px;margin-top:10px}
.prodprice .pp-v{font-size:var(--t-display);font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1}
.prodprice .pp-l{font-size:var(--t-sm)}
.prodchips{display:flex;gap:var(--sp-2);align-items:center;flex-wrap:wrap;margin-top:6px}
.prodimg{width:280px;transition:transform var(--dur-fast) var(--ease);transform-origin:left top}
.prodimg:hover{transform:scale(1.35);box-shadow:var(--sh-2);position:relative;z-index:5}
.prodhero .bhero.big{width:280px;flex:0 0 auto}
.prodhero .bhero.big img{transition:transform var(--dur-fast) var(--ease);transform-origin:left top}
.prodhero .bhero.big:hover img{transform:scale(1.35);position:relative;z-index:5}
@media (max-width:640px){.prodimg:hover{transform:none;box-shadow:none}
  .prodhero .bhero.big:hover img{transform:none}}

/* §5.1: Sales-Site-Chips (Farbpunkt = Legende) + 🛒 Marktplatz-Tabelle */
.sales-site{text-decoration:none}
.sales-site .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:var(--sp-1);vertical-align:1px}
.mkt-tbl{width:100%;margin-top:2px}
.mkt-tbl th,.mkt-tbl td{font-size:var(--t-sm)}

/* ============================================================================
   v8 Phase F — Politur: Springs/Toast/Charts (§7.6), th()-Header (§6.5),
   Detail-Crumb (§4.1/E3), Produktzeilen-Feinheiten (§5.2), Fokus/Kontrast
   ========================================================================== */
/* §7.6 Spring-Mikrointeraktionen — transition ERSETZEN, nicht ergänzen */
.setcard,.cardtile,.ck-row,.mv-row,.prodrow.clk,a.lm-offer{
  transition:transform var(--dur-fast) var(--ease-spring),border-color var(--dur-fast) var(--ease),
    box-shadow var(--dur) var(--ease)}
.setcard:hover,.cardtile:hover{transform:translateY(-3px);box-shadow:var(--sh-2)}
.ck-row:active,.mv-row:active,.setcard:active,.cardtile:active,.prodrow.clk:active{transform:scale(.985)}
/* §7.6 Toast: federt von unten ein statt nur Opacity */
#toast{transform:translate(-50%,14px)}
#toast.show{transform:translate(-50%,0);transition:transform var(--dur-slow) var(--ease-spring),opacity var(--dur)}
/* §7.6 flash war ID-gebunden (#total) — Regel für die Hero-P&L-Zeile */
.hero-pnl.flash{animation:flash 1.3s ease-out}
/* §6.1 */
.kpi .v{font-variant-numeric:tabular-nums}
/* §7.6 Charts erwachen: Sparklines zeichnen sich (pathLength=1 im Markup) */
.spark polyline{stroke-dasharray:1;stroke-dashoffset:1;animation:dash .7s var(--ease) var(--dur-fast) forwards}
@keyframes dash{to{stroke-dashoffset:0}}
/* §7.6 Datenpunkte federn beim Hover */
.eq-dot{transform-box:fill-box;transform-origin:center;
  transition:transform var(--dur-fast) var(--ease-spring),opacity var(--dur-fast)}
.eq-dot:hover{transform:scale(1.7);opacity:1}
/* §6.5 th(): Icon führt, Text weicht <860px (sr-only + title bleiben — A11y) */
th .th-ico{margin-right:var(--sp-1)}
@media (max-width:860px){th .th-ico+.th-txt{display:none}th .th-ico{margin-right:0}}
/* §4.1/E3 Detail-Crumb: 16px-Set-Logo, mittig */
.crumb-logo{height:16px;vertical-align:middle;margin-right:var(--sp-1)}
#crumb .cur{color:var(--fg)}
/* §5.2 (F3): Anteils-Balken im Typ-Gruppen-Header + Tages-Δ in der Wert-Spalte */
.prodgroup .grpbar{flex:1;max-width:140px;height:5px;margin:0 var(--sp-3);border-radius:4px;
  background:var(--line);overflow:hidden;align-self:center}
.prodgroup .grpbar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--acc2));border-radius:4px}
.pr-day{font-size:var(--t-cap);font-variant-numeric:tabular-nums;margin-top:1px}
/* §7.6 Beleg-Disclosure: Chevron rotiert (Text-Glyph, D10: .reveal ≠ .fold) */
#belegToggle .chev{display:inline-block;font-weight:700;transition:transform var(--dur-fast) var(--ease)}
#belegToggle.on .chev{transform:rotate(90deg)}
.beleg-view.reveal>div>iframe{margin-top:var(--sp-2)}
/* Politur: Fokus-Ringe für Chip-Links/Crumb (Tastatur sichtbar), Tabellen-Hover fühlbar */
a.hstat:focus-visible,#crumb a:focus-visible,.ck-chip:focus-visible{outline:2px solid var(--acc2);outline-offset:2px}
tr:hover td{background:#16223a59}
/* Politur 380px: Drillbar darf umbrechen, Held-Zahl etwas kleiner */
@media (max-width:640px){
  .drillbar{flex-wrap:wrap;row-gap:var(--sp-1)}
  .prodprice .pp-v{font-size:var(--t-2xl)}
}

/* ============================================================================
   v9 §D.2 — Komponenten: Icon-Größen (fürs SVG-Sprite, §C.1), .page-h,
   Utility-Klassen, Fokus-Ringe der Primär-Navigation
   ========================================================================== */
/* Drei feste optische Größen: .i-16 Zeilen/Chips · .i-20 Karten-Header/Utilities ·
   .i-28 Primär-Nav (mit 11px-Label darunter). ico() liefert <svg class="i i-16"> */
.i{display:inline-block;flex:0 0 auto;vertical-align:-3px}
.i-16{width:16px;height:16px}
.i-20{width:20px;height:20px;vertical-align:-4px}
.i-28{width:28px;height:28px;vertical-align:-7px}
/* .page-h — DER eine Seitentitel, nur auf Detail-Blättern (beendet die
   Hierarchie-Inversion: Seitentitel 13px < Karten-h3 13.5px). h2.sec bleibt
   als Eyebrow INNERHALB von Seiten gültig. */
.page-h{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;
  font-size:var(--t-xl);font-weight:800;letter-spacing:-.3px;margin:0 0 var(--sp-3)}
.page-h .ph-meta{margin-left:auto;display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;
  font-size:var(--t-sm);font-weight:400;letter-spacing:0;color:var(--mut)}
/* Utilities — ersetzen die Top-Muster der ~408 Inline-Styles in app.js */
.mt-2{margin-top:var(--sp-2)}
.mt-3{margin-top:var(--sp-3)}
.txt-sm{font-size:var(--t-sm)}
.sub{font-size:var(--t-sm);color:var(--mut)}
.link-more{display:inline-block;margin-top:var(--sp-1);font-size:var(--t-sm);
  color:var(--acc2);text-decoration:none}
.link-more:hover{text-decoration:underline;color:var(--link-hover)}
/* Fokus-Ringe für #nav/#subnav-Links (bestehender 2px-acc2-Ring, §D.2) */
#nav a:focus-visible,#subnav a:focus-visible{outline:2px solid var(--acc2);outline-offset:-2px;border-radius:var(--r-sm)}

/* §7.1 EIN reduced-motion-Block (ersetzt die vier verstreuten Blöcke) —
   Wildcard schaltet bewusst auch meshflow/pb-fill ab (A11y-gewollt);
   .spin bleibt: laufender Fortschritt ist etablierte Bedeutung, keine Deko. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important}
  .spin{animation:s 1.4s linear infinite!important}
}

/* ============================================================================
   v9 §B.1 Phase 2 — „Heute wird Bühne": NUR neue .hz-*-Zonen-Klassen
   (bestehende Regeln unangetastet; .hero/.hero-value bleiben Demo-/countUp-Anker)
   ========================================================================== */
/* ZONE 0 „Lage" — eine Zeile als Seiten-Öffner (kompaktiert den alten Hero) */
.hz-lage{display:flex;align-items:center;gap:var(--sp-2) var(--sp-4);flex-wrap:wrap;
  padding:var(--sp-3) var(--sp-5);margin-bottom:var(--sp-3)}
.hz-lage .hero-value{font-size:var(--t-2xl);margin:0;line-height:1.15}
.hz-lage #heroSpark{width:104px;height:36px;flex:0 0 auto;opacity:.9}
.hz-stat{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:var(--t-sm);
  color:var(--mut);text-decoration:none;white-space:nowrap}
.hz-stat b{color:var(--fg);font-variant-numeric:tabular-nums}
.hz-stat.warn,.hz-stat.warn b{color:var(--warnf)}
a.hz-stat:hover{color:var(--fg)}
a.hz-stat:focus-visible{outline:2px solid var(--acc2);outline-offset:2px;border-radius:var(--r-sm)}
.hz-regime{font-weight:700}
.hz-regime.pos{color:var(--okf);border-color:rgba(26,169,122,.4)}
.hz-regime.neg{color:var(--badf);border-color:rgba(232,112,58,.4)}
/* ZONE 1 Hero — größtes Element: die materiellste Einzel-Entscheidung */
.hz-hero{display:flex;align-items:flex-start;gap:var(--sp-4);margin-bottom:var(--sp-3);
  border-left:3px solid var(--acc);padding:var(--sp-4) var(--sp-5)}
.hz-hero.sell{border-left-color:var(--badf);background:linear-gradient(120deg,var(--bad-soft),var(--card) 55%)}
.hz-hero.buy{border-left-color:var(--okf);background:linear-gradient(120deg,var(--ok-soft),var(--card) 55%)}
.hz-hero-ico{flex:0 0 auto;padding-top:2px}
.hz-hero-ico .i{width:30px;height:30px}
.hz-hero-ico .ico{font-size:26px}
.hz-hero-main{flex:1;min-width:0}
.hz-hero-t{display:flex;align-items:baseline;gap:var(--sp-2);flex-wrap:wrap;font-size:var(--t-lg)}
.hz-hero-num{margin-left:auto;font-size:var(--t-xl);font-weight:800;white-space:nowrap;
  font-variant-numeric:tabular-nums}
.hz-hero-sub{font-size:var(--t-sm);margin-top:2px;line-height:1.55}
.hz-hero-links{display:flex;gap:var(--sp-4);flex-wrap:wrap;margin-top:var(--sp-2);font-size:var(--t-sm)}
.hz-hero-links a{color:var(--acc2);text-decoration:none;font-weight:600}
.hz-hero-links a:hover{text-decoration:underline;color:var(--link-hover)}
.hz-hero.is-empty{align-items:center;border-left-color:var(--line);gap:var(--sp-3);flex-wrap:wrap}
/* ZONE 2 Markt-Puls — eine Karte, zwei Spalten, Heat-Zeile */
.hz-puls-meta{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;margin-bottom:var(--sp-2)}
.hz-puls-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
@media (max-width:720px){.hz-puls-grid{grid-template-columns:1fr}}
.hz-heatrow{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;margin-top:var(--sp-3);
  border-top:1px solid var(--line);padding-top:var(--sp-2)}
.hz-heat{font-size:var(--t-sm);text-decoration:none;color:var(--mut);padding:1px var(--sp-2);
  border:1px solid var(--line);border-radius:999px;white-space:nowrap}
.hz-heat:hover{border-color:var(--line-strong);color:var(--fg)}
.hz-heat b{font-variant-numeric:tabular-nums;font-weight:700}
/* ZONE 3 Vermögen — klein: Kurve volle Breite, Allokation + Intel-META nebeneinander */
.hz-vermoegen{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);align-items:start;
  margin-top:var(--sp-3)}
.hz-vermoegen>.equity-card{grid-column:1/-1}
@media (max-width:860px){.hz-vermoegen{grid-template-columns:1fr}}
.hz-langs{font-size:var(--t-sm);margin-top:var(--sp-2);border-top:1px solid var(--line);
  padding-top:var(--sp-2);display:flex;align-items:center;gap:var(--sp-1);flex-wrap:wrap}
/* Telefon: Hero-Zahl bricht unter den Titel, Lage-Zeile darf eng werden */
@media (max-width:640px){
  .hz-lage{padding:var(--sp-3) var(--sp-4)}
  .hz-hero-num{margin-left:0;width:100%}
}

/* ============================================================================
   v9 §B.4 Phase 3 — Markt-Hub: NUR neue .mkt-hub-*-Klassen
   (marktRow-Komponente + Filter-Leiste; bestehende .lm-*/.mv-* unangetastet)
   ========================================================================== */
.mkt-hub-bar{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;
  margin:0 0 var(--sp-3)}
.mkt-hub-games{display:flex;gap:6px;flex-wrap:wrap}
/* marktRow — EINE Zeile: Identität (flex:1) · Mess-Spalten · Markt-€ · extern */
.mkt-hub-row{display:flex;align-items:center;gap:var(--sp-2);padding:6px 2px;
  border-bottom:1px solid var(--line);min-width:0}
.mkt-hub-row:last-child{border-bottom:0}
.mkt-hub-row.head{font-size:var(--t-sm);color:var(--mut);
  border-bottom:1px solid var(--line-strong);padding:2px 2px 4px}
.mkt-hub-id{flex:1 1 auto;min-width:0;display:flex;align-items:center;
  gap:6px;flex-wrap:wrap}
.mkt-hub-id>a{color:inherit;text-decoration:none;font-weight:600}
.mkt-hub-id>a:hover{text-decoration:underline;color:var(--link-hover)}
.mkt-hub-m{flex:0 0 76px;text-align:right;font-variant-numeric:tabular-nums;
  white-space:nowrap}
.mkt-hub-p{flex:0 0 92px;text-align:right;font-weight:700;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.mkt-hub-ext{flex:0 0 70px;text-align:right;white-space:nowrap}
.mkt-hub-ext a{color:var(--acc2);text-decoration:none;font-size:var(--t-sm)}
.mkt-hub-ext a:hover{text-decoration:underline;color:var(--link-hover)}
/* im lm-Karten-Kopf ist marktRow nur die Kopfzeile — ohne Listen-Linie */
.lm-card .mkt-hub-row{border-bottom:0;padding:0}
@media (max-width:640px){
  .mkt-hub-m{flex-basis:58px}
  .mkt-hub-p{flex-basis:76px}
  .mkt-hub-row.head .mkt-hub-id{visibility:hidden}
}

/* ============================================================================
   v9 §B.2 Phase 5 — Entscheiden: NUR neue .ent-*-Klassen
   (EINE Karte je Set + Vertrauens-Anker + Rechner-/Parameter-Modal;
   Geld-Doktrin: .mny-c via eurC für Bestands-€ — Demo-Politik bleibt lückenlos)
   ========================================================================== */
.ent-trustbtn{display:inline-flex;align-items:center;gap:6px;border-radius:var(--r-pill)}
.ent-trustbtn .i{width:13px;height:13px}
.ent-trust-body{margin:var(--sp-2) 0 var(--sp-3);font-size:var(--t-sm)}
.ent-trust-body .row .r{text-align:right}
/* Karte: linke Aktions-Kante = dieselbe Farbsprache wie die Badges */
.ent-card{padding:var(--sp-3) var(--sp-4);margin-bottom:var(--sp-2);border-left:3px solid var(--line)}
.ent-kaufen{border-left-color:var(--okf)}
.ent-trimmen{border-left-color:var(--badf)}
.ent-meiden{border-left-color:var(--warnf)}
.ent-head{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap}
.ent-name{font-weight:700;font-size:var(--t-md)}
.ent-name a{color:inherit;text-decoration:none}
.ent-name a:hover{text-decoration:underline;color:var(--link-hover)}
.ent-star .i{width:13px;height:13px;color:var(--warnf)}
.ent-act{margin-left:auto;display:inline-flex;align-items:center;gap:5px;text-transform:none}
.ent-act .i{width:12px;height:12px}
.ent-row{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;
  font-size:var(--t-sm);padding:4px 0;border-top:1px dashed var(--line);margin-top:4px}
.ent-row a{color:var(--acc2);text-decoration:none}
.ent-row a:hover{text-decoration:underline;color:var(--link-hover)}
.ent-qty{margin-left:auto;font-variant-numeric:tabular-nums;white-space:nowrap}
.ent-net{margin-left:auto;font-variant-numeric:tabular-nums;white-space:nowrap}
.ent-cztxt{font-size:var(--t-cap);flex-basis:100%;opacity:.85}
.ent-cone{flex:0 0 auto;display:block}
.ent-conelink{display:inline-flex;line-height:0}
.ent-cone line{stroke:var(--line-strong)}
.ent-cone polyline{fill:none;stroke:var(--acc2);stroke-width:1.4;opacity:.85}
.ent-cone circle{fill:var(--fg)}
.ent-foot{display:flex;gap:var(--sp-4);flex-wrap:wrap;margin-top:var(--sp-2);font-size:var(--t-sm)}
.ent-foot a{color:var(--acc2);text-decoration:none;font-weight:600}
.ent-foot a:hover{text-decoration:underline;color:var(--link-hover)}
/* Modal (Rechner + Parameter teilen das Overlay) — unter ⌘K (80), über Panels (40) */
.ent-modal-bg{position:fixed;inset:0;background:rgba(4,7,12,.62);z-index:70;
  display:flex;align-items:flex-start;justify-content:center;padding:9vh 16px 16px}
.ent-modal{width:min(560px,100%);max-height:80vh;overflow:auto;background:var(--bar);
  border:1px solid var(--bd);border-radius:var(--r-lg);padding:var(--sp-4) var(--sp-5);
  box-shadow:var(--sh-3)}
.ent-modal .x{float:right;cursor:pointer;color:var(--mut);font-size:var(--t-sm);font-weight:400}
.ent-modal .x:hover{color:var(--fg)}
.ent-modal .row .r{font-variant-numeric:tabular-nums}
.ent-calc-pick{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-2)}
@media (max-width:640px){
  .ent-qty,.ent-net{margin-left:0;width:100%}
  .ent-modal-bg{padding:4vh 8px 8px}
}

/* ============================================================================
   v9 §B.3 Phase 4 — Waren-Pyramide: NUR neue wg-*/sb-*-Klassen
   (URL-Drill + Spiel-Blatt-Signale + DAS Set-Blatt mit 4 Lazy-Segmenten;
   Geld-Doktrin: Bestands-€ via eurC/.mny-c — Demo-Politik bleibt lückenlos)
   ========================================================================== */
/* Bestand|Katalog-Toggle: .ptab als <a> (echte Hash-Navigation, §0.9) */
.wg-toggle{margin:2px 0 10px}
.wg-toggle a.ptab{display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.wg-signals{margin-top:var(--sp-5)}
/* Set-Blatt-Kopf: Logo + Titel + ★ + Bestand-€ */
.sb-head{margin:var(--sp-2) 0 var(--sp-2)}
.sb-logo{height:36px;max-width:130px;object-fit:contain;flex:0 0 auto}
.sb-title{font-weight:800}
.sb-star{background:transparent;border:1px solid var(--bd);border-radius:var(--r-pill);
  padding:3px 9px;cursor:pointer;color:var(--mut);line-height:0;transition:var(--dur-fast)}
.sb-star:hover{color:var(--fg);border-color:var(--line-strong)}
.sb-star.on{color:var(--warnf);border-color:var(--warnf);background:var(--warn-soft)}
.sb-star .i{width:14px;height:14px}
/* Segment-Zeile + Panes (lazy, Blickwinkel OHNE URL-Wechsel — .seg-Doktrin) */
.sb-seg{margin:0 0 var(--sp-3)}
.sb-seg button{display:inline-flex;align-items:center;gap:5px}
.sb-pane{min-height:40px}
.sb-pane[hidden]{display:none}

/* ============================================================================
   v9 §B.5/§B.6 Phase 6 — NUR NEUE Klassen: Maschine (Ampel · KPI-Kacheln ·
   Quellen-Tabelle) + Team-Sheet (Slide-in rechts) + Composer-Kind-Pills
   ========================================================================== */
/* Zone 1 AMPEL — immer sichtbarer Kopf-Block jeder Maschine-Zone */
.masch-ampel{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);
  padding:10px 14px;margin:0 0 12px;font-size:var(--t-md)}
.masch-ampel.ok{border-left:3px solid var(--okf,#2ec26b)}
.masch-ampel.warn{border-left:3px solid var(--warnf,#e0b341)}
.masch-ampel.bad{border-left:3px solid var(--badf,#e0556b)}
.ampel-dot{width:12px;height:12px;border-radius:50%;flex:0 0 auto}
.ampel-dot.ok{background:var(--okf,#2ec26b);box-shadow:0 0 8px var(--okf,#2ec26b)}
.ampel-dot.warn{background:var(--warnf,#e0b341)}
.ampel-dot.bad{background:var(--badf,#e0556b);box-shadow:0 0 8px var(--badf,#e0556b)}
.ampel-verdict{font-weight:800;font-size:var(--t-lg)}
.ampel-kpi{color:var(--mut);font-size:var(--t-sm)} .ampel-kpi b{color:var(--fg)}
.ampel-kpi.neg,.ampel-kpi.neg b{color:var(--badf,#e0556b)}
.ampel-detail{flex-basis:100%;border-top:1px dashed var(--bd);padding-top:8px;margin-top:4px}
/* Zone 2 — KPI-Kacheln mit Aufklapper (natives <details> in der .kpis-Zeile) */
.m-tiles .m-tile summary{list-style:none;cursor:pointer}
.m-tiles .m-tile summary::-webkit-details-marker{display:none}
.m-tile .m-tile-arrow{float:right;color:var(--mut);transition:transform var(--dur-fast)}
.m-tile[open] .m-tile-arrow{transform:rotate(90deg)}
.m-tile-fold{border-top:1px dashed var(--bd);margin-top:8px;padding-top:8px;font-size:var(--t-sm)}
/* Zone 3 — EINE Quellen-Tabelle (Registry + geKEYte mit Budget-Balken) */
.mq-row{display:grid;grid-template-columns:minmax(150px,1.5fr) minmax(110px,1fr) minmax(120px,1fr) 86px 86px;
  gap:8px;align-items:center;padding:5px 4px;border-bottom:1px solid var(--line,#1c2738);font-size:var(--t-sm)}
.mq-row:last-of-type{border-bottom:0}
.mq-head{font-size:var(--t-cap);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--bd)}
.mq-grp{font-size:var(--t-cap)}
.mq-bud .acq-vw{width:64px}
.mq-act{text-align:right}
.mq-keyed{background:var(--s1,rgba(255,255,255,.02));border-radius:var(--r-sm)}
@media (max-width:760px){ .mq-row{grid-template-columns:1fr 1fr;row-gap:2px} .mq-head{display:none} }
/* Zone 4 — purer Strom in voller Breite (die Beifang-Spalte ist tot) */
.fstream-full{max-width:none}
/* Team-Sheet (§B.5): Slide-in rechts über der aktiven Fläche */
.team-sheet{position:fixed;top:0;right:0;bottom:0;z-index:60;width:min(440px,94vw);
  background:var(--bar,var(--panel));border-left:1px solid var(--bd);box-shadow:var(--sh-3);
  transform:translateX(103%);transition:transform var(--dur,.22s) ease;
  display:flex;flex-direction:column;padding:12px 16px;overflow-y:auto}
.team-sheet.show{transform:none}
@media (prefers-reduced-motion: reduce){ .team-sheet{transition:none} }
.ts-head{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:var(--t-md);flex:0 0 auto}
.ts-status{font-size:var(--t-sm);margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 0 auto}
.ts-pres{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;flex:0 0 auto}
.ts-user{display:inline-flex;align-items:center;gap:4px;font-size:var(--t-sm);
  border:1px solid var(--bd);border-radius:var(--r-pill);padding:2px 9px;color:var(--mut)}
.ts-chat{flex:1 1 220px;min-height:160px;max-height:none}
.ts-fragen .q-row{flex-wrap:wrap}
.ts-admin{font-size:var(--t-sm);margin-top:8px}
.team-dot{position:absolute;top:2px;right:2px;width:8px;height:8px;border-radius:50%;
  background:var(--okf,#2ec26b);box-shadow:0 0 6px var(--okf,#2ec26b)}
#bTeam{position:relative}
/* Composer (§B.5): Kind-Pills im geteilten ent-Modal */
.comp-kinds{margin-bottom:10px}
/* v9 Review R1: Frische-Chip für Markt-Zeilen (marktRow/freshChip) — kompakt, neutral;
   .fresh hebt server-frische Preise hervor (gleiche Farb-Sprache wie .eu-chip.fresh). */
.fresh-chip{display:inline-flex;align-items:center;gap:3px;font-size:var(--t-cap,11px);
  font-weight:600;color:var(--mut);border:1px solid var(--bd);border-radius:var(--r-pill,999px);
  padding:0 7px;line-height:1.5;vertical-align:1px}
.fresh-chip.fresh{border-color:#1aa97a55;color:var(--okf,#2ec26b)}
/* v9 Review R1: Methoden-Vorbehalt neben Netto-€ (methodTag) — kleiner als der Betrag,
   erbt die .badge-Farbtöne (ok/warn/mut) je Steuer-Methode; bricht den Fluss nicht. */
.method-tag{font-size:var(--t-cap,11px);font-weight:600;padding:0 6px;vertical-align:1px}

/* ============================================================================
   v9 P1/P2/P4 — Quelle-/Sprach-/Markt-Chips, Gebinde-Badge, globaler Katalog.
   Reused Tokens: --line/--bd/--mut/--card/--sp-*/--r-*/--t-*. Demo-sicher
   (nur öffentliche €-Preise via .mny). ============================================ */
/* Quelle (🇪🇺 Cardmarket EU), Produktsprache, Markt/Herkunftsland — alle als ruhige
   Pill-Chips in einer Farbsprache mit .chip/.badge. */
.src-chip,.lang-chip{display:inline-flex;align-items:center;gap:3px;font-size:var(--t-nano,10px);
  font-weight:600;border:1px solid var(--bd);border-radius:var(--r-pill,999px);
  padding:1px var(--sp-2);color:var(--mut);white-space:nowrap;line-height:1.6}
.src-chip{border-color:var(--acc-border,#3b82f6aa);color:var(--acc2,#7ba7ff);background:var(--acc-soft,transparent)}
.lang-chip{background:var(--line)}
/* Gebinde-Modifier (Case/Display) — INNERHALB der Basis-Gruppe, nie eigene Gruppe. */
.geb-badge{display:inline-flex;align-items:center;gap:3px;font-size:var(--t-nano,10px);
  font-weight:700;border:1px solid var(--bd);border-radius:var(--r-sm,8px);
  padding:1px var(--sp-2);color:var(--mut);white-space:nowrap;line-height:1.6}
.geb-badge.geb-case{border-color:#5aa7d055;color:#7cc0e6;background:#5aa7d014}
.geb-badge.geb-display{border-color:#a88bd055;color:#bca0e6;background:#a88bd014}
/* Katalog-Landing: Filterleiste (Spiel-Tabs + Suche + Typ-Pillen). */
.cat-bar{align-items:center}
.cat-bar .inv-search{flex:1;min-width:180px}
.cat-types{display:flex;gap:6px;flex-wrap:wrap;margin:var(--sp-2) 0 var(--sp-3)}
.cat-types .tchip{cursor:pointer}
.cat-types .pt-n,.mkt-hub-games .pt-n{font-weight:700;opacity:.7;margin-left:3px}
/* Katalog-Produktgitter (bild-dominant, Cardmarket-Style). */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:var(--sp-3);margin:var(--sp-2) 0 var(--sp-4)}
.cat-tile{background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);
  overflow:hidden;cursor:pointer;display:flex;flex-direction:column;
  transition:transform var(--dur-fast,.12s) var(--ease),border-color var(--dur-fast,.12s) var(--ease)}
.cat-tile:hover{border-color:var(--acc);transform:translateY(-3px);box-shadow:var(--sh-2)}
.cat-tile:focus-visible{outline:2px solid var(--acc2);outline-offset:2px}
.cat-tile .bhero{height:150px;margin:0;border-radius:var(--r-lg) var(--r-lg) 0 0;overflow:hidden}
.cat-tile .bhero.big{height:150px}
.cat-tile .bhero.big img{max-height:150px}
.cat-tile .bhero img{transition:transform var(--dur,.2s) var(--ease)}
.cat-tile:hover .bhero img{transform:scale(1.04)}
.cat-body{padding:var(--sp-2) var(--sp-3) var(--sp-3);display:flex;flex-direction:column;gap:5px;flex:1}
.cat-name{font-weight:700;font-size:var(--t-sm);line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cat-price-row{display:flex;align-items:baseline;gap:var(--sp-2);flex-wrap:wrap}
.cat-price{font-weight:800;font-variant-numeric:tabular-nums}
.cat-noask{font-size:var(--t-cap,11px);font-style:italic}
.cat-ext{font-size:var(--t-cap,11px);color:var(--acc2);text-decoration:none;margin-left:auto}
.cat-ext:hover{text-decoration:underline}
.cat-chips{display:flex;gap:var(--sp-1);flex-wrap:wrap;align-items:center;margin-top:auto}
.cat-avail{font-size:var(--t-nano,10px)}
/* Katalog-Set-Blatt: Kopf (Logo + Name + Serie + Release + ML-Chip). */
.cat-sethead{display:flex;gap:var(--sp-4);align-items:center;margin:0 0 var(--sp-4);
  background:var(--card);border:1px solid var(--bd);border-radius:var(--r-lg);padding:var(--sp-3) var(--sp-4)}
.cat-setlogo{flex:0 0 auto;width:140px;height:80px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(180deg,#f7f9fc,#e9eef5);border:1px solid var(--bd);border-radius:var(--r);padding:var(--sp-2)}
.cat-setlogo img{max-width:100%;max-height:100%;object-fit:contain}
.cat-setmeta{min-width:0}
.cat-setmeta h2{margin:2px 0 4px;font-size:var(--t-lg,18px)}
.cat-back{font-size:var(--t-cap,11px);color:var(--acc2);text-decoration:none}
.cat-back:hover{text-decoration:underline}
.cat-singles{margin:var(--sp-3) 0}
.cat-singles a{display:inline-flex;align-items:center;gap:var(--sp-2);font-weight:600;color:var(--acc2);text-decoration:none;
  border:1px solid var(--bd);border-radius:var(--r-sm);padding:var(--sp-2) var(--sp-3)}
.cat-singles a:hover{border-color:var(--acc);color:var(--fg)}
@media (max-width:560px){
  .cat-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .cat-sethead{flex-direction:column;align-items:flex-start}
}
/* v9.1 Harvest H3 — EntityPeek schwebende Kontext-Karte (app-weit) */
[data-peek-sku]{cursor:default}
.peek-pop{position:fixed;z-index:9000;width:250px;max-width:88vw;background:var(--card,#161a22);
  border:1px solid var(--line,#2a2f3a);border-radius:var(--r-2,10px);padding:10px 11px;
  box-shadow:0 10px 34px rgba(0,0,0,.45);font-size:12.5px;line-height:1.35;color:var(--fg,#e7ebf2);pointer-events:auto}
.peek-h{font-weight:600;font-size:12.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.peek-sub{font-size:11px;margin:1px 0 5px}
.peek-price{font-size:14px;margin:2px 0 4px}
.peek-spark{display:block;width:100%;height:30px;color:var(--acc,#6ea8fe);margin:3px 0 5px;opacity:.9}
.peek-row{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;margin-top:2px}
.peek-foot{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:7px;padding-top:6px;border-top:1px solid var(--line,#2a2f3a)}
.peek-more{margin-left:auto;color:var(--acc,#6ea8fe);text-decoration:none;font-weight:500}
.peek-more:hover{text-decoration:underline}
/* v9.1 Harvest H5 — Performance-Strip (Waren-Landing) */
.attrib-strip{margin:8px 0}
.attrib-card{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:9px 13px;font-size:12.5px}
.attrib-lead{font-weight:500;display:flex;align-items:center;gap:6px}
.attrib-seg{display:flex;flex-wrap:wrap;gap:14px}
.attrib-seg .ap{display:inline-flex;gap:5px;align-items:baseline}
.attrib-win{margin-left:auto}
/* v9.1 Harvest H7 — Allokation & Klumpenrisiko */
.alloc-card-host{margin:8px 0}
.alloc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.alloc-col{min-width:0}
.alloc-h{font-weight:500;font-size:12px;margin-bottom:6px}
.alloc-row{display:flex;align-items:center;gap:7px;font-size:11.5px;margin:3px 0}
.alloc-l{width:104px;flex:0 0 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.alloc-track{flex:1;height:7px;background:var(--line,#2a2f3a);border-radius:4px;overflow:hidden}
.alloc-track i{display:block;height:100%;background:var(--acc,#6ea8fe)}
.alloc-pct{width:44px;flex:0 0 auto;text-align:right}
.alloc-conc{margin-top:10px;padding-top:8px;border-top:1px solid var(--line,#2a2f3a);font-size:11.5px}
@media(max-width:680px){.alloc-grid{grid-template-columns:1fr}}

/* v9.2 Harvest H8: BestandsKarte (bipartiter Beziehungsgraph Spiel ↔ Gebinde) */
.bk-head a.linklike{font-size:12px}
.bk-card{padding:14px 10px}
.bk-svg{width:100%;height:auto;display:block;font-family:inherit}
.bk-col{fill:var(--mut);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.bk-edge{fill:none;stroke:var(--bd);opacity:.32;transition:opacity .12s,stroke .12s}
.bk-svg.bk-focus .bk-edge{opacity:.08}
.bk-svg.bk-focus .bk-edge.on{opacity:.85;stroke:var(--acc2)}
.bk-dot{stroke:var(--s0,#0b0f1a);stroke-width:1.5}
.bk-dot.bk-game{fill:var(--acc)}
.bk-dot.bk-group{fill:var(--ok,#1aa97a)}
.bk-lbl{fill:var(--fg);font-size:12px;font-weight:600}
.bk-sub{fill:var(--mut);font-size:10.5px}
.bk-node.bk-nav{cursor:pointer}
.bk-node.bk-nav:hover .bk-lbl{fill:var(--acc2)}
.bk-node.bk-nav:hover .bk-dot{filter:brightness(1.25)}
.bk-note{font-size:11px;margin-top:8px;line-height:1.5}
