/* Familientresor v1.0 — Editorial UI
   Richtlinie: klare Kanten, ruhige Farben, Typografie + Bildflächen statt SaaS-Bubbles. */
:root {
  --paper: #f6f1e7;
  --paper-2: #fbf8f1;
  --canvas: #efe8dc;
  --ink: #171814;
  --text: #20231e;
  --muted: #747468;
  --faint: #aaa696;
  --line: rgba(32, 35, 30, .14);
  --line-soft: rgba(32, 35, 30, .08);
  --panel: rgba(255, 252, 244, .86);
  --panel-solid: #fffaf0;
  --charcoal: #20231e;
  --forest: #18382e;
  --forest-2: #294f42;
  --bronze: #9d6f36;
  --sand: #d9c7a6;
  --burgundy: #642b2d;
  --blueblack: #1c2630;
  --danger: #8a2f28;
  --ok: #28533f;
  --warning-bg: #f6e7c8;
  --warning-text: #6f4d19;
  --radius-xl: 0px;
  --radius-lg: 0px;
  --radius-md: 0px;
  --shadow: 0 22px 80px rgba(20, 22, 18, .08);
  --shadow-soft: 0 12px 36px rgba(20, 22, 18, .055);
  --sidebar: 264px;
  --serif: Georgia, "Times New Roman", Times, serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { min-height: 100%; }
body {
  margin: 0;
  min-height: 100%;
  color: var(--text);
  font-family: var(--sans);
  letter-spacing: -.01em;
  background:
    linear-gradient(rgba(246, 241, 231, .92), rgba(246, 241, 231, .92)),
    url('/static/img/paper-texture.svg'),
    radial-gradient(circle at 10% 0%, rgba(157,111,54,.18), transparent 26rem),
    radial-gradient(circle at 92% 12%, rgba(24,56,46,.12), transparent 29rem),
    linear-gradient(135deg, var(--paper) 0%, #f8f2e7 55%, #e9e1d4 100%);
  background-attachment: fixed;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .23;
  background-image:
    linear-gradient(rgba(32,35,30,.075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(32,35,30,.05) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, black, transparent 78%);
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, rgba(255,255,255,.38), transparent 38%, rgba(255,255,255,.18));
  mix-blend-mode: soft-light;
}
a { color: var(--forest); text-decoration: none; }
a:hover { color: var(--bronze); text-decoration: none; }
small { color: var(--muted); }
.ambient { display: none !important; }

/* Shell */
.app-shell { display: grid; grid-template-columns: var(--sidebar) minmax(0, 1fr); min-height: 100vh; position: relative; z-index: 1; }
.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  padding: 1.35rem 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  background:
    linear-gradient(rgba(255,250,240,.92), rgba(246,241,231,.78)),
    url('/static/img/architecture-lines.svg');
  background-size: cover;
  border-right: 1px solid var(--line);
  box-shadow: 20px 0 90px rgba(20,22,18,.055);
  backdrop-filter: blur(18px);
  z-index: 20;
}
.brand-card {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: .85rem;
  align-items: center;
  padding: .85rem 0 .95rem;
  color: var(--text);
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}
.brand-card:hover { color: var(--text); }
.brand-mark {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 0;
  color: #fff;
  background: var(--charcoal);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow: inset 0 0 0 5px rgba(255,255,255,.06);
  font-family: var(--serif);
  font-weight: 700;
  letter-spacing: -.05em;
}
.brand-card strong {
  display: block;
  font-family: var(--serif);
  font-size: 1.28rem;
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -.035em;
}
.brand-card small {
  display: block;
  margin-top: .25rem;
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
}
.brand, .compact-brand { font-family: var(--serif); font-size: 1.3rem; font-weight: 600; color: var(--text); }

.side-nav { display: grid; gap: 0; overflow: auto; padding: .1rem 0; }
.nav-kicker {
  margin: 1.1rem 0 .35rem;
  padding-top: .75rem;
  border-top: 1px solid var(--line-soft);
  color: var(--bronze);
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.nav-kicker:first-child { border-top: 0; padding-top: 0; margin-top: .25rem; }
.side-nav a {
  display: grid;
  grid-template-columns: 22px 1fr;
  align-items: center;
  gap: .72rem;
  padding: .66rem 0;
  color: rgba(32,35,30,.82);
  border-radius: 0;
  border-bottom: 1px solid rgba(32,35,30,.055);
  font-weight: 680;
  transition: color .15s ease, padding-left .15s ease, background .15s ease;
}
.side-nav a span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 0;
  background: transparent;
  color: var(--bronze);
  font-size: .95rem;
}
.side-nav a:hover {
  color: var(--forest);
  padding-left: .35rem;
  background: linear-gradient(90deg, rgba(157,111,54,.09), transparent 70%);
  box-shadow: none;
}
.side-nav a.nav-highlight {
  margin: .25rem 0 .55rem;
  padding: .78rem .75rem;
  grid-template-columns: 24px 1fr;
  color: #fff;
  background: var(--charcoal);
  border: 1px solid var(--charcoal);
  box-shadow: none;
}
.side-nav a.nav-highlight:hover { color: #fff; padding-left: .95rem; background: var(--forest); }
.side-nav a.nav-highlight span { color: var(--sand); background: transparent; }
.side-footer { margin-top: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--line); }
.side-footer a { padding-top: .8rem; color: var(--muted); font-weight: 700; font-size: .82rem; }
.side-footer a:hover { color: var(--forest); }
.main-area { min-width: 0; }
.topbar {
  position: sticky;
  top: 0;
  z-index: 15;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.65rem;
  background: rgba(246,241,231,.78);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(18px);
}
.global-search {
  flex: 1;
  max-width: 780px;
  position: relative;
  display: flex;
  align-items: center;
}
.global-search span { position: absolute; left: 0; color: var(--bronze); font-weight: 900; }
.global-search input {
  padding-left: 2rem;
  min-height: 2.72rem;
  border-radius: 0;
  background: rgba(255,250,240,.72);
  box-shadow: none;
  border-width: 0 0 1px 0;
}
.top-actions { display: flex; gap: .65rem; align-items: center; }
.user-chip { padding: .45rem .65rem; border-bottom: 1px solid var(--line); color: var(--muted); font-weight: 700; }
.container { max-width: 1360px; margin: 0 auto; padding: 2rem 2.1rem 3rem; }

/* Typography */
h1, h2, h3 { color: var(--ink); }
h1 {
  margin: 0 0 1rem;
  font-family: var(--serif);
  font-size: clamp(2.8rem, 6.5vw, 6.7rem);
  line-height: .88;
  letter-spacing: -.075em;
  font-weight: 500;
}
h2 { margin: 0 0 .9rem; font-family: var(--serif); font-size: clamp(1.5rem, 2.3vw, 2.25rem); line-height: 1; font-weight: 500; letter-spacing: -.055em; }
h3 { margin-top: 0; font-family: var(--serif); font-size: 1.32rem; font-weight: 500; letter-spacing: -.035em; }
.lead { color: var(--muted); font-size: 1.06rem; line-height: 1.65; max-width: 68ch; }
.eyebrow { margin: 0 0 .55rem; color: var(--bronze); font-size: .72rem; font-weight: 900; letter-spacing: .19em; text-transform: uppercase; }
.page-header { display: flex; gap: 1rem; align-items: flex-end; justify-content: space-between; margin-bottom: 1.35rem; border-bottom: 1px solid var(--line); padding-bottom: 1rem; }
.page-header h1 { font-size: clamp(2.6rem, 4.4vw, 5.2rem); margin-bottom: .25rem; }

/* Editorial hero and image surfaces */
.hero-panel, .page-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0,1fr) 360px;
  gap: 1.5rem;
  align-items: stretch;
  margin-bottom: 1.65rem;
  padding: clamp(1.7rem, 4vw, 3.4rem);
  border: 1px solid var(--line);
  border-radius: 0;
  background:
    linear-gradient(90deg, rgba(255,250,240,.95) 0%, rgba(255,250,240,.90) 50%, rgba(255,250,240,.24) 100%),
    url('/static/img/editorial-archive.svg'),
    linear-gradient(135deg, #fffaf0, #e9dfcf);
  background-position: center right, right center, center;
  background-size: auto, min(44%, 520px) auto, cover;
  box-shadow: var(--shadow);
  overflow: hidden;
}
.hero-panel::before, .page-hero::before {
  content: "";
  position: absolute;
  inset: 1.25rem;
  border: 1px solid rgba(32,35,30,.08);
  pointer-events: none;
}
.hero-panel::after, .page-hero::after {
  content: "";
  position: absolute;
  right: 2rem;
  bottom: 2rem;
  width: 8rem;
  height: 8rem;
  border: 1px solid rgba(157,111,54,.32);
  border-left: 0;
  border-top: 0;
  pointer-events: none;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.hero-card, .hero-stat-card {
  position: relative;
  z-index: 1;
  display: grid;
  align-content: start;
  gap: .85rem;
  padding: 1.2rem;
  border-radius: 0;
  border: 1px solid rgba(255,250,240,.18);
  background: rgba(32,35,30,.92);
  color: #fff;
  box-shadow: none;
}
.hero-card::before, .hero-stat-card::before {
  content: "";
  display: block;
  width: 100%;
  height: 112px;
  margin-bottom: .25rem;
  background: url('/static/img/architecture-lines.svg') center/cover no-repeat;
  opacity: .55;
  border: 1px solid rgba(255,255,255,.12);
}
.hero-card a { color: #fff; padding: .72rem 0; border-radius: 0; border-top: 1px solid rgba(255,255,255,.18); background: transparent; font-weight: 760; }
.hero-card a:hover { color: var(--sand); background: transparent; }
.hero-icon, .hero-stat-icon { display: none; }
.compact-hero { grid-template-columns: minmax(0,1fr) 300px; }

/* Cards, panels */
.card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 0;
  padding: 1.35rem;
  margin-bottom: 1.35rem;
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(12px);
}
.card.narrow { max-width: 600px; margin: 4rem auto; }
.feature-card { min-height: 100%; }
.accent-card { background: linear-gradient(135deg, rgba(255,250,240,.91), rgba(236,228,215,.84)); }
.info-card { background: #f0eee8; border-color: var(--line); color: var(--blueblack); }
.warning { background: var(--warning-bg); color: var(--warning-text); border-radius: 0; padding: .75rem .95rem; border-left: 3px solid var(--bronze); }
.premium-card { background: rgba(255,250,240,.88); }
.section-title { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; padding-bottom: .75rem; border-bottom: 1px solid var(--line-soft); }
.section-title h2 { margin-bottom: 0; }
.grid.two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.35rem; }
.grid.three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.35rem; }
.dashboard-grid { align-items: stretch; }
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(225px, 1fr)); gap: 1rem; }
.compact-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

/* Buttons */
.actions, .form-actions, .pill-row { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.actions { margin-bottom: 1.25rem; }
.actions.small { margin-bottom: 0; }
.button, button.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.55rem;
  padding: .62rem 1rem;
  border-radius: 0;
  border: 1px solid var(--charcoal);
  background: transparent;
  color: var(--charcoal);
  font-weight: 760;
  cursor: pointer;
  box-shadow: none;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.button:hover { transform: translateY(-1px); background: var(--charcoal); color: #fff; box-shadow: none; }
.button.primary { background: var(--charcoal); border-color: var(--charcoal); color: #fff; }
.button.primary:hover { background: var(--forest); border-color: var(--forest); color: #fff; }
.button.ghost { background: transparent; border-color: var(--line); color: var(--text); }
.button.ghost:hover { background: rgba(32,35,30,.06); color: var(--charcoal); }
.button.large { min-height: 3rem; padding: .78rem 1.15rem; }
.link-button { border: 0; background: transparent; color: var(--forest); cursor: pointer; font: inherit; padding: 0; font-weight: 800; }
.link-button:hover { color: var(--bronze); text-decoration: none; }
.inline-form { display: inline; margin-left: .4rem; }

/* Metrics and graphics */
.metric-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 1rem; margin: 1.15rem 0 1.5rem; }
.metric-row div, .metric-card {
  position: relative;
  display: block;
  min-height: 156px;
  background: rgba(255,250,240,.82);
  border: 1px solid var(--line);
  border-radius: 0;
  padding: 1rem;
  box-shadow: var(--shadow-soft);
  color: var(--text);
  overflow: hidden;
}
.metric-card::before {
  content: "";
  position: absolute;
  inset: auto 0 0 auto;
  width: 120px;
  height: 90px;
  opacity: .24;
  background: url('/static/img/document-stilllife.svg') right bottom/contain no-repeat;
}
.metric-card:hover { transform: translateY(-2px); color: var(--text); }
.metric-row span, .metric-card span:not(.metric-icon) { display: block; position: relative; font-family: var(--serif); font-weight: 500; font-size: 2.8rem; letter-spacing: -.07em; line-height: .9; }
.metric-row small, .metric-card small { position: relative; display: block; margin-top: .7rem; color: var(--muted); font-weight: 760; text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; }
.metric-icon { display: none !important; }

.badge, .status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 1.65rem;
  padding: .2rem .52rem;
  border-radius: 0;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--forest);
  font-weight: 820;
  font-size: .78rem;
  white-space: nowrap;
}
.badge.muted { color: var(--muted); }
.badge.success, .status-pill.ok { border-color: rgba(40,83,63,.28); color: var(--ok); background: rgba(40,83,63,.055); }
.warning-badge, .status-pill.warn, .status-pill.warning { border-color: rgba(157,111,54,.35); background: var(--warning-bg); color: var(--warning-text); }
.status-pill.danger { border-color: rgba(138,47,40,.32); background: rgba(138,47,40,.06); color: var(--danger); }

/* Lists and shortcuts */
.clean-list { padding-left: 0; margin: 0; list-style: none; }
.clean-list li { margin: .35rem 0; }
.task-list li {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: baseline;
  justify-content: space-between;
  border-bottom: 1px solid var(--line-soft);
  padding: .85rem 0;
}
.task-list li:last-child { border-bottom: 0; }
.rich-list strong { font-family: var(--serif); font-size: 1.2rem; font-weight: 500; }
.timeline-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .8rem; }
.timeline-list li { display: grid; grid-template-columns: 18px 1fr; gap: .85rem; align-items: start; }
.timeline-dot { width: 10px; height: 10px; margin-top: .4rem; border-radius: 0; background: var(--bronze); box-shadow: 0 0 0 6px rgba(157,111,54,.12); }
.timeline-list p { margin: .2rem 0; }
.pill-row a, .shortcut-grid a {
  padding: .72rem .85rem;
  border: 1px solid var(--line);
  border-radius: 0;
  color: var(--text);
  background: rgba(255,250,240,.58);
  font-weight: 760;
}
.pill-row a:hover, .shortcut-grid a:hover { background: var(--charcoal); color: #fff; border-color: var(--charcoal); }
.shortcut-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(198px, 1fr)); gap: .8rem; }
.shortcut-grid a { display: flex; align-items: center; gap: .65rem; }
.shortcut-grid a span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 0; background: transparent; color: var(--bronze); border-right: 1px solid var(--line); padding-right: .55rem; }
.shortcut-grid a:hover span { color: var(--sand); border-color: rgba(255,255,255,.28); }
.mini-card {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 0;
  padding: 1rem;
  background: rgba(255,250,240,.68);
  box-shadow: none;
}
.mini-card::after { content: ""; display: block; margin-top: .8rem; width: 42px; border-bottom: 1px solid var(--bronze); }
.mini-card h3 { margin: 0 0 .4rem; }
.mini-card p { margin: .35rem 0; }
.document-tile { display: grid; gap: .35rem; color: var(--text); }
.document-tile:hover { color: var(--text); transform: translateY(-1px); }
.doc-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 0; background: var(--charcoal); color: #fff; }
.empty-state { text-align: center; padding: 2rem; color: var(--muted); border: 1px dashed var(--line); background: rgba(255,250,240,.42); }
.small-empty { padding: 1rem; border-radius: 0; }

/* Forms */
.form-grid { display: grid; gap: 1rem; }
.filter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .85rem; align-items: end; }
.form-field, form p { display: grid; gap: .38rem; margin: 0; }
.form-field label, form p label { font-weight: 780; color: #33362f; }
input, select, textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 0;
  padding: .72rem .82rem;
  font: inherit;
  background: rgba(255,250,240,.78);
  color: var(--text);
  outline: none;
  box-shadow: none;
  transition: border .15s ease, background .15s ease;
}
input:focus, select:focus, textarea:focus { border-color: var(--charcoal); background: #fffaf0; box-shadow: inset 0 -2px 0 var(--charcoal); }
textarea { min-height: 7rem; }
.compact-grid textarea { min-height: 6rem; }
input[type="checkbox"], input[type="radio"] { width: auto; accent-color: var(--charcoal); }
.checkbox-field { display: flex; gap: .5rem; align-items: center; }
.checkbox-field label { order: 2; }
.error { color: var(--danger); font-size: .9rem; }
.messages { margin-bottom: 1rem; }
.message { padding: .85rem 1rem; border-radius: 0; background: #edf2ea; border: 1px solid rgba(40,83,63,.22); box-shadow: none; }
.radio-group ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; }
.radio-group li { display: flex; align-items: center; gap: .5rem; }
.radio-group label { font-weight: 700; }
.formset { display: grid; gap: 1rem; }
.formset-row { border: 1px solid var(--line); border-radius: 0; padding: 1rem; background: rgba(255,250,240,.58); }
.sticky-actions { position: sticky; bottom: 0; background: rgba(246,241,231,.88); border-top: 1px solid var(--line); padding: .85rem 0; z-index: 5; backdrop-filter: blur(18px); }

/* File upload as editorial drop plate */
.file-field input[type="file"] {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}
.file-preview-label {
  min-height: 220px;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: .5rem;
  padding: 1.6rem;
  border: 1px solid var(--line);
  border-radius: 0;
  background:
    linear-gradient(90deg, rgba(255,250,240,.94), rgba(255,250,240,.76)),
    url('/static/img/document-stilllife.svg') right bottom/220px auto no-repeat;
  cursor: pointer;
  color: var(--text);
}
.file-preview-label strong { font-family: var(--serif); font-size: 1.9rem; font-weight: 500; letter-spacing: -.04em; }
.file-preview-label small { max-width: 34ch; line-height: 1.45; }
.file-preview-label em { font-style: normal; color: var(--bronze); font-weight: 760; margin-top: .5rem; }
.file-preview-label.dragging, .file-preview-label.has-file { border-color: var(--charcoal); background-color: rgba(255,250,240,.98); }
.file-icon { display: none; }

/* Detail split and previews */
.split { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr); gap: 1.35rem; align-items: start; }
.preview-pane iframe { width: 100%; height: 720px; border: 1px solid var(--line); border-radius: 0; background: #fff; box-shadow: var(--shadow-soft); }
.preview-pane img { max-width: 100%; border: 1px solid var(--line); border-radius: 0; box-shadow: var(--shadow-soft); }
.inner-card { margin: 0 0 1rem; box-shadow: none; }

/* Tables */
.table-wrap { overflow-x: auto; border: 1px solid var(--line); background: rgba(255,250,240,.58); }
table { width: 100%; border-collapse: collapse; border-spacing: 0; background: transparent; border-radius: 0; overflow: visible; }
th, td { padding: .92rem; border-bottom: 1px solid var(--line-soft); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .13em; background: rgba(32,35,30,.035); font-weight: 860; }
tr:hover td { background: rgba(255,250,240,.66); }
.row-warning { background: #fbf1d9; }

/* Inbox */
.inbox-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line-soft); }
.inbox-item:last-child { border-bottom: 0; }
.inbox-item h2 { margin: 0 0 .35rem; font-size: 1.2rem; }
.inbox-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: start; justify-content: flex-end; }

/* v1.0 editorial extras */
.editorial-divider { border: 0; border-top: 1px solid var(--line); margin: 2rem 0; }
.card > .eyebrow:first-child + h1,
.card > .eyebrow:first-child + h2 { margin-top: 0; }

