/* ==========================================================
   AÜ Content Kalender · Akademie Überlingen
   KAIROS-inspiriertes Dark-Mode-Design mit echten Neon-Glow-Kacheln
   + warmes, vielschichtiges Light-Mode
   ========================================================== */

/* Self-hosted Google Fonts (DSGVO-konform, kein IP-Leak an Google) */
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 300; font-display: swap; src: url("fonts/merriweather-300-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 300; font-display: swap; src: url("fonts/merriweather-300-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/merriweather-400-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/merriweather-400-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/merriweather-700-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/merriweather-700-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 900; font-display: swap; src: url("fonts/merriweather-900-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Merriweather"; font-style: normal; font-weight: 900; font-display: swap; src: url("fonts/merriweather-900-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "PT Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/pt-sans-400-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "PT Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/pt-sans-400-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "PT Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/pt-sans-700-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "PT Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/pt-sans-700-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

/* ============================================================
   DESIGN-TOKENS · LIGHT THEME (Default)
   ============================================================ */
:root {
  /* AÜ Primär */
  --au-rot: #e20613;
  --au-rot-dunkel: #9a1d28;
  --au-rot-licht: #f04050;

  /* Akzente (KAIROS-inspiriert) */
  --accent-orange: #f07321;
  --accent-orange-hell: #f58a2e;
  --accent-blau: #2563eb;
  --accent-cyan: #22d3ee;
  --accent-violett: #8b5cf6;
  --accent-gruen: #10b981;
  --accent-gelb: #fbbf24;

  /* Backgrounds Light (Design-Audit 22.04.: "kein reines Weiß" als BG — Corporate-Design-Regel) */
  --bg-app: #f6eed8;
  --bg-app-deep: #ede2bf;
  --bg-card: #fffdf7;
  --bg-card-hover: #fff9e8;
  --bg-card-subtle: #fcf8ea;
  --bg-nav: rgba(254, 250, 235, 0.85);
  --bg-input: rgba(255, 253, 245, 0.75);

  /* Text Light */
  --text-primary: #1a1a1a;
  --text-secondary: #444a4f;
  --text-muted: #5c6369;
  --text-heading: #0f0f10;

  /* Borders Light */
  --border-soft: rgba(154, 29, 40, 0.10);
  --border-strong: rgba(154, 29, 40, 0.22);
  --border-glow: rgba(226, 6, 19, 0.28);

  /* Shadows + Glow */
  --shadow-sm: 0 1px 3px rgba(90, 30, 30, 0.08);
  --shadow-md: 0 8px 24px rgba(90, 30, 30, 0.12), 0 2px 6px rgba(90, 30, 30, 0.08);
  --shadow-lg: 0 20px 50px rgba(90, 30, 30, 0.18), 0 8px 20px rgba(90, 30, 30, 0.10);
  --shadow-xl: 0 40px 90px rgba(90, 30, 30, 0.25);

  --glow-rot: 0 0 18px rgba(226, 6, 19, 0.22), 0 0 40px rgba(226, 6, 19, 0.10);
  --glow-rot-stark: 0 0 28px rgba(226, 6, 19, 0.38), 0 0 60px rgba(226, 6, 19, 0.18);
  --glow-orange: 0 0 18px rgba(240, 115, 33, 0.25), 0 0 40px rgba(240, 115, 33, 0.12);
  --glow-blau: 0 0 18px rgba(37, 99, 235, 0.22), 0 0 40px rgba(37, 99, 235, 0.10);
  --glow-violett: 0 0 18px rgba(139, 92, 246, 0.22), 0 0 40px rgba(139, 92, 246, 0.10);
  --glow-cyan: 0 0 18px rgba(34, 211, 238, 0.22), 0 0 40px rgba(34, 211, 238, 0.10);
  --glow-gruen: 0 0 18px rgba(16, 185, 129, 0.22), 0 0 40px rgba(16, 185, 129, 0.10);

  /* Plattform-Farben */
  --pl-linkedin: #0a66c2;
  --pl-facebook: #1877f2;
  --pl-instagram: #e4405f;

  /* Radius + Spacing + Timing */
  --r-sm: 8px; --r-md: 14px; --r-lg: 20px; --r-xl: 28px; --r-full: 999px;
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px;
  --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px;
  --t-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --t-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --t-bounce: 400ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Layout */
  --sidebar-w: 260px;
  --header-h: 72px;

  /* Fonts */
  --font-display: "Merriweather", "Georgia", serif;
  --font-body: "PT Sans", -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Light-BG-Gradient */
  --app-bg-image:
    radial-gradient(circle at 8% 10%, rgba(226, 6, 19, 0.10), transparent 48%),
    radial-gradient(circle at 92% 20%, rgba(240, 115, 33, 0.08), transparent 45%),
    radial-gradient(circle at 50% 100%, rgba(23, 68, 118, 0.07), transparent 55%),
    linear-gradient(180deg, #fbf6e4 0%, #f4ecd4 100%);
}

/* ============================================================
   DESIGN-TOKENS · DARK THEME (KAIROS-inspiriert)
   ============================================================ */
[data-theme="dark"] {
  --au-rot: #ff1f2e;
  --au-rot-dunkel: #e20613;
  --au-rot-licht: #ff5a64;

  --bg-app: #0f172a;
  --bg-app-deep: #0a0f1f;
  --bg-card: #1e293b;
  --bg-card-hover: #273449;
  --bg-card-subtle: #172033;
  --bg-nav: rgba(30, 41, 59, 0.75);
  --bg-input: rgba(15, 23, 42, 0.6);

  --text-primary: #f1f5f9;
  --text-secondary: #cbd5e1;
  --text-muted: #94a3b8;
  --text-heading: #ffffff;

  --border-soft: rgba(148, 163, 184, 0.15);
  --border-strong: rgba(148, 163, 184, 0.32);
  --border-glow: rgba(255, 31, 46, 0.5);

  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 6px 18px rgba(0, 0, 0, 0.55), 0 2px 6px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.65), 0 6px 14px rgba(0, 0, 0, 0.4);
  --shadow-xl: 0 30px 70px rgba(0, 0, 0, 0.75);

  --glow-rot: 0 0 24px rgba(255, 31, 46, 0.55), 0 0 52px rgba(255, 31, 46, 0.28);
  --glow-rot-stark: 0 0 36px rgba(255, 31, 46, 0.8), 0 0 72px rgba(255, 31, 46, 0.45);
  --glow-orange: 0 0 24px rgba(240, 115, 33, 0.55), 0 0 52px rgba(240, 115, 33, 0.28);
  --glow-blau: 0 0 24px rgba(96, 165, 250, 0.55), 0 0 52px rgba(96, 165, 250, 0.28);
  --glow-violett: 0 0 24px rgba(167, 139, 250, 0.55), 0 0 52px rgba(167, 139, 250, 0.28);
  --glow-cyan: 0 0 24px rgba(34, 211, 238, 0.55), 0 0 52px rgba(34, 211, 238, 0.28);
  --glow-gruen: 0 0 24px rgba(52, 211, 153, 0.55), 0 0 52px rgba(52, 211, 153, 0.28);

  --app-bg-image:
    radial-gradient(circle at 10% 0%, rgba(226, 6, 19, 0.18), transparent 55%),
    radial-gradient(circle at 90% 15%, rgba(240, 115, 33, 0.12), transparent 50%),
    radial-gradient(circle at 50% 110%, rgba(30, 58, 95, 0.40), transparent 60%),
    linear-gradient(180deg, #0f172a 0%, #0a0f1f 100%);
}

/* ============================================================
   RESET + BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html {
  scroll-behavior: smooth;
  font-size: 16px;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
}
body {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.55;
  color: var(--text-primary);
  background: var(--bg-app);
  background-image: var(--app-bg-image);
  background-attachment: fixed;
  width: 100%;
  min-height: 100vh;
  overflow-x: hidden;
  transition: background-color 250ms ease, color 250ms ease;
}
h1, h2, h3, h4, h5, h6 { font-family: var(--font-display); color: var(--text-heading); line-height: 1.2; }
button { font-family: inherit; cursor: pointer; }
a { color: var(--au-rot); text-decoration: none; }

::selection { background: var(--au-rot); color: #fff; }

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: var(--r-full); }
::-webkit-scrollbar-thumb:hover { background: var(--au-rot); }

/* ============================================================
   LAYOUT · Vollbreiten-Grid
   ============================================================ */
.app {
  display: grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  grid-template-rows: var(--header-h) 1fr;
  grid-template-areas: "sidebar header" "sidebar main";
  min-height: 100vh;
  width: 100vw;
  max-width: 100%;
}

/* ============================================================
   HEADER · Gradient + Glow-Linie
   ============================================================ */
.header {
  grid-area: header;
  display: flex;
  align-items: center;
  gap: var(--s-4);
  padding: 0 var(--s-6);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.6) 0%, rgba(250,246,229,0.7) 60%, rgba(255,255,255,0.5) 100%);
  border-bottom: 1px solid var(--border-soft);
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: saturate(180%) blur(12px);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  box-shadow: 0 4px 20px rgba(90, 30, 30, 0.06);
}
[data-theme="dark"] .header {
  background:
    linear-gradient(135deg, rgba(30,41,59,0.85) 0%, rgba(15,23,42,0.9) 50%, rgba(30,58,95,0.75) 100%);
  box-shadow: 0 4px 24px rgba(0,0,0,0.6), inset 0 -1px 0 rgba(240,115,33,0.15);
}
.header::after {
  content: "";
  position: absolute;
  bottom: 0; left: 8%; right: 8%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(240,115,33,0.35), rgba(226,6,19,0.55), rgba(240,115,33,0.35), transparent);
  filter: blur(0.5px);
  pointer-events: none;
}
[data-theme="dark"] .header::after {
  background: linear-gradient(90deg, transparent, rgba(240,115,33,0.7), rgba(255,31,46,0.9), rgba(240,115,33,0.7), transparent);
  box-shadow: 0 0 18px rgba(240, 115, 33, 0.5);
}

.header__title {
  font-family: var(--font-display);
  font-size: 20px;
  font-weight: 900;
  color: var(--text-heading);
  letter-spacing: -0.01em;
}
.header__subtitle {
  font-size: 12px;
  color: var(--text-muted);
  margin-left: var(--s-2);
  font-weight: 400;
}
.header__spacer { flex: 1; }

/* ============================================================
   SIDEBAR · tiefes Panel mit Logo-Glow
   ============================================================ */
.sidebar {
  grid-area: sidebar;
  background:
    radial-gradient(circle at 20% 0%, rgba(226, 6, 19, 0.05), transparent 60%),
    linear-gradient(180deg, #ffffff 0%, #fdf9e9 100%);
  border-right: 1px solid var(--border-soft);
  padding: var(--s-5) 0 var(--s-4);
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  box-shadow:
    4px 0 24px rgba(90, 30, 30, 0.06),
    1px 0 0 rgba(154, 29, 40, 0.08);
}
[data-theme="dark"] .sidebar {
  background: linear-gradient(180deg, #141e33 0%, #0f172a 100%);
  box-shadow: 4px 0 30px rgba(0,0,0,0.5);
}

.sidebar__brand {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  padding: 0 var(--s-5) var(--s-5);
  margin-bottom: var(--s-2);
  border-bottom: 1px solid var(--border-soft);
}
.sidebar__brand-logo {
  width: 44px; height: 44px;
  border-radius: var(--r-md);
  background:
    linear-gradient(135deg, var(--au-rot-licht) 0%, var(--au-rot) 45%, var(--au-rot-dunkel) 100%);
  color: #fff;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 20px;
  display: grid; place-items: center;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.1),
    0 4px 12px rgba(154, 29, 40, 0.25),
    var(--glow-rot);
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}
.sidebar__brand-logo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 30%, rgba(255,255,255,0.22) 50%, transparent 70%);
  opacity: 0;
  transition: opacity 400ms ease, transform 800ms ease;
  transform: translateX(-100%);
}
.sidebar__brand:hover .sidebar__brand-logo::after {
  opacity: 1;
  transform: translateX(100%);
}
.sidebar__brand-name {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 18px;
  color: var(--text-heading);
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.sidebar__brand-sub {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: 2px;
  font-weight: 400;
}

.nav { display: flex; flex-direction: column; gap: 2px; padding: 0 var(--s-3); }

.nav__item {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-3) var(--s-4);
  border-radius: var(--r-md);
  color: var(--text-secondary);
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all var(--t-fast);
  position: relative;
}
.nav__item:hover {
  background: var(--bg-card-subtle);
  color: var(--au-rot);
  border-color: var(--border-soft);
}
.nav__item--active {
  background: linear-gradient(90deg, rgba(226,6,19,0.12), rgba(226,6,19,0.04));
  color: var(--au-rot);
  border-color: rgba(226,6,19,0.25);
  box-shadow: var(--glow-rot);
}
[data-theme="dark"] .nav__item--active {
  background: linear-gradient(90deg, rgba(255,31,46,0.18), rgba(255,31,46,0.06));
  box-shadow: var(--glow-rot);
}
.nav__item--active::before {
  content: "";
  position: absolute;
  left: -1px; top: 25%; bottom: 25%;
  width: 3px;
  background: var(--au-rot);
  border-radius: var(--r-full);
  box-shadow: var(--glow-rot-stark);
}
.nav__icon { width: 20px; flex-shrink: 0; text-align: center; font-size: 16px; }

.nav__section-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  padding: var(--s-5) var(--s-6) var(--s-2);
  font-weight: 700;
}

/* ============================================================
   MAIN · VOLLBREITE
   ============================================================ */
.main {
  grid-area: main;
  padding: var(--s-6) var(--s-8);
  overflow-y: auto;
  max-height: calc(100vh - var(--header-h));
  min-width: 0;
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
  display: inline-flex; align-items: center; gap: var(--s-2);
  padding: 9px 16px;
  border-radius: var(--r-md);
  border: 1px solid var(--border-soft);
  background: var(--bg-card);
  color: var(--text-primary);
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all var(--t-fast);
  white-space: nowrap;
}
.btn:hover {
  border-color: var(--au-rot);
  color: var(--au-rot);
  box-shadow: var(--glow-rot);
  transform: translateY(-1px);
}
.btn:focus-visible { outline: 2px solid var(--au-rot); outline-offset: 2px; }

.btn--primary {
  background: linear-gradient(135deg, var(--au-rot) 0%, var(--au-rot-dunkel) 100%);
  color: #fff;
  border-color: var(--au-rot-dunkel);
  box-shadow: var(--shadow-md), var(--glow-rot);
}
.btn--primary:hover {
  color: #fff;
  box-shadow: var(--shadow-lg), var(--glow-rot-stark);
  transform: translateY(-2px);
}

.btn--ghost { border-color: transparent; background: transparent; }
.btn--ghost:hover { background: var(--bg-card-subtle); }
.btn--icon { padding: 9px; aspect-ratio: 1; }

/* ============================================================
   SEARCH · Glow auf Focus
   ============================================================ */
.search {
  position: relative;
  max-width: 440px;
  flex: 1;
}
.search__input {
  width: 100%;
  padding: 10px 16px 10px 42px;
  border-radius: var(--r-md);
  border: 1px solid var(--border-soft);
  background: var(--bg-input);
  color: var(--text-primary);
  font-family: inherit;
  font-size: 14px;
  transition: all var(--t-fast);
}
.search__input:focus {
  outline: none;
  border-color: var(--au-rot);
  background: var(--bg-card);
  box-shadow: 0 0 0 3px rgba(226, 6, 19, 0.18), var(--glow-rot);
}
.search__icon {
  position: absolute; left: 14px; top: 50%;
  transform: translateY(-50%);
  color: var(--text-muted);
  font-size: 16px;
  pointer-events: none;
}
.search__shortcut {
  position: absolute; right: 12px; top: 50%;
  transform: translateY(-50%);
  font-size: 11px;
  color: var(--text-muted);
  padding: 3px 8px;
  border: 1px solid var(--border-soft);
  border-radius: var(--r-sm);
  font-family: ui-monospace, Menlo, Consolas, monospace;
  background: var(--bg-card);
}

/* ============================================================
   PAGE-HEADER
   ============================================================ */
.page-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--s-6);
  margin-bottom: var(--s-6);
  flex-wrap: wrap;
}
.page-header__title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 34px;
  color: var(--text-heading);
  letter-spacing: -0.02em;
  line-height: 1.1;
  background: linear-gradient(135deg, var(--text-heading) 0%, var(--au-rot-dunkel) 110%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
[data-theme="dark"] .page-header__title {
  background: linear-gradient(135deg, #ffffff 0%, var(--au-rot-licht) 110%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
/* View-Toggle (Kacheln / Liste) — vereinte Posts-Ansicht */
.view-toggle {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  background: var(--c-bg-subtle, rgba(0,0,0,0.04));
  border: 1px solid var(--c-border, rgba(0,0,0,0.08));
  border-radius: 10px;
}
.view-toggle__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--c-text-muted);
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.view-toggle__btn:hover {
  color: var(--c-text);
  background: rgba(0,0,0,0.04);
}
.view-toggle__btn.is-active {
  background: var(--au-rot);
  color: #fff;
  box-shadow: 0 1px 4px rgba(226,6,19,0.25);
}
.view-toggle__icon {
  font-size: 15px;
  line-height: 1;
}
[data-theme="dark"] .view-toggle {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.12);
}
[data-theme="dark"] .view-toggle__btn:hover {
  background: rgba(255,255,255,0.08);
}
@media (max-width: 640px) {
  .view-toggle__label { display: none; }
  .view-toggle__btn { padding: 6px 10px; }
}

.page-header__sub {
  color: var(--text-muted);
  font-size: 14px;
  margin-top: 6px;
  font-weight: 400;
}

/* ============================================================
   FILTER-BAR
   ============================================================ */
.filter-bar {
  display: flex;
  gap: var(--s-4);
  flex-wrap: wrap;
  padding: var(--s-4) var(--s-5);
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  margin-bottom: var(--s-6);
  box-shadow: var(--shadow-sm);
  align-items: center;
}

.chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 13px;
  border-radius: var(--r-full);
  border: 1px solid var(--border-soft);
  background: var(--bg-card-subtle);
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: all var(--t-fast);
  user-select: none;
}
.chip:hover { border-color: var(--au-rot); color: var(--au-rot); transform: translateY(-1px); }
.chip--active {
  background: linear-gradient(135deg, var(--au-rot), var(--au-rot-dunkel));
  color: #fff;
  border-color: var(--au-rot-dunkel);
  box-shadow: var(--glow-rot);
}
.chip__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--chip-color, var(--au-rot)); box-shadow: 0 0 6px var(--chip-color, var(--au-rot)); }

/* ============================================================
   KPI-DASHBOARD-KACHELN · mit echten Neon-Glow-Ringen
   ============================================================ */
.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--s-5);
  margin-bottom: var(--s-8);
}

.kpi-card {
  position: relative;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-xl);
  padding: var(--s-6);
  overflow: hidden;
  transition: all var(--t-base);
  box-shadow: var(--shadow-sm);
}
/* Farbiger Akzent-Strich oben */
.kpi-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--kpi-color, var(--au-rot)), transparent);
}
/* Subtler radialer Farbschein im Hintergrund */
.kpi-card::after {
  content: "";
  position: absolute;
  top: -30%; right: -30%;
  width: 220px; height: 220px;
  background: radial-gradient(circle, var(--kpi-color, var(--au-rot)) 0%, transparent 65%);
  opacity: 0.07;
  pointer-events: none;
  transition: opacity var(--t-base);
}
.kpi-card:hover {
  transform: translateY(-4px);
  border-color: var(--kpi-color, var(--au-rot));
  box-shadow: var(--shadow-lg), 0 0 28px -5px var(--kpi-color, var(--au-rot));
}
.kpi-card:hover::after { opacity: 0.15; }
[data-theme="dark"] .kpi-card:hover {
  box-shadow: var(--shadow-lg), 0 0 40px -5px var(--kpi-color, var(--au-rot));
}

.kpi-card__label {
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  margin-bottom: var(--s-2);
}
.kpi-card__value {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 46px;
  color: var(--text-heading);
  line-height: 1.05;
  margin: 4px 0;
  background: linear-gradient(135deg, var(--text-heading), var(--kpi-color, var(--au-rot)));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  position: relative;
  z-index: 1;
}
.kpi-card__delta {
  font-size: 12px;
  color: var(--text-muted);
  margin-top: var(--s-1);
  position: relative;
  z-index: 1;
}

/* ============================================================
   CALENDAR
   ============================================================ */
.calendar {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}
.calendar__month-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--s-5) var(--s-6);
  background: linear-gradient(135deg, var(--bg-card-subtle), var(--bg-card));
  border-bottom: 1px solid var(--border-soft);
}
[data-theme="dark"] .calendar__month-header {
  background: linear-gradient(135deg, #1a2440, #0f172a);
}
.calendar__month-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 22px;
  color: var(--text-heading);
}
.calendar__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background: var(--border-soft);
  gap: 1px;
}
.calendar__weekday {
  padding: 12px;
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: var(--bg-card-subtle);
}
.calendar__day {
  min-height: 120px;
  padding: var(--s-2);
  background: var(--bg-card);
  position: relative;
  transition: background var(--t-fast);
}
.calendar__day:hover { background: var(--bg-card-hover); }
.calendar__day--outside { background: var(--bg-card-subtle); opacity: 0.5; }
.calendar__day--today {
  background: linear-gradient(135deg, rgba(226,6,19,0.08), rgba(240,115,33,0.04));
  box-shadow: inset 0 0 0 2px var(--au-rot), var(--glow-rot);
}
[data-theme="dark"] .calendar__day--today {
  background: linear-gradient(135deg, rgba(255,31,46,0.12), rgba(240,115,33,0.06));
  box-shadow: inset 0 0 0 2px var(--au-rot), 0 0 40px -8px var(--au-rot);
}
.calendar__day-num {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted);
  margin-bottom: 6px;
}
.calendar__day-num--today { color: var(--au-rot); font-size: 14px; }
.calendar__post {
  display: block;
  padding: 6px 9px;
  border-radius: var(--r-sm);
  font-size: 11px;
  font-weight: 600;
  margin-bottom: 4px;
  cursor: pointer;
  background: var(--bg-card-subtle);
  border-left: 3px solid var(--post-color, var(--au-rot));
  color: var(--text-primary);
  transition: all var(--t-fast);
  line-height: 1.3;
}
.calendar__post:hover {
  transform: translateX(3px);
  background: var(--bg-card-hover);
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
[data-theme="dark"] .calendar__post:hover { box-shadow: 0 0 12px var(--post-color, var(--au-rot)); }

/* ============================================================
   POST-CARDS · differenzierte Neon-Glow-Kacheln je Kategorie
   ============================================================ */
.posts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--s-5);
}

