/* ---- Self-hosted brand faces (Fontsource 5.3.0, SIL Open Font License) ----
   These were served from the Google Fonts CDN until 2026-08-07. The CDN hands different
   builds to different browser versions and operating systems, so the same invoice printed
   from Windows/Chrome 149 embedded "Inter"/"Inter-Medium" while macOS/Chrome 151 embedded
   "Inter-Regular"/"Inter-Regular_Medium" — the printed document's typography depended on
   whose machine produced it. Serving the exact files from our own wwwroot makes output
   deterministic, and removes an external network dependency from the invoice print path.
   font-display:block so a cold cache never prints a fallback face. */
@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:block;
  src:url('../fonts/inter-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:block;
  src:url('../fonts/inter-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:Cinzel;font-style:normal;font-weight:600;font-display:block;
  src:url('../fonts/cinzel-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:400;font-display:block;
  src:url('../fonts/cormorant-garamond-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:400;font-display:block;
  src:url('../fonts/cormorant-garamond-latin-400-italic.woff2') format('woff2')}

:root{--ink:#0c0c0d;--ink2:#141416;--panel:#17171a;--line:#2a2a2e;--white:#f5f5f5;--steel:#9a9a9e}
/* Brand: greyscale only. The Kendo default theme derives all primary-* variants from this one
   token via relative oklch, so overriding it to the brand ink turns every accent greyscale. */
:root{--kendo-color-primary:var(--ink2)}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:Inter,Arial,sans-serif;color:#222;background:#f2f2f2}
h1{font-family:'Cormorant Garamond',serif;font-weight:600;color:#111;font-size:30px;margin:0}
.sc-shell{display:flex;min-height:100vh}
.sc-side{width:248px;flex:0 0 248px;background:var(--ink);color:var(--white);display:flex;flex-direction:column;padding:22px 16px}
.sc-brand{display:flex;align-items:center;gap:12px;padding:6px 8px 20px;border-bottom:1px solid var(--line)}
.sc-brand img{height:40px}
.sc-brand-name{font-family:Cinzel,serif;letter-spacing:.18em;font-size:13px;line-height:1.25}
.sc-brand-name span{color:var(--steel);font-size:11px}
.sc-nav{display:flex;flex-direction:column;gap:4px;margin-top:18px}
.sc-link{display:flex;align-items:center;gap:10px;color:#d6d6d9;text-decoration:none;padding:11px 12px;border-radius:6px;font-size:14px;letter-spacing:.02em}
.sc-link:hover{background:#1e1e22;color:#fff}
.sc-link.active{background:#232327;color:#fff}
.sc-side-foot{margin-top:auto;border-top:1px solid var(--line);padding-top:14px;font-size:12px;color:var(--steel)}
.sc-user{color:#cfcfd2;margin-bottom:2px}
.sc-user-client{color:var(--steel);font-size:11px;margin-bottom:6px;letter-spacing:.04em}
.sc-switcher{margin:16px 4px 0;padding:0 4px}
.sc-switcher-label{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel);margin-bottom:5px}
.sc-nav-group{margin:20px 12px 2px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.sc-loading{color:#888;padding:40px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:20px}
.sc-noaccess{max-width:520px;margin:12vh auto;text-align:center}
.sc-noaccess img{height:64px;opacity:.85;margin-bottom:18px}
.sc-admin-toolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px}
.sc-admin-note{color:#888;font-size:12.5px;margin-top:12px}
.sc-membership-panel{padding:8px 4px}
.sc-membership-table{border-collapse:collapse;margin-top:6px}
.sc-membership-table td{padding:4px 14px 4px 0}
.sc-add-user label{display:block;font-size:12px;color:#555;margin:12px 0 4px}
.sc-add-user .sc-add-invite{display:flex;align-items:center;gap:8px;margin-top:14px}
.sc-current-phase strong{color:#111}
.sc-lifecycle-badge{font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border:1px solid #bbb;border-radius:4px;color:#444}
.sc-lc-live{background:var(--ink2);color:#fff;border-color:var(--ink2)}
.sc-lc-draft{background:#e9e9e9}
.sc-phase-block{margin-bottom:28px;padding:4px 14px 10px;border-left:3px solid #ddd}
.sc-phase-current{border-left-color:var(--ink2)}
.sc-phase-head{display:flex;justify-content:space-between;align-items:center}
.sc-phase-head h2{font-family:'Cormorant Garamond',serif;font-size:22px;margin:10px 0}
.sc-objective-card{margin:10px 0}
.sc-obj-actions{float:right;display:inline-flex;gap:6px}
.sc-obj-desc{color:#555;font-size:13px;margin:0 0 10px}
.sc-activity-table{width:100%;border-collapse:collapse;font-size:13px}
.sc-activity-table th{text-align:left;color:#888;font-weight:500;padding:6px 10px 6px 0;border-bottom:1px solid #e4e4e4}
.sc-activity-table td{padding:8px 10px 8px 0;border-bottom:1px solid #f0f0f0;vertical-align:top}
.sc-activity-notes{color:#888;font-size:12px;margin-top:2px}
.sc-chip{display:inline-block;font-size:11px;padding:2px 9px;border-radius:10px;border:1px solid #ccc;color:#444;background:#f4f4f4}
.sc-chip-inprogress{background:#e2e2e2;border-color:#aaa}
.sc-chip-blocked{background:var(--ink2);color:#fff;border-color:var(--ink2)}
.sc-chip-complete{background:#fff;border-color:#999;text-decoration:none}
.sc-chip-owner{background:#fff}
.sc-dep-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid #eee}
.sc-inline-create{margin-top:8px;padding:10px 12px;border:1px solid #e0e0e0;border-radius:8px;background:#fafafa}
.sc-owner-user{color:#555;font-size:12.5px;margin-left:6px}
.sc-docs-panel{margin-top:4px}
.sc-doc-row{display:flex;align-items:center;gap:10px;padding:5px 0;border-bottom:1px solid #f0f0f0;font-size:13px}
.sc-docs-compact .sc-doc-row{border-bottom:none;padding:2px 0;font-size:12px}
.sc-doc-name{color:#222;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.sc-doc-size{color:#999;font-size:11.5px}
.sc-doc-upload{margin-top:10px}
.sc-check-row{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:13px;color:#333}
.sc-switch-offer{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #ccc;border-radius:8px;background:#f6f6f6;margin-bottom:12px}
.sc-line-row{display:flex;gap:8px;align-items:center;margin-top:6px}
.sc-invoice-totals{margin-top:12px;font-size:13.5px;color:#333}
.sc-pay-paid{background:#fff;border-color:#888}
.sc-pay-unpaid{background:#e9e9e9}
.sc-pay-overdue{background:var(--ink2);color:#fff;border-color:var(--ink2)}

/* ---- Invoice print view (replica of the reference template, greyscale) ---- */
.sc-print-page{background:#fff;min-height:100vh;padding:24px;color:#1b1b1d;font-family:Inter,Arial,sans-serif}
.inv-actions{max-width:820px;margin:0 auto 14px;display:flex;justify-content:space-between;align-items:center}
.inv-actions a{color:#444}
.inv-actions button{padding:7px 16px;border:1px solid #222;background:#141416;color:#fff;border-radius:6px;cursor:pointer}
.inv-sheet{max-width:820px;margin:0 auto;background:#fff}
.inv-header{display:flex;justify-content:space-between;gap:24px;padding-bottom:18px;border-bottom:4px solid #141416}
.inv-brand{display:flex;gap:14px}
.inv-brand img{height:72px}
.inv-company{font-family:Cinzel,serif;font-size:17px;letter-spacing:.08em;font-weight:600}
.inv-tagline{color:#8a8a8e;font-size:11.5px;margin:2px 0 6px}
.inv-contact{font-size:11.5px;color:#444;line-height:1.5}
.inv-title{font-family:Cinzel,serif;font-size:34px;font-weight:700;text-align:right;letter-spacing:.04em}
.inv-meta table{margin-left:auto;font-size:12.5px;border-collapse:collapse}
.inv-meta td{padding:1.5px 0 1.5px 12px;text-align:right}
.inv-meta td:first-child{color:#777}
.inv-parties{display:flex;gap:16px;margin:20px 0}
.inv-panel{flex:1;border:1px solid #e2e2e2;background:#f7f7f7;padding:12px 14px;font-size:12.5px;line-height:1.55}
.inv-panel-label{font-size:10.5px;letter-spacing:.2em;color:#888;margin-bottom:6px}
.inv-panel-name{font-weight:600;font-size:14px}
.inv-reference{display:flex;align-items:baseline;gap:12px;border:1px solid #e2e2e2;border-left:4px solid #141416;background:#fbfbfb;padding:9px 14px;margin:-6px 0 14px;font-size:12.5px}
.inv-reference .inv-panel-label{margin-bottom:0}
.inv-reference-name{font-weight:600;font-size:13.5px}
.inv-reference-note{color:#888;font-size:11.5px}
.inv-lines{width:100%;border-collapse:collapse;font-size:12.5px;margin-top:6px}
.inv-lines th{background:#141416;color:#fff;text-align:left;padding:8px 10px;font-size:11px;letter-spacing:.08em}
.inv-lines th:not(.inv-desc),.inv-lines td:not(.inv-desc){text-align:right;width:88px}
.inv-lines th:first-child,.inv-lines td:first-child{width:34px;text-align:left}
.inv-lines td{padding:8px 10px;border-bottom:1px solid #ececec}
.inv-lines tbody tr:nth-child(even){background:#f7f7f7}
.inv-totals{display:flex;justify-content:flex-end;margin-top:10px}
.inv-totals table{font-size:13px;border-collapse:collapse;min-width:260px}
.inv-totals td{padding:6px 10px;text-align:right;border-bottom:1px solid #ececec}
.inv-totals td:first-child{color:#555}
.inv-total-due td{background:#e7e7e7;font-weight:700}
.inv-remit{margin-top:26px;border:1px solid #e2e2e2;background:#f7f7f7;padding:12px 14px;font-size:12.5px}
.inv-remit-text{white-space:pre-line;line-height:1.7}
.inv-notes{margin-top:16px;font-size:12px;color:#555}
.inv-notes .inv-panel-label{margin-bottom:4px}
.inv-footer{display:flex;justify-content:space-between;margin-top:36px;padding-top:8px;border-top:1px solid #ddd;font-size:10.5px;color:#999}
/* Print geometry. A zero page margin leaves Chrome nowhere to draw its own header/footer
   furniture (timestamp, page title, source URL, "1/1") — that chrome is the browser's, not
   the document's, and it must never appear on an issued invoice. The sheet supplies its own
   margin instead, so output no longer depends on the operator's print-dialog checkboxes. */
@page{margin:0}
@media print{
  .inv-actions{display:none}
  .sc-print-page{padding:0.5in 0.55in}
}
.sc-phase-preview{color:#444;line-height:1.9}
.sc-gantt{margin-top:6px}
.sc-signout{color:var(--steel);text-decoration:none;border-bottom:1px solid var(--line)}
.sc-main{flex:1;padding:34px 40px;overflow:auto}
.sc-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:26px}
.sc-sub{font-family:'Cormorant Garamond',serif;font-style:italic;color:#666;margin:4px 0 0}
.sc-welcome{font-size:12.5px;color:#888}
.sc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}
.sc-card{border:1px solid #e4e4e4;border-radius:12px}
.sc-soon{opacity:.72}
.sc-note{color:#888;font-size:12.5px;margin-top:14px}

/* ---- Public landing + sign-in interstitial (anonymous surfaces; dark brand entrance) ---- */
.sc-landing{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--ink);color:var(--white);padding:24px}
.sc-landing-card{max-width:460px;width:100%;text-align:center;padding:8px}
.sc-landing-mark{height:88px;margin-bottom:26px;opacity:.95}
.sc-landing-word{font-family:Cinzel,serif;font-weight:600;letter-spacing:.28em;font-size:26px;line-height:1.35;color:var(--white);margin:0}
.sc-landing-word span{display:block;font-size:15px;letter-spacing:.34em;color:var(--steel);margin-top:2px}
.sc-landing-tag{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:19px;color:var(--steel);margin:14px 0 30px}
.sc-login-btn{display:inline-block;min-width:200px;padding:13px 34px;background:var(--white);color:var(--ink2);text-decoration:none;border-radius:6px;font-size:14px;letter-spacing:.12em;text-transform:uppercase;transition:background .15s,transform .15s}
.sc-login-btn:hover{background:#fff;transform:translateY(-1px)}
.sc-login-btn:focus-visible{outline:2px solid #cfcfd2;outline-offset:3px}
.sc-landing-secure{margin-top:18px;font-size:11.5px;letter-spacing:.06em;color:#6f6f74}
.sc-login-link{color:var(--white);text-decoration:underline;text-underline-offset:2px}
.sc-landing-connecting{font-family:'Cormorant Garamond',serif;font-weight:600;letter-spacing:.02em;font-size:26px;color:var(--white);text-transform:none;margin:6px 0 0}
.sc-spinner{width:30px;height:30px;margin:0 auto 12px;border:2px solid #34343a;border-top-color:var(--white);border-radius:50%;animation:sc-spin .8s linear infinite}
@keyframes sc-spin{to{transform:rotate(360deg)}}
@media (max-width:520px){.sc-landing-mark{height:70px}.sc-landing-word{font-size:22px}}
