/* ==========================================================================
   Fachwerte – Foto-Nachweis (Engine-Styles)
   Gemeinsames mobiles UI für Begehungs- und Übergabeprotokolle.
   Gehört zu assets/nachweis.js; setzt assets/site.css (Tokens) voraus.

   Präfix: .nw-   (nicht mit .fw- kollidieren)
   ========================================================================== */

/* ─── Grundgerüst ───────────────────────────────────────────────────────── */
.nw-app {
    max-width: 44rem;
    margin: 0 auto;
    padding: 1.25rem var(--fw-pad-m, 1rem) 7.5rem;
    font-family: var(--fw-font);
    color: var(--fw-text);
    font-size: 1rem;
    line-height: 1.5;
}
.nw-app *, .nw-app *::before, .nw-app *::after { box-sizing: border-box; }

@media (min-width: 40rem) {
    .nw-app { padding-left: 1.5rem; padding-right: 1.5rem; }
}

/* ─── Kopfzeile: Objekt + Stammdaten ────────────────────────────────────── */
.nw-context {
    display: flex;
    align-items: stretch;
    gap: .5rem;
    margin-bottom: 1rem;
}
.nw-context-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .15rem;
    padding: .7rem .85rem;
    background: var(--fw-surface);
    border: 1px solid var(--fw-border);
    border-radius: var(--fw-radius-lg);
    text-align: left;
    font: inherit;
    color: inherit;
    cursor: pointer;
}
.nw-context-main:hover { background: var(--fw-surface-2); }
.nw-context-label {
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: var(--fw-muted);
    font-weight: 500;
}
.nw-context-value {
    font-size: 1rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.nw-context-value[data-empty="true"] { color: var(--fw-muted); font-weight: 400; }
.nw-context-icon {
    flex: 0 0 auto;
    width: 3rem;
    display: grid;
    place-items: center;
    background: var(--fw-surface);
    border: 1px solid var(--fw-border);
    border-radius: var(--fw-radius-lg);
    color: var(--fw-text-2);
    cursor: pointer;
}
.nw-context-icon:hover { background: var(--fw-surface-2); }

/* ─── Buttons ───────────────────────────────────────────────────────────── */
.nw-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 2.9rem;
    padding: .6rem 1.1rem;
    border: 1px solid var(--fw-border-str);
    border-radius: var(--fw-radius-lg);
    background: var(--fw-bg);
    color: var(--fw-text);
    font: inherit;
    font-size: .95rem;
    font-weight: 500;
    cursor: pointer;
    text-align: center;
}
.nw-btn:hover { background: var(--fw-surface); }
.nw-btn:disabled { opacity: .45; cursor: default; }
.nw-btn--primary {
    background: var(--fw-accent);
    border-color: var(--fw-accent);
    color: #fff;
    font-weight: 600;
}
.nw-btn--primary:hover { background: var(--fw-accent-dk); border-color: var(--fw-accent-dk); }
.nw-btn--quiet { border-color: transparent; background: transparent; color: var(--fw-text-2); }
.nw-btn--quiet:hover { background: var(--fw-surface); }
.nw-btn--danger { color: #b3261e; }
.nw-btn--wide { width: 100%; }

/* ─── Aufnahme-Leiste (fix am unteren Rand) ─────────────────────────────── */
.nw-actionbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    padding: .7rem 1rem calc(.7rem + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--fw-bg) 94%, transparent);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid var(--fw-border);
}
.nw-actionbar-inner {
    max-width: 44rem;
    margin: 0 auto;
    display: flex;
    gap: .6rem;
}
.nw-capture {
    flex: 1 1 auto;
    min-height: 3.4rem;
    font-size: 1.05rem;
    font-weight: 600;
}
.nw-capture svg { width: 22px; height: 22px; }
.nw-actionbar .nw-btn--secondary { flex: 0 0 auto; width: 3.4rem; padding: 0; }
.nw-capture-klein svg { width: 20px; height: 20px; }

