/* ============================================================
   VIKING ABSTRACT — CLOSING STATEMENT CALCULATOR
   Single-file drop-in. Edit the CONFIG block in the script
   below to set the logo image and company details.
   ============================================================ */
.vss-app{
  --ink:#16202B; --slate:#2C3E4F; --steel:#5B7086; --mist:#93A5B5;
  --frost:#E8EDF1; --parchment:#FBFAF6; --paper:#FFFFFF;
  --brass:#B4894A; --brass-lt:#E4D3B4;
  --oxblood:#8C2F27; --sea:#1F5F63;
  --rule:#CBD6DF;
  --shadow:0 1px 2px rgba(22,32,43,.06),0 8px 24px rgba(22,32,43,.06);
}
.vss-app{box-sizing:border-box}
.vss-app,.vss-app{margin:0;padding:0}
.vss-app{
  background:var(--frost);
  color:var(--ink);
  font:15px/1.5 "IBM Plex Sans",system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.vss-app .wrap{max-width:1240px;margin:0 auto;padding:0 20px 96px}/* ---------- masthead ---------- */
.vss-app .masthead{background:var(--ink);color:#fff;border-bottom:3px solid var(--brass)}
.vss-app .masthead .wrap{padding-top:20px;padding-bottom:20px;display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.vss-app .mark{display:flex;align-items:center;gap:14px}
.vss-app .mark img{height:46px;width:auto;display:block}
.vss-app .mark .fallback{
  width:44px;height:44px;border:2px solid var(--brass);border-radius:3px;
  display:grid;place-items:center;font:700 20px "IBM Plex Sans Condensed",sans-serif;color:var(--brass);
}
.vss-app .mark h1{
  margin:0;font:600 21px/1.1 "IBM Plex Sans Condensed",sans-serif;
  letter-spacing:.14em;text-transform:uppercase;
}
.vss-app .mark p{margin:3px 0 0;font:400 12px/1.2 "IBM Plex Mono",monospace;color:var(--brass-lt);letter-spacing:.06em}
.vss-app .masthead .tel{margin-left:auto;text-align:right}
.vss-app .masthead .tel a{color:#fff;text-decoration:none;font:600 19px "IBM Plex Mono",monospace;letter-spacing:.02em}
.vss-app .masthead .tel span{display:block;font:500 10px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--mist);margin-bottom:2px}/* ---------- intro strip ---------- */
.vss-app .strip{background:var(--slate);color:#DCE5EC}
.vss-app .strip .wrap{padding:14px 20px;display:flex;gap:26px;flex-wrap:wrap;align-items:baseline}
.vss-app .strip h2{margin:0;font:700 15px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#fff}
.vss-app .strip p{margin:0;font-size:13px;color:#B7C6D2;max-width:70ch}/* ---------- layout ---------- */
.vss-app .grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start;margin-top:26px}
@media(max-width:1020px){
.vss-app .grid{grid-template-columns:1fr}}/* ---------- panels ---------- */
.vss-app .panel{background:var(--paper);border:1px solid var(--rule);border-radius:4px;box-shadow:var(--shadow);margin-bottom:20px;overflow:hidden}
.vss-app .panel > header{
  display:flex;align-items:center;gap:10px;padding:12px 18px;
  background:var(--parchment);border-bottom:1px solid var(--rule);
}
.vss-app .panel > header h3{
  margin:0;font:700 13px "IBM Plex Sans Condensed",sans-serif;
  letter-spacing:.15em;text-transform:uppercase;color:var(--slate);
}
.vss-app .panel > header .tag{
  margin-left:auto;font:500 10px "IBM Plex Mono",monospace;letter-spacing:.08em;
  color:var(--steel);text-transform:uppercase;
}
.vss-app .panel .body{padding:18px}/* ---------- form fields ---------- */
.vss-app .fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px 16px}
.vss-app .f{display:flex;flex-direction:column;gap:5px;min-width:0}
.vss-app .f.span2{grid-column:span 2}
@media(max-width:640px){
.vss-app .f.span2{grid-column:span 1}}
.vss-app label,.vss-app .lab{
  font:600 10.5px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.13em;
  text-transform:uppercase;color:var(--steel);
}
.vss-app input,.vss-app select,.vss-app textarea{
  font:400 14px "IBM Plex Sans",sans-serif;color:var(--ink);
  padding:8px 10px;border:1px solid var(--rule);border-radius:3px;background:#fff;width:100%;
}
.vss-app input[type=number],.vss-app input.money{font-family:"IBM Plex Mono",monospace;font-variant-numeric:tabular-nums;text-align:right}
.vss-app input:focus,.vss-app select:focus,.vss-app textarea:focus{outline:2px solid var(--brass);outline-offset:1px;border-color:var(--brass)}
.vss-app .hint{font:400 11.5px/1.4 "IBM Plex Sans",sans-serif;color:var(--steel)}
.vss-app .chk{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--slate)}
.vss-app .chk input{width:auto}/* ---------- ledger tables ---------- */
.vss-app table.led{width:100%;border-collapse:collapse}
.vss-app table.led th{
  font:600 10px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.13em;text-transform:uppercase;
  color:var(--steel);text-align:left;padding:0 8px 7px;border-bottom:1px solid var(--rule);
}
.vss-app table.led th.num{text-align:right;width:120px}
.vss-app table.led th.who{width:132px}
.vss-app table.led th.x{width:34px}
.vss-app table.led td{padding:5px 8px;border-bottom:1px solid #EEF2F5;vertical-align:middle}
.vss-app table.led td.num input{text-align:right}
.vss-app table.led tr.auto td:first-child{position:relative}
.vss-app .badge{
  display:inline-block;margin-left:7px;padding:1px 5px;border-radius:2px;
  font:600 9px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.1em;text-transform:uppercase;
  background:var(--brass-lt);color:#5E461E;vertical-align:1px;
}
.vss-app .badge.na{background:#EDF1F4;color:var(--mist)}
.vss-app .rowdesc{font-size:13.5px;color:var(--ink)}
.vss-app .rowdesc small{display:block;font-size:11px;color:var(--steel);line-height:1.35;font-family:"IBM Plex Mono",monospace}
.vss-app .del{background:none;border:0;color:var(--mist);cursor:pointer;font-size:17px;line-height:1;padding:2px 6px;border-radius:3px}
.vss-app .del:hover{color:var(--oxblood);background:#FBEEED}
.vss-app .addrow{
  margin-top:10px;background:none;border:1px dashed var(--rule);color:var(--steel);
  padding:8px 12px;border-radius:3px;cursor:pointer;
  font:600 10.5px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.13em;text-transform:uppercase;
}
.vss-app .addrow:hover{border-color:var(--brass);color:var(--brass)}/* ---------- proration cards ---------- */
.vss-app .prorate{border:1px solid var(--rule);border-radius:3px;padding:12px;margin-bottom:12px;background:var(--parchment)}
.vss-app .prorate .head{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.vss-app .prorate .head input{font-weight:600}
.vss-app .prorate .res{
  margin-top:10px;padding-top:9px;border-top:1px solid var(--rule);
  font:500 12.5px "IBM Plex Mono",monospace;color:var(--slate);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.vss-app .prorate .res b{color:var(--sea);font-weight:600}/* ---------- signature: the ledger rail ---------- */
.vss-app .rail{position:sticky;top:16px}
.vss-app .rail .card{background:var(--ink);color:#fff;border-radius:4px;overflow:hidden;box-shadow:var(--shadow)}
.vss-app .rail .card h4{
  margin:0;padding:12px 16px;background:#0F1821;border-bottom:1px solid var(--brass);
  font:700 11px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-lt);
}
.vss-app .rail .side{padding:14px 16px}
.vss-app .rail .side + .side{border-top:1px solid #2A3743}
.vss-app .rail .side .who{font:600 10px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--mist)}
.vss-app .rail .big{font:600 27px/1.15 "IBM Plex Mono",monospace;font-variant-numeric:tabular-nums;margin:5px 0 9px;letter-spacing:-.01em}
.vss-app .rail .big.pos{color:#7FD1B9}
.vss-app .rail .big.neg{color:#E8938B}
.vss-app .rail dl{margin:0;font:400 12px/1.7 "IBM Plex Mono",monospace;font-variant-numeric:tabular-nums}
.vss-app .rail dl div{display:flex;justify-content:space-between;gap:10px;color:#A9BBC9}
.vss-app .rail dl div.tot{color:#fff;border-top:1px solid #2A3743;margin-top:5px;padding-top:5px;font-weight:600}
.vss-app .rail dl dt,.vss-app .rail dl dd{margin:0}
.vss-app .rail .acts{padding:14px 16px;background:#0F1821;display:grid;gap:8px}
.vss-app .btn{
  display:block;width:100%;text-align:center;cursor:pointer;border:0;border-radius:3px;padding:11px 14px;
  font:700 11.5px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.16em;text-transform:uppercase;
}
.vss-app .btn.gold{background:var(--brass);color:#16202B}
.vss-app .btn.gold:hover{background:#C79B58}
.vss-app .btn.ghost{background:none;color:#A9BBC9;border:1px solid #2A3743}
.vss-app .btn.ghost:hover{color:#fff;border-color:var(--steel)}
.vss-app .railnote{font:400 11px/1.5 "IBM Plex Sans",sans-serif;color:var(--steel);padding:12px 2px 0}/* ---------- rate status bar ---------- */
.vss-app .ratebar{
  display:flex;gap:16px;align-items:baseline;flex-wrap:wrap;
  background:#F2F7F4;border:1px solid #BFD8CB;border-left:3px solid var(--sea);
  border-radius:0 3px 3px 0;padding:10px 14px;margin-top:22px;
}
.vss-app .ratebar b{font:600 11px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.13em;text-transform:uppercase;color:var(--sea)}
.vss-app .ratebar span{font:400 12px "IBM Plex Mono",monospace;color:var(--steel)}
.vss-app .ratebar.stale{background:#FDF3F2;border-color:#E4BDB9;border-left-color:var(--oxblood)}
.vss-app .ratebar.stale b{color:var(--oxblood)}
.vss-app .ratebar.stale span{color:#7A4A45;font-family:"IBM Plex Sans",sans-serif}/* ---------- notice ---------- */
.vss-app .notice{
  border-left:3px solid var(--brass);background:#FDF8EF;padding:12px 14px;border-radius:0 3px 3px 0;
  font-size:12.5px;line-height:1.55;color:#5C4A2C;margin-top:14px;
}
.vss-app .notice b{color:#3E3218}/* ============================================================
   PRINT / PDF — the settlement statement itself
   ============================================================ *//* ============================================================
   ADDITIONS FOR THE MERGED BUILD
   New panels: withholding, CEMA, structured payoffs, warnings,
   the save/open pair and the charge-vs-credit selector.
   ============================================================ *//* A row's "kind" selector sits beside the payer selector. */
.vss-app table.led th.kind{width:104px}
.vss-app table.led td select[data-f="kind"]{font-size:13px}/* Sub-panel used for CEMA and withholding blocks. */
.vss-app .sub{border:1px solid var(--rule);border-radius:3px;background:var(--parchment);padding:12px 14px;margin-top:14px}
.vss-app .sub > .subhead{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.vss-app .sub > .subhead .lab{margin:0}
.vss-app .sub .hint{margin-top:8px}
.vss-app .sub[hidden]{display:none}
.vss-app [hidden]{display:none !important}/* Computed read-out strip, shared by CEMA, payoffs and prorations. */
.vss-app .readout{
  margin-top:10px;padding-top:9px;border-top:1px solid var(--rule);
  font:500 12.5px "IBM Plex Mono",monospace;color:var(--slate);
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.vss-app .readout b{color:var(--sea);font-weight:600}
.vss-app .readout.warn b{color:var(--oxblood)}/* Structured payoff cards. */
.vss-app .payoff{border:1px solid var(--rule);border-radius:3px;padding:12px;margin-bottom:12px;background:var(--parchment)}
.vss-app .payoff .head{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.vss-app .payoff .head input{font-weight:600}/* Warning list under the rail and above the print button. */
.vss-app .warnbox{border-left:3px solid var(--oxblood);background:#FDF3F2;padding:10px 13px;border-radius:0 3px 3px 0;margin-top:14px}
.vss-app .warnbox h5{margin:0 0 6px;font:700 10.5px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.13em;text-transform:uppercase;color:var(--oxblood)}
.vss-app .warnbox ul{margin:0;padding-left:16px;font-size:12.5px;line-height:1.5;color:#6B3B36}
.vss-app .warnbox li + li{margin-top:4px}
.vss-app .warnbox[hidden]{display:none}/* Informational (non-settlement) figures, e.g. the CEMA saving. */
.vss-app .info{
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;
  border:1px dashed var(--brass);border-radius:3px;padding:10px 13px;margin-top:14px;background:#FDF8EF;
}
.vss-app .info .k{font:600 10.5px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#5E461E}
.vss-app .info .v{font:600 15px "IBM Plex Mono",monospace;color:#5E461E}
.vss-app .info small{display:block;width:100%;font-size:11.5px;color:#7A6742;line-height:1.45}
.vss-app .info[hidden]{display:none}/* Grid children must be allowed to shrink or long ledger rows force a
   horizontal scrollbar on the whole page at narrow widths. */
.vss-app .grid > *{min-width:0}
.vss-app .panel .body{overflow-x:auto}/* Skip link for keyboard users. */
.vss-app .skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:10px 14px;z-index:10}
.vss-app .skip:focus{left:8px;top:8px}/* Visually hidden, still announced. */
.vss-app .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}/* An overridden auto figure announces itself so nobody mistakes a typed
   number for a calculated one. */
.vss-app .badge.edited{background:var(--sea);color:#fff}
.vss-app .rowdesc .lbl{display:inline}
.vss-app table.led td .del[title]{font-size:15px}/* .railnote sits on the page background (--frost), not on white, where
   --steel only reaches 4.33:1. Use the darker ink for AA. */
.vss-app .railnote{color:var(--slate)}/* ============================================================
   PREPARED-BY BLOCK
   The preparer's own details, printed beneath the figures and
   kept visually distinct from the Viking Abstract footer so the
   two are never read as the same party.
   ============================================================ *//* ============================================================
   THE PRINTED SETTLEMENT STATEMENT
   ------------------------------------------------------------
   The statement is paginated in JavaScript, not by the browser.
   Chrome cannot number pages from CSS (no @page margin boxes, so
   counter(page)/counter(pages) never render) and cannot vary a
   repeating header or footer by page, which is what "1 of 3",
   "initials on the pages without signatures" and "signatures on
   the last page" all require.

   So the typography below lives OUTSIDE @media print, scoped to
   the two containers that use it: #printdoc, which holds the
   finished pages, and #pd-measure, an off-screen container the
   paginator lays blocks out in to learn their true printed
   height. Measuring under screen styles would give the wrong
   answer; measuring in a container styled exactly like the page
   gives the right one. @media print is then left with the two
   jobs it is good at - setting up the paper and deciding what is
   visible.
   ============================================================ */
.vss-app{
  /* Letter portrait, 0.45in margins, at 96 CSS px to the inch. */
  --pd-page-w: 7.6in;      /* 8.5 - 2 x 0.45 */
  --pd-page-h: 10.05in;    /* 11  - 2 x 0.45, less a hair so a full
                              page can never round onto a second sheet */
  --pd-col-gap: 20px;
}
.vss-app #printdoc,.vss-app #pd-measure{
  font:400 10.2px/1.42 "Spectral",Georgia,"Times New Roman",serif;
  color:#000;background:#fff;
}
.vss-app #printdoc{display:none}/* Laid out for real, painted nowhere: the paginator needs boxes with
   honest heights, and the reader must never see them. */
.vss-app #pd-measure{
  position:absolute;left:-10000px;top:0;width:var(--pd-page-w);
  visibility:hidden;pointer-events:none;z-index:-1;
}
.vss-app .pd-page{
  width:var(--pd-page-w);height:var(--pd-page-h);
  display:flex;flex-direction:column;overflow:hidden;
  break-after:page;page-break-after:always;
}
.vss-app .pd-page:last-child{break-after:auto;page-break-after:auto}
.vss-app .pd-body{flex:1 1 auto;min-height:0}
.vss-app .pd-foot{flex:0 0 auto}/* ---------- letterhead, repeated on every page ---------- */
.vss-app .pd-head{display:flex;align-items:flex-start;gap:16px;
         border-bottom:2.5px solid #16202B;padding-bottom:9px;margin-bottom:12px}
.vss-app .pd-head img{height:56px;width:auto}
.vss-app .pd-head .lockup h1{margin:0;font:700 17px "IBM Plex Sans Condensed",sans-serif;
                    letter-spacing:.14em;text-transform:uppercase}
.vss-app .pd-head .lockup p{margin:2px 0 0;font:400 8.6px "IBM Plex Mono",monospace;
                   letter-spacing:.05em;color:#333}
.vss-app .pd-head .doctitle{margin-left:auto;text-align:right}
.vss-app .pd-head .doctitle strong{display:block;font:700 12.5px "IBM Plex Sans Condensed",sans-serif;
                          letter-spacing:.15em;text-transform:uppercase}
.vss-app .pd-head .doctitle span{display:block;font:400 8.6px "IBM Plex Mono",monospace;color:#333}
.vss-app .pd-stamp{
  border:2px solid #8C2F27;color:#8C2F27;padding:5px 8px;margin-bottom:10px;
  font:700 9.4px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.14em;text-transform:uppercase;
}/* ---------- file header, page one only ---------- */
.vss-app .pd-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:3px 14px;margin-bottom:13px;
         border:1px solid #16202B;padding:8px 10px}
.vss-app .pd-meta div{font-size:9.6px;break-inside:avoid}
.vss-app .pd-meta .k{font:600 7.6px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.12em;
            text-transform:uppercase;color:#444;display:block}
.vss-app .pd-meta .v{font-weight:600}/* ---------- the ledger ---------- */
.vss-app .pd-cols{display:grid;gap:var(--pd-col-gap);align-items:start}
.vss-app .pd-cols.two{grid-template-columns:1fr 1fr}
.vss-app .pd-cols.one{grid-template-columns:1fr}
.vss-app .pd-col{min-width:0}
.vss-app .pd-col > h2{
  margin:0 0 5px;padding:4px 7px;background:#16202B;color:#fff;
  font:700 9.4px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.16em;text-transform:uppercase;
}
.vss-app .pd-col h3{
  margin:7px 0 2px;font:700 8.4px "IBM Plex Sans Condensed",sans-serif;
  letter-spacing:.13em;text-transform:uppercase;color:#16202B;
  border-bottom:1px solid #16202B;padding-bottom:2px;
}
.vss-app .pd-col h3 .cont{font-weight:400;letter-spacing:.06em;text-transform:none;color:#555}
.vss-app table.pd{width:100%;border-collapse:collapse;font-size:9.5px}
.vss-app table.pd td{padding:1.6px 0;vertical-align:top}
.vss-app table.pd td.n{text-align:right;font:400 9.5px "IBM Plex Mono",monospace;
              font-variant-numeric:tabular-nums;white-space:nowrap;padding-left:8px}
.vss-app table.pd td.poc{font:400 8.4px "IBM Plex Mono",monospace;color:#444;text-align:right;
                white-space:nowrap;padding-left:6px}
.vss-app table.pd tr.sub td{border-top:1px solid #999;font-weight:600;padding-top:3px}
.vss-app table.pd tr.sub td.n{font-family:"IBM Plex Mono",monospace}
.vss-app .pd-net{margin-top:8px;border:2px solid #16202B;padding:6px 8px;display:flex;
        justify-content:space-between;gap:10px;
        font:700 11.5px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.06em;text-transform:uppercase}
.vss-app .pd-net span:last-child{font-family:"IBM Plex Mono",monospace;font-variant-numeric:tabular-nums}
.vss-app .pd-notes{margin-top:14px;border-top:1px solid #999;padding-top:7px;font-size:9.2px;white-space:pre-wrap}
.vss-app .pd-notes h3{margin:0 0 3px;font:700 8.4px "IBM Plex Sans Condensed",sans-serif;
             letter-spacing:.13em;text-transform:uppercase}/* ---------- initials, on the pages nobody signs ---------- */
.vss-app .pd-initials{
  display:flex;gap:22px;flex-wrap:wrap;align-items:flex-end;
  border-top:1px solid #999;padding-top:8px;margin-top:10px;
}
.vss-app .pd-initials div{
  flex:1 1 0;min-width:0;border-bottom:1px solid #000;padding-bottom:1px;
  font:400 7.6px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.1em;text-transform:uppercase;
  /* the initials sit on the rule, so leave a line of height above it */
  padding-top:1.42em;
}/* ---------- signatures, last page only ---------- */
.vss-app .pd-sign{margin-top:12px;display:grid;gap:30px;break-inside:avoid}
.vss-app .pd-sign.two{grid-template-columns:1fr 1fr}
.vss-app .pd-sign.one{grid-template-columns:1fr 1fr}/* Room to actually sign. Four blank lines of the statement's own leading above
   every signature rule, always - padding on the column, not a margin, so it
   cannot collapse when the block sits at the top of its box. The column
   inherits the 10.2px/1.42 body type, so 1.42em is exactly one line. */
.vss-app #printdoc,.vss-app #pd-measure{--sig-blank-lines:4}
.vss-app .pd-sign .pd-signcol{padding-top:calc(var(--sig-blank-lines) * 1.42em)}
.vss-app .pd-sign .pd-sigline{border-top:1px solid #000;padding-top:3px;
                     font:400 8.4px "IBM Plex Sans Condensed",sans-serif;
                     letter-spacing:.1em;text-transform:uppercase}
.vss-app .pd-prepared{margin-top:10px;border:1px solid #16202B;padding:7px 9px;break-inside:avoid}
.vss-app .pd-prepared h3{margin:0 0 3px;font:700 7.6px "IBM Plex Sans Condensed",sans-serif;
                letter-spacing:.14em;text-transform:uppercase;color:#444}
.vss-app .pd-prepared .nm{font-weight:600;font-size:10px}
.vss-app .pd-prepared .ln{font-size:9.2px;line-height:1.4}
.vss-app .pd-prepared .ct{font:400 8.6px "IBM Plex Mono",monospace;margin-top:2px}/* ---------- the required footer, on every page ---------- */
.vss-app .pd-legal{
  border-top:1.5px solid #16202B;padding-top:5px;margin-top:10px;
  font:400 7.4px/1.35 "IBM Plex Sans",Arial,sans-serif;color:#000;
}
.vss-app .pd-legal .courtesy{font:700 8.4px "IBM Plex Sans Condensed",sans-serif;
                    letter-spacing:.14em;text-transform:uppercase;margin-bottom:2px}
.vss-app .pd-legal .contact{font-family:"IBM Plex Mono",monospace;font-size:7.2px;margin-bottom:3px}
.vss-app .pd-legal .disc{font-style:italic}
.vss-app .pd-legal .pageno{
  float:right;font:600 8.4px "IBM Plex Sans Condensed",sans-serif;
  /* Tight enough that the number extracts as one word when the PDF is
     searched or copied - wide tracking makes it come out as "PA G E 1 O F 2". */
  letter-spacing:.04em;text-transform:uppercase;
}
/* The statement-view selector sits with the actions in the dark rail. */
.vss-app .btnsel{
  width:100%;border:1px solid #2A3743;background:#16202B;color:#E8EDF1;
  border-radius:3px;padding:10px 12px;
  font:700 11.5px "IBM Plex Sans Condensed",sans-serif;letter-spacing:.12em;text-transform:uppercase;
}
.vss-app .btnsel:focus{outline:2px solid var(--brass);outline-offset:1px}/* A side that finished on an earlier page says so, rather than leaving a
   labeled but empty column that reads as a printing fault. */
.vss-app .pd-col .pd-none{margin:6px 0 0;font-size:9px;font-style:italic;color:#555}

/* ---- print isolation for the plugin build ----
   The statement is nested inside the theme's markup, so the standalone
   build's "hide these wrappers" approach cannot work here: the calculator
   does not know what the theme calls them.

   Hiding the host by `visibility` was the first attempt and is wrong. It
   leaves every one of the theme's boxes in the layout, so Chrome still
   paginates the full height of the page and the job comes out as the
   statement followed by six blank sheets. Only `display:none` collapses it.

   So the script walks up from #printdoc at beforeprint and tags each
   ancestor's siblings with .vss-print-hide; these rules do the rest. That is
   depth-independent and needs no knowledge of the theme's markup. */
@media print{
  @page{size:letter portrait;margin:0.45in}
  html,body{background:#fff !important}
  .vss-print-hide{display:none !important}
  .vss-print-keep{
    margin:0 !important;padding:0 !important;border:0 !important;
    width:auto !important;max-width:none !important;min-height:0 !important;
    background:#fff !important;box-shadow:none !important;
  }
  .vss-app #printdoc{
    display:block !important;
    position:static !important;
    width:100% !important;margin:0 !important;padding:0 !important;
  }
  .vss-app #pd-measure{display:none !important}
}