@media (max-width: 1080px) {
  :root { --sidebar: 230px; }
  .hero-panel, .page-hero { grid-template-columns: 1fr; background-size: auto, 420px auto, cover; }
  .top-actions { display: none; }
}
@media (max-width: 840px) {
  .app-shell { display: block; }
  .sidebar { position: static; height: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .side-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .side-footer { margin-top: 0; }
  .topbar { position: static; }
  .global-search { max-width: none; }
  .grid.two, .grid.three, .split { grid-template-columns: 1fr; }
  .page-header, .section-title { align-items: flex-start; flex-direction: column; }
  .sticky-actions { position: static; }
  .inbox-item { grid-template-columns: 1fr; }
  .inbox-actions { justify-content: flex-start; }
  table { display: block; overflow-x: auto; }
}
@media (max-width: 560px) {
  .container { padding: 1rem; }
  .topbar { padding: .85rem; }
  .side-nav { grid-template-columns: 1fr; }
  .hero-panel, .page-hero { padding: 1.25rem; }
  .hero-panel::before, .page-hero::before { inset: .65rem; }
  h1 { font-size: 2.75rem; }
}

/* ------------------------------------------------------------------
   Familientresor v1.1 — Editorial UI Refinement
   Breitere Typografie, ruhigere Formulare, mehr Magazin-/Archivoptik.
   Keine Datenbankänderungen.
------------------------------------------------------------------- */
:root {
  --paper: #f4f0e8;
  --paper-2: #fbf8f2;
  --canvas: #ebe4d8;
  --panel: rgba(255, 252, 246, .78);
  --panel-solid: #fffdf8;
  --ink: #20201c;
  --text: #282822;
  --muted: #69665d;
  --line: rgba(32, 32, 28, .13);
  --line-soft: rgba(32, 32, 28, .075);
  --shadow: 0 18px 58px rgba(28, 28, 24, .055);
  --shadow-soft: 0 8px 28px rgba(28, 28, 24, .04);
  --sidebar: 252px;
}

body {
  letter-spacing: 0;
  background:
    linear-gradient(rgba(244,240,232,.94), rgba(244,240,232,.94)),
    url('/static/img/paper-texture.svg'),
    radial-gradient(circle at 9% 0%, rgba(139,106,76,.13), transparent 30rem),
    radial-gradient(circle at 94% 6%, rgba(49,66,56,.10), transparent 32rem),
    linear-gradient(135deg, #f4f0e8 0%, #f9f4ea 60%, #e7dfd2 100%);
}

.container {
  max-width: 1500px;
  padding: 3.1rem clamp(2rem, 4.4vw, 4.5rem) 4.5rem;
}

/* Typography: remove narrow/compressed feeling */
h1 {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: clamp(3rem, 5vw, 5.8rem);
  line-height: 1.04;
  letter-spacing: -.018em;
  font-weight: 500;
  max-width: 15.8ch;
}
h2 {
  font-size: clamp(1.8rem, 2.4vw, 2.9rem);
  line-height: 1.12;
  letter-spacing: -.012em;
  font-weight: 500;
  max-width: 20ch;
}
h3 {
  font-size: 1.38rem;
  line-height: 1.22;
  letter-spacing: 0;
}
.page-header h1 { font-size: clamp(3rem, 4.8vw, 5.6rem); }
.lead { font-size: 1.12rem; line-height: 1.72; color: #5f5d55; }
.eyebrow { letter-spacing: .22em; color: #8a684a; }

/* Shell refinement */
.sidebar { padding: 1.6rem 1.35rem; box-shadow: none; }
.brand-card { grid-template-columns: 42px 1fr; padding-bottom: 1.2rem; }
.brand-mark { width: 40px; height: 40px; }
.brand-card strong { letter-spacing: -.012em; font-size: 1.22rem; }
.side-nav a { padding: .75rem 0; font-weight: 620; letter-spacing: .005em; }
.side-nav a.nav-highlight { padding: .84rem .85rem; }
.topbar { padding: 1.15rem clamp(1.35rem, 3vw, 2.7rem); }
.global-search input { min-height: 3rem; padding-left: 2.25rem; }
.user-chip { font-weight: 620; }

/* Hero surfaces: calmer, broader, less dashboard */
.hero-panel, .page-hero {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 410px);
  gap: clamp(1.6rem, 3vw, 3rem);
  padding: clamp(2.4rem, 5vw, 4.8rem);
  margin-bottom: clamp(2rem, 4vw, 3rem);
  box-shadow: var(--shadow);
  background:
    linear-gradient(90deg, rgba(255,252,246,.96) 0%, rgba(255,252,246,.90) 47%, rgba(255,252,246,.30) 100%),
    url('/static/img/editorial-archive.svg'),
    linear-gradient(135deg, #fffdf8, #e8dfd0);
  background-position: center right, right center, center;
  background-size: auto, min(46%, 580px) auto, cover;
}
.hero-panel::before, .page-hero::before { inset: 1.6rem; }
.hero-actions { margin-top: 2rem; gap: .85rem; }
.hero-card, .hero-stat-card, .process-card, .hero-quick-actions {
  border-radius: 0;
  border: 1px solid rgba(32,32,28,.18);
  background: rgba(32,32,28,.92);
  color: #fff;
  box-shadow: none;
}
.hero-quick-actions { display: grid; gap: .8rem; align-content: start; padding: 1.25rem; }
.process-card {
  display: grid;
  gap: 0;
  align-content: stretch;
  padding: 0;
  overflow: hidden;
}
.process-card div {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: .9rem;
  align-items: center;
  padding: 1.15rem 1.25rem;
  border-bottom: 1px solid rgba(255,255,255,.16);
}
.process-card div:last-child { border-bottom: 0; }
.process-card span {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 1.7rem;
  color: #d9c7a6;
}
.process-card strong { display: block; color: #fff; font-size: 1.05rem; }
.process-card small { color: rgba(255,255,255,.68); }

/* Cards and sections */
.card {
  padding: clamp(1.55rem, 2.7vw, 2.45rem);
  margin-bottom: clamp(1.45rem, 2.8vw, 2.35rem);
  background: var(--panel);
  box-shadow: var(--shadow-soft);
}
.section-title {
  margin-bottom: 1.35rem;
  padding-bottom: 1.15rem;
  align-items: flex-start;
}
.section-title h2 { max-width: none; }
.premium-card { background: rgba(255,252,246,.86); }
.info-card { background: rgba(238,233,223,.74); }
.step-card {
  position: relative;
  padding-left: clamp(1.7rem, 3vw, 3rem);
}
.step-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #8b6a4c;
  opacity: .62;
}
.step-number {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: clamp(2.5rem, 5vw, 4.8rem);
  line-height: .8;
  color: rgba(139,106,76,.22);
  margin-bottom: 1rem;
}

/* Buttons: rectangular and quiet */
.button, button.button {
  min-height: 46px;
  padding: .75rem 1.16rem;
  border-radius: 0;
  font-weight: 620;
  letter-spacing: 0;
  box-shadow: none !important;
}
.button.large { min-height: 52px; padding: .86rem 1.35rem; }
.button.mini { min-height: 36px; padding: .48rem .72rem; font-size: .88rem; }
.button.danger { border-color: rgba(138,47,40,.36); color: #8a2f28; }
.button.danger:hover { background: #8a2f28; border-color: #8a2f28; color: #fff; }
.danger-link { color: #8a2f28; font-weight: 650; }
.danger-link:hover { color: #64211d; }

/* Forms: broader fields, fewer cramped mini-grids */
.form-grid { gap: 1.35rem; }
.compact-grid, .invoice-flow .compact-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(320px, 1fr));
  gap: 1.45rem 1.75rem;
}
.filter-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.25rem 1.45rem;
}
.form-field, form p { gap: .55rem; }
.form-field label, form p label {
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .105em;
  color: rgba(40,40,34,.58);
  font-weight: 760;
}
input, select, textarea {
  min-height: 48px;
  padding: .9rem 1.05rem;
  font-size: 1rem;
  background: rgba(255,253,248,.86);
}
select[multiple] { min-height: 148px; padding: .75rem 1rem; }
textarea { min-height: 9rem; line-height: 1.55; }
.checkbox-field { align-items: flex-start; padding: .75rem 0; }
.checkbox-field input { margin-top: .18rem; min-height: auto; }
.radio-group ul { gap: .7rem; }
.radio-group li {
  padding: .78rem .9rem;
  border: 1px solid var(--line-soft);
  background: rgba(255,253,248,.58);
}
.file-field { grid-column: 1 / -1; }
.file-preview-label { min-height: 260px; padding: 2.2rem; }
.file-preview-label strong { font-size: 2.25rem; letter-spacing: -.015em; }
.sticky-actions { padding: 1.05rem 0; }

/* Document detail: larger paper surface, quieter side stack */
.split {
  grid-template-columns: minmax(0, 1.28fr) minmax(420px, .72fr);
  gap: clamp(1.5rem, 3vw, 2.6rem);
}
.side-stack { display: grid; gap: 1.35rem; }
.preview-pane { padding: clamp(1.3rem, 2.4vw, 2.2rem); }
.preview-pane h2 { margin-bottom: 1.2rem; }
.preview-pane iframe { height: min(78vh, 860px); background: #fff; }
.locked-preview { padding: 3rem 2rem; border: 1px solid var(--line); background: rgba(255,253,248,.62); }
.definition-list { display: grid; gap: .8rem; margin: 0; }
.definition-list div {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 1rem;
  padding: .7rem 0;
  border-bottom: 1px solid var(--line-soft);
}
.definition-list dt { color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }
.definition-list dd { margin: 0; }
.small-lead { font-size: .98rem; line-height: 1.6; color: var(--muted); }
.mt { margin-top: 1.1rem; }
.ocr-text { max-height: 320px; overflow: auto; padding: 1rem; background: #fffdf8; border: 1px solid var(--line-soft); white-space: pre-wrap; }

/* Dashboard: editorial information modules instead of bubble KPI feeling */
.metric-row { gap: 1.15rem; margin: 1.5rem 0 2.4rem; }
.metric-row div, .metric-card {
  min-height: 172px;
  padding: 1.35rem;
  background: rgba(255,253,248,.70);
}
.metric-row span, .metric-card span:not(.metric-icon) {
  font-size: 3.4rem;
  letter-spacing: -.025em;
  line-height: 1;
}
.metric-row small, .metric-card small { letter-spacing: .12em; }

/* Document list as editorial archive cards while preserving table markup */
.table-card .data-table {
  display: block;
  background: transparent;
}
.table-card .data-table thead { display: none; }
.table-card .data-table tbody {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
  gap: 1rem;
}
.table-card .data-table tr {
  display: grid;
  gap: .35rem;
  padding: 1.35rem;
  border: 1px solid var(--line);
  background: rgba(255,253,248,.66);
  min-height: 220px;
}
.table-card .data-table td {
  display: block;
  border: 0;
  padding: .15rem 0;
}
.table-card .data-table td:not(.title-cell) { color: var(--muted); font-size: .94rem; }
.table-card .data-table .title-cell {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 1rem;
  align-items: start;
  padding-bottom: .7rem;
  border-bottom: 1px solid var(--line-soft);
  margin-bottom: .45rem;
}
.title-cell strong { font-family: Georgia, "Times New Roman", Times, serif; font-size: 1.35rem; font-weight: 500; letter-spacing: 0; color: var(--ink); }
.file-avatar {
  display: grid;
  place-items: center;
  width: 48px;
  height: 62px;
  border: 1px solid var(--line);
  background: #fffdf8;
  color: var(--bronze);
  font-size: .7rem;
  font-weight: 860;
  letter-spacing: .09em;
}

/* But keep report and finance tables as airy tables */
.report-summary + .table-card .data-table,
body .report-table .data-table,
.card:not(.table-card) .data-table {
  display: table;
}
.report-summary + .table-card .data-table thead { display: table-header-group; }
.report-summary + .table-card .data-table tbody { display: table-row-group; }
.report-summary + .table-card .data-table tr { display: table-row; min-height: 0; padding: 0; border: 0; background: transparent; }
.report-summary + .table-card .data-table td { display: table-cell; border-bottom: 1px solid var(--line-soft); padding: 1.05rem; }
.report-summary + .table-card .data-table th { padding: 1.05rem; }

/* Tables generally: airy, less ERP */
th, td { padding: 1.05rem 1rem; }
th { background: transparent; border-bottom: 1px solid var(--line); color: #706c62; }
tr:hover td { background: rgba(255,253,248,.55); }
.table-wrap { background: rgba(255,253,248,.52); }

/* Badges quieter */
.badge, .status-pill {
  min-height: 1.75rem;
  padding: .25rem .58rem;
  font-size: .74rem;
  font-weight: 760;
  letter-spacing: .02em;
}
.badge.tiny { font-size: .66rem; min-height: 1.35rem; padding: .14rem .42rem; }

/* Empty states with editorial tone */
.empty-state {
  padding: 3rem 2rem;
  background:
    linear-gradient(90deg, rgba(255,253,248,.86), rgba(255,253,248,.58)),
    url('/static/img/document-stilllife.svg') right bottom/180px auto no-repeat;
  text-align: left;
}
.empty-state.small-empty { padding: 1.4rem; background-size: 110px auto; }

/* Smaller screens */
@media (max-width: 1160px) {
  .compact-grid, .invoice-flow .compact-grid { grid-template-columns: 1fr; }
  .split { grid-template-columns: 1fr; }
  .preview-pane iframe { height: 720px; }
}
@media (max-width: 840px) {
  .container { padding: 1.6rem 1.2rem 3rem; }
  h1 { font-size: clamp(2.7rem, 12vw, 4.4rem); max-width: 12ch; }
  .hero-panel, .page-hero { padding: 1.8rem; }
  .table-card .data-table tbody { grid-template-columns: 1fr; }
}

/* v1.2 Stapel-Upload */
.editorial-import-card input[type="file"] { width: 100%; min-height: 96px; padding: 28px; border: 1px dashed rgba(31,31,28,.26); background: rgba(255,255,255,.38); }
.bulk-file-input { cursor: pointer; }
.compact-lead { font-size: 1rem; max-width: 58ch; }

/* ------------------------------------------------------------------
   Familientresor v1.3 — echte lokale Editorial-Bildwelt
   Lokale JPG-Hintergründe, keine externen Bildquellen, offline nutzbar.
------------------------------------------------------------------- */
:root {
  --image-archive-desk: url('/static/img/editorial/archive-desk.jpg');
  --image-architecture: url('/static/img/editorial/architecture-facade.jpg');
  --image-paper-stack: url('/static/img/editorial/paper-stack.jpg');
  --image-calendar: url('/static/img/editorial/calendar-light.jpg');
  --image-identity: url('/static/img/editorial/identity-documents.jpg');
  --image-shelves: url('/static/img/editorial/archive-shelves.jpg');
}

body {
  background:
    linear-gradient(rgba(244,240,232,.92), rgba(244,240,232,.92)),
    var(--image-paper-stack),
    linear-gradient(135deg, #f4f0e8 0%, #f9f4ea 60%, #e7dfd2 100%);
  background-size: cover, cover, cover;
  background-position: center, center, center;
  background-attachment: fixed;
}
body::before { opacity: .14; }

.sidebar {
  background:
    linear-gradient(rgba(255,252,246,.90), rgba(244,240,232,.82)),
    var(--image-architecture);
  background-size: cover;
  background-position: 43% center;
}
.sidebar::after {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(255,253,248,.38), rgba(32,32,28,.06));
}
.sidebar > * { position: relative; z-index: 1; }

.hero-panel, .page-hero {
  min-height: 440px;
  background:
    linear-gradient(90deg, rgba(255,252,246,.96) 0%, rgba(255,252,246,.88) 43%, rgba(255,252,246,.18) 100%),
    var(--image-archive-desk);
  background-size: cover;
  background-position: center right;
}
.hero-panel::before, .page-hero::before {
  border-color: rgba(255,253,248,.30);
  mix-blend-mode: normal;
}
.hero-panel::after, .page-hero::after {
  border-color: rgba(255,253,248,.48);
}

.hero-card::before, .hero-stat-card::before {
  height: 138px;
  background: var(--image-shelves) center/cover no-repeat;
  opacity: .78;
  filter: saturate(.86) contrast(.92);
}
.hero-card, .hero-stat-card, .process-card, .hero-quick-actions {
  background:
    linear-gradient(rgba(32,32,28,.88), rgba(32,32,28,.91)),
    var(--image-shelves) center/cover;
}

.file-preview-label {
  min-height: 315px;
  background:
    linear-gradient(90deg, rgba(255,253,248,.94), rgba(255,253,248,.74) 55%, rgba(255,253,248,.12)),
    var(--image-paper-stack) right center/cover no-repeat;
}
.file-preview-label strong { max-width: 15ch; }

.metric-card:nth-child(1)::before { background-image: var(--image-paper-stack); opacity: .24; background-size: cover; }
.metric-card:nth-child(2)::before { background-image: var(--image-archive-desk); opacity: .22; background-size: cover; }
.metric-card:nth-child(3)::before { background-image: var(--image-shelves); opacity: .22; background-size: cover; }
.metric-card:nth-child(4)::before { background-image: var(--image-calendar); opacity: .25; background-size: cover; }
.metric-card::before {
  inset: auto 0 0 auto;
  width: 58%;
  height: 72%;
  background-position: right bottom;
  filter: grayscale(.15) saturate(.85);
  mask-image: linear-gradient(135deg, transparent 0%, black 34%);
}

.visual-story-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
  gap: clamp(1rem, 2.4vw, 1.8rem);
  margin: 0 0 clamp(1.5rem, 3vw, 2.4rem);
}
.editorial-image-panel {
  min-height: 300px;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--image-archive-desk) center/cover no-repeat;
}
.editorial-image-panel.architecture { background-image: var(--image-architecture); }
.editorial-image-panel.identity { background-image: var(--image-identity); }
.editorial-image-panel.calendar { background-image: var(--image-calendar); }
.editorial-image-panel.shelves { background-image: var(--image-shelves); }
.editorial-image-panel.paper { background-image: var(--image-paper-stack); }
.editorial-image-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(28,28,24,.72), rgba(28,28,24,.34) 42%, rgba(28,28,24,.08));
}
.editorial-image-caption {
  position: absolute;
  z-index: 1;
  left: clamp(1.4rem, 3vw, 2.3rem);
  bottom: clamp(1.3rem, 3vw, 2rem);
  max-width: 420px;
  color: #fffdf8;
}
.editorial-image-caption .eyebrow { color: #d9c7a6; }
.editorial-image-caption h2 { color: #fffdf8; max-width: 14ch; margin-bottom: .6rem; }
.editorial-image-caption p { color: rgba(255,253,248,.78); line-height: 1.6; }

.story-card {
  min-height: 300px;
  display: grid;
  align-content: end;
  background:
    linear-gradient(rgba(255,253,248,.86), rgba(255,253,248,.78)),
    var(--image-identity) center/cover no-repeat;
}
.story-card.contracts { background-image: linear-gradient(rgba(255,253,248,.87), rgba(255,253,248,.80)), var(--image-paper-stack); }
.story-card.deadlines { background-image: linear-gradient(rgba(255,253,248,.87), rgba(255,253,248,.80)), var(--image-calendar); }

.document-tile,
.mini-card,
.table-card .data-table tr {
  background:
    linear-gradient(rgba(255,253,248,.82), rgba(255,253,248,.78)),
    var(--image-paper-stack) right bottom/240px auto no-repeat;
}
.table-card .data-table tr:nth-child(3n+2) {
  background:
    linear-gradient(rgba(255,253,248,.83), rgba(255,253,248,.79)),
    var(--image-shelves) right bottom/240px auto no-repeat;
}
.table-card .data-table tr:nth-child(3n+3) {
  background:
    linear-gradient(rgba(255,253,248,.84), rgba(255,253,248,.80)),
    var(--image-identity) right bottom/240px auto no-repeat;
}

.preview-pane {
  background:
    linear-gradient(rgba(255,253,248,.88), rgba(255,253,248,.84)),
    var(--image-archive-desk) center/cover no-repeat;
}
.preview-pane iframe, .preview-pane img {
  box-shadow: 0 32px 90px rgba(28,28,24,.16);
}

.empty-state {
  background:
    linear-gradient(90deg, rgba(255,253,248,.90), rgba(255,253,248,.64)),
    var(--image-paper-stack) right center/cover no-repeat;
}
.shortcut-panel {
  background:
    linear-gradient(rgba(255,253,248,.84), rgba(255,253,248,.78)),
    var(--image-architecture) center/cover no-repeat;
}

@media (max-width: 960px) {
  .visual-story-grid { grid-template-columns: 1fr; }
  .editorial-image-panel { min-height: 260px; }
  .hero-panel, .page-hero { min-height: auto; background-position: center; }
}

/* v1.4 Inbox Workbench */
.editorial-split {
  align-items: flex-end;
  gap: 3rem;
}
.inbox-metrics {
  margin-bottom: 2rem;
}
.inbox-filter-card {
  margin-bottom: 2rem;
}
.quick-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-bottom: 1.6rem;
}
.quick-filter {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: .35rem .75rem;
  border: 1px solid rgba(31,31,28,.12);
  color: var(--text-secondary, #5d5a54);
  text-decoration: none;
  background: rgba(255,255,255,.34);
  font-size: .82rem;
  letter-spacing: .01em;
}
.quick-filter:hover,
.quick-filter.active {
  color: var(--text-primary, #1f1f1c);
  background: rgba(49,66,56,.08);
  border-color: rgba(49,66,56,.22);
}
.refined-filter p {
  margin: 0;
}
.batch-toolbar {
  margin-bottom: 2.4rem;
  border-left: 3px solid rgba(49,66,56,.34);
}
.batch-toolbar h2 {
  margin-top: 0;
}
.batch-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 1.2rem 1.4rem;
  margin-top: 1.4rem;
}
.batch-grid label {
  display: block;
  margin-bottom: .4rem;
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(31,31,28,.55);
}
.batch-grid input,
.batch-grid select {
  width: 100%;
}
.batch-grid select[multiple] {
  min-height: 128px;
}
.batch-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .9rem;
  margin-top: 1.6rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(31,31,28,.08);
}
.inline-check {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 40px;
  padding-right: .5rem;
  color: var(--text-secondary, #5d5a54);
  font-size: .9rem;
}
.inline-check input {
  width: 16px;
  height: 16px;
}
.danger-check {
  color: #8a3b2d;
}
.inbox-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
}
.inbox-card {
  position: relative;
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 1rem;
  padding: 1.35rem 1.45rem;
  border: 1px solid rgba(31,31,28,.09);
  background: linear-gradient(135deg, rgba(250,248,244,.92), rgba(245,242,236,.72));
  min-height: 210px;
  transition: border-color 160ms ease, transform 160ms ease, background 160ms ease;
}
.inbox-card:hover {
  transform: translateY(-1px);
  border-color: rgba(49,66,56,.25);
  background: linear-gradient(135deg, rgba(250,248,244,.98), rgba(240,236,229,.82));
}
.inbox-card.has-warning {
  border-left: 3px solid rgba(138,59,45,.55);
}
.inbox-card-select {
  padding-top: .2rem;
}
.inbox-card-select input {
  width: 18px;
  height: 18px;
}
.inbox-card-main {
  display: block;
  cursor: pointer;
}
.inbox-card h2 {
  margin: .25rem 0 .55rem;
  max-width: 32ch;
  font-size: clamp(1.35rem, 1.2rem + .5vw, 2rem);
  line-height: 1.12;
}
.quality-line {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: 1rem 0;
}
.quality-line span {
  display: inline-flex;
  border-bottom: 1px solid rgba(31,31,28,.18);
  color: rgba(31,31,28,.62);
  font-size: .84rem;
}
.inbox-card-actions {
  grid-column: 2;
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-self: end;
}
@media (max-width: 1100px) {
  .batch-grid { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
  .inbox-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .batch-grid { grid-template-columns: 1fr; }
  .batch-actions { align-items: stretch; flex-direction: column; }
  .batch-actions .button { width: 100%; }
  .inbox-card { grid-template-columns: 28px 1fr; padding: 1.1rem; }
}

/* v1.5 OCR review refinements */
.ocr-assistant-card {
  border-left: 3px solid rgba(49, 66, 56, .42);
}
.ocr-confidence-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem;
  padding: .85rem 0;
  border-top: 1px solid rgba(31,31,28,.08);
  border-bottom: 1px solid rgba(31,31,28,.08);
}
.ocr-confidence-strip div {
  display: grid;
  gap: .15rem;
}
.ocr-confidence-strip span {
  font-family: var(--font-serif, Georgia, serif);
  font-size: 1.35rem;
  color: var(--text-primary, #1f1f1c);
}
.ocr-confidence-strip small {
  color: rgba(31,31,28,.52);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .68rem;
}
.ocr-best-list {
  margin-top: 1rem;
}
.ocr-candidates summary {
  cursor: pointer;
  color: var(--text-primary, #1f1f1c);
  font-weight: 600;
}
.ocr-candidates h3 {
  margin: 1.2rem 0 .6rem;
  font-size: 1.1rem;
}
.candidate-list {
  display: grid;
  gap: .65rem;
}
.candidate-item {
  display: grid;
  gap: .2rem;
  padding: .8rem .9rem;
  border: 1px solid rgba(31,31,28,.08);
  background: rgba(250,248,244,.58);
}
.candidate-item strong {
  font-size: 1rem;
}
.candidate-item span,
.candidate-item small {
  color: rgba(31,31,28,.62);
  font-size: .82rem;
  line-height: 1.4;
}
@media (max-width: 720px) {
  .ocr-confidence-strip { grid-template-columns: 1fr; }
}

/* v1.6 Schnellerfassung: manuelle Bearbeitung statt OCR-Abhängigkeit */
.rapid-hero h1 { max-width: 11ch; }
.rapid-capture-shell {
  display: grid;
  grid-template-columns: minmax(420px, 1.1fr) minmax(440px, .9fr);
  gap: clamp(1.2rem, 2.4vw, 2.4rem);
  align-items: start;
}
.rapid-preview,
.rapid-form {
  min-height: calc(100vh - 230px);
}
.rapid-preview iframe {
  width: 100%;
  height: min(74vh, 920px);
  border: 1px solid rgba(31,31,28,.10);
  background: #fff;
}
.rapid-preview img {
  width: 100%;
  max-height: min(74vh, 920px);
  object-fit: contain;
  background: #fff;
  border: 1px solid rgba(31,31,28,.10);
}
.rapid-form {
  position: sticky;
  top: 1.4rem;
  max-height: calc(100vh - 2.8rem);
  overflow: auto;
}
.rapid-form-inner {
  display: grid;
  gap: 1.35rem;
}
.rapid-section {
  padding-top: 1rem;
  border-top: 1px solid rgba(31,31,28,.08);
}
.rapid-section:first-child { border-top: 0; padding-top: 0; }
.rapid-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.1rem;
}
.rapid-grid.primary-fields .form-field:first-child {
  grid-column: span 1;
}
.rapid-grid .form-field:has(textarea),
.rapid-grid .form-field:has(.multi-select) {
  grid-column: 1 / -1;
}
.rapid-suggestions {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(31,31,28,.08);
  background: rgba(250,248,244,.76);
}
.rapid-suggestions dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem 1rem;
  margin: .7rem 0 0;
}
.rapid-suggestions dt {
  color: rgba(31,31,28,.54);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.rapid-suggestions dd {
  margin: .18rem 0 0;
  font-weight: 600;
}
.rapid-details {
  border-top: 1px solid rgba(31,31,28,.08);
  padding-top: 1rem;
}
.rapid-details summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--text-primary, #1f1f1c);
}
.rapid-command-bar {
  position: sticky;
  bottom: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  padding: 1rem 0 0;
  background: linear-gradient(to top, rgba(250,248,244,1), rgba(250,248,244,.92), rgba(250,248,244,0));
  border-top: 1px solid rgba(31,31,28,.08);
}
.keyboard-hint {
  color: rgba(31,31,28,.55);
  font-size: .82rem;
  margin: 0;
}
kbd {
  border: 1px solid rgba(31,31,28,.16);
  padding: .08rem .32rem;
  background: rgba(255,255,255,.55);
  font-size: .75rem;
}
.compact-multi { min-height: 112px; }
@media (max-width: 1180px) {
  .rapid-capture-shell { grid-template-columns: 1fr; }
  .rapid-form { position: static; max-height: none; }
  .rapid-preview iframe, .rapid-preview img { height: 62vh; }
}
@media (max-width: 720px) {
  .rapid-grid { grid-template-columns: 1fr; }
  .rapid-command-bar { flex-direction: column; align-items: stretch; }
  .rapid-command-bar .button { width: 100%; }
}

/* v1.7 Professional Reports */
.report-hero {
  background-image: linear-gradient(90deg, rgba(245,242,236,.96), rgba(245,242,236,.82)), url('/static/img/document-stilllife.svg');
  background-size: cover;
  background-position: center right;
}
.editorial-strip.report-template-strip {
  display: grid;
  grid-template-columns: minmax(240px, 0.7fr) minmax(420px, 1.4fr);
  gap: 42px;
  align-items: start;
  padding: 38px 0 16px;
  border-top: 1px solid rgba(0,0,0,.08);
  border-bottom: 1px solid rgba(0,0,0,.08);
  margin: 32px 0;
}
.strip-copy h2 { max-width: 12ch; margin-top: 6px; }
.template-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.template-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 150px;
  padding: 22px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(250,248,244,.72);
  text-decoration: none;
  color: var(--text-primary, #1f1f1c);
}
.template-card:hover { background: rgba(255,255,255,.7); transform: translateY(-1px); }
.template-card span { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: rgba(0,0,0,.45); }
.template-card strong { font-size: 18px; line-height: 1.15; font-weight: 500; }
.template-card small { color: rgba(0,0,0,.55); line-height: 1.35; }
.refined-filter-grid { grid-template-columns: repeat(4, minmax(180px, 1fr)); align-items: end; }
.export-metric-row { grid-template-columns: repeat(6, minmax(120px, 1fr)); }
.export-warning-panel {
  margin-top: 24px;
  padding: 20px 24px;
  border-left: 3px solid #8b6a4c;
  background: rgba(139, 106, 76, .08);
}
.export-warning-panel p { margin: 8px 0 0; color: rgba(0,0,0,.62); }
.export-actions { gap: 12px; flex-wrap: wrap; }
.report-table-card { overflow-x: auto; }
.report-table-card .data-table th { white-space: nowrap; }
@media (max-width: 1100px) {
  .editorial-strip.report-template-strip { grid-template-columns: 1fr; }
  .template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .refined-filter-grid { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
  .export-metric-row { grid-template-columns: repeat(2, minmax(120px, 1fr)); }
}
@media (max-width: 680px) {
  .template-grid, .refined-filter-grid { grid-template-columns: 1fr; }
}

/* v1.8 Verträge & Fristen */
.archive-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
}
.archive-card {
  padding: 30px 32px;
  border: 1px solid rgba(0,0,0,.09);
  background: rgba(250,248,244,.76);
  min-height: 270px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.archive-card h2 { margin: 0; font-size: 30px; line-height: 1.05; max-width: 14ch; }
.archive-card h2 a { color: inherit; text-decoration: none; }
.archive-card h2 a:hover { text-decoration: underline; text-underline-offset: 5px; }
.archive-card-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.archive-card .definition-list.compact { margin: 0; display: grid; gap: 8px; }
.archive-card .definition-list.compact div { padding: 8px 0; border-bottom: 1px solid rgba(0,0,0,.06); }
.attention-card { border-left: 3px solid var(--accent-bronze, #8b6a4c); background: rgba(250,248,244,.92); }
.contract-hero-card {
  background-image: linear-gradient(120deg, rgba(250,248,244,.95), rgba(250,248,244,.78)), url('/static/img/editorial/paper-stack.jpg');
  background-size: cover;
  background-position: center;
}
.soft-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 20px 0 28px;
}
.soft-metrics > div { background: rgba(255,255,255,.42); border: 1px solid rgba(0,0,0,.07); padding: 18px; }
.archive-list { display: grid; gap: 12px; }
.overdue-item .timeline-dot { background: #8b4e42; }
.warning-badge, .status-pill.warning { color: #7b4a23; background: rgba(139,106,76,.14); border-color: rgba(139,106,76,.28); }
@media (max-width: 900px) {
  .soft-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .archive-grid { grid-template-columns: 1fr; }
  .archive-card { padding: 24px; }
  .soft-metrics { grid-template-columns: 1fr; }
}

/* v1.8.2 UI hotfix — button typography and control proportions */
.button,
button.button,
.pill-row a,
.shortcut-grid a,
.hero-card a,
.side-nav a.nav-highlight,
.file-preview-label em,
.link-button {
  font-size: .88rem;
  line-height: 1.18;
  letter-spacing: .005em;
}
.button,
button.button {
  min-height: 2.85rem;
  padding: .66rem 1.05rem;
  text-align: center;
  white-space: normal;
  gap: .45rem;
}
.button.large {
  min-height: 3.15rem;
  padding: .78rem 1.2rem;
  font-size: .92rem;
}
.actions.small .button,
.table-actions .button,
form .button {
  min-height: 2.55rem;
  padding: .56rem .85rem;
  font-size: .84rem;
}
input,
select,
textarea {
  min-height: 2.9rem;
  line-height: 1.3;
}
select {
  padding-top: .68rem;
  padding-bottom: .68rem;
}
.badge,
.status-pill {
  line-height: 1.15;
  min-height: 1.85rem;
  padding: .28rem .58rem;
}
@media (max-width: 760px) {
  .button,
  button.button {
    width: 100%;
    min-height: 3rem;
  }
  .actions,
  .form-actions,
  .hero-actions {
    align-items: stretch;
  }
}

/* v3 consistency guard */
.card,
.mini-card,
.metric-card,
.button,
button.button,
input,
select,
textarea,
.badge,
.status-pill,
.message,
.empty-state,
.file-preview-label,
.preview-pane iframe,
.preview-pane img,
.shortcut-grid a,
.pill-row a,
.dashboard-deadline-stats a,
.family-card,
.family-hero-card,
.family-area-card,
.property-dashboard-card,
.property-dashboard-card .property-card-footer-links > div,
.property-payment-manage-row,
.statement-mini-row,
.transaction-main-link,
.property-profit-strip > div,
.property-inline-section,
.property-compact-list a {
  border-radius: 8px !important;
}

.person-avatar,
.person-detail-photo,
.property-profile-icon {
  border-radius: 8px !important;
}

.family-card,
.family-hero-card,
.family-area-card,
.property-dashboard-card,
.statement-mini-row,
.transaction-main-link,
.property-inline-section {
  background: var(--v3-surface) !important;
  border-color: var(--v3-line) !important;
}

.family-card::before,
.family-hero-card::before,
.family-area-card::before,
.property-dashboard-card::before {
  display: none !important;
}

.top-actions {
  max-width: 720px;
}

@media (max-width: 1180px) {
  .top-actions {
    max-width: 520px;
  }
}

@media (max-width: 1180px) {
  .grid.two,
  .grid.three,
  .visual-story-grid,
  .dashboard-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .grid.two > *,
  .grid.three > *,
  .visual-story-grid > *,
  .dashboard-grid > * {
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}

/* v1.9.1 — Stammdaten editorial redesign */
.taxonomy-hero {
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
.taxonomy-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}
.taxonomy-panel {
  position: relative;
  padding: clamp(2rem, 3.5vw, 3.2rem);
  background:
    linear-gradient(135deg, rgba(255,253,248,.90), rgba(246,240,230,.76)),
    url('/static/img/paper-texture.svg');
  border: 1px solid rgba(32,32,28,.12);
  box-shadow: 0 18px 60px rgba(28,28,24,.045);
  min-width: 0;
  overflow: hidden;
}
.taxonomy-panel::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 34%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(139,106,76,.08));
  pointer-events: none;
}
.taxonomy-panel-large { min-height: 560px; }
.taxonomy-panel-wide { grid-column: 1 / -1; }
.taxonomy-panel-head {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.5rem;
  align-items: start;
  padding-bottom: 1.45rem;
  margin-bottom: 1.25rem;
  border-bottom: 1px solid rgba(32,32,28,.10);
}
.taxonomy-panel-head h2 {
  margin: 0 0 .55rem;
  font-size: clamp(2.2rem, 3.2vw, 4rem);
  line-height: 1.02;
  letter-spacing: -.012em;
  max-width: 15ch;
}
.taxonomy-panel-head p:not(.eyebrow) {
  max-width: 46ch;
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}
.taxonomy-panel-head.compact h2 { max-width: 11ch; }
.soft-button,
.button.soft-button {
  min-height: 2.45rem;
  padding: .54rem .9rem;
  border: 1px solid rgba(32,32,28,.13);
  background: rgba(32,32,28,.045);
  color: var(--ink);
  font-size: .82rem;
  font-weight: 650;
  white-space: nowrap;
}
.soft-button:hover,
.button.soft-button:hover {
  background: var(--charcoal);
  border-color: var(--charcoal);
  color: #fff;
}
.taxonomy-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0;
}
.taxonomy-list-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2.25rem;
}
.taxonomy-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: 1.05rem 0;
  border-bottom: 1px solid rgba(32,32,28,.075);
}
.taxonomy-main {
  min-width: 0;
  display: grid;
  gap: .25rem;
}
.taxonomy-main strong {
  display: block;
  color: var(--ink);
  font-size: 1.03rem;
  font-weight: 620;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.taxonomy-main small {
  display: block;
  color: rgba(40,40,34,.52);
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 760;
  line-height: 1.25;
}
.taxonomy-actions {
  display: flex;
  gap: .8rem;
  align-items: center;
  justify-content: flex-end;
  opacity: .55;
  transition: opacity .14s ease;
  white-space: nowrap;
}
.taxonomy-row:hover .taxonomy-actions { opacity: 1; }
.taxonomy-actions a {
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .10em;
  font-weight: 780;
  color: var(--forest);
}
.taxonomy-actions .danger-link { color: var(--danger); }
.taxonomy-actions a:hover { color: var(--bronze); }
@media (max-width: 1120px) {
  .taxonomy-layout,
  .taxonomy-list-two { grid-template-columns: 1fr; }
  .taxonomy-panel-wide { grid-column: auto; }
  .taxonomy-panel-large { min-height: 0; }
}
@media (max-width: 640px) {
  .taxonomy-panel { padding: 1.45rem; }
  .taxonomy-panel-head,
  .taxonomy-row { grid-template-columns: 1fr; }
  .taxonomy-actions { justify-content: flex-start; opacity: 1; }
}

/* ------------------------------------------------------------------
   Familientresor v2.0 — Editorial Document Experience
   Fokus: Dokumentdetail, Reportflächen, hochwertigere Archivwirkung.
------------------------------------------------------------------- */
.record-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: end;
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
  padding: clamp(2.5rem, 5vw, 5rem) 0 clamp(1.5rem, 3vw, 2.5rem);
  border-bottom: 1px solid var(--line);
  position: relative;
}
.record-hero::before {
  content: "";
  position: absolute;
  right: 0;
  top: 1.2rem;
  width: min(44vw, 680px);
  height: 72%;
  background: linear-gradient(90deg, rgba(244,240,232,0), rgba(255,255,255,.28)), var(--image-paper-stack);
  background-size: cover;
  background-position: center;
  opacity: .18;
  filter: saturate(.8);
  pointer-events: none;
}
.record-hero-copy { position: relative; z-index: 1; }
.record-hero h1 {
  max-width: 17ch;
  letter-spacing: -.012em;
  line-height: 1.02;
  margin-bottom: 1.15rem;
}
.record-actions {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: flex-end;
  align-items: center;
  max-width: 420px;
}
.quiet-status-line {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem 1.1rem;
  margin-top: 1.25rem;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 740;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.quiet-status-line span { position: relative; }
.quiet-status-line span + span::before {
  content: "";
  position: absolute;
  left: -.62rem;
  top: 50%;
  width: 3px;
  height: 3px;
  background: var(--bronze);
  transform: translateY(-50%);
}
.editorial-notice {
  display: flex;
  gap: .85rem;
  align-items: baseline;
  margin-bottom: 1.6rem;
  padding: 1rem 1.2rem;
  background: rgba(255,252,246,.78);
  border: 1px solid var(--line);
  border-left: 3px solid var(--bronze);
  color: var(--muted);
}
.editorial-notice strong { color: var(--ink); }
.locked-notice { border-left-color: var(--danger); }

.document-experience-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(380px, .65fr);
  gap: clamp(1.6rem, 3vw, 3rem);
  align-items: start;
}
.document-paper-stage {
  min-width: 0;
  padding: clamp(1.2rem, 2.2vw, 2rem);
  border: 1px solid var(--line);
  background:
    linear-gradient(rgba(255,252,246,.62), rgba(255,252,246,.62)),
    var(--image-archive-desk);
  background-size: cover;
  background-position: center;
  box-shadow: var(--shadow);
}
.paper-stage-header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 1rem;
  margin-bottom: 1.3rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(32,32,28,.16);
}
.paper-stage-header h2 { margin: 0; }
.paper-object {
  display: grid;
  place-items: center;
  min-height: min(78vh, 900px);
  padding: clamp(1.2rem, 3vw, 3rem);
  background: rgba(244,240,232,.72);
  border: 1px solid rgba(32,32,28,.12);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.32);
}
.paper-object iframe {
  width: 100%;
  height: min(80vh, 920px);
  border: 1px solid rgba(32,32,28,.22);
  background: #fff;
  box-shadow: 0 22px 60px rgba(24,24,20,.18);
}
.paper-object img {
  max-width: 100%;
  max-height: min(80vh, 920px);
  object-fit: contain;
  border: 1px solid rgba(32,32,28,.18);
  background: #fff;
  box-shadow: 0 22px 60px rgba(24,24,20,.16);
}
.empty-paper, .editorial-lock {
  max-width: 420px;
  padding: 2rem;
  text-align: left;
  background: rgba(255,252,246,.86);
  border: 1px solid var(--line);
}
.record-panel-stack { display: grid; gap: clamp(1.2rem, 2.4vw, 2rem); }
.record-panel {
  padding: clamp(1.45rem, 2.6vw, 2.35rem);
  background: rgba(255,252,246,.82);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(14px);
}
.record-panel .section-title { margin-bottom: 1.25rem; }
.metadata-panel { background: rgba(255,253,248,.9); }
.ocr-panel { background: linear-gradient(180deg, rgba(255,252,246,.90), rgba(239,233,222,.75)); }
.editorial-form-grid {
  display: grid;
  gap: 1.45rem;
}
.editorial-form-grid .field label {
  font-size: .69rem;
  letter-spacing: .14em;
  color: rgba(40,40,34,.54);
}
.editorial-form-grid input,
.editorial-form-grid select,
.editorial-form-grid textarea {
  background: rgba(255,255,255,.46);
}
.archive-list.compact-archive-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 0;
}
.archive-list.compact-archive-list li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 0;
  border-bottom: 1px solid var(--line-soft);
}
.archive-list.compact-archive-list li:last-child { border-bottom: 0; }

/* Report experience refinement */
.report-hero { background-image: linear-gradient(90deg, rgba(255,252,246,.96), rgba(255,252,246,.82), rgba(255,252,246,.22)), var(--image-shelves); }
.report-template-strip {
  border: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(255,252,246,.88), rgba(239,233,222,.62));
  padding: clamp(1.6rem, 3.4vw, 3rem);
  margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}