/* ─── Eintragsliste ─────────────────────────────────────────────────────── */
.nw-listhead {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.5rem 0 .6rem;
}
.nw-listhead h2 {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--fw-muted);
    font-weight: 600;
}
.nw-listhead span { font-size: .8rem; color: var(--fw-muted); }

.nw-empty {
    padding: 2.5rem 1.25rem;
    text-align: center;
    color: var(--fw-muted);
    border: 1px dashed var(--fw-border-str);
    border-radius: var(--fw-radius-lg);
    font-size: .9rem;
    line-height: 1.7;
}
.nw-empty strong { display: block; color: var(--fw-text-2); font-weight: 600; margin-bottom: .35rem; }

.nw-list { display: flex; flex-direction: column; gap: .6rem; }

.nw-item {
    display: grid;
    grid-template-columns: 4.5rem 1fr;
    gap: .85rem;
    padding: .7rem;
    background: var(--fw-bg);
    border: 1px solid var(--fw-border);
    border-radius: var(--fw-radius-lg);
}
.nw-item-thumb {
    position: relative;
    width: 4.5rem;
    height: 4.5rem;
    border-radius: var(--fw-radius);
    overflow: hidden;
    background: var(--fw-surface-2);
    border: 0;
    padding: 0;
    cursor: pointer;
}
.nw-item-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nw-item-thumb-count {
    position: absolute;
    right: 2px;
    bottom: 2px;
    background: rgba(0,0,0,.68);
    color: #fff;
    font-size: .62rem;
    font-weight: 600;
    padding: .05rem .3rem;
    border-radius: 3px;
}
.nw-item-thumb--none { display: grid; place-items: center; color: var(--fw-muted); font-size: .68rem; }
.nw-item-body { min-width: 0; display: flex; flex-direction: column; gap: .3rem; }
.nw-item-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .4rem;
    font-size: .74rem;
    color: var(--fw-muted);
}
.nw-item-nr { font-weight: 700; color: var(--fw-text-2); font-variant-numeric: tabular-nums; }
.nw-item-text {
    font-size: .92rem;
    line-height: 1.45;
    color: var(--fw-text);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.nw-item-text[data-empty="true"] { color: var(--fw-muted); font-style: italic; }
.nw-item-actions { display: flex; gap: .35rem; margin-top: .15rem; flex-wrap: wrap; }
.nw-item-actions .nw-btn {
    min-height: 2.1rem;
    padding: .25rem .6rem;
    font-size: .78rem;
    border-radius: var(--fw-radius);
}

/* Typ-Marker */
.nw-tag {
    display: inline-block;
    padding: .1rem .45rem;
    border-radius: 3px;
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .02em;
    background: var(--fw-surface-2);
    color: var(--fw-text-2);
}
.nw-tag[data-typ="mangel"]  { background: #fdeceb; color: #a3211a; }
.nw-tag[data-typ="hinweis"] { background: var(--fw-proto-sf); color: var(--fw-proto); }
.nw-tag[data-typ="notiz"]   { background: var(--fw-accent-sf); color: var(--fw-accent-dk); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .nw-tag[data-typ="mangel"] { background: #3a1512; color: #f2938a; }
}

/* ─── Fußaktionen ───────────────────────────────────────────────────────── */
.nw-footactions {
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--fw-border);
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.nw-hint {
    margin-top: 1rem;
    font-size: .78rem;
    line-height: 1.65;
    color: var(--fw-muted);
}

/* ─── Vollbild-Ebenen (Editor, Markierung, Kopfdaten) ───────────────────── */
.nw-sheet {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: none;
    flex-direction: column;
    background: var(--fw-bg);
    font-family: var(--fw-font);
    color: var(--fw-text);
}
.nw-sheet[data-open="true"] { display: flex; }
.nw-sheet *, .nw-sheet *::before, .nw-sheet *::after { box-sizing: border-box; }

.nw-sheet-bar {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .6rem .75rem;
    padding-top: calc(.6rem + env(safe-area-inset-top));
    border-bottom: 1px solid var(--fw-border);
    background: var(--fw-surface);
}
.nw-sheet-title { font-size: .95rem; font-weight: 600; }
.nw-sheet-body {
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 1rem .9rem 1.5rem;
}
.nw-sheet-foot {
    flex: 0 0 auto;
    display: flex;
    gap: .6rem;
    padding: .7rem .9rem calc(.7rem + env(safe-area-inset-bottom));
    border-top: 1px solid var(--fw-border);
    background: var(--fw-surface);
}
.nw-sheet-foot .nw-btn { flex: 1 1 auto; }
.nw-sheet-inner { max-width: 44rem; margin: 0 auto; }

/* ─── Formularbausteine ─────────────────────────────────────────────────── */
.nw-field { margin-bottom: 1.1rem; }
.nw-field > label,
.nw-fieldlabel {
    display: block;
    font-size: .74rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
    color: var(--fw-muted);
    margin-bottom: .35rem;
}
.nw-input,
.nw-textarea {
    width: 100%;
    padding: .7rem .8rem;
    font: inherit;
    font-size: 1rem;              /* < 16px löst auf iOS Zoom aus */
    color: var(--fw-text);
    background: var(--fw-bg);
    border: 1px solid var(--fw-border-str);
    border-radius: var(--fw-radius-lg);
}
.nw-input:focus,
.nw-textarea:focus {
    outline: 2px solid var(--fw-accent);
    outline-offset: -1px;
    border-color: var(--fw-accent);
}
.nw-textarea { min-height: 7rem; resize: vertical; line-height: 1.5; }

.nw-inputrow { display: flex; gap: .5rem; align-items: flex-start; }
.nw-inputrow .nw-input { flex: 1 1 auto; }

/* Knopf am Feld – holt Werte in das Feld daneben (z. B. das Wetter zur PLZ) */
.nw-feldknopf {
    flex: 0 0 auto;
    height: 3rem;
    white-space: nowrap;
}
.nw-feldknopf[disabled] { opacity: .5; pointer-events: none; }
.nw-mic {
    flex: 0 0 auto;
    width: 3rem;
    height: 3rem;
    display: grid;
    place-items: center;
    border: 1px solid var(--fw-border-str);
    border-radius: var(--fw-radius-lg);
    background: var(--fw-bg);
    color: var(--fw-text-2);
    cursor: pointer;
}
.nw-mic[data-active="true"] {
    background: #b3261e;
    border-color: #b3261e;
    color: #fff;
    animation: nw-pulse 1.4s ease-in-out infinite;
}
@keyframes nw-pulse { 50% { opacity: .62; } }
@media (prefers-reduced-motion: reduce) { .nw-mic[data-active="true"] { animation: none; } }

.nw-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .5rem; }
.nw-chip {
    padding: .38rem .7rem;
    font: inherit;
    font-size: .84rem;
    border: 1px solid var(--fw-border-str);
    border-radius: 999px;
    background: var(--fw-bg);
    color: var(--fw-text-2);
    cursor: pointer;
    white-space: nowrap;
}
.nw-chip:hover { background: var(--fw-surface); }
.nw-chip[aria-pressed="true"] {
    background: var(--fw-accent);
    border-color: var(--fw-accent);
    color: #fff;
    font-weight: 500;
}

/* Ortsbausteine: mehrere Ebenen, schmale Gruppen stehen nebeneinander */
.nw-ortgruppe { margin-top: .6rem; }
.nw-grouplabel {
    display: block;
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
    color: var(--fw-muted);
    margin-bottom: .3rem;
}
.nw-ortgruppe .nw-chips { margin-top: 0; }
.nw-ortgruppen {
    display: flex;
    flex-wrap: wrap;
    gap: 0 1.1rem;
}
.nw-ortgruppen .nw-ortgruppe { flex: 1 1 100%; min-width: 0; }
.nw-ortgruppen .nw-ortgruppe[data-schmal="true"] { flex: 1 1 11rem; }

/* Fotostreifen im Editor */
.nw-photos {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(5.5rem, 1fr));
    gap: .5rem;
}
.nw-photo {
    position: relative;
    aspect-ratio: 1;
    border-radius: var(--fw-radius);
    overflow: hidden;
    background: var(--fw-surface-2);
    border: 1px solid var(--fw-border);
    padding: 0;
    cursor: pointer;
}
.nw-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nw-photo-del {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 1.5rem;
    height: 1.5rem;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: rgba(0,0,0,.62);
    color: #fff;
    font-size: .8rem;
    line-height: 1;
    cursor: pointer;
}
.nw-photo-mark {
    position: absolute;
    left: 3px;
    bottom: 3px;
    background: rgba(0,0,0,.62);
    color: #fff;
    font-size: .6rem;
    padding: .1rem .3rem;
    border-radius: 3px;
}
.nw-photo--add {
    display: grid;
    place-items: center;
    border: 1px dashed var(--fw-border-str);
    background: var(--fw-surface);
    color: var(--fw-muted);
    font-size: .75rem;
    gap: .2rem;
}

/* ─── Kamera-Ebene ──────────────────────────────────────────────────────── */
.nw-cam-stage {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    background: #15151a;
    display: grid;
    place-items: center;
}
.nw-cam-video {
    max-width: 100%;
    max-height: 100%;
    display: block;
}
.nw-cam-status {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: 26rem;
    padding: 0 1.5rem;
    text-align: center;
    color: #d8d8d4;
    font-size: .9rem;
    line-height: 1.6;
}
.nw-cam-select {
    flex: 0 1 auto;
    max-width: 11rem;
    padding: .6rem .7rem;
    font: inherit;
    font-size: .88rem;
    color: var(--fw-text);
    background: var(--fw-bg);
    border: 1px solid var(--fw-border-str);
    border-radius: var(--fw-radius-lg);
}

/* ─── Markierungs-Ebene ─────────────────────────────────────────────────── */
.nw-mark-stage {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;                 /* sonst wächst die Bühne über den Bildschirm */
    overflow: hidden;
    background: #15151a;
}
.nw-mark-canvas {
    position: absolute;
    inset: .5rem;
    margin: auto;
    max-width: calc(100% - 1rem);
    max-height: calc(100% - 1rem);
    width: auto;
    height: auto;
    touch-action: none;
    cursor: crosshair;
    display: block;
}
.nw-mark-tools {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: .5rem .9rem;
    padding: .6rem;
    background: var(--fw-surface);
    border-top: 1px solid var(--fw-border);
}
.nw-toolgroup { display: flex; align-items: center; gap: .4rem; }

.nw-tool {
    width: 2.5rem;
    height: 2.5rem;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--fw-border-str);
    border-radius: var(--fw-radius-lg);
    background: var(--fw-bg);
    color: var(--fw-text-2);
    cursor: pointer;
}
.nw-tool:hover { background: var(--fw-surface-2); }
.nw-tool[aria-pressed="true"] {
    background: var(--fw-accent);
    border-color: var(--fw-accent);
    color: #fff;
}

