*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg: #F4F7F5; --white: #FFFFFF; --black: #1B2427;
  --gray: #6E6E73; --lgray: #E0E0E5; --xlight: #F4F7F5;
  --blue: #0071E3; --green: #34C759; --amber: #E9A23B; --red: #FF3B30; --purple: #0E3B43;
  --brand-dark: #0E3B43; --brand-accent: #15805F;
  --petrol: #0E3B43; --mint: #2FD3A0; --tanne: #15805F; --tanne-dunkel: #0F6B4F; --ocker: #E9A23B; --nebel: #F4F7F5; --schiefer: #1B2427;
  --font-display: 'Schibsted Grotesk', 'Source Sans 3', -apple-system, sans-serif; --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --shadow: 0 1px 2px rgba(14,59,67,0.04), 0 4px 14px rgba(14,59,67,0.05); --shadow-md: 0 4px 16px rgba(14,59,67,0.06), 0 16px 40px rgba(14,59,67,0.08); --shadow-lg: 0 8px 24px rgba(14,59,67,0.07), 0 28px 64px rgba(14,59,67,0.10); --r: 24px; --r-lg: 30px; --border: 1px solid rgba(14,59,67,0.06);
  --band-pad: 32px; --gap: 22px;
  --card-grad: #FFFFFF;
}
html { scroll-behavior: smooth; overflow-x: hidden; }
body { font-family: 'Source Sans 3', -apple-system, 'Segoe UI', sans-serif; background: var(--bg); color: var(--black); font-size: 15px; line-height: 1.5; overflow-x: hidden; }

