*{box-sizing:border-box}
body{margin:0;background:#f4f6f8;color:#1d2733;font:16px/1.55 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
.sbp-wrap{max-width:760px;margin:0 auto;padding:0 16px}
.sbp-top{background:#fff;border-bottom:4px solid var(--sbp-brand);padding:16px 0}
.sbp-logo{max-height:52px;display:block}.sbp-name{font-size:20px}
main{padding-top:20px;padding-bottom:30px}
.sbp-box{background:#fff;border-radius:10px;padding:22px;margin:0 0 16px;box-shadow:0 1px 2px rgba(0,0,0,.05)}
h1{font-size:24px;margin:0 0 6px}h2{font-size:19px;margin:0 0 14px}h3{font-size:15px;margin:18px 0 8px}
.sbp-muted{color:#6b7785;font-size:14px}
.sbp-notice{padding:14px 18px;border-radius:8px;margin:0 0 16px;font-weight:600}
.sbp-success{background:#d1f0dc;color:#14532d}.sbp-error{background:#fde2e1;color:#7f1d1d}
.sbp-table{width:100%;border-collapse:collapse;font-size:15px}
.sbp-table th,.sbp-table td{padding:8px 6px;border-bottom:1px solid #e6e9ed;text-align:left}
.sbp-table .r{text-align:right}.sbp-total td{font-weight:700;font-size:17px;border-bottom:0}
.sbp-badge{display:inline-block;padding:2px 10px;border-radius:99px;background:#eef0f2;font-size:12px;font-weight:700;vertical-align:middle}
.sbp-badge.sbp-sent{background:#fff3cd}.sbp-badge.sbp-approved,.sbp-badge.sbp-paid{background:#d1f0dc}.sbp-badge.sbp-declined{background:#f8d7da}
.sbp-sched{padding-left:20px;margin:0}
.sbp-sign{margin-top:20px;padding-top:6px;border-top:1px solid #e6e9ed}
.sbp-sign label{display:block;font-size:14px;margin:10px 0}
.sbp-sign input[type=text]{display:block;width:100%;margin-top:6px;padding:12px;font-size:18px;border:1px solid #c5ccd3;border-radius:8px;font-family:"Snell Roundhand","Segoe Script",cursive}
.sbp-check{display:flex!important;gap:10px;align-items:flex-start}.sbp-check input{margin-top:4px}
.sbp-btn{background:var(--sbp-brand);color:#fff;border:0;border-radius:8px;padding:13px 24px;font-weight:700;font-size:16px;cursor:pointer}
.sbp-btn:hover{filter:brightness(.93)}
.sbp-link{background:none;border:0;color:#6b7785;text-decoration:underline;cursor:pointer;padding:10px 0}
.sbp-signed{background:#f0faf4;padding:12px 16px;border-radius:8px;margin:16px 0 0}
.sbp-inv{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid #e6e9ed;flex-wrap:wrap}
.sbp-inv:last-child{border-bottom:0}
.sbp-inv-r{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.sbp-fee{flex-basis:100%;font-size:.88rem;text-align:right}
.sbp-updates{list-style:none;padding:0;margin:0}.sbp-updates li{padding:10px 0;border-bottom:1px solid #e6e9ed}
.sbp-terms{margin-top:14px;font-size:14px}
.sbp-hp{position:absolute;left:-9999px;height:0;overflow:hidden}
.sbp-foot{text-align:center;color:#6b7785;font-size:13px;padding:18px 0 32px}
@media(max-width:520px){.sbp-box{padding:16px}.sbp-inv-r{width:100%;justify-content:space-between}}

/* Project progress */
.sbp-bar { height: 12px; background: #e6e9ee; border-radius: 999px; overflow: hidden; margin: 8px 0; }
.sbp-bar > i { display: block; height: 100%; background: var(--sbp-brand, #2A598F); border-radius: 999px; }
.sbp-timeline { list-style: none; margin: 12px 0 0; padding: 0 0 0 4px; border-left: 2px solid #e6e9ee; }
.sbp-timeline li { position: relative; padding: 4px 0 14px 22px; }
.sbp-timeline .sbp-dot { position: absolute; left: -9px; top: 7px; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 2px solid #c3c8d0; }
.sbp-timeline .sbp-doing .sbp-dot { border-color: var(--sbp-brand, #2A598F); }
.sbp-timeline .sbp-done .sbp-dot { background: #1f9d6b; border-color: #1f9d6b; }
.sbp-timeline .sbp-late .sbp-dot { border-color: #b32d2e; }
.sbp-timeline .sbp-late .sbp-muted { color: #b32d2e; }

/* Print or save as PDF: show only the documents, no buttons or forms. */
.sbp-print { font-size: .8rem; font-weight: 400; margin-left: 8px; }
@media print {
  .sbp-top, .sbp-foot, .sbp-print, .sbp-sign, .sbp-decline, .sbp-inv-r form, .sbp-notice { display: none !important; }
  body { background: #fff; }
  .sbp-box { box-shadow: none; border: 1px solid #ccc; break-inside: avoid; }
  .sbp-terms { display: block; } .sbp-terms[open] summary { display: none; }
}

.sbp-payform { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.sbp-btn-alt { background: #fff; color: var(--sbp-brand, #2A598F); border: 2px solid var(--sbp-brand, #2A598F); }

/* Present mode: tablet at the kitchen table */
.sbp-present .sbp-wrap{max-width:980px}
.sbp-present main{padding-bottom:110px}
.sbp-present .sbp-print{display:none}
.sbp-present .sbp-hero{text-align:center;padding:30px 22px}
.sbp-present .sbp-hero h1{font-size:34px}
.sbp-present .sbp-exit{margin:0 0 10px;font-size:14px}.sbp-present .sbp-exit a{color:#6b7785}
.sbp-present .sbp-table{font-size:18px}.sbp-present .sbp-table th,.sbp-present .sbp-table td{padding:14px 8px}
.sbp-present .sbp-total td{font-size:24px}
.sbp-present h2{font-size:24px}.sbp-present h3{font-size:18px}
.sbp-present .sbp-sched li{font-size:18px;padding:4px 0}
.sbp-present .sbp-btn{padding:18px 30px;font-size:20px;border-radius:12px}
.sbp-present .sbp-sign input[type=text]{font-size:26px;padding:18px}
.sbp-present .sbp-check{font-size:16px}.sbp-present .sbp-check input{width:26px;height:26px}
.sbp-sticky{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:3px solid var(--sbp-brand);padding:12px 18px;display:flex;justify-content:space-between;align-items:center;gap:16px;z-index:5;box-shadow:0 -4px 14px rgba(0,0,0,.08)}
.sbp-sticky strong{font-size:26px;margin-left:8px}.sbp-sticky .sbp-btn{text-decoration:none;display:inline-block}
@media print{.sbp-sticky,.sbp-exit{display:none!important}}
