/* atlas-panels.css — Automatisch generiert von build-panels.js
   63 Dateien, Reihenfolge = Original-Kaskade.
   NICHT MANUELL BEARBEITEN — Quellen aendern, dann build-panels.js ausfuehren. */

/* ═══ pioneer-upgrade.css ═══ */
/* Atlas Pioneer Design Upgrade — Build 030 */
/* Awwwards-level visual polish: loading screen, text-scramble, particles, 3D sphere */

/* ═══════════════════════════════════════════════════════════ */
/* LOADING SCREEN                                              */
/* ═══════════════════════════════════════════════════════════ */

/* Selbstständiges Lade-Overlay: dunkler Vollbild-Hintergrund + EIGENE Canvas (.al-canvas)
   mit der Chaos→Sphäre-Animation + Prozent/Balken. HARTER SCHNITT statt Fade: bei 100%
   friert das Lade-Auge 0.3s ein (volle Deckkraft, deckt das Dashboard), dann wird das
   Overlay SOFORT entfernt (display:none → aus DOM). Kein opacity-Fade → kein Moment, in
   dem man beide Augen übereinander sieht. Das Dashboard ist darunter schon voll gerendert. */
#atlas-loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  z-index: 99999;
  background: var(--bg);
}

/* Bei 100% fadet das Overlay-BG in 0.15s auf transparent → nur noch die Canvas (Strahl +
   gezeichnetes Eye) ist sichtbar. Dashboard-Elemente starten bei opacity 0 (atlas-scan-phase)
   und werden einzeln eingeblendet, sobald der Strahl sie berührt. */
#atlas-loader.al-done {
  background: transparent;
  pointer-events: none;
  transition: background 0.15s ease;
}

#atlas-loader.al-gone {
  display: none;          /* harter Schnitt: sofort weg */
}

/* Lade-Canvas — Vollbild, damit die Chaos-Punkte ueber den GANZEN Bildschirm verstreut sind. */
#atlas-loader .al-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

/* Prozentanzeige + dünner Ladebalken — UNTER der Sphäre (Build 387: angepasst an kleine Eye-Grösse). */
#atlas-loader .al-progress {
  position: fixed;
  top: calc(50% + 75px);
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  z-index: 100001;
  transition: opacity 0.4s ease;
}

#atlas-loader.al-done .al-progress {
  display: none;   /* %/Balken sofort weg bei 100% (kein Fade) */
}

#atlas-loader .al-percent {
  font-family: 'JetBrains Mono', monospace;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 4px;
  color: var(--accent);
  margin-bottom: 10px;
  text-shadow: 0 0 12px rgba(var(--accent-rgb), 0.5);
}

#atlas-loader .al-bar {
  width: 180px;
  height: 1px;
  background: rgba(var(--accent-rgb), 0.12);
  margin: 0 auto;
  border-radius: 1px;
  overflow: hidden;
}

#atlas-loader .al-bar-fill {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--accent), #f5d778);
  border-radius: 1px;
  transition: width 0.12s linear;
}

/* Dashboard-Inhalt (React #root) ist die GANZE Zeit voll gerendert (opacity 1). */
#root {
  opacity: 1;
}

/* ─── Scan-Phase: Elemente versteckt, Eye sichtbar, Strahl enthüllt ─── */
/* Jedes Grid-Kind (ausser dem Eye-Container) bekommt .atlas-scan-el → opacity 0.
   Der Strahl löst .scan-revealed aus → opacity 1 (0.3s Transition).
   Auch injected fixed-position Elemente (#atlas-nav-open, #sonos-bar) werden getaggt. */
body.atlas-scan-phase .atlas-scan-el {
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}
body.atlas-scan-phase .atlas-scan-el.scan-revealed {
  opacity: 1 !important;
}

/* ═══════════════════════════════════════════════════════════ */
/* PARTICLE CANVAS BACKGROUND                                  */
/* ═══════════════════════════════════════════════════════════ */

#atlas-particles {
  position: fixed;
  inset: 0;
  z-index: -1; /* Fix Build 068: hinter den Inhalt — Partikel duerfen nicht ueber Chat/Panels liegen */
  pointer-events: none;
  opacity: 0;
  transition: opacity 1.2s ease;
}

#atlas-particles.visible {
  opacity: 1;
}

/* ═══════════════════════════════════════════════════════════ */
/* TEXT SCRAMBLE ANIMATION                                     */
/* ═══════════════════════════════════════════════════════════ */

.text-scramble {
  display: inline-block;
  position: relative;
}

.text-scramble .scramble-char {
  display: inline-block;
  transition: opacity 0.05s;
}

.text-scramble .scramble-char.glitch {
  color: rgba(var(--accent-rgb), 0.7);
  text-shadow: 0 0 8px rgba(var(--accent-rgb), 0.3);
}

.text-scramble-heading {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2px;
  line-height: 1.1;
}

/* Hinweis: Das Dashboard-Atlas-Eye rendert die React-App selbst (eigene Canvas in #root).
   Der frühere doppelte #atlas-3d-sphere wurde entfernt — die Lade-Animation lebt jetzt
   ausschliesslich im selbstständigen #atlas-loader (.al-canvas) und fadet bei 100% aus. */

/* ═══════════════════════════════════════════════════════════ */
/* SCROLL-REACTIVE SECTION REVEALS                             */
/* ═══════════════════════════════════════════════════════════ */

.pioneer-reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.9s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.9s cubic-bezier(0.4, 0, 0.2, 1);
}

.pioneer-reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

.pioneer-reveal-left {
  opacity: 0;
  transform: translateX(-60px);
  transition: opacity 0.9s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.9s cubic-bezier(0.4, 0, 0.2, 1);
}

.pioneer-reveal-left.revealed {
  opacity: 1;
  transform: translateX(0);
}

.pioneer-reveal-right {
  opacity: 0;
  transform: translateX(60px);
  transition: opacity 0.9s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.9s cubic-bezier(0.4, 0, 0.2, 1);
}

.pioneer-reveal-right.revealed {
  opacity: 1;
  transform: translateX(0);
}

.pioneer-reveal-scale {
  opacity: 0;
  transform: scale(0.92);
  transition: opacity 0.9s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.9s cubic-bezier(0.4, 0, 0.2, 1);
}

.pioneer-reveal-scale.revealed {
  opacity: 1;
  transform: scale(1);
}

/* Stagger children */
.pioneer-stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.pioneer-stagger.revealed > *:nth-child(1) { transition-delay: 0.0s; }
.pioneer-stagger.revealed > *:nth-child(2) { transition-delay: 0.08s; }
.pioneer-stagger.revealed > *:nth-child(3) { transition-delay: 0.16s; }
.pioneer-stagger.revealed > *:nth-child(4) { transition-delay: 0.24s; }
.pioneer-stagger.revealed > *:nth-child(5) { transition-delay: 0.32s; }
.pioneer-stagger.revealed > *:nth-child(6) { transition-delay: 0.40s; }
.pioneer-stagger.revealed > *:nth-child(7) { transition-delay: 0.48s; }
.pioneer-stagger.revealed > *:nth-child(8) { transition-delay: 0.56s; }

.pioneer-stagger.revealed > * {
  opacity: 1;
  transform: translateY(0);
}

/* ═══════════════════════════════════════════════════════════ */
/* ENHANCED DASHBOARD CARD HOVER                               */
/* ═══════════════════════════════════════════════════════════ */

.pioneer-card-glow {
  position: relative;
  overflow: hidden;
}

.pioneer-card-glow::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(
    135deg,
    rgba(var(--accent-rgb), 0) 0%,
    rgba(var(--accent-rgb), 0.15) 50%,
    rgba(var(--accent-rgb), 0) 100%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.5s;
}

.pioneer-card-glow:hover::before {
  opacity: 1;
}

/* Subtle ambient glow on active cards */
.pioneer-card-glow::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(
    circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
    rgba(var(--accent-rgb), 0.04) 0%,
    transparent 50%
  );
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.4s;
}

.pioneer-card-glow:hover::after {
  opacity: 1;
}

/* SCROLL-TO-DISCOVER — removed, dashboard has no scrolling */
#scroll-discover { display: none !important; }

/* ═══════════════════════════════════════════════════════════ */
/* AMBIENT LINE DECORATIONS                                    */
/* ═══════════════════════════════════════════════════════════ */

.pioneer-line-h {
  width: 100%;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(var(--accent-rgb), 0.15) 20%,
    rgba(var(--accent-rgb), 0.15) 80%,
    transparent 100%
  );
  margin: 24px 0;
}

.pioneer-line-v {
  width: 1px;
  height: 100%;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(var(--accent-rgb), 0.1) 30%,
    rgba(var(--accent-rgb), 0.1) 70%,
    transparent 100%
  );
}

/* ═══════════════════════════════════════════════════════════ */
/* RESPONSIVE                                                  */
/* ═══════════════════════════════════════════════════════════ */

/* (Mobile: kein separater #atlas-3d-sphere mehr — das Lade-Overlay ist auf allen Geräten
   Vollbild; das Dashboard-Eye verwaltet die React-App selbst.) */


/* ═══ tab-system.css ═══ */
/* Atlas Tab System — Build 032 */
/* Internal tab navigation: ATLAS / BUILDER / JUPITER / MISSION / CRM */
/* Desktop only — mobile uses swipe panels from Build 041 */

/* ═══════════════════════════════════════════════════════════ */
/* TAB BAR (injected into header)                              */
/* ═══════════════════════════════════════════════════════════ */

/* Vertical, single-column, grouped sidebar drawer (replaces the old wrapping
   horizontal tab bar). Hidden off-canvas by default; body.atlas-nav-open slides
   it in. Opened by #atlas-nav-open (☰), closed by #atlas-nav-close (✕). */
#atlas-tab-bar {
  position: fixed;
  top: 0;
  left: 0;
  width: 248px;
  height: 100vh;
  height: 100dvh;
  margin: 0;
  padding: 0;
  background: #0d0d14;
  border-right: 1px solid #1a1a28;
  box-shadow: 4px 0 28px rgba(0, 0, 0, 0.55);
  z-index: 4000;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  transform: translateX(-100%);
  transition: transform 0.25s ease;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  /* Dark scrollbar (Firefox) — weisse Default-Scrollbar stoerte das Dark Theme. */
  scrollbar-width: thin;
  scrollbar-color: var(--border-light) #0a0a0f;
}

/* Dark scrollbar (Webkit/Chromium) */
#atlas-tab-bar::-webkit-scrollbar { width: 6px; }
#atlas-tab-bar::-webkit-scrollbar-track { background: var(--bg); }
#atlas-tab-bar::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 3px; }

body.atlas-nav-open #atlas-tab-bar {
  transform: translateX(0);
}

/* Backdrop */
#atlas-nav-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 3900;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}

body.atlas-nav-open #atlas-nav-backdrop {
  opacity: 1;
  pointer-events: auto;
}

/* Floating hamburger (open) — the ONLY hamburger, sits far left; the React
   header is padded so the ATLAS logo lands right of it: [☰] [ATLAS] [Tabs]. */
#atlas-nav-open {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 3500;
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid var(--accent);
  background: rgba(13, 13, 20, 0.92);
  color: var(--accent);
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, color 0.15s ease;
}

#atlas-nav-open:hover {
  background: var(--accent);
  color: #0a0a0a;
}

body.atlas-nav-open #atlas-nav-open {
  display: none;
}

/* Sidebar header — ATLAS title (gold) + close button (top right) */
.atlas-nav-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 16px 14px;
  border-bottom: 1px solid #1a1a28;
  position: sticky;
  top: 0;
  background: #0d0d14;
  z-index: 1;
}

.atlas-nav-title {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 4px;
  color: var(--accent);
}

.atlas-nav-close {
  background: none;
  border: 1px solid #2a2a3a;
  color: var(--text-muted);
  width: 28px;
  height: 28px;
  border-radius: 7px;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.15s ease, border-color 0.15s ease;
}

.atlas-nav-close:hover {
  color: var(--accent);
  border-color: var(--accent);
}

/* Groups + dividers */
.atlas-nav-groups {
  padding: 8px 0 28px;
}

.atlas-nav-group {
  display: flex;
  flex-direction: column;
}

.atlas-nav-cap {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--text-dim);
  padding: 6px 16px 4px;
}

.atlas-nav-divider {
  height: 1px;
  background: #1a1a28;
  margin: 8px 12px;
  border: none;
}

/* Entries — full width, single column */
#atlas-tab-bar .atlas-tab {
  display: flex;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  padding: 10px 16px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2px;
  color: var(--text-muted);
  background: transparent;
  border: none;
  border-radius: 0;
  cursor: pointer;
  text-align: left;
  white-space: nowrap;
  transition: color 0.18s, background 0.18s;
}

#atlas-tab-bar .atlas-tab:hover {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.08);
}

#atlas-tab-bar .atlas-tab.active {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

#atlas-tab-bar .tab-badge {
  display: inline-block;
  background: var(--accent);
  color: #000;
  font-size: 9px;
  font-weight: 800;
  padding: 1px 5px;
  border-radius: 8px;
  margin-left: auto;
  vertical-align: middle;
  min-width: 14px;
  text-align: center;
}

#atlas-tab-bar .tab-badge.orange {
  background: var(--status-warn);
}

#atlas-tab-bar .tab-badge.green {
  background: var(--status-ok);
}

#atlas-tab-bar .tab-badge.gold {
  background: var(--accent);
}

#atlas-tab-bar .tab-badge.blue {
  background: #42a5f5;
}

#atlas-tab-bar .tab-badge:empty {
  display: none;
}

/* The legacy ZEITREISE button injected by zeitreise-dashboard.js is replaced by
   a native sidebar entry — hide the duplicate. */
#atlas-tab-bar #zr-tab-btn {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════ */
/* TAB CONTENT CONTAINERS                                      */
/* ═══════════════════════════════════════════════════════════ */

#atlas-tab-content-builder,
#atlas-tab-content-jupiter,
#atlas-tab-content-mission,
#atlas-tab-content-crm,
#atlas-tab-content-ideas,
#atlas-tab-content-produkte,
#atlas-tab-content-notifications,
#atlas-tab-content-finance,
#atlas-tab-content-happy,
#atlas-tab-content-calendar,
#atlas-tab-content-claude,
#atlas-tab-content-agents {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--bg);
  z-index: 50;
  overflow-y: auto;
  overflow-x: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
}

#atlas-tab-content-builder.visible,
#atlas-tab-content-jupiter.visible,
#atlas-tab-content-mission.visible,
#atlas-tab-content-crm.visible,
#atlas-tab-content-ideas.visible,
#atlas-tab-content-produkte.visible,
#atlas-tab-content-notifications.visible,
#atlas-tab-content-finance.visible,
#atlas-tab-content-happy.visible,
#atlas-tab-content-calendar.visible,
#atlas-tab-content-claude.visible,
#atlas-tab-content-agents.visible {
  display: block;
  opacity: 1;
}

/* HAPPY tab sub-tabs (own classes so they don't collide with .builder-subtab) */
.happy-subtabs {
  display: flex;
  border-bottom: 1px solid var(--border);
  margin-bottom: 20px;
}
.happy-subtab {
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  border-bottom: 3px solid transparent;
  transition: all 0.2s;
  letter-spacing: 1px;
}
.happy-subtab:hover {
  color: var(--accent);
}
.happy-subtab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

/* ═══════════════════════════════════════════════════════════ */
/* BUILDER TAB STYLES                                          */
/* ═══════════════════════════════════════════════════════════ */

.builder-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 24px 40px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
}

.builder-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.builder-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.builder-header .builder-icon {
  font-size: 22px;
}

/* ─── Vulkan Sort/Filter/Search Toolbar ─── */
.vulkan-toolbar {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 14px;
  margin-bottom: 16px;
}

.vulkan-toolbar-row {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.vulkan-toolbar-label {
  font-size: 11px;
  color: #f0f0f5;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-right: 4px;
  white-space: nowrap;
}

.vulkan-sort-group,
.vulkan-filter-group,
.vulkan-search-group {
  display: flex;
  align-items: center;
  gap: 6px;
}

.vulkan-select {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 13px;
  font-family: inherit;
  cursor: pointer;
  outline: none;
  transition: border-color 0.2s;
}

.vulkan-select:focus {
  border-color: var(--accent);
}

.vulkan-select option {
  background: var(--bg-input);
  color: #f0f0f5;
}

.vulkan-filter-btn {
  background: var(--bg-input);
  color: #f0f0f5;
  border: 1px solid var(--border-light);
  border-radius: 6px;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}

.vulkan-filter-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.vulkan-filter-btn.active {
  background: rgba(var(--accent-rgb), 0.15);
  color: var(--accent);
  border-color: var(--accent);
}

.vulkan-search {
  background: var(--bg-input);
  color: #f0f0f5;
  border: 1px solid var(--border-light);
  border-radius: 6px;
  padding: 6px 12px;
  font-size: 13px;
  font-family: inherit;
  width: 180px;
  outline: none;
  transition: border-color 0.2s;
}

.vulkan-search:focus {
  border-color: var(--accent);
}

.vulkan-search::placeholder {
  color: var(--text-dim);
}

.vulkan-search-group {
  margin-left: auto;
}

@media (max-width: 700px) {
  .vulkan-toolbar-row {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .vulkan-sort-group,
  .vulkan-filter-group,
  .vulkan-search-group {
    flex-wrap: wrap;
  }
  .vulkan-search-group {
    margin-left: 0;
  }
  .vulkan-search {
    width: 100%;
  }
}

.builder-subtabs {
  display: flex;
  border-bottom: 1px solid var(--border);
  margin-bottom: 20px;
}

.builder-subtab {
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 600;
  color: #f0f0f5;
  cursor: pointer;
  border-bottom: 3px solid transparent;
  transition: all 0.2s;
}

.builder-subtab:hover {
  color: var(--accent);
}

.builder-subtab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

.builder-subtab .badge {
  background: var(--accent);
  color: #000;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 10px;
  margin-left: 6px;
  vertical-align: middle;
}

.builder-subtab .badge.orange {
  background: var(--status-warn);
}

.builder-progress {
  background: var(--bg-input);
  border-radius: 8px;
  height: 8px;
  margin-bottom: 20px;
  overflow: hidden;
}

.builder-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--accent-light));
  border-radius: 8px;
  transition: width 0.5s ease;
}

.builder-stats {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.builder-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 80px;
  text-align: center;
}

.builder-stat .num {
  font-size: 24px;
  font-weight: 700;
}

.builder-stat .label {
  font-size: 11px;
  color: #f0f0f5;
  margin-top: 2px;
}

.builder-stat.green .num { color: var(--status-ok); }
.builder-stat.gold .num { color: var(--accent); }
.builder-stat.red .num { color: var(--status-err); }
.builder-stat.gray .num { color: var(--text-muted); }
.builder-stat.blue .num { color: var(--status-info, #42a5f5); }
.builder-stat.red-accent .num { color: #ff1744; }

.builder-controls {
  display: flex;
  gap: 10px;
  margin-bottom: 24px;
}

.builder-btn {
  padding: 10px 22px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  flex: 1;
}

.builder-btn:active {
  transform: scale(0.96);
}

.builder-btn-runner {
  background: transparent;
  border: 2px solid var(--galaxie-eg);
  color: var(--galaxie-eg);
}

.builder-btn-runner.runner-start {
  border-color: var(--galaxie-eg);
  color: var(--galaxie-eg);
}

.builder-btn-runner.runner-stop {
  border-color: var(--status-err);
  color: var(--status-err);
}

.builder-btn-runner:disabled {
  opacity: 0.5;
  cursor: wait;
}

.builder-btn-refresh {
  background: var(--bg-card);
  color: var(--accent);
  border: 1px solid var(--accent);
}

.builder-build-item {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  transition: border-color 0.18s, background 0.18s;
}
.builder-build-item:hover {
  border-color: var(--accent);
  background: var(--bg-input);
}

.builder-build-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  flex-shrink: 0;
}

.dot-completed { background: var(--status-ok); }
.dot-pending { background: var(--accent); }
.dot-building { background: #42a5f5; animation: atlas-pulse 1.2s infinite; }
.dot-failed { background: var(--status-err); }
.dot-blocked { background: #ff1744; box-shadow: 0 0 6px rgba(255,23,68,0.5); }
.dot-skipped { background: var(--text-dim); }
.dot-auto-testing { background: #42a5f5; animation: atlas-pulse 1.2s infinite; }
.dot-manual-testing { background: var(--status-warn); animation: atlas-pulse 1.2s infinite; }
.dot-pending-manual { background: var(--status-warn); }

@keyframes atlas-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

.builder-build-info {
  flex: 1;
  min-width: 0;
}

.builder-build-name {
  font-size: 14px;
  font-weight: 600;
  color: #f0f0f5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.builder-build-meta {
  font-size: 12px;
  color: var(--text);
  margin-top: 2px;
}

.builder-build-status {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 6px;
  white-space: nowrap;
}

.s-completed { background: rgba(76, 175, 80, 0.15); color: var(--status-ok); }
.s-pending { background: rgba(var(--accent-rgb), 0.15); color: var(--accent); }
.s-building { background: rgba(66, 165, 245, 0.15); color: var(--status-info, #42a5f5); }
.s-failed { background: rgba(244, 67, 54, 0.15); color: var(--status-err); }
.s-blocked { background: rgba(255, 23, 68, 0.15); color: #ff1744; }
.s-skipped { background: rgba(136, 136, 136, 0.15); color: var(--text-muted); }
.s-manual-testing { background: rgba(255, 152, 0, 0.15); color: var(--status-warn); }

.builder-test-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: 16px;
  overflow: hidden;
}

.builder-test-header {
  padding: 16px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.builder-test-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--accent);
}

.builder-test-id {
  font-size: 13px;
  color: var(--text);
}

.builder-test-body {
  padding: 16px;
  font-size: 14px;
  line-height: 1.7;
  white-space: pre-wrap;
  word-wrap: break-word;
  max-height: 400px;
  overflow-y: auto;
  color: #f0f0f5;
}

.builder-test-body h1,
.builder-test-body h2,
.builder-test-body h3 {
  color: var(--accent);
  margin: 12px 0 6px;
  font-size: 15px;
}

.builder-test-actions {
  padding: 16px;
  border-top: 1px solid var(--border);
  display: flex;
  gap: 10px;
}

.builder-btn-ok {
  background: var(--status-ok);
  color: #fff;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 700;
  border: none;
  cursor: pointer;
  flex: 1;
  transition: transform 0.15s;
}

.builder-btn-problem {
  background: var(--status-err);
  color: #fff;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 700;
  border: none;
  cursor: pointer;
  flex: 1;
  transition: transform 0.15s;
}

.builder-btn-ok:active,
.builder-btn-problem:active {
  transform: scale(0.96);
}

.builder-fail-input {
  display: none;
  padding: 0 16px 16px;
}

.builder-fail-input.show {
  display: block;
}

.builder-fail-input textarea {
  width: 100%;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: #f0f0f5;
  padding: 12px;
  font-size: 14px;
  resize: vertical;
  min-height: 80px;
  font-family: inherit;
}

.builder-fail-input .btn-send {
  background: var(--status-err);
  color: #fff;
  padding: 10px 20px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  margin-top: 8px;
  width: 100%;
}

.builder-empty {
  text-align: center;
  padding: 60px 20px;
  color: #f0f0f5;
}

.builder-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
}

.builder-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

/* ─── Builder: "Build hinzufügen" Button + Modal ─── */
.builder-btn-add {
  margin-left: auto;
  background: var(--accent);
  color: #000;
  border: none;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: background 0.2s, transform 0.15s;
}
.builder-btn-add:hover { background: var(--accent-light); }
.builder-btn-add:active { transform: scale(0.96); }

.bam-overlay {
  position: fixed;
  inset: 0;
  z-index: 6000;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(4px);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.bam-overlay.open { display: flex; }
.bam-box {
  background: var(--bg-card);
  border: 1px solid var(--accent);
  border-radius: 14px;
  width: 720px;
  max-width: 100%;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 16px 60px rgba(0, 0, 0, 0.6);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
}
.bam-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  border-bottom: 1px solid var(--border);
}
.bam-header h3 {
  margin: 0;
  color: var(--accent);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 1px;
}
.bam-close {
  background: none;
  border: 1px solid #2a2a3a;
  color: var(--text-muted);
  width: 30px;
  height: 30px;
  border-radius: 7px;
  font-size: 15px;
  cursor: pointer;
  line-height: 1;
}
.bam-close:hover { color: var(--accent); border-color: var(--accent); }
.bam-body {
  padding: 18px 22px;
  overflow-y: auto;
}
.bam-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0 0 8px;
}
.bam-textarea {
  width: 100%;
  box-sizing: border-box;
  min-height: 380px;
  resize: vertical;
  background: var(--bg);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  color: var(--text);
  padding: 12px 14px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  line-height: 1.5;
  margin-bottom: 18px;
}
.bam-textarea:focus { outline: none; border-color: var(--accent); }
.bam-prio {
  display: flex;
  gap: 10px;
}
.bam-prio-btn {
  flex: 1;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  color: var(--text-muted);
  padding: 12px 10px;
  cursor: pointer;
  text-align: center;
  transition: all 0.18s;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.bam-prio-btn b { font-size: 13px; letter-spacing: 1px; }
.bam-prio-btn span { font-size: 10px; color: var(--text-dim); }
.bam-prio-btn:hover { border-color: var(--accent); color: var(--accent); }
.bam-prio-btn.active {
  background: rgba(var(--accent-rgb), 0.12);
  border-color: var(--accent);
  color: var(--accent);
}
.bam-prio-btn.active span { color: #c8a84a; }
.bam-rank-table {
  background: var(--bg);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  overflow: hidden;
  max-height: 220px;
  overflow-y: auto;
}
.bam-rank-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
  font-size: 12px;
  color: var(--text);
  border-bottom: 1px solid var(--border-light);
  cursor: pointer;
  transition: background 0.12s;
}
.bam-rank-row:last-child { border-bottom: none; }
.bam-rank-row:hover { background: rgba(var(--accent-rgb), 0.06); }
.bam-rank-row.active { background: rgba(var(--accent-rgb), 0.12); }
.bam-rank-row.bam-rank-existing {
  cursor: default;
  opacity: 0.7;
  background: var(--bg-card);
}
.bam-rank-row.bam-rank-existing:hover { background: var(--bg-card); }
.bam-rank-row input[type="radio"] {
  accent-color: var(--accent);
  margin: 0;
  flex-shrink: 0;
}
.bam-rank-pos {
  font-weight: 700;
  min-width: 38px;
  font-size: 11px;
  color: var(--text-muted);
}
.bam-rank-label {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bam-footer {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  padding: 16px 22px;
  border-top: 1px solid var(--border);
}
.bam-btn {
  padding: 11px 22px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
}
.bam-cancel {
  background: var(--bg-input);
  border-color: var(--border-light);
  color: var(--text-muted);
}
.bam-cancel:hover { color: var(--text); }
.bam-save {
  background: var(--accent);
  color: #000;
}
.bam-save:hover { background: var(--accent-light); }
.bam-save:disabled { opacity: 0.6; cursor: default; }

/* ─── Attachment Drop Zone ─── */
.bam-dropzone {
  border: 2px dashed rgba(var(--accent-rgb), 0.4);
  border-radius: 10px;
  padding: 20px;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s;
  margin-bottom: 14px;
  background: rgba(var(--accent-rgb), 0.03);
}
.bam-dropzone:hover,
.bam-dropzone.dragover {
  border-color: var(--accent);
  background: rgba(var(--accent-rgb), 0.08);
}
.bam-dropzone-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  pointer-events: none;
}
.bam-dropzone-icon {
  font-size: 28px;
  opacity: 0.7;
}
.bam-dropzone-text {
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 500;
}
.bam-dropzone-hint {
  color: var(--text-dim);
  font-size: 11px;
}
.bam-file-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.bam-file-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(var(--accent-rgb), 0.08);
  border: 1px solid rgba(var(--accent-rgb), 0.35);
  border-radius: 20px;
  padding: 5px 10px 5px 14px;
  font-size: 12px;
  color: var(--text);
  max-width: 260px;
}
.bam-file-chip-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--accent);
  font-weight: 500;
}
.bam-file-chip-size {
  color: var(--text-dim);
  font-size: 11px;
  flex-shrink: 0;
}
.bam-file-chip-remove {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 13px;
  padding: 0 2px;
  line-height: 1;
  flex-shrink: 0;
}
.bam-file-chip-remove:hover { color: #ff5555; }

/* ═══════════════════════════════════════════════════════════ */
/* JUPITER TAB STYLES                                          */
/* ═══════════════════════════════════════════════════════════ */

.jupiter-wrap {
  max-width: 800px;
  margin: 0 auto;
  padding: 120px 24px 40px;
  text-align: center;
}

.jupiter-icon {
  font-size: 64px;
  margin-bottom: 20px;
  opacity: 0.6;
}

.jupiter-title {
  font-size: 28px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 4px;
  margin-bottom: 12px;
}

.jupiter-subtitle {
  font-size: 15px;
  color: var(--text-muted);
  line-height: 1.6;
}

.jupiter-badge {
  display: inline-block;
  margin-top: 24px;
  padding: 8px 20px;
  border: 1px solid rgba(var(--accent-rgb), 0.3);
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  letter-spacing: 2px;
}
.jupiter-goto-vulkan {
  margin-top: 24px;
  padding: 12px 28px;
  background: var(--accent);
  color: #0a0a0f;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  letter-spacing: 0.5px;
  transition: background 0.2s;
}
.jupiter-goto-vulkan:hover { background: #e0c050; }

/* ═══════════════════════════════════════════════════════════ */
/* MISSION TAB STYLES (Build 019)                              */
/* ═══════════════════════════════════════════════════════════ */

.mission-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.mission-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.mission-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.mission-icon {
  font-size: 22px;
  color: var(--accent);
}

.mission-version {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: auto;
  letter-spacing: 1px;
}

.mission-stats {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.mission-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 80px;
  text-align: center;
}

.mission-stat .num {
  font-size: 24px;
  font-weight: 700;
  color: var(--text);
}

.mission-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.mission-stat.green .num { color: var(--status-ok); }
.mission-stat.gold .num { color: var(--accent); }
.mission-stat.blue .num { color: var(--status-info, #42a5f5); }

.mission-controls {
  display: flex;
  gap: 10px;
  margin-bottom: 24px;
}

.mission-btn {
  padding: 10px 22px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.mission-btn:active {
  transform: scale(0.96);
}

.mission-btn-refresh {
  background: var(--bg-card);
  color: var(--accent);
  border: 1px solid var(--accent);
  flex: 1;
}

.mission-btn-open {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb), 0.3);
  flex: 1;
  justify-content: center;
}

.mission-btn-open:hover {
  background: rgba(var(--accent-rgb), 0.2);
  color: var(--accent-light);
}

.mission-project-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  margin-bottom: 16px;
  overflow: hidden;
  transition: border-color 0.3s;
}

.mission-project-card.running {
  border-color: rgba(76, 175, 80, 0.3);
}

.mission-project-header {
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--border);
}

.mission-project-info {
  flex: 1;
  min-width: 0;
}

.mission-project-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--accent);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mission-project-key {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 2px;
  font-family: 'JetBrains Mono', monospace;
}

.mission-project-status {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 20px;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
}

.mission-project-status .status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}

.s-running {
  background: rgba(76, 175, 80, 0.15);
  color: var(--status-ok);
}

.s-running .status-dot {
  background: var(--status-ok);
  animation: atlas-pulse 1.2s infinite;
}

.s-idle {
  background: rgba(136, 136, 136, 0.15);
  color: var(--text-muted);
}

.s-idle .status-dot {
  background: var(--text-dim);
}

.mission-project-stats {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1px;
  padding: 0;
  background: var(--bg-input);
}

.mission-pstat {
  background: var(--bg-card);
  padding: 10px 8px;
  text-align: center;
}

.mission-pstat .val {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
}

.mission-pstat .lbl {
  display: block;
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 2px;
}

.mission-project-setup {
  padding: 10px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.mission-setup-bar {
  flex: 1;
  background: var(--bg-input);
  border-radius: 4px;
  height: 4px;
  overflow: hidden;
}

.mission-setup-fill {
  height: 100%;
  background: var(--accent);
  border-radius: 4px;
  transition: width 0.5s ease;
}

.mission-setup-label {
  font-size: 11px;
  color: var(--text-muted);
  white-space: nowrap;
}

.mission-project-actions {
  padding: 10px 16px 12px;
  display: flex;
  gap: 8px;
}

.mission-act-btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.mission-act-btn:active {
  transform: scale(0.96);
}

.mission-act-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.mission-act-start {
  background: var(--status-ok);
  color: #fff;
  flex: 1;
}

.mission-act-start:hover:not(:disabled) {
  background: #66bb6a;
}

.mission-act-stop {
  background: var(--status-err);
  color: #fff;
  flex: 1;
}

.mission-act-stop:hover:not(:disabled) {
  background: var(--status-err);
}

.mission-act-log {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.mission-act-log:hover {
  background: var(--bg-input);
  border-color: var(--accent);
}

.mission-log-panel {
  border-top: 1px solid var(--border);
  background: var(--bg-deep);
  max-height: 400px;
  overflow-y: auto;
}

.mission-log-content {
  padding: 0;
}

.mission-log-efficiency {
  padding: 10px 16px;
  font-size: 13px;
  color: var(--text-muted);
  border-bottom: 1px solid var(--border);
}

.mission-log-efficiency strong {
  color: var(--accent);
}

.mission-log-entry {
  padding: 8px 16px;
  border-bottom: 1px solid #111;
  transition: background 0.15s;
}

.mission-log-entry:hover {
  background: rgba(var(--accent-rgb), 0.03);
}

.mission-log-entry.log-error {
  border-left: 3px solid #f44336;
}

.mission-log-entry.log-warning {
  border-left: 3px solid var(--status-warn);
}

.mission-log-entry.log-success {
  border-left: 3px solid #4caf50;
}

.mission-log-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 4px;
}

.mission-log-icon {
  font-size: 13px;
}

.mission-log-time {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
}

.mission-log-sprint {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
}

.mission-log-mode {
  color: var(--text-dim);
  font-size: 11px;
}

.mission-log-prompt {
  font-size: 13px;
  color: var(--text);
  line-height: 1.4;
  word-wrap: break-word;
}

.mission-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.mission-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: 0.5;
}

.mission-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

/* ═══════════════════════════════════════════════════════════ */
/* CRM TAB STYLES (Build 032)                                  */
/* ═══════════════════════════════════════════════════════════ */

.crm-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.crm-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.crm-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.crm-icon {
  font-size: 22px;
  color: var(--accent);
}

.crm-version {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: auto;
  letter-spacing: 1px;
}

/* CRM Stats Row */
.crm-stats-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.crm-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 100px;
  text-align: center;
}

.crm-stat .num {
  font-size: 20px;
  font-weight: 700;
  color: var(--text);
}

.crm-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.crm-stat.green .num { color: var(--status-ok); }
.crm-stat.gold .num { color: var(--accent); }
.crm-stat.blue .num { color: var(--status-info, #42a5f5); }

/* CRM Sub-tabs */
.crm-subtabs {
  display: flex;
  border-bottom: 1px solid var(--border);
  margin-bottom: 20px;
}

.crm-subtab {
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  border-bottom: 3px solid transparent;
  transition: all 0.2s;
}

.crm-subtab:hover {
  color: var(--accent);
}

.crm-subtab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

/* CRM Toolbar */
.crm-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.crm-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  min-width: 0;
  overflow-x: auto;
}

.crm-breadcrumb-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--accent);
  width: 32px;
  height: 32px;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background 0.2s;
}

.crm-breadcrumb-btn:hover {
  background: var(--bg-input);
}

.crm-breadcrumb-item {
  font-size: 13px;
  color: var(--text-muted);
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  background: none;
  border: none;
  transition: color 0.2s;
  white-space: nowrap;
}

.crm-breadcrumb-item:hover {
  color: var(--accent);
}

.crm-breadcrumb-item.active {
  color: var(--accent);
  font-weight: 600;
}

.crm-breadcrumb-sep {
  color: var(--text-dim);
  font-size: 14px;
}

.crm-breadcrumb-current {
  font-size: 13px;
  color: var(--text);
  font-weight: 600;
  white-space: nowrap;
}

.crm-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.crm-search {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  color: var(--text);
  padding: 8px 12px;
  font-size: 13px;
  width: 180px;
  transition: border-color 0.2s;
  font-family: inherit;
}

.crm-search:focus {
  outline: none;
  border-color: var(--accent);
}

.crm-search::placeholder {
  color: var(--text-dim);
}

.crm-btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.crm-btn:active {
  transform: scale(0.96);
}

.crm-btn-add {
  background: var(--accent);
  color: #000;
}

.crm-btn-add:hover {
  background: var(--accent-light);
}

.crm-btn-refresh {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.crm-btn-refresh:hover {
  border-color: var(--accent);
}

/* CRM Cards */
.crm-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 8px;
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
}

.crm-card:hover {
  border-color: rgba(var(--accent-rgb), 0.3);
  background: #181818;
}

.crm-card-header {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.crm-card-icon {
  font-size: 20px;
  flex-shrink: 0;
  width: 32px;
  text-align: center;
}

.crm-card-info {
  flex: 1;
  min-width: 0;
}

.crm-card-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.crm-card-title.done {
  text-decoration: line-through;
  color: var(--text-muted);
}

.crm-card-meta {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.crm-card-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.crm-action-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  width: 28px;
  height: 28px;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.crm-action-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.crm-action-btn.danger:hover {
  color: var(--status-err);
  border-color: var(--status-err);
}

.crm-card-arrow {
  font-size: 20px;
  color: var(--text-dim);
  flex-shrink: 0;
  margin-left: 4px;
}

/* Task-specific */
.crm-task-card {
  cursor: default;
}

.crm-task-card:hover {
  border-color: var(--border-light);
  background: #161616;
}

.crm-task-status-btn {
  background: none;
  border: none;
  font-size: 18px;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}

.crm-task-desc {
  padding: 0 16px 12px 60px;
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.5;
}

.crm-timer-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--status-ok);
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}

.crm-timer-btn:hover {
  border-color: var(--status-ok);
}

.crm-timer-btn.active {
  background: rgba(244, 67, 54, 0.1);
  border-color: var(--status-err);
  color: var(--status-err);
  animation: atlas-pulse 1.2s infinite;
}

/* Timer Widget (in Time sub-tab) */
.crm-timer-widget {
  margin-bottom: 20px;
}

.crm-timer-idle {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
  text-align: center;
  color: var(--text-dim);
  font-size: 13px;
}

.crm-timer-active {
  background: var(--bg-card);
  border: 1px solid rgba(76, 175, 80, 0.3);
  border-radius: 10px;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.crm-timer-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--status-ok);
  animation: atlas-pulse 1.2s infinite;
  flex-shrink: 0;
}

.crm-timer-info {
  flex: 1;
}

.crm-timer-task {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
}

.crm-timer-time {
  font-size: 24px;
  font-weight: 700;
  color: var(--status-ok);
  font-family: 'JetBrains Mono', monospace;
  margin-top: 4px;
}

.crm-timer-stop-btn {
  background: var(--status-err);
  color: #fff;
  border: none;
  padding: 10px 20px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: transform 0.15s;
}

.crm-timer-stop-btn:active {
  transform: scale(0.96);
}

/* Invoice Filters */
.crm-invoice-filters {
  display: flex;
  gap: 6px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.crm-inv-filter-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.crm-inv-filter-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.crm-inv-filter-btn.active {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border-color: var(--accent);
}

/* Invoice Cards */
.crm-invoice-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 8px;
  overflow: hidden;
}

.crm-invoice-header {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--border);
}

.crm-invoice-number {
  font-size: 15px;
  font-weight: 700;
  color: var(--accent);
  font-family: 'JetBrains Mono', monospace;
}

.crm-invoice-status {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 12px;
}

.crm-invoice-body {
  padding: 14px 16px;
}

.crm-invoice-amount {
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 4px;
}

.crm-invoice-meta {
  font-size: 12px;
  color: var(--text-muted);
}

/* Time Entries Table */
.crm-time-header-row {
  display: flex;
  padding: 10px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px 8px 0 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.crm-time-row {
  display: flex;
  padding: 12px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-top: none;
  font-size: 13px;
  color: var(--text);
  transition: background 0.15s;
}

.crm-time-row:last-child {
  border-radius: 0 0 8px 8px;
}

.crm-time-row:hover {
  background: #181818;
}

.crm-time-col {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm-time-col.num {
  text-align: right;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
  flex: 0 0 80px;
}

/* CRM Empty State */
.crm-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.crm-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: 0.5;
}

.crm-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

/* CRM Modal */
.crm-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(4px);
}

.crm-modal {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 12px;
  width: 480px;
  max-width: 90vw;
  max-height: 85vh;
  overflow-y: auto;
}

.crm-modal-header {
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.crm-modal-header h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: var(--accent);
}

.crm-modal-close {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 20px;
  cursor: pointer;
  padding: 4px;
  line-height: 1;
}

.crm-modal-close:hover {
  color: var(--text);
}

.crm-form-group {
  padding: 12px 20px 0;
}

.crm-form-group label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  margin-bottom: 6px;
  letter-spacing: 0.5px;
}

.crm-input {
  width: 100%;
  background: var(--bg);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  color: var(--text);
  padding: 10px 12px;
  font-size: 14px;
  font-family: inherit;
  transition: border-color 0.2s;
  box-sizing: border-box;
}

.crm-input:focus {
  outline: none;
  border-color: var(--accent);
}

textarea.crm-input {
  resize: vertical;
  min-height: 60px;
}

select.crm-input {
  appearance: auto;
}

.crm-form-actions {
  padding: 16px 20px;
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}

.crm-btn-cancel {
  background: var(--bg-input);
  color: var(--text-muted);
  border: 1px solid var(--border-light);
}

.crm-btn-cancel:hover {
  color: var(--text);
}

.crm-btn-save {
  background: var(--accent);
  color: #000;
}

.crm-btn-save:hover {
  background: var(--accent-light);
}

/* ═══════════════════════════════════════════════════════════ */
/* IDEAS KANBAN (Build 022)                                    */
/* ═══════════════════════════════════════════════════════════ */

.ideas-wrap {
  max-width: 100%;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.ideas-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.ideas-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.ideas-icon { font-size: 22px; }

.ideas-version {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: auto;
  letter-spacing: 1px;
}

.ideas-stats-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.ideas-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 80px;
  text-align: center;
}

.ideas-stat .num {
  font-size: 22px;
  font-weight: 700;
  color: var(--accent, #e0e0e0);
}

.ideas-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.ideas-stat.score .num { color: var(--accent); }

.ideas-toolbar {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.ideas-subtabs { display: flex; gap: 2px; }

.ideas-subtab {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  border: 1px solid var(--border-light);
  border-radius: 6px;
  background: var(--bg-input);
  transition: all 0.2s;
}

.ideas-subtab:hover { color: var(--accent); border-color: var(--accent); }

.ideas-subtab.active {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
  border-color: var(--accent);
}

.ideas-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.ideas-filter-group { display: flex; gap: 2px; }

.ideas-filter-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.ideas-filter-btn:hover { color: var(--accent); border-color: var(--accent); }

.ideas-filter-btn.active {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border-color: var(--accent);
}

.ideas-search {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  color: var(--text);
  padding: 8px 12px;
  font-size: 13px;
  width: 200px;
  transition: border-color 0.2s;
  font-family: inherit;
}

.ideas-search:focus { outline: none; border-color: var(--accent); }
.ideas-search::placeholder { color: var(--text-dim); }

.ideas-btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.ideas-btn:active { transform: scale(0.96); }
.ideas-btn-add { background: var(--accent); color: #000; }
.ideas-btn-add:hover { background: var(--accent-light); }

.ideas-btn-refresh {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.ideas-btn-refresh:hover { border-color: var(--accent); }

/* Kanban Board */
.ideas-kanban {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  padding-bottom: 20px;
  min-height: 400px;
}

.kanban-column {
  flex: 1;
  min-width: 240px;
  max-width: 340px;
  display: flex;
  flex-direction: column;
}

.kanban-column-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-top: 3px solid;
  border-radius: 10px 10px 0 0;
}

.kanban-column-icon { font-size: 16px; }

.kanban-column-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.5px;
  flex: 1;
}

.kanban-column-count {
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 10px;
  min-width: 20px;
  text-align: center;
}

.kanban-column-body {
  flex: 1;
  background: #0f0f0f;
  border: 1px solid var(--border);
  border-top: none;
  border-radius: 0 0 10px 10px;
  padding: 8px;
  min-height: 200px;
  transition: background 0.2s, border-color 0.2s;
}

.kanban-column-body.drag-over {
  background: rgba(var(--accent-rgb), 0.05);
  border-color: rgba(var(--accent-rgb), 0.3);
}

.kanban-empty-hint {
  color: var(--text-dim);
  font-size: 12px;
  text-align: center;
  padding: 40px 10px;
  font-style: italic;
}

.kanban-card {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 8px;
  cursor: grab;
  transition: transform 0.15s, box-shadow 0.15s, opacity 0.15s, border-color 0.2s;
  user-select: none;
}

.kanban-card:hover {
  border-color: rgba(var(--accent-rgb), 0.3);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.kanban-card:active { cursor: grabbing; }
.kanban-card.dragging { opacity: 0.4; transform: scale(0.95); }

.kanban-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.ideas-firma-badge {
  color: #000;
  font-size: 10px;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 4px;
  letter-spacing: 0.5px;
}

.kanban-card-score {
  font-size: 12px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  min-width: 24px;
  text-align: center;
}

.kanban-card-score.high { background: rgba(76, 175, 80, 0.15); color: var(--status-ok); }
.kanban-card-score.medium { background: rgba(255, 152, 0, 0.15); color: var(--status-warn); }
.kanban-card-score.low { background: rgba(136, 136, 136, 0.15); color: var(--text-muted); }

.kanban-card-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.3;
  margin-bottom: 6px;
  word-wrap: break-word;
}

.kanban-card-desc {
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.4;
  margin-bottom: 8px;
  word-wrap: break-word;
}

.kanban-card-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.kanban-synergy-tag {
  font-size: 10px;
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
  padding: 2px 6px;
  border-radius: 4px;
  white-space: nowrap;
}

.kanban-assignee { font-size: 11px; color: var(--text-muted); }

.kanban-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--border);
  padding-top: 8px;
  margin-top: 4px;
}

.kanban-card-date { font-size: 11px; color: var(--text-dim); }
.kanban-card-actions { display: flex; gap: 4px; }

.kanban-act-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  width: 24px;
  height: 24px;
  border-radius: 4px;
  font-size: 11px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  padding: 0;
}

.kanban-act-btn:hover { color: var(--accent); border-color: var(--accent); }
.kanban-act-btn.danger:hover { color: var(--status-err); border-color: var(--status-err); }

/* Synergy Map */
.synergy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 16px;
}

.synergy-group-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: border-color 0.2s;
}

.synergy-group-card:hover { border-color: rgba(var(--accent-rgb), 0.3); }

.synergy-group-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
  background: rgba(var(--accent-rgb), 0.03);
}

.synergy-group-icon { font-size: 18px; }

.synergy-group-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--accent);
  flex: 1;
}

.synergy-group-count {
  font-size: 12px;
  color: var(--text-muted);
  background: var(--bg-input);
  padding: 3px 10px;
  border-radius: 10px;
}

.synergy-group-items { padding: 8px 16px; }

.synergy-item {
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}

.synergy-item:last-child { border-bottom: none; }

.synergy-item-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.synergy-item-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
}

.synergy-item-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
}

.synergy-group-footer {
  padding: 10px 16px;
  background: rgba(var(--accent-rgb), 0.03);
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--text-muted);
}

.synergy-group-footer strong { color: var(--accent); }

.ideas-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.ideas-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: 0.5;
}

.ideas-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

/* ═══════════════════════════════════════════════════════════ */
/* TOAST                                                       */
/* ═══════════════════════════════════════════════════════════ */

#atlas-tab-toast {
  position: fixed;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--accent);
  color: #000;
  padding: 12px 24px;
  border-radius: 10px;
  font-weight: 600;
  font-size: 14px;
  z-index: 200;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none;
}

#atlas-tab-toast.show {
  opacity: 1;
}

/* ═══════════════════════════════════════════════════════════ */
/* MOBILE: hide tab bar (mobile uses swipe panels)             */
/* ═══════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  #atlas-tab-bar,
  #atlas-nav-open,
  #atlas-nav-backdrop {
    display: none !important;
  }
  /* Tab-Content-Container werden von mobile.css per [id^="atlas-tab-content-"]
     versteckt und von bottom-nav.css per body.bnav-main-tab-active + .visible
     wieder eingeblendet. Keine ID-basierten Regeln hier — die hoehere
     Spezifitaet (1,0,0) blockierte den bottom-nav-Override (0,2,1). */
}

/* CRM + Ideas responsive */
@media (max-width: 900px) and (min-width: 769px) {
  .mission-project-stats {
    grid-template-columns: repeat(3, 1fr);
  }
  .produkte-stats-row, .crm-stats-row, .ideas-stats-row {
    flex-wrap: wrap;
  }
  .crm-stat, .ideas-stat {
    min-width: 120px;
  }
  .crm-toolbar, .ideas-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
  .crm-toolbar-right, .ideas-toolbar-right {
    justify-content: flex-end;
  }
  .crm-search, .ideas-search {
    flex: 1;
  }
  .ideas-kanban {
    flex-direction: column;
  }
  .kanban-column {
    max-width: none;
    min-width: auto;
  }
}

@media (min-width: 769px) and (max-width: 1200px) {
  .ideas-kanban {
    flex-wrap: wrap;
  }
  .kanban-column {
    min-width: 200px;
    flex: 1 1 calc(33.3% - 16px);
  }
}

/* ═══════════════════════════════════════════════════════════ */
/* Build 033: Sammelrechnungen + PDF-Export                    */
/* ═══════════════════════════════════════════════════════════ */

.crm-btn-sammel {
  background: var(--accent);
  color: #000;
  margin-right: auto;
  font-weight: 700;
}

.crm-btn-sammel:hover {
  background: var(--accent-light);
}

.crm-btn-pdf {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--accent);
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}

.crm-btn-pdf:hover {
  background: rgba(var(--accent-rgb), 0.1);
  border-color: var(--accent);
}

.crm-invoice-client {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 4px;
}

.crm-invoice-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px 12px;
  border-top: 1px solid var(--border);
}

.crm-modal-wide {
  width: 90%;
  max-width: 700px;
}

.sammel-step {
  padding: 16px 20px;
}

.sammel-step-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 16px;
  letter-spacing: 0.5px;
}

.sammel-date-row {
  display: flex;
  gap: 12px;
}

.sammel-date-row .crm-form-group {
  flex: 1;
  padding: 12px 0 0;
}

.sammel-summary-bar {
  background: rgba(var(--accent-rgb), 0.08);
  border: 1px solid rgba(var(--accent-rgb), 0.2);
  border-radius: 8px;
  padding: 10px 16px;
  font-size: 13px;
  color: var(--accent);
  font-weight: 600;
  margin-bottom: 12px;
}

.sammel-entries {
  max-height: 350px;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 16px;
}

.sammel-select-all {
  padding: 10px 14px;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
}

.sammel-check-label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.sammel-check-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--accent);
  cursor: pointer;
  flex-shrink: 0;
}

.sammel-group {
  border-bottom: 1px solid var(--border);
}

.sammel-group:last-child {
  border-bottom: none;
}

.sammel-group-header {
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  background: var(--bg-card);
}

.sammel-entry {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  background: var(--bg-card);
  border-top: 1px solid var(--border);
  transition: background 0.15s;
}

.sammel-entry:hover {
  background: #181818;
}

.sammel-entry-info {
  flex: 1;
  min-width: 0;
}

.sammel-entry-main {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}

.sammel-entry-date {
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  flex-shrink: 0;
}

.sammel-entry-user {
  color: var(--status-info, #42a5f5);
  font-weight: 600;
  font-size: 12px;
  flex-shrink: 0;
}

.sammel-entry-desc {
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sammel-entry-meta {
  font-size: 11px;
  color: var(--text-dim);
  margin-top: 2px;
}

.sammel-entry-hours {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  flex-shrink: 0;
  min-width: 50px;
  text-align: right;
}

.sammel-group-total {
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
  text-align: right;
  background: var(--bg-card);
  font-family: 'JetBrains Mono', monospace;
}

.sammel-config {
  margin-bottom: 12px;
}

.sammel-config-row {
  display: flex;
  gap: 12px;
}

.sammel-config-row .crm-form-group {
  flex: 1;
  padding: 8px 0 0;
}

.sammel-config > .crm-form-group {
  padding: 8px 0 0;
}

.sammel-total {
  margin-bottom: 16px;
}

.sammel-total-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 14px 16px;
  font-size: 14px;
  color: var(--text);
}

.sammel-total-amount {
  font-size: 22px;
  font-weight: 700;
  color: var(--accent);
  font-family: 'JetBrains Mono', monospace;
}

@media (max-width: 768px) {
  .sammel-date-row,
  .sammel-config-row {
    flex-direction: column;
    gap: 0;
  }
  .sammel-entry-main {
    flex-wrap: wrap;
  }
  .crm-modal-wide {
    width: 95%;
  }
}


/* ═══════════════════════════════════════════════════════════ */
/* PRODUKTE TAB STYLES (Build 044)                             */
/* ═══════════════════════════════════════════════════════════ */

.produkte-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.produkte-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.produkte-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.produkte-icon {
  font-size: 22px;
  color: var(--accent);
}

.produkte-version {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: auto;
  letter-spacing: 1px;
}

/* Stats Row */
.produkte-stats-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.produkte-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 100px;
  text-align: center;
}

.produkte-stat .num {
  font-size: 20px;
  font-weight: 700;
  color: var(--text);
}

.produkte-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.produkte-stat.green .num { color: var(--status-ok); }
.produkte-stat.gold .num { color: var(--accent); }
.produkte-stat.blue .num { color: var(--status-info, #42a5f5); }

/* Toolbar */
.produkte-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.produkte-toolbar-left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  flex-wrap: wrap;
}

.produkte-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.produkte-search {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  color: var(--text);
  padding: 8px 12px;
  font-size: 13px;
  width: 200px;
  transition: border-color 0.2s;
  font-family: inherit;
}

.produkte-search:focus {
  outline: none;
  border-color: var(--accent);
}

.produkte-search::placeholder {
  color: var(--text-dim);
}

.produkte-select {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  color: var(--text);
  padding: 8px 12px;
  font-size: 13px;
  font-family: inherit;
  cursor: pointer;
  transition: border-color 0.2s;
}

.produkte-select:focus {
  outline: none;
  border-color: var(--accent);
}

.produkte-btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.produkte-btn:active {
  transform: scale(0.96);
}

.produkte-btn-add {
  background: var(--accent);
  color: #000;
}

.produkte-btn-add:hover {
  background: var(--accent-light);
}

.produkte-btn-refresh {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.produkte-btn-refresh:hover {
  border-color: var(--accent);
}

.produkte-btn-compare {
  background: var(--bg-input);
  color: var(--status-info, #42a5f5);
  border: 1px solid #42a5f5;
}

.produkte-btn-compare:hover {
  background: rgba(66, 165, 245, 0.1);
}

/* Grid */
.produkte-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 16px;
}

/* Cards */
.produkte-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.produkte-card:hover {
  border-color: var(--accent);
  background: var(--bg-input);
}

.produkte-card.comparing {
  border-color: var(--status-info, #42a5f5);
  box-shadow: 0 0 0 1px rgba(66, 165, 245, 0.3);
}

.produkte-card-header {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.produkte-card-cat-icon {
  font-size: 24px;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(var(--accent-rgb), 0.1);
  border-radius: 8px;
}

.produkte-card-titles {
  flex: 1;
  min-width: 0;
}

.produkte-card-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.produkte-card-manufacturer {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 2px;
}

.produkte-compare-check {
  cursor: pointer;
  font-size: 16px;
  color: var(--text-dim);
  flex-shrink: 0;
  padding: 2px;
  transition: color 0.2s;
}

.produkte-compare-check:hover {
  color: var(--status-info, #42a5f5);
}

.produkte-compare-check.checked {
  color: var(--status-info, #42a5f5);
}

.produkte-card-body {
  flex: 1;
}

.produkte-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}

.produkte-tag {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid;
}

.produkte-tag.cat {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb), 0.3);
}

.produkte-tag.segment {
  background: rgba(156, 39, 176, 0.1);
  color: #ce93d8;
  border-color: rgba(156, 39, 176, 0.3);
}

.produkte-card-price {
  font-size: 13px;
  font-weight: 600;
  color: var(--accent);
  margin-bottom: 4px;
}

.produkte-card-pros {
  font-size: 12px;
  color: var(--status-ok);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.produkte-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.produkte-card-date {
  font-size: 11px;
  color: var(--text-dim);
}

.produkte-card-arrow {
  color: var(--accent);
  font-size: 14px;
}

/* Empty state */
.produkte-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.produkte-empty .icon {
  font-size: 48px;
  margin-bottom: 16px;
}

.produkte-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-muted);
  font-size: 14px;
}

/* Detail View */
.produkte-detail {
  max-width: 900px;
  margin: 0 auto;
}

.produkte-back-btn {
  background: none;
  border: 1px solid var(--border-light);
  color: var(--accent);
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  margin-bottom: 20px;
  transition: all 0.2s;
}

.produkte-back-btn:hover {
  border-color: var(--accent);
  background: rgba(var(--accent-rgb), 0.05);
}

.produkte-detail-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 32px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
}

.produkte-detail-icon {
  font-size: 36px;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(var(--accent-rgb), 0.1);
  border-radius: 12px;
  flex-shrink: 0;
}

.produkte-detail-name {
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
  margin: 0;
}

.produkte-detail-sub {
  font-size: 14px;
  color: var(--text-muted);
  margin-top: 4px;
}

.produkte-detail-avail {
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  margin-left: auto;
  flex-shrink: 0;
}

.produkte-detail-section {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 16px;
}

.produkte-detail-section h4 {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  margin: 0 0 14px 0;
  letter-spacing: 1px;
}

.produkte-specs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.produkte-spec-item {
  padding: 8px 12px;
  background: var(--bg-input);
  border-radius: 6px;
}

.spec-key {
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 2px;
}

.spec-val {
  font-size: 14px;
  color: var(--text);
  font-weight: 600;
}

.produkte-pro-con-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.produkte-pro-col ul,
.produkte-con-col ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.produkte-pro-col li,
.produkte-con-col li {
  font-size: 13px;
  padding: 6px 0;
  border-bottom: 1px solid var(--border);
}

.produkte-pro-col li.pro { color: var(--status-ok); }
.produkte-con-col li.con { color: var(--status-warn); }

.produkte-variants-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.produkte-variant-card {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  padding: 12px;
}

.variant-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 4px;
}

.variant-price {
  font-size: 13px;
  color: var(--accent);
  font-weight: 600;
  margin-bottom: 6px;
}

.variant-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.variant-spec {
  font-size: 11px;
  color: var(--text-muted);
  background: var(--bg-input);
  padding: 2px 6px;
  border-radius: 3px;
}

.produkte-ai-text,
.produkte-ai-recommendation {
  font-size: 14px;
  color: var(--text);
  line-height: 1.6;
  white-space: pre-wrap;
}

.produkte-ai-recommendation {
  background: rgba(var(--accent-rgb), 0.05);
  border-left: 3px solid var(--accent);
  padding: 12px 16px;
  border-radius: 0 6px 6px 0;
}

.produkte-compat-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.produkte-compat-tag {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 12px;
  color: var(--text);
}

.produkte-meta {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
}

.meta-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.meta-label {
  font-size: 11px;
  color: var(--text-muted);
}

.meta-value {
  font-size: 13px;
  color: var(--text);
}

.meta-link {
  font-size: 13px;
  color: var(--status-info, #42a5f5);
  text-decoration: none;
}

.meta-link:hover {
  text-decoration: underline;
}

/* Compare View */
.produkte-compare {
  max-width: 100%;
  overflow-x: auto;
}

.produkte-compare-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--accent);
  margin: 0 0 20px 0;
}

.produkte-compare-grid {
  display: grid;
  gap: 1px;
  background: var(--bg-input);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}

.compare-label {
  background: var(--bg-input);
  padding: 12px 16px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
  display: flex;
  align-items: center;
}

.compare-header {
  background: var(--bg-card);
  padding: 16px;
  text-align: center;
  border-bottom: 2px solid var(--accent);
}

.compare-product-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
}

.compare-product-mfr {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 4px;
}

.compare-cell {
  background: #0f0f0f;
  padding: 12px 16px;
  font-size: 13px;
  color: var(--text);
  display: flex;
  align-items: center;
}

.compare-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.compare-list li {
  font-size: 12px;
  padding: 2px 0;
}

.compare-list li.pro { color: var(--status-ok); }
.compare-list li.con { color: var(--status-warn); }

/* Auto-Refresh Label */
.produkte-auto-refresh {
  text-align: center;
  font-size: 11px;
  color: var(--text-dim);
  padding: 16px;
  margin-top: 20px;
}

/* Responsive */
@media (max-width: 768px) {
  .produkte-grid {
    grid-template-columns: 1fr;
  }

  .produkte-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .produkte-toolbar-left {
    flex-direction: column;
  }

  .produkte-search {
    width: 100%;
  }

  .produkte-select {
    width: 100%;
  }

  .produkte-toolbar-right {
    justify-content: stretch;
  }

  .produkte-toolbar-right .produkte-btn {
    flex: 1;
  }

  .produkte-pro-con-grid {
    grid-template-columns: 1fr;
  }

  .produkte-detail-header {
    flex-direction: column;
    align-items: flex-start;
  }

  .produkte-detail-avail {
    margin-left: 0;
  }

  .produkte-compare-grid {
    min-width: 600px;
  }
}

/* ═══════════════════════════════════════════════════════════ */
/* NOTIFICATIONS TAB STYLES (Build 094)                        */
/* ═══════════════════════════════════════════════════════════ */

.notif-wrap {
  max-width: 900px;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.notif-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.notif-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.notif-icon {
  font-size: 22px;
  color: var(--accent);
}

.notif-version {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: auto;
  letter-spacing: 1px;
}

.notif-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.notif-toolbar-left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
}

.notif-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.notif-filter-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.notif-filter-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.notif-filter-btn.active {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border-color: var(--accent);
}

.notif-btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.notif-btn:active {
  transform: scale(0.96);
}

.notif-btn-dismiss-all {
  background: var(--bg-input);
  color: var(--text-muted);
  border: 1px solid var(--border-light);
}

.notif-btn-dismiss-all:hover {
  color: var(--status-err);
  border-color: var(--status-err);
}

.notif-btn-refresh {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.notif-btn-refresh:hover {
  border-color: var(--accent);
}

.notif-stats-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.notif-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 80px;
  text-align: center;
}

.notif-stat .num {
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
}

.notif-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.notif-stat.red .num { color: var(--status-err); }
.notif-stat.gold .num { color: var(--accent); }
.notif-stat.blue .num { color: var(--status-info, #42a5f5); }

.notif-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 8px;
  transition: border-color 0.2s, background 0.2s;
  overflow: hidden;
}

.notif-card:hover {
  border-color: var(--border-light);
  background: #181818;
}

.notif-card.unread {
  border-left: 3px solid var(--accent);
}

.notif-card-header {
  padding: 14px 16px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.notif-type-icon {
  font-size: 20px;
  flex-shrink: 0;
  width: 28px;
  text-align: center;
  margin-top: 2px;
}

.notif-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 5px;
}

.notif-dot.unread {
  background: var(--accent);
  box-shadow: 0 0 6px rgba(var(--accent-rgb), 0.4);
}

.notif-dot.read {
  background: var(--border-light);
}

.notif-card-info {
  flex: 1;
  min-width: 0;
}

.notif-card-title {
  font-size: 15px;
  color: var(--text);
  line-height: 1.3;
  word-wrap: break-word;
}

.notif-card.unread .notif-card-title {
  font-weight: 700;
}

.notif-card-message {
  font-size: 13px;
  color: var(--text-muted);
  margin-top: 6px;
  line-height: 1.5;
  word-wrap: break-word;
}

.notif-card-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  font-size: 12px;
  color: var(--text-dim);
}

.notif-priority-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.notif-priority-badge.high { background: var(--status-err); }
.notif-priority-badge.medium { background: var(--status-warn); }
.notif-priority-badge.low { background: var(--text-dim); }

.notif-type-badge {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(66, 165, 245, 0.15);
  color: var(--status-info, #42a5f5);
}

.notif-card-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.notif-dismiss-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  width: 28px;
  height: 28px;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.notif-dismiss-btn:hover {
  color: var(--status-ok);
  border-color: var(--status-ok);
}

.notif-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.notif-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: 0.5;
}

.notif-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

#atlas-tab-bar .tab-badge.red {
  background: var(--status-err);
}

/* ═══════════════════════════════════════════════════════════ */
/* FINANCE PANEL (Build 093)                                   */
/* ═══════════════════════════════════════════════════════════ */

.finance-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.finance-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.finance-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.finance-icon {
  font-size: 22px;
}

.finance-version {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: auto;
  letter-spacing: 1px;
}

.finance-cards {
  display: flex;
  gap: 12px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}

.finance-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px 20px;
  flex: 1;
  min-width: 140px;
  text-align: center;
}

.finance-card.overdue {
  border-color: rgba(244, 67, 54, 0.3);
}

.finance-card-label {
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 6px;
  letter-spacing: 0.5px;
}

.finance-card-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--text);
}

.finance-card-value.gold { color: var(--accent); }
.finance-card-value.red { color: var(--status-err); }
.finance-card-value.green { color: var(--status-ok); }

.finance-section-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 1px;
  margin-bottom: 12px;
}

.finance-table {
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}

.finance-table-header {
  display: flex;
  padding: 10px 16px;
  background: var(--bg-input);
  font-size: 11px;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 1px;
  border-bottom: 1px solid var(--border);
}

.finance-table-row {
  display: flex;
  padding: 12px 16px;
  background: var(--bg-card);
  font-size: 13px;
  color: var(--text);
  border-bottom: 1px solid var(--border);
  transition: background 0.15s;
  align-items: center;
}

.finance-table-row:last-child {
  border-bottom: none;
}

.finance-table-row:hover {
  background: #181818;
}

.finance-table-row.overdue {
  border-left: 3px solid #f44336;
}

.finance-col {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.finance-col-sender { flex: 2; }
.finance-col-ref { flex: 2; }
.finance-col-amount {
  flex: 1.2;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
  text-align: right;
}
.finance-col-due {
  flex: 1;
  text-align: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
}
.finance-col-status { flex: 1; text-align: center; }
.finance-col-action { flex: 0 0 40px; text-align: center; }

.finance-status-open {
  background: rgba(var(--accent-rgb), 0.15);
  color: var(--accent);
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
}

.finance-status-overdue {
  background: rgba(244, 67, 54, 0.15);
  color: var(--status-err);
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
}

.finance-paid-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--status-ok);
  width: 28px;
  height: 28px;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.finance-paid-btn:hover {
  background: rgba(76, 175, 80, 0.1);
  border-color: var(--status-ok);
}

.finance-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-muted);
  font-size: 14px;
}

.finance-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.finance-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: 0.5;
}

.finance-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
  margin-top: 16px;
}

@media (max-width: 768px) {
  .finance-cards {
    flex-direction: column;
  }
  .finance-table-header {
    display: none;
  }
  .finance-table-row {
    flex-wrap: wrap;
    gap: 4px;
  }
  .finance-col {
    flex: none !important;
    width: auto;
  }
  .finance-col-sender { width: 100%; font-weight: 600; }
  .finance-col-amount { margin-left: auto; }
}

/* ═══════════════════════════════════════════════════════════ */
/* h06fix2 — Notfall-Regel: CLAUDE + ZEITREISE Tab sichtbar    */
/* erzwingen. ZEITREISE = #zr-tab-btn (kein .atlas-tab/data-tab,*/
/* daher von der .atlas-tab Regel nicht erfasst → kollabierte). */
/* ═══════════════════════════════════════════════════════════ */
/* h06fix2 originally forced CLAUDE/ZEITREISE into a fixed-width horizontal pill.
   In the vertical sidebar they are normal full-width entries — keep only the
   visibility guarantee for CLAUDE (ZEITREISE's #zr-tab-btn duplicate is hidden). */
#atlas-tab-bar .atlas-tab[data-tab="claude"] {
  display: flex !important;
  width: 100% !important;
  visibility: visible !important;
}

/* ═══════════════════════════════════════════════════════════ */
/* Build H07 FIXES — Sidebar / Logo / Sub-Dashboard            */
/* ═══════════════════════════════════════════════════════════ */

/* AUFTRAG 2 (H08): Die linke React Chat-Sidebar (Projekt-Liste) wird KOMPLETT
   ausgeblendet — Chat-Verwaltung lebt im CLAUDE-Tab. sidebar-toggle.js taggt das
   React-Sidebar-Div mit .atlas-chatside; es ist ein Flex-Kind, daher gibt width:0 +
   display:none den Platz an den Content frei (kein dünner Streifen). */
.atlas-chatside {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  border: 0 !important;
}

/* FIX 2: ATLAS-Logo rechts NEBEN (statt unter/hinter) dem einen ☰-Hamburger.
   Der einzige Hamburger (#atlas-nav-open) sitzt fix oben links (left:12px, 34px breit).
   Der React-Header bekommt dauerhaft links Platz, damit Logo + Tabs rechts daneben in
   einer Zeile stehen: [☰] [ATLAS] [Tabs]. Nur Desktop (mobil keine React-Sidebar). */
@media (min-width: 769px) {
  .atlas-react-header {
    padding-left: 56px !important;
  }
}

/* FIX 4: Sub-Dashboard "hier öffnen" — Header-Leiste bleibt immer oben sichtbar,
   das Overlay startet unterhalb des Headers (Höhe per JS gemessen → CSS-Variable). */
body.atlas-subdash-open .atlas-react-header {
  position: relative;
  z-index: 3000;
  background: var(--bg);
}
body.atlas-subdash-open #atlas-tab-content-claude.visible,
body.atlas-subdash-open #zeitreise-overlay.visible {
  top: var(--atlas-subdash-top, 52px) !important;
}

/* FIX 4: Auswahl-Dialog (Separates Fenster vs. Hier öffnen) */
#atlas-subdash-chooser {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
}
#atlas-subdash-chooser .asc-box {
  position: relative;
  background: var(--bg-card);
  border: 1px solid var(--accent);
  border-radius: 14px;
  padding: 30px 28px 24px;
  width: 420px;
  max-width: 90vw;
  text-align: center;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.6);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
}
#atlas-subdash-chooser .asc-title {
  color: var(--accent);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 3px;
}
#atlas-subdash-chooser .asc-sub {
  color: var(--text-muted);
  font-size: 13px;
  margin: 8px 0 22px;
}
#atlas-subdash-chooser .asc-actions {
  display: flex;
  gap: 12px;
}
#atlas-subdash-chooser .asc-btn {
  flex: 1;
  padding: 14px 12px;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  border: 1px solid var(--border-light);
  transition: all 0.18s ease;
}
#atlas-subdash-chooser .asc-window {
  background: var(--bg-input);
  color: var(--accent);
  border-color: var(--accent);
}
#atlas-subdash-chooser .asc-window:hover {
  background: rgba(var(--accent-rgb), 0.12);
}
#atlas-subdash-chooser .asc-here {
  background: var(--accent);
  color: #000;
}
#atlas-subdash-chooser .asc-here:hover {
  background: var(--accent-light);
}
#atlas-subdash-chooser .asc-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 16px;
  cursor: pointer;
  line-height: 1;
}
#atlas-subdash-chooser .asc-close:hover {
  color: var(--text);
}

/* ─── Auftrag Detail Modal ─── */
.bdm-footer { flex-wrap: wrap; }
.bdm-delete {
  background: rgba(244, 67, 54, 0.12) !important;
  border-color: var(--status-err) !important;
  color: var(--status-err) !important;
}
.bdm-delete:hover { background: rgba(244, 67, 54, 0.25) !important; }
.bdm-retry {
  background: rgba(66, 165, 245, 0.12) !important;
  border-color: var(--status-info, #42a5f5) !important;
  color: var(--status-info, #42a5f5) !important;
}
.bdm-retry:hover { background: rgba(66, 165, 245, 0.25) !important; }
.bdm-status-row {
  margin-top: 14px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.bdm-status-info {
  font-size: 13px;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ═══════════════════════════════════════════════════════════ */
/* VULKAN LIVE TERMINAL — Split-View                          */
/* ═══════════════════════════════════════════════════════════ */

.vulkan-content {
  display: flex;
  flex: 1;
  min-height: 0;
  gap: 0;
}

.vulkan-content-list {
  flex: 1;
  overflow-y: auto;
  transition: flex 0.3s ease;
}

.vulkan-content.split .vulkan-content-list {
  flex: 0 0 340px;
  max-width: 340px;
  border-right: 1px solid var(--border);
  overflow-y: auto;
}

.vulkan-content-terminal {
  display: none;
  flex: 1;
  flex-direction: column;
  background: var(--bg);
  min-width: 0;
}

.vulkan-content.split .vulkan-content-terminal {
  display: flex;
}

.vulkan-term-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border);
  gap: 12px;
  flex-shrink: 0;
}

.vulkan-term-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}

.vulkan-term-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vulkan-term-status {
  font-size: 12px;
  color: var(--galaxie-eg);
  font-weight: 600;
}

.vulkan-term-status.idle {
  color: var(--text-muted);
}

.vulkan-term-cost {
  font-size: 11px;
  color: var(--text);
}

.vulkan-term-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-shrink: 0;
}

.vulkan-term-stop {
  background: var(--status-err);
  color: #fff;
  border: none;
  padding: 6px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  letter-spacing: 1px;
  transition: background 0.15s;
}

.vulkan-term-stop:hover {
  background: #e53935;
}

.vulkan-term-stop:disabled {
  background: var(--text-dim);
  cursor: not-allowed;
}

.vulkan-term-close {
  background: none;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  width: 28px;
  height: 28px;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.15s, border-color 0.15s;
}

.vulkan-term-close:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.vulkan-term-body {
  flex: 1;
  position: relative;
  overflow: hidden;
  background: var(--bg);
  padding: 4px;
}

.vulkan-term-body .xterm {
  height: 100%;
}

.vulkan-term-body .xterm-viewport {
  overflow-y: auto !important;
}

.vulkan-term-idle {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  flex-direction: column;
  gap: 16px;
}

.vulkan-term-idle-text {
  font-size: 16px;
  color: var(--text-dim);
  font-weight: 600;
  letter-spacing: 1px;
}

.vulkan-term-idle-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--accent);
  animation: vulkan-pulse 2s ease-in-out infinite;
}

@keyframes vulkan-pulse {
  0%, 100% { opacity: 0.3; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.2); }
}

.vulkan-active-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: rgba(74, 222, 128, 0.1);
  border: 1px solid rgba(74, 222, 128, 0.3);
  border-radius: 6px;
  font-size: 12px;
  color: var(--galaxie-eg);
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
  margin-left: 8px;
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vulkan-active-badge:hover {
  background: rgba(74, 222, 128, 0.2);
}

.vulkan-active-badge .vab-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--galaxie-eg);
  animation: vulkan-pulse 1.5s ease-in-out infinite;
  flex-shrink: 0;
}

.vulkan-runner-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.5px;
  margin-left: 12px;
  cursor: default;
  transition: background 0.2s, border-color 0.2s;
}
.vulkan-runner-badge.aktiv {
  background: rgba(0, 204, 68, 0.12);
  border: 1px solid rgba(0, 204, 68, 0.4);
  color: #00cc44;
}
.vulkan-runner-badge.inaktiv {
  background: rgba(244, 67, 54, 0.12);
  border: 1px solid rgba(244, 67, 54, 0.4);
  color: var(--status-err);
}
.vulkan-runner-badge .vrb-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.vulkan-runner-badge.aktiv .vrb-dot {
  background: #00cc44;
  box-shadow: 0 0 6px rgba(0, 204, 68, 0.6);
  animation: vulkan-pulse 1.5s ease-in-out infinite;
}
.vulkan-runner-badge.inaktiv .vrb-dot {
  background: var(--status-err);
  box-shadow: 0 0 4px rgba(244, 67, 54, 0.4);
}

@media (max-width: 768px) {
  .vulkan-content.split .vulkan-content-list {
    display: none;
  }
  .vulkan-content.split .vulkan-content-terminal {
    flex: 1;
  }
}

/* ═══════════════════════════════════════════════════════════════ */
/* KONTROLL-DASHBOARD (Build 360)                                 */
/* ═══════════════════════════════════════════════════════════════ */

/* Stats */
.kontroll-header { padding: 12px 0; }
.kontroll-stat-row { display: flex; gap: 12px; margin-bottom: 8px; flex-wrap: wrap; }
.kontroll-stat-row.week { opacity: 0.7; font-size: 0.9em; }
.kontroll-stat { background: var(--bg-input); border-radius: 8px; padding: 10px 16px; text-align: center; min-width: 70px; }
.kontroll-stat.green { border-left: 3px solid #4caf50; }
.kontroll-stat.red { border-left: 3px solid #f44336; }
.kontroll-stat.orange { border-left: 3px solid var(--status-warn); }
.ks-num { display: block; font-size: 1.5em; font-weight: 700; color: var(--text); }
.ks-label { display: block; font-size: 0.75em; color: #f0f0f5; text-transform: uppercase; }

/* Filters */
.kontroll-filters { display: flex; gap: 6px; margin: 8px 0 12px; }
.kontroll-filter-btn {
  background: var(--bg-input); border: 1px solid var(--border-light); color: #f0f0f5; padding: 5px 14px;
  border-radius: 16px; cursor: pointer; font-size: 0.85em; transition: all 0.2s;
}
.kontroll-filter-btn:hover { border-color: var(--text-dim); color: #fff; }
.kontroll-filter-btn.active { background: #ff6b35; border-color: #ff6b35; color: #fff; }

/* Patterns */
.kontroll-patterns { margin-bottom: 12px; }
.kontroll-patterns-title { font-size: 0.85em; color: var(--status-warn); font-weight: 600; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.5px; }
.kontroll-pattern {
  display: flex; align-items: center; gap: 8px; padding: 8px 12px; margin-bottom: 4px;
  border-radius: 6px; font-size: 0.85em; background: var(--bg-input);
}
.kontroll-pattern.pattern-high { border-left: 3px solid #f44336; }
.kontroll-pattern.pattern-medium { border-left: 3px solid var(--status-warn); }
.pattern-icon { font-size: 1.1em; }
.pattern-type { color: #f0f0f5; font-size: 0.8em; text-transform: uppercase; min-width: 80px; }
.pattern-msg { color: var(--text); flex: 1; }
.pattern-builds { color: var(--text); font-size: 0.8em; }

/* Table */
.kontroll-table { width: 100%; border-collapse: collapse; font-size: 0.85em; }
.kontroll-table th {
  text-align: left; padding: 8px 10px; color: #f0f0f5; font-weight: 600;
  border-bottom: 1px solid var(--border-light); font-size: 0.85em; text-transform: uppercase;
}
.kontroll-table td { padding: 8px 10px; border-bottom: 1px solid #1a1a2e; color: #f0f0f5; }
.kontroll-row { cursor: pointer; transition: background 0.2s; }
.kontroll-row:hover { background: var(--bg-input); }
.kontroll-build-id { color: var(--text); font-family: monospace; font-size: 0.9em; }
.kontroll-name { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #f0f0f5; }
.kontroll-error { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #f0f0f5; font-size: 0.85em; }
.kontroll-time { color: var(--text); font-size: 0.85em; white-space: nowrap; }
.kontroll-status { padding: 2px 8px; border-radius: 10px; font-size: 0.8em; font-weight: 600; }
.kontroll-status.status-ok { background: #1b3a1b; color: var(--status-ok); }
.kontroll-status.status-fail { background: #3a1b1b; color: var(--status-err); }
.kontroll-status.status-blocked { background: #3a2a1b; color: var(--status-warn); }
.kontroll-status.status-other { background: var(--bg-input); color: var(--text-muted); }

/* Detail Overlay */
.kontroll-detail-overlay {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,0.7); z-index: 10000;
  display: flex; align-items: center; justify-content: center;
}
.kontroll-detail-card {
  background: #12121f; border: 1px solid var(--border-light); border-radius: 12px;
  padding: 24px; max-width: 650px; width: 90%; max-height: 80vh;
  overflow-y: auto; position: relative; color: var(--text);
}
.kontroll-detail-close {
  position: absolute; top: 12px; right: 16px; font-size: 1.5em;
  color: var(--text-dim); cursor: pointer; line-height: 1;
}
.kontroll-detail-close:hover { color: #fff; }
.kontroll-detail-header { display: flex; align-items: center; gap: 12px; margin-bottom: 4px; }
.kontroll-detail-id { color: var(--text-muted); font-family: monospace; }
.kontroll-detail-name { margin: 0 0 12px; font-size: 1.1em; color: #fff; }
.kontroll-detail-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; font-size: 0.85em; color: var(--text-muted); margin-bottom: 16px; }
.kontroll-detail-section { margin-top: 16px; }
.kontroll-detail-section h4 { color: #ff6b35; font-size: 0.85em; margin: 0 0 6px; text-transform: uppercase; }
.kontroll-detail-error { background: #1a0a0a; color: #f44; padding: 10px; border-radius: 6px; font-size: 0.85em; white-space: pre-wrap; max-height: 200px; overflow-y: auto; }
.kontroll-detail-files { list-style: none; padding: 0; margin: 0; }
.kontroll-detail-files li { padding: 3px 0; color: var(--text-muted); font-family: monospace; font-size: 0.85em; }
.kontroll-detail-files li::before { content: "\25B8 "; color: var(--status-ok); }
.kontroll-detail-deploy { background: #0a1a0a; color: var(--status-ok); padding: 10px; border-radius: 6px; font-size: 0.82em; white-space: pre-wrap; max-height: 200px; overflow-y: auto; }
.kontroll-detail-pattern { padding: 4px 8px; background: var(--bg-input); border-radius: 4px; margin-bottom: 4px; font-size: 0.85em; }
.kontroll-detail-screenshot { color: var(--text-muted); font-family: monospace; font-size: 0.85em; }
.kontroll-empty { padding: 24px; text-align: center; color: var(--text-dim); }

/* ═══════════════════════════════════════════════════════════════ */
/* TELEGRAM-HISTORY (Build 360)                                   */
/* ═══════════════════════════════════════════════════════════════ */

.telegram-header { display: flex; gap: 12px; align-items: center; padding: 8px 0 12px; flex-wrap: wrap; }
.telegram-filters { display: flex; gap: 6px; }
.telegram-filter-btn {
  background: var(--bg-input); border: 1px solid var(--border-light); color: #f0f0f5; padding: 5px 14px;
  border-radius: 16px; cursor: pointer; font-size: 0.85em; transition: all 0.2s;
}
.telegram-filter-btn:hover { border-color: var(--text-dim); color: #fff; }
.telegram-filter-btn.active { background: #2196f3; border-color: #2196f3; color: #fff; }
.telegram-search {
  flex: 1; min-width: 150px; background: var(--bg-input); border: 1px solid var(--border-light); color: var(--text);
  padding: 6px 12px; border-radius: 16px; font-size: 0.85em; outline: none;
}
.telegram-search:focus { border-color: #2196f3; }

.telegram-msg {
  padding: 10px 14px; margin-bottom: 6px; border-radius: 8px;
  background: var(--bg-input); border-left: 3px solid var(--border-light);
}
.telegram-msg.tg-in { border-left-color: #2196f3; }
.telegram-msg.tg-out { border-left-color: #ff6b35; }
.telegram-msg-header { display: flex; gap: 8px; align-items: center; margin-bottom: 4px; flex-wrap: wrap; }
.telegram-msg-icon { font-size: 1em; }
.telegram-msg-dir { color: #f0f0f5; font-size: 0.8em; text-transform: uppercase; font-weight: 600; }
.telegram-msg-sender { color: #f0f0f5; font-size: 0.85em; }
.telegram-msg-time { color: var(--text); font-size: 0.8em; margin-left: auto; }
.telegram-msg-build {
  background: #1a1a3e; color: var(--text); padding: 1px 8px; border-radius: 10px; font-size: 0.75em;
}
.telegram-msg-text { color: #f0f0f5; font-size: 0.9em; white-space: pre-wrap; word-break: break-word; max-height: 150px; overflow-y: auto; }

/* ═══════════════════════════════════════════════════════════ */
/* BUILD-MELDUNGEN im VULKAN-Tab                                */
/* ═══════════════════════════════════════════════════════════ */

.bnotif-toolbar { display: flex; gap: 8px; padding: 8px 0 12px; }
.bnotif-item {
  padding: 10px 14px; margin-bottom: 6px; border-radius: 8px;
  background: var(--bg-input); position: relative;
}
.bnotif-head { display: flex; gap: 8px; align-items: center; margin-bottom: 4px; flex-wrap: wrap; }
.bnotif-type {
  color: #fff; font-size: 10px; font-weight: 700; padding: 2px 8px;
  border-radius: 4px; text-transform: uppercase; font-family: 'JetBrains Mono', 'Fira Code', monospace;
}
.bnotif-build-id { font-size: 11px; color: var(--text-muted); font-family: 'JetBrains Mono', 'Fira Code', monospace; }
.bnotif-time { font-size: 11px; color: var(--text-muted); margin-left: auto; font-family: 'JetBrains Mono', 'Fira Code', monospace; }
.bnotif-dismiss {
  background: none; border: none; color: var(--text-dim); font-size: 16px; cursor: pointer;
  padding: 0 4px; line-height: 1;
}
.bnotif-dismiss:hover { color: #fff; }
.bnotif-title { color: #f0f0f5; font-size: 0.9em; font-weight: 600; }
.bnotif-detail { color: var(--text-muted); font-size: 0.82em; margin-top: 4px; max-height: 80px; overflow-y: auto; }

/* Runner-Badge Zustand: aktiv-stale (gelb) */
.vulkan-runner-badge.aktiv-stale .vrb-dot {
  background: #f59e0b;
  box-shadow: 0 0 8px #f59e0b;
  animation: vrb-pulse 1.5s ease-in-out infinite;
}
.vulkan-runner-badge.aktiv-stale { color: var(--status-warn); }

/* ═══════════════════════════════════════════════════════════ */
/* PERSISTENTE KOPFZEILE (BA-04)                               */
/* ═══════════════════════════════════════════════════════════ */

#atlas-persistent-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 48px;
  background: var(--bg);
  border-bottom: 1px solid #1a1a28;
  z-index: 3400;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
}

.aph-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.aph-hamburger {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid var(--accent);
  background: rgba(13, 13, 20, 0.92);
  color: var(--accent);
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, color 0.15s ease;
  flex-shrink: 0;
}

.aph-hamburger:hover {
  background: var(--accent);
  color: #0a0a0a;
}

.aph-tab-title {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--accent);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 180px;
}

.aph-center {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.aph-center::-webkit-scrollbar { display: none; }

.aph-fav {
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.45);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1.5px;
  padding: 6px 10px;
  cursor: pointer;
  white-space: nowrap;
  border-radius: 6px;
  transition: color 0.15s, background 0.15s, opacity 0.15s;
}

.aph-fav:hover {
  color: rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.06);
}

.aph-fav.active {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.12);
  border-bottom: 2px solid var(--accent);
}

.aph-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.aph-clock {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1.5px;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}

/* Kopfzeile verdraengt: ☰-Button wird durch Header ersetzt */
#atlas-persistent-header ~ #atlas-nav-open {
  display: none !important;
}

/* Tab-Content braucht Offset fuer die persistente Kopfzeile */
#atlas-tab-content-builder,
#atlas-tab-content-jupiter,
#atlas-tab-content-happy,
#atlas-tab-content-mission,
#atlas-tab-content-crm,
#atlas-tab-content-ideas,
#atlas-tab-content-produkte,
#atlas-tab-content-notifications,
#atlas-tab-content-finance,
#atlas-tab-content-rechnungen,
#atlas-tab-content-calendar,
#atlas-tab-content-learnings,
#atlas-tab-content-learning-dashboard,
#atlas-tab-content-status,
#atlas-tab-content-quality,
#atlas-tab-content-gedaechtnis,
#atlas-tab-content-claude,
#atlas-tab-content-kontakte,
#atlas-tab-content-food,
#atlas-tab-content-agents,
#atlas-tab-content-scheduler,
#atlas-tab-content-hermes,
#atlas-tab-content-maintenance,
#atlas-tab-content-runners,
#atlas-tab-content-sales,
#atlas-tab-content-gehirn,
#atlas-tab-content-marketing,
#atlas-tab-content-patterns,
#atlas-tab-content-pipeline,
#atlas-tab-content-settings {
  top: 48px !important;
}

/* React-Header offsetten fuer persistente Kopfzeile */
.atlas-react-header {
  margin-top: 48px !important;
}

/* ═══════════════════════════════════════════════════════════ */
/* DRAWER: Untereintraege (Sub-Views unter Gehirn etc.)        */
/* ═══════════════════════════════════════════════════════════ */

#atlas-tab-bar .atlas-tab-sub {
  padding-left: 32px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 1.5px;
  color: var(--text-dim);
}

#atlas-tab-bar .atlas-tab-sub:hover {
  color: var(--accent);
}

#atlas-tab-bar .atlas-tab-sub.active {
  color: var(--accent);
}

/* ═══════════════════════════════════════════════════════════ */
/* BREADCRUMB (generalisiert, BA-04)                           */
/* ═══════════════════════════════════════════════════════════ */

.atlas-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 4px;
  font-size: 12px;
  color: var(--text-muted);
  flex: 1;
  min-width: 0;
  overflow-x: auto;
}

.atlas-breadcrumb-item {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 12px;
  padding: 4px 6px;
  border-radius: 4px;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.15s, background 0.15s;
}

.atlas-breadcrumb-item:hover {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.08);
}

.atlas-breadcrumb-sep {
  color: var(--text-dim);
  font-size: 11px;
}

.atlas-breadcrumb-current {
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* ↗ Separates-Fenster-Icon (ersetzt Chooser) */
.atlas-external-link {
  background: none;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  width: 26px;
  height: 26px;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color 0.15s, border-color 0.15s;
  margin-left: 8px;
  flex-shrink: 0;
}

.atlas-external-link:hover {
  color: var(--accent);
  border-color: var(--accent);
}

/* ═══════════════════════════════════════════════════════════ */
/* MOBILE: Kopfzeile anpassen                                  */
/* ═══════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  #atlas-persistent-header {
    height: 42px;
    padding: 0 10px;
  }
  .aph-tab-title {
    font-size: 12px;
    letter-spacing: 2px;
    max-width: 100px;
  }
  .aph-fav {
    font-size: 10px;
    padding: 4px 7px;
  }
  .aph-clock {
    font-size: 11px;
  }
  #atlas-tab-content-builder,
  #atlas-tab-content-jupiter,
  #atlas-tab-content-happy,
  #atlas-tab-content-mission,
  #atlas-tab-content-crm,
  #atlas-tab-content-ideas,
  #atlas-tab-content-produkte,
  #atlas-tab-content-notifications,
  #atlas-tab-content-finance,
  #atlas-tab-content-rechnungen,
  #atlas-tab-content-calendar,
  #atlas-tab-content-learnings,
  #atlas-tab-content-learning-dashboard,
  #atlas-tab-content-status,
  #atlas-tab-content-quality,
  #atlas-tab-content-gedaechtnis,
  #atlas-tab-content-claude,
  #atlas-tab-content-kontakte,
  #atlas-tab-content-food,
  #atlas-tab-content-agents,
  #atlas-tab-content-scheduler,
  #atlas-tab-content-hermes,
  #atlas-tab-content-maintenance,
  #atlas-tab-content-runners,
  #atlas-tab-content-sales,
  #atlas-tab-content-gehirn,
  #atlas-tab-content-marketing,
  #atlas-tab-content-patterns,
  #atlas-tab-content-pipeline,
  #atlas-tab-content-settings {
    top: 42px !important;
  }
  .atlas-react-header {
    margin-top: 42px !important;
  }
}

/* ═══ Dashboard v2 (2026-07-14): Stopp-Banner, Testing-Badge, Tor-Stopp-Kachel, Fortschritt ═══ */
#vulkan-stopp-banner {
  background: linear-gradient(135deg, #7f1d1d, #991b1b);
  border: 2px solid #ef4444;
  border-radius: 10px;
  padding: 14px 18px;
  margin: 0 0 14px 0;
  color: #fff;
  box-shadow: 0 0 18px rgba(239, 68, 68, 0.45);
  animation: vsb-puls 2s ease-in-out infinite;
}
@keyframes vsb-puls {
  0%, 100% { box-shadow: 0 0 18px rgba(239, 68, 68, 0.45); }
  50% { box-shadow: 0 0 30px rgba(239, 68, 68, 0.8); }
}
#vulkan-stopp-banner .vsb-titel { font-size: 1.05rem; font-weight: 800; letter-spacing: 0.06em; margin-bottom: 6px; }
#vulkan-stopp-banner .vsb-felder { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 0.8rem; margin-bottom: 6px; }
#vulkan-stopp-banner .vsb-feld b { color: #fecaca; font-weight: 600; }
#vulkan-stopp-banner .vsb-grund { font-size: 0.8rem; line-height: 1.45; background: rgba(0,0,0,0.25); border-radius: 6px; padding: 8px 10px; margin-bottom: 6px; word-break: break-word; }
#vulkan-stopp-banner .vsb-grund b { color: #fecaca; }
#vulkan-stopp-banner .vsb-hinweis { font-size: 0.7rem; color: #fca5a5; }
#vulkan-stopp-banner .vsb-hinweis code { background: rgba(0,0,0,0.35); padding: 1px 6px; border-radius: 4px; }

.vulkan-runner-badge.testing { color: #3b82f6; border-color: #3b82f6; }
.vulkan-runner-badge.testing .vrb-dot { background: #3b82f6; box-shadow: 0 0 8px rgba(59, 130, 246, 0.9); animation: vsb-testing-blink 1.2s ease-in-out infinite; }
@keyframes vsb-testing-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.35; } }

.builder-stat.vulkan-kachel-filter-aktiv { outline: 2px solid #ef4444; outline-offset: 1px; }

.builder-build-progress { display: flex; align-items: center; gap: 6px; flex-shrink: 0; margin-right: 8px; }
.builder-build-progress .bbp-balken { width: 72px; height: 6px; background: rgba(255,255,255,0.12); border-radius: 3px; overflow: hidden; }
.builder-build-progress .bbp-fuellung { height: 100%; border-radius: 3px; transition: width 0.6s ease; }
.builder-build-progress .bbp-text { font-size: 0.62rem; white-space: nowrap; }
@media (max-width: 700px) { .builder-build-progress .bbp-text { display: none; } }


/* ═══ agent-hub.css ═══ */
/* Build 053: Agent Hub Tab Styles */

.aghub-wrap {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.aghub-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.aghub-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.aghub-icon {
  font-size: 22px;
}

.aghub-summary {
  font-size: 13px;
  color: var(--text-muted);
  margin-left: 8px;
}

.aghub-header-actions {
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.aghub-btn {
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.aghub-btn:active {
  transform: scale(0.96);
}

.aghub-btn-start-all {
  background: rgba(76, 175, 80, 0.12);
  color: var(--status-ok);
  border: 1px solid rgba(76, 175, 80, 0.3);
}

.aghub-btn-start-all:hover {
  background: rgba(76, 175, 80, 0.2);
}

.aghub-btn-stop-all {
  background: rgba(244, 67, 54, 0.12);
  color: var(--status-err);
  border: 1px solid rgba(244, 67, 54, 0.3);
}

.aghub-btn-stop-all:hover {
  background: rgba(244, 67, 54, 0.2);
}

.aghub-btn-refresh {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.aghub-btn-refresh:hover {
  border-color: var(--accent);
}

/* Stats row */
.aghub-stats-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.aghub-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 80px;
  text-align: center;
}

.aghub-stat .num {
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
}

.aghub-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.aghub-stat.green .num { color: var(--status-ok); }
.aghub-stat.gold .num { color: var(--accent); }
.aghub-stat.red .num { color: var(--status-err); }
.aghub-stat.blue .num { color: var(--status-info, #42a5f5); }

/* Subtabs */
.aghub-subtabs {
  display: flex;
  border-bottom: 1px solid var(--border);
  margin-bottom: 20px;
  gap: 2px;
}

.aghub-subtab {
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted);
  cursor: pointer;
  border: none;
  border-bottom: 3px solid transparent;
  background: none;
  transition: all 0.2s;
  letter-spacing: 0.5px;
}

.aghub-subtab:hover {
  color: var(--accent);
}

.aghub-subtab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

/* Status dots */
.aghub-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.aghub-dot-active {
  background: var(--status-ok);
  box-shadow: 0 0 6px rgba(76, 175, 80, 0.5);
  animation: aghub-pulse 1.5s ease-in-out infinite;
}

.aghub-dot-paused {
  background: var(--accent);
}

.aghub-dot-error {
  background: var(--status-err);
}

@keyframes aghub-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* Department accordions */
.aghub-dept {
  margin-bottom: 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: var(--bg-card);
}

.aghub-dept-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  cursor: pointer;
  transition: background 0.2s;
  user-select: none;
}

.aghub-dept-header:hover {
  background: var(--bg-input);
}

.aghub-dept-icon {
  font-size: 18px;
  flex-shrink: 0;
  width: 28px;
  text-align: center;
}

.aghub-dept-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--accent);
  flex: 1;
  letter-spacing: 0.5px;
}

.aghub-dept-count {
  font-size: 12px;
  color: var(--text-muted);
  background: var(--bg-input);
  padding: 3px 10px;
  border-radius: 10px;
}

.aghub-dept-arrow {
  font-size: 12px;
  color: var(--text-dim);
  transition: transform 0.2s;
}

.aghub-dept-body {
  border-top: 1px solid var(--border);
}

/* Agent cards */
.aghub-agent-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  transition: background 0.15s;
  gap: 12px;
}

.aghub-agent-card:last-child {
  border-bottom: none;
}

.aghub-agent-card:hover {
  background: rgba(var(--accent-rgb), 0.03);
}

.aghub-agent-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
}

.aghub-agent-info {
  min-width: 0;
  flex: 1;
}

.aghub-agent-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  text-transform: capitalize;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aghub-agent-desc {
  font-size: 12px;
  color: var(--text-dim);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.aghub-agent-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.aghub-agent-status {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
  white-space: nowrap;
}

.aghub-s-active {
  background: rgba(76, 175, 80, 0.15);
  color: var(--status-ok);
}

.aghub-s-paused {
  background: rgba(var(--accent-rgb), 0.15);
  color: var(--accent);
}

.aghub-s-error {
  background: rgba(244, 67, 54, 0.15);
  color: var(--status-err);
}

.aghub-agent-actions-today {
  font-size: 12px;
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
  min-width: 42px;
  text-align: center;
}

.aghub-agent-btn {
  width: 32px;
  height: 32px;
  border-radius: 6px;
  border: 1px solid var(--border-light);
  background: var(--bg-input);
  color: var(--text-muted);
  font-size: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.aghub-agent-btn-start {
  color: var(--status-ok);
  border-color: rgba(76, 175, 80, 0.3);
}

.aghub-agent-btn-start:hover {
  background: rgba(76, 175, 80, 0.15);
  border-color: var(--status-ok);
}

.aghub-agent-btn-stop {
  color: var(--status-err);
  border-color: rgba(244, 67, 54, 0.3);
}

.aghub-agent-btn-stop:hover {
  background: rgba(244, 67, 54, 0.15);
  border-color: var(--status-err);
}

/* Section titles */
.aghub-section-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin: 20px 0 12px;
}

/* Chain cards */
.aghub-chain-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  margin-bottom: 8px;
  transition: border-color 0.2s;
}

.aghub-chain-card:hover {
  border-color: rgba(var(--accent-rgb), 0.3);
}

.aghub-chain-running {
  border-color: rgba(76, 175, 80, 0.3);
}

.aghub-chain-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--status-ok);
  animation: aghub-pulse 1.5s ease-in-out infinite;
  flex-shrink: 0;
}

.aghub-chain-info {
  flex: 1;
  min-width: 0;
}

.aghub-chain-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  text-transform: capitalize;
}

.aghub-chain-meta {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 2px;
}

.aghub-chain-status-badge {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
  white-space: nowrap;
}

.aghub-chain-status-badge.running {
  background: rgba(76, 175, 80, 0.15);
  color: var(--status-ok);
}

.aghub-chain-status-badge.active {
  background: rgba(76, 175, 80, 0.15);
  color: var(--status-ok);
}

.aghub-chain-status-badge.paused {
  background: rgba(var(--accent-rgb), 0.15);
  color: var(--accent);
}

.aghub-chain-status-badge.error {
  background: rgba(244, 67, 54, 0.15);
  color: var(--status-err);
}

/* Timeline */
.aghub-timeline-filters {
  display: flex;
  gap: 6px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.aghub-filter-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.aghub-filter-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.aghub-filter-btn.active {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border-color: var(--accent);
}

.aghub-timeline {
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}

.aghub-timeline-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  color: var(--text);
  transition: background 0.15s;
}

.aghub-timeline-item:last-child {
  border-bottom: none;
}

.aghub-timeline-item:hover {
  background: rgba(var(--accent-rgb), 0.03);
}

.aghub-timeline-item.error {
  border-left: 3px solid #f44336;
}

.aghub-timeline-time {
  font-size: 12px;
  font-family: 'JetBrains Mono', monospace;
  color: var(--text-muted);
  flex-shrink: 0;
  min-width: 44px;
}

.aghub-timeline-icon {
  font-size: 14px;
  flex-shrink: 0;
  width: 20px;
  text-align: center;
}

.aghub-timeline-agent {
  font-weight: 600;
  color: var(--accent);
  text-transform: capitalize;
  white-space: nowrap;
}

.aghub-timeline-action {
  color: var(--text);
}

.aghub-timeline-detail {
  color: var(--text-dim);
  font-size: 12px;
}

.aghub-timeline-status {
  margin-left: auto;
  font-size: 13px;
  flex-shrink: 0;
}

/* Empty state */
.aghub-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.aghub-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: 0.5;
}

.aghub-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

/* BA-03: Mobile-Versteckregel zentral in mobile.css */

@media (max-width: 700px) {
  .aghub-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .aghub-header-actions {
    margin-left: 0;
    width: 100%;
    justify-content: flex-end;
  }
  .aghub-agent-card {
    flex-direction: column;
    align-items: flex-start;
  }
  .aghub-agent-right {
    width: 100%;
    justify-content: flex-end;
    margin-top: 8px;
  }
  .aghub-timeline-item {
    flex-wrap: wrap;
  }
}


/* ═══ kontakt-panel.css ═══ */
/* Build 174: CRM Kontakt-Panel */

#atlas-tab-content-kontakte {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg);
  z-index: 9000;
  overflow-y: auto;
  padding: 20px;
}
#atlas-tab-content-kontakte.visible { display: block; }

.kontakt-wrap {
  max-width: 1000px;
  margin: 0 auto;
  padding-bottom: 40px;
}

/* Header */
.kontakt-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}
.kontakt-header .kontakt-icon {
  font-size: 28px;
}
.kontakt-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}
.kontakt-header .kontakt-version {
  font-size: 12px;
  color: var(--text-dim);
  margin-left: auto;
}

/* Stats row */
.kontakt-stats-row {
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.kontakt-stat {
  flex: 1;
  min-width: 100px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px 16px;
  text-align: center;
}
.kontakt-stat .num {
  font-size: 24px;
  font-weight: 700;
  color: var(--text);
}
.kontakt-stat .label {
  font-size: 11px;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 2px;
}
.kontakt-stat.blue .num { color: var(--status-info, #42a5f5); }
.kontakt-stat.green .num { color: var(--status-ok); }
.kontakt-stat.gold .num { color: var(--accent); }

/* Toolbar */
.kontakt-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.kontakt-subtabs {
  display: flex;
  gap: 4px;
}
.kontakt-subtab {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 7px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s;
}
.kontakt-subtab:hover { color: var(--text); border-color: var(--text-dim); }
.kontakt-subtab.active {
  background: var(--accent);
  color: #000;
  border-color: var(--accent);
}
.kontakt-toolbar-right {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.kontakt-search {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  color: var(--text);
  padding: 7px 14px;
  border-radius: 6px;
  font-size: 13px;
  width: 200px;
}
.kontakt-search:focus { border-color: var(--accent); outline: none; }
.kontakt-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text);
  padding: 7px 14px;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  transition: all .2s;
}
.kontakt-btn:hover { border-color: var(--accent); color: var(--accent); }

/* Grid (card list) */
.kontakt-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Card */
.kontakt-card {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px 16px;
  cursor: pointer;
  transition: all .2s;
}
.kontakt-card:hover {
  border-color: var(--accent);
  background: var(--bg-input);
}

/* Avatar */
.kontakt-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), #b8941f);
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
  flex-shrink: 0;
}
.kontakt-avatar.company-avatar {
  background: linear-gradient(135deg, #42a5f5, #1976d2);
  color: #fff;
  border-radius: 10px;
}
.kontakt-avatar.kontakt-avatar-lg {
  width: 64px;
  height: 64px;
  font-size: 22px;
}

/* Card body */
.kontakt-card-body { flex: 1; min-width: 0; }
.kontakt-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kontakt-role {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 2px;
}
.kontakt-company {
  font-size: 12px;
  color: var(--status-info, #42a5f5);
  margin-top: 2px;
  cursor: pointer;
}
.kontakt-company:hover { text-decoration: underline; }
.kontakt-meta {
  display: flex;
  gap: 14px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.kontakt-meta-item {
  font-size: 12px;
  color: var(--text-dim);
}
.kontakt-card-arrow {
  font-size: 22px;
  color: var(--text-dim);
  flex-shrink: 0;
}
.kontakt-card:hover .kontakt-card-arrow { color: var(--accent); }

/* Empty state */
.kontakt-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-dim);
}
.kontakt-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: .5;
}
.kontakt-empty p {
  margin: 0;
  font-size: 15px;
}
.kontakt-hint {
  font-size: 12px !important;
  color: var(--text-dim) !important;
  margin-top: 8px !important;
}
.kontakt-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-dim);
}

/* Detail view */
.kontakt-detail {
  max-width: 700px;
}
.kontakt-back-btn {
  background: none;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
  margin-bottom: 20px;
  transition: all .2s;
}
.kontakt-back-btn:hover { color: var(--accent); border-color: var(--accent); }

.kontakt-detail-header {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 24px;
}
.kontakt-detail-info h3 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
}
.kontakt-detail-role {
  font-size: 14px;
  color: var(--text-muted);
  margin-top: 4px;
}
.kontakt-detail-company {
  font-size: 14px;
  color: var(--status-info, #42a5f5);
  margin-top: 4px;
  cursor: pointer;
}
.kontakt-detail-company:hover { text-decoration: underline; }

/* Detail fields */
.kontakt-detail-fields {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 24px;
}
.kontakt-field {
  display: flex;
  align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.kontakt-field:last-child { border-bottom: none; }
.kontakt-field-label {
  width: 100px;
  font-size: 12px;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}
.kontakt-field-value {
  font-size: 14px;
  color: var(--text);
  word-break: break-word;
}

/* Section title */
.kontakt-section-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.kontakt-no-interactions {
  color: var(--text-dim);
  font-size: 13px;
  padding: 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
}

/* Timeline */
.kontakt-timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.kontakt-timeline-item {
  display: flex;
  gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border);
}
.kontakt-timeline-item:last-child { border-bottom: none; }
.kontakt-timeline-icon {
  width: 36px;
  height: 36px;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}
.kontakt-timeline-body { flex: 1; min-width: 0; }
.kontakt-timeline-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}
.kontakt-timeline-type {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
}
.kontakt-timeline-channel {
  font-size: 11px;
  color: var(--text-muted);
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  padding: 1px 6px;
  border-radius: 4px;
}
.kontakt-timeline-date {
  font-size: 11px;
  color: var(--text-dim);
  margin-left: auto;
}
.kontakt-timeline-subject {
  font-size: 14px;
  color: #ddd;
  font-weight: 500;
  margin-bottom: 4px;
}
.kontakt-timeline-text {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.5;
}

/* Auto-refresh footer */
.kontakt-auto-refresh {
  text-align: center;
  font-size: 11px;
  color: var(--text-dim);
  margin-top: 16px;
}

/* Mobile */
@media (max-width: 600px) {
  #atlas-tab-content-kontakte { padding: 12px; }
  .kontakt-stats-row { gap: 6px; }
  .kontakt-stat { min-width: 70px; padding: 10px 8px; }
  .kontakt-stat .num { font-size: 18px; }
  .kontakt-toolbar { flex-direction: column; align-items: stretch; }
  .kontakt-toolbar-right { margin-left: 0; }
  .kontakt-search { width: 100%; }
  .kontakt-card { padding: 10px 12px; }
  .kontakt-detail-header { flex-direction: column; text-align: center; }
  .kontakt-field { flex-direction: column; gap: 2px; }
  .kontakt-field-label { width: auto; }
}


/* ═══ crm-pipeline.css ═══ */
/* Pipeline Panel — Build 181 */

#atlas-tab-content-pipeline {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--bg);
  z-index: 50;
  overflow-y: auto;
  overflow-x: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
}

#atlas-tab-content-pipeline.visible {
  display: block;
  opacity: 1;
}

.pipeline-wrap {
  max-width: 100%;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.pipeline-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.pipeline-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.pipeline-icon {
  font-size: 22px;
  color: var(--accent);
}

.pipeline-version {
  font-size: 12px;
  color: var(--text-muted);
  letter-spacing: 1px;
}

.pipeline-header-actions {
  margin-left: auto;
  display: flex;
  gap: 8px;
}

/* Stats */
.pipeline-stats-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.pipeline-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 100px;
  text-align: center;
}

.pipeline-stat .num {
  font-size: 20px;
  font-weight: 700;
  color: var(--text);
}

.pipeline-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.pipeline-stat.green .num { color: var(--status-ok); }
.pipeline-stat.gold .num { color: var(--accent); }
.pipeline-stat.blue .num { color: var(--status-info, #42a5f5); }
.pipeline-stat.purple .num { color: #ab47bc; }

/* Buttons */
.pipeline-btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
}

.pipeline-btn:active {
  transform: scale(0.96);
}

.pipeline-btn-add {
  background: rgba(var(--accent-rgb), 0.15);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb), 0.3);
}

.pipeline-btn-add:hover {
  background: rgba(var(--accent-rgb), 0.25);
}

.pipeline-btn-refresh {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.pipeline-btn-refresh:hover {
  border-color: var(--accent);
}

/* Add form */
.pipeline-add-form {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 20px;
}

.pipeline-form-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 16px;
}

.pipeline-form-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pipeline-form-row {
  display: flex;
  gap: 12px;
}

.pipeline-form-field {
  flex: 1;
}

.pipeline-form-field label {
  display: block;
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 4px;
  font-weight: 600;
}

.pipeline-form-field input,
.pipeline-form-field select {
  width: 100%;
  background: #0f0f0f;
  border: 1px solid var(--border-light);
  border-radius: 6px;
  color: var(--text);
  padding: 8px 12px;
  font-size: 13px;
  font-family: inherit;
  transition: border-color 0.2s;
  box-sizing: border-box;
}

.pipeline-form-field input:focus,
.pipeline-form-field select:focus {
  outline: none;
  border-color: var(--accent);
}

.pipeline-form-field input::placeholder {
  color: var(--text-dim);
}

.pipeline-form-actions {
  display: flex;
  gap: 10px;
  margin-top: 16px;
  justify-content: flex-end;
}

.pipeline-btn-save {
  background: var(--accent);
  color: #0a0a0a;
  font-weight: 700;
}

.pipeline-btn-save:hover {
  background: #e5c24a;
}

.pipeline-btn-cancel {
  background: var(--bg-input);
  color: var(--text-muted);
  border: 1px solid var(--border-light);
}

.pipeline-btn-cancel:hover {
  color: var(--text);
}

/* Kanban */
.pipeline-kanban {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding-bottom: 20px;
  min-height: 400px;
}

.pipeline-column {
  flex: 1;
  min-width: 200px;
  max-width: 280px;
  display: flex;
  flex-direction: column;
}

.pipeline-column-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-top: 3px solid;
  border-radius: 10px 10px 0 0;
}

.pipeline-column-icon {
  font-size: 14px;
}

.pipeline-column-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 0.5px;
  flex: 1;
}

.pipeline-column-count {
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 10px;
  min-width: 20px;
  text-align: center;
}

.pipeline-column-value {
  padding: 6px 14px;
  background: var(--bg-card);
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  font-family: 'JetBrains Mono', monospace;
}

.pipeline-column-body {
  flex: 1;
  background: #0f0f0f;
  border: 1px solid var(--border);
  border-top: none;
  border-radius: 0 0 10px 10px;
  padding: 8px;
  min-height: 200px;
  transition: background 0.2s, border-color 0.2s;
}

.pipeline-column-body.drag-over {
  background: rgba(var(--accent-rgb), 0.05);
  border-color: rgba(var(--accent-rgb), 0.4);
}

.pipeline-column-empty {
  color: var(--text-dim);
  font-size: 12px;
  text-align: center;
  padding: 40px 10px;
  font-style: italic;
}

/* Deal Cards */
.pipeline-deal-card {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 8px;
  transition: border-color 0.2s, opacity 0.2s, transform 0.1s;
  cursor: grab;
}

.pipeline-deal-card:hover {
  border-color: rgba(var(--accent-rgb), 0.3);
}

.pipeline-deal-card.dragging {
  opacity: 0.4;
  transform: scale(0.98);
}

.pipeline-deal-card:active {
  cursor: grabbing;
}

.pipeline-deal-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 6px;
}

.pipeline-deal-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  word-wrap: break-word;
  flex: 1;
}

.pipeline-deal-delete {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 16px;
  cursor: pointer;
  padding: 0 2px;
  line-height: 1;
  transition: color 0.2s;
}

.pipeline-deal-delete:hover {
  color: var(--status-err);
}

.pipeline-deal-company {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 4px;
}

.pipeline-deal-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
}

.pipeline-deal-value {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  font-family: 'JetBrains Mono', monospace;
}

.pipeline-deal-prob {
  font-size: 11px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
}

.pipeline-deal-prob.high {
  background: rgba(76, 175, 80, 0.15);
  color: var(--status-ok);
}

.pipeline-deal-prob.mid {
  background: rgba(255, 152, 0, 0.15);
  color: var(--status-warn);
}

.pipeline-deal-prob.low {
  background: rgba(244, 67, 54, 0.15);
  color: var(--status-err);
}

.pipeline-deal-action {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 6px;
  padding: 4px 6px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pipeline-deal-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
}

.pipeline-deal-date {
  font-size: 10px;
  color: var(--text-dim);
}

.pipeline-deal-arrows {
  display: flex;
  gap: 4px;
}

.pipeline-move-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  width: 28px;
  height: 24px;
  border-radius: 4px;
  font-size: 11px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
}

.pipeline-move-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
}

.pipeline-move-btn:active {
  transform: scale(0.9);
}

/* Drag ghost */
.pipeline-drag-ghost {
  position: fixed;
  top: -100px;
  left: -100px;
  background: var(--bg-input);
  border: 1px solid var(--accent);
  border-radius: 6px;
  padding: 6px 12px;
  color: var(--accent);
  font-size: 13px;
  font-weight: 600;
  max-width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
  z-index: 9999;
}

/* Auto-refresh */
.pipeline-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

/* BA-03: Mobile-Versteckregel zentral in mobile.css */

/* Responsive Kanban */
@media (max-width: 1200px) and (min-width: 769px) {
  .pipeline-kanban {
    flex-wrap: wrap;
  }
  .pipeline-column {
    max-width: none;
    min-width: calc(33% - 12px);
  }
}

@media (max-width: 900px) and (min-width: 769px) {
  .pipeline-kanban {
    flex-direction: column;
  }
  .pipeline-column {
    max-width: none;
    min-width: auto;
  }
  .pipeline-form-row {
    flex-direction: column;
  }
}


/* ═══ calendar-week.css ═══ */
/* Build 182: Calendar Week View */
.calweek-wrap {
  max-width: 1400px;
  margin: 0 auto;
  padding: 80px 20px 20px;
}
.calweek-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.calweek-icon { font-size: 28px; }
.calweek-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: #e5e7eb;
  margin: 0;
  letter-spacing: 1px;
}
.calweek-version {
  font-size: 11px;
  color: var(--text-dim);
  background: rgba(99,102,241,0.15);
  padding: 2px 8px;
  border-radius: 8px;
}
.calweek-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
}
.calweek-nav-btn {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  color: #e5e7eb;
  padding: 6px 14px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  transition: background 0.2s;
}
.calweek-nav-btn:hover {
  background: rgba(99,102,241,0.2);
}
.calweek-nav-btn.today {
  background: rgba(99,102,241,0.25);
  border-color: rgba(99,102,241,0.4);
  font-weight: 600;
}
.calweek-range {
  font-size: 14px;
  color: #9ca3af;
  margin-left: 8px;
}
.calweek-grid-container {
  position: relative;
  overflow: auto;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  background: rgba(255,255,255,0.02);
  max-height: calc(100vh - 220px);
}
.calweek-grid {
  display: grid;
  grid-template-columns: 56px repeat(7, 1fr);
  min-width: 800px;
}
.calweek-corner {
  background: rgba(0,0,0,0.3);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  border-right: 1px solid rgba(255,255,255,0.06);
  position: sticky;
  top: 0;
  z-index: 4;
}
.calweek-day-header {
  text-align: center;
  padding: 10px 4px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  border-right: 1px solid rgba(255,255,255,0.06);
  background: rgba(0,0,0,0.3);
  position: sticky;
  top: 0;
  z-index: 4;
}
.calweek-day-header:last-child { border-right: none; }
.calweek-day-name {
  font-size: 11px;
  font-weight: 600;
  color: #9ca3af;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.calweek-day-date {
  font-size: 18px;
  font-weight: 700;
  color: #e5e7eb;
  margin-top: 2px;
}
.calweek-day-header.today .calweek-day-date {
  color: #818cf8;
  background: rgba(99,102,241,0.2);
  border-radius: 50%;
  width: 32px;
  height: 32px;
  line-height: 32px;
  margin: 2px auto 0;
}
.calweek-day-header.today .calweek-day-name {
  color: #818cf8;
}
.calweek-time-col {
  border-right: 1px solid rgba(255,255,255,0.06);
}
.calweek-time-label {
  height: 48px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 0 6px;
  font-size: 11px;
  color: var(--text-dim);
  transform: translateY(-7px);
  border-top: 1px solid rgba(255,255,255,0.04);
}
.calweek-day-col {
  position: relative;
  border-right: 1px solid rgba(255,255,255,0.06);
}
.calweek-day-col:last-child { border-right: none; }
.calweek-hour-row {
  height: 48px;
  border-top: 1px solid rgba(255,255,255,0.04);
}
.calweek-hour-row:first-child { border-top: none; }
.calweek-event {
  position: absolute;
  border-radius: 6px;
  padding: 3px 6px;
  overflow: hidden;
  cursor: pointer;
  z-index: 2;
  transition: opacity 0.15s, box-shadow 0.15s;
  border-left: 3px solid rgba(255,255,255,0.3);
  box-sizing: border-box;
}
.calweek-event:hover {
  opacity: 0.9;
  box-shadow: 0 2px 12px rgba(0,0,0,0.4);
  z-index: 5;
}
.calweek-event-title {
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calweek-event-time {
  font-size: 10px;
  color: rgba(255,255,255,0.7);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calweek-allday-row {
  display: grid;
  grid-template-columns: 56px repeat(7, 1fr);
  min-width: 800px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  min-height: 28px;
}
.calweek-allday-label {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 6px;
  font-size: 10px;
  color: var(--text-dim);
  border-right: 1px solid rgba(255,255,255,0.06);
}
.calweek-allday-cell {
  padding: 2px;
  border-right: 1px solid rgba(255,255,255,0.06);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.calweek-allday-cell:last-child { border-right: none; }
.calweek-allday-event {
  font-size: 10px;
  font-weight: 600;
  color: #fff;
  padding: 2px 6px;
  border-radius: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  transition: opacity 0.15s;
}
.calweek-allday-event:hover {
  opacity: 0.85;
}
.calweek-now-line {
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--status-err);
  z-index: 10;
  pointer-events: none;
}
.calweek-now-line::before {
  content: '';
  position: absolute;
  left: -4px;
  top: -3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--status-err);
}
.calweek-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-dim);
  font-size: 14px;
}
.calweek-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-dim);
  font-size: 14px;
}

/* Event Detail Overlay */
.calweek-detail-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.5);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}
.calweek-detail-overlay.visible {
  opacity: 1;
  pointer-events: auto;
}
.calweek-detail-card {
  background: #1e1e2e;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 14px;
  padding: 24px;
  min-width: 320px;
  max-width: 420px;
  position: relative;
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
  transform: scale(0.95);
  transition: transform 0.2s ease;
}
.calweek-detail-overlay.visible .calweek-detail-card {
  transform: scale(1);
}
.calweek-detail-close {
  position: absolute;
  top: 12px;
  right: 14px;
  background: none;
  border: none;
  color: #9ca3af;
  font-size: 22px;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
  line-height: 1;
  transition: background 0.15s, color 0.15s;
}
.calweek-detail-close:hover {
  background: rgba(255,255,255,0.08);
  color: #e5e7eb;
}
.calweek-detail-color {
  width: 100%;
  height: 4px;
  border-radius: 4px;
  margin-bottom: 16px;
}
.calweek-detail-title {
  font-size: 18px;
  font-weight: 700;
  color: #e5e7eb;
  margin: 0 0 16px;
  padding-right: 30px;
}
.calweek-detail-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid rgba(255,255,255,0.06);
  font-size: 14px;
  color: #d1d5db;
}
.calweek-detail-icon {
  font-size: 16px;
  flex-shrink: 0;
  width: 22px;
  text-align: center;
}

@media (max-width: 768px) {
  .calweek-wrap { padding: 70px 8px 8px; }
  .calweek-grid { min-width: 600px; }
  .calweek-allday-row { min-width: 600px; }
  .calweek-detail-card {
    min-width: 0;
    margin: 0 16px;
    width: calc(100% - 32px);
  }
}


/* ═══ ideas-panel.css ═══ */
/* Build 173 — Ideas Panel */

.ideas-panel-wrap {
  padding: 16px 20px 32px;
  max-width: 1400px;
  margin: 0 auto;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: var(--text);
}

.ideas-panel-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.ideas-panel-header h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 1px;
}

.ideas-panel-header .ideas-panel-icon {
  font-size: 24px;
}

.ideas-panel-header .ideas-panel-count {
  font-size: 13px;
  color: var(--text-muted);
  margin-left: auto;
}

/* Stats Row */
.ideas-panel-stats {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.ideas-panel-stat {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 10px 16px;
  min-width: 80px;
  text-align: center;
}

.ideas-panel-stat .num {
  font-size: 22px;
  font-weight: 700;
  color: var(--accent);
}

.ideas-panel-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Toolbar */
.ideas-panel-toolbar {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 16px;
  padding: 12px 16px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
}

.ideas-panel-filter-group {
  display: flex;
  align-items: center;
  gap: 6px;
}

.ideas-panel-filter-label {
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-right: 4px;
}

.ideas-panel-filter-select {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  color: var(--text);
  font-size: 13px;
  padding: 6px 10px;
  outline: none;
  cursor: pointer;
}

.ideas-panel-filter-select:focus {
  border-color: var(--accent);
}

.ideas-panel-search {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  color: var(--text);
  font-size: 13px;
  padding: 6px 12px;
  outline: none;
  min-width: 180px;
  flex: 1;
  max-width: 300px;
}

.ideas-panel-search::placeholder {
  color: var(--text-dim);
}

.ideas-panel-search:focus {
  border-color: var(--accent);
}

.ideas-panel-sort-group {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
}

.ideas-panel-btn-refresh {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  color: var(--text);
  font-size: 14px;
  padding: 5px 10px;
  cursor: pointer;
  transition: background 0.15s;
}

.ideas-panel-btn-refresh:hover {
  background: rgba(255,255,255,0.12);
}

/* Card Grid */
.ideas-panel-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 14px;
}

.ideas-panel-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 16px;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.15s, box-shadow 0.2s;
}

.ideas-panel-card:hover {
  border-color: rgba(var(--accent-rgb),0.4);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
}

.ideas-panel-card-top {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.ideas-panel-company-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ideas-panel-company-badge.energy_guard { background: var(--accent); }
.ideas-panel-company-badge.happy_app_factory { background: #42a5f5; }
.ideas-panel-company-badge.crowd_energy { background: var(--status-ok); }
.ideas-panel-company-badge.nightflow { background: #9c27b0; }
.ideas-panel-company-badge.allgemein { background: var(--text-muted); }

.ideas-panel-category-tag {
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(255,255,255,0.08);
  color: var(--text-muted);
  text-transform: capitalize;
}

.ideas-panel-source-tag {
  font-size: 10px;
  color: var(--text-dim);
  margin-left: auto;
}

.ideas-panel-card-title {
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 6px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ideas-panel-card-summary {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 10px;
}

.ideas-panel-card-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}

.ideas-panel-stars {
  display: flex;
  gap: 2px;
  font-size: 14px;
}

.ideas-panel-star {
  color: var(--border-light);
}

.ideas-panel-star.filled {
  color: var(--accent);
}

.ideas-panel-card-date {
  font-size: 11px;
  color: var(--text-dim);
}

.ideas-panel-tags {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.ideas-panel-tag {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 3px;
  background: rgba(var(--accent-rgb),0.1);
  color: var(--accent);
}

/* Empty State */
.ideas-panel-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-dim);
}

.ideas-panel-empty .icon {
  font-size: 48px;
  margin-bottom: 12px;
}

.ideas-panel-empty p {
  font-size: 15px;
  margin: 0;
}

/* Detail Overlay */
.ideas-detail-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.7);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: ideas-fade-in 0.2s ease;
}

@keyframes ideas-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

.ideas-detail-modal {
  background: var(--bg-input);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 14px;
  max-width: 700px;
  width: 100%;
  max-height: 85vh;
  overflow-y: auto;
  padding: 28px 32px;
  animation: ideas-slide-up 0.2s ease;
}

@keyframes ideas-slide-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.ideas-detail-close {
  float: right;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 50%;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--text-muted);
  font-size: 18px;
  transition: background 0.15s;
}

.ideas-detail-close:hover {
  background: rgba(255,255,255,0.12);
  color: #fff;
}

.ideas-detail-badges {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.ideas-detail-title {
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 14px;
  line-height: 1.3;
}

.ideas-detail-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 18px;
}

.ideas-detail-meta-item {
  background: rgba(255,255,255,0.03);
  border-radius: 8px;
  padding: 10px 14px;
}

.ideas-detail-meta-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-muted);
  margin-bottom: 3px;
}

.ideas-detail-meta-value {
  font-size: 14px;
  color: var(--text);
}

.ideas-detail-section-label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-muted);
  margin: 18px 0 8px;
}

.ideas-detail-summary {
  font-size: 15px;
  color: var(--text);
  line-height: 1.6;
  white-space: pre-wrap;
}

.ideas-detail-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 14px;
}

.ideas-detail-tag {
  font-size: 12px;
  padding: 3px 10px;
  border-radius: 5px;
  background: rgba(var(--accent-rgb),0.12);
  color: var(--accent);
}

.ideas-detail-url {
  margin-top: 14px;
}

.ideas-detail-url a {
  color: var(--status-info, #42a5f5);
  text-decoration: none;
  font-size: 13px;
  word-break: break-all;
}

.ideas-detail-url a:hover {
  text-decoration: underline;
}

/* Loading */
.ideas-panel-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-muted);
}

.ideas-panel-loading .spinner {
  display: inline-block;
  width: 24px;
  height: 24px;
  border: 2px solid rgba(var(--accent-rgb),0.3);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: ideas-spin 0.7s linear infinite;
  margin-bottom: 10px;
}

@keyframes ideas-spin {
  to { transform: rotate(360deg); }
}

/* Responsive */
@media (max-width: 768px) {
  .ideas-panel-wrap {
    padding: 12px 14px 24px;
  }

  .ideas-panel-grid {
    grid-template-columns: 1fr;
  }

  .ideas-panel-toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .ideas-panel-sort-group {
    margin-left: 0;
  }

  .ideas-panel-search {
    max-width: none;
  }

  .ideas-detail-modal {
    padding: 20px;
  }

  .ideas-detail-meta {
    grid-template-columns: 1fr;
  }
}


/* ═══ patterns-panel.css ═══ */
/* Build 095: Patterns Panel (Muster-Erkennung) */

#atlas-tab-content-patterns {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--bg);
  z-index: 50;
  overflow-y: auto;
  overflow-x: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
}

#atlas-tab-content-patterns.visible {
  display: block;
  opacity: 1;
}

.patterns-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.patterns-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.patterns-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.patterns-icon {
  font-size: 22px;
  color: var(--accent);
}

.patterns-version {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: auto;
  letter-spacing: 1px;
}

/* Stats Row */
.patterns-stats-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.patterns-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 100px;
  text-align: center;
}

.patterns-stat .num {
  font-size: 20px;
  font-weight: 700;
  color: var(--text);
}

.patterns-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.patterns-stat.green .num { color: var(--status-ok); }
.patterns-stat.gold .num { color: var(--accent); }
.patterns-stat.blue .num { color: var(--status-info, #42a5f5); }

/* Toolbar */
.patterns-toolbar {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.patterns-filter-group {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.patterns-filter-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.patterns-filter-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.patterns-filter-btn.active {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border-color: var(--accent);
}

.patterns-toolbar-right {
  margin-left: auto;
}

.patterns-btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.patterns-btn:active {
  transform: scale(0.96);
}

.patterns-btn-refresh {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.patterns-btn-refresh:hover {
  border-color: var(--accent);
}

/* Grid */
.patterns-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 16px;
}

/* Cards */
.patterns-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: border-color 0.2s;
  display: flex;
  flex-direction: column;
}

.patterns-card:hover {
  border-color: rgba(var(--accent-rgb), 0.3);
}

.patterns-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
}

.patterns-card-type {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 4px;
  letter-spacing: 0.5px;
}

.patterns-card-status {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
}

.patterns-card-body {
  padding: 16px;
  flex: 1;
}

.patterns-card-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.4;
  margin-bottom: 8px;
  word-wrap: break-word;
}

.patterns-trend-icon {
  font-size: 14px;
}

.patterns-card-desc {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.5;
  margin-bottom: 12px;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Confidence Bar */
.patterns-conf-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.patterns-conf-label {
  font-size: 11px;
  color: var(--text-muted);
  flex-shrink: 0;
  min-width: 60px;
}

.patterns-conf-bar {
  flex: 1;
  background: var(--bg-input);
  border-radius: 4px;
  height: 6px;
  overflow: hidden;
}

.patterns-conf-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.5s ease;
}

.patterns-conf-fill.high {
  background: linear-gradient(90deg, #4caf50, #66bb6a);
}

.patterns-conf-fill.medium {
  background: linear-gradient(90deg, var(--status-warn), #ffb74d);
}

.patterns-conf-fill.low {
  background: linear-gradient(90deg, #888, #aaa);
}

.patterns-conf-value {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
  min-width: 36px;
  text-align: right;
}

/* Recommendation */
.patterns-card-rec {
  font-size: 12px;
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.06);
  border: 1px solid rgba(var(--accent-rgb), 0.15);
  border-radius: 6px;
  padding: 8px 10px;
  line-height: 1.4;
  margin-bottom: 8px;
}

.patterns-rec-icon {
  margin-right: 4px;
}

/* Sparkline */
.patterns-sparkline {
  margin-top: 4px;
  margin-bottom: 2px;
}

.patterns-sparkline svg {
  width: 100%;
  height: 32px;
  display: block;
}

/* Footer */
.patterns-card-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-top: 1px solid var(--border);
  font-size: 11px;
  color: var(--text-dim);
}

.patterns-card-week {
  color: var(--text-muted);
}

.patterns-card-date {
  margin-left: auto;
}

.patterns-card-actions {
  display: flex;
  gap: 4px;
}

.patterns-act-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  width: 26px;
  height: 26px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  padding: 0;
}

.patterns-act-btn:hover {
  color: var(--status-ok);
  border-color: var(--status-ok);
}

.patterns-act-btn.danger:hover {
  color: var(--status-err);
  border-color: var(--status-err);
}

/* Empty state */
.patterns-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.patterns-empty .icon {
  font-size: 48px;
  margin-bottom: 16px;
  opacity: 0.5;
}

.patterns-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

/* BA-03: Mobile-Versteckregel zentral in mobile.css */

@media (max-width: 900px) and (min-width: 769px) {
  .patterns-grid {
    grid-template-columns: 1fr;
  }
  .patterns-stats-row {
    flex-wrap: wrap;
  }
  .patterns-stat {
    min-width: 80px;
  }
  .patterns-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
}


/* ═══ learnings-panel.css ═══ */
/* Build 177: Learnings Panel (Enhanced) */

#atlas-tab-content-learnings {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--bg);
  z-index: 50;
  overflow-y: auto;
  overflow-x: hidden;
  opacity: 0;
  transition: opacity 0.3s ease;
}

#atlas-tab-content-learnings.visible {
  display: block;
  opacity: 1;
}

.learnings-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 80px 24px 40px;
}

.learnings-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.learnings-header h2 {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  margin: 0;
}

.learnings-icon {
  font-size: 22px;
  color: var(--accent);
}

.learnings-count {
  font-size: 13px;
  color: var(--text-muted);
  margin-left: 8px;
  font-weight: 400;
}

.learnings-version {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: auto;
  letter-spacing: 1px;
}

/* Stats Row */
.learnings-stats-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.learnings-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
  min-width: 90px;
  text-align: center;
}

.learnings-stat .num {
  font-size: 20px;
  font-weight: 700;
  color: var(--text);
}

.learnings-stat .label {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
}

.learnings-stat.green .num { color: var(--status-ok); }
.learnings-stat.gold .num { color: var(--accent); }
.learnings-stat.red .num { color: var(--status-err); }
.learnings-stat.blue .num { color: var(--status-info, #42a5f5); }
.learnings-stat.orange .num { color: var(--status-warn); }

/* Toolbar */
.learnings-toolbar {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.learnings-filter-group {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}

.learnings-filter-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}

.learnings-filter-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.learnings-filter-btn.active {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border-color: var(--accent);
}

.learnings-toolbar-right {
  margin-left: auto;
  display: flex;
  gap: 8px;
}

.learnings-btn {
  padding: 8px 16px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
}

.learnings-btn:active {
  transform: scale(0.96);
}

.learnings-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.learnings-btn-refresh {
  background: var(--bg-input);
  color: var(--accent);
  border: 1px solid var(--border-light);
}

.learnings-btn-refresh:hover {
  border-color: var(--accent);
}

.learnings-btn-add {
  background: rgba(var(--accent-rgb), 0.12);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb), 0.3);
}

.learnings-btn-add:hover {
  background: rgba(var(--accent-rgb), 0.2);
  border-color: var(--accent);
}

/* Add Form */
.learnings-add-form {
  background: var(--bg-card);
  border: 1px solid rgba(var(--accent-rgb), 0.25);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 20px;
  animation: learnings-form-in 0.25s ease;
}

@keyframes learnings-form-in {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

.learnings-form-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 16px;
  letter-spacing: 0.5px;
}

.learnings-form-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.learnings-form-row {
  display: flex;
  gap: 12px;
}

.learnings-form-field {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.learnings-form-field label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.learnings-form-field input,
.learnings-form-field select,
.learnings-form-field textarea {
  background: var(--bg);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  color: var(--text);
  font-size: 13px;
  padding: 8px 12px;
  font-family: inherit;
  transition: border-color 0.2s;
}

.learnings-form-field input:focus,
.learnings-form-field select:focus,
.learnings-form-field textarea:focus {
  outline: none;
  border-color: var(--accent);
}

.learnings-form-field textarea {
  resize: vertical;
  min-height: 40px;
}

.learnings-form-field select {
  cursor: pointer;
}

.learnings-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
}

.learnings-btn-cancel {
  background: var(--bg-input);
  color: var(--text-muted);
  border: 1px solid var(--border-light);
}

.learnings-btn-cancel:hover {
  color: var(--text);
  border-color: var(--text-dim);
}

.learnings-btn-save {
  background: rgba(76, 175, 80, 0.15);
  color: var(--status-ok);
  border: 1px solid rgba(76, 175, 80, 0.3);
}

.learnings-btn-save:hover {
  background: rgba(76, 175, 80, 0.25);
  border-color: var(--status-ok);
}

/* Grid */
.learnings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 16px;
}

/* Cards */
.learnings-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  transition: border-color 0.2s;
  display: flex;
  flex-direction: column;
}

.learnings-card:hover {
  border-color: rgba(var(--accent-rgb), 0.3);
}

.learnings-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
}

.learnings-card-category {
  font-size: 11px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 4px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
}

.learnings-card-outcome {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
}

.learnings-card-outcome.success {
  background: rgba(76, 175, 80, 0.15);
  color: var(--status-ok);
}

.learnings-card-outcome.failure {
  background: rgba(244, 67, 54, 0.15);
  color: var(--status-err);
}

.learnings-card-outcome.partial {
  background: rgba(255, 152, 0, 0.15);
  color: var(--status-warn);
}

.learnings-card-outcome.unknown {
  background: rgba(158, 158, 158, 0.15);
  color: #9e9e9e;
}

.learnings-card-body {
  padding: 16px;
  flex: 1;
}

.learnings-card-problem {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.4;
  margin-bottom: 8px;
  word-wrap: break-word;
}

.learnings-card-lesson {
  font-size: 13px;
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.06);
  border: 1px solid rgba(var(--accent-rgb), 0.15);
  border-radius: 6px;
  padding: 8px 10px;
  line-height: 1.4;
  margin-bottom: 8px;
  word-wrap: break-word;
}

.learnings-card-lesson-icon {
  margin-right: 4px;
}

.learnings-card-solution {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.5;
  margin-bottom: 8px;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Confidence Bar */
.learnings-conf-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

.learnings-conf-label {
  font-size: 11px;
  color: var(--text-muted);
  flex-shrink: 0;
  min-width: 60px;
}

.learnings-conf-bar {
  flex: 1;
  background: var(--bg-input);
  border-radius: 4px;
  height: 6px;
  overflow: hidden;
}

.learnings-conf-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.5s ease;
}

.learnings-conf-fill.high {
  background: linear-gradient(90deg, #4caf50, #66bb6a);
}

.learnings-conf-fill.medium {
  background: linear-gradient(90deg, var(--status-warn), #ffb74d);
}

.learnings-conf-fill.low {
  background: linear-gradient(90deg, #888, #aaa);
}

.learnings-conf-value {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
  min-width: 36px;
  text-align: right;
}

/* Tags */
.learnings-tags {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-top: 6px;
}

.learnings-tag {
  font-size: 10px;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 2px 8px;
  border-radius: 4px;
}

/* Footer */
.learnings-card-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-top: 1px solid var(--border);
  font-size: 11px;
  color: var(--text-dim);
}

.learnings-card-source {
  color: var(--text-muted);
}

.learnings-card-build {
  color: var(--status-info, #42a5f5);
}

.learnings-card-date {
  margin-left: auto;
}

/* Empty / Loading / Error states */
.learnings-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.learnings-empty .icon {
  font-size: 48px;
  margin-bottom: 16px;
  opacity: 0.5;
}

.learnings-loading {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-muted);
}

.learnings-error {
  text-align: center;
  padding: 40px 20px;
  color: var(--status-err);
  background: rgba(244, 67, 54, 0.06);
  border: 1px solid rgba(244, 67, 54, 0.15);
  border-radius: 8px;
}

.learnings-auto-refresh {
  font-size: 12px;
  color: var(--text-muted);
  text-align: center;
  padding: 8px;
}

/* BA-03: Mobile-Versteckregel zentral in mobile.css */

@media (max-width: 900px) and (min-width: 769px) {
  .learnings-grid {
    grid-template-columns: 1fr;
  }
  .learnings-stats-row {
    flex-wrap: wrap;
  }
  .learnings-stat {
    min-width: 80px;
  }
  .learnings-toolbar {
    flex-direction: column;
    align-items: stretch;
  }
  .learnings-form-row {
    flex-direction: column;
  }
}


/* ═══ learning-dashboard-panel.css ═══ */
/* Atlas Learning Dashboard Panel */
#atlas-tab-content-learning-dashboard {
  display: none;
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
#atlas-tab-content-learning-dashboard.visible { display: block; }

.ald-header {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 24px; padding-bottom: 12px;
  border-bottom: 2px solid rgba(218,165,32,.3);
}
.ald-header h2 {
  font-size: 22px; font-weight: 700; color: #f0f0f0; margin: 0;
}
.ald-header .ald-subtitle {
  font-size: 13px; color: var(--text-muted); margin-left: auto;
}
.ald-refresh-btn {
  background: none; border: 1px solid rgba(218,165,32,.4);
  color: var(--accent); border-radius: 6px; padding: 4px 10px; cursor: pointer;
  font-size: 14px; transition: background .2s;
}
.ald-refresh-btn:hover { background: rgba(218,165,32,.15); }

/* Grid layout */
.ald-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
@media (max-width: 768px) {
  .ald-grid { grid-template-columns: 1fr; }
}

.ald-card {
  background: rgba(30,30,30,.85);
  border: 1px solid rgba(218,165,32,.2);
  border-radius: 12px;
  padding: 20px;
  position: relative;
  overflow: hidden;
}
.ald-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #daa520, #b8860b);
}
.ald-card-title {
  font-size: 14px; font-weight: 600; color: var(--accent);
  text-transform: uppercase; letter-spacing: 1px;
  margin-bottom: 16px;
}

/* 1) Fehler-Trends — Bar chart */
.ald-barchart {
  display: flex; align-items: flex-end; gap: 4px;
  height: 140px; padding-top: 8px;
}
.ald-bar-col {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: flex-end; height: 100%;
  position: relative;
}
.ald-bar-stack {
  width: 100%; display: flex; flex-direction: column-reverse;
  border-radius: 4px 4px 0 0; overflow: hidden;
  min-height: 2px;
}
.ald-bar-seg {
  width: 100%; transition: height .4s ease;
}
.ald-bar-label {
  font-size: 9px; color: var(--text-muted); margin-top: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 100%; text-align: center;
}
.ald-bar-count {
  font-size: 10px; color: var(--text); margin-bottom: 2px;
}
.ald-legend {
  display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px;
}
.ald-legend-item {
  display: flex; align-items: center; gap: 4px; font-size: 11px; color: var(--text-muted);
}
.ald-legend-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
}

/* Category colors */
.ald-cat-build    { background: var(--status-err); }
.ald-cat-deploy   { background: #e67e22; }
.ald-cat-proxy    { background: #f39c12; }
.ald-cat-frontend { background: #3498db; }
.ald-cat-ssh      { background: #9b59b6; }
.ald-cat-api      { background: #1abc9c; }
.ald-cat-database { background: #2ecc71; }
.ald-cat-other    { background: #7f8c8d; }

/* 2) Donut chart */
.ald-donut-wrap {
  display: flex; align-items: center; gap: 20px;
}
.ald-donut {
  width: 130px; height: 130px; border-radius: 50%;
  position: relative; flex-shrink: 0;
}
.ald-donut-hole {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 70px; height: 70px; border-radius: 50%;
  background: rgba(30,30,30,.95);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700; color: #f0f0f0;
}
.ald-donut-legend {
  display: flex; flex-direction: column; gap: 6px;
}
.ald-donut-legend-item {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; color: var(--text);
}
.ald-donut-legend-count {
  font-weight: 600; color: #f0f0f0; margin-left: auto; min-width: 24px; text-align: right;
}

/* 3) Erfolgsquote — big number */
.ald-success-wrap {
  display: flex; align-items: center; justify-content: center;
  flex-direction: column; min-height: 140px;
}
.ald-success-pct {
  font-size: 72px; font-weight: 800;
  background: linear-gradient(135deg, #2ecc71, #27ae60);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; line-height: 1;
}
.ald-success-pct.warn {
  background: linear-gradient(135deg, #e67e22, #d35400);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.ald-success-pct.bad {
  background: linear-gradient(135deg, #e74c3c, #c0392b);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.ald-success-label {
  font-size: 13px; color: var(--text-muted); margin-top: 8px;
}
.ald-success-detail {
  font-size: 12px; color: var(--text-dim); margin-top: 4px;
}

/* 4) Best-Practices list */
.ald-practices {
  max-height: 200px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 8px;
  padding-right: 4px;
}
.ald-practices::-webkit-scrollbar { width: 4px; }
.ald-practices::-webkit-scrollbar-thumb { background: rgba(218,165,32,.3); border-radius: 2px; }
.ald-practice-item {
  display: flex; gap: 10px; padding: 8px 10px;
  background: rgba(255,255,255,.04); border-radius: 8px;
  border-left: 3px solid #daa520;
}
.ald-practice-rank {
  font-size: 14px; font-weight: 700; color: var(--accent);
  min-width: 20px; text-align: center; flex-shrink: 0;
}
.ald-practice-text {
  font-size: 12px; color: var(--text); line-height: 1.4;
}
.ald-practice-conf {
  font-size: 10px; color: var(--text-muted); margin-top: 2px;
}

/* 5) Wissensdatenbank stats */
.ald-kb-stats {
  display: flex; gap: 16px; justify-content: center;
  flex-wrap: wrap;
}
.ald-kb-stat {
  text-align: center; min-width: 100px;
}
.ald-kb-num {
  font-size: 36px; font-weight: 800; color: var(--accent);
  line-height: 1;
}
.ald-kb-label {
  font-size: 12px; color: var(--text-muted); margin-top: 4px;
}

/* Full-width card */
.ald-card-full { grid-column: 1 / -1; }

/* Loading state */
.ald-loading {
  text-align: center; padding: 40px; color: var(--text-muted);
}
.ald-loading::after {
  content: ''; display: inline-block;
  width: 20px; height: 20px; border: 2px solid #daa520;
  border-top-color: transparent; border-radius: 50%;
  animation: ald-spin 1s linear infinite;
  margin-left: 8px; vertical-align: middle;
}
@keyframes ald-spin { to { transform: rotate(360deg); } }

/* Error state */
.ald-error {
  text-align: center; padding: 20px; color: var(--status-err);
  font-size: 13px;
}


/* ═══ status-panel.css ═══ */
/* Build 180: Status Dashboard (System Health) */

#atlas-tab-content-status {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg);
  z-index: 8000;
  overflow-y: auto;
  padding: 80px 24px 40px;
}

#atlas-tab-content-status.visible {
  display: block;
}

.status-wrap {
  max-width: 900px;
  margin: 0 auto;
}

/* Header */
.sp-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
}

.sp-header-icon {
  font-size: 28px;
}

.sp-header-title {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--accent);
  margin: 0;
}

.sp-header-sub {
  font-size: 11px;
  color: var(--text-dim);
  letter-spacing: 1px;
  margin-left: auto;
}

/* Sections */
.sp-section {
  margin-bottom: 28px;
}

.sp-section-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}

/* Gauges */
.sp-gauges {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}

.sp-gauge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 16px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  min-width: 140px;
  transition: border-color 0.3s, box-shadow 0.3s;
}

.sp-gauge:hover {
  border-color: rgba(var(--accent-rgb),0.2);
}

.sp-gauge-warn {
  border-color: rgba(var(--accent-rgb),0.25);
  box-shadow: 0 0 12px rgba(var(--accent-rgb),0.08);
}

.sp-gauge-crit {
  border-color: rgba(255,82,82,0.3);
  box-shadow: 0 0 16px rgba(255,82,82,0.12);
  animation: sp-pulse 2s ease-in-out infinite;
}

@keyframes sp-pulse {
  0%, 100% { box-shadow: 0 0 16px rgba(255,82,82,0.12); }
  50% { box-shadow: 0 0 24px rgba(255,82,82,0.25); }
}

.sp-gauge-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  text-transform: uppercase;
}

.sp-gauge-ring-wrap {
  position: relative;
  width: 100px;
  height: 100px;
}

.sp-gauge-ring {
  width: 100%;
  height: 100%;
}

.sp-gauge-pct {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -1px;
}

.sp-gauge-unit {
  font-size: 14px;
  font-weight: 600;
  opacity: 0.6;
}

.sp-gauge-detail {
  font-size: 10px;
  color: var(--text-dim);
  text-align: center;
  letter-spacing: 0.5px;
}

/* Uptime */
.sp-uptime {
  text-align: center;
  margin-top: 12px;
  font-size: 13px;
  color: var(--text-muted);
}

.sp-uptime-label {
  margin-right: 8px;
}

.sp-uptime-value {
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 1px;
}

/* Services */
.sp-services {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}

.sp-svc-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 14px;
  transition: border-color 0.25s;
}

.sp-svc-card:hover {
  border-color: rgba(var(--accent-rgb),0.2);
}

.sp-svc-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.sp-svc-name {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--text);
  flex: 1;
}

.sp-svc-badge {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 4px;
}

.sp-svc-badge-green {
  background: rgba(76,175,80,0.15);
  color: var(--status-ok);
}

.sp-svc-badge-yellow {
  background: rgba(var(--accent-rgb),0.15);
  color: var(--accent);
}

.sp-svc-badge-red {
  background: rgba(255,82,82,0.15);
  color: var(--status-err);
}

.sp-svc-details {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  font-size: 11px;
  color: var(--text-dim);
}

/* Status Dots */
.sp-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.sp-dot-green {
  background: var(--status-ok);
  box-shadow: 0 0 6px rgba(76,175,80,0.4);
}

.sp-dot-yellow {
  background: var(--accent);
  box-shadow: 0 0 6px rgba(var(--accent-rgb),0.4);
}

.sp-dot-red {
  background: #ff5252;
  box-shadow: 0 0 6px rgba(255,82,82,0.4);
}

/* Warnings */
.sp-ok-box {
  background: rgba(76,175,80,0.06);
  border: 1px solid rgba(76,175,80,0.15);
  border-radius: 8px;
  padding: 14px;
  color: var(--status-ok);
  font-size: 13px;
  text-align: center;
}

.sp-warn-item {
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 13px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.sp-warn-warning {
  background: rgba(var(--accent-rgb),0.06);
  border: 1px solid rgba(var(--accent-rgb),0.15);
  color: var(--accent);
}

.sp-warn-critical {
  background: rgba(255,82,82,0.06);
  border: 1px solid rgba(255,82,82,0.15);
  color: var(--status-err);
}

.sp-warn-icon {
  font-size: 16px;
  flex-shrink: 0;
}

/* Error Table */
.sp-error-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.sp-error-table thead th {
  text-align: left;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--text-dim);
  text-transform: uppercase;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.sp-error-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,0.03);
  transition: background 0.15s;
}

.sp-error-table tbody tr:hover {
  background: rgba(255,255,255,0.02);
}

.sp-err-time {
  color: var(--text-dim);
  white-space: nowrap;
  padding: 8px 10px;
  width: 60px;
}

.sp-err-svc {
  color: var(--text-muted);
  font-weight: 600;
  padding: 8px 10px;
  white-space: nowrap;
  width: 120px;
}

.sp-err-msg {
  color: #ff8a80;
  padding: 8px 10px;
  word-break: break-word;
}

/* Consciousness */
.sp-cons-row {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.sp-cons-block {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 14px;
}

.sp-cons-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-bottom: 6px;
}

.sp-cons-value {
  font-size: 14px;
  color: var(--text);
  font-weight: 500;
}

.sp-cons-subs {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sp-cons-sub {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background: rgba(255,255,255,0.02);
  border-radius: 6px;
  font-size: 12px;
  color: var(--text);
}

.sp-cons-sub-detail {
  margin-left: auto;
  color: var(--text-dim);
  font-size: 11px;
}

.sp-cons-sub-tick {
  color: var(--text-dim);
  font-size: 10px;
  min-width: 40px;
  text-align: right;
}

/* Error Box */
.sp-error-box {
  background: rgba(255,82,82,0.06);
  border: 1px solid rgba(255,82,82,0.15);
  border-radius: 8px;
  padding: 14px;
  color: #ff8a80;
  font-size: 13px;
  text-align: center;
}

/* Empty */
.sp-empty {
  text-align: center;
  padding: 20px;
  color: var(--text-dim);
  font-size: 13px;
}

/* Loading */
.sp-loading {
  text-align: center;
  padding: 30px 0;
  color: var(--text-dim);
  font-size: 13px;
}

/* Toolbar */
.sp-toolbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.04);
}

.sp-btn {
  padding: 8px 20px;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  background: rgba(var(--accent-rgb),0.08);
  border: 1px solid rgba(var(--accent-rgb),0.2);
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
}

.sp-btn:hover {
  background: rgba(var(--accent-rgb),0.15);
}

.sp-auto-refresh {
  font-size: 10px;
  color: var(--text-dim);
  letter-spacing: 1px;
}

/* ─── Vulkan Build System ─── */

.sp-vulkan-current {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 14px;
}

.sp-vulkan-current-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-bottom: 10px;
}

.sp-vulkan-current-info {
  margin-bottom: 10px;
}

.sp-vulkan-build-id {
  font-size: 13px;
  font-weight: 800;
  color: var(--accent);
  letter-spacing: 1px;
}

.sp-vulkan-build-name {
  font-size: 13px;
  color: var(--text);
  margin-left: 6px;
}

.sp-vulkan-progress-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sp-vulkan-progress-bar {
  flex: 1;
  height: 8px;
  background: rgba(255,255,255,0.06);
  border-radius: 4px;
  overflow: hidden;
}

.sp-vulkan-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--accent-light));
  border-radius: 4px;
  transition: width 1s ease;
}

.sp-vulkan-progress-pct {
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
  min-width: 36px;
  text-align: right;
}

.sp-vulkan-idle {
  font-size: 13px;
  color: var(--status-ok);
  padding: 8px 0;
}

.sp-vulkan-offline {
  font-size: 13px;
  color: #ff8a80;
  padding: 8px 0;
}

.sp-vulkan-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}

.sp-vulkan-stat {
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  padding: 12px;
  text-align: center;
}

.sp-vulkan-stat-num {
  font-size: 24px;
  font-weight: 800;
  color: var(--accent);
  letter-spacing: -1px;
}

.sp-vulkan-num-running {
  color: #64b5f6;
}

.sp-vulkan-num-done {
  color: var(--status-ok);
}

.sp-vulkan-num-fail {
  color: var(--status-err);
}

.sp-vulkan-stat-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-top: 4px;
}

.sp-vulkan-recent-title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-bottom: 8px;
}

.sp-vulkan-recent {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sp-vulkan-recent-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: rgba(255,255,255,0.02);
  border-radius: 6px;
  font-size: 12px;
  transition: background 0.15s;
}

.sp-vulkan-recent-item:hover {
  background: rgba(255,255,255,0.04);
}

.sp-vulkan-recent-id {
  font-weight: 700;
  color: var(--text-muted);
  min-width: 36px;
}

.sp-vulkan-recent-name {
  flex: 1;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sp-vulkan-badge {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 2px 8px;
  border-radius: 4px;
  flex-shrink: 0;
}

.sp-vulkan-badge-ok {
  background: rgba(76,175,80,0.15);
  color: var(--status-ok);
}

.sp-vulkan-badge-fail {
  background: rgba(255,82,82,0.15);
  color: var(--status-err);
}

.sp-vulkan-recent-dur {
  font-size: 11px;
  color: var(--text-dim);
  min-width: 50px;
  text-align: right;
}

/* Responsive */
@media (max-width: 600px) {
  #atlas-tab-content-status {
    padding: 70px 12px 24px;
  }

  .sp-gauges {
    gap: 10px;
  }

  .sp-gauge {
    min-width: 100px;
    padding: 12px;
  }

  .sp-gauge-ring-wrap {
    width: 80px;
    height: 80px;
  }

  .sp-gauge-pct {
    font-size: 20px;
  }

  .sp-services {
    grid-template-columns: 1fr;
  }

  .sp-cons-row {
    grid-template-columns: 1fr;
  }

  .sp-vulkan-stats {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* ═══ atlas-health.css ═══ */
/* Build 166: Health Monitoring Dashboard */

.health-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--accent-rgb), 0.2), transparent);
  margin: 32px 0;
}

.health-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.health-header-icon {
  font-size: 20px;
}

.health-header-title {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--accent);
  margin: 0;
}

.health-header-sub {
  font-size: 11px;
  color: var(--text-dim);
  letter-spacing: 1px;
  margin-left: auto;
}

/* Gauges */
.health-gauges {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.health-gauge {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 20px 24px;
  text-align: center;
  min-width: 140px;
  flex: 1;
  max-width: 220px;
  transition: border-color 0.3s;
}

.health-gauge:hover {
  border-color: rgba(var(--accent-rgb), 0.2);
}

.health-gauge-warn {
  border-color: rgba(var(--accent-rgb), 0.25) !important;
  background: rgba(var(--accent-rgb), 0.04);
}

.health-gauge-crit {
  border-color: rgba(255, 82, 82, 0.3) !important;
  background: rgba(255, 82, 82, 0.04);
  animation: health-pulse 2s ease-in-out infinite;
}

@keyframes health-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 82, 82, 0); }
  50% { box-shadow: 0 0 12px rgba(255, 82, 82, 0.15); }
}

.health-gauge-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 12px;
}

.health-gauge-ring-wrap {
  position: relative;
  width: 90px;
  height: 90px;
  margin: 0 auto 8px;
}

.health-gauge-ring {
  width: 100%;
  height: 100%;
}

.health-gauge-pct {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 24px;
  font-weight: 700;
  font-family: 'JetBrains Mono', 'SF Mono', monospace;
}

.health-gauge-unit {
  font-size: 12px;
  font-weight: 400;
  opacity: 0.6;
}

.health-gauge-detail {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 4px;
  letter-spacing: 0.5px;
}

/* Uptime */
.health-uptime {
  text-align: center;
  margin-bottom: 16px;
  font-size: 12px;
  color: var(--text-dim);
}

.health-uptime-label {
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-right: 6px;
  color: var(--text-dim);
}

.health-uptime-value {
  color: var(--text-muted);
  font-family: 'JetBrains Mono', 'SF Mono', monospace;
}

/* Warnings */
.health-warnings {
  margin-bottom: 16px;
}

.health-warning-item {
  background: rgba(255, 82, 82, 0.06);
  border: 1px solid rgba(255, 82, 82, 0.15);
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 6px;
  font-size: 13px;
  color: var(--status-err);
  display: flex;
  align-items: center;
  gap: 6px;
}

.health-warning-icon {
  font-size: 14px;
}

/* Section Title */
.health-section-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 12px;
}

/* Services */
.health-services {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.health-svc-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 14px;
  transition: border-color 0.25s;
}

.health-svc-card:hover {
  border-color: rgba(var(--accent-rgb), 0.2);
}

.health-svc-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.health-svc-name {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: var(--text);
  font-family: 'JetBrains Mono', 'SF Mono', monospace;
}

.health-svc-status {
  margin-left: auto;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 4px;
}

.health-svc-status-running,
.health-svc-status-active,
.health-svc-status-ok {
  color: var(--status-ok);
  background: rgba(76, 175, 80, 0.1);
}

.health-svc-status-failed,
.health-svc-status-inactive,
.health-svc-status-down {
  color: var(--status-err);
  background: rgba(255, 82, 82, 0.1);
}

.health-svc-status-activating,
.health-svc-status-degraded {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
}

.health-svc-details {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text-dim);
}

/* Status dots */
.health-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.health-dot-green { background: var(--status-ok); box-shadow: 0 0 4px rgba(76, 175, 80, 0.4); }
.health-dot-yellow { background: var(--accent); box-shadow: 0 0 4px rgba(var(--accent-rgb), 0.4); }
.health-dot-red { background: #ff5252; box-shadow: 0 0 4px rgba(255, 82, 82, 0.4); }

/* Loading / empty */
.health-loading, .health-empty {
  text-align: center;
  padding: 24px 0;
  color: var(--text-dim);
  font-size: 13px;
}

@media (max-width: 600px) {
  .health-gauges {
    flex-direction: column;
    align-items: stretch;
  }
  .health-gauge {
    max-width: 100%;
  }
}


/* ═══ gedaechtnis-panel.css ═══ */
/* Build 179: Gedaechtnis Panel */
#atlas-tab-content-gedaechtnis {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 9000;
  background: var(--bg);
  overflow-y: auto;
  padding: 20px;
  padding-top: 60px;
}
#atlas-tab-content-gedaechtnis.visible { display: block; }

.ged-wrap { max-width: 1200px; margin: 0 auto; }

.ged-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.ged-icon { font-size: 28px; }
.ged-header h2 {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  letter-spacing: 1px;
}
.ged-count { color: var(--text-muted); font-weight: 400; font-size: 14px; }
.ged-version {
  font-size: 11px;
  color: var(--text-muted);
  background: var(--bg-input);
  padding: 3px 8px;
  border-radius: 4px;
  margin-left: auto;
}

/* Stats */
.ged-stats-row {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.ged-stat {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 16px;
  text-align: center;
  min-width: 80px;
  flex: 1;
}
.ged-stat .num { font-size: 20px; font-weight: 700; color: #fff; }
.ged-stat .label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; margin-top: 2px; }
.ged-stat.gold .num { color: var(--accent); }
.ged-stat.blue .num { color: var(--status-info, #42a5f5); }
.ged-stat.green .num { color: var(--status-ok); }

/* Toolbar */
.ged-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.ged-toolbar-left { flex: 1; min-width: 180px; }
.ged-search {
  width: 100%;
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  color: #fff;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 13px;
  outline: none;
}
.ged-search:focus { border-color: var(--accent); }
.ged-search::placeholder { color: var(--text-dim); }

.ged-time-filters { display: flex; gap: 6px; flex-wrap: wrap; }
.ged-chip {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 5px 12px;
  border-radius: 16px;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s;
}
.ged-chip:hover { border-color: var(--accent); color: #fff; }
.ged-chip.active { background: var(--accent); color: #000; border-color: var(--accent); font-weight: 600; }

.ged-toolbar-right { display: flex; gap: 8px; }
.ged-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text);
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s;
}
.ged-btn:hover { border-color: var(--accent); color: #fff; }

/* Category filters */
.ged-category-filters {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.ged-cat-btn {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  color: var(--text);
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all 0.15s;
}
.ged-cat-btn:hover { border-color: var(--accent); color: #fff; }
.ged-cat-btn.active { background: var(--bg-input); border-color: var(--accent); color: #fff; font-weight: 600; }
.ged-cat-count {
  background: var(--bg-input);
  color: var(--text-muted);
  font-size: 10px;
  padding: 1px 5px;
  border-radius: 8px;
}

/* Master-Detail Layout */
.ged-body {
  display: flex;
  gap: 16px;
  min-height: 400px;
}
.ged-master {
  flex: 1;
  min-width: 0;
  max-height: calc(100vh - 320px);
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-deep);
}
.ged-detail {
  width: 380px;
  flex-shrink: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg-deep);
  max-height: calc(100vh - 320px);
  overflow-y: auto;
  padding: 16px;
  position: relative;
}

/* Memory items */
.ged-item {
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background 0.12s;
}
.ged-item:hover { background: var(--bg-card); }
.ged-item.selected { background: #1a1a0a; border-left: 3px solid var(--accent); }
.ged-item:last-child { border-bottom: none; }

.ged-item-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}
.ged-item-icon { font-size: 16px; flex-shrink: 0; }
.ged-item-subject {
  flex: 1;
  font-size: 13px;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
}

.ged-item-preview {
  font-size: 11px;
  color: var(--text-dim);
  margin-bottom: 4px;
  padding-left: 24px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
}

.ged-item-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-left: 24px;
}
.ged-item-cat {
  font-size: 10px;
  color: #fff;
  padding: 1px 6px;
  border-radius: 4px;
  text-transform: uppercase;
  font-weight: 600;
}
.ged-item-source {
  font-size: 10px;
  color: var(--text-dim);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ged-item-date { font-size: 11px; color: var(--text-dim); flex-shrink: 0; }

/* Confidence badge */
.ged-conf-badge {
  font-size: 10px;
  padding: 1px 5px;
  border-radius: 4px;
  font-weight: 600;
  flex-shrink: 0;
}
.ged-conf-high { background: rgba(76,175,80,0.2); color: var(--status-ok); }
.ged-conf-medium { background: rgba(255,152,0,0.2); color: var(--status-warn); }
.ged-conf-low { background: rgba(244,67,54,0.2); color: var(--status-err); }

/* Detail panel */
.ged-detail-close {
  position: absolute;
  top: 12px;
  right: 12px;
  cursor: pointer;
  color: var(--text-dim);
  font-size: 16px;
  display: none;
}
.ged-detail-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 200px;
  color: var(--text-dim);
  font-size: 14px;
}
.ged-detail-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.ged-detail-icon { font-size: 24px; }
.ged-detail-cat {
  font-size: 11px;
  color: #fff;
  padding: 2px 8px;
  border-radius: 4px;
  text-transform: uppercase;
  font-weight: 600;
}
.ged-detail-ago {
  font-size: 11px;
  color: var(--text-dim);
  margin-left: auto;
}
.ged-detail-subject {
  font-size: 16px;
  color: #fff;
  margin: 0 0 12px 0;
  font-weight: 600;
  line-height: 1.4;
}
.ged-detail-content {
  font-size: 13px;
  color: var(--text);
  line-height: 1.6;
  margin-bottom: 16px;
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--bg-card);
  padding: 12px;
  border-radius: 6px;
  border: 1px solid var(--border);
}
.ged-detail-conf {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.ged-detail-conf-label { font-size: 11px; color: var(--text-muted); min-width: 60px; }
.ged-detail-conf-bar {
  flex: 1;
  height: 6px;
  background: var(--bg-input);
  border-radius: 3px;
  overflow: hidden;
}
.ged-detail-conf-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s;
}
.ged-detail-conf-fill.ged-conf-high { background: var(--status-ok); }
.ged-detail-conf-fill.ged-conf-medium { background: var(--status-warn); }
.ged-detail-conf-fill.ged-conf-low { background: var(--status-err); }
.ged-detail-conf-val { font-size: 12px; color: var(--text-muted); min-width: 30px; text-align: right; }

.ged-detail-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}
.ged-tag {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 12px;
}

.ged-detail-footer {
  border-top: 1px solid var(--border);
  padding-top: 12px;
}
.ged-detail-meta-row {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.ged-detail-label { color: var(--text-dim); }
.ged-detail-id {
  font-family: monospace;
  font-size: 10px;
  color: var(--text-dim);
}

/* Delete button */
.ged-detail-actions {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
}
.ged-btn-delete {
  background: #1a1010;
  border: 1px solid #4a2020;
  color: var(--status-err);
  padding: 6px 16px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s;
}
.ged-btn-delete:hover {
  background: #2a1515;
  border-color: var(--status-err);
  color: #ff6659;
}

/* Loading / Error / Empty */
.ged-loading, .ged-error, .ged-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  color: var(--text-dim);
  font-size: 14px;
  text-align: center;
}
.ged-error { color: var(--status-err); }
.ged-empty .icon { font-size: 40px; margin-bottom: 12px; }

.ged-auto-refresh {
  text-align: center;
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 16px;
}

/* Mobile */
@media (max-width: 768px) {
  #atlas-tab-content-gedaechtnis { padding: 12px; padding-top: 56px; }
  .ged-body { flex-direction: column; }
  .ged-detail {
    width: 100%;
    display: none;
    max-height: none;
  }
  .ged-detail.mobile-open { display: block; }
  .ged-detail-close { display: block; }
  .ged-master { max-height: calc(100vh - 360px); }
  .ged-stats-row { gap: 6px; }
  .ged-stat { min-width: 60px; padding: 8px 10px; }
  .ged-stat .num { font-size: 16px; }
}


/* ═══ claude-tab.css ═══ */
/* Claude Sub-Dashboard — Build H06 */
/* Sidebar + Chat Layout for the CLAUDE tab */

#atlas-tab-content-claude {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--bg);
  z-index: 50;
  opacity: 0;
  transition: opacity 0.3s ease;
}

#atlas-tab-content-claude.visible {
  display: flex;
  opacity: 1;
}

/* === SIDEBAR === */

.claude-sidebar {
  width: 260px;
  min-width: 260px;
  background: #08080d;
  border-right: 1px solid #1a1a2e;
  display: flex;
  flex-direction: column;
  padding-top: 60px;
  transition: margin-left 0.3s ease;
}

.claude-sidebar.collapsed {
  margin-left: -260px;
}

.claude-sidebar-header {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.claude-new-chat-btn {
  width: 100%;
  padding: 10px 16px;
  background: var(--accent);
  color: #000;
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s;
  letter-spacing: 0.5px;
}

.claude-new-chat-btn:hover {
  background: var(--accent-light);
}

.claude-context-select {
  width: 100%;
  padding: 8px 12px;
  background: #12121f;
  border: 1px solid #2a2a3e;
  border-radius: 6px;
  color: var(--text);
  font-size: 12px;
  font-family: inherit;
  cursor: pointer;
  transition: border-color 0.2s;
}

.claude-context-select:focus {
  outline: none;
  border-color: var(--accent);
}

.claude-chat-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px;
}

.claude-chat-list::-webkit-scrollbar {
  width: 4px;
}

.claude-chat-list::-webkit-scrollbar-track {
  background: transparent;
}

.claude-chat-list::-webkit-scrollbar-thumb {
  background: #2a2a3e;
  border-radius: 2px;
}

.claude-chat-list::-webkit-scrollbar-thumb:hover {
  background: var(--accent);
}

.claude-chat-item {
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  margin-bottom: 2px;
  transition: background 0.15s, border-color 0.15s;
  border: 1px solid transparent;
  position: relative;
}

.claude-chat-item:hover {
  background: rgba(var(--accent-rgb), 0.05);
}

.claude-chat-item.active {
  background: rgba(var(--accent-rgb), 0.08);
  border-color: var(--accent);
}

.claude-chat-item.pinned::before {
  content: '';
  position: absolute;
  top: 8px;
  right: 8px;
  width: 6px;
  height: 6px;
  background: var(--accent);
  border-radius: 50%;
}

.claude-chat-item-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 14px;
}

.claude-chat-item-preview {
  font-size: 11px;
  color: var(--text-dim);
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.claude-chat-item-date {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 3px;
}

/* === MAIN CHAT AREA === */

.claude-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding-top: 60px;
}

.claude-chat-header {
  padding: 12px 20px;
  border-bottom: 1px solid #1a1a2e;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
}

.claude-toggle-sidebar {
  background: none;
  border: 1px solid #2a2a3e;
  color: var(--text-muted);
  width: 32px;
  height: 32px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px;
  display: none;
  align-items: center;
  justify-content: center;
  transition: color 0.2s, border-color 0.2s;
}

.claude-toggle-sidebar:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.claude-chat-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  transition: background 0.15s;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}

.claude-chat-title:hover {
  background: rgba(var(--accent-rgb), 0.06);
}

/* === MESSAGES === */

.claude-messages {
  flex: 1;
  overflow-y: auto;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.claude-messages::-webkit-scrollbar {
  width: 5px;
}

.claude-messages::-webkit-scrollbar-track {
  background: transparent;
}

.claude-messages::-webkit-scrollbar-thumb {
  background: #2a2a3e;
  border-radius: 3px;
}

.claude-messages::-webkit-scrollbar-thumb:hover {
  background: var(--accent);
}

.claude-msg {
  max-width: 80%;
  padding: 12px 16px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.6;
  word-wrap: break-word;
  position: relative;
}

.claude-msg.user {
  align-self: flex-end;
  background: var(--bg-input);
  border: 1px solid #2a2a3e;
  color: var(--text);
}

.claude-msg.assistant {
  align-self: flex-start;
  background: #12121f;
  border: 1px solid #1a1a2e;
  color: var(--text);
}

.claude-msg .claude-msg-actions {
  position: absolute;
  top: 6px;
  right: 6px;
  display: none;
  gap: 4px;
}

.claude-msg:hover .claude-msg-actions {
  display: flex;
}

.claude-msg-action-btn {
  background: rgba(0, 0, 0, 0.4);
  border: none;
  color: var(--text-muted);
  width: 24px;
  height: 24px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.15s;
}

.claude-msg-action-btn:hover {
  color: var(--accent);
}

.claude-msg-images {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.claude-msg-images img {
  max-width: 120px;
  max-height: 120px;
  border-radius: 6px;
  cursor: pointer;
  transition: transform 0.15s;
  object-fit: cover;
}

.claude-msg-images img:hover {
  transform: scale(1.05);
}

/* Markdown in messages */
.claude-msg h1, .claude-msg h2, .claude-msg h3 {
  color: var(--accent);
  margin: 12px 0 6px;
  font-size: 15px;
}

.claude-msg h1 { font-size: 17px; }

.claude-msg p {
  margin: 6px 0;
}

.claude-msg ul, .claude-msg ol {
  margin: 6px 0;
  padding-left: 20px;
}

.claude-msg li {
  margin: 3px 0;
}

.claude-msg a {
  color: var(--accent);
  text-decoration: none;
}

.claude-msg a:hover {
  text-decoration: underline;
}

.claude-msg strong {
  color: var(--accent-light);
}

.claude-msg em {
  color: #bbb;
}

.claude-msg code {
  background: #0d0d15;
  padding: 2px 6px;
  border-radius: 4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  color: var(--text);
}

.claude-msg pre {
  background: #0d0d15;
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  padding: 14px;
  overflow-x: auto;
  margin: 8px 0;
  position: relative;
}

.claude-msg pre code {
  background: none;
  padding: 0;
  font-size: 12px;
  line-height: 1.5;
}

.claude-code-copy {
  position: absolute;
  top: 6px;
  right: 6px;
  background: rgba(var(--accent-rgb), 0.1);
  border: 1px solid rgba(var(--accent-rgb), 0.3);
  color: var(--accent);
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 11px;
  cursor: pointer;
  font-weight: 600;
  transition: background 0.15s;
}

.claude-code-copy:hover {
  background: rgba(var(--accent-rgb), 0.2);
}

.claude-msg blockquote {
  border-left: 3px solid var(--accent);
  margin: 8px 0;
  padding: 4px 12px;
  color: #bbb;
}

.claude-msg table {
  border-collapse: collapse;
  width: 100%;
  margin: 8px 0;
}

.claude-msg th, .claude-msg td {
  border: 1px solid #2a2a3e;
  padding: 6px 10px;
  text-align: left;
  font-size: 13px;
}

.claude-msg th {
  background: var(--bg-input);
  color: var(--accent);
  font-weight: 600;
}

/* Build 184 — atlas-md code blocks inside claude-msg override old pre styles */
.claude-msg .atlas-md-codeblock {
  margin: 8px 0;
}
.claude-msg .atlas-md-codeblock pre {
  border: none;
  border-radius: 0 0 8px 8px;
  margin: 0;
  padding: 10px;
}
.claude-msg .atlas-md-codeblock-header {
  background: rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.claude-msg .atlas-md p:first-child { margin-top: 0; }
.claude-msg .atlas-md p:last-child { margin-bottom: 0; }

/* PDF Export Button (Build 169) */
.claude-pdf-export-btn {
  background: none;
  border: 1px solid #2a2a3e;
  color: var(--text-muted);
  height: 32px;
  padding: 0 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 5px;
  transition: color 0.2s, border-color 0.2s, background 0.2s;
  flex-shrink: 0;
  font-family: inherit;
  letter-spacing: 0.5px;
}

.claude-pdf-export-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
  background: rgba(var(--accent-rgb), 0.06);
}

.claude-pdf-export-btn:disabled {
  opacity: 0.5;
  cursor: wait;
}

.claude-pdf-export-btn svg {
  flex-shrink: 0;
}

/* Welcome screen */
.claude-welcome {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--text-dim);
  text-align: center;
  padding: 40px;
}

.claude-welcome-icon {
  font-size: 48px;
  margin-bottom: 16px;
  opacity: 0.4;
}

.claude-welcome-title {
  font-size: 20px;
  font-weight: 600;
  color: var(--accent);
  letter-spacing: 2px;
  margin-bottom: 8px;
}

.claude-welcome-sub {
  font-size: 14px;
  color: var(--text-dim);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
}

/* === INPUT AREA === */

.claude-input-area {
  padding: 12px 20px 16px;
  border-top: 1px solid #1a1a2e;
  background: var(--bg);
}

.claude-image-preview {
  display: flex;
  gap: 8px;
  padding-bottom: 8px;
  flex-wrap: wrap;
}

.claude-image-preview-item {
  position: relative;
  width: 56px;
  height: 56px;
}

.claude-image-preview-item img {
  width: 56px;
  height: 56px;
  border-radius: 6px;
  object-fit: cover;
  border: 1px solid #2a2a3e;
}

.claude-image-preview-remove {
  position: absolute;
  top: -4px;
  right: -4px;
  width: 18px;
  height: 18px;
  background: var(--status-err);
  color: #fff;
  border: none;
  border-radius: 50%;
  font-size: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.claude-input-row {
  display: flex;
  align-items: flex-end;
  gap: 8px;
}

.claude-attach-btn {
  background: none;
  border: 1px solid #2a2a3e;
  color: var(--text-muted);
  width: 38px;
  height: 38px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s, border-color 0.2s;
  flex-shrink: 0;
}

.claude-attach-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
}

.claude-textarea {
  flex: 1;
  background: #12121f;
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  color: var(--text);
  padding: 10px 14px;
  font-size: 14px;
  font-family: inherit;
  resize: none;
  min-height: 38px;
  max-height: 200px;
  line-height: 1.5;
  transition: border-color 0.2s;
}

.claude-textarea:focus {
  outline: none;
  border-color: var(--accent);
}

.claude-textarea::placeholder {
  color: var(--text-dim);
}

.claude-send-btn {
  background: var(--accent);
  border: none;
  color: #000;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, transform 0.1s;
  flex-shrink: 0;
  font-weight: 700;
}

.claude-send-btn:hover {
  background: var(--accent-light);
}

.claude-send-btn:active {
  transform: scale(0.95);
}

.claude-send-btn.stop {
  background: var(--status-err);
  color: #fff;
}

.claude-send-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* Streaming indicator */
.claude-streaming-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  background: var(--accent);
  border-radius: 50%;
  animation: claude-blink 1s infinite;
  vertical-align: middle;
  margin-left: 4px;
}

@keyframes claude-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.2; }
}

/* Typing indicator (shown while waiting for first response chunk) */
.claude-typing-indicator {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 4px 0;
}

.claude-typing-indicator span {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--accent);
  border-radius: 50%;
  animation: claude-typing-bounce 1.4s infinite ease-in-out both;
}

.claude-typing-indicator span:nth-child(1) { animation-delay: 0s; }
.claude-typing-indicator span:nth-child(2) { animation-delay: 0.2s; }
.claude-typing-indicator span:nth-child(3) { animation-delay: 0.4s; }

@keyframes claude-typing-bounce {
  0%, 80%, 100% { transform: scale(0.4); opacity: 0.3; }
  40% { transform: scale(1); opacity: 1; }
}

/* Error message in chat */
.claude-error {
  align-self: center;
  background: rgba(244, 67, 54, 0.1);
  border: 1px solid rgba(244, 67, 54, 0.3);
  color: var(--status-err);
  padding: 10px 16px;
  border-radius: 8px;
  font-size: 13px;
}

/* Context menu */
.claude-context-menu {
  position: fixed;
  background: var(--bg-input);
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  padding: 4px;
  /* Gleiche Schicht wie das Projekt-Modal — ueber mobilem Tab-Container (5000). */
  z-index: 12000;
  min-width: 160px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

.claude-context-menu-item {
  padding: 8px 14px;
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
  border-radius: 6px;
  transition: background 0.1s;
}

.claude-context-menu-item:hover {
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
}

.claude-context-menu-item.danger {
  color: var(--status-err);
}

.claude-context-menu-item.danger:hover {
  background: rgba(244, 67, 54, 0.1);
}

/* Image fullscreen overlay */
.claude-image-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  /* Ueber mobilem Tab-Container (5000), sonst auf dem Handy unsichtbar. */
  z-index: 12000;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: zoom-out;
}

.claude-image-overlay img {
  max-width: 90vw;
  max-height: 90vh;
  border-radius: 8px;
}

/* === RESPONSIVE === */

/* BA-03: Mobile-Versteckregel zentral in mobile.css; bottom-nav.css
   blendet .visible-Container ein. Keine ID-basierte Blockade hier. */

@media (max-width: 1024px) and (min-width: 769px) {
  .claude-sidebar {
    position: absolute;
    z-index: 60;
    height: 100%;
  }

  .claude-toggle-sidebar {
    display: flex;
  }
}

@media (min-width: 1025px) {
  .claude-toggle-sidebar {
    display: none;
  }
}


/* Build 400: Claude Tab Upgrade Styles */

.claude-model-badge {
  font-size: 10px;
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
  border: 1px solid rgba(var(--accent-rgb), 0.3);
  padding: 2px 8px;
  border-radius: 10px;
  margin-left: 8px;
  font-weight: 600;
  letter-spacing: 0.5px;
  white-space: nowrap;
}

.claude-file-preview-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(30, 30, 50, 0.8);
  border: 1px solid rgba(var(--accent-rgb), 0.2);
  border-radius: 8px;
  padding: 8px;
  min-width: 80px;
  max-width: 120px;
  position: relative;
}

.claude-file-icon {
  font-size: 28px;
  margin-bottom: 4px;
}

.claude-file-name {
  font-size: 10px;
  color: var(--text-muted);
  text-align: center;
  word-break: break-all;
  max-height: 28px;
  overflow: hidden;
  line-height: 1.2;
}

.claude-chat-header {
  display: flex;
  align-items: center;
}

/* ============================== */
/* Build H07: Project System      */
/* ============================== */

/* Sidebar button row */
.claude-sidebar-btns {
  display: flex;
  gap: 6px;
}

.claude-sidebar-btns .claude-new-chat-btn {
  flex: 1;
}

.claude-new-project-btn {
  padding: 10px 12px;
  background: transparent;
  color: var(--accent);
  border: 1px solid var(--accent);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  letter-spacing: 0.3px;
  white-space: nowrap;
}

.claude-new-project-btn:hover {
  background: rgba(var(--accent-rgb), 0.15);
  color: var(--accent-light);
}

/* Sidebar nav tabs */
.claude-sidebar-nav {
  display: flex;
  border-bottom: 1px solid #1a1a2e;
  padding: 0 8px;
}

.claude-nav-tab {
  flex: 1;
  padding: 8px 4px;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--text-dim);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  transition: color 0.2s, border-color 0.2s;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.claude-nav-tab:hover {
  color: var(--text-muted);
}

.claude-nav-tab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

/* Project list items */
.claude-project-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  margin: 2px 0;
  border: 1px solid transparent;
  transition: background 0.15s, border-color 0.15s;
}

.claude-project-item:hover {
  background: rgba(var(--accent-rgb), 0.05);
}

.claude-project-item-icon {
  font-size: 20px;
  flex-shrink: 0;
  opacity: 0.7;
}

.claude-project-item-info {
  flex: 1;
  min-width: 0;
}

.claude-project-item-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.claude-project-item-meta {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 2px;
}

.claude-project-item-actions {
  display: none;
  gap: 2px;
  flex-shrink: 0;
}

.claude-project-item:hover .claude-project-item-actions {
  display: flex;
}

.claude-project-edit-btn,
.claude-project-delete-btn {
  background: none;
  border: none;
  color: var(--text-dim);
  width: 24px;
  height: 24px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.15s, background 0.15s;
}

.claude-project-edit-btn:hover {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
}

.claude-project-delete-btn:hover {
  color: var(--status-err);
  background: rgba(244, 67, 54, 0.1);
}

.claude-new-project-inline {
  background: transparent;
  border: 1px dashed var(--border-light);
  color: var(--text-muted);
  padding: 8px 16px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 12px;
  transition: border-color 0.2s, color 0.2s;
}

.claude-new-project-inline:hover {
  border-color: var(--accent);
  color: var(--accent);
}

/* Project detail panel */
.claude-project-detail {
  border-bottom: 1px solid #1a1a2e;
  padding: 12px;
  background: rgba(var(--accent-rgb), 0.02);
}

.claude-project-detail-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.claude-project-back {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 16px;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.15s;
  flex-shrink: 0;
}

.claude-project-back:hover {
  color: var(--accent);
}

.claude-project-detail-title {
  flex: 1;
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.claude-project-settings {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 14px;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.15s;
  flex-shrink: 0;
}

.claude-project-settings:hover {
  color: var(--accent);
}

.claude-project-detail-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 10px;
}

.claude-project-detail-instructions,
.claude-project-detail-files {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.15s;
}

.claude-project-detail-instructions:hover,
.claude-project-detail-files:hover {
  background: rgba(var(--accent-rgb), 0.06);
}

.claude-project-meta-icon {
  font-size: 12px;
  flex-shrink: 0;
}

.claude-project-meta-text {
  font-size: 11px;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.claude-project-new-chat {
  width: 100%;
  padding: 7px 12px;
  background: rgba(var(--accent-rgb), 0.1);
  color: var(--accent);
  border: 1px dashed rgba(var(--accent-rgb), 0.3);
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}

.claude-project-new-chat:hover {
  background: rgba(var(--accent-rgb), 0.2);
  border-color: var(--accent);
}

/* Chat item project label */
.claude-chat-item-project {
  display: inline-block;
  font-size: 9px;
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
  padding: 1px 6px;
  border-radius: 3px;
  margin-top: 2px;
}

/* Nachrichten-Kontextmenue ist fokussierbar (Escape-Ziel), Fokus-Outline stoert hier. */
.claude-msg-menue:focus {
  outline: none;
}

/* Context menu separator */
.claude-context-menu-sep {
  height: 1px;
  background: #2a2a3e;
  margin: 4px 8px;
}

/* Kurzer Hinweis-Toast (z. B. nach dem Verzweigen eines Chats, Build 435).
   z-index 12000 haelt ihn ueber dem mobilen Tab-Container (5000)/Bottom-Nav (10001). */
.claude-toast {
  position: fixed;
  left: 50%;
  bottom: 88px;
  transform: translateX(-50%) translateY(12px);
  background: var(--bg-input);
  color: var(--text);
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  padding: 10px 18px;
  font-size: 13px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
  z-index: 12000;
  opacity: 0;
  transition: opacity 0.25s, transform 0.25s;
  pointer-events: none;
  max-width: 80vw;
}

.claude-toast.visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ============================== */
/* Project Modal                   */
/* ============================== */

.claude-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  /* Muss ueber dem mobilen Tab-Container (bottom-nav.css: z-index 5000) und der
     Bottom-Nav (10001) liegen, sonst ist das Modal auf dem Handy unsichtbar. */
  z-index: 12000;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(4px);
}

.claude-modal {
  background: #12121f;
  border: 1px solid #2a2a3e;
  border-radius: 12px;
  width: 560px;
  max-width: 90vw;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.claude-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid #2a2a3e;
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
}

.claude-modal-close {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 20px;
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  transition: color 0.15s;
}

.claude-modal-close:hover {
  color: var(--status-err);
}

.claude-modal-body {
  padding: 20px;
  overflow-y: auto;
  flex: 1;
}

.claude-modal-label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 6px;
  margin-top: 16px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.claude-modal-label:first-child {
  margin-top: 0;
}

.claude-modal-hint {
  font-size: 11px;
  color: var(--text-dim);
  margin-bottom: 8px;
  line-height: 1.4;
}

.claude-modal-input {
  width: 100%;
  padding: 10px 14px;
  background: var(--bg);
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  color: var(--text);
  font-size: 14px;
  font-family: inherit;
  transition: border-color 0.2s;
  box-sizing: border-box;
}

.claude-modal-input:focus {
  outline: none;
  border-color: var(--accent);
}

.claude-modal-textarea {
  width: 100%;
  min-height: 120px;
  max-height: 300px;
  padding: 10px 14px;
  background: var(--bg);
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  color: var(--text);
  font-size: 13px;
  font-family: inherit;
  resize: vertical;
  line-height: 1.6;
  transition: border-color 0.2s;
  box-sizing: border-box;
}

.claude-modal-textarea:focus {
  outline: none;
  border-color: var(--accent);
}

.claude-modal-textarea::placeholder {
  color: var(--text-dim);
}

/* === CHAT-ANWEISUNGEN (Welle13 Build 432) === */

/* Zeichenzaehler unten rechts im Anweisungs-Modal */
.claude-anw-counter {
  margin-top: 6px;
  text-align: right;
  font-size: 11px;
  color: var(--text-dim);
}

/* 📋-Symbol in der Chat-Liste, wenn ein Chat eigene Anweisungen hat */
.claude-chat-item-anw {
  font-size: 11px;
  opacity: 0.85;
}

/* 📋-Symbol im Chat-Header (klickbar) */
.claude-chat-header-anw {
  cursor: pointer;
  font-size: 14px;
  opacity: 0.85;
  transition: opacity 0.15s;
}

.claude-chat-header-anw:hover {
  opacity: 1;
}

/* Herkunfts-Badge „↳ verzweigt" im Chat-Header (Build 435). Klick oeffnet Quell-Chat. */
.claude-chat-header-branch {
  cursor: pointer;
  font-size: 11px;
  color: var(--text-dim, #9aa0b4);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid #2a2a3e;
  border-radius: 10px;
  padding: 2px 8px;
  margin-left: 8px;
  white-space: nowrap;
  transition: color 0.15s, background 0.15s;
}

.claude-chat-header-branch:hover {
  color: var(--accent);
  background: rgba(var(--accent-rgb), 0.1);
}

.claude-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px 20px;
  border-top: 1px solid #2a2a3e;
}

.claude-modal-cancel {
  padding: 8px 16px;
  background: var(--bg-input);
  border: 1px solid #2a2a3e;
  border-radius: 6px;
  color: var(--text-muted);
  font-size: 13px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.claude-modal-cancel:hover {
  background: #2a2a3e;
  color: var(--text);
}

.claude-modal-save {
  padding: 8px 20px;
  background: var(--accent);
  border: none;
  border-radius: 6px;
  color: #000;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s;
}

.claude-modal-save:hover {
  background: var(--accent-light);
}

/* Project files area in modal */
.claude-project-files-area {
  background: var(--bg);
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  padding: 8px;
  max-height: 200px;
  overflow-y: auto;
}

.claude-project-files-empty {
  text-align: center;
  padding: 16px;
  color: var(--text-dim);
  font-size: 12px;
}

.claude-project-file-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 6px;
  transition: background 0.15s;
}

.claude-project-file-item:hover {
  background: rgba(255, 255, 255, 0.03);
}

.claude-project-file-icon {
  font-size: 14px;
  flex-shrink: 0;
}

.claude-project-file-name {
  flex: 1;
  font-size: 12px;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.claude-project-file-size {
  font-size: 10px;
  color: var(--text-dim);
  flex-shrink: 0;
}

.claude-project-file-remove {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 14px;
  cursor: pointer;
  padding: 2px 4px;
  border-radius: 4px;
  transition: color 0.15s;
  flex-shrink: 0;
}

.claude-project-file-remove:hover {
  color: var(--status-err);
}

.claude-modal-file-actions {
  margin-top: 8px;
}

.claude-modal-file-add {
  background: transparent;
  border: 1px dashed var(--border-light);
  color: var(--text-muted);
  padding: 6px 14px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  transition: border-color 0.2s, color 0.2s;
}

.claude-modal-file-add:hover {
  border-color: var(--accent);
  color: var(--accent);
}

/* ============================== */
/* Message-Queue (Build 433)       */
/* ============================== */

/* Wartende Nachrichten waehrend eine Antwort streamt — schmale Zeilen direkt
   ueber dem Eingabefeld (claude-tab.js: renderQueue). Neubau 2026-07-13. */
.claude-queue {
  display: none;
  flex-direction: column;
  gap: 4px;
  padding: 6px 16px 0;
}

.claude-queue-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 10px;
  background: rgba(var(--accent-rgb), 0.08);
  border: 1px solid rgba(var(--accent-rgb), 0.25);
  border-radius: 6px;
  font-size: 12px;
  color: var(--text-muted);
}

.claude-queue-text {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.claude-queue-remove {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  background: transparent;
  border: none;
  border-radius: 4px;
  color: var(--text-dim);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

.claude-queue-remove:hover {
  color: #f44336;
  background: rgba(244, 67, 54, 0.12);
}

.claude-queue-paused {
  padding: 5px 10px;
  border: 1px dashed rgba(244, 67, 54, 0.5);
  border-radius: 6px;
  color: #f0a0a0;
  font-size: 12px;
  cursor: pointer;
}

.claude-queue-paused:hover {
  background: rgba(244, 67, 54, 0.08);
}

/* ============================== */
/* Fremd-Overlay-Ausweichen        */
/* ============================== */

/* Der Visual-Edit-Stift (.ave-btn, fixed unten rechts, z-index 99999) lag genau
   ueber dem Senden-Button — Klick auf "Senden" traf den Stift (Vollcheck 2026-07-08).
   Diese Regel ist nur noch die statische Basisposition im offenen CLAUDE-Tab.
   Die Kollisionsklasse selbst loest seit 2026-07-13 der Kollisions-Waechter
   visual-edit-ausweichen.js GRUNDSAETZLICH: liegen Bedienelemente unter dem Stift
   (z. B. die Queue-Zeilen aus Build 433), weicht er automatisch weiter nach oben
   aus. Mobile hat in visual-edit-mode.css einen eigenen Offset ueber der Bottom-Nav. */
@media (min-width: 769px) {
  body:has(#atlas-tab-content-claude.visible) .ave-btn {
    bottom: 110px;
  }
}

/* === Welle13 F1b (Build 437): Lazy-Load-Verlauf + Zusammenfassungs-Chip === */

/* Ladezeile beim Nachladen aelteren Verlaufs (oben im Nachrichtenbereich). */
.claude-older-loading {
  text-align: center;
  padding: 10px 12px;
  font-size: 13px;
  color: var(--text-dim);
  letter-spacing: 1px;
  opacity: 0.85;
}

/* Dezenter Chip am Kopf des Verlaufs, wenn aelterer Verlauf zusammengefasst ist. */
.claude-summary-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 4px auto 14px;
  padding: 6px 12px;
  font-size: 12.5px;
  color: var(--text-dim);
  background: rgba(var(--accent-rgb), 0.08);
  border: 1px solid rgba(var(--accent-rgb), 0.25);
  border-radius: 14px;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.claude-summary-chip:hover {
  background: rgba(var(--accent-rgb), 0.16);
  color: var(--accent);
}

.claude-summary-chip-icon {
  font-size: 13px;
}

/* Lesetext im Zusammenfassungs-Modal. */
.claude-summary-modal-text {
  white-space: pre-wrap;
  line-height: 1.55;
  font-size: 14px;
  color: var(--text);
  max-height: 60vh;
  overflow-y: auto;
}

/* === MULTI-TAB-LEISTE (Build 439) === */

.claude-multitab-leiste {
  display: flex;
  align-items: stretch;
  gap: 4px;
  padding: 6px 8px 0 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  flex-shrink: 0;
  border-bottom: 1px solid rgba(var(--accent-rgb), 0.25);
  background: rgba(0, 0, 0, 0.25);
}

.claude-multitab-tab {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 40px; /* Touch-Ziel auf Mobil (Auftrag: >= 40 px) */
  padding: 0 4px 0 12px;
  border: 1px solid rgba(var(--accent-rgb), 0.25);
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  cursor: pointer;
  white-space: nowrap;
  max-width: 220px;
  /* Tor-Befund Erstpruefung (Stufe 5): min-width:0 + Default-flex-shrink liess die
     Tabs auf Mobil schrumpfen statt die Leiste scrollen zu lassen (Titel unlesbar).
     flex-shrink:0 haelt die natuerliche Tab-Breite, overflow-x der Leiste greift. */
  flex-shrink: 0;
  color: var(--text-dim);
  background: rgba(255, 255, 255, 0.03);
}

.claude-multitab-tab.aktiv {
  background: rgba(var(--accent-rgb), 0.18);
  border-color: var(--accent);
  color: var(--accent);
}

.claude-multitab-titel {
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
}

.claude-multitab-close {
  background: none;
  border: none;
  color: inherit;
  cursor: pointer;
  font-size: 12px;
  padding: 4px;
  min-width: 24px;
  min-height: 24px;
  border-radius: 4px;
  opacity: 0.6;
}

.claude-multitab-close:hover {
  opacity: 1;
  background: rgba(255, 255, 255, 0.1);
}

.claude-multitab-neu {
  min-width: 40px;
  min-height: 40px;
  flex-shrink: 0;
  background: none;
  border: 1px dashed rgba(var(--accent-rgb), 0.4);
  border-bottom: none;
  border-radius: 8px 8px 0 0;
  color: var(--accent);
  font-size: 18px;
  cursor: pointer;
}

.claude-multitab-neu:hover {
  background: rgba(var(--accent-rgb), 0.1);
}

.claude-multitab-puls {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
  animation: claude-multitab-puls 1.2s ease-in-out infinite;
  flex-shrink: 0;
}

@keyframes claude-multitab-puls {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(0.75); }
}

.claude-multitab-badge {
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  background: var(--accent);
  color: #000;
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  flex-shrink: 0;
}

/* ============================== */
/* Tag-Bibliothek (Build 441)      */
/* ============================== */

.claude-tags-suche {
  width: 100%;
  box-sizing: border-box;
  background: var(--bg-input);
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  padding: 8px 10px;
  color: var(--text);
  font-size: 13px;
  margin-bottom: 8px;
  outline: none;
}

.claude-tags-suche:focus {
  border-color: var(--accent);
}

.claude-tags-hinweis {
  text-align: center;
  padding: 20px 12px;
  color: var(--text-dim);
  font-size: 12px;
}

/* Ruhige Hinweis-Karte im Stil der bestehenden Empty-States (fail-open vor Migration) */
.claude-tags-hinweis-karte {
  text-align: center;
  padding: 30px 16px;
  color: var(--text-dim);
  font-size: 13px;
  border: 1px dashed #2a2a3e;
  border-radius: 10px;
  margin: 8px 2px;
}

.claude-tags-hinweis-icon {
  font-size: 24px;
  opacity: 0.4;
  margin-bottom: 8px;
}

.claude-tag-item {
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  margin-bottom: 4px;
  background: rgba(var(--accent-rgb), 0.03);
}

.claude-tag-item:hover {
  border-color: #2a2a3e;
}

.claude-tag-item-kopf {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.claude-tag-item-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.claude-tag-loeschen {
  background: none;
  border: none;
  color: var(--text-dim);
  cursor: pointer;
  font-size: 13px;
  padding: 2px 4px;
  border-radius: 4px;
  flex-shrink: 0;
}

.claude-tag-loeschen:hover {
  color: var(--status-err);
}

.claude-tag-item-datum {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 2px;
}

/* Snippet-Vorschau: genau 2 Zeilen */
.claude-tag-item-snippet {
  font-size: 11px;
  color: var(--text-dim);
  margin-top: 4px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}

.claude-tag-einfuegen {
  margin-top: 8px;
  background: rgba(var(--accent-rgb), 0.1);
  border: 1px solid var(--accent);
  color: var(--accent);
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}

.claude-tag-einfuegen:hover {
  background: rgba(var(--accent-rgb), 0.2);
}

/* Tag-Modal: Snippet-Vorschau als scrollbarer Block */
.claude-tag-modal-vorschau {
  background: var(--bg-input);
  border: 1px solid #2a2a3e;
  border-radius: 8px;
  padding: 10px;
  font-size: 12px;
  color: var(--text-dim);
  max-height: 180px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
  margin: 0;
}

.claude-tag-modal-fehler {
  color: var(--status-err);
  font-size: 12px;
  margin-top: 8px;
}

/* 🏷-Knopf in der Projekt-Datei-Liste (neben dem Entfernen-Knopf) */
.claude-project-file-tag {
  background: none;
  border: none;
  color: var(--text-dim);
  cursor: pointer;
  font-size: 13px;
  padding: 2px 4px;
  border-radius: 4px;
  flex-shrink: 0;
}

.claude-project-file-tag:hover {
  color: var(--accent);
}


/* ═══ context-indicator.css ═══ */
/* Atlas Kontext-Badge im Chat-Header — Build 170 */

#ctx-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px 4px 7px;
  border-radius: 16px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all 0.25s ease;
  border: 1px solid rgba(255,255,255,0.15);
  position: relative;
  user-select: none;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  flex-shrink: 0;
  margin-left: auto;
}

#ctx-badge:hover {
  border-color: rgba(255,255,255,0.35);
  transform: scale(1.04);
}

#ctx-badge .ctx-badge-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  transition: background 0.3s ease;
  flex-shrink: 0;
}

#ctx-badge .ctx-badge-dot.pulse {
  animation: ctx-badge-pulse 1.5s ease-in-out 3;
}

@keyframes ctx-badge-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.6); opacity: 0.6; }
}

#ctx-badge .ctx-badge-label {
  color: rgba(255,255,255,0.9);
  white-space: nowrap;
  line-height: 1;
}

#ctx-badge .ctx-badge-arrow {
  font-size: 8px;
  color: rgba(255,255,255,0.35);
  transition: transform 0.2s;
  margin-left: 1px;
}

#ctx-badge.open .ctx-badge-arrow {
  transform: rotate(180deg);
}

/* Dropdown */

#ctx-badge-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 220px;
  background: #141418;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 6px;
  z-index: 10001;
  box-shadow: 0 12px 40px rgba(0,0,0,0.6);
}

#ctx-badge-dropdown.show {
  display: block;
  animation: ctx-dd-in 0.2s ease;
}

@keyframes ctx-dd-in {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

.ctx-dd-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.15s;
  font-size: 12px;
  color: rgba(255,255,255,0.7);
}

.ctx-dd-item:hover {
  background: rgba(255,255,255,0.07);
}

.ctx-dd-item.active {
  background: rgba(255,255,255,0.05);
  color: #fff;
}

.ctx-dd-item .ctx-dd-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.ctx-dd-item .ctx-dd-name {
  flex: 1;
  font-weight: 600;
}

.ctx-dd-item .ctx-dd-short {
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,0.35);
  letter-spacing: 0.5px;
}

.ctx-dd-item .ctx-dd-check {
  font-size: 14px;
  opacity: 0;
  color: var(--status-ok);
}

.ctx-dd-item.active .ctx-dd-check {
  opacity: 1;
}

/* Toast */

#ctx-badge-toast {
  position: fixed;
  top: 70px;
  left: 50%;
  transform: translateX(-50%) translateY(-20px);
  padding: 8px 20px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  z-index: 10002;
  opacity: 0;
  pointer-events: none;
  transition: all 0.35s ease;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  white-space: nowrap;
  border: 1px solid rgba(255,255,255,0.15);
  backdrop-filter: blur(8px);
}

#ctx-badge-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}


/* ═══ markdown-chat.css ═══ */
/* Build 101 – Markdown Chat Rendering */

.atlas-md h1, .atlas-md h2, .atlas-md h3, .atlas-md h4 {
  margin: 8px 0 4px 0;
  line-height: 1.3;
}
.atlas-md h1 { font-size: 1.3em; }
.atlas-md h2 { font-size: 1.15em; }
.atlas-md h3 { font-size: 1.05em; }

.atlas-md p { margin: 4px 0; }

.atlas-md ul, .atlas-md ol {
  margin: 4px 0 4px 16px;
  padding: 0;
}
.atlas-md li { margin: 2px 0; }

.atlas-md blockquote {
  margin: 6px 0;
  padding: 4px 10px;
  border-left: 3px solid var(--blockquote-border, rgba(255,255,255,0.2));
  color: var(--blockquote-text, rgba(255,255,255,0.7));
}

.atlas-md table {
  border-collapse: collapse;
  margin: 6px 0;
  font-size: inherit;
}
.atlas-md th, .atlas-md td {
  border: 1px solid var(--table-border, rgba(255,255,255,0.15));
  padding: 4px 8px;
  text-align: left;
}
.atlas-md th {
  background: var(--table-header, rgba(255,255,255,0.06));
}

.atlas-md code:not(.hljs) {
  background: var(--code-bg, rgba(255,255,255,0.1));
  padding: 1px 5px;
  border-radius: 4px;
  font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
  font-size: 0.92em;
}

.atlas-md-codeblock {
  position: relative;
  margin: 6px 0;
  border-radius: 8px;
  overflow: hidden;
  background: var(--codeblock-bg, rgba(0,0,0,0.4));
  border: 1px solid var(--table-border, rgba(255,255,255,0.1));
}

.atlas-md-codeblock-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 10px;
  background: var(--codeblock-header, rgba(255,255,255,0.06));
  font-size: 0.8em;
  color: var(--codeblock-label, rgba(255,255,255,0.4));
  letter-spacing: 0.5px;
}

.atlas-md-copy-btn {
  background: transparent;
  border: 1px solid var(--copy-btn-border, rgba(255,255,255,0.15));
  color: var(--copy-btn-text, rgba(255,255,255,0.5));
  font-size: 0.85em;
  padding: 2px 8px;
  border-radius: 4px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.2s;
}
.atlas-md-copy-btn:hover {
  background: rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.8);
}

.atlas-md-codeblock pre {
  margin: 0;
  padding: 10px;
  overflow-x: auto;
  font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
  font-size: 0.9em;
  line-height: 1.5;
}
.atlas-md-codeblock pre code {
  background: none !important;
  padding: 0 !important;
}

.atlas-md a {
  color: var(--accent);
  text-decoration: underline;
}
.atlas-md a:hover {
  color: var(--accent-light);
}

.atlas-md hr {
  border: none;
  border-top: 1px solid var(--hr-color, rgba(255,255,255,0.15));
  margin: 8px 0;
}

.atlas-md strong { font-weight: 600; }
.atlas-md em { font-style: italic; }

.atlas-md input[type="checkbox"] {
  margin-right: 6px;
  pointer-events: none;
}


/* ═══ voice-input.css ═══ */
/* Voice Input UI — Whisper API (replaces Web Speech API) */
.vi-container {
  display: flex;
  align-items: center;
  gap: 4px;
  position: relative;
}
.vi-mic-btn {
  background: transparent;
  border: 1px solid rgba(var(--accent-rgb),0.3);
  color: rgba(var(--accent-rgb),0.7);
  font-size: 16px;
  width: 38px;
  height: 38px;
  cursor: pointer;
  border-radius: 6px;
  font-family: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  flex-shrink: 0;
}
.vi-mic-btn:hover {
  border-color: rgba(var(--accent-rgb),0.6);
  color: rgba(var(--accent-rgb),1);
}
.vi-mic-btn.recording {
  background: rgba(220,40,60,0.15);
  border-color: rgba(220,40,60,0.7);
  color: #ff4466;
  animation: vi-pulse 1.5s ease-in-out infinite;
}
.vi-mic-btn.processing {
  background: rgba(var(--accent-rgb),0.1);
  border-color: rgba(var(--accent-rgb),0.5);
  color: rgba(var(--accent-rgb),0.9);
  pointer-events: none;
}

@keyframes vi-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(220,40,60,0.3); }
  50% { box-shadow: 0 0 0 8px rgba(220,40,60,0); }
}

.vi-recording-panel {
  position: absolute;
  bottom: calc(100% + 8px);
  right: 0;
  background: rgba(12,12,12,0.97);
  border: 1px solid rgba(220,40,60,0.4);
  border-radius: 10px;
  padding: 12px;
  min-width: 260px;
  z-index: 1001;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.7);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.vi-recording-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.vi-rec-indicator {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: #ff4466;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.vi-rec-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff4466;
  animation: vi-blink 1s step-end infinite;
}
@keyframes vi-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.2; }
}
.vi-timer {
  font-size: 11px;
  color: rgba(var(--accent-rgb),0.7);
  font-family: monospace;
  font-variant-numeric: tabular-nums;
}
.vi-waveform-wrap {
  position: relative;
  height: 48px;
  border-radius: 6px;
  overflow: hidden;
  background: rgba(255,255,255,0.03);
}
.vi-waveform-wrap canvas {
  width: 100%;
  height: 100%;
  display: block;
}
.vi-fallback-bars {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 2px;
  height: 48px;
  padding: 4px 0;
}
.vi-fallback-bar {
  width: 3px;
  border-radius: 2px;
  background: #ff4466;
  transition: height 0.08s;
}
.vi-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.vi-stop-btn {
  background: rgba(220,40,60,0.2);
  border: 1px solid rgba(220,40,60,0.6);
  color: #ff5577;
  font-size: 10px;
  padding: 6px 16px;
  cursor: pointer;
  border-radius: 5px;
  font-family: inherit;
  font-weight: 600;
  letter-spacing: 0.5px;
  transition: all 0.15s;
  display: flex;
  align-items: center;
  gap: 6px;
}
.vi-stop-btn:hover {
  background: rgba(220,40,60,0.35);
  border-color: rgba(220,40,60,0.9);
}
.vi-lang-select {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(var(--accent-rgb),0.25);
  color: rgba(var(--accent-rgb),0.8);
  font-size: 10px;
  padding: 5px 8px;
  border-radius: 4px;
  font-family: inherit;
  cursor: pointer;
  outline: none;
}
.vi-lang-select:focus {
  border-color: rgba(var(--accent-rgb),0.5);
}
.vi-transcript-preview {
  font-size: 10px;
  color: rgba(255,255,255,0.6);
  font-style: italic;
  max-height: 36px;
  overflow: hidden;
  line-height: 1.4;
  word-break: break-word;
}
.vi-processing-panel {
  position: absolute;
  bottom: calc(100% + 8px);
  right: 0;
  background: rgba(12,12,12,0.97);
  border: 1px solid rgba(var(--accent-rgb),0.3);
  border-radius: 10px;
  padding: 14px 18px;
  z-index: 1001;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.7);
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 180px;
}
.vi-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(var(--accent-rgb),0.2);
  border-top-color: rgba(var(--accent-rgb),0.8);
  border-radius: 50%;
  animation: vi-spin 0.8s linear infinite;
}
@keyframes vi-spin {
  to { transform: rotate(360deg); }
}
.vi-processing-text {
  font-size: 10px;
  color: rgba(var(--accent-rgb),0.7);
  letter-spacing: 0.5px;
}

/* Inline stop button — appears next to mic while recording */
.vi-inline-stop-btn {
  background: transparent;
  border: 1px solid rgba(var(--accent-rgb),0.3);
  color: rgba(var(--accent-rgb),0.7);
  width: 32px;
  height: 32px;
  cursor: pointer;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  flex-shrink: 0;
  padding: 0;
}
.vi-inline-stop-btn:hover {
  border-color: rgba(var(--accent-rgb),0.8);
  background: rgba(var(--accent-rgb),0.12);
  color: rgba(var(--accent-rgb),1);
}
.vi-inline-stop-btn:active {
  background: rgba(var(--accent-rgb),0.2);
}
.vi-stop-square {
  display: block;
  width: 10px;
  height: 10px;
  background: rgba(var(--accent-rgb),0.85);
  border-radius: 1.5px;
  transition: background 0.2s;
}
.vi-inline-stop-btn:hover .vi-stop-square {
  background: rgba(var(--accent-rgb),1);
}


/* ═══ conversation-mode.css ═══ */
/* Conversation Mode UI — Build 407 */

/* ── Mic Wrapper (ring + label host) ── */
.cm-mic-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
@media (pointer: coarse) {
  .cm-mic-wrap {
    min-width: 60px;
    min-height: 60px;
  }
}

/* Gold pulse override when conversation mode is listening */
.cm-mic-wrap[data-fsm="listening"] .vi-mic-btn {
  background: rgba(var(--accent-rgb),0.15) !important;
  border-color: rgba(var(--accent-rgb),0.7) !important;
  color: var(--accent) !important;
  animation: cm-pulse 1.5s ease-in-out infinite !important;
}
.cm-mic-wrap[data-fsm="thinking"] .vi-mic-btn {
  background: rgba(var(--accent-rgb),0.1) !important;
  border-color: rgba(var(--accent-rgb),0.5) !important;
  color: rgba(var(--accent-rgb),0.9) !important;
  pointer-events: none;
}
.cm-mic-wrap[data-fsm="speaking"] .vi-mic-btn {
  background: rgba(var(--accent-rgb),0.08) !important;
  border-color: rgba(var(--accent-rgb),0.4) !important;
  color: var(--accent) !important;
}

@keyframes cm-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb),0.35); }
  50% { box-shadow: 0 0 0 8px rgba(var(--accent-rgb),0); }
}

/* ── SVG Countdown Ring ── */
.cm-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56px;
  height: 56px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease;
  z-index: 1;
}
.cm-ring.cm-ring-active {
  opacity: 1;
}
.cm-ring-svg {
  width: 100%;
  height: 100%;
  display: block;
}
.cm-ring-bg {
  fill: none;
  stroke: rgba(var(--accent-rgb),0.12);
  stroke-width: 2.5;
}
.cm-ring-fg {
  fill: none;
  stroke: var(--accent);
  stroke-width: 3;
  stroke-linecap: round;
  filter: drop-shadow(0 0 4px rgba(var(--accent-rgb),0.5));
  transition: stroke-dashoffset 60ms linear;
}

/* ── State Label ── */
.cm-label {
  position: absolute;
  bottom: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1.5px;
  font-family: 'SF Mono', 'Fira Code', monospace;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s;
  text-shadow: 0 0 6px currentColor;
}
.cm-label:not(:empty) {
  opacity: 1;
}
.cm-label[data-state="listening"] {
  color: var(--accent);
  animation: cm-label-pulse 2s ease-in-out infinite;
}
.cm-label[data-state="thinking"] {
  color: var(--status-warn);
  animation: cm-label-blink 1s step-end infinite;
}
.cm-label[data-state="speaking"] {
  color: var(--accent);
}
@keyframes cm-label-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
@keyframes cm-label-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* ── Toggle Button ── */
.cm-toggle {
  background: transparent;
  border: 1px solid rgba(var(--accent-rgb),0.2);
  color: rgba(var(--accent-rgb),0.4);
  width: 28px;
  height: 28px;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s;
  flex-shrink: 0;
  padding: 0;
}
.cm-toggle:hover {
  border-color: rgba(var(--accent-rgb),0.5);
  color: rgba(var(--accent-rgb),0.7);
}
.cm-toggle.cm-on {
  background: rgba(var(--accent-rgb),0.15);
  border-color: rgba(var(--accent-rgb),0.6);
  color: var(--accent);
  box-shadow: 0 0 10px rgba(var(--accent-rgb),0.25);
}
.cm-toggle.cm-on:hover {
  box-shadow: 0 0 14px rgba(var(--accent-rgb),0.4);
}

/* ── Settings Gear ── */
.cm-gear {
  background: transparent;
  border: none;
  color: rgba(var(--accent-rgb),0.3);
  font-size: 13px;
  cursor: pointer;
  padding: 2px 4px;
  transition: color 0.2s;
  flex-shrink: 0;
}
.cm-gear:hover {
  color: rgba(var(--accent-rgb),0.7);
}

/* ── Settings Panel ── */
.cm-settings {
  position: absolute;
  bottom: calc(100% + 8px);
  right: 0;
  background: rgba(10,10,15,0.97);
  border: 1px solid rgba(var(--accent-rgb),0.25);
  border-radius: 10px;
  padding: 14px 16px;
  min-width: 260px;
  max-width: 320px;
  z-index: 1002;
  box-shadow: 0 -4px 24px rgba(0,0,0,0.7), 0 0 1px rgba(var(--accent-rgb),0.2);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cm-stitle {
  font-size: 10px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(var(--accent-rgb),0.15);
}
.cm-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.cm-row > label {
  font-size: 11px;
  color: rgba(255,255,255,0.7);
  white-space: nowrap;
  flex-shrink: 0;
}
.cm-inp {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(var(--accent-rgb),0.2);
  border-radius: 5px;
  color: rgba(255,255,255,0.9);
  font-size: 11px;
  padding: 5px 8px;
  width: 130px;
  font-family: inherit;
  outline: none;
  transition: border-color 0.2s;
}
.cm-inp:focus {
  border-color: rgba(var(--accent-rgb),0.5);
}

/* Toggle switch */
.cm-switch {
  position: relative;
  display: inline-block;
  width: 36px;
  height: 20px;
  cursor: pointer;
}
.cm-switch input {
  opacity: 0;
  width: 0;
  height: 0;
  position: absolute;
}
.cm-slider-toggle {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(255,255,255,0.1);
  border-radius: 10px;
  transition: background 0.25s;
}
.cm-slider-toggle::before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  left: 2px;
  bottom: 2px;
  background: rgba(255,255,255,0.5);
  transition: transform 0.25s, background 0.25s;
}
.cm-switch input:checked + .cm-slider-toggle {
  background: rgba(var(--accent-rgb),0.3);
}
.cm-switch input:checked + .cm-slider-toggle::before {
  transform: translateX(16px);
  background: var(--accent);
}

/* Range slider */
.cm-sl-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}
.cm-sl {
  flex: 1;
  min-width: 0;
  height: 4px;
  -webkit-appearance: none;
  appearance: none;
  background: rgba(var(--accent-rgb),0.15);
  border-radius: 2px;
  outline: none;
}
.cm-sl::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--accent);
  cursor: pointer;
  box-shadow: 0 0 4px rgba(var(--accent-rgb),0.4);
}
.cm-sl::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--accent);
  cursor: pointer;
  border: none;
  box-shadow: 0 0 4px rgba(var(--accent-rgb),0.4);
}
.cm-sl-val {
  font-size: 10px;
  color: rgba(var(--accent-rgb),0.7);
  font-family: monospace;
  font-variant-numeric: tabular-nums;
  min-width: 24px;
  text-align: right;
}

.cm-hint {
  font-size: 9px;
  color: rgba(255,255,255,0.35);
  line-height: 1.5;
  border-top: 1px solid rgba(var(--accent-rgb),0.1);
  padding-top: 6px;
}


/* ═══ theme-toggle.css ═══ */
/* Build 105 + v6 Theme-System: Design Tokens */

:root {
  --bg: #010101;
  --bg-deep: #010101;
  --bg-elev: #0a0a0a;
  --bg-card: #141414;
  --bg-input: #1a1a1a;
  --bg-panel: rgba(0, 0, 0, 0.4);
  --text: #e0e0e0;
  --text-muted: #888;
  --accent: #d4af37;
  --accent-light: #f0d060;
  --accent-rgb: 212, 175, 55;
  --border: #1a1a1a;
  --border-light: #333;
  --card-bg: rgba(0, 0, 0, 0.4);
  --card-shadow: 0 4px 24px rgba(0, 0, 0, 0.5);
  --overlay: rgba(10, 10, 10, 0.95);
  --code-bg: rgba(255, 255, 255, 0.1);
  --blockquote-border: rgba(255, 255, 255, 0.2);
  --blockquote-text: rgba(255, 255, 255, 0.7);
  --table-border: rgba(255, 255, 255, 0.15);
  --table-header: rgba(255, 255, 255, 0.06);
  --codeblock-bg: rgba(0, 0, 0, 0.4);
  --codeblock-header: rgba(255, 255, 255, 0.06);
  --codeblock-label: rgba(255, 255, 255, 0.4);
  --copy-btn-border: rgba(255, 255, 255, 0.15);
  --copy-btn-text: rgba(255, 255, 255, 0.5);
  --hr-color: rgba(255, 255, 255, 0.15);
  --glow-opacity: 1;
  --canvas-opacity: 1;
  --particle-opacity: 1;
}

:root[data-theme="light"] {
  --bg: #f5f5f7;
  --bg-elev: #ffffff;
  --bg-card: #ffffff;
  --bg-input: #f0f0f2;
  --text: #1a1a2e;
  --text-muted: #666680;
  --accent: #b8941e;
  --accent-light: #d4af37;
  --border: #e0e0e4;
  --border-light: #d0d0d4;
  --card-bg: rgba(255, 255, 255, 0.9);
  --overlay: rgba(255, 255, 255, 0.95);
  --code-bg: rgba(0, 0, 0, 0.06);
  --blockquote-border: rgba(0, 0, 0, 0.15);
  --blockquote-text: rgba(0, 0, 0, 0.65);
  --table-border: rgba(0, 0, 0, 0.12);
  --table-header: rgba(0, 0, 0, 0.04);
  --codeblock-bg: rgba(0, 0, 0, 0.03);
  --codeblock-header: rgba(0, 0, 0, 0.05);
  --codeblock-label: rgba(0, 0, 0, 0.4);
  --copy-btn-border: rgba(0, 0, 0, 0.15);
  --copy-btn-text: rgba(0, 0, 0, 0.5);
  --hr-color: rgba(0, 0, 0, 0.12);
}

/* ─── Global overrides for light mode ─── */

[data-theme="light"] body {
  background: var(--bg) !important;
  color: var(--text) !important;
}

[data-theme="light"] #root > div > div:first-child {
  background: var(--bg-elev) !important;
  border-right-color: var(--border) !important;
}

[data-theme="light"] #root > div > div:first-child input[type="text"] {
  background-color: var(--bg-input) !important;
  border-color: var(--border-light) !important;
  color: var(--text) !important;
}

[data-theme="light"] #root > div > div:last-child {
  background: var(--bg) !important;
}

[data-theme="light"] canvas {
  opacity: 0.05 !important;
}

[data-theme="light"] textarea {
  background-color: var(--bg-input) !important;
  border-color: var(--border-light) !important;
  color: var(--text) !important;
}

[data-theme="light"] input[type="text"],
[data-theme="light"] input[type="search"] {
  background-color: var(--bg-input) !important;
  color: var(--text) !important;
}

/* ─── Theme Toggle / Settings Button ─── */

#theme-toggle-btn,
#theme-settings-btn {
  background: transparent;
  border: 1.5px solid var(--accent, #d4af37);
  border-opacity: 0.55;
  color: var(--accent, #d4af37);
  font-size: 14px;
  padding: 3px 10px;
  cursor: pointer;
  border-radius: 3px;
  font-family: inherit;
  letter-spacing: 2px;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

#theme-toggle-btn:hover,
#theme-settings-btn:hover {
  background: rgba(var(--accent-rgb), 0.15);
}

[data-theme="light"] #theme-toggle-btn {
  border-color: var(--accent);
  color: var(--accent);
}

[data-theme="light"] #theme-toggle-btn:hover {
  background: rgba(184, 148, 30, 0.12);
}

/* ─── Tab content panels (fullscreen overlays) ─── */

[data-theme="light"] #atlas-tab-content-builder,
[data-theme="light"] #atlas-tab-content-jupiter,
[data-theme="light"] #atlas-tab-content-mission,
[data-theme="light"] #atlas-tab-content-crm,
[data-theme="light"] #atlas-tab-content-ideas,
[data-theme="light"] #atlas-tab-content-produkte,
[data-theme="light"] #atlas-tab-content-notifications,
[data-theme="light"] #atlas-tab-content-finance,
[data-theme="light"] #atlas-tab-content-calendar {
  background: var(--bg) !important;
}

/* ─── Builder panel cards & structure ─── */

[data-theme="light"] .builder-stat,
[data-theme="light"] .builder-build-item,
[data-theme="light"] .builder-btn-refresh {
  background: var(--bg-card) !important;
  border-color: var(--border) !important;
}

[data-theme="light"] .builder-stat .label {
  color: var(--text-muted) !important;
}

[data-theme="light"] .builder-subtab {
  color: var(--text-muted) !important;
}

[data-theme="light"] .builder-subtab.active,
[data-theme="light"] .builder-subtab:hover {
  color: var(--accent) !important;
}

[data-theme="light"] .builder-progress {
  background: var(--border) !important;
}

[data-theme="light"] .builder-subtabs {
  border-bottom-color: var(--border) !important;
}

/* ─── Tab bar ─── */

[data-theme="light"] #atlas-tab-bar .atlas-tab {
  color: var(--text-muted) !important;
}

[data-theme="light"] #atlas-tab-bar .atlas-tab:hover,
[data-theme="light"] #atlas-tab-bar .atlas-tab.active {
  color: var(--accent) !important;
}

/* ─── Generic panel cards ─── */

[data-theme="light"] .panel-card,
[data-theme="light"] .gedaechtnis-card,
[data-theme="light"] .crm-card,
[data-theme="light"] .pattern-card,
[data-theme="light"] .learning-card,
[data-theme="light"] .status-card,
[data-theme="light"] .insight-card {
  background: var(--bg-card) !important;
  border-color: var(--border) !important;
}

/* ─── Sidebar project/chat list (inline-styled, need !important) ─── */

[data-theme="light"] div[style*="backgroundColor: #0a0a0a"],
[data-theme="light"] div[style*="backgroundColor:#0a0a0a"],
[data-theme="light"] div[style*="background: #0a0a0a"],
[data-theme="light"] div[style*="background:#0a0a0a"],
[data-theme="light"] div[style*="background: #010101"],
[data-theme="light"] div[style*="background:#010101"] {
  background: var(--bg-elev) !important;
  background-color: var(--bg-elev) !important;
}

[data-theme="light"] div[style*="backgroundColor: #1a1a1a"],
[data-theme="light"] div[style*="backgroundColor:#1a1a1a"] {
  background-color: var(--bg-input) !important;
}

/* ─── Chat panel border in light ─── */

[data-theme="light"] div[style*="border: 1px solid"][style*="border-radius: 4"] {
  border-color: var(--border) !important;
  background: var(--card-bg) !important;
}

/* ─── Text color overrides for inline-styled elements ─── */

[data-theme="light"] span[style*="color: #888"],
[data-theme="light"] span[style*="color:#888"],
[data-theme="light"] div[style*="color: #888"],
[data-theme="light"] div[style*="color:#888"] {
  color: var(--text-muted) !important;
}

[data-theme="light"] span[style*="color: #e0e0e0"],
[data-theme="light"] span[style*="color:#e0e0e0"],
[data-theme="light"] div[style*="color: #e0e0e0"],
[data-theme="light"] div[style*="color:#e0e0e0"] {
  color: var(--text) !important;
}

[data-theme="light"] span[style*="color: #aaa"],
[data-theme="light"] span[style*="color:#aaa"],
[data-theme="light"] div[style*="color: #aaa"],
[data-theme="light"] div[style*="color:#aaa"] {
  color: var(--text-muted) !important;
}

[data-theme="light"] span[style*="color: #666"],
[data-theme="light"] span[style*="color:#666"],
[data-theme="light"] div[style*="color: #666"],
[data-theme="light"] div[style*="color:#666"] {
  color: var(--text-muted) !important;
}

/* ─── Scrollbar for light mode ─── */

[data-theme="light"] ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

[data-theme="light"] ::-webkit-scrollbar-track {
  background: var(--bg);
}

[data-theme="light"] ::-webkit-scrollbar-thumb {
  background: var(--border-light);
  border-radius: 4px;
}

/* ─── Highlight.js light override ─── */

[data-theme="light"] .hljs {
  background: var(--codeblock-bg) !important;
  color: var(--text) !important;
}


/* ═══ theme-settings.css ═══ */
/* Atlas Theme Settings Panel — Build v6 Theme-System */

/* ═══ PANEL CONTAINER ═══ */

#atlas-theme-panel {
  position: fixed;
  inset: 0;
  z-index: 100000;
  pointer-events: none;
}

#atlas-theme-panel.atp-open {
  pointer-events: auto;
}

#atlas-theme-panel.atp-closed {
  pointer-events: none;
}

/* ═══ BACKDROP ═══ */

.atp-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(3px);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.atp-open .atp-backdrop {
  opacity: 1;
}

.atp-closed .atp-backdrop {
  opacity: 0;
}

/* ═══ DRAWER ═══ */

.atp-drawer {
  position: absolute;
  top: 0;
  right: 0;
  width: 360px;
  max-width: 90vw;
  height: 100%;
  background: rgba(10, 10, 14, 0.98);
  border-left: 1px solid rgba(var(--accent-rgb), 0.15);
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: -8px 0 40px rgba(0, 0, 0, 0.5);
}

.atp-open .atp-drawer {
  transform: translateX(0);
}

.atp-closed .atp-drawer {
  transform: translateX(100%);
}

/* ═══ HEADER ═══ */

.atp-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  flex-shrink: 0;
}

.atp-title {
  font-family: 'Consolas', 'JetBrains Mono', monospace;
  font-size: 13px;
  letter-spacing: 0.28em;
  color: var(--accent);
}

.atp-close {
  background: none;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-muted);
  width: 30px;
  height: 30px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.2s, color 0.2s;
}

.atp-close:hover {
  border-color: rgba(255, 255, 255, 0.25);
  color: var(--text);
}

/* ═══ BODY ═══ */

.atp-body {
  flex: 1;
  overflow-y: auto;
  padding: 20px;
}

.atp-section {
  margin-bottom: 28px;
}

.atp-label {
  font-family: 'Consolas', 'JetBrains Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.22em;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 14px;
  text-transform: uppercase;
}

/* ═══ THEME CARDS ═══ */

.atp-themes {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.atp-theme-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 0;
  cursor: pointer;
  transition: border-color 0.25s, background 0.25s, box-shadow 0.25s;
  text-align: left;
  overflow: hidden;
  color: inherit;
  font-family: inherit;
}

.atp-theme-card:hover {
  border-color: rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.05);
}

.atp-theme-card.atp-active {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent), 0 4px 20px rgba(var(--accent-rgb), 0.1);
}

/* ═══ PREVIEW SWATCH ═══ */

.atp-preview {
  height: 56px;
  border-radius: 9px 9px 0 0;
  position: relative;
  overflow: hidden;
}

.atp-preview-bar {
  position: absolute;
  top: 8px;
  left: 10px;
  width: 40%;
  height: 3px;
  border-radius: 2px;
  opacity: 0.8;
}

.atp-preview-panel {
  position: absolute;
  bottom: 6px;
  left: 10px;
  width: 35%;
  height: 20px;
  border-radius: 4px;
}

.atp-preview-panel2 {
  left: auto;
  right: 10px;
  width: 45%;
}

/* ═══ CARD INFO ═══ */

.atp-card-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px 2px;
}

.atp-card-name {
  font-family: 'Consolas', 'JetBrains Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--text);
}

.atp-card-effects {
  font-size: 8px;
  letter-spacing: 2px;
}

.atp-card-desc {
  padding: 0 14px 12px;
  font-size: 11px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.4);
}

/* ═══ ACCENT COLOR PRESETS ═══ */

.atp-accents {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.atp-accent-btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.1);
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
  position: relative;
}

.atp-accent-btn:hover {
  transform: scale(1.1);
  border-color: rgba(255, 255, 255, 0.3);
}

.atp-accent-btn.atp-accent-active {
  border-color: #fff;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.2);
}

.atp-accent-btn.atp-accent-active::after {
  content: '✓';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
}

/* ═══ CUSTOM COLOR PICKER ═══ */

.atp-custom-color {
  display: flex;
  align-items: center;
  gap: 10px;
}

.atp-color-label {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.45);
}

#atp-color-picker {
  width: 36px;
  height: 28px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 4px;
  background: transparent;
  cursor: pointer;
  padding: 0;
}

#atp-color-picker::-webkit-color-swatch-wrapper {
  padding: 2px;
}

#atp-color-picker::-webkit-color-swatch {
  border: none;
  border-radius: 2px;
}

/* ═══ STATIC EMBLEM FALLBACK (Minimal/Klassik Gold) ═══ */

[data-atlas-theme="minimal"] .atlas-universum-wrap,
[data-atlas-theme="klassik-gold"] .atlas-universum-wrap {
  background:
    radial-gradient(ellipse 60% 60% at 50% 50%,
      rgba(var(--accent-rgb), 0.06) 0%,
      rgba(var(--accent-rgb), 0.02) 40%,
      transparent 70%);
}

[data-atlas-theme="minimal"] .atlas-universum-wrap::after,
[data-atlas-theme="klassik-gold"] .atlas-universum-wrap::after {
  content: '◆';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 48px;
  color: var(--accent);
  opacity: 0.12;
  pointer-events: none;
  text-shadow: 0 0 40px rgba(var(--accent-rgb), 0.15);
}

/* ═══ MOBILE ═══ */

@media (max-width: 480px) {
  .atp-drawer {
    width: 100%;
    max-width: 100vw;
  }
}


/* ═══ skeleton-loader.css ═══ */
/* Build 108: Skeleton Loader & Spinner */

@keyframes shimmer {
  0% { background-position: -400px 0; }
  100% { background-position: 400px 0; }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.skeleton-block {
  background: linear-gradient(90deg, rgba(255,255,255,0.04) 25%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0.04) 75%);
  background-size: 800px 100%;
  animation: shimmer 1.8s ease-in-out infinite;
  border-radius: 6px;
}

.skeleton-text {
  height: 14px;
  margin-bottom: 10px;
  border-radius: 4px;
}

.skeleton-text:last-child {
  width: 60%;
}

.skeleton-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 10px;
}

.skeleton-card .skeleton-card-title {
  height: 16px;
  width: 55%;
  margin-bottom: 12px;
}

.skeleton-card .skeleton-card-body {
  height: 12px;
  width: 90%;
  margin-bottom: 8px;
}

.skeleton-card .skeleton-card-body:last-child {
  width: 70%;
}

.skeleton-card .skeleton-card-badge {
  height: 20px;
  width: 60px;
  border-radius: 10px;
  margin-top: 8px;
  display: inline-block;
}

.skeleton-list {
  padding: 8px 0;
}

.skeleton-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  padding: 8px 0;
}

.skeleton-grid .skeleton-card {
  margin-bottom: 0;
}

.atlas-spinner {
  display: inline-block;
  border: 2px solid rgba(255,255,255,0.1);
  border-top-color: rgba(var(--accent-rgb),0.7);
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}

.atlas-spinner--sm { width: 16px; height: 16px; }
.atlas-spinner--md { width: 24px; height: 24px; }
.atlas-spinner--lg { width: 36px; height: 36px; }

.skeleton-loading-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  gap: 12px;
  color: rgba(255,255,255,0.35);
  font-size: 12px;
  letter-spacing: 1px;
}


/* ═══ atlas-state.css ═══ */
/* Zweck: Einheitliche Zustands-Karten (Loading/Error/Empty) im Cockpit-Gold-Design.
   Kontext: Wird von atlas-state.js gesteuert; jedes Panel nutzt diese Klassen.
   Nutzt: --accent-rgb CSS-Variable (Fallback 212,175,55 = Gold).
   Erstellt: 2026-07-06, BA-02 Zustands-Standard. */

/* ─── Gemeinsame Basis ─── */

.atlas-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 40px 20px;
  min-height: 120px;
  font-family: system-ui, -apple-system, sans-serif;
  animation: atlasStateFadeIn 0.3s ease;
}

@keyframes atlasStateFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ─── Loading ─── */

.atlas-state--loading .atlas-state-spinner {
  width: 28px;
  height: 28px;
  border: 2.5px solid rgba(255, 255, 255, 0.08);
  border-top-color: rgba(var(--accent-rgb), 0.7);
  border-radius: 50%;
  animation: atlasStateSpin 0.7s linear infinite;
  margin-bottom: 14px;
}

@keyframes atlasStateSpin {
  to { transform: rotate(360deg); }
}

.atlas-state--loading .atlas-state-label {
  font-family: 'Consolas', 'SF Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  color: rgba(255, 255, 255, 0.35);
  text-transform: uppercase;
}

/* ─── Error ─── */

.atlas-state--error {
  background: rgba(239, 68, 68, 0.06);
  border: 1px solid rgba(239, 68, 68, 0.2);
  border-radius: 10px;
  margin: 8px;
}

.atlas-state--error .atlas-state-icon {
  font-size: 28px;
  margin-bottom: 10px;
  opacity: 0.7;
}

.atlas-state--error .atlas-state-title {
  font-family: 'Consolas', 'SF Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--status-err);
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 8px;
}

.atlas-state--error .atlas-state-message {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.5;
  max-width: 320px;
}

.atlas-state--error .atlas-state-action {
  margin-top: 14px;
  font-size: 11px;
  color: rgba(var(--accent-rgb), 0.7);
  font-family: 'Consolas', 'SF Mono', monospace;
  letter-spacing: 0.08em;
}

/* ─── Empty ─── */

.atlas-state--empty .atlas-state-icon {
  font-size: 36px;
  margin-bottom: 12px;
  opacity: 0.45;
}

.atlas-state--empty .atlas-state-title {
  font-family: 'Consolas', 'SF Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 0.5);
  text-transform: uppercase;
  margin-bottom: 6px;
}

.atlas-state--empty .atlas-state-cta {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.3);
  line-height: 1.5;
  max-width: 280px;
}


/* ═══ keyboard-shortcuts.css ═══ */
/* Build 187 — Keyboard Shortcuts Overlay */

.shortcuts-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(6px);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.shortcuts-overlay.shortcuts-visible {
  opacity: 1;
}

.shortcuts-modal {
  background: #12121e;
  border: 1px solid rgba(var(--accent-rgb), 0.35);
  border-radius: 14px;
  padding: 28px 32px 20px;
  max-width: 680px;
  width: 92%;
  max-height: 85vh;
  overflow-y: auto;
  box-shadow:
    0 0 0 1px rgba(var(--accent-rgb), 0.1),
    0 20px 60px rgba(0, 0, 0, 0.6),
    0 0 40px rgba(var(--accent-rgb), 0.06);
}

.shortcuts-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}

.shortcuts-modal h2 {
  margin: 0;
  font-size: 18px;
  color: var(--accent);
  font-weight: 700;
  letter-spacing: 1.5px;
}

.shortcuts-badge {
  font-size: 10px;
  color: var(--text-muted);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 6px;
  padding: 2px 8px;
  font-family: monospace;
}

.shortcuts-modal .shortcuts-subtitle {
  margin: 0 0 20px 0;
  font-size: 12px;
  color: var(--text-dim);
  line-height: 1.4;
}

.shortcuts-columns {
  display: flex;
  gap: 24px;
}

.shortcuts-col {
  flex: 1;
  min-width: 0;
}

.shortcuts-section {
  margin-bottom: 18px;
}

.shortcuts-section-help {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  padding-top: 12px;
  margin-bottom: 0;
}

.shortcuts-section h3 {
  margin: 0 0 8px 0;
  font-size: 11px;
  color: var(--accent);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  opacity: 0.8;
}

.shortcut-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.shortcut-row:last-child {
  border-bottom: none;
}

.shortcut-keys {
  display: flex;
  gap: 3px;
  align-items: center;
  flex-shrink: 0;
}

.shortcut-key-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.2), rgba(var(--accent-rgb), 0.08));
  border: 1px solid rgba(var(--accent-rgb), 0.45);
  border-radius: 5px;
  padding: 2px 8px;
  font-size: 11px;
  font-family: 'JetBrains Mono', 'SF Mono', monospace;
  font-weight: 600;
  color: var(--accent);
  min-width: 22px;
  text-align: center;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(var(--accent-rgb), 0.1);
  text-shadow: 0 0 8px rgba(var(--accent-rgb), 0.3);
}

.shortcut-plus {
  font-size: 10px;
  color: var(--text-dim);
  margin: 0 1px;
}

.shortcut-or {
  font-size: 10px;
  color: var(--text-dim);
  margin: 0 4px;
}

.shortcut-desc {
  font-size: 12px;
  color: #bbb;
  text-align: right;
}

.shortcuts-tour-btn {
  background: linear-gradient(135deg, var(--accent), #c49b2f);
  color: #111;
  border: none;
  border-radius: 6px;
  padding: 6px 16px;
  font-weight: 600;
  font-size: 12px;
  cursor: pointer;
  transition: opacity 0.15s;
}

.shortcuts-tour-btn:hover {
  opacity: 0.85;
}

.shortcuts-close-hint {
  text-align: center;
  margin-top: 14px;
  font-size: 11px;
  color: var(--text-dim);
}

@media (max-width: 600px) {
  .shortcuts-modal {
    padding: 20px 16px 16px;
    max-width: 95%;
  }
  .shortcuts-columns {
    flex-direction: column;
    gap: 0;
  }
}


/* ═══ onboarding-tour.css ═══ */
/* Build 111 — Onboarding Tour */
.tour-overlay {
  position: fixed; inset: 0;
  z-index: 99998;
  background: rgba(0,0,0,0.65);
  transition: opacity .3s;
}
.tour-highlight {
  position: absolute;
  z-index: 99999;
  box-shadow: 0 0 0 4000px rgba(0,0,0,0.65);
  border-radius: 8px;
  border: 2px solid var(--accent);
  transition: all .35s cubic-bezier(.4,0,.2,1);
  pointer-events: none;
}
.tour-tooltip {
  position: absolute;
  z-index: 100000;
  background: var(--bg-input);
  color: var(--text);
  border: 1px solid var(--accent);
  border-radius: 12px;
  padding: 18px 22px 14px;
  max-width: 340px;
  min-width: 220px;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  transition: opacity .25s, transform .3s cubic-bezier(.4,0,.2,1);
}
.tour-tooltip[data-pos="bottom"] { transform-origin: top center; }
.tour-tooltip[data-pos="top"] { transform-origin: bottom center; }
.tour-tooltip-title {
  font-weight: 700;
  font-size: 15px;
  color: var(--accent);
  margin-bottom: 6px;
}
.tour-tooltip-body {
  margin-bottom: 14px;
  color: var(--text);
}
.tour-tooltip-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.tour-tooltip-progress {
  font-size: 12px;
  color: var(--text-muted);
}
.tour-btn {
  padding: 6px 16px;
  border: none;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  font-weight: 600;
  transition: background .15s, transform .1s;
}
.tour-btn:active { transform: scale(.96); }
.tour-btn-next {
  background: var(--accent);
  color: #111;
}
.tour-btn-next:hover { background: #e6c547; }
.tour-btn-prev {
  background: transparent;
  color: var(--text-muted);
  border: 1px solid var(--border-light);
}
.tour-btn-prev:hover { color: #fff; border-color: var(--text-muted); }
.tour-btn-skip {
  background: transparent;
  color: var(--text-muted);
  font-size: 12px;
  text-decoration: underline;
  border: none;
  padding: 4px 8px;
}
.tour-btn-skip:hover { color: var(--text); }
@media (max-width: 600px) {
  .tour-tooltip { max-width: 280px; min-width: 180px; padding: 14px 16px 10px; font-size: 13px; }
}


/* ═══ sonos-bar.css ═══ */
/* ═══════════════════════════════════════════════════════════════
   ATLAS SONOS MUSIKLEISTE (Build 070)
   Schmale Leiste unter der Tab-Navigation, nur sichtbar wenn Musik spielt.
   Gold-Akzent, monospace, passend zum restlichen Dashboard.
   Room-Dropdown fuer Raumwechsel.
   ═══════════════════════════════════════════════════════════════ */

#sonos-bar {
  /* Fixe Leiste, von sonos-bar.js direkt unter die Tab-Navigation positioniert
     (top/left/width werden per JS gesetzt; hier nur die Fallback-Werte). */
  position: fixed;
  top: 60px;
  left: 0;
  right: 0;
  z-index: 150; /* ueber dem Dashboard-Inhalt, unter Sidebar(200)/Loader */
  display: flex;
  align-items: center;
  gap: 12px;
  width: auto;
  height: 36px;
  box-sizing: border-box;
  padding: 0 12px;
  background: rgba(var(--accent-rgb), 0.1);
  border-bottom: 1px solid var(--accent);
  color: var(--accent);
  font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 12px;
  overflow: visible;
  /* Slide-down/-up Animation */
  max-height: 36px;
  opacity: 1;
  transform: translateY(0);
  transition: max-height 0.3s ease, opacity 0.3s ease,
              transform 0.3s ease, padding 0.3s ease, border-color 0.3s ease;
}

#sonos-bar.sonos-hidden {
  max-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  opacity: 0;
  transform: translateY(-12px);
  border-bottom-color: transparent;
  pointer-events: none;
}

/* ─── Links: Cover + Titel/Kuenstler ─── */
#sonos-bar .sb-left {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 0 1 auto;
}

#sonos-bar .sb-cover {
  width: 28px;
  height: 28px;
  border-radius: 5px;
  object-fit: cover;
  flex: none;
  background: rgba(var(--accent-rgb), 0.18);
  border: 1px solid rgba(var(--accent-rgb), 0.35);
}

#sonos-bar .sb-meta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1.15;
  min-width: 0;
}

#sonos-bar .sb-title {
  color: var(--accent);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 240px;
}

#sonos-bar .sb-artist {
  color: rgba(var(--accent-rgb), 0.7);
  font-size: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 240px;
}

/* ─── Mitte: Fortschrittsbalken ─── */
#sonos-bar .sb-progress-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 60px;
}

#sonos-bar .sb-time {
  font-size: 10px;
  color: rgba(var(--accent-rgb), 0.6);
  flex: none;
  font-variant-numeric: tabular-nums;
}

#sonos-bar .sb-progress {
  position: relative;
  height: 2px;
  flex: 1 1 auto;
  background: rgba(var(--accent-rgb), 0.25);
  border-radius: 2px;
}

#sonos-bar .sb-progress-fill {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 0%;
  background: var(--accent);
  border-radius: 2px;
  transition: width 0.5s linear;
}

/* ─── Rechts: Steuerung + Raum ─── */
#sonos-bar .sb-controls {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: none;
}

#sonos-bar .sb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  background: none;
  border: none;
  color: var(--accent);
  cursor: pointer;
  opacity: 0.85;
  transition: opacity 0.15s ease, transform 0.1s ease;
}

#sonos-bar .sb-btn:hover { opacity: 1; }
#sonos-bar .sb-btn:active { transform: scale(0.88); }
#sonos-bar .sb-btn svg { width: 16px; height: 16px; fill: currentColor; display: block; }
#sonos-bar .sb-btn.sb-playpause svg { width: 18px; height: 18px; }

/* ─── Rechts: Raum-Dropdown ─── */
#sonos-bar .sb-room-wrap {
  position: relative;
  flex: none;
  padding-left: 4px;
  border-left: 1px solid rgba(var(--accent-rgb), 0.25);
}

#sonos-bar .sb-room-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: none;
  border: 1px solid transparent;
  border-radius: 4px;
  color: rgba(var(--accent-rgb), 0.7);
  font-family: inherit;
  font-size: 10px;
  padding: 2px 6px;
  cursor: pointer;
  white-space: nowrap;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.15s, border-color 0.15s, background 0.15s;
}
#sonos-bar .sb-room-btn:hover,
#sonos-bar .sb-room-btn.sb-room-open {
  color: var(--accent);
  border-color: rgba(var(--accent-rgb), 0.4);
  background: rgba(var(--accent-rgb), 0.08);
}

#sonos-bar .sb-room-chevron {
  font-size: 8px;
  opacity: 0.6;
  transition: transform 0.2s;
}
#sonos-bar .sb-room-btn.sb-room-open .sb-room-chevron {
  transform: rotate(180deg);
}

#sonos-bar .sb-room-dropdown {
  position: fixed;
  min-width: 180px;
  max-width: 260px;
  background: rgba(18, 18, 18, 0.98);
  border: 1px solid rgba(var(--accent-rgb), 0.35);
  border-radius: 6px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
  z-index: 100000;
  padding: 4px 0;
  overflow-y: auto;
  max-height: 280px;
}

#sonos-bar .sb-room-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 12px;
  cursor: pointer;
  font-size: 11px;
  color: rgba(var(--accent-rgb), 0.7);
  transition: background 0.12s, color 0.12s;
}
#sonos-bar .sb-room-item:hover {
  background: rgba(var(--accent-rgb), 0.12);
  color: var(--accent);
}
#sonos-bar .sb-room-item.sb-room-active {
  color: var(--accent);
  font-weight: 600;
  background: rgba(var(--accent-rgb), 0.08);
}
#sonos-bar .sb-room-item.sb-room-active::before {
  content: '\25CF';
  font-size: 6px;
  margin-right: 4px;
  color: var(--accent);
}

#sonos-bar .sb-room-item-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#sonos-bar .sb-room-item-state {
  flex: none;
  font-size: 9px;
  padding: 1px 5px;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
#sonos-bar .sb-st-playing {
  color: #2ecc71;
  background: rgba(46, 204, 113, 0.12);
}
#sonos-bar .sb-st-paused {
  color: #f39c12;
  background: rgba(243, 156, 18, 0.12);
}
#sonos-bar .sb-st-stopped {
  color: rgba(var(--accent-rgb), 0.4);
  background: rgba(var(--accent-rgb), 0.06);
}


/* ═══ jupiter-tab.css ═══ */
/* Build 172: Jupiter Dashboard — Builder Overview */
#atlas-tab-content-jupiter .jup-dashboard {
  padding: 20px 24px;
  max-width: 1400px;
  margin: 0 auto;
}

/* Stats bar */
.jup-stats {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.jup-stat-card {
  flex: 1;
  min-width: 120px;
  background: rgba(var(--accent-rgb),0.06);
  border: 1px solid rgba(var(--accent-rgb),0.15);
  border-radius: 10px;
  padding: 14px 16px;
  text-align: center;
}
.jup-stat-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--accent);
  line-height: 1.2;
}
.jup-stat-label {
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 4px;
}
.jup-stat-card.jup-stat-success .jup-stat-value { color: var(--galaxie-eg); }
.jup-stat-card.jup-stat-fail .jup-stat-value { color: var(--status-err); }
.jup-stat-card.jup-stat-pending .jup-stat-value { color: var(--galaxie-ce); }
.jup-stat-card.jup-stat-building .jup-stat-value { color: #60a5fa; }

/* Toolbar */
.jup-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.jup-filter-btn {
  padding: 6px 14px;
  border-radius: 6px;
  border: 1px solid rgba(var(--accent-rgb),0.25);
  background: transparent;
  color: var(--text);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s;
}
.jup-filter-btn:hover { background: rgba(var(--accent-rgb),0.1); color: var(--accent); }
.jup-filter-btn.active {
  background: rgba(var(--accent-rgb),0.15);
  color: var(--accent);
  border-color: var(--accent);
}
.jup-search {
  margin-left: auto;
  padding: 6px 12px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.04);
  color: var(--text);
  font-size: 12px;
  width: 200px;
}
.jup-search::placeholder { color: var(--text-dim); }
.jup-search:focus { outline: none; border-color: rgba(var(--accent-rgb),0.4); }

/* Groups summary */
.jup-groups {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.jup-group-chip {
  padding: 5px 12px;
  border-radius: 14px;
  font-size: 11px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  color: var(--text-muted);
  cursor: pointer;
  transition: all 0.2s;
}
.jup-group-chip:hover { border-color: rgba(var(--accent-rgb),0.3); color: var(--accent); }
.jup-group-chip.active { background: rgba(var(--accent-rgb),0.1); border-color: var(--accent); color: var(--accent); }

/* Build table */
.jup-table-wrap {
  overflow-x: auto;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.06);
}
.jup-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.jup-table th {
  text-align: left;
  padding: 10px 12px;
  color: var(--text-muted);
  font-weight: 600;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.02);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.jup-table th:hover { color: var(--accent); }
.jup-table th .sort-arrow { margin-left: 4px; font-size: 10px; }
.jup-table td {
  padding: 8px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  color: var(--text);
  vertical-align: middle;
}
.jup-table tr:hover td { background: rgba(var(--accent-rgb),0.04); }
.jup-table tr { transition: background 0.15s; }

/* Status badge */
.jup-status {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.jup-status-completed { background: rgba(74,222,128,0.15); color: var(--galaxie-eg); }
.jup-status-failed { background: rgba(248,113,113,0.15); color: var(--status-err); }
.jup-status-pending { background: rgba(250,204,21,0.12); color: var(--galaxie-ce); }
.jup-status-building,
.jup-status-in_progress,
.jup-status-auto-testing { background: rgba(96,165,250,0.15); color: #60a5fa; }
.jup-status-skipped { background: rgba(148,163,184,0.12); color: var(--text-dim); }

/* Group badge */
.jup-group-badge {
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 8px;
  background: rgba(255,255,255,0.06);
  color: var(--text-muted);
}
.jup-group-frontend { color: #c084fc; background: rgba(192,132,252,0.1); }
.jup-group-backend { color: #60a5fa; background: rgba(96,165,250,0.1); }
.jup-group-security { color: var(--status-err); background: rgba(248,113,113,0.1); }
.jup-group-integration { color: var(--galaxie-eg); background: rgba(74,222,128,0.1); }
.jup-group-meta { color: var(--galaxie-ce); background: rgba(250,204,21,0.1); }

/* Log button */
.jup-log-btn {
  padding: 3px 8px;
  border-radius: 5px;
  border: 1px solid rgba(var(--accent-rgb),0.2);
  background: transparent;
  color: var(--accent);
  font-size: 11px;
  cursor: pointer;
  transition: all 0.2s;
}
.jup-log-btn:hover { background: rgba(var(--accent-rgb),0.1); }

/* Log modal */
.jup-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.7);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: jup-fade-in 0.2s ease;
}
@keyframes jup-fade-in { from { opacity: 0; } to { opacity: 1; } }
.jup-modal {
  background: var(--bg-input);
  border: 1px solid rgba(var(--accent-rgb),0.2);
  border-radius: 12px;
  width: 90%;
  max-width: 800px;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.jup-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.jup-modal-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--accent);
}
.jup-modal-close {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 20px;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}
.jup-modal-close:hover { color: #fff; background: rgba(255,255,255,0.08); }
.jup-modal-body {
  padding: 16px 20px;
  overflow-y: auto;
  flex: 1;
}
.jup-modal-body pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 12px;
  line-height: 1.6;
  color: var(--text);
  font-family: 'JetBrains Mono', 'Fira Code', monospace;
}
.jup-modal-meta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.jup-modal-meta-item {
  font-size: 12px;
  color: var(--text-muted);
}
.jup-modal-meta-item strong {
  color: var(--text);
}

/* Updated timestamp */
.jup-updated {
  text-align: right;
  font-size: 11px;
  color: var(--text-dim);
  margin-top: 12px;
}

/* Loading */
.jup-loading {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-dim);
}
.jup-loading .jup-spinner {
  display: inline-block;
  width: 32px;
  height: 32px;
  border: 3px solid rgba(var(--accent-rgb),0.2);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: jup-spin 0.8s linear infinite;
  margin-bottom: 12px;
}
@keyframes jup-spin { to { transform: rotate(360deg); } }

/* Pagination */
.jup-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
}
.jup-page-btn {
  padding: 5px 12px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.1);
  background: transparent;
  color: var(--text-muted);
  font-size: 12px;
  cursor: pointer;
}
.jup-page-btn:hover { border-color: rgba(var(--accent-rgb),0.3); color: var(--accent); }
.jup-page-btn:disabled { opacity: 0.3; cursor: default; }
.jup-page-info { font-size: 12px; color: var(--text-dim); }

/* Mobile */
@media (max-width: 768px) {
  #atlas-tab-content-jupiter .jup-dashboard { padding: 12px; }
  .jup-stats { gap: 8px; }
  .jup-stat-card { min-width: 80px; padding: 10px 8px; }
  .jup-stat-value { font-size: 22px; }
  .jup-toolbar { gap: 6px; }
  .jup-search { width: 140px; margin-left: 0; }
  .jup-table { font-size: 12px; }
  .jup-table th, .jup-table td { padding: 6px 8px; }
  .jup-modal { width: 96%; }
}


/* ═══ food-dashboard.css ═══ */
/* Food Dashboard — Build 194 */
/* Atlas Dark Theme + Gold Accent (var(--accent)) + Food Green (var(--galaxie-eg)) */

#atlas-tab-content-food {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg);
  z-index: 9000;
  overflow-y: auto;
  color: var(--text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  padding: 20px;
  padding-top: 70px;
}
#atlas-tab-content-food.visible { display: block; }

/* Header */
.food-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.food-header-icon {
  font-size: 28px;
  filter: none;
}
.food-header h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: var(--status-ok);
  letter-spacing: 1px;
}
.food-header-sub {
  font-size: 13px;
  color: var(--text-muted);
  margin-left: auto;
}

/* Sub-tabs */
.food-subtabs {
  display: flex;
  gap: 4px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 8px;
  overflow-x: auto;
  flex-wrap: nowrap;
}
.food-subtab {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 600;
  padding: 8px 16px;
  cursor: pointer;
  border-radius: 6px 6px 0 0;
  transition: all .2s;
  white-space: nowrap;
}
.food-subtab:hover { color: var(--text); background: var(--bg-input); }
.food-subtab.active {
  color: var(--status-ok);
  border-bottom: 2px solid var(--galaxie-eg);
  background: var(--bg-card);
}

/* Panel base */
.food-panel {
  display: none;
  animation: foodFadeIn .3s ease;
}
.food-panel.active { display: block; }
@keyframes foodFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Cards */
.food-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 18px;
  margin-bottom: 16px;
}
.food-card-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ─── WOCHENPLAN ─── */
.food-week-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
}
@media (max-width: 900px) {
  .food-week-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 500px) {
  .food-week-grid { grid-template-columns: 1fr 1fr; }
}
.food-day-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px;
  min-height: 120px;
  cursor: pointer;
  transition: border-color .2s, transform .15s;
}
.food-day-card:hover {
  border-color: var(--status-ok);
  transform: translateY(-2px);
}
.food-day-card.today {
  border-color: var(--accent);
  box-shadow: 0 0 12px rgba(var(--accent-rgb),0.15);
}
.food-day-name {
  font-size: 11px;
  font-weight: 700;
  color: var(--accent);
  text-transform: uppercase;
  margin-bottom: 8px;
}
.food-day-date {
  font-size: 10px;
  color: var(--text-dim);
  margin-left: 4px;
  font-weight: 400;
  text-transform: none;
}
.food-meal-slot {
  margin-bottom: 6px;
}
.food-slot-label {
  font-size: 9px;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.food-meal-title {
  font-size: 12px;
  color: var(--text);
  font-weight: 500;
  line-height: 1.3;
}
.food-meal-empty {
  font-size: 11px;
  color: var(--text-dim);
  font-style: italic;
}

/* Meal status badges */
.food-status {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: .3px;
  margin-top: 2px;
}
.food-status-planned { background: #1a3a2a; color: var(--status-ok); }
.food-status-cooked { background: #1a2a3a; color: var(--status-info, #42a5f5); }
.food-status-skipped { background: #2a1a1a; color: var(--status-err); }

/* ─── EINKAUFSLISTE ─── */
.food-shopping-category {
  margin-bottom: 16px;
}
.food-shopping-cat-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--status-ok);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.food-shopping-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  border-radius: 6px;
  transition: background .15s;
}
.food-shopping-item:hover { background: var(--bg-input); }
.food-shopping-check {
  width: 18px;
  height: 18px;
  accent-color: var(--status-ok);
  cursor: pointer;
}
.food-shopping-name {
  flex: 1;
  font-size: 13px;
  color: var(--text);
}
.food-shopping-name.checked {
  text-decoration: line-through;
  color: var(--text-dim);
}
.food-shopping-qty {
  font-size: 12px;
  color: var(--text-muted);
  min-width: 60px;
  text-align: right;
}
.food-shopping-price {
  font-size: 12px;
  color: var(--accent);
  min-width: 60px;
  text-align: right;
}

/* Budget bar */
.food-budget-bar-wrap {
  background: var(--bg-input);
  border-radius: 8px;
  height: 10px;
  overflow: hidden;
  margin: 8px 0;
}
.food-budget-bar {
  height: 100%;
  border-radius: 8px;
  transition: width .5s ease;
}
.food-budget-bar.ok { background: linear-gradient(90deg, var(--galaxie-eg), #27ae60); }
.food-budget-bar.warn { background: linear-gradient(90deg, #f39c12, #e67e22); }
.food-budget-bar.over { background: linear-gradient(90deg, #e74c3c, #c0392b); }

/* ─── INVENTAR ─── */
.food-inv-table {
  width: 100%;
  border-collapse: collapse;
}
.food-inv-table th {
  text-align: left;
  font-size: 11px;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
}
.food-inv-table td {
  font-size: 13px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  color: var(--text);
}
.food-inv-table tr:hover td { background: var(--bg-card); }
.food-inv-location {
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  text-transform: uppercase;
}
.food-inv-loc-fridge { background: #1a2a3a; color: var(--status-info, #42a5f5); }
.food-inv-loc-pantry { background: #2a2a1a; color: var(--accent); }
.food-inv-loc-freezer { background: #1a3a3a; color: #00bcd4; }
.food-inv-expires-soon {
  color: var(--status-err) !important;
  font-weight: 600;
}
.food-inv-expires-ok { color: var(--text-muted); }

/* ─── BUDGET WIDGET ─── */
.food-budget-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}
.food-budget-stat {
  background: var(--bg-card);
  border-radius: 8px;
  padding: 14px;
  text-align: center;
}
.food-budget-stat-label {
  font-size: 11px;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-bottom: 4px;
}
.food-budget-stat-value {
  font-size: 22px;
  font-weight: 700;
  color: var(--accent);
}
.food-budget-stat-value.green { color: var(--status-ok); }
.food-budget-stat-value.red { color: var(--status-err); }
.food-budget-trend {
  font-size: 12px;
  margin-top: 4px;
}
.food-budget-trend.up { color: var(--status-err); }
.food-budget-trend.down { color: var(--status-ok); }
.food-budget-trend.flat { color: var(--text-muted); }

/* ─── NAEHRSTOFF-AMPEL ─── */
.food-nutrients-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px;
}
.food-nutrient-item {
  background: var(--bg-card);
  border-radius: 8px;
  padding: 12px;
  text-align: center;
}
.food-nutrient-name {
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.food-nutrient-value {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 4px;
}
.food-nutrient-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.food-nutrient-green { background: var(--galaxie-eg); }
.food-nutrient-yellow { background: #f1c40f; }
.food-nutrient-red { background: var(--status-err); }
.food-nutrient-bar {
  height: 4px;
  background: var(--bg-input);
  border-radius: 2px;
  margin-top: 6px;
  overflow: hidden;
}
.food-nutrient-bar-fill {
  height: 100%;
  border-radius: 2px;
  transition: width .5s ease;
}

/* ─── REZEPT-DETAIL MODAL ─── */
.food-recipe-modal {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,.85);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: foodFadeIn .2s ease;
}
.food-recipe-box {
  background: var(--bg-card);
  border: 1px solid var(--galaxie-eg);
  border-radius: 12px;
  max-width: 600px;
  width: 90vw;
  max-height: 85vh;
  overflow-y: auto;
  padding: 24px;
}
.food-recipe-close {
  float: right;
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 22px;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}
.food-recipe-close:hover { color: #fff; background: var(--bg-input); }
.food-recipe-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--status-ok);
  margin-bottom: 6px;
}
.food-recipe-meta {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.food-recipe-meta-item {
  font-size: 12px;
  color: var(--text-muted);
}
.food-recipe-meta-item span {
  color: var(--accent);
  font-weight: 600;
}
.food-recipe-section-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  margin: 14px 0 8px;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.food-recipe-ingredient {
  display: flex;
  gap: 8px;
  padding: 4px 0;
  font-size: 13px;
  color: var(--text);
  border-bottom: 1px solid var(--border);
}
.food-recipe-ingredient-qty {
  color: var(--accent);
  font-weight: 600;
  min-width: 80px;
}
.food-recipe-step {
  display: flex;
  gap: 10px;
  padding: 8px 0;
  font-size: 13px;
  color: var(--text);
}
.food-recipe-step-num {
  color: var(--status-ok);
  font-weight: 700;
  font-size: 14px;
  min-width: 24px;
}
.food-recipe-nutrients-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
  gap: 8px;
  margin-top: 8px;
}
.food-recipe-nutrient {
  background: var(--bg-input);
  border-radius: 6px;
  padding: 8px;
  text-align: center;
}
.food-recipe-nutrient-val {
  font-size: 16px;
  font-weight: 700;
  color: var(--accent);
}
.food-recipe-nutrient-label {
  font-size: 10px;
  color: var(--text-dim);
}

/* ─── FAMILIEN-PROFILE ─── */
.food-profiles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 12px;
}
.food-profile-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
  transition: border-color .2s;
}
.food-profile-card:hover { border-color: var(--status-ok); }
.food-profile-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 4px;
}
.food-profile-role {
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 10px;
}
.food-profile-detail {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.food-profile-detail strong { color: var(--accent); }
.food-profile-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}
.food-profile-tag {
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 4px;
  background: #2a1a1a;
  color: var(--status-err);
  font-weight: 600;
}
.food-profile-tag.pref {
  background: #1a2a1a;
  color: var(--status-ok);
}
.food-profile-tag.dislike {
  background: #2a2a1a;
  color: #f39c12;
}

/* ─── EMPTY STATES ─── */
.food-empty {
  text-align: center;
  padding: 40px 20px;
  color: var(--text-dim);
}
.food-empty-icon {
  font-size: 48px;
  margin-bottom: 12px;
  opacity: .5;
}
.food-empty-text {
  font-size: 14px;
  line-height: 1.5;
}
.food-empty-hint {
  font-size: 12px;
  color: var(--text-dim);
  margin-top: 8px;
}

/* ─── LOADING ─── */
.food-loading {
  text-align: center;
  padding: 30px;
  color: var(--text-dim);
}
.food-spinner {
  display: inline-block;
  width: 24px;
  height: 24px;
  border: 3px solid var(--border);
  border-top-color: var(--status-ok);
  border-radius: 50%;
  animation: foodSpin .8s linear infinite;
}
@keyframes foodSpin { to { transform: rotate(360deg); } }

/* ─── SCROLLBAR ─── */
#atlas-tab-content-food::-webkit-scrollbar { width: 6px; }
#atlas-tab-content-food::-webkit-scrollbar-track { background: var(--bg); }
#atlas-tab-content-food::-webkit-scrollbar-thumb { background: var(--border-light); border-radius: 3px; }
#atlas-tab-content-food::-webkit-scrollbar-thumb:hover { background: var(--text-dim); }

/* ═══════════════════════════════════════════════════
   Build 195: Koch-Modus Overlay
   ═══════════════════════════════════════════════════ */

.food-cook-btn {
  display: inline-block;
  padding: 14px 36px;
  background: linear-gradient(135deg, var(--galaxie-eg) 0%, #1a9c2f 100%);
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .15s, box-shadow .15s;
  box-shadow: 0 4px 20px rgba(46, 204, 64, 0.3);
}
.food-cook-btn:hover {
  transform: scale(1.05);
  box-shadow: 0 6px 28px rgba(46, 204, 64, 0.5);
}

.food-cook-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.97);
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: cookFadeIn .3s ease;
}
@keyframes cookFadeIn { from { opacity: 0; } to { opacity: 1; } }

.food-cook-container {
  width: 100%;
  max-width: 700px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-height: 100vh;
  overflow-y: auto;
}

.food-cook-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.food-cook-recipe-title {
  font-size: 22px;
  font-weight: 700;
  color: var(--accent);
}
.food-cook-close-btn {
  background: none;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  font-size: 28px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .2s;
}
.food-cook-close-btn:hover { color: var(--status-err); border-color: var(--status-err); }

.food-cook-progress { text-align: center; }
.food-cook-progress-bar {
  height: 6px;
  background: var(--bg-input);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 8px;
}
.food-cook-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--galaxie-eg), var(--accent));
  border-radius: 3px;
  transition: width .4s ease;
}
.food-cook-step-counter {
  font-size: 14px;
  color: var(--text-muted);
  font-weight: 600;
}

.food-cook-step-text {
  font-size: 28px;
  line-height: 1.5;
  color: #f0f0f0;
  text-align: center;
  padding: 20px;
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: cookStepIn .3s ease;
}
@keyframes cookStepIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.food-cook-controls {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}
.food-cook-ctrl-btn {
  padding: 14px 24px;
  border: 2px solid var(--border-light);
  background: var(--bg-input);
  color: var(--text);
  border-radius: 12px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s;
  min-width: 140px;
}
.food-cook-ctrl-btn:hover:not(.disabled) { border-color: var(--status-ok); color: var(--status-ok); }
.food-cook-ctrl-btn.next {
  background: var(--galaxie-eg);
  border-color: var(--status-ok);
  color: #000;
}
.food-cook-ctrl-btn.next:hover { background: #3ddc52; }
.food-cook-ctrl-btn.repeat { border-color: var(--accent); color: var(--accent); }
.food-cook-ctrl-btn.repeat:hover { background: rgba(var(--accent-rgb), 0.1); }
.food-cook-ctrl-btn.disabled { opacity: 0.3; cursor: not-allowed; }

.food-cook-timers { display: flex; flex-direction: column; gap: 8px; }
.food-cook-timer-item {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 10px;
  padding: 12px 16px;
}
.food-cook-timer-item.alarm {
  border-color: var(--status-err);
  background: rgba(231, 76, 60, 0.15);
  animation: timerPulse 0.5s infinite alternate;
}
@keyframes timerPulse { from { opacity: 1; } to { opacity: 0.6; } }
.food-cook-timer-label { flex: 1; color: var(--text); font-size: 14px; font-weight: 600; }
.food-cook-timer-time {
  font-size: 24px;
  font-weight: 700;
  color: var(--status-ok);
  font-variant-numeric: tabular-nums;
}
.food-cook-timer-item.alarm .food-cook-timer-time { color: var(--status-err); }
.food-cook-timer-dismiss {
  background: none; border: none; color: var(--text-dim); font-size: 18px;
  cursor: pointer; padding: 4px 8px;
}
.food-cook-timer-dismiss:hover { color: var(--status-err); }

.food-cook-timer-add {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}
.food-cook-timer-input {
  width: 60px;
  padding: 10px;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  color: #fff;
  font-size: 14px;
  text-align: center;
}
.food-cook-timer-label-input {
  flex: 1;
  max-width: 200px;
  padding: 10px;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  color: #fff;
  font-size: 14px;
}
.food-cook-timer-btn {
  padding: 10px 18px;
  background: var(--bg-input);
  border: 1px solid var(--accent);
  border-radius: 8px;
  color: var(--accent);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s;
}
.food-cook-timer-btn:hover { background: rgba(var(--accent-rgb), 0.15); }

.food-cook-voice-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 8px;
}
.food-cook-mic {
  font-size: 20px;
  opacity: 0.3;
  transition: opacity .3s;
}
.food-cook-mic.active {
  opacity: 1;
  animation: micPulse 1.5s infinite;
}
@keyframes micPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
.food-cook-voice-hint {
  font-size: 12px;
  color: var(--text-dim);
  font-style: italic;
}

/* ─── RESPONSIVE ─── */
@media (max-width: 600px) {
  #atlas-tab-content-food { padding: 12px; padding-top: 60px; }
  .food-header h2 { font-size: 18px; }
  .food-budget-grid { grid-template-columns: 1fr 1fr; }
  .food-profiles-grid { grid-template-columns: 1fr; }
  .food-recipe-box { padding: 16px; }
  .food-cook-container { padding: 16px; gap: 16px; }
  .food-cook-step-text { font-size: 20px; padding: 12px; min-height: 80px; }
  .food-cook-ctrl-btn { padding: 12px 16px; font-size: 14px; min-width: 100px; }
  .food-cook-recipe-title { font-size: 16px; }
  .food-cook-controls { gap: 8px; }
  .food-cook-timer-add { flex-wrap: wrap; }
}


/* ═══ toast-notifications.css ═══ */
/* ═══════════════════════════════════════════════════════════ */
/* Build 186: Toast Notification System                        */
/* ═══════════════════════════════════════════════════════════ */

#atlas-toast-container {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  display: flex;
  flex-direction: column-reverse;
  gap: 10px;
  pointer-events: none;
}

.atlas-toast {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 280px;
  max-width: 420px;
  padding: 14px 16px;
  border-radius: 10px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  color: #fff;
  pointer-events: auto;
  box-shadow: 0 4px 24px rgba(0,0,0,0.35);
  transform: translateX(120%);
  opacity: 0;
  animation: atlas-toast-in 0.35s ease forwards;
}

.atlas-toast.atlas-toast-out {
  animation: atlas-toast-out 0.3s ease forwards;
}

.atlas-toast-icon {
  flex-shrink: 0;
  font-size: 18px;
  line-height: 1;
}

.atlas-toast-msg {
  flex: 1;
  word-break: break-word;
}

.atlas-toast-close {
  flex-shrink: 0;
  background: none;
  border: none;
  color: rgba(255,255,255,0.7);
  font-size: 18px;
  cursor: pointer;
  padding: 0 2px;
  line-height: 1;
  transition: color 0.15s;
}
.atlas-toast-close:hover {
  color: #fff;
}

/* Type colors: gold success, red error, blue info */
.atlas-toast-success {
  background: linear-gradient(135deg, #8b6914, #6b5010);
  border-left: 4px solid var(--accent);
}
.atlas-toast-error {
  background: linear-gradient(135deg, #b91c1c, #991b1b);
  border-left: 4px solid #f87171;
}
.atlas-toast-info {
  background: linear-gradient(135deg, #1e3a5f, #1a2d47);
  border-left: 4px solid #60a5fa;
}

/* Animations */
@keyframes atlas-toast-in {
  0%   { transform: translateX(120%); opacity: 0; }
  100% { transform: translateX(0);    opacity: 1; }
}
@keyframes atlas-toast-out {
  0%   { transform: translateX(0);    opacity: 1; }
  100% { transform: translateX(120%); opacity: 0; }
}

/* Mobile: full width */
@media (max-width: 768px) {
  #atlas-toast-container {
    bottom: 16px;
    right: 8px;
    left: 8px;
  }
  .atlas-toast {
    min-width: 0;
    max-width: none;
  }
}


/* ═══ tenant-config.css ═══ */
/* Build 149: Tenant Config / Settings Panel */
#atlas-tab-content-settings {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg, #0a0a0a);
  color: var(--text, #e0e0e0);
  z-index: 900;
  overflow-y: auto;
  padding: 2rem;
}
#atlas-tab-content-settings.visible { display: block; }

.tc-settings-container {
  max-width: 640px;
  margin: 0 auto;
}
.tc-settings-container h2 {
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
  color: var(--atlas-primary, #3b82f6);
}
.tc-field {
  margin-bottom: 1.5rem;
}
.tc-field label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  margin-bottom: 0.4rem;
}
.tc-field input[type="text"],
.tc-field select {
  width: 100%;
  padding: 0.6rem 0.8rem;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  color: var(--text);
  font-size: 0.95rem;
  outline: none;
  transition: border-color 0.2s;
}
.tc-field input[type="text"]:focus,
.tc-field select:focus {
  border-color: var(--atlas-primary, #3b82f6);
}
.tc-color-row {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.tc-color-row input[type="color"] {
  width: 48px;
  height: 36px;
  border: 1px solid var(--border-light);
  border-radius: 6px;
  background: none;
  cursor: pointer;
}
.tc-color-row input[type="text"] {
  flex: 1;
}

/* Companies list */
.tc-company-list {
  list-style: none;
  padding: 0;
  margin: 0 0 0.5rem 0;
}
.tc-company-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.6rem;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  margin-bottom: 0.4rem;
}
.tc-company-item input {
  flex: 1;
  background: transparent;
  border: none;
  color: var(--text);
  font-size: 0.9rem;
  outline: none;
}
.tc-company-item .tc-remove-btn {
  background: none;
  border: none;
  color: #f44;
  cursor: pointer;
  font-size: 1.1rem;
  padding: 0 0.3rem;
}
.tc-add-btn {
  background: none;
  border: 1px dashed #555;
  border-radius: 6px;
  color: var(--text-muted);
  padding: 0.4rem 0.8rem;
  cursor: pointer;
  font-size: 0.85rem;
  width: 100%;
  transition: border-color 0.2s, color 0.2s;
}
.tc-add-btn:hover {
  border-color: var(--atlas-primary, #3b82f6);
  color: var(--atlas-primary, #3b82f6);
}

/* Industries (tags) */
.tc-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-bottom: 0.5rem;
}
.tc-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 20px;
  padding: 0.25rem 0.6rem;
  font-size: 0.85rem;
}
.tc-tag .tc-remove-btn {
  background: none;
  border: none;
  color: #f44;
  cursor: pointer;
  font-size: 0.9rem;
  padding: 0;
}
.tc-add-industry {
  display: flex;
  gap: 0.4rem;
}
.tc-add-industry input {
  flex: 1;
}
.tc-add-industry button {
  background: var(--atlas-primary, #3b82f6);
  border: none;
  border-radius: 6px;
  color: #fff;
  padding: 0.4rem 0.8rem;
  cursor: pointer;
  font-size: 0.85rem;
}

/* Save button */
.tc-save-row {
  margin-top: 2rem;
  display: flex;
  gap: 1rem;
  align-items: center;
}
.tc-save-btn {
  background: var(--atlas-primary, #3b82f6);
  border: none;
  border-radius: 8px;
  color: #fff;
  padding: 0.7rem 2rem;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s;
}
.tc-save-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.tc-save-status {
  font-size: 0.9rem;
  color: var(--galaxie-eg);
}
.tc-save-status.error {
  color: #f44;
}

/* Loading state */
.tc-loading {
  text-align: center;
  padding: 3rem;
  color: var(--text-muted);
}


/* ═══ onboarding-wizard.css ═══ */
/* Build 145: Onboarding Wizard */
.ob-overlay {
  position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
  z-index: 90000; background: rgba(10,10,10,.97);
  display: flex; align-items: center; justify-content: center;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--text);
}
.ob-card {
  background: var(--bg-input); border: 1px solid rgba(var(--accent-rgb),.3);
  border-radius: 16px; padding: 40px; max-width: 520px; width: 90vw;
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
}
.ob-progress {
  display: flex; gap: 8px; margin-bottom: 32px;
}
.ob-progress-dot {
  flex: 1; height: 4px; border-radius: 2px;
  background: rgba(255,255,255,.12); transition: background .3s;
}
.ob-progress-dot.active { background: var(--accent); }
.ob-progress-dot.done { background: rgba(var(--accent-rgb),.5); }
.ob-step-title {
  font-size: 22px; font-weight: 600; color: var(--accent); margin: 0 0 8px;
}
.ob-step-desc {
  font-size: 14px; color: var(--text-muted); margin: 0 0 24px; line-height: 1.5;
}
.ob-field { margin-bottom: 16px; }
.ob-label {
  display: block; font-size: 13px; color: var(--text-muted); margin-bottom: 6px;
}
.ob-input, .ob-select {
  width: 100%; padding: 10px 14px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.06);
  color: var(--text); font-size: 15px; outline: none;
  transition: border-color .2s; box-sizing: border-box;
}
.ob-input:focus, .ob-select:focus {
  border-color: var(--accent);
}
.ob-input.error { border-color: var(--status-err); }
.ob-error { color: var(--status-err); font-size: 12px; margin-top: 4px; }
.ob-actions {
  display: flex; gap: 12px; margin-top: 28px; justify-content: flex-end;
}
.ob-btn {
  padding: 10px 24px; border-radius: 8px; border: none; cursor: pointer;
  font-size: 14px; font-weight: 500; transition: all .2s;
}
.ob-btn-back {
  background: transparent; color: var(--text-muted); border: 1px solid rgba(255,255,255,.15);
}
.ob-btn-back:hover { color: #fff; border-color: rgba(255,255,255,.3); }
.ob-btn-next {
  background: linear-gradient(135deg, var(--accent), #b8962e);
  color: #000; font-weight: 600;
}
.ob-btn-next:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(var(--accent-rgb),.3); }
.ob-btn-next:disabled { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
.ob-color-grid {
  display: flex; gap: 8px; flex-wrap: wrap;
}
.ob-color-swatch {
  width: 36px; height: 36px; border-radius: 50%; cursor: pointer;
  border: 3px solid transparent; transition: border-color .2s, transform .2s;
}
.ob-color-swatch:hover { transform: scale(1.1); }
.ob-color-swatch.selected { border-color: #fff; }
.ob-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ob-tag {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px; border-radius: 12px; font-size: 12px;
  background: rgba(var(--accent-rgb),.15); color: var(--accent);
}
.ob-tag-remove {
  cursor: pointer; font-size: 14px; line-height: 1;
  opacity: .6; transition: opacity .2s;
}
.ob-tag-remove:hover { opacity: 1; }
.ob-done-icon {
  font-size: 48px; text-align: center; margin: 20px 0;
}
.ob-summary { font-size: 14px; line-height: 1.8; color: var(--text); }
.ob-summary strong { color: var(--accent); }
@media (max-width: 480px) {
  .ob-card { padding: 24px 20px; }
  .ob-step-title { font-size: 18px; }
}


/* ═══ mobile.css ═══ */
/* Atlas Mobile Dashboard — Build 041 → Mobile Overhaul */
/* Only affects < 768px. Desktop layout is untouched. */

/* ═══════════════════════════════════════════════════
   MOBILE: Vertical Scroll Layout (< 768px)
   ═══════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── Reset body ── */
  html, body {
    overflow-x: hidden !important;
    width: 100vw !important;
    overscroll-behavior-x: none;
  }
  body {
    padding-top: env(safe-area-inset-top) !important;
    padding-bottom: 0 !important;
    padding-left: env(safe-area-inset-left) !important;
    padding-right: env(safe-area-inset-right) !important;
    background: var(--bg) !important;
    font-size: 14px !important;
  }

  /* ── Hide React root + ALL desktop body-level elements ── */
  #root,
  [style*="280px 1fr 360px"],
  [style*="gridTemplateColumns"],
  [id^="atlas-tab-content-"],
  #atlas-tab-bar,
  #atlas-tab-bar-backdrop,
  #atlas-mobile-menu,
  #atlas-mobile-overlay,
  #atlas-side-close,
  #atlas-side-open,
  .tab-nav,
  .pioneer-features-bar,
  .atlas-pioneer-overlay,
  #atlas-3d-sphere,
  .bottomrow-wrap,
  #atlas-bam-overlay,
  #atlas-toast-container,
  #scroll-discover,
  .atlas-scan-reveal {
    display: none !important;
  }

  /* ── Mobile Header with Hamburger ── */
  #atlas-m-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 52px;
    padding-top: env(safe-area-inset-top);
    background: rgba(10,10,10,0.95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(var(--accent-rgb),0.15);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
    z-index: 10000;
    box-sizing: border-box;
  }
  .m-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  #m-hamburger {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: var(--accent);
    font-size: 22px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    padding: 0;
    border-radius: 8px;
  }
  #m-hamburger:active {
    background: rgba(var(--accent-rgb),0.1);
  }
  .m-hamburger-lines {
    width: 22px;
    height: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .m-hamburger-lines span {
    display: block;
    height: 2px;
    background: var(--accent);
    border-radius: 1px;
    transition: all 0.2s ease;
  }
  #m-hamburger.open .m-hamburger-lines span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
  }
  #m-hamburger.open .m-hamburger-lines span:nth-child(2) {
    opacity: 0;
  }
  #m-hamburger.open .m-hamburger-lines span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
  }
  #atlas-m-header .m-header-title {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 3px;
    color: var(--accent);
  }
  #atlas-m-header .m-header-right {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  #atlas-m-header .m-header-clock {
    font-family: 'JetBrains Mono', monospace;
    font-size: 14px;
    color: rgba(255,255,255,0.5);
    font-variant-numeric: tabular-nums;
  }
  #atlas-m-header .m-header-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--galaxie-eg);
    box-shadow: 0 0 6px rgba(34,197,94,0.5);
    flex-shrink: 0;
  }
  #atlas-m-header .m-header-dot.offline {
    background: var(--status-err);
    box-shadow: 0 0 6px rgba(239,68,68,0.5);
  }

  /* BA-03: Altes Hamburger-Sondermenue entfaellt — Hamburger oeffnet den
     MEHR-Drawer aus bottom-nav.css. DOM-Reste ausblenden: */
  #m-menu-overlay,
  #m-menu-drawer {
    display: none !important;
  }

  /* BA-03: FABs auf Mobile ausblenden */
  #quick-actions-fab,
  #quick-actions-panel,
  .ave-btn {
    display: none !important;
  }

  /* ── Main Scroll Container (replaces swipe) ── */
  #atlas-m-swipe {
    position: fixed;
    top: calc(52px + env(safe-area-inset-top, 0px));
    left: 0;
    right: 0;
    bottom: calc(64px + 66px + env(safe-area-inset-bottom, 0px));
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: none;
    display: block;
  }
  #atlas-m-swipe::-webkit-scrollbar {
    display: none;
  }

  /* ── Individual Panel (vertical stacking) ── */
  .m-panel {
    flex: none;
    width: 100%;
    height: auto;
    min-height: 0;
    scroll-snap-align: none;
    overflow-y: visible;
    padding: 12px 16px;
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
    box-sizing: border-box;
    display: none;
  }
  .m-panel.m-panel-active {
    display: block;
  }

  /* ── Bottom Tab Bar (replaces dots) ── */
  #atlas-m-dots {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 64px;
    padding-bottom: env(safe-area-inset-bottom);
    background: rgba(10,10,10,0.95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid rgba(var(--accent-rgb),0.12);
    display: flex;
    align-items: center;
    justify-content: space-around;
    z-index: 10000;
  }
  .m-dot {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: auto;
    height: 56px;
    min-width: 64px;
    min-height: 44px;
    border-radius: 0;
    background: none;
    border: none;
    padding: 4px 8px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.2s;
    color: rgba(255,255,255,0.35);
  }
  .m-dot .m-tab-icon {
    font-size: 22px;
    line-height: 1;
  }
  .m-dot .m-tab-label {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.3px;
    white-space: nowrap;
  }
  .m-dot.active {
    color: var(--accent);
    width: auto;
    border-radius: 0;
    box-shadow: none;
  }
  .m-dot.active .m-tab-icon {
    filter: drop-shadow(0 0 4px rgba(var(--accent-rgb),0.4));
  }
  .m-dot-label {
    display: none;
  }

  /* ════════════════════════════════════════════════
     PANEL 1: CHAT + SPHERE
     ════════════════════════════════════════════════ */
  #m-panel-chat {
    display: flex;
    flex-direction: column;
    padding-bottom: 0;
    height: 100%;
  }
  #m-panel-chat.m-panel-active {
    display: flex;
  }

  .m-sphere-wrap {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 8px 0 4px;
    flex-shrink: 0;
  }
  .m-sphere {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, rgba(var(--accent-rgb),0.15), transparent 70%);
    border: 1px solid rgba(var(--accent-rgb),0.2);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  .m-sphere-inner {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: radial-gradient(circle at 40% 40%, rgba(var(--accent-rgb),0.25), rgba(var(--accent-rgb),0.05) 60%, transparent 80%);
    animation: m-sphere-breathe 4s ease-in-out infinite;
  }
  @keyframes m-sphere-breathe {
    0%, 100% { transform: scale(0.9); opacity: 0.7; }
    50% { transform: scale(1.05); opacity: 1; }
  }
  .m-sphere.listening .m-sphere-inner {
    background: radial-gradient(circle at 40% 40%, rgba(220,40,60,0.3), rgba(220,40,60,0.1) 60%, transparent 80%);
    animation: m-sphere-pulse 1s ease-in-out infinite;
  }
  @keyframes m-sphere-pulse {
    0%, 100% { transform: scale(0.95); }
    50% { transform: scale(1.1); }
  }

  .m-chat-messages {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0;
    min-height: 0;
  }
  .m-chat-msg {
    max-width: 85%;
    padding: 12px 16px;
    border-radius: 18px;
    font-size: 15px;
    line-height: 1.5;
    word-break: break-word;
    font-family: 'Inter', system-ui, sans-serif;
  }
  .m-chat-msg.user {
    align-self: flex-end;
    background: rgba(var(--accent-rgb),0.15);
    border: 1px solid rgba(var(--accent-rgb),0.2);
    color: #e8d8a0;
    border-bottom-right-radius: 4px;
  }
  .m-chat-msg.assistant {
    align-self: flex-start;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.85);
    border-bottom-left-radius: 4px;
  }
  .m-chat-msg.assistant a {
    color: var(--accent);
  }

  /* Chat Input Bar (fixed above bottom tabs) */
  #m-chat-input-bar {
    position: fixed;
    bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    left: 0;
    right: 0;
    background: rgba(10,10,10,0.97);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid rgba(var(--accent-rgb),0.15);
    padding: 8px 12px;
    padding-left: max(12px, env(safe-area-inset-left, 0px));
    padding-right: max(12px, env(safe-area-inset-right, 0px));
    display: flex;
    align-items: flex-end;
    gap: 8px;
    z-index: 9990;
    transition: bottom 0.15s ease, opacity 0.2s, visibility 0.2s;
  }
  #m-chat-input-bar.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
  #m-chat-input {
    flex: 1;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(var(--accent-rgb),0.2);
    color: #fff;
    font-size: 16px;
    padding: 12px 16px;
    border-radius: 22px;
    outline: none;
    font-family: 'Inter', system-ui, sans-serif;
    resize: none;
    max-height: 120px;
    line-height: 1.4;
    min-height: 44px !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }
  #m-chat-input:focus {
    border-color: rgba(var(--accent-rgb),0.5);
  }
  #m-chat-input::placeholder {
    color: rgba(255,255,255,0.25);
    font-size: 15px;
  }
  #m-chat-mic {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(var(--accent-rgb),0.2), rgba(var(--accent-rgb),0.1));
    border: 2px solid rgba(var(--accent-rgb),0.4);
    color: var(--accent);
    font-size: 22px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
    transition: all 0.2s;
    min-height: 48px !important;
    min-width: 48px !important;
  }
  #m-chat-mic:active {
    transform: scale(0.92);
  }
  #m-chat-mic.recording {
    background: linear-gradient(135deg, rgba(220,40,60,0.25), rgba(220,40,60,0.15));
    border-color: rgba(220,40,60,0.6);
    color: #ff4466;
    animation: m-mic-pulse 1.5s ease-in-out infinite;
  }
  @keyframes m-mic-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(220,40,60,0.3); }
    50% { box-shadow: 0 0 0 10px rgba(220,40,60,0); }
  }
  #m-chat-send {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(var(--accent-rgb),0.15);
    border: 1px solid rgba(var(--accent-rgb),0.3);
    color: var(--accent);
    font-size: 18px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    -webkit-tap-highlight-color: transparent;
    transition: all 0.15s;
    min-height: 48px !important;
    min-width: 48px !important;
  }
  #m-chat-send:active {
    background: rgba(var(--accent-rgb),0.3);
    transform: scale(0.92);
  }

  /* ════════════════════════════════════════════════
     PANEL 2: INBOX + KALENDER (collapsible)
     ════════════════════════════════════════════════ */
  .m-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    min-height: 44px;
    padding: 4px 0;
  }
  .m-section-toggle {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,0.3);
    font-size: 14px;
    transition: transform 0.2s;
    border: none;
    background: none;
    padding: 0;
  }
  .m-section-header.collapsed .m-section-toggle {
    transform: rotate(-90deg);
  }
  .m-section-content {
    overflow: hidden;
    transition: max-height 0.25s ease;
    max-height: 2000px;
  }
  .m-section-content.collapsed {
    max-height: 0;
  }
  .m-section-title {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(var(--accent-rgb),0.7);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .m-section-badge {
    background: rgba(var(--accent-rgb),0.15);
    color: var(--accent);
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 700;
    letter-spacing: 0;
    min-width: 20px;
    text-align: center;
  }

  /* Mail items */
  .m-mail-item {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 8px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background 0.15s;
    min-height: 44px;
    box-sizing: border-box;
  }
  .m-mail-item:active {
    background: rgba(255,255,255,0.06);
  }
  .m-mail-item.unread {
    border-left: 3px solid var(--accent);
  }
  .m-mail-from {
    font-size: 15px;
    font-weight: 600;
    color: rgba(255,255,255,0.85);
    margin-bottom: 3px;
    font-family: 'Inter', system-ui, sans-serif;
  }
  .m-mail-subject {
    font-size: 14px;
    color: rgba(255,255,255,0.5);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-family: 'Inter', system-ui, sans-serif;
  }
  .m-mail-time {
    font-size: 12px;
    color: rgba(255,255,255,0.3);
    margin-top: 4px;
    font-family: 'JetBrains Mono', monospace;
  }

  /* Calendar items */
  .m-cal-item {
    background: rgba(var(--accent-rgb),0.05);
    border: 1px solid rgba(var(--accent-rgb),0.12);
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    box-sizing: border-box;
  }
  .m-cal-time {
    font-family: 'JetBrains Mono', monospace;
    font-size: 14px;
    color: var(--accent);
    white-space: nowrap;
    min-width: 48px;
    font-variant-numeric: tabular-nums;
  }
  .m-cal-title {
    font-size: 15px;
    color: rgba(255,255,255,0.8);
    font-family: 'Inter', system-ui, sans-serif;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .m-cal-now {
    border-color: rgba(34,197,94,0.3);
    background: rgba(34,197,94,0.05);
  }
  .m-cal-now .m-cal-time {
    color: var(--galaxie-eg);
  }

  /* Awaiting section */
  .m-awaiting-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    min-height: 44px;
    box-sizing: border-box;
  }
  .m-awaiting-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(var(--accent-rgb),0.5);
    flex-shrink: 0;
  }
  .m-awaiting-text {
    font-size: 14px;
    color: rgba(255,255,255,0.6);
    font-family: 'Inter', system-ui, sans-serif;
  }

  /* ════════════════════════════════════════════════
     PANEL 3: COMPANY CARDS
     ════════════════════════════════════════════════ */
  .m-company-card {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 12px;
  }
  .m-company-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
  }
  .m-company-name {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: rgba(255,255,255,0.9);
    letter-spacing: 0.5px;
  }
  .m-company-score {
    font-family: 'JetBrains Mono', monospace;
    font-size: 22px;
    font-weight: 700;
    color: var(--accent);
  }
  .m-company-score-label {
    font-size: 12px;
    color: rgba(var(--accent-rgb),0.5);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-left: 4px;
  }
  .m-company-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .m-company-stat {
    display: flex;
    flex-direction: column;
    padding: 8px 10px;
    background: rgba(255,255,255,0.02);
    border-radius: 8px;
    min-height: 44px;
    justify-content: center;
  }
  .m-company-stat-label {
    font-size: 12px;
    color: rgba(255,255,255,0.35);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: 'Inter', system-ui, sans-serif;
  }
  .m-company-stat-value {
    font-size: 16px;
    color: rgba(255,255,255,0.75);
    font-family: 'JetBrains Mono', monospace;
    font-weight: 600;
  }
  .m-company-card.eg { border-top: 2px solid var(--galaxie-eg); }
  .m-company-card.haf { border-top: 2px solid #3b82f6; }
  .m-company-card.ce { border-top: 2px solid #a855f7; }

  /* Pipeline mini */
  .m-pipeline-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    min-height: 44px;
    box-sizing: border-box;
  }
  .m-pipeline-stage {
    font-size: 12px;
    color: rgba(255,255,255,0.4);
    width: 70px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: 'Inter', system-ui, sans-serif;
  }
  .m-pipeline-bar {
    flex: 1;
    height: 8px;
    background: rgba(255,255,255,0.05);
    border-radius: 4px;
    overflow: hidden;
  }
  .m-pipeline-fill {
    height: 100%;
    border-radius: 4px;
    background: linear-gradient(90deg, var(--accent), var(--accent-light));
    transition: width 0.5s ease;
  }
  .m-pipeline-val {
    font-size: 14px;
    color: rgba(255,255,255,0.6);
    font-family: 'JetBrains Mono', monospace;
    width: 60px;
    text-align: right;
  }

  /* ════════════════════════════════════════════════
     PANEL 4: ACTIVITY + INSIGHTS
     ════════════════════════════════════════════════ */
  .m-activity-item {
    display: flex;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    min-height: 44px;
    box-sizing: border-box;
    align-items: flex-start;
  }
  .m-activity-time {
    font-family: 'JetBrains Mono', monospace;
    font-size: 12px;
    color: rgba(255,255,255,0.3);
    width: 42px;
    flex-shrink: 0;
    padding-top: 2px;
    font-variant-numeric: tabular-nums;
  }
  .m-activity-icon {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
    background: rgba(var(--accent-rgb),0.1);
  }
  .m-activity-text {
    font-size: 14px;
    color: rgba(255,255,255,0.7);
    font-family: 'Inter', system-ui, sans-serif;
    line-height: 1.5;
    flex: 1;
  }
  .m-activity-text strong {
    color: rgba(255,255,255,0.9);
    font-weight: 600;
  }

  /* Insight cards */
  .m-insight-card {
    background: rgba(var(--accent-rgb),0.04);
    border: 1px solid rgba(var(--accent-rgb),0.1);
    border-radius: 12px;
    padding: 14px;
    margin-bottom: 8px;
  }
  .m-insight-label {
    font-size: 12px;
    color: rgba(var(--accent-rgb),0.5);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 4px;
    font-family: 'Inter', system-ui, sans-serif;
  }
  .m-insight-value {
    font-size: 24px;
    font-weight: 700;
    color: var(--accent);
    font-family: 'JetBrains Mono', monospace;
  }
  .m-insight-sub {
    font-size: 14px;
    color: rgba(255,255,255,0.4);
    margin-top: 2px;
    font-family: 'Inter', system-ui, sans-serif;
  }
  .m-insights-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  /* ── Empty state ── */
  .m-empty {
    text-align: center;
    padding: 24px;
    color: rgba(255,255,255,0.3);
    font-size: 14px;
    font-family: 'Inter', system-ui, sans-serif;
  }

  /* ── Loading shimmer ── */
  .m-shimmer {
    background: linear-gradient(90deg, rgba(255,255,255,0.03) 25%, rgba(255,255,255,0.06) 50%, rgba(255,255,255,0.03) 75%);
    background-size: 200% 100%;
    animation: m-shimmer 1.5s infinite;
    border-radius: 10px;
    height: 52px;
    margin-bottom: 8px;
  }
  @keyframes m-shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
  }

  /* ── Mobile Sonos Bar — Mini-Bar direkt oberhalb Bottom-Nav ── */
  #sonos-bar {
    display: flex !important;
    position: fixed !important;
    bottom: calc(60px + env(safe-area-inset-bottom, 0px)) !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    z-index: 9989 !important;
    background: rgba(10,10,10,0.97) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-top: 1px solid rgba(var(--accent-rgb),0.1) !important;
    border-bottom: none !important;
    padding: 0 12px !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    overflow: hidden !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  #sonos-bar .sonos-track-info,
  #sonos-bar .sonos-track {
    flex: 1 !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 13px !important;
  }
  #sonos-bar .sonos-art,
  #sonos-bar .sonos-album-art {
    width: 32px !important;
    height: 32px !important;
    border-radius: 4px !important;
    flex-shrink: 0 !important;
  }
  #sonos-bar button,
  #sonos-bar .sonos-btn {
    min-width: 36px !important;
    min-height: 36px !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    font-size: 16px !important;
    flex-shrink: 0 !important;
  }
  #sonos-bar .sonos-volume,
  #sonos-bar .sonos-progress,
  #sonos-bar .sonos-room-select,
  #sonos-bar .sonos-room-dropdown,
  #sonos-bar .sonos-extra {
    display: none !important;
  }
  /* Sonos spielt: Chat-Input ueber Sonos+Nav schieben */
  #m-chat-input-bar.sonos-active {
    bottom: calc(60px + 48px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Sonos hidden when no music */
  #sonos-bar.sonos-idle,
  #sonos-bar:empty {
    display: none !important;
  }
}

/* ═══════════════════════════════════════════════════
   TABLET: 768-1024px — hide mobile elements
   ═══════════════════════════════════════════════════ */
@media (min-width: 768px) and (max-width: 1024px) {
  #atlas-m-header,
  #atlas-m-swipe,
  #atlas-m-dots,
  #m-chat-input-bar,
  #m-menu-overlay,
  #m-menu-drawer {
    display: none !important;
  }
}

/* ═══════════════════════════════════════════════════
   DESKTOP: > 1024px — completely untouched
   ═══════════════════════════════════════════════════ */
@media (min-width: 1025px) {
  #atlas-m-header,
  #atlas-m-swipe,
  #atlas-m-dots,
  #m-chat-input-bar,
  #m-menu-overlay,
  #m-menu-drawer {
    display: none !important;
  }
}


/* ═══ bottom-nav.css ═══ */
/* Bottom Navigation — Build 106: Mobile-only fixed bottom bar */

/* ── Desktop: hidden ── */
#atlas-bottom-nav { display: none; }

@media (max-width: 768px) {

  /* ── Show bottom nav ── */
  #atlas-bottom-nav {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: rgba(10, 10, 10, 0.96);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid rgba(var(--accent-rgb), 0.15);
    align-items: center;
    justify-content: space-around;
    z-index: 10001;
    box-sizing: content-box;
  }

  /* ── Hide existing mobile dots when bottom nav active ── */
  #atlas-m-dots {
    display: none !important;
  }

  /* ── Tab button ── */
  .bnav-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    flex: 1;
    height: 56px;
    min-width: 48px;
    background: none;
    border: none;
    padding: 4px 2px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.2s, transform 0.15s;
    color: rgba(255, 255, 255, 0.4);
    position: relative;
  }

  .bnav-btn:active {
    transform: scale(0.92);
  }

  .bnav-icon {
    font-size: 22px;
    line-height: 1;
    transition: filter 0.2s;
  }

  .bnav-label {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.3px;
    white-space: nowrap;
    text-transform: uppercase;
  }

  /* ── Active state ── */
  .bnav-btn.active {
    color: var(--accent);
  }

  .bnav-btn.active .bnav-icon {
    filter: drop-shadow(0 0 6px rgba(var(--accent-rgb), 0.5));
  }

  .bnav-btn.active::before {
    content: '';
    position: absolute;
    top: 0;
    left: 25%;
    right: 25%;
    height: 2px;
    background: var(--accent);
    border-radius: 0 0 2px 2px;
  }

  /* ── Stapelreihenfolge: Nav(60) → Sonos(48, optional) → Chat(~50) → Content ── */
  #atlas-m-swipe {
    bottom: calc(60px + 50px + env(safe-area-inset-bottom, 0px)) !important;
    padding-bottom: 0 !important;
  }

  #m-chat-input-bar {
    bottom: calc(60px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Sonos spielt: Swipe-Container und Chat-Input nach oben schieben */
  body.sonos-playing #atlas-m-swipe {
    bottom: calc(60px + 48px + 50px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body.sonos-playing #m-chat-input-bar {
    bottom: calc(60px + 48px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* ── When a main tab is active, show its content on mobile ── */
  body.bnav-main-tab-active #atlas-m-swipe,
  body.bnav-main-tab-active #m-chat-input-bar {
    display: none !important;
  }

  body.bnav-main-tab-active [id^="atlas-tab-content-"].visible {
    display: block !important;
    position: fixed !important;
    top: calc(52px + env(safe-area-inset-top, 0px)) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: calc(60px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    z-index: 5000 !important;
    background: var(--bg-base, #0a0a0a) !important;
    padding: 12px !important;
    width: auto !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }

  /* Sonos-Bar oberhalb der Bottom-Nav, unterhalb Content/Chat */
  body.bnav-main-tab-active #sonos-bar:not(.sonos-idle):not(:empty) {
    bottom: calc(60px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body.bnav-main-tab-active [id^="atlas-tab-content-"].visible.sonos-shift {
    bottom: calc(60px + 48px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* ── "Mehr" Drawer — gruppiert, vollstaendig (identisch Desktop-Sidebar) ── */
  #bnav-more-drawer {
    display: none;
    position: fixed;
    bottom: calc(60px + env(safe-area-inset-bottom, 0px));
    left: 0;
    right: 0;
    background: rgba(12, 12, 16, 0.98);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-top: 1px solid rgba(var(--accent-rgb), 0.15);
    z-index: 10002;
    max-height: 70vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    padding-bottom: 8px;
  }

  #bnav-more-drawer.open {
    display: block;
    animation: bnav-slide-up 0.25s ease-out;
  }

  @keyframes bnav-slide-up {
    from { transform: translateY(30%); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
  }

  #bnav-more-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 10001;
  }

  #bnav-more-overlay.open {
    display: block;
  }

  .bnav-more-content {
    padding: 8px 12px;
  }

  .bnav-more-section {
    margin-bottom: 4px;
  }

  .bnav-more-cap {
    font-family: 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: rgba(var(--accent-rgb), 0.5);
    padding: 10px 4px 6px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    margin-bottom: 6px;
  }

  .bnav-more-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
  }

  .bnav-more-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 10px 2px;
    min-height: 54px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 10px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    color: rgba(255, 255, 255, 0.7);
    font-family: 'Inter', system-ui, sans-serif;
    transition: background 0.15s, border-color 0.15s;
  }

  .bnav-more-item:active {
    background: rgba(var(--accent-rgb), 0.12);
    border-color: rgba(var(--accent-rgb), 0.2);
  }

  .bnav-more-item .bnav-icon {
    font-size: 22px;
    line-height: 1;
  }

  .bnav-more-item .bnav-label {
    font-size: 10px;
    font-weight: 500;
    color: inherit;
    text-transform: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
}


/* ═══ mobile-safari-fix.css ═══ */
/* Mobile Safari Layout Fix — Build 405
   Uses --vv-bottom and --kb-height set by mobile-safari-fix.js */

@media (max-width: 768px) {
  /* When keyboard is open: input stays visible, tab bar hides */
  html.kb-open #atlas-bottom-nav {
    transform: translateY(100%);
    transition: transform 0.15s ease;
  }

  html.kb-open #m-chat-input-bar {
    bottom: var(--kb-height, 0px) !important;
    transition: bottom 0.15s ease;
  }

  html.kb-open #atlas-m-swipe {
    bottom: calc(var(--kb-height, 0px) + 66px) !important;
  }

  /* Restore tab bar transition when keyboard closes */
  #atlas-bottom-nav {
    transition: transform 0.15s ease;
  }
}


/* ═══ finance-panel.css ═══ */
/* Finanz-Dashboard Panel */

.fin-wrap {
  padding: 16px 20px 32px;
  max-width: 1200px;
  margin: 0 auto;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: var(--text);
}

.fin-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.fin-header h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 1px;
}

.fin-icon { font-size: 24px; }

.fin-subtitle {
  font-size: 13px;
  color: var(--text-muted);
  margin-left: 4px;
}

.fin-btn-refresh {
  margin-left: auto;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  color: var(--text-muted);
  border-radius: 6px;
  padding: 6px 12px;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s;
}
.fin-btn-refresh:hover {
  background: rgba(255,255,255,0.12);
  color: #fff;
}

/* ── Section 1: Firm Balance Cards ── */
.fin-balances {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}

.fin-balance-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  transition: border-color 0.3s, background 0.3s;
}

.fin-balance-card:hover {
  border-color: rgba(var(--accent-rgb),0.3);
  background: rgba(255,255,255,0.06);
}

.fin-balance-firma {
  font-size: 12px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fin-balance-amount {
  font-size: 22px;
  font-weight: 700;
  color: #fff;
}

.fin-balance-amount.positive { color: var(--status-ok); }
.fin-balance-amount.negative { color: var(--status-err); }

.fin-balance-currency {
  font-size: 12px;
  color: var(--text-dim);
  margin-top: 4px;
}

/* ── Section 2: Two-Column Layout ── */
.fin-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 24px;
}

.fin-section {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 16px;
}

.fin-section-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* ── Section 2a: Transactions Table ── */
.fin-tx-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.fin-tx-table th {
  text-align: left;
  color: var(--text-dim);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 6px 8px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.fin-tx-table td {
  padding: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 180px;
}

.fin-tx-table tr:last-child td {
  border-bottom: none;
}

.fin-tx-table tr:hover td {
  background: rgba(255,255,255,0.03);
}

.fin-tx-amount {
  font-weight: 600;
  text-align: right;
}

.fin-tx-amount.income { color: var(--status-ok); }
.fin-tx-amount.expense { color: var(--status-err); }

.fin-tx-cat {
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(255,255,255,0.06);
  color: var(--text-muted);
  display: inline-block;
}

/* ── Section 2b: Donut Chart ── */
.fin-donut-wrap {
  display: flex;
  align-items: center;
  gap: 20px;
}

.fin-donut {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
}

.fin-donut-hole {
  position: absolute;
  top: 25%;
  left: 25%;
  width: 50%;
  height: 50%;
  border-radius: 50%;
  background: var(--bg-input);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-muted);
}

.fin-donut-legend {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.fin-donut-legend-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--text);
}

.fin-donut-legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.fin-donut-legend-pct {
  margin-left: auto;
  color: var(--text-muted);
  font-weight: 600;
}

/* ── Section 3: Bottom Row ── */
.fin-bottom-row {
  display: grid;
  grid-template-columns: 250px 1fr;
  gap: 20px;
}

/* ── Section 3a: Open Invoices Badge ── */
.fin-invoices-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.fin-invoices-badge {
  font-size: 40px;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}

.fin-invoices-badge.overdue {
  color: var(--status-err);
}

.fin-invoices-label {
  font-size: 13px;
  color: var(--text-muted);
}

.fin-invoices-total {
  font-size: 16px;
  font-weight: 600;
  color: var(--accent);
}

.fin-invoices-overdue-tag {
  font-size: 11px;
  padding: 3px 10px;
  border-radius: 12px;
  background: rgba(239, 83, 80, 0.15);
  color: var(--status-err);
  font-weight: 600;
}

/* ── Section 3b: Cash Flow Bars ── */
.fin-cashflow-section {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 16px;
}

.fin-cashflow-weeks {
  display: flex;
  gap: 8px;
  align-items: flex-end;
  height: 150px;
}

.fin-cashflow-week {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
}

.fin-cashflow-bars {
  flex: 1;
  display: flex;
  gap: 3px;
  align-items: flex-end;
  width: 100%;
}

.fin-cashflow-bar {
  flex: 1;
  border-radius: 3px 3px 0 0;
  min-height: 2px;
  transition: height 0.4s ease;
}

.fin-cashflow-bar.income {
  background: var(--status-ok);
  opacity: 0.85;
}

.fin-cashflow-bar.expense {
  background: var(--status-err);
  opacity: 0.85;
}

.fin-cashflow-label {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 6px;
  text-align: center;
  white-space: nowrap;
}

.fin-cashflow-legend {
  display: flex;
  gap: 16px;
  margin-top: 12px;
  justify-content: center;
}

.fin-cashflow-legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--text-muted);
}

.fin-cashflow-legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 2px;
}

.fin-cashflow-legend-dot.income { background: var(--status-ok); opacity: 0.85; }
.fin-cashflow-legend-dot.expense { background: var(--status-err); opacity: 0.85; }

/* ── States ── */
.fin-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-muted);
  font-size: 14px;
}

.fin-empty {
  text-align: center;
  padding: 30px;
  color: var(--text-dim);
  font-size: 13px;
}

.fin-error {
  text-align: center;
  padding: 30px;
  color: var(--status-err);
  font-size: 13px;
}

/* ── Mobile ── */
@media (max-width: 900px) {
  .fin-columns {
    grid-template-columns: 1fr;
  }
  .fin-bottom-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .fin-wrap { padding: 12px 12px 24px; }
  .fin-balances {
    grid-template-columns: 1fr 1fr;
  }
  .fin-balance-amount { font-size: 18px; }
  .fin-donut-wrap { flex-direction: column; }
  .fin-donut { width: 120px; height: 120px; }
}


/* ═══ hermes-panel.css ═══ */
/* Hermes Wissens-Hub Panel */
.hermes-wrap {
  max-width: 900px;
  margin: 0 auto;
  padding: 24px 16px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.hermes-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.hermes-header h2 {
  margin: 0;
  font-size: 1.3rem;
  color: var(--text);
  letter-spacing: 0.04em;
}

.hermes-icon {
  font-size: 1.6rem;
}

.hermes-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 12px;
  background: var(--status-err);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
}

.hermes-btn-refresh {
  margin-left: auto;
  background: transparent;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  font-size: 1.1rem;
  border-radius: 6px;
  padding: 4px 10px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.hermes-btn-refresh:hover {
  background: var(--bg-input);
  color: var(--accent);
}

/* Grid: Messages + Hints side by side */
.hermes-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 20px;
}

@media (max-width: 640px) {
  .hermes-grid {
    grid-template-columns: 1fr;
  }
}

.hermes-section {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
}

.hermes-section-title {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  margin-bottom: 12px;
  font-weight: 600;
}

/* Messages */
.hermes-msg-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.hermes-msg-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.hermes-msg-item:last-child {
  border-bottom: none;
}

.hermes-dot {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-top: 5px;
}

.hermes-msg-body {
  flex: 1;
  min-width: 0;
}

.hermes-msg-source {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--accent);
  display: flex;
  align-items: center;
  gap: 8px;
}

.hermes-msg-time {
  font-size: 0.72rem;
  color: var(--text-dim);
  font-weight: 400;
}

.hermes-msg-text {
  font-size: 0.8rem;
  color: var(--text-muted);
  margin-top: 3px;
  line-height: 1.4;
}

/* Hints */
.hermes-hint-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.hermes-hint-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.hermes-hint-item:last-child {
  border-bottom: none;
}

.hermes-hint-icon {
  font-size: 1.1rem;
  flex-shrink: 0;
  margin-top: 1px;
}

.hermes-hint-text {
  font-size: 0.8rem;
  color: var(--text);
  line-height: 1.4;
}

/* Stats bar */
.hermes-stats {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 16px;
}

.hermes-stat-icon {
  font-size: 1.2rem;
}

.hermes-stat-text {
  font-size: 0.82rem;
  color: var(--text-muted);
}

/* Empty state */
.hermes-empty {
  font-size: 0.8rem;
  color: var(--text-dim);
  text-align: center;
  padding: 16px 0;
}


/* ═══ maintenance-panel.css ═══ */
/* PV Monitoring / Maintenance Dashboard Panel */

.maint-wrap {
  padding: 24px;
  max-width: 1400px;
  margin: 0 auto;
  color: var(--text);
}

.maint-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.maint-header .maint-icon {
  font-size: 28px;
}

.maint-header h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 1px;
}

.maint-header .maint-subtitle {
  font-size: 13px;
  color: var(--text-muted);
  margin-left: auto;
}

.maint-btn-refresh {
  background: none;
  border: 1px solid var(--border-light);
  color: var(--accent);
  font-size: 18px;
  cursor: pointer;
  border-radius: 6px;
  padding: 4px 10px;
  transition: background 0.2s;
}

.maint-btn-refresh:hover {
  background: rgba(var(--accent-rgb), 0.15);
}

/* ── Top Stats Row ── */

.maint-stats-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}

.maint-stat-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--border-light);
  border-radius: 10px;
  padding: 16px;
  text-align: center;
}

.maint-stat-card .maint-stat-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--accent);
}

.maint-stat-card .maint-stat-label {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.maint-stat-card.green .maint-stat-value { color: var(--status-ok); }
.maint-stat-card.yellow .maint-stat-value { color: var(--status-warn); }
.maint-stat-card.red .maint-stat-value { color: var(--status-err); }

/* ── Main Grid ── */

.maint-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 24px;
}

@media (max-width: 900px) {
  .maint-grid {
    grid-template-columns: 1fr;
  }
}

.maint-section {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid var(--border-light);
  border-radius: 10px;
  overflow: hidden;
}

.maint-section-title {
  padding: 12px 16px;
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid var(--border-light);
  background: rgba(var(--accent-rgb), 0.05);
}

/* ── Standort-Liste ── */

.maint-site-list {
  max-height: 420px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--text-dim) transparent;
}

.maint-site-list::-webkit-scrollbar {
  width: 6px;
}

.maint-site-list::-webkit-scrollbar-thumb {
  background: #444;
  border-radius: 3px;
}

.maint-site-row {
  display: grid;
  grid-template-columns: 10px 1fr 70px 80px 55px 40px;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  font-size: 13px;
  transition: background 0.15s;
}

.maint-site-row:hover {
  background: rgba(255, 255, 255, 0.04);
}

.maint-site-row:last-child {
  border-bottom: none;
}

.maint-site-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}

.maint-site-dot.green { background: var(--status-ok); box-shadow: 0 0 6px rgba(76, 175, 80, 0.4); }
.maint-site-dot.yellow { background: var(--status-warn); box-shadow: 0 0 6px rgba(255, 152, 0, 0.4); }
.maint-site-dot.red { background: var(--status-err); box-shadow: 0 0 6px rgba(239, 83, 80, 0.4); animation: maint-pulse 1.5s infinite; }
.maint-site-dot.gray { background: var(--text-dim); }

@keyframes maint-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.maint-site-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text);
}

.maint-site-kwp {
  text-align: right;
  color: var(--text-muted);
  font-size: 12px;
}

.maint-site-yield {
  text-align: right;
  color: var(--accent);
  font-weight: 600;
}

.maint-site-dev {
  text-align: right;
  font-size: 12px;
  font-weight: 600;
}

.maint-site-dev.positive { color: var(--status-ok); }
.maint-site-dev.negative { color: var(--status-err); }
.maint-site-dev.warning { color: var(--status-warn); }
.maint-site-dev.neutral { color: var(--text-muted); }

.maint-site-ampel {
  text-align: center;
  font-size: 16px;
}

/* ── Header row for site list ── */

.maint-site-header {
  display: grid;
  grid-template-columns: 10px 1fr 70px 80px 55px 40px;
  align-items: center;
  gap: 10px;
  padding: 6px 16px;
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid var(--border-light);
  background: rgba(0, 0, 0, 0.2);
}

/* ── Anomalien ── */

.maint-anomaly-list {
  max-height: 420px;
  overflow-y: auto;
}

.maint-anomaly-item {
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.maint-anomaly-item:last-child {
  border-bottom: none;
}

.maint-anomaly-icon {
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 1px;
}

.maint-anomaly-body {
  flex: 1;
}

.maint-anomaly-name {
  font-weight: 600;
  font-size: 13px;
  color: #fff;
}

.maint-anomaly-msg {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 2px;
}

.maint-anomaly-empty {
  padding: 24px;
  text-align: center;
  color: var(--status-ok);
  font-size: 14px;
}

/* ── Bottom Row (Wartungen + Plan) ── */

.maint-bottom-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

@media (max-width: 900px) {
  .maint-bottom-row {
    grid-template-columns: 1fr;
  }
}

.maint-next-list {
  padding: 0;
}

.maint-next-item {
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  display: flex;
  gap: 12px;
  align-items: center;
}

.maint-next-item:last-child {
  border-bottom: none;
}

.maint-next-date {
  background: rgba(var(--accent-rgb), 0.15);
  color: var(--accent);
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  min-width: 80px;
  text-align: center;
}

.maint-next-info {
  flex: 1;
}

.maint-next-site {
  font-weight: 600;
  font-size: 13px;
  color: var(--text);
}

.maint-next-title {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 2px;
}

.maint-next-empty {
  padding: 24px;
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
}

/* ── Plan Download ── */

.maint-plan-card {
  padding: 20px 16px;
  text-align: center;
}

.maint-plan-icon {
  font-size: 36px;
  margin-bottom: 8px;
}

.maint-plan-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  margin-bottom: 4px;
}

.maint-plan-date {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 12px;
}

.maint-plan-btn {
  display: inline-block;
  background: rgba(var(--accent-rgb), 0.15);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb), 0.3);
  padding: 8px 20px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s;
}

.maint-plan-btn:hover {
  background: rgba(var(--accent-rgb), 0.25);
}

.maint-plan-empty {
  padding: 24px;
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
}

/* ── Error / Loading ── */

.maint-error {
  padding: 24px;
  text-align: center;
  color: var(--status-err);
  font-size: 14px;
}

.maint-loading {
  padding: 24px;
  text-align: center;
  color: var(--text-muted);
  font-size: 14px;
}

.maint-auto-refresh {
  text-align: center;
  color: var(--text-dim);
  font-size: 11px;
  margin-top: 16px;
}


/* ═══ responsive.css ═══ */
/* Atlas Responsive — Build 092+: No-Scroll Dashboard Fix */

/* ── Global Reset ── */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  margin: 0;
  padding: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  overflow: hidden !important;
}

body {
  margin: 0;
  padding: 0;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  max-height: 100vh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  position: fixed;
  top: 0;
  left: 0;
}

#root {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  overflow: hidden !important;
}

#root > div {
  max-height: 100vh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
}

/* Panels with potentially long content: internal scroll only */
.atlas-inbox,
.atlas-inbox-list,
.activity-feed,
.activity-panel,
.hermes-panel-body,
.hermes-list,
.status-panel-body,
[class*="inbox"] > [class*="list"],
[class*="activity"] > [class*="list"],
.builder-wrap #btab-build-list,
.builder-wrap #btab-panel-queue {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Cost widget must NEVER appear outside Vulkan tab */
body > #cost-dashboard-widget,
.sidebar > #cost-dashboard-widget,
aside > #cost-dashboard-widget {
  display: none !important;
}

/* ── Mobile: <= 480px (small phones) ── */
@media (max-width: 480px) {
  body {
    font-size: 15px;
  }

  /* Panels full-width, tight padding */
  .m-panel {
    padding: 8px 10px;
    padding-left: max(10px, env(safe-area-inset-left));
    padding-right: max(10px, env(safe-area-inset-right));
  }

  /* Force single-column grids */
  .m-company-details,
  .m-insights-grid,
  .mission-project-stats {
    grid-template-columns: 1fr !important;
  }

  /* Smaller card padding */
  .m-company-card {
    padding: 12px;
  }

  /* Ensure all interactive elements meet 44px touch target */
  button,
  [role="button"],
  .m-menu-item,
  .m-dot,
  .m-section-header,
  .m-mail-item,
  .m-cal-item,
  .m-awaiting-item,
  .m-activity-item {
    min-height: 44px;
  }

  /* Bottom tab bar: horizontal scroll if too many items */
  #atlas-m-dots {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    justify-content: flex-start;
    gap: 0;
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }

  #atlas-m-dots::-webkit-scrollbar {
    display: none;
  }

  #atlas-m-dots {
    scrollbar-width: none;
  }

  .m-dot {
    flex: 1 0 auto;
    min-width: 56px;
  }

  /* Prevent any content overflow */
  .m-chat-msg {
    max-width: 90%;
    word-break: break-word;
    overflow-wrap: break-word;
  }

  /* Compact sphere on smallest screens */
  .m-sphere {
    width: 52px;
    height: 52px;
  }
  .m-sphere-inner {
    width: 40px;
    height: 40px;
  }
}

/* ── Tablet: 481px – 768px ── */
@media (min-width: 481px) and (max-width: 768px) {
  .m-company-details,
  .m-insights-grid {
    grid-template-columns: 1fr 1fr;
  }

  .m-panel {
    padding: 12px 20px;
    padding-left: max(20px, env(safe-area-inset-left));
    padding-right: max(20px, env(safe-area-inset-right));
  }

  .m-chat-msg {
    max-width: 75%;
  }
}

/* ── Desktop: > 768px — prevent any stray overflow ── */
@media (min-width: 769px) {
  .builder-wrap,
  .mission-wrap,
  .crm-wrap,
  .ideas-wrap,
  .jupiter-wrap {
    max-width: 100%;
    overflow-x: hidden;
  }
}


/* ═══ galaxie-portal.css ═══ */
/* Galaxie-Portal Overlay — SUB-002 + EG-Erweiterung */

.galaxie-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background: rgba(0, 0, 0, 0.95);
  transform: translateY(100%);
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

.galaxie-overlay.galaxie-open {
  transform: translateY(0);
}

/* ═══ EG-spezifisch: dunkelgruenes Theme ═══ */

.galaxie-overlay.galaxie-eg {
  background: #0a2e1a;
}

.galaxie-overlay.galaxie-eg .galaxie-header {
  border-bottom-color: rgba(34, 197, 94, 0.15);
}

.galaxie-overlay.galaxie-eg .galaxie-back {
  border-color: rgba(34, 197, 94, 0.25);
  color: #e0ffe0;
}

.galaxie-overlay.galaxie-eg .galaxie-back:hover {
  background: rgba(34, 197, 94, 0.12);
  border-color: rgba(34, 197, 94, 0.5);
}

.galaxie-overlay.galaxie-eg .galaxie-subtitle {
  color: rgba(34, 197, 94, 0.5);
}

.galaxie-overlay.galaxie-eg .galaxie-loading::before {
  border-top-color: var(--galaxie-eg);
}

/* ═══ Generic Header ═══ */

.galaxie-header {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 28px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  flex-shrink: 0;
}

.galaxie-back {
  background: none;
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  transition: background 200ms, border-color 200ms;
  flex-shrink: 0;
}

.galaxie-back:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.3);
}

.galaxie-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.5px;
}

.galaxie-subtitle {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.45);
  margin-top: 2px;
}

.galaxie-status-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  animation: galaxie-pulse 2s ease-in-out infinite;
}

@keyframes galaxie-pulse {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 1; }
}

/* ═══ Body / Grid ═══ */

.galaxie-body {
  flex: 1;
  padding: 24px 28px;
}

.galaxie-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}

/* ═══ Generic Panels ═══ */

.galaxie-panel {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  padding: 20px;
  transition: border-color 200ms, background 200ms;
}

.galaxie-panel:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
}

.galaxie-panel-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.galaxie-runner-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.galaxie-runner-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
}

.galaxie-runner-status {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.galaxie-runner-status.status-running { background: var(--galaxie-eg); box-shadow: 0 0 6px rgba(74, 222, 128, 0.5); }
.galaxie-runner-status.status-idle { background: #6b7280; }
.galaxie-runner-status.status-error { background: var(--status-err); box-shadow: 0 0 6px rgba(239, 68, 68, 0.5); }
.galaxie-runner-status.status-pending { background: var(--galaxie-ce); box-shadow: 0 0 6px rgba(250, 204, 21, 0.4); }

.galaxie-runner-name {
  flex: 1;
  color: rgba(255, 255, 255, 0.85);
}

.galaxie-runner-meta {
  color: rgba(255, 255, 255, 0.4);
  font-size: 11px;
}

.galaxie-empty {
  color: rgba(255, 255, 255, 0.3);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  text-align: center;
  padding: 40px 20px;
}

.galaxie-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: rgba(255, 255, 255, 0.4);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  padding: 40px;
}

.galaxie-loading::before {
  content: '';
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255, 255, 255, 0.15);
  border-top-color: rgba(var(--accent-rgb), 0.7);
  border-radius: 50%;
  animation: galaxie-spin 800ms linear infinite;
}

@keyframes galaxie-spin {
  to { transform: rotate(360deg); }
}

/* ═══ HAF-spezifisch: dunkelviolettes Theme ═══ */

.galaxie-overlay.galaxie-haf {
  background: #1a0a2e;
}

.galaxie-overlay.galaxie-haf .galaxie-header {
  border-bottom-color: rgba(139, 92, 246, 0.15);
}

.galaxie-overlay.galaxie-haf .galaxie-back {
  border-color: rgba(139, 92, 246, 0.25);
  color: #e8e0ff;
}

.galaxie-overlay.galaxie-haf .galaxie-back:hover {
  background: rgba(139, 92, 246, 0.12);
  border-color: rgba(139, 92, 246, 0.5);
}

.galaxie-overlay.galaxie-haf .galaxie-subtitle {
  color: rgba(139, 92, 246, 0.5);
}

.galaxie-overlay.galaxie-haf .galaxie-loading::before {
  border-top-color: var(--galaxie-haf);
}

/* ═══════════════════════════════════════════════
   HAPPY APP FACTORY — HAF-spezifische Panel-Styles
   ═══════════════════════════════════════════════ */

.haf-panel {
  background: rgba(139, 92, 246, 0.05);
  border: 1px solid rgba(139, 92, 246, 0.15);
}

.haf-panel:hover {
  background: rgba(139, 92, 246, 0.08);
  border-color: rgba(139, 92, 246, 0.25);
}

.haf-panel-wide {
  grid-column: 1 / -1;
}

.haf-accent {
  color: var(--galaxie-haf) !important;
}

.haf-empty {
  color: rgba(255, 255, 255, 0.35);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  text-align: center;
  padding: 30px 16px;
}

.haf-meta {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(139, 92, 246, 0.4);
  margin-top: 12px;
  text-align: right;
}

/* ─── Community Feedback ─── */

.haf-feedback-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.haf-feedback-item {
  padding: 10px 14px;
  background: rgba(139, 92, 246, 0.04);
  border: 1px solid rgba(139, 92, 246, 0.1);
  border-radius: 10px;
  transition: background 150ms;
}

.haf-feedback-item:hover {
  background: rgba(139, 92, 246, 0.1);
}

.haf-feedback-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}

.haf-feedback-user {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.85);
}

.haf-feedback-score {
  font-family: 'JetBrains Mono', monospace;
  font-size: 14px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 6px;
  min-width: 32px;
  text-align: center;
}

.haf-score-high {
  background: rgba(34, 197, 94, 0.15);
  color: var(--galaxie-eg);
}

.haf-score-mid {
  background: rgba(250, 204, 21, 0.15);
  color: var(--galaxie-ce);
}

.haf-score-low {
  background: rgba(239, 68, 68, 0.15);
  color: var(--status-err);
}

.haf-feedback-text {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  margin-bottom: 6px;
}

.haf-feedback-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.haf-feedback-status {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 2px 8px;
  border-radius: 4px;
}

.haf-fb-reviewed {
  background: rgba(34, 197, 94, 0.15);
  color: var(--galaxie-eg);
}

.haf-fb-open {
  background: rgba(139, 92, 246, 0.15);
  color: var(--galaxie-haf);
}

.haf-fb-escalated {
  background: rgba(239, 68, 68, 0.15);
  color: var(--status-err);
}

.haf-feedback-date {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.3);
}

/* ─── Academy-Status ─── */

.haf-academy-section {
  margin-bottom: 14px;
}

.haf-academy-section:last-of-type {
  margin-bottom: 0;
}

.haf-academy-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: rgba(139, 92, 246, 0.6);
  margin-bottom: 8px;
}

.haf-academy-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: rgba(139, 92, 246, 0.04);
  border-radius: 8px;
  border: 1px solid rgba(139, 92, 246, 0.08);
  margin-bottom: 4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
}

.haf-academy-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.haf-doc-done {
  background: var(--galaxie-eg);
  box-shadow: 0 0 4px rgba(34, 197, 94, 0.4);
}

.haf-doc-active {
  background: var(--galaxie-haf);
  box-shadow: 0 0 4px rgba(139, 92, 246, 0.4);
}

.haf-doc-new {
  background: var(--galaxie-ce);
  box-shadow: 0 0 4px rgba(250, 204, 21, 0.4);
}

.haf-academy-name {
  flex: 1;
  color: rgba(255, 255, 255, 0.8);
}

.haf-academy-type {
  color: rgba(255, 255, 255, 0.35);
  font-size: 11px;
}

.haf-academy-status {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: rgba(139, 92, 246, 0.6);
  flex-shrink: 0;
}

/* ─── App-Pipeline ─── */

.haf-pipeline-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.haf-pipeline-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  background: rgba(139, 92, 246, 0.04);
  border: 1px solid rgba(139, 92, 246, 0.1);
  border-radius: 10px;
  transition: background 150ms;
}

.haf-pipeline-item:hover {
  background: rgba(139, 92, 246, 0.1);
}

.haf-pipeline-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.haf-pipeline-name {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.85);
}

.haf-pipeline-version {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.35);
}

.haf-pipeline-badge {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  padding: 4px 12px;
  border-radius: 6px;
  flex-shrink: 0;
}

.haf-badge-live {
  background: rgba(34, 197, 94, 0.15);
  color: var(--galaxie-eg);
  box-shadow: 0 0 6px rgba(34, 197, 94, 0.2);
}

.haf-badge-beta {
  background: rgba(139, 92, 246, 0.15);
  color: var(--galaxie-haf);
  box-shadow: 0 0 6px rgba(139, 92, 246, 0.2);
}

.haf-badge-wip {
  background: rgba(250, 204, 21, 0.15);
  color: var(--galaxie-ce);
}

/* ─── User-Statistiken ─── */

.haf-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.haf-stat-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 14px 10px;
  background: rgba(139, 92, 246, 0.06);
  border-radius: 10px;
  border: 1px solid rgba(139, 92, 246, 0.1);
}

.haf-stat-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  line-height: 1.1;
}

.haf-stat-name {
  font-size: 14px !important;
}

.haf-stat-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.45);
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-top: 4px;
  text-align: center;
}

/* ─── HAF-Vulkan ─── */

.haf-vulkan-stats {
  display: flex;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.haf-vulkan-stat {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  gap: 4px;
}

.haf-vulkan-num {
  font-size: 16px;
  font-weight: 700;
  color: var(--galaxie-haf);
}

.haf-pulse {
  animation: haf-pulse-anim 1.5s ease-in-out infinite;
}

@keyframes haf-pulse-anim {
  0%, 100% { opacity: 0.6; }
  50% { opacity: 1; }
}

.haf-vulkan-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 400px;
  overflow-y: auto;
}

.haf-vulkan-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(139, 92, 246, 0.04);
  border: 1px solid rgba(139, 92, 246, 0.1);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  transition: background 150ms;
}

.haf-vulkan-item:hover {
  background: rgba(139, 92, 246, 0.1);
}

.haf-vulkan-id {
  color: rgba(139, 92, 246, 0.6);
  font-weight: 600;
  min-width: 36px;
  flex-shrink: 0;
}

.haf-vulkan-name {
  flex: 1;
  color: rgba(255, 255, 255, 0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.haf-vulkan-status {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 2px 8px;
  border-radius: 4px;
  flex-shrink: 0;
  font-weight: 600;
}

.haf-build-completed .haf-vulkan-status {
  background: rgba(34, 197, 94, 0.15);
  color: var(--galaxie-eg);
}

.haf-build-pending .haf-vulkan-status {
  background: rgba(250, 204, 21, 0.15);
  color: var(--galaxie-ce);
}

.haf-build-building .haf-vulkan-status,
.haf-build-autotesting .haf-vulkan-status {
  background: rgba(59, 130, 246, 0.15);
  color: #60a5fa;
  animation: haf-pulse-anim 1.5s ease-in-out infinite;
}

.haf-build-failed .haf-vulkan-status {
  background: rgba(239, 68, 68, 0.15);
  color: var(--status-err);
}

.haf-build-skipped .haf-vulkan-status {
  background: rgba(107, 114, 128, 0.15);
  color: #9ca3af;
}

.haf-build-pendingmanual .haf-vulkan-status {
  background: rgba(168, 85, 247, 0.15);
  color: #a855f7;
}

/* ─── HAF Responsive ─── */

@media (max-width: 640px) {
  .haf-panel-wide { grid-column: auto; }
  .haf-stats-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════
   ENERGY GUARD — EG-spezifische Panel-Styles
   ═══════════════════════════════════════════════ */

.eg-panel {
  background: rgba(34, 197, 94, 0.05);
  border: 1px solid rgba(34, 197, 94, 0.15);
}

.eg-panel:hover {
  background: rgba(34, 197, 94, 0.08);
  border-color: rgba(34, 197, 94, 0.25);
}

.eg-panel-wide {
  grid-column: 1 / -1;
}

.eg-accent {
  color: var(--galaxie-eg) !important;
}

.eg-empty {
  color: rgba(255, 255, 255, 0.35);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  text-align: center;
  padding: 30px 16px;
}

.eg-meta {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(34, 197, 94, 0.4);
  margin-top: 12px;
  text-align: right;
}

/* ─── PV-Monitoring ─── */

.eg-pv-summary {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.eg-pv-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  min-width: 60px;
  padding: 10px 6px;
  background: rgba(34, 197, 94, 0.06);
  border-radius: 10px;
  border: 1px solid rgba(34, 197, 94, 0.1);
}

.eg-pv-stat-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  line-height: 1.1;
}

.eg-pv-stat-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  color: rgba(255, 255, 255, 0.45);
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-top: 4px;
}

.eg-green { color: var(--galaxie-eg) !important; }
.eg-yellow { color: var(--galaxie-ce) !important; }
.eg-red { color: var(--status-err) !important; }

.eg-pv-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 12px 0;
  justify-content: center;
}

.eg-pv-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  cursor: default;
  transition: transform 150ms, box-shadow 150ms;
}

.eg-pv-dot:hover {
  transform: scale(1.4);
  z-index: 1;
}

.eg-dot-green {
  background: var(--galaxie-eg);
  box-shadow: 0 0 4px rgba(34, 197, 94, 0.4);
}

.eg-dot-green:hover {
  box-shadow: 0 0 10px rgba(34, 197, 94, 0.7);
}

.eg-dot-yellow {
  background: var(--galaxie-ce);
  box-shadow: 0 0 4px rgba(250, 204, 21, 0.4);
}

.eg-dot-yellow:hover {
  box-shadow: 0 0 10px rgba(250, 204, 21, 0.7);
}

.eg-dot-red {
  background: var(--status-err);
  box-shadow: 0 0 6px rgba(239, 68, 68, 0.5);
  animation: eg-red-pulse 1.5s ease-in-out infinite;
}

.eg-dot-red:hover {
  box-shadow: 0 0 12px rgba(239, 68, 68, 0.8);
}

@keyframes eg-red-pulse {
  0%, 100% { opacity: 0.7; }
  50% { opacity: 1; }
}

.eg-dot-gray {
  background: #4b5563;
}

.eg-pv-legend {
  display: flex;
  gap: 14px;
  justify-content: center;
  padding: 8px 0;
  flex-wrap: wrap;
}

.eg-legend-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.5);
}

.eg-legend-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

/* ─── Akquise-Pipeline Funnel ─── */

.eg-funnel {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.eg-funnel-stage {
  display: flex;
  align-items: center;
  gap: 12px;
}

.eg-funnel-bar {
  height: 32px;
  background: linear-gradient(90deg, rgba(34, 197, 94, 0.3), rgba(34, 197, 94, 0.15));
  border: 1px solid rgba(34, 197, 94, 0.25);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  transition: width 600ms ease;
}

.eg-funnel-count {
  font-family: 'JetBrains Mono', monospace;
  font-size: 14px;
  font-weight: 700;
  color: var(--galaxie-eg);
}

.eg-funnel-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.7);
  white-space: nowrap;
}

/* ─── Sales Placeholder ─── */

.eg-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px 16px;
  gap: 8px;
}

.eg-placeholder-icon {
  font-size: 28px;
  opacity: 0.5;
}

.eg-placeholder-text {
  font-family: 'JetBrains Mono', monospace;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 600;
}

.eg-placeholder-sub {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.3);
}

/* ─── EG-Vulkan ─── */

.eg-vulkan-stats {
  display: flex;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.eg-vulkan-stat {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  gap: 4px;
}

.eg-vulkan-num {
  font-size: 16px;
  font-weight: 700;
  color: var(--galaxie-eg);
}

.eg-pulse {
  animation: eg-red-pulse 1.5s ease-in-out infinite;
}

.eg-vulkan-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 400px;
  overflow-y: auto;
}

.eg-vulkan-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(34, 197, 94, 0.04);
  border: 1px solid rgba(34, 197, 94, 0.1);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  transition: background 150ms;
}

.eg-vulkan-item:hover {
  background: rgba(34, 197, 94, 0.1);
}

.eg-vulkan-id {
  color: rgba(34, 197, 94, 0.6);
  font-weight: 600;
  min-width: 36px;
  flex-shrink: 0;
}

.eg-vulkan-name {
  flex: 1;
  color: rgba(255, 255, 255, 0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eg-vulkan-status {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 2px 8px;
  border-radius: 4px;
  flex-shrink: 0;
  font-weight: 600;
}

.eg-build-completed .eg-vulkan-status {
  background: rgba(34, 197, 94, 0.15);
  color: var(--galaxie-eg);
}

.eg-build-pending .eg-vulkan-status {
  background: rgba(250, 204, 21, 0.15);
  color: var(--galaxie-ce);
}

.eg-build-building .eg-vulkan-status,
.eg-build-autotesting .eg-vulkan-status {
  background: rgba(59, 130, 246, 0.15);
  color: #60a5fa;
  animation: eg-red-pulse 1.5s ease-in-out infinite;
}

.eg-build-failed .eg-vulkan-status {
  background: rgba(239, 68, 68, 0.15);
  color: var(--status-err);
}

.eg-build-skipped .eg-vulkan-status {
  background: rgba(107, 114, 128, 0.15);
  color: #9ca3af;
}

.eg-build-pendingmanual .eg-vulkan-status {
  background: rgba(168, 85, 247, 0.15);
  color: #a855f7;
}

/* ═══════════════════════════════════════════════
   CROWD ENERGY — CE-spezifisches Theme (dunkelorange)
   ═══════════════════════════════════════════════ */

.galaxie-overlay.galaxie-ce {
  background: #2e1a0a;
}

.galaxie-overlay.galaxie-ce .galaxie-header {
  border-bottom-color: rgba(249, 115, 22, 0.15);
}

.galaxie-overlay.galaxie-ce .galaxie-back {
  border-color: rgba(249, 115, 22, 0.25);
  color: #ffe8d0;
}

.galaxie-overlay.galaxie-ce .galaxie-back:hover {
  background: rgba(249, 115, 22, 0.12);
  border-color: rgba(249, 115, 22, 0.5);
}

.galaxie-overlay.galaxie-ce .galaxie-subtitle {
  color: rgba(249, 115, 22, 0.5);
}

.galaxie-overlay.galaxie-ce .galaxie-loading::before {
  border-top-color: var(--galaxie-ce);
}

/* ─── CE Hero / Aufbauphase Heading ─── */

.ce-hero {
  grid-column: 1 / -1;
  text-align: center;
  padding: 40px 20px 20px;
}

.ce-hero-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 36px;
  font-weight: 700;
  color: var(--galaxie-ce);
  letter-spacing: 1px;
  line-height: 1.2;
}

.ce-hero-subtitle {
  font-family: 'JetBrains Mono', monospace;
  font-size: 16px;
  color: rgba(249, 115, 22, 0.6);
  margin-top: 8px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.ce-hero-line {
  width: 80px;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--galaxie-ce), transparent);
  margin: 16px auto 0;
}

/* ─── CE Panels ─── */

.ce-panel {
  background: rgba(249, 115, 22, 0.05);
  border: 1px solid rgba(249, 115, 22, 0.15);
}

.ce-panel:hover {
  background: rgba(249, 115, 22, 0.08);
  border-color: rgba(249, 115, 22, 0.25);
}

.ce-accent {
  color: var(--galaxie-ce) !important;
}

.ce-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px 16px;
  gap: 10px;
}

.ce-coming-soon {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  padding: 4px 14px;
  border-radius: 6px;
  background: rgba(249, 115, 22, 0.15);
  color: var(--galaxie-ce);
  box-shadow: 0 0 8px rgba(249, 115, 22, 0.15);
}

.ce-placeholder-desc {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.35);
  margin-top: 4px;
}

.ce-panel-wide { grid-column: 1 / -1; }

/* ─── CE Wartelisten-Formular (Build 408) ─── */
.ce-waitlist-wrap {
  padding: 16px;
}

.ce-waitlist-intro {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.5;
  margin-bottom: 16px;
}

.ce-waitlist-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ce-waitlist-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ce-waitlist-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  color: var(--status-warn);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.ce-waitlist-input {
  padding: 10px 12px;
  background: rgba(249, 159, 11, 0.06);
  border: 1px solid rgba(249, 159, 11, 0.2);
  border-radius: 8px;
  color: var(--text);
  font-size: 14px;
  font-family: -apple-system, BlinkMacSystemFont, sans-serif;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.ce-waitlist-input:focus {
  border-color: var(--status-warn);
  box-shadow: 0 0 8px rgba(249, 159, 11, 0.2);
}

.ce-waitlist-input::placeholder {
  color: rgba(255, 255, 255, 0.25);
}

.ce-waitlist-consent {
  margin-top: 4px;
}

.ce-waitlist-consent-label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
}

.ce-waitlist-consent-label input[type="checkbox"] {
  accent-color: var(--status-warn);
  width: 16px;
  height: 16px;
  margin-top: 2px;
  flex-shrink: 0;
}

.ce-waitlist-consent-label span {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.45);
  line-height: 1.4;
}

.ce-waitlist-btn {
  padding: 10px 20px;
  background: rgba(249, 159, 11, 0.15);
  border: 1px solid rgba(249, 159, 11, 0.4);
  border-radius: 8px;
  color: var(--status-warn);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all 0.2s;
  margin-top: 4px;
}

.ce-waitlist-btn:hover:not(:disabled) {
  background: rgba(249, 159, 11, 0.25);
  border-color: var(--status-warn);
  box-shadow: 0 0 12px rgba(249, 159, 11, 0.2);
}

.ce-waitlist-btn:disabled {
  opacity: 0.6;
  cursor: wait;
}

.ce-waitlist-msg {
  font-size: 12px;
  font-family: 'JetBrains Mono', monospace;
  min-height: 18px;
  transition: color 0.2s;
}

.ce-waitlist-success {
  color: var(--galaxie-eg);
}

.ce-waitlist-error {
  color: var(--status-err);
}

.ce-hero-badge {
  display: inline-block;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  padding: 4px 14px;
  border-radius: 6px;
  background: rgba(249, 115, 22, 0.15);
  color: var(--galaxie-ce);
  box-shadow: 0 0 8px rgba(249, 115, 22, 0.15);
  margin-bottom: 12px;
}

/* ═══════════════════════════════════════════════
   PRIVAT — Persoenliches Portal (dunkelgrau)
   ═══════════════════════════════════════════════ */

.galaxie-overlay.galaxie-privat {
  background: var(--bg-input);
}

.galaxie-overlay.galaxie-privat .galaxie-header {
  border-bottom-color: rgba(148, 163, 184, 0.15);
}

.galaxie-overlay.galaxie-privat .galaxie-back {
  border-color: rgba(148, 163, 184, 0.25);
  color: #e0e4ea;
}

.galaxie-overlay.galaxie-privat .galaxie-back:hover {
  background: rgba(148, 163, 184, 0.12);
  border-color: rgba(148, 163, 184, 0.5);
}

.galaxie-overlay.galaxie-privat .galaxie-subtitle {
  color: rgba(148, 163, 184, 0.5);
}

.galaxie-overlay.galaxie-privat .galaxie-loading::before {
  border-top-color: var(--text-dim);
}

/* ─── Privat Panels ─── */

.priv-panel {
  background: rgba(148, 163, 184, 0.05);
  border: 1px solid rgba(148, 163, 184, 0.12);
}

.priv-panel:hover {
  background: rgba(148, 163, 184, 0.08);
  border-color: rgba(148, 163, 184, 0.22);
}

.priv-accent {
  color: var(--text-dim) !important;
}

.priv-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px 16px;
  gap: 6px;
}

.priv-placeholder-icon {
  font-size: 28px;
  opacity: 0.5;
  color: var(--text-dim);
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700;
}

.priv-placeholder-text {
  font-family: 'JetBrains Mono', monospace;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 600;
}

.priv-placeholder-sub {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.25);
}

.priv-finance-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.priv-finance-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: rgba(148, 163, 184, 0.04);
  border: 1px solid rgba(148, 163, 184, 0.1);
  border-radius: 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
}

.priv-finance-item:hover {
  background: rgba(148, 163, 184, 0.1);
}

.priv-finance-name {
  color: rgba(255, 255, 255, 0.7);
}

.priv-finance-value {
  color: var(--text-dim);
  font-weight: 700;
  font-size: 14px;
}

/* ─── Wide Panel (for table layouts) ─── */

.priv-panel-wide {
  grid-column: 1 / -1;
}

/* ═══════════════════════════════════════════════
   LEGAL DASHBOARD — Vertraege, Fristen, Kalender
   ═══════════════════════════════════════════════ */

/* ─── Ampel-Zusammenfassung ─── */

.leg-summary {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.leg-summary-stat {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
}

.leg-summary-num {
  font-weight: 700;
  font-size: 18px;
  margin-right: 4px;
  color: var(--text-dim);
}

.leg-gruen { color: var(--galaxie-eg); }
.leg-gelb  { color: var(--galaxie-ce); }
.leg-rot   { color: var(--status-err); }

/* ─── Vertrags-Tabelle ─── */

.leg-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.leg-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
}

.leg-table thead th {
  text-align: left;
  padding: 8px 10px;
  color: rgba(255, 255, 255, 0.4);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.15);
  white-space: nowrap;
}

.leg-table tbody tr {
  border-bottom: 1px solid rgba(148, 163, 184, 0.06);
  transition: background 150ms;
}

.leg-table tbody tr:hover {
  background: rgba(148, 163, 184, 0.06);
}

.leg-table td {
  padding: 10px 10px;
  color: rgba(255, 255, 255, 0.7);
  white-space: nowrap;
}

.leg-partner {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.leg-firma {
  font-size: 10px;
  color: rgba(148, 163, 184, 0.5);
}

.leg-kosten {
  font-weight: 600;
  color: var(--text-dim);
}

.leg-status {
  font-weight: 600;
}

.leg-ampel-rot .leg-status { color: var(--status-err); }
.leg-ampel-gelb .leg-status { color: var(--galaxie-ce); }
.leg-ampel-gruen .leg-status { color: var(--galaxie-eg); }
.leg-ampel-abgelaufen .leg-status { color: var(--text-dim); }

.leg-ampel-rot {
  background: rgba(239, 83, 80, 0.05);
}

.leg-ampel-abgelaufen {
  background: rgba(100, 100, 100, 0.05);
  opacity: 0.6;
}

/* ─── Kalender Widget ─── */

.leg-kalender {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}

.leg-monat {
  background: rgba(148, 163, 184, 0.04);
  border: 1px solid rgba(148, 163, 184, 0.1);
  border-radius: 10px;
  padding: 12px 10px;
  text-align: center;
  font-family: 'JetBrains Mono', monospace;
  transition: border-color 200ms, background 200ms;
}

.leg-monat-aktiv {
  border-color: rgba(148, 163, 184, 0.3);
  background: rgba(148, 163, 184, 0.08);
}

.leg-monat-name {
  font-size: 13px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
}

.leg-monat-jahr {
  font-size: 10px;
  color: rgba(255, 255, 255, 0.3);
  margin-bottom: 6px;
}

.leg-monat-dots {
  display: flex;
  justify-content: center;
  gap: 4px;
  flex-wrap: wrap;
}

.leg-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  cursor: default;
}

.leg-dot-gruen { background: var(--galaxie-eg); }
.leg-dot-gelb  { background: var(--galaxie-ce); }
.leg-dot-rot   { background: var(--status-err); box-shadow: 0 0 6px rgba(239, 83, 80, 0.5); }
.leg-dot-ende  { background: #94a3b8; opacity: 0.5; }

/* ─── Kalender Detail-Liste ─── */

.leg-kalender-detail {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 4px;
}

.leg-detail-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: rgba(148, 163, 184, 0.04);
  border-radius: 8px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
}

.leg-detail-icon {
  font-size: 12px;
  flex-shrink: 0;
}

.leg-detail-text {
  color: rgba(255, 255, 255, 0.7);
  flex: 1;
}

.leg-detail-date {
  color: rgba(148, 163, 184, 0.6);
  font-size: 11px;
  flex-shrink: 0;
}

/* ─── Jahreskosten Hero ─── */

.leg-kosten-hero {
  text-align: center;
  padding: 24px 16px;
}

.leg-kosten-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.35);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 6px;
}

.leg-kosten-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 26px;
  font-weight: 700;
  color: var(--text-dim);
}

.leg-kosten-monat {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.3);
  margin-top: 4px;
}

/* ─── Letzte Analyse ─── */

.leg-analyse {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  margin-top: 16px;
  background: rgba(148, 163, 184, 0.04);
  border: 1px solid rgba(148, 163, 184, 0.1);
  border-radius: 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
}

.leg-analyse-label {
  color: rgba(255, 255, 255, 0.4);
}

.leg-analyse-date {
  color: var(--text-dim);
  font-weight: 600;
}

/* ═══════════════════════════════════════════════
   SATELLIT STATUS-OVERLAY — Pulsieren + Farben
   ═══════════════════════════════════════════════ */

.sat-status-ring {
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  border: 2px solid transparent;
  transform: translate(-50%, -50%);
  transition: border-color 400ms ease, box-shadow 400ms ease;
  z-index: 10;
}

.sat-status-ring.sat-ok {
  border-color: var(--galaxie-eg);
  box-shadow: 0 0 6px rgba(34, 197, 94, 0.3);
}

.sat-status-ring.sat-neuigkeiten {
  border-color: var(--galaxie-ce);
  box-shadow: 0 0 6px rgba(234, 179, 8, 0.3);
  animation: sat-pulse-gold 2s ease-in-out infinite;
}

.sat-status-ring.sat-aktion {
  border-color: var(--status-err);
  box-shadow: 0 0 6px rgba(239, 68, 68, 0.3);
  animation: sat-pulse-red 2s ease-in-out infinite;
}

@keyframes sat-pulse-gold {
  0%  { box-shadow: 0 0 0 0 rgba(234, 179, 8, 0.4); }
  70% { box-shadow: 0 0 0 10px rgba(234, 179, 8, 0); }
  100% { box-shadow: 0 0 0 0 rgba(234, 179, 8, 0); }
}

@keyframes sat-pulse-red {
  0%  { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); }
  70% { box-shadow: 0 0 0 10px rgba(239, 68, 68, 0); }
  100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
}

.sat-tooltip {
  position: absolute;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.85);
  color: #fff;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  padding: 6px 10px;
  border-radius: 6px;
  white-space: nowrap;
  transform: translate(-50%, -100%);
  margin-top: -8px;
  opacity: 0;
  transition: opacity 200ms ease;
  z-index: 20;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.sat-tooltip.sat-tooltip-visible {
  opacity: 1;
}

/* ═══ Responsive ═══ */

@media (max-width: 640px) {
  .galaxie-header { padding: 16px 18px; }
  .galaxie-title { font-size: 18px; }
  .galaxie-body { padding: 16px 18px; }
  .galaxie-grid { grid-template-columns: 1fr; gap: 14px; }
  .eg-panel-wide { grid-column: auto; }
  .eg-pv-summary { gap: 8px; }
  .eg-pv-dot { width: 14px; height: 14px; }
  .ce-hero-title { font-size: 24px; }
  .ce-hero { padding: 24px 16px 12px; }
  .sat-status-ring { display: none; }
  .sat-tooltip { display: none; }
}

/* ─── Immobilien Panel Styles ─── */

.immo-summary {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.immo-summary-item {
  flex: 1;
  min-width: 140px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.immo-sum-label {
  font-size: 11px;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.immo-sum-value {
  font-size: 18px;
  font-weight: 700;
  color: #e2e8f0;
  font-variant-numeric: tabular-nums;
}
.immo-rendite { color: #60a5fa; }
.immo-cf-pos { color: var(--galaxie-eg); }
.immo-cf-neg { color: var(--status-err); }

.immo-section {
  margin-bottom: 14px;
}
.immo-subtitle {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

/* Portfolio-Karten */
.immo-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
}
.immo-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 12px;
  transition: border-color 0.2s;
}
.immo-card:hover {
  border-color: rgba(96,165,250,0.3);
}
.immo-card-name {
  font-size: 14px;
  font-weight: 600;
  color: #e2e8f0;
  margin-bottom: 2px;
}
.immo-card-typ {
  font-size: 11px;
  color: #64748b;
  margin-bottom: 8px;
}
.immo-card-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 3px 0;
}
.immo-card-label {
  font-size: 12px;
  color: var(--text-dim);
}
.immo-card-val {
  font-size: 13px;
  font-weight: 600;
  color: #e2e8f0;
  font-variant-numeric: tabular-nums;
}

/* Markt-Inserate */
.immo-inserate {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.immo-inserat {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  padding: 8px 12px;
  transition: border-color 0.2s;
}
.immo-inserat:hover {
  border-color: rgba(96,165,250,0.25);
}
.immo-inserat-titel {
  font-size: 13px;
  font-weight: 500;
  color: #e2e8f0;
  margin-bottom: 4px;
}
.immo-inserat-link {
  color: #60a5fa;
  text-decoration: none;
}
.immo-inserat-link:hover {
  text-decoration: underline;
}
.immo-inserat-details {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}
.immo-inserat-preis {
  font-size: 13px;
  font-weight: 700;
  color: #fbbf24;
}
.immo-inserat-info {
  font-size: 12px;
  color: var(--text-dim);
}
.immo-inserat-rendite {
  font-size: 12px;
  font-weight: 600;
  color: var(--galaxie-eg);
}

/* Hypotheken-Timeline */
.immo-hypotheken {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.immo-hypo-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  padding: 8px 12px;
}
.immo-hypo-dringend {
  border-color: rgba(248,113,113,0.3);
  background: rgba(248,113,113,0.05);
}
.immo-hypo-bald {
  border-color: rgba(251,191,36,0.25);
  background: rgba(251,191,36,0.04);
}
.immo-hypo-abgelaufen {
  border-color: rgba(100,100,100,0.3);
  opacity: 0.6;
}
.immo-hypo-icon {
  font-size: 16px;
  flex-shrink: 0;
}
.immo-hypo-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.immo-hypo-name {
  font-size: 13px;
  font-weight: 600;
  color: #e2e8f0;
}
.immo-hypo-bank {
  font-size: 11px;
  color: var(--text-dim);
}
.immo-hypo-right {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.immo-hypo-date {
  font-size: 13px;
  font-weight: 500;
  color: #e2e8f0;
}
.immo-hypo-tage {
  font-size: 11px;
  color: var(--text-dim);
}

/* Footer */
.immo-footer {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.06);
  font-size: 11px;
  color: #64748b;
}

/* ═══ Food Dashboard Panel ═══ */
.food-section { margin-bottom: 14px; }
.food-section:last-of-type { margin-bottom: 4px; }
.food-section-title {
  font-size: 12px; font-weight: 600; text-transform: uppercase;
  color: var(--text-dim); letter-spacing: 0.5px; margin-bottom: 8px;
  display: flex; align-items: center; gap: 8px;
}
.food-count {
  font-size: 11px; font-weight: 400; color: #64748b;
  background: rgba(148,163,184,0.1); padding: 1px 7px; border-radius: 8px;
}
.food-plan-table {
  width: 100%; border-collapse: collapse; font-size: 11px;
  table-layout: fixed;
}
.food-plan-table th {
  color: #64748b; font-weight: 500; padding: 4px 2px;
  text-align: center; font-size: 10px; text-transform: uppercase;
}
.food-slot {
  color: var(--text-dim); font-weight: 500; font-size: 10px;
  text-align: right; padding-right: 6px; width: 45px;
}
.food-cell {
  color: #cbd5e1; padding: 5px 3px; text-align: center;
  border-bottom: 1px solid rgba(148,163,184,0.08);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.food-cell.food-today {
  background: rgba(148,163,184,0.1); color: #e2e8f0;
  font-weight: 600; border-radius: 4px;
}
.food-shopping-list { display: flex; flex-direction: column; gap: 4px; }
.food-shopping-item {
  display: flex; align-items: center; gap: 8px;
  padding: 4px 6px; border-radius: 4px;
  background: rgba(148,163,184,0.04);
}
.food-shopping-item:hover { background: rgba(148,163,184,0.08); }
.food-checkbox { color: #64748b; font-size: 14px; flex-shrink: 0; cursor: default; }
.food-item-name { color: #cbd5e1; font-size: 12px; flex: 1; }
.food-item-cat {
  color: #475569; font-size: 10px; text-transform: uppercase;
  letter-spacing: 0.3px;
}
.food-alerts { display: flex; flex-direction: column; gap: 4px; }
.food-alert {
  display: flex; justify-content: space-between; align-items: center;
  padding: 5px 8px; border-radius: 4px; font-size: 12px;
}
.food-alert-expired {
  background: rgba(239,68,68,0.12); border-left: 3px solid var(--status-err);
}
.food-alert-critical {
  background: rgba(249,115,22,0.10); border-left: 3px solid var(--galaxie-ce);
}
.food-alert-warn {
  background: rgba(250,204,21,0.08); border-left: 3px solid var(--galaxie-ce);
}
.food-alert-name { color: #e2e8f0; }
.food-alert-badge {
  font-size: 10px; font-weight: 600; padding: 1px 6px;
  border-radius: 6px;
}
.food-alert-expired .food-alert-badge { color: var(--status-err); background: rgba(239,68,68,0.15); }
.food-alert-critical .food-alert-badge { color: var(--galaxie-ce); background: rgba(249,115,22,0.12); }
.food-alert-warn .food-alert-badge { color: var(--galaxie-ce); background: rgba(250,204,21,0.10); }
.food-ok {
  color: var(--galaxie-eg); font-size: 12px; padding: 6px;
  background: rgba(74,222,128,0.06); border-radius: 4px; text-align: center;
}
.food-empty {
  color: #475569; font-size: 12px; padding: 6px; text-align: center;
  font-style: italic;
}
.food-more {
  color: #475569; font-size: 11px; text-align: center;
  padding: 4px; font-style: italic;
}
.food-lastrun {
  color: #334155; font-size: 10px; text-align: right;
  margin-top: 6px; font-style: italic;
}


/* ═══ galaxie-vulkan-engine.css ═══ */
/* Galaxie-Vulkan-Engine CSS — Einheitliche Styles fuer alle Galaxie-Vulkan-Panels.
   Zweck: Ersetzt die duplizierten eg-vulkan-*/haf-vulkan-* Klassen durch
          universelle gvp-* (Galaxie Vulkan Panel) Klassen.
   Kontext: Wird vom Panel-Bundle geladen.
   Erstellt: 2026-07-06, BA-08 Galaxie-Seiten-Engine */

/* ═══ Galaxie-Portal Header Fix: ← und ☰ getrennt ═══ */
.galaxie-header {
  z-index: 10;
  position: relative;
}

.galaxie-header .galaxie-back {
  z-index: 11;
  position: relative;
}

/* ═══ Vulkan-Panel Engine: Statistiken ═══ */
.gvp-stats {
  display: flex;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.gvp-stat {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  gap: 4px;
}

.gvp-num {
  font-size: 16px;
  font-weight: 700;
  color: var(--galaxie-accent, #d4af37);
}

/* Galaxie-spezifische Farben fuer Vulkan-Nummern */
.eg-panel-wide .gvp-num { color: var(--galaxie-eg, #22c55e); }
.haf-panel-wide .gvp-num { color: var(--galaxie-haf, #8b5cf6); }
.ce-panel-wide .gvp-num { color: var(--galaxie-ce, #f59e0b); }
.priv-panel-wide .gvp-num { color: var(--galaxie-privat, #ec4899); }

.gvp-pulse {
  animation: gvp-pulse-anim 1.5s ease-in-out infinite;
}

@keyframes gvp-pulse-anim {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* ═══ Vulkan-Panel Engine: Build-Liste ═══ */
.gvp-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 400px;
  overflow-y: auto;
}

.gvp-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  transition: background 150ms, border-color 150ms;
  text-decoration: none;
  cursor: pointer;
}

.gvp-item:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.12);
}

/* Galaxie-spezifische Item-Farben */
.eg-panel-wide .gvp-item {
  background: rgba(34, 197, 94, 0.04);
  border-color: rgba(34, 197, 94, 0.1);
}
.eg-panel-wide .gvp-item:hover { background: rgba(34, 197, 94, 0.1); }

.haf-panel-wide .gvp-item {
  background: rgba(139, 92, 246, 0.04);
  border-color: rgba(139, 92, 246, 0.1);
}
.haf-panel-wide .gvp-item:hover { background: rgba(139, 92, 246, 0.1); }

.ce-panel-wide .gvp-item {
  background: rgba(249, 115, 22, 0.04);
  border-color: rgba(249, 115, 22, 0.1);
}
.ce-panel-wide .gvp-item:hover { background: rgba(249, 115, 22, 0.1); }

.priv-panel-wide .gvp-item {
  background: rgba(236, 72, 153, 0.04);
  border-color: rgba(236, 72, 153, 0.1);
}
.priv-panel-wide .gvp-item:hover { background: rgba(236, 72, 153, 0.1); }

.gvp-id {
  color: rgba(255, 255, 255, 0.4);
  font-weight: 600;
  min-width: 36px;
  flex-shrink: 0;
}

.eg-panel-wide .gvp-id { color: rgba(34, 197, 94, 0.6); }
.haf-panel-wide .gvp-id { color: rgba(139, 92, 246, 0.6); }
.ce-panel-wide .gvp-id { color: rgba(249, 115, 22, 0.6); }
.priv-panel-wide .gvp-id { color: rgba(236, 72, 153, 0.6); }

.gvp-name {
  flex: 1;
  color: rgba(255, 255, 255, 0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gvp-status {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 2px 8px;
  border-radius: 4px;
  flex-shrink: 0;
  font-weight: 600;
}

/* ═══ Status-Badges (universell fuer alle Galaxien) ═══ */
.gvp-build-completed .gvp-status {
  background: rgba(34, 197, 94, 0.15);
  color: #4ade80;
}

.gvp-build-pending .gvp-status {
  background: rgba(250, 204, 21, 0.15);
  color: #facc15;
}

.gvp-build-building .gvp-status,
.gvp-build-autotesting .gvp-status {
  background: rgba(59, 130, 246, 0.15);
  color: #60a5fa;
  animation: gvp-pulse-anim 1.5s ease-in-out infinite;
}

.gvp-build-failed .gvp-status {
  background: rgba(239, 68, 68, 0.15);
  color: var(--status-err, #ef4444);
}

.gvp-build-skipped .gvp-status {
  background: rgba(107, 114, 128, 0.15);
  color: #9ca3af;
}

.gvp-build-pendingmanual .gvp-status {
  background: rgba(168, 85, 247, 0.15);
  color: #a855f7;
}

/* ═══ Mobile-Titel: kein Abschneiden ═══ */
@media (max-width: 640px) {
  .galaxie-title {
    font-size: 16px;
    word-break: break-word;
    line-height: 1.3;
  }

  .gvp-name {
    max-width: 140px;
  }

  .gvp-stats {
    gap: 8px;
  }

  .gvp-num {
    font-size: 14px;
  }
}


/* ═══ galaxie-navigation.css ═══ */
/* Galaxie-Navigation — Build 382 */

/* Zoom-Animation (CSS-basiert, GPU-beschleunigt) */
.atlas-universum-wrap.gn-zooming {
  transition: transform 0.9s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.gn-zoom-fade {
  position: absolute;
  inset: 0;
  z-index: 10;
  pointer-events: none;
  transition: background 0.9s cubic-bezier(0.4, 0, 0.2, 1);
}

.gn-zoom-fade.gn-fade-out {
  transition: background 0.5s ease-out;
}

/* Runner-Header Chips */
.galaxie-runner-header {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 0 16px;
  margin-bottom: 4px;
  grid-column: 1 / -1;
}

.gal-runner-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border: 1px solid;
  border-radius: 20px;
  font-family: 'Consolas', monospace;
  font-size: 11px;
  letter-spacing: 0.08em;
  background: rgba(255,255,255,0.03);
  transition: background 0.2s, box-shadow 0.2s;
}

.gal-runner-chip:hover {
  background: rgba(255,255,255,0.08);
  box-shadow: 0 0 12px rgba(255,255,255,0.05);
}

.gal-runner-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 0 6px currentColor;
}

.gal-runner-chip.gal-runner-forming {
  border-style: dashed;
  opacity: 0.85;
}

.gal-runner-badge-cs {
  font-size: 8px;
  letter-spacing: 0.12em;
  padding: 1px 6px;
  border-radius: 8px;
  background: rgba(245, 158, 11, 0.18);
  color: var(--status-warn);
  margin-left: 2px;
}

/* CE IN FORMATION Badge */
.ce-hero-badge {
  display: inline-block;
  font-family: 'Consolas', monospace;
  font-size: 13px;
  letter-spacing: 0.22em;
  padding: 6px 18px;
  border: 1px dashed rgba(245,158,11,0.6);
  border-radius: 24px;
  color: var(--status-warn);
  background: rgba(245,158,11,0.08);
  margin-bottom: 12px;
  animation: ce-badge-pulse 2.5s ease-in-out infinite;
}

@keyframes ce-badge-pulse {
  0%, 100% { box-shadow: 0 0 8px rgba(245,158,11,0.15); opacity: 0.9; }
  50% { box-shadow: 0 0 20px rgba(245,158,11,0.35); opacity: 1; }
}


/* ═══ hr-panel.css ═══ */
/* HR Personal Panel — Privat-Galaxie Portal */

/* ─── Mitarbeiter-Karten ─── */

.hr-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.hr-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: rgba(148, 163, 184, 0.06);
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  transition: border-color 200ms;
}

.hr-card:hover {
  border-color: rgba(148, 163, 184, 0.25);
}

.hr-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(148, 163, 184, 0.15);
  color: var(--text-dim);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
  flex-shrink: 0;
}

.hr-card-info {
  flex: 1;
  min-width: 0;
}

.hr-card-name {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 600;
  font-size: 13px;
}

.hr-card-meta {
  color: rgba(255, 255, 255, 0.4);
  font-size: 11px;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hr-card-badge {
  font-size: 10px;
  padding: 3px 8px;
  border-radius: 6px;
  font-weight: 600;
  flex-shrink: 0;
  font-family: 'JetBrains Mono', monospace;
}

.hr-badge-ok {
  background: rgba(76, 175, 80, 0.15);
  color: var(--status-ok);
}

.hr-badge-warn {
  background: rgba(255, 152, 0, 0.15);
  color: var(--status-warn);
}

.hr-card-event {
  font-size: 11px;
  color: rgba(var(--accent-rgb), 0.8);
  margin-top: 3px;
}

/* ─── Events Timeline ─── */

.hr-timeline {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.hr-timeline-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(148, 163, 184, 0.04);
  border-radius: 8px;
  border-left: 3px solid rgba(148, 163, 184, 0.2);
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
}

.hr-timeline-item.hr-tl-today {
  border-left-color: var(--status-ok);
  background: rgba(76, 175, 80, 0.08);
}

.hr-timeline-item.hr-tl-soon {
  border-left-color: var(--accent);
  background: rgba(var(--accent-rgb), 0.06);
}

.hr-tl-icon {
  font-size: 18px;
  flex-shrink: 0;
}

.hr-tl-info {
  flex: 1;
  min-width: 0;
}

.hr-tl-name {
  color: rgba(255, 255, 255, 0.85);
  font-weight: 600;
}

.hr-tl-detail {
  color: rgba(255, 255, 255, 0.45);
  font-size: 11px;
  margin-top: 2px;
}

.hr-tl-days {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.5);
  flex-shrink: 0;
  text-align: right;
  min-width: 50px;
}

.hr-tl-days.hr-tl-today-text {
  color: var(--status-ok);
  font-weight: 600;
}

/* ─── Ferien-Balken ─── */

.hr-ferien-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.hr-ferien-row {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
}

.hr-ferien-header {
  display: flex;
  justify-content: space-between;
  color: rgba(255, 255, 255, 0.7);
  margin-bottom: 5px;
}

.hr-ferien-name {
  font-weight: 600;
  color: rgba(255, 255, 255, 0.85);
}

.hr-ferien-nums {
  color: rgba(255, 255, 255, 0.45);
  font-size: 11px;
}

.hr-ferien-bar-bg {
  height: 8px;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}

.hr-ferien-bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 400ms ease;
}

.hr-ferien-bar-used {
  background: #64b5f6;
}

.hr-ferien-bar-high {
  background: var(--status-warn);
}

.hr-ferien-bar-full {
  background: var(--status-err);
}

/* ─── Compliance Checkliste ─── */

.hr-compliance-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.hr-compliance-person {
  padding: 10px 12px;
  background: rgba(148, 163, 184, 0.04);
  border-radius: 8px;
  font-family: 'JetBrains Mono', monospace;
}

.hr-compliance-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}

.hr-compliance-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.hr-compliance-dot.hr-c-ok {
  background: var(--status-ok);
  box-shadow: 0 0 6px rgba(76, 175, 80, 0.4);
}

.hr-compliance-dot.hr-c-warn {
  background: var(--status-err);
  box-shadow: 0 0 6px rgba(239, 83, 80, 0.4);
}

.hr-compliance-name {
  color: rgba(255, 255, 255, 0.85);
  font-size: 13px;
  font-weight: 600;
}

.hr-compliance-firma {
  color: rgba(255, 255, 255, 0.35);
  font-size: 11px;
  margin-left: auto;
}

.hr-compliance-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-left: 16px;
}

.hr-check-item {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  gap: 4px;
}

.hr-check-ok { color: rgba(76, 175, 80, 0.7); }
.hr-check-fail { color: rgba(239, 83, 80, 0.8); font-weight: 600; }

/* ─── Allgemein ─── */

.hr-empty {
  color: rgba(255, 255, 255, 0.3);
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  text-align: center;
  padding: 24px 12px;
}

.hr-summary-bar {
  display: flex;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.hr-summary-stat {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  color: rgba(255, 255, 255, 0.45);
  display: flex;
  align-items: center;
  gap: 4px;
}

.hr-summary-num {
  font-size: 16px;
  font-weight: 700;
  color: var(--text-dim);
}


/* ═══ runner-control.css ═══ */
/* Runner Control Center Panel */

#atlas-tab-content-runners {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg);
  z-index: 8000;
  overflow-y: auto;
  padding: 80px 24px 40px;
}

#atlas-tab-content-runners.visible {
  display: block;
}

.rc-wrap {
  max-width: 960px;
  margin: 0 auto;
}

.rc-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
}

.rc-header-icon {
  font-size: 28px;
}

.rc-header-title {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--accent);
  margin: 0;
}

.rc-header-sub {
  font-size: 11px;
  color: var(--text-dim);
  letter-spacing: 1px;
  margin-left: auto;
}

/* Galaxy group */
.rc-galaxy {
  margin-bottom: 28px;
}

.rc-galaxy-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}

/* Runner grid: 4 columns */
.rc-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px 12px;
}

/* Single runner node */
.rc-node {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  position: relative;
  cursor: pointer;
}

.rc-dot {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  transition: transform 0.2s, box-shadow 0.2s;
  flex-shrink: 0;
}

.rc-node:hover .rc-dot {
  transform: scale(1.15);
}

/* Status colors */
.rc-dot-green {
  background: var(--galaxie-eg);
  box-shadow: 0 0 10px rgba(34,197,94,0.35);
}

.rc-dot-gold {
  background: var(--galaxie-ce);
  box-shadow: 0 0 10px rgba(234,179,8,0.35);
}

.rc-dot-red {
  background: var(--status-err);
  box-shadow: 0 0 10px rgba(239,68,68,0.35);
  animation: rc-pulse 2s ease-in-out infinite;
}

.rc-dot-gray {
  background: #6b7280;
  box-shadow: 0 0 6px rgba(107,114,128,0.2);
}

@keyframes rc-pulse {
  0%, 100% { box-shadow: 0 0 10px rgba(239,68,68,0.35); }
  50% { box-shadow: 0 0 20px rgba(239,68,68,0.55); }
}

.rc-name {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--text-muted);
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
}

/* CSS Tooltip */
.rc-tooltip {
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--bg-input);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 8px;
  padding: 10px 14px;
  min-width: 180px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s;
  z-index: 100;
  box-shadow: 0 4px 16px rgba(0,0,0,0.5);
}

.rc-node:hover .rc-tooltip {
  opacity: 1;
}

.rc-tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: #1a1a1a;
}

.rc-tt-name {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 1px;
  margin-bottom: 6px;
}

.rc-tt-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 11px;
  color: var(--text-muted);
  line-height: 1.6;
}

.rc-tt-label {
  color: var(--text-dim);
}

.rc-tt-val {
  color: var(--text);
  font-weight: 500;
  text-align: right;
}

.rc-tt-status {
  font-weight: 700;
}

.rc-tt-status-green { color: var(--galaxie-eg); }
.rc-tt-status-gold { color: var(--galaxie-ce); }
.rc-tt-status-red { color: var(--status-err); }
.rc-tt-status-gray { color: var(--text-dim); }

/* Toolbar */
.rc-toolbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.04);
}

.rc-btn {
  padding: 8px 20px;
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  background: rgba(var(--accent-rgb),0.08);
  border: 1px solid rgba(var(--accent-rgb),0.2);
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
}

.rc-btn:hover {
  background: rgba(var(--accent-rgb),0.15);
}

.rc-auto-refresh {
  font-size: 10px;
  color: var(--text-dim);
  letter-spacing: 1px;
}

/* Loading / Error states */
.rc-loading {
  text-align: center;
  padding: 40px 0;
  color: var(--text-dim);
  font-size: 13px;
}

.rc-error {
  background: rgba(255,82,82,0.06);
  border: 1px solid rgba(255,82,82,0.15);
  border-radius: 8px;
  padding: 14px;
  color: #ff8a80;
  font-size: 13px;
  text-align: center;
}

/* Responsive */
@media (max-width: 600px) {
  #atlas-tab-content-runners {
    padding: 70px 12px 24px;
  }

  .rc-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px 8px;
  }

  .rc-dot {
    width: 34px;
    height: 34px;
  }

  .rc-tooltip {
    min-width: 150px;
  }
}

@media (max-width: 400px) {
  .rc-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* ═══ runner-detail.css ═══ */
/* Runner Detail Slide-in Panel (DSH-001 → Build 292) */

.rd-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.45);
  z-index: 9000;
  opacity: 0;
  pointer-events: none;
  transition: opacity 300ms ease;
}

.rd-overlay.rd-open {
  opacity: 1;
  pointer-events: auto;
}

.rd-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: 400px;
  height: 100%;
  background: var(--bg-card);
  z-index: 9001;
  transform: translateX(400px);
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
  box-shadow: -4px 0 24px rgba(0,0,0,0.5);
  overflow: hidden;
}

.rd-panel.rd-open {
  transform: translateX(0);
}

/* Header */
.rd-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 18px 16px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  flex-shrink: 0;
}

.rd-header-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: 1px;
  text-transform: uppercase;
}

.rd-header-badge {
  font-size: 9px;
  font-weight: 600;
  color: var(--accent);
  background: rgba(var(--accent-rgb),0.12);
  border: 1px solid rgba(var(--accent-rgb),0.2);
  border-radius: 4px;
  padding: 2px 7px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.rd-close {
  margin-left: auto;
  width: 30px;
  height: 30px;
  border: none;
  background: rgba(255,255,255,0.05);
  border-radius: 6px;
  color: var(--text-muted);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, color 0.15s;
}

.rd-close:hover {
  background: rgba(255,82,82,0.12);
  color: #ff8a80;
}

/* Scrollable body */
.rd-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
}

/* Status section */
.rd-status {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 0 18px;
}

.rd-status-dot {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  flex-shrink: 0;
}

.rd-status-dot-green {
  background: var(--galaxie-eg);
  box-shadow: 0 0 14px rgba(34,197,94,0.4);
}

.rd-status-dot-gold {
  background: var(--galaxie-ce);
  box-shadow: 0 0 14px rgba(234,179,8,0.4);
}

.rd-status-dot-red {
  background: var(--status-err);
  box-shadow: 0 0 14px rgba(239,68,68,0.4);
  animation: rd-pulse 2s ease-in-out infinite;
}

.rd-status-dot-gray {
  background: #6b7280;
  box-shadow: 0 0 8px rgba(107,114,128,0.25);
}

@keyframes rd-pulse {
  0%, 100% { box-shadow: 0 0 14px rgba(239,68,68,0.4); }
  50% { box-shadow: 0 0 26px rgba(239,68,68,0.6); }
}

.rd-status-text {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
}

.rd-status-sub {
  font-size: 11px;
  color: var(--text-dim);
  margin-top: 2px;
}

/* Section titles */
.rd-section-title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-dim);
  text-transform: uppercase;
  margin: 18px 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}

/* Timeline (Last 5 Runs) */
.rd-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rd-timeline-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  position: relative;
}

.rd-timeline-item + .rd-timeline-item {
  border-top: 1px solid rgba(255,255,255,0.03);
}

.rd-tl-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 3px;
}

.rd-tl-dot-ok { background: var(--galaxie-eg); }
.rd-tl-dot-error { background: var(--status-err); }
.rd-tl-dot-running { background: var(--galaxie-ce); }

.rd-tl-info {
  flex: 1;
  min-width: 0;
}

.rd-tl-time {
  font-size: 11px;
  color: var(--text-muted);
  font-weight: 500;
}

.rd-tl-meta {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 2px;
}

.rd-tl-error {
  font-size: 10px;
  color: #ff8a80;
  margin-top: 2px;
  word-break: break-word;
}

/* Live Log */
.rd-log {
  background: var(--bg);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  padding: 10px;
  font-family: 'SF Mono', 'Fira Code', 'Cascadia Code', monospace;
  font-size: 10px;
  line-height: 1.6;
  color: #8b8;
  max-height: 240px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-all;
}

.rd-log::-webkit-scrollbar { width: 4px; }
.rd-log::-webkit-scrollbar-track { background: transparent; }
.rd-log::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 2px; }

/* Stats */
.rd-stats {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
}

.rd-stat {
  background: rgba(255,255,255,0.03);
  border-radius: 6px;
  padding: 10px 8px;
  text-align: center;
}

.rd-stat-val {
  font-size: 18px;
  font-weight: 700;
  color: var(--text);
}

.rd-stat-label {
  font-size: 9px;
  color: var(--text-dim);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-top: 3px;
}

/* Buttons */
.rd-actions {
  display: flex;
  gap: 8px;
  padding: 14px 16px;
  border-top: 1px solid rgba(255,255,255,0.06);
  flex-shrink: 0;
}

.rd-btn {
  flex: 1;
  padding: 9px 0;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  text-align: center;
}

.rd-btn-start {
  color: var(--galaxie-eg);
  background: rgba(34,197,94,0.08);
  border-color: rgba(34,197,94,0.2);
}
.rd-btn-start:hover { background: rgba(34,197,94,0.16); }

.rd-btn-stop {
  color: var(--status-err);
  background: rgba(239,68,68,0.08);
  border-color: rgba(239,68,68,0.2);
}
.rd-btn-stop:hover { background: rgba(239,68,68,0.16); }

.rd-btn-toggle {
  color: var(--accent);
  background: rgba(var(--accent-rgb),0.08);
  border-color: rgba(var(--accent-rgb),0.2);
}
.rd-btn-toggle:hover { background: rgba(var(--accent-rgb),0.16); }

.rd-btn-toggle.rd-disabled {
  color: var(--text-muted);
  background: rgba(128,128,128,0.08);
  border-color: rgba(128,128,128,0.2);
}

/* Loading / Error */
.rd-loading {
  text-align: center;
  padding: 30px 0;
  color: var(--text-dim);
  font-size: 12px;
}

.rd-error {
  color: #ff8a80;
  font-size: 11px;
  text-align: center;
  padding: 12px;
}

.rd-empty {
  color: var(--text-dim);
  font-size: 11px;
  font-style: italic;
}

/* Responsive */
@media (max-width: 480px) {
  .rd-panel {
    width: 100%;
    transform: translateX(100%);
  }
}


/* ═══ runner-health-badge.css ═══ */
#atlas-runner-health {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  border-radius: 8px;
  padding: 4px 12px;
  font-weight: bold;
  font-size: 12px;
  line-height: 1.3;
  cursor: pointer;
  margin-left: auto;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.3s;
}

@media (max-width: 600px) {
  #atlas-runner-health {
    font-size: 10px;
    padding: 3px 8px;
  }
  #atlas-runner-health #rhb-main {
    font-size: 10px !important;
  }
  #atlas-runner-health #rhb-sub {
    font-size: 9px !important;
  }
}


/* ═══ runner-alerts.css ═══ */
/* Runner Alerts Panel */

.ra-panel {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 12px;
  padding: 20px;
  margin-top: 20px;
}

.ra-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.ra-header-icon {
  font-size: 22px;
}

.ra-header-title {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--accent);
  text-transform: uppercase;
  margin: 0;
}

.ra-header-sub {
  font-size: 10px;
  color: var(--text-dim);
  margin-left: auto;
}

/* Filter Tabs */
.ra-tabs {
  display: flex;
  gap: 0;
  border-bottom: 1px solid var(--border-light);
  margin-bottom: 14px;
}

.ra-tab {
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 8px 16px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: color 0.2s, border-color 0.2s;
}

.ra-tab:hover {
  color: var(--text);
}

.ra-tab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
}

.ra-tab .ra-tab-count {
  font-size: 10px;
  color: var(--text-dim);
  margin-left: 4px;
}

.ra-tab.active .ra-tab-count {
  color: #a08520;
}

/* Alert List */
.ra-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ra-entry {
  display: grid;
  grid-template-columns: 48px 10px 100px 1fr;
  gap: 10px;
  align-items: center;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 12px;
  transition: background 0.15s;
}

.ra-entry:hover {
  filter: brightness(1.15);
}

/* Level colors */
.ra-entry.ra-level-error {
  background: rgba(239, 68, 68, 0.12);
  border-left: 3px solid var(--status-err);
}

.ra-entry.ra-level-critical {
  background: rgba(239, 68, 68, 0.18);
  border-left: 3px solid #dc2626;
}

.ra-entry.ra-level-warning {
  background: rgba(234, 179, 8, 0.10);
  border-left: 3px solid var(--galaxie-ce);
}

.ra-entry.ra-level-info {
  background: rgba(148, 163, 184, 0.06);
  border-left: 3px solid #475569;
}

/* Timestamp */
.ra-time {
  color: var(--text-muted);
  font-family: 'SF Mono', 'Fira Code', monospace;
  font-size: 11px;
  white-space: nowrap;
}

/* Runner dot */
.ra-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Runner name */
.ra-runner {
  color: var(--text);
  font-weight: 600;
  font-size: 11px;
  text-transform: capitalize;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Message */
.ra-msg {
  color: var(--text-muted);
  font-size: 11px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ra-level-error .ra-msg,
.ra-level-critical .ra-msg {
  color: #fca5a5;
}

.ra-level-warning .ra-msg {
  color: #fde68a;
}

/* Truncation notice */
.ra-truncated {
  text-align: center;
  color: var(--text-dim);
  font-size: 11px;
  padding: 10px;
  border-top: 1px solid var(--border-light);
  margin-top: 6px;
}

/* Empty state */
.ra-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 40px 20px;
  color: var(--text-dim);
  font-size: 13px;
}

.ra-empty-icon {
  font-size: 32px;
  color: var(--galaxie-eg);
}

/* Loading */
.ra-loading {
  text-align: center;
  color: var(--text-dim);
  font-size: 12px;
  padding: 30px;
}

/* Error */
.ra-error {
  text-align: center;
  color: var(--status-err);
  font-size: 12px;
  padding: 20px;
}

/* Mobile */
@media (max-width: 640px) {
  .ra-entry {
    grid-template-columns: 42px 8px 70px 1fr;
    gap: 6px;
    padding: 6px 8px;
    font-size: 11px;
  }

  .ra-tab {
    padding: 6px 10px;
    font-size: 11px;
  }
}


/* ═══ quality-panel.css ═══ */
#atlas-tab-content-quality {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg);
  z-index: 8000;
  overflow-y: auto;
  padding: 80px 24px 40px;
}

#atlas-tab-content-quality.visible {
  display: block;
}

.qp-wrap {
  max-width: 960px;
  margin: 0 auto;
}

.qp-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
}

.qp-header-title {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--accent);
  margin: 0;
}

.qp-header-date {
  font-size: 11px;
  color: var(--text-dim);
  letter-spacing: 1px;
  margin-left: auto;
}

.qp-summary {
  display: flex;
  gap: 24px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}

.qp-stat {
  flex: 1;
  min-width: 140px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 20px;
  text-align: center;
}

.qp-stat-num {
  font-size: 42px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 6px;
}

.qp-stat-num.green { color: var(--status-ok); }
.qp-stat-num.red { color: var(--status-err); }
.qp-stat-num.neutral { color: var(--accent); }

.qp-stat-label {
  font-size: 11px;
  letter-spacing: 2px;
  color: var(--text-muted);
  text-transform: uppercase;
}

.qp-section-title {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

.qp-error-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 32px;
}

.qp-error-card {
  background: rgba(255,82,82,0.06);
  border: 1px solid rgba(255,82,82,0.15);
  border-radius: 12px;
  padding: 16px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.qp-error-thumb {
  width: 200px;
  min-width: 200px;
  border-radius: 8px;
  cursor: pointer;
  transition: opacity 0.2s;
  border: 1px solid rgba(255,255,255,0.1);
}

.qp-error-thumb:hover {
  opacity: 0.8;
}

.qp-error-info {
  flex: 1;
  min-width: 0;
}

.qp-error-build {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 4px;
}

.qp-error-desc {
  font-size: 13px;
  color: var(--text);
  line-height: 1.5;
  margin-bottom: 8px;
}

.qp-fix-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 3px 10px;
  border-radius: 6px;
  text-transform: uppercase;
}

.qp-fix-badge.erstellt {
  background: rgba(var(--accent-rgb),0.15);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb),0.3);
}

.qp-fix-badge.in-arbeit {
  background: rgba(33,150,243,0.15);
  color: #2196f3;
  border: 1px solid rgba(33,150,243,0.3);
}

.qp-fix-badge.behoben {
  background: rgba(76,175,80,0.15);
  color: var(--status-ok);
  border: 1px solid rgba(76,175,80,0.3);
}

.qp-toolbar {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 24px;
}

.qp-btn {
  background: rgba(var(--accent-rgb),0.12);
  color: var(--accent);
  border: 1px solid rgba(var(--accent-rgb),0.25);
  border-radius: 8px;
  padding: 8px 18px;
  font-size: 13px;
  cursor: pointer;
  letter-spacing: 1px;
  transition: background 0.2s;
}

.qp-btn:hover {
  background: rgba(var(--accent-rgb),0.22);
}

.qp-loading {
  color: var(--text-dim);
  font-size: 13px;
  padding: 20px;
  text-align: center;
}

.qp-empty {
  color: var(--text-dim);
  font-size: 14px;
  text-align: center;
  padding: 40px 0;
}

.qp-ok-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 32px;
}

.qp-ok-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: rgba(76,175,80,0.04);
  border: 1px solid rgba(76,175,80,0.1);
  border-radius: 8px;
  font-size: 13px;
  color: var(--text);
}

.qp-ok-icon {
  color: var(--status-ok);
  font-size: 16px;
  flex-shrink: 0;
}

.qp-ok-name {
  font-weight: 600;
  color: #fff;
}

/* Lightbox */
.qp-lightbox {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.92);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.qp-lightbox-inner {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
}

.qp-lightbox-img {
  max-width: 90vw;
  max-height: 85vh;
  border-radius: 8px;
  box-shadow: 0 4px 40px rgba(0,0,0,0.6);
}

.qp-lightbox-caption {
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
  margin-top: 10px;
}

.qp-lightbox-close {
  position: absolute;
  top: -30px;
  right: 0;
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px 8px;
}

.qp-lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  font-size: 36px;
  cursor: pointer;
  background: rgba(0,0,0,0.4);
  border: none;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}

.qp-lightbox-nav:hover {
  background: rgba(255,255,255,0.1);
}

.qp-lightbox-prev { left: -60px; }
.qp-lightbox-next { right: -60px; }

@media (max-width: 700px) {
  .qp-error-card {
    flex-direction: column;
  }
  .qp-error-thumb {
    width: 100%;
    min-width: 0;
  }
  .qp-summary {
    gap: 12px;
  }
  .qp-stat {
    min-width: 100px;
    padding: 14px;
  }
  .qp-stat-num {
    font-size: 32px;
  }
  .qp-lightbox-prev { left: 8px; }
  .qp-lightbox-next { right: 8px; }
}


/* ═══ sales-panel.css ═══ */
/* Sales Pipeline Panel */
.sp-wrap {
  max-width: 960px;
  margin: 0 auto;
  padding: 24px 16px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.sp-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.sp-header h2 {
  margin: 0;
  font-size: 1.3rem;
  color: var(--text);
  letter-spacing: 0.04em;
}

.sp-icon {
  font-size: 1.6rem;
}

.sp-btn-refresh {
  margin-left: auto;
  background: transparent;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  font-size: 1.1rem;
  border-radius: 6px;
  padding: 4px 10px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.sp-btn-refresh:hover {
  background: var(--bg-input);
  color: var(--accent);
}

.sp-last-run {
  font-size: 0.7rem;
  color: var(--text-dim);
}

/* Prognose + Mini-Stats row */
.sp-top-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}

@media (max-width: 640px) {
  .sp-top-row {
    grid-template-columns: 1fr;
  }
}

.sp-section {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 16px;
}

.sp-section-title {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  margin-bottom: 12px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
}

/* Prognose */
.sp-prognose {
  text-align: center;
  padding: 20px 16px;
}

.sp-prognose-label {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  margin-bottom: 8px;
}

.sp-prognose-value {
  font-size: 2.4rem;
  font-weight: 800;
  color: var(--accent);
  line-height: 1.1;
}

.sp-prognose-sub {
  font-size: 0.75rem;
  color: var(--text-dim);
  margin-top: 6px;
}

/* Mini-Stats */
.sp-mini-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.sp-stat-card {
  background: var(--bg-input);
  border-radius: 8px;
  padding: 14px 12px;
  text-align: center;
}

.sp-stat-label {
  font-size: 0.7rem;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-bottom: 6px;
}

.sp-stat-value {
  font-size: 1.6rem;
  font-weight: 700;
}

.sp-stat-sub {
  font-size: 0.7rem;
  color: var(--text-dim);
  margin-top: 4px;
}

.sp-stat-won .sp-stat-value {
  color: var(--status-ok);
}

.sp-stat-lost .sp-stat-value {
  color: var(--status-err);
}

.sp-stat-active .sp-stat-value {
  color: #6ec6ff;
}

.sp-stat-pipeline .sp-stat-value {
  color: var(--accent);
}

/* Funnel */
.sp-funnel {
  margin-bottom: 16px;
}

.sp-funnel-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.sp-funnel-label {
  width: 100px;
  flex-shrink: 0;
  font-size: 0.8rem;
  color: #bbb;
  text-align: right;
}

.sp-funnel-track {
  flex: 1;
  height: 32px;
  background: var(--bg-input);
  border-radius: 6px;
  overflow: hidden;
  position: relative;
}

.sp-funnel-fill {
  height: 100%;
  border-radius: 6px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  font-size: 0.75rem;
  font-weight: 700;
  color: #fff;
  transition: width 0.6s ease;
  min-width: 0;
}

.sp-funnel-count {
  margin-left: auto;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text);
  flex-shrink: 0;
  width: 30px;
  text-align: right;
}

.sp-funnel-value {
  font-size: 0.7rem;
  color: var(--text-muted);
  flex-shrink: 0;
  width: 90px;
  text-align: right;
}

/* Top 5 Deals Table */
.sp-table-wrap {
  overflow-x: auto;
}

.sp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.sp-table thead tr {
  background: #12122a;
  color: var(--text-muted);
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}

.sp-table th {
  padding: 10px 14px;
  text-align: left;
  font-weight: 600;
}

.sp-table th:nth-child(3),
.sp-table th:nth-child(5) {
  text-align: right;
}

.sp-table td {
  padding: 10px 14px;
  border-bottom: 1px solid #2a2a3e;
}

.sp-table tbody tr:nth-child(even) {
  background: #1e1e36;
}

.sp-table tbody tr:nth-child(odd) {
  background: var(--bg-input);
}

.sp-deal-kunde {
  color: var(--text);
  font-weight: 600;
}

.sp-deal-projekt {
  color: var(--text-muted);
  font-size: 0.75rem;
  margin-top: 2px;
}

.sp-deal-wert {
  text-align: right;
  font-weight: 700;
  color: var(--accent);
  white-space: nowrap;
}

.sp-deal-stufe {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  color: #fff;
}

.sp-deal-tage {
  text-align: right;
  white-space: nowrap;
}

.sp-deal-tage-warn {
  color: var(--status-err);
  font-weight: 600;
}

.sp-deal-tage-ok {
  color: var(--text-muted);
}

.sp-empty {
  color: var(--text-dim);
  font-size: 0.85rem;
  padding: 20px 0;
  text-align: center;
}

.sp-loading {
  color: var(--text-dim);
  font-size: 0.85rem;
  text-align: center;
  padding: 30px 0;
}


/* ═══ scheduler-panel.css ═══ */
/* Scheduler Dashboard Panel */
#atlas-tab-content-scheduler {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg-deep);
  z-index: 1000;
  overflow-y: auto;
  padding: 80px 24px 24px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--text);
}
#atlas-tab-content-scheduler.visible { display: block; }

.sched-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}
.sched-header h2 {
  margin: 0;
  font-size: 22px;
  color: var(--accent);
  font-weight: 600;
}
.sched-header .sched-updated {
  font-size: 12px;
  color: var(--text-dim);
}

.sched-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  max-width: 1400px;
  margin: 0 auto;
}

.sched-card {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 12px;
  padding: 20px;
}
.sched-card h3 {
  margin: 0 0 16px;
  font-size: 15px;
  color: var(--accent);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Auslastung */
.sched-slots {
  display: flex;
  align-items: center;
  gap: 16px;
}
.sched-slots-text {
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
}
.sched-slots-circles {
  display: flex;
  gap: 10px;
}
.sched-slot-circle {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid var(--border-light);
  background: transparent;
  transition: all 0.3s ease;
}
.sched-slot-circle.filled {
  background: var(--accent);
  border-color: var(--accent);
  box-shadow: 0 0 8px rgba(var(--accent-rgb), 0.4);
}

/* Tabellen */
.sched-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.sched-table th {
  text-align: left;
  padding: 8px 10px;
  color: var(--text-muted);
  font-weight: 500;
  border-bottom: 1px solid var(--border-light);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.sched-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #1f1f1f;
  color: var(--text);
}
.sched-table tr:last-child td { border-bottom: none; }
.sched-table tr:hover td { background: rgba(var(--accent-rgb), 0.04); }

.sched-name { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sched-prio-1 { color: var(--status-err); font-weight: 600; }
.sched-prio-2 { color: var(--accent); }
.sched-prio-3 { color: var(--status-ok); }

.sched-status-ok {
  color: var(--status-ok);
  font-weight: 500;
}
.sched-status-error {
  color: var(--status-err);
  font-weight: 500;
}
.sched-status-skipped {
  color: var(--text-muted);
}

/* Tages-Statistik */
.sched-stats {
  display: flex;
  gap: 32px;
  font-size: 16px;
}
.sched-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sched-stat-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--accent);
}
.sched-stat-label {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 2px;
}
.sched-stat-value.error { color: var(--status-err); }
.sched-stat-value.skipped { color: var(--text-muted); }

/* Timeline (Gantt) */
.sched-timeline-card {
  grid-column: 1 / -1;
}
.sched-timeline-wrap {
  position: relative;
  overflow-x: auto;
}
.sched-timeline-axis {
  display: grid;
  grid-template-columns: 120px repeat(24, 1fr);
  gap: 0;
  border-bottom: 1px solid var(--border-light);
  padding-bottom: 4px;
  margin-bottom: 8px;
}
.sched-timeline-axis-label {
  font-size: 10px;
  color: var(--text-dim);
  text-align: center;
}
.sched-timeline-axis-name {
  font-size: 10px;
  color: var(--text-muted);
  padding-left: 4px;
}

.sched-timeline-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  align-items: center;
  min-height: 28px;
  margin-bottom: 2px;
}
.sched-timeline-name {
  font-size: 11px;
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 8px;
}
.sched-timeline-bar-area {
  position: relative;
  height: 20px;
  background: var(--bg-card);
  border-radius: 3px;
}
.sched-timeline-bar {
  position: absolute;
  top: 2px;
  height: 16px;
  border-radius: 3px;
  min-width: 3px;
  opacity: 0.85;
  transition: opacity 0.2s;
}
.sched-timeline-bar:hover {
  opacity: 1;
}
.sched-timeline-bar.ok { background: var(--status-ok); }
.sched-timeline-bar.error { background: #ff5252; }
.sched-timeline-bar.building { background: var(--accent); animation: sched-pulse 1.5s infinite; }

@keyframes sched-pulse {
  0%, 100% { opacity: 0.7; }
  50% { opacity: 1; }
}

.sched-empty {
  color: var(--text-dim);
  font-style: italic;
  padding: 12px 0;
  font-size: 13px;
}

/* Responsive */
@media (max-width: 900px) {
  .sched-grid { grid-template-columns: 1fr; }
  .sched-timeline-card { grid-column: 1; }
}


/* ═══ rechnungen-panel.css ═══ */
/* Rechnungen-Dashboard Panel */

.rech-wrap {
  padding: 16px 20px 32px;
  max-width: 1200px;
  margin: 0 auto;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: var(--text);
}

.rech-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.rech-header h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  letter-spacing: 1px;
}

.rech-icon { font-size: 24px; }

.rech-subtitle {
  font-size: 13px;
  color: var(--text-muted);
  margin-left: 4px;
}

.rech-btn-refresh {
  margin-left: auto;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  color: var(--text-muted);
  border-radius: 6px;
  padding: 6px 12px;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s;
}
.rech-btn-refresh:hover {
  background: rgba(255,255,255,0.12);
  color: #fff;
}

/* ── Overview Cards ── */
.rech-overview {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 24px;
}

.rech-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 16px;
  text-align: center;
  transition: border-color 0.3s, background 0.3s;
}

.rech-card:hover {
  border-color: rgba(var(--accent-rgb),0.3);
  background: rgba(255,255,255,0.06);
}

.rech-card-label {
  font-size: 12px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}

.rech-card-value {
  font-size: 28px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
}

.rech-card-sub {
  font-size: 13px;
  color: var(--accent);
  margin-top: 4px;
  font-weight: 600;
}

.rech-card.overdue .rech-card-value { color: var(--status-err); }
.rech-card.overdue .rech-card-sub { color: var(--status-err); }
.rech-card.overdue { border-color: rgba(239,83,80,0.3); }

.rech-card.paid .rech-card-value { color: var(--status-ok); }
.rech-card.paid .rech-card-sub { color: var(--status-ok); }

/* ── Toolbar ── */
.rech-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.rech-sort-btn {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  color: var(--text-muted);
  border-radius: 6px;
  padding: 6px 12px;
  font-size: 12px;
  cursor: pointer;
  transition: all 0.2s;
}
.rech-sort-btn:hover,
.rech-sort-btn.active {
  background: rgba(var(--accent-rgb),0.15);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb),0.3);
}

.rech-btn-new {
  margin-left: auto;
  background: linear-gradient(135deg, var(--accent), #b8962e);
  border: none;
  color: #1a1a2e;
  border-radius: 8px;
  padding: 8px 18px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  letter-spacing: 0.5px;
}
.rech-btn-new:hover {
  background: linear-gradient(135deg, #e0c050, var(--accent));
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(var(--accent-rgb),0.3);
}

/* ── Invoice Table ── */
.rech-table-wrap {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 24px;
  overflow-x: auto;
}

.rech-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.rech-table th {
  text-align: left;
  color: var(--text-dim);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  cursor: pointer;
  user-select: none;
  transition: color 0.2s;
}

.rech-table th:hover { color: var(--accent); }
.rech-table th.sorted { color: var(--accent); }

.rech-table td {
  padding: 10px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  color: var(--text);
  white-space: nowrap;
}

.rech-table tr:last-child td { border-bottom: none; }
.rech-table tr:hover td { background: rgba(255,255,255,0.03); }

.rech-table .rech-amount {
  font-weight: 600;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* Status Badges */
.rech-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.rech-badge.bezahlt {
  background: rgba(76,175,80,0.15);
  color: var(--status-ok);
}
.rech-badge.gesendet {
  background: rgba(255,193,7,0.15);
  color: #ffc107;
}
.rech-badge.ueberfaellig {
  background: rgba(239,83,80,0.15);
  color: var(--status-err);
}
.rech-badge.entwurf {
  background: rgba(158,158,158,0.15);
  color: #9e9e9e;
}

/* ── Revenue Bars ── */
.rech-revenue {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 24px;
}

.rech-revenue-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 16px;
}

.rech-bar-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}

.rech-bar-label {
  width: 150px;
  font-size: 12px;
  color: var(--text-muted);
  flex-shrink: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rech-bar-track {
  flex: 1;
  height: 24px;
  background: rgba(255,255,255,0.04);
  border-radius: 6px;
  overflow: hidden;
}

.rech-bar-fill {
  height: 100%;
  border-radius: 6px;
  transition: width 0.6s ease;
  display: flex;
  align-items: center;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 600;
  color: #1a1a2e;
  min-width: fit-content;
}

.rech-bar-fill.c0 { background: linear-gradient(90deg, var(--accent), #e0c050); }
.rech-bar-fill.c1 { background: linear-gradient(90deg, #4caf50, #66bb6a); }
.rech-bar-fill.c2 { background: linear-gradient(90deg, #42a5f5, #64b5f6); }
.rech-bar-fill.c3 { background: linear-gradient(90deg, #ab47bc, #ba68c8); }

.rech-bar-amount {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  width: 110px;
  text-align: right;
  flex-shrink: 0;
}

/* ── Modal ── */
.rech-modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.7);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: rech-fade-in 0.2s ease;
}

@keyframes rech-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

.rech-modal {
  background: #1e1e32;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 16px;
  width: 90%;
  max-width: 700px;
  max-height: 85vh;
  overflow-y: auto;
  padding: 24px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}

.rech-modal h3 {
  margin: 0 0 20px;
  font-size: 18px;
  color: #fff;
  font-weight: 700;
}

.rech-form-group {
  margin-bottom: 16px;
}

.rech-form-group label {
  display: block;
  font-size: 12px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 6px;
}

.rech-form-group select,
.rech-form-group input {
  width: 100%;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 8px;
  padding: 10px 12px;
  color: var(--text);
  font-size: 14px;
  outline: none;
  transition: border-color 0.2s;
  box-sizing: border-box;
}

.rech-form-group select:focus,
.rech-form-group input:focus {
  border-color: rgba(var(--accent-rgb),0.5);
}

.rech-form-group select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23888' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 32px;
}

.rech-form-group select option {
  background: #1e1e32;
  color: var(--text);
}

/* Position Rows */
.rech-positions-header {
  display: grid;
  grid-template-columns: 2fr 80px 80px 100px 40px;
  gap: 8px;
  margin-bottom: 6px;
  font-size: 11px;
  color: var(--text-dim);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 0 2px;
}

.rech-pos-row {
  display: grid;
  grid-template-columns: 2fr 80px 80px 100px 40px;
  gap: 8px;
  margin-bottom: 8px;
}

.rech-pos-row input {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 6px;
  padding: 8px 10px;
  color: var(--text);
  font-size: 13px;
  outline: none;
  box-sizing: border-box;
}

.rech-pos-row input:focus {
  border-color: rgba(var(--accent-rgb),0.5);
}

.rech-pos-remove {
  background: rgba(239,83,80,0.1);
  border: 1px solid rgba(239,83,80,0.2);
  color: var(--status-err);
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}
.rech-pos-remove:hover {
  background: rgba(239,83,80,0.25);
}

.rech-pos-add {
  background: rgba(255,255,255,0.06);
  border: 1px dashed rgba(255,255,255,0.15);
  border-radius: 6px;
  color: var(--text-muted);
  padding: 8px;
  font-size: 12px;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s;
  margin-bottom: 16px;
}
.rech-pos-add:hover {
  background: rgba(255,255,255,0.1);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb),0.3);
}

/* Modal Buttons */
.rech-modal-actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 20px;
}

.rech-modal-cancel {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  color: var(--text-muted);
  border-radius: 8px;
  padding: 10px 20px;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s;
}
.rech-modal-cancel:hover {
  background: rgba(255,255,255,0.12);
  color: #fff;
}

.rech-modal-submit {
  background: linear-gradient(135deg, var(--accent), #b8962e);
  border: none;
  color: #1a1a2e;
  border-radius: 8px;
  padding: 10px 24px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
}
.rech-modal-submit:hover {
  background: linear-gradient(135deg, #e0c050, var(--accent));
}
.rech-modal-submit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* ── States ── */
.rech-loading {
  text-align: center;
  padding: 40px;
  color: var(--text-muted);
  font-size: 14px;
}

.rech-empty {
  text-align: center;
  padding: 30px;
  color: var(--text-dim);
  font-size: 13px;
}

.rech-error {
  text-align: center;
  padding: 30px;
  color: var(--status-err);
  font-size: 13px;
}

/* ── Mobile ── */
@media (max-width: 900px) {
  .rech-overview { grid-template-columns: 1fr; }
  .rech-bar-label { width: 100px; }
}

@media (max-width: 640px) {
  .rech-wrap { padding: 12px 12px 24px; }
  .rech-toolbar { flex-wrap: wrap; }
  .rech-positions-header,
  .rech-pos-row {
    grid-template-columns: 1fr;
  }
}


/* ═══ runner-timeline.css ═══ */
.rt-panel {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 12px;
  padding: 20px;
  margin-top: 20px;
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}
.rt-panel h3 {
  margin: 0 0 16px;
  font-size: 15px;
  color: var(--accent);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.rt-wrap {
  position: relative;
  overflow-x: auto;
}
.rt-axis {
  display: grid;
  grid-template-columns: 80px repeat(24, 1fr);
  border-bottom: 1px solid var(--border-light);
  padding-bottom: 4px;
  margin-bottom: 6px;
}
.rt-axis-name {
  font-size: 10px;
  color: var(--text-muted);
  padding-left: 4px;
}
.rt-axis-hour {
  font-size: 10px;
  color: var(--text-dim);
  text-align: center;
}
.rt-axis-hour.rt-now {
  color: var(--accent);
  font-weight: 700;
}
.rt-row {
  display: grid;
  grid-template-columns: 80px 1fr;
  align-items: center;
  height: 24px;
  margin-bottom: 2px;
}
.rt-name {
  font-size: 11px;
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 6px;
}
.rt-bar-area {
  position: relative;
  height: 20px;
  background: var(--bg-card);
  border-radius: 3px;
}
.rt-bar {
  position: absolute;
  top: 2px;
  height: 16px;
  border-radius: 3px;
  min-width: 3px;
  opacity: 0.85;
  cursor: pointer;
  transition: opacity 0.15s;
}
.rt-bar:hover {
  opacity: 1;
}
.rt-bar.ok { background: var(--galaxie-eg); }
.rt-bar.error { background: var(--status-err); }
.rt-bar.running {
  background: var(--accent);
  animation: rt-pulse 1.5s infinite;
}
@keyframes rt-pulse {
  0%, 100% { opacity: 0.7; }
  50% { opacity: 1; }
}
.rt-tooltip {
  position: fixed;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 12px;
  color: var(--text);
  pointer-events: none;
  z-index: 9999;
  white-space: nowrap;
  display: none;
  line-height: 1.6;
}
.rt-tooltip.visible { display: block; }
.rt-empty {
  color: var(--text-dim);
  font-style: italic;
  padding: 12px 0;
  font-size: 13px;
}
@media (max-width: 900px) {
  .rt-axis { grid-template-columns: 60px repeat(24, 1fr); }
  .rt-row { grid-template-columns: 60px 1fr; }
  .rt-name { font-size: 10px; }
}


/* ═══ quick-actions.css ═══ */
/* Build 028: Quick-Actions Panel */

#quick-actions-fab {
  position: fixed;
  bottom: 90px;
  right: 20px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), #b8962e);
  color: #000;
  border: none;
  font-size: 22px;
  cursor: pointer;
  z-index: 9000;
  box-shadow: 0 4px 16px rgba(var(--accent-rgb),0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s, box-shadow 0.25s;
}
#quick-actions-fab:hover {
  transform: scale(1.08);
  box-shadow: 0 6px 24px rgba(var(--accent-rgb),0.5);
}
#quick-actions-fab:active {
  transform: scale(0.95);
}
#quick-actions-fab.open {
  transform: rotate(45deg);
}

/* FAB weicht dem Bearbeitungs-Stift (.ave-btn) aus wenn Claude-Tab offen */
@media (min-width: 769px) {
  body:has(#atlas-tab-content-claude.visible) #quick-actions-fab {
    bottom: 175px;
  }
  body:has(#atlas-tab-content-claude.visible) #quick-actions-panel {
    bottom: 240px;
  }
}

#quick-actions-panel {
  position: fixed;
  bottom: 155px;
  right: 20px;
  width: 280px;
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 14px;
  z-index: 8999;
  padding: 16px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.6);
  opacity: 0;
  transform: translateY(12px) scale(0.95);
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
#quick-actions-panel.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.qa-panel-header {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--accent);
  margin-bottom: 12px;
  text-transform: uppercase;
}

.quick-actions-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.qa-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 10px;
  padding: 14px 8px;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, transform 0.15s;
  -webkit-tap-highlight-color: transparent;
}
.qa-btn:hover {
  background: rgba(var(--accent-rgb),0.08);
  border-color: var(--accent);
}
.qa-btn:active {
  transform: scale(0.95);
  background: rgba(var(--accent-rgb),0.15);
}

.qa-btn-icon {
  font-size: 22px;
  line-height: 1;
}
.qa-btn-label {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: var(--text);
  text-align: center;
  line-height: 1.2;
}

.qa-btn-wide {
  grid-column: 1 / -1;
  flex-direction: row;
  justify-content: center;
  padding: 12px 8px;
}
.qa-btn-wide .qa-btn-icon {
  font-size: 18px;
}
.qa-btn-wide .qa-btn-label {
  font-size: 12px;
}

#quick-actions-toast {
  position: fixed;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%) translateY(10px);
  background: var(--accent);
  color: #000;
  padding: 10px 20px;
  border-radius: 8px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 13px;
  font-weight: 600;
  opacity: 0;
  z-index: 9001;
  pointer-events: none;
  transition: opacity 0.25s, transform 0.25s;
}
#quick-actions-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}


/* ═══ video-card.css ═══ */
/* Video-Analyse Karte — Cockpit-Stil
 * Zweck: Styling fuer Video-Analyse UI (Karte, Fortschritt, Ergebnis, URL-Chip).
 * Kontext: Wird im Panel-Bundle geladen.
 * Nutzt: Design-Tokens aus dem Atlas-Theme.
 * Erstellt: 2026-07-06, Auftrag BA-09 */

/* ─── Video-Karte ─────────────────────────────────────────────────────── */
.video-card {
  margin: 12px 0;
  border: 1px solid rgba(212, 175, 55, 0.25);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(10, 10, 15, 0.95), rgba(18, 18, 31, 0.95));
  overflow: hidden;
  font-family: var(--font-sans, 'Inter', system-ui, sans-serif);
  max-width: 600px;
}

.video-card--done {
  border-color: rgba(212, 175, 55, 0.45);
}

.video-card--error {
  border-color: rgba(239, 68, 68, 0.5);
}

/* ─── Header ──────────────────────────────────────────────────────────── */
.video-card-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background: rgba(212, 175, 55, 0.08);
  border-bottom: 1px solid rgba(212, 175, 55, 0.15);
}

.video-card-icon {
  font-size: 18px;
  flex-shrink: 0;
}

.video-card-title {
  font-weight: 600;
  font-size: 13px;
  color: #d4af37;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  white-space: nowrap;
}

.video-card-url {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.4);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-left: auto;
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
}

/* ─── Body ────────────────────────────────────────────────────────────── */
.video-card-body {
  padding: 14px;
}

/* ─── Fortschritt ─────────────────────────────────────────────────────── */
.video-card-progress {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.video-card-progress-bar {
  height: 6px;
  background: rgba(255, 255, 255, 0.08);
  border-radius: 3px;
  overflow: hidden;
}

.video-card-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #d4af37, #f0d060);
  border-radius: 3px;
  transition: width 0.5s ease;
}

.video-card--loading .video-card-progress-fill {
  animation: video-shimmer 1.5s ease-in-out infinite;
}

@keyframes video-shimmer {
  0%, 100% { opacity: 0.7; }
  50% { opacity: 1; }
}

.video-card-status {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
}

/* ─── Fehler ──────────────────────────────────────────────────────────── */
.video-card-error {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 0;
}

.video-card-error-icon {
  color: #ef4444;
  font-size: 16px;
  flex-shrink: 0;
}

.video-card-error-text {
  color: #fca5a5;
  font-size: 13px;
  line-height: 1.4;
}

/* ─── Ergebnis-Meta ───────────────────────────────────────────────────── */
.video-card-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 16px;
  margin-bottom: 12px;
}

.video-card-meta-row {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.video-card-meta-label {
  font-size: 10px;
  color: rgba(255, 255, 255, 0.4);
  text-transform: uppercase;
  letter-spacing: 0.8px;
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
}

.video-card-meta-value {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.3;
}

/* ─── Aufklappbare Sektionen ──────────────────────────────────────────── */
.video-card-details {
  margin-top: 10px;
  border: 1px solid rgba(212, 175, 55, 0.12);
  border-radius: 8px;
  overflow: hidden;
}

.video-card-details summary {
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 600;
  color: #d4af37;
  cursor: pointer;
  background: rgba(212, 175, 55, 0.05);
  user-select: none;
  list-style: none;
}

.video-card-details summary::-webkit-details-marker {
  display: none;
}

.video-card-details summary::before {
  content: '▸ ';
  display: inline;
}

.video-card-details[open] summary::before {
  content: '▾ ';
}

.video-card-analysis,
.video-card-transcript {
  padding: 10px 12px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.6;
  max-height: 400px;
  overflow-y: auto;
}

.video-card-transcript {
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: 11px;
  white-space: pre-wrap;
  color: rgba(255, 255, 255, 0.55);
}

/* ─── URL-Chip (Inline-Erkennung) ─────────────────────────────────────── */
.video-url-chip {
  position: absolute;
  top: -36px;
  left: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.15), rgba(212, 175, 55, 0.08));
  border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.2s ease;
  z-index: 10;
  animation: chip-slide-in 0.25s ease-out;
}

.video-url-chip:hover {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.25), rgba(212, 175, 55, 0.15));
  border-color: rgba(212, 175, 55, 0.55);
  transform: translateY(-1px);
}

@keyframes chip-slide-in {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.video-url-chip-icon {
  font-size: 14px;
}

.video-url-chip-text {
  font-size: 12px;
  font-weight: 500;
  color: #d4af37;
  white-space: nowrap;
}

/* ─── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 600px) {
  .video-card {
    max-width: 100%;
    margin: 8px 0;
  }
  .video-card-meta {
    grid-template-columns: 1fr;
  }
  .video-url-chip {
    top: -32px;
  }
}


/* ═══ boardroom.css ═══ */
/* Build 046: Boardroom Multi-Perspektiven UI */

.boardroom-container {
  margin: 12px 0;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(20, 20, 25, 0.95);
  border: 1px solid rgba(var(--accent-rgb), 0.3);
  max-width: 100%;
}

.boardroom-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.15), rgba(var(--accent-rgb), 0.05));
  border-bottom: 1px solid rgba(var(--accent-rgb), 0.2);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--accent);
  letter-spacing: 1px;
}

.boardroom-header-icon {
  font-size: 1.1rem;
}

.boardroom-question {
  padding: 10px 16px;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.6);
  font-style: italic;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

/* Tab bar */
.boardroom-tabs {
  display: flex;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(0, 0, 0, 0.3);
}

.boardroom-tabs::-webkit-scrollbar {
  display: none;
}

.boardroom-tab {
  flex: 0 0 auto;
  padding: 10px 14px;
  font-size: 0.75rem;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  border: none;
  background: none;
  white-space: nowrap;
  transition: all 0.2s ease;
  border-bottom: 2px solid transparent;
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: inherit;
}

.boardroom-tab:hover {
  color: rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.04);
}

.boardroom-tab.active {
  color: var(--accent);
  border-bottom-color: var(--accent);
  background: rgba(var(--accent-rgb), 0.08);
}

.boardroom-tab-icon {
  font-size: 0.9rem;
}

/* Content panels */
.boardroom-panels {
  position: relative;
  min-height: 80px;
}

.boardroom-panel {
  display: none;
  padding: 14px 16px;
  font-size: 0.85rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.88);
  animation: boardroom-fade-in 0.25s ease;
}

.boardroom-panel.active {
  display: block;
}

.boardroom-panel.error {
  color: rgba(255, 100, 100, 0.8);
}

@keyframes boardroom-fade-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Synthesis section */
.boardroom-synthesis {
  padding: 12px 16px;
  background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.08), rgba(var(--accent-rgb), 0.02));
  border-top: 1px solid rgba(var(--accent-rgb), 0.2);
  font-size: 0.85rem;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.92);
}

.boardroom-synthesis-label {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--accent);
  letter-spacing: 0.5px;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Loading state */
.boardroom-loading {
  padding: 20px 16px;
  text-align: center;
  color: rgba(var(--accent-rgb), 0.7);
  font-size: 0.82rem;
}

.boardroom-loading-dots {
  display: inline-flex;
  gap: 4px;
  margin-left: 6px;
}

.boardroom-loading-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--accent);
  animation: boardroom-dot-pulse 1.2s ease-in-out infinite;
}

.boardroom-loading-dot:nth-child(2) { animation-delay: 0.2s; }
.boardroom-loading-dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes boardroom-dot-pulse {
  0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); }
  40% { opacity: 1; transform: scale(1); }
}

/* Progress indicators */
.boardroom-tab .check {
  display: none;
  color: #4ecdc4;
  font-size: 0.7rem;
}

.boardroom-tab.done .check {
  display: inline;
}

/* Mobile */
@media (max-width: 480px) {
  .boardroom-tab {
    padding: 8px 10px;
    font-size: 0.7rem;
  }
  .boardroom-panel {
    padding: 12px 14px;
    font-size: 0.82rem;
  }
  .boardroom-header {
    font-size: 0.8rem;
    padding: 10px 14px;
  }
}


/* ═══ watchdog-panel.css ═══ */
/* Watchdog Health Panel — CSS-only gauges, no external libraries */

/* Services list */
.wd-services {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px;
  margin-bottom: 24px;
}

.wd-svc-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  transition: border-color 0.2s;
}

.wd-svc-row:hover {
  border-color: rgba(var(--accent-rgb),0.2);
}

.wd-svc-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  letter-spacing: 0.5px;
}

.wd-svc-port {
  font-size: 11px;
  color: var(--text-dim);
  margin-left: auto;
}

/* Gauges row */
.wd-gauges {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.wd-gauge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 16px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  min-width: 140px;
  transition: border-color 0.3s, box-shadow 0.3s;
}

.wd-gauge:hover {
  border-color: rgba(var(--accent-rgb),0.2);
}

.wd-gauge-warn {
  border-color: rgba(var(--accent-rgb),0.25);
  box-shadow: 0 0 12px rgba(var(--accent-rgb),0.08);
}

.wd-gauge-crit {
  border-color: rgba(255,82,82,0.3);
  box-shadow: 0 0 16px rgba(255,82,82,0.12);
  animation: wd-pulse 2s ease-in-out infinite;
}

@keyframes wd-pulse {
  0%, 100% { box-shadow: 0 0 16px rgba(255,82,82,0.12); }
  50% { box-shadow: 0 0 24px rgba(255,82,82,0.25); }
}

.wd-gauge-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-muted);
  text-transform: uppercase;
}

.wd-gauge-ring-wrap {
  position: relative;
  width: 100px;
  height: 100px;
}

.wd-gauge-ring {
  width: 100%;
  height: 100%;
}

.wd-gauge-pct {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -1px;
}

.wd-gauge-unit {
  font-size: 14px;
  font-weight: 600;
  opacity: 0.6;
}

.wd-gauge-detail {
  font-size: 10px;
  color: var(--text-dim);
  text-align: center;
  letter-spacing: 0.5px;
}

/* SSL Expiry */
.wd-ssl {
  text-align: center;
  padding: 20px;
  margin-bottom: 20px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
}

.wd-ssl-num {
  font-size: 48px;
  font-weight: 900;
  letter-spacing: -2px;
  line-height: 1;
}

.wd-ssl-label {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-top: 4px;
}

.wd-ssl-sub {
  font-size: 11px;
  color: var(--text-dim);
  letter-spacing: 1px;
  margin-top: 6px;
}

.wd-ssl-domain {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 4px;
  font-family: monospace;
}

/* Footer: Uptime + Last Check */
.wd-footer {
  display: flex;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
  padding: 16px 0;
  margin-top: 8px;
}

.wd-uptime {
  text-align: center;
}

.wd-uptime-num {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: -1px;
  line-height: 1;
}

.wd-uptime-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-top: 6px;
}

.wd-last-check {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.wd-last-check-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: var(--text-dim);
  text-transform: uppercase;
  margin-bottom: 4px;
}

.wd-last-check-time {
  font-size: 14px;
  color: var(--text-muted);
  font-weight: 500;
}

/* Responsive */
@media (max-width: 600px) {
  .wd-services {
    grid-template-columns: 1fr;
  }

  .wd-gauges {
    gap: 10px;
  }

  .wd-gauge {
    min-width: 100px;
    padding: 12px;
  }

  .wd-gauge-ring-wrap {
    width: 80px;
    height: 80px;
  }

  .wd-gauge-pct {
    font-size: 20px;
  }

  .wd-ssl-num {
    font-size: 36px;
  }

  .wd-uptime-num {
    font-size: 28px;
  }

  .wd-footer {
    gap: 20px;
  }
}


/* ═══ assets/cost-dashboard.css ═══ */
/* Build 384: Cost Dashboard Widget — inline im Vulkan Tab, Monospace/Gold */
.cost-widget {
  background: rgba(20, 20, 30, 0.85);
  border: 1px solid rgba(212, 175, 55, 0.3);
  border-radius: 12px;
  padding: 14px 18px;
  margin: 12px 24px;
  font-family: 'SF Mono', 'Fira Code', 'JetBrains Mono', 'Cascadia Code', monospace;
  color: #e0e0e0;
  font-size: 13px;
  max-width: 100%;
}

.cost-widget-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(212, 175, 55, 0.2);
}

.cost-widget-title {
  font-weight: 600;
  color: #d4af37;
  font-size: 14px;
  letter-spacing: 0.5px;
}

.cost-widget-refresh {
  cursor: pointer;
  font-size: 16px;
  opacity: 0.6;
  transition: opacity 0.2s, transform 0.3s;
  color: #d4af37;
}

.cost-widget-refresh:hover {
  opacity: 1;
  transform: rotate(180deg);
}

.cost-summary-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  margin-bottom: 10px;
}

.cost-summary-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px 4px;
  background: rgba(212, 175, 55, 0.06);
  border: 1px solid rgba(212, 175, 55, 0.15);
  border-radius: 8px;
}

.cost-summary-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(212, 175, 55, 0.7);
  margin-bottom: 4px;
}

.cost-summary-value {
  font-size: 18px;
  font-weight: 700;
  color: #d4af37;
  font-family: 'SF Mono', 'Fira Code', 'JetBrains Mono', monospace;
}

.cost-budget-section {
  margin-bottom: 8px;
}

.cost-budget-bar-wrap {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
  height: 6px;
  overflow: hidden;
  margin-bottom: 4px;
}

.cost-budget-bar {
  height: 100%;
  border-radius: 4px;
  transition: width 0.5s ease;
}

.cost-budget-label {
  font-size: 11px;
  opacity: 0.7;
}

.cost-models-section {
  margin: 8px 0;
  padding: 6px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.cost-model-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 0;
}

.cost-model-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}

.cost-model-name {
  flex: 1;
  font-size: 12px;
}

.cost-model-count {
  font-size: 11px;
  opacity: 0.6;
}

.cost-model-cost {
  font-weight: 600;
  font-size: 12px;
  min-width: 45px;
  text-align: right;
  color: #d4af37;
}

.cost-week-section {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.cost-week-title {
  font-size: 12px;
  margin-bottom: 6px;
  opacity: 0.8;
  color: #d4af37;
}

.cost-day-chart {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 50px;
}

.cost-day-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  justify-content: flex-end;
}

.cost-day-bar {
  width: 100%;
  background: linear-gradient(to top, rgba(212, 175, 55, 0.3), rgba(212, 175, 55, 0.7));
  border-radius: 2px 2px 0 0;
  min-height: 2px;
  transition: height 0.3s ease;
}

.cost-day-label {
  font-size: 9px;
  opacity: 0.5;
  margin-top: 2px;
}

.cost-requests-label {
  margin-top: 6px;
  font-size: 11px;
  opacity: 0.5;
  text-align: center;
}

.cost-loading, .cost-error {
  text-align: center;
  padding: 10px;
  opacity: 0.6;
  font-size: 12px;
}

.cost-error {
  color: #e74c3c;
}

/* Light theme support */
[data-theme="light"] .cost-widget {
  background: rgba(255, 255, 255, 0.95);
  border-color: rgba(212, 175, 55, 0.4);
  color: #333;
}

[data-theme="light"] .cost-summary-value {
  color: #b8941e;
}

[data-theme="light"] .cost-day-bar {
  background: linear-gradient(to top, rgba(212, 175, 55, 0.4), rgba(212, 175, 55, 0.8));
}


/* ═══ vendor/highlight-github-dark-11.9.0.min.css ═══ */
pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub Dark
  Description: Dark theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-dark
  Current colors taken from GitHub's CSS
*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}

/* ═══ vendor/xterm-5.5.0.min.css ═══ */
/**
 * Minified by jsDelivr using clean-css v5.3.3.
 * Original file: /npm/@xterm/xterm@5.5.0/css/xterm.css
 *
 * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files
 */
.xterm{cursor:text;position:relative;user-select:none;-ms-user-select:none;-webkit-user-select:none}.xterm.focus,.xterm:focus{outline:0}.xterm .xterm-helpers{position:absolute;top:0;z-index:5}.xterm .xterm-helper-textarea{padding:0;border:0;margin:0;position:absolute;opacity:0;left:-9999em;top:0;width:0;height:0;z-index:-5;white-space:nowrap;overflow:hidden;resize:none}.xterm .composition-view{background:#000;color:#fff;display:none;position:absolute;white-space:nowrap;z-index:1}.xterm .composition-view.active{display:block}.xterm .xterm-viewport{background-color:#000;overflow-y:scroll;cursor:default;position:absolute;right:0;left:0;top:0;bottom:0}.xterm .xterm-screen{position:relative}.xterm .xterm-screen canvas{position:absolute;left:0;top:0}.xterm .xterm-scroll-area{visibility:hidden}.xterm-char-measure-element{display:inline-block;visibility:hidden;position:absolute;top:0;left:-9999em;line-height:normal}.xterm.enable-mouse-events{cursor:default}.xterm .xterm-cursor-pointer,.xterm.xterm-cursor-pointer{cursor:pointer}.xterm.column-select.focus{cursor:crosshair}.xterm .xterm-accessibility:not(.debug),.xterm .xterm-message{position:absolute;left:0;top:0;bottom:0;right:0;z-index:10;color:transparent;pointer-events:none}.xterm .xterm-accessibility-tree:not(.debug) ::selection{color:transparent}.xterm .xterm-accessibility-tree{user-select:text;white-space:pre}.xterm .live-region{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.xterm-dim{opacity:1!important}.xterm-underline-1{text-decoration:underline}.xterm-underline-2{text-decoration:double underline}.xterm-underline-3{text-decoration:wavy underline}.xterm-underline-4{text-decoration:dotted underline}.xterm-underline-5{text-decoration:dashed underline}.xterm-overline{text-decoration:overline}.xterm-overline.xterm-underline-1{text-decoration:overline underline}.xterm-overline.xterm-underline-2{text-decoration:overline double underline}.xterm-overline.xterm-underline-3{text-decoration:overline wavy underline}.xterm-overline.xterm-underline-4{text-decoration:overline dotted underline}.xterm-overline.xterm-underline-5{text-decoration:overline dashed underline}.xterm-strikethrough{text-decoration:line-through}.xterm-screen .xterm-decoration-container .xterm-decoration{z-index:6;position:absolute}.xterm-screen .xterm-decoration-container .xterm-decoration.xterm-decoration-top-layer{z-index:7}.xterm-decoration-overview-ruler{z-index:8;position:absolute;top:0;right:0;pointer-events:none}.xterm-decoration-top{z-index:2;position:relative}
/*# sourceMappingURL=/sm/97377c0c258e109358121823f5790146c714989366481f90e554c42277efb500.map */

/* ═══ gehirn-panel.css ═══ */
/* GEHIRN Panel — Atlas Brain Visualization */

#atlas-tab-content-gehirn {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--bg);
  z-index: 900;
  display: none;
  flex-direction: column;
  font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
  overflow: hidden;
}
#atlas-tab-content-gehirn.visible {
  display: flex;
}

/* ─── Stats Bar ─── */
.gehirn-stats-bar {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 20px;
  background: linear-gradient(135deg, #111 0%, #1a1508 100%);
  border-bottom: 1px solid rgba(var(--accent-rgb),0.15);
  flex-shrink: 0;
  flex-wrap: wrap;
}
.gehirn-stats-title {
  font-size: 18px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: 2px;
  text-transform: uppercase;
  white-space: nowrap;
}
.gehirn-stats-summary {
  color: var(--text);
  font-size: 13px;
  flex: 1;
  min-width: 200px;
}
.gehirn-progress-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 180px;
}
.gehirn-progress-bar {
  flex: 1;
  height: 6px;
  background: var(--bg-input);
  border-radius: 3px;
  overflow: hidden;
  min-width: 100px;
}
.gehirn-progress-fill {
  height: 100%;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--accent), #f5d060);
  transition: width 0.6s ease;
}
.gehirn-progress-pct {
  color: var(--accent);
  font-weight: 700;
  font-size: 14px;
  min-width: 40px;
  text-align: right;
}
.gehirn-search-wrap {
  position: relative;
}
.gehirn-search {
  background: var(--bg-input);
  border: 1px solid rgba(var(--accent-rgb),0.3);
  color: var(--text);
  padding: 6px 12px 6px 30px;
  border-radius: 20px;
  font-size: 13px;
  width: 200px;
  outline: none;
  transition: border-color 0.2s;
}
.gehirn-search:focus {
  border-color: var(--accent);
}
.gehirn-search-icon {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-dim);
  font-size: 13px;
  pointer-events: none;
}

/* ─── Main Layout ─── */
.gehirn-main {
  display: flex;
  flex: 1;
  overflow: hidden;
}

/* ─── Brain Canvas ─── */
.gehirn-canvas-wrap {
  flex: 1;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.gehirn-canvas-wrap canvas {
  width: 100%;
  height: 100%;
  display: block;
}

/* ─── Sidebar ─── */
.gehirn-sidebar {
  width: 360px;
  background: linear-gradient(180deg, #111 0%, #0d0d0d 100%);
  border-left: 1px solid rgba(var(--accent-rgb),0.12);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: width 0.3s ease;
}
.gehirn-sidebar.collapsed {
  width: 0;
  border-left: none;
}
.gehirn-sidebar-header {
  padding: 16px;
  border-bottom: 1px solid rgba(var(--accent-rgb),0.12);
  flex-shrink: 0;
}
.gehirn-sidebar-cat-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 1px;
}
.gehirn-sidebar-cat-count {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: 2px;
}
.gehirn-sidebar-close {
  float: right;
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 18px;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}
.gehirn-sidebar-close:hover { color: var(--accent); }

.gehirn-skill-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px 0;
}
.gehirn-skill-list::-webkit-scrollbar { width: 4px; }
.gehirn-skill-list::-webkit-scrollbar-track { background: transparent; }
.gehirn-skill-list::-webkit-scrollbar-thumb { background: rgba(var(--accent-rgb),0.2); border-radius: 2px; }

/* ─── Skill Card ─── */
.gehirn-skill {
  padding: 10px 16px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  transition: background 0.15s;
  cursor: default;
}
.gehirn-skill:hover {
  background: rgba(var(--accent-rgb),0.06);
}
.gehirn-skill-row1 {
  display: flex;
  align-items: center;
  gap: 8px;
}
.gehirn-skill-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.gehirn-skill-dot.working  { background: var(--status-ok); box-shadow: 0 0 6px rgba(76,175,80,0.5); }
.gehirn-skill-dot.partial  { background: var(--accent); box-shadow: 0 0 6px rgba(var(--accent-rgb),0.5); }
.gehirn-skill-dot.broken   { background: var(--status-err); box-shadow: 0 0 6px rgba(244,67,54,0.5); }
.gehirn-skill-dot.planned  { background: var(--text-dim); }

.gehirn-skill-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  flex: 1;
}
.gehirn-skill-build {
  font-size: 11px;
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
}
.gehirn-skill-desc {
  font-size: 11px;
  color: var(--text-dim);
  margin-top: 3px;
  padding-left: 16px;
  line-height: 1.4;
}
.gehirn-skill-test {
  font-size: 10px;
  color: var(--text-dim);
  margin-top: 3px;
  padding-left: 16px;
  line-height: 1.3;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}
.gehirn-skill.expanded .gehirn-skill-test {
  max-height: 200px;
}

/* ─── Status Legend ─── */
.gehirn-legend {
  display: flex;
  gap: 14px;
  padding: 10px 16px;
  border-top: 1px solid rgba(var(--accent-rgb),0.12);
  flex-shrink: 0;
  flex-wrap: wrap;
}
.gehirn-legend-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  color: var(--text-muted);
}

/* ─── Category Tooltip on Canvas ─── */
.gehirn-tooltip {
  position: absolute;
  background: rgba(20,18,10,0.95);
  border: 1px solid rgba(var(--accent-rgb),0.4);
  border-radius: 8px;
  padding: 8px 12px;
  color: var(--text);
  font-size: 12px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s;
  z-index: 10;
  max-width: 200px;
  backdrop-filter: blur(8px);
}
.gehirn-tooltip.show { opacity: 1; }
.gehirn-tooltip-title {
  font-weight: 700;
  color: var(--accent);
  font-size: 13px;
}
.gehirn-tooltip-count {
  color: var(--text-muted);
  margin-top: 2px;
}

/* ─── Responsive ─── */
@media (max-width: 768px) {
  .gehirn-sidebar {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: 85vw;
    max-width: 360px;
    z-index: 1001;
    transform: translateX(100%);
    transition: transform 0.3s ease;
  }
  .gehirn-sidebar.mobile-open {
    transform: translateX(0);
  }
  .gehirn-sidebar-backdrop {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.6);
    z-index: 1000;
    display: none;
  }
  .gehirn-sidebar-backdrop.show { display: block; }
  .gehirn-stats-bar { padding: 10px 12px; gap: 8px; }
  .gehirn-search { width: 140px; }
}

/* ─── Search highlight ─── */
.gehirn-highlight {
  background: rgba(var(--accent-rgb),0.3);
  border-radius: 2px;
  padding: 0 1px;
}


/* ═══ admin-dashboard.css ═══ */
/* Build 146: Admin Dashboard Styles */

.admin-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.85);
  z-index: 90000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.admin-overlay.visible {
  opacity: 1;
  pointer-events: all;
}

.admin-panel {
  background: var(--bg-card);
  border: 1px solid var(--border-light);
  border-radius: 16px;
  width: 95vw;
  max-width: 1200px;
  height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(0,0,0,0.6);
}

.admin-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px;
  border-bottom: 1px solid var(--border);
  background: var(--bg-deep);
}
.admin-header h2 {
  margin: 0;
  font-size: 18px;
  color: var(--accent);
  font-weight: 600;
}
.admin-close-btn {
  background: none;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  width: 32px;
  height: 32px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
}
.admin-close-btn:hover {
  background: var(--bg-input);
  color: #fff;
  border-color: var(--text-dim);
}

.admin-stats-row {
  display: flex;
  gap: 12px;
  padding: 16px 24px;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.admin-stat-card {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 10px;
  padding: 12px 18px;
  min-width: 140px;
  flex: 1;
}
.admin-stat-card .stat-value {
  font-size: 28px;
  font-weight: 700;
  color: var(--accent);
  line-height: 1;
}
.admin-stat-card .stat-label {
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 4px;
}

.admin-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 24px;
  border-bottom: 1px solid var(--border);
}
.admin-search {
  flex: 1;
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  padding: 8px 14px;
  color: var(--text);
  font-size: 14px;
  outline: none;
}
.admin-search:focus {
  border-color: var(--accent);
}
.admin-filter-btn {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 8px;
  padding: 8px 14px;
  color: var(--text);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s;
}
.admin-filter-btn:hover, .admin-filter-btn.active {
  border-color: var(--accent);
  color: var(--accent);
}

.admin-body {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.admin-table thead {
  position: sticky;
  top: 0;
  z-index: 2;
}
.admin-table th {
  background: var(--bg-card);
  color: var(--text-muted);
  font-weight: 500;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.5px;
  padding: 10px 16px;
  text-align: left;
  border-bottom: 1px solid var(--border-light);
}
.admin-table td {
  padding: 10px 16px;
  border-bottom: 1px solid var(--border);
  color: var(--text);
}
.admin-table tr {
  cursor: pointer;
  transition: background 0.1s;
}
.admin-table tbody tr:hover {
  background: var(--bg-input);
}

.admin-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.admin-badge.active    { background: #1a3a2a; color: var(--galaxie-eg); }
.admin-badge.suspended { background: #3a1a1a; color: var(--status-err); }
.admin-badge.trialing  { background: #2a2a1a; color: var(--accent); }
.admin-badge.canceled  { background: #2a1a1a; color: var(--text-muted); }

/* Tenant Detail View */
.admin-detail {
  padding: 24px;
  display: none;
}
.admin-detail.visible {
  display: block;
}
.admin-detail-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}
.admin-back-btn {
  background: none;
  border: 1px solid var(--border-light);
  color: var(--text-muted);
  padding: 6px 14px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  transition: all 0.15s;
}
.admin-back-btn:hover {
  background: var(--bg-input);
  color: #fff;
}
.admin-detail-header h3 {
  margin: 0;
  font-size: 20px;
  color: var(--text);
}
.admin-detail-actions {
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
}
.admin-action-btn {
  padding: 8px 18px;
  border-radius: 8px;
  border: 1px solid var(--border-light);
  background: var(--bg-input);
  color: var(--text);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s;
}
.admin-action-btn.suspend {
  border-color: var(--status-err);
  color: var(--status-err);
}
.admin-action-btn.suspend:hover {
  background: #3a1a1a;
}
.admin-action-btn.activate {
  border-color: var(--galaxie-eg);
  color: var(--galaxie-eg);
}
.admin-action-btn.activate:hover {
  background: #1a3a2a;
}

.admin-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 20px;
}
.admin-detail-card {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 10px;
  padding: 16px;
}
.admin-detail-card h4 {
  margin: 0 0 12px;
  color: var(--text-muted);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.admin-detail-card .detail-row {
  display: flex;
  justify-content: space-between;
  padding: 4px 0;
  font-size: 14px;
}
.admin-detail-card .detail-row .label { color: var(--text-muted); }
.admin-detail-card .detail-row .value { color: var(--text); }

.admin-members-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 8px;
}
.admin-members-table th {
  color: var(--text-dim);
  font-weight: 500;
  font-size: 11px;
  text-transform: uppercase;
  text-align: left;
  padding: 6px 0;
}
.admin-members-table td {
  padding: 6px 0;
  color: var(--text);
  font-size: 13px;
  border-top: 1px solid var(--border);
}

.admin-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px;
  color: var(--text-dim);
  font-size: 14px;
}

.admin-confirm-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  border-radius: 16px;
}
.admin-confirm-box {
  background: var(--bg-input);
  border: 1px solid var(--border-light);
  border-radius: 12px;
  padding: 24px;
  text-align: center;
  max-width: 380px;
}
.admin-confirm-box p {
  color: var(--text);
  margin: 0 0 16px;
  font-size: 14px;
}
.admin-confirm-box .confirm-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
}
.admin-confirm-box button {
  padding: 8px 24px;
  border-radius: 8px;
  border: 1px solid var(--border-light);
  background: var(--bg-input);
  color: var(--text);
  cursor: pointer;
  font-size: 13px;
}
.admin-confirm-box .confirm-yes {
  background: var(--accent);
  color: #000;
  border-color: var(--accent);
  font-weight: 600;
}

@media (max-width: 768px) {
  .admin-panel { width: 100vw; height: 100vh; border-radius: 0; }
  .admin-stats-row { flex-direction: column; }
  .admin-detail-grid { grid-template-columns: 1fr; }
}


/* ═══ voice-indicator.css ═══ */
/* Voice Activity Indicator — Build 185 */

/* Pulsing golden ring — overlays Atlas-Eye during active recognition */
.vai-ring {
  position: fixed;
  border-radius: 50%;
  border: 2.5px solid transparent;
  pointer-events: none;
  z-index: 10;
  opacity: 0;
  transition: opacity 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
}
.vai-ring.vai-active {
  opacity: 1;
  border-color: rgba(var(--accent-rgb),0.85);
  box-shadow: 0 0 20px 5px rgba(var(--accent-rgb),0.35), inset 0 0 14px 3px rgba(var(--accent-rgb),0.12);
  animation: vai-pulse-ring 1.8s ease-in-out infinite;
}

@keyframes vai-pulse-ring {
  0%, 100% {
    box-shadow: 0 0 14px 3px rgba(var(--accent-rgb),0.25), inset 0 0 10px 2px rgba(var(--accent-rgb),0.08);
    border-color: rgba(var(--accent-rgb),0.6);
  }
  50% {
    box-shadow: 0 0 30px 10px rgba(var(--accent-rgb),0.5), inset 0 0 20px 5px rgba(var(--accent-rgb),0.18);
    border-color: rgba(var(--accent-rgb),1);
  }
}

/* Wake-mode blinking dot — bottom-right of Atlas-Eye */
.vai-wake-dot {
  position: fixed;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: rgba(var(--accent-rgb),0.6);
  pointer-events: none;
  z-index: 11;
  opacity: 0;
  transition: opacity 0.4s ease;
  box-shadow: 0 0 6px 2px rgba(var(--accent-rgb),0.3);
}
.vai-wake-dot.vai-visible {
  opacity: 1;
  animation: vai-blink-dot 2.4s ease-in-out infinite;
}

@keyframes vai-blink-dot {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 1; }
}

/* Speaking waveform — fixed near chat area */
.vai-waveform {
  position: fixed;
  bottom: 80px;
  right: 20px;
  width: 180px;
  height: 40px;
  z-index: 1000;
  pointer-events: none;
  opacity: 0;
  transform: translateY(10px) scale(0.95);
  transition: opacity 0.35s ease, transform 0.35s ease;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 2px;
  background: rgba(10,10,10,0.88);
  border: 1px solid rgba(var(--accent-rgb),0.2);
  border-radius: 10px;
  padding: 6px 12px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.vai-waveform.vai-speaking {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.vai-waveform-bar {
  width: 3px;
  min-height: 3px;
  border-radius: 2px;
  background: linear-gradient(to top, rgba(var(--accent-rgb),0.4), rgba(var(--accent-rgb),0.9));
  transition: height 0.08s ease;
}
.vai-waveform-label {
  position: absolute;
  top: -18px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 9px;
  color: rgba(var(--accent-rgb),0.6);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-family: inherit;
  white-space: nowrap;
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .vai-waveform {
    bottom: calc(60px + 66px + env(safe-area-inset-bottom, 0px) + 8px);
    right: 12px;
    width: 140px;
    height: 32px;
    padding: 4px 8px;
  }
}


/* ═══ marketing-overview.css ═══ */
/* Marketing Overview — Atlas Dashboard Tab (Build 399) */
.mkt-overview {
  padding: 16px;
  max-width: 1200px;
  margin: 0 auto;
}

.mkt-ov-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background: #111118;
  border: 1px solid rgba(var(--accent-rgb),0.2);
  border-radius: 10px;
  margin-bottom: 16px;
}

.mkt-ov-header-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.mkt-ov-icon {
  font-size: 24px;
}

.mkt-ov-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--accent);
  margin: 0;
  letter-spacing: 1px;
  font-family: 'JetBrains Mono', monospace;
}

.mkt-ov-sub {
  font-size: 11px;
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
}

.mkt-ov-open-btn {
  padding: 6px 14px;
  border: 1px solid rgba(var(--accent-rgb),0.3);
  border-radius: 6px;
  color: var(--accent);
  text-decoration: none;
  font-size: 12px;
  font-family: 'JetBrains Mono', monospace;
  transition: all 0.2s;
}

.mkt-ov-open-btn:hover {
  background: rgba(var(--accent-rgb),0.1);
  border-color: var(--accent);
}

/* Lead summary strip */
.mkt-ov-leads {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}

.mkt-ov-lead-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px;
  background: #111118;
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: 8px;
}

.mkt-ov-lead-num {
  font-size: 22px;
  font-weight: 700;
  font-family: 'JetBrains Mono', monospace;
}

.mkt-ov-lead-lbl {
  font-size: 9px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: 'JetBrains Mono', monospace;
}

/* Filters */
.mkt-ov-filters {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.mkt-ov-filter-group {
  display: flex;
  gap: 4px;
}

.mkt-ov-filter {
  padding: 5px 10px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 6px;
  color: var(--text-muted);
  font-size: 11px;
  cursor: pointer;
  transition: all 0.2s;
  font-family: -apple-system, sans-serif;
}

.mkt-ov-filter:hover {
  background: rgba(255,255,255,0.06);
  color: #ddd;
}

.mkt-ov-filter.active {
  background: rgba(var(--accent-rgb),0.12);
  border-color: rgba(var(--accent-rgb),0.3);
  color: var(--accent);
}

/* Cards grid */
.mkt-ov-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 12px;
}

.mkt-ov-card {
  display: block;
  background: #111118;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 14px 14px 14px 18px;
  text-decoration: none;
  color: inherit;
  transition: all 0.25s;
  position: relative;
}

.mkt-ov-card:hover {
  background: #16161f;
  border-color: rgba(255,255,255,0.12);
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
}

.mkt-ov-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}

.mkt-ov-card-gal {
  font-size: 10px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  font-weight: 600;
}

.mkt-ov-card-status {
  font-size: 9px;
  font-family: 'JetBrains Mono', monospace;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 2px 6px;
  background: rgba(255,255,255,0.04);
  border-radius: 4px;
}

.mkt-ov-card-name {
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 4px;
  line-height: 1.3;
}

.mkt-ov-card-typ {
  font-size: 10px;
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
  margin-bottom: 6px;
}

.mkt-ov-card-desc {
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.4;
  margin-bottom: 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.mkt-ov-card-kpis {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.04);
  margin-bottom: 6px;
}

.mkt-ov-kpi {
  font-size: 10px;
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
}

.mkt-ov-kpi-val {
  color: var(--accent);
  font-weight: 600;
}

.mkt-ov-card-jump {
  font-size: 10px;
  color: rgba(var(--accent-rgb),0.5);
  font-family: 'JetBrains Mono', monospace;
  text-align: right;
  margin-top: 4px;
  transition: color 0.2s;
}

.mkt-ov-card:hover .mkt-ov-card-jump {
  color: var(--accent);
}

.mkt-ov-empty {
  text-align: center;
  padding: 40px;
  color: var(--text-dim);
  font-size: 13px;
}

/* Responsive */
@media (max-width: 768px) {
  .mkt-ov-header { flex-wrap: wrap; gap: 10px; }
  .mkt-ov-leads { flex-wrap: wrap; }
  .mkt-ov-lead-item { min-width: 60px; }
  .mkt-ov-grid { grid-template-columns: 1fr; }
  .mkt-ov-filters { flex-direction: column; }
}


/* ═══ module/marketing/akquise-dashboard.css ═══ */
/* Akquise-Dashboard CSS (Build 400) */

.akq-dashboard { margin-top: 8px; }
.akq-loading { text-align: center; color: #888; padding: 24px; font-size: 13px; }
.akq-empty { text-align: center; color: #666; padding: 24px; font-size: 13px; }

/* Tabs */
.akq-tabs { display: flex; gap: 4px; margin-bottom: 16px; background: rgba(255,255,255,.03); padding: 4px; border-radius: 8px; }
.akq-tab { flex: 1; padding: 8px 12px; border: none; background: transparent; color: #888; font-size: 12px; font-family: inherit; cursor: pointer; border-radius: 6px; transition: all .2s; white-space: nowrap; }
.akq-tab:hover { color: #e0e0e0; background: rgba(255,255,255,.05); }
.akq-tab.active { color: #fff; background: rgba(34,197,94,.15); border: 1px solid rgba(34,197,94,.3); }

/* Summary Cards */
.akq-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 16px; }
.akq-sum-card { background: var(--mkt-surface, #111118); padding: 12px 8px; border-radius: 8px; text-align: center; border: 1px solid rgba(255,255,255,.06); }
.akq-sum-n { display: block; font-size: 22px; font-weight: 700; font-family: var(--mkt-mono, monospace); }
.akq-sum-n.akq-heiss { color: #ef4444; }
.akq-sum-n.akq-warm { color: #f59e0b; }
.akq-sum-n.akq-kalt { color: #3b82f6; }
.akq-sum-l { font-size: 11px; color: #888; }

/* Funnel */
.akq-funnel { display: flex; flex-direction: column; gap: 4px; margin-bottom: 16px; padding: 12px; background: var(--mkt-surface, #111118); border-radius: 8px; border: 1px solid rgba(255,255,255,.06); }
.akq-funnel-step { display: flex; align-items: center; gap: 8px; }
.akq-funnel-bar { height: 6px; border-radius: 3px; min-width: 0; transition: width .5s ease; }
.akq-funnel-label { font-size: 11px; color: #aaa; white-space: nowrap; min-width: 100px; }
.akq-funnel-label strong { color: #e0e0e0; }

/* Filter */
.akq-filter { display: flex; gap: 8px; margin-bottom: 12px; align-items: center; }
.akq-select { padding: 6px 10px; background: var(--mkt-surface, #111118); color: #e0e0e0; border: 1px solid rgba(255,255,255,.12); border-radius: 6px; font-size: 12px; font-family: inherit; cursor: pointer; }
.akq-export-btn { padding: 6px 12px; background: transparent; color: var(--mkt-eg, #22c55e); border: 1px solid rgba(34,197,94,.3); border-radius: 6px; font-size: 11px; cursor: pointer; font-family: inherit; transition: all .2s; margin-left: auto; }
.akq-export-btn:hover { background: rgba(34,197,94,.1); }

/* Lead List */
.akq-lead-list { display: flex; flex-direction: column; gap: 4px; }
.akq-lead-row { background: var(--mkt-surface, #111118); border: 1px solid rgba(255,255,255,.06); border-radius: 8px; overflow: hidden; transition: border-color .2s; }
.akq-lead-row:hover { border-color: rgba(255,255,255,.12); }
.akq-lead-row.expanded { border-color: rgba(34,197,94,.3); }

.akq-lead-compact { display: grid; grid-template-columns: 28px 36px 1fr 1fr auto auto 20px; align-items: center; gap: 8px; padding: 10px 12px; cursor: pointer; font-size: 13px; }
.akq-lead-kat { font-size: 14px; text-align: center; }
.akq-lead-score { font-family: var(--mkt-mono, monospace); font-weight: 700; font-size: 14px; color: #e0e0e0; }
.akq-lead-name { color: #e0e0e0; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.akq-lead-org { color: #888; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.akq-lead-seg { font-size: 11px; color: #aaa; background: rgba(255,255,255,.04); padding: 2px 6px; border-radius: 4px; white-space: nowrap; display: none; }
.akq-lead-funnel { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; }
.akq-lead-expand { color: #666; font-size: 12px; }

/* Lead Detail */
.akq-lead-detail { padding: 0 12px 16px; border-top: 1px solid rgba(255,255,255,.06); }
.akq-detail-section { margin-top: 14px; }
.akq-detail-title { font-size: 11px; font-weight: 600; color: var(--mkt-eg, #22c55e); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; }

.akq-prio-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.akq-prio { background: rgba(255,255,255,.03); padding: 8px 10px; border-radius: 6px; }
.akq-prio-label { display: block; font-size: 10px; color: #888; text-transform: uppercase; letter-spacing: .5px; }
.akq-prio-val { display: block; font-size: 13px; color: #e0e0e0; margin-top: 2px; font-family: var(--mkt-mono, monospace); }

.akq-answers { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.akq-ans { display: flex; justify-content: space-between; gap: 8px; padding: 4px 8px; font-size: 12px; border-bottom: 1px solid rgba(255,255,255,.04); }
.akq-ans-q { color: #888; }
.akq-ans-v { color: #e0e0e0; text-align: right; font-family: var(--mkt-mono, monospace); font-size: 11px; }

.akq-contact-info { font-size: 13px; color: #e0e0e0; font-family: var(--mkt-mono, monospace); }

/* Funnel Buttons */
.akq-funnel-btns { display: flex; gap: 4px; flex-wrap: wrap; }
.akq-funnel-btn { padding: 5px 10px; border: 1px solid rgba(255,255,255,.1); background: transparent; color: #888; border-radius: 5px; font-size: 11px; cursor: pointer; font-family: inherit; transition: all .2s; }
.akq-funnel-btn:hover { border-color: var(--fc); color: var(--fc); }
.akq-funnel-btn.active { background: var(--fc); color: #fff; border-color: var(--fc); }

/* Entwurf */
.akq-entwurf-btn { padding: 8px 16px; background: rgba(34,197,94,.1); color: var(--mkt-eg, #22c55e); border: 1px solid rgba(34,197,94,.3); border-radius: 6px; font-size: 13px; cursor: pointer; font-family: inherit; transition: all .2s; }
.akq-entwurf-btn:hover { background: rgba(34,197,94,.2); }
.akq-entwurf-btn:disabled { opacity: .5; cursor: not-allowed; }

.akq-entwurf-result { margin-top: 12px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.08); border-radius: 8px; padding: 14px; }
.akq-entwurf-header { font-size: 11px; color: var(--mkt-eg, #22c55e); font-weight: 600; margin-bottom: 8px; text-transform: uppercase; letter-spacing: .5px; }
.akq-entwurf-text { font-size: 13px; color: #e0e0e0; line-height: 1.7; white-space: pre-wrap; word-break: break-word; font-family: var(--mkt-sans, sans-serif); background: transparent; border: none; margin: 0; padding: 0; }
.akq-copy-btn { margin-top: 8px; padding: 5px 12px; background: transparent; color: #888; border: 1px solid rgba(255,255,255,.1); border-radius: 5px; font-size: 11px; cursor: pointer; font-family: inherit; }
.akq-copy-btn:hover { color: #e0e0e0; border-color: rgba(255,255,255,.2); }

/* Aggregation Charts */
.akq-agg-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.akq-agg-total { font-size: 14px; font-weight: 600; color: var(--mkt-eg, #22c55e); }

.akq-chart-card { background: var(--mkt-surface, #111118); border: 1px solid rgba(255,255,255,.06); border-radius: 8px; padding: 14px; margin-bottom: 10px; }
.akq-chart-title { font-size: 12px; font-weight: 600; color: #e0e0e0; margin-bottom: 10px; }
.akq-chart-bars { display: flex; flex-direction: column; gap: 6px; }
.akq-bar-row { display: grid; grid-template-columns: 200px 1fr 70px; align-items: center; gap: 8px; }
.akq-bar-label { font-size: 11px; color: #aaa; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.akq-bar-track { height: 8px; background: rgba(255,255,255,.04); border-radius: 4px; overflow: hidden; }
.akq-bar-fill { height: 100%; background: var(--mkt-eg, #22c55e); border-radius: 4px; transition: width .5s ease; min-width: 2px; }
.akq-bar-val { font-size: 11px; color: #888; font-family: var(--mkt-mono, monospace); text-align: right; }

/* E-Book Segments */
.akq-section-header { font-size: 15px; font-weight: 600; color: #e0e0e0; margin-bottom: 4px; }
.akq-section-sub { font-size: 12px; color: #888; margin-bottom: 14px; }

.akq-ebook-list { display: flex; flex-direction: column; gap: 6px; }
.akq-ebook-row { display: grid; grid-template-columns: 1fr 1fr auto auto; gap: 8px; align-items: center; background: var(--mkt-surface, #111118); padding: 10px 12px; border-radius: 8px; border: 1px solid rgba(255,255,255,.06); }
.akq-ebook-segment { font-size: 12px; color: #e0e0e0; font-weight: 500; }
.akq-ebook-input { padding: 6px 10px; background: rgba(255,255,255,.04); color: #e0e0e0; border: 1px solid rgba(255,255,255,.1); border-radius: 5px; font-size: 12px; font-family: inherit; }
.akq-ebook-input:focus { outline: none; border-color: var(--mkt-eg, #22c55e); }
.akq-ebook-input.small { max-width: 120px; }
.akq-save-seg-btn { padding: 5px 8px; background: transparent; border: 1px solid rgba(255,255,255,.1); border-radius: 5px; cursor: pointer; font-size: 14px; transition: all .2s; }
.akq-save-seg-btn:hover { background: rgba(34,197,94,.1); border-color: rgba(34,197,94,.3); }

/* Roadmap */
.akq-roadmap { display: flex; flex-direction: column; gap: 8px; }
.akq-phase { background: var(--mkt-surface, #111118); border: 1px solid rgba(255,255,255,.06); border-radius: 8px; padding: 14px; transition: border-color .2s; }
.akq-phase.active { border-color: rgba(34,197,94,.3); background: rgba(34,197,94,.03); }
.akq-phase.done { border-color: rgba(59,130,246,.2); opacity: .8; }
.akq-phase-header { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.akq-phase-nr { font-size: 10px; font-weight: 700; color: var(--mkt-eg, #22c55e); text-transform: uppercase; letter-spacing: 1px; white-space: nowrap; }
.akq-phase-title { font-size: 14px; font-weight: 600; color: #e0e0e0; flex: 1; }
.akq-phase-select { padding: 4px 8px; background: rgba(255,255,255,.04); color: #e0e0e0; border: 1px solid rgba(255,255,255,.1); border-radius: 5px; font-size: 11px; font-family: inherit; cursor: pointer; }
.akq-phase-fokus { font-size: 12px; color: #aaa; line-height: 1.5; margin-top: 4px; }
.akq-phase-ergebnis { font-size: 11px; color: var(--mkt-eg, #22c55e); margin-top: 6px; font-style: italic; }

/* Responsive */
@media (max-width: 640px) {
  .akq-summary { grid-template-columns: repeat(2, 1fr); }
  .akq-lead-compact { grid-template-columns: 24px 30px 1fr auto 18px; }
  .akq-lead-org, .akq-lead-seg { display: none; }
  .akq-prio-grid { grid-template-columns: 1fr; }
  .akq-answers { grid-template-columns: 1fr; }
  .akq-bar-row { grid-template-columns: 120px 1fr 50px; }
  .akq-ebook-row { grid-template-columns: 1fr; }
  .akq-filter { flex-wrap: wrap; }
}


/* ═══ visual-edit-mode.css ═══ */
/* Visual Edit Mode — Build 379 */

.ave-btn {
  position: fixed; bottom: 24px; right: 24px; z-index: 99999;
  width: 56px; height: 56px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--accent-dim));
  border: 2px solid rgba(255,255,255,0.15);
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(var(--accent-rgb),0.4);
  display: flex; align-items: center; justify-content: center;
  transition: transform 0.2s, box-shadow 0.2s, background 0.3s;
}
.ave-btn:hover {
  transform: scale(1.1);
  box-shadow: 0 6px 24px rgba(var(--accent-rgb),0.6);
}
.ave-btn:active { transform: scale(0.95); }
.ave-btn.active {
  background: linear-gradient(135deg, #e74c3c, #c0392b);
  box-shadow: 0 4px 16px rgba(231,76,60,0.5);
  animation: ave-pulse-btn 2s infinite;
}
.ave-btn svg { width: 24px; height: 24px; fill: #000; pointer-events: none; }

@keyframes ave-pulse-btn {
  0%, 100% { box-shadow: 0 4px 16px rgba(231,76,60,0.5); }
  50% { box-shadow: 0 4px 24px rgba(231,76,60,0.8); }
}

.ave-indicator {
  position: fixed; top: 0; left: 0; right: 0; z-index: 99998;
  background: linear-gradient(90deg, var(--accent), var(--accent-light));
  color: #000; font-weight: 700; font-size: 13px; letter-spacing: 0.5px;
  text-align: center; padding: 8px 0;
  transform: translateY(-100%);
  transition: transform 0.3s ease;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.ave-indicator.show { transform: translateY(0); }
.ave-indicator kbd {
  background: rgba(0,0,0,0.15); padding: 2px 6px; border-radius: 3px;
  font-size: 11px; margin-left: 8px;
}

body.ave-active { cursor: crosshair !important; }
body.ave-active * { cursor: crosshair !important; }
body.ave-active .ave-btn,
body.ave-active .ave-btn *,
body.ave-active .ave-modal-bg,
body.ave-active .ave-modal-bg * { cursor: pointer !important; }

.ave-highlight {
  outline: 2px solid var(--accent) !important;
  outline-offset: 2px !important;
  background-color: rgba(var(--accent-rgb),0.05) !important;
}

.ave-modal-bg {
  position: fixed; inset: 0; z-index: 100000;
  background: rgba(0,0,0,0.75);
  backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0; pointer-events: none;
  transition: opacity 0.25s ease;
}
.ave-modal-bg.show { opacity: 1; pointer-events: all; }

.ave-modal {
  background: var(--bg-input); border: 1px solid var(--border-light); border-radius: 16px;
  width: 100%; max-width: 540px; max-height: 85vh; overflow-y: auto;
  box-shadow: 0 24px 48px rgba(0,0,0,0.6);
  transform: translateY(20px); transition: transform 0.25s ease;
}
.ave-modal-bg.show .ave-modal { transform: translateY(0); }

.ave-modal-header {
  padding: 20px 24px; border-bottom: 1px solid var(--border-light);
  display: flex; align-items: center; justify-content: space-between;
}
.ave-modal-title {
  font-size: 18px; font-weight: 700; color: var(--accent);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.ave-modal-close {
  background: none; border: none; color: var(--text-dim); font-size: 28px;
  cursor: pointer; line-height: 1; padding: 0 4px;
  transition: color 0.2s;
}
.ave-modal-close:hover { color: #fff; }

.ave-el-info {
  padding: 16px 24px; background: var(--bg-card); border-bottom: 1px solid #282828;
}
.ave-el-row {
  font-size: 13px; color: var(--text-muted); margin-bottom: 6px; line-height: 1.4;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.ave-el-row strong { color: var(--accent); font-weight: 600; }
.ave-el-row code {
  background: var(--bg-input); padding: 1px 6px; border-radius: 3px;
  font-size: 12px; color: var(--text); font-family: 'SF Mono', 'Fira Code', monospace;
}

.ave-el-preview {
  margin-top: 10px; padding: 10px; background: var(--bg);
  border: 1px solid var(--border); border-radius: 8px;
  font-size: 12px; color: var(--text-dim); max-height: 100px;
  overflow: hidden; font-family: 'SF Mono', 'Fira Code', monospace;
  white-space: pre-wrap; word-break: break-all; line-height: 1.5;
}

.ave-modal-body { padding: 20px 24px; }
.ave-prompt-label {
  font-size: 13px; color: var(--text-muted); margin-bottom: 8px; font-weight: 600;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.ave-textarea {
  width: 100%; min-height: 120px; background: var(--bg); border: 1px solid var(--border-light);
  border-radius: 10px; color: var(--text); padding: 14px; font-size: 14px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  resize: vertical; line-height: 1.5;
  transition: border-color 0.2s;
}
.ave-textarea:focus { outline: none; border-color: var(--accent); }
.ave-textarea::placeholder { color: var(--text-dim); }

.ave-examples {
  margin-top: 10px; display: flex; gap: 6px; flex-wrap: wrap;
}
.ave-example {
  font-size: 11px; color: var(--text-dim); background: #1e1e1e; border: 1px solid var(--border-light);
  border-radius: 6px; padding: 4px 10px; cursor: pointer;
  transition: all 0.2s;
}
.ave-example:hover { color: var(--accent); border-color: var(--accent); }

.ave-modal-footer {
  padding: 16px 24px; border-top: 1px solid var(--border-light);
  display: flex; gap: 10px; align-items: center;
}
.ave-submit {
  flex: 1; padding: 14px; border-radius: 10px; border: none;
  background: linear-gradient(135deg, var(--accent), var(--accent-dim));
  color: #000; font-weight: 700; font-size: 15px; cursor: pointer;
  transition: transform 0.15s, box-shadow 0.2s;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.ave-submit:hover { transform: scale(1.02); box-shadow: 0 4px 16px rgba(var(--accent-rgb),0.3); }
.ave-submit:active { transform: scale(0.98); }
.ave-submit:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }

.ave-cancel {
  padding: 14px 20px; border-radius: 10px; border: 1px solid var(--border-light);
  background: transparent; color: var(--text-muted); font-size: 14px; cursor: pointer;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  transition: all 0.2s;
}
.ave-cancel:hover { color: #fff; border-color: var(--text-dim); }

.ave-toast {
  position: fixed; bottom: 96px; left: 50%; transform: translateX(-50%);
  padding: 12px 24px; border-radius: 10px;
  font-weight: 600; font-size: 14px; z-index: 100001;
  opacity: 0; transition: opacity 0.3s; pointer-events: none;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  white-space: nowrap;
}
.ave-toast.show { opacity: 1; }
.ave-toast-success { background: var(--status-ok); color: #fff; }
.ave-toast-error { background: var(--status-err); color: #fff; }
.ave-toast-info { background: var(--accent); color: #000; }

/* ─── Anhaenge (Datei-Button + Ctrl+V, Auftrag edit-anhaenge 2026-07-09) ─── */
.ave-anhang-row {
  display: flex; gap: 10px; margin-top: 12px; align-items: center;
}
.ave-anhang-btn {
  font-size: 12px; padding: 6px 14px; border-radius: 8px;
  border: 1px solid var(--accent); background: rgba(var(--accent-rgb),0.08);
  color: var(--accent); cursor: pointer; font-weight: 600;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  transition: all 0.2s;
}
.ave-anhang-btn:hover { background: rgba(var(--accent-rgb),0.18); }
.ave-anhang-hint {
  font-size: 11px; color: var(--text-dim);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.ave-anhang-liste {
  display: flex; flex-direction: column; gap: 6px; margin-top: 10px;
}
.ave-anhang-item {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 10px; background: var(--bg); border: 1px solid var(--border-light);
  border-radius: 8px;
}
.ave-anhang-thumb {
  width: 40px; height: 40px; object-fit: cover; border-radius: 6px;
  border: 1px solid var(--border-light); flex-shrink: 0;
}
.ave-anhang-icon { font-size: 22px; width: 40px; text-align: center; flex-shrink: 0; }
.ave-anhang-name {
  flex: 1; font-size: 12px; color: var(--text-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
.ave-anhang-remove {
  background: none; border: none; color: var(--text-dim); font-size: 20px;
  cursor: pointer; line-height: 1; padding: 0 6px; transition: color 0.2s;
}
.ave-anhang-remove:hover { color: #e74c3c; }

.ave-priority-row {
  display: flex; gap: 8px; margin-top: 12px; align-items: center;
}
.ave-priority-label {
  font-size: 12px; color: var(--text-dim); margin-right: 4px;
}
.ave-priority-btn {
  font-size: 12px; padding: 4px 12px; border-radius: 6px; border: 1px solid var(--border-light);
  background: transparent; color: var(--text-muted); cursor: pointer; transition: all 0.2s;
}
.ave-priority-btn.selected { border-color: var(--accent); color: var(--accent); background: rgba(var(--accent-rgb),0.1); }
.ave-priority-btn:hover { border-color: var(--text-dim); color: var(--text); }

@media (max-width: 768px) {
  .ave-btn { bottom: calc(60px + 66px + env(safe-area-inset-bottom, 0px) + 12px); right: 16px; width: 48px; height: 48px; }
  .ave-btn svg { width: 20px; height: 20px; }
  .ave-modal { max-width: 100%; border-radius: 12px; }
  .ave-modal-header, .ave-el-info, .ave-modal-body, .ave-modal-footer { padding-left: 16px; padding-right: 16px; }
  .ave-toast { bottom: calc(60px + 66px + env(safe-area-inset-bottom, 0px) + 72px); font-size: 13px; }
}