/* DocAISign core components and responsive document workspace. */
@font-face { font-family: "SDS Script 1"; src: url("/fonts/dancing-script.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "SDS Script 2"; src: url("/fonts/great-vibes.woff2") format("woff2"); font-display: swap; }

:root {
  --bg: #f8fafd;
  --fg: #1f1f1f;
  --muted: #444746;
  --subtle: #5f6368;
  --border: #c4c7c5;
  --line: #dadce0;
  --panel: #ffffff;
  --surface: #f0f4f9;
  --surface-hover: #e8eaed;
  --accent: #0b57d0;
  --accent-hover: #0842a0;
  --accent-soft: #d3e3fd;
  --ok: #137333;
  --ok-soft: #e6f4ea;
  --warn: #8a6100;
  --warn-soft: #fef7e0;
  --bad: #b3261e;
  --bad-soft: #fce8e6;
  --me: #0b57d0;
  --signer: #b06000;
  --radius: 10px;
  --shadow: 0 1px 2px rgba(60,64,67,.15), 0 1px 3px 1px rgba(60,64,67,.08);
}

* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--fg); }
body { font-family: "Google Sans", "Segoe UI", Roboto, system-ui, -apple-system, Arial, sans-serif; font-size: 15px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3 { line-height: 1.25; margin: 0 0 .5em; font-weight: 600; }
h1 { font-size: clamp(1.6rem, 3.6vw, 2.4rem); letter-spacing: -.01em; }
h2 { font-size: 1.3rem; }
h3 { font-size: 1.05rem; }
p { margin: 0 0 1em; }
.muted { color: var(--subtle); }
.small { font-size: .85rem; }
.wrap { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.narrow { max-width: 760px; }
.tiny-wrap { max-width: 440px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 8px; top: 8px; background: var(--accent); color: #fff; padding: 6px 10px; border-radius: 6px; z-index: 100; }
.inline { display: inline; margin: 0; }
[hidden] { display: none !important; }

/* Header */
.site-header { background: var(--panel); border-bottom: 1px solid var(--line); position: relative; z-index: 20; }
.header-row { display: flex; align-items: center; justify-content: space-between; min-height: 60px; gap: 12px; flex-wrap: wrap; }
.brand { font-weight: 700; font-size: 1.15rem; color: var(--fg); display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.brand:hover { text-decoration: none; }
.brand-mark { width: 26px; height: 26px; border-radius: 7px; background: var(--accent); color: #fff; display: inline-grid; place-items: center; font-size: 15px; }
.main-nav { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; font-size: .95rem; }
.main-nav a:not(.btn) { color: var(--muted); }
.main-nav a:not(.btn):hover { color: var(--fg); }
.nav-email { color: var(--subtle); max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.link-btn { background: none; border: 0; color: var(--muted); font: inherit; cursor: pointer; padding: 0; }
.link-btn:hover { color: var(--fg); text-decoration: underline; }

/* Buttons and forms */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--border); background: var(--panel); color: var(--fg); font: inherit; font-weight: 500; padding: 9px 18px; border-radius: 8px; cursor: pointer; text-decoration: none; min-height: 40px; }
.btn:hover { background: var(--surface-hover); text-decoration: none; }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-hover); }
.btn-danger { color: var(--bad); border-color: #f2b8b5; }
.btn-danger:hover { background: var(--bad-soft); }
.btn-sm { padding: 5px 12px; min-height: 32px; font-size: .9rem; }
.btn-lg { padding: 12px 24px; font-size: 1.05rem; min-height: 48px; }
.btn-block { width: 100%; }
label { display: block; font-weight: 500; margin: 0 0 4px; }
input[type=text], input[type=email], input[type=password], textarea, select {
  width: 100%; font: inherit; color: var(--fg); background: var(--panel); border: 1px solid var(--border); border-radius: 8px; padding: 9px 12px; }
input:focus, textarea:focus, select:focus { outline: 2px solid var(--accent); outline-offset: -1px; border-color: var(--accent); }
textarea { resize: vertical; min-height: 80px; }
.field { margin-bottom: 14px; }
.check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; }
.check input { margin-top: 4px; width: 18px; height: 18px; flex-shrink: 0; }
.alert { padding: 10px 14px; border-radius: 8px; margin: 0 0 14px; border: 1px solid; }
.alert-error { background: var(--bad-soft); border-color: #f2b8b5; color: #8c1d18; }
.alert-ok { background: var(--ok-soft); border-color: #a8dab5; color: #0d652d; }
.alert-info { background: var(--surface); border-color: var(--line); color: var(--muted); }
.alert-warn { background: var(--warn-soft); border-color: #fdd663; color: #5c4400; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; }
.page { padding-top: 32px; padding-bottom: 56px; }
.badge { display: inline-block; font-size: .78rem; font-weight: 600; padding: 2px 9px; border-radius: 999px; background: var(--surface); color: var(--muted); white-space: nowrap; }
.badge-ok { background: var(--ok-soft); color: var(--ok); }
.badge-warn { background: var(--warn-soft); color: var(--warn); }
.badge-bad { background: var(--bad-soft); color: var(--bad); }
.badge-blue { background: var(--accent-soft); color: var(--accent-hover); }

/* Home */
.hero { padding: 44px 0 20px; }
.hero h1 { max-width: 760px; }
.hero .lead { font-size: 1.12rem; color: var(--muted); max-width: 680px; }
.points { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 0; margin: 14px 0 0; list-style: none; color: var(--muted); }
.points li::before { content: "✓ "; color: var(--ok); font-weight: 700; }
.entries { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 24px 0 8px; }
.entry { background: var(--panel); border: 2px dashed var(--border); border-radius: 14px; padding: 28px 22px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; transition: border-color .15s, background .15s; }
.entry.drag { border-color: var(--accent); background: var(--accent-soft); }
.entry .icon { font-size: 34px; line-height: 1; }
.entry h2 { margin: 0; }
.entry p { margin: 0; color: var(--subtle); }
.entry-scan { border-style: solid; border-color: var(--line); }
.price-line { margin: 10px 0 0; color: var(--muted); }
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 36px 0; padding: 0; list-style: none; counter-reset: step; }
.steps li { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; counter-increment: step; }
.steps li::before { content: counter(step); display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--accent-soft); color: var(--accent-hover); font-weight: 700; margin-bottom: 8px; }
.steps h3 { margin-bottom: 4px; }
.steps p { margin: 0; color: var(--subtle); font-size: .92rem; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 28px; }
.faq details { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 8px; }
.faq summary { cursor: pointer; font-weight: 500; }
.faq details p { margin: 8px 0 0; color: var(--muted); }
.upload-progress { margin-top: 12px; }

/* Footer */
.site-footer { background: var(--panel); border-top: 1px solid var(--line); margin-top: 40px; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 28px; padding-top: 36px; padding-bottom: 28px; }
.footer-grid h2 { font-size: .92rem; margin-bottom: 10px; }
.footer-grid ul { list-style: none; padding: 0; margin: 0; }
.footer-grid li { margin-bottom: 7px; font-size: .9rem; }
.footer-grid li a { color: var(--muted); }
.footer-about p { color: var(--muted); font-size: .92rem; }
.footer-about address { font-style: normal; }
.footer-bottom { border-top: 1px solid var(--line); }
.footer-bottom-row { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 14px; padding-bottom: 18px; font-size: .82rem; color: var(--subtle); }

/* Document viewer (editor and signing page) */
.doc-layout { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; padding: 20px 0 40px; }
.doc-side { position: sticky; top: 12px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.doc-side .card { padding: 16px; }
.doc-title { font-size: 1.1rem; word-break: break-word; margin: 0 0 4px; }
.pages { display: flex; flex-direction: column; align-items: center; gap: 18px; min-width: 0; }
.page-wrap { position: relative; background: #fff; box-shadow: var(--shadow); max-width: 100%; touch-action: pan-y; }
.page-wrap canvas { display: block; width: 100%; height: auto; }
.page-num { position: absolute; left: -2px; top: -22px; font-size: .78rem; color: var(--subtle); }
.overlay { position: absolute; inset: 0; }
.placing .overlay { cursor: crosshair; }
.fld { position: absolute; border: 2px solid var(--me); background: rgba(11,87,208,.08); border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: var(--me); font-weight: 600; user-select: none; touch-action: none; cursor: move; overflow: visible; }
.fld.signer { border-color: var(--signer); background: rgba(176,96,0,.08); color: var(--signer); }
.fld.sel { box-shadow: 0 0 0 3px rgba(11,87,208,.25); }
.fld.signer.sel { box-shadow: 0 0 0 3px rgba(176,96,0,.25); }
.fld .lbl { pointer-events: none; text-align: center; line-height: 1.1; padding: 0 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.fld img { position: absolute; inset: 2px; width: calc(100% - 4px); height: calc(100% - 4px); object-fit: contain; pointer-events: none; }
.fld .handle { position: absolute; right: -7px; bottom: -7px; width: 14px; height: 14px; background: #fff; border: 2px solid currentColor; border-radius: 3px; cursor: nwse-resize; touch-action: none; }
.fld .del { position: absolute; right: -11px; top: -11px; width: 22px; height: 22px; border-radius: 50%; border: 0; background: var(--bad); color: #fff; font-size: 14px; line-height: 22px; padding: 0; cursor: pointer; display: none; }
.fld.sel .del { display: block; }
.fld.filled { background: rgba(255,255,255,.6); }
.palette { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.palette .btn { justify-content: flex-start; }
.palette .btn.active { background: var(--accent-soft); border-color: var(--accent); }
.assign { display: flex; gap: 6px; margin: 10px 0 0; }
.assign button { flex: 1; }
.assign .btn.active.me { background: var(--accent-soft); border-color: var(--me); color: var(--me); }
.assign .btn.active.signer { background: #fdeed9; border-color: var(--signer); color: var(--signer); }
.legend { display: flex; gap: 14px; font-size: .85rem; color: var(--subtle); margin-top: 10px; }
.legend i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; border: 2px solid var(--me); vertical-align: -1px; margin-right: 4px; }
.legend i.signer { border-color: var(--signer); }
.status-line { font-size: .85rem; color: var(--subtle); min-height: 1.2em; }
.loading { padding: 60px 0; color: var(--subtle); text-align: center; }

/* Signing page */
.sign-bar { position: sticky; top: 0; z-index: 15; background: var(--panel); border-bottom: 1px solid var(--line); box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.sign-bar-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; }
.sign-pages { padding: 20px 0 120px; }
.finish-confirm { margin-top: 16px; scroll-margin-top: 140px; }
.fld.todo { cursor: pointer; border-style: dashed; animation: pulse 1.6s ease-in-out infinite; }
.fld.todo.current { border-style: solid; box-shadow: 0 0 0 4px rgba(176,96,0,.3); }
@keyframes pulse { 50% { background: rgba(176,96,0,.18); } }
@media (prefers-reduced-motion: reduce) { .fld.todo { animation: none; } }
.consent-box { max-width: 640px; margin: 28px auto; }
.consent-box .disclosure { max-height: 240px; overflow: auto; background: var(--surface); border-radius: 8px; padding: 12px 14px; font-size: .9rem; color: var(--muted); margin: 12px 0 16px; }
.done-box { max-width: 560px; margin: 48px auto; text-align: center; }
.done-box .big { font-size: 44px; }
.btn-row { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin: 16px 0; }

/* Signature pad (modal) */
.modal { position: fixed; inset: 0; background: rgba(32,33,36,.55); display: grid; place-items: center; z-index: 50; padding: 12px; }
.modal-box { background: var(--panel); border-radius: 14px; width: min(560px, 100%); max-height: calc(100vh - 24px); overflow: auto; padding: 18px; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
.modal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
.tabs button { background: none; border: 0; border-bottom: 2px solid transparent; padding: 8px 14px; font: inherit; color: var(--muted); cursor: pointer; }
.tabs button.on { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }
.pad-canvas { width: 100%; height: 180px; border: 1px solid var(--border); border-radius: 8px; background: #fff; touch-action: none; display: block; cursor: crosshair; }
.pad-hint { font-size: .85rem; color: var(--subtle); margin: 6px 0 0; }
.typed-options { display: grid; gap: 8px; margin-top: 10px; }
.typed-option { border: 1px solid var(--border); border-radius: 8px; background: #fff; padding: 8px 14px; font-size: 34px; text-align: left; cursor: pointer; color: #1a1a1a; min-height: 64px; overflow: hidden; white-space: nowrap; }
.typed-option.on { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.f1 { font-family: "SDS Script 1", cursive; }
.f2 { font-family: "SDS Script 2", cursive; }
.modal-foot { display: flex; justify-content: space-between; gap: 10px; margin-top: 14px; flex-wrap: wrap; }

/* Scan */
.scan-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin: 16px 0; }
.scan-item { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 6px; position: relative; }
.scan-item img { width: 100%; display: block; border-radius: 4px; }
.scan-item .tools { display: flex; justify-content: space-between; gap: 4px; margin-top: 6px; }
.crop-stage { position: relative; touch-action: none; user-select: none; margin: 0 auto; max-width: 100%; }
.crop-stage canvas { display: block; max-width: 100%; height: auto; }
.crop-stage svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.corner { position: absolute; width: 30px; height: 30px; margin: -15px 0 0 -15px; border-radius: 50%; border: 3px solid var(--accent); background: rgba(255,255,255,.7); touch-action: none; cursor: grab; }

/* Lists */
.doc-group { margin-bottom: 28px; }
.doc-group h2 { display: flex; align-items: center; gap: 8px; }
.doc-table { width: 100%; border-collapse: collapse; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.doc-table th, .doc-table td { text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--line); vertical-align: middle; font-size: .93rem; }
.doc-table th { background: var(--surface); font-weight: 600; color: var(--muted); font-size: .82rem; }
.doc-table tr:last-child td { border-bottom: 0; }
.doc-table .name { font-weight: 500; word-break: break-word; }
.doc-table .actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.empty { padding: 18px; background: var(--panel); border: 1px dashed var(--line); border-radius: var(--radius); color: var(--subtle); }
.stats { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 22px; }
.stat { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px 16px; min-width: 150px; }
.stat b { display: block; font-size: 1.5rem; }

/* Pricing */
.packs { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; margin: 20px 0; }
.pack { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; padding: 22px; display: flex; flex-direction: column; gap: 8px; }
.pack .amount { font-size: 2rem; font-weight: 700; }
.pack .per { color: var(--subtle); font-size: .9rem; }
.pack .total { font-size: .92rem; color: var(--muted); border-top: 1px solid var(--line); padding-top: 10px; margin-top: auto; }
.rules li { margin-bottom: 6px; }
.prose { max-width: 760px; }
.prose h2 { margin-top: 1.6em; }
.prose li { margin-bottom: .4em; }

@media (max-width: 900px) {
  .doc-layout { grid-template-columns: minmax(0, 1fr); }
  .doc-side { position: static; }
  .steps { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .entries, .split, .steps { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .doc-table thead { display: none; }
  .doc-table, .doc-table tbody, .doc-table tr, .doc-table td { display: block; width: 100%; }
  .doc-table tr { border-bottom: 1px solid var(--line); padding: 8px 0; }
  .doc-table td { border: 0; padding: 4px 14px; }
  .doc-table .actions { justify-content: flex-start; }
  .nav-email { display: none; }
  .hero { padding-top: 28px; }
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
/* Refreshed workspace: warm paper, ink blue, and clear task hierarchy. */
:root { --bg:#f8f8f4; --fg:#202b44; --muted:#49536a; --subtle:#667087; --line:#e2e5e9; --border:#cbd0da; --accent:#334ed8; --accent-hover:#243bb1; --accent-soft:#eef0ff; --surface:#f1f3f8; --radius:16px; --shadow:0 8px 32px rgba(30,42,75,.08); }
body { font-family:'Segoe UI',system-ui,-apple-system,sans-serif; font-size:15px; }
h1,h2,h3 { letter-spacing:-.035em; color:var(--fg); }
.wrap { max-width:1160px; padding-left:28px; padding-right:28px; }
.site-header { background:#fff; }
.header-row { min-height:80px; }
.brand { font-size:1.25rem; letter-spacing:-.045em; gap:10px; }
.brand-mark { width:34px; height:38px; border-radius:9px 9px 14px 9px; font-size:22px; transform:rotate(-6deg); }
.main-nav { gap:28px; font-size:.88rem; }
.btn { border-radius:10px; min-height:44px; font-weight:600; transition:background .15s,border-color .15s,box-shadow .15s; }
.btn-primary { box-shadow:0 3px 5px #334ed81a; }
.btn-primary:hover { box-shadow:0 5px 12px #334ed825; }
.btn:disabled { box-shadow:none; }
.btn-lg { font-size:.95rem; padding:13px 23px; }
.eyebrow { font-size:.7rem; font-weight:700; letter-spacing:.14em; color:var(--accent); margin-bottom:16px; }
.live-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#e6a465; margin-right:7px; }
.hero { padding:66px 0 48px; overflow:hidden; }
.hero-grid { display:grid; grid-template-columns:1.15fr 1fr; align-items:center; gap:72px; }
.hero h1 { font-size:clamp(2.7rem,5vw,4.6rem); line-height:1.08; font-weight:650; letter-spacing:-.06em; }
.hero h1 em { color:var(--accent); font-style:normal; position:relative; }
.hero .lead { font-size:1.05rem; line-height:1.8; max-width:440px; margin:22px 0; color:var(--subtle); }
.points { gap:10px 18px; font-size:.78rem; margin:24px 0; }
.points li::before { color:var(--accent); margin-right:3px; }
.text-link { font-size:.84rem; font-weight:600; display:inline-flex; gap:24px; margin-top:8px; }
.document-demo { background:#eaece6; border-radius:24px; padding:24px 28px 18px; position:relative; transform:rotate(2deg); }
.demo-top { display:flex; align-items:center; gap:10px; font-size:.72rem; color:#687367; margin-bottom:20px; }
.demo-file-icon { border:1px solid #bcc5b9; border-radius:6px; padding:0 6px; font-size:18px; }
.demo-dots { margin-left:auto; letter-spacing:2px; }
.demo-paper { background:#fff; padding:30px; box-shadow:0 12px 20px #26322a12; border-radius:3px; transform:rotate(-4deg); }
.demo-paper .eyebrow { color:#939ba8; font-size:.55rem; }
.demo-paper h2 { font-size:1.35rem; margin:12px 0 24px; }
.paper-lines { display:grid; gap:9px; }
.paper-lines i { height:5px; background:#eceef2; border-radius:4px; }
.paper-lines i:last-child { width:68%; }
.demo-signature { border:1.5px dashed #8290e3; background:#f8f9ff; border-radius:7px; padding:12px 18px; margin:26px 0 12px; font-family:'SDS Script 1',cursive; color:#334ed8; font-size:2.25rem; }
.demo-signature span { display:block; font:9px 'Segoe UI',sans-serif; color:#7b87bd; }
.demo-paper-bottom { display:flex; justify-content:space-between; font-size:8px; color:#9298a5; }
.demo-complete { position:absolute; right:-14px; bottom:52px; padding:12px 18px; background:#fff; border:1px solid #e7eae4; border-radius:12px; box-shadow:0 8px 24px #26322a14; font-size:.76rem; font-weight:600; transform:rotate(-2deg); }
.demo-complete>span { background:#e7f2e5; color:#397044; border-radius:50%; margin-right:8px; padding:3px 6px; }
.demo-caption { text-align:center; font-size:9px; color:#7a8579; margin:22px 0 0; }
.start-section { padding-top:20px; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:18px; margin-bottom:22px; }
.section-heading .eyebrow { margin-bottom:9px; }
.section-heading h2 { font-size:1.65rem; margin:0; }
.entries { grid-template-columns:1.3fr 1fr; gap:18px; margin:0; }
.entry { text-align:left; align-items:start; padding:28px; gap:18px; border-radius:18px; border:1px solid var(--line); text-decoration:none; color:var(--fg); }
.entry h3 { font-size:1.15rem; margin:0 0 8px; }
.entry p { font-size:.83rem; line-height:1.7; }
.entry:hover { text-decoration:none; }
.entry-icon { display:grid; place-items:center; width:44px; height:44px; background:var(--accent-soft); color:var(--accent); border-radius:12px; font-size:26px; }
.entry-copy { min-width:0; }
.entry-copy>span { display:block; margin-top:6px; }
.upload-entry { display:grid; grid-template-columns:44px minmax(0,1fr); border:1.5px dashed #a8b2e1; }
.upload-entry .btn,.upload-progress,.upload-note { grid-column:2; }
.upload-entry.drag { border-color:var(--accent); background:#eef0ff; }
.upload-entry[aria-busy=true] { border-style:solid; }
.upload-progress { margin:0; width:100%; font-size:.85rem; overflow-wrap:anywhere; }
.upload-progress .alert { margin:0; }
.entry-scan { background:#f0f1eb; }
.entry-scan .entry-icon { background:#e3e7db; color:#5e7153; }
.entry-scan:hover { border-color:#a2ad95; background:#eaece3; }
.scan-link { font-size:.9rem; font-weight:600; display:flex; width:100%; justify-content:space-between; margin-top:auto; }
.start-footnote { display:flex; flex-wrap:wrap; justify-content:center; gap:12px 30px; font-size:.73rem; color:var(--subtle); margin:22px 0; }
.mini-check { color:#4c7253; margin-right:4px; }
.price-line { text-align:center; font-size:.8rem; padding:16px 0 0; border-top:1px solid var(--line); }
.price-line a { margin-left:8px; font-weight:600; }
.home-details { padding-top:80px; }
.steps { gap:0; border-top:1px solid var(--line); margin-top:28px; }
.steps li { background:transparent; border:0; border-radius:0; padding:24px 24px 16px 0; }
.steps li::before { background:transparent; color:var(--accent); border:1px solid #c7cdef; font-size:.8rem; width:30px; height:30px; margin-bottom:18px; }
.steps p { font-size:.83rem; line-height:1.75; }
.split .card { padding:26px; }
.faq { margin-top:22px; }
.faq details { border-radius:0; background:transparent; border-width:0 0 1px; margin:0; padding:20px 0; }
.faq summary { font-size:.95rem; }
.faq details p { max-width:850px; font-size:.88rem; line-height:1.8; }
.site-footer { margin-top:80px; }
.footer-grid { padding-top:44px; padding-bottom:36px; }
.footer-about p,.footer-grid li { font-size:.8rem; line-height:1.8; }
.card { box-shadow:0 2px 5px #202b4403; }
.page { padding-top:36px; }
.back-link { font-size:.8rem; color:var(--subtle); display:inline-block; margin-bottom:24px; }
.workspace-heading h1 { font-size:clamp(2rem,4vw,3rem); }
.workspace-heading .eyebrow { margin-bottom:10px; }
#scan { max-width:940px; }
#scan>.muted { font-size:.92rem; line-height:1.8; }
.workflow-steps { display:flex; list-style:none; padding:0; margin:24px 0; border-bottom:1px solid var(--line); gap:34px; }
.workflow-steps li { display:flex; gap:9px; padding:0 0 13px; color:var(--subtle); font-size:.75rem; }
.workflow-steps li.active { color:var(--accent); border-bottom:2px solid var(--accent); font-weight:650; }
.scan-empty { text-align:center; background:#fff; border:1px dashed #cbd0da; border-radius:18px; margin-top:25px; padding:36px 20px; }
.scan-empty h2 { font-size:1.25rem; margin-top:20px; }
.scan-empty p { color:var(--subtle); font-size:.85rem; }
.scan-paper { width:76px; height:94px; margin:auto; border:1px solid #d7dceb; border-radius:5px; background:#fbfbff; padding:20px 12px; transform:rotate(-7deg); position:relative; }
.scan-paper span { display:block; height:3px; margin-bottom:7px; background:#dfe3f2; }
.scan-paper b { position:absolute; bottom:8px; right:10px; color:var(--accent); font-size:25px; font-weight:400; }
.scan-tips { display:flex; gap:10px 24px; justify-content:center; flex-wrap:wrap; font-size:.72rem; color:var(--subtle); margin-top:28px; }
.scan-continue { position:sticky; bottom:0; background:var(--bg); border-top:1px solid var(--line); padding:16px 0 max(16px,env(safe-area-inset-bottom)); z-index:8; margin-bottom:0; }
.scan-list { grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); }
.scan-item { padding:10px; border-radius:14px; }
.scan-item img { max-height:230px; object-fit:contain; background:#f3f4f7; }
.scan-item .tools { align-items:center; gap:8px; }
.scan-item .tools>span:last-child { display:flex; gap:5px; }
.crop-stage { border-radius:8px; overflow:visible; }
#crop { scroll-margin-top:20px; }
.workspace-topline { display:flex; justify-content:space-between; gap:16px; align-items:center; padding-top:24px; }
.workspace-topline .back-link { margin:0; }
.document-canvas { background:#e9ecf1; border-radius:16px; padding:32px 20px; min-width:0; }
.doc-side .card { padding:20px; }
.doc-side h2 { font-size:1rem; }
.palette .btn { font-size:.83rem; padding:9px 10px; }
.status-line { margin-bottom:0; }
.consent-box { max-width:720px; margin:40px auto; }
.consent-card { padding:32px; }
.consent-card .check { padding:14px; border:1px solid var(--line); border-radius:10px; font-size:.88rem; margin-top:22px; }
.consent-box .disclosure { line-height:1.8; }
.sign-bar-row { min-height:86px; }
.sign-progress { display:block; width:180px; max-width:100%; height:4px; margin-top:8px; border:0; border-radius:4px; accent-color:var(--accent); }
.sign-progress::-webkit-progress-bar { background:var(--surface); border-radius:4px; }
.sign-progress::-webkit-progress-value { background:var(--accent); border-radius:4px; }
.sign-pages { margin-top:18px; }
.modal { background:#17213b80; backdrop-filter:blur(4px); }
.modal-box { padding:24px; border-radius:20px; }
.pad-canvas { background:#fcfcff; border-style:dashed; }
.done-box { margin:64px auto; background:#fff; border:1px solid var(--line); border-radius:20px; padding:36px 28px; }
.done-box h1 { margin-top:16px; }
@media(max-width:900px) {
 .hero-grid { gap:35px; } .hero { padding-top:42px; } .document-demo { padding:20px; }
 .demo-paper { padding:24px; } .entries { grid-template-columns:1.2fr 1fr; }
 .entry { padding:22px; } .document-canvas { padding:30px 12px; }
}
@media(max-width:640px) {
 .wrap { padding-left:20px; padding-right:20px; } .header-row { min-height:72px; padding-top:14px; padding-bottom:14px; gap:14px; }
 .main-nav { gap:16px; font-size:.78rem; } .main-nav .btn { padding:7px 12px; min-height:36px; }
 .hero { padding:36px 0 30px; } .hero-grid { grid-template-columns:1fr; gap:30px; }
 .hero h1 { font-size:3rem; } .hero .lead { font-size:.95rem; margin:18px 0; }
 .points { margin:18px 0; gap:8px 16px; font-size:.72rem; }
 .document-demo { max-width:350px; width:calc(100% - 10px); margin:0 auto; padding:18px 24px 12px; }
 .demo-paper { padding:22px; } .demo-paper h2 { font-size:1.15rem; margin-bottom:16px; }
 .demo-signature { font-size:1.9rem; margin-top:20px; padding:8px 14px; }
 .demo-complete { font-size:.67rem; right:-8px; bottom:42px; padding:10px 12px; }
 .demo-caption { margin-top:15px; } .demo-top { margin-bottom:12px; }
 .section-heading { align-items:start; flex-direction:column; gap:10px; } .section-heading h2 { font-size:1.4rem; }
 .entries { grid-template-columns:minmax(0,1fr); } .upload-entry { grid-template-columns:40px minmax(0,1fr); }
 .upload-entry .btn,.upload-progress,.upload-note { grid-column:1/-1; width:100%; }
 .entry-scan { display:grid; grid-template-columns:44px minmax(0,1fr); } .entry-scan .scan-link { grid-column:1/-1; }
 .start-footnote { gap:9px 16px; font-size:.67rem; } .price-line { line-height:1.9; }
 .home-details { padding-top:50px; } .steps { grid-template-columns:1fr 1fr; } .steps li { padding:20px 14px 16px 0; }
 .steps h3 { font-size:.95rem; } .steps p { font-size:.78rem; } .split { grid-template-columns:1fr; }
 .workflow-steps { gap:18px; justify-content:space-between; } .workflow-steps li { font-size:.67rem; gap:5px; }
 .scan-tips { flex-direction:column; gap:8px; } .scan-continue .btn { width:100%; } .scan-continue #count { width:100%; text-align:center; }
 .scan-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .scan-item .tools { flex-wrap:wrap; }
 .workspace-topline { align-items:start; flex-direction:column; gap:8px; } .consent-card { padding:22px; }
 .sign-bar-row>div:first-child { min-width:0; width:100%; } .sign-bar-row .btn-row { width:100%; justify-content:stretch; }
 .sign-bar-row .btn { flex:1; } .sign-progress { width:100%; } .sign-bar-row { padding-top:12px; padding-bottom:12px; }
 .finish-confirm { scroll-margin-top:185px; } .modal-box { padding:18px; }
 .site-footer { margin-top:50px; } .footer-grid { grid-template-columns:1fr 1fr; gap:26px 18px; } .footer-about { grid-column:1/-1; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }

.hero h1 { font-size:clamp(2.7rem,4.3vw,3.85rem); }
.hero-line { white-space:nowrap; }
.decline-panel { max-width:720px; margin:24px auto; scroll-margin-top:170px; }
.scan-item .tools .btn { min-height:40px; min-width:36px; padding:4px 9px; }
@media(max-width:900px) { .hero-line { white-space:normal; } }
@media(max-width:640px) { .document-demo { display:none; } .hero h1 { font-size:2.8rem; } .hero { padding-bottom:14px; } .start-section { padding-top:16px; } }
@media(max-width:640px) {
 .hero h1 { font-size:2.15rem; } .hero-line { white-space:nowrap; }
 .hero .lead { margin:14px 0; font-size:.9rem; line-height:1.65; }
 .hero .eyebrow { margin-bottom:14px; } .hero .points { margin:14px 0; }
 .hero { padding-top:28px; } .hero .text-link { margin-top:2px; }
}
@media(max-width:360px) { .hero h1 { font-size:1.85rem; } }

#scan[data-step="add"] .workflow-steps li:nth-child(1),
#scan[data-step="crop"] .workflow-steps li:nth-child(2),
#scan[data-step="ready"] .workflow-steps li:nth-child(3) { color:var(--accent); border-bottom:2px solid var(--accent); font-weight:650; }
@media(max-width:360px) {
 .main-nav { gap:10px; font-size:.72rem; width:100%; justify-content:space-between; }
 .main-nav .btn { font-size:.7rem; padding:6px 9px; }
}

/* Content widths stay narrow even after shared wrap refinements. */
.wrap.narrow { max-width:760px; }
.wrap.tiny-wrap { max-width:440px; }
.wrap.prose { max-width:760px; }
input[type=search] { width:100%; font:inherit; color:var(--fg); border:1px solid var(--border); background:#fff; border-radius:10px; padding:10px 12px; min-height:44px; }
.document-search { display:flex; align-items:end; gap:10px; margin:26px 0; }
.document-search>div { flex:1; min-width:0; }
.document-search label { font-size:.82rem; margin-bottom:7px; }
.doc-table td { overflow-wrap:anywhere; }
@media(max-width:640px) { .document-search { flex-wrap:wrap; } .document-search>div { flex-basis:100%; } }

@media(max-width:640px) { .stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .stat { min-width:0; padding:14px; } .stat b { font-size:1.35rem; } }

.fax-next { display:flex; gap:16px; text-align:left; background:#f2f4fd; border:1px solid #dce1f5; border-radius:14px; padding:20px; margin:24px 0 8px; }
.fax-next-icon { flex-shrink:0; width:34px; height:34px; background:#fff; color:var(--accent); border-radius:9px; display:grid; place-items:center; font-size:22px; }
.fax-next .eyebrow { font-size:.62rem; margin-bottom:8px; }
.fax-next h2 { font-size:1.1rem; }
.fax-next p { font-size:.85rem; line-height:1.75; }
.fax-next .fax-service-note { font-size:.7rem; margin:10px 0 0; }
.fax-discovery { display:flex; align-items:center; gap:24px; justify-content:space-between; margin:32px 0; }
.fax-discovery .eyebrow { margin-bottom:10px; }
.fax-discovery p:last-child { margin-bottom:0; font-size:.9rem; }
.fax-discovery .btn { flex-shrink:0; }
@media(max-width:640px) { .fax-next { padding:16px; gap:10px; } .fax-next-icon { display:none; } .fax-discovery { align-items:start; flex-direction:column; gap:18px; } }

.page-render-error { position:absolute; inset:0; z-index:4; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px; text-align:center; background:var(--panel); color:var(--subtle); }
.page-render-error p { margin-bottom:12px; }
[aria-busy=true].doc-layout { opacity:.8; }


/* Shared visual language with bxian.ca: cool blue, generous spacing and white cards. */
:root { --bg:#fbfcfe; --fg:#142b46; --muted:#516278; --subtle:#617286; --border:#d9e3ef; --line:#e6edf5; --panel:#fff; --surface:#f0f5fc; --surface-hover:#e8effb; --accent:#245edb; --accent-hover:#1745a6; --accent-soft:#e8efff; --me:#245edb; --radius:18px; --shadow:0 20px 60px -30px #153e7650; }
body { font-size:16px; line-height:1.7; }
.wrap { max-width:1200px; padding-left:32px; padding-right:32px; }
.wrap.narrow { max-width:760px; } .wrap.tiny-wrap { max-width:440px; }
.wrap.consent-box { max-width:720px; } .wrap.done-box,.wrap.decline-panel { max-width:760px; }
h1,h2,h3 { font-weight:700; letter-spacing:-.025em; }
.site-header { border-bottom-color:var(--line); }
.header-row { min-height:78px; }
.brand { color:var(--accent); font-size:1.4rem; }
.brand-mark { transform:none; width:34px; height:34px; border-radius:10px; font-size:20px; }
.main-nav { gap:24px; font-size:.9rem; }
.btn { border-radius:12px; min-height:46px; padding:11px 21px; }
.btn-primary { box-shadow:0 5px 14px -8px #245edb90; }
.btn-primary:hover { box-shadow:0 8px 20px -10px #245edb90; }
.btn-sm { padding:7px 13px; min-height:36px; }
.btn-lg { padding:14px 24px; font-size:1rem; }
.eyebrow { letter-spacing:.1em; font-size:.7rem; }
.live-dot { background:var(--accent); }
.hero { padding:78px 0 72px; background:radial-gradient(ellipse at 90% 5%,#dceaff 0,transparent 52%),linear-gradient(180deg,#f5f9ff,#fbfcfe); border-bottom:1px solid var(--line); }
.hero-grid { grid-template-columns:1.1fr 1fr; gap:56px; }
.hero h1 { font-size:clamp(38px,4.8vw,62px); line-height:1.2; letter-spacing:-.045em; font-weight:700; margin:18px 0 24px; }
.hero-line { white-space:normal; }
.hero .lead { font-size:17px; line-height:1.95; max-width:31em; color:var(--muted); margin:0 0 22px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; }
.hero .points { font-size:12.5px; gap:8px 14px; }
.document-demo { background:#fff; border:1px solid #d4e1f3; border-radius:20px; padding:28px; transform:rotate(1.5deg); box-shadow:0 25px 70px -24px #294b8155; }
.demo-top { color:var(--subtle); border-bottom:1px solid var(--line); padding-bottom:16px; margin-bottom:16px; }
.demo-file-icon { color:var(--accent); border-color:#d4e1f3; }
.demo-paper { padding:12px 0 22px; transform:none; box-shadow:none; background:transparent; }
.demo-paper h2 { font-size:1.5rem; }
.demo-signature { color:var(--accent); border-color:#b8cdf6; background:#f5f8ff; }
.demo-signature span { color:var(--subtle); }
.demo-complete { position:static; display:inline-flex; margin-top:4px; transform:none; right:20px; bottom:45px; border-color:#d9e3ef; color:var(--accent-hover); box-shadow:var(--shadow); }
.demo-complete>span { background:var(--accent-soft); color:var(--accent); }
.demo-caption { color:var(--subtle); margin:20px 0 0; }
.start-band { background:#f0f5fc; border-bottom:1px solid var(--line); }
.start-section { padding-top:56px; padding-bottom:34px; }
.section-heading h2 { font-size:1.8rem; }
.entries { grid-template-columns:1.2fr 1fr; gap:20px; }
.entry { background:#fff; border:1px solid #d9e3ef; border-radius:18px; padding:30px; box-shadow:0 8px 30px -22px #173d7850; }
.upload-entry { border:1.5px dashed #9bb8ef; }
.upload-entry.drag { background:#edf4ff; }
.entry-scan .entry-icon { background:var(--accent-soft); color:var(--accent); }
.entry-scan:hover { background:#fff; border-color:#9bb8ef; box-shadow:0 15px 35px -20px #173d7850; }
.entry p { color:var(--muted); font-size:.9rem; }
.scan-link { color:var(--accent-hover); }
.mini-check { color:var(--accent); }
.home-details { padding-top:64px; }
.steps { gap:22px; border-top:0; }
.steps li { border-top:2px solid #b8cdf6; padding:22px 0; }
.steps li::before { border:0; width:auto; height:auto; justify-content:start; font-size:28px; font-weight:500; margin-bottom:15px; }
.steps p { font-size:.9rem; }
.card { border-color:var(--line); border-radius:18px; box-shadow:0 8px 30px -26px #173d7850; }
.fax-discovery,.fax-next-step { background:linear-gradient(120deg,#edf4ff,#f8faff); border-color:#d7e5fc; }
.site-footer { background:#f2f6fc; border-color:var(--line); }
.footer-grid { padding-top:48px; padding-bottom:40px; }
.footer-about p,.footer-grid li { font-size:.85rem; }
.document-canvas { background:#edf2f9; border:1px solid var(--line); }
.scan-empty { border-color:#b8cdf6; }
.scan-paper { background:#f5f8ff; border-color:#cbdcf6; }
.pad-canvas { background:#fbfcfe; }
@media(max-width:900px) { .hero-grid { gap:32px; } .document-demo { transform:none; padding:24px; } .hero h1 { font-size:44px; } }
@media(max-width:640px) {
 .wrap { padding-left:20px; padding-right:20px; }
 .header-row { min-height:68px; gap:12px; } .brand { font-size:1.2rem; } .main-nav { gap:15px; font-size:.8rem; }
 .hero { padding:42px 0; } .hero-grid { grid-template-columns:minmax(0,1fr); gap:32px; } .hero h1 { font-size:42px; }
 .hero .lead { font-size:16px; } .hero-actions .btn { flex:1; padding:13px 12px; font-size:14px; }
 .document-demo { display:block; max-width:100%; width:100%; padding:22px; } .demo-paper { padding:8px 0 22px; }
 .demo-paper h2 { font-size:1.35rem; } .demo-complete { right:12px; bottom:35px; }
 .start-section { padding-top:40px; padding-bottom:26px; } .entries { grid-template-columns:minmax(0,1fr); } .entry { padding:22px; }
 .section-heading h2 { font-size:1.5rem; } .home-details { padding-top:42px; } .steps { gap:12px; }
 .site-footer { margin-top:48px; }
}
@media(prefers-reduced-motion:reduce) { .btn { transition:none; } }


/* Complete bxian.ca page family: accounts, documents, pricing, legal and result states. */
.main-nav a[aria-current=page] { color:var(--accent-hover); font-weight:700; }
.account-view #main { background:radial-gradient(ellipse at 50% 0,#e8f0ff,transparent 68%); padding-bottom:32px; }
.account-view .wrap.tiny-wrap { max-width:500px; padding-top:48px; }
.account-view h1 { font-size:2rem; margin-bottom:20px; }
.account-view form.card { padding:28px; border-color:#d9e3ef; box-shadow:0 18px 55px -36px #173d7860; }
.account-view .eyebrow { margin-bottom:12px; }
.account-view .field { margin-bottom:20px; }
.account-view input { min-height:48px; }
.account-view input[type=checkbox] { min-height:18px; }
input[type=text],input[type=email],input[type=password],input[type=search],textarea,select { border-radius:12px; }
.field .small { margin-top:6px; }
.wrap.prose { max-width:820px; background:#fff; border:1px solid var(--line); border-radius:20px; margin-top:40px; padding:36px; box-shadow:0 10px 40px -32px #173d7850; }
.prose h1 { font-size:clamp(1.8rem,4vw,2.5rem); overflow-wrap:anywhere; }
.prose p,.prose li { color:var(--muted); line-height:1.9; }
.prose h2 { padding-top:16px; border-top:1px solid var(--line); font-size:1.2rem; }
.prose .alert { line-height:1.7; }
.pricing-view .packs { gap:20px; margin:32px 0; }
.pack { border-color:#d9e3ef; border-radius:18px; padding:28px; box-shadow:0 8px 30px -22px #173d7850; }
.pack .amount { color:var(--accent); letter-spacing:-.04em; }
.pack h2 { font-size:1.15rem; }
.pack .btn { margin-top:8px; }
.stat { padding:20px 24px; border-color:#d9e3ef; background:linear-gradient(135deg,#fff,#f3f7ff); }
.stat b { color:var(--accent); }
.documents-view .document-search { background:#fff; padding:22px; border:1px solid var(--line); border-radius:18px; }
.doc-group h2 { margin:30px 0 16px; font-size:1.3rem; }
.doc-table th { background:#edf3fc; }
.doc-table td { overflow-wrap:anywhere; }
.empty { padding:26px; background:#f4f8ff; border-color:#cbdcf6; }
.done-box .big { width:72px; height:72px; display:grid; place-items:center; background:var(--accent-soft); border-radius:22px; margin:0 auto 20px; font-size:34px; }
.decline-panel { background:#fff; border:1px solid var(--line); border-radius:18px; padding-top:24px; padding-bottom:24px; margin-top:24px; }
.badge { border-radius:8px; }
.sign-bar { border-color:var(--line); box-shadow:0 8px 24px -22px #173d7870; }
.fld.current { outline-offset:4px; }
@media(max-width:640px) {
 .account-view .wrap.tiny-wrap { padding-top:32px; } .account-view form.card { padding:22px; }
 .wrap.prose { margin:24px 16px 0; width:calc(100% - 32px); padding:24px 20px; }
 .pricing-view .packs { grid-template-columns:minmax(0,1fr); }
 .documents-view .document-search { padding:18px; }
 .doc-table { background:transparent; border:0; overflow:visible; }
 .doc-table tbody { display:grid; gap:12px; }
 .doc-table tr { border:1px solid #d9e3ef; border-radius:16px; background:#fff; padding:16px; box-shadow:0 8px 30px -26px #173d7850; }
 .doc-table td { padding:5px 0; }
 .doc-table td[data-label]::before { content:attr(data-label); display:block; color:var(--subtle); font-size:11px; font-weight:600; margin-bottom:2px; }
 .doc-table .actions { justify-content:flex-start; padding-top:8px; }
 .doc-table .actions .btn { min-height:44px; }
 .wrap.done-box { width:calc(100% - 32px); margin:32px 16px; padding:28px 20px; }
 .sign-bar-row { gap:12px; }
 .scan-item .tools .btn { min-width:40px; min-height:44px; }
}


/* Phone interaction polish in the shared blue page family. */
.modal-box { max-height:calc(100dvh - 24px); overscroll-behavior:contain; }
.consent-box .disclosure { overscroll-behavior:contain; scrollbar-gutter:stable; }
.btn:focus-visible,.link-btn:focus-visible,.corner:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
@media(max-width:640px) {
 input[type=text],input[type=email],input[type=password],input[type=search],textarea,select { font-size:16px; }
 .corner { width:44px; height:44px; margin:-22px 0 0 -22px; border-color:var(--accent); box-shadow:0 3px 12px #1745a62b; }
 .modal { padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom)); }
 .modal-foot .btn { min-height:48px; }
 .tabs button { min-height:44px; }
 .done-box .btn-row { gap:12px; }
 .done-box .btn-row>.btn { width:100%; }
}


.upload-meter { display:block; width:100%; height:7px; margin:10px 0 0; border:0; border-radius:8px; overflow:hidden; accent-color:var(--accent); }
.upload-meter::-webkit-progress-bar { background:var(--accent-soft); border-radius:8px; }
.upload-meter::-webkit-progress-value { background:var(--accent); border-radius:8px; }
.upload-meter::-moz-progress-bar { background:var(--accent); border-radius:8px; }
.upload-progress .alert,.scan-continue .alert { overflow-wrap:anywhere; }


.upload-retry { margin-top:12px; }
.upload-progress .alert-error { border-color:#efc7c2; }
@media(max-width:640px) { .upload-retry { width:100%; min-height:44px; } }


.scan-undo { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 18px; margin:14px 0; background:var(--accent-soft); border:1px solid #cbdcf6; border-radius:14px; color:var(--accent-hover); font-size:.9rem; }
.scan-undo .btn { color:var(--accent-hover); border-color:#b8cdf6; }
#decline-reason-help { margin:8px 0 0; line-height:1.6; }
@media(max-width:640px) { .scan-undo { gap:10px; padding:12px; } .scan-undo .btn { min-height:44px; } }


/* Searchable editorial guides in the shared bxian.ca visual language. */
.guide-hero { padding:64px 0 48px; background:radial-gradient(ellipse at 85% 0,#dceaff,transparent 55%),linear-gradient(#f5f9ff,#fbfcfe); border-bottom:1px solid var(--line); }
.guide-hero h1 { font-size:clamp(2.3rem,5vw,3.6rem); line-height:1.2; letter-spacing:-.045em; }
.guide-hero h1 em { color:var(--accent); font-style:normal; }
.guide-hero .lead { max-width:650px; color:var(--muted); font-size:1.1rem; }
.guide-index { padding-top:32px; }
.editorial-note { padding:16px 20px; background:#f0f5fc; border:1px solid var(--line); border-radius:14px; font-size:.85rem; line-height:1.8; color:var(--muted); }
.guide-category { margin:38px 0; }
.guide-category>h2 { margin-bottom:20px; }
.guide-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.guide-card { display:flex; flex-direction:column; color:var(--fg); padding:26px; min-width:0; transition:border-color .15s,box-shadow .15s; }
.guide-card:hover { text-decoration:none; border-color:#9bb8ef; box-shadow:0 15px 35px -24px #173d7860; }
.guide-card h3 { font-size:1.2rem; line-height:1.4; }
.guide-card p { color:var(--muted); font-size:.9rem; line-height:1.85; }
.guide-read { color:var(--accent-hover); font-weight:650; margin-top:auto; padding-top:12px; font-size:.9rem; }
.home-guide-strip { margin:56px 0; }
.home-guide-strip .guide-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.wrap.guide-article { max-width:880px; }
.guide-breadcrumb { display:flex; gap:12px; margin-bottom:28px; font-size:.85rem; }
.guide-article h1 { font-size:clamp(1.9rem,4vw,2.65rem); line-height:1.25; }
.article-meta { font-size:.8rem; color:var(--subtle); margin:18px 0; }
.guide-lead { font-size:1.08rem; }
.guide-toc { background:#f0f5fc; padding:20px 24px; border-radius:16px; margin:28px 0; }
.guide-toc ol { margin:10px 0 0; padding-left:22px; }
.guide-toc a { font-size:.9rem; }
.guide-section { scroll-margin-top:24px; margin:36px 0; }
.guide-section h2,.guide-cta h2,.guide-related h2 { border:0; padding:0; margin-top:0; }
.guide-section .guide-source { font-size:.8rem; border-left:3px solid #b8cdf6; padding-left:12px; }
.guide-table-scroll { overflow-x:auto; max-width:100%; border:1px solid var(--line); border-radius:14px; margin:24px 0; }
.guide-table { border-collapse:collapse; width:100%; min-width:760px; font-size:.85rem; }
.guide-table caption { text-align:left; padding:16px; color:var(--subtle); font-size:.8rem; background:#f5f8ff; }
.guide-table th,.guide-table td { text-align:left; vertical-align:top; padding:14px; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.guide-table thead { background:#e8efff; }
.guide-table th[scope=row] { width:25%; }
.guide-cta { background:linear-gradient(120deg,#edf4ff,#f8faff); border:1px solid #d7e5fc; border-radius:18px; padding:26px; margin:36px 0; }
.guide-cta .btn-row { justify-content:flex-start; }
.guide-cta p:last-child { margin-bottom:0; }
.guide-related { padding-top:20px; border-top:1px solid var(--line); }
@media(max-width:640px) {
 .main-nav { width:100%; min-width:0; max-width:100%; flex-wrap:wrap; overflow:visible; padding:4px 2px; gap:8px 16px; }
 .main-nav>* { flex-shrink:0; }
 .guide-hero { padding:38px 0 28px; } .guide-hero .lead { font-size:1rem; }
 .guide-grid,.home-guide-strip .guide-grid { grid-template-columns:minmax(0,1fr); }
 .guide-card { padding:22px; }
 .guide-toc { padding:18px; }
 .guide-article h1 { font-size:1.85rem; overflow-wrap:normal; }
 .guide-cta { padding:20px; } .guide-cta .btn-row .btn { width:100%; }
 .guide-breadcrumb { margin-bottom:22px; }
}

.guide-categories { display:flex; flex-wrap:wrap; gap:10px; margin:24px 0; }
.guide-categories a { display:inline-flex; align-items:center; min-height:44px; padding:8px 15px; border:1px solid var(--line); border-radius:24px; background:#f5f8ff; color:var(--accent-hover); font-size:.9rem; }
.guide-category { scroll-margin-top:24px; }

.guide-section-links { margin:20px 0; padding:14px 18px; border-left:3px solid #9bb8ef; background:#f5f8ff; border-radius:0 12px 12px 0; font-size:.9rem; }
.guide-section-links ul { margin:8px 0 0; padding-left:20px; }
.guide-section-links a { overflow-wrap:anywhere; }
.guide-tool-links { border-left-color:#7fb39a; background:#f3f9f5; }
.guide-tool-note { display:block; color:var(--subtle, #5f6368); font-size:.85rem; margin-top:2px; }
.local-guides { margin:28px 0 8px; padding-top:18px; border-top:1px solid var(--line, #dadce0); }
.local-guides h2 { font-size:1.05rem; margin:0 0 8px; }
.local-guides ul { margin:0 0 8px; padding-left:20px; }
.local-guides li { margin-bottom:6px; }
.local-guides a { overflow-wrap:anywhere; }

.guide-command { max-width:100%; padding:18px; border:1px solid var(--line); border-radius:12px; background:#eef4ff; white-space:pre-wrap; overflow-wrap:anywhere; font-size:.85rem; line-height:1.7; }

/* A finite, replayable signing illustration; completed state is the no-JS fallback. */
.signing-demo { transform:none; }
.signing-demo .demo-paper h2 { margin:12px 0 20px; }
.signing-demo .demo-signature { padding:8px 14px; margin:22px 0 10px; }
.demo-ink { display:block; width:100%; height:80px; overflow:visible; }
.demo-ink path { fill:none; stroke:var(--accent); stroke-width:2.7; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1100; stroke-dashoffset:0; }
.signing-demo .demo-signature>span { font:11px 'Segoe UI',sans-serif; margin-top:4px; }
.demo-steps { list-style:none; display:flex; justify-content:space-between; gap:10px; padding:0; margin:24px 0 12px; font-size:.78rem; color:var(--muted); }
.demo-steps li { display:flex; align-items:center; gap:6px; }
.demo-steps li>span { display:grid; place-items:center; width:23px; height:23px; flex-shrink:0; background:var(--accent-soft); color:var(--accent); border-radius:50%; font-weight:650; }
.demo-controls { display:none; justify-content:space-between; gap:12px; }
.signing-demo.is-running .demo-controls { display:flex; }
.demo-controls button { min-height:36px; text-align:left; color:var(--accent-hover); }
.demo-controls button:disabled { color:var(--subtle); cursor:default; }
.signing-demo .demo-caption { margin-top:10px; font-size:10px; }
.signing-demo.is-running .demo-signature { animation:demo-place 7s both; }
.signing-demo.is-running .demo-ink path { animation:demo-write 7s both; }
.signing-demo.is-running .demo-complete { animation:demo-finish 7s both; }
.signing-demo.is-running .demo-steps li:nth-child(1) { animation:demo-step-one 7s both; }
.signing-demo.is-running .demo-steps li:nth-child(2) { animation:demo-step-two 7s both; }
.signing-demo.is-running .demo-steps li:nth-child(3) { animation:demo-step-three 7s both; }
.signing-demo.is-paused *, .signing-demo.is-paused *::before { animation-play-state:paused!important; }
@keyframes demo-place { 0%,8% { opacity:0; transform:translateY(8px); } 22%,100% { opacity:1; transform:translateY(0); } }
@keyframes demo-write { 0%,28% { stroke-dashoffset:1100; opacity:0; } 29% { opacity:1; } 76%,100% { stroke-dashoffset:0; opacity:1; } }
@keyframes demo-finish { 0%,77% { opacity:0; transform:translateY(7px); } 88%,100% { opacity:1; transform:translateY(0); } }
@keyframes demo-step-one { 0%,26% { color:var(--accent); font-weight:650; } 27%,100% { color:var(--muted); font-weight:400; } }
@keyframes demo-step-two { 0%,26%,77%,100% { color:var(--muted); font-weight:400; } 27%,76% { color:var(--accent); font-weight:650; } }
@keyframes demo-step-three { 0%,77% { color:var(--muted); font-weight:400; } 78%,100% { color:var(--accent); font-weight:650; } }
@media(max-width:640px) { .demo-controls button { min-height:44px; } .demo-steps { gap:6px; font-size:.72rem; } .demo-ink { height:70px; } }
@media(prefers-reduced-motion:reduce) {
 .signing-demo.is-running * { animation:none!important; }
 .signing-demo .demo-controls { display:none!important; }
 .signing-demo .demo-ink path { stroke-dashoffset:0; }
}

.signing-demo.is-waiting .demo-ink path { stroke-dashoffset:1100; }
.signing-demo.is-waiting .demo-complete { opacity:0; }
@media(prefers-reduced-motion:reduce) { .signing-demo.is-waiting .demo-ink path { stroke-dashoffset:0; } .signing-demo.is-waiting .demo-complete { opacity:1; } }

/* Home: an editorial layout built around the task, with one paper illustration. */
body.home-view { background:#f7f6f2; color:#202b32; }
.home-view .site-header { background:#f7f6f2; border-color:#dfdfd8; }
.home-view .brand { font-size:1.25rem; letter-spacing:-.05em; }
.home-view .brand-mark { width:28px; height:28px; border-radius:5px; font-size:17px; }
.home-view .btn { border-radius:5px; box-shadow:none; }
.home-view .hero { background:none; padding:64px 0 54px; border:0; }
.home-view .hero-grid { grid-template-columns:1.05fr 1fr; gap:88px; align-items:start; }
.home-view .hero h1 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(52px,5.8vw,74px); font-weight:400; line-height:1.05; letter-spacing:-.055em; margin:0 0 22px; color:#202b32; }
.home-view .hero h1 em { color:#245edb; font-weight:400; }
.home-view .hero .lead { font-size:17px; line-height:1.7; max-width:27em; margin:0 0 18px; color:#52606a; }
.home-free { font-size:13px; color:#475953; margin:0 0 27px; }
.home-view .upload-entry { display:grid; grid-template-columns:1fr auto; gap:12px 16px; padding:22px; border:1px dashed #a6afa9; border-radius:6px; box-shadow:none; background:#fffefa; }
.home-view .upload-entry.drag { background:#edf2ff; border-color:var(--accent); }
.home-view .upload-entry .entry-copy { grid-column:1/-1; }
.home-view .upload-entry h2 { font-size:15px; font-weight:600; letter-spacing:0; margin:0 0 3px; }
.home-view .upload-entry .entry-copy p { font-size:12px; margin:0; color:#68716f; }
.home-view .upload-entry #pick { justify-self:start; grid-column:1; font-size:14px; min-height:46px; }
.home-drop-hint { align-self:center; margin:0!important; font-size:12px!important; color:#6f7671!important; }
.home-view .upload-entry .upload-progress,.home-view .upload-note { grid-column:1/-1; width:100%; margin:0; }
.home-scan-link { font-size:13px; margin:17px 0 18px; color:#626a68; }
.home-scan-link a { color:#253e57; text-decoration:underline; text-underline-offset:4px; }
.home-view .price-line { border:0; padding:0; margin:0; text-align:left; font-size:12px; line-height:1.8; max-width:34em; color:#69706b; }
.home-view .price-line strong { color:#434e47; font-weight:500; }
.home-view .price-line a { white-space:nowrap; }
.home-view .document-demo { background:none; border:0; border-radius:0; padding:0; box-shadow:none; transform:none; max-width:none; width:100%; margin:16px 0 0; }
.home-view .demo-top { border:0; padding:0; margin:0 4px 12px; gap:8px; font-size:12px; color:#65706c; }
.home-view .demo-file-icon { border:1px solid #a9b5bc; padding:2px 4px; border-radius:2px; font:9px monospace; color:#5b6c79; }
.demo-example { margin-left:auto; font-size:11px; color:#7e857d; }
.home-view .demo-paper { border:1px solid #d6d8d0; border-radius:3px; background:#fff; padding:27px 30px 23px; box-shadow:0 7px 15px -12px #28372b55; }
.demo-doc-heading { display:flex; justify-content:space-between; gap:12px; font:9px 'Segoe UI',sans-serif; letter-spacing:.12em; color:#7d8584; }
.home-view .demo-paper h2 { font:400 29px/1.3 Georgia,'Times New Roman',serif; letter-spacing:-.035em; margin:29px 0 23px; color:#273436; }
.demo-document-meta { display:grid; grid-template-columns:1fr 1fr; gap:15px; border-bottom:1px solid #e5e7e2; padding-bottom:22px; }
.demo-document-meta span,.demo-document-meta strong { display:block; font-size:11px; font-weight:400; color:#7d8583; }
.demo-document-meta strong { font-size:13px; color:#35423f; margin-top:4px; }
.demo-document-copy { font:13px/1.8 Georgia,'Times New Roman',serif; color:#6f7872; max-width:26em; margin:22px 0 27px; }
.home-view .demo-signature { background:#f9fbff; border-color:#acbfdc; border-radius:3px; margin:0 0 10px; padding:4px 12px 7px; }
.home-view .demo-ink { height:72px; }
.home-view .demo-signature>span { font-size:11px; color:#657279; }
.home-view .demo-paper-bottom { font-size:10px; color:#89918b; }
.home-view .demo-complete { border:0; border-radius:0; background:transparent; box-shadow:none; padding:10px 0 0; margin:0; min-height:40px; font-size:12px; color:#3e6555; }
.home-view .demo-complete>span { background:#e5ece5; color:#3e6555; margin-right:6px; }
.home-view .demo-steps { margin:12px 0 0; font-size:12px; }
.home-view .demo-steps li>span { background:none; border:1px solid #d1d9da; color:#75827d; width:22px; height:22px; font-size:11px; }
.home-view .demo-controls { display:flex; visibility:hidden; min-height:36px; }
.home-view .is-running .demo-controls { visibility:visible; }
.home-view .demo-controls button { font-size:11px; color:#65778a; min-height:36px; }
.home-view .demo-caption { font-size:10px; color:#7b847e; text-align:left; margin:0; }
.home-view .home-details { padding-top:43px; border-top:1px solid #dcded5; }
.home-view .section-heading { align-items:baseline; gap:16px; }
.home-view .section-heading h2,.home-view .home-details>h2 { font:400 31px/1.3 Georgia,'Times New Roman',serif; letter-spacing:-.035em; }
.home-view .section-heading a { font-size:12px; color:#596c7c; }
.home-view .steps { grid-template-columns:repeat(3,minmax(0,1fr)); gap:50px; margin:24px 0 42px; }
.home-view .steps li { border:0; padding:0; }
.home-view .steps li::before { font:12px 'Segoe UI',sans-serif; color:#778481; margin-bottom:14px; }
.home-view .steps h3 { font-size:16px; font-weight:600; letter-spacing:-.015em; margin-bottom:10px; }
.home-view .steps p { font-size:14px; color:#68726c; line-height:1.85; }
.home-view .home-notes { gap:60px; border-top:1px solid #dcded5; padding:32px 0 36px; }
.home-view .home-notes h2 { font-size:17px; font-weight:600; letter-spacing:-.025em; }
.home-view .home-notes p { font-size:14px; line-height:1.9; color:#68726c; }
.home-view .fax-discovery { background:none; border:solid #dcded5; border-width:1px 0; border-radius:0; box-shadow:none; padding:25px 0; margin:0; }
.home-view .fax-discovery h2 { font-size:17px; font-weight:600; margin-bottom:5px; }
.home-view .fax-discovery p { font-size:13px; margin:0; }
.home-view .fax-discovery .btn { background:none; border-color:#b8c2c3; font-size:12px; flex-shrink:0; }
.home-view .home-guide-strip { margin:44px 0; }
.home-reading { border-top:1px solid #dcded5; }
.home-guide-link { display:grid; grid-template-columns:130px 1fr auto; gap:20px; align-items:baseline; padding:18px 0; border-bottom:1px solid #dcded5; color:#2c414d; }
.home-guide-link:hover { text-decoration:none; color:var(--accent); }
.home-guide-link>span { font-size:11px; color:#7a837b; }
.home-guide-link h3 { font-size:15px; font-weight:500; margin:0; letter-spacing:-.01em; }
.home-view .faq { border-top:1px solid #dcded5; margin-top:22px; }
.home-view .faq details { border-bottom:1px solid #dcded5; border-radius:0; background:none; box-shadow:none; }
.home-view .faq summary { font-size:14px; }
.home-view .faq p { font-size:14px; }
.home-view .site-footer { background:#eeefe8; border-color:#dcded5; margin-top:56px; }
@media(max-width:1000px) {
 .home-view .hero-grid { gap:42px; }
 .home-view .hero h1 { font-size:58px; }
 .home-view .demo-paper { padding:24px; }
 .home-view .upload-entry { grid-template-columns:1fr; }
 .home-drop-hint { display:none; }
}
@media(max-width:700px) {
 .home-view .hero { padding:32px 0 36px; }
 .home-view .hero-grid { grid-template-columns:minmax(0,1fr); gap:30px; }
 .home-view .hero h1 { font-size:clamp(43px,11vw,58px); margin-bottom:18px; }
 .home-view .hero .lead { font-size:15px; line-height:1.8; }
 .home-free { margin-bottom:20px; }
 .home-view .upload-entry { padding:18px; }
 .home-view .upload-entry #pick { width:100%; }
 .home-view .document-demo { max-width:420px; margin:0 auto; }
 .home-view .demo-paper { padding:23px; }
 .home-view .demo-paper h2 { font-size:27px; }
 .home-view .demo-controls button { min-height:44px; }
 .home-view .home-details { padding-top:30px; }
 .home-view .section-heading { align-items:start; flex-direction:column; gap:8px; }
 .home-view .section-heading h2,.home-view .home-details>h2 { font-size:27px; }
 .home-view .steps { grid-template-columns:minmax(0,1fr); gap:24px; margin:26px 0 30px; }
 .home-view .steps li { display:grid; grid-template-columns:20px 1fr; gap:0 12px; }
 .home-view .steps li::before { grid-row:1/3; margin-top:5px; }
 .home-view .steps p { grid-column:2; margin:0; }
 .home-view .home-notes { grid-template-columns:minmax(0,1fr); gap:22px; padding:28px 0; }
 .home-view .fax-discovery { gap:16px; align-items:start; }
 .home-guide-link { grid-template-columns:1fr auto; gap:5px 12px; }
 .home-guide-link>span:first-child { grid-column:1/-1; }
 .home-guide-link h3 { font-size:14px; line-height:1.65; }
}

.home-view .main-nav a { display:inline-flex; align-items:center; min-height:44px; }
.home-view .main-nav .btn { background:none; border:0; border-radius:0; padding:0; color:inherit; font-size:inherit; font-weight:500; box-shadow:none; }
.home-view .main-nav .btn:hover { color:var(--accent); background:none; }
@media(max-width:700px) { .home-view .header-row { gap:4px; padding-top:12px; padding-bottom:4px; } .home-view .main-nav { gap:0 14px; padding:0; } }

/* Shared editorial finish: quiet surfaces, clear actions, real document space. */
body:not(.home-view) { --bg:#f7f6f2; --fg:#202b32; --muted:#59675f; --subtle:#68766d; --border:#dcded5; --line:#e1e3da; --surface:#f0f1ea; --surface-hover:#e9ece4; --radius:5px; --shadow:none; background:var(--bg); }
body:not(.home-view) .site-header { background:var(--bg); box-shadow:none; border-color:var(--border); }
body:not(.home-view) .site-footer { background:#eeefe8; border-color:var(--border); }
body:not(.home-view) .main-nav a { display:inline-flex; align-items:center; min-height:44px; }
body:not(.home-view) .main-nav .btn { background:none; border:0; border-radius:0; padding:0; color:inherit; box-shadow:none; }
body:not(.home-view) .btn { border-radius:5px; box-shadow:none; }
body:not(.home-view) .btn-primary { background:#245edb; color:#fff; }
body:not(.home-view) .btn-primary:hover { background:#1745a6; }
body:not(.home-view) :is(.card,.pack,.stat,.doc-search,.modal-box,.decline-panel,.scan-item,.scan-empty,.editorial-note,.guide-toc,.guide-cta,.guide-table-scroll) { border-radius:5px; box-shadow:none; border-color:var(--border); }
body:not(.home-view) :is(.stat,.guide-hero,.guide-cta) { background:transparent; }
body:not(.home-view) :is(.guide-toc,.editorial-note) { background:#eeefe8; }
body:not(.home-view) :is(input:not([type=checkbox]):not([type=radio]),textarea,select) { border-radius:5px; border-color:#bcc5bc; }
body:not(.home-view) :is(.workspace-heading h1,.guide-hero h1,.guide-article h1,.pricing-view h1,.account-view h1,.done-box h1,.prose>h1) { font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.035em; }
body:not(.home-view) .workspace-heading h1 { font-size:clamp(2rem,5vw,3.2rem); line-height:1.15; }
body:not(.home-view) .eyebrow { color:#68766d; letter-spacing:.12em; font-weight:500; }
body:not(.home-view) .wrap.prose { border-radius:5px; box-shadow:none; border-color:var(--border); background:#fffefa; }
.account-view #main { background:none; }
.account-view form.card { border-color:var(--border); box-shadow:none; background:#fffefa; }
body:not(.home-view) .guide-card { background:transparent; border-width:1px 0 0; border-radius:0; padding-left:0; padding-right:0; }
body:not(.home-view) .guide-card:hover { box-shadow:none; border-color:#82918a; }
body:not(.home-view) .guide-table caption,body:not(.home-view) .guide-table thead { background:#eeefe8; }
body:not(.home-view) .fax-discovery { background:transparent; box-shadow:none; border:solid var(--border); border-width:1px 0; border-radius:0; }
body:not(.home-view) .consent-card { background:#fffefa; }
body:not(.home-view) .consent-card .check { border-radius:4px; background:#f0f1ea; }
body:not(.home-view) .sign-bar { background:#f7f6f2; border-color:var(--border); box-shadow:0 1px 0 #dcded5; }
body:not(.home-view) .scan-empty { background:transparent; border-style:solid; }
body:not(.home-view) .scan-paper { border-radius:2px; box-shadow:3px 4px 0 #e5e7dd; background:#fffefa; }
body:not(.home-view) .scan-paper b { background:none; color:#245edb; }
body:not(.home-view) .done-box .big { border-radius:50%; background:#eeefe8; }
body:not(.home-view) .doc-table tr { box-shadow:none; }
@media(max-width:640px) {
 body:not(.home-view) .header-row { gap:4px; padding-top:12px; padding-bottom:4px; }
 body:not(.home-view) .main-nav { gap:0 14px; padding:0; }
 body:not(.home-view) .workspace-heading h1 { font-size:2.2rem; }
 body:not(.home-view) .consent-card { padding:20px 16px; }
 #crop .crop-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 #crop .crop-actions .btn { min-width:0; white-space:normal; min-height:48px; }
 #crop .crop-actions #use { grid-column:1/-1; }
 #crop .crop-actions #whole { grid-column:1/-1; }
 body:not(.home-view) .scan-continue { padding-top:12px; padding-bottom:max(12px,env(safe-area-inset-bottom)); }
 body:not(.home-view) .modal-box { border-radius:5px; }
}
body:not(.home-view) .brand { font-size:1.25rem; letter-spacing:-.05em; }
body:not(.home-view) .brand-mark { width:28px; height:28px; border-radius:5px; font-size:17px; }

/* Mobile task navigation and contextual feedback. */
.workspace-jump,.workspace-jump-row { display:none; }
.upload-progress { min-width:0; overflow-wrap:anywhere; }
#scan-msg,#crop-msg,#scan-upload-msg { overflow-wrap:anywhere; margin:14px 0; }
#scan:not([data-step="ready"]) .scan-continue { position:static; }
#scan[data-step="add"] .scan-continue { display:none; }
body:not(.home-view) :is(.scan-undo,.typed-option,.badge,.document-search,.empty) { border-radius:5px; }
body:not(.home-view) .empty { background:#eeefe8; border-color:var(--border); }
@media(max-width:900px) {
 .workspace-jump { display:inline-flex; align-items:center; min-height:44px; margin-top:10px; text-underline-offset:4px; text-decoration:underline; }
 .workspace-jump-row { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:12px; color:var(--subtle); margin-bottom:8px; }
 .workspace-jump-row a { display:inline-flex; align-items:center; min-height:44px; }
 #document-preview,#document-tools { scroll-margin-top:16px; }
}
@media(max-width:640px) {
 #scan>.scan-acquire { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 #scan>.scan-acquire .btn { min-width:0; padding:12px 8px; font-size:14px; }
 .scan-empty { padding:26px 16px; }
 .scan-empty h2 { font-weight:500; }
 .scan-tips { line-height:1.7; }
 .typed-option { min-width:0; text-overflow:ellipsis; border-radius:5px; }
 .sign-bar-row strong { display:block; overflow-wrap:anywhere; }
}
body:not(.home-view) .done-box { border-radius:5px; background:#fffefa; border-color:var(--border); box-shadow:none; }
body:not(.home-view) .fax-next { border-radius:0; background:transparent; border-color:var(--border); border-width:1px 0 0; padding-left:0; padding-right:0; }
body:not(.home-view) .fax-next-icon { background:#eeefe8; border-radius:5px; }
body:not(.home-view) .guide-command,body:not(.home-view) .doc-table th { background:#eeefe8; }
body:not(.home-view) .guide-command { border-radius:5px; }
@media(max-width:640px) { body:not(.home-view) .doc-table tr { border-color:var(--border); border-radius:5px; } }
html { background:#f7f6f2; }
body { min-height:100dvh; }

/* Keep the signing task visible even with a long document name. */
.sign-bar-row>div:first-child { flex:1; min-width:0; }
.sign-file-details { min-width:0; max-width:580px; }
.sign-file-details summary { display:flex; align-items:center; gap:14px; cursor:pointer; list-style:none; min-height:44px; }
.sign-file-details summary::-webkit-details-marker { display:none; }
.sign-file-name { display:-webkit-box!important; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; overflow-wrap:anywhere; font-size:13px; line-height:1.45; font-weight:600; }
.sign-file-toggle { flex-shrink:0; color:var(--accent); font-size:11px; text-decoration:underline; text-underline-offset:3px; }
.sign-file-toggle::after { content:' +'; }
.sign-file-details[open] .sign-file-toggle::after { content:' −'; }
.sign-file-full { max-height:160px; overflow:auto; overscroll-behavior:contain; padding:14px; background:#fffefa; border:1px solid var(--border); border-radius:4px; margin:8px 0; overflow-wrap:anywhere; }
.sign-file-full p { font-size:14px; margin:0 0 8px; }
@media(max-width:640px) {
 .sign-bar-row>div:first-child { flex-basis:100%; }
 .sign-bar-row .btn { font-size:14px; padding:10px 12px; min-height:48px; }
 .sign-bar-row { gap:8px; }
 .sign-file-details { max-width:none; }
 .sign-file-full { max-height:110px; }
 .modal .modal-foot .btn-sm { min-width:64px; }
}

/* A crop review keeps the photo and its actions close together on phones. */
.crop-review-count { font-size:12px; color:var(--accent-hover); margin:0 0 12px; }
.crop-review-count:empty { display:none; }
.crop-keyboard-help { margin:0 0 16px; font-size:12px; color:var(--subtle); }
.crop-keyboard-help summary { cursor:pointer; display:list-item; width:fit-content; min-height:36px; padding:8px 0; text-decoration:underline; text-underline-offset:3px; }
.crop-keyboard-help p { max-width:42em; margin:4px 0 12px; line-height:1.7; }
@media(max-width:640px) {
 #crop .crop-actions .btn { padding:10px 8px; font-size:14px; line-height:1.5; }
 .crop-keyboard-help summary { min-height:44px; padding:12px 0; }
}
.crop-stage { scroll-margin-top:28px; }

/* Explain the next action without adding another card to the workspace. */
.action-hint { margin:10px 0 14px; color:var(--subtle); line-height:1.7; }
.action-hint[data-ready="true"] { color:var(--ok); }
.upload-progress .alert a { text-decoration:underline; text-underline-offset:3px; font-weight:600; }
.upload-scan-link { display:flex; align-items:center; min-height:44px; width:fit-content; max-width:100%; margin-top:6px; line-height:1.5; }

/* Local tools use the same quiet document-first page family. */
.local-tool { max-width:1180px; }
.local-lead { max-width:650px; font-size:17px; color:var(--muted); }
.local-privacy { font-size:13px; color:#38634e; }
.local-privacy span { margin-right:6px; }
.local-tool-switch { display:flex; gap:24px; border-bottom:1px solid var(--border); margin:28px 0; }
.local-tool-switch a { display:flex; align-items:center; min-height:44px; padding-bottom:10px; font-size:14px; color:var(--muted); }
.local-tool-switch [aria-current=page] { border-bottom:2px solid var(--accent); color:var(--accent); }
.local-pick { display:flex; justify-content:space-between; align-items:center; gap:20px; background:#fffefa; border-style:dashed; }
.local-pick h2 { font-size:17px; }
.local-pick p { margin:0; }
.local-pick.drag { border-color:var(--accent); background:var(--accent-soft); }
.local-workspace { display:grid; grid-template-columns:300px minmax(0,1fr); gap:26px; margin:24px 0; align-items:start; }
.local-controls { position:sticky; top:16px; }
.local-controls h3 { font-size:16px; }
.local-controls .doc-title { margin-bottom:10px; }
.local-selection { border-top:1px solid var(--line); padding-top:14px; margin:18px 0; }
.local-selection label { display:block; }
.local-selection input { width:100%; min-height:44px; accent-color:var(--accent); }
.local-result { border-top:1px solid var(--line); padding-top:18px; margin-top:20px; }
.local-result p { overflow-wrap:anywhere; }
.local-result p:last-child { margin:12px 0 0; }
.local-mark { position:absolute; border:1px dashed var(--accent); cursor:move; touch-action:none; user-select:none; background:#245edb08; }
.local-mark.selected { outline:2px solid var(--accent); outline-offset:3px; }
.local-mark img { width:100%; height:100%; object-fit:contain; display:block; pointer-events:none; }
#local-preview { min-width:0; scroll-margin-top:24px; }
.local-notes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; border-top:1px solid var(--line); margin:42px 0; padding-top:28px; }
.local-notes h2 { font-size:17px; }
.local-notes p { font-size:14px; line-height:1.8; color:var(--muted); }
.home-local-link { font-size:12px; color:#626a68; margin:15px 0 0; line-height:1.8; }
.home-local-link a { text-decoration:underline; text-underline-offset:3px; }
@media(max-width:900px) {
 .local-workspace { grid-template-columns:minmax(0,1fr); }
 .local-controls { position:static; }
 .local-notes { grid-template-columns:minmax(0,1fr); gap:18px; }
}
@media(max-width:640px) {
 .local-pick { align-items:stretch; flex-direction:column; gap:16px; }
 .local-pick .btn { width:100%; }
 .local-lead { font-size:15px; }
 .local-tool-switch { gap:20px; }
 .local-tool-switch a { font-size:13px; }
 .local-controls { padding:20px; }
 .local-controls .btn { min-height:48px; }
}
#local-change-signature { margin-top:8px; }
.local-caption { margin:12px 0; line-height:1.7; }
#local-action-msg { margin:14px 0; overflow-wrap:anywhere; }
#local-action-msg .alert { font-size:13px; line-height:1.7; }
#local-retry { margin-bottom:10px; }
#local-download-help { line-height:1.7; }

/* Keep local PDF actions reachable while reading a long document on a phone. */
.local-mobile-actions { display:none; }
@media(max-width:900px) {
 .local-mobile-actions { position:fixed; z-index:30; left:0; right:0; bottom:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:10px; padding:10px max(16px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); background:#f7f6f2; border-top:1px solid var(--border); box-shadow:0 -5px 18px #202b320a; }
 .local-mobile-actions .btn { min-width:0; min-height:48px; font-size:14px; padding:10px 12px; }
 .local-tool #local-pages { padding-bottom:calc(110px + env(safe-area-inset-bottom)); }
}

/* DocAISign landing sections, plan cards and auto field placement. */
.hero .eyebrow { margin-bottom: 14px; }
.trust-row { list-style: none; padding: 0; margin: 18px 0 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: .86rem; color: var(--muted); }
.trust-row li { display: inline-flex; align-items: center; gap: 6px; }
.compare { margin: 56px 0; }
.compare-table { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--panel); }
.compare-row { display: grid; grid-template-columns: 1fr 1fr; }
.compare-row + .compare-row { border-top: 1px solid var(--line); }
.compare-row span { padding: 16px 20px; font-size: .93rem; line-height: 1.6; }
.compare-head span { font-weight: 600; font-size: .85rem; letter-spacing: .02em; background: var(--surface); }
.compare-head span:last-child { color: var(--accent); background: var(--accent-soft); }
.compare-row .was { color: var(--subtle); }
.compare-row .was::before { content: "✕"; color: var(--bad); font-weight: 700; margin-right: 8px; }
.compare-row .now { background: #f5f9ff; color: var(--fg); }
.compare-row .now::before { content: "✓"; color: var(--ok); font-weight: 700; margin-right: 8px; }
.features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 56px 0; }
.features article { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 26px; }
.features h3 { font-size: 1.12rem; margin: 6px 0 4px; }
.feature-num { font-size: .78rem; font-weight: 700; color: var(--accent); letter-spacing: .08em; }
.feature-hook { font-weight: 500; margin-bottom: 8px; }
.features .muted { font-size: .92rem; line-height: 1.7; margin: 0; }
.home-plans { margin: 56px 0; }
.home-plans .pack h3 { margin: 0; }
.plans .pack { position: relative; }
.amount small { font-size: .9rem; font-weight: 500; color: var(--subtle); }
.pack-featured { border: 2px solid var(--accent) !important; }
.pack-tag { position: absolute; top: -12px; left: 22px; background: var(--accent); color: #fff; font-size: .74rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; }
.plan-list { margin: 6px 0 10px; padding-left: 18px; font-size: .9rem; color: var(--muted); line-height: 1.7; }
.auto-btn { margin: 4px 0 6px; border-color: var(--accent); color: var(--accent); font-weight: 600; }
.auto-result { color: var(--muted); margin: 0 0 10px; min-height: 0; }
.auto-result:empty { display: none; }
@media (max-width: 640px) {
  .compare-row { grid-template-columns: 1fr; }
  .compare-head { display: none; }
  .compare-row .was { padding-bottom: 4px; }
  .compare-row .now { padding-top: 8px; }
  .features { grid-template-columns: 1fr; }
}