.template-grid { gap: 1rem; }
.template-card {
  min-height: 150px;
  padding: 1.2rem;
  border: 1px solid rgba(32,32,28,.12);
  background: rgba(255,253,248,.58);
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}
.template-card:hover {
  transform: translateY(-2px);
  background: rgba(255,253,248,.86);
  border-color: rgba(49,66,56,.28);
}
.template-card span {
  font-family: var(--serif);
  font-size: 2.1rem;
  color: rgba(139,106,76,.36);
}
.template-card strong { font-size: 1.05rem; line-height: 1.25; }
.report-summary {
  background: linear-gradient(135deg, rgba(255,253,248,.92), rgba(236,228,215,.68));
}
.export-metric-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 0;
  border: 1px solid var(--line);
  background: rgba(255,253,248,.46);
}
.export-metric-row div {
  border: 0;
  border-right: 1px solid var(--line-soft);
  box-shadow: none;
  background: transparent;
}
.export-metric-row div:last-child { border-right: 0; }
.export-warning-panel {
  margin-top: 1.35rem;
  padding: 1.15rem 1.25rem;
  border: 1px solid rgba(139,106,76,.28);
  border-left: 3px solid var(--bronze);
  background: rgba(246,231,200,.48);
}
.export-warning-panel p { margin-bottom: 0; color: var(--muted); }
.report-table-card {
  padding: 0;
  overflow: hidden;
}
.report-table-card .data-table th {
  background: rgba(32,32,28,.055);
  color: rgba(40,40,34,.62);
  font-weight: 820;
}
.report-table-card .data-table td {
  padding: 1.15rem 1.05rem;
  line-height: 1.45;
}
.report-table-card .data-table tr:hover td { background: rgba(255,253,248,.72); }
.row-warning td { background: rgba(246,231,200,.26); }

/* Archive overview upgrades */
.table-card .data-table tr {
  background: rgba(255,253,248,.64);
  border: 1px solid rgba(32,32,28,.10);
}
.table-card .data-table .title-cell strong {
  font-family: var(--serif);
  font-size: 1.28rem;
  line-height: 1.15;
  letter-spacing: -.006em;
}
.file-avatar {
  border-radius: 0;
  background: rgba(32,32,28,.90);
  color: #fff;
  border: 0;
}
.status-pill,
.badge {
  border-radius: 0 !important;
  letter-spacing: .08em;
}

@media (max-width: 1180px) {
  .record-hero { grid-template-columns: 1fr; align-items: start; }
  .record-actions { justify-content: flex-start; max-width: none; }
  .document-experience-grid { grid-template-columns: 1fr; }
  .paper-object iframe { height: 720px; }
}
@media (max-width: 720px) {
  .paper-object { min-height: 520px; padding: .85rem; }
  .paper-object iframe { height: 560px; }
  .record-panel { padding: 1.2rem; }
  .export-metric-row { grid-template-columns: 1fr 1fr; }
}

/* v2.1 Import-Automation */
.import-automation-hero {
  background:
    linear-gradient(90deg, rgba(255,250,240,.96) 0%, rgba(255,250,240,.9) 50%, rgba(255,250,240,.28) 100%),
    url('/static/img/editorial/archive-desk.jpg'),
    linear-gradient(135deg, rgba(24,56,46,.12), rgba(157,111,54,.12));
  background-size: cover;
  background-position: center;
}
.import-metric-strip { margin-bottom: 1.35rem; }
.import-filter-card { margin: 1.2rem 0; }
.import-grid { display: grid; gap: 1rem; }
.import-card { grid-template-columns: 42px minmax(0, 1fr) auto; }
.import-card-icon {
  display: grid;
  place-items: center;
  color: var(--bronze);
  font-size: 1.3rem;
  font-weight: 900;
}
.import-review-grid { align-items: start; }
.import-file-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: .8rem 0 1rem;
}
.import-file-meta span {
  padding: .35rem .55rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.65);
  color: var(--muted);
  font-size: .82rem;
  font-weight: 750;
}
.import-preview-frame {
  width: 100%;
  min-height: 680px;
  border: 1px solid var(--line);
  background: #fff;
}
.import-image-preview-wrap {
  max-height: 760px;
  overflow: auto;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.72);
}
.import-image-preview { width: 100%; height: auto; display: block; }
.import-secondary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line-soft);
}
.ocr-text-box {
  max-height: 420px;
  overflow: auto;
  white-space: pre-wrap;
  padding: 1rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.7);
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .88rem;
  line-height: 1.55;
}
.warning-text { color: var(--danger); }
.warning-card {
  border-color: rgba(138,47,40,.32);
  background: rgba(246,231,200,.55);
}
.button.danger { color: var(--danger); border-color: rgba(138,47,40,.35); }
@media (max-width: 980px) {
  .import-card { grid-template-columns: 32px minmax(0, 1fr); }
  .import-card .inbox-card-actions { grid-column: 2; justify-content: flex-start; }
  .import-preview-frame { min-height: 460px; }
}

/* v2.1.1 Import-Qualität & Stapelverarbeitung */
.import-quality-strip {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.import-batch-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}
.batch-toolbar-main {
  display: grid;
  gap: .2rem;
}
.batch-select-all {
  display: flex;
  align-items: center;
  gap: .65rem;
  font-weight: 850;
  cursor: pointer;
}
.batch-select-all input,
.import-card-checkbox input {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: var(--ink);
}
.batch-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .7rem;
}
.batch-action-select {
  min-width: 270px;
  padding: .75rem .9rem;
  border: 1px solid var(--line);
  border-radius: 0;
  background: rgba(255,253,248,.8);
  color: var(--text);
  font-weight: 760;
}
.import-card-checkbox {
  display: grid;
  grid-template-rows: auto auto;
  justify-items: center;
  align-content: start;
  gap: .45rem;
  cursor: pointer;
}
.import-card-checkbox span {
  color: var(--bronze);
  font-size: 1.3rem;
  font-weight: 900;
}
.import-card-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: start;
  justify-content: space-between;
  gap: .7rem;
}
.import-card-title-row h2 {
  margin-bottom: .25rem;
}
.import-quality-badge {
  flex: 0 0 auto;
}
.import-quality-hint {
  margin: .5rem 0 .7rem;
  color: var(--muted);
  font-size: .92rem;
  line-height: 1.45;
}
.import-quality-line {
  margin-top: .6rem;
}
.quality-green {
  border-left: 4px solid rgba(39, 112, 82, .72);
}
.quality-yellow {
  border-left: 4px solid rgba(164, 116, 43, .72);
}
.quality-red {
  border-left: 4px solid rgba(138, 47, 40, .72);
}
.quality-imported {
  border-left: 4px solid rgba(31, 31, 28, .55);
}
.badge.danger-badge,
.danger-badge {
  color: var(--danger);
  border-color: rgba(138,47,40,.35);
  background: rgba(138,47,40,.08);
}
.import-quality-detail {
  margin-bottom: 1rem;
}
.import-quality-detail.quality-green {
  background: linear-gradient(90deg, rgba(226,241,232,.7), rgba(255,253,248,.82));
}
.import-quality-detail.quality-yellow {
  background: linear-gradient(90deg, rgba(246,231,200,.68), rgba(255,253,248,.82));
}
.import-quality-detail.quality-red {
  background: linear-gradient(90deg, rgba(248,220,214,.62), rgba(255,253,248,.82));
}
.import-duplicate-card {
  margin-bottom: 1rem;
}
.import-duplicate-card .form-actions {
  align-items: center;
}
@media (max-width: 980px) {
  .import-quality-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .import-batch-toolbar {
    display: grid;
  }
  .batch-toolbar-actions {
    justify-content: flex-start;
  }
  .batch-action-select {
    width: 100%;
    min-width: 0;
  }
}

/* v2.1.1 Import-Qualität & Stapelverarbeitung */
.compact-section-title { margin-bottom: .8rem; }
.import-search-form {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: .75rem;
  align-items: center;
  margin-bottom: 1rem;
}
.import-search-form input[type="search"] {
  width: 100%;
  padding: .85rem .95rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.72);
  color: var(--text);
  font: inherit;
}
.import-quick-filter-row { margin-top: .35rem; }
.import-batch-form { display: grid; gap: 1rem; }
.import-command-bar {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  padding: 1rem 1.1rem;
  position: sticky;
  top: 0;
  z-index: 7;
  background: rgba(255,250,240,.94);
  backdrop-filter: blur(16px);
}
.import-command-actions,
.import-select-all {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .65rem;
}
.import-select-all {
  color: var(--muted);
  font-size: .9rem;
  font-weight: 760;
}
.import-card-select {
  display: grid;
  justify-items: center;
  gap: .55rem;
  align-content: start;
}
.import-card-select input,
.import-select-all input {
  width: 18px;
  height: 18px;
  accent-color: var(--forest);
}
.import-card-green { border-left: 4px solid var(--ok); }
.import-card-yellow { border-left: 4px solid var(--bronze); }
.import-card-red { border-left: 4px solid var(--danger); }
.import-card-duplicate { border-left: 4px solid var(--warning-text); }
.import-card-imported { border-left: 4px solid rgba(40,83,63,.45); }
.import-quality-line {
  align-items: center;
  margin: .55rem 0 .65rem;
}
.quality-badge {
  border: 1px solid var(--line) !important;
  font-weight: 900;
}
.quality-green {
  background: rgba(40,83,63,.13) !important;
  color: var(--ok) !important;
  border-color: rgba(40,83,63,.28) !important;
}
.quality-yellow {
  background: rgba(246,231,200,.72) !important;
  color: var(--warning-text) !important;
  border-color: rgba(157,111,54,.30) !important;
}
.quality-red {
  background: rgba(138,47,40,.10) !important;
  color: var(--danger) !important;
  border-color: rgba(138,47,40,.28) !important;
}
.quality-duplicate {
  background: rgba(246,231,200,.95) !important;
  color: var(--warning-text) !important;
  border-color: rgba(111,77,25,.34) !important;
}
.quality-imported {
  background: rgba(40,83,63,.10) !important;
  color: rgba(40,83,63,.78) !important;
  border-color: rgba(40,83,63,.22) !important;
}
.import-quality-notes {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  padding: 0;
  margin: .65rem 0 0;
}
.import-quality-notes li {
  padding: .32rem .48rem;
  border: 1px solid var(--line-soft);
  background: rgba(255,253,248,.56);
  color: var(--muted);
  font-size: .76rem;
  font-weight: 760;
}
.large-notes { margin-top: 1rem; }
.large-notes li { font-size: .86rem; }
.import-quality-panel {
  margin-bottom: 1.2rem;
  background: linear-gradient(135deg, rgba(255,253,248,.92), rgba(239,233,222,.58));
}
.import-quality-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border: 1px solid var(--line);
  background: rgba(255,253,248,.46);
}
.import-quality-detail-grid div {
  display: grid;
  gap: .25rem;
  padding: .9rem 1rem;
  border-right: 1px solid var(--line-soft);
}
.import-quality-detail-grid div:last-child { border-right: 0; }
.import-quality-detail-grid strong {
  color: var(--muted);
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .13em;
}
.import-quality-detail-grid span {
  color: var(--text);
  font-weight: 760;
}
.duplicate-warning-card form { margin-top: 1rem; }
.quality-green-panel { border-left: 4px solid var(--ok); }
.quality-yellow-panel { border-left: 4px solid var(--bronze); }
.quality-red-panel { border-left: 4px solid var(--danger); }
.quality-duplicate-panel { border-left: 4px solid var(--warning-text); }
.quality-imported-panel { border-left: 4px solid rgba(40,83,63,.45); }