/* NAV */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  height: 52px; background: rgba(14,59,67,0.9); backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255,255,255,0.08);
  display: flex; align-items: center; padding: 0 32px; gap: 20px;
}
.nav-logo { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.brand-mark { width: 32px; height: 32px; display: flex; flex-shrink: 0; }
.brand-mark svg { width: 32px; height: 32px; display: block; }
.nav-name-stack { display: flex; flex-direction: column; justify-content: center; line-height: 1; }
.nav-product { font-size: 17px; font-weight: 800; color: #fff; letter-spacing: -0.2px; }
.nav-divider { width: 1px; height: 18px; background: rgba(255,255,255,0.15); flex-shrink: 0; margin: 0 2px; }
.nav-client { font-size: 12px; font-weight: 500; color: rgba(255,255,255,0.5); white-space: nowrap; }
.nav-spacer { flex: 1; }
.nav-right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.nav-date { font-size: 12px; color: rgba(255,255,255,0.4); }
/* Datenstand-Chip (T-142): dauerhaft in der Top-Nav, klickbar (öffnet die
   Datenverwaltung, bis T-144 den Import). Dunkler Nav-Ton wie die bisherige
   Stand-Anzeige, als Pille mit dezentem Hover statt reinem Text. */
.nav-datenstand {
  font-size: 12px; color: rgba(255,255,255,0.55); background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 999px; padding: 5px 12px;
  cursor: pointer; font-family: inherit; white-space: nowrap; transition: all 0.2s;
}
.nav-datenstand:hover { color: #fff; background: rgba(255,255,255,0.12); }
.nav-datenstand.nav-datenstand-loading { color: rgba(255,255,255,0.4); cursor: default; }
@media (max-width: 1080px) { .nav-datenstand { display: none !important; } }
.nav-av { position: relative; overflow: hidden; width: 30px; height: 30px; border-radius: 50%; background: var(--mint); display: flex; align-items: center; justify-content: center; color: var(--petrol); font-weight: 700; font-size: 11px; }
/* Logo statt Initialen (T-115): das Bild liegt absolut über der Kreisfläche, die Initialen bleiben dahinter als Fallback. */
.nav-av-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 3px; box-sizing: border-box; background: var(--white); }

/* ── BAND SYSTEM ── jede thematische Sektion ist ein abgegrenztes Band ── */
.band { position: relative; isolation: isolate; padding: var(--band-pad) 40px; overflow: hidden; }
.band-inner { position: relative; z-index: 2; max-width: 1320px; margin: 0 auto; }
/* HG-Layer: pro Band ein Foto (inline background-image setzen) ODER ein Verlauf via .b-*-Klasse */
.band-bg { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; opacity: 0.5; filter: saturate(0.7) brightness(1.02); }
.band-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(244,247,245,0.95) 0%, rgba(244,247,245,0.74) 38%, rgba(244,247,245,0.82) 100%); }
/* Verlaufs-Bänder (kein Foto) — sanfte Farbwaschungen */
.b-warm  { background: linear-gradient(165deg,#EEF8F3 0%,#E6F3EC 45%,#F4F7F5 100%); }
.b-cool  { background: linear-gradient(165deg,#ECF3F4 0%,#E6EEF0 45%,#F4F7F5 100%); }
.b-lav   { background: linear-gradient(165deg,#ECF3F4 0%,#E6EEF0 45%,#F4F7F5 100%); }
.b-amber { background: linear-gradient(165deg,#FCF6E8 0%,#F8EFD9 45%,#F6F4EC 100%); }
.b-mint  { background: linear-gradient(165deg,#EDFBF3 0%,#E9F6EF 45%,#F4F7F5 100%); }
.b-plain { background: linear-gradient(180deg,#F7F9F8 0%,#F4F7F5 100%); }
.band-head { margin-bottom: 8px; }

/* ── HERO CARD ── der Monatsgewinn als helle, breite Kachel im obersten Band ── */
.hero-card { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--r-lg); border: var(--border); box-shadow: var(--shadow-lg); background: var(--white); padding: 28px 40px; margin-bottom: 22px; min-height: 0; display: flex; flex-direction: column; justify-content: center; }
/* Foto-Layer der Hero-Kachel — das Bild setzt applyTheme (ui/theme.js) je Skin */
.hero-card-bg { position: absolute; inset: 0; z-index: 0; background: center/cover no-repeat; opacity: 0.5; filter: saturate(0.7) brightness(1.05); }
.hero-card-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(100deg, rgba(255,255,255,0.97) 0%, rgba(255,255,255,0.92) 42%, rgba(255,255,255,0.62) 78%, rgba(255,255,255,0.4) 100%); }
.hero-card > *:not(.hero-card-bg):not(.hero-card-overlay) { position: relative; z-index: 2; }
.hero-firm { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.hero-av-wrap { position: relative; width: 48px; height: 48px; flex-shrink: 0; }
/* Logo statt Initialen (T-115): deckt das SVG mit den Initialen komplett ab, gleicher Radius wie dessen abgerundetes Rechteck (rx=12). */
.hero-av-img { position: absolute; inset: 0; width: 48px; height: 48px; border-radius: 12px; object-fit: contain; padding: 4px; box-sizing: border-box; background: var(--white); border: 1px solid rgba(14,59,67,0.08); }
.hero-firm-name { font-size: 20px; font-weight: 800; color: var(--black); letter-spacing: -0.5px; text-align: left; }
.hero-firm-loc  { font-size: 13px; color: var(--gray); margin-top: 2px; text-align: left; }
.hero-eyebrow { display: inline-flex; align-items: center; gap: 8px; background: rgba(47,211,160,0.08); border: 1px solid rgba(47,211,160,0.22); border-radius: 50px; padding: 7px 16px; color: var(--tanne-dunkel); font-size: 13px; font-weight: 600; margin-bottom: 22px; align-self: flex-start; }
.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: #34C759; }
@keyframes pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:0.6; transform:scale(0.8); } }
.hero-month { font-size: 17px; font-weight: 500; color: var(--gray); margin-bottom: 6px; }
.hero-number { font-size: clamp(48px,6vw,68px); font-weight: 900; letter-spacing: -3px; line-height: 1; margin-bottom: 6px; color: var(--black); }
.hero-label { font-size: 19px; font-weight: 600; color: var(--gray); margin-bottom: 8px; }
.hero-tagline { font-size: 16px; color: var(--gray); margin-bottom: 18px; max-width: 540px; line-height: 1.5; }
.hero-zahlen { display: grid; grid-template-columns: repeat(3, minmax(0, max-content)); gap: 18px 44px; margin-bottom: 20px; }
.hero-zahl-wert { font-family: var(--font-display); font-variant-numeric: proportional-nums; font-size: clamp(26px,3vw,36px); font-weight: 900; letter-spacing: -1.5px; line-height: 1.05; color: var(--black); }
.hero-zahl-lbl { font-size: 14px; font-weight: 600; color: var(--gray); margin-top: 4px; }
.hero-zahl-sub { font-size: 12px; color: var(--gray); margin-top: 1px; }
@media (min-width: 900px) {
  .hero-row { display: grid; grid-template-columns: auto 1fr; column-gap: 48px; margin-bottom: 20px; }
  .hero-main { display: contents; }
  .hero-row .hero-month, .hero-row .hero-number, .hero-row .hero-label, .hero-row .hero-tagline { grid-column: 1; }
  .hero-row .hero-tagline { margin-bottom: 0; }
  .hero-row .hero-zahlen { grid-column: 2; grid-row: 2; align-self: center; justify-self: end; margin-bottom: 0; }
}
.hero-pills { display: flex; gap: 10px; flex-wrap: wrap; }
.hero-pill { display: inline-flex; align-items: center; gap: 7px; background: rgba(255,255,255,0.85); backdrop-filter: blur(8px); border: 1px solid rgba(14,59,67,0.08); border-radius: 50px; padding: 8px 16px; color: var(--black); font-size: 13px; font-weight: 600; box-shadow: var(--shadow); }

/* SECTION WRAPPERS */
.section { padding: 64px 40px; max-width: 1320px; margin: 0 auto; }
.section-dark { background: var(--black); padding: 72px 40px; }
.section-dark-inner { max-width: 1320px; margin: 0 auto; }
.section-lbl { font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--blue); margin-bottom: 8px; display: inline-flex; align-items: center; gap: 7px; }
.section-lbl.amber { color: var(--tanne); }
.section-title { font-size: clamp(24px,2.8vw,32px); font-weight: 800; letter-spacing: -0.025em; color: var(--black); line-height: 1.08; margin-bottom: 6px; }
.section-title.light { color: #fff; }
.section-sub { font-size: 15px; color: var(--gray); max-width: 760px; }
.section-sub.light { color: rgba(255,255,255,0.45); }

/* CARD */
.card { background: var(--card-grad); border-radius: var(--r); box-shadow: var(--shadow); border: var(--border); padding: 24px; }

/* SCORE + ACHIEVEMENTS */
.score-grid { display: grid; grid-template-columns: 1fr 1.8fr; gap: var(--gap); margin-top: 22px; }
/* Echter Mandant (T-117): Score-Karte fehlt im Markup — die Achievement-
   Kacheln bekommen die volle Breite statt der 1fr-Lücke, in der vorher die
   Score-Karte stand. (achieve-grid bleibt beim 2er-Raster — die dritte
   Kachel reiht sich darunter ein, s. die Responsive-Regeln weiter unten.) */
body.is-imported .score-grid { grid-template-columns: 1fr; }
.score-card { background: #FFFFFF; border-radius: var(--r); padding: 36px; box-shadow: var(--shadow-md); border: var(--border); display: flex; flex-direction: column; align-items: center; text-align: center; position: relative; overflow: hidden; isolation: isolate; }
.score-card-bg, .score-card-overlay { display: none !important; }
.score-card-bg { position: absolute; inset: 0; z-index: 0; background: center top / cover no-repeat; opacity: 0.62; filter: saturate(0.5) brightness(0.8); }
.score-card-overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(to bottom, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.3) 35%, rgba(255,255,255,0.78) 55%, rgba(255,255,255,0.96) 70%, rgba(255,255,255,1) 82%); }
.score-card > *:not(.score-card-bg):not(.score-card-overlay) { position: relative; z-index: 2; }
.score-card-bg, .score-card-overlay { position: absolute !important; }
.ring-wrap { position: relative; width: 170px; height: 170px; margin-bottom: 16px; }
.ring-wrap svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ring-ticks { fill: none; stroke: #D8DCE3; stroke-width: 5; stroke-dasharray: 1.5 9.3; stroke-linecap: round; }
.ring-track { fill: none; stroke: rgba(14,59,67,0.10); stroke-width: 13; }
.ring-prog { fill: none; stroke-width: 13; stroke-linecap: round; stroke: url(#rg); }
.ring-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.score-num { font-size: 40px; font-weight: 800; letter-spacing: -2px; color: var(--petrol); }
.score-denom { font-size: 13px; color: var(--gray); margin-top: 2px; }
.level-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 14px; border-radius: 50px; font-size: 13px; font-weight: 700; margin-bottom: 10px; }
.lv-bronze { background: #FEF3C7; color: #92400E; }
.lv-silver { background: #F1F5F9; color: #475569; border: 1px solid #CBD5E1; }
.lv-gold   { background: linear-gradient(135deg,#FFF3D0,#FFE8A3); color: #92400E; border: 1px solid rgba(245,158,11,0.3); }
.score-title { font-size: 17px; font-weight: 700; margin-bottom: 3px; }
.score-sub { font-size: 13px; color: var(--gray); margin-bottom: 20px; }

/* RANK PROGRESS inside score card */
.rank-progress { width: 100%; background: var(--bg); border-radius: 12px; padding: 16px; margin-top: 4px; }
.rp-heading { font-size: 12px; font-weight: 700; color: var(--black); margin-bottom: 12px; text-align: left; }
.rp-scale { position: relative; height: 10px; background: var(--lgray); border-radius: 10px; margin-bottom: 8px; }
.rp-fill { position: absolute; left: 0; top: 0; bottom: 0; background: var(--mint); border-radius: 10px; transition: width 1s cubic-bezier(0.34,1.2,0.64,1); }
.rp-you { position: absolute; top: 50%; transform: translate(-50%,-50%); width: 16px; height: 16px; border-radius: 50%; background: var(--tanne); border: 3px solid white; box-shadow: 0 2px 6px rgba(0,0,0,.2); z-index: 2; }
.rp-next { position: absolute; top: 50%; transform: translate(-50%,-50%); width: 12px; height: 12px; border-radius: 50%; background: var(--lgray); border: 3px solid white; box-shadow: 0 2px 6px rgba(0,0,0,.2); }
.rp-labels { display: flex; justify-content: space-between; font-size: 11px; }
.rp-gap { margin-top: 12px; font-size: 13px; font-weight: 600; color: var(--black); text-align: left; }
.rp-gap span { color: var(--tanne); }

/* Level nodes strip — elegant emoji-circle stepper */
.level-strip { display: flex; align-items: center; width: 100%; margin-bottom: 14px; padding: 0 4px; }
.lv-step { display: flex; flex-direction: column; align-items: center; gap: 5px; flex-shrink: 0; min-width: 0; }
.lv-dot  { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; line-height: 1; background: #F1F5F9; transition: all 0.3s ease; }
.lv-dot.done    { background: #F1F5F9; filter: grayscale(0.4); opacity: 0.85; }
.lv-dot.current { width: 36px; height: 36px; font-size: 16px; background: var(--mint); box-shadow: 0 4px 12px rgba(47,211,160,0.35), 0 0 0 3px rgba(47,211,160,0.12); }
.lv-dot.nxt     { background: linear-gradient(135deg,#FFF3D0,#FFE8A3); box-shadow: 0 0 0 1.5px rgba(47,211,160,0.25); }
.lv-dot.future  { background: #F8FAFC; filter: grayscale(0.5); opacity: 0.55; }
.lv-lbl { font-size: 9.5px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--gray); text-align: center; }
.lv-step.is-current .lv-lbl { color: var(--tanne); }
.lv-step.is-nxt .lv-lbl { color: #92400E; }
.lv-step:not(.is-current):not(.is-nxt) .lv-lbl { opacity: 0; }
.lv-line { flex: 1 1 8px; min-width: 6px; height: 2px; background: var(--lgray); margin: 0 2px; align-self: flex-start; margin-top: 14px; border-radius: 1px; }
.lv-line.done { background: var(--mint); }

/* ACHIEVEMENTS */
.achieve-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.ac { background: var(--white); border-radius: var(--r); padding: 16px 18px 14px; box-shadow: var(--shadow); border: var(--border); position: relative; overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; cursor: default; display: flex; flex-direction: column; min-height: 0; }
.ac:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
/* Pastell-Farbverlauf-HG je Kategorie (statt farbigem Balken oben) */
.ac-top   { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.ac-cat   { font-size: 10px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; padding: 3px 8px; border-radius: 5px; width: fit-content; margin-bottom: 12px; }
.ac-cat-gold   { background: #F8EBD0; color: #7A5008; }
.ac-cat-green  { background: #E3F5EE; color: #0F6B4F; }
.ac-cat-blue   { background: #E3F5EE; color: #0F6B4F; }
.ac-cat-purple { background: #E6EEF0; color: #0E3B43; }
.ac-hero-row  { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.ac-big-stat  { font-size: 28px; font-weight: 900; letter-spacing: -1.5px; line-height: 1; }
.ac-icon      { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 19px; line-height: 1; }
.ac-icon.i-amber  { background: #FCEBCF; }
.ac-icon.i-green  { background: #D1FAE5; }
.ac-icon.i-blue   { background: #DBEAFE; }
.ac-icon.i-purple { background: #EDE9FE; }
.ac-title     { font-size: 13px; font-weight: 700; color: var(--black); margin-bottom: 2px; }
.ac-sub       { font-size: 11.5px; color: var(--gray); }
.ac-new       { font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 20px; background: var(--mint); color: var(--petrol); flex-shrink: 0; }
.ac-visual    { margin-top: auto; padding-top: 10px; }
.ac-bars      { display: flex; align-items: flex-end; gap: 5px; height: 38px; }
.ac-bar       { flex: 0 1 18px; min-width: 6px; background: #F3F4F6; border-radius: 4px 4px 0 0; transition: height 0.4s ease; }
.ac-bar-gold  { background: #E9A23B; }
.ac-bar-green { background: #15805F; }
.ac-dots-row  { display: flex; gap: 7px; flex-wrap: wrap; }
.ac-month-dot { display: flex; flex-direction: column; align-items: center; gap: 3px; flex: 0 0 auto; }
.ac-dot-circle { width: 26px; height: 26px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 11px; }
.ac-dot-active .ac-dot-circle { background: #15805F; color: white; }
.ac-dot-inactive .ac-dot-circle { background: #E3F5EE; color: #15805F; }
.ac-dot-lbl   { font-size: 9px; color: var(--gray); font-weight: 600; }
.ac-bench-mini { position: relative; height: 8px; background: var(--lgray); border-radius: 10px; overflow: visible; margin-bottom: 6px; }
.ac-bench-zone { position: absolute; top: 0; bottom: 0; border-radius: 10px; opacity: 0.35; }
.ac-bench-pin  { position: absolute; top: 50%; transform: translate(-50%,-50%); width: 14px; height: 14px; border-radius: 50%; background: #0E3B43; border: 2.5px solid white; box-shadow: 0 0 0 1.5px #0E3B43; z-index: 2; }
.ac-bench-labels { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--gray); }
.ac-comp-rows  { display: flex; flex-direction: column; gap: 5px; }
.ac-comp-row   { display: flex; align-items: center; gap: 7px; }
.ac-comp-lbl   { font-size: 10px; color: var(--gray); width: 34px; flex-shrink: 0; }
.ac-comp-track { flex: 1; height: 14px; background: var(--lgray); border-radius: 4px; overflow: hidden; position: relative; }
.ac-comp-fill  { height: 100%; border-radius: 4px; }
.ac-comp-val   { font-size: 10px; font-weight: 700; width: 62px; text-align: right; flex-shrink: 0; }

/* KPI GRID */
.kpi-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: var(--gap); margin-top: 20px; }
.kpi-card { position: relative; overflow: hidden; display: flex; flex-direction: column; background: var(--white); border-radius: var(--r); padding: 20px; box-shadow: var(--shadow); border: var(--border); transition: transform 0.2s ease, box-shadow 0.2s ease; }
.kpi-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.kpi-card.k-blue { background: var(--white); }
.kpi-card.k-green { background: var(--white); }
.kpi-card.k-purple { background: var(--white); }
.kpi-card.k-mint { background: var(--white); }
/* Dunkle Akzent-Kachel (Solar-Stil) */
.kpi-card.k-dark   { background: var(--petrol); border: none; color: #fff; box-shadow: var(--shadow-md); }
.kpi-card.k-dark .kpi-lbl { color: rgba(255,255,255,0.6); }
.kpi-card.k-dark .kpi-val { color: #fff; }
.kpi-card.k-dark .bench-mini-lbl { color: rgba(255,255,255,0.5); }
.kpi-card.k-dark .bench-track { background: rgba(255,255,255,0.14); }
.kpi-card.k-dark .kpi-delta.neu { color: rgba(255,255,255,0.7); }
.kpi-card.k-dark .kpi-delta.neu::before { background: rgba(255,255,255,0.7); }
.kpi-card > * { position: relative; z-index: 1; }
.kpi-top  { display: flex; align-items: center; justify-content: flex-end; margin-bottom: 14px; min-height: 18px; }
.kpi-icon { width: 42px; height: 42px; border-radius: 13px; display: flex; align-items: center; justify-content: center; font-size: 20px; line-height: 1; }
.kpi-icon.i-blue   { background: #DBEAFE; }
.kpi-icon.i-green  { background: #D1FAE5; }
.kpi-icon.i-purple { background: #EDE9FE; }
.kpi-icon.i-mint   { background: #CFFAFE; }
.kpi-card.k-dark .kpi-icon { background: rgba(255,255,255,0.12); }
.kpi-lbl  { font-size: 12px; font-weight: 600; letter-spacing: 0.02em; color: var(--gray); margin-bottom: 7px; }
.kpi-val  { font-size: 31px; font-weight: 800; letter-spacing: -1.5px; color: var(--black); line-height: 1; margin-bottom: 16px; }
.kpi-delta { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 700; }
.kpi-delta.up   { color: var(--green); }
.kpi-delta.down { color: var(--red); }
.kpi-delta.neu  { color: var(--gray); }
.kpi-delta::before { font-size: 15px; line-height: 1; flex-shrink: 0; }
.kpi-delta.up::before   { content: ''; display: inline-block; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 8px solid var(--green); margin-bottom: 1px; }
.kpi-delta.down::before { content: ''; display: inline-block; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 8px solid var(--red); margin-top: 1px; }
.kpi-delta.neu::before  { content: ''; display: inline-block; width: 8px; height: 2.5px; background: var(--gray); border-radius: 2px; margin-bottom: 1px; }
.ti { display: inline-block; vertical-align: middle; margin-left: 4px; }
/* Polster-Kachel (T-148): ersetzt für echte Mandanten die Kontostand-Kachel */
.polster-card .kpi-val { margin-bottom: 10px; }
.polster-zeile { font-size: 12px; line-height: 1.45; color: rgba(255,255,255,0.72); margin-bottom: 4px; }
.polster-hinweis { font-size: 11.5px; line-height: 1.45; color: var(--ocker); margin-top: 6px; }
.polster-links { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: auto; padding-top: 10px; }
.kpi-card.k-dark .polster-link { color: var(--mint); font-size: 12px; }
.kpi-card.k-dark .polster-link:hover { color: #8CEBCB; }
.ti-up   { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 6px solid var(--green); margin-bottom: 1px; }
.ti-down { width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 6px solid var(--red); margin-top: 1px; }
.ti-neu  { width: 7px; height: 2px; background: var(--gray); border-radius: 2px; }
.bench-mini-lbl { font-size: 10.5px; color: var(--gray); margin-bottom: 5px; margin-top: auto; padding-top: 8px; }
.bench-track { height: 5px; background: var(--bg); border-radius: 10px; position: relative; }
.bench-you-dot { position: absolute; top: 50%; transform: translate(-50%,-50%); width: 12px; height: 12px; border-radius: 50%; border: 2.5px solid white; box-shadow: 0 0 0 1.5px currentColor, var(--shadow); z-index: 2; }
.bench-you-dot.g { color: var(--green); background: var(--green); }
.bench-you-dot.b { color: #2563EB; background: #2563EB; }
.bench-you-dot.a { color: var(--amber); background: var(--amber); }
.bench-you-dot.r { color: var(--red); background: var(--red); }
.bench-rank-lbl { display: flex; align-items: center; gap: 5px; margin-top: 8px; font-size: 12px; font-weight: 600; }

/* BENCHMARK DARK SECTION */
.bench-grid { display: grid; gap: var(--gap); margin-top: 22px; }
.bench-row-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 28px; }
.bench-row-name { font-size: 17px; font-weight: 700; color: var(--black); }
.bench-row-val  { font-size: 22px; font-weight: 800; color: var(--black); letter-spacing: -0.5px; }
.rk-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 20px; margin-left: 10px; }
.rk-green  { background: rgba(52,199,89,.16);  color: #16A34A; }
.rk-blue   { background: rgba(0,113,227,.14);  color: #1D4ED8; }
.rk-amber  { background: rgba(233,162,59,.20); color: #8A5A0B; }
.bench-range-wrap { position: relative; padding-bottom: 36px; }
.bench-range-track { height: 8px; background: rgba(14,59,67,0.07); border-radius: 10px; position: relative; overflow: visible; }
.bench-zone { position: absolute; top: 0; bottom: 0; border-radius: 10px; opacity: 0.32; }
.bench-range-labels { display: flex; justify-content: space-between; position: relative; height: 34px; margin-top: 8px; }
.bench-rl { font-size: 10px; color: var(--gray); opacity: 0.7; text-align: center; position: absolute; transform: translateX(-50%); }
.bench-rl b { display: block; color: var(--black); opacity: 0.85; font-weight: 600; }
.bench-marker { position: absolute; top: 50%; transform: translate(-50%,-50%); z-index: 10; }
.bench-marker-dot { width: 20px; height: 20px; border-radius: 50%; background: var(--brand-accent); box-shadow: 0 0 0 4px rgba(47,211,160,0.18); display: flex; align-items: center; justify-content: center; font-size: 9px; color:#fff; }
.bench-marker-label { position: absolute; top: -27px; left: 50%; transform: translateX(-50%); background: var(--black); color: #fff; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 5px; white-space: nowrap; }
.bench-marker-label::after { content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:4px solid transparent; border-top-color:var(--black); }
.bench-gap-line { margin-top: 6px; font-size: 12px; color: var(--gray); }
.bench-gap-line strong { color: var(--black); }
.bench-grid > .bench-row { background: var(--card-grad); border-radius: var(--r); padding: 28px 32px; box-shadow: var(--shadow); border: var(--border); }

/* EMPFEHLUNGEN */
.emp-section { background: var(--bg); padding: 72px 40px; }
.emp-section-inner { max-width: 1320px; margin: 0 auto; }
.emp-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--gap); margin-top: 22px; }
.emp-card { background: var(--white); border-radius: var(--r); padding: 32px; box-shadow: var(--shadow); border: 1px solid var(--lgray); position: relative; overflow: hidden; transition: transform 0.2s, box-shadow 0.2s; }
.emp-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.emp-bg-num { position: absolute; top: -10px; right: 16px; font-size: 100px; font-weight: 900; color: var(--bg); line-height: 1; pointer-events: none; user-select: none; z-index: 0; opacity: 0.55; }
.emp-card > *:not(.emp-bg-num) { position: relative; z-index: 1; }
.emp-cat { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 4px 10px; border-radius: 6px; margin-bottom: 14px; }
.emp-title { font-size: 19px; font-weight: 800; letter-spacing: -0.5px; color: var(--black); margin-bottom: 10px; line-height: 1.2; }
.emp-desc { font-size: 14px; color: var(--gray); line-height: 1.55; margin-bottom: 20px; }
.emp-metrics { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.emp-metric { padding: 6px 12px; border-radius: 8px; font-size: 13px; font-weight: 700; }
.emp-metric.money  { background: #ECFDF5; color: #059669; }
.emp-metric.pts    { background: #E6EEF0; color: var(--petrol); }
.emp-metric.time   { background: var(--bg); color: var(--gray); font-weight: 500; }
.emp-bar-wrap { background: var(--bg); border-radius: 8px; padding: 10px 12px; }
.emp-bar-lbl { font-size: 11px; color: var(--gray); margin-bottom: 6px; }
.emp-bar-track { height: 6px; background: var(--lgray); border-radius: 10px; overflow: hidden; }
.emp-bar-fill { height: 100%; border-radius: 10px; }
.emp-bar-txt { font-size: 11px; margin-top: 5px; font-weight: 600; }

/* Combined callout */
.emp-combined { margin-top: 20px; background: #E8F8F2; border: 1px solid rgba(47,211,160,0.35); border-radius: 16px; padding: 20px 24px; display: flex; align-items: center; gap: 16px; }
.emp-combined-icon { font-size: 28px; flex-shrink: 0; }
.emp-combined-text { font-size: 15px; color: var(--petrol); line-height: 1.4; }
.emp-combined-text strong { font-weight: 800; font-size: 17px; display: block; margin-bottom: 2px; }

/* CHARTS */
.charts-grid { display: grid; grid-template-columns: 3fr 2fr; gap: var(--gap); margin-top: 22px; }
.charts-grid > .card { min-width: 0; }
/* Ein Monat: Verlauf-Karte nur so hoch wie ihr Hinweis, kein leerer Block neben dem Donut. */
.charts-grid:has(#trendCard.ein-monat) { align-items: start; }
.charts-grid canvas { max-width: 100% !important; }
.cc-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 22px; }
.cc-title { font-size: 16px; font-weight: 700; }
.cc-sub   { font-size: 13px; color: var(--gray); margin-top: 2px; }
.cc-pill  { font-size: 11px; font-weight: 700; padding: 6px 12px; border-radius: 20px; background: rgba(47,211,160,0.08); color: var(--tanne-dunkel); border: 1px solid rgba(47,211,160,0.18); letter-spacing: 0.01em; }
.cc-pill-warn { background: rgba(220,38,38,0.08); color: #B91C1C; border-color: rgba(220,38,38,0.22); cursor: help; }
.donut-wrap { position: relative; height: 170px; }
.donut-ctr { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center; pointer-events: none; }
.donut-ctr-lbl { font-size: 11px; color: var(--gray); font-weight: 500; }
.donut-ctr-val { font-size: 16px; font-weight: 800; letter-spacing: -0.5px; margin-top: 2px; }
.leg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; margin-top: 16px; }
.leg-item { display: flex; align-items: center; gap: 7px; padding: 5px 8px; background: var(--bg); border-radius: 7px; }
.leg-dot  { width: 9px; height: 9px; border-radius: 3px; flex-shrink: 0; }
.leg-name { font-size: 11.5px; color: var(--gray); flex: 1; }
.leg-val  { font-size: 11.5px; font-weight: 600; }

/* BWA */
.bwa-streak-grid { display: grid; grid-template-columns: 2fr 1fr; gap: var(--gap); margin-top: 22px; }
/* Echter Mandant (T-117): Streak-Karte fehlt im Markup — die BWA-Tabelle
   bekommt die volle Breite statt der 1fr-Lücke, in der vorher die
   Streak-Karte stand. */
body.is-imported .bwa-streak-grid { grid-template-columns: 1fr; }
.bwa-t { width: 100%; border-collapse: collapse; }
.bwa-t th { font-size: 10.5px; font-weight: 600; color: var(--gray); text-transform: uppercase; letter-spacing: 0.05em; padding: 0 6px 10px; text-align: right; border-bottom: 1px solid var(--lgray); }
.bwa-t th:first-child { text-align: left; }
.bwa-t td { padding: 5px 6px; font-size: 13px; text-align: right; border-bottom: 1px solid #F4F7F5; }
.bwa-t td:first-child { text-align: left; }
.bwa-t tr:last-child td { border-bottom: none; }
.bwa-t .sep  td { border-top: 2px solid var(--lgray); padding-top: 10px; }
.bwa-t .bold td { font-weight: 700; }
.bwa-edit { background:none; border:none; padding:2px 4px; margin-right:4px; color:var(--gray); opacity:0.4; cursor:pointer; vertical-align:middle; border-radius:6px; line-height:1; }
.bwa-t tr:hover .bwa-edit, .bwa-edit:focus-visible { opacity:1; color:var(--tanne); }
.bwa-edit:focus-visible { outline:2px solid var(--tanne); }
.bwa-korr { border-bottom:1px dotted var(--ocker); cursor:help; }
.bwa-korr::after { content:''; display:inline-block; width:5px; height:5px; margin-left:4px; border-radius:50%; background:var(--ocker); vertical-align:middle; }
.bwa-protokoll-link { margin:10px 0 4px; text-align:right; }
.bwa-protokoll th, .bwa-protokoll td { text-align:left; font-size:12px; }
.bwa-t .ebit td { font-weight: 800; font-size: 14px; color: var(--tanne); }
.bwa-ytd-hinweis { margin-top: 12px; padding: 10px 12px; font-size: 12.5px; line-height: 1.45; color: #B91C1C; background: rgba(220,38,38,0.06); border: 1px solid rgba(220,38,38,0.18); border-radius: 10px; }
.tneg { color: var(--gray) !important; }
.tmuted { color: var(--gray) !important; font-style: italic; font-weight: 400 !important; }

/* STREAK */
.streak-card { background: var(--card-grad); border-radius: var(--r); padding: 28px; box-shadow: var(--shadow); border: 1px solid var(--lgray); }
.streak-title { font-size: 16px; font-weight: 700; margin-bottom: 20px; }
.goal-item { margin-bottom: 18px; }
.goal-head { display: flex; justify-content: space-between; margin-bottom: 6px; }
.goal-name { font-size: 13px; font-weight: 600; }
.goal-pct  { font-size: 13px; font-weight: 700; }
.goal-track { height: 7px; background: var(--bg); border-radius: 10px; overflow: hidden; }
.goal-fill { height: 100%; border-radius: 10px; transition: width 1s cubic-bezier(0.34,1.2,0.64,1); }
.streak-row { display: flex; gap: 7px; margin-top: 22px; margin-bottom: 5px; }
.s-dot { flex: 1; height: 34px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.streak-lbl { font-size: 12px; color: var(--gray); }

/* DASHBOARD-ANPASSEN TOGGLES (Settings) */
.sec-toggle-list { display: flex; flex-direction: column; margin-top: 10px; border: 1px solid var(--lgray); border-radius: 12px; overflow: hidden; }
.sec-toggle { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border-bottom: 1px solid var(--bg); cursor: pointer; }
.sec-toggle:last-child { border-bottom: none; }
.sec-toggle:hover { background: var(--bg); }
.sec-toggle-name { font-size: 14px; font-weight: 600; color: var(--black); }
.sec-toggle input { width: 18px; height: 18px; accent-color: var(--brand-accent); cursor: pointer; flex-shrink: 0; }

/* FIRMENLOGO (Settings, T-115) */
.logo-setting { display: flex; align-items: center; gap: 14px; margin-top: 10px; }
.logo-setting-av { position: relative; overflow: hidden; width: 56px; height: 56px; border-radius: 14px; background: var(--mint); display: flex; align-items: center; justify-content: center; color: var(--petrol); font-weight: 700; font-size: 15px; flex-shrink: 0; }
.logo-setting-av img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 4px; box-sizing: border-box; background: var(--white); }
.logo-setting-acts { display: flex; gap: 8px; flex-wrap: wrap; }
/* `.btn` setzt `display:inline-flex` als Autoren-Regel — die schlägt die
   User-Agent-Regel für `[hidden]` unabhängig von der Spezifität (Autoren- vor
   User-Agent-Herkunft in der Kaskade). Ohne diese Regel bliebe „Logo
   entfernen" trotz `hidden`-Attribut sichtbar. */
#btnRemoveLogo[hidden] { display: none; }

/* THEME-AUSWAHL (Settings) */
.theme-chooser { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-top: 10px; }
.theme-opt { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; text-align: left; padding: 8px 8px 12px; min-height: 44px; border-radius: 12px; border: 1.5px solid var(--lgray); background: var(--white); cursor: pointer; font-family: inherit; transition: all 0.15s; }
.theme-opt:hover { border-color: #CBD5E1; }
.theme-opt:focus-visible { outline: 3px solid var(--brand-accent); outline-offset: 2px; }
.theme-opt.active { border-color: var(--brand-accent); background: rgba(47,211,160,0.06); box-shadow: 0 0 0 1px var(--brand-accent); }
.theme-opt-thumb { display: block; width: 100%; aspect-ratio: 3 / 2; border-radius: 8px; background: #E8ECEA center / cover no-repeat; margin-bottom: 6px; }
.theme-opt-thumb.is-neutral { background: linear-gradient(135deg, #EEF4F2 0%, #E6EFEC 50%, #F4F7F5 100%); border: 1px solid var(--lgray); box-sizing: border-box; }
.theme-opt-name { font-size: 14px; font-weight: 700; color: var(--black); padding: 0 4px; }
.theme-opt-desc { font-size: 12px; color: var(--gray); padding: 0 4px; }
.theme-hint { grid-column: 1 / -1; font-size: 12px; color: var(--gray); margin: 0; }

/* Neon: dunkle Nachtbilder, deshalb ein kräftigeres Nebel-Overlay (#F4F7F5), damit Titel und Zahlen lesbar bleiben */
body[data-theme="neon"] .band-bg { opacity: 0.72; filter: saturate(1.1) contrast(1.05) brightness(1.05); }
body[data-theme="neon"] .band-overlay { background: linear-gradient(180deg, rgba(244,247,245,0.9) 0%, rgba(244,247,245,0.66) 44%, rgba(244,247,245,0.82) 100%); }
/* Neutral: keine Bilder, die Farbflächen der .b-*-Klassen bleiben sichtbar */
body[data-theme="neutral"] .band-bg, body[data-theme="neutral"] .band-overlay, body[data-theme="neutral"] .hero-card-bg { display: none; }

/* FOOTER */
footer .footer-legal { display: block; margin-top: 8px; }
footer .footer-legal a { color: inherit; }
footer { padding: 40px; text-align: center; font-size: 13px; color: var(--gray); border-top: 1px solid var(--lgray); margin-top: 60px; }

/* RESPONSIVE */
@media (max-width: 1000px) {
  .score-grid, .charts-grid, .bwa-streak-grid { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: 1fr 1fr; }
  .emp-grid { grid-template-columns: 1fr; }
  .achieve-grid { grid-template-columns: 1fr 1fr; }
  .bench-range-wrap { overflow-x: clip; }
}
@media (max-width: 640px) {
  html, body { overflow-x: hidden; }
  .band { padding: 36px 18px; }
  .band-top { padding-top: 92px; }
  body.with-banner .band-top, body.with-imported-banner .band-top { padding-top: 116px; }
  .card { padding: 22px; }
  .charts-grid { gap: 16px; }
  .donut-wrap { width: 100%; max-width: 100%; }
  .hero-card { padding: 32px 22px; min-height: 0; margin-bottom: 32px; }
  .nav { padding: 0 12px; gap: 8px; }
  .nav-product { font-size: 12px; } .nav-client { display: none; } .nav-divider { display: none; }
  .nav-date { display: none; }
  .kpi-grid { grid-template-columns: 1fr 1fr; }
  .achieve-grid { grid-template-columns: 1fr; }
  .bwa-streak-grid { grid-template-columns: 1fr; }
  .emp-grid { grid-template-columns: 1fr; }
  .charts-grid { grid-template-columns: 1fr; }
  .bench-grid > .bench-row { padding: 22px 20px; }
  .hero-firm { gap: 10px; }
  .hero-firm-name { font-size: 17px; }
  .hero-firm-loc { font-size: 12px; }
  .hero-number { font-size: clamp(44px,14vw,72px); }
  .hero-zahlen { grid-template-columns: 1fr 1fr; gap: 16px 20px; }
  .hero-zahl-wert { font-size: 26px; letter-spacing: -1px; }
  .nav-cta-txt { display: none; }
  .nav-cta { padding: 6px 9px; }
  .nav-right { gap: 8px; }
  .score-grid { grid-template-columns: 1fr; }
  .bwa-t td, .bwa-t th { font-size: 11px; padding: 6px 3px; }
  .bwa-t td:first-child, .bwa-t th:first-child { font-size: 11px; max-width: 120px; }
  .score-card { padding: 24px 16px; }
  .ring-wrap { width: 140px; height: 140px; }
  .emp-card { padding: 24px 20px; }
  .bench-row-head { flex-direction: column; gap: 4px; }
  .bench-range-wrap { overflow-x: clip; }
  .leg-grid { grid-template-columns: 1fr; }
}
/* BOSSTYPE SECTION */
.bosstype-section { padding: 64px 40px; max-width: 1320px; margin: 0 auto; }
.bosstype-hero { display: grid; grid-template-columns: 1fr 1.6fr; gap: 24px; margin-top: 40px; align-items: start; }
.bosstype-card { background: var(--petrol); border-radius: var(--r); padding: 36px; color: #fff; position: relative; overflow: hidden; box-shadow: var(--shadow-md); }
.bosstype-card::after  { content:''; position:absolute; bottom:-60px; left:-20px; width:160px; height:160px; border-radius:50%; background:rgba(47,211,160,0.06); pointer-events:none; }
.bosstype-card > * { position:relative; z-index:1; }
.bosstype-emoji { font-size: 52px; line-height: 1; margin-bottom: 16px; display: block; }
.bosstype-name { font-size: 28px; font-weight: 900; letter-spacing: -0.8px; color: #fff; margin-bottom: 6px; }
.bosstype-profil { font-size: 14px; color: rgba(255,255,255,0.6); line-height: 1.55; margin-bottom: 20px; }
.bosstype-braucht-lbl { font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--mint); margin-bottom: 8px; }
.bosstype-braucht { font-size: 14px; color: rgba(255,255,255,0.85); font-weight: 500; line-height: 1.5; }
.bosstype-tag { display: inline-flex; align-items: center; gap: 6px; background: rgba(47,211,160,0.2); border: 1px solid rgba(47,211,160,0.3); border-radius: 50px; padding: 5px 14px; font-size: 12px; font-weight: 700; color: var(--mint); margin-bottom: 20px; }
.bosstype-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.bt-card { background: var(--card-grad); border-radius: 14px; padding: 14px 10px; text-align: center; border: 1.5px solid var(--lgray); cursor: default; transition: transform 0.15s; }
.bt-card:hover { transform: translateY(-2px); }
.bt-card.active { background: var(--petrol); border-color: var(--mint); box-shadow: 0 4px 16px rgba(47,211,160,0.25); }
.bt-emoji { font-size: 22px; line-height: 1; margin-bottom: 6px; }
.bt-name { font-size: 9.5px; font-weight: 700; color: var(--gray); letter-spacing: 0.02em; line-height: 1.3; }
.bt-card.active .bt-name { color: var(--mint); }
.bt-active-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); margin: 6px auto 0; }
@media (max-width: 1000px) { .bosstype-hero { grid-template-columns: 1fr; } .bosstype-grid { grid-template-columns: repeat(4,1fr); } }
@media (max-width: 640px) { .bosstype-section { padding: 48px 16px; } .bosstype-grid { grid-template-columns: repeat(4,1fr); } }

/* Bosstype-Hinweis (T-019): Fragebogen fehlt noch — statt eines erratenen Typs. */
.bosstype-hinweis { margin-top: 40px; max-width: 560px; padding: 28px 32px; border: 1.5px solid var(--lgray); border-radius: var(--r); background: var(--card-grad); text-align: center; }
.bosstype-hinweis-icon { font-size: 32px; margin-bottom: 10px; }
.bosstype-hinweis-text { font-size: 14px; color: var(--gray); line-height: 1.55; margin-bottom: 18px; }
.bosstype-hinweis-button { display: inline-flex; background: var(--mint); color: var(--petrol); border: none; padding: 11px 22px; border-radius: 10px; font-size: 14px; font-weight: 700; text-decoration: none; font-family: inherit; cursor: pointer; }

/* Fragen-Flow im Bosstype-Hinweis (T-099): eine Frage nach der anderen,
   direkt im Band, ohne Formular/Reload. */
.bosstype-frage-sub { font-size: 13px; color: var(--gray); margin-top: -8px; margin-bottom: 16px; line-height: 1.5; }
.bosstype-frage-optionen { display: flex; flex-direction: column; gap: 8px; }
.bosstype-frage-option { font-family: inherit; cursor: pointer; text-align: left; padding: 11px 16px; border: 1.5px solid var(--lgray); border-radius: 10px; background: #fff; font-size: 14px; font-weight: 500; color: var(--black); transition: border-color 0.15s, background 0.15s; }
.bosstype-frage-option:hover { border-color: var(--tanne-dunkel); background: #E8F8F2; }
.bosstype-frage-fehler { margin-top: 14px; font-size: 13px; color: #B91C1C; }

/* Ladeanzeige während des Dashboard-Refreshs nach einem Import (T-019, ohne Neuladen). */
body.dashboard-refreshing::after {
  content: 'Dashboard wird aktualisiert …';
  position: fixed; top: 16px; right: 16px; z-index: 9999;
  background: #0E3B43; color: #fff; padding: 9px 16px; border-radius: 10px;
  font-size: 13px; font-weight: 600; box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

@keyframes fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
.au { animation: fadeUp 0.55s ease both; }

/* Ehrlicher Hinweis am Trend-Chart bei weniger als 12 importierten Monaten
   (T-117) — reiner Text statt Ausgrauung, siehe dashboard/charts.js. */
.cc-note { font-size: 11.5px; color: var(--gray); margin-top: -4px; margin-bottom: 12px; }

/* Wenn echte Daten importiert sind: KPI-Karten-Mini-Benchmarks bleiben
   ausgeblendet (eigenständige, noch nicht branchenspezifische Kennzahl —
   siehe stattdessen das echte Branchenvergleich-Band, T-024/T-087). Vorher
   stand hier eine Baustellen-Markierung für ein inzwischen fertiges
   Feature — das war seit T-024 falsch und ist ersatzlos entfernt (T-117). */
body.is-imported .kpi-card .bench-mini-lbl,
body.is-imported .kpi-card .bench-track,
body.is-imported .kpi-card .bench-rank-lbl { display: none; }

/* IMPORT MODAL ==================================================== */
.nav-cta { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:8px; background:var(--mint); color: var(--petrol); font-size:12px; font-weight:600; border:none; cursor:pointer; font-family:inherit; }
.nav-cta:hover { transform: translateY(-1px); box-shadow:0 4px 12px rgba(47,211,160,0.35); }
.nav-icon-btn { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:8px; background:rgba(255,255,255,0.08); color:rgba(255,255,255,0.7); border:none; cursor:pointer; font-size:14px; }
.nav-icon-btn:hover { background:rgba(255,255,255,0.15); color:#fff; }

.demo-banner { position:fixed; top:52px; left:0; right:0; z-index:150; background:#FBF3E1; border-bottom:1px solid #E9A23B; padding:8px 32px; display:flex; align-items:center; justify-content:center; gap:14px; font-size:13px; color:#1B2427; }
.demo-banner.hidden { display:none; }
.demo-banner strong { color:#1B2427; }
.demo-banner button, .demo-banner a { background:var(--mint); color:var(--petrol); border:none; padding:5px 12px; border-radius:6px; font-size:12px; font-weight:600; cursor:pointer; font-family:inherit; text-decoration:none; display:inline-block; }
.with-banner .nav { box-shadow: none; }
body.with-banner .band-top { padding-top: 124px; }

.imported-banner { position:fixed; top:52px; left:0; right:0; z-index:150; background:#DFF5EC; border-bottom:1px solid #34D399; padding:8px 32px; display:flex; align-items:center; justify-content:center; gap:14px; font-size:13px; color:#065F46; }
.imported-banner strong { color:#064E3B; background:rgba(255,255,255,0.6); padding:1px 7px; border-radius:50px; }
.imported-banner button { background:#065F46; color:#fff; border:none; padding:5px 12px; border-radius:6px; font-size:12px; font-weight:600; cursor:pointer; font-family:inherit; }
body.with-imported-banner .band-top { padding-top: 124px; }

/* Upload-Quittung (T-142): heller, pastellfarbener Toast unten rechts — kein
   Icon-Badge, passend zur Design-Sprache. Blendet sich per JS
   (dashboard/quittung.js) selbst wieder aus, ein Klick schließt sie sofort. */
.upload-quittung {
  position: fixed; right: 24px; bottom: 24px; z-index: 300; max-width: 380px;
  background: var(--card-grad); border: var(--border); border-radius: var(--r);
  box-shadow: var(--shadow-lg); padding: 16px 20px; font-size: 13px; line-height: 1.5;
  color: var(--black); cursor: pointer;
  opacity: 0; transform: translateY(12px); pointer-events: none; transition: opacity 0.25s, transform 0.25s;
}
.upload-quittung.open { opacity: 1; transform: translateY(0); pointer-events: auto; }
.upload-quittung .uq-zusammenfassung { font-weight: 600; }
.upload-quittung .uq-monate { margin-top: 6px; color: var(--gray); font-size: 12px; }
@media (max-width: 640px) { .upload-quittung { left: 16px; right: 16px; max-width: none; bottom: 16px; } }

/* Konto ohne importierte Monate (T-018): Bands mit Demo-/Nullwerten bleiben
   verborgen, statt Kacheln voller Nullen zu zeigen — stattdessen der
   Leerzustand unten. !important nötig, weil sections.js einzelnen Bands
   inline-style setzt (applySectionVisibility). */
body.is-empty-account .band, body.is-empty-account footer { display: none !important; }
.empty-state { max-width: 640px; margin: 140px auto 80px; padding: 0 24px; text-align: center; }
.empty-state-icon { font-size: 40px; margin-bottom: 16px; }
.empty-state-title { font-size: 26px; font-weight: 800; letter-spacing: -0.5px; color: var(--black); margin-bottom: 10px; }
.empty-state-text { font-size: 15px; color: #6E6E73; margin-bottom: 24px; line-height: 1.5; }
.empty-state button { background: var(--mint); color: var(--petrol); border:none; padding:12px 24px; border-radius:10px; font-size:15px; font-weight:700; cursor:pointer; font-family:inherit; }

.modal-backdrop { position:fixed; inset:0; z-index:1000; background:rgba(14,59,67,0.6); backdrop-filter: blur(8px); display:none; align-items:center; justify-content:center; padding:24px; overflow-y:auto; }
.modal-backdrop.open { display:flex; animation: fadeIn 0.2s ease both; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.modal { background:#fff; border-radius:24px; max-width:720px; width:100%; max-height:90vh; overflow:hidden; display:flex; flex-direction:column; box-shadow: 0 24px 80px rgba(14,59,67,0.35); }
.modal-head { padding:24px 32px 16px; border-bottom:1px solid rgba(14,59,67,0.06); display:flex; align-items:center; justify-content:space-between; gap:16px; flex-shrink:0; }
.modal-head h2 { font-size:20px; font-weight:800; letter-spacing:-0.02em; }
.modal-head .step-indicator { font-size:11px; font-weight:700; letter-spacing:0.08em; color:var(--gray); text-transform:uppercase; }
.modal-close { width:32px; height:32px; border-radius:8px; border:none; background:transparent; color:var(--gray); font-size:18px; cursor:pointer; }
.modal-close:hover { background:rgba(14,59,67,0.06); color:var(--black); }
.modal-progress { height:3px; background:var(--lgray); position:relative; flex-shrink:0; }
.modal-progress-bar { position:absolute; top:0; left:0; height:100%; background:var(--mint); transition: width 0.3s ease; }
.modal-body { padding:28px 32px; overflow-y:auto; flex:1; }
.modal-foot { padding:18px 32px; border-top:1px solid rgba(14,59,67,0.06); display:flex; justify-content:space-between; align-items:center; gap:12px; flex-shrink:0; }
.btn { display:inline-flex; align-items:center; gap:6px; padding:10px 18px; border-radius:10px; font-size:14px; font-weight:600; border:none; cursor:pointer; font-family:inherit; transition:all 0.15s; }
.btn-primary { background:var(--mint); color: var(--petrol); }
.btn-primary:hover:not(:disabled) { transform:translateY(-1px); box-shadow:0 6px 16px rgba(47,211,160,0.35); }
.btn-primary:disabled { opacity:0.4; cursor:not-allowed; }
.btn-ghost { background:transparent; color:var(--gray); }
.btn-ghost:hover { background:rgba(14,59,67,0.05); color:var(--black); }
.btn-secondary { background:#F1F5F9; color:var(--black); }
.btn-secondary:hover { background:#E2E8F0; }
/* Roter Knopf für endgültige Löschungen (T-146) — helles, luftiges Design, kein Badge, nur die Farbe warnt. */
.btn-danger { background:#B91C1C; color:#fff; }
.btn-danger:hover:not(:disabled) { background:#991B1B; }
.btn-danger:disabled { opacity:0.4; cursor:not-allowed; }

/* ── ABSCHLUSSMOMENT nach dem ersten Import (T-105) ── */
.abschluss-modal { max-width:460px; }
.abschluss-body { text-align:center; padding-top:36px; padding-bottom:8px; }
.abschluss-emoji { font-size:44px; line-height:1; margin-bottom:14px; animation: fadeUp 0.4s ease both; }
.abschluss-titel { font-size:22px; font-weight:800; letter-spacing:-0.02em; color:var(--black); margin-bottom:8px; }
.abschluss-text { font-size:14px; color:var(--gray); margin-bottom:22px; }
.abschluss-zahlen { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.abschluss-zahl { background:var(--xlight); border-radius:16px; padding:16px 8px; }
.abschluss-zahl-wert { font-size:19px; font-weight:800; letter-spacing:-0.02em; margin-bottom:4px; }
.abschluss-zahl-label { font-size:11.5px; font-weight:600; color:var(--gray); text-transform:uppercase; letter-spacing:0.04em; }
.abschluss-zahl.az-blue .abschluss-zahl-wert { color:var(--blue); }
.abschluss-zahl.az-green .abschluss-zahl-wert { color:var(--green); }
.abschluss-zahl.az-purple .abschluss-zahl-wert { color:var(--purple); }
.abschluss-foot { justify-content:center; border-top:none; padding-top:6px; padding-bottom:28px; }
.abschluss-foot .btn { padding:12px 32px; }
@media (max-width: 640px) {
  .abschluss-zahlen { grid-template-columns:1fr; }
}

.q-block { margin-bottom: 24px; }
.q-label { font-size:15px; font-weight:600; color:var(--black); margin-bottom:6px; }
.q-sub   { font-size:13px; color:var(--gray); margin-bottom:12px; }
.q-input { width:100%; padding:11px 14px; border:1.5px solid var(--lgray); border-radius:10px; font-size:14px; font-family:inherit; transition:border-color 0.15s; }
.q-input:focus { outline:none; border-color:var(--tanne); }
.q-row { display:grid; grid-template-columns: 1fr 1fr 1fr; gap:10px; }
.q-options { display:flex; flex-direction:column; gap:8px; }
.q-option { display:flex; align-items:center; gap:10px; padding:12px 14px; border:1.5px solid var(--lgray); border-radius:10px; cursor:pointer; transition:all 0.15s; font-size:14px; }
.q-option:hover { border-color:var(--tanne); background:#E8F8F2; }
.q-option.selected { border-color:var(--tanne); background:#E8F8F2; box-shadow: inset 0 0 0 1px var(--tanne); }
.q-option input { display:none; }
.q-option-radio { width:16px; height:16px; border:2px solid var(--lgray); border-radius:50%; flex-shrink:0; position:relative; }
.q-option.selected .q-option-radio { border-color:var(--tanne); }
.q-option.selected .q-option-radio::after { content:''; position:absolute; inset:2px; border-radius:50%; background:var(--tanne); }

.path-choice { display:grid; grid-template-columns: 1fr 1fr; gap:14px; margin-bottom:8px; }
.path-card { padding:24px; border:2px solid var(--lgray); border-radius:16px; cursor:pointer; transition:all 0.15s; text-align:center; }
.path-card:hover { border-color:var(--tanne); background:#E8F8F2; }
.path-card.selected { border-color:var(--tanne); background:#E8F8F2; }
.path-card-icon { font-size:36px; margin-bottom:10px; }
.path-card-title { font-size:15px; font-weight:700; margin-bottom:4px; }
.path-card-sub { font-size:12px; color:var(--gray); line-height:1.4; }

.drop-zone { display:block; border:2px dashed var(--lgray); border-radius:16px; padding:48px 24px; text-align:center; cursor:pointer; transition:all 0.15s; background:#F9FAFB; }
.drop-zone:hover, .drop-zone.dragover { border-color:var(--tanne); background:#E8F8F2; }
.drop-zone-icon { font-size:42px; margin-bottom:12px; }
.drop-zone-text { font-size:15px; font-weight:600; margin-bottom:4px; }
.drop-zone-sub { font-size:13px; color:var(--gray); }
.drop-zone input { display:none; }
.dz-lock { margin-top:12px; font-size:12.5px; color:#065F46; background:#ECFDF5; border:1px solid #A7F3D0;
  border-radius:10px; padding:9px 12px; line-height:1.55; }
.dz-warn { margin-top:8px; font-size:12.5px; color:#78350F; background:#FFF7ED; border:1px solid #FDE68A;
  border-radius:10px; padding:9px 12px; line-height:1.55; }
.upload-hint { margin-top:12px; padding:12px 16px; background:#EFF6FF; border-radius:10px; font-size:12.5px; color:#1E40AF; line-height:1.5; }
.upload-hint strong { color:#1E3A8A; }

.buchhaltungsart-line { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.link-btn { background:none; border:none; padding:0; color: var(--tanne); font-size:12.5px; font-weight:600; text-decoration:underline; cursor:pointer; font-family:inherit; }
.link-btn:hover { color:var(--tanne-dunkel); }

.import-guide-box { margin-top:16px; padding:16px; background:#F9FAFB; border:1px solid var(--lgray); border-radius:12px; }
.import-guide-content { display:grid; grid-template-columns: 232px 1fr; gap:18px; align-items:start; }
.import-guide-img { width:100%; }
.import-guide-img svg { width:100%; height:auto; display:block; }
.import-guide-text p { font-size:13px; color:var(--gray); line-height:1.5; margin-bottom:10px; }
.import-mail-text { width:100%; margin-top:10px; padding:10px 12px; border:1px solid var(--lgray); border-radius:8px; font-size:12px; font-family:inherit; color:var(--black); background:#fff; resize:vertical; }
@media (max-width: 700px) {
  .import-guide-content { grid-template-columns: 1fr; }
}

.file-list { margin-top:14px; display:flex; flex-direction:column; gap:6px; }
.file-item { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 14px; background:#F9FAFB; border:1px solid var(--lgray); border-radius:10px; font-size:13px; }
.file-item .fi-name { flex:1; font-weight:500; word-break:break-all; }
.file-item .fi-status { font-size:11px; padding:2px 8px; border-radius:50px; font-weight:600; }
.fi-pending { background:#F1F5F9; color:#475569; }
.fi-running { background:#DBEAFE; color:#1E40AF; }
.fi-ok      { background:#D1FAE5; color:#065F46; }
.fi-err     { background:#FEE2E2; color:#991B1B; }
.file-item .fi-remove { background:none; border:none; color:var(--gray); cursor:pointer; font-size:18px; padding:0 4px; }
.file-item .fi-remove:hover { color:var(--red); }

.review-table { width:100%; border-collapse:collapse; font-size:13px; margin-top:8px; }
.review-table th { background:#F9FAFB; text-align:left; padding:10px 8px; font-weight:600; font-size:12px; color:var(--gray); border-bottom:1px solid var(--lgray); }
.review-table th:first-child { text-align:left; padding-left:16px; }
.review-table th:not(:first-child) { text-align:right; }
.review-table td { padding:8px; border-bottom:1px solid #F1F5F9; }
.review-table td:first-child { padding-left:16px; font-weight:500; }
.review-table td:not(:first-child) { text-align:right; }
.review-table .rt-input { width:100%; padding:6px 8px; border:1px solid var(--lgray); border-radius:6px; font-size:13px; text-align:right; font-family:inherit; background:#fff; }
.review-table .rt-input:hover { border-color:var(--gray); }
.review-table.rt-bearbeiten .rt-input { border-color:var(--tanne); }
.review-bearbeiten-hinweis { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin:10px 0 4px; padding:10px 14px; border-radius:10px; background:#F0FDF4; font-size:13px; line-height:1.5; }
.review-offen { margin-top:14px; }
.review-offen-titel { font-size:13px; font-weight:600; margin-bottom:4px; }
.review-offen-tabelle td:first-child { font-weight:400; }
.review-offen-tabelle .rt-zuordnung { padding:6px 8px; border:1px solid var(--lgray); border-radius:6px; font-size:13px; font-family:inherit; background:#fff; }
.review-bestaetigung { display:flex; align-items:flex-start; gap:8px; margin-top:12px; font-size:13px; line-height:1.5; cursor:pointer; }
.review-table .rt-input:focus { outline:none; border-color:var(--tanne); background:#fff; }
.review-table tr.rt-warn td { background:#FEF3C7; }
.review-table tr.rt-ebit td { font-weight:700; background:#F0FDF4; }
.review-table .rt-erklaert { border-bottom: 1px dotted var(--gray); cursor: help; }

/* Fußzeile mit den Begriffserklärungen der Prüftabelle (T-104) */
.review-footnote { margin-top: 10px; font-size: 11.5px; color: var(--gray); display: flex; gap: 18px; flex-wrap: wrap; }

.plausi-msg { margin-top:14px; padding:10px 14px; border-radius:10px; font-size:13px; line-height:1.5; }
.plausi-ok { background:#D1FAE5; color:#065F46; }
.plausi-warn { background:#FEF3C7; color:#92400E; }
.plausi-error { background:#FEE2E2; color:#991B1B; }

#importError { margin:0 32px 14px; flex-shrink:0; }

.settings-row { display:grid; grid-template-columns: 1fr 1fr; gap:14px; margin-bottom:14px; }
.settings-row .q-block { margin-bottom:0; }
.settings-test { display:inline-flex; align-items:center; gap:8px; padding:8px 14px; background:#F1F5F9; border-radius:8px; font-size:13px; color:var(--gray); }
.settings-test.ok { background:#D1FAE5; color:#065F46; }
.settings-test.err { background:#FEE2E2; color:#991B1B; }

.euer-grid { display:grid; grid-template-columns: 140px repeat(8, 1fr) 110px; gap:6px; align-items:center; font-size:12px; }
.euer-grid > div { padding:4px; }
.euer-grid .eg-head { font-weight:600; color:var(--gray); font-size:11px; text-align:right; padding-bottom:8px; }
.euer-grid .eg-head:first-child { text-align:left; }
.euer-grid .eg-month { font-weight:600; }
.euer-grid input { width:100%; padding:6px 8px; border:1px solid var(--lgray); border-radius:6px; font-size:12px; text-align:right; font-family:inherit; }
.euer-grid input:focus { outline:none; border-color:var(--tanne); }

@media (max-width: 700px) {
  .modal { border-radius:0; max-height:100vh; height:100vh; }
  .modal-body, .modal-head, .modal-foot { padding-left:20px; padding-right:20px; }
  .q-row { grid-template-columns:1fr; }
  .path-choice { grid-template-columns:1fr; }
}

/* ── Responsive Top-Nav: Sekundäres weicht, Monats-Tabs behalten Platz ── */
@media (max-width: 1080px) { .nav-date { display: none; } }
@media (max-width: 920px)  { .nav-divider, .nav-client { display: none; } }
@media (max-width: 780px)  { .nav { padding: 0 14px; gap: 12px; } .nav-cta { padding: 7px 10px; font-size: 12px; } }

/* ── Benchmark-Zonen-Legende ── */
.bench-legend { display: flex; align-items: center; gap: 8px; margin: 16px 2px 0; font-size: 12px; color: var(--gray); flex-wrap: wrap; }
.bench-legend .bl-grad { width: 92px; height: 8px; border-radius: 4px; background: linear-gradient(90deg,#EF4444,#F59E0B,#60A5FA,#34C759,#22C55E); flex-shrink: 0; }
.bench-legend .bl-sep { width: 1px; height: 12px; background: rgba(14,59,67,0.15); }
.bench-legend .bl-you { font-size: 10px; color: var(--black); }

/* ── Benchmark-Band-Zustände (T-020): "vorhanden" via echter Daten, sonst Status-Karte ── */
.bench-status { background: var(--card-grad); border-radius: var(--r); padding: 36px 32px; box-shadow: var(--shadow); border: var(--border); text-align: center; }
.bench-status-icon { font-size: 30px; margin-bottom: 10px; }
.bench-status-title { font-size: 18px; font-weight: 700; color: var(--black); margin-bottom: 6px; }
.bench-status-text { font-size: 14px; color: var(--gray); line-height: 1.5; max-width: 46rem; margin: 0 auto; }

/* ── Sperrkarten des Vorschau-Tors (T-109): gleiches Kartenbild wie .bench-status, plus Kaufknopf ── */
.lock-card-btn { display: inline-block; margin-top: 16px; background: var(--mint); color: var(--petrol); border: none; padding: 12px 24px; border-radius: 10px; font-size: 15px; font-weight: 700; text-decoration: none; font-family: inherit; }
/* ── Köder auf der Sperrkarte (T-110): Richtung/Anzahl, nie ein Wert ── */
.lock-card-koeder { margin-top: 10px; font-weight: 600; color: var(--black); }
.lock-grid { display: flex; flex-direction: column; gap: var(--gap); }

/* ══ BAND „Deine Analyse" (T-137) ══════════════════════════════════════════
   Vier Zustände in einem Band: Sperrkarte (Vorschau), Zustimmungskarte,
   Ladezustand und Ergebnis. Die Sperrkarte borgt sich .bench-status/.lock-card
   von oben, alles Übrige steht hier. Optik bewusst nah an .bosstype-* (dunkle
   Profilkarte, helle Nebenkacheln) — das Band tritt an dieselbe Stelle. */
.analyse-inhalt { margin-top: 22px; }
.analyse-hinweis { background: var(--card-grad); border: var(--border); border-radius: var(--r); box-shadow: var(--shadow); padding: 28px 32px; font-size: 14px; color: var(--gray); }

/* ── Zustimmung ── */
.analyse-zustimmung { position: relative; background: var(--card-grad); border: var(--border); border-radius: var(--r); box-shadow: var(--shadow); padding: 22px 26px; max-width: 640px; }
.analyse-zustimmung-schloss { position: absolute; top: 24px; right: 28px; font-size: 24px; opacity: 0.8; }
.analyse-zustimmung-titel { font-size: 20px; font-weight: 800; letter-spacing: -0.3px; color: var(--black); margin-bottom: 8px; }
.analyse-zustimmung-text { font-size: 14.5px; color: var(--gray); line-height: 1.6; margin-bottom: 18px; max-width: 46rem; }
.analyse-zusagen { list-style: none; display: flex; flex-direction: column; gap: 10px; margin-bottom: 24px; }
.analyse-zusage { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: var(--black); line-height: 1.5; }
.analyse-haken { flex-shrink: 0; width: 20px; height: 20px; border-radius: 50%; background: rgba(52,199,89,0.14); color: #157F3B; font-size: 12px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
.analyse-btn { display: inline-flex; align-items: center; background: var(--mint); color: var(--petrol); border: none; padding: 12px 24px; border-radius: 10px; font-size: 15px; font-weight: 700; font-family: inherit; cursor: pointer; }
.analyse-btn:hover { filter: brightness(1.06); }

/* ── Schemenhafte Vorschau: zeigt die Form des Ergebnisses, ohne Inhalt ── */

/* ── Ladezustand ── */
.analyse-laedt { display: flex; align-items: center; gap: 12px; font-size: 15px; font-weight: 600; color: var(--black); }
.analyse-spinner { width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid rgba(47,211,160,0.25); border-top-color: var(--tanne-dunkel); animation: analyse-dreht 0.9s linear infinite; }
@keyframes analyse-dreht { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .analyse-spinner { animation: none; } }

/* ── Fehlerfall ── */
.analyse-fehler { background: var(--card-grad); border: var(--border); border-radius: var(--r); box-shadow: var(--shadow); padding: 28px 32px; max-width: 640px; }
.analyse-fehler-text { font-size: 14.5px; color: var(--gray); line-height: 1.6; margin-bottom: 18px; }

/* ── Ergebnis: Profilkarte links, die anderen Typen rechts ── */
.analyse-ergebnis { display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--gap); align-items: start; }
.analyse-profil { position: relative; overflow: hidden; background: var(--petrol); border-radius: var(--r); padding: 36px; color: #fff; box-shadow: var(--shadow-md); }
.analyse-profil > * { position: relative; z-index: 1; }
.analyse-profil-emoji { font-size: 52px; line-height: 1; margin-bottom: 16px; }
.analyse-profil-tag { display: inline-flex; background: rgba(47,211,160,0.2); border: 1px solid rgba(47,211,160,0.3); border-radius: 50px; padding: 5px 14px; font-size: 12px; font-weight: 700; color: var(--mint); margin-bottom: 16px; }
.analyse-profil-name { font-size: 28px; font-weight: 900; letter-spacing: -0.8px; margin-bottom: 4px; }
.analyse-profil-seit { font-size: 12.5px; font-weight: 600; letter-spacing: 0.02em; color: rgba(255,255,255,0.55); margin-bottom: 18px; }
.analyse-profil-begruendung { font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,0.85); }
.analyse-wechsel { margin-top: 18px; padding: 10px 14px; border-radius: 12px; background: rgba(47,211,160,0.16); font-size: 13px; font-weight: 600; color: var(--mint); }

.analyse-typen-lbl { font-size: 13px; font-weight: 600; color: var(--gray); margin-bottom: 14px; letter-spacing: 0.02em; }
.analyse-typen-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.analyse-typ { background: var(--card-grad); border: 1.5px solid var(--lgray); border-radius: 14px; padding: 14px 10px; text-align: center; }
.analyse-typ-emoji { display: block; font-size: 22px; line-height: 1; margin-bottom: 6px; }
.analyse-typ-name { display: block; font-size: 9.5px; font-weight: 700; color: var(--gray); line-height: 1.3; }

/* ── Drei Schritte ── */
.analyse-schritte-lbl { font-size: 18px; font-weight: 800; letter-spacing: -0.2px; color: var(--black); margin: 36px 0 16px; }
.analyse-schritte { display: grid; grid-template-columns: repeat(3,1fr); gap: var(--gap); }
.analyse-schritt { position: relative; background: var(--white); border: 1px solid var(--lgray); border-radius: var(--r); box-shadow: var(--shadow); padding: 28px 26px; }
.analyse-schritt-num { width: 26px; height: 26px; border-radius: 50%; background: rgba(47,211,160,0.14); color: var(--tanne-dunkel); font-size: 13px; font-weight: 800; display: flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.analyse-schritt-titel { font-size: 16px; font-weight: 800; letter-spacing: -0.2px; color: var(--black); margin-bottom: 8px; }
.analyse-schritt-text { font-size: 14px; color: var(--gray); line-height: 1.6; margin-bottom: 16px; }
.analyse-schritt-chip { display: inline-flex; background: rgba(14,59,67,0.06); border-radius: 50px; padding: 4px 12px; font-size: 11.5px; font-weight: 700; color: var(--black); margin-bottom: 10px; }
.analyse-schritt-meta { font-size: 12px; color: var(--gray); }
.analyse-fuss { margin-top: 20px; font-size: 12.5px; color: var(--gray); }

/* ── Typen-Galerie und Ziel-Typ (T-153) ── */
.galerie { margin-top: 28px; }
.galerie-ohne-stand { font-size: 13px; color: var(--gray); }
.galerie-typ { background: var(--white); border: 1px solid var(--lgray); border-radius: var(--r); padding: 16px 18px; }
.galerie-typ.is-eigen { border-color: var(--tanne); box-shadow: 0 0 0 1px rgba(21,128,95,0.25); }
.galerie-typ.is-ziel { border-color: #0F766E; box-shadow: 0 0 0 1px rgba(15,118,110,0.25); }
.galerie-typ-kopf { display: flex; align-items: center; gap: 10px; width: 100%; background: none; border: 0; padding: 0; cursor: pointer; text-align: left; }
.galerie-typ-emoji { font-size: 20px; }
.galerie-typ-name { font-size: 14.5px; font-weight: 800; color: var(--black); }
.galerie-marke { font-size: 11px; font-weight: 700; border-radius: 50px; padding: 3px 9px; }
.galerie-marke.is-eigen { background: rgba(47,211,160,0.14); color: var(--tanne-dunkel); }
.galerie-marke.is-ziel { background: rgba(15,118,110,0.12); color: #0F766E; }
.galerie-stand { font-size: 12px; color: var(--gray); }
.galerie-typ-profil { font-size: 13px; color: var(--gray); line-height: 1.6; margin: 8px 0 0; }
.galerie-typ-hinweis { font-size: 13px; line-height: 1.5; margin: 8px 0 0; padding: 8px 12px; border-left: 3px solid var(--gray); background: rgba(128,128,128,0.08); border-radius: 4px; }
.galerie-typ-detail { margin-top: 14px; border-top: 1px solid var(--lgray); padding-top: 14px; }
.galerie-braucht { margin: 0 0 12px; padding-left: 18px; font-size: 13px; color: var(--gray); line-height: 1.7; }
.galerie-krit-lbl { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.4px; color: var(--gray); margin-bottom: 8px; }
.galerie-krits { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.galerie-krit { display: flex; gap: 10px; font-size: 13px; }
.galerie-krit-zeichen { width: 18px; flex: 0 0 18px; font-weight: 800; }
.galerie-krit.is-gut .galerie-krit-zeichen { color: #0F766E; }
.galerie-krit.is-offen .galerie-krit-zeichen { color: var(--tanne); }
.galerie-krit.is-unbekannt .galerie-krit-zeichen { color: var(--gray); }
.galerie-krit-text { color: var(--black); line-height: 1.5; }
.galerie-krit-meta, .galerie-krit-quelle { font-size: 12px; color: var(--gray); margin-top: 2px; }
.galerie-krit-ersatz { display: inline-flex; margin-top: 4px; background: rgba(47,211,160,0.14); color: var(--tanne-dunkel); border-radius: 50px; padding: 2px 9px; font-size: 11px; font-weight: 700; }
.galerie-btn { margin-top: 14px; background: var(--black); color: var(--white); border: 0; border-radius: 50px; padding: 9px 18px; font-size: 13px; font-weight: 700; cursor: pointer; }
.galerie-btn.is-weg { background: none; color: var(--gray); border: 1px solid var(--lgray); }

.ziel-karte { background: var(--white); border: 1px solid #0F766E; border-radius: var(--r); box-shadow: var(--shadow); padding: 24px 26px; margin-bottom: 20px; }
.ziel-kopf { display: flex; align-items: center; gap: 14px; }
.ziel-emoji { font-size: 28px; }
.ziel-tag { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.6px; color: #0F766E; }
.ziel-name { font-size: 18px; font-weight: 800; letter-spacing: -0.3px; color: var(--black); }
.ziel-aufgeben { margin: 0 0 0 auto; }
.ziel-profil { font-size: 13.5px; color: var(--gray); line-height: 1.6; margin: 12px 0 18px; }
.ziel-offen-lbl { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.4px; color: var(--gray); margin-bottom: 10px; }
.ziel-fertig { font-size: 13.5px; color: var(--black); margin: 0; }
.ziel-veraltet, .ziel-fehler { margin-top: 14px; font-size: 13px; color: #8A5A0B; }
.ziel-btn { margin-top: 18px; }
.ziel-einleitung { font-size: 14px; color: var(--black); line-height: 1.6; margin: 22px 0 0; }
.ziel-schritte { margin-top: 16px; display: grid; gap: 12px; grid-template-columns: repeat(3, 1fr); }
.ziel-schritt { background: rgba(14,59,67,0.03); border: 1px solid var(--lgray); border-radius: var(--r); padding: 18px; }
.ziel-schritt-num { width: 24px; height: 24px; border-radius: 50%; background: rgba(15,118,110,0.14); color: #0F766E; font-size: 12.5px; font-weight: 800; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.ziel-schritt-titel { font-size: 15px; font-weight: 800; color: var(--black); margin-bottom: 6px; }
.ziel-schritt-text { font-size: 13.5px; color: var(--gray); line-height: 1.6; margin-bottom: 12px; }
.ziel-schritt-chip { display: inline-flex; background: rgba(14,59,67,0.06); border-radius: 50px; padding: 4px 12px; font-size: 11.5px; font-weight: 700; color: var(--black); margin-bottom: 8px; }
.ziel-schritt-meta { font-size: 12px; color: var(--gray); }

@media (max-width: 1000px) {
  .ziel-schritte { grid-template-columns: 1fr; }
}

/* ── Einstellungen-Modal ── */
.analyse-setting { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 12px; }
.analyse-setting-stand { font-size: 14px; font-weight: 600; color: var(--black); }

@media (max-width: 1000px) {
  .analyse-ergebnis { grid-template-columns: 1fr; }
  .analyse-schritte { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .analyse-typen-grid { grid-template-columns: repeat(2,1fr); }
  .analyse-profil { padding: 26px 22px; }
  .analyse-zustimmung { padding: 26px 22px; }
}
.bench-kpi-head { font-size: 12.5px; color: var(--gray); margin-bottom: 16px; }
.bench-kpi-row { background: var(--card-grad); border-radius: var(--r); padding: 22px 28px; box-shadow: var(--shadow); border: var(--border); margin-bottom: var(--gap); }
.bench-kpi-row-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.bench-kpi-label { font-size: 15px; font-weight: 700; color: var(--black); }
.bench-kpi-du { font-size: 13px; font-weight: 700; color: var(--brand-accent); }
.bench-kpi-range-wrap { position: relative; padding-bottom: 4px; }
.bench-kpi-range-track { height: 6px; background: rgba(14,59,67,0.07); border-radius: 10px; position: relative; }
.bench-kpi-zone { position: absolute; top: 0; bottom: 0; border-radius: 10px; background: #60A5FA; opacity: 0.32; }
.bench-kpi-median { position: absolute; top: -3px; bottom: -3px; width: 2px; background: var(--black); opacity: 0.5; }
.bench-kpi-marker { position: absolute; top: 50%; transform: translate(-50%,-50%); width: 14px; height: 14px; border-radius: 50%; background: var(--brand-accent); box-shadow: 0 0 0 3px rgba(47,211,160,0.18), var(--shadow); }
.bench-kpi-foot { display: flex; justify-content: space-between; gap: 12px; font-size: 11.5px; color: var(--gray); margin-top: 8px; flex-wrap: wrap; }
/* Fußzeile statt eigener Karten für Kennzahlen ohne Vergleich (15.09.2026) */
.bench-kpi-hinweis { font-size: 12.5px; color: var(--gray); line-height: 1.5; padding: 4px 4px 0; }
.bench-kpi-einordnung { font-size: 12px; color: var(--brand-accent); font-weight: 600; margin-top: 6px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bench-kpi-bewertung { font-size: 11px; font-weight: 700; border-radius: 999px; padding: 2px 9px; }
.bench-kpi-bewertung--gut { color: color-mix(in srgb, var(--green) 60%, black); background: color-mix(in srgb, var(--green) 16%, white); }
/* T-181: Spitzenstufe, deutlich kräftiger als "Gut". */
.bench-kpi-bewertung--spitze { color: #fff; background: var(--brand-accent); letter-spacing: 0.2px; }
.bench-kpi-bewertung--mittel { color: color-mix(in srgb, var(--amber) 65%, black); background: color-mix(in srgb, var(--amber) 16%, white); }
.bench-kpi-bewertung--auffaellig { color: color-mix(in srgb, var(--red) 60%, black); background: color-mix(in srgb, var(--red) 16%, white); }
/* T-090 AC 1: eigenes graues Badge für `richtung: neutral` — unterscheidbar von
   "Mittel" (Position bekannt, im Quartilsband), damit "ohne Urteil" nicht wie
   ein amberfarbenes Ergebnis aussieht. */
.bench-kpi-bewertung--neutral { color: var(--gray); background: color-mix(in srgb, var(--gray) 14%, white); }

/* ── KPI-Sparkline (Monatsverlauf in der Kachel) ── */
.kpi-spark { margin: 10px 0 2px; opacity: 0.85; }
.kpi-spark { position: relative; padding-left: 12px; }
.kpi-spark svg { display: block; width: 100%; height: 30px; }
.kpi-spark-null { position: absolute; left: 0; transform: translateY(-50%); font-size: 9px; line-height: 1; font-weight: 600; opacity: 0.55; font-family: var(--font-mono); }

/* ── Reduzierte Bewegung ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  html { scroll-behavior: auto; }
}

/* ── PRINT · Monatsreport ── */
@media print {
  .nav, .demo-banner, .imported-banner, .modal-backdrop, .nav-cta { display: none !important; }
  body, body.with-banner, body.with-imported-banner { background: #fff; }
  .band, .band-top, body.with-banner .band-top, body.with-imported-banner .band-top { padding: 18px 0 !important; }
  .band-bg, .band-overlay, .hero-card-bg, .hero-card-overlay, .score-card-bg, .score-card-overlay { display: none !important; }
  .band-inner { max-width: 100%; }
  .hero-card, .card, .kpi-card, .emp-card, .score-card, .bosstype-card, .streak-card, .ac, .bench-row { box-shadow: none !important; break-inside: avoid; }
  .b-warm, .b-cool, .b-lav, .b-amber, .b-mint, .b-plain { background: #fff !important; }
}

/* ══ Trust-Bar und Modal-Rahmen (T-192: Berater einladen; vormals Berater-Share) ══ */
.trust-bar { display: flex; justify-content: center; align-items: center; gap: 18px; flex-wrap: wrap; padding: 26px 20px 0; }
.trust-bar button { font-family: inherit; font-size: 13px; font-weight: 600; color: var(--gray); background: rgba(255,255,255,0.8);
  border: 1.5px solid rgba(14,59,67,0.08); border-radius: 50px; padding: 9px 18px; cursor: pointer; box-shadow: var(--shadow); transition: all .15s; }
.trust-bar button:hover { color: var(--black); border-color: rgba(47,211,160,0.45); background: #E8F8F2; }
.tm-modal { position: fixed; inset: 0; z-index: 9600; display: none; align-items: center; justify-content: center;
  background: rgba(7,11,22,0.72); backdrop-filter: blur(6px); padding: 24px; }
.tm-modal.open { display: flex; }
.tm-box { background: #fff; border-radius: 22px; padding: 28px; max-width: 640px; width: 100%; max-height: 86vh; overflow-y: auto; box-shadow: var(--shadow-lg); }
.tm-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 6px; }
.tm-head h3 { font-size: 19px; font-weight: 800; letter-spacing: -0.01em; flex: 1; }
.tm-close { background: none; border: none; font-size: 16px; cursor: pointer; color: var(--gray); padding: 4px 6px; }
.tm-sec { margin-top: 20px; }
.tm-note { margin-top: 18px; padding: 12px 14px; border-radius: 12px; background: #FFF7ED; border: 1px solid #FDE68A; font-size: 12.5px; color: #78350F; line-height: 1.55; }
.tm-proof { margin-top: 18px; padding: 12px 14px; border-radius: 12px; background: #ECFDF5; border: 1px solid #A7F3D0; font-size: 12.5px; color: #065F46; line-height: 1.55; }
.tm-link { background: none; border: none; padding: 0; font-family: inherit; font-size: 13px; font-weight: 700; color: var(--tanne); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.tm-stand { margin-top: 18px; font-size: 11.5px; color: #B0B0B8; }

/* ── Art-Rückfrage im Import (T-104): große Optionen mit Schema-Icon, ── */
/* dritte Option hinter „Etwas anderes?" ── */
.ba-opt { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.5;
  padding: 11px 13px; border-radius: 12px; border: 1.5px solid rgba(14,59,67,0.10); cursor: pointer; }
.ba-opt[hidden] { display: none; }
.ba-opt input { margin-top: 3px; }
.ba-opt-primary:has(input:checked) { border-color: var(--tanne-dunkel); background: #E8F8F2; }
.ba-opt-svg { flex-shrink: 0; display: flex; align-items: center; padding-top: 2px; }
.ba-opt-sub { color: var(--gray); }
.ba-mehr-link { align-self: flex-start; margin: 2px 0 0 2px; }
.sh-btn { font-family: inherit; font-size: 13px; font-weight: 700; padding: 11px 16px; border-radius: 12px; cursor: pointer;
  border: 1.5px solid rgba(14,59,67,0.10); background: #fff; color: var(--black); }
.sh-btn:hover { border-color: rgba(47,211,160,0.45); background: #E8F8F2; }
.sh-btn.pri { background: var(--brand-dark); border-color: var(--brand-dark); color: #fff; }
.sh-btn.pri:hover { background: #15505A; }
.sh-btn:disabled { opacity: 0.45; cursor: not-allowed; }

/* ── Monatsleiste (T-181) — ersetzt Tab-Reihe und Vollständigkeits-Assistent ── */
/* Nav (52px) und Demo-/Imported-Banner sind `position: fixed` und würden das
   Band sonst überdecken — dieselbe Kompensation wie sonst nur `.band-top`
   bekommt, hier per body-Klasse gesetzt, sobald die Leiste tatsächlich rendert.
   `.band-top` braucht seine eigene Kompensation dann nicht mehr — sonst
   entstünde ein doppelter Abstand. */
.vollstaendigkeit-band { padding: 22px 40px 0; }
.gruendung-hinweis { margin: -4px 0 14px; font-size: 13px; line-height: 1.5; color: var(--gray); }
.gruendung-hinweis a { color: inherit; text-decoration: underline; }
body.hat-vollstaendigkeit .vollstaendigkeit-band { margin-top: 96px; }
body.hat-vollstaendigkeit.with-banner .band-top,
body.hat-vollstaendigkeit.with-imported-banner .band-top { padding-top: var(--band-pad); }
.ml-card { max-width: 1320px; margin: 0 auto; background: var(--white); border-radius: var(--r); box-shadow: var(--shadow);
  border: 2px solid rgba(14,59,67,0.18); padding: 16px 22px 18px; }
.ml-kopf { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; flex-wrap: wrap; }
.ml-titel { font-size: 15px; font-weight: 700; color: var(--black); }
.ml-jahr { display: inline-flex; align-items: center; gap: 4px; background: #F1F5F9; border-radius: 50px; padding: 2px; }
.ml-jahr-zahl { min-width: 48px; text-align: center; font-size: 14px; color: var(--black); }
.ml-jahr-btn { width: 32px; height: 32px; border: none; border-radius: 50%; background: #fff; color: var(--black); font-size: 18px;
  line-height: 1; cursor: pointer; font-family: inherit; box-shadow: 0 1px 2px rgba(0,0,0,0.12); }
.ml-jahr-btn:hover:not(:disabled) { background: #E2E8F0; }
.ml-jahr-btn:disabled { opacity: 0.35; cursor: default; box-shadow: none; }
.ml-status { margin-left: auto; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 50px; }
.ml-status-ok { background: #DCFCE7; color: #166534; }
.ml-status-luecke { background: #FEF3C7; color: #92400E; }
.ml-status-neutral { background: #F1F5F9; color: var(--gray); }
.ml-aeltere { border: 1px solid #CBD5E1; background: #fff; color: var(--black); font-family: inherit; font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 50px; cursor: pointer; }
.ml-aeltere:hover { background: #F1F5F9; }
.ml-aeltere:focus-visible { outline: 2px solid var(--tanne); outline-offset: 2px; }
/* Zwölf Monate in einer Reihe; auf dem Handy horizontal scrollbar. */
.ml-reihe { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.ml-monat { flex: 1 0 64px; min-height: 52px; padding: 6px 4px; border-radius: 12px; border: 2px solid transparent; font-family: inherit;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-align: center; box-sizing: border-box; }
.ml-name { font-size: 14px; font-weight: 700; }
.ml-sub { font-size: 10.5px; font-weight: 600; line-height: 1.2; }
button.ml-monat { cursor: pointer; transition: transform 0.15s, box-shadow 0.15s; }
button.ml-monat:hover { transform: translateY(-1px); box-shadow: 0 3px 8px rgba(14,59,67,0.18); }
button.ml-monat:focus-visible { outline: 2px solid var(--tanne); outline-offset: 2px; }
.ml-vorhanden { background: #DCFCE7; color: #166534; border-color: rgba(22,101,52,0.25); }
.ml-manuell { background: #FEF3C7; color: #92400E; border-color: rgba(146,64,14,0.25); }
/* Gewählter Monat: dunkel gefüllt, damit er sich klar von den übrigen abhebt. */
.ml-monat.ml-aktiv { background: var(--brand-dark, #0E3B43); color: #fff; border-color: var(--brand-dark, #0E3B43); box-shadow: 0 3px 10px rgba(14,59,67,0.35); }
.ml-fehlt { background: #FEE2E2; color: #B91C1C; border-color: rgba(185,28,28,0.3); }
.ml-fehlt:hover { background: #FECACA; }
.ml-jahressumme { background: #E0E7FF; color: #3730A3; }
.ml-offen { background: #F1F5F9; color: var(--gray); }
.ml-leer { background: #F1F5F9; color: var(--gray); border-color: #E2E8F0; }
.ml-leer:hover { background: #E2E8F0; }
.ml-na { background: #F1F5F9; color: var(--gray); opacity: 0.55; }
.ml-vorjahr { margin-top: 12px; font-size: 13px; color: var(--gray); }
.ml-vorjahr strong { color: var(--black); }
.ml-hinweis { margin-top: 4px; font-size: 13px; color: var(--gray); line-height: 1.5; }
@media (max-width: 640px) {
  .vollstaendigkeit-band { padding: 16px 12px 0; }
  .ml-card { padding: 12px 12px 14px; }
  .ml-monat { flex: 0 0 62px; }
}

/* ── Monatsraster / „Meine Daten" (T-144) — eigenes Modal, Palette wie oben ── */
.modal-wide { max-width: 920px; }
.mr-quittung { background: #DCFCE7; color: #166534; border-radius: var(--r); padding: 12px 16px; font-size: 13.5px; font-weight: 600; margin-bottom: 18px; }
.mr-jahr { margin-bottom: 22px; }
.mr-jahr:last-child { margin-bottom: 0; }
.mr-jahr-kopf { font-size: 14px; font-weight: 700; color: var(--black); margin-bottom: 10px; }
.mr-jahr-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(122px, 1fr)); gap: 10px; }
.mr-zelle { border-radius: 14px; padding: 10px 12px; border: 1.5px solid transparent; display: flex; flex-direction: column; gap: 4px; }
.mr-zelle-mon { font-size: 13px; font-weight: 700; }
.mr-zelle-status { font-size: 11px; line-height: 1.3; }
.mr-zelle-acts { display: flex; gap: 6px; margin-top: 4px; flex-wrap: wrap; }
.mr-act { font-family: inherit; font-size: 11px; font-weight: 600; border: none; border-radius: 50px; padding: 4px 10px; cursor: pointer; background: rgba(255,255,255,0.7); }
.mr-act:hover { background: #fff; }
.mr-act-del { color: #B91C1C; }
.mr-ok { background: #DCFCE7; color: #166534; }
.mr-jahres { background: #E0E7FF; color: #3730A3; }
.mr-fehlt { background: #FEE2E2; color: #B91C1C; }
.mr-offen { background: #F1F5F9; color: var(--gray); }
/* Monate vor der Gründung (T-063), analog zu .vs-monat.vs-na: grau wie
   "noch nicht fällig", aber blasser — "gibt es nicht" statt "kommt noch". */
.mr-na { background: #F1F5F9; color: var(--gray); opacity: 0.55; }
/* T-145: schraffiert statt flächig — der Unterschied zu "vorhanden" (mr-ok)
   muss auch ohne Farbwahrnehmung auffallen. */
.mr-manuell {
  background-color: #FEF3C7;
  background-image: repeating-linear-gradient(135deg, rgba(146,64,14,0.16) 0 6px, transparent 6px 12px);
  color: #92400E;
}
.mr-legende { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--gray); margin-bottom: 14px; }
.mr-legende-chip { width: 22px; height: 14px; border-radius: 5px; display: inline-block; }
.mr-legende-chip.mr-manuell { border: 1px solid rgba(146,64,14,0.25); }

/* T-145: manueller Monatseintrag — kleines Formular im selben Modal-Stil. */
.form-row { margin-bottom: 16px; display: flex; flex-direction: column; gap: 6px; }
.form-row label { font-size: 12.5px; font-weight: 600; color: var(--gray); }
.form-row input[type="text"] {
  font-family: inherit; font-size: 14px; padding: 10px 12px; border-radius: 10px;
  border: 1.5px solid #E2E8F0; background: #fff; color: var(--black);
}
.form-row input[type="text"]:focus { outline: none; border-color: var(--tanne); }

/* Dispo-Rahmen in den Einstellungen (T-148) */
.dispo-setting { display: flex; gap: 10px; align-items: center; }
.dispo-setting .q-input { flex: 1 1 auto; min-width: 0; }

/* ── Planspiel-Band (T-150) ─────────────────────────────────────────────
   Hell und in Pastell wie die übrigen Bänder, ohne Icon-Badges. Die Ampel
   sitzt als Farbfläche am Urteilstext, nicht als Symbol: Sie soll den Satz
   einfärben, den der Unternehmer ohnehin liest. */
.planspiel-inhalt { margin-top: 20px; }
.planspiel-demo-hinweis { font-size: 12.5px; color: var(--gray); margin-bottom: 14px; }

/* Freie Frage (T-154). Sie steht über den Vorlagen-Reitern, weil sie der
   bequemere Weg in dieselbe Rechnung ist: fragen statt die passende Vorlage
   suchen. Optisch ein ruhiger Kasten, damit die Reiter darunter nicht
   entwertet werden. */
.planspiel-kifrage {
  background: var(--white); border: 1.5px solid rgba(47,211,160,0.35); border-radius: var(--r);
  padding: 18px 22px; margin-bottom: 20px; max-width: 1000px;
}
.planspiel-kifrage-lbl { display: block; font-size: 12.5px; font-weight: 600; color: var(--gray); margin-bottom: 8px; }
.planspiel-kifrage-zeile { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.planspiel-kifrage-feld { flex: 1 1 340px; min-width: 0; }
.planspiel-kifrage-hinweis { font-size: 11.5px; color: var(--lgray); line-height: 1.45; margin-top: 8px; }
.planspiel-kifrage-rueckfrage, .planspiel-kifrage-ausserhalb {
  margin-top: 14px; padding: 12px 14px; border-radius: 12px;
  background: #FFFBEB; border: 1px solid #FDE68A; color: #92400E;
  font-size: 13.5px; line-height: 1.5;
}
.planspiel-kifrage-ausserhalb { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; }

/* Der ausformulierte Satz sitzt direkt über den Ergebniskacheln — er erklärt
   sie, ersetzt sie aber nicht. */
.planspiel-ki-antwort {
  margin-top: 22px; max-width: 780px; padding: 16px 20px; border-radius: 14px;
  background: #F8FAFC; border-left: 4px solid var(--tanne);
  font-size: 15px; line-height: 1.55;
}
.planspiel-ki-marke { display: block; margin-top: 6px; font-size: 11px; color: var(--lgray); }

.planspiel-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.planspiel-tab {
  font-family: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer;
  padding: 9px 16px; border-radius: 999px; border: 1.5px solid var(--lgray);
  background: var(--white); color: var(--gray);
}
.planspiel-tab:hover { border-color: var(--tanne); color: var(--tanne); }
.planspiel-tab.aktiv { background: #E8F8F2; border-color: var(--tanne); color: var(--petrol); }

.planspiel-basis { font-size: 12.5px; color: var(--gray); margin-bottom: 16px; }

.planspiel-formular {
  background: var(--card-grad); border: var(--border); border-radius: var(--r);
  box-shadow: var(--shadow); padding: 20px 24px; max-width: 1000px;
}
.planspiel-frage { font-size: 17px; font-weight: 700; margin-bottom: 18px; }
.planspiel-felder { display: flex; flex-wrap: wrap; gap: 16px; }
.planspiel-feld { display: flex; flex-direction: column; gap: 6px; flex: 1 1 200px; min-width: 0; }
.planspiel-feld-lbl { font-size: 12.5px; font-weight: 600; color: var(--gray); }
.planspiel-einheit { font-weight: 500; color: var(--lgray); }
.planspiel-input {
  font-family: inherit; font-size: 15px; padding: 10px 12px; border-radius: 10px;
  border: 1.5px solid #E2E8F0; background: var(--white); color: var(--black); width: 100%;
}
.planspiel-input:focus { outline: none; border-color: var(--tanne); }
.planspiel-feld.fehlerhaft .planspiel-input { border-color: var(--red); }
.planspiel-feld-hinweis { font-size: 11.5px; color: var(--gray); line-height: 1.4; }
.planspiel-lohnhinweis { margin-top: 12px; }

.planspiel-aktionen { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.planspiel-btn {
  display: inline-flex; align-items: center; background: var(--mint);
  color: #fff; border: none; padding: 12px 24px; border-radius: 10px;
  font-size: 15px; font-weight: 700; font-family: inherit; cursor: pointer;
}
.planspiel-btn:hover { filter: brightness(1.06); }
.planspiel-btn[disabled] { opacity: 0.6; cursor: default; }
.planspiel-btn.sekundaer { background: var(--white); color: var(--tanne); border: 1.5px solid var(--lgray); }
.planspiel-btn.sekundaer:hover { border-color: var(--tanne); filter: none; }
.planspiel-fehler { margin-top: 14px; font-size: 13px; color: #B91C1C; }

.planspiel-ergebnis { margin-top: 22px; max-width: 1000px; }
.planspiel-urteil {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px;
  padding: 16px 20px; border-radius: 14px; border: 1.5px solid transparent; font-size: 15px;
}
.planspiel-urteil.ampel-gruen { background: #ECFDF5; border-color: #A7F3D0; color: #065F46; }
.planspiel-urteil.ampel-gelb  { background: #FFFBEB; border-color: #FDE68A; color: #92400E; }
.planspiel-urteil.ampel-rot   { background: #FEF2F2; border-color: #FECACA; color: #991B1B; }
.planspiel-ampel-lbl { font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.planspiel-urteil-text { font-weight: 600; flex: 1 1 260px; }
.planspiel-titel { margin-top: 16px; font-size: 13px; color: var(--gray); }

.planspiel-antworten { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-top: 10px; }
.planspiel-kachel { background: var(--card-grad); border: var(--border); border-radius: 16px; box-shadow: var(--shadow); padding: 20px 22px; }
.planspiel-kachel[data-antwort="mehrumsatz"], .planspiel-kachel[data-antwort="gewinnwirkung"] { background: #FFFFFF; }
.planspiel-kachel[data-antwort="marge"] { background: #FFFFFF; }
.planspiel-kachel[data-antwort="polster"] { background: #FFFFFF; }
.planspiel-kachel-lbl { font-size: 12px; font-weight: 600; color: var(--gray); }
.planspiel-kachel-wert { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; margin-top: 4px; }
.planspiel-kachel-zusatz { font-size: 12px; color: var(--gray); margin-top: 6px; line-height: 1.4; }

.planspiel-polsterart { font-size: 11.5px; color: var(--gray); margin-top: 10px; }
.planspiel-hinweise { margin-top: 12px; padding-left: 18px; font-size: 12.5px; color: var(--gray); }
.planspiel-hinweise li { margin-top: 4px; }

.planspiel-rechenweg { margin-top: 14px; }
.planspiel-rechenweg-liste { margin: 12px 0 2px 18px; font-size: 13px; color: var(--black); }
.planspiel-rechenweg-liste li { margin-top: 6px; line-height: 1.5; }

.planspiel-szenarien { margin-top: 24px; max-width: 1000px; font-size: 13px; }
.planspiel-szenarien.leer { color: var(--gray); font-size: 12.5px; }
.planspiel-szenarien-titel { font-size: 12px; font-weight: 700; color: var(--gray); text-transform: uppercase; letter-spacing: 0.06em; }
.planspiel-szenarien-liste { list-style: none; margin-top: 8px; }
.planspiel-szenario { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--lgray); }
.planspiel-szenario-vorlage { font-size: 11.5px; color: var(--gray); flex: 1 1 auto; }

@media (max-width: 720px) {
  .planspiel-formular { padding: 22px 20px; }
  .planspiel-feld { flex: 1 1 100%; }
}

/* ── Ziele-Band und Monats-Recap (T-151) ────────────────────────────────
   Das Ziele-Band lebt vom Fortschrittsbalken: Er ist die einzige Stelle im
   Dashboard, die eine Richtung über mehrere Monate zeigt. Farbwelt wie das
   Planspiel (Bernstein), weil die Ziele von dort kommen; erreichte Ziele
   wechseln auf Grün, damit „geschafft" nicht erst gelesen werden muss. */
.planspiel-erfolg { margin-top: 14px; font-size: 13px; color: #065F46; font-weight: 600; }

.ziele-inhalt { margin-top: 20px; max-width: 780px; }
.ziele-kopf { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.ziele-zaehler { font-size: 12px; font-weight: 700; color: var(--gray); text-transform: uppercase; letter-spacing: 0.06em; }
.ziele-leer { font-size: 13px; color: var(--gray); line-height: 1.55; }

.ziele-liste { list-style: none; display: grid; gap: 14px; }
.ziel-karte {
  background: var(--card-grad); border: var(--border); border-radius: 16px;
  box-shadow: var(--shadow); padding: 20px 22px;
}
.ziel-karte.erreicht { background: #F1FAF6; border-color: #A7F3D0; }
.ziel-kopf { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; }
.ziel-name { font-size: 15.5px; font-weight: 700; }
.ziel-pct { font-size: 15.5px; font-weight: 800; color: var(--tanne); }
.ziel-karte.erreicht .ziel-pct { color: #047857; }

.ziel-track { height: 8px; border-radius: 999px; background: #F1F5F9; overflow: hidden; margin: 12px 0; }
.ziel-fill { height: 100%; border-radius: 999px; background: var(--mint); }
.ziel-karte.erreicht .ziel-fill, .recap-ziel.erreicht .ziel-fill { background: linear-gradient(90deg,#4ADE80,#16A34A); }

.ziel-zahlen { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 12.5px; color: var(--gray); }
.ziel-zahlen strong { color: var(--black); }
.ziel-erreicht { margin-top: 12px; font-size: 13px; color: #065F46; line-height: 1.5; }
.ziel-hinweis { margin-top: 10px; font-size: 11.5px; color: var(--gray); line-height: 1.45; }
.ziel-fuss { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--lgray); }
.ziel-ausgang { font-size: 11.5px; color: var(--gray); }

.recap-kennzahlen { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; }
.recap-kachel { background: var(--white); border: var(--border); border-radius: 14px; padding: 14px 16px; }
.recap-kachel-lbl { font-size: 11.5px; font-weight: 600; color: var(--gray); }
.recap-kachel-wert { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; margin-top: 4px; }

.recap-vergleich { margin-top: 16px; }
.recap-vergleich.leer { font-size: 12.5px; color: var(--gray); line-height: 1.5; }
.recap-vergleich-titel { font-size: 12px; font-weight: 700; color: var(--gray); text-transform: uppercase; letter-spacing: 0.06em; }
.recap-bezug { font-weight: 500; text-transform: none; letter-spacing: 0; margin-left: 8px; }
.recap-vergleich-werte { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.recap-delta { font-size: 13.5px; font-weight: 700; padding: 6px 12px; border-radius: 999px; background: #F1F5F9; color: var(--gray); }
.recap-delta[data-richtung="hoch"] { background: #ECFDF5; color: #047857; }
.recap-delta[data-richtung="runter"] { background: #FEF2F2; color: #B91C1C; }

.recap-ziele { margin-top: 22px; }
.recap-ziele.leer { font-size: 12.5px; color: var(--gray); line-height: 1.55; }
.recap-abschnitt-titel { font-size: 12px; font-weight: 700; color: var(--gray); text-transform: uppercase; letter-spacing: 0.06em; }
.recap-ziele-liste { list-style: none; margin-top: 10px; display: grid; gap: 14px; }
.recap-ziel-kopf { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px; }
.recap-ziel-name { font-size: 14px; font-weight: 700; }
.recap-ziel-pct { font-size: 14px; font-weight: 800; color: var(--tanne); }
.recap-ziel.erreicht .recap-ziel-pct { color: #047857; }
.recap-ziel-satz { font-size: 12.5px; color: var(--gray); }
/* Der Ziel-Typ (T-153) steht über den Szenario-Zielen und wird an Kriterien
   gemessen, nicht in Euro — die Linie trennt die beiden Arten sichtbar. */
.recap-ziel.typ { padding-bottom: 14px; border-bottom: 1px solid var(--line, #E5E7EB); }

/* Feedback 01.10.2026: Import ohne BWA, Kontostand-Modus des Hand-Dialogs */
.import-ohne-bwa { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:14px; padding:12px 14px; border:1px solid var(--lgray); border-radius:12px; background:#fff; }
.import-ohne-bwa-text { font-size:13.5px; font-weight:600; }
#manuellerMonatModal [hidden] { display:none !important; }
.ziel-niveau { font-size: 13.5px; color: var(--black); margin-top: 8px; line-height: 1.5; }
.ziel-skala { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--gray); margin: -6px 0 8px; }
.ziel-geschafft { font-size: 13px; color: var(--black); }
.ziel-unter-start { color: var(--tanne); }
/* ERFOLGE (Feedback 01.10.2026): kompakte Kacheln, Raster nach Kachelzahl,
   damit nie eine einzelne Kachel allein in einer zweiten Zeile steht. */
.achieve-grid.ac-n-1 { grid-template-columns: minmax(0, 340px); }
.achieve-grid.ac-n-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.achieve-grid.ac-n-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.achieve-grid.ac-n-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1000px) {
  .achieve-grid.ac-n-3 { grid-template-columns: 1fr; }
  .achieve-grid.ac-n-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .achieve-grid.ac-n-2, .achieve-grid.ac-n-4 { grid-template-columns: 1fr; }
}
.achieve-grid .ac-big-stat { font-size: 24px; }
/* Erfolge (T-188): eigener Abschnitt, Kacheln nur so hoch wie ihr Inhalt.
   Weitere Farben für Gewinn-, Marge- und Reserve-Kacheln. */
.achieve-grid { align-items: start; margin-top: 22px; }
.ac-cat-teal { background: #E3F5EE; color: #0F6B4F; }
.ac-bar-purple { background: #0E3B43; }
.ac-purple .ac-dot-active .ac-dot-circle { background: #0E3B43; }
.ac-blue .ac-dot-active .ac-dot-circle { background: #15805F; }
.ac .ac-comp-track + .ac-bench-labels { margin-top: 6px; }
/* Karussell ab vier Erfolgen: drei Kacheln sichtbar, Rest per Pfeil, Wischen
   (scroll-snap) oder Tastatur (Region ist fokussierbar). "Alle ansehen" klappt
   das Raster auf. */
.achieve-grid.ac-scroll { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 32px) / 3); overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: auto; padding-bottom: 6px; scrollbar-width: thin; }
.achieve-grid.ac-scroll > .ac { scroll-snap-align: start; }
.achieve-grid.ac-alle { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.achieve-grid:focus-visible { outline: 2px solid #0E3B43; outline-offset: 4px; border-radius: 12px; }
.ac-steuer { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 18px; flex-wrap: wrap; }
.ac-steuer[hidden] { display: none; }
.ac-weitere { font-size: 12.5px; color: var(--gray); margin-right: auto; }
.ac-pfeil { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--lgray); background: #fff; cursor: pointer; font-size: 16px; line-height: 1; color: var(--black); }
.ac-pfeil:disabled { opacity: 0.35; cursor: default; }
.ac-pfeil:focus-visible, .ac-alle-link:focus-visible { outline: 2px solid #0E3B43; outline-offset: 2px; }
.ac-pfeil[hidden], .ac-weitere[hidden] { display: none; }
.ac-alle-link { background: none; border: 0; padding: 8px 4px; font: inherit; font-size: 13px; font-weight: 600; color: #15805F; text-decoration: underline; cursor: pointer; }
.ac-steuer + .achieve-grid { margin-top: 12px; }
@media (max-width: 1000px) {
  .achieve-grid.ac-alle { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .achieve-grid.ac-scroll { grid-auto-columns: calc((100% - 16px) / 2); }
}
@media (max-width: 640px) {
  .achieve-grid.ac-alle { grid-template-columns: 1fr; }
  .achieve-grid.ac-scroll { grid-auto-columns: 82%; }
}
/* Der Score-Band zeigt nur noch die Score-Karte (nur Demo). */
.score-grid { grid-template-columns: minmax(0, 460px); }
.ac-leer { grid-column: 1 / -1; font-size: 13px; color: var(--gray); padding: 14px 18px; border: 1px dashed var(--lgray); border-radius: var(--r); background: var(--white); }

.bench-kpi-herkunft { font-size: 12.5px; color: var(--gray); line-height: 1.5; padding: 0 4px; }
.bench-mehr { margin: 4px 4px 14px; }
.bench-methodik-text { font-size: 12.5px; color: var(--gray); line-height: 1.5; margin: 0 0 8px; max-width: 70ch; }
.bench-quellen { margin: 0; padding-left: 18px; font-size: 11.5px; color: var(--gray); line-height: 1.5; }
/* ── Feedback 01.10.: Typ-Kacheln als Bedienfläche (Prefix typen-fb) ──
   Die Kacheln unter „Die anderen Typen" sind Buttons: ganze Fläche klickbar,
   Fokusring sichtbar, nichts unter 32 px. Details eines Typs stehen darunter. */
button.analyse-typ { font: inherit; cursor: pointer; min-height: 56px; width: 100%; }
button.analyse-typ:hover { border-color: var(--gray); }
button.analyse-typ:focus-visible { outline: 2px solid var(--tanne); outline-offset: 2px; }
button.analyse-typ.is-offen { border-color: var(--black); box-shadow: 0 0 0 1px var(--black); }
.galerie-detail-host { margin-top: 16px; }
.galerie-detail-host .galerie-typ-kopf { flex-wrap: wrap; }
.galerie-schliessen { margin-left: auto; min-height: 36px; min-width: 36px; padding: 6px 14px; background: var(--white); border: 1px solid var(--gray); border-radius: 50px; font-size: 13px; font-weight: 700; color: var(--black); cursor: pointer; }
.galerie-schliessen:hover { background: var(--lgray); }
.galerie-schliessen:focus-visible { outline: 2px solid var(--tanne); outline-offset: 2px; }
.galerie-detail-host .galerie-btn { min-height: 36px; }
.ziel-aufgeben { min-height: 36px; }
.galerie-erfuellt { margin: 14px 0 0; font-size: 13px; font-weight: 700; color: #0F766E; }
.analyse-profil-auch { margin-top: 14px; font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.85); }
.ziel-unbewertbar { margin-bottom: 14px; }

/* ── UI-Durchgang 01.10.: Bedienelemente mindestens 32 px hoch ── */
.nav-icon-btn { width: 32px; height: 32px; }
.nav-datenstand { min-height: 32px; }
.demo-banner button, .demo-banner a, .imported-banner button { min-height: 32px; display: inline-flex; align-items: center; }
.link-btn { display: inline-flex; align-items: center; min-height: 32px; }
@media (max-width: 640px) {
  .kpi-card { padding: 18px 16px; }
  .kpi-val { font-size: 25px; letter-spacing: -1px; }
}

/* ── Schrift (CI Bilanz): Schibsted Grotesk für Marke, Überschriften und große Kennzahlen; IBM Plex Mono für Tabellenzahlen ── */
.nav-product, .hero-number, .section-title, .score-num, .ac-big-stat, .kpi-val, .bench-row-val, .bosstype-name, .empty-state-title, .abschluss-titel, .analyse-profil-name, .planspiel-kachel-wert, .recap-kachel-wert, .hero-firm-name, .analyse-schritte-lbl { font-family: var(--font-display); font-variant-numeric: proportional-nums; }
.bwa-t td, .bwa-t th, .nav-datenstand, .review-table .rt-input, .euer-grid input { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.bwa-t td:first-child, .bwa-t th:first-child { font-family: inherit; }

/* ══ Beratermodus und Berater einladen (T-192) ══ */
.berater-banner { position:fixed; top:52px; left:0; right:0; z-index:150; background:#FBF3E1; border-bottom:1px solid #E9A23B; padding:8px 32px; display:flex; align-items:center; justify-content:center; gap:14px; font-size:13px; color:#1B2427; flex-wrap:wrap; }
.berater-banner[hidden] { display:none; }
.berater-banner button { background:var(--brand-dark); color:#fff; border:none; padding:5px 12px; border-radius:6px; font-size:12px; font-weight:600; cursor:pointer; font-family:inherit; min-height:32px; }
/* Der Beratermodus braucht weder den Import-Hinweis noch Knöpfe, die nur der Kunde bedient;
   die einzelnen Aktionen stehen in ui/berater-aktionen.js (Sperre im Dispatcher) und hier
   (Ansicht) — tests/unit/t192-berater-aktionen.test.ts hält beide Listen gleich. Eine
   Stylesheet-Erzeugung per Skript scheidet aus: Die CSP erlaubt keine Inline-Stylesheets. */
body.berater-modus [data-action="openImport"],
body.berater-modus [data-action="vsImportMonat"],
body.berater-modus [data-action="mlAeltere"],
body.berater-modus [data-action="importOhneBwa"],
body.berater-modus [data-action="raOeffneImport"],
body.berater-modus [data-action="raLoeschen"],
body.berater-modus [data-action="raOeffneManuell"],
body.berater-modus [data-action="openMonatsraster"],
body.berater-modus [data-action="openDatenverwaltung"],
body.berater-modus [data-action="openKontostandSetzen"],
body.berater-modus [data-action="openKontostandAktuell"],
body.berater-modus [data-action="openSettings"],
body.berater-modus [data-action="openBwaLoeschenDialog"],
body.berater-modus [data-action="bwaLoeschenBestaetigen"],
body.berater-modus [data-action="analyseZustimmen"],
body.berater-modus [data-action="analyseErneut"],
body.berater-modus [data-action="analyseWiderrufen"],
body.berater-modus [data-action="zielWaehlen"],
body.berater-modus [data-action="zielAufgeben"],
body.berater-modus [data-action="zielSchritte"],
body.berater-modus [data-action="zielLoeschen"],
body.berater-modus [data-action="psSpeichern"],
body.berater-modus [data-action="psLoeschen"],
body.berater-modus [data-action="psZiel"],
body.berater-modus [data-action="openBeraterEinladen"] { display: none !important; }
body.berater-modus #importedBanner,
body.berater-modus #trustBar,
body.berater-modus #btnImport,
body.berater-modus #btnSettings,
body.berater-modus #navDatenstand,
body.berater-modus .lock-card-btn { display: none !important; }
@media print { .berater-banner { display: none !important; } }

.ber-box { max-width: 560px; }
.ber-form { margin-top: 18px; }
.ber-form label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.ber-row { display: flex; gap: 8px; flex-wrap: wrap; }
.ber-row input { flex: 1; min-width: 200px; font-family: inherit; font-size: 14px; padding: 11px 13px; border-radius: 12px; border: 1.5px solid rgba(14,59,67,0.10); background: #fff; color: var(--black); }
.ber-fehler { background: #FEF2F2; border-color: #FECACA; color: #B91C1C; }
.ber-liste-kopf { margin-top: 24px; font-size: 11px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; color: var(--gray); }
.ber-zeile { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 0; border-top: 1px solid rgba(14,59,67,0.06); }
.ber-mail { font-size: 14px; font-weight: 700; word-break: break-all; }
.ber-status { font-size: 12.5px; color: var(--gray); margin-top: 2px; }
.ber-zeile.is-aktiv .ber-status { color: #065F46; }
.ber-zeile.is-entzogen { opacity: 0.6; }
.ber-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.ber-acts .sh-btn { padding: 7px 12px; font-size: 12.5px; }
.ber-leer { margin: 10px 0 0; font-size: 13px; color: var(--gray); }