:root {
  --justiz: #14352a;
  --justiz-tief: #0b1f18;
  --justiz-hell: #1d4a3a;
  --messing: #a67c3d;
  --messing-hell: #c9a267;
  --siegel: #8a2b2b;
  --akte: #f4f4f0;
  --akte-2: #e9e8e1;
  --akte-3: #dcdbd2;
  --papier: #fdfdfb;
  --tinte: #1a1d1b;
  --grau: #6b706c;
  --grau-hell: #9aa09b;
  --linie: #d5d4cb;

  --straf: #8a2b2b;
  --zivil: #2f5d50;
  --verwaltung: #33546e;

  --ok: #2f6b4f;
  --warn: #9a6c1f;
  --bad: #8a2b2b;

  --serif: "Spectral", "Iowan Old Style", Georgia, serif;
  --sans: "IBM Plex Sans", -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "IBM Plex Mono", "SF Mono", Consolas, monospace;

  --r: 3px;
  --shadow: 0 1px 2px rgba(20, 53, 42, .06), 0 8px 24px -12px rgba(20, 53, 42, .18);
  --shadow-lift: 0 2px 4px rgba(20, 53, 42, .08), 0 18px 40px -18px rgba(20, 53, 42, .28);
  --wrap: 1180px;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
  color: var(--tinte);
  background: var(--akte);
  font-feature-settings: "kern", "liga";
}

h1, h2, h3, h4 { font-family: var(--serif); font-weight: 600; line-height: 1.2; margin: 0 0 .5em; letter-spacing: -.01em; }
h1 { font-size: clamp(2rem, 4.4vw, 3.1rem); }
h2 { font-size: clamp(1.4rem, 2.6vw, 1.95rem); }
h3 { font-size: 1.2rem; }
h4 { font-size: 1rem; font-family: var(--sans); font-weight: 600; }
p { margin: 0 0 1em; }
a { color: var(--justiz); text-decoration-color: var(--messing); text-underline-offset: 3px; }
a:hover { color: var(--justiz-hell); }
img { max-width: 100%; height: auto; }
hr { border: 0; border-top: 1px solid var(--linie); margin: 2rem 0; }

:focus-visible { outline: 2px solid var(--messing); outline-offset: 2px; border-radius: 2px; }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.wrap-narrow { max-width: 780px; margin: 0 auto; padding: 0 24px; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 12px; top: 12px; z-index: 999; background: var(--justiz); color: #fff; padding: 10px 16px; }

.eyebrow {
  font-family: var(--mono);
  font-size: .69rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--messing);
  display: block;
  margin-bottom: .8rem;
}
.eyebrow-dark { color: var(--messing-hell); }