.nw-swatch {
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    border: 2px solid var(--fw-border-str);
    cursor: pointer;
    padding: 0;
}
.nw-swatch[aria-pressed="true"] { border-color: var(--fw-text); transform: scale(1.12); }

/* ─── Dialog ────────────────────────────────────────────────────────────── */
.nw-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1300;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    background: rgba(0,0,0,.45);
}
.nw-dialog-backdrop[data-open="true"] { display: flex; }
.nw-dialog {
    width: 100%;
    max-width: 24rem;
    background: var(--fw-bg);
    border-radius: var(--fw-radius-lg);
    box-shadow: var(--fw-shadow);
    padding: 1.4rem 1.3rem 1.1rem;
    font-family: var(--fw-font);
    color: var(--fw-text);
}
.nw-dialog h3 { font-size: 1.02rem; font-weight: 600; margin-bottom: .5rem; }
.nw-dialog p { font-size: .88rem; line-height: 1.6; color: var(--fw-text-2); margin-bottom: 1rem; }
.nw-dialog-check {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .82rem;
    color: var(--fw-muted);
    margin-bottom: 1rem;
    cursor: pointer;
}
.nw-dialog-check input { width: 1.05rem; height: 1.05rem; accent-color: var(--fw-accent); }
.nw-dialog-actions { display: flex; gap: .5rem; }
.nw-dialog-actions .nw-btn { flex: 1 1 auto; }

