/* Ressourcen Portal der Großleitstelle Oldenburger Land.
   Raster: alle Maße rasten auf 4px. Gold nur für Aktives, Primäraktionen und Lichtsektoren. */

/* ── Schriften ───────────────────────────────────────────────────────── */
@font-face { font-family:'Fira Sans'; font-weight:400; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-latin-400-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fira Sans'; font-weight:400; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-latin-ext-400-normal.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fira Sans'; font-weight:500; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-latin-500-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fira Sans'; font-weight:500; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-latin-ext-500-normal.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fira Sans'; font-weight:600; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-latin-600-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fira Sans'; font-weight:600; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-latin-ext-600-normal.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fira Sans'; font-weight:700; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-latin-700-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fira Sans'; font-weight:700; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-latin-ext-700-normal.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fira Sans'; font-weight:400; font-style:italic; font-display:swap; src:url('/assets/fonts/fira-sans-latin-400-italic.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fira Sans'; font-weight:400; font-style:italic; font-display:swap; src:url('/assets/fonts/fira-sans-latin-ext-400-italic.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fira Sans Condensed'; font-weight:500; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-condensed-latin-500-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fira Sans Condensed'; font-weight:500; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-condensed-latin-ext-500-normal.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Fira Sans Condensed'; font-weight:600; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-condensed-latin-600-normal.woff2') format('woff2'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:'Fira Sans Condensed'; font-weight:600; font-style:normal; font-display:swap; src:url('/assets/fonts/fira-sans-condensed-latin-ext-600-normal.woff2') format('woff2'); unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

/* ── Tokens ──────────────────────────────────────────────────────────── */
:root {
  --navy:#002f56; --navy-deep:#001f3a; --navy-soft:#0d4670;
  --on-navy:#e3eef5; --on-navy-2:#b9d0df;
  --gold:#fbba00; --gold-hover:#ffcb33; --gold-ink:#7a5600;
  --ground:#eaf3f6; --paper:#ffffff; --shoal:#f7fbfc;
  --line:#bcd3df; --line-soft:#dbe7ee;
  --ink:#0b2740; --ink-2:#34526a;
  --d0:#f7fbfc; --d1:#d6e9f0; --d2:#aed2e2; --d3:#7fb4cd;
  --danger:#a8201a; --danger-bg:#fdeceb; --danger-line:#eeb7b3;
  --ok:#0b6448; --ok-bg:#e4f4ee; --ok-line:#a3d6c4;
  --warn:#6f4e00; --warn-bg:#fff5d6; --warn-line:#ecd38a;
  --r:6px; --r-sm:4px;
  --font:'Fira Sans','Segoe UI',Arial,sans-serif;
  --font-cond:'Fira Sans Condensed','Fira Sans','Arial Narrow',Arial,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}

/* ── Grundlagen ──────────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
[hidden] { display:none !important; }
html { -webkit-text-size-adjust:100%; scroll-padding-top:24px; scrollbar-color:var(--line) transparent; }
body { font:400 16px/1.5 var(--font); color:var(--ink); background:var(--ground); font-variant-numeric:tabular-nums; min-height:100vh; -webkit-font-smoothing:antialiased; }
img,svg { display:block; max-width:100%; }
h1,h2,h3 { font-weight:600; line-height:1.2; text-wrap:balance; }
h1 { font-size:28px; letter-spacing:-.01em; }
h2 { font-size:20px; }
a { color:var(--navy); text-underline-offset:3px; text-decoration-thickness:1px; }
a:hover { text-decoration-thickness:2px; }
em { font-style:italic; }
::selection { background:var(--gold); color:var(--navy-deep); }
:focus-visible { outline:2px solid var(--navy); outline-offset:2px; border-radius:2px; }
.app-nav :focus-visible, .site-band :focus-visible, .form-hero :focus-visible, .auth-side :focus-visible { outline-color:var(--gold); }
button,input,select,textarea { font:inherit; color:inherit; }

/* ── Formularelemente ────────────────────────────────────────────────── */
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=date],input[type=time],select,textarea {
  width:100%; min-height:44px; padding:8px 12px; background:var(--paper); color:var(--ink);
  border:1px solid #8fb0c3; border-radius:var(--r); transition:border-color .15s, box-shadow .15s;
}
textarea { display:block; min-height:96px; line-height:1.5; resize:vertical; }
input::placeholder,textarea::placeholder { color:#55738a; opacity:1; }
input:hover,select:hover,textarea:hover { border-color:var(--navy-soft); }
input:focus,select:focus,textarea:focus { outline:none; border-color:var(--navy); box-shadow:0 0 0 2px var(--navy); }
select { appearance:none; padding-right:36px; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%23002f56' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; }
input[type=radio],input[type=checkbox] { flex:none; width:20px; height:20px; accent-color:var(--navy); cursor:pointer; }
[aria-invalid=true] { border-color:var(--danger) !important; box-shadow:0 0 0 1px var(--danger); }
.field-error { margin-top:4px; color:var(--danger); font-size:14px; font-weight:500; }
.req { color:var(--danger); font-weight:600; }
.hint { margin-top:4px; color:var(--ink-2); font-size:14px; }

/* ── Schaltflächen ───────────────────────────────────────────────────── */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px 20px; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); color:var(--navy); font-weight:500; line-height:1.2; text-decoration:none; cursor:pointer; transition:background-color .15s, border-color .15s, transform .1s; }
.btn:hover { background:var(--shoal); border-color:var(--navy-soft); }
.btn:active { transform:translateY(1px); }
.btn--primary,.btn-submit { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:8px 28px; border:1px solid #d99f00; border-radius:var(--r); background:var(--gold); color:var(--navy-deep); font-weight:600; cursor:pointer; text-decoration:none; transition:background-color .15s, transform .1s; }
.btn--primary:hover,.btn-submit:hover { background:var(--gold-hover); }
.btn--primary:active,.btn-submit:active { transform:translateY(1px); }
.btn--navy { background:var(--navy); border-color:var(--navy); color:#fff; }
.btn--navy:hover { background:var(--navy-soft); border-color:var(--navy-soft); }
.btn--danger { background:var(--paper); border-color:var(--danger-line); color:var(--danger); }
.btn--danger:hover { background:var(--danger-bg); border-color:var(--danger); }
.btn--sm { min-height:36px; padding:4px 12px; font-size:14px; }
.btn--block { width:100%; }
.back-link { display:inline-flex; align-items:center; gap:4px; font-weight:500; font-size:15px; text-decoration:none; color:var(--navy); }
.back-link:hover { text-decoration:underline; }
.back-link--light { color:var(--on-navy); }

/* ── Meldungen ───────────────────────────────────────────────────────── */
.alert { padding:12px 16px; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); }
.alert + .alert { margin-top:8px; }
.alert-success { background:var(--ok-bg); border-color:var(--ok-line); color:#06402e; }
.alert-danger { background:var(--danger-bg); border-color:var(--danger-line); color:#6d120e; }
.alert-warn,.gast-notice { background:var(--warn-bg); border-color:var(--warn-line); color:#4e3700; }
.gast-notice { padding:8px 16px; border:1px solid var(--warn-line); border-radius:var(--r); font-size:15px; }
.hinweis-box { padding:12px 16px; margin-top:12px; background:var(--shoal); border:1px solid var(--line); border-radius:var(--r); font-size:15px; color:var(--ink); }
.hinweis-important { background:var(--warn-bg); border-color:var(--warn-line); color:#4e3700; margin-top:24px; }

/* ── Status ──────────────────────────────────────────────────────────── */
.st { display:inline-flex; align-items:center; gap:8px; font-weight:500; white-space:nowrap; }
.light { flex:none; }
.cb-yes { color:var(--navy); font-weight:600; }
.cb-no { color:var(--ink-2); }
.muted { color:var(--ink-2); }
.d0 { --row:var(--d0); } .d1 { --row:var(--d1); } .d2 { --row:var(--d2); } .d3 { --row:var(--d3); }

/* ── Öffentlicher Rahmen ─────────────────────────────────────────────── */
.logo-tile { flex:none; display:grid; place-items:center; width:44px; height:44px; background:#fff; border-radius:var(--r); }
.logo-tile img { width:36px; height:36px; }
.site-band { background:var(--navy); color:var(--on-navy); }
.site-band-inner { max-width:1120px; margin:0 auto; padding:12px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.site-brand { display:flex; align-items:center; gap:12px; color:#fff; text-decoration:none; min-width:0; }
.site-brand-text { display:grid; line-height:1.25; min-width:0; }
.site-brand-text strong { font-weight:600; }
.site-brand-text span { font-size:14px; color:var(--on-navy-2); }
.site-band-link { flex:none; color:var(--on-navy); font-weight:500; font-size:15px; }
.site-footer { display:flex; flex-wrap:wrap; justify-content:center; gap:4px 24px; padding:24px; color:var(--ink-2); font-size:14px; }

.home-hero,.form-hero { position:relative; isolation:isolate; background:var(--navy); }
.home-hero::before,.form-hero::before { content:''; position:absolute; inset:0; z-index:-1; background:url('/assets/tiefenlinien.svg') center top/1440px auto no-repeat; -webkit-mask-image:linear-gradient(90deg,transparent 42%,#000 78%); mask-image:linear-gradient(90deg,transparent 42%,#000 78%); }
.home-hero { color:#fff; padding:40px 24px 88px; }
.home-hero-inner { max-width:1072px; margin:0 auto; }
.home-hero h1 { font-size:clamp(30px,4.4vw,44px); max-width:18ch; }
.home-hero p { margin-top:12px; max-width:62ch; color:var(--on-navy); font-size:18px; }
.home-main { position:relative; z-index:1; max-width:1120px; margin:-64px auto 0; padding:0 24px; }
.form-pick { display:grid; gap:8px; }
.form-pick-label { font-weight:500; color:#fff; }
.form-list { list-style:none; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.form-list li + li { border-top:1px solid var(--line-soft); }
.form-link { display:grid; grid-template-columns:48px minmax(0,1fr) 168px auto; align-items:center; gap:20px; padding:20px 24px; color:var(--ink); text-decoration:none; transition:background-color .15s; }
.form-link:hover { background:var(--d1); }
.form-link > svg:first-child { width:40px; height:40px; color:var(--navy); }
.form-link h2 { font-size:20px; color:var(--navy); }
.form-link p { margin-top:4px; color:var(--ink-2); max-width:72ch; }
.form-link-area { font-style:italic; color:var(--ink-2); font-size:15px; }
.form-link-cta { display:inline-flex; align-items:center; gap:8px; font-weight:500; color:var(--navy); white-space:nowrap; }
.form-link-arrow { width:20px; height:20px; color:var(--navy); transition:transform .2s var(--ease); }
.form-link:hover .form-link-arrow { transform:translateX(4px); }
.status-strip { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 24px; margin-top:16px; padding:16px 24px; background:var(--d1); border:1px solid var(--line); border-radius:var(--r); }
.status-strip strong { display:block; font-weight:600; }

/* ── Formularseiten ──────────────────────────────────────────────────── */
.form-hero { color:#fff; padding:24px 24px 32px; }
.form-hero-inner { max-width:1072px; margin:0 auto; display:grid; gap:8px; justify-items:start; }
.form-hero h1 { font-size:clamp(26px,3.4vw,34px); }
.form-hero p { color:var(--on-navy); max-width:68ch; }
.page-wrap { max-width:1120px; margin:0 auto; padding:24px; display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
.page-wrap--narrow { max-width:800px; }
.form-layout { display:grid; grid-template-columns:216px minmax(0,1fr); gap:32px; align-items:start; }
.form-toc { position:sticky; top:24px; display:grid; gap:4px; font-size:15px; }
.form-toc:empty { display:none; }
.form-toc a { display:block; padding:8px 12px; border-radius:var(--r-sm); color:var(--ink-2); text-decoration:none; transition:background-color .15s,color .15s; }
.form-toc a:hover { background:var(--d1); color:var(--navy); }
.form-toc a[aria-current=true] { background:var(--navy); color:#fff; font-weight:500; }
.card { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:32px; min-width:0; }
.section-title { font-size:20px; font-weight:600; line-height:1.25; color:var(--navy); margin:40px 0 16px; padding-bottom:8px; border-bottom:1px solid var(--line); scroll-margin-top:24px; }
form > .section-title:first-of-type, .fw-tab-pane > .section-title:first-child { margin-top:0; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 24px; }
.form-row { display:grid; gap:4px; align-content:start; min-width:0; }
.field-label,.field-full-label { font-weight:500; font-size:15px; }
.field-input { min-width:0; }
.field-full { display:grid; gap:4px; margin-top:24px; }
.art-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.art-option,.cb-cell,.radio-option,.radio-option-h { display:flex; align-items:center; gap:12px; min-height:48px; padding:8px 16px; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); cursor:pointer; transition:background-color .15s,border-color .15s; }
.art-option { font-weight:500; }
.art-option:hover,.cb-cell:hover,.radio-option:hover,.radio-option-h:hover { background:var(--shoal); border-color:var(--navy-soft); }
.art-option:has(:checked),.cb-cell:has(:checked),.radio-option:has(:checked),.radio-option-h:has(:checked) { background:var(--d1); border-color:var(--navy); }
.checkbox-grid,.checkbox-grid-2 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.radio-option-group { display:grid; gap:8px; }
.radio-option-inline { grid-template-columns:repeat(auto-fit,minmax(144px,1fr)); }
.check-row { margin-top:12px; }
.sub-field { margin-top:12px; }
.question { margin-bottom:12px; }
.form-help { color:var(--ink-2); font-size:15px; margin-bottom:8px; }
.nav-select-wrap { display:grid; gap:8px; }
.uhrzeit-select-group { display:flex; align-items:center; gap:8px; }
.uhrzeit-sep { font-weight:600; }
.funktion-select-wrap { flex:1; min-width:0; }
.sonstige-box { display:grid; gap:8px; }
#sonstige-container { display:grid; gap:8px; }
#sonstige-container:empty { display:none; }
.sonstige-dyn-row { display:grid; grid-template-columns:minmax(0,1fr) auto 44px; align-items:center; gap:12px; }
.sonstige-cb-label { display:flex; align-items:center; gap:8px; cursor:pointer; }
.btn-sonstige-remove { width:44px; height:44px; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); color:var(--danger); font-size:20px; cursor:pointer; }
.btn-sonstige-remove:hover { background:var(--danger-bg); border-color:var(--danger); }
.btn-add-sonstige { margin-top:8px; justify-self:start; min-height:44px; padding:8px 16px; border:1px dashed var(--navy-soft); border-radius:var(--r); background:transparent; color:var(--navy); font-weight:500; cursor:pointer; }
.btn-add-sonstige:hover { background:var(--d1); }
.dsgvo-box { margin-top:16px; padding:16px; border:1px solid var(--line); border-radius:var(--r); background:var(--shoal); }
.dsgvo-cb { display:flex; gap:12px; font-size:15px; cursor:pointer; }
.form-submit { display:grid; gap:16px; justify-items:start; margin-top:32px; padding-top:24px; border-top:1px solid var(--line); }

.done-panel { display:grid; gap:12px; padding:32px; }
.done-panel h2 { font-size:24px; color:#06402e; }
.done-id { display:inline-flex; align-items:baseline; gap:12px; flex-wrap:wrap; padding:12px 16px; background:var(--paper); border:1px solid var(--ok-line); border-radius:var(--r); }
.done-id strong { font-size:32px; font-weight:600; letter-spacing:.04em; color:var(--navy); }
.done-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:4px; }

/* Feuerwehr: Schritte und Hilfsmittel */
.fw-step-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:-8px 0 24px; }
.fw-step-btn { display:flex; align-items:center; gap:12px; min-height:56px; padding:8px 16px; text-align:left; background:var(--shoal); color:var(--ink-2); border:1px solid var(--line); border-radius:var(--r); cursor:pointer; transition:background-color .15s,color .15s; }
.fw-step-btn:hover { border-color:var(--navy-soft); color:var(--navy); }
.fw-step-btn.active { background:var(--navy); border-color:var(--navy); color:#fff; }
.fw-step-circle { flex:none; display:grid; place-items:center; width:28px; height:28px; border:1px solid currentColor; border-radius:50%; font-weight:600; font-size:15px; }
.fw-step-btn.active .fw-step-circle { background:var(--gold); border-color:var(--gold); color:var(--navy-deep); }
.fw-step-name { font-weight:500; line-height:1.25; }
.fw-step-line { display:none; }
.fw-tab-pane { display:none; }
.fw-tab-pane.active { display:block; }
.fw-tab-next { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:32px; padding-top:24px; border-top:1px solid var(--line); }
.fw-tab-next-hint { color:var(--ink-2); }
.btn-tab-next { min-height:48px; padding:8px 28px; border:1px solid var(--navy); border-radius:var(--r); background:var(--navy); color:#fff; font-weight:600; cursor:pointer; }
.btn-tab-next:hover { background:var(--navy-soft); }
.btn-back-tab { min-height:48px; padding:8px 20px; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); color:var(--navy); font-weight:500; cursor:pointer; }
.btn-back-tab:hover { border-color:var(--navy-soft); background:var(--shoal); }
.fw-tab-actions { display:grid; gap:16px; margin-top:32px; padding-top:24px; border-top:1px solid var(--line); }
.fw-tab-action-btns { display:flex; flex-wrap:wrap; gap:12px; }
.hm-intro { margin-bottom:24px; color:var(--ink-2); max-width:70ch; }
.hm-category { margin-bottom:24px; }
.hm-cat-title,.hm-zusatz-header { font-size:18px; font-weight:600; color:var(--navy); margin-bottom:8px; }
.hm-table-scroll { overflow-x:auto; border:1px solid var(--line); border-radius:var(--r); }
.hm-table { width:100%; border-collapse:collapse; }
.hm-table th { padding:8px 12px; text-align:left; font:600 14px/1.3 var(--font-cond); color:var(--ink-2); background:var(--shoal); border-bottom:1px solid var(--line); }
.hm-table td { padding:8px 12px; border-top:1px solid var(--line-soft); vertical-align:middle; }
.hm-table tbody tr:first-child td { border-top:0; }
.hm-col-unit { width:96px; color:var(--ink-2); font-style:italic; }
.hm-col-val { width:168px; }
.hm-input,.hm-select { min-height:40px; padding:8px 8px; }
.hm-select { padding-right:32px; }
.hm-hint-wrap { position:relative; display:inline-flex; vertical-align:-3px; margin-left:4px; }
.hm-hint-icon { width:16px; height:16px; color:var(--ink-2); }
.hm-hint-text { position:absolute; left:24px; top:-8px; z-index:5; width:256px; padding:8px 12px; background:var(--navy); color:#fff; border-radius:var(--r-sm); font-size:14px; line-height:1.4; opacity:0; pointer-events:none; transition:opacity .15s; }
.hm-hint-wrap:hover .hm-hint-text,.hm-hint-wrap:focus .hm-hint-text { opacity:1; }
.hm-zusatz-hint { color:var(--ink-2); font-size:15px; margin-bottom:8px; }

/* ── Statusabfrage ───────────────────────────────────────────────────── */
.lookup-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:24px; }
.lookup { display:grid; gap:4px; }
.lookup-label { font-weight:500; }
.lookup-row { display:flex; gap:8px; }
.lookup-row input { flex:1; min-width:0; }
.fact-list { display:grid; grid-template-columns:200px minmax(0,1fr); gap:8px 16px; }
.fact-list dt { color:var(--ink-2); }
.fact-list dd { min-width:0; overflow-wrap:anywhere; }
.note { padding:12px 16px; background:var(--shoal); border:1px solid var(--line-soft); border-radius:var(--r); }
.note + .note { margin-top:8px; }
.note-meta { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin-bottom:4px; color:var(--ink-2); font-size:14px; }
.note-meta strong { color:var(--navy); font-weight:600; }
.note-text { white-space:pre-line; overflow-wrap:anywhere; }
.note--extern { background:var(--d1); border-color:var(--line); }

/* ── Anmeldung ───────────────────────────────────────────────────────── */
.auth { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); min-height:100vh; }
.auth-side { display:flex; flex-direction:column; justify-content:space-between; gap:32px; padding:40px 48px; background:var(--navy) url('/assets/tiefenlinien.svg') left 70%/1440px auto no-repeat; color:#fff; }
.auth-side h2 { font-size:clamp(26px,3vw,34px); max-width:16ch; }
.auth-side p { color:var(--on-navy); font-size:15px; }
.auth-brand { display:flex; align-items:center; gap:12px; font-weight:600; line-height:1.25; }
.auth-main { display:grid; place-items:center; padding:40px 24px; background:var(--paper); }
.auth-box { width:100%; max-width:380px; display:grid; gap:20px; }
.auth-box h1 { color:var(--navy); }
.auth-box form { display:grid; gap:16px; }
.auth-field { display:grid; gap:4px; }
.auth-field label { font-weight:500; font-size:15px; }
.code-input { text-align:center; font-size:24px; font-weight:500; letter-spacing:.24em; }

/* ── Arbeitsbereich ──────────────────────────────────────────────────── */
.app { display:grid; grid-template-columns:232px minmax(0,1fr); }
.app-nav { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; gap:24px; padding:16px 12px; background:var(--navy) url('/assets/tiefenlinien.svg') -520px calc(100% + 280px)/1440px auto no-repeat; color:var(--on-navy); overflow-y:auto; }
.app-brand { display:flex; align-items:center; gap:12px; padding:4px; color:#fff; font-weight:600; font-size:14px; line-height:1.2; text-decoration:none; }
.app-brand .logo-tile { width:40px; height:40px; }
.app-brand .logo-tile img { width:32px; height:32px; }
.app-links { display:grid; gap:4px; }
.nav-link { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:40px; padding:8px 12px; border-radius:var(--r); color:var(--on-navy); font-weight:500; font-size:15px; text-decoration:none; transition:background-color .15s,color .15s; }
.nav-link:hover { background:var(--navy-soft); color:#fff; }
.nav-link.active { background:var(--gold); color:var(--navy-deep); font-weight:600; }
.nav-count { font-weight:600; }
.app-user { margin-top:auto; display:grid; gap:8px; padding:12px; background:var(--navy-deep); border-radius:var(--r); font-size:14px; }
.app-user-name { color:#fff; font-weight:600; overflow-wrap:anywhere; }
.app-user-role { color:var(--on-navy-2); }
.app-user-links { display:flex; justify-content:space-between; gap:8px; }
.app-user-links a { color:var(--on-navy); }
.admin-main { min-width:0; padding:24px 32px 40px; display:grid; gap:16px; align-content:start; max-width:1320px; }
.page-head { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 24px; }
.page-sub { color:var(--ink-2); margin-top:4px; }
.depth-legend { display:flex; align-items:center; font-size:14px; color:var(--ink); }
.depth-legend em { margin-right:8px; color:var(--ink-2); }
.depth-legend span { padding:4px 12px; background:var(--row); }
.depth-legend span:nth-of-type(1) { border-radius:var(--r-sm) 0 0 var(--r-sm); }
.depth-legend span:last-child { border-radius:0 var(--r-sm) var(--r-sm) 0; }
.filter-bar { display:flex; flex-wrap:wrap; gap:4px; }
.filter-btn { display:inline-flex; align-items:center; gap:8px; min-height:40px; padding:8px 16px; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); color:var(--navy); font-weight:500; font-size:15px; text-decoration:none; cursor:pointer; transition:background-color .15s,border-color .15s; }
.filter-btn:hover { border-color:var(--navy-soft); background:var(--shoal); }
.filter-btn.active { background:var(--navy); border-color:var(--navy); color:#fff; }
.cnt { font-weight:600; opacity:.85; }

.table-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); overflow-x:auto; }
.table-title { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 16px; padding:12px 16px; border-bottom:1px solid var(--line); }
.table-title h2 { font-size:18px; color:var(--navy); }
.data-table { width:100%; border-collapse:collapse; }
.data-table th { padding:8px 12px; font:600 14px/1.3 var(--font-cond); color:var(--ink-2); text-align:left; white-space:nowrap; background:var(--paper); border-bottom:1px solid var(--line); }
.data-table td { padding:8px 12px; background:var(--row,transparent); border-bottom:1px solid rgba(0,47,86,.13); vertical-align:middle; transition:filter .15s; overflow-wrap:anywhere; }
.data-table tbody tr:last-child td { border-bottom:0; }
.data-table tbody tr { position:relative; }
.data-table tbody tr:hover td { filter:brightness(.96); }
.data-table tbody tr.unread td { font-weight:600; }
.data-table tbody tr.archived td { color:var(--ink-2); }
.data-table .id { font-weight:600; white-space:nowrap; }
.data-table .nowrap { white-space:nowrap; }
.data-table .small { display:block; font-weight:400; font-size:14px; color:var(--ink-2); }
.data-table tr[class*=d2] .small,.data-table tr[class*=d3] .small { color:var(--ink); }
.age { font-style:italic; white-space:nowrap; font-weight:400; }
.row-link { font-weight:500; white-space:nowrap; }
.row-link::after { content:''; position:absolute; inset:0; }
.empty { padding:40px 24px; text-align:center; color:var(--ink-2); }
.empty strong { display:block; color:var(--ink); font-weight:600; }

/* Bearbeiter */
.bearbeiter-chip { display:inline-flex; align-items:center; gap:8px; white-space:nowrap; font-size:15px; }
.bearbeiter-chip__avatar,.bearbeiter-avatar { display:grid; place-items:center; flex:none; width:24px; height:24px; border-radius:50%; background:var(--navy); color:#fff; font:600 12px/1 var(--font-cond); }
.bearbeiter-avatar { width:32px; height:32px; font-size:14px; }
.bearbeiter-avatar--empty { background:transparent; border:1px dashed var(--navy-soft); color:var(--navy-soft); }

/* Dashboard */
.area-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(176px,1fr)); background:var(--paper); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.area-link { display:flex; align-items:baseline; gap:12px; padding:12px 16px; color:var(--ink); text-decoration:none; border-left:1px solid var(--line-soft); transition:background-color .15s; }
.area-link:first-child { border-left:0; }
.area-link:hover { background:var(--d1); }
.area-link b { font-size:24px; font-weight:600; color:var(--navy); }
.area-link--open b::after { content:''; display:inline-block; width:8px; height:8px; margin-left:8px; vertical-align:4px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 1px #c99500; }
.dash-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }
.panel { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; min-width:0; }
.panel-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px 16px; border-bottom:1px solid var(--line); }
.panel-head h2 { font-size:18px; color:var(--navy); }
.panel-count { font-weight:600; color:var(--ink-2); }
.feed { list-style:none; }
.feed-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 12px; padding:8px 16px; background:var(--row,transparent); border-top:1px solid rgba(0,47,86,.13); color:var(--ink); text-decoration:none; transition:filter .15s; }
.feed li:first-child .feed-row { border-top:0; }
.feed-row:hover { filter:brightness(.96); }
.feed-title { font-weight:500; overflow-wrap:anywhere; }
.feed-type { grid-row:2; font-size:14px; }
.feed-time { grid-column:2; grid-row:1 / span 2; align-self:center; font-style:italic; font-size:15px; white-space:nowrap; }

/* Vorgang */
.case-head { display:grid; gap:12px; }
.case-facts { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,3fr) minmax(0,4fr) minmax(0,2fr); gap:8px 24px; padding:12px 16px; background:var(--row,var(--paper)); border:1px solid var(--line); border-radius:var(--r); }
.case-facts dt { font:500 14px/1.3 var(--font-cond); color:var(--ink-2); }
.case-facts.d2 dt,.case-facts.d3 dt,.case-facts.d2 .muted,.case-facts.d3 .muted { color:var(--ink); }
.case-facts dd { font-weight:500; }
.case-facts em { font-weight:400; }
.case-grid { display:grid; grid-template-columns:minmax(0,1fr) 304px; gap:16px; align-items:start; }
.case-main { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; min-width:0; background:var(--line-soft); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.case-main > .sheet { border:0; border-radius:0; }
.sheet--wide { grid-column:1 / -1; }
.side-stack { display:grid; gap:16px; min-width:0; }
.case-side { position:sticky; top:16px; display:grid; gap:16px; }
.sheet { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:16px 24px 20px; min-width:0; }
.sheet h2 { font-size:18px; color:var(--navy); margin-bottom:8px; }
.sheet h3 { font-size:15px; color:var(--navy); margin:16px 0 4px; }
.detail-table { width:100%; table-layout:fixed; border-collapse:collapse; }
.detail-table th { width:44%; overflow-wrap:break-word; hyphens:auto; padding:8px 16px 8px 0; font-weight:400; color:var(--ink-2); text-align:left; vertical-align:top; }
.detail-table td { padding:8px 0; overflow-wrap:anywhere; vertical-align:top; }
.detail-table tr + tr th,.detail-table tr + tr td { border-top:1px solid var(--line-soft); }
.pre { white-space:pre-line; }
.empty-val { color:#6d8799; }
.side-form { display:grid; gap:8px; }
.side-form label,.side-label { font-weight:500; font-size:15px; }
.side-block + .side-block { margin-top:16px; padding-top:16px; border-top:1px solid var(--line-soft); }
.bearbeiter-now { display:flex; align-items:center; gap:8px; margin:4px 0 8px; }
.answer { font-weight:600; }
.answer--ok { color:var(--navy); }
.answer--bad { color:var(--danger); }
.comment-form { display:grid; gap:12px; margin-top:16px; }
.comment-types { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.comment-type { display:flex; align-items:flex-start; gap:8px; padding:8px 12px; border:1px solid var(--line); border-radius:var(--r); cursor:pointer; }
.comment-type:has(:checked) { background:var(--d1); border-color:var(--navy); }
.comment-type small { display:block; color:var(--ink-2); font-size:14px; }
.forwarded { color:var(--navy); font-weight:500; }

/* Auswertung */
.filter-panel { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:12px 16px; }
.filter-panel form { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; }
.filter-quick { display:flex; flex-wrap:wrap; gap:4px; flex-basis:100%; }
.filter-field { display:grid; gap:4px; font-size:14px; font-weight:500; }
.filter-field input,.filter-field select { width:168px; min-height:40px; padding-block:8px; }
.chart-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:16px; }
.chart-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:12px 16px; min-width:0; }
.chart-card h2 { font-size:16px; color:var(--navy); margin-bottom:8px; }
.chart-box { position:relative; height:240px; }
.stat-line { display:flex; flex-wrap:wrap; gap:4px 24px; color:var(--ink-2); }
.stat-line b { color:var(--ink); font-weight:600; }

/* Nutzer */
.users-grid { display:grid; grid-template-columns:minmax(0,1fr) 336px; gap:16px; align-items:start; }
.form-group { display:grid; gap:4px; margin-bottom:16px; }
.form-group label { font-weight:500; font-size:15px; }
.user-actions { display:flex; flex-wrap:wrap; gap:4px; }
.role-list { display:grid; gap:8px; font-size:15px; }
.role-list p { color:var(--ink-2); margin-top:4px; }
.is-self td { background:var(--shoal); }

/* 2FA */
.tfa { max-width:720px; display:grid; gap:16px; }
.tfa-qr { display:grid; grid-template-columns:200px minmax(0,1fr); gap:24px; align-items:start; margin-top:8px; }
.tfa-qr-box { padding:8px; background:#fff; border:1px solid var(--line); border-radius:var(--r); }
.tfa-qr-box svg { width:100%; height:auto; }
.tfa-secret { padding:8px 12px; margin:4px 0 12px; background:var(--shoal); border:1px solid var(--line); border-radius:var(--r); font:500 16px/1.5 ui-monospace,Menlo,Consolas,monospace; word-break:break-all; }
.btn-copy-key { display:inline-flex; align-items:center; gap:8px; min-height:40px; padding:8px 16px; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); color:var(--navy); font-weight:500; cursor:pointer; }
.btn-copy-key:hover { border-color:var(--navy-soft); }
.tfa-code-row { display:flex; flex-wrap:wrap; gap:12px; margin-top:8px; }
.tfa-code-row input { width:216px; }
.tfa-status { display:flex; align-items:center; gap:12px; margin-bottom:8px; }
.tfa-facts { margin:12px 0 16px; padding-left:20px; color:var(--ink-2); }
.tfa-overlay { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:16px; background:rgba(0,31,58,.6); opacity:0; pointer-events:none; visibility:hidden; transition:opacity .15s,visibility .15s; }
.tfa-overlay.open { opacity:1; pointer-events:auto; visibility:visible; }
.tfa-modal { width:100%; max-width:440px; display:grid; gap:12px; padding:24px; background:var(--paper); border-radius:var(--r); box-shadow:0 16px 48px rgba(0,31,58,.35); }
.tfa-modal h2 { color:var(--danger); }
.tfa-modal form { display:grid; gap:12px; }
.tfa-modal-btns { display:flex; justify-content:flex-end; gap:8px; margin-top:4px; }

/* Fehlerseite */
.error-page { display:grid; place-items:center; min-height:100vh; padding:24px; }
.error-box { display:grid; gap:12px; justify-items:start; max-width:440px; padding:32px; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); }

/* ── Anpassung ───────────────────────────────────────────────────────── */
@media (max-width:1180px) {
  .case-grid { grid-template-columns:minmax(0,1fr); }
  .case-side { position:static; order:-1; }
  .chart-grid { grid-template-columns:1fr 1fr; }
  .chart-grid > :first-child { grid-column:1 / -1; }
  .users-grid { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:980px) {
  .form-layout { display:block; }
  .form-toc { top:0; z-index:5; display:flex; gap:4px; margin:0 -24px 12px; padding:8px 24px; overflow-x:auto; scrollbar-width:none; background:var(--ground); border-bottom:1px solid var(--line); }
  .form-toc a { flex:none; white-space:nowrap; }
  .dash-grid { grid-template-columns:minmax(0,1fr); }
  .app { grid-template-columns:minmax(0,1fr); grid-template-rows:auto 1fr; }
  .app-nav { position:static; height:auto; flex-direction:row; flex-wrap:wrap; align-items:center; gap:8px 12px; padding:8px 12px; background-image:none; overflow:visible; }
  .app-brand span:last-child { display:none; }
  .app-links { order:3; flex-basis:100%; display:flex; overflow-x:auto; gap:4px; margin:0 -12px; padding:0 12px 4px; scrollbar-width:none; }
  .nav-link { flex:none; }
  .app-user { margin:0 0 0 auto; padding:0; background:none; display:flex; align-items:center; gap:12px; }
  .app-user-role { display:none; }
  .admin-main { padding:16px 16px 32px; }
}
@media (max-width:720px) {
  .auth { grid-template-columns:minmax(0,1fr); min-height:0; }
  .auth-side { padding:16px 24px; }
  .auth-side { gap:12px; }
  .auth-side h2 { font-size:20px; }
  .auth-main { padding:32px 24px; }
  .form-link { grid-template-columns:36px minmax(0,1fr); gap:8px 12px; padding:16px; }
  .form-link-cta { grid-column:2; }
  .form-link > svg:first-child { width:32px; height:32px; }
  .form-link-area { display:none; }
  .home-hero { padding:24px 16px 112px; }
  .home-hero::before,.form-hero::before { top:auto; height:32px; background-size:900px auto; background-position:center -56px; -webkit-mask-image:linear-gradient(transparent,#000 35%,#000 65%,transparent); mask-image:linear-gradient(transparent,#000 35%,#000 65%,transparent); }
  .home-hero::before { bottom:64px; }
  .form-hero::before { bottom:0; }
  .home-main { padding:0 16px; }
  .home-hero p { font-size:16px; }
  .site-band-inner { padding:8px 16px; }
  .site-band-link { display:none; }
  .form-hero { padding:16px 16px 40px; }
  .page-wrap { padding:16px; }
  .form-toc { margin-inline:-16px; padding-inline:16px; }
  .card { padding:16px; }
  .form-grid,.lookup-grid { grid-template-columns:minmax(0,1fr); }
  .checkbox-grid,.checkbox-grid-2 { grid-template-columns:minmax(0,1fr); }
  .section-title { margin-top:32px; }
  .fact-list { grid-template-columns:minmax(0,1fr); gap:0; }
  .fact-list dd { margin-bottom:8px; }
  .btn-submit,.btn-tab-next { width:100%; }
  .fw-step-nav { grid-template-columns:minmax(0,1fr); }
  .fw-tab-next { flex-direction:column; align-items:stretch; }
  .fw-tab-action-btns { flex-direction:column-reverse; }
  .btn-back-tab { width:100%; }
  .hm-hint-icon { display:none; }
  .hm-hint-wrap { display:block; margin:4px 0 0; }
  .hm-hint-text { position:static; width:auto; padding:0; background:none; color:var(--ink-2); font-style:italic; opacity:1; }
  .hm-table th.hm-col-unit,.hm-table td.hm-col-unit { display:none; }
  .hm-col-val { width:112px; }
  .sonstige-dyn-row { grid-template-columns:minmax(0,1fr) 44px; }
  .sonstige-cb-label { grid-row:2; }
  .tfa-qr { grid-template-columns:minmax(0,1fr); }
  .tfa-qr-box { max-width:200px; }
  .comment-types { grid-template-columns:minmax(0,1fr); }
  .chart-grid { grid-template-columns:minmax(0,1fr); }
  .filter-field,.filter-field input,.filter-field select { width:100%; }
  .depth-legend { flex-wrap:wrap; }
  .depth-legend em { flex-basis:100%; }
  .case-main { grid-template-columns:minmax(0,1fr); }
  .detail-table,.detail-table tbody,.detail-table tr,.detail-table th,.detail-table td { display:block; width:auto; }
  .detail-table th { padding:8px 0 0; font-size:14px; hyphens:none; }
  .detail-table td { padding:0 0 8px; }
  .detail-table tr + tr td { border-top:0; }
  .case-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
  /* Tabellen werden zu gestapelten Zeilen */
  .table-card { overflow:visible; }
  .data-table,.data-table tbody,.data-table tr,.data-table td { display:block; }
  .data-table thead { display:none; }
  .data-table tbody tr { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:4px 12px; padding:12px 16px; background:var(--row,transparent); border-bottom:1px solid rgba(0,47,86,.13); }
  .data-table tbody tr:last-child { border-bottom:0; }
  .data-table td { padding:0; border:0; background:none; }
  .data-table td[data-label]::before { content:attr(data-label); display:block; font:500 13px/1.3 var(--font-cond); color:var(--ink-2); }
  .data-table tr[class*=d2] td[data-label]::before,.data-table tr[class*=d3] td[data-label]::before { color:var(--ink); }
  .data-table td.wide { grid-column:1 / -1; }
  .data-table td.act { grid-column:1 / -1; }
  .is-self td { background:none; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition-duration:.01ms !important; animation-duration:.01ms !important; scroll-behavior:auto !important; }
}
@media print {
  .app { display:block; }
  .app-nav,.case-side,.filter-bar,.back-link { display:none; }
  body { background:#fff; }
}
.feed-type .st { vertical-align:bottom; }