.lead { font-size: 1.12rem; color: #3a4340; max-width: 62ch; }
.muted { color: var(--grau); }
.small { font-size: .86rem; }
.mono { font-family: var(--mono); font-size: .88em; letter-spacing: -.01em; }
.az { font-family: var(--mono); font-size: .82rem; font-weight: 500; color: var(--justiz); letter-spacing: .02em; }

.topbar {
  background: var(--justiz-tief);
  color: rgba(255, 255, 255, .72);
  font-size: .78rem;
  padding: 7px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .07);
}
.topbar .wrap { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.topbar a { color: rgba(255, 255, 255, .82); text-decoration: none; }
.topbar a:hover { color: var(--messing-hell); }

.masthead { background: var(--justiz); color: #fff; }
.masthead .wrap { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding-top: 20px; padding-bottom: 20px; }
.brand { display: flex; align-items: center; gap: 16px; text-decoration: none; color: #fff; }
.brand:hover { color: #fff; }
.brand-text strong { display: block; font-family: var(--serif); font-size: 1.22rem; font-weight: 600; letter-spacing: -.01em; }
.brand-text span { display: block; font-family: var(--mono); font-size: .66rem; letter-spacing: .17em; text-transform: uppercase; color: var(--messing-hell); }

.nav { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.nav a {
  color: rgba(255, 255, 255, .8);
  text-decoration: none;
  font-size: .9rem;
  padding: 8px 12px;
  border-bottom: 2px solid transparent;
}
.nav a:hover { color: #fff; border-bottom-color: rgba(201, 162, 103, .5); }
.nav a.on { color: #fff; border-bottom-color: var(--messing); }
.nav-toggle { display: none; background: none; border: 1px solid rgba(255,255,255,.25); color: #fff; padding: 8px 12px; border-radius: var(--r); font-size: .9rem; cursor: pointer; }

.hero {
  background: var(--justiz);
  color: #fff;
  padding: 72px 0 76px;
  position: relative;
  overflow: hidden;
  border-bottom: 3px solid var(--messing);
}
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.028) 0 1px, transparent 1px 68px);
  pointer-events: none;
}
.hero .wrap { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; gap: 56px; align-items: center; }
.hero .hero-formula {
  font-family: var(--serif);
  font-size: clamp(2.1rem, 5vw, 3.5rem);
  line-height: 1.08;
  font-weight: 500;
  margin: 0 0 20px;
  letter-spacing: -.02em;
}
.hero .hero-formula em { font-style: normal; color: var(--messing-hell); display: block; }
.hero .hero-lead { color: rgba(255, 255, 255, .78); max-width: 54ch; font-size: 1.06rem; }

.siegel {
  width: 168px; height: 168px;
  border: 2px solid var(--messing);
  border-radius: 50%;
  display: grid; place-items: center;
  text-align: center;
  position: relative;
  flex-shrink: 0;
}
.siegel::before {
  content: "";
  position: absolute; inset: 9px;
  border: 1px solid rgba(201, 162, 103, .42);
  border-radius: 50%;
}
.siegel-inner { font-family: var(--mono); font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: var(--messing-hell); line-height: 1.9; }
.siegel-inner strong { display: block; font-family: var(--serif); font-size: 1.5rem; letter-spacing: 0; color: #fff; text-transform: none; margin: 2px 0; }

.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }

.btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--sans); font-size: .92rem; font-weight: 500;
  padding: 11px 20px;
  border-radius: var(--r);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
  line-height: 1.3;
}
.btn-primary { background: var(--messing); color: #16211c; border-color: var(--messing); }
.btn-primary:hover { background: var(--messing-hell); color: #16211c; }
.btn-ghost { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .34); }
.btn-ghost:hover { border-color: var(--messing); color: #fff; }
.btn-solid { background: var(--justiz); color: #fff; border-color: var(--justiz); }
.btn-solid:hover { background: var(--justiz-hell); color: #fff; }
.btn-line { background: var(--papier); color: var(--justiz); border-color: var(--linie); }
.btn-line:hover { border-color: var(--justiz); }
.btn-danger { background: var(--siegel); color: #fff; border-color: var(--siegel); }
.btn-danger:hover { background: #a03434; color: #fff; }
.btn-sm { padding: 7px 13px; font-size: .84rem; }
.btn[disabled] { opacity: .5; pointer-events: none; }

.section { padding: 68px 0; }
.section-tight { padding: 44px 0; }
.section-alt { background: var(--akte-2); }
.section-dark { background: var(--justiz); color: #fff; }
.section-dark h2, .section-dark h3 { color: #fff; }
.section-dark p { color: rgba(255, 255, 255, .76); }
.section-head { margin-bottom: 34px; max-width: 68ch; }

.grid { display: grid; gap: 20px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.grid-sidebar { grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; align-items: start; }

.card {
  background: var(--papier);
  border: 1px solid var(--linie);
  border-radius: var(--r);
  padding: 22px 24px;
  box-shadow: var(--shadow);
}
.card-link { text-decoration: none; color: inherit; display: block; transition: box-shadow .18s, transform .18s, border-color .18s; }
.card-link:hover { box-shadow: var(--shadow-lift); transform: translateY(-2px); border-color: var(--messing); color: inherit; }
.card h3 { margin-bottom: .35em; }
.card-flush { padding: 0; overflow: hidden; }

.akte-karte { position: relative; padding-left: 30px; }
.akte-karte::before {
  content: "";
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 7px;
  background: var(--grau-hell);
  border-radius: var(--r) 0 0 var(--r);
}
.akte-karte.t-straf::before { background: var(--straf); }
.akte-karte.t-zivil::before { background: var(--zivil); }
.akte-karte.t-verwaltung::before { background: var(--verwaltung); }
.akte-karte.t-straf { border-left-color: transparent; }

.stamp {
  display: inline-block;
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .13em;
  text-transform: uppercase;
  padding: 4px 10px;
  border: 1.5px solid currentColor;
  border-radius: 2px;
  transform: rotate(-1.4deg);
  font-weight: 500;
}
.stamp-ok { color: var(--ok); }
.stamp-warn { color: var(--warn); }
.stamp-bad { color: var(--bad); }
.stamp-neutral { color: var(--grau); }

.tag {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--mono); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase;
  padding: 3px 9px; border-radius: 2px;
  background: var(--akte-2); color: #46504b; border: 1px solid var(--akte-3);
}
.tag-ok { background: rgba(47, 107, 79, .1); color: var(--ok); border-color: rgba(47, 107, 79, .28); }
.tag-warn { background: rgba(154, 108, 31, .1); color: var(--warn); border-color: rgba(154, 108, 31, .28); }
.tag-bad { background: rgba(138, 43, 43, .09); color: var(--bad); border-color: rgba(138, 43, 43, .26); }
.tag-straf { background: rgba(138, 43, 43, .09); color: var(--straf); border-color: rgba(138, 43, 43, .26); }
.tag-zivil { background: rgba(47, 93, 80, .1); color: var(--zivil); border-color: rgba(47, 93, 80, .28); }
.tag-verwaltung { background: rgba(51, 84, 110, .1); color: var(--verwaltung); border-color: rgba(51, 84, 110, .28); }

.rows { display: flex; flex-direction: column; gap: 12px; }

.paragraph-item {
  background: var(--papier);
  border: 1px solid var(--linie);
  border-left: 4px solid var(--justiz);
  border-radius: var(--r);
  padding: 18px 22px;
}
.paragraph-item.owi { border-left-color: var(--messing); }
.paragraph-item.verbrechen { border-left-color: var(--siegel); }
.paragraph-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
.paragraph-nr { font-family: var(--mono); font-size: 1rem; font-weight: 600; color: var(--justiz); }
.paragraph-title { font-family: var(--serif); font-size: 1.12rem; font-weight: 600; }
.paragraph-body { color: #3a4340; margin: 0 0 10px; }
.paragraph-meta { display: flex; gap: 14px; flex-wrap: wrap; font-size: .8rem; color: var(--grau); font-family: var(--mono); }

.normtext { font-family: var(--serif); font-size: 1.04rem; line-height: 1.78; color: #262c29; }
.normtext p, .normtext .norm-abs { margin: 0 0 .9em; }
.normtext p:last-child, .normtext .norm-abs:last-child { margin-bottom: 0; }
.normtext .norm-liste { margin: .5em 0 .2em; padding: 0; display: grid; grid-template-columns: auto 1fr; gap: .15em .7em; }
.normtext .norm-liste dt { font-family: var(--mono); font-size: .84em; color: var(--messing); padding-top: .18em; white-space: nowrap; }
.normtext .norm-liste dd { margin: 0; }
.normtext .gesperrt { letter-spacing: .09em; }
.normtext .kommentar { color: var(--grau); font-style: italic; }
.normtext .norm-tabelle { margin: .8em 0; font-family: var(--sans); font-size: .88rem; border: 1px solid var(--linie); }
.normtext .norm-tabelle td { padding: 7px 11px; border-bottom: 1px solid var(--akte-2); }
.normtext sup { font-size: .7em; }
.normtext u { text-decoration: none; border-bottom: 1px solid var(--akte-3); }

.fussnoten { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--linie); font-size: .84rem; color: var(--grau); }
.fussnoten p { margin: 0 0 .4em; }

.buchleiste { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 22px; }
.buchleiste a {
  display: inline-flex; align-items: baseline; gap: 7px;
  font-family: var(--mono); font-size: .78rem;
  padding: 7px 13px; border: 1px solid var(--linie); border-radius: var(--r);
  background: var(--papier); color: var(--justiz); text-decoration: none;
}
.buchleiste a:hover { border-color: var(--messing); }
.buchleiste a.on { background: var(--justiz); color: #fff; border-color: var(--justiz); }
.buchleiste a .zahl { font-size: .7rem; opacity: .6; }
.buchleiste a.ortsrecht { border-left: 3px solid var(--messing); }

.quelle {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .78rem; color: var(--grau); text-decoration: none;
}
.quelle:hover { color: var(--justiz); }

.rahmen-karte { background: var(--akte); border: 1px solid var(--akte-3); border-radius: var(--r); padding: 14px 16px; }
.rahmen-karte .werte { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 8px; }
.rahmen-karte .wert strong { display: block; font-family: var(--serif); font-size: 1.25rem; color: var(--justiz); line-height: 1.2; }
.rahmen-karte .wert span { font-family: var(--mono); font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--grau); }

.fortschritt { height: 8px; background: var(--akte-2); border-radius: 4px; overflow: hidden; }
.fortschritt div { height: 100%; background: var(--justiz); transition: width .3s; }

.protokoll-zeile { font-family: var(--mono); font-size: .8rem; padding: 5px 0; border-bottom: 1px solid var(--akte-2); display: flex; gap: 10px; }
.protokoll-zeile .ok { color: var(--ok); } .protokoll-zeile .bad { color: var(--bad); }

.ablauf { counter-reset: step; display: grid; gap: 0; }
.ablauf-step {
  display: grid;
  grid-template-columns: 62px 1fr;
  gap: 22px;
  padding: 22px 0;
  border-bottom: 1px solid var(--linie);
  position: relative;
}
.ablauf-step:last-child { border-bottom: 0; }
.ablauf-num {
  counter-increment: step;
  font-family: var(--mono);
  font-size: .8rem;
  color: var(--messing);
  padding-top: 4px;
}
.ablauf-num::before { content: counter(step, decimal-leading-zero); }
.ablauf-step h3 { margin-bottom: .25em; }
.ablauf-step p { margin: 0; color: #404945; }
.ablauf-actor { font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--grau); display: block; margin-top: 8px; }

.timeline { position: relative; padding-left: 26px; }
.timeline::before { content: ""; position: absolute; left: 6px; top: 6px; bottom: 6px; width: 1px; background: var(--linie); }
.timeline-item { position: relative; padding-bottom: 22px; }
.timeline-item::before {
  content: ""; position: absolute; left: -24px; top: 7px;
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--papier); border: 2px solid var(--messing);
}
.timeline-item strong { display: block; font-size: .96rem; }
.timeline-meta { font-family: var(--mono); font-size: .72rem; color: var(--grau); }

table { width: 100%; border-collapse: collapse; font-size: .92rem; }
th {
  text-align: left;
  font-family: var(--mono);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--grau);
  font-weight: 500;
  padding: 10px 14px;
  border-bottom: 1px solid var(--linie);
  background: var(--akte-2);
  white-space: nowrap;
}
td { padding: 12px 14px; border-bottom: 1px solid var(--linie); vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: rgba(20, 53, 42, .022); }
.table-wrap { overflow-x: auto; border: 1px solid var(--linie); border-radius: var(--r); background: var(--papier); }
td a { font-weight: 500; }

.field { margin-bottom: 18px; }
.field label { display: block; font-size: .82rem; font-weight: 500; margin-bottom: 6px; color: #303836; }
.field .hint { font-size: .78rem; color: var(--grau); margin-top: 5px; }
.field .err { font-size: .78rem; color: var(--siegel); margin-top: 5px; }
input[type=text], input[type=password], input[type=email], input[type=number],
input[type=date], input[type=datetime-local], input[type=search], select, textarea {
  width: 100%;
  font-family: var(--sans);
  font-size: .94rem;
  padding: 10px 13px;
  border: 1px solid var(--akte-3);
  border-radius: var(--r);
  background: var(--papier);
  color: var(--tinte);
}
textarea { min-height: 130px; resize: vertical; line-height: 1.6; }
input:focus, select:focus, textarea:focus { border-color: var(--justiz); outline: none; box-shadow: 0 0 0 3px rgba(20, 53, 42, .1); }
input.invalid, textarea.invalid, select.invalid { border-color: var(--siegel); }
select { appearance: none; background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4.5L6 8.5L10 4.5' stroke='%236b706c' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 11px center; padding-right: 34px; }
.check { display: flex; align-items: flex-start; gap: 10px; font-size: .9rem; }
.check input { width: auto; margin-top: 3px; }
.form-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.form-row-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.form-actions { display: flex; gap: 12px; align-items: center; padding-top: 8px; flex-wrap: wrap; }

.filterbar {
  display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end;
  background: var(--papier); border: 1px solid var(--linie); border-radius: var(--r);
  padding: 16px 18px; margin-bottom: 22px;
}
.filterbar .field { margin-bottom: 0; min-width: 150px; flex: 1; }
.filterbar .field-wide { flex: 2.2; }

.flash { border-radius: var(--r); padding: 13px 18px; margin-bottom: 18px; font-size: .92rem; border-left: 4px solid; background: var(--papier); border: 1px solid var(--linie); }
.flash-success { border-left-color: var(--ok); }
.flash-error { border-left-color: var(--siegel); }
.flash-info { border-left-color: var(--messing); }

.empty { text-align: center; padding: 54px 24px; color: var(--grau); border: 1px dashed var(--akte-3); border-radius: var(--r); background: var(--papier); }
.empty strong { display: block; font-family: var(--serif); font-size: 1.15rem; color: var(--tinte); margin-bottom: 6px; }

.pager { display: flex; gap: 6px; justify-content: center; margin-top: 26px; flex-wrap: wrap; }
.pager a, .pager span {
  font-family: var(--mono); font-size: .8rem;
  padding: 7px 12px; border: 1px solid var(--linie); border-radius: var(--r);
  text-decoration: none; background: var(--papier); color: var(--justiz);
}
.pager .on { background: var(--justiz); color: #fff; border-color: var(--justiz); }

.kennzahl { background: var(--papier); border: 1px solid var(--linie); border-radius: var(--r); padding: 18px 20px; }
.kennzahl .zahl { font-family: var(--serif); font-size: 2.1rem; font-weight: 600; line-height: 1; color: var(--justiz); }
.kennzahl .label { font-family: var(--mono); font-size: .68rem; letter-spacing: .11em; text-transform: uppercase; color: var(--grau); margin-top: 8px; display: block; }

.footer { background: var(--justiz-tief); color: rgba(255, 255, 255, .62); padding: 52px 0 26px; font-size: .88rem; margin-top: auto; }
.footer h4 { color: #fff; font-family: var(--mono); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 14px; }
.footer a { color: rgba(255, 255, 255, .68); text-decoration: none; display: block; padding: 3px 0; }
.footer a:hover { color: var(--messing-hell); }
.footer-bottom { border-top: 1px solid rgba(255, 255, 255, .1); margin-top: 34px; padding-top: 20px; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: .8rem; }

body.intern { background: var(--akte-2); display: block; }
.shell { display: grid; grid-template-columns: 252px 1fr; min-height: 100vh; }
.side { background: var(--justiz-tief); color: rgba(255, 255, 255, .74); padding: 22px 0; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.side-brand { padding: 0 22px 20px; border-bottom: 1px solid rgba(255, 255, 255, .09); margin-bottom: 16px; }
.side-brand strong { display: block; font-family: var(--serif); color: #fff; font-size: 1.02rem; }
.side-brand span { font-family: var(--mono); font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: var(--messing-hell); }
.side-group { padding: 14px 22px 5px; font-family: var(--mono); font-size: .6rem; letter-spacing: .15em; text-transform: uppercase; color: rgba(255, 255, 255, .34); }
.side a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 22px; color: rgba(255, 255, 255, .76); text-decoration: none; font-size: .89rem;
  border-left: 3px solid transparent;
}
.side a:hover { background: rgba(255, 255, 255, .05); color: #fff; }
.side a.on { background: rgba(166, 124, 61, .14); border-left-color: var(--messing); color: #fff; }
.side .pill { font-family: var(--mono); font-size: .66rem; background: var(--siegel); color: #fff; border-radius: 9px; padding: 1px 7px; }

.main { padding: 0 0 60px; min-width: 0; }
.main-bar {
  background: var(--papier); border-bottom: 1px solid var(--linie);
  padding: 15px 32px; display: flex; align-items: center; justify-content: space-between; gap: 20px;
  position: sticky; top: 0; z-index: 20; flex-wrap: wrap;
}
.main-bar h1 { font-size: 1.35rem; margin: 0; }
.main-bar .sub { font-family: var(--mono); font-size: .72rem; color: var(--grau); letter-spacing: .06em; }
.main-inner { padding: 28px 32px 0; }
.user-chip { display: flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; }
.avatar {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--justiz); color: #fff;
  display: grid; place-items: center;
  font-family: var(--mono); font-size: .74rem; letter-spacing: .04em;
}
.user-chip .who { line-height: 1.25; }
.user-chip .who strong { display: block; font-size: .86rem; }
.user-chip .who span { font-size: .72rem; color: var(--grau); }

.crumbs { font-family: var(--mono); font-size: .74rem; color: var(--grau); margin-bottom: 18px; }
.crumbs a { color: var(--grau); text-decoration: none; }
.crumbs a:hover { color: var(--justiz); }

.panel { background: var(--papier); border: 1px solid var(--linie); border-radius: var(--r); margin-bottom: 22px; }
.panel-head { padding: 15px 20px; border-bottom: 1px solid var(--linie); display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.panel-head h2, .panel-head h3 { margin: 0; font-size: 1.02rem; font-family: var(--sans); font-weight: 600; }
.panel-body { padding: 20px; }
.panel-body-flush { padding: 0; }

.deflist { display: grid; grid-template-columns: 168px 1fr; gap: 0; font-size: .9rem; }
.deflist dt { font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--grau); padding: 9px 0; border-bottom: 1px solid var(--akte-2); }
.deflist dd { margin: 0; padding: 9px 0; border-bottom: 1px solid var(--akte-2); }
.deflist dt:last-of-type, .deflist dd:last-of-type { border-bottom: 0; }

aside .deflist { grid-template-columns: 104px 1fr; }
aside .deflist dt { font-size: .66rem; }

.status-flow { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 6px; }
.status-flow span {
  font-family: var(--mono); font-size: .66rem; letter-spacing: .06em;
  padding: 4px 9px; border-radius: 2px; background: var(--akte-2); color: var(--grau-hell);
  border: 1px solid var(--akte-3);
}
.status-flow span.done { background: rgba(20, 53, 42, .07); color: var(--justiz); border-color: rgba(20, 53, 42, .18); }
.status-flow span.now { background: var(--justiz); color: #fff; border-color: var(--justiz); }

.note { border-left: 3px solid var(--messing); background: var(--akte); padding: 12px 16px; border-radius: 0 var(--r) var(--r) 0; margin-bottom: 12px; }
.note-head { display: flex; justify-content: space-between; gap: 12px; font-size: .76rem; color: var(--grau); font-family: var(--mono); margin-bottom: 4px; }
.note p { margin: 0; font-size: .92rem; }

.zellen { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 10px; }
.zelle { border: 1px solid var(--linie); border-radius: var(--r); padding: 12px; text-align: center; background: var(--akte); text-decoration: none; color: inherit; }
.zelle .nr { font-family: var(--mono); font-size: .92rem; font-weight: 600; color: var(--justiz); }
.zelle .who { font-size: .74rem; color: var(--grau); display: block; margin-top: 4px; min-height: 1.2em; }
.zelle.belegt { background: rgba(138, 43, 43, .06); border-color: rgba(138, 43, 43, .3); }
.zelle.belegt .who { color: var(--siegel); }

.split { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.between { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; }
.stack { display: flex; flex-direction: column; gap: 8px; }
.mt-0 { margin-top: 0; } .mt-1 { margin-top: 10px; } .mt-2 { margin-top: 22px; } .mt-3 { margin-top: 34px; }
.mb-0 { margin-bottom: 0; } .mb-1 { margin-bottom: 10px; } .mb-2 { margin-bottom: 22px; }
.right { text-align: right; } .center { text-align: center; }
.nowrap { white-space: nowrap; }

details.akkordeon { border: 1px solid var(--linie); border-radius: var(--r); background: var(--papier); margin-bottom: 10px; }
details.akkordeon summary { padding: 14px 18px; cursor: pointer; font-weight: 500; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
details.akkordeon summary::-webkit-details-marker { display: none; }
details.akkordeon summary::after { content: "+"; font-family: var(--mono); color: var(--messing); font-size: 1.1rem; }
details.akkordeon[open] summary::after { content: "−"; }
details.akkordeon .inner { padding: 0 18px 18px; }

.print-only { display: none; }

@media (max-width: 1080px) {
  .shell { grid-template-columns: 1fr; }
  .side { position: static; height: auto; }
  .side nav { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-sidebar { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
  .hero { padding: 52px 0 60px; }
  .hero .wrap { grid-template-columns: 1fr; gap: 32px; }
  .siegel { width: 130px; height: 130px; }
  .grid-3, .grid-2 { grid-template-columns: 1fr; }
  .nav { display: none; width: 100%; flex-direction: column; align-items: stretch; padding-bottom: 12px; }
  .nav.open { display: flex; }
  .nav a { border-bottom: 1px solid rgba(255,255,255,.08); border-left: 3px solid transparent; }
  .nav a.on { border-left-color: var(--messing); border-bottom-color: rgba(255,255,255,.08); }
  .nav-toggle { display: block; }
  .masthead .wrap { flex-wrap: wrap; gap: 12px; }
  .form-row, .form-row-3 { grid-template-columns: 1fr; }
  .deflist { grid-template-columns: 1fr; }
  .deflist dt { padding-bottom: 0; border-bottom: 0; }
  .main-inner, .main-bar { padding-left: 18px; padding-right: 18px; }
  .grid-4 { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .card-link:hover { transform: none; }
}

@media print {
  .side, .main-bar, .topbar, .masthead, .footer, .filterbar, .form-actions, .btn, .pager { display: none !important; }
  body, body.intern { background: #fff; }
  .shell { grid-template-columns: 1fr; }
  .panel, .card { border: 1px solid #ccc; box-shadow: none; break-inside: avoid; }
  .print-only { display: block; }
  a { text-decoration: none; color: #000; }
}