/* ─── Toast ─────────────────────────────────────────────────────────────── */
.nw-toast {
    position: fixed;
    left: 50%;
    bottom: calc(5.5rem + env(safe-area-inset-bottom));
    transform: translate(-50%, .6rem);
    z-index: 1400;
    max-width: min(22rem, calc(100vw - 2rem));
    padding: .65rem 1.1rem;
    background: var(--fw-invert-bg);
    color: var(--fw-invert-tx);
    border-radius: 999px;
    font-family: var(--fw-font);
    font-size: .85rem;
    text-align: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease, transform .18s ease;
}
.nw-toast[data-open="true"] { opacity: 1; transform: translate(-50%, 0); }

/* ─── Druckdokument ─────────────────────────────────────────────────────── */
.nw-print { display: none; }

.nw-doc {
    font-family: var(--fw-font);
    color: #111;
    font-size: 9.5pt;
    line-height: 1.4;
}
/* Jede Seite ist ein Kasten in voller A4-Größe; die Seitenränder sitzen als
   Innenabstand darin, nicht in @page. Der Grund steht unten bei @page: nur mit
   Rand 0 lässt der Browser seine eigene Kopf-/Fußzeile weg. 296 statt 297 mm
   Höhe ist Sicherheitsabstand gegen Rundungsfehler, die sonst nach jeder Seite
   eine leere auslösen. Der Umbruch entsteht in nachweis.js durch Messen, damit
   unten „Seite X von Y“ stehen kann. */