.post-card {
  position: relative;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-xl);
  padding: var(--s-5);
  cursor: pointer;
  transition: all var(--t-base);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
  min-height: 220px;
}
/* Farbiges Header-Band oben */
.post-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 5px;
  background: linear-gradient(90deg, var(--post-color, var(--au-rot)), transparent);
}
/* Radialer Farbschein (dezenter) */
.post-card::after {
  content: "";
  position: absolute;
  top: -40%; right: -30%;
  width: 280px; height: 280px;
  background: radial-gradient(circle, var(--post-color, var(--au-rot)) 0%, transparent 60%);
  opacity: 0.05;
  pointer-events: none;
  transition: opacity var(--t-base);
}
.post-card:hover {
  transform: translateY(-6px);
  border-color: var(--post-color, var(--au-rot));
  box-shadow: var(--shadow-lg), 0 0 32px -8px var(--post-color, var(--au-rot));
}
.post-card:hover::after { opacity: 0.12; }
[data-theme="dark"] .post-card:hover {
  box-shadow: var(--shadow-lg), 0 0 48px -8px var(--post-color, var(--au-rot));
}
.post-card__head {
  display: flex;
  gap: var(--s-2);
  font-size: 11px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  flex-wrap: wrap;
}
.post-card__title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--text-heading);
  line-height: 1.3;
  position: relative;
  z-index: 1;
  padding-right: 28px;
}
.post-card__star {
  position: absolute;
  top: var(--s-3);
  right: var(--s-3);
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: none;
  background: transparent;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  color: var(--text-muted);
  transition: transform 150ms cubic-bezier(0.2, 0, 0.2, 1), color 150ms;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}
.post-card__star:hover {
  transform: scale(1.15);
  color: #f5a04c;
}
.post-card__star--on {
  color: #f5a04c;
  text-shadow: 0 0 8px rgba(245,160,76,0.4);
}
.post-card__star:focus-visible {
  outline: 2px solid var(--au-rot);
  outline-offset: 2px;
}
.post-card__meta {
  display: flex;
  gap: var(--s-3);
  font-size: 12px;
  color: var(--text-muted);
  align-items: center;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: var(--s-2);
  border-top: 1px solid var(--border-soft);
  position: relative;
  z-index: 1;
}
.post-card__platforms { display: flex; gap: 4px; }
.pl-badge {
  padding: 3px 9px;
  border-radius: var(--r-sm);
  font-size: 10px;
  font-weight: 700;
  color: #fff;
  background: var(--pl-color, var(--au-rot));
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
[data-theme="dark"] .pl-badge { box-shadow: 0 0 10px var(--pl-color, var(--au-rot)); }

/* ============================================================
   STATUS-BADGE
   ============================================================ */
.status-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 11px;
  border-radius: var(--r-full);
  font-size: 11px;
  font-weight: 700;
  background: var(--status-bg, var(--bg-card-subtle));
  color: var(--status-color, var(--text-muted));
  border: 1px solid var(--status-border, var(--border-soft));
}
.status-badge__dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--status-color, var(--au-rot));
  box-shadow: 0 0 6px var(--status-color, var(--au-rot));
}

/* ============================================================
   LIST-TABLE
   ============================================================ */
.list-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-card);
  border-radius: var(--r-xl);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--border-soft);
}
.list-table th, .list-table td {
  text-align: left;
  padding: 13px 16px;
  font-size: 13px;
  border-bottom: 1px solid var(--border-soft);
}
.list-table th {
  background: var(--bg-card-subtle);
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  position: sticky; top: 0;
}
.list-table tr { cursor: pointer; transition: background var(--t-fast); }
.list-table tr:hover { background: var(--bg-card-hover); }
[data-theme="dark"] .list-table tr:hover { box-shadow: inset 3px 0 0 var(--au-rot); }
.list-table tr:last-child td { border-bottom: none; }

/* ============================================================
   MODAL · mit tiefem Glow-Shadow
   ============================================================ */
.modal-overlay {
  position: fixed; inset: 0;
  background: rgba(10, 15, 31, 0.72);
  backdrop-filter: blur(8px);
  display: grid; place-items: center;
  padding: var(--s-6);
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--t-base), visibility var(--t-base);
}
.modal-overlay--open { opacity: 1; visibility: visible; }
.modal {
  background: var(--bg-card);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-xl);
  max-width: 920px;
  width: 100%;
  max-height: 90vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--shadow-xl), 0 0 80px rgba(226, 6, 19, 0.15);
  transform: scale(0.96);
  transition: transform var(--t-base);
}
[data-theme="dark"] .modal { box-shadow: var(--shadow-xl), 0 0 100px rgba(255, 31, 46, 0.25); }
.modal-overlay--open .modal { transform: scale(1); }
.modal__head {
  padding: var(--s-5) var(--s-6);
  border-bottom: 1px solid var(--border-soft);
  background: linear-gradient(135deg, var(--bg-card-subtle), var(--bg-card));
  display: flex;
  gap: var(--s-4);
  align-items: flex-start;
}
.modal__title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 24px;
  color: var(--text-heading);
  line-height: 1.25;
  flex: 1;
}
.modal__close {
  background: transparent;
  border: none;
  font-size: 26px;
  color: var(--text-muted);
  padding: 4px 12px;
  border-radius: var(--r-md);
  transition: all var(--t-fast);
}
.modal__close:hover { background: var(--bg-card-subtle); color: var(--au-rot); }
.modal__body { padding: var(--s-5) var(--s-6); overflow-y: auto; flex: 1; }

.tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--border-soft);
  margin-bottom: var(--s-4);
}
.tab {
  background: transparent;
  border: none;
  padding: 10px 18px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-muted);
  border-bottom: 2px solid transparent;
  transition: all var(--t-fast);
  border-radius: var(--r-sm) var(--r-sm) 0 0;
}
.tab--active {
  color: var(--au-rot);
  border-bottom-color: var(--au-rot);
  background: rgba(226, 6, 19, 0.06);
  box-shadow: var(--glow-rot);
}
.tab-content {
  background: var(--bg-card-subtle);
  border-radius: var(--r-md);
  padding: var(--s-5);
  font-size: 14px;
  line-height: 1.7;
  white-space: pre-line;
  color: var(--text-primary);
  border-left: 3px solid var(--tab-color, var(--au-rot));
  min-height: 200px;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.05);
}
[data-theme="dark"] .tab-content { box-shadow: inset 0 0 20px rgba(0,0,0,0.3); }
.tab-content__meta {
  display: flex;
  gap: var(--s-3);
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: var(--s-3);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  flex-wrap: wrap;
}

.hashtag-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--s-4); }
.hashtag {
  padding: 4px 12px;
  border-radius: var(--r-full);
  background: rgba(226, 6, 19, 0.08);
  color: var(--au-rot);
  font-size: 12px;
  font-weight: 700;
  border: 1px solid rgba(226, 6, 19, 0.18);
  transition: all var(--t-fast);
}
.hashtag:hover { background: var(--au-rot); color: #fff; transform: translateY(-1px); box-shadow: var(--glow-rot); }
[data-theme="dark"] .hashtag { background: rgba(255, 31, 46, 0.15); border-color: rgba(255, 31, 46, 0.3); }

.info-box {
  background: var(--bg-card-subtle);
  border-left: 3px solid var(--au-rot);
  padding: var(--s-4) var(--s-5);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  margin-top: var(--s-4);
  box-shadow: var(--shadow-sm);
}
.info-box__label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.info-box__text { font-size: 13px; color: var(--text-primary); line-height: 1.6; }

/* ============================================================
   TOAST
   ============================================================ */
.toast-stack {
  position: fixed;
  bottom: var(--s-6);
  right: var(--s-6);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  pointer-events: none;
}
.toast {
  padding: 13px 20px;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-lg);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-primary);
  min-width: 240px;
  max-width: 400px;
  border-left: 3px solid var(--toast-color, var(--au-rot));
  animation: toastIn 300ms cubic-bezier(0.34, 1.56, 0.64, 1);
  pointer-events: auto;
}
[data-theme="dark"] .toast { box-shadow: var(--shadow-lg), 0 0 30px -10px var(--toast-color, var(--au-rot)); }
@keyframes toastIn { from { transform: translateX(100%) scale(0.9); opacity: 0; } to { transform: translateX(0) scale(1); opacity: 1; } }
.toast--success { --toast-color: var(--accent-gruen); }
.toast--error { --toast-color: var(--au-rot); }
.toast--info { --toast-color: var(--accent-blau); }

/* ============================================================
   EMPTY STATE
   ============================================================ */
.empty { padding: var(--s-12) var(--s-6); text-align: center; color: var(--text-muted); }
.empty__icon { font-size: 56px; margin-bottom: var(--s-4); opacity: 0.3; }
.empty__title { font-family: var(--font-display); font-size: 20px; font-weight: 700; color: var(--text-heading); margin-bottom: var(--s-2); }
.empty__desc { font-size: 14px; max-width: 400px; margin: 0 auto; }

/* ============================================================
   COMMAND PALETTE
   ============================================================ */
.cmd-overlay {
  position: fixed; inset: 0;
  background: rgba(10, 15, 31, 0.6);
  backdrop-filter: blur(10px);
  display: none;
  z-index: 2000;
  padding-top: 14vh;
}
.cmd-overlay--open { display: block; }
.cmd {
  max-width: 640px;
  margin: 0 auto;
  background: var(--bg-card);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-xl);
  box-shadow: var(--shadow-xl), 0 0 80px rgba(226, 6, 19, 0.25);
  overflow: hidden;
}
[data-theme="dark"] .cmd { box-shadow: var(--shadow-xl), 0 0 100px rgba(255, 31, 46, 0.35); }
.cmd__input {
  width: 100%;
  padding: var(--s-5) var(--s-6);
  border: none;
  background: transparent;
  color: var(--text-primary);
  font-family: inherit;
  font-size: 17px;
  border-bottom: 1px solid var(--border-soft);
}
.cmd__input:focus { outline: none; }
.cmd__results { max-height: 420px; overflow-y: auto; padding: var(--s-2); }
.cmd__item {
  padding: 11px 15px;
  cursor: pointer;
  border-radius: var(--r-md);
  font-size: 14px;
  color: var(--text-primary);
  display: flex;
  gap: var(--s-3);
  align-items: center;
  transition: all var(--t-fast);
}
.cmd__item:hover, .cmd__item--active { background: var(--bg-card-hover); color: var(--au-rot); box-shadow: var(--glow-rot); }
.cmd__item-meta { margin-left: auto; font-size: 11px; color: var(--text-muted); }

/* ============================================================
   UTILITY · Responsive · Print
   ============================================================ */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--s-4); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-4); }

/* ============================================================
   MOBILE · Burger-Nav + Responsive Breakpoints (22.04.2026)
   ============================================================ */
.nav-burger {
  display: none;
  width: 44px; height: 44px;
  border: 1px solid var(--border-soft);
  background: var(--bg-card);
  border-radius: var(--r-md);
  align-items: center; justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
  transition: background 150ms, border-color 150ms;
}
.nav-burger:hover { border-color: var(--au-rot); }
.nav-burger:focus-visible { outline: 2px solid var(--au-rot); outline-offset: 2px; }
.nav-burger__lines {
  display: block;
  width: 22px; height: 2px;
  background: var(--au-rot);
  position: relative;
  transition: background 150ms;
}
.nav-burger__lines::before,
.nav-burger__lines::after {
  content: "";
  position: absolute; left: 0;
  width: 22px; height: 2px;
  background: var(--au-rot);
  transition: transform 250ms ease;
}
.nav-burger__lines::before { top: -7px; }
.nav-burger__lines::after { top: 7px; }
body.nav-open .nav-burger__lines { background: transparent; }
body.nav-open .nav-burger__lines::before { transform: translateY(7px) rotate(45deg); }
body.nav-open .nav-burger__lines::after { transform: translateY(-7px) rotate(-45deg); }

.nav-backdrop {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 200;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  animation: nav-fade 200ms ease;
}
@keyframes nav-fade { from { opacity: 0; } to { opacity: 1; } }
body.nav-open { overflow: hidden; }
body.nav-open .nav-backdrop { display: block; }

/* ---- Tablet und kleiner (≤960px) ---- */
@media (max-width: 960px) {
  .app { grid-template-columns: 1fr; grid-template-areas: "header" "main"; }
  .main { padding: var(--s-4); }
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .page-header__title { font-size: 26px; }
  .kpi-card__value { font-size: 36px; }

  .sidebar {
    display: flex !important;
    position: fixed !important;
    top: 0; left: 0; bottom: 0;
    width: min(280px, 85vw);
    height: 100vh;
    z-index: 210;
    transform: translateX(-100%);
    transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 10px 0 40px rgba(0,0,0,0.25);
    overflow-y: auto;
  }
  body.nav-open .sidebar { transform: translateX(0); }

  .nav-burger { display: inline-flex; }
}