@media (max-width: 980px) {
  .import-command-bar { position: static; display: grid; }
  .import-search-form { grid-template-columns: 1fr; }
  .import-command-actions { align-items: stretch; }
  .import-command-actions .button { width: 100%; justify-content: center; }
  .import-quality-detail-grid { grid-template-columns: 1fr; }
  .import-quality-detail-grid div { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .import-quality-detail-grid div:last-child { border-bottom: 0; }
}

/* v2.2 Intelligente Dokumentensuche */
.search-hero-header { align-items: flex-end; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: flex-end; }
.intelligent-search-panel { margin-bottom: 1.35rem; }
.intelligent-search-form { display: grid; gap: 1rem; }
.search-primary-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .8rem; align-items: end; }
.search-main-input { display: grid; gap: .35rem; }
.search-main-input span,
.advanced-search-grid label span { color: var(--bronze); font-size: .68rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.quick-filter-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .65rem; }
.quick-filter-card { display: grid; gap: .2rem; min-height: 82px; padding: .82rem .85rem; border: 1px solid var(--line); background: rgba(255,250,240,.54); color: var(--text); }
.quick-filter-card:hover,
.quick-filter-card.active { color: var(--forest); background: rgba(246,231,200,.62); border-color: rgba(157,111,54,.38); }
.quick-filter-card strong { font-family: var(--serif); font-size: 1.04rem; line-height: 1; }
.quick-filter-card span { color: var(--muted); font-size: .76rem; line-height: 1.35; }
.advanced-search { border-top: 1px solid var(--line-soft); padding-top: .85rem; }
.advanced-search summary { cursor: pointer; display: flex; align-items: center; gap: .6rem; color: var(--text); font-weight: 850; }
.advanced-search-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .85rem; margin-top: 1rem; }
.advanced-search-grid label { display: grid; gap: .35rem; }
.advanced-search-actions { display: flex; gap: .7rem; margin-top: 1rem; }
.search-summary-card { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1.35rem; }
.search-summary-card h2 { margin-bottom: .25rem; }
.search-summary-stats { display: flex; flex-wrap: wrap; gap: .55rem; justify-content: flex-end; }
.search-summary-stats span { padding: .48rem .62rem; border: 1px solid var(--line-soft); background: rgba(255,250,240,.62); color: var(--muted); font-weight: 760; }
.search-summary-stats strong { color: var(--text); }
.search-results-section { margin: 1.55rem 0; }
.search-result-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.search-result-grid.compact-results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.search-result-card { display: grid; gap: .7rem; padding: 1.05rem; border: 1px solid var(--line); background: rgba(255,250,240,.76); box-shadow: var(--shadow-soft); }
.search-result-card h3 { margin: 0; }
.search-result-card h3 a { color: var(--text); }
.result-card-topline,
.result-meta,
.result-taxonomy,
.match-labels,
.result-actions { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
.result-kind { color: var(--bronze); font-size: .68rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.result-meta span,
.result-taxonomy span,
.match-labels span { padding: .28rem .45rem; border: 1px solid var(--line-soft); background: rgba(255,253,248,.62); color: var(--muted); font-size: .76rem; font-weight: 760; }
.result-taxonomy span { color: var(--text); }
.match-labels span { color: var(--forest); background: rgba(40,83,63,.08); border-color: rgba(40,83,63,.18); }
.ocr-snippet { padding: .75rem .85rem; border-left: 3px solid var(--bronze); background: rgba(246,231,200,.38); color: rgba(32,35,30,.82); font-size: .9rem; line-height: 1.55; }
.muted-snippet { color: var(--muted); }
.result-actions { border-top: 1px solid var(--line-soft); padding-top: .65rem; }
.result-actions a { font-weight: 850; }
.search-side-results { margin-top: 1.35rem; }
.rich-result-list li { display: grid; gap: .22rem; }
.search-cockpit-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.35rem; }
.cockpit-stat-card { display: grid; gap: .35rem; }
.cockpit-stat-card strong { font-family: var(--serif); font-size: 3rem; font-weight: 500; line-height: .9; }
.cockpit-stat-card span { color: var(--muted); font-weight: 760; }
.search-cockpit-lists { margin-bottom: 1.35rem; }
.search-help-card { margin-top: 1.35rem; }
.search-example-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .65rem; }
.search-example-grid a { padding: .7rem .8rem; border: 1px solid var(--line); background: rgba(255,250,240,.68); color: var(--text); font-weight: 820; }
.search-example-grid a:hover { background: rgba(246,231,200,.62); color: var(--forest); }

@media (max-width: 1180px) {
  .quick-filter-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .advanced-search-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-result-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-cockpit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-example-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .search-primary-row { grid-template-columns: 1fr; }
  .quick-filter-strip,
  .advanced-search-grid,
  .search-result-grid,
  .search-result-grid.compact-results,
  .search-cockpit-grid,
  .search-example-grid { grid-template-columns: 1fr; }
  .search-summary-card { display: grid; }
  .search-summary-stats { justify-content: flex-start; }
}

/* v2.2.1 Suche UX-Refinement: kompakter, weniger Doppelung, Ergebnisse schneller sichtbar */
.side-nav a.active {
  margin: .18rem 0 .35rem;
  padding: .74rem .78rem;
  grid-template-columns: 24px 1fr;
  color: #fff;
  background: var(--charcoal);
  border: 1px solid var(--charcoal);
}
.side-nav a.active span { color: var(--sand); }
.side-nav a.active:hover { color: #fff; padding-left: .92rem; background: var(--forest); }
.side-nav a.nav-action:not(.active) {
  margin: .18rem 0 .35rem;
  padding: .74rem .78rem;
  grid-template-columns: 24px 1fr;
  border: 1px solid rgba(32,35,30,.10);
  background: rgba(255,250,240,.58);
}
.side-nav a.nav-action:not(.active):hover {
  background: rgba(246,231,200,.55);
  color: var(--forest);
}
.topbar-context {
  flex: 1;
  min-height: 3rem;
  display: flex;
  align-items: center;
  gap: .7rem;
  color: var(--text);
  border-bottom: 1px solid var(--line-soft);
}
.topbar-context > span { color: var(--bronze); font-weight: 900; }
.topbar-context strong { font-family: var(--serif); font-size: 1.22rem; font-weight: 500; letter-spacing: -.01em; }
.topbar-context small { color: var(--muted); font-weight: 620; }

.search-command-center {
  padding: clamp(1.2rem, 2.2vw, 1.85rem);
  margin-top: -.35rem;
  margin-bottom: 1.1rem;
  background:
    linear-gradient(100deg, rgba(255,252,246,.94), rgba(255,252,246,.86)),
    url('/static/img/paper-texture.svg');
}
.search-command-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
  gap: clamp(1rem, 2vw, 1.5rem);
  align-items: end;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--line-soft);
  margin-bottom: 1rem;
}
.search-command-copy h1 {
  font-size: clamp(2.35rem, 4.2vw, 4.5rem);
  line-height: .96;
  margin: 0 0 .35rem;
  max-width: none;
  letter-spacing: -.025em;
}
.search-command-copy .lead {
  margin: 0;
  max-width: 76ch;
  font-size: .98rem;
  line-height: 1.55;
}
.search-compact-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
}
.search-compact-stats div {
  min-height: 72px;
  display: grid;
  align-content: center;
  gap: .18rem;
  padding: .65rem .7rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.58);
}
.search-compact-stats strong {
  font-family: var(--serif);
  font-size: clamp(1.45rem, 2.2vw, 2.2rem);
  line-height: .95;
  font-weight: 600;
  letter-spacing: -.025em;
}
.search-compact-stats span {
  color: var(--muted);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.intelligent-search-form { gap: .85rem; }
.search-primary-row {
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: .65rem;
  align-items: end;
}
.search-main-input { gap: .28rem; }
.search-main-input input {
  min-height: 3.1rem;
  font-size: 1.02rem;
  background: rgba(255,252,246,.88);
  border-width: 0 0 2px 0;
  border-color: var(--charcoal);
}
.quick-filter-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .48rem;
}
.quick-filter-card {
  display: inline-flex;
  align-items: center;
  min-height: 0;
  width: auto;
  padding: .46rem .62rem;
  gap: .42rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.52);
}
.quick-filter-card strong {
  font-family: var(--sans);
  font-size: .84rem;
  line-height: 1.1;
  font-weight: 850;
  letter-spacing: 0;
}
.quick-filter-card span {
  display: none;
}
.quick-filter-card::after {
  content: "→";
  color: var(--bronze);
  font-weight: 800;
  opacity: .75;
}
.quick-filter-card.active::after { content: "✓"; color: var(--forest); }
.advanced-search {
  padding-top: .62rem;
  border-top: 1px solid var(--line-soft);
}
.advanced-search summary {
  width: fit-content;
  padding: .42rem .58rem;
  border: 1px solid var(--line-soft);
  background: rgba(255,250,240,.55);
  color: var(--muted);
  font-size: .84rem;
}
.advanced-search[open] summary {
  color: var(--text);
  background: rgba(246,231,200,.34);
}
.advanced-search-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .7rem;
  margin-top: .85rem;
}
.advanced-search-grid label span { font-size: .62rem; letter-spacing: .14em; }
.advanced-search-grid input,
.advanced-search-grid select { min-height: 2.75rem; font-size: .92rem; }
.advanced-search-actions { margin-top: .8rem; }
.compact-search-summary {
  padding: 1rem 1.15rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 1rem;
}
.compact-search-summary h2 {
  margin-bottom: .15rem;
  font-size: clamp(1.55rem, 2.4vw, 2.25rem);
}
.compact-search-summary .lead { margin: 0; font-size: .95rem; line-height: 1.45; }
.search-results-section { margin: 1.2rem 0; }
.search-results-section .section-title {
  margin-bottom: .8rem;
  padding-bottom: .65rem;
  align-items: center;
}
.search-results-section .section-title h2 { font-size: clamp(1.55rem, 2.4vw, 2.35rem); }
.search-result-grid,
.search-result-grid.compact-results {
  grid-template-columns: 1fr;
  gap: .75rem;
}
.search-result-card {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .45rem 1rem;
  padding: .95rem 1.05rem;
  box-shadow: none;
  background: rgba(255,250,240,.72);
}
.search-result-card h3 {
  grid-column: 1 / -1;
  margin-bottom: .05rem;
  font-size: 1.22rem;
}
.result-card-topline { grid-column: 1 / -1; }
.result-meta,
.result-taxonomy,
.match-labels { gap: .35rem; }
.result-meta span,
.result-taxonomy span,
.match-labels span {
  padding: .22rem .38rem;
  font-size: .72rem;
}
.ocr-snippet {
  grid-column: 1 / -1;
  padding: .6rem .7rem;
  font-size: .86rem;
  line-height: 1.45;
}
.result-actions {
  grid-column: 1 / -1;
  padding-top: .48rem;
}
.search-cockpit-lists { margin-bottom: 1rem; }
.search-help-card { margin-top: 1rem; }
.search-example-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .5rem; }
.search-example-grid a { padding: .58rem .65rem; font-size: .88rem; }

@media (max-width: 1280px) {
  .advanced-search-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .search-command-header { grid-template-columns: 1fr; }
  .search-compact-stats { max-width: 760px; }
}
@media (max-width: 980px) {
  .topbar-context small { display: none; }
  .top-actions { overflow-x: auto; }
  .advanced-search-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .compact-search-summary { grid-template-columns: 1fr; }
  .search-summary-stats { justify-content: flex-start; }
}
@media (max-width: 760px) {
  .search-command-center { margin-top: 0; }
  .search-command-copy h1 { font-size: clamp(2rem, 11vw, 3.2rem); }
  .search-compact-stats,
  .search-primary-row,
  .advanced-search-grid,
  .search-example-grid { grid-template-columns: 1fr; }
  .quick-filter-strip { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-filter-card { justify-content: space-between; }
  .topbar { align-items: flex-start; }
  .topbar-context { min-height: 2.5rem; }
}

/* v2.3 — Fristen, Wiedervorlagen & Dokumenten-Cockpit */
.deadline-command-center {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.2rem;
  align-items: start;
  padding: clamp(1.3rem, 2.2vw, 2rem);
  margin-bottom: 1rem;
  background:
    linear-gradient(100deg, rgba(255,252,246,.94), rgba(255,252,246,.82)),
    url('/static/img/editorial/calendar-light.jpg') right center/auto 120% no-repeat;
}
.deadline-command-copy h1 {
  margin: 0 0 .35rem;
  font-size: clamp(2.2rem, 4vw, 4.7rem);
  line-height: .96;
  letter-spacing: -.035em;
}
.deadline-command-copy .lead { max-width: 68ch; margin-bottom: 0; }
.deadline-command-actions { display: flex; flex-wrap: wrap; gap: .55rem; justify-content: flex-end; }
.deadline-stat-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .6rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line-soft);
}
.deadline-stat {
  min-height: 82px;
  display: grid;
  align-content: center;
  gap: .22rem;
  padding: .75rem .82rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.62);
  color: var(--text);
}
.deadline-stat:hover { color: var(--text); background: rgba(255,250,240,.9); }
.deadline-stat strong {
  font-family: var(--serif);
  font-size: clamp(1.5rem, 2.2vw, 2.4rem);
  line-height: .9;
  font-weight: 600;
  letter-spacing: -.04em;
}
.deadline-stat span {
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--muted);
}
.deadline-stat.danger { border-color: rgba(138,47,40,.28); background: rgba(138,47,40,.045); }
.deadline-stat.warning { border-color: rgba(157,111,54,.34); background: rgba(246,231,200,.35); }
.deadline-filter-panel { padding: 1rem 1.1rem; margin-bottom: 1rem; }
.deadline-filter-grid {
  display: grid;
  grid-template-columns: minmax(240px, 1.35fr) repeat(3, minmax(150px, .75fr)) auto;
  gap: .7rem;
  align-items: end;
}
.deadline-filter-grid label { display: grid; gap: .28rem; }
.deadline-filter-grid label span {
  color: var(--muted);
  font-size: .64rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.deadline-filter-grid input,
.deadline-filter-grid select { min-height: 2.75rem; }
.deadline-filter-actions { display: flex; gap: .45rem; }
.reminder-suggestion-panel { margin-bottom: 1rem; }
.reminder-suggestion-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.reminder-suggestion-grid h3 {
  margin-top: 0;
  font-family: var(--serif);
  font-size: 1.35rem;
  font-weight: 500;
}
.muted-copy { color: var(--muted); }
.deadline-bulkbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: .9rem 1rem;
  margin-bottom: 1rem;
}
.deadline-bulkbar strong { font-family: var(--serif); font-size: 1.35rem; font-weight: 500; }
.deadline-bulk-actions { display: flex; flex-wrap: wrap; gap: .45rem; justify-content: flex-end; }
.deadline-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
  align-items: start;
}
.deadline-lane {
  display: grid;
  gap: .75rem;
  min-width: 0;
}
.deadline-lane-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 3.1rem;
  padding: .65rem .75rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.74);
}
.deadline-lane-title h2 { margin: 0; font-size: 1.15rem; font-family: var(--serif); font-weight: 500; }
.deadline-card {
  position: relative;
  display: grid;
  gap: .55rem;
  padding: .85rem;
  border: 1px solid var(--line);
  background: rgba(255,252,246,.78);
  box-shadow: none;
}
.deadline-card-overdue,
.deadline-card-today { border-color: rgba(138,47,40,.28); background: rgba(255,247,241,.9); }
.deadline-card-soon,
.deadline-card-month { border-color: rgba(157,111,54,.28); background: rgba(255,249,235,.9); }
.deadline-select {
  display: flex;
  align-items: center;
  gap: .36rem;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 750;
}
.deadline-card-head { display: flex; flex-wrap: wrap; gap: .35rem; }
.deadline-card h3 { margin: 0; font-size: 1.08rem; line-height: 1.2; }
.deadline-card h3 a { color: var(--text); }
.deadline-card-meta {
  display: grid;
  gap: .2rem;
  color: var(--muted);
  font-size: .83rem;
}
.deadline-relation,
.deadline-hint { margin: 0; font-size: .88rem; line-height: 1.4; }
.deadline-hint { color: var(--muted); }
.deadline-notes summary { cursor: pointer; color: var(--forest); font-weight: 800; font-size: .82rem; }
.deadline-notes p { margin-bottom: 0; font-size: .86rem; color: var(--muted); }
.deadline-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem .7rem;
  padding-top: .45rem;
  border-top: 1px solid var(--line-soft);
}
.deadline-secondary-grid { margin-top: 1.1rem; }
.hidden-form { display: none; }
.compact-reminder-list li { padding: .7rem 0; }
.deadline-form-grid { align-items: start; }
.deadline-help-card { position: sticky; top: 5.2rem; }
.deadline-help-list { display: grid; gap: .8rem; }
.deadline-help-list li {
  display: grid;
  grid-template-columns: minmax(100px, .42fr) minmax(0, 1fr);
  gap: .75rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid var(--line-soft);
}
.deadline-help-list li:last-child { border-bottom: 0; }
.dashboard-deadline-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
  margin-bottom: 1rem;
}
.dashboard-deadline-stats a {
  padding: .65rem .7rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.55);
  color: var(--text);
}
.dashboard-deadline-stats strong {
  display: block;
  font-family: var(--serif);
  font-size: 1.8rem;
  line-height: .95;
  font-weight: 600;
}
.dashboard-deadline-stats span {
  display: block;
  margin-top: .25rem;
  color: var(--muted);
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.timeline-overdue .timeline-dot,
.timeline-today .timeline-dot { background: var(--danger); box-shadow: 0 0 0 6px rgba(138,47,40,.12); }
.import-reminder-suggestions { padding-top: 1rem; border-top: 1px solid var(--line-soft); }

@media (max-width: 1320px) {
  .deadline-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .deadline-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .deadline-filter-actions { grid-column: 1 / -1; }
  .reminder-suggestion-grid { grid-template-columns: 1fr; }
}
@media (max-width: 920px) {
  .deadline-command-center { grid-template-columns: 1fr; background-size: cover; }
  .deadline-command-actions { justify-content: flex-start; }
  .deadline-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .deadline-board { grid-template-columns: 1fr; }
  .deadline-bulkbar { display: grid; }
  .deadline-bulk-actions { justify-content: flex-start; }
  .dashboard-deadline-stats { grid-template-columns: 1fr; }
  .deadline-help-card { position: static; }
}
@media (max-width: 640px) {
  .deadline-stat-grid,
  .deadline-filter-grid,
  .deadline-help-list li { grid-template-columns: 1fr; }
}

/* v2.4 — Steuer-Cockpit */
.tax-command-center {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(170px, auto);
  gap: 1rem;
  align-items: start;
  padding: clamp(1.35rem, 2.4vw, 2rem);
  margin-bottom: 1rem;
  background:
    linear-gradient(103deg, rgba(255,252,246,.96), rgba(255,252,246,.80)),
    url('/static/img/editorial/paper-stack.jpg') right center/auto 125% no-repeat;
}
.tax-command-copy h1 {
  margin: 0 0 .35rem;
  font-size: clamp(2.2rem, 4vw, 4.8rem);
  line-height: .96;
  letter-spacing: -.035em;
}
.tax-command-copy .lead { max-width: 70ch; margin-bottom: 0; }
.tax-readiness-card {
  min-width: 170px;
  padding: 1rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.72);
  text-align: right;
}
.tax-score {
  display: block;
  font-family: var(--serif);
  font-size: clamp(2.2rem, 3.3vw, 4rem);
  line-height: .9;
  letter-spacing: -.05em;
  color: var(--text);
}
.tax-readiness-card strong,
.tax-readiness-card small { display: block; }
.tax-readiness-card strong {
  margin-top: .35rem;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.tax-readiness-card small { color: var(--muted); margin-top: .25rem; }
.tax-year-switcher {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: .55rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line-soft);
}
.tax-year-switcher label {
  display: grid;
  gap: .25rem;
  color: var(--muted);
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.tax-year-switcher select { min-width: 150px; min-height: 2.65rem; }
.tax-kpi-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .75rem;
  margin-bottom: 1rem;
}
.tax-kpi-card {
  display: grid;
  gap: .28rem;
  min-height: 108px;
  padding: .85rem .9rem;
  border: 1px solid var(--line);
  background: rgba(255,252,246,.74);
  color: var(--text);
}
.tax-kpi-card:hover { color: var(--text); background: rgba(255,250,240,.95); }
.tax-kpi-card span,
.tax-kpi-card small {
  color: var(--muted);
  font-size: .65rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.tax-kpi-card strong {
  font-family: var(--serif);
  font-size: clamp(1.55rem, 2.2vw, 2.55rem);
  line-height: .95;
  font-weight: 600;
  letter-spacing: -.04em;
}
.tax-kpi-card small {
  align-self: end;
  font-size: .62rem;
  line-height: 1.3;
  letter-spacing: .08em;
}
.tax-kpi-card.is-warning { border-color: rgba(157,111,54,.32); background: rgba(255,248,232,.88); }
.tax-action-grid { margin-bottom: 1rem; }
.tax-checklist { display: grid; gap: .6rem; }
.tax-check-item {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: center;
  padding: .8rem .85rem;
  border: 1px solid var(--line-soft);
  background: rgba(255,252,246,.62);
  color: var(--text);
}
.tax-check-item:hover { color: var(--text); background: rgba(255,250,240,.94); }
.tax-check-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--forest);
  box-shadow: 0 0 0 5px rgba(49,66,56,.10);
}
.tax-check-review .tax-check-dot { background: var(--warning-text); box-shadow: 0 0 0 5px rgba(157,111,54,.13); }
.tax-check-empty .tax-check-dot { background: var(--muted); box-shadow: 0 0 0 5px rgba(106,100,89,.10); }
.tax-check-item strong { display: block; font-size: .98rem; }
.tax-check-item small { color: var(--muted); }
.tax-check-item em {
  min-width: 2.3rem;
  text-align: right;
  font-family: var(--serif);
  font-size: 1.8rem;
  line-height: 1;
  font-style: normal;
}
.tax-export-actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.tax-bucket-section { margin-bottom: 1rem; }
.tax-bucket-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
}
.tax-bucket-card {
  display: grid;
  gap: .65rem;
  padding: .9rem;
  border: 1px solid var(--line);
  background: rgba(255,252,246,.74);
  min-height: 270px;
}
.tax-bucket-ready { border-color: rgba(49,66,56,.18); }
.tax-bucket-review { border-color: rgba(157,111,54,.35); background: rgba(255,248,232,.82); }
.tax-bucket-empty { opacity: .82; }
.tax-bucket-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tax-bucket-icon {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid var(--line);
  background: rgba(255,250,240,.72);
  font-weight: 900;
}
.tax-bucket-number {
  color: var(--muted);
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.tax-bucket-card h3 {
  margin: .15rem 0 0;
  font-family: var(--serif);
  font-size: 1.45rem;
  line-height: 1.05;
  font-weight: 500;
}
.tax-bucket-card p {
  margin: 0;
  color: var(--muted);
  font-size: .88rem;
  line-height: 1.45;
}
.tax-bucket-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .45rem;
}
.tax-bucket-metrics div {
  padding: .55rem;
  border: 1px solid var(--line-soft);
  background: rgba(255,250,240,.55);
}
.tax-bucket-metrics strong {
  display: block;
  font-family: var(--serif);
  font-size: 1.25rem;
  line-height: 1;
  font-weight: 600;
}
.tax-bucket-metrics small {
  display: block;
  margin-top: .2rem;
  color: var(--muted);
  font-size: .58rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.tax-bucket-status { display: flex; flex-wrap: wrap; gap: .35rem; align-content: start; }
.tax-quality-ready { background: rgba(49,66,56,.12); color: var(--forest); }
.tax-quality-review { background: rgba(157,111,54,.14); color: var(--warning-text); }
.tax-quality-empty { background: rgba(106,100,89,.10); color: var(--muted); }
.tax-bucket-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  padding-top: .55rem;
  border-top: 1px solid var(--line-soft);
  margin-top: auto;
}
.tax-bucket-actions a { font-weight: 850; }
.tax-secondary-grid { margin-bottom: 1rem; }
.tax-document-list { display: grid; gap: .65rem; }
.tax-document-list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .7rem;
  padding: .75rem 0;
  border-bottom: 1px solid var(--line-soft);
}
.tax-document-list li:last-child { border-bottom: 0; }
.tax-document-list strong { display: block; }
.tax-document-list small { color: var(--muted); }
.button.small { padding: .45rem .65rem; min-height: auto; font-size: .78rem; }

@media (max-width: 1380px) {
  .tax-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tax-bucket-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1080px) {
  .tax-bucket-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .tax-command-center { grid-template-columns: 1fr; background-size: cover; }
  .tax-readiness-card { text-align: left; }
  .tax-kpi-grid,
  .tax-bucket-grid { grid-template-columns: 1fr; }
  .tax-document-list li { grid-template-columns: auto minmax(0, 1fr); }
  .tax-document-list .button { grid-column: 2; justify-self: start; }
}

/* v2.5: Steuer-Export, Urlaubsplanung und Familienfotos */
.family-hero {
  position: relative;
  overflow: hidden;
}
.family-hero::after {
  content: "";
  position: absolute;
  inset: auto 28px 24px auto;
  width: 180px;
  height: 180px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(213, 171, 94, .24), rgba(213, 171, 94, 0));
  pointer-events: none;
}
.family-trip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
}
.family-trip-card {
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 18px;
  background: rgba(255,255,255,.78);
  box-shadow: var(--shadow-soft);
}
.family-trip-card h3 {
  margin: 12px 0 6px;
}
.family-trip-card p,
.family-trip-card small {
  color: var(--muted);
}
.family-trip-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.family-trip-icon {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--paper-strong);
  color: var(--forest);
  font-size: 22px;
}
.family-trip-days {
  display: block;
  margin: 10px 0 14px;
  color: var(--ink);
}
.family-trip-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.family-trip-metrics span {
  border-radius: 14px;
  background: var(--paper-soft);
  padding: 9px;
  min-width: 0;
}
.family-trip-metrics strong,
.family-trip-metrics small {
  display: block;
}
.family-trip-metrics strong {
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.family-filter-form {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(170px, 1fr)) auto;
  gap: 14px;
  align-items: end;
}
.family-filter-actions {
  align-self: end;
  margin: 0;
}
.family-album-chip-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.family-album-chip {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 999px;
  padding: 10px 14px;
  background: rgba(255,255,255,.32);
  text-decoration: none;
  color: inherit;
}
.family-album-chip span {
  font-size: 12px;
  color: var(--muted);
}
.family-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 16px;
}
.family-photo-card {
  border: 1px solid var(--line);
  border-radius: 20px;
  overflow: hidden;
  background: rgba(255,255,255,.82);
  box-shadow: var(--shadow-soft);
}
.family-photo-thumb {
  display: block;
  aspect-ratio: 1 / 1;
  background: var(--paper-soft);
  overflow: hidden;
}
.family-photo-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .22s ease;
}
.family-photo-card:hover .family-photo-thumb img {
  transform: scale(1.04);
}
.family-photo-meta {
  padding: 12px;
}
.family-photo-meta strong,
.family-photo-meta small {
  display: block;
}
.family-photo-meta small {
  margin-top: 4px;
  color: var(--muted);
}
.tax-export-hint-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 16px;
}
.tax-export-hint-grid span {
  border-radius: 14px;
  background: rgba(255,255,255,.35);
  padding: 10px 12px;
  color: var(--muted);
}
.tax-export-hint-grid strong {
  color: var(--ink);
  margin-right: 4px;
}
.family-photo-stat a {
  min-height: 86px;
}
@media (max-width: 1100px) {
  .family-filter-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .tax-export-hint-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .family-trip-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .family-filter-form,
  .family-photo-grid {
    grid-template-columns: 1fr;
  }
}

/* v2.7: Familienstruktur, Notfallordner, Geräte, Haustiere und Checklisten */
.structure-hero,
.emergency-hero,
.device-hero,
.pet-hero,
.checklist-hero,
.event-hero {
  background:
    radial-gradient(circle at top right, rgba(213, 171, 94, .22), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(248,244,235,.86));
}
.family-structure-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 16px;
}
.family-structure-card,
.family-mini-card {
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 18px;
  background: rgba(255,255,255,.82);
  box-shadow: var(--shadow-soft);
}
.family-structure-card.new-focus {
  border-color: rgba(157,111,54,.28);
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(252,246,233,.86));
}
.family-structure-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.family-structure-code,
.family-structure-icon {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--paper-strong);
  color: var(--forest);
  font-weight: 900;
}
.family-structure-icon { font-size: 19px; }
.family-structure-card h3,
.family-mini-card h3 {
  margin: 0 0 6px;
}
.family-structure-card p,
.family-mini-card p {
  color: var(--muted);
}
.folder-name {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  color: var(--forest) !important;
  font-size: .86rem;
}
.family-card-meta,
.family-card-actions,
.family-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.family-card-meta {
  margin: 12px 0;
}
.family-card-meta span {
  border-radius: 999px;
  padding: 6px 10px;
  background: var(--paper-soft);
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
}
.mini-chip-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0;
  margin: 12px 0 14px;
}
.mini-chip-list li {
  border-radius: 999px;
  background: rgba(49,66,56,.08);
  color: var(--forest);
  padding: 5px 9px;
  font-size: .75rem;
  font-weight: 800;
}
.family-document-list {
  display: grid;
  gap: 10px;
}
.family-document-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid var(--line-soft);
}
.family-document-row:last-child { border-bottom: 0; }
.family-document-row h3 { margin: 2px 0 4px; }
.family-document-row p { margin: 0; color: var(--muted); }
.family-card-grid,
.compact-family-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 14px;
}
.emergency-checklist li strong {
  color: var(--ink);
}
@media (max-width: 720px) {
  .family-document-row {
    grid-template-columns: 1fr;
  }
  .family-row-actions {
    justify-content: flex-start;
  }
}

/* ------------------------------------------------------------------
   Familientresor v2.7.1 — UI-Feinschliff, Familienkalender und Reisen
   Breitere Sidebar, gedeckte Bereichsfarben, kompaktere Formulare.
------------------------------------------------------------------- */
:root {
  --sidebar: 318px;
  --accent-sage: #71806a;
  --accent-moss: #586f5c;
  --accent-clay: #9b6a55;
  --accent-ochre: #a9844a;
  --accent-slate: #64747d;
  --accent-blue: #5d7286;
  --accent-mauve: #816978;
  --accent-plum: #6b5b70;
  --accent-stone: #8a8175;
  --accent-redwood: #8d5e4f;
  --tint-sage: rgba(113,128,106,.15);
  --tint-clay: rgba(155,106,85,.15);
  --tint-ochre: rgba(169,132,74,.16);
  --tint-slate: rgba(100,116,125,.15);
  --tint-blue: rgba(93,114,134,.15);
  --tint-mauve: rgba(129,105,120,.14);
}

.app-shell { grid-template-columns: var(--sidebar) minmax(0, 1fr); }
.sidebar { padding-inline: 1.45rem; overflow: hidden; }
.side-nav {
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: .25rem;
  scrollbar-gutter: stable;
}
.side-nav a {
  grid-template-columns: 28px minmax(0, 1fr);
  min-width: 0;
  gap: .78rem;
  padding: .68rem .12rem;
  overflow-wrap: anywhere;
  hyphens: auto;
}
.side-nav a span { width: 28px; height: 28px; }
.side-footer { grid-template-columns: 1fr; gap: .25rem; }
.side-footer a { padding: .35rem 0; }

.top-actions { flex-wrap: wrap; justify-content: flex-end; max-width: min(980px, 58vw); }
.top-actions .button { min-height: 2.25rem; padding: .44rem .7rem; font-size: .78rem; }

/* Dezente Farbdifferenzierung für die vielen Familienbereiche */
.metric-row.colorful-metrics .metric-card:nth-child(1),
.metric-row.visual-metrics .metric-card:nth-child(1),
.metric-row.visual-metrics > div:nth-child(1) { background: linear-gradient(145deg, rgba(255,253,248,.78), var(--tint-sage)); border-color: rgba(113,128,106,.26); }
.metric-row.colorful-metrics .metric-card:nth-child(2),
.metric-row.visual-metrics .metric-card:nth-child(2),
.metric-row.visual-metrics > div:nth-child(2) { background: linear-gradient(145deg, rgba(255,253,248,.78), var(--tint-blue)); border-color: rgba(93,114,134,.26); }
.metric-row.colorful-metrics .metric-card:nth-child(3),
.metric-row.visual-metrics .metric-card:nth-child(3),
.metric-row.visual-metrics > div:nth-child(3) { background: linear-gradient(145deg, rgba(255,253,248,.78), var(--tint-ochre)); border-color: rgba(169,132,74,.28); }
.metric-row.colorful-metrics .metric-card:nth-child(4),
.metric-row.visual-metrics .metric-card:nth-child(4),
.metric-row.visual-metrics > div:nth-child(4) { background: linear-gradient(145deg, rgba(255,253,248,.78), var(--tint-mauve)); border-color: rgba(129,105,120,.25); }

.family-structure-card,
.family-mini-card,
.family-trip-card,
.family-photo-card,
.calendar-list-card,
.birthday-card,
.accent-family-card {
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,253,248,.88), rgba(246,241,231,.72));
}
.family-structure-card { position: relative; overflow: hidden; }
.family-structure-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 5px;
  background: var(--accent-sage);
  opacity: .72;
}
.family-structure-card:nth-child(2n)::before { background: var(--accent-blue); }
.family-structure-card:nth-child(3n)::before { background: var(--accent-clay); }
.family-structure-card:nth-child(4n)::before { background: var(--accent-ochre); }
.family-structure-card:nth-child(5n)::before { background: var(--accent-mauve); }
.family-structure-card:nth-child(6n)::before { background: var(--accent-slate); }
.family-structure-card:nth-child(7n)::before { background: var(--accent-plum); }
.family-structure-card.new-focus { background: linear-gradient(145deg, rgba(255,253,248,.92), rgba(238,232,215,.82)); }
.family-structure-code,
.family-structure-icon,
.family-trip-icon,
.family-fact-icon {
  border-radius: 12px;
  background: rgba(32,35,30,.065);
}
.family-structure-card:nth-child(2n) .family-structure-code,
.family-structure-card:nth-child(2n) .family-structure-icon { color: var(--accent-blue); background: var(--tint-blue); }
.family-structure-card:nth-child(3n) .family-structure-code,
.family-structure-card:nth-child(3n) .family-structure-icon { color: var(--accent-clay); background: var(--tint-clay); }
.family-structure-card:nth-child(4n) .family-structure-code,
.family-structure-card:nth-child(4n) .family-structure-icon { color: var(--accent-ochre); background: var(--tint-ochre); }
.family-structure-card:nth-child(5n) .family-structure-code,
.family-structure-card:nth-child(5n) .family-structure-icon { color: var(--accent-mauve); background: var(--tint-mauve); }

/* Kompaktere, stimmigere Formularflächen in den Familienbereichen */
.family-section-card .compact-grid,
.family-compact-panel .compact-grid,
.family-balanced-form,
#familienablage-upload .compact-grid,
.vacation-hero + .metric-row + .family-trip-overview + .grid .compact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
  gap: 1rem 1.15rem;
  align-items: start;
}
.family-balanced-form { max-width: 920px; }
.family-section-card .form-field,
.family-compact-panel .form-field,
.family-balanced-form .form-field,
#familienablage-upload .form-field { min-width: 0; }
.family-section-card .form-field:has(textarea),
.family-section-card .form-field:has(input[type="file"]),
.family-compact-panel .form-field:has(textarea),
.family-compact-panel .form-field:has(input[type="file"]),
.family-balanced-form .form-field:has(textarea),
.family-balanced-form .form-field:has(input[type="file"]),
#familienablage-upload .form-field:has(textarea),
#familienablage-upload .form-field:has(input[type="file"]) {
  grid-column: 1 / -1;
  max-width: 760px;
}
.family-section-card input,
.family-section-card select,
.family-section-card textarea,
.family-compact-panel input,
.family-compact-panel select,
.family-compact-panel textarea,
.family-balanced-form input,
.family-balanced-form select,
.family-balanced-form textarea,
#familienablage-upload input,
#familienablage-upload select,
#familienablage-upload textarea {
  max-width: 100%;
}
.family-compact-panel textarea,
.family-balanced-form textarea { min-height: 7rem; }

.family-filter-form.calendar-filter-form {
  grid-template-columns: minmax(240px, 1.2fr) minmax(180px, .8fr) minmax(180px, .8fr) auto;
}
.family-filter-form label span,
.calendar-filter-form label span {
  display: block;
  margin-bottom: .45rem;
  color: rgba(40,40,34,.58);
  font-size: .72rem;
  font-weight: 760;
  letter-spacing: .105em;
  text-transform: uppercase;
}

/* Reise-Hero mit eigenem Hintergrundbild */
.vacation-hero-with-image {
  position: relative;
  min-height: 500px;
  overflow: hidden;
  color: #fffdf8;
}
.vacation-hero-image-layer,
.vacation-hero-overlay {
  position: absolute;
  inset: 0;
}
.vacation-hero-image-layer img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.vacation-hero-overlay {
  background: linear-gradient(90deg, rgba(32,32,28,.76) 0%, rgba(32,32,28,.48) 45%, rgba(32,32,28,.18) 100%);
}
.vacation-hero-content {
  position: relative;
  z-index: 2;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: end;
}
.vacation-hero-with-image h1,
.vacation-hero-with-image .lead,
.vacation-hero-with-image .eyebrow { color: #fffdf8; }
.vacation-hero-with-image .lead { text-shadow: 0 1px 2px rgba(0,0,0,.25); }
.vacation-hero-with-image .hero-stat-card {
  background: rgba(32,32,28,.74);
  border-color: rgba(255,253,248,.32);
  backdrop-filter: blur(8px);
}
.family-current-hero-preview {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
  margin-bottom: 1rem;
  padding: 1rem;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.72);
}
.family-current-hero-preview img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: calc(var(--radius-md) - 2px);
  display: block;
}
@media (max-width: 800px) {
  .vacation-hero-content { grid-template-columns: 1fr; }
  .family-current-hero-preview { grid-template-columns: 1fr; }
}
.family-trip-overview { border-left: 5px solid var(--accent-blue); }
.family-fact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 1rem;
}
.family-fact-grid > div {
  min-height: 130px;
  padding: 1rem;
  border: 1px solid var(--line-soft);
  background: rgba(255,253,248,.56);
  border-radius: 14px;
}
.family-fact-icon {
  display: inline-grid;
  place-items: center;
  width: 36px;
  height: 36px;
  margin-bottom: .7rem;
  color: var(--accent-blue);
}
.family-fact-grid strong { display: block; font-family: var(--serif); font-size: 1.25rem; font-weight: 500; }
.family-fact-grid p { margin: .45rem 0 .2rem; color: var(--ink); font-weight: 720; }
.family-fact-grid small { color: var(--muted); }

/* Familienkalender */
.calendar-hero {
  background:
    linear-gradient(90deg, rgba(255,253,248,.95), rgba(255,253,248,.80)),
    url('/static/img/editorial/calendar-light.jpg') center right/cover no-repeat;
}
.calendar-layout-grid { grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); }
.calendar-master-list { display: grid; gap: .85rem; padding: 0; margin: 0; }
.family-master-timeline-item.timeline-kind-calendar { border-left-color: var(--accent-slate); }
.birthday-list { display: grid; gap: .75rem; }
.birthday-list li {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  gap: .85rem;
  align-items: center;
  padding: .85rem 0;
  border-bottom: 1px solid var(--line-soft);
}
.birthday-list li:last-child { border-bottom: 0; }
.birthday-date {
  display: grid;
  place-items: center;
  min-height: 48px;
  border-radius: 14px;
  background: var(--tint-ochre);
  color: var(--accent-ochre);
  font-weight: 900;
}
.birthday-list strong,
.birthday-list small { display: block; }
.birthday-list small { color: var(--muted); margin-top: .2rem; }

@media (max-width: 1280px) {
  :root { --sidebar: 292px; }
  .top-actions { display: none; }
}
@media (max-width: 1080px) {
  :root { --sidebar: 270px; }
  .family-filter-form.calendar-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .calendar-layout-grid { grid-template-columns: 1fr; }
}
@media (max-width: 840px) {
  :root { --sidebar: 100%; }
  .sidebar { overflow: visible; }
  .side-nav { overflow: visible; }
  .side-footer { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .family-filter-form.calendar-filter-form,
  .family-balanced-form,
  .family-section-card .compact-grid,
  .family-compact-panel .compact-grid,
  #familienablage-upload .compact-grid {
    grid-template-columns: 1fr;
  }
  .birthday-list li { grid-template-columns: 1fr; }
}

/* Timeline-Basis für Reise- und Kalenderansichten */
.family-master-timeline {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: .9rem;
}
.family-master-timeline-item {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: 1rem;
  padding: 1rem;
  border: 1px solid var(--line-soft);
  border-left: 5px solid var(--accent-sage);
  background: rgba(255,253,248,.64);
  border-radius: 14px;
}
.family-timeline-date {
  color: var(--accent-stone);
  font-weight: 900;
  letter-spacing: .04em;
}
.family-timeline-body h3 { margin: .45rem 0 .25rem; max-width: none; }
.family-timeline-body p { margin: .25rem 0; color: var(--muted); }
.family-timeline-body small { color: var(--muted); }
.timeline-kind-document { border-left-color: var(--accent-slate); }
.timeline-kind-photo { border-left-color: var(--accent-mauve); }
.timeline-kind-reminder { border-left-color: var(--accent-ochre); }
.timeline-kind-finance { border-left-color: var(--accent-moss); }
@media (max-width: 640px) {
  .family-master-timeline-item { grid-template-columns: 1fr; }
}

/* v2.7.3 · Familienkalender als Monatskalender */
.family-calendar-card {
  overflow: hidden;
}
.calendar-month-title {
  align-items: center;
  gap: 1rem;
}
.calendar-nav-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .5rem;
}
.family-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: .55rem;
}
.family-calendar-weekday {
  padding: .35rem .25rem;
  color: rgba(40,40,34,.62);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-align: center;
}
.family-calendar-day {
  min-height: 132px;
  border: 1px solid rgba(40,40,34,.09);
  border-radius: 18px;
  padding: .65rem;
  background: rgba(255,255,255,.72);
  box-shadow: 0 10px 24px rgba(20,20,16,.045);
}
.family-calendar-day.is-muted {
  opacity: .55;
  background: rgba(246,244,238,.62);
}
.family-calendar-day.is-today {
  border-color: rgba(112,87,54,.42);
  box-shadow: 0 0 0 3px rgba(112,87,54,.11), 0 12px 26px rgba(20,20,16,.055);
}
.family-calendar-day-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 999px;
  color: rgba(40,40,34,.78);
  font-weight: 850;
  margin-bottom: .45rem;
}
.family-calendar-day.is-today .family-calendar-day-number {
  background: rgba(112,87,54,.15);
  color: rgb(80,58,32);
}
.family-calendar-day-items {
  display: grid;
  gap: .35rem;
}
.calendar-chip {
  display: grid;
  gap: .1rem;
  padding: .42rem .5rem;
  border-radius: 12px;
  text-decoration: none;
  color: rgb(40,40,34);
  background: rgba(237,231,219,.82);
  border: 1px solid rgba(40,40,34,.07);
  line-height: 1.15;
}
.calendar-chip:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 20px rgba(20,20,16,.075);
}
.calendar-chip span {
  font-size: .78rem;
  font-weight: 800;
}
.calendar-chip small {
  font-size: .68rem;
  color: rgba(40,40,34,.66);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.calendar-chip-geburtstag { background: rgba(232,217,228,.92); }
.calendar-chip-arzt { background: rgba(221,232,225,.92); }
.calendar-chip-schule_kita { background: rgba(232,226,205,.92); }
.calendar-chip-reise { background: rgba(213,225,232,.92); }
.calendar-chip-verein_hobby { background: rgba(226,221,236,.92); }
.calendar-chip-familie { background: rgba(237,224,214,.92); }
.calendar-chip-frist { background: rgba(239,219,214,.92); }
.calendar-empty-slot { min-height: .2rem; }

/* v2.7.3 · Personen- und Haustierfotos */
.person-card-row {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.2rem;
}
.person-avatar,
.person-detail-photo {
  width: 116px;
  height: 116px;
  border-radius: 32px;
  object-fit: cover;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  background: linear-gradient(135deg, rgba(213,225,232,.95), rgba(232,217,228,.95));
  color: rgb(70,60,52);
  font-weight: 900;
  font-size: 2rem;
  border: 1px solid rgba(40,40,34,.08);
  box-shadow: 0 18px 38px rgba(20,20,16,.12);
}
.person-card-themed {
  border-left: 6px solid rgba(134, 158, 185, .82);
  background: linear-gradient(135deg, rgba(241,246,249,.96), rgba(255,255,255,.98));
}
.person-detail-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 1.35rem;
}
.person-detail-photo {
  width: 184px;
  height: 184px;
  border-radius: 42px;
  font-size: 3rem;
}
.person-photo-grid .card { min-height: 100%; }
.person-photo-strip {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(128px, 1fr));
  gap: .9rem;
}
.person-photo-strip img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 18px;
  display: block;
  border: 1px solid rgba(40,40,34,.08);
  box-shadow: 0 12px 24px rgba(20,20,16,.08);
}
.pet-card-grid .pet-profile-card {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  gap: 1rem;
  align-items: center;
}
.pet-profile-photo,
.pet-profile-placeholder {
  width: 118px;
  height: 118px;
  border-radius: 30px;
  object-fit: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(221,232,225,.95), rgba(232,226,205,.95));
  border: 1px solid rgba(40,40,34,.08);
  box-shadow: 0 12px 28px rgba(20,20,16,.08);
  font-size: 2.2rem;
}
@media (max-width: 920px) {
  .family-calendar-grid { gap: .35rem; }
  .family-calendar-day { min-height: 110px; padding: .5rem; border-radius: 14px; }
  .calendar-chip span { font-size: .72rem; }
  .calendar-chip small { display: none; }
  .person-card-row,
  .person-detail-header { grid-template-columns: 1fr; }
  .person-avatar { width: 94px; height: 94px; border-radius: 28px; }
  .person-detail-photo { width: 136px; height: 136px; border-radius: 36px; }
  .pet-card-grid .pet-profile-card { grid-template-columns: 1fr; }
  .pet-profile-photo,
  .pet-profile-placeholder { width: 104px; height: 104px; }
}
@media (max-width: 680px) {
  .family-calendar-grid {
    display: flex;
    gap: .75rem;
    overflow-x: auto;
    padding-bottom: .4rem;
  }
  .family-calendar-weekday { display: none; }
  .family-calendar-day {
    min-width: 180px;
  }
  .pet-card-grid .pet-profile-card {
    grid-template-columns: 1fr;
  }
}


/* v2.7.4 · Mehr Farbe pro Bereich */
.person-directory-hero,
.person-record-hero {
  background:
    radial-gradient(circle at top right, rgba(143, 175, 207, .22), transparent 30%),
    radial-gradient(circle at left bottom, rgba(198, 171, 207, .18), transparent 30%),
    linear-gradient(135deg, rgba(246,249,252,.98), rgba(250,245,251,.94));
  border: 1px solid rgba(132, 153, 181, .16);
  border-radius: 28px;
  padding: 1.35rem 1.45rem;
  margin-bottom: 1.1rem;
}
.structure-hero {
  background:
    radial-gradient(circle at top right, rgba(98, 152, 170, .22), transparent 28%),
    linear-gradient(135deg, rgba(244,250,249,.96), rgba(240,245,250,.92));
}
.emergency-hero {
  background:
    radial-gradient(circle at top right, rgba(198, 120, 104, .22), transparent 28%),
    linear-gradient(135deg, rgba(252,246,244,.97), rgba(249,241,236,.94));
}
.device-hero {
  background:
    radial-gradient(circle at top right, rgba(102, 129, 167, .24), transparent 30%),
    linear-gradient(135deg, rgba(244,247,252,.97), rgba(239,244,248,.93));
}
.pet-hero {
  background:
    radial-gradient(circle at top right, rgba(127, 158, 111, .24), transparent 30%),
    linear-gradient(135deg, rgba(246,250,244,.97), rgba(245,243,234,.93));
}
.checklist-hero {
  background:
    radial-gradient(circle at top right, rgba(110, 166, 156, .22), transparent 28%),
    linear-gradient(135deg, rgba(243,250,248,.97), rgba(246,245,236,.93));
}
.event-hero {
  background:
    radial-gradient(circle at top right, rgba(155, 120, 167, .24), transparent 28%),
    linear-gradient(135deg, rgba(249,245,251,.97), rgba(250,242,245,.94));
}
.photo-hero {
  background:
    radial-gradient(circle at top right, rgba(167, 128, 101, .22), transparent 26%),
    linear-gradient(135deg, rgba(251,248,243,.97), rgba(244,240,248,.94));
}
.calendar-hero {
  background:
    radial-gradient(circle at top right, rgba(114, 141, 189, .20), transparent 26%),
    linear-gradient(135deg, rgba(245,248,252,.97), rgba(250,246,242,.94));
}
.vacation-hero:not(.vacation-hero-with-image) {
  background:
    radial-gradient(circle at top right, rgba(89, 160, 166, .24), transparent 28%),
    linear-gradient(135deg, rgba(242,249,249,.97), rgba(247,244,236,.94));
}
.family-structure-card:nth-child(6n+1),
.family-mini-card:nth-child(6n+1) { background: linear-gradient(135deg, rgba(239,247,249,.96), rgba(255,255,255,.98)); border-color: rgba(124,166,178,.24); }
.family-structure-card:nth-child(6n+2),
.family-mini-card:nth-child(6n+2) { background: linear-gradient(135deg, rgba(250,243,239,.96), rgba(255,255,255,.98)); border-color: rgba(186,136,118,.20); }
.family-structure-card:nth-child(6n+3),
.family-mini-card:nth-child(6n+3) { background: linear-gradient(135deg, rgba(243,246,252,.96), rgba(255,255,255,.98)); border-color: rgba(132,154,188,.20); }
.family-structure-card:nth-child(6n+4),
.family-mini-card:nth-child(6n+4) { background: linear-gradient(135deg, rgba(245,250,243,.96), rgba(255,255,255,.98)); border-color: rgba(139,169,120,.20); }
.family-structure-card:nth-child(6n+5),
.family-mini-card:nth-child(6n+5) { background: linear-gradient(135deg, rgba(249,244,251,.96), rgba(255,255,255,.98)); border-color: rgba(167,132,182,.20); }
.family-structure-card:nth-child(6n+6),
.family-mini-card:nth-child(6n+6) { background: linear-gradient(135deg, rgba(250,248,241,.96), rgba(255,255,255,.98)); border-color: rgba(187,163,102,.20); }
.metric-row.visual-metrics div:nth-child(4n+1) span,
.hero-stat-card .hero-stat-icon { color: #4d7f8f; }
.metric-row.visual-metrics div:nth-child(4n+2) span { color: #8f6a95; }
.metric-row.visual-metrics div:nth-child(4n+3) span { color: #7c9360; }
.metric-row.visual-metrics div:nth-child(4n+4) span { color: #b07a5e; }

/* v2.7.5 · Bereichsbezogene Farbwelt konsequent */
:root {
  --c-doc: #5f7f99;
  --c-import: #8c7bb2;
  --c-person: #8f6a95;
  --c-family: #5f9a98;
  --c-emergency: #be6f62;
  --c-travel: #4f9aa5;
  --c-photo: #b47d5f;
  --c-calendar: #6f86bd;
  --c-address: #6f9a73;
  --c-bank: #5c8b7f;
  --c-device: #667fa7;
  --c-pet: #879d5f;
  --c-tax: #b58a48;
  --c-security: #8a6a61;
}
.side-nav a {
  border-left: 5px solid transparent;
  background: rgba(255,255,255,.45);
}
.side-nav a span {
  width: 1.9rem;
  height: 1.9rem;
  display: inline-grid;
  place-items: center;
  border-radius: .75rem;
  background: rgba(36,36,30,.06);
}
.side-nav a[href*="/dokument"],
.side-nav a[href*="/inbox"] { --nav-c: var(--c-doc); }
.side-nav a[href*="/vault/import"] { --nav-c: var(--c-import); }
.side-nav a[href*="/personen"] { --nav-c: var(--c-person); }
.side-nav a[href*="/familie"] { --nav-c: var(--c-family); }
.side-nav a[href*="/notfall"] { --nav-c: var(--c-emergency); }
.side-nav a[href*="/urlaub"] { --nav-c: var(--c-travel); }
.side-nav a[href*="/fotos"], .side-nav a[href*="/ereignisse"] { --nav-c: var(--c-photo); }
.side-nav a[href*="/kalender"] { --nav-c: var(--c-calendar); }
.side-nav a[href*="/adressen"] { --nav-c: var(--c-address); }
.side-nav a[href*="/bankdaten"] { --nav-c: var(--c-bank); }
.side-nav a[href*="/geraete"] { --nav-c: var(--c-device); }
.side-nav a[href*="/haustiere"] { --nav-c: var(--c-pet); }
.side-nav a[href*="/steuer"],
.side-nav a[href*="/finanzen"],
.side-nav a[href*="/fahrtkosten"],
.side-nav a[href*="/auswertungen"] { --nav-c: var(--c-tax); }
.side-nav a[href*="/backup"],
.side-nav a[href*="/papierkorb"],
.side-nav a[href*="/sicherheit"],
.side-nav a[href*="/freigaben"] { --nav-c: var(--c-security); }
.side-nav a:hover,
.side-nav a.active {
  border-left-color: var(--nav-c, var(--accent));
  background: color-mix(in srgb, var(--nav-c, #8a7b68) 18%, white);
}
.side-nav a.active span,
.side-nav a:hover span {
  color: #fff;
  background: var(--nav-c, var(--accent));
}
.button.primary {
  background: linear-gradient(135deg, color-mix(in srgb, var(--page-c, var(--c-doc)) 86%, #2e2d27), color-mix(in srgb, var(--page-c, var(--c-doc)) 70%, #1f1d18));
  border-color: color-mix(in srgb, var(--page-c, var(--c-doc)) 70%, #222);
}
.address-hero,
body:has(.address-hero) { --page-c: var(--c-address); }
.bank-hero,
body:has(.bank-hero) { --page-c: var(--c-bank); }
.mileage-hero,
body:has(.mileage-hero) { --page-c: var(--c-tax); }
.address-hero {
  background: radial-gradient(circle at top right, rgba(111,154,115,.35), transparent 28%), linear-gradient(135deg, rgba(240,250,241,.98), rgba(249,245,232,.94));
}
.bank-hero {
  background: radial-gradient(circle at top right, rgba(92,139,127,.36), transparent 30%), linear-gradient(135deg, rgba(239,249,246,.98), rgba(243,247,241,.94));
}
.finance-hero,
.mileage-hero {
  background: radial-gradient(circle at top right, rgba(181,138,72,.35), transparent 28%), linear-gradient(135deg, rgba(251,247,235,.98), rgba(247,240,224,.95));
}
.color-pop-card { border-left: 7px solid var(--page-c, var(--c-family)); }
.color-card { position: relative; overflow: hidden; }
.color-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 8px;
  background: var(--card-c, var(--page-c, var(--c-family)));
}
.color-card-address { --card-c: var(--c-address); background: linear-gradient(135deg, rgba(239,249,240,.96), rgba(255,255,255,.98)); }
.color-card-bank { --card-c: var(--c-bank); background: linear-gradient(135deg, rgba(237,249,246,.96), rgba(255,255,255,.98)); }
.color-card-tax { --card-c: var(--c-tax); background: linear-gradient(135deg, rgba(251,247,235,.96), rgba(255,255,255,.98)); }
.color-card-help { --card-c: #8f86a8; background: linear-gradient(135deg, rgba(245,243,250,.97), rgba(255,255,255,.98)); }
.color-card-address-list { --card-c: var(--c-address); }
.color-card-bank-list { --card-c: var(--c-bank); }
.color-warning-card { border-left: 8px solid var(--c-emergency); background: rgba(250,241,237,.96); }
.color-icon {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  border-radius: 1.1rem;
  color: #fff;
  font-weight: 900;
  font-size: 1.25rem;
  box-shadow: 0 14px 28px rgba(20,20,16,.12);
}
.address-icon { background: var(--c-address); }
.bank-icon { background: var(--c-bank); }
.address-card,
.bank-card {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: 1rem;
  align-items: start;
}
.address-card { border-color: rgba(111,154,115,.28); background: linear-gradient(135deg, rgba(240,250,241,.96), rgba(255,255,255,.98)); }
.bank-card { border-color: rgba(92,139,127,.28); background: linear-gradient(135deg, rgba(239,249,246,.96), rgba(255,255,255,.98)); }
.calendar-chip { border-left: 5px solid rgba(0,0,0,.18); font-weight: 760; }
.calendar-chip-termin { background: rgba(213,225,246,.95); border-left-color: var(--c-calendar); }
.calendar-chip-arzt { background: rgba(232,244,238,.95); border-left-color: #609b7a; }
.calendar-chip-schule_kita { background: rgba(250,235,203,.95); border-left-color: #c28b35; }
.calendar-chip-geburtstag { background: rgba(246,222,235,.95); border-left-color: #b66f93; }
.calendar-chip-reise { background: rgba(218,242,244,.95); border-left-color: var(--c-travel); }
.calendar-chip-familie { background: rgba(238,229,246,.95); border-left-color: var(--c-person); }
.calendar-chip-frist { background: rgba(248,221,215,.95); border-left-color: var(--c-emergency); }
.badge { border-color: color-mix(in srgb, var(--page-c, #9a8f80) 28%, transparent); background: color-mix(in srgb, var(--page-c, #9a8f80) 14%, white); }
.formula-box {
  padding: 1rem 1.2rem;
  border-radius: 1rem;
  background: rgba(181,138,72,.14);
  border: 1px solid rgba(181,138,72,.28);
  font-weight: 900;
  text-align: center;
}
[data-capture-section][style*="display: none"],
[data-capture-field][style*="display: none"] { margin: 0 !important; }

/* v2.7.5+ · Farbwelt wirklich konsequent */
.app-body {
  background:
    radial-gradient(circle at 18% 10%, rgba(118, 157, 173, .18), transparent 28%),
    radial-gradient(circle at 82% 12%, rgba(181, 138, 72, .16), transparent 28%),
    radial-gradient(circle at 72% 82%, rgba(143, 106, 149, .14), transparent 30%),
    linear-gradient(135deg, #fbf7ee 0%, #f3f6f1 38%, #f2f5f8 100%);
}
.main-area {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--page-c, #8a7b68) 8%, transparent), transparent 34%),
    rgba(255,255,255,.22);
}
.sidebar {
  background:
    linear-gradient(180deg, rgba(52, 48, 42, .96), rgba(37, 43, 46, .94)),
    radial-gradient(circle at top left, rgba(181,138,72,.26), transparent 30%);
}
.brand-card {
  background: linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.07));
  border-color: rgba(255,255,255,.18);
}
.side-nav .nav-kicker { color: rgba(255,255,255,.64); }
.side-nav a {
  color: rgba(255,255,255,.86);
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.07);
  border-left-width: 5px;
}
.side-nav a:hover,
.side-nav a.active {
  color: #fff;
  background: linear-gradient(135deg, color-mix(in srgb, var(--nav-c, #b58a48) 48%, rgba(255,255,255,.08)), rgba(255,255,255,.10));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--nav-c, #b58a48) 40%, transparent), 0 10px 22px rgba(0,0,0,.18);
}
.side-nav a span {
  background: color-mix(in srgb, var(--nav-c, #b58a48) 22%, rgba(255,255,255,.10));
  color: color-mix(in srgb, var(--nav-c, #b58a48) 88%, white);
}
.topbar {
  border-bottom: 1px solid color-mix(in srgb, var(--page-c, #8a7b68) 24%, var(--line));
  background: linear-gradient(135deg, rgba(255,255,255,.90), color-mix(in srgb, var(--page-c, #8a7b68) 12%, white));
}
.topbar-context span {
  background: var(--page-c, var(--accent));
  color: #fff;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--page-c, #8a7b68) 32%, transparent);
}
.page-hero,
.page-header,
.tax-command-center,
.record-hero {
  border-top: 8px solid var(--page-c, var(--accent));
  box-shadow: 0 22px 48px color-mix(in srgb, var(--page-c, #8a7b68) 18%, rgba(40,38,32,.08));
}
.card,
.premium-card {
  border-color: color-mix(in srgb, var(--page-c, #8a7b68) 20%, var(--line));
}
.section-title {
  border-bottom-color: color-mix(in srgb, var(--page-c, #8a7b68) 24%, var(--line-soft));
}
.badge,
.status-pill,
button.button,
a.button {
  --button-c: var(--page-c, #8a7b68);
}
.button:not(.primary):not(.ghost) {
  border-color: color-mix(in srgb, var(--button-c) 25%, var(--line));
  background: color-mix(in srgb, var(--button-c) 12%, white);
}
.button.ghost {
  color: color-mix(in srgb, var(--page-c, #8a7b68) 82%, #1f1d18);
}
body:has(.invoice-hero), body:has(.rapid-hero) { --page-c: var(--c-doc); }
body:has(.import-automation-hero) { --page-c: var(--c-import); }
body:has(.person-directory-hero), body:has(.person-record-hero) { --page-c: var(--c-person); }
body:has(.structure-hero) { --page-c: var(--c-family); }
body:has(.emergency-hero) { --page-c: var(--c-emergency); }
body:has(.vacation-hero) { --page-c: var(--c-travel); }
body:has(.photo-hero), body:has(.event-hero) { --page-c: var(--c-photo); }
body:has(.calendar-hero) { --page-c: var(--c-calendar); }
body:has(.device-hero) { --page-c: var(--c-device); }
body:has(.pet-hero) { --page-c: var(--c-pet); }
body:has(.checklist-hero) { --page-c: #7b9a85; }
body:has(.tax-command-center), body:has(.finance-hero), body:has(.mileage-hero) { --page-c: var(--c-tax); }
body:has(.backup-hero), body:has(.security-hero), body:has(.trash-hero) { --page-c: var(--c-security); }
.tax-kpi-card:nth-child(1) { --card-c: #b58a48; }
.tax-kpi-card:nth-child(2) { --card-c: #678f6d; }
.tax-kpi-card:nth-child(3) { --card-c: #5c8b7f; }
.tax-kpi-card:nth-child(4) { --card-c: #be6f62; }
.tax-kpi-card:nth-child(5) { --card-c: #8f6a95; }
.tax-kpi-card:nth-child(6) { --card-c: #5f7f99; }
.tax-kpi-card {
  border-top: 7px solid var(--card-c, var(--page-c));
  background: linear-gradient(135deg, color-mix(in srgb, var(--card-c, var(--page-c)) 18%, white), rgba(255,255,255,.98));
}
.tax-bucket-card:nth-child(6n+1), .tax-section-card:nth-child(6n+1) { --bucket-c: #b58a48; }
.tax-bucket-card:nth-child(6n+2), .tax-section-card:nth-child(6n+2) { --bucket-c: #6f9a73; }
.tax-bucket-card:nth-child(6n+3), .tax-section-card:nth-child(6n+3) { --bucket-c: #5c8b7f; }
.tax-bucket-card:nth-child(6n+4), .tax-section-card:nth-child(6n+4) { --bucket-c: #8f6a95; }
.tax-bucket-card:nth-child(6n+5), .tax-section-card:nth-child(6n+5) { --bucket-c: #667fa7; }
.tax-bucket-card:nth-child(6n+6), .tax-section-card:nth-child(6n+6) { --bucket-c: #be6f62; }
.tax-bucket-card,
.tax-section-card {
  border-left: 8px solid var(--bucket-c, var(--page-c));
  background: linear-gradient(135deg, color-mix(in srgb, var(--bucket-c, var(--page-c)) 16%, white), rgba(255,255,255,.98));
}
.tax-bucket-icon,
.tax-section-head > span {
  background: var(--bucket-c, var(--page-c));
  color: #fff;
}
.tax-year-record-card { --card-c: var(--c-tax); }
.tax-record-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  margin-bottom: 1rem;
  padding: 1rem 1.1rem;
  border-radius: 1.2rem;
  background: linear-gradient(135deg, rgba(181,138,72,.16), rgba(255,255,255,.86));
  border: 1px solid rgba(181,138,72,.24);
}
.tax-record-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(90px, 1fr));
  gap: .65rem;
}
.tax-record-kpis span {
  display: grid;
  gap: .1rem;
  padding: .7rem .8rem;
  border-radius: 1rem;
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(181,138,72,.20);
  text-align: center;
}
.tax-record-kpis strong { font-size: 1.45rem; color: var(--c-tax); }
.tax-record-kpis small { color: var(--muted); font-weight: 760; }
.tax-record-details {
  margin-top: 1rem;
  border: 1px solid color-mix(in srgb, var(--page-c) 22%, var(--line));
  border-radius: 1.2rem;
  background: rgba(255,255,255,.58);
  overflow: hidden;
}
.tax-record-details summary {
  cursor: pointer;
  padding: 1rem 1.15rem;
  font-weight: 900;
  background: color-mix(in srgb, var(--page-c) 12%, white);
}
.tax-record-details > .form-grid,
.tax-record-details > .tax-section-grid,
.tax-record-details > .tax-folder-grid { padding: 1rem; }
.tax-section-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 1rem;
}
.tax-section-card {
  border-radius: 1.25rem;
  padding: 1rem;
  box-shadow: 0 12px 28px rgba(31,29,24,.06);
}
.tax-section-head {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: .8rem;
  margin-bottom: .8rem;
}
.tax-section-head > span {
  width: 2.7rem;
  height: 2.7rem;
  display: grid;
  place-items: center;
  border-radius: 1rem;
  font-weight: 900;
}
.tax-section-head h3 { margin: 0 0 .2rem; }
.tax-section-head p { margin: 0; color: var(--muted); font-size: .88rem; }
.tax-section-status-erledigt { opacity: .92; }
.tax-section-status-erledigt .tax-section-head > span { background: #6f9a73; }
.tax-section-status-nicht_zutreffend { filter: grayscale(.2); opacity: .78; }
.tax-folder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: .65rem;
}
.tax-folder-grid div {
  padding: .8rem;
  border-radius: .9rem;
  background: rgba(255,255,255,.72);
  border-left: 5px solid var(--page-c);
}
.tax-folder-grid strong { display: block; font-size: .82rem; }
.tax-folder-grid small { color: var(--muted); }
.invoice-flow .step-card:nth-of-type(1) { --card-c: var(--c-doc); }
.invoice-flow .step-card:nth-of-type(2) { --card-c: var(--c-tax); }
.invoice-flow .step-card:nth-of-type(3) { --card-c: var(--c-bank); }
.invoice-flow .step-card {
  border-left: 8px solid var(--card-c, var(--page-c));
  background: linear-gradient(135deg, color-mix(in srgb, var(--card-c, var(--page-c)) 15%, white), rgba(255,255,255,.96));
}
@media (max-width: 900px) {
  .tax-record-intro { grid-template-columns: 1fr; }
  .tax-record-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 680px) {
  .tax-record-kpis { grid-template-columns: 1fr; }
  .tax-section-grid { grid-template-columns: 1fr; }
}

/* v2.7.6 · Intelligente Steuererkennung */
.tax-intelligence-panel {
  border-left: 8px solid rgba(46, 123, 112, .86);
  background:
    radial-gradient(circle at top right, rgba(46, 123, 112, .18), transparent 30%),
    linear-gradient(135deg, rgba(238, 249, 246, .98), rgba(255, 250, 241, .96));
}
.tax-intelligence-ready {
  box-shadow: 0 18px 44px rgba(40, 116, 105, .14);
}
.tax-intelligence-review {
  border-left-color: rgba(185, 139, 65, .86);
  background:
    radial-gradient(circle at top right, rgba(185, 139, 65, .16), transparent 30%),
    linear-gradient(135deg, rgba(252, 248, 238, .98), rgba(255,255,255,.96));
}
.tax-intelligence-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: .85rem;
  margin: 1rem 0;
}
.tax-intelligence-grid > div {
  padding: .9rem 1rem;
  border-radius: 18px;
  border: 1px solid rgba(40,40,34,.08);
  background: rgba(255,255,255,.72);
}
.tax-intelligence-grid strong {
  display: block;
  color: rgba(40,40,34,.58);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: .35rem;
}
.tax-intelligence-grid span {
  display: block;
  color: var(--ink);
  font-weight: 760;
}
.tax-smart-badge {
  background: rgba(46, 123, 112, .14);
  color: rgb(35, 96, 88);
  border-color: rgba(46, 123, 112, .28);
}
.button.tax-action {
  background: linear-gradient(135deg, rgb(46, 123, 112), rgb(59, 139, 124));
  border-color: rgba(46, 123, 112, .3);
  color: #fff;
}
.import-card .tax-smart-badge { font-weight: 800; }

/* v2.7.7 · Beleg und Ausgabe gemeinsam erfassen */
.receipt-capture-hero,
.receipt-detail-hero {
  background:
    radial-gradient(circle at top right, rgba(72, 151, 170, .30), transparent 28%),
    radial-gradient(circle at bottom left, rgba(184, 130, 88, .22), transparent 32%),
    linear-gradient(135deg, rgba(241, 249, 250, .98), rgba(255, 247, 239, .95));
  border: 1px solid rgba(72,151,170,.18);
}
.receipt-expense-flow .receipt-section {
  border-top: 6px solid rgba(72,151,170,.62);
}
.receipt-section-document { background: linear-gradient(135deg, rgba(241,249,250,.96), rgba(255,255,255,.98)); }
.receipt-section-expense { background: linear-gradient(135deg, rgba(247,242,252,.96), rgba(255,255,255,.98)); border-top-color: rgba(140,109,170,.62) !important; }
.receipt-section-payment { background: linear-gradient(135deg, rgba(244,249,241,.96), rgba(255,255,255,.98)); border-top-color: rgba(120,158,96,.62) !important; }
.receipt-detail-grid .card { min-height: 100%; }
.receipt-summary-card { border-top: 6px solid rgba(140,109,170,.62); }
.receipt-payment-card { border-top: 6px solid rgba(120,158,96,.62); }
.receipt-documents-card { border-top: 6px solid rgba(72,151,170,.62); }
.receipt-document-row { background: linear-gradient(135deg, rgba(241,249,250,.85), rgba(255,255,255,.98)); }
.detail-list {
  display: grid;
  gap: .65rem;
  margin: 0;
}
.detail-list div {
  display: grid;
  grid-template-columns: minmax(140px, .62fr) minmax(0, 1fr);
  gap: .75rem;
  padding: .65rem 0;
  border-bottom: 1px solid var(--line-soft);
}
.detail-list div:last-child { border-bottom: 0; }
.detail-list dt {
  color: var(--muted);
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 760;
}
.detail-list dd { margin: 0; font-weight: 720; color: var(--ink); }
.note-box {
  margin-top: 1rem;
  border: 1px solid rgba(120,158,96,.22);
  background: rgba(244,249,241,.78);
  border-radius: var(--radius-lg);
  padding: 1rem;
}
@media (max-width: 760px) {
  .detail-list div { grid-template-columns: 1fr; gap: .25rem; }
}

/* v2.7.8 · Inline-Vorschau und KI-Vorbelegung bei Beleg + Ausgabe */
.receipt-live-grid {
  align-items: stretch;
  margin-bottom: 1.15rem;
}
.receipt-preview-card,
.receipt-ai-card {
  border-top: 7px solid rgba(71, 132, 147, .86);
  background:
    radial-gradient(circle at top right, rgba(71, 132, 147, .13), transparent 34%),
    linear-gradient(135deg, rgba(244, 250, 250, .98), rgba(255,255,255,.98));
}
.receipt-ai-card {
  border-top-color: rgba(139, 108, 166, .86);
  background:
    radial-gradient(circle at top right, rgba(139, 108, 166, .14), transparent 34%),
    linear-gradient(135deg, rgba(250, 246, 252, .98), rgba(255,255,255,.98));
}
.receipt-preview-box {
  min-height: 620px;
  border: 1px solid rgba(30, 30, 24, .10);
  border-radius: 24px;
  overflow: hidden;
  background: rgba(30, 30, 24, .04);
  display: grid;
  place-items: center;
}
.receipt-pdf-preview {
  width: 100%;
  height: 680px;
  border: 0;
  display: block;
  background: white;
}
.receipt-image-preview {
  width: 100%;
  max-height: 720px;
  object-fit: contain;
  display: block;
  background: rgba(255,255,255,.76);
}
.receipt-ai-result {
  display: grid;
  gap: .85rem;
}
.receipt-ai-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.receipt-ai-summary div {
  padding: .9rem;
  border-radius: 18px;
  border: 1px solid rgba(40,40,34,.08);
  background: rgba(255,255,255,.78);
}
.receipt-ai-summary strong {
  display: block;
  color: var(--ink);
  font-size: 1.08rem;
  line-height: 1.2;
}
.receipt-ai-summary small {
  display: block;
  margin-top: .25rem;
  color: var(--muted);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 760;
}
.receipt-ai-result details {
  border: 1px solid rgba(40,40,34,.08);
  border-radius: 18px;
  padding: .85rem 1rem;
  background: rgba(255,255,255,.70);
}
.receipt-ai-result summary {
  cursor: pointer;
  font-weight: 760;
  color: var(--ink);
}
.receipt-ai-result pre {
  white-space: pre-wrap;
  max-height: 240px;
  overflow: auto;
  margin: .75rem 0 0;
  font-size: .82rem;
  line-height: 1.45;
  color: rgba(40,40,34,.78);
}
.receipt-ai-warning {
  color: #8f4d38;
  background: rgba(244, 221, 214, .62);
  border: 1px solid rgba(180, 105, 82, .20);
  border-radius: 16px;
  padding: .8rem .9rem;
}
@media (max-width: 1100px) {
  .receipt-live-grid { grid-template-columns: 1fr; }
  .receipt-preview-box { min-height: 420px; }
  .receipt-pdf-preview { height: 520px; }
}
@media (max-width: 700px) {
  .receipt-ai-summary { grid-template-columns: 1fr; }
  .receipt-preview-box { min-height: 320px; }
  .receipt-pdf-preview { height: 420px; }
}


/* v2.7.9 · Einheitlicher Inbox-Workflow und Personenkontakte */
.import-workflow-card {
  border-left: 7px solid rgba(86, 132, 167, .82);
  background: linear-gradient(135deg, rgba(239,247,251,.98), rgba(255,255,255,.94));
}
.import-workflow-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .8rem;
}
.import-workflow-steps div {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: .75rem;
  align-items: center;
  padding: .9rem;
  border-radius: 18px;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(86,132,167,.16);
}
.import-workflow-steps strong {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(86,132,167,.16);
  color: rgb(51,82,108);
}
.import-form-section {
  display: grid;
  gap: .75rem;
  padding: 1rem;
  border-radius: 20px;
  border: 1px solid rgba(86,132,167,.14);
  background: rgba(247,250,252,.76);
}
.person-contact-summary {
  font-weight: 760;
  color: rgb(65, 91, 117);
}
.person-contact-grid .contact-card {
  border-left: 6px solid rgba(110, 142, 172, .72);
}
.contact-card-email { background: linear-gradient(135deg, rgba(239,247,251,.96), rgba(255,255,255,.98)); }
.contact-card-phone { background: linear-gradient(135deg, rgba(243,249,241,.96), rgba(255,255,255,.98)); }
.contact-card-address { background: linear-gradient(135deg, rgba(250,244,237,.96), rgba(255,255,255,.98)); }
.compact-list li {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: center;
}


/* v2.7.10 · Immobilien & Haustier-Objekttyp */
.property-hero {
  background:
    radial-gradient(circle at top right, rgba(93, 134, 112, .28), transparent 28%),
    radial-gradient(circle at bottom left, rgba(173, 145, 98, .20), transparent 32%),
    linear-gradient(135deg, rgba(244,249,245,.98), rgba(250,246,237,.94));
}
.property-accent-card,
.property-profile-card {
  border-left: 7px solid rgba(91, 132, 107, .86);
  background: linear-gradient(135deg, rgba(243,249,244,.98), rgba(255,255,255,.98));
}
.property-card-grid .property-profile-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 1rem; align-items: center; }
.property-profile-icon { width: 96px; height: 96px; border-radius: 28px; display: grid; place-items: center; font-size: 2.2rem; background: linear-gradient(135deg, rgba(216,232,220,.98), rgba(238,226,197,.95)); border: 1px solid rgba(40,40,34,.08); box-shadow: 0 16px 34px rgba(20,20,16,.10); }
.object-mini-meta { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .7rem; }
.object-mini-meta span { border-radius: 999px; padding: .28rem .6rem; background: rgba(91,132,107,.12); color: rgba(40,48,38,.82); font-weight: 740; font-size: .78rem; }
.compact-actions { margin-top: .8rem; }
@media (max-width: 760px) { .property-card-grid .property-profile-card { grid-template-columns: 1fr; } .property-profile-icon { width: 86px; height: 86px; } }


/* v2.7.11 · Reise-Timeline UX-Fix */
.family-trip-card {
  overflow: hidden;
  padding: 0;
}
.family-trip-card-body {
  padding: 1rem 1rem 1.1rem;
}
.family-trip-image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: linear-gradient(135deg, rgba(93,160,166,.24), rgba(213,171,94,.18));
  text-decoration: none;
  overflow: hidden;
}
.family-trip-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .28s ease;
}
.family-trip-image span {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  font-size: 2.4rem;
  color: rgba(40,40,34,.58);
}
.family-trip-card:hover .family-trip-image img {
  transform: scale(1.035);
}
.family-trip-card .family-trip-head {
  align-items: flex-start;
}
.family-trip-card h3 {
  margin: .7rem 0 .35rem;
  line-height: 1.18;
}
.family-trip-card p {
  line-height: 1.45;
}
.family-trip-card .family-card-actions {
  margin-top: 1rem;
}
.vacation-timeline-hero {
  min-height: 360px;
}
.vacation-hero-content-single {
  display: block;
  max-width: 980px;
}
.vacation-hero-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: .85rem 0 1rem;
}
.vacation-status-badge {
  background: rgba(255,253,248,.88);
  color: rgba(38,45,37,.92);
}
.vacation-timeline-hero .lead {
  max-width: 780px;
  line-height: 1.55;
}
.vacation-timeline-hero.vacation-hero-with-image {
  min-height: 420px;
}
.vacation-timeline-hero .hero-actions {
  max-width: 980px;
}
.travel-timeline-data-grid {
  align-items: start;
}
.travel-data-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.travel-data-form .form-field:has(textarea),
.travel-data-form .form-actions {
  grid-column: 1 / -1;
}
.travel-data-edit-card .helptext,
.travel-data-edit-card small {
  line-height: 1.35;
}
.family-trip-overview .family-fact-grid p,
.family-trip-overview .family-fact-grid small {
  line-height: 1.4;
}
@media (max-width: 860px) {
  .travel-data-form {
    grid-template-columns: 1fr;
  }
  .vacation-timeline-hero,
  .vacation-timeline-hero.vacation-hero-with-image {
    min-height: 320px;
  }
}

/* v2.7.13 · Kontoauszüge */
.bank-statement-hero {
  background:
    radial-gradient(circle at top right, rgba(82, 132, 161, .28), transparent 28%),
    radial-gradient(circle at bottom left, rgba(154, 124, 87, .18), transparent 30%),
    linear-gradient(135deg, rgba(242,247,250,.98), rgba(250,246,239,.95));
}
.statement-list {
  display: grid;
  gap: .85rem;
}
.statement-card {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  border: 1px solid rgba(35, 60, 78, .12);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(244,248,250,.98), rgba(255,255,255,.98));
  text-decoration: none;
  color: inherit;
}
.statement-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 34px rgba(22, 34, 44, .10);
}
.statement-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 17px;
  background: rgba(82, 132, 161, .16);
  color: #3f6f88;
  font-size: 1.45rem;
}
.statement-preview {
  width: 100%;
  height: 520px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
  background: #fff;
}
.statement-image-preview {
  width: 100%;
  max-height: 520px;
  object-fit: contain;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.08);
  background: #fff;
}
.recurring-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .85rem;
}
.recurring-card {
  padding: 1rem;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(238,246,242,.98), rgba(255,255,255,.98));
  border: 1px solid rgba(93, 145, 120, .18);
}
.transaction-review-list {
  display: grid;
  gap: 1rem;
}
.transaction-review-card {
  padding: 1rem;
  border-radius: 22px;
  border: 1px solid rgba(40,40,34,.10);
  background: rgba(255,255,255,.9);
}
.transaction-review-card.is-recurring {
  border-left: 7px solid rgba(82, 132, 161, .68);
  background: linear-gradient(135deg, rgba(241,247,250,.98), rgba(255,255,255,.98));
}
.transaction-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: start;
  margin-bottom: 1rem;
}
.transaction-main h3 {
  margin: .1rem 0 .35rem;
}
.transaction-amount {
  font-weight: 900;
  font-size: 1.25rem;
  padding: .55rem .75rem;
  border-radius: 14px;
  white-space: nowrap;
  background: rgba(180, 100, 90, .12);
  color: #9b3d35;
}
.transaction-amount.income {
  background: rgba(86, 145, 105, .14);
  color: #4d835f;
}
.transaction-review-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}
.transaction-review-form label {
  display: grid;
  gap: .28rem;
  font-weight: 700;
  font-size: .86rem;
}
.transaction-note-field,
.transaction-actions {
  grid-column: 1 / -1;
}
.inline-form { display: inline-flex; }
@media (max-width: 980px) {
  .transaction-review-form { grid-template-columns: 1fr; }
  .transaction-main { grid-template-columns: 1fr; }
  .statement-card { grid-template-columns: 1fr; }
}

/* v2.7.12/13 · Reiseetappen & Unterkunftskarten */
.travel-plan-grid,
.travel-stage-form-grid { align-items: start; }
.travel-stage-list,
.travel-accommodation-list { display: grid; gap: .9rem; }
.travel-stage-item {
  display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: .9rem; padding: 1rem;
  border-radius: 20px; border: 1px solid rgba(55,72,88,.12);
  background: linear-gradient(135deg, rgba(242,247,250,.96), rgba(255,255,255,.98));
}
.travel-stage-icon { width:48px;height:48px;display:grid;place-items:center;border-radius:16px;background:rgba(85,137,160,.14);color:#426f82;font-size:1.35rem; }
.travel-stage-head { display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.55rem;margin-bottom:.35rem; }
.travel-stage-item p,.travel-accommodation-card p { margin:.2rem 0; }
.travel-stage-item small,.travel-accommodation-card small { display:block;color:var(--muted);margin-top:.18rem;line-height:1.35; }
.travel-stage-actions { display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.75rem; }
.travel-accommodation-card { display:grid;grid-template-columns:150px minmax(0,1fr);gap:1rem;padding:1rem;border-radius:22px;border:1px solid rgba(93,117,86,.14);background:linear-gradient(135deg, rgba(247,249,242,.98), rgba(255,255,255,.98)); }
.travel-accommodation-image { min-height:112px;border-radius:18px;overflow:hidden;background:linear-gradient(135deg, rgba(194,211,183,.7), rgba(226,217,198,.7));display:grid;place-items:center;color:#5d7556;font-size:2rem; }
.travel-accommodation-image img { width:100%;height:100%;min-height:112px;object-fit:cover;display:block; }
.button.danger,.button.ghost.danger { color:#9b3d35;border-color:rgba(155,61,53,.24); }
@media (max-width:760px){ .travel-stage-item,.travel-accommodation-card{grid-template-columns:1fr;} .travel-accommodation-image{min-height:180px;} }


/* v2.7.14 · Kompakte Reisetimeline */
.travel-compact-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(260px, 420px) minmax(0, 1fr);
  gap: 1.4rem;
  align-items: stretch;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 30px;
  background:
    radial-gradient(circle at top right, rgba(88, 158, 166, .20), transparent 30%),
    linear-gradient(135deg, rgba(248, 252, 251, .98), rgba(250, 247, 239, .95));
  box-shadow: 0 18px 42px rgba(20,20,16,.08);
  margin-bottom: 1rem;
}

.travel-hero-image-form {
  position: relative;
  min-height: 250px;
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
  background: linear-gradient(135deg, rgba(211,232,234,.95), rgba(239,229,214,.95));
  display: grid;
  place-items: center;
  border: 1px solid rgba(40,40,34,.08);
}

.travel-hero-image-form img {
  width: 100%;
  height: 100%;
  min-height: 250px;
  object-fit: cover;
  display: block;
}

.travel-hero-image-form input[type="file"] {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.travel-hero-placeholder {
  font-family: var(--serif);
  font-size: 1.45rem;
  color: rgba(40,40,34,.70);
}

.travel-hero-edit-label {
  position: absolute;
  right: .8rem;
  bottom: .8rem;
  padding: .45rem .7rem;
  border-radius: 999px;
  background: rgba(255,255,255,.88);
  color: var(--ink);
  font-size: .78rem;
  font-weight: 800;
  box-shadow: 0 8px 20px rgba(20,20,16,.14);
}

.travel-compact-hero-copy {
  padding: .4rem .35rem;
  align-self: center;
}

.travel-compact-hero-copy h1 {
  margin-bottom: .35rem;
}

.travel-compact-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: .7rem 0 1rem;
}

.compact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}

.travel-compact-metrics {
  margin-bottom: 1rem;
}

.travel-compact-layout {
  display: grid;
  gap: .9rem;
}

.travel-compact-panel {
  padding: 1rem;
}

.travel-compact-panel details > summary {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  cursor: pointer;
  list-style: none;
}

.travel-compact-panel details > summary::-webkit-details-marker {
  display: none;
}

.travel-compact-panel details > summary strong {
  display: block;
  font-family: var(--serif);
  font-size: 1.15rem;
  font-weight: 600;
}

.compact-section-title {
  margin-bottom: .75rem;
}

.compact-section-title h2 {
  font-size: 1.35rem;
}

.travel-compact-list {
  display: grid;
  gap: .65rem;
}

.travel-compact-item {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: .75rem;
  padding: .85rem;
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(40,40,34,.08);
}

.travel-compact-item-icon {
  width: 42px;
  height: 42px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  background: rgba(89,160,166,.18);
  font-size: 1.15rem;
}

.travel-compact-item-body p {
  margin: .25rem 0;
}

.travel-compact-item-body small,
.compact-accommodation-card small {
  display: block;
  color: var(--muted);
  margin-top: .15rem;
}

.travel-inline-edit {
  display: inline-block;
}

.travel-inline-edit > summary {
  list-style: none;
}

.travel-inline-edit > summary::-webkit-details-marker {
  display: none;
}

.travel-inline-edit[open] {
  display: block;
  width: 100%;
  margin-top: .65rem;
  padding: .85rem;
  border-radius: 18px;
  background: rgba(248,246,239,.94);
  border: 1px solid rgba(40,40,34,.08);
}

.travel-inline-edit[open] > summary {
  margin-bottom: .65rem;
}

.compact-accommodation-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: .75rem;
}

.compact-accommodation-card {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: .8rem;
  padding: .8rem;
}

.compact-accommodation-card .travel-accommodation-image {
  min-height: 120px;
  border-radius: 18px;
}

.travel-link-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

.form-grid .full-span {
  grid-column: 1 / -1;
}

@media (max-width: 920px) {
  .travel-compact-hero {
    grid-template-columns: 1fr;
  }
  .travel-hero-image-form,
  .travel-hero-image-form img {
    min-height: 220px;
  }
}

@media (max-width: 620px) {
  .compact-accommodation-card,
  .travel-compact-item {
    grid-template-columns: 1fr;
  }
  .travel-compact-panel details > summary {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v2.7.16 · Automatische Urlaubsanzeige im Familienkalender */
.timeline-kind-travel { border-left-color: var(--c-travel, #4d8f96) !important; }
.timeline-kind-travel .badge { background: rgba(218,242,244,.95); color: #315c61; }
.calendar-chip-reise {
  background: rgba(218,242,244,.96) !important;
  border-left-color: var(--c-travel, #4d8f96) !important;
}
.calendar-chip-reise span::before {
  content: "☼ ";
}


/* v2.7.17 · Immobilien-Dashboard und Kontoauszüge in Bankinformationen */
.rich-property-grid { grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); }
.rich-property-card { display: grid; gap: 1rem; align-content: start; }
.property-card-head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; align-items: start; }
.property-card-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.property-card-metrics span { padding: .55rem .65rem; border-radius: 14px; background: rgba(255,255,255,.72); border: 1px solid rgba(40,40,34,.08); font-size: .88rem; font-weight: 700; }
.property-card-lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.property-card-lists > div { display: grid; gap: .35rem; min-width: 0; }
.property-card-lists a, .property-card-lists small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .86rem; }
.property-entry-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.compact-document-list { max-height: 680px; overflow: auto; padding-right: .25rem; }
.bank-statement-mini-list { display: grid; gap: .65rem; }
.statement-mini-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .7rem; align-items: center; padding: .75rem; border-radius: 16px; background: rgba(255,255,255,.7); border: 1px solid rgba(40,40,34,.08); text-decoration: none; color: inherit; }
.statement-mini-row span { width: 2.1rem; height: 2.1rem; border-radius: 12px; display: grid; place-items: center; background: rgba(95, 128, 161, .16); }
.statement-mini-row strong, .statement-mini-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 780px) {
  .property-card-lists, .property-card-metrics { grid-template-columns: 1fr; }
  .rich-property-grid { grid-template-columns: 1fr; }
}

/* v2.7.18 · Immobilien, Mieteinheiten und Kontoauszugsabgleich */
.property-quick-grid .card { min-width: 0; }
.rental-unit-grid.compact-grid,
.property-entry-grid.compact-grid {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}
.property-rental-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.property-profile-section {
  padding: .95rem;
  border: 1px solid rgba(40, 40, 34, .08);
  border-radius: 18px;
  background: rgba(255,255,255,.58);
}
.subsection-title {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: baseline;
  margin-bottom: .7rem;
}
.subsection-title small { color: var(--muted); font-size: .82rem; }
.property-chip-list,
.property-rent-match-list {
  display: grid;
  gap: .55rem;
}
.property-chip-row,
.property-rent-match-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .75rem;
  align-items: center;
  padding: .72rem .8rem;
  border-radius: 14px;
  background: rgba(247,248,244,.9);
  border: 1px solid rgba(40,40,34,.08);
}
.property-chip-row span,
.property-chip-row small,
.property-rent-match-row small {
  display: block;
}
.button.mini {
  padding: .45rem .7rem;
  font-size: .82rem;
  white-space: nowrap;
}
.property-unit-detail {
  border: 1px solid rgba(40,40,34,.1);
  border-radius: 16px;
  padding: .75rem .85rem;
  background: rgba(255,255,255,.72);
  margin-bottom: .6rem;
}
.property-unit-detail summary {
  cursor: pointer;
  display: grid;
  gap: .2rem;
}
.property-unit-detail summary span,
.property-unit-detail summary small { display: block; }
.property-unit-detail[open] summary { margin-bottom: .9rem; }
@media (max-width: 760px) {
  .property-chip-row,
  .property-rent-match-row,
  .subsection-title { grid-template-columns: 1fr; display: grid; }
}


/* v2.7.21 · CSV-Bankimport */
.transaction-click-card { color: inherit; text-decoration: none; display: block; }
.transaction-main-link { color: inherit; text-decoration: none; border-radius: 18px; }
.transaction-main-link:hover { background: rgba(101, 126, 155, .08); }
.tiny-button { display: inline-flex; margin-top: .45rem; padding: .25rem .55rem; font-size: .78rem; }
.transaction-detail-summary .detail-list dd { overflow-wrap: anywhere; }
.badge.relevant { background: rgba(102, 150, 108, .16); color: #496f4e; }
.badge.irrelevant { background: rgba(130, 130, 120, .14); color: #66645c; }
.badge.pending { background: rgba(183, 143, 83, .18); color: #7d5c2d; }

/* v2.7.21 · CSV-Bankimport */
.transaction-main-link {
  color: inherit;
  text-decoration: none;
}
.transaction-main-link:hover h3 {
  text-decoration: underline;
}
.transaction-click-card {
  transition: transform .16s ease, box-shadow .16s ease;
}
.transaction-click-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 34px rgba(30, 34, 40, .10);
}
.bank-card-statements {
  display: grid;
  gap: .25rem;
  margin-top: .65rem;
}
.bank-card-statements a {
  font-size: .82rem;
  text-decoration: none;
}
.bank-card-statements a:hover {
  text-decoration: underline;
}


/* v2.7.22 · Immobilien-Dashboard kompakter und auswertungsorientiert */
.property-overview-toolbar { margin-bottom: 1.25rem; }
.property-period-form { grid-template-columns: minmax(160px, 240px) minmax(160px, 240px) auto; align-items: end; }
.property-period-metrics { margin-top: 1rem; }
.property-dashboard-grid { grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); }
.property-dashboard-card { display: flex; flex-direction: column; gap: .9rem; }
.property-profit-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; }
.property-profit-strip > div { border: 1px solid rgba(40,40,34,.08); border-radius: 16px; padding: .75rem; background: rgba(255,255,255,.64); }
.property-profit-strip small { display: block; text-transform: uppercase; letter-spacing: .08em; font-size: .68rem; color: rgba(35,35,30,.58); }
.property-profit-strip strong { font-size: 1.25rem; }
.property-profit-strip .positive strong { color: #496f58; }
.property-profit-strip .negative strong { color: #a35e50; }
.property-inline-section { border: 1px solid rgba(40,40,34,.08); border-radius: 18px; background: rgba(255,255,255,.66); padding: .2rem .75rem; }
.property-inline-section > summary { cursor: pointer; padding: .75rem 0; font-weight: 800; display: flex; justify-content: space-between; gap: 1rem; }
.property-inline-section[open] > summary { border-bottom: 1px solid rgba(40,40,34,.08); margin-bottom: .6rem; }
.property-attention-section { background: rgba(251,248,235,.82); border-color: rgba(175,139,76,.24); }
.property-compact-list { display: grid; gap: .45rem; margin: .45rem 0 .75rem; }
.property-compact-list a { display: flex; justify-content: space-between; gap: .75rem; padding: .55rem .7rem; border-radius: 12px; background: rgba(255,255,255,.72); border: 1px solid rgba(40,40,34,.06); text-decoration: none; color: inherit; }
.property-compact-list a span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.property-compact-list a strong { white-space: nowrap; }
.property-unit-payment-card { display: grid; gap: .45rem; padding: .65rem 0; border-bottom: 1px solid rgba(40,40,34,.07); }
.property-unit-payment-card:last-child { border-bottom: 0; }
.property-unit-payment-card small { display: block; color: rgba(35,35,30,.62); }
.mini-list a { padding: .45rem .6rem; font-size: .9rem; }
.quiet-create-section details > summary,
.compact-secondary-property-sections details > summary { cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; align-items: center; font-weight: 800; }
.quiet-create-section details > summary small,
.compact-secondary-property-sections details > summary small { color: rgba(35,35,30,.56); font-weight: 600; }
.property-create-grid { margin-top: 1rem; }
.compact-property-links { margin-top: .2rem; }
@media (max-width: 760px) {
  .property-period-form { grid-template-columns: 1fr; }
  .property-dashboard-grid { grid-template-columns: 1fr; }
  .property-profit-strip { grid-template-columns: 1fr; }
}


/* v2.7.23 · Immobilien-Layoutfix
   Der vorherige Grid-Style für generische Objekt-/Immobilienkarten war spezifischer
   als die Dashboard-Regeln. Dadurch wurden die Immobilienkarten in zwei Spalten
   zerlegt und Inhalte überlagerten sich. Diese Regeln setzen das Dashboard hart zurück. */
.property-list-section {
  overflow: visible;
}
.family-card-grid.property-dashboard-grid,
.property-dashboard-grid.rich-property-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(520px, 1fr)) !important;
  gap: 1.2rem !important;
  align-items: start !important;
}
.family-card-grid.property-dashboard-grid > .property-profile-card.property-dashboard-card,
.property-dashboard-grid > .property-dashboard-card,
.property-card-grid .property-profile-card.property-dashboard-card {
  display: flex !important;
  grid-template-columns: none !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 1rem !important;
  min-width: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
  padding: 1.25rem !important;
}
.property-dashboard-card > * {
  min-width: 0 !important;
  width: 100%;
}
.property-dashboard-card .property-card-head {
  display: grid !important;
  grid-template-columns: 76px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 1rem !important;
}
.property-dashboard-card .property-profile-icon {
  width: 76px !important;
  height: 76px !important;
  border-radius: 24px !important;
  font-size: 2rem !important;
  flex: none !important;
}
.property-dashboard-card .property-card-head h3 {
  margin: .15rem 0 .35rem !important;
  font-size: clamp(1.45rem, 2vw, 1.9rem) !important;
  line-height: 1.05 !important;
  overflow-wrap: anywhere !important;
}
.property-dashboard-card .property-card-head p {
  margin: 0 0 .25rem !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
.property-dashboard-card .property-card-head .muted {
  line-height: 1.35 !important;
}
.property-dashboard-card .property-profit-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: .65rem !important;
  width: 100% !important;
}
.property-dashboard-card .property-profit-strip > div {
  min-width: 0 !important;
  padding: .75rem .8rem !important;
}
.property-dashboard-card .property-profit-strip strong {
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.property-dashboard-card .property-inline-section {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  padding: 0 !important;
}
.property-dashboard-card .property-inline-section > summary {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .75rem !important;
  min-width: 0 !important;
  padding: .85rem 1rem !important;
  line-height: 1.15 !important;
}
.property-dashboard-card .property-inline-section > summary::-webkit-details-marker,
.property-dashboard-card .property-inline-section > summary::marker {
  display: none !important;
  content: "" !important;
}
.property-dashboard-card .property-inline-section > summary::after {
  content: "+";
  flex: 0 0 auto;
  width: 1.45rem;
  height: 1.45rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(37, 41, 34, .08);
  font-weight: 900;
}
.property-dashboard-card .property-inline-section[open] > summary::after {
  content: "−";
}
.property-dashboard-card .property-inline-section[open] {
  padding: 0 1rem 1rem !important;
}
.property-dashboard-card .property-inline-section[open] > summary {
  margin: 0 -1rem .75rem !important;
  border-bottom: 1px solid rgba(40,40,34,.08) !important;
}
.property-dashboard-card .property-compact-list,
.property-dashboard-card .property-rent-match-list {
  min-width: 0 !important;
  width: 100% !important;
}
.property-dashboard-card .property-compact-list a,
.property-dashboard-card .property-rent-match-row {
  min-width: 0 !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
}
.property-dashboard-card .property-card-footer-links {
  width: 100% !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: .85rem !important;
  padding-top: .35rem !important;
}
.property-dashboard-card .property-card-footer-links > div {
  min-width: 0 !important;
  padding: .85rem !important;
  border: 1px solid rgba(40,40,34,.08) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.54) !important;
}
.property-dashboard-card .form-grid.compact-grid {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
}
@media (max-width: 1180px) {
  .family-card-grid.property-dashboard-grid,
  .property-dashboard-grid.rich-property-grid {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 720px) {
  .property-dashboard-card .property-card-head {
    grid-template-columns: 1fr !important;
  }
  .property-dashboard-card .property-profit-strip,
  .property-dashboard-card .property-card-footer-links {
    grid-template-columns: 1fr !important;
  }
}

/* v2.7.25 · Mieteinheiten-Zahlungen verwalten */
.property-payment-manage-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .55rem;
  padding: .75rem;
  border: 1px solid rgba(40,40,34,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.68);
}
.property-payment-main-link {
  display: flex;
  justify-content: space-between;
  gap: .85rem;
  text-decoration: none;
}
.property-payment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  align-items: center;
}
.inline-reassign-form {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  align-items: center;
}
.mini-select {
  min-width: 220px;
  min-height: 34px;
  padding: .35rem .55rem;
  font-size: .86rem;
}
.button.danger {
  border-color: rgba(158,72,60,.28);
  color: #8b3329;
}
.button.danger:hover {
  background: rgba(158,72,60,.08);
}
@media (max-width: 760px) {
  .property-payment-main-link { flex-direction: column; }
  .property-payment-actions,
  .inline-reassign-form { flex-direction: column; align-items: stretch; }
  .mini-select { width: 100%; min-width: 0; }
}

/* ------------------------------------------------------------------
   Familientresor v3 — Klarer Tresor
   Eine neue, ruhige Arbeitsoberfläche über der historischen CSS-Schicht.
------------------------------------------------------------------- */
:root {
  --v3-bg: #f5f7f8;
  --v3-surface: #ffffff;
  --v3-surface-2: #f9fbfb;
  --v3-sidebar: #17212b;
  --v3-sidebar-2: #111922;
  --v3-ink: #16202a;
  --v3-text: #25313d;
  --v3-muted: #647281;
  --v3-faint: #8d9aa6;
  --v3-line: #dce3e8;
  --v3-line-soft: #edf1f4;
  --v3-primary: #1d6f63;
  --v3-primary-2: #185b52;
  --v3-blue: #315f8f;
  --v3-gold: #9a6a22;
  --v3-red: #a8463f;
  --v3-ok: #26724f;
  --v3-shadow: 0 10px 28px rgba(16, 32, 44, .08);
  --v3-shadow-soft: 0 4px 14px rgba(16, 32, 44, .06);
  --radius-xl: 8px;
  --radius-lg: 8px;
  --radius-md: 6px;
  --sidebar: 286px;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --serif: var(--sans);
}

* {
  box-sizing: border-box;
}

html {
  min-height: 100%;
  background: var(--v3-bg);
}

body {
  min-height: 100%;
  margin: 0;
  color: var(--v3-text);
  font-family: var(--sans);
  letter-spacing: 0;
  background:
    linear-gradient(rgba(245, 247, 248, .96), rgba(245, 247, 248, .96)),
    url('/static/img/editorial/archive-shelves.jpg') center top / cover fixed no-repeat;
}

body::before,
body::after,
.ambient {
  display: none !important;
}

a {
  color: var(--v3-primary);
  text-decoration: none;
}

a:hover {
  color: var(--v3-primary-2);
}

small {
  color: var(--v3-muted);
}

h1,
h2,
h3 {
  margin-top: 0;
  color: var(--v3-ink);
  font-family: var(--sans);
  font-weight: 760;
  letter-spacing: 0;
  line-height: 1.13;
  max-width: none;
}

h1 {
  margin-bottom: .7rem;
  font-size: 3rem;
}

h2 {
  margin-bottom: .7rem;
  font-size: 1.45rem;
}

h3 {
  margin-bottom: .55rem;
  font-size: 1.08rem;
}

.lead {
  max-width: 74ch;
  color: var(--v3-muted);
  font-size: 1.03rem;
  line-height: 1.65;
}

.compact-lead,
.small-lead {
  color: var(--v3-muted);
  line-height: 1.58;
}

.eyebrow {
  margin: 0 0 .45rem;
  color: var(--v3-primary);
  font-size: .72rem;
  font-weight: 820;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.app-shell {
  display: grid;
  grid-template-columns: var(--sidebar) minmax(0, 1fr);
  min-height: 100vh;
  position: relative;
  z-index: 1;
}

.sidebar {
  position: sticky;
  top: 0;
  z-index: 20;
  height: 100vh;
  padding: 1.15rem .9rem;
  display: flex;
  flex-direction: column;
  gap: .9rem;
  color: #dce6eb;
  background:
    linear-gradient(rgba(23, 33, 43, .96), rgba(17, 25, 34, .98)),
    url('/static/img/editorial/architecture-facade.jpg') 38% center / cover no-repeat;
  border-right: 1px solid rgba(255, 255, 255, .08);
  box-shadow: none;
  backdrop-filter: none;
}

.sidebar::after {
  display: none;
}

.brand-card {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: .78rem;
  align-items: center;
  padding: .6rem .55rem .95rem;
  color: #fff;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
  border-radius: 0;
  box-shadow: none;
}

.brand-card:hover {
  color: #fff;
}

.brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  color: #0f1b22;
  background: #e9f2ef;
  border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: none;
  font-family: var(--sans);
  font-weight: 820;
  letter-spacing: 0;
}

.brand-card strong {
  display: block;
  color: #fff;
  font-family: var(--sans);
  font-size: 1.02rem;
  font-weight: 820;
  letter-spacing: 0;
  line-height: 1.15;
}

.brand-card small {
  margin-top: .18rem;
  color: rgba(255, 255, 255, .62);
  font-size: .72rem;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

.brand,
.compact-brand {
  color: var(--v3-ink);
  font-family: var(--sans);
  font-weight: 800;
}

.side-nav {
  display: grid;
  gap: .1rem;
  overflow: auto;
  padding: .15rem .2rem .6rem;
  scrollbar-color: rgba(255, 255, 255, .26) transparent;
}

.nav-kicker {
  margin: 1rem .55rem .35rem;
  padding: 0;
  border: 0;
  color: rgba(255, 255, 255, .46);
  font-size: .66rem;
  font-weight: 820;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.nav-kicker:first-child {
  margin-top: .2rem;
}

.side-nav a {
  min-height: 38px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: .55rem;
  padding: .44rem .56rem;
  color: rgba(255, 255, 255, .76);
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  font-size: .92rem;
  font-weight: 650;
  letter-spacing: 0;
  transition: background .14s ease, color .14s ease, border-color .14s ease;
}

.side-nav a span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, .58);
  background: rgba(255, 255, 255, .06);
  border-radius: 7px;
  font-size: .9rem;
}

.side-nav a:hover {
  padding-left: .56rem;
  color: #fff;
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .07);
}

.side-nav a.active,
.side-nav a.nav-action.active {
  color: #fff;
  background: var(--v3-primary);
  border-color: rgba(255, 255, 255, .10);
}

.side-nav a.active span,
.side-nav a.nav-action.active span {
  color: #fff;
  background: rgba(255, 255, 255, .16);
}

.side-footer {
  margin-top: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: .25rem;
  padding: .75rem .2rem 0;
  border-top: 1px solid rgba(255, 255, 255, .12);
}

.side-footer a {
  padding: .52rem .58rem;
  color: rgba(255, 255, 255, .64);
  border-radius: 8px;
  font-size: .86rem;
  font-weight: 650;
}

.side-footer a:hover {
  color: #fff;
  background: rgba(255, 255, 255, .08);
}

.main-area {
  min-width: 0;
  background: rgba(245, 247, 248, .94);
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 15;
  min-height: 68px;
  padding: .75rem 1.25rem;
  display: flex;
  align-items: center;
  gap: .95rem;
  background: rgba(255, 255, 255, .88);
  border-bottom: 1px solid var(--v3-line);
  box-shadow: 0 1px 0 rgba(16, 32, 44, .02);
  backdrop-filter: blur(16px);
}

.topbar-context {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
}

.topbar-context span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  color: var(--v3-primary);
  background: #e7f2ef;
  border: 1px solid #d3e6e1;
  border-radius: 8px;
}

.topbar-context strong {
  display: block;
  color: var(--v3-ink);
  font-size: .98rem;
  font-weight: 800;
}

.topbar-context small {
  display: block;
  margin-top: .1rem;
}

.global-search {
  flex: 1;
  max-width: 780px;
  position: relative;
  display: flex;
  align-items: center;
}

.global-search span {
  position: absolute;
  left: .8rem;
  z-index: 1;
  color: var(--v3-muted);
  font-weight: 800;
}

.global-search input {
  min-height: 44px;
  padding-left: 2.2rem;
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  background: var(--v3-surface-2);
  box-shadow: none;
}

.top-actions {
  display: flex;
  gap: .45rem;
  align-items: center;
  overflow-x: auto;
  padding-bottom: .05rem;
  margin-left: auto;
}

.user-chip {
  flex: 0 0 auto;
  padding: .5rem .72rem;
  color: var(--v3-text);
  background: var(--v3-surface-2);
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  font-size: .86rem;
  font-weight: 720;
}

.container {
  max-width: 1480px;
  margin: 0 auto;
  padding: 1.6rem clamp(1.25rem, 3vw, 2.6rem) 3rem;
}

.page-header {
  display: flex;
  gap: 1rem;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 1.2rem;
  padding: 0 0 1rem;
  border-bottom: 1px solid var(--v3-line);
}

.page-header h1 {
  font-size: 2.25rem;
}

.hero-panel,
.page-hero {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 1.25rem;
  align-items: stretch;
  margin-bottom: 1.4rem;
  padding: 1.6rem;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .98), rgba(255, 255, 255, .88) 54%, rgba(255, 255, 255, .30)),
    url('/static/img/editorial/archive-desk.jpg') center right / cover no-repeat;
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  box-shadow: var(--v3-shadow);
  overflow: hidden;
}

.hero-panel::before,
.hero-panel::after,
.page-hero::before,
.page-hero::after {
  display: none;
}

.hero-panel h1,
.page-hero h1 {
  max-width: 760px;
  font-size: 2.65rem;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1.05rem;
}

.hero-card,
.hero-stat-card,
.process-card,
.hero-quick-actions {
  display: grid;
  gap: .55rem;
  align-content: start;
  padding: 1rem;
  color: #fff;
  background:
    linear-gradient(rgba(23, 33, 43, .91), rgba(17, 25, 34, .94)),
    url('/static/img/editorial/archive-shelves.jpg') center / cover no-repeat;
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 8px;
  box-shadow: none;
}

.hero-card::before,
.hero-stat-card::before {
  display: none;
}

.hero-card strong,
.hero-stat-card strong {
  color: #fff;
  font-weight: 800;
}

.hero-card a {
  color: rgba(255, 255, 255, .86);
  padding: .52rem 0;
  border-top: 1px solid rgba(255, 255, 255, .13);
  font-weight: 650;
}

.hero-card a:hover {
  color: #fff;
}

.visual-story-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(260px, .95fr);
  gap: 1rem;
  margin-bottom: 1.2rem;
}

.editorial-image-panel {
  min-height: 260px;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  background: url('/static/img/editorial/archive-shelves.jpg') center / cover no-repeat;
}

.editorial-image-panel::before,
.editorial-image-panel::after {
  display: none;
}

.editorial-image-caption {
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  max-width: 540px;
  padding: 1rem;
  color: #fff;
  background: rgba(17, 25, 34, .82);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 8px;
}

.editorial-image-caption h2,
.editorial-image-caption p,
.editorial-image-caption small {
  color: #fff;
}

.card,
.mini-card,
.metric-card,
.metric-row div,
.formset-row,
.inner-card,
.property-payment-manage-row {
  background: var(--v3-surface);
  border: 1px solid var(--v3-line);
  border-radius: 8px !important;
  box-shadow: var(--v3-shadow-soft);
}

.card {
  padding: 1.2rem;
  margin-bottom: 1.1rem;
  backdrop-filter: none;
}

.card.narrow {
  max-width: 560px;
  margin: 3rem auto;
}

.feature-card {
  min-height: 100%;
}

.accent-card,
.premium-card,
.info-card,
.story-card,
.family-dashboard-card,
.dashboard-deadline-card {
  background: var(--v3-surface);
}

.section-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .9rem;
  margin-bottom: .95rem;
  padding-bottom: .8rem;
  border-bottom: 1px solid var(--v3-line-soft);
}

.section-title h2 {
  margin-bottom: 0;
  max-width: none;
  font-size: 1.25rem;
}

.grid.two {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.grid.three {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.card-grid,
.compact-cards,
.compact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: .85rem;
}

.actions,
.form-actions,
.pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-items: center;
}

.actions {
  margin-bottom: 1rem;
}

.actions.small {
  margin-bottom: 0;
}

.button,
button.button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .38rem;
  padding: .58rem .82rem;
  color: var(--v3-text);
  background: #fff;
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  box-shadow: none !important;
  cursor: pointer;
  font: inherit;
  font-size: .9rem;
  font-weight: 720;
  letter-spacing: 0;
  transition: background .14s ease, border-color .14s ease, color .14s ease, transform .14s ease;
}

.button:hover,
button.button:hover {
  color: var(--v3-primary);
  background: #eef7f4;
  border-color: #cfe5df;
  transform: none;
}

.button.primary {
  color: #fff;
  background: var(--v3-primary);
  border-color: var(--v3-primary);
}

.button.primary:hover {
  color: #fff;
  background: var(--v3-primary-2);
  border-color: var(--v3-primary-2);
}

.button.ghost {
  color: var(--v3-muted);
  background: var(--v3-surface-2);
  border-color: var(--v3-line);
}

.button.ghost:hover {
  color: var(--v3-text);
  background: #eef2f4;
}

.button.large {
  min-height: 42px;
  padding: .62rem .92rem;
}

.button.mini,
.button.small {
  min-height: 32px;
  padding: .36rem .58rem;
  font-size: .82rem;
}

.button.danger,
.danger-link {
  color: var(--v3-red);
  border-color: #efcfca;
}

.button.danger:hover {
  color: #fff;
  background: var(--v3-red);
  border-color: var(--v3-red);
}

.metric-row,
.visual-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: .85rem;
  margin: 1rem 0 1.2rem;
}

.metric-row div,
.metric-card {
  min-height: 116px;
  position: relative;
  display: grid;
  align-content: space-between;
  padding: 1rem;
  overflow: hidden;
  color: var(--v3-text);
  background: var(--v3-surface);
}

.metric-card:hover {
  color: var(--v3-text);
  border-color: #c7d7dd;
  box-shadow: var(--v3-shadow);
  transform: none;
}

.metric-card::before,
.metric-row div::before {
  display: none;
}

.metric-row span,
.metric-card span:not(.metric-icon) {
  display: block;
  color: var(--v3-ink);
  font-family: var(--sans);
  font-size: 2.05rem;
  font-weight: 820;
  line-height: 1;
  letter-spacing: 0;
}

.metric-row small,
.metric-card small {
  display: block;
  margin-top: .65rem;
  color: var(--v3-muted);
  font-size: .72rem;
  font-weight: 760;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.metric-icon {
  display: grid !important;
  width: 28px;
  height: 28px;
  place-items: center;
  margin-bottom: .7rem;
  color: var(--v3-primary);
  background: #e7f2ef;
  border-radius: 7px;
  font-size: .85rem;
}

.badge,
.status-pill {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: .18rem .48rem;
  color: var(--v3-blue);
  background: #eef4fa;
  border: 1px solid #d9e6f2;
  border-radius: 999px;
  font-size: .74rem;
  font-weight: 760;
  letter-spacing: 0;
  white-space: nowrap;
}

.badge.muted {
  color: var(--v3-muted);
  background: #f2f5f7;
  border-color: var(--v3-line);
}

.badge.success,
.status-pill.ok {
  color: var(--v3-ok);
  background: #e9f6ef;
  border-color: #cce8d8;
}

.badge.danger,
.status-pill.danger {
  color: var(--v3-red);
  background: #fbefee;
  border-color: #efcfca;
}

.warning-badge,
.status-pill.warn,
.status-pill.warning {
  color: var(--v3-gold);
  background: #fff6e7;
  border-color: #f0dfb8;
}

.warning {
  padding: .8rem .9rem;
  color: #73521b;
  background: #fff7e7;
  border: 1px solid #efd9aa;
  border-radius: 8px;
}

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

.task-list li {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  align-items: center;
  justify-content: space-between;
  padding: .72rem 0;
  border-bottom: 1px solid var(--v3-line-soft);
}

.task-list li:last-child {
  border-bottom: 0;
}

.rich-list strong {
  color: var(--v3-ink);
  font-family: var(--sans);
  font-size: 1rem;
  font-weight: 800;
}

.timeline-list {
  display: grid;
  gap: .8rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.timeline-list li {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  gap: .75rem;
  align-items: start;
}

.timeline-dot {
  width: 9px;
  height: 9px;
  margin-top: .42rem;
  border-radius: 999px;
  background: var(--v3-primary);
  box-shadow: 0 0 0 4px #e1f0ec;
}

.shortcut-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: .65rem;
}

.shortcut-grid a,
.pill-row a {
  display: flex;
  align-items: center;
  gap: .55rem;
  min-height: 42px;
  padding: .65rem .75rem;
  color: var(--v3-text);
  background: var(--v3-surface-2);
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  font-weight: 700;
}

.shortcut-grid a:hover,
.pill-row a:hover {
  color: var(--v3-primary);
  background: #eef7f4;
  border-color: #cfe5df;
}

.shortcut-grid a span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  color: var(--v3-primary);
  background: #e7f2ef;
  border: 0;
  border-radius: 7px;
  padding: 0;
}

.mini-card {
  padding: .95rem;
  color: var(--v3-text);
  box-shadow: none;
}

.mini-card::after {
  display: none;
}

.document-tile {
  display: grid;
  gap: .32rem;
}

.document-tile:hover {
  color: var(--v3-text);
  border-color: #c7d7dd;
  transform: none;
}

.doc-icon,
.file-avatar {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  color: var(--v3-primary);
  background: #e7f2ef;
  border: 1px solid #d3e6e1;
  border-radius: 8px;
  font-size: .8rem;
  font-weight: 820;
}

.empty-state {
  padding: 1.4rem;
  color: var(--v3-muted);
  text-align: left;
  background: var(--v3-surface-2);
  border: 1px dashed #cbd6de;
  border-radius: 8px;
}

.small-empty {
  padding: 1rem;
}

.form-grid,
.stacked-form,
.compact-form {
  display: grid;
  gap: .95rem;
}

.filter-grid,
.compact-grid,
.invoice-flow .compact-grid,
.property-dashboard-card .form-grid.compact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap: .9rem;
}

.form-field,
form p {
  display: grid;
  gap: .38rem;
  margin: 0;
}

.form-field label,
form p label {
  color: var(--v3-muted);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

input,
select,
textarea {
  width: 100%;
  min-height: 42px;
  padding: .66rem .76rem;
  color: var(--v3-text);
  background: #fff;
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  box-shadow: none;
  font: inherit;
  font-size: .95rem;
  outline: none;
  transition: border-color .14s ease, box-shadow .14s ease;
}

input:focus,
select:focus,
textarea:focus {
  background: #fff;
  border-color: var(--v3-primary);
  box-shadow: 0 0 0 3px rgba(29, 111, 99, .12);
}

textarea {
  min-height: 8rem;
  line-height: 1.55;
}

select[multiple] {
  min-height: 132px;
}

input[type="checkbox"],
input[type="radio"] {
  width: auto;
  min-height: auto;
  accent-color: var(--v3-primary);
}

.checkbox-field {
  display: flex;
  gap: .55rem;
  align-items: flex-start;
}

.radio-group ul {
  display: grid;
  gap: .5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.radio-group li {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem .7rem;
  background: var(--v3-surface-2);
  border: 1px solid var(--v3-line);
  border-radius: 8px;
}

.file-field input[type="file"] {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}

.file-preview-label {
  min-height: 190px;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: .45rem;
  padding: 1.3rem;
  color: var(--v3-text);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .96), rgba(255, 255, 255, .78)),
    url('/static/img/editorial/paper-stack.jpg') right center / cover no-repeat;
  border: 1px dashed #b8c7d0;
  border-radius: 8px;
  cursor: pointer;
}

.file-preview-label strong {
  color: var(--v3-ink);
  font-family: var(--sans);
  font-size: 1.35rem;
  font-weight: 800;
  letter-spacing: 0;
}

.file-preview-label em {
  color: var(--v3-primary);
  font-style: normal;
  font-weight: 720;
}

.file-preview-label.dragging,
.file-preview-label.has-file {
  border-color: var(--v3-primary);
  box-shadow: 0 0 0 3px rgba(29, 111, 99, .10);
}

.messages {
  display: grid;
  gap: .6rem;
  margin-bottom: 1rem;
}

.message {
  padding: .78rem .9rem;
  color: var(--v3-text);
  background: #edf8f4;
  border: 1px solid #cfe9df;
  border-radius: 8px;
  box-shadow: none;
}

.error {
  color: var(--v3-red);
}

.split {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr);
  gap: 1rem;
  align-items: start;
}

.side-stack {
  display: grid;
  gap: 1rem;
}

.preview-pane iframe {
  width: 100%;
  height: min(74vh, 820px);
  background: #fff;
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  box-shadow: none;
}

.preview-pane img,
.statement-image-preview,
.import-image-preview {
  max-width: 100%;
  border: 1px solid var(--v3-line);
  border-radius: 8px;
  box-shadow: none;
}

.definition-list {
  display: grid;
  gap: .55rem;
  margin: 0;
}

.definition-list div {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: .75rem;
  padding: .6rem 0;
  border-bottom: 1px solid var(--v3-line-soft);
}

.definition-list dt {
  color: var(--v3-muted);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.definition-list dd {
  margin: 0;
}

.table-wrap {
  overflow-x: auto;
  background: #fff;
  border: 1px solid var(--v3-line);
  border-radius: 8px;
}

table,
.data-table,
.table-card .data-table,
.report-summary + .table-card .data-table,
.card:not(.table-card) .data-table {
  width: 100%;
  display: table;
  border-collapse: collapse;
  background: transparent;
}

thead,
.table-card .data-table thead,
.report-summary + .table-card .data-table thead {
  display: table-header-group;
}

tbody,
.table-card .data-table tbody,
.report-summary + .table-card .data-table tbody {
  display: table-row-group;
}

tr,
.table-card .data-table tr,
.report-summary + .table-card .data-table tr {
  display: table-row;
  min-height: 0;
  padding: 0;
  background: transparent;
  border: 0;
}

th,
td,
.table-card .data-table td,
.report-summary + .table-card .data-table td {
  display: table-cell;
  padding: .82rem .85rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--v3-line-soft);
}

th {
  color: var(--v3-muted);
  background: var(--v3-surface-2);
  font-size: .72rem;
  font-weight: 820;
  letter-spacing: .08em;
  text-transform: uppercase;
}

tr:hover td {
  background: #fbfcfd;
}

.title-cell {
  display: table-cell;
}

.title-cell strong {
  color: var(--v3-ink);
  font-family: var(--sans);
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0;
}

.dashboard-deadline-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: .65rem;
  margin-bottom: .95rem;
}

.dashboard-deadline-stats a {
  display: grid;
  gap: .3rem;
  padding: .8rem;
  color: var(--v3-text);
  background: var(--v3-surface-2);
  border: 1px solid var(--v3-line);
  border-radius: 8px;
}

.dashboard-deadline-stats strong {
  color: var(--v3-ink);
  font-size: 1.55rem;
  font-weight: 820;
}

.dashboard-deadline-stats span {
  color: var(--v3-muted);
  font-size: .76rem;
  font-weight: 760;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.inbox-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .9rem;
  padding: .95rem 0;
  border-bottom: 1px solid var(--v3-line-soft);
}

.inbox-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  justify-content: flex-end;
}

.sticky-actions {
  position: sticky;
  bottom: 0;
  z-index: 5;
  padding: .85rem 0;
  background: rgba(245, 247, 248, .90);
  border-top: 1px solid var(--v3-line);
  backdrop-filter: blur(12px);
}

.locked-preview,
.ocr-text {
  padding: 1rem;
  background: var(--v3-surface-2);
  border: 1px solid var(--v3-line);
  border-radius: 8px;
}

.ocr-text {
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
}

details.inline-details {
  margin-top: .45rem;
}

details.inline-details summary {
  color: var(--v3-primary);
  cursor: pointer;
  font-size: .86rem;
  font-weight: 760;
}

.inline-form {
  display: inline-flex;
  gap: .45rem;
  align-items: center;
  margin: .2rem .35rem .2rem 0;
}

.compact-form input {
  min-height: 36px;
}

.mini-select {
  min-width: 220px;
  min-height: 36px;
}

.property-dashboard-card .property-card-footer-links > div,
.property-payment-manage-row {
  border-radius: 8px !important;
  background: var(--v3-surface-2) !important;
  border-color: var(--v3-line) !important;
}

@media (max-width: 1180px) {
  :root {
    --sidebar: 250px;
  }

  .top-actions {
    max-width: 42vw;
  }

  .hero-panel,
  .page-hero {
    grid-template-columns: 1fr;
  }

  .visual-story-grid,
  .grid.two,
  .grid.three,
  .split {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 860px) {
  :root {
    --sidebar: 100%;
  }

  .app-shell {
    display: block;
  }

  .sidebar {
    position: static;
    height: auto;
    padding: .9rem;
  }

  .side-nav {
    max-height: 360px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .side-footer {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .topbar {
    position: static;
    flex-direction: column;
    align-items: stretch;
  }

  .top-actions {
    max-width: none;
    margin-left: 0;
  }

  .page-header,
  .section-title {
    align-items: flex-start;
    flex-direction: column;
  }

  h1,
  .hero-panel h1,
  .page-hero h1,
  .page-header h1 {
    font-size: 2rem;
  }

  .container {
    width: 100%;
    max-width: 100%;
    padding: 1rem;
    overflow-x: clip;
  }

  .hero-panel,
  .page-hero {
    padding: 1rem;
  }

  .inbox-item {
    grid-template-columns: 1fr;
  }

  .inbox-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .side-nav {
    grid-template-columns: 1fr;
  }

  .side-footer {
    grid-template-columns: 1fr;
  }

  .metric-row,
  .visual-metrics,
  .dashboard-deadline-stats,
  .shortcut-grid,
  .card-grid,
  .compact-cards,
  .compact-grid,
  .filter-grid {
    grid-template-columns: 1fr !important;
  }

  th,
  td,
  .table-card .data-table td {
    padding: .72rem;
  }
}

@media (max-width: 860px) {
  .main-area,
  .container,
  .card,
  .feature-card,
  .accent-card,
  .stacked-form,
  .form-field,
  .section-title,
  .data-table,
  table {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .grid.two,
  .grid.three,
  .visual-story-grid,
  .dashboard-grid {
    width: 100%;
    min-width: 0;
  }

  .card {
    width: 100%;
  }

  .card .data-table {
    display: block;
    overflow-x: auto;
  }

  .card .data-table thead,
  .card .data-table tbody,
  .card .data-table tr {
    min-width: 0;
  }
}
