.ops-filters-single{grid-template-columns:1fr}
.ops-status-select{min-height:30px;padding:0 8px;border:1px solid var(--line);border-radius:0;color:#9ca199;background:#111411;font:inherit;font-size:11px;letter-spacing:.02em;cursor:pointer}
.ops-status-select.ops-warning{color:#ff8a58;border-color:rgb(255 138 88 / 45%)}
.ops-status-select:disabled{opacity:.5;cursor:default}
.books-error{margin-top:12px;padding:12px 14px;border:1px solid rgb(255 138 88 / 45%);color:#ff8a58;font-size:12px}
.books-hint{margin:4px 0 0;color:#7d827c;font-size:11px;line-height:1.5}
.books-detail-dialog{width:min(780px,calc(100% - 30px))}
.books-detail-meta{margin:4px 0 20px;padding:16px;border:1px solid var(--line);color:#a9ada7;font-size:13px;line-height:1.6}
.books-detail-subhead{margin:0 0 12px;color:#eee;font-size:15px;font-weight:600}
.books-settings-dialog{width:min(760px,calc(100% - 30px))}

/* ---------------------------------------------------------------- invoice editor overlay */
.invoice-editor{position:fixed;inset:0;z-index:900;display:flex;flex-direction:column;background:#0b0d0b;color:#eee}
.invoice-editor[hidden]{display:none}
.invoice-editor-bar{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;padding:16px var(--pad);border-bottom:1px solid var(--line);background:#111411}
.invoice-editor-back{border:0;padding:0;color:#9ca199;background:transparent;font-size:13px;cursor:pointer}
.invoice-editor-title{display:flex;gap:10px;align-items:baseline}
.invoice-editor-title b{font-size:20px;font-weight:600;letter-spacing:-.01em}
.invoice-editor-title small{color:#7d827c;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.invoice-editor-actions{display:flex;flex-wrap:wrap;gap:8px}
.invoice-editor-actions button{min-height:38px;padding:0 14px;border:1px solid var(--line);color:#ddd;background:#151815;font-size:12px;cursor:pointer}
.invoice-editor-actions button.is-primary{color:#080908;border-color:var(--tool-accent,#ff8a58);background:var(--tool-accent,#ff8a58)}
.invoice-editor-actions button.ops-warning{color:#ff8a58;border-color:rgb(255 138 88 / 45%);background:transparent}
.invoice-editor-body{flex:1;display:grid;grid-template-columns:minmax(360px,460px) 1fr;gap:0;overflow:auto}

/* ---- form (left column) ---- */
.invoice-form{display:grid;gap:14px;padding:28px var(--pad) 60px;border-right:1px solid var(--line);align-content:start}
.invoice-form label{display:grid;gap:6px;color:#858a83;font-size:10px;letter-spacing:.06em;text-transform:uppercase}
.invoice-form input,.invoice-form select,.invoice-form textarea{width:100%;padding:10px 11px;border:1px solid var(--line);color:#eee;background:#080908;font:inherit}
.invoice-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.invoice-form-subhead{margin:8px 0 0;color:#eee;font-size:13px;font-weight:600;text-transform:none;letter-spacing:0}
.invoice-items{display:grid;gap:8px}
.invoice-item-row{display:grid;grid-template-columns:2fr .7fr 1fr .7fr 1fr auto;gap:6px;align-items:center}
.invoice-item-row input,.invoice-item-row select{padding:8px;border:1px solid var(--line);color:#eee;background:#080908;font-size:12px}
.invoice-item-row button{border:0;color:#ff8a58;background:transparent;font-size:16px;cursor:pointer}
.invoice-form-totals{display:flex;flex-wrap:wrap;gap:6px 16px;justify-content:flex-end;padding:14px 0;border-top:1px solid var(--line);color:#a9ada7;font-size:12px}
.invoice-form-totals b{color:#eee;font-size:15px}
.invoice-pdf-upload{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding-top:10px;border-top:1px solid var(--line);color:#858a83;font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.invoice-pdf-upload a{color:var(--tool-accent,#ff8a58);text-transform:none}
.invoice-pdf-label{position:relative;padding:8px 12px;border:1px solid var(--line);color:#ddd;text-transform:none;font-size:12px;cursor:pointer}
.invoice-pdf-label input{position:absolute;inset:0;opacity:0;cursor:pointer}

/* ---- live preview / print paper (right column) ----
   A real business letter, not an app panel — isolated from the surrounding UI font/theme so it
   looks and prints the same regardless of what the app chrome is doing. Positions below are DIN
   5008 Form A coordinates expressed as % of the A4 page (210×297mm), which keeps them exact both
   in the shrunk on-screen preview and at true size in print — physical mm units would only be
   correct at one specific rendered size, since the preview is scaled to fit the editor panel. */
/* .invoice-pages holds one .invoice-paper per physical sheet — almost always just one, but an
   invoice with enough line items spills onto a second (or third) page, each getting its own
   "Seite X von Y" rather than silently clipping. */
.invoice-pages{display:flex;flex-direction:column;align-items:center;gap:24px;max-height:calc(100vh - 160px);overflow-y:auto;padding:2px}
.invoice-paper{position:relative;flex:none;width:100%;aspect-ratio:210/297;overflow:hidden;color:#1d1d1f;background:#ffffff;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:1.5}
/* a continuation page has no DIN address zone to clear, so its content starts near the top */
.invoice-paper--continuation .invoice-paper-body{top:9.52%}
.invoice-paper-runninghead{margin:0 0 16px;color:#86868b;font-size:10px}

/* fold guide (105mm, 210mm) and punch-hole guide (148.5mm, dead centre) for a C6/5 long window
   envelope — real DIN 5008 guides, but only meaningful on an actual printed sheet, so they're
   hidden in the on-screen editor preview and only drawn in the printed/exported PDF. */
.invoice-paper-foldmark,.invoice-paper-punchmark{display:none;position:absolute;left:0;width:1.9%;border-top:.75pt solid rgb(0 0 0 / 25%)}
.invoice-paper-foldmark--1{top:35.354%}
.invoice-paper-foldmark--2{top:70.707%}
.invoice-paper-punchmark{top:50%;width:1.4%}

/* Full width, not just the mark — a lone logo in the top-right corner left a lot of dead air to
   its left, so the three disciplines (same line as the business card) fill that band and anchor
   it, vertically centered against the mark. */
/* left:9.52% directly on the page, same as .invoice-paper-sender/.invoice-paper-recipient below —
   not a flex child's start edge, which left a sub-pixel offset against those two instead of
   lining up with them exactly. The mark is positioned within this same box, so its own top/right
   stay at the original 5.05%/9.52% of the page. */
.invoice-paper-letterhead{position:absolute;left:9.52%;right:9.52%;top:5.05%}
.invoice-paper-discipline-group{display:flex;flex-direction:column;gap:3px;max-width:78%}
.invoice-paper-discipline,.invoice-paper-areas{color:#6e6e73;font-size:8px;letter-spacing:.02em}
.invoice-paper-mark{position:absolute;top:0;right:0;width:28px;height:28px}

/* Anschriftfeld: sender line 45mm/top, recipient address 50mm/top, both 20mm/left, 85mm wide */
.invoice-paper-sender{position:absolute;left:9.52%;top:15.4%;width:40.48%;overflow:hidden;color:#86868b;font-size:7px;letter-spacing:.01em;white-space:nowrap;text-overflow:ellipsis}
.invoice-paper-recipient{position:absolute;left:9.52%;top:17.2%;width:40.48%;font-size:13px;line-height:1.55}

/* everything else starts clear of the full 45–90mm address zone, at the standard 25mm text margin */
/* left:9.52% — same edge as the letterhead/sender/recipient above, not the DIN body-text margin
   (25mm) that used to sit here: a consistent single left edge for the whole sheet read better
   than the stricter DIN distinction between the address zone and the body text block. */
.invoice-paper-body{position:absolute;left:9.52%;right:9.52%;top:32%;bottom:6.73%;display:flex;flex-direction:column}
.invoice-paper-title{margin:0 0 10px;font-size:12px;font-weight:600;letter-spacing:-.01em}
.invoice-paper-meta{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:0 0 22px;padding:14px 0;border-top:1px solid rgb(0 0 0 / 14%);border-bottom:1px solid rgb(0 0 0 / 14%)}
.invoice-paper-meta div{display:grid;gap:3px}
.invoice-paper-meta span{color:#86868b;font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.invoice-paper-meta b{font-size:12px;font-weight:600}
.invoice-paper-table{width:100%;border-collapse:collapse;margin-bottom:16px}
.invoice-paper-table th,.invoice-paper-table td{padding:8px 6px;border-bottom:1px solid rgb(0 0 0 / 8%);text-align:left;font-size:12px;font-variant-numeric:tabular-nums}
.invoice-paper-table th{color:#86868b;font-size:9px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.invoice-paper-table td:nth-child(3),.invoice-paper-table td:nth-child(5),.invoice-paper-table td:nth-child(6),.invoice-paper-table td:nth-child(7),
.invoice-paper-table th:nth-child(3),.invoice-paper-table th:nth-child(5),.invoice-paper-table th:nth-child(6),.invoice-paper-table th:nth-child(7){text-align:right}
.invoice-paper-totals{display:grid;justify-items:end;gap:6px;margin:0;font-size:12px;font-variant-numeric:tabular-nums}
.invoice-paper-totals div{display:flex;gap:18px;width:260px;justify-content:space-between}
.invoice-paper-grand{padding-top:8px;border-top:1px solid rgb(0 0 0 / 16%);font-weight:600;font-size:14px}
/* margin-top:auto, same trick as the footer below it — both float within the closing block's
   remaining space, so the note settles roughly a third of the way down instead of sitting glued
   to the totals, and it keeps doing that automatically regardless of how long the invoice is. */
.invoice-paper-note{max-width:560px;margin:auto 0 0;color:#6e6e73;font-size:11px;line-height:1.6}
/* Totals/note follow the item table directly (normal flow, no push) so a short invoice doesn't
   strand its total far below the last line item. The footer alone anchors to the physical bottom
   — closing is a flex column filling whatever space the table left, and footer's own auto margin
   settles it at the bottom of that space, giving the sheet a composed look regardless of length.
   Totals/note/footer are shown only on the last page; on earlier pages this whole block is
   hidden, so the page-counter line below takes over the bottom-pinning itself. */
[data-paper-closing]{display:flex;flex-direction:column;flex:1;min-height:0}
[data-paper-closing][hidden]{display:none}
.invoice-paper-footer{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:auto;padding-top:14px;border-top:1px solid rgb(0 0 0 / 8%);color:#6e6e73;font-size:10px;line-height:1.75}
.invoice-paper-footer-head{display:block;margin-bottom:4px;color:#1d1d1f;font-size:10px;font-weight:700;letter-spacing:.01em}
.invoice-paper-page{margin:10px 0 0;color:#86868b;font-size:9px;text-align:right}
[data-paper-closing][hidden] ~ .invoice-paper-page{margin-top:auto}

@media (max-width:900px){.invoice-paper-sender,.invoice-paper-recipient{width:60%}}

@media (max-width:1100px){.invoice-editor-body{grid-template-columns:1fr}.invoice-form{border-right:0;border-bottom:1px solid var(--line)}}
@media (max-width:640px){.invoice-item-row{grid-template-columns:1fr 1fr}.invoice-form-row{grid-template-columns:1fr}}

@media print{
  /* Hiding the rest of the page via visibility:hidden alone still reserves its full layout height
     (hero, summary, ledger table, footer), which pushed the actual invoice onto trailing blank
     pages. Removing those siblings from layout entirely is what makes a one-item invoice really
     export as one physical PDF page. */
  .tools-header,.ops-main,.tools-footer,.books-settings-dialog{display:none}
  .invoice-editor{position:static;inset:auto;background:none;color:inherit}
  .invoice-editor-bar,.invoice-form{display:none}
  .invoice-editor-body{display:block}
  .invoice-pages{display:block;max-height:none;overflow:visible;gap:0;padding:0}
  /* @page margin is 0 on purpose — the DIN 5008 coordinates above are already measured from the
     true physical page edge (so the address sits correctly behind a C6/5 envelope window); an
     added @page margin would shrink the printable box and throw every % position off. One
     .invoice-paper per physical sheet, flowing in normal document order so a second/third page
     (added only when the content doesn't fit on one) lands on its own printed page. */
  /* height is a hair under true A4 (not a visible difference — DIN % offsets scale with it
     imperceptibly) because the surrounding editor shell's own box-model rounding can land ~1px
     taller than the page box at exactly 297mm, which is enough for Chromium's print pagination to
     spill a near-empty extra page; this buffer keeps each .invoice-paper reliably on its own
     single physical page. */
  .invoice-paper{width:210mm;height:calc(297mm - 3px);aspect-ratio:auto;overflow:visible;background:#fff;color:#000;break-after:page}
  .invoice-paper:last-child{break-after:auto}
  .invoice-paper-foldmark,.invoice-paper-punchmark{display:block}
  @page{size:A4;margin:0}
}