.nw-doc-page {
    box-sizing: border-box;
    width: 210mm;
    height: 296mm;
    padding: 12mm 10mm;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    page-break-after: always;
    break-after: page;
}
.nw-doc-page:last-child { page-break-after: auto; break-after: auto; }
.nw-doc-pagebody {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
.nw-doc-pagebody > *:first-child { margin-top: 0; }
.nw-doc-pagefoot {
    flex: 0 0 auto;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6mm;
    margin-top: 3mm;
    padding-top: 1.6mm;
    border-top: .4pt solid #999;
    font-size: 7.5pt;
    color: #444;
}
.nw-doc-pagefoot span:last-child { white-space: nowrap; font-weight: 600; }

/* Messfassung: gesetzt, aber außerhalb des Sichtfelds */
.nw-print--messen {
    display: block !important;
    position: absolute;
    left: -30000px;
    top: 0;
    width: 210mm;
    background: #fff;
}

.nw-doc-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10mm;
    padding-bottom: 3mm;
    border-bottom: 1.5pt solid #111;
    margin-bottom: 5mm;
}
.nw-doc-head h1 { font-size: 15pt; font-weight: 700; line-height: 1.2; }
.nw-doc-head .nw-doc-sub { font-size: 9pt; color: #444; margin-top: 1mm; }
.nw-doc-firma { text-align: right; font-size: 8.5pt; line-height: 1.45; color: #333; }
.nw-doc-firma strong { display: block; font-size: 10pt; color: #111; }
.nw-doc-firma img { max-height: 16mm; max-width: 45mm; display: block; margin: 0 0 2mm auto; }

.nw-doc-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 8mm;
    margin-bottom: 5mm;
}
.nw-doc-row {
    display: flex;
    gap: 3mm;
    padding: 1.3mm 0;
    border-bottom: .4pt solid #d8d8d8;
    font-size: 9pt;
}
.nw-doc-row dt { flex: 0 0 32mm; color: #555; }
.nw-doc-row dd { flex: 1 1 auto; font-weight: 600; }

.nw-doc h2 {
    font-size: 10.5pt;
    font-weight: 700;
    margin: 6mm 0 2.5mm;
    padding-bottom: 1.2mm;
    border-bottom: .8pt solid #111;
}

.nw-doc-table { width: 100%; border-collapse: collapse; font-size: 8.8pt; }
.nw-doc-table th {
    text-align: left;
    background: #f0f0ee;
    border: .4pt solid #bbb;
    padding: 1.5mm 2mm;
    font-weight: 600;
}
.nw-doc-table td { border: .4pt solid #bbb; padding: 1.5mm 2mm; vertical-align: top; }
.nw-doc-table tr { page-break-inside: avoid; }
.nw-doc-table .c-nr { width: 10mm; text-align: center; font-weight: 700; }
.nw-doc-table .c-zeit { width: 24mm; white-space: nowrap; }
.nw-doc-table .c-ort { width: 32mm; }
.nw-doc-table .c-typ { width: 24mm; }
.nw-doc-table .c-frist { width: 22mm; }

.nw-doc-fotos { display: grid; grid-template-columns: 1fr 1fr; gap: 5mm; margin-top: 3mm; }
.nw-doc-foto { page-break-inside: avoid; }
.nw-doc-foto img {
    width: 100%;
    border: .4pt solid #999;
    display: block;
}
.nw-doc-foto figcaption { font-size: 8pt; color: #333; margin-top: 1.2mm; line-height: 1.35; }

.nw-doc-single-img {
    display: block;
    max-width: 100%;
    max-height: 118mm;
    margin: 0 auto 3mm;
    border: .4pt solid #999;
}
.nw-doc-text {
    font-size: 10pt;
    line-height: 1.5;
    white-space: pre-wrap;
    padding: 2.5mm 0;
    min-height: 12mm;
}

.nw-doc-sign {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12mm;
    margin-top: 12mm;
    page-break-inside: avoid;
}
.nw-doc-sign div { border-top: .6pt solid #111; padding-top: 1.5mm; font-size: 8pt; color: #444; }

.nw-doc-foot {
    margin-top: 6mm;
    padding-top: 2mm;
    border-top: .4pt solid #bbb;
    font-size: 7.5pt;
    color: #666;
    line-height: 1.5;
}

/* ─── Druck ─────────────────────────────────────────────────────────────── */
@media print {
    /* Rand 0 ist Absicht: Kopf- und Fußzeile des Browsers (URL, Datum,
       „1/3“) werden in den Seitenrand gedruckt. Ist dort kein Platz, bleiben
       sie weg. Am Handy ist das der einzige Weg — der Android-Druckdialog
       hat dafür keinen Schalter. Die echten Seitenränder stecken deshalb als
       padding in .nw-doc-page. */
    @page { size: A4 portrait; margin: 0; }
    /* Ohne diese Null bliebe der Vorgaberand des Browsers am body stehen —
       bei Rand 0 im @page schiebt er das erste Blatt nach unten und erzeugt
       eine leere Extraseite. */
    html, body { background: #fff !important; margin: 0 !important; padding: 0 !important; }
    body > *:not(.nw-print) { display: none !important; }
    .fw-header, .fw-footer, .fw-disclaimer, .fw-legal-fallback,
    .nw-app, .nw-actionbar, .nw-sheet, .nw-dialog-backdrop, .nw-toast {
        display: none !important;
    }
    .nw-print { display: block !important; }
}

/* ─── Kopfbereich der Werkzeugseite ─────────────────────────────────────── */
.nw-intro {
    max-width: 44rem;
    margin: 0 auto;
    padding: 2.25rem 1rem .5rem;
    font-family: var(--fw-font);
}
@media (min-width: 40rem) {
    .nw-intro { padding-left: 1.5rem; padding-right: 1.5rem; }
}
.nw-intro h1 {
    font-size: clamp(1.55rem, 4.5vw, 2.15rem);
    font-weight: 300;
    letter-spacing: -.03em;
    line-height: 1.15;
    margin-bottom: .7rem;
    color: var(--fw-text);
}
.nw-intro h1 strong { font-weight: 600; }
.nw-intro p {
    font-size: .93rem;
    line-height: 1.7;
    color: var(--fw-text-2);
}