/* ---- Große Handys + kleine Tablets (≤640px) ---- */
@media (max-width: 640px) {
  .header {
    padding: 0 var(--s-3);
    gap: var(--s-2);
    min-height: var(--header-h);
  }
  .header__title { font-size: 17px; }
  .header__subtitle { display: none; }
  .header__spacer { display: none; }
  .search { min-width: 0; flex: 1 1 120px; order: 10; width: 100%; }
  .search__input { font-size: 14px; }
  .search__shortcut { display: none; }

  .main { padding: var(--s-3); }
  .page-header__title { font-size: 22px; }

  /* Dashboard-Hero 1-spaltig */
  .dashboard-hero {
    grid-template-columns: 1fr;
    padding: var(--s-4);
    gap: var(--s-3);
    border-radius: var(--r-lg);
  }
  .hero-right { align-items: flex-start; }

  /* Factory-Hero kompakter */
  .factory-hero { padding: var(--s-4); }
  .factory-hero__title { font-size: 28px !important; }

  /* Alle Haupt-Grids 1-Spalte */
  .factory-feed,
  .upcoming-group__cards,
  .posts-grid,
  .news-grid,
  .events-grid { grid-template-columns: 1fr !important; }

  /* Kanban bleibt horizontal-scroll */
  .kanban { grid-template-columns: repeat(7, 260px); gap: var(--s-2); }

  /* Modals near-fullscreen */
  .modal-overlay { padding: 0; align-items: stretch; }
  .modal {
    max-width: 100% !important;
    width: 100% !important;
    max-height: 100vh !important;
    height: 100vh;
    border-radius: 0 !important;
    overflow-y: auto;
  }

  /* Touch-Targets min 44×44 (WCAG 2.2 AA) */
  .btn, .btn--icon, .nav__item, .factory-filter, .filter-bar__btn,
  .tab, .chip, .pl-badge-select { min-height: 44px; }
  .btn--icon { width: 44px; }

  /* KPI-Cards 2-spaltig */
  .dashboard-grid,
  .dashboard-grid--top { grid-template-columns: 1fr 1fr !important; gap: var(--s-2) !important; }
  .kpi-card { padding: var(--s-3); }
  .kpi-card__value { font-size: 28px; }

  /* Command-Palette Button kompakt */
  #btn-cmd span { display: none; }
  #btn-cmd { padding: 0 12px; min-width: 44px; }

  /* Factory-Filter wrap + scroll */
  .factory-filters { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* List-View Tabelle horizontal scrollen */
  .list-table-wrap, .list-table { overflow-x: auto; display: block; }
}

/* ---- Mittlere Handys (≤480px) ---- */
@media (max-width: 480px) {
  :root { --header-h: 60px; }

  .header {
    gap: var(--s-1);
    padding: var(--s-2) var(--s-3);
    flex-wrap: wrap;
    align-items: center;
    min-height: auto;
    padding-bottom: var(--s-2);
  }
  .header__title { font-size: 15px; }
  .search__input { padding-left: 34px; font-size: 13px; }

  /* Hero-Block noch kompakter */
  .dashboard-hero { padding: var(--s-3); }
  .hero-greeting { font-size: 14px; }
  .hero-greeting__name { font-size: 22px !important; }
  .hero-banner__title { font-size: 26px !important; }

  /* KPI-Cards bleiben 2-spaltig aber Value kleiner */
  .kpi-card__value { font-size: 24px; }
  .kpi-card__label { font-size: 10px; }

  /* Factory-Stats 2-spaltig */
  .factory-hero__stats { grid-template-columns: 1fr 1fr !important; }

  /* Post-Editor 1-spaltig */
  .post-editor__sections,
  .post-editor__grid { grid-template-columns: 1fr !important; }

  /* Kalender-Grid auf Mobile 1-Spalte pro Tag (scroll) */
  .calendar__grid { overflow-x: auto; }
}

/* ---- Kleine Handys (iPhone SE etc., ≤380px) ---- */
@media (max-width: 380px) {
  .header__title { font-size: 14px; }
  .page-header__title { font-size: 18px; }
  .dashboard-grid,
  .dashboard-grid--top { grid-template-columns: 1fr !important; }
  .kpi-card__value { font-size: 28px; }
  .factory-hero__stats { grid-template-columns: 1fr !important; }
  .factory-hero__title { font-size: 24px !important; }
}

@media print {
  @page { size: A4; margin: 15mm; }
  .sidebar, .header, .filter-bar, .btn, .modal-overlay, .toast-stack, .cmd-overlay,
  .post-card__star, .custom-badge { display: none !important; }
  .main { padding: 0; max-height: none; overflow: visible; }
  body { background: #fff !important; color: #000 !important; font-size: 10pt; }
  .app { grid-template-columns: 1fr; grid-template-areas: "main"; background: #fff !important; }
  .view { display: block !important; }

  /* Kopfzeile pro Druckseite */
  .view::before {
    content: "AKADEMIE ÜBERLINGEN · Mit Kompetenz zur Stelle. · Content-Plan 05.05.–31.07.2026";
    display: block;
    font-family: "Merriweather", serif;
    font-size: 9pt;
    font-weight: 700;
    color: #e20613;
    padding-bottom: 6pt;
    border-bottom: 2pt solid #e20613;
    margin-bottom: 10pt;
  }

  .page-header__title { font-family: "Merriweather", serif; font-size: 18pt; color: #000; margin: 0 0 3pt; }
  .page-header__sub { font-size: 9pt; color: #555; margin-bottom: 10pt; }

  /* Post-Cards kompakt und seitengerecht */
  .posts-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 6mm !important; }
  .post-card {
    break-inside: avoid; page-break-inside: avoid;
    border: 1pt solid #999 !important; border-left: 3pt solid var(--post-color, #e20613) !important;
    background: #fff !important; box-shadow: none !important;
    padding: 4mm !important; border-radius: 2pt !important;
    min-height: auto !important;
  }
  .post-card__title { font-size: 11pt !important; padding-right: 0 !important; color: #000 !important; }
  .post-card__head { font-size: 8pt !important; }
  .post-card__meta { font-size: 8pt !important; }
  .pl-badge { padding: 1pt 5pt !important; font-size: 7pt !important; }
  .status-badge { font-size: 7pt !important; padding: 1pt 5pt !important; }

  /* KPI-Kacheln flach */
  .dashboard-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 4mm !important; margin-bottom: 6mm; }
  .kpi-card { background: #faf6e5 !important; box-shadow: none !important; padding: 3mm !important; border: 0.5pt solid #ccc !important; }
  .kpi-card__label { font-size: 7pt !important; }
  .kpi-card__value { font-size: 18pt !important; }
  .kpi-card__delta { font-size: 8pt !important; }

  /* Liste-Tabelle kompakt */
  .list-table { font-size: 8pt !important; }
  .list-table th { background: #e20613 !important; color: #fff !important; padding: 3pt 5pt !important; }
  .list-table td { padding: 3pt 5pt !important; border-bottom: 0.5pt solid #ddd !important; }

  /* Links nicht voll ausdrucken */
  a::after { content: "" !important; }

  /* Footer pro Seite */
  .view::after {
    content: "Seite " counter(page);
    display: block;
    text-align: right;
    font-size: 8pt;
    color: #888;
    margin-top: 10pt;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* Sales-Kanban-Layout */
.kanban {
  display: grid;
  grid-template-columns: repeat(7, minmax(220px, 1fr));
  gap: var(--s-3);
  overflow-x: auto;
  padding-bottom: var(--s-3);
}
.kanban__col {
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-top: 3px solid var(--stage-color, var(--au-rot));
  border-radius: var(--r-md);
  padding: var(--s-3);
  min-width: 220px;
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
}
.kanban__col-head {
  display: flex; align-items: center; gap: var(--s-2);
  font-size: 12px;
  font-weight: 700;
  color: var(--text-primary);
}
.kanban__col-dot { width: 8px; height: 8px; border-radius: 50%; }
.kanban__col-title { flex: 1; }
.kanban__col-count {
  background: var(--stage-color);
  color: #fff;
  font-size: 11px;
  padding: 1px 8px;
  border-radius: var(--r-full);
  font-weight: 700;
}
.kanban__col-sum { font-size: 11px; color: var(--text-muted); font-weight: 600; }
.kanban__col-body { display: flex; flex-direction: column; gap: var(--s-2); min-height: 40px; }
.kanban__empty {
  text-align: center;
  color: var(--text-muted);
  font-size: 12px;
  padding: var(--s-3);
  opacity: 0.5;
}
.lead-card {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-left: 3px solid var(--stage-color, var(--au-rot));
  border-radius: var(--r-sm);
  padding: var(--s-3);
  cursor: pointer;
  transition: all var(--t-fast);
  display: flex;
  flex-direction: column;
  gap: 4px;
  box-shadow: var(--shadow-sm);
}
.lead-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: var(--stage-color, var(--au-rot));
}
.lead-card--overdue { border-left-color: var(--au-rot); background: linear-gradient(90deg, rgba(226,6,19,0.04), var(--bg-card)); }
.lead-card__type { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.lead-card__name { font-size: 13px; font-weight: 700; color: var(--text-primary); line-height: 1.3; }
.lead-card__contact { font-size: 12px; color: var(--text-muted); }
.lead-card__meta { display: flex; gap: var(--s-2); font-size: 11px; color: var(--text-muted); }
.lead-card__value { font-weight: 700; color: var(--text-primary); }
.lead-card__prob { opacity: 0.7; }
.lead-card__next { font-size: 11px; color: var(--text-muted); line-height: 1.35; padding-top: 4px; border-top: 1px dashed var(--border-soft); margin-top: 4px; }
.lead-card__date { font-size: 10px; color: var(--text-muted); font-weight: 600; }
.lead-card__date--overdue { color: var(--au-rot); font-weight: 700; }

/* Kanban responsive: auf kleineren Screens horizontal scrollen statt komprimieren */
@media (max-width: 1400px) {
  .kanban { grid-template-columns: repeat(7, 220px); }
}

/* Datum-Hint (Feiertag/Wochenende/Ferien im Editor) */
.date-hint { margin-top: 6px; display: flex; flex-direction: column; gap: 4px; }
.date-hint:empty { display: none; }
.date-hint__item {
  font-size: 11px;
  padding: 4px 8px;
  border-radius: var(--r-sm);
  display: inline-block;
  line-height: 1.4;
}
.date-hint__item--holiday { background: rgba(226,6,19,0.12); color: var(--au-rot); font-weight: 600; }
.date-hint__item--weekend { background: rgba(139,92,246,0.10); color: #7c3aed; }
.date-hint__item--school { background: rgba(82,171,176,0.12); color: #2d7a80; }
[data-theme="dark"] .date-hint__item--school { color: #52abb0; }

/* ============================================================
   DASHBOARD · HERO-BANNER + PIPELINE + MIX + IG-GRID + PULSE
   ============================================================ */

/* Hero-Container · 2-Spalten mit Ring */
.dashboard-hero {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--s-5);
  align-items: center;
  padding: var(--s-5) var(--s-6);
  margin-bottom: var(--s-5);
  border-radius: var(--r-xl);
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 18%, rgba(240,115,33,0.22), transparent 55%),
    radial-gradient(circle at 88% 82%, rgba(226,6,19,0.22), transparent 55%),
    radial-gradient(circle at 50% 100%, rgba(23,68,118,0.15), transparent 60%),
    linear-gradient(135deg, #ffffff 0%, #fff8e5 60%, #ffe8d0 100%);
  border: 1px solid rgba(226,6,19,0.2);
  box-shadow: var(--shadow-lg), 0 0 40px -10px rgba(226,6,19,0.2);
}
.dashboard-hero::before {
  content: "";
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(135deg, rgba(154,29,40,0.04) 0 2px, transparent 2px 14px);
  pointer-events: none;
  opacity: 0.6;
}
[data-theme="dark"] .dashboard-hero {
  background:
    radial-gradient(circle at 12% 18%, rgba(240,115,33,0.35), transparent 55%),
    radial-gradient(circle at 88% 82%, rgba(255,31,46,0.45), transparent 55%),
    radial-gradient(circle at 50% 100%, rgba(37,99,235,0.25), transparent 60%),
    linear-gradient(135deg, #0f172a 0%, #172240 60%, #1e2a4a 100%);
}
.hero-left { position: relative; z-index: 2; min-width: 0; }
.hero-right { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: var(--s-2); }
.hero-greeting {
  font-family: var(--font-display);
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 300;
  line-height: 1.15;
  letter-spacing: -0.015em;
  margin-bottom: var(--s-3);
  background: linear-gradient(135deg, var(--text-heading) 0%, var(--au-rot-dunkel) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
[data-theme="dark"] .hero-greeting {
  background: linear-gradient(135deg, #ffffff 0%, var(--au-rot-licht) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero-date {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--text-primary);
  font-weight: 600;
  margin-bottom: var(--s-4);
  padding: 6px 14px;
  background: rgba(255,255,255,0.6);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  backdrop-filter: blur(8px);
}
[data-theme="dark"] .hero-date { background: rgba(30,41,59,0.6); }
.hero-date__wd { color: var(--au-rot); font-weight: 700; text-transform: capitalize; }
.hero-date__sep { color: var(--text-muted); }
.hero-date__kw { background: var(--au-rot); color: #fff; padding: 1px 8px; border-radius: var(--r-full); font-size: 11px; font-weight: 800; }
.hero-summary {
  font-size: 17px;
  line-height: 1.55;
  color: var(--text-primary);
  margin-bottom: var(--s-5);
  max-width: 640px;
}
.hero-summary strong { color: var(--au-rot); font-weight: 700; font-size: 18px; }
.hero-cta { display: flex; gap: var(--s-3); flex-wrap: wrap; }
.hero-ring {
  position: relative;
  width: 112px;
  height: 112px;
  display: grid;
  place-items: center;
}
.hero-ring__svg { filter: drop-shadow(0 0 18px rgba(226,6,19,0.35)); overflow: visible; }
.hero-ring__center { position: absolute; text-align: center; }
.hero-ring__percent {
  font-family: var(--font-display);
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
  background: linear-gradient(135deg, var(--au-rot-dunkel), var(--au-rot));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero-ring__sign { font-size: 16px; font-weight: 600; margin-left: 2px; }
.hero-ring__label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.14em; color: var(--text-muted); font-weight: 700; margin-top: 2px; }
.hero-right__meta { font-size: 12px; color: var(--text-muted); text-align: center; margin-top: var(--s-2); }
.hero-right__meta strong { color: var(--au-rot); font-weight: 800; }

/* ============================================================
   Dashboard Factory-Hot Widget (CF-13)
   ============================================================ */
.dashboard-factory-hot {
  background: linear-gradient(135deg, #ffffff 0%, #fff8e8 100%);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  margin-bottom: var(--s-5);
  box-shadow: var(--shadow-sm);
  position: relative;
  overflow: hidden;
}
.dashboard-factory-hot::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #f07321, var(--au-rot), var(--au-rot-dunkel));
  opacity: 0.9;
}
.factory-hot__link {
  font-size: 12px; font-weight: 700; color: var(--au-rot);
  text-decoration: none;
}
.factory-hot__link:hover { text-decoration: underline; }
.factory-hot__list {
  display: flex; flex-direction: column; gap: 6px;
  margin-top: var(--s-3);
}
.factory-hot__item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px;
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  background: var(--bg-card);
  text-decoration: none; color: var(--text-primary);
  transition: transform 150ms, border-color 150ms, box-shadow 150ms;
  cursor: pointer;
}
.factory-hot__item:hover {
  transform: translateX(2px);
  border-color: var(--au-rot);
  box-shadow: 0 4px 12px -4px rgba(226,6,19,0.2);
}
.factory-hot__type {
  font-size: 20px;
  display: grid; place-items: center;
  width: 36px; height: 36px;
  background: color-mix(in srgb, var(--type-color, var(--au-rot)) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--type-color, var(--au-rot)) 28%, transparent);
  border-radius: 50%;
  flex-shrink: 0;
}
.factory-hot__body { flex: 1; min-width: 0; }
.factory-hot__title {
  font-size: 14px; font-weight: 700; color: var(--text-heading);
  line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.factory-hot__meta {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-top: 2px; font-size: 11px; color: var(--text-muted);
}
.factory-hot__author { font-weight: 700; }
.factory-hot__chips { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.factory-hot__rx {
  font-size: 11px;
  padding: 1px 6px;
  background: var(--bg-card-subtle);
  border-radius: var(--r-full);
  font-variant-numeric: tabular-nums;
}
.factory-hot__rx--muted { color: var(--text-muted); font-style: italic; }
.factory-hot__arrow {
  font-size: 18px; color: var(--text-muted);
  transition: transform 150ms, color 150ms;
  flex-shrink: 0;
}
.factory-hot__item:hover .factory-hot__arrow { transform: translateX(2px); color: var(--au-rot); }

/* ============================================================
   Factory URL-Auto-Preview im Create-Modal (CF-14)
   ============================================================ */
.ff-og-preview {
  margin-top: 8px;
  animation: lt-fade 200ms ease-out;
}
.ff-og-loading, .ff-og-hint {
  padding: 8px 12px;
  font-size: 12px;
  color: var(--text-muted);
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  font-style: italic;
}
.ff-og-card {
  display: flex; gap: 12px;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  background: var(--bg-card);
}
.ff-og__image {
  width: 100px; height: 60px;
  border-radius: var(--r-sm); overflow: hidden;
  background: var(--bg-card-subtle); flex-shrink: 0;
}
.ff-og__image img { width: 100%; height: 100%; object-fit: cover; }
.ff-og-body { flex: 1; min-width: 0; }
.ff-og-title {
  font-size: 13px; font-weight: 700; color: var(--text-heading);
  line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.ff-og-desc { font-size: 11px; color: var(--text-muted); margin-top: 2px; line-height: 1.4; }
.ff-og-url {
  font-size: 10px; color: var(--au-rot); margin-top: 4px;
  font-family: ui-monospace, monospace;
}

/* ============================================================
   Content Factory — Social-Feed-Layout (Sprint F1)
   ============================================================ */
.nav__item--factory {
  background: linear-gradient(90deg, rgba(226,6,19,0.05), transparent);
  border-left: 3px solid var(--au-rot);
}
.nav__badge {
  margin-left: auto;
  background: var(--au-rot);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  padding: 2px 6px;
  border-radius: var(--r-full);
  min-width: 18px;
  text-align: center;
}

.factory-hero {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--s-5);
  align-items: center;
  padding: var(--s-7) var(--s-8);
  margin-bottom: var(--s-5);
  border-radius: var(--r-xl);
  background:
    radial-gradient(circle at 12% 20%, rgba(240,115,33,0.26), transparent 48%),
    radial-gradient(circle at 88% 75%, rgba(226,6,19,0.24), transparent 48%),
    radial-gradient(circle at 50% 120%, rgba(154,29,40,0.16), transparent 60%),
    linear-gradient(135deg, #fffdf7 0%, #fff4d9 45%, #ffe1c2 100%);
  border: 1px solid rgba(226,6,19,0.25);
  box-shadow: 0 18px 50px -16px rgba(226,6,19,0.28), 0 4px 12px -4px rgba(0,0,0,0.08);
  overflow: hidden;
}
.factory-hero__bg {
  position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(135deg, rgba(154,29,40,0.06) 0 2px, transparent 2px 14px),
    radial-gradient(circle at 90% 10%, rgba(255,255,255,0.5), transparent 40%);
  pointer-events: none;
}
[data-theme="dark"] .factory-hero {
  background:
    radial-gradient(circle at 12% 20%, rgba(240,115,33,0.4), transparent 48%),
    radial-gradient(circle at 88% 75%, rgba(255,31,46,0.38), transparent 48%),
    linear-gradient(135deg, #1a1022 0%, #2a1a2f 45%, #2f1a24 100%);
}
.factory-hero__content { position: relative; z-index: 1; min-width: 0; }
.factory-hero__eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 11px; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--au-rot-dunkel);
  padding: 6px 14px;
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(226,6,19,0.22);
  border-radius: var(--r-full);
  margin-bottom: var(--s-3);
  backdrop-filter: blur(8px);
}
.factory-hero__pulse {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--au-rot);
  box-shadow: 0 0 0 0 rgba(226,6,19,0.6);
  animation: factory-pulse 2s infinite;
}
@keyframes factory-pulse {
  0% { box-shadow: 0 0 0 0 rgba(226,6,19,0.6); }
  70% { box-shadow: 0 0 0 10px rgba(226,6,19,0); }
  100% { box-shadow: 0 0 0 0 rgba(226,6,19,0); }
}
@media (prefers-reduced-motion: reduce) { .factory-hero__pulse { animation: none; } }
.factory-hero__title {
  font-family: var(--font-display); font-weight: 300;
  font-size: clamp(30px, 4vw, 46px); line-height: 1.12; letter-spacing: -0.02em;
  margin: 0 0 10px;
  background: linear-gradient(135deg, #1a1a1a 0%, var(--au-rot-dunkel) 55%, var(--au-rot) 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.factory-hero__sub {
  color: #3a2a2a;
  font-size: 15px;
  margin: 0 0 var(--s-4);
  max-width: 640px;
  font-weight: 500;
}
[data-theme="dark"] .factory-hero__sub { color: #e5d5d5; }
.factory-hero__stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--s-3);
  max-width: 680px;
}
.factory-stat {
  padding: var(--s-3) var(--s-4);
  background: rgba(255,255,255,0.65);
  border: 1px solid rgba(226,6,19,0.15);
  border-radius: var(--r-md);
  backdrop-filter: blur(6px);
}
[data-theme="dark"] .factory-stat { background: rgba(42,26,47,0.65); border-color: rgba(255,31,46,0.25); }
.factory-stat__num {
  font-family: var(--font-display); font-weight: 700; font-size: 24px; line-height: 1;
  color: var(--au-rot);
  font-variant-numeric: tabular-nums;
}
.factory-stat__lbl {
  font-size: 11px; color: var(--text-muted);
  margin-top: 3px; font-weight: 700; letter-spacing: 0.02em;
}
.factory-hero__actions {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
  max-width: 240px;
}
.factory-hero__tip {
  font-size: 11px; color: var(--text-muted);
  text-align: right;
  line-height: 1.4;
  max-width: 220px;
}
.factory-new-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  background: rgba(255,255,255,0.25);
  margin-right: 6px;
  font-size: 16px; font-weight: 300; line-height: 1;
}
.btn--lg {
  padding: 14px 24px;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.02em;
  box-shadow: 0 8px 20px -6px rgba(226,6,19,0.4);
}
.btn--lg:hover { transform: translateY(-2px); box-shadow: 0 12px 28px -8px rgba(226,6,19,0.5); }
@media (max-width: 900px) {
  .factory-hero { grid-template-columns: 1fr; }
  .factory-hero__actions { align-items: flex-start; max-width: none; }
  .factory-hero__tip { text-align: left; }
}

.factory-filters {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: var(--s-4);
  padding: 4px;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  width: fit-content;
}
.factory-filter {
  padding: 8px 16px;
  border: none; background: transparent;
  color: var(--text-primary); font-family: inherit; font-size: 13px; font-weight: 700;
  border-radius: var(--r-full); cursor: pointer;
  transition: background 150ms, color 150ms;
}
.factory-filter:hover { background: var(--bg-card-subtle); }
.factory-filter--active {
  background: var(--au-rot); color: #ffffff;
  box-shadow: 0 2px 8px -2px rgba(226,6,19,0.35);
}

.factory-feed {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: var(--s-4);
}
.factory-loading, .factory-empty, .factory-error {
  padding: var(--s-5);
  text-align: center; color: var(--text-muted);
  font-size: 14px;
  background: var(--bg-card);
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-md);
  grid-column: 1 / -1;
}
.factory-empty { line-height: 1.6; }
.factory-error { color: var(--au-rot); border-color: rgba(226,6,19,0.3); }

.factory-card {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
  padding: 0;
  overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform 150ms, box-shadow 150ms, border-color 150ms;
}
.factory-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -10px rgba(226,6,19,0.18); border-color: rgba(226,6,19,0.28); }
.factory-card__image { width: 100%; aspect-ratio: 16/9; overflow: hidden; background: var(--bg-card-subtle); }
.factory-card__image img { width: 100%; height: 100%; object-fit: cover; }
.factory-card__head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: var(--s-4) var(--s-4) 0;  /* FIX: Label „IDEE" wurde oben beschnitten — mehr Luft */
  font-size: 11px; color: var(--text-muted);
  line-height: 1.4;
}
.factory-card__type {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 10px;                  /* +1px vertikal gegen Uppercase-Ascent-Clip */
  line-height: 1.3;                   /* explizit, sonst schneidet Uppercase bei bestimmten Schriften ab */
  background: color-mix(in srgb, var(--type-color, var(--au-rot)) 12%, transparent);
  color: var(--type-color, var(--au-rot));
  border: 1px solid color-mix(in srgb, var(--type-color, var(--au-rot)) 28%, transparent);
  border-radius: var(--r-full);
  font-weight: 800; font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase;
}
.factory-card__status {
  padding: 2px 8px; border-radius: var(--r-full);
  font-size: 10px; font-weight: 800; letter-spacing: 0.04em;
}
.factory-card__status--promoted { background: rgba(16,185,129,0.12); color: #047857; border: 1px solid rgba(16,185,129,0.3); }
.factory-card__status--discuss  { background: rgba(59,130,246,0.12); color: #1e40af; border: 1px solid rgba(59,130,246,0.3); }
.factory-card__date { margin-left: auto; font-variant: tabular-nums; }
.factory-card__title {
  font-family: var(--font-display); font-weight: 700;
  font-size: 17px; line-height: 1.3;
  margin: 8px var(--s-4) 4px;
  color: var(--text-heading);
}
.factory-card__body {
  padding: 0 var(--s-4) var(--s-3);
  font-size: 13px; color: var(--text-primary); line-height: 1.5;
  white-space: pre-wrap; word-break: break-word;
}
.factory-card__link {
  margin: 0 var(--s-4) var(--s-3);
  padding: 8px 12px;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  font-size: 12px; color: var(--text-primary);
  text-decoration: none;
  display: inline-flex; align-items: center; gap: 6px;
  width: fit-content;
}
.factory-card__link:hover { border-color: var(--au-rot); color: var(--au-rot); }
.factory-card__targets { padding: 0 var(--s-4) var(--s-3); display: flex; gap: 6px; flex-wrap: wrap; }
.factory-card__target {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10px; font-weight: 700; padding: 3px 10px 3px 4px;
  background: var(--bg-card-subtle); border: 1px solid var(--border-soft);
  border-radius: var(--r-full); color: var(--text-muted);
  line-height: 1.3;
}
.factory-card__target-badge {
  display: grid; place-items: center;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--text-muted); color: #fff;
  font-size: 10px; font-weight: 900;
  font-style: normal; line-height: 1;
}
.factory-card__target[data-p="linkedin"]  { color: #0a66c2; border-color: rgba(10,102,194,0.35); background: rgba(10,102,194,0.08); }
.factory-card__target[data-p="linkedin"] .factory-card__target-badge  { background: #0a66c2; }
.factory-card__target[data-p="facebook"]  { color: #1877f2; border-color: rgba(24,119,242,0.35); background: rgba(24,119,242,0.08); }
.factory-card__target[data-p="facebook"] .factory-card__target-badge  { background: #1877f2; }
.factory-card__target[data-p="instagram"] { color: #b5296c; border-color: rgba(225,48,108,0.35); background: rgba(225,48,108,0.08); }
.factory-card__target[data-p="instagram"] .factory-card__target-badge {
  background: linear-gradient(135deg, #f77737 0%, #e1306c 50%, #833ab4 100%);
}
.factory-card__foot {
  padding: var(--s-3) var(--s-4);
  border-top: 1px solid var(--border-soft);
  display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap;
}
.factory-card__author { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; }
.factory-card__avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: linear-gradient(135deg, var(--au-rot), var(--au-rot-dunkel));
  color: #fff; display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 700; font-size: 11px;
  flex-shrink: 0;
}
.factory-card__by { font-size: 12px; font-weight: 700; color: var(--text-heading); line-height: 1.1; }
.factory-card__email { font-size: 10px; color: var(--text-muted); }
.factory-card__reactions { display: flex; gap: 4px; flex-shrink: 0; }
.factory-react {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 4px 8px;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  font-family: inherit; font-size: 11px; font-weight: 700;
  color: var(--text-primary); cursor: pointer;
  transition: transform 150ms, background 150ms, border-color 150ms;
}
.factory-react:hover { transform: scale(1.08); }
.factory-react--active {
  background: rgba(226,6,19,0.12);
  border-color: var(--au-rot);
  color: var(--au-rot);
}
.factory-react__icon { font-size: 14px; line-height: 1; }
.factory-react__count { font-variant: tabular-nums; min-width: 10px; text-align: center; }
.factory-card__actions {
  display: flex; gap: 8px; padding: 0 var(--s-4) var(--s-3);
  justify-content: flex-end; flex-wrap: wrap;
}
.btn--sm { padding: 6px 12px; font-size: 12px; }

/* --- Delete-Button (oben rechts, dezent, nur für Autor/in + Admin) ---------- */
.factory-card { position: relative; }
.factory-card__delete {
  position: absolute;
  top: 8px; right: 8px;
  z-index: 2;
  width: 28px; height: 28px;
  border: 1px solid transparent;
  border-radius: 50%;
  background: rgba(255,255,255,0.75);
  backdrop-filter: blur(4px);
  color: var(--text-muted);
  font-size: 14px; line-height: 1;
  cursor: pointer;
  display: grid; place-items: center;
  opacity: 0; /* erscheint erst beim Hover / Fokus */
  transition: opacity 150ms, background 150ms, color 150ms, border-color 150ms;
}
.factory-card:hover .factory-card__delete,
.factory-card:focus-within .factory-card__delete {
  opacity: 1;
}
.factory-card__delete:hover,
.factory-card__delete:focus-visible {
  background: var(--au-rot);
  color: #fff;
  border-color: var(--au-rot-dunkel);
  outline: none;
}

/* --- Plattform-Theming (data-platform=linkedin|facebook|instagram|multi) --- */
.factory-card[data-platform="linkedin"] {
  border-top: 3px solid #0a66c2;
}
.factory-card[data-platform="linkedin"]:hover {
  border-color: #0a66c2;
  box-shadow: 0 10px 24px -10px rgba(10,102,194,0.30);
}
.factory-card[data-platform="linkedin"] .factory-card__avatar {
  background: linear-gradient(135deg, #0a66c2, #004182);
}

.factory-card[data-platform="facebook"] {
  border-top: 3px solid #1877f2;
}
.factory-card[data-platform="facebook"]:hover {
  border-color: #1877f2;
  box-shadow: 0 10px 24px -10px rgba(24,119,242,0.30);
}
.factory-card[data-platform="facebook"] .factory-card__avatar {
  background: linear-gradient(135deg, #1877f2, #0b52b5);
}

.factory-card[data-platform="instagram"] {
  border-top: 3px solid transparent;
  background-image: linear-gradient(var(--bg-card), var(--bg-card)),
                    linear-gradient(90deg, #833ab4, #e1306c, #f77737);
  background-origin: border-box;
  background-clip: padding-box, border-box;
}
.factory-card[data-platform="instagram"]:hover {
  box-shadow: 0 10px 24px -10px rgba(225,48,108,0.32);
}
.factory-card[data-platform="instagram"] .factory-card__avatar {
  background: linear-gradient(135deg, #f77737, #e1306c 55%, #833ab4);
}

.factory-card[data-platform="multi"] {
  border-top: 3px solid;
  border-image: linear-gradient(90deg, #0a66c2 0%, #1877f2 40%, #e1306c 70%, #f77737 100%) 1;
}

/* Factory Detail-Modal */
.modal--factory-detail { max-width: 720px; }
.modal__title-wrap { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; }
.fd-meta {
  display: flex; align-items: center; gap: var(--s-3);
  padding: var(--s-3) 0;
  border-bottom: 1px solid var(--border-soft);
  margin-bottom: var(--s-4);
}
.fd-date { margin-left: auto; font-size: 12px; color: var(--text-muted); font-variant: tabular-nums; }
.fd-image { width: 100%; aspect-ratio: 16/9; overflow: hidden; border-radius: var(--r-md); margin-bottom: var(--s-4); background: var(--bg-card-subtle); }
.fd-image img { width: 100%; height: 100%; object-fit: cover; }
.fd-body-image {
  display: block;
  width: 100%;
  max-width: 900px;
  margin: 16px auto;
  border-radius: var(--r-md);
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}
.fd-body-text {
  font-size: 14px; line-height: 1.6; color: var(--text-primary);
  background: var(--bg-card-subtle);
  padding: var(--s-3) var(--s-4);
  border-radius: var(--r-md);
  white-space: pre-wrap; word-break: break-word;
  margin-bottom: var(--s-3);
}
.fd-reactions {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin: var(--s-4) 0;
  padding: var(--s-3) 0;
  border-top: 1px solid var(--border-soft);
  border-bottom: 1px solid var(--border-soft);
}
.factory-react--lg { padding: 8px 14px; font-size: 13px; gap: 6px; }
.factory-react--lg .factory-react__icon { font-size: 18px; }
.factory-react__label { font-weight: 700; }
.fd-section-title {
  font-family: var(--font-display); font-size: 16px; font-weight: 700;
  color: var(--text-heading);
  margin: var(--s-4) 0 var(--s-3);
}
.fd-comments { display: flex; flex-direction: column; gap: var(--s-3); margin-bottom: var(--s-4); }
.fd-comments-empty {
  padding: var(--s-4); text-align: center; color: var(--text-muted);
  font-style: italic; font-size: 13px;
  background: var(--bg-card-subtle); border-radius: var(--r-md);
}
.fd-comment { display: flex; gap: 10px; }
.fd-comment__avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: linear-gradient(135deg, #174476, #1e40af);
  color: #fff; display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 700; font-size: 11px;
  flex-shrink: 0;
}
.fd-comment__body {
  flex: 1; min-width: 0;
  background: var(--bg-card-subtle);
  padding: 8px 12px;
  border-radius: var(--r-md);
}
.fd-comment__head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; font-size: 12px; flex-wrap: wrap; }
.fd-comment__head strong { color: var(--text-heading); }
.fd-comment__email { color: var(--text-muted); font-size: 11px; }
.fd-comment__date { margin-left: auto; color: var(--text-muted); font-size: 11px; font-variant: tabular-nums; }
.fd-comment__del {
  background: transparent; border: none; cursor: pointer;
  font-size: 14px; padding: 2px 4px;
  border-radius: var(--r-sm);
  opacity: 0.6;
}
.fd-comment__del:hover { opacity: 1; color: var(--au-rot); background: rgba(226,6,19,0.1); }
.fd-comment__text { font-size: 13px; line-height: 1.5; color: var(--text-primary); white-space: pre-wrap; word-break: break-word; }
.fd-comment-form {
  display: flex; gap: 8px; align-items: flex-end;
  margin-bottom: var(--s-4);
}
.fd-comment-form textarea { flex: 1; min-height: 60px; }
.fd-actions {
  padding-top: var(--s-4); border-top: 1px solid var(--border-soft);
  display: flex; justify-content: flex-end;
}

/* Factory Create-Modal */
.modal--factory { max-width: 640px; }
.factory-types { display: flex; gap: 10px; flex-wrap: wrap; }
.factory-type {
  flex: 1; min-width: 110px;
  cursor: pointer;
}
.factory-type input { display: none; }
.factory-type span {
  display: flex; align-items: center; justify-content: center;
  padding: 10px 14px;
  background: var(--bg-card-subtle);
  border: 2px solid var(--border-soft);
  border-radius: var(--r-md);
  font-size: 13px; font-weight: 700;
  transition: all 150ms;
}
.factory-type input:checked + span {
  background: rgba(226,6,19,0.08);
  border-color: var(--au-rot);
  color: var(--au-rot);
}
.factory-error {
  margin-top: 8px; padding: 10px 12px;
  background: rgba(226,6,19,0.08);
  border: 1px solid rgba(226,6,19,0.25);
  border-radius: var(--r-md);
  color: var(--au-rot-dunkel);
  font-size: 13px;
}
.form-hint { font-size: 11px; color: var(--text-muted); margin-top: 4px; display: block; }

/* ============================================================
   Hashtag-Suggestions grouped (P5-39)
   ============================================================ */
.hashtag-group { margin-top: 10px; }
.hashtag-group:first-child { margin-top: 8px; }
.hashtag-group__label {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 6px;
}
.hashtag-group__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.hashtag-suggestion {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
  font-family: inherit;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  color: var(--text-primary);
  cursor: pointer;
  transition: background 150ms, border-color 150ms, transform 150ms, color 150ms;
}
.hashtag-suggestion:hover {
  background: rgba(226,6,19,0.1);
  border-color: var(--au-rot);
  color: var(--au-rot);
  transform: translateY(-1px);
}

/* ============================================================
   WCAG 2.2 AA Focus-Styles (P4-32) — Keyboard-only, sichtbar auf allem
   ============================================================ */
*:focus-visible {
  outline: 2px solid var(--au-rot);
  outline-offset: 2px;
  border-radius: 3px;
  box-shadow: 0 0 0 4px rgba(226,6,19,0.18);
  transition: outline-offset 120ms, box-shadow 120ms;
}
button:focus-visible,
a:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
  outline-offset: 3px;
}
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline-offset: 0;
  border-color: var(--au-rot);
  box-shadow: 0 0 0 3px rgba(226,6,19,0.2);
}
/* Spezifische Overrides für Elemente mit eigenem Fokus-Look */
.factory-react:focus-visible,
.factory-filter:focus-visible,
.btn-grammar:focus-visible,
.lt-repl:focus-visible {
  outline-offset: 2px;
}
/* Mouse-Click-Fokus soll NICHT den Ring zeigen */
:focus:not(:focus-visible) { outline: none; box-shadow: none; }
/* Skip-to-Main (für Screenreader) */
.skip-to-main {
  position: absolute;
  top: -40px;
  left: 8px;
  background: var(--au-rot);
  color: #fff;
  padding: 8px 16px;
  border-radius: var(--r-md);
  text-decoration: none;
  font-weight: 700;
  z-index: 9999;
  transition: top 150ms;
}
.skip-to-main:focus-visible {
  top: 8px;
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* ============================================================
   Empty States — Modern (P4-28)
   ============================================================ */
.empty--modern {
  padding: var(--s-6) var(--s-5);
  text-align: center;
  background: linear-gradient(135deg, var(--bg-card) 0%, var(--bg-card-subtle) 100%);
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-lg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  animation: empty-fade 300ms ease-out;
}
@keyframes empty-fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
.empty--modern .empty__icon-box {
  width: 72px; height: 72px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, rgba(226,6,19,0.08) 0%, rgba(240,115,33,0.08) 100%);
  border: 1px solid rgba(226,6,19,0.18);
  border-radius: 50%;
  margin-bottom: 4px;
}
.empty--modern .empty__icon {
  font-size: 36px;
  line-height: 1;
  filter: grayscale(0.1);
}
.empty--modern .empty__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 18px;
  color: var(--text-heading);
  margin: 0;
}
.empty--modern .empty__desc {
  font-size: 13px;
  color: var(--text-muted);
  max-width: 420px;
  line-height: 1.5;
  margin: 0;
}
.empty--modern .empty__cta {
  margin-top: 8px;
}

/* ============================================================
   Editor Autosave-Indicator (P5-42)
   ============================================================ */
.autosave-indicator {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-muted);
  padding: 4px 10px;
  border-radius: var(--r-full);
  opacity: 0;
  transition: opacity 200ms, background 200ms, color 200ms;
  user-select: none;
}
.autosave-indicator--saved {
  opacity: 1;
  color: #047857;
  background: rgba(16,185,129,0.1);
  border: 1px solid rgba(16,185,129,0.25);
}
.autosave-indicator--pulse {
  animation: autosave-pulse 800ms ease-out;
}
@keyframes autosave-pulse {
  0% { transform: scale(0.9); background: rgba(16,185,129,0.25); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); background: rgba(16,185,129,0.1); }
}
@media (prefers-reduced-motion: reduce) { .autosave-indicator--pulse { animation: none; } }

/* ============================================================
   LanguageTool Grammatik-Check (Post-Editor)
   ============================================================ */
.btn-grammar {
  margin-left: auto;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  border: 1px solid var(--border-soft);
  background: var(--bg-card);
  border-radius: var(--r-sm);
  color: var(--text-primary);
  cursor: pointer;
  transition: background 150ms, border-color 150ms, color 150ms;
  font-family: inherit;
}
.btn-grammar:hover:not(:disabled) {
  background: var(--au-rot);
  border-color: var(--au-rot);
  color: #ffffff;
}
.btn-grammar:disabled {
  opacity: 0.6;
  cursor: wait;
}
.lt-findings {
  margin-top: 8px;
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  background: var(--bg-card);
  max-height: 320px;
  overflow-y: auto;
  animation: lt-fade 200ms ease-out;
}
@keyframes lt-fade {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
.lt-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--bg-card-subtle);
  border-bottom: 1px solid var(--border-soft);
  font-size: 12px;
  color: var(--text-primary);
  position: sticky;
  top: 0;
}
.lt-close {
  margin-left: auto;
  background: transparent;
  border: none;
  font-size: 18px;
  cursor: pointer;
  color: var(--text-muted);
  padding: 0 6px;
  border-radius: var(--r-sm);
}
.lt-close:hover { color: var(--au-rot); background: rgba(226,6,19,0.08); }
.lt-loading, .lt-empty, .lt-ok, .lt-error {
  padding: 12px 16px;
  font-size: 13px;
}
.lt-ok { color: #10b981; font-weight: 700; }
.lt-error { color: var(--au-rot); }
.lt-empty { color: var(--text-muted); font-style: italic; }
.lt-list {
  display: flex;
  flex-direction: column;
}
.lt-item {
  padding: 10px 14px;
  border-bottom: 1px solid var(--border-soft);
  border-left: 3px solid var(--text-muted);
}
.lt-item:last-child { border-bottom: none; }
.lt-item--grammar { border-left-color: var(--au-rot); }
.lt-item--spelling { border-left-color: #eab308; }
.lt-item--style { border-left-color: #3b82f6; }
.lt-item--typo { border-left-color: #10b981; }
.lt-item__msg {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-heading);
  margin-bottom: 4px;
  line-height: 1.35;
}
.lt-item__excerpt {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--text-muted);
  background: var(--bg-card-subtle);
  padding: 4px 8px;
  border-radius: var(--r-sm);
  margin-bottom: 6px;
  word-break: break-word;
}
.lt-item__excerpt mark {
  background: rgba(226,6,19,0.18);
  color: var(--au-rot-dunkel);
  padding: 0 2px;
  border-radius: 3px;
  font-weight: 700;
}
.lt-item__repls {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 4px;
}
.lt-repl {
  padding: 3px 10px;
  font-size: 12px;
  font-weight: 700;
  background: rgba(16,185,129,0.12);
  border: 1px solid rgba(16,185,129,0.35);
  color: #047857;
  border-radius: var(--r-full);
  cursor: pointer;
  transition: background 150ms, transform 150ms;
  font-family: inherit;
}
.lt-repl:hover {
  background: #10b981;
  color: #ffffff;
  transform: translateY(-1px);
}
.lt-item__cat {
  font-size: 10px;
  color: var(--text-muted);
  letter-spacing: 0.04em;
}
.lt-item__cat code {
  background: var(--bg-card-subtle);
  padding: 1px 4px;
  border-radius: 3px;
  font-family: ui-monospace, monospace;
  font-size: 10px;
}

/* ============================================================
   Dashboard Bildungs-News-Card
   ============================================================ */
.dashboard-news {
  background: linear-gradient(135deg, #ffffff 0%, #fffdf5 100%);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  margin-bottom: var(--s-6);
  box-shadow: var(--shadow-sm);
  position: relative;
  overflow: hidden;
}
.dashboard-news::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--au-rot), #f07321, var(--au-rot-dunkel));
  opacity: 0.8;
}
[data-theme="dark"] .dashboard-news {
  background: linear-gradient(135deg, #1a2238 0%, #1e2a4a 100%);
}
.dashboard-news__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: var(--s-3);
  margin-bottom: var(--s-4);
}
.dashboard-news__head .dashboard-section-title {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.dashboard-news__head .dashboard-section-title::before { display: none; }
.news-icon {
  font-size: 20px;
  filter: grayscale(0.2);
}
.news-live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 0 rgba(16,185,129,0.6);
  animation: news-pulse 2s infinite;
  margin-left: 4px;
}
@keyframes news-pulse {
  0% { box-shadow: 0 0 0 0 rgba(16,185,129,0.6); }
  70% { box-shadow: 0 0 0 10px rgba(16,185,129,0); }
  100% { box-shadow: 0 0 0 0 rgba(16,185,129,0); }
}
@media (prefers-reduced-motion: reduce) {
  .news-live-dot { animation: none; }
}
.dashboard-news__meta {
  font-size: 12px;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.dashboard-news__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--s-3);
}
.news-item {
  display: flex;
  flex-direction: column;
  gap: 0;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  text-decoration: none;
  color: var(--text-primary);
  transition: transform 150ms, border-color 150ms, box-shadow 150ms;
  cursor: pointer;
  overflow: hidden;
}
.news-item:hover,
.news-item:focus-visible {
  transform: translateY(-2px);
  border-color: var(--au-rot);
  box-shadow: 0 8px 20px -6px rgba(226,6,19,0.22);
  outline: none;
}
.news-item__image {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: var(--bg-card);
  overflow: hidden;
  border-bottom: 1px solid var(--border-soft);
}
.news-item__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
.news-item:hover .news-item__image img {
  transform: scale(1.04);
}
.news-item__image--placeholder {
  background:
    linear-gradient(135deg, rgba(226,6,19,0.08) 0%, rgba(23,68,118,0.08) 100%),
    var(--bg-card);
  display: grid;
  place-items: center;
}
.news-item__image--placeholder span {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: 16px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--au-rot);
  opacity: 0.65;
}
.news-item__body {
  padding: var(--s-3) var(--s-4);
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
.news-item__badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #ffffff;
  background: var(--au-rot);
  border-radius: var(--r-full);
  width: fit-content;
}
.news-item__badge--bmbf { background: #174476; }
.news-item__badge--bibb { background: #436c59; }
.news-item__badge--google-news { background: var(--au-rot-dunkel); }
.news-item__badge--branche { background: #f07321; }
.news-item__badge--branche::before { content: "⚡ "; margin-right: 2px; }
.news-item__title {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--text-heading);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-item__meta {
  font-size: 11px;
  color: var(--text-muted);
  margin-top: auto;
}
.news-item__rel { color: var(--au-rot); font-weight: 700; }
.news-loading,
.news-empty {
  padding: var(--s-4);
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
  background: var(--bg-card-subtle);
  border-radius: var(--r-md);
}

/* ============================================================
   Sidebar User-Widget (Auth)
   ============================================================ */
.sidebar__user {
  margin-top: var(--s-4);
  padding-top: var(--s-4);
  border-top: 1px solid var(--border-soft);
}
.user-widget {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(226,6,19,0.04);
  border: 1px solid rgba(226,6,19,0.12);
  border-radius: var(--r-md);
  transition: background 150ms, border-color 150ms;
}
.user-widget:hover {
  background: rgba(226,6,19,0.08);
  border-color: rgba(226,6,19,0.22);
}
.user-widget__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--au-rot), var(--au-rot-dunkel));
  color: #ffffff;
  display: grid;
  place-items: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 14px;
  flex-shrink: 0;
  overflow: hidden;
}
.user-widget__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.user-widget__info {
  min-width: 0;
  flex: 1;
  overflow: hidden;
}
.user-widget__name {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-heading);
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
}
.user-widget__role {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--au-rot);
  color: #ffffff;
  padding: 1px 6px;
  border-radius: var(--r-full);
}
.user-widget__email {
  font-size: 11px;
  color: var(--text-muted);
  line-height: 1.2;
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.user-widget__logout {
  background: transparent;
  border: none;
  color: var(--text-muted);
  font-size: 18px;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: var(--r-sm);
  transition: background 150ms, color 150ms;
  flex-shrink: 0;
}
.user-widget__logout:hover,
.user-widget__logout:focus-visible {
  background: rgba(226,6,19,0.15);
  color: var(--au-rot);
  outline: none;
}

/* ============================================================
   Entity-Stempel (User-Stempel auf Posts/Events/Leads)
   ============================================================ */
.entity-stamp {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 6px 0;
}
.entity-stamp__avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--au-rot), var(--au-rot-dunkel));
  color: #ffffff;
  display: grid;
  place-items: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  flex-shrink: 0;
}
.entity-stamp__info {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.entity-stamp__row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}
.entity-stamp__by {
  font-weight: 700;
  color: var(--text-heading);
}
.entity-stamp__email {
  font-size: 11px;
  color: var(--text-muted);
  font-variant: tabular-nums;
}
.entity-stamp__row--meta,
.entity-stamp__row--edit {
  font-size: 11px;
  color: var(--text-muted);
}
.entity-stamp__row--edit span:first-child,
.entity-stamp__row--meta span:first-child {
  color: var(--au-rot);
  font-weight: 700;
}
.entity-stamp--seed {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 4px 0;
}
.entity-stamp--seed .entity-stamp__label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
}
.entity-stamp--seed .entity-stamp__meta {
  font-size: 11px;
  color: var(--text-muted);
  font-style: italic;
}

/* User-Stempel auf Post/Event/Lead-Cards */
.card-stamp {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--text-muted);
  padding: 4px 8px;
  background: rgba(23,68,118,0.06);
  border-radius: var(--r-full);
  border: 1px solid rgba(23,68,118,0.12);
}
.card-stamp__avatar {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--au-rot), var(--au-rot-dunkel));
  color: #ffffff;
  display: grid;
  place-items: center;
  font-size: 8px;
  font-weight: 800;
  overflow: hidden;
}
.card-stamp__avatar img { width: 100%; height: 100%; object-fit: cover; }
.card-stamp__name { font-weight: 700; color: var(--text-primary); }

/* Top-KPI-Grid (3 Kacheln) */
.dashboard-grid--top { grid-template-columns: 1fr 1fr 1fr; margin-bottom: var(--s-5); }
@media (max-width: 900px) { .dashboard-grid--top { grid-template-columns: 1fr; } }

/* Status-Pipeline-Panel */
.dashboard-pipeline {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  margin-bottom: var(--s-6);
  box-shadow: var(--shadow-sm);
}
.pipe-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: var(--s-3); }
.pipe-head__title { font-family: var(--font-display); font-size: 16px; font-weight: 700; color: var(--text-heading); }
.pipe-head__total { font-size: 12px; color: var(--text-muted); }
.pipe-bar {
  display: flex;
  height: 18px;
  border-radius: var(--r-full);
  overflow: hidden;
  background: var(--bg-card-subtle);
  margin-bottom: var(--s-3);
  border: 1px solid var(--border-soft);
}
.pipe-seg {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  min-width: 28px;
  transition: flex 500ms cubic-bezier(0.4, 0, 0.2, 1);
  border-right: 2px solid var(--bg-card);
}
.pipe-seg:last-child { border-right: none; }
.pipe-seg--empty { color: var(--text-muted); background: var(--bg-card-subtle) !important; flex: 1; }
.pipe-labels { display: flex; flex-wrap: wrap; gap: var(--s-3); }
.pipe-label { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-primary); }
.pipe-label__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--pipe-color); }
.pipe-label__txt { color: var(--text-muted); }
.pipe-label__count { font-weight: 800; color: var(--text-heading); }

/* 3-Spalten-Section-Grid */
.dashboard-section-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: var(--s-5);
}
@media (max-width: 1400px) { .dashboard-section-grid { grid-template-columns: 1fr 1fr; } .dashboard-col--pulse { grid-column: span 2; } }
@media (max-width: 900px) { .dashboard-section-grid { grid-template-columns: 1fr; } .dashboard-col--pulse { grid-column: 1; } }
.dashboard-col {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  box-shadow: var(--shadow-sm);
  display: flex;
  flex-direction: column;
}
.dashboard-section-title {
  font-family: var(--font-display);
  font-size: 17px;
  font-weight: 700;
  color: var(--text-heading);
  margin: 0 0 var(--s-3);
  display: flex;
  align-items: center;
  gap: 8px;
}
.dashboard-section-title::before {
  content: "";
  width: 4px;
  height: 16px;
  background: linear-gradient(180deg, var(--au-rot), var(--au-rot-dunkel));
  border-radius: 2px;
}

/* Kategorie-Mix-Bars (im dashboard-mix) */
#dashboard-mix { display: flex; flex-direction: column; gap: 10px; }
#dashboard-mix .mix-row { display: flex; flex-direction: column; gap: 3px; }
#dashboard-mix .mix-row__head { display: flex; align-items: center; gap: 8px; font-size: 12px; }
#dashboard-mix .mix-row__dot { width: 8px; height: 8px; border-radius: 50%; }
#dashboard-mix .mix-row__label { flex: 1; font-weight: 600; color: var(--text-primary); }
#dashboard-mix .mix-row__count { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--text-heading); }
#dashboard-mix .mix-row__pct { font-size: 11px; font-weight: 500; color: var(--text-muted); }
#dashboard-mix .mix-row__bar-bg {
  height: 8px;
  background: var(--bg-card-subtle);
  border-radius: var(--r-full);
  overflow: hidden;
}
#dashboard-mix .mix-row__bar-fill {
  height: 100%;
  border-radius: var(--r-full);
  transition: width 600ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* IG-Grid (3×3) */
