/* =========================================================================
   Facture Bois — feuille de style
   Deux univers distincts :
     1. Le "chrome" de l'application (sombre, dense)  → préfixe .app / .fld / .btn
     2. Le document imprimable (clair, premium bois)  → .sheet et descendants
   Seul le second part à l'impression.
   ========================================================================= */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: #14110F;
  color: #EDE6DC;
  font: 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  overflow: hidden;
}

/* =======================================================================
   1. CHROME DE L'APPLICATION
   ======================================================================= */

.app {
  display: grid;
  grid-template-rows: auto 1fr;
  height: 100dvh;
}

/* ---- Barre supérieure ---- */
.topbar {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 16px;
  background: #1A1614;
  border-bottom: 1px solid #2E2823;
  flex-wrap: wrap;
}
.topbar .logo {
  display: flex; align-items: center; gap: 9px;
  font-weight: 700; font-size: 14px; letter-spacing: -.01em;
  margin-right: auto;
}
.topbar .logo i {
  width: 26px; height: 26px; border-radius: 5px;
  background: var(--accent, #B8553A); color: #fff;
  display: grid; place-items: center;
  font-family: Georgia, serif; font-style: italic; font-size: 15px;
}
.topbar .logo small { display: block; font-weight: 400; font-size: 11px; color: #8A7F73; }

/* ---- Segmented control ---- */
.seg { display: inline-flex; border: 1px solid #3A322B; border-radius: 8px; overflow: hidden; flex-shrink: 0; }
.seg button {
  appearance: none; border: 0; background: transparent; color: #A99C8E;
  font: inherit; font-size: 12.5px; padding: 6px 12px; cursor: pointer;
  white-space: nowrap; transition: background .12s, color .12s;
}
.seg button:hover { background: #241F1B; color: #EDE6DC; }
.seg button[aria-pressed="true"] { background: var(--accent, #B8553A); color: #fff; }
.seg + .seg { margin-left: 0; }

/* ---- Boutons ---- */
.btn {
  appearance: none; font: inherit; font-size: 13px; cursor: pointer;
  border: 1px solid #3A322B; background: #241F1B; color: #EDE6DC;
  padding: 7px 13px; border-radius: 8px; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 6px;
  transition: background .12s, border-color .12s;
}
.btn:hover { background: #2E2823; border-color: #4A4038; }
.btn-primary { background: var(--accent, #B8553A); border-color: transparent; color: #fff; font-weight: 600; }
.btn-primary:hover { filter: brightness(1.1); background: var(--accent, #B8553A); }
.btn-ghost { background: transparent; border-color: transparent; color: #A99C8E; padding: 5px 8px; }
.btn-ghost:hover { background: #241F1B; color: #EDE6DC; }
.btn-danger:hover { border-color: #8C3A32; color: #F0A6A0; background: #2A1A18; }
.btn-sm { font-size: 12px; padding: 4px 9px; }

/* ---- Corps : formulaire | aperçu ---- */
.body { display: grid; grid-template-columns: minmax(400px, 480px) 1fr; overflow: hidden; }

.pane-form { overflow-y: auto; overflow-x: hidden; border-right: 1px solid #2E2823; padding-bottom: 60px; }
.pane-preview {
  overflow-y: auto; background: #0D0B0A;
  padding: 24px 20px 60px; display: flex; justify-content: center;
}

/* ---- Accordéons de section ---- */
.sec { border-bottom: 1px solid #241F1B; }
.sec > summary {
  list-style: none; cursor: pointer; user-select: none;
  padding: 13px 16px; display: flex; align-items: center; gap: 9px;
  font-weight: 600; font-size: 13px; letter-spacing: .01em;
}
.sec > summary::-webkit-details-marker { display: none; }
.sec > summary::before {
  content: ""; width: 6px; height: 6px; flex-shrink: 0;
  border-right: 1.5px solid #8A7F73; border-bottom: 1.5px solid #8A7F73;
  transform: rotate(-45deg); transition: transform .15s;
  margin-left: 2px;
}
.sec[open] > summary::before { transform: rotate(45deg); }
.sec > summary:hover { background: #1A1614; }
.sec > summary .hint { margin-left: auto; font-weight: 400; font-size: 11.5px; color: #6E645A; }
.sec-body { padding: 4px 16px 18px; }

/* ---- Champs ---- */
.row { display: grid; gap: 10px; margin-bottom: 10px; }
.row.c2 { grid-template-columns: 1fr 1fr; }
.row.c3 { grid-template-columns: 1fr 1fr 1fr; }
.row.c21 { grid-template-columns: 2fr 1fr; }
.row.c12 { grid-template-columns: 1fr 2fr; }

.fld { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.fld > label {
  font-size: 11px; letter-spacing: .04em; text-transform: uppercase;
  color: #8A7F73; font-weight: 600;
}
.fld input[type="text"], .fld input[type="number"], .fld input[type="date"],
.fld input[type="email"], .fld input[type="tel"], .fld select, .fld textarea {
  appearance: none; font: inherit; font-size: 13.5px;
  background: #100E0C; color: #EDE6DC;
  border: 1px solid #332C26; border-radius: 7px;
  padding: 8px 10px; width: 100%; min-width: 0;
}
.fld textarea { resize: vertical; min-height: 62px; line-height: 1.45; }
.fld select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%238A7F73' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 10px;
  padding-right: 28px;
}
.fld input:focus, .fld select:focus, .fld textarea:focus {
  outline: none; border-color: var(--accent, #B8553A);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #B8553A) 22%, transparent);
}
.fld input[type="color"] {
  appearance: none; border: 1px solid #332C26; border-radius: 7px;
  width: 100%; height: 36px; padding: 3px; background: #100E0C; cursor: pointer;
}
.fld .suffix { position: relative; }
.fld .suffix input { padding-right: 34px; }
.fld .suffix span {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  font-size: 12px; color: #6E645A; pointer-events: none;
}

.check { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; padding: 5px 0; }
.check input { appearance: none; width: 17px; height: 17px; flex-shrink: 0; margin-top: 1px;
  border: 1px solid #4A4038; border-radius: 4px; background: #100E0C; cursor: pointer; position: relative; }
.check input:checked { background: var(--accent, #B8553A); border-color: transparent; }
.check input:checked::after {
  content: ""; position: absolute; left: 5px; top: 1.5px; width: 4px; height: 9px;
  border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(42deg);
}
.check span { font-size: 13px; line-height: 1.4; }
.check span small { display: block; color: #7A6F64; font-size: 11.5px; margin-top: 1px; }

.helper { font-size: 11.5px; color: #6E645A; line-height: 1.45; margin: -2px 0 10px; }

/* Bandeau affiché tant que l'exemple de départ n'a pas été remplacé. */
.demo-banner {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 12px; padding: 11px 13px;
  background: #241C12; border: 1px solid #4A3A1E; border-left-width: 3px;
  border-radius: 8px; font-size: 12.5px; line-height: 1.45; color: #E8C99A;
}
.demo-banner > div { flex: 1; min-width: 170px; }
.demo-banner b { display: block; color: #F5DFB4; margin-bottom: 1px; }
.demo-banner[hidden] { display: none; }
.warn {
  font-size: 12px; line-height: 1.45; color: #E8C99A;
  background: #241C12; border: 1px solid #4A3A1E; border-left-width: 3px;
  border-radius: 6px; padding: 8px 10px; margin: 4px 0 10px;
}

/* ---- Profils émetteur ---- */
.profiles { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
.profiles select { flex: 1; min-width: 130px; }

.logo-drop {
  display: flex; align-items: center; gap: 12px;
  border: 1px dashed #4A4038; border-radius: 8px; padding: 10px; margin-bottom: 10px;
}
.logo-drop img { width: 46px; height: 46px; object-fit: contain; background: #fff; border-radius: 5px; padding: 3px; }
.logo-drop .ph {
  width: 46px; height: 46px; border-radius: 5px; display: grid; place-items: center;
  background: var(--accent, #B8553A); color: #fff; font-family: Georgia, serif; font-style: italic; font-size: 22px;
}
.logo-drop div:last-child { flex: 1; }

/* ---- Lignes produits ---- */
.item {
  border: 1px solid #2E2823; border-radius: 10px;
  margin-bottom: 10px; overflow: hidden; background: #191512;
}
.item-head {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 8px 8px 11px; background: #1F1A16;
}
.item-head .n {
  width: 20px; height: 20px; border-radius: 5px; flex-shrink: 0;
  background: #332C26; color: #A99C8E; font-size: 11px; font-weight: 700;
  display: grid; place-items: center;
}
.item-head .t {
  flex: 1; font-size: 13px; font-weight: 600; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.item-head .amt { font-size: 12.5px; color: #A99C8E; font-variant-numeric: tabular-nums; }
.item-body { padding: 11px; border-top: 1px solid #2E2823; }
.item .drag { cursor: grab; color: #5E554C; font-size: 14px; line-height: 1; padding: 0 2px; }

.spec-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }

/* ---- Barre d'action mobile ---- */
.mobile-tabs { display: none; }
.fab { display: none; }

/* =======================================================================
   2. LE DOCUMENT — feuille A4
   ======================================================================= */

.preview-scaler { transform-origin: top center; }

.sheet {
  --ink:#2B211B; --muted:#7A6A5C; --rule:#E3DACD; --wash:#F7F2E9;
  --accent:#B8553A; --paper:#FFFDF9;
  width: 210mm; min-height: 297mm;
  background: var(--paper); color: var(--ink);
  font-family: "Inter", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  font-size: 9.5pt; line-height: 1.5;
  box-shadow: 0 18px 50px rgba(0,0,0,.55);
  position: relative;
  display: flex; flex-direction: column;
  /* Marges volontairement contenues : avec quatre lignes de produits, un
     acompte et les mentions légales, le document frôlait déjà les 297 mm.
     Chaque millimètre gagné ici, c'est une ligne de produit en plus avant
     de basculer sur une seconde page. */
  padding: 16mm 16mm 14mm;
}
.sheet .serif { font-family: Georgia, "Iowan Old Style", "Times New Roman", serif; }
.sheet .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.sheet .muted { color: var(--muted); }

/* ---- En-tête ---- */
.s-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10mm; }
.s-brand { display: flex; gap: 5mm; align-items: center; min-width: 0; }
.s-mark {
  width: 13mm; height: 13mm; flex-shrink: 0; border-radius: 1.5mm;
  background: var(--ink); color: var(--paper);
  display: grid; place-items: center;
  font-family: Georgia, serif; font-style: italic; font-size: 15pt;
}
.s-mark img { width: 100%; height: 100%; object-fit: contain; }
.s-mark.has-logo { background: transparent; border-radius: 0; }
.s-name { font-size: 14pt; font-weight: 600; letter-spacing: -.01em; line-height: 1.2; }
.s-tagline { font-size: 7.5pt; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; margin-top: .8mm; }
.s-issuer { text-align: right; font-size: 7.8pt; color: var(--muted); line-height: 1.65; flex-shrink: 0; }

.s-rule { border: 0; border-top: 1px solid var(--rule); margin: 5.5mm 0; }

/* ---- Titre du document ---- */
.s-titlebar { display: flex; justify-content: space-between; align-items: flex-end; gap: 8mm; }
.s-title { font-size: 23pt; letter-spacing: -.02em; margin: 0; line-height: 1.1; }
.s-meta { display: flex; gap: 7mm; font-size: 8.2pt; color: var(--muted); flex-shrink: 0; }
.s-meta b { color: var(--ink); font-weight: 600; display: block; }

/* ---- Parties ---- */
.s-parties { display: flex; gap: 10mm; margin: 6mm 0 5.5mm; }
.s-parties > div { flex: 1; min-width: 0; }
.s-lbl {
  font-size: 7pt; letter-spacing: .14em; text-transform: uppercase; color: var(--accent);
  font-weight: 700; margin-bottom: 2mm;
}
.s-who { font-size: 11pt; font-weight: 600; margin-bottom: 1mm; }
.s-addr { color: var(--muted); line-height: 1.6; }

.s-subject { font-size: 10pt; font-weight: 600; margin-bottom: 5mm; }

/* ---- Tableau ---- */
.s-table { width: 100%; border-collapse: collapse; }
.s-table thead { display: table-header-group; }
.s-table thead th {
  font-size: 7pt; letter-spacing: .12em; text-transform: uppercase; color: var(--muted);
  font-weight: 700; text-align: left; padding: 0 0 2mm; border-bottom: 1.2px solid var(--ink);
}
.s-table thead th.num { text-align: right; }
.s-table tbody tr { break-inside: avoid; }
.s-table tbody td { padding: 3mm 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.s-table td.num { padding-left: 3mm; }
.s-desc { font-weight: 600; }
.s-spec { font-size: 7.6pt; color: var(--muted); margin-top: .6mm; line-height: 1.45; }

/* ---- Bas de document ---- */
.s-foot { display: flex; gap: 8mm; margin-top: 7mm; align-items: flex-start; break-inside: avoid; }
.s-foot > .s-left { flex: 1; min-width: 0; }
.s-bank { background: var(--wash); padding: 5mm; border-radius: 1.5mm; }
.s-bank dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 1.4mm 4mm; font-size: 8pt; }
.s-bank dt { color: var(--muted); white-space: nowrap; }
.s-bank dd { margin: 0; font-weight: 600; word-break: break-word; }

.s-totals { width: 74mm; flex-shrink: 0; }
.s-trow { display: flex; justify-content: space-between; gap: 4mm; padding: 1.6mm 0; font-size: 9pt; }
.s-trow > span:first-child { color: var(--muted); }
.s-trow > span:last-child { font-variant-numeric: tabular-nums; white-space: nowrap; }
.s-trow.grand {
  border-top: 1.4px solid var(--ink); margin-top: 1.5mm; padding-top: 2.5mm;
  font-size: 11pt; font-weight: 700;
}
.s-trow.grand > span:first-child { color: var(--ink); }

/* ---- Acompte / solde ---- */
.s-deposit { margin-top: 3mm; border: 1.2px solid var(--accent); border-radius: 1.5mm; overflow: hidden; break-inside: avoid; }
/* Ligne(s) secondaire(s) : le montant qui n'est pas exigible maintenant. Reste
   franchement lisible — 9pt, montant en gras encre — parce qu'il engage le
   client, contrairement à une simple mention. */
.s-deposit .side { padding: 2mm 4mm; background: #fff; border-bottom: 1px solid var(--rule); }
.s-deposit .side .r {
  display: flex; justify-content: space-between; gap: 3mm;
  padding: .6mm 0; font-size: 9pt;
}
.s-deposit .side .r > span:first-child { color: var(--muted); }
.s-deposit .side .r > span:last-child {
  font-variant-numeric: tabular-nums; white-space: nowrap; font-weight: 600;
}

/* Pavé coloré : le montant à payer maintenant. */
.s-deposit .due { padding: 3mm 4mm; background: var(--accent); color: #FFF9F2; }
.s-deposit .due .k { font-size: 7.5pt; letter-spacing: .1em; text-transform: uppercase; opacity: .92; }
.s-deposit .due .v { font-size: 16pt; font-weight: 700; letter-spacing: -.015em; margin-top: .8mm; }

/* ---- Encadré référence de virement ---- */
.s-callout {
  border: 1.2px solid var(--accent); border-radius: 1.5mm;
  padding: 4mm; margin-top: 3mm; break-inside: avoid;
}
.s-callout .k { font-size: 7.5pt; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.s-callout p { margin: 1.5mm 0 2.5mm; font-size: 8pt; color: var(--muted); line-height: 1.5; }
.s-callout .ref {
  font-family: "SF Mono", "Consolas", "Courier New", monospace;
  font-size: 13pt; font-weight: 700; color: var(--accent); letter-spacing: .02em;
}

/* ---- Signature (bon de livraison) ---- */
.s-sign { display: flex; gap: 10mm; margin-top: 7mm; break-inside: avoid; }
.s-sign > div { flex: 1; }
.s-sign .line { border-bottom: 1px solid var(--ink); height: 16mm; }
.s-sign .cap { font-size: 7.5pt; color: var(--muted); margin-top: 1.5mm; }

.s-notes { margin-top: 6mm; font-size: 8.5pt; color: var(--muted); line-height: 1.55; white-space: pre-wrap; }

.s-legal {
  margin-top: auto; padding-top: 6mm;
  font-size: 7pt; color: var(--muted); line-height: 1.6;
}
.s-legal .imprint { margin-top: 2mm; padding-top: 2mm; border-top: 1px solid var(--rule); }

/* =======================================================================
   2b. FORMAT POSTAL ALLEMAND (emprunts DIN 5008)
   Repositionne les blocs pour l'enveloppe à fenêtre, sans toucher ni à la
   typographie ni à la palette du style premium.

   Tout est en FLUX NORMAL, jamais en position absolue : un bloc positionné
   en absolu ne se fragmente pas sur plusieurs pages à l'impression. Les cotes
   normées sont obtenues par des hauteurs fixes :
     padding-top 14mm + .postal-head 31mm            = adresse à 45mm ✔
     + .postal-addrzone 45mm                          = corps à 90mm  ✔

   Ce format consomme ~42mm de plus que le style premium avant le tableau.
   Les espacements ci-dessous sont resserrés en conséquence, pour qu'une vente
   courante tienne encore sur une seule page.
   ======================================================================= */
.sheet.postal { padding: 14mm 20mm 10mm; }

/* Marques de pliure et de perforation — repères de page, donc absolus. */
.sheet.postal .postal-fold { position: absolute; left: 0; width: 5mm; border-top: .6px solid #C4BAAC; }
.sheet.postal .postal-fold.f1 { top: 105mm; }
.sheet.postal .postal-fold.f2 { top: 210mm; }
.sheet.postal .postal-punch { position: absolute; left: 0; top: 148.5mm; width: 9mm; border-top: .6px solid #C4BAAC; }

.sheet.postal .postal-head { height: 31mm; flex-shrink: 0; }
.sheet.postal .s-rule { display: none; }
.sheet.postal .s-titlebar { display: none; }
.sheet.postal .s-parties { display: none; }

.sheet.postal .postal-addrzone { display: flex; gap: 10mm; height: 45mm; flex-shrink: 0; }
.sheet.postal .postal-addr { width: 85mm; flex-shrink: 0; }
.sheet.postal .postal-addr .sender {
  font-size: 6.5pt; color: var(--muted);
  border-bottom: .5px solid var(--rule); padding-bottom: 1mm; margin-bottom: 3mm;
}
.sheet.postal .postal-info { flex: 1; font-size: 8.5pt; padding-top: 0; }
.sheet.postal .postal-info .r { display: flex; justify-content: space-between; gap: 4mm; padding: .7mm 0; }
.sheet.postal .postal-info .r > span:first-child { color: var(--muted); }
.sheet.postal .postal-info .r > span:last-child { font-weight: 600; text-align: right; }
.sheet.postal .postal-info .r.hi > span:last-child { color: var(--accent); }

.sheet.postal .s-title { font-size: 20pt; }
.sheet.postal .postal-subject { font-weight: 700; font-size: 10.5pt; margin: 3mm 0 6mm; }

/* Pied de page en trois colonnes — mentions obligatoires regroupées. */
.sheet.postal .postal-foot {
  margin-top: auto; padding-top: 2.5mm; border-top: 1px solid var(--rule);
  display: flex; gap: 7mm; font-size: 6.8pt; color: var(--muted); line-height: 1.5;
  break-inside: avoid;
}
.sheet.postal .postal-foot > div { flex: 1; }
.sheet.postal .postal-foot b {
  display: block; color: var(--accent); font-size: 6.5pt; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; margin-bottom: 1mm;
}
/* Le pied normé remplace le bloc de mentions du style premium. */
.sheet.postal .s-legal { margin-top: 4mm; padding-top: 0; }
.sheet.postal .s-legal .imprint { display: none; }
.sheet.postal .s-foot { margin-top: 5mm; }
/* Le format postal démarre le corps 42mm plus bas : le bloc signature du bon
   de livraison doit être resserré pour que la page unique tienne encore. */
.sheet.postal .s-sign { margin-top: 4mm; }

/* =======================================================================
   3. RESPONSIVE
   ======================================================================= */
/* `screen and` est indispensable : à l'impression la page A4 mesure ~794 px,
   donc une media query en max-width s'appliquerait aussi au PDF et masquerait
   la feuille (règle body[data-tab="form"] .pane-preview). */
@media screen and (max-width: 1000px) {
  body { overflow: auto; }
  .app { height: auto; min-height: 100dvh; }
  .body { grid-template-columns: 1fr; }
  .pane-form, .pane-preview { overflow: visible; border-right: 0; }
  .pane-preview { padding: 16px 12px 100px; }

  .mobile-tabs {
    display: flex; position: sticky; top: 0; z-index: 40;
    background: #1A1614; border-bottom: 1px solid #2E2823;
  }
  .mobile-tabs button {
    flex: 1; appearance: none; border: 0; background: transparent; color: #8A7F73;
    font: inherit; font-size: 13.5px; font-weight: 600; padding: 12px; cursor: pointer;
    border-bottom: 2px solid transparent;
  }
  .mobile-tabs button[aria-pressed="true"] { color: #EDE6DC; border-bottom-color: var(--accent, #B8553A); }

  body[data-tab="form"] .pane-preview { display: none; }
  body[data-tab="preview"] .pane-form { display: none; }

  .fab {
    display: flex; position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 45;
    gap: 8px;
  }
  .fab .btn { flex: 1; justify-content: center; padding: 13px; font-size: 14px; border-radius: 10px; }
  .topbar .desktop-only { display: none; }
  .row.c3 { grid-template-columns: 1fr 1fr; }
  .spec-row { grid-template-columns: 1fr; }
}

@media screen and (max-width: 520px) {
  .row.c2, .row.c3, .row.c21, .row.c12 { grid-template-columns: 1fr; }
  .topbar { gap: 8px; padding: 9px 12px; }
  .topbar .logo small { display: none; }
  .sec-body { padding: 4px 12px 16px; }
}

/* =======================================================================
   4. IMPRESSION — seule la feuille sort
   ======================================================================= */
@page { size: A4; margin: 0; }

@media print {
  html, body { background: #fff; overflow: visible; height: auto; }
  .topbar, .pane-form, .mobile-tabs, .fab, .no-print { display: none !important; }
  .app { display: block; height: auto; }
  .body { display: block; }
  .pane-preview { display: block !important; overflow: visible; padding: 0; background: #fff; }
  /* La mise à l'échelle d'écran est appliquée en style inline par le JS :
     tout doit être neutralisé ici, sinon la feuille sort réduite et décalée. */
  .preview-scaler {
    transform: none !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
  }
  .sheet {
    width: 210mm; min-height: 297mm;
    box-shadow: none; margin: 0;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  .s-table thead { display: table-header-group; }
  .s-foot, .s-deposit, .s-callout, .s-sign { break-inside: avoid; }
}