.ig-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
}
.ig-tile {
  aspect-ratio: 1;
  padding: 10px;
  border-radius: var(--r-sm);
  color: #fff;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform var(--t-fast), box-shadow var(--t-fast);
  font-size: 10px;
}
.ig-tile::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0.28) 100%);
  pointer-events: none;
}
.ig-tile:hover { transform: scale(1.04); box-shadow: var(--shadow-md); z-index: 1; }
.ig-tile__date { font-weight: 700; opacity: 0.9; position: relative; z-index: 1; }
.ig-tile__label { font-family: var(--font-display); font-size: 11px; font-weight: 700; line-height: 1.2; position: relative; z-index: 1; }
.ig-tile__cat { font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.85; position: relative; z-index: 1; }
.ig-tile--empty { background: var(--bg-card-subtle) !important; border: 1px dashed var(--border-soft); cursor: default; }
.ig-tile--empty:hover { transform: none; }

/* Vertriebs-Puls */
.pulse { display: flex; flex-direction: column; gap: var(--s-2); }
.pulse-row {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-3);
  background: var(--bg-card-subtle);
  border-radius: var(--r-md);
  border-left: 3px solid var(--border-strong);
}
.pulse-row--alert { border-left-color: var(--au-rot); background: rgba(226,6,19,0.08); }
.pulse-row--warn { border-left-color: var(--accent-orange); background: rgba(240,115,33,0.08); }
.pulse-row--ok { border-left-color: var(--accent-gruen); background: rgba(16,185,129,0.08); }
.pulse-num {
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
  color: var(--text-heading);
  min-width: 40px;
  text-align: center;
}
.pulse-row--alert .pulse-num { color: var(--au-rot); }
.pulse-row--warn .pulse-num { color: var(--accent-orange); }
.pulse-row--ok .pulse-num { color: var(--accent-gruen); }
.pulse-label { font-size: 12px; color: var(--text-primary); line-height: 1.4; }
.pulse-label small { font-size: 10px; color: var(--text-muted); }

/* Mini-Event-Card */
.mini-event-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: var(--s-3);
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-left: 3px solid var(--au-rot);
  border-radius: var(--r-sm);
  cursor: pointer;
  margin-bottom: var(--s-2);
  transition: all var(--t-fast);
}
.mini-event-card:hover { transform: translateY(-1px); box-shadow: var(--shadow-sm); }
.mini-event-card__head { display: flex; justify-content: space-between; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.mini-event-card__title { font-size: 13px; font-weight: 700; color: var(--text-heading); line-height: 1.3; }

/* KPI Hero-Kachel (Dashboard #1) — bleibt OLD */
.hero-banner {
  position: relative;
  border-radius: var(--r-xl);
  padding: var(--s-8) var(--s-8);
  margin-bottom: var(--s-6);
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: var(--s-6);
  min-height: 220px;
  border: 1px solid rgba(226,6,19,0.18);
  box-shadow: var(--shadow-lg);
}
.hero-banner__bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 15% 20%, rgba(226,6,19,0.35), transparent 55%),
    radial-gradient(circle at 85% 80%, rgba(240,115,33,0.25), transparent 55%),
    radial-gradient(circle at 50% 100%, rgba(23,68,118,0.22), transparent 60%),
    linear-gradient(135deg, #fff 0%, #fdf7e4 50%, #faebd2 100%);
  z-index: 0;
}
[data-theme="dark"] .hero-banner__bg {
  background:
    radial-gradient(circle at 15% 20%, rgba(255,31,46,0.55), transparent 55%),
    radial-gradient(circle at 85% 80%, rgba(240,115,33,0.35), transparent 55%),
    radial-gradient(circle at 50% 100%, rgba(37,99,235,0.35), transparent 60%),
    linear-gradient(135deg, #0f172a 0%, #172240 50%, #1e2a4a 100%);
}
.hero-banner__pattern {
  position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(135deg, rgba(154,29,40,0.04) 0 2px, transparent 2px 14px);
  pointer-events: none;
  z-index: 1;
  opacity: 0.7;
}
.hero-banner__content {
  position: relative;
  z-index: 2;
  flex: 1;
  min-width: 0;
}
.hero-banner__eyebrow {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 700;
  color: var(--au-rot);
  margin-bottom: var(--s-3);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.hero-banner__eyebrow::before {
  content: "";
  width: 24px; height: 2px;
  background: var(--au-rot);
  border-radius: 2px;
}
.hero-banner__title {
  font-family: var(--font-display);
  font-size: 52px !important;
  font-weight: 900;
  line-height: 1.05;
  margin: 0 0 var(--s-3);
  letter-spacing: -0.025em;
  background: linear-gradient(135deg, var(--text-heading) 0%, var(--au-rot-dunkel) 90%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
[data-theme="dark"] .hero-banner__title {
  background: linear-gradient(135deg, #ffffff 0%, var(--au-rot-licht) 90%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero-banner__sub {
  font-size: 15px;
  color: var(--text-primary);
  line-height: 1.55;
  margin-bottom: var(--s-5);
}
.hero-banner__time {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}
.hero-banner__actions { display: flex; gap: var(--s-3); flex-wrap: wrap; }
.hero-banner__btn { padding: 11px 20px; font-size: 14px; }

/* Progress-Ring */
.hero-banner__ring {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  width: 140px;
  height: 140px;
  display: grid;
  place-items: center;
}
.progress-ring { transform: rotate(-90deg); overflow: visible; }
.progress-ring__track { fill: none; stroke: rgba(154,29,40,0.14); stroke-width: 8; }
.progress-ring__bar { fill: none; stroke: url(#ringGrad); stroke: var(--au-rot); stroke-width: 8; stroke-linecap: round; transition: stroke-dashoffset 800ms cubic-bezier(0.4, 0, 0.2, 1); filter: drop-shadow(0 0 6px rgba(226,6,19,0.4)); }
.hero-banner__ring-label {
  position: absolute;
  text-align: center;
  font-family: var(--font-display);
}
.hero-banner__ring-value {
  font-size: 32px;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(135deg, var(--au-rot-dunkel), var(--au-rot));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero-banner__ring-caption {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-muted);
  font-weight: 700;
  margin-top: 4px;
}

/* Status-Pipeline-Bar */
.status-pipeline {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--s-4) var(--s-5);
  margin-bottom: var(--s-5);
  box-shadow: var(--shadow-sm);
}
.status-pipeline__label {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  color: var(--text-heading);
  margin-bottom: var(--s-2);
}
.status-pipeline__total { font-size: 12px; color: var(--text-muted); font-weight: 500; }
.status-pipeline__track {
  display: flex;
  height: 12px;
  border-radius: var(--r-full);
  overflow: hidden;
  background: var(--bg-card-subtle);
  margin-bottom: var(--s-3);
}
.status-pipeline__seg {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  min-width: 24px;
  transition: width 400ms ease;
  border-right: 1px solid rgba(255,255,255,0.3);
}
.status-pipeline__seg:last-child { border-right: none; }
.status-pipeline__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-4);
  font-size: 12px;
  color: var(--text-primary);
}
.status-pipeline__lg { display: inline-flex; align-items: center; gap: 6px; }
.status-pipeline__dot { width: 8px; height: 8px; border-radius: 50%; }

/* Dashboard 2-Spalten-Split */
.dashboard-split {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: var(--s-5);
  margin-top: var(--s-6);
}
@media (max-width: 1200px) { .dashboard-split { grid-template-columns: 1fr; } }
.dashboard-split__col { display: flex; flex-direction: column; gap: var(--s-5); }

.panel {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  box-shadow: var(--shadow-sm);
}
.panel__head { margin-bottom: var(--s-4); }
.panel__title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  color: var(--text-heading);
  margin: 0;
}
.panel__sub { font-size: 12px; color: var(--text-muted); margin-top: 2px; }

/* Content-Mix-Chart */
.mix-row { display: grid; grid-template-columns: 140px 1fr 72px; align-items: center; gap: var(--s-3); padding: 6px 0; font-size: 13px; }
.mix-row__label { font-weight: 700; }
.mix-row__track {
  height: 14px;
  background: var(--bg-card-subtle);
  border-radius: var(--r-full);
  overflow: hidden;
  position: relative;
}
.mix-row__bar {
  height: 100%;
  border-radius: var(--r-full);
  transition: width 600ms cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 0 8px rgba(226,6,19,0.2) inset;
}
.mix-row__value { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; }
.mix-row__pct { font-weight: 400; color: var(--text-muted); font-size: 11px; }

/* Instagram-Preview-Grid */
.ig-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
}
.ig-tile {
  aspect-ratio: 1;
  padding: var(--s-3);
  border-radius: var(--r-sm);
  cursor: pointer;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.92), rgba(255,255,255,0.7)),
    linear-gradient(135deg, var(--ig-color), var(--ig-color)aa);
  border: 1px solid var(--border-soft);
  transition: all var(--t-fast);
}
.ig-tile::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--ig-color) 0%, var(--ig-color)22 40%, transparent 70%);
  opacity: 0.25;
  z-index: 0;
}
.ig-tile:hover { transform: scale(1.04); box-shadow: var(--shadow-md); z-index: 1; }
.ig-tile__badge {
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ig-color);
  position: relative; z-index: 1;
}
.ig-tile__title {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  color: #000;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  position: relative; z-index: 1;
}
.ig-tile__date {
  font-size: 10px;
  color: var(--text-muted);
  font-weight: 600;
  position: relative; z-index: 1;
}
[data-theme="dark"] .ig-tile {
  background: linear-gradient(135deg, rgba(30,41,59,0.9), rgba(23,33,51,0.7));
}
[data-theme="dark"] .ig-tile__title { color: #fff; }

/* ============================================================
   Dashboard-Arbeitsmarkt-Widget (BA-Stats)
   ============================================================ */
.dashboard-arbeitsmarkt { margin-bottom: var(--s-6); }
.ba-widget {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  box-shadow: var(--shadow-sm);
  position: relative;
  overflow: hidden;
}
.ba-widget::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #174476, #4a90e2, #22d3ee);
  opacity: 0.85;
}
.ba-widget__head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: var(--s-3);
  margin-bottom: var(--s-3);
  flex-wrap: wrap;
}
.ba-widget__meta { font-size: 12px; color: var(--text-muted); }
.ba-widget__switch {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-bottom: var(--s-4);
  padding: 4px;
  background: var(--bg-card-subtle);
  border-radius: var(--r-full);
  width: fit-content;
}
.ba-switch {
  padding: 6px 14px;
  border: none; background: transparent;
  color: var(--text-primary); font-family: inherit; font-size: 12px; font-weight: 600;
  border-radius: var(--r-full); cursor: pointer;
  transition: background 150ms, color 150ms;
  min-height: 32px;
}
.ba-switch:hover { background: var(--bg-card); }
.ba-switch--active {
  background: #174476; color: #fff;
  box-shadow: 0 2px 8px -2px rgba(23,68,118,0.35);
}
.ba-widget__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--s-3);
  margin-bottom: var(--s-3);
}
.ba-kpi {
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  padding: var(--s-3);
  display: flex; flex-direction: column; gap: 4px;
  min-height: 110px;
  transition: transform 150ms, box-shadow 150ms;
}
.ba-kpi:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.ba-kpi__label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); font-weight: 700; }
.ba-kpi__value {
  font-family: var(--font-display);
  font-size: 32px; font-weight: 900; color: var(--text-heading);
  line-height: 1.1;
  letter-spacing: -0.02em;
}
.ba-kpi__sub { font-size: 12px; color: var(--text-muted); }
.ba-kpi--primary {
  background: linear-gradient(135deg, rgba(23,68,118,0.06), rgba(74,144,226,0.06));
  border-color: rgba(23,68,118,0.2);
}
.ba-kpi--primary .ba-kpi__value { color: #174476; }
.ba-kpi--accent {
  background: linear-gradient(135deg, rgba(226,6,19,0.05), rgba(240,115,33,0.05));
  border-color: rgba(226,6,19,0.18);
}
.ba-kpi--accent .ba-kpi__value { color: var(--au-rot); }
.ba-kpi--skeleton { background: linear-gradient(90deg, var(--bg-card-subtle) 0%, var(--bg-card) 50%, var(--bg-card-subtle) 100%); background-size: 200% 100%; animation: skeleton-shimmer 1.4s ease-in-out infinite; }
@keyframes skeleton-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.ba-widget__foot { padding-top: var(--s-2); border-top: 1px dashed var(--border-soft); }
.ba-widget__hint { font-size: 12px; color: var(--text-muted); }
.ba-widget--error .ba-widget__error {
  padding: var(--s-4); background: rgba(226,6,19,0.05);
  border: 1px dashed rgba(226,6,19,0.3); border-radius: var(--r-md);
  display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap;
  color: var(--au-rot); font-size: 13px;
}
[data-theme="dark"] .ba-kpi--primary .ba-kpi__value { color: #60a5fa; }

@media (max-width: 700px) {
  .ba-widget__cards { grid-template-columns: 1fr; }
  .ba-widget__switch { width: 100%; overflow-x: auto; }
}

/* Hero-Mobile */
@media (max-width: 860px) {
  .hero-banner { flex-direction: column; align-items: flex-start; padding: var(--s-5); min-height: auto; }
  .hero-banner__title { font-size: 38px !important; }
  .hero-banner__ring { align-self: center; }
}

/* KPI Hero-Kachel (Dashboard #1) */
.kpi-card--hero {
  grid-column: span 2;
  background:
    radial-gradient(circle at 80% 20%, rgba(226,6,19,0.12), transparent 60%),
    linear-gradient(135deg, #ffffff 0%, #fffbea 100%);
  border-color: rgba(226,6,19,0.28);
}
.kpi-card--hero .kpi-card__label { font-size: 12px; letter-spacing: 0.1em; }
.kpi-card--hero .kpi-card__value {
  font-size: 68px;
  background: linear-gradient(135deg, var(--au-rot-dunkel) 0%, var(--au-rot) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.kpi-card--hero .kpi-card__delta { font-size: 13px; line-height: 1.5; }
[data-theme="dark"] .kpi-card--hero {
  background:
    radial-gradient(circle at 80% 20%, rgba(255,31,46,0.22), transparent 60%),
    linear-gradient(135deg, #1a2540 0%, #0f172a 100%);
}

/* Upcoming-Posts Gruppen */
.upcoming-group { margin-bottom: var(--s-6); }
.upcoming-group__label {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 var(--s-3);
  display: flex;
  align-items: center;
  gap: var(--s-2);
}
.upcoming-group__count {
  background: var(--au-rot);
  color: #fff;
  font-size: 11px;
  padding: 1px 8px;
  border-radius: var(--r-full);
  font-weight: 800;
}
.upcoming-group__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--s-4);
}

/* Tonalitäts-Check (AÜ-Redaktions-Scanner im Editor) */
.tonalitaets-check { margin-top: var(--s-2); }
.tonalitaets-check:empty { display: none; }
.tc-ok {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px;
  color: #10b981;
  padding: 4px 10px;
  background: rgba(16, 185, 129, 0.08);
  border: 1px solid rgba(16, 185, 129, 0.2);
  border-radius: var(--r-sm);
  font-weight: 600;
}
.tc-ok__icon { font-weight: 800; }
.tc-summary {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px;
  padding: 6px 10px;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-sm);
  margin-bottom: 6px;
  font-weight: 600;
}
.tc-pill {
  padding: 2px 8px;
  border-radius: var(--r-full);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.tc-pill--error { background: rgba(226,6,19,0.14); color: var(--au-rot); }
.tc-pill--warn { background: rgba(240,115,33,0.14); color: var(--accent-orange); }
.tc-finding {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
  padding: 8px 10px;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-left: 3px solid var(--tc-color, var(--au-rot));
  border-radius: var(--r-sm);
  margin-bottom: 4px;
  font-size: 12px;
}
.tc-finding--error { --tc-color: var(--au-rot); }
.tc-finding--warn { --tc-color: var(--accent-orange); }
.tc-finding--info { --tc-color: var(--accent-blau); }
.tc-finding__head { display: flex; align-items: center; gap: 6px; font-weight: 700; color: var(--text-heading); }
.tc-finding__icon { font-size: 14px; }
.tc-finding__label { flex: 1; }
.tc-finding__context { font-weight: 500; font-size: 10px; color: var(--text-muted); background: var(--bg-card-subtle); padding: 1px 6px; border-radius: var(--r-full); }
.tc-finding__count {
  background: var(--tc-color);
  color: #fff;
  padding: 1px 7px;
  border-radius: var(--r-full);
  font-size: 10px;
  font-weight: 800;
}
.tc-finding__hit { color: var(--text-muted); font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 11px; padding: 2px 0; }
.tc-finding__fix { color: var(--text-primary); font-weight: 500; line-height: 1.45; padding: 2px 0; }
.tc-finding__src { color: var(--text-muted); font-size: 10px; font-style: italic; padding-top: 2px; border-top: 1px dashed var(--border-soft); margin-top: 3px; }

/* Kalender-Special-Days (Wochenende, Feiertage, Ferien) */
.calendar__day--weekend { background: linear-gradient(180deg, rgba(90,30,30,0.03), rgba(90,30,30,0.01)); }
.calendar__day--holiday {
  background: linear-gradient(180deg, rgba(226,6,19,0.08), rgba(226,6,19,0.02));
  border-color: rgba(226,6,19,0.25);
}
.calendar__day--school:not(.calendar__day--holiday) {
  background: linear-gradient(180deg, rgba(82,171,176,0.08), rgba(82,171,176,0.02));
}
.calendar__badge {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  padding: 2px 5px;
  border-radius: var(--r-sm);
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.calendar__badge--holiday { color: var(--au-rot); background: rgba(226,6,19,0.12); }
.calendar__badge--school { color: #2d7a80; background: rgba(82,171,176,0.15); }
[data-theme="dark"] .calendar__badge--school { color: #52abb0; }

/* Mockup-Preview (Plattform-Vorschau im Modal) */
.mockup-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--s-4);
  margin-top: var(--s-4);
}
.mockup-card {
  background: #ffffff;
  border: 1px solid var(--border-soft);
  border-top: 3px solid var(--mockup-color, var(--au-rot));
  border-radius: var(--r-md);
  padding: var(--s-4);
  box-shadow: var(--shadow-sm);
  font-size: 13px;
  color: #1a1a1a;
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
  min-height: 240px;
}
.mockup-card__head { display: flex; align-items: center; gap: var(--s-3); }
.mockup-card__avatar {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--au-rot) 0%, var(--au-rot-dunkel) 100%);
  color: #fff;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 13px;
  display: grid; place-items: center;
  flex-shrink: 0;
}
.mockup-card__handle { flex: 1; min-width: 0; }
.mockup-card__name { font-weight: 700; font-size: 13px; color: #000; }
.mockup-card__sub { font-size: 11px; color: #676767; }
.mockup-card__platform { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.mockup-card__body {
  font-size: 13px;
  line-height: 1.55;
  color: #000;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 220px;
  overflow-y: auto;
}
.mockup-card__hashtags {
  color: #1877f2;
  font-size: 12px;
  line-height: 1.6;
  word-break: break-word;
}
.mockup-card__actions {
  border-top: 1px solid #e5e5e5;
  padding-top: var(--s-2);
  margin-top: auto;
  font-size: 11px;
  color: #666;
}
[data-theme="dark"] .mockup-card {
  background: #f9f9f9;
  color: #1a1a1a;
}

/* Tooltip */
[data-tooltip] { position: relative; }
[data-tooltip]:hover::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 100%; left: 50%;
  transform: translateX(-50%) translateY(-4px);
  background: var(--text-heading);
  color: var(--bg-card);
  padding: 5px 10px;
  border-radius: var(--r-sm);
  font-size: 11px;
  white-space: nowrap;
  pointer-events: none;
  z-index: 100;
  font-weight: 600;
}

/* Shortcuts-Modal Helpers */
.shortcuts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
.shortcut-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border-soft); font-size: 13px; }
kbd {
  padding: 3px 8px;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-sm);
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-size: 11px;
  color: var(--text-primary);
  box-shadow: 0 1px 0 var(--border-soft);
}

/* Skeleton-Loader */
.skeleton {
  background: linear-gradient(90deg, var(--bg-card-subtle) 0%, var(--border-soft) 50%, var(--bg-card-subtle) 100%);
  background-size: 200% 100%;
  animation: skeleton 1.4s infinite;
  border-radius: var(--r-sm);
}
@keyframes skeleton { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ============================================================
   FORM · Post-Editor
   ============================================================ */
.form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--s-4);
  margin-bottom: var(--s-5);
}
.form-field { display: flex; flex-direction: column; gap: 6px; }
.form-field--wide { grid-column: 1 / -1; }
.form-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--s-2);
}
.form-input {
  width: 100%;
  padding: 10px 14px;
  border-radius: var(--r-md);
  border: 1px solid var(--border-soft);
  background: var(--bg-input);
  color: var(--text-primary);
  font-family: inherit;
  font-size: 14px;
  transition: all var(--t-fast);
}
.form-input:focus {
  outline: none;
  border-color: var(--au-rot);
  background: var(--bg-card);
  box-shadow: 0 0 0 3px rgba(226, 6, 19, 0.15), var(--glow-rot);
}
.form-textarea { resize: vertical; min-height: 80px; font-family: var(--font-body); line-height: 1.6; }
.form-input--color { padding: 4px; height: 44px; cursor: pointer; }
.form-section {
  padding: var(--s-4) 0;
  border-top: 1px solid var(--border-soft);
  margin-top: var(--s-4);
}
.char-counter {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
  background: var(--bg-card-subtle);
  padding: 2px 8px;
  border-radius: var(--r-full);
}
.char-counter--ok { color: var(--accent-gruen); }
.char-counter--warn { color: var(--accent-orange); }
.char-counter--over { color: var(--au-rot); font-weight: 700; }

.platform-toggles {
  display: flex;
  gap: var(--s-3);
  flex-wrap: wrap;
}
.pl-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: var(--r-full);
  border: 1px solid var(--border-soft);
  background: var(--bg-card-subtle);
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  transition: all var(--t-fast);
  user-select: none;
}
.pl-toggle:hover { border-color: var(--au-rot); }
.pl-toggle input { accent-color: var(--au-rot); cursor: pointer; }
.pl-toggle:has(input:checked) {
  background: var(--bg-card);
  border-color: var(--pl-color);
  box-shadow: 0 0 14px color-mix(in srgb, var(--pl-color) 35%, transparent);
}
.pl-toggle span { color: var(--pl-color); }

.hashtag-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: var(--s-2);
}
.hashtag-suggestion {
  padding: 3px 10px;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  font-size: 11px;
  color: var(--text-muted);
  cursor: pointer;
  transition: all var(--t-fast);
}
.hashtag-suggestion:hover { color: var(--au-rot); border-color: var(--au-rot); transform: translateY(-1px); }

.form-actions {
  display: flex;
  gap: var(--s-3);
  align-items: center;
  padding-top: var(--s-5);
  border-top: 1px solid var(--border-soft);
  margin-top: var(--s-5);
  flex-wrap: wrap;
}

.custom-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  background: rgba(139, 92, 246, 0.15);
  color: #8b5cf6;
  border: 1px solid rgba(139, 92, 246, 0.3);
  border-radius: var(--r-full);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Preview-Frame (Plattform-Mockup) */
.preview-frame {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-lg);
  padding: var(--s-4);
  margin-top: var(--s-4);
  font-size: 13px;
}
.preview-frame__head {
  display: flex;
  align-items: center;
  gap: var(--s-2);
  padding-bottom: var(--s-3);
  border-bottom: 1px solid var(--border-soft);
  margin-bottom: var(--s-3);
}
.preview-frame__avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: linear-gradient(135deg, var(--au-rot), var(--au-rot-dunkel));
  color: #fff;
  display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 900; font-size: 16px;
  box-shadow: var(--glow-rot);
}

/* ============================================================
   Editor-Extensions: Trend-Indicator + Source-Archivieren (22.04.)
   ============================================================ */
.trend-indicator {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.4;
}
.trend-ind {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px;
  padding: 6px 10px;
  border-radius: var(--r-sm);
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
}
.trend-ind__arrow { font-size: 14px; font-weight: 900; }
.trend-ind__kw { font-weight: 700; color: var(--text-heading); }
.trend-ind__delta { font-weight: 600; }
.trend-ind__avg { color: var(--text-muted); font-size: 11px; }
.trend-ind__source { color: var(--text-muted); font-size: 10px; margin-left: auto; }
.trend-ind--up { border-color: rgba(16,185,129,0.3); background: rgba(16,185,129,0.06); }
.trend-ind--up .trend-ind__arrow, .trend-ind--up .trend-ind__delta { color: #10b981; }
.trend-ind--down { border-color: rgba(226,6,19,0.3); background: rgba(226,6,19,0.06); }
.trend-ind--down .trend-ind__arrow, .trend-ind--down .trend-ind__delta { color: var(--au-rot); }
.trend-ind--flat { border-color: var(--border-soft); }
.trend-ind__loading, .trend-ind__neutral, .trend-ind__error {
  display: inline-block;
  padding: 6px 10px;
  font-size: 12px;
  color: var(--text-muted);
  background: var(--bg-card-subtle);
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-sm);
}
.trend-ind__error { color: var(--au-rot); border-color: rgba(226,6,19,0.3); }

/* Wayback-Archivieren */
.btn-archive {
  margin-left: auto;
  padding: 4px 10px;
  font-size: 11px; font-weight: 700;
  border: 1px solid var(--border-soft); border-radius: var(--r-full);
  background: var(--bg-card); color: var(--text-primary);
  font-family: inherit;
  cursor: pointer;
  transition: all 150ms;
  min-height: 28px;
}
.btn-archive:hover { background: var(--au-rot); color: #fff; border-color: var(--au-rot); }
.btn-archive:disabled { opacity: 0.5; cursor: not-allowed; }
.source-archive { margin-top: 6px; font-size: 12px; }
.archive-loading, .archive-hint {
  display: inline-block;
  padding: 6px 10px;
  background: var(--bg-card-subtle);
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-sm);
  color: var(--text-muted);
}
.archive-error {
  display: inline-block;
  padding: 6px 10px;
  background: rgba(226,6,19,0.08);
  border: 1px solid rgba(226,6,19,0.3);
  border-radius: var(--r-sm);
  color: var(--au-rot);
}
.archive-ok {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px 12px;
  background: rgba(16,185,129,0.06);
  border: 1px solid rgba(16,185,129,0.28);
  border-radius: var(--r-sm);
  color: #065f46;
}
.archive-link {
  color: #174476; text-decoration: underline;
  font-family: monospace; font-size: 11px;
  word-break: break-all;
  flex: 1 1 200px;
}
.archive-note { font-size: 11px; color: var(--text-muted); flex-basis: 100%; }
.btn--sm { padding: 4px 10px; font-size: 11px; min-height: 28px; }
[data-theme="dark"] .archive-ok { color: #34d399; }
[data-theme="dark"] .archive-link { color: #60a5fa; }

/* ============================================================
   Export-Menü (Header-Popover) · 22.04.
   ============================================================ */
.export-menu {
  position: fixed;
  z-index: 400;
  min-width: 320px;
  max-width: 380px;
  background: var(--bg-card);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-xl);
  padding: 8px;
  animation: export-menu-in 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes export-menu-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.export-menu__item {
  display: flex; align-items: flex-start; gap: 12px;
  width: 100%;
  padding: 10px 12px;
  border: none;
  background: transparent;
  font-family: inherit;
  text-align: left;
  border-radius: var(--r-sm);
  cursor: pointer;
  color: var(--text-primary);
  transition: background 150ms;
  min-height: 44px;
}
.export-menu__item:hover { background: var(--bg-card-subtle); }
.export-menu__item:focus-visible { outline: 2px solid var(--au-rot); outline-offset: -2px; }
.export-menu__icon { font-size: 20px; line-height: 1.2; flex-shrink: 0; }
.export-menu__text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.export-menu__text strong { font-size: 13px; font-weight: 700; color: var(--text-heading); }
.export-menu__text small { font-size: 11px; color: var(--text-muted); line-height: 1.4; }
.export-menu__sep {
  height: 1px; background: var(--border-soft); margin: 6px 8px;
}
@media (max-width: 640px) {
  .export-menu { left: 8px !important; right: 8px !important; min-width: 0; max-width: none; }
}

/* ============================================================
   Erweitertes Print-CSS für Redaktionsplan-Landscape (P4-34)
   ============================================================ */
@media print {
  .export-menu, .nav-burger, .nav-backdrop, .btn-archive, .trend-indicator,
  .source-archive, .ba-widget__switch, .ba-widget__foot, .lt-findings,
  .tonalitaets-check, .factory-filters, .factory-hero__actions,
  .hero-cta, #btn-new-post, #btn-cmd { display: none !important; }
  .ba-widget { break-inside: avoid; }
  @page :first { size: A4 landscape; margin: 10mm; }
  .list-table { font-size: 8pt !important; }
  .list-table th:nth-child(n+8) { display: none !important; }
  .list-table td:nth-child(n+8) { display: none !important; }
}

/* ============================================================
   P4-36: Sidebar-Gradient + Brand-Shimmer Fine-Tuning
   ============================================================ */
.sidebar {
  background:
    radial-gradient(circle at 0% 0%, rgba(226, 6, 19, 0.07), transparent 55%),
    radial-gradient(circle at 100% 100%, rgba(240, 115, 33, 0.05), transparent 50%),
    linear-gradient(180deg, #ffffff 0%, #fdf9e9 100%);
}
[data-theme="dark"] .sidebar {
  background:
    radial-gradient(circle at 0% 0%, rgba(255, 31, 46, 0.18), transparent 55%),
    radial-gradient(circle at 100% 100%, rgba(240, 115, 33, 0.10), transparent 50%),
    linear-gradient(180deg, #141e33 0%, #0f172a 100%);
}
.btn--primary {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.btn--primary::before {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 80%;
  height: 100%;
  background: linear-gradient(100deg, transparent 0%, rgba(255,255,255,0.28) 50%, transparent 100%);
  transform: skewX(-18deg);
  transition: left 700ms cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
  z-index: 1;
}
.btn--primary:hover::before { left: 140%; }
.btn--primary > * { position: relative; z-index: 2; }

@media (prefers-reduced-motion: reduce) {
  .btn--primary::before { display: none; }
}

.nav__item {
  transition: transform 150ms, background-color 200ms, color 200ms, box-shadow 200ms;
}
.nav__item:hover { transform: translateX(2px); }
.nav__item--active { transform: translateX(0); }

.sidebar__user {
  transition: background 200ms;
}
.sidebar__user:hover { background: var(--bg-card-subtle); }

/* ============================================================
   Analytics-Hub (Phase 6B) · container-scoped Dark-Neon-Design
   ============================================================ */
.analytics-hub {
  --ah-bg-0: #05050a;
  --ah-bg-1: #0a0a18;
  --ah-cyan: #00f5ff;
  --ah-mag:  #ff2bd6;
  --ah-green:#00ff9c;
  --ah-yellow:#ffe600;
  --ah-red:  #ff4d6d;
  --ah-txt:  #e8efff;
  --ah-dim:  #8a93ad;
  --ah-faint:#5a6380;
  --ah-card: rgba(18,22,40,0.72);
  --ah-brd:  rgba(0,245,255,0.20);
  --ah-glow: 0 0 24px rgba(0,245,255,0.28);
}
.analytics-hub__root {
  position: relative;
  padding: 24px;
  border-radius: 22px;
  background: linear-gradient(180deg, var(--ah-bg-0), var(--ah-bg-1));
  color: var(--ah-txt);
  overflow: hidden;
  isolation: isolate;
}
.analytics-hub__root::before {
  content: "";
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(ellipse at 15% 0%,  rgba(255,43,214,0.18), transparent 50%),
    radial-gradient(ellipse at 85% 10%, rgba(0,245,255,0.18), transparent 55%),
    radial-gradient(ellipse at 50% 100%,rgba(0,255,156,0.10), transparent 60%);
}
.analytics-hub__root > * { position: relative; z-index: 1; }

.analytics-hub .ah-section { margin-top: 28px; }
.analytics-hub .ah-section__title {
  font-family: "Merriweather", serif;
  font-weight: 700; font-size: 18px;
  letter-spacing: 0.08em; text-transform: uppercase;
  margin: 24px 0 14px; color: var(--ah-txt);
  display: flex; align-items: center; gap: 12px;
}
.analytics-hub .ah-section__title::before {
  content: ""; width: 5px; height: 18px; border-radius: 3px;
  background: linear-gradient(180deg, var(--ah-cyan), var(--ah-mag));
  box-shadow: var(--ah-glow);
}

/* Hero */
.analytics-hub .ah-hero {
  padding: 32px 28px; border-radius: 18px; border: 1px solid var(--ah-brd);
  background: linear-gradient(135deg, rgba(0,245,255,0.10), rgba(255,43,214,0.10));
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.analytics-hub .ah-hero__badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 14px; border-radius: 99px; margin-bottom: 14px;
  background: rgba(0,245,255,0.10); border: 1px solid rgba(0,245,255,0.35);
  font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--ah-cyan);
}
.analytics-hub .ah-hero__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--ah-green); box-shadow: 0 0 10px var(--ah-green);
  animation: ah-pulse 2s infinite;
}
@keyframes ah-pulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: 0.55; transform: scale(0.85); } }
.analytics-hub .ah-hero__title {
  font-family: "Merriweather", serif; font-weight: 900;
  font-size: clamp(26px, 3.5vw, 40px); line-height: 1.1;
  margin: 6px 0 8px; color: var(--ah-txt);
}
.analytics-hub .ah-hero__sub { color: var(--ah-dim); font-size: 15px; max-width: 720px; line-height: 1.5; }
.analytics-hub .ah-hero__meta { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.analytics-hub .ah-hero__chip {
  padding: 6px 12px; border-radius: 99px; font-size: 12px;
  background: rgba(0,245,255,0.08); border: 1px solid var(--ah-brd); color: var(--ah-txt);
}
.analytics-hub .ah-hero__chip--ok { background: rgba(0,255,156,0.15); border-color: rgba(0,255,156,0.4); color: var(--ah-green); }
.analytics-hub .ah-hero__chip--muted { color: var(--ah-faint); }

/* Connector-Tiles */
.analytics-hub .ah-tiles {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.analytics-hub .ah-tile {
  position: relative; text-align: left;
  padding: 18px 18px 16px; border-radius: 16px;
  background: var(--ah-card); border: 1px solid var(--ah-brd);
  color: var(--ah-txt); cursor: pointer;
  display: flex; flex-direction: column; gap: 6px;
  transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
  min-height: 132px;
}
.analytics-hub .ah-tile:hover:not([disabled]) {
  transform: translateY(-3px);
  border-color: var(--tile-accent, var(--ah-cyan));
  box-shadow: 0 0 22px color-mix(in srgb, var(--tile-accent, #00f5ff) 30%, transparent);
}
.analytics-hub .ah-tile--active {
  border-color: var(--tile-accent, var(--ah-cyan));
  background: linear-gradient(180deg, rgba(0,245,255,0.10), var(--ah-card));
  box-shadow: 0 0 20px color-mix(in srgb, var(--tile-accent, #00f5ff) 35%, transparent);
}
.analytics-hub .ah-tile--soon { opacity: 0.6; cursor: not-allowed; }
.analytics-hub .ah-tile__icon {
  width: 36px; height: 36px; border-radius: 10px;
  background: var(--tile-accent, var(--ah-cyan));
  color: #05050a; font-weight: 900; font-size: 20px;
  display: flex; align-items: center; justify-content: center;
}
.analytics-hub .ah-tile__label { font-size: 15px; font-weight: 700; color: var(--ah-txt); }
.analytics-hub .ah-tile__desc  { font-size: 12px; color: var(--ah-dim); line-height: 1.4; }
.analytics-hub .ah-tile__status {
  margin-top: auto; font-size: 10px; text-transform: uppercase; letter-spacing: 0.12em;
  color: var(--tile-accent, var(--ah-cyan));
}
.analytics-hub .ah-tile:focus-visible {
  outline: 2px solid var(--tile-accent, var(--ah-cyan)); outline-offset: 2px;
}

/* Upload-Area */
.analytics-hub .ah-upload {
  border: 2px dashed var(--ah-brd);
  border-radius: 18px;
  background: rgba(10,10,24,0.55);
  transition: border-color 0.2s, background 0.2s;
}
.analytics-hub .ah-upload.is-drag {
  border-color: var(--ah-cyan);
  background: rgba(0,245,255,0.08);
}
.analytics-hub .ah-upload__body {
  padding: 32px; text-align: center; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.analytics-hub .ah-upload__body:focus-visible { outline: 2px solid var(--ah-cyan); outline-offset: -6px; border-radius: 12px; }
.analytics-hub .ah-upload__icon { font-size: 36px; color: var(--ah-cyan); }
.analytics-hub .ah-upload h3 { font-family: "Merriweather", serif; font-size: 18px; color: var(--ah-txt); }
.analytics-hub .ah-upload p { color: var(--ah-dim); font-size: 14px; line-height: 1.5; }
.analytics-hub .ah-upload code {
  background: rgba(0,245,255,0.1); padding: 2px 6px; border-radius: 4px;
  font-size: 12px; color: var(--ah-cyan);
}
.analytics-hub .ah-upload--soon .ah-upload__body { cursor: default; }
.analytics-hub .ah-upload__buttons { display: flex; gap: 10px; margin-top: 8px; flex-wrap: wrap; justify-content: center; }
.analytics-hub .ah-linklike {
  background: transparent; border: 0; padding: 0; color: var(--ah-cyan); text-decoration: underline;
  font: inherit; cursor: pointer;
}
.analytics-hub .ah-linklike:focus-visible { outline: 2px solid var(--ah-cyan); outline-offset: 2px; }

/* Empty-State */
.analytics-hub .ah-empty {
  border: 1px solid var(--ah-brd); border-radius: 18px;
  background: var(--ah-card); padding: 32px; text-align: center;
}
.analytics-hub .ah-empty__icon { font-size: 40px; color: var(--ah-mag); }
.analytics-hub .ah-empty h3 { font-family: "Merriweather", serif; font-size: 18px; margin: 8px 0 4px; }
.analytics-hub .ah-empty p { color: var(--ah-dim); font-size: 14px; }

/* Dashboard */
.analytics-hub .ah-dashboard { margin-top: 32px; }
.analytics-hub .ah-dashboard__head {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px;
  margin-bottom: 16px;
}
.analytics-hub .ah-dashboard__head h3 {
  font-family: "Merriweather", serif; font-size: 22px; color: var(--ah-txt);
}
.analytics-hub .ah-dashboard__actions { display: flex; gap: 8px; }
.analytics-hub .ah-dashboard__actions .btn {
  background: rgba(0,245,255,0.08) !important;
  border: 1px solid var(--ah-brd) !important;
  color: var(--ah-txt) !important;
}
.analytics-hub .ah-dashboard__actions .btn:hover {
  background: rgba(0,245,255,0.18) !important;
  border-color: var(--ah-cyan) !important;
}

/* KPI */
.analytics-hub .ah-kpi-grid {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.analytics-hub .ah-kpi {
  position: relative; padding: 22px 20px; border-radius: 14px;
  background: var(--ah-card); border: 1px solid var(--ah-brd);
  transition: transform 0.2s, box-shadow 0.2s;
}
.analytics-hub .ah-kpi:hover { transform: translateY(-3px); box-shadow: var(--ah-glow); }
.analytics-hub .ah-kpi::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--ah-kpi-color, var(--ah-cyan)), transparent);
}
.analytics-hub .ah-kpi__label {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.15em;
  color: var(--ah-dim); margin-bottom: 10px;
}
.analytics-hub .ah-kpi__value {
  font-family: "Merriweather", serif; font-weight: 900; font-size: 36px; line-height: 1;
  color: var(--ah-kpi-color, var(--ah-cyan));
  text-shadow: 0 0 16px color-mix(in srgb, var(--ah-kpi-color, #00f5ff) 40%, transparent);
  margin-bottom: 6px;
}
.analytics-hub .ah-kpi__sub { font-size: 12px; color: var(--ah-faint); }

/* Chart-Cards */
.analytics-hub .ah-chart-card {
  padding: 20px; border-radius: 16px; margin-bottom: 16px;
  background: var(--ah-card); border: 1px solid var(--ah-brd);
}
.analytics-hub .ah-chart-card__head {
  display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 14px;
}
.analytics-hub .ah-chart-card__head strong {
  font-family: "Merriweather", serif; font-size: 14px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--ah-txt);
}
.analytics-hub .ah-chart-card__head span { font-size: 12px; color: var(--ah-dim); }
.analytics-hub .ah-chart-wrap { position: relative; height: 380px; }
.analytics-hub .ah-two-col {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
@media (max-width: 900px) { .analytics-hub .ah-two-col { grid-template-columns: 1fr; } }

/* Goals */
.analytics-hub .ah-goals-grid {
  display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.analytics-hub .ah-goal {
  padding: 20px; border-radius: 14px;
  background: var(--ah-card); border: 1px solid var(--ah-brd);
}
.analytics-hub .ah-goal__head {
  display: flex; justify-content: space-between; align-items: center; gap: 8px;
  margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.06);
}
.analytics-hub .ah-goal__head span { font-size: 11px; color: var(--ah-faint); }
.analytics-hub .ah-goal__head strong { color: var(--ah-mag); font-size: 15px; }
.analytics-hub .ah-goal__row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 8px 0; font-size: 13px; color: var(--ah-dim);
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.analytics-hub .ah-goal__row:last-child { border-bottom: 0; }
.analytics-hub .ah-goal__row strong { color: var(--ah-cyan); font-size: 16px; }

/* Table */
.analytics-hub .ah-table-card {
  border-radius: 16px; overflow: hidden;
  background: var(--ah-card); border: 1px solid var(--ah-brd);
}
.analytics-hub .ah-table-card__head {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px;
  padding: 18px 22px; border-bottom: 1px solid var(--ah-brd);
}
.analytics-hub .ah-table-card__head strong {
  font-family: "Merriweather", serif; font-size: 14px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--ah-txt);
}
.analytics-hub .ah-table-card__head span { font-size: 12px; color: var(--ah-dim); }
.analytics-hub .ah-table-scroll { overflow-x: auto; max-height: 560px; }
.analytics-hub .ah-table { width: 100%; border-collapse: collapse; }
.analytics-hub .ah-table th {
  position: sticky; top: 0; z-index: 1;
  text-align: left; padding: 12px 16px; font-size: 11px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--ah-dim); font-weight: 700;
  background: rgba(10,10,24,0.95); border-bottom: 1px solid var(--ah-brd);
}
.analytics-hub .ah-table th.ah-right { text-align: right; }
.analytics-hub .ah-table td {
  padding: 10px 16px; border-bottom: 1px solid rgba(255,255,255,0.04); font-size: 13px;
}
.analytics-hub .ah-table tr:hover td { background: rgba(0,245,255,0.04); }
.analytics-hub .ah-td-rank { color: var(--ah-faint); font-weight: 700; width: 52px; }
.analytics-hub .ah-td-label { color: var(--ah-txt); word-break: break-all; }
.analytics-hub .ah-td-num { text-align: right; color: var(--ah-cyan); font-weight: 600; font-variant-numeric: tabular-nums; }
.analytics-hub .ah-td-rate { text-align: right; font-weight: 700; width: 110px; font-variant-numeric: tabular-nums; }
.analytics-hub .ah-rate--low  { color: var(--ah-green);  text-shadow: 0 0 6px rgba(0,255,156,0.35); }
.analytics-hub .ah-rate--mid  { color: var(--ah-yellow); text-shadow: 0 0 6px rgba(255,230,0,0.30); }
.analytics-hub .ah-rate--high { color: var(--ah-red);    text-shadow: 0 0 6px rgba(255,77,109,0.30); }
.analytics-hub .ah-rate--none { color: var(--ah-faint); }

/* History */
.analytics-hub .ah-hist__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.analytics-hub .ah-hist__btn {
  width: 100%; text-align: left;
  background: var(--ah-card); border: 1px solid var(--ah-brd);
  color: var(--ah-txt); padding: 12px 16px; border-radius: 10px;
  cursor: pointer; display: grid; grid-template-columns: 180px 1fr 160px; gap: 12px; align-items: center;
  transition: background 0.2s, border-color 0.2s;
}
.analytics-hub .ah-hist__btn:hover { background: rgba(0,245,255,0.08); border-color: var(--ah-cyan); }
.analytics-hub .ah-hist__btn:focus-visible { outline: 2px solid var(--ah-cyan); outline-offset: 2px; }
.analytics-hub .ah-hist__time  { color: var(--ah-faint); font-size: 12px; }
.analytics-hub .ah-hist__title { color: var(--ah-txt); font-size: 14px; font-weight: 600; }
.analytics-hub .ah-hist__src   { color: var(--ah-cyan); font-size: 12px; text-align: right; }
@media (max-width: 700px) {
  .analytics-hub .ah-hist__btn { grid-template-columns: 1fr; }
  .analytics-hub .ah-hist__src { text-align: left; }
}

/* DSGVO-Modal */
.ah-modal-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.65); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.ah-modal {
  max-width: 520px; width: 100%;
  background: #0a0a18; color: #e8efff;
  border: 1px solid rgba(0,245,255,0.35); border-radius: 16px;
  padding: 28px; box-shadow: 0 0 40px rgba(0,245,255,0.25);
}
.ah-modal h3 { font-family: "Merriweather", serif; margin-bottom: 12px; color: #00f5ff; }
.ah-modal p { color: #c0c8dc; line-height: 1.55; margin-bottom: 10px; font-size: 14px; }
.ah-modal ul { color: #c0c8dc; padding-left: 18px; margin: 10px 0; font-size: 14px; line-height: 1.7; }
.ah-modal code { background: rgba(0,245,255,0.12); padding: 1px 5px; border-radius: 3px; color: #00f5ff; font-size: 12px; }
.ah-modal__actions { margin-top: 16px; display: flex; justify-content: flex-end; }

/* Page-Header action slot */
.analytics-hub .page-header__actions { margin-left: auto; }

/* Print-Fix: Analytics-Hub auf A4 Dark-Mode bleibt, KPIs in 3er-Grid */
@media print {
  .analytics-hub__root { background: #0a0a18 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .analytics-hub .ah-dashboard__actions, .analytics-hub .ah-upload, .analytics-hub .ah-tiles, .analytics-hub .ah-history { display: none !important; }
  .analytics-hub .ah-kpi-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .analytics-hub .ah-chart-wrap { height: 300px !important; }
}

/* ============================================================
   P3-25: Messe-Presse-Echo im Event-Editor
   ============================================================ */
.event-messe-news {
  display: flex; flex-direction: column; gap: 6px;
  padding: 10px;
  background: var(--bg-card-subtle);
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-sm);
  max-height: 280px;
  overflow-y: auto;
}
.event-messe-news__hint {
  color: var(--text-muted);
  font-size: 12px;
  font-style: italic;
  padding: 6px 4px;
}
.event-messe-news__hint--error { color: var(--au-rot); font-style: normal; }
.event-messe-news__item {
  display: block;
  padding: 8px 10px;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-left: 3px solid #174476;
  border-radius: var(--r-sm);
  text-decoration: none;
  color: inherit;
  transition: transform 150ms, border-color 150ms;
}
.event-messe-news__item:hover {
  transform: translateX(2px);
  border-color: #4a90e2;
  border-left-color: var(--au-rot);
  text-decoration: none;
}
.event-messe-news__title {
  font-size: 13px; font-weight: 700;
  color: var(--text-primary);
  line-height: 1.35;
}
.event-messe-news__meta {
  font-size: 11px; color: var(--text-muted);
  margin-top: 2px;
}

/* ============================================================
   P4-35: Mockup-Polish (realistische Feed-Simulation)
   ============================================================ */
.mockup-card__reactions {
  display: flex; align-items: center; gap: 4px;
  padding: 6px 12px 4px;
  font-size: 12px;
  color: var(--text-muted);
  border-top: 1px solid var(--border-soft);
}
.mc-reaction {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--bg-card-subtle);
  font-size: 11px;
  margin-right: -4px;
  border: 2px solid var(--bg-card);
}
.mc-reaction--fb { background: #1877f2; color: #fff; }
.mockup-card__stats {
  padding: 2px 12px 4px;
  font-size: 11px;
  color: var(--text-muted);
}
.mockup-card__footerbar {
  display: flex; gap: 8px;
  padding: 8px 12px;
  border-top: 1px solid var(--border-soft);
  font-size: 12px;
  color: var(--text-muted);
  font-weight: 600;
  flex-wrap: wrap;
}
.mockup-card__footerbar span { cursor: pointer; transition: color 150ms; }
.mockup-card__footerbar span:hover { color: var(--mockup-color, var(--au-rot)); }
.mockup-card__ig-actions {
  display: flex; gap: 14px;
  padding: 10px 12px 4px;
  font-size: 20px;
  color: var(--text-primary);
  border-top: 1px solid var(--border-soft);
}
.mockup-card__ig-actions .mc-spacer { flex: 1; }
.mockup-card__ig-actions span { cursor: pointer; }
.mockup-card--linkedin .mockup-card__head { background: rgba(10,102,194,0.04); }
.mockup-card--facebook .mockup-card__head { background: rgba(24,119,242,0.04); }
.mockup-card--instagram .mockup-card__head { background: linear-gradient(135deg, rgba(228,64,95,0.06), rgba(255,195,120,0.06)); }

/* ============================================================
   S9: Cloud-Sync Restore-Banner
   ============================================================ */
.sync-banner {
  position: sticky; top: 0;
  z-index: 180;
  display: flex; align-items: center; gap: 14px;
  padding: 12px 20px;
  background: linear-gradient(90deg, rgba(240,115,33,0.12), rgba(23,68,118,0.10));
  border-bottom: 2px solid var(--au-rot);
  box-shadow: 0 4px 16px rgba(226,6,19,0.12);
  animation: sync-banner-in 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes sync-banner-in { from { transform: translateY(-100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.sync-banner__icon { font-size: 22px; flex-shrink: 0; }
.sync-banner__text { flex: 1; font-size: 13px; line-height: 1.45; color: var(--text-primary); }
.sync-banner__text strong { color: var(--au-rot); }
@media (max-width: 640px) {
  .sync-banner { flex-wrap: wrap; padding: 10px 12px; }
  .sync-banner__text { flex: 1 1 100%; }
}

/* ============================================================
   P1.3: Sync-Status in Sidebar (Heartbeat-Indikator)
   ============================================================ */
.sync-status {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  margin: 6px 10px 4px;
  font-size: 11px;
  color: var(--text-muted);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  cursor: pointer;
  transition: background 150ms, border-color 150ms;
  background: var(--bg-card-subtle);
}
.sync-status:hover { background: var(--bg-card); border-color: var(--au-rot); color: var(--text-primary); }
.sync-status__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--text-muted);
  flex-shrink: 0;
  transition: background 200ms, box-shadow 200ms;
}
.sync-status__dot--ok { background: #10b981; box-shadow: 0 0 8px rgba(16,185,129,0.5); animation: sync-pulse 2.5s ease-in-out infinite; }
.sync-status__dot--warn { background: #fbbf24; box-shadow: 0 0 8px rgba(251,191,36,0.5); }
.sync-status__dot--alert { background: var(--au-rot); box-shadow: 0 0 10px rgba(226,6,19,0.7); animation: sync-blink 1s ease-in-out infinite; }
.sync-status__dot--idle { background: var(--text-muted); }
@keyframes sync-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
@keyframes sync-blink { 0%,100% { opacity: 1; } 50% { opacity: 0.3; } }
.sync-status__text { flex: 1; font-weight: 600; }

/* Snapshot-History-Modal */
.sync-history-list { display: flex; flex-direction: column; gap: 8px; }
.sync-history-item {
  display: flex; align-items: center; gap: var(--s-3);
  padding: 12px 14px;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  transition: border-color 150ms, transform 150ms;
}
.sync-history-item:hover { border-color: var(--au-rot); transform: translateX(2px); }
.sync-history-item__left { flex: 1; min-width: 0; }
.sync-history-item__date { font-size: 13px; font-weight: 700; color: var(--text-primary); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sync-history-item__badge { font-size: 10px; background: #10b981; color: #fff; padding: 2px 8px; border-radius: var(--r-full); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 800; }
.sync-history-item__meta { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
.sync-history-item__actions { display: flex; gap: 6px; flex-shrink: 0; }
@media (max-width: 640px) {
  .sync-history-item { flex-direction: column; align-items: stretch; }
  .sync-history-item__actions { width: 100%; }
  .sync-history-item__actions button { flex: 1; }
}

/* ============================================================
   S10.2: Content-Archiv + Duplikats-Warnung
   ============================================================ */
/* Toolbar */
.archive-toolbar {
  display: flex; gap: var(--s-2); align-items: center; flex-wrap: wrap;
  margin-bottom: var(--s-5);
  padding: var(--s-3);
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
}
.archive-search { position: relative; flex: 1 1 280px; }
.archive-search__icon {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  color: var(--text-muted); font-size: 16px;
}
.archive-search input {
  width: 100%;
  padding: 10px 14px 10px 40px;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  color: var(--text-primary);
  font-family: inherit; font-size: 14px;
}
.archive-search input:focus { outline: 2px solid var(--au-rot); outline-offset: 2px; border-color: var(--au-rot); }
.archive-filter {
  padding: 10px 14px;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  color: var(--text-primary);
  font-family: inherit; font-size: 13px;
  cursor: pointer;
}

/* Stats-Grid */
.archive-stats-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: var(--s-3);
  margin-bottom: var(--s-5);
}
@media (max-width: 900px) { .archive-stats-grid { grid-template-columns: 1fr; } }
.archive-kpi {
  padding: var(--s-4);
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-md);
  min-height: 130px;
}
.archive-kpi--hero {
  background: linear-gradient(135deg, rgba(226,6,19,0.05), rgba(240,115,33,0.05));
  border-color: rgba(226,6,19,0.2);
}
.archive-kpi--hero .archive-kpi__value { color: var(--au-rot); }
.archive-kpi--warn {
  background: rgba(240,115,33,0.05);
  border-color: rgba(240,115,33,0.3);
  grid-column: 1 / -1;
}
.archive-kpi__label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); font-weight: 700; margin-bottom: var(--s-2); }
.archive-kpi__value {
  font-family: var(--font-display);
  font-size: 40px; font-weight: 900;
  color: var(--text-heading); line-height: 1;
}
.archive-kpi__sub { font-size: 12px; color: var(--text-muted); margin-top: var(--s-2); }
.archive-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--s-1); }
.archive-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  background: var(--bg-card-subtle);
  border: 1px solid var(--border-soft);
  border-radius: var(--r-full);
  font-size: 12px;
}
.archive-chip__label { color: var(--text-primary); font-weight: 600; }
.archive-chip__count {
  background: var(--au-rot); color: #fff;
  font-weight: 800; font-size: 11px;
  padding: 1px 8px; border-radius: var(--r-full);
}
.archive-chip--month .archive-chip__count { background: #174476; }
.archive-hint { color: var(--text-muted); font-size: 12px; font-style: italic; }
.archive-loading, .archive-error, .archive-empty {
  padding: var(--s-5);
  text-align: center;
  color: var(--text-muted);
  background: var(--bg-card);
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-md);
  grid-column: 1 / -1;
}
.archive-error { color: var(--au-rot); border-color: rgba(226,6,19,0.3); }
.archive-empty em { color: var(--au-rot); font-style: normal; font-weight: 700; }
.archive-repeat-list { list-style: none; padding: 0; margin: var(--s-2) 0 0; font-size: 13px; line-height: 1.7; }
.archive-repeat-list strong { color: var(--au-rot); }

/* Liste */
.archive-list__head { font-size: 12px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: var(--s-2); font-weight: 700; }
.archive-items { display: flex; flex-direction: column; gap: var(--s-2); }
.archive-item {
  padding: var(--s-3) var(--s-4);
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-left: 4px solid #174476;
  border-radius: var(--r-sm);
  transition: transform 150ms, border-color 150ms;
}
.archive-item:hover { border-left-color: var(--au-rot); transform: translateX(2px); }
.archive-item__head { display: flex; gap: var(--s-2); flex-wrap: wrap; margin-bottom: 4px; font-size: 11px; }
.archive-item__thema { background: rgba(23,68,118,0.1); color: #174476; padding: 2px 10px; border-radius: var(--r-full); font-weight: 700; }
.archive-item__platform { color: var(--text-muted); }
.archive-item__date { margin-left: auto; color: var(--text-muted); }
.archive-item__title { font-family: var(--font-display); font-size: 15px; font-weight: 700; color: var(--text-heading); line-height: 1.35; margin: 0 0 4px; }
.archive-item__meta { font-size: 11px; color: var(--text-muted); }
.archive-item__meta code { background: var(--bg-card-subtle); padding: 1px 5px; border-radius: 3px; font-size: 10px; }

/* Duplikats-Warnung im Editor */
.dup-warning { margin-top: 6px; font-size: 12px; }
.dup-warning__loading, .dup-warning__ok {
  display: inline-block;
  padding: 6px 10px;
  background: var(--bg-card-subtle);
  border: 1px dashed var(--border-soft);
  border-radius: var(--r-sm);
  color: var(--text-muted);
}
.dup-warning__ok { color: #10b981; border-color: rgba(16,185,129,0.3); }
.dup-warning__box {
  padding: 10px 12px;
  border-radius: var(--r-sm);
  border: 1px solid;
  line-height: 1.5;
}
.dup-warning__box--med { background: rgba(251,191,36,0.08); border-color: rgba(251,191,36,0.4); }
.dup-warning__box--high { background: rgba(226,6,19,0.08); border-color: rgba(226,6,19,0.4); }
.dup-warning__box strong { display: block; margin-bottom: 4px; color: var(--au-rot); }
.dup-warning__match { color: var(--text-primary); font-weight: 600; }
.dup-warning__more { margin-top: 8px; font-size: 11px; color: var(--text-muted); }
.dup-warning__more summary { cursor: pointer; user-select: none; }
.dup-warning__more ul { margin: 6px 0 0 18px; line-height: 1.6; }

/* S11.4: KURSNET + MeinNow Kursangebote-Check im Post-Editor */
.kursnet-check { margin-top: 8px; }
.kursnet-results { margin-top: 6px; }
.kursnet-box {
  padding: 12px 14px;
  background: linear-gradient(135deg, rgba(23,68,118,0.05), rgba(74,144,226,0.05));
  border: 1px solid rgba(23,68,118,0.25);
  border-radius: var(--r-md);
  font-size: 12px;
  line-height: 1.5;
}
.kursnet-head { margin-bottom: 10px; color: var(--text-primary); }
.kursnet-head strong { color: #174476; }
.kursnet-col { margin-bottom: 10px; }
.kursnet-col__title { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; font-weight: 700; color: #174476; margin-bottom: 4px; }
.kursnet-col ul { list-style: none; padding: 0; margin: 0; }
.kursnet-col li { padding: 6px 10px; background: var(--bg-card); border: 1px solid var(--border-soft); border-left: 3px solid #174476; border-radius: var(--r-sm); margin-bottom: 4px; }
.kursnet-meta { font-size: 11px; color: var(--text-muted); }
.kursnet-hint { padding: 8px 10px; background: rgba(240,115,33,0.08); border: 1px dashed rgba(240,115,33,0.4); border-radius: var(--r-sm); font-size: 12px; color: var(--text-primary); margin-top: 6px; }

/* ============================================================
   S13.1: Analytics-Hub Dark-Mode Sichtbarkeit (Fix 22.04.)
   Ursache: globale h3/h4-Regel setzt color:#0f0f10, override für Hub
   + btn--ghost-Farbe auf Dark-Hub-BG unsichtbar → Light-on-Dark
   ============================================================ */
.analytics-hub h1,
.analytics-hub h2,
.analytics-hub h3,
.analytics-hub h4,
.analytics-hub h5 {
  color: var(--ah-txt) !important;
}
.analytics-hub .ah-empty h3 { color: var(--ah-txt) !important; font-size: 20px; }
.analytics-hub .ah-empty p { color: var(--ah-dim) !important; font-size: 15px; }

/* Upload-Buttons im Dark-Hub — alle sichtbar */
.analytics-hub .ah-upload__buttons .btn {
  color: #ffffff !important;
  border: 1px solid var(--ah-cyan) !important;
  font-weight: 700;
}
.analytics-hub .ah-upload__buttons .btn--primary {
  background: linear-gradient(135deg, var(--au-rot), var(--au-rot-dunkel)) !important;
  border-color: var(--au-rot) !important;
  box-shadow: 0 4px 14px rgba(226,6,19,0.35);
}
.analytics-hub .ah-upload__buttons .btn--primary:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}
.analytics-hub .ah-upload__buttons .btn--ghost {
  background: rgba(0,245,255,0.12) !important;
  color: var(--ah-cyan) !important;
  border: 1px solid var(--ah-cyan) !important;
}
.analytics-hub .ah-upload__buttons .btn--ghost:hover {
  background: rgba(0,245,255,0.22) !important;
  color: #ffffff !important;
}

/* Empty-State-Icon auch lesbar */
.analytics-hub .ah-empty__icon { color: var(--ah-mag) !important; opacity: 0.9; }

/* Upload-Dropzone-Subtext + code-Tags */
.analytics-hub .ah-upload p { color: var(--ah-dim) !important; }
.analytics-hub .ah-upload code {
  background: rgba(0,245,255,0.1) !important;
  color: var(--ah-cyan) !important;
  border: 1px solid rgba(0,245,255,0.25);
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 13px;
}

/* Connector-Tile-Labels */
.analytics-hub .ah-tile__label,
.analytics-hub .ah-tile__desc { color: var(--ah-txt) !important; }
.analytics-hub .ah-tile__status { color: var(--ah-cyan) !important; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; }

/* Meta / Footer-Texte im Hub */
.analytics-hub .ah-hero__meta,
.analytics-hub .ah-hero__meta-item,
.analytics-hub .ah-upload-status {
  color: var(--ah-txt) !important;
}

/* Dropzone-Label selbst (h3 "Matomo-Export hochladen") bleibt sichtbar */
.analytics-hub .ah-upload h3 { color: var(--ah-txt) !important; }
.analytics-hub .ah-upload__icon { color: var(--ah-cyan) !important; }

/* Alle Button-Texte in analytics-hub global sichtbar (Fallback) */
.analytics-hub button,
.analytics-hub .btn { color: var(--ah-txt); }
.analytics-hub .btn--primary { color: #fff !important; }

/* ============================================================
   Arbeitsmarkt-Sektion (BA-Jobbörse /ba/overview)
   Scope: .analytics-hub .ah-arbeitsmarkt
   ============================================================ */
.analytics-hub .ah-arbeitsmarkt {
  padding: 20px 22px;
  background: rgba(10, 14, 30, 0.55);
  border: 1px solid var(--ah-brd);
  border-radius: 18px;
  box-shadow: inset 0 0 0 1px rgba(0,245,255,0.05);
}
.analytics-hub .ah-am__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
}
.analytics-hub .ah-am__head .ah-section__title { margin: 0; }
.analytics-hub .ah-am__sub {
  margin: 4px 0 18px;
  color: var(--ah-dim);
  font-size: 13px;
}
.analytics-hub .ah-am__refresh {
  background: rgba(0,245,255,0.08) !important;
  color: var(--ah-cyan) !important;
  border: 1px solid var(--ah-cyan) !important;
  padding: 6px 14px;
  font-size: 12px;
  border-radius: 10px;
}
.analytics-hub .ah-am__refresh:hover {
  background: rgba(0,245,255,0.16) !important;
  box-shadow: 0 0 18px rgba(0,245,255,0.25);
}

.analytics-hub .ah-am__loading {
  display: flex; align-items: center; gap: 14px;
  padding: 24px; border-radius: 12px;
  background: rgba(0,245,255,0.04);
  color: var(--ah-dim);
  font-size: 14px;
}
.analytics-hub .ah-am__spinner {
  width: 22px; height: 22px; border-radius: 50%;
  border: 2px solid rgba(0,245,255,0.25);
  border-top-color: var(--ah-cyan);
  animation: ah-am-spin 0.9s linear infinite;
}
@keyframes ah-am-spin { to { transform: rotate(360deg); } }

.analytics-hub .ah-am__err {
  padding: 18px; border-radius: 12px;
  background: rgba(255, 77, 109, 0.08);
  border: 1px solid rgba(255, 77, 109, 0.35);
  color: var(--ah-red);
  font-size: 14px;
  display: flex; flex-direction: column; gap: 10px;
}

/* 4-Regionen-Grid */
.analytics-hub .ah-am__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 24px;
}
.analytics-hub .ah-am__card {
  position: relative;
  padding: 16px 18px;
  background: linear-gradient(160deg, rgba(0,245,255,0.08), rgba(0,245,255,0.02));
  border: 1px solid rgba(0,245,255,0.22);
  border-radius: 14px;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.analytics-hub .ah-am__card:hover {
  transform: translateY(-2px);
  border-color: var(--ah-cyan);
  box-shadow: 0 4px 22px rgba(0,245,255,0.18);
}
.analytics-hub .ah-am__card-label {
  font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ah-dim); margin-bottom: 6px;
}
.analytics-hub .ah-am__card-val {
  font-family: "Merriweather", serif;
  font-size: 28px; font-weight: 700;
  color: var(--ah-txt);
  line-height: 1.1;
}
.analytics-hub .ah-am__card-sub {
  font-size: 12px; color: var(--ah-dim);
  margin: 2px 0 12px;
}
.analytics-hub .ah-am__card-split {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 10px;
  border-top: 1px solid rgba(0,245,255,0.12);
  font-size: 12px;
}
.analytics-hub .ah-am__card-ausb {
  color: var(--ah-dim);
}
.analytics-hub .ah-am__card-ausb strong {
  color: var(--ah-txt);
  font-weight: 700;
}
.analytics-hub .ah-am__card-pct {
  padding: 2px 8px;
  border-radius: 20px;
  background: rgba(0, 255, 156, 0.14);
  color: var(--ah-green);
  font-weight: 700;
}

/* Top-Berufe Balken */
.analytics-hub .ah-am__h4 {
  font-family: "Merriweather", serif;
  font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--ah-txt);
  margin: 6px 0 12px;
}
.analytics-hub .ah-am__bars {
  display: flex; flex-direction: column; gap: 8px;
}
.analytics-hub .ah-am__bar-row {
  display: grid;
  grid-template-columns: 28px 180px 1fr 90px;
  align-items: center;
  gap: 12px;
}
.analytics-hub .ah-am__bar-rank {
  font-size: 12px; font-weight: 700;
  color: var(--ah-cyan);
  text-align: center;
  background: rgba(0,245,255,0.10);
  border-radius: 6px;
  padding: 3px 0;
}
.analytics-hub .ah-am__bar-label {
  font-size: 13px;
  color: var(--ah-txt);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.analytics-hub .ah-am__bar-track {
  height: 18px;
  background: rgba(0,245,255,0.06);
  border-radius: 9px;
  overflow: hidden;
  border: 1px solid rgba(0,245,255,0.12);
}
.analytics-hub .ah-am__bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--ah-cyan), var(--ah-mag));
  border-radius: 9px;
  box-shadow: 0 0 12px rgba(0,245,255,0.35);
  transition: width 0.5s ease;
}
.analytics-hub .ah-am__bar-val {
  font-size: 13px; font-weight: 700;
  color: var(--ah-txt);
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.analytics-hub .ah-am__foot {
  display: flex; justify-content: space-between;
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid rgba(0,245,255,0.10);
  font-size: 11px;
  color: var(--ah-faint);
  letter-spacing: 0.05em;
}

@media (max-width: 960px) {
  .analytics-hub .ah-am__grid { grid-template-columns: repeat(2, 1fr); }
  .analytics-hub .ah-am__bar-row { grid-template-columns: 24px 130px 1fr 70px; }
}
@media (max-width: 520px) {
  .analytics-hub .ah-am__grid { grid-template-columns: 1fr; }
  .analytics-hub .ah-am__bar-row { grid-template-columns: 22px 100px 1fr 60px; gap: 8px; }
  .analytics-hub .ah-am__card-val { font-size: 24px; }
}

/* ============================================================
   Bildungs-Trends-Sektion (Google Trends /trends/batch)
   Scope: .analytics-hub .ah-bildungstrends
   ============================================================ */
.analytics-hub .ah-bildungstrends {
  padding: 20px 22px;
  background: rgba(10, 14, 30, 0.55);
  border: 1px solid var(--ah-brd);
  border-radius: 18px;
  box-shadow: inset 0 0 0 1px rgba(0,245,255,0.05);
}
.analytics-hub .ah-bt__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
}
.analytics-hub .ah-bt__head .ah-section__title { margin: 0; }
.analytics-hub .ah-bt__sub {
  margin: 4px 0 14px; color: var(--ah-dim); font-size: 13px;
}
.analytics-hub .ah-bt__refresh {
  background: rgba(0,245,255,0.08) !important;
  color: var(--ah-cyan) !important;
  border: 1px solid var(--ah-cyan) !important;
  padding: 6px 14px; font-size: 12px; border-radius: 10px;
}
.analytics-hub .ah-bt__refresh:hover {
  background: rgba(0,245,255,0.16) !important;
  box-shadow: 0 0 18px rgba(0,245,255,0.25);
}

.analytics-hub .ah-bt__tabs {
  display: flex; gap: 8px; flex-wrap: wrap;
  margin-bottom: 16px;
}
.analytics-hub .ah-bt__tab {
  padding: 8px 16px;
  background: rgba(0,245,255,0.05);
  color: var(--ah-dim);
  border: 1px solid rgba(0,245,255,0.15);
  border-radius: 10px;
  cursor: pointer;
  font-size: 13px;
  transition: all 0.15s ease;
}
.analytics-hub .ah-bt__tab:hover {
  background: rgba(0,245,255,0.12);
  color: var(--ah-txt);
}
.analytics-hub .ah-bt__tab.is-active {
  background: linear-gradient(135deg, rgba(0,245,255,0.18), rgba(255,43,214,0.14));
  color: var(--ah-txt);
  border-color: var(--ah-cyan);
  box-shadow: 0 0 14px rgba(0,245,255,0.22);
}

.analytics-hub .ah-bt__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin-bottom: 22px;
}
.analytics-hub .ah-bt__card {
  position: relative;
  padding: 14px 14px 12px;
  background: linear-gradient(160deg, rgba(0,245,255,0.06), rgba(0,245,255,0.02));
  border: 1px solid rgba(0,245,255,0.18);
  border-radius: 12px;
  display: flex; flex-direction: column; gap: 8px;
  min-height: 110px;
}
.analytics-hub .ah-bt__card-dot {
  width: 10px; height: 10px; border-radius: 50%;
  box-shadow: 0 0 10px currentColor;
}
.analytics-hub .ah-bt__card-kw {
  font-size: 13px; font-weight: 700;
  color: var(--ah-txt);
  line-height: 1.25;
  min-height: 34px;
}
.analytics-hub .ah-bt__card-metrics {
  display: flex; align-items: center; gap: 10px;
  font-size: 12px; flex-wrap: wrap;
  margin-top: auto;
}
.analytics-hub .ah-bt__m { color: var(--ah-dim); }
.analytics-hub .ah-bt__m-lbl { opacity: 0.65; margin-right: 4px; }
.analytics-hub .ah-bt__m strong { color: var(--ah-txt); font-variant-numeric: tabular-nums; }
.analytics-hub .ah-bt__delta {
  margin-left: auto;
  padding: 2px 8px;
  border-radius: 20px;
  font-weight: 700;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.analytics-hub .ah-bt__delta.is-up { background: rgba(0,255,156,0.14); color: var(--ah-green); }
.analytics-hub .ah-bt__delta.is-down { background: rgba(255,77,109,0.14); color: var(--ah-red); }
.analytics-hub .ah-bt__delta.is-flat { background: rgba(138,147,173,0.18); color: var(--ah-dim); }

.analytics-hub .ah-bt__chart-wrap {
  position: relative;
  height: 340px;
  padding: 14px;
  background: rgba(0,0,0,0.25);
  border: 1px solid rgba(0,245,255,0.10);
  border-radius: 14px;
  margin-bottom: 10px;
}
.analytics-hub .ah-bt__stale {
  margin-bottom: 14px;
  padding: 10px 14px;
  background: rgba(255, 230, 0, 0.10);
  border: 1px solid rgba(255, 230, 0, 0.35);
  color: var(--ah-yellow);
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.4;
}

@media (max-width: 960px) {
  .analytics-hub .ah-bt__grid { grid-template-columns: repeat(2, 1fr); }
  .analytics-hub .ah-bt__chart-wrap { height: 280px; }
}
@media (max-width: 520px) {
  .analytics-hub .ah-bt__grid { grid-template-columns: 1fr; }
  .analytics-hub .ah-bt__chart-wrap { height: 240px; }
}

/* ============================================================
   Weiterbildungsmarkt-Sektion (KURSNET + MeinNow)
   Scope: .analytics-hub .ah-wbmarkt
   ============================================================ */
.analytics-hub .ah-wbmarkt {
  padding: 20px 22px;
  background: rgba(10, 14, 30, 0.55);
  border: 1px solid var(--ah-brd);
  border-radius: 18px;
  box-shadow: inset 0 0 0 1px rgba(0,245,255,0.05);
}
.analytics-hub .ah-wb__head .ah-section__title { margin: 0; }
.analytics-hub .ah-wb__sub {
  margin: 4px 0 16px; color: var(--ah-dim); font-size: 13px;
}
.analytics-hub .ah-wb__form {
  display: grid;
  grid-template-columns: 1.6fr 1fr auto;
  gap: 12px;
  margin-bottom: 20px;
  align-items: end;
}
.analytics-hub .ah-wb__field {
  display: flex; flex-direction: column; gap: 6px;
  font-size: 12px;
  color: var(--ah-dim);
}
.analytics-hub .ah-wb__field input {
  padding: 10px 12px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(0,245,255,0.20);
  border-radius: 10px;
  color: var(--ah-txt);
  font-size: 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.analytics-hub .ah-wb__field input:focus {
  outline: none;
  border-color: var(--ah-cyan);
  box-shadow: 0 0 0 3px rgba(0,245,255,0.15);
}
.analytics-hub .ah-wb__submit {
  padding: 10px 22px !important;
  background: linear-gradient(135deg, var(--ah-cyan), var(--ah-mag)) !important;
  color: #05050a !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 10px !important;
  cursor: pointer;
}
.analytics-hub .ah-wb__submit:hover { box-shadow: 0 0 20px rgba(0,245,255,0.35); }

.analytics-hub .ah-wb__kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}
.analytics-hub .ah-wb__kpi {
  padding: 14px 16px;
  background: linear-gradient(160deg, rgba(255,43,214,0.10), rgba(0,245,255,0.03));
  border: 1px solid rgba(255,43,214,0.20);
  border-radius: 12px;
}
.analytics-hub .ah-wb__kpi-v {
  font-family: "Merriweather", serif;
  font-size: 24px; font-weight: 700;
  color: var(--ah-txt);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.analytics-hub .ah-wb__kpi-l {
  font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--ah-dim);
  margin-top: 6px;
}

.analytics-hub .ah-wb__list {
  display: flex; flex-direction: column; gap: 10px;
  margin-bottom: 14px;
}
.analytics-hub .ah-wb__item {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  padding: 14px 16px;
  background: rgba(0, 245, 255, 0.04);
  border: 1px solid rgba(0, 245, 255, 0.14);
  border-radius: 12px;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.analytics-hub .ah-wb__item:hover {
  border-color: var(--ah-cyan);
  background: rgba(0, 245, 255, 0.08);
}
.analytics-hub .ah-wb__item-num {
  font-family: "Merriweather", serif;
  font-size: 18px; font-weight: 700;
  color: var(--ah-cyan);
  text-align: center;
  padding-top: 2px;
}
.analytics-hub .ah-wb__item-title {
  font-size: 14px; font-weight: 700;
  color: var(--ah-txt);
  margin-bottom: 6px;
  line-height: 1.35;
}
.analytics-hub .ah-wb__item-meta {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-bottom: 6px;
}
.analytics-hub .ah-wb__chip {
  display: inline-block;
  padding: 3px 10px;
  background: rgba(0,245,255,0.08);
  color: var(--ah-dim);
  border: 1px solid rgba(0,245,255,0.18);
  border-radius: 20px;
  font-size: 11px;
}
.analytics-hub .ah-wb__chip--ort {
  background: rgba(255, 43, 214, 0.08);
  color: var(--ah-mag);
  border-color: rgba(255, 43, 214, 0.30);
}
.analytics-hub .ah-wb__chip--date {
  background: rgba(0, 255, 156, 0.08);
  color: var(--ah-green);
  border-color: rgba(0, 255, 156, 0.30);
}
.analytics-hub .ah-wb__item-desc {
  font-size: 13px;
  color: var(--ah-dim);
  line-height: 1.45;
}

@media (max-width: 960px) {
  .analytics-hub .ah-wb__form { grid-template-columns: 1fr 1fr; }
  .analytics-hub .ah-wb__submit { grid-column: span 2; }
  .analytics-hub .ah-wb__kpis { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .analytics-hub .ah-wb__form { grid-template-columns: 1fr; }
  .analytics-hub .ah-wb__submit { grid-column: auto; }
  .analytics-hub .ah-wb__kpis { grid-template-columns: 1fr; }
  .analytics-hub .ah-wb__item { grid-template-columns: 1fr; }
  .analytics-hub .ah-wb__item-num { text-align: left; }
}

/* ============================================================
   News-Archiv-Sektion
   Scope: .analytics-hub .ah-news
   ============================================================ */
.analytics-hub .ah-news {
  padding: 20px 22px;
  background: rgba(10, 14, 30, 0.55);
  border: 1px solid var(--ah-brd);
  border-radius: 18px;
  box-shadow: inset 0 0 0 1px rgba(0,245,255,0.05);
}
.analytics-hub .ah-news .ah-wb__form { grid-template-columns: 1fr auto; }
.analytics-hub .ah-news__suggestions {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-bottom: 14px;
}
.analytics-hub .ah-news__sug {
  padding: 5px 14px;
  background: rgba(0,245,255,0.06);
  color: var(--ah-cyan);
  border: 1px solid rgba(0,245,255,0.20);
  border-radius: 20px;
  cursor: pointer;
  font-size: 12px;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
.analytics-hub .ah-news__sug:hover {
  background: rgba(0,245,255,0.14);
  box-shadow: 0 0 10px rgba(0,245,255,0.25);
}
.analytics-hub .ah-news__meta {
  font-size: 13px; color: var(--ah-dim);
  margin-bottom: 10px;
}
.analytics-hub .ah-news__meta strong { color: var(--ah-txt); }
.analytics-hub .ah-news__item {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 14px;
  padding: 14px 16px;
  background: rgba(255, 43, 214, 0.04);
  border: 1px solid rgba(255, 43, 214, 0.12);
  border-radius: 12px;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.analytics-hub .ah-news__item:hover {
  border-color: var(--ah-mag);
  background: rgba(255, 43, 214, 0.08);
}
.analytics-hub .ah-news__title {
  font-size: 14px; font-weight: 700;
  color: var(--ah-txt);
  margin-bottom: 6px;
  line-height: 1.35;
  display: block;
  text-decoration: none;
}
.analytics-hub .ah-news__title:hover { color: var(--ah-cyan); text-decoration: underline; }

@media (max-width: 520px) {
  .analytics-hub .ah-news .ah-wb__form { grid-template-columns: 1fr; }
  .analytics-hub .ah-news__item { grid-template-columns: 1fr; }
}

/* ===== User-Verwaltung (S15.1) ===== */
.users-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--s-4);
  margin-bottom: var(--s-6);
}
.users-stat {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  text-align: center;
}
.users-stat__val {
  font-family: Merriweather, serif;
  font-size: 36px;
  font-weight: 400;
  color: var(--au-rot, #e20613);
  line-height: 1;
}
.users-stat__lbl {
  margin-top: var(--s-2);
  color: var(--c-text-soft);
  font-size: 13px;
  letter-spacing: 0.02em;
}
.users-section { margin-bottom: var(--s-6); }
.users-section__title {
  font-family: Merriweather, serif;
  font-size: 20px;
  font-weight: 400;
  margin-bottom: var(--s-4);
  color: var(--c-text);
}
.users-section__title--muted { color: var(--c-text-soft); opacity: 0.75; }
.users-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: var(--s-4);
}
.user-card {
  background: var(--c-surface);
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  padding: var(--s-5);
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
}
.user-card--pending { border-left: 4px solid #f0a030; }
.user-card--active { border-left: 4px solid var(--au-rot, #e20613); }
.user-card--rejected { opacity: 0.7; border-left: 4px solid #888; }
.user-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--s-3);
}
.user-card__name {
  font-weight: 700;
  font-size: 16px;
  color: var(--c-text);
}
.user-card__me {
  color: var(--c-text-soft);
  font-weight: 400;
  font-size: 13px;
}
.user-card__badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}
.user-card__badge--pending { background: rgba(240,160,48,0.18); color: #c87a1a; }
.user-card__badge--rejected { background: rgba(120,120,120,0.18); color: #777; }
.user-card__badge--admin { background: rgba(226,6,19,0.14); color: var(--au-rot, #e20613); }
.user-card__badge--marketing { background: rgba(74,144,226,0.14); color: #2967a8; }
.user-card__badge--contributor { background: rgba(82,171,176,0.16); color: #3a8c90; }
.user-card__meta {
  font-size: 13px;
  color: var(--c-text-soft);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.user-card__role-desc {
  margin-top: var(--s-2);
  font-style: italic;
  font-size: 12px;
}
.user-card__actions {
  margin-top: var(--s-3);
  padding-top: var(--s-3);
  border-top: 1px dashed var(--c-border);
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2);
  align-items: center;
}
.user-card__role-label {
  font-size: 12px;
  color: var(--c-text-soft);
  flex-basis: 100%;
  margin-bottom: 2px;
}
.user-card__role-select {
  flex: 1 1 140px;
  min-width: 0;
  padding: 6px 8px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  background: var(--c-bg);
  color: var(--c-text);
  font-size: 13px;
}
.user-card__actions .btn { font-size: 13px; padding: 7px 12px; }
@media (max-width: 520px) {
  .users-list { grid-template-columns: 1fr; }
  .user-card__actions .btn { flex: 1; }
}

/* ===== Factory-Image-Upload (S15.3) ===== */
.ff-upload {
  display: flex;
  align-items: center;
  gap: var(--s-3);
  flex-wrap: wrap;
}
.ff-image-list {
  margin-top: var(--s-3);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: var(--s-2);
}
.ff-image-list:empty { display: none; }
.ff-image-item {
  display: flex;
  align-items: center;
  gap: var(--s-2);
  padding: 6px 8px;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  position: relative;
}
.ff-image-thumb {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: var(--r-sm);
  flex-shrink: 0;
}
.ff-image-info { flex: 1; min-width: 0; overflow: hidden; }
.ff-image-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--c-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ff-image-url {
  font-size: 11px;
  color: var(--c-text-soft);
  font-family: monospace;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ff-image-remove {
  background: none;
  border: none;
  color: var(--c-text-soft);
  font-size: 20px;
  font-weight: 700;
  cursor: pointer;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
}
.ff-image-remove:hover { background: rgba(226,6,19,0.12); color: var(--au-rot, #e20613); }
.ff-image-progress {
  margin-top: var(--s-2);
  padding: 8px 12px;
  background: rgba(74,144,226,0.1);
  border-radius: var(--r-md);
  font-size: 13px;
  color: var(--c-text);
}

/* ============================================================
   S16 — Smartphone-Audit Fixes (2026-04-22 Abend)
   Ziel-Viewports: iPhone SE 375, iPhone 13 Pro 390, Galaxy S21 360
   ============================================================ */
@media (max-width: 640px) {
  /* Header radikal entschlacken — nur Burger + Titel + Primäraktion */
  .header {
    padding: 0 var(--s-3);
    gap: var(--s-2);
    flex-wrap: nowrap;
  }
  .header__title { font-size: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

  /* Die 3 Ghost-Icons (Theme, Print, Export) + Cmd-Button auf Mobile verstecken */
  .header #btn-theme,
  .header #btn-print,
  .header #btn-export,
  .header #btn-cmd { display: none !important; }

  /* Suchfeld in zweite Zeile (FullWidth unter Header) */
  .search {
    position: fixed;
    top: var(--header-h);
    left: 0;
    right: 0;
    width: 100%;
    min-width: 0;
    padding: var(--s-2) var(--s-3);
    background: var(--c-bg);
    border-bottom: 1px solid var(--border-soft);
    z-index: 49;
    border-radius: 0;
  }
  .search__input { font-size: 16px; }  /* 16px verhindert iOS-Auto-Zoom */

  /* Main bekommt Platz für Fixed-Search-Bar (Header + Search ~60px) */
  .main { padding-top: 68px; }

  /* Hero-Date: kompaktere Darstellung, Umbruch erlauben */
  .hero-date {
    flex-wrap: wrap;
    gap: 4px 8px !important;
    font-size: 13px !important;
    padding: 8px 12px !important;
  }
  .hero-date .hero-kw {
    padding: 3px 8px !important;
    font-size: 10px !important;
  }

  /* "+ Neuer Post" im Header kompakter — nur Icon, Text kaschieren */
  .header #btn-new-post {
    padding: 8px 12px;
    min-width: 44px;
    min-height: 44px;
    flex-shrink: 0;
  }
  .header #btn-new-post span { display: none; }

  /* Header-Spacer wegnehmen, mit margin-left:auto rechts pushen */
  .header__spacer { display: none; }
  .header #btn-new-post { margin-left: auto; }

  /* Page-Header-Action-Buttons umbrechen (User-Verwaltung "Aktualisieren") */
  .page-header {
    flex-wrap: wrap;
    gap: var(--s-2);
  }
  .page-header__actions { width: 100%; }

  /* Hero: Datum-Chip kleiner, KW-Badge kompakter */
  .hero-date-chip,
  .dashboard-hero__date,
  .factory-hero__meta {
    font-size: 13px;
    flex-wrap: wrap;
    gap: 4px 8px;
  }

  /* User-Verwaltung: Stats-Grid auf Mobile horizontal (3 kleine Kacheln) */
  .users-stats {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--s-2);
  }
  .users-stat { padding: var(--s-3); }
  .users-stat__val { font-size: 28px; }
  .users-stat__lbl { font-size: 11px; line-height: 1.2; }

  /* User-Cards: 1 Spalte */
  .users-list { grid-template-columns: 1fr; gap: var(--s-3); }
  .user-card { padding: var(--s-4); }
  .user-card__actions .btn { flex: 1 1 auto; min-height: 44px; }
  .user-card__role-select { min-height: 44px; font-size: 14px; }

  /* Factory-Modal: Inputs auf 16px für iOS-No-Zoom */
  .form-input,
  .form-textarea { font-size: 16px !important; }

  /* Factory-Upload-Liste: kompakter */
  .ff-image-list { grid-template-columns: 1fr; }
  .ff-image-item { padding: 8px; }
  .ff-upload { flex-direction: column; align-items: stretch; gap: var(--s-2); }
  .ff-upload .btn { min-height: 44px; }

  /* Alle Touch-Targets mindestens 44×44 (WCAG AA 2.5.5) */
  .btn,
  .nav__item,
  .factory-card__react,
  .factory-detail__react,
  .modal__close {
    min-height: 44px;
  }
  .modal__close { min-width: 44px; font-size: 22px; }

  /* Tabellen horizontal scrollbar machen statt Viewport sprengen */
  table { display: block; overflow-x: auto; max-width: 100%; }

  /* Analytics-Hub: Formular-Grids 1-spaltig (schon teilweise, hier erzwingen) */
  .analytics-hub .ah-wb__form,
  .analytics-hub .ah-wb__results,
  .analytics-hub .ah-am__regions,
  .analytics-hub .ah-news__list { grid-template-columns: 1fr !important; }

  /* Auth-Forms (Login/Register) noch komfortabler */
  .auth-card input { font-size: 16px; }
}

/* ---- Sehr kleine Smartphones (≤380px: iPhone SE, Galaxy S-Mini) ---- */
@media (max-width: 380px) {
  .users-stats { grid-template-columns: 1fr; }  /* bei extrem schmal wieder stapeln */
  .header__title { font-size: 15px; }
  .header { gap: 6px; padding: 0 var(--s-2); }
  .main { padding: var(--s-2); padding-top: calc(var(--s-6) + 4px); }
}