@font-face {
  font-family: "Darlington";
  src: url("/static/Darlington.woff2") format("woff2");
  font-display: swap;
}

:root {
  --paper: #f4f2ec;
  --paper-strong: #fffef9;
  --paper-deep: #e9e6dc;
  --ink: #17201d;
  --ink-2: #2b3531;
  --muted: #646d68;
  --muted-2: #68716d;
  --line: #d7d4ca;
  --line-strong: #c5c1b5;
  --ovo-red: #ef2844;
  --ovo-red-dark: #cc1733;
  --ovo-red-soft: #fae2e5;
  --blue: #2658d8;
  --blue-soft: #e3e9ff;
  --green: #147044;
  --green-soft: #dff2e8;
  --amber: #8a4b00;
  --amber-soft: #f8e8cc;
  --font-sans: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "DM Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 16px;
  --shadow-float: 0 24px 80px rgba(23, 32, 29, .14);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; }
button { color: inherit; }
svg { width: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
[hidden] { display: none !important; }
::selection { background: #ffd4da; color: var(--ink); }

.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; z-index: 1000; left: 1rem; top: .75rem;
  transform: translateY(-160%);
  padding: .75rem 1rem; border-radius: var(--radius-sm);
  background: var(--ink); color: white; font-weight: 700;
}
.skip-link:focus { transform: none; }
.skip-link-dark { background: white; color: var(--ink); }

:focus-visible { outline: 3px solid rgba(47, 92, 255, .42); outline-offset: 3px; }

.eyebrow, .section-kicker {
  margin: 0;
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .13em;
  line-height: 1.5;
  text-transform: uppercase;
}

.app-header {
  position: sticky; z-index: 80; top: 0;
  display: grid; grid-template-columns: minmax(190px, 1fr) auto minmax(190px, 1fr);
  align-items: center;
  min-height: 68px;
  padding: 0 clamp(1rem, 3vw, 3rem);
  border-bottom: 1px solid var(--line);
  background: rgba(244, 242, 236, .93);
  backdrop-filter: blur(18px);
}
.brand-lockup {
  display: inline-flex; align-items: center; justify-self: start; gap: 0;
  color: var(--ink); text-decoration: none; font-size: .77rem; font-weight: 800;
  letter-spacing: -.01em;
}
.brand-mark, .sign-mark { color: var(--ink); font-size: 1.12rem; font-weight: 800; letter-spacing: -.1em; }
.brand-mark i, .sign-mark i { color: var(--ovo-red); font-style: normal; }
.brand-name { padding-left: .8rem; border-left: 1px solid var(--line-strong); }
.app-nav { display: flex; align-self: stretch; gap: .1rem; }
.app-nav a {
  position: relative; display: grid; place-items: center;
  min-width: 76px; padding: 0 .9rem;
  color: var(--muted); text-decoration: none; font-size: .76rem; font-weight: 700;
}
.app-nav a:hover { color: var(--ink); }
.app-nav a[aria-current="page"] { color: var(--ink); }
.app-nav a[aria-current="page"]::after { content: ""; position: absolute; inset: auto .9rem -1px; height: 2px; background: var(--ovo-red); }
.header-actions { display: flex; align-items: center; justify-self: end; gap: .65rem; }
.icon-button.mobile-nav-trigger, .mobile-nav-menu { display: none; }

.button, .icon-button, .filter-toggle, .text-button, .back-step, .sign-primary-action {
  border: 0; cursor: pointer; text-decoration: none;
}
.button {
  display: inline-flex; align-items: center; justify-content: center; gap: .7rem;
  min-height: 46px; padding: .78rem 1.15rem; border-radius: var(--radius-sm);
  font-size: .78rem; font-weight: 800; transition: transform .16s ease, background .16s ease, border-color .16s ease;
}
.button:hover { transform: translateY(-1px); }
.button svg { width: 1rem; }
.button-primary { background: var(--ovo-red); color: #fff; }
.button-primary:hover { background: var(--ovo-red-dark); }
.button-secondary { border: 1px solid var(--line-strong); background: transparent; color: var(--ink); }
.button-light { background: white; color: var(--ink); }
.button-compact { min-height: 40px; padding: .58rem .9rem; }
.icon-button {
  display: inline-grid; width: 42px; height: 42px; place-items: center;
  border-radius: 50%; background: transparent; color: var(--muted);
}
.icon-button:hover { background: var(--paper-deep); color: var(--ink); }
.text-button, .back-step {
  padding: .45rem .2rem; background: none; color: var(--muted);
  font-size: .74rem; font-weight: 750; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px;
}
.text-button:hover, .back-step:hover { color: var(--ink); text-decoration-color: currentColor; }

/* Contract Desk */
.desk-main { width: min(1440px, 100%); margin: 0 auto; padding: clamp(2.5rem, 6vw, 6.5rem) clamp(1rem, 4vw, 4.5rem) 6rem; }
.desk-intro {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem;
  padding-bottom: clamp(2.2rem, 5vw, 4.5rem);
}
.desk-intro h1, .builder-intro h1 {
  max-width: 850px; margin: .65rem 0 .9rem;
  font-size: clamp(2.65rem, 6vw, 5.65rem); line-height: .98; letter-spacing: -.065em;
}
.intro-copy, .builder-intro > p {
  max-width: 630px; margin: 0; color: var(--muted); font-size: clamp(.94rem, 1.4vw, 1.08rem); line-height: 1.65;
}
.identity-chip {
  display: flex; align-items: center; gap: .65rem; flex: 0 0 auto;
  padding: .6rem .8rem; border: 1px solid var(--line); border-radius: 100px;
  background: rgba(255,255,255,.38); color: var(--muted); font-family: var(--font-mono); font-size: .66rem;
}
.identity-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px var(--green-soft); }

.action-strip { margin-bottom: clamp(3.5rem, 7vw, 7rem); }
.section-heading-row, .workspace-head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem;
  margin-bottom: 1.15rem;
}
.section-heading-row h2, .workspace-head h2 { margin: .28rem 0 0; font-size: clamp(1.45rem, 3vw, 2.05rem); letter-spacing: -.045em; }
.section-note { margin: 0; color: var(--muted-2); font-family: var(--font-mono); font-size: .65rem; }
.action-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); }
.action-tile {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem;
  min-height: 112px; padding: 1.35rem clamp(1rem, 2vw, 1.75rem);
  border: 0; border-right: 1px solid var(--line); background: transparent; cursor: pointer; text-align: left;
  transition: background .18s ease;
}
.action-tile:last-child { border-right: 0; }
.action-tile:hover { background: rgba(255,255,255,.48); }
.action-icon { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 50%; }
.action-icon svg { width: 1.2rem; }
.action-icon-amber { background: var(--amber-soft); color: var(--amber); }
.action-icon-blue { background: var(--blue-soft); color: var(--blue); }
.action-icon-ink { background: var(--paper-deep); color: var(--ink); }
.action-copy { display: grid; gap: .15rem; }
.action-copy strong { font-size: 1.65rem; line-height: 1; letter-spacing: -.06em; }
.action-copy span { color: var(--muted); font-size: .76rem; font-weight: 650; }
.action-arrow { color: var(--muted-2); font-size: 1.1rem; }
.action-tile.is-loading .action-copy strong { color: var(--muted-2); }

.workspace { min-width: 0; }
.workspace-tools { display: flex; align-items: center; gap: .65rem; }
.search-box {
  display: flex; align-items: center; gap: .65rem; width: min(400px, 32vw); min-height: 46px;
  padding: 0 .85rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--paper-strong);
}
.search-box svg { flex: 0 0 auto; width: 1rem; color: var(--muted-2); }
.search-box input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: .78rem; }
.search-box input::placeholder { color: var(--muted-2); }
.search-box kbd { padding: .18rem .34rem; border: 1px solid var(--line); border-bottom-color: var(--line-strong); border-radius: 4px; color: var(--muted-2); font-family: var(--font-mono); font-size: .58rem; white-space: nowrap; }
.filter-toggle {
  display: inline-flex; align-items: center; gap: .45rem; min-height: 46px; padding: .7rem .9rem;
  border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: transparent; font-size: .74rem; font-weight: 750;
}
.filter-toggle:hover, .filter-toggle[aria-expanded="true"] { background: var(--paper-deep); }
.filter-toggle svg { width: .95rem; }
.saved-views { display: flex; gap: 1.55rem; overflow-x: auto; border-bottom: 1px solid var(--line-strong); scrollbar-width: none; }
.saved-views::-webkit-scrollbar { display: none; }
.saved-views button {
  position: relative; flex: 0 0 auto; min-height: 48px; padding: .65rem 0;
  border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: .75rem; font-weight: 750;
}
.saved-views button span { margin-left: .28rem; color: var(--muted-2); font-family: var(--font-mono); font-size: .63rem; }
.saved-views button[aria-selected="true"] { color: var(--ink); }
.saved-views button[aria-selected="true"]::after { content: ""; position: absolute; inset: auto 0 -1px; height: 2px; background: var(--ovo-red); }
.filter-panel {
  display: flex; align-items: flex-end; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--line);
}
.filter-panel > label:not(.check-line) { display: grid; gap: .35rem; min-width: 180px; }
.filter-panel label > span:first-child { color: var(--muted); font-family: var(--font-mono); font-size: .62rem; text-transform: uppercase; }
.filter-panel select { min-height: 40px; padding: .55rem 2rem .55rem .7rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper-strong); color: var(--ink); font-size: .72rem; }
.check-line { display: flex; align-items: center; gap: .55rem; min-height: 40px; margin-left: auto; }
.check-line input { accent-color: var(--ovo-red); }
.check-line span { color: var(--muted) !important; font-family: var(--font-sans) !important; font-size: .7rem !important; text-transform: none !important; }

.contract-table { min-width: 0; }
.contract-table-head, .contract-row {
  display: grid; grid-template-columns: minmax(260px, 2.2fr) minmax(150px, 1.15fr) minmax(120px, .8fr) minmax(110px, .75fr) 32px;
  align-items: center; column-gap: 1.1rem;
}
.contract-table-head { min-height: 46px; border-bottom: 1px solid var(--line); color: var(--muted-2); font-family: var(--font-mono); font-size: .6rem; letter-spacing: .07em; text-transform: uppercase; }
.contract-row {
  width: 100%; min-height: 76px; padding: .75rem 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; cursor: pointer; text-align: left;
  transition: background .14s ease;
}
.contract-row:hover { background: rgba(255,255,255,.46); }
.contract-row:focus-visible { position: relative; z-index: 1; }
.contract-primary { display: grid; gap: .25rem; min-width: 0; }
.contract-primary strong { overflow: hidden; color: var(--ink); font-size: .82rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.contract-primary small, .contract-primary-meta { display: flex; align-items: center; gap: .45rem; min-width: 0; overflow: hidden; color: var(--muted-2); font-family: var(--font-mono); font-size: .61rem; text-overflow: ellipsis; white-space: nowrap; }
.record-flags { display: inline-flex; align-items: center; gap: .25rem; min-width: 0; }
.record-flag { flex: 0 0 auto; padding: .14rem .3rem; border: 1px solid var(--line); border-radius: 100px; background: var(--paper-deep); color: var(--muted); font-size: .52rem; line-height: 1.2; text-transform: uppercase; }
.record-flag-alert { border-color: rgba(179,31,31,.2); background: var(--ovo-red-soft); color: var(--ovo-red-dark); }
.contract-party, .contract-date { overflow: hidden; color: var(--muted); font-size: .73rem; text-overflow: ellipsis; white-space: nowrap; }
.contract-date { font-family: var(--font-mono); font-size: .64rem; }
.status-pill { display: inline-flex; align-items: center; justify-content: center; width: fit-content; min-height: 27px; padding: .3rem .55rem; border-radius: 100px; font-family: var(--font-mono); font-size: .64rem; font-weight: 500; text-transform: uppercase; }
.status-draft { background: var(--paper-deep); color: var(--muted); }
.status-sent { background: var(--amber-soft); color: var(--amber); }
.status-viewed, .status-awaiting_company_signature { background: var(--blue-soft); color: var(--blue); }
.status-signed { background: var(--green-soft); color: var(--green); }
.status-voided, .status-cancelled { background: var(--ovo-red-soft); color: var(--ovo-red-dark); }
.status-unavailable { background: var(--paper-deep); color: var(--muted); }
.row-action { display: grid; place-items: center; }
.row-arrow { display: inline-grid; width: 32px; height: 32px; place-items: center; border: 0; border-radius: 50%; background: transparent; color: var(--muted-2); cursor: pointer; font-size: 1rem; }
.row-arrow:hover, .row-arrow:focus-visible { background: var(--paper-deep); color: var(--ink); }
.list-loading, .empty-state { display: grid; min-height: 220px; place-items: center; align-content: center; gap: .8rem; color: var(--muted); text-align: center; }
.list-loading p, .empty-state p { margin: 0; font-size: .76rem; }
.loading-mark { width: 20px; height: 20px; border: 2px solid var(--line-strong); border-top-color: var(--ink); border-radius: 50%; animation: spin .75s linear infinite; }
.loading-mark-light { border-color: rgba(255,255,255,.2); border-top-color: #fff; }
@keyframes spin { to { transform: rotate(360deg); } }
.list-footer { display: flex; justify-content: space-between; align-items: center; min-height: 58px; color: var(--muted-2); font-family: var(--font-mono); font-size: .62rem; }

.drawer-scrim { position: fixed; z-index: 98; inset: 0; background: rgba(23,32,29,.22); backdrop-filter: blur(2px); }
.contract-drawer {
  position: fixed; z-index: 99; inset: 0 0 0 auto; width: min(520px, 100%);
  transform: translateX(102%); border-left: 1px solid var(--line-strong); background: var(--paper-strong); box-shadow: var(--shadow-float);
  transition: transform .24s cubic-bezier(.2,.8,.2,1);
}
.contract-drawer.is-open { transform: none; }
.drawer-head { display: flex; min-height: 92px; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.5rem; border-bottom: 1px solid var(--line); }
.drawer-head h2 { max-width: 390px; margin: .25rem 0 0; overflow: hidden; font-size: 1.25rem; letter-spacing: -.04em; text-overflow: ellipsis; white-space: nowrap; }
.drawer-body { height: calc(100dvh - 92px); overflow-y: auto; padding: 1.5rem; }
.drawer-status-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; }
.drawer-privacy { display: grid; gap: .25rem; margin: -0.3rem 0 1rem; padding: .8rem .9rem; border: 1px solid rgba(179,31,31,.2); border-left: 3px solid var(--ovo-red); background: var(--ovo-red-soft); }
.drawer-privacy strong { color: var(--ovo-red-dark); font-size: .7rem; }
.drawer-privacy span { color: var(--ink-2); font-size: .64rem; line-height: 1.5; }
.drawer-cleanup { display: grid; gap: .25rem; margin: -0.3rem 0 1rem; padding: .8rem .9rem; border: 1px solid var(--line-strong); border-left: 3px solid var(--amber); background: var(--amber-soft); }
.drawer-cleanup strong { color: var(--amber); font-size: .7rem; }
.drawer-cleanup span { color: var(--ink-2); font-size: .64rem; line-height: 1.5; }
.drawer-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-bottom: 2rem; }
.drawer-actions .button-danger { border: 1px solid rgba(179,31,31,.22); background: transparent; color: var(--ovo-red-dark); }
.drawer-actions .button-danger:hover { background: var(--ovo-red-soft); }
.drawer-actions .button:disabled, .drawer-actions .button.is-disabled { transform: none; opacity: .45; cursor: not-allowed; }
.drawer-card { margin-bottom: 1.8rem; border-top: 1px solid var(--line-strong); }
.drawer-card h3 { margin: 0; padding: .9rem 0; border-bottom: 1px solid var(--line); font-family: var(--font-mono); font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; }
.detail-list { margin: 0; }
.detail-list > div { display: grid; grid-template-columns: 120px 1fr; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--line); }
.detail-list dt { color: var(--muted-2); font-family: var(--font-mono); font-size: .62rem; }
.detail-list dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: var(--ink-2); font-size: .74rem; }
.timeline { position: relative; margin: 0; padding: .2rem 0 0 1.2rem; list-style: none; }
.timeline::before { content: ""; position: absolute; top: .4rem; bottom: .4rem; left: 4px; width: 1px; background: var(--line-strong); }
.timeline li { position: relative; display: grid; gap: .2rem; padding: 0 0 1rem .5rem; }
.timeline li::before { content: ""; position: absolute; top: .32rem; left: -1.15rem; width: 7px; height: 7px; border: 2px solid var(--paper-strong); border-radius: 50%; background: var(--ink); box-shadow: 0 0 0 1px var(--line-strong); }
.timeline strong { font-size: .72rem; }
.timeline span { color: var(--muted); font-size: .68rem; line-height: 1.5; }
.timeline time { color: var(--muted-2); font-family: var(--font-mono); font-size: .58rem; }

.toast {
  position: fixed; z-index: 200; left: 50%; bottom: 1.25rem; transform: translate(-50%, 18px);
  max-width: min(92vw, 520px); padding: .8rem 1rem; border-radius: var(--radius-sm); background: var(--ink); color: white;
  box-shadow: var(--shadow-float); opacity: 0; pointer-events: none; font-size: .73rem; transition: opacity .2s ease, transform .2s ease;
}
.toast.is-visible { transform: translate(-50%, 0); opacity: 1; }

/* Person-first builder */
.builder-main { width: min(1440px, 100%); margin: 0 auto; padding: clamp(2.5rem, 5vw, 5rem) clamp(1rem, 4vw, 4.5rem) 6rem; }
.builder-intro { margin-bottom: clamp(2.2rem, 5vw, 4rem); }
.builder-intro h1 { max-width: 980px; }
.save-state { display: flex; align-items: center; gap: .45rem; color: var(--muted); font-family: var(--font-mono); font-size: .6rem; }
.save-state span { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.save-state.is-saving span { background: var(--amber); }
.builder-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(360px, .72fr); gap: clamp(2.5rem, 6vw, 6.5rem); align-items: start; }
.builder-workspace { min-width: 0; }
.builder-steps { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 0 2.5rem; padding: 0; border-top: 1px solid var(--line-strong); list-style: none; }
.builder-steps li { display: flex; align-items: center; gap: .6rem; padding: .8rem 0; border-top: 2px solid transparent; color: var(--muted-2); }
.builder-steps li span { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; font-family: var(--font-mono); font-size: .58rem; }
.builder-steps li strong { font-size: .68rem; }
.builder-steps li.is-active { margin-top: -1px; border-top-color: var(--ovo-red); color: var(--ink); }
.builder-steps li.is-complete span { border-color: var(--green); background: var(--green); color: white; }
.builder-step { animation: rise-in .25s ease both; }
@keyframes rise-in { from { transform: translateY(7px); opacity: 0; } }
.builder-step-head { margin-bottom: 1.65rem; }
.builder-step-head h2 { margin: .35rem 0 .4rem; font-size: clamp(1.65rem, 4vw, 2.5rem); letter-spacing: -.055em; }
.builder-step-head > p:last-child { max-width: 610px; margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.6; }
.back-step { margin: 0 0 1.2rem; }
.party-type { display: grid; grid-template-columns: repeat(4, 1fr); gap: .65rem; margin-bottom: 1.5rem; }
.party-type button {
  display: flex; min-height: 104px; align-items: flex-start; gap: .75rem; padding: 1rem;
  border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.26); cursor: pointer; text-align: left;
}
.party-type button:hover { border-color: var(--line-strong); background: rgba(255,255,255,.5); }
.party-type button[aria-checked="true"] { border-color: var(--ink); background: var(--paper-strong); box-shadow: inset 0 0 0 1px var(--ink); }
.choice-mark { display: grid; flex: 0 0 auto; width: 34px; height: 34px; place-items: center; border-radius: 50%; background: var(--paper-deep); color: var(--ink); }
.choice-mark svg { width: 1rem; }
.party-type button > span:last-child { display: grid; gap: .28rem; }
.party-type strong { font-size: .76rem; }
.party-type small { color: var(--muted); font-size: .65rem; line-height: 1.45; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.field { position: relative; display: grid; gap: .42rem; min-width: 0; }
.field-wide { grid-column: 1 / -1; }
.field > span { color: var(--ink-2); font-size: .68rem; font-weight: 750; }
.field em, .field small { margin-left: .3rem; color: var(--muted-2); font-size: .56rem; font-style: normal; font-weight: 500; text-transform: uppercase; }
.field input, .field textarea, .field select, .visibility-row select {
  width: 100%; min-height: 48px; padding: .75rem .85rem;
  border: 1px solid var(--line-strong); border-radius: var(--radius-sm); outline: none;
  background: var(--paper-strong); color: var(--ink); font-size: .78rem; transition: border-color .15s, box-shadow .15s;
}
.field textarea { min-height: 108px; resize: vertical; line-height: 1.5; }
.field input::placeholder, .field textarea::placeholder { color: var(--muted-2); }
.field input:focus, .field textarea:focus, .field select:focus, .visibility-row select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(47,92,255,.12); }
.field.has-error input, .field.has-error textarea, .field.has-error select { border-color: var(--ovo-red); box-shadow: 0 0 0 3px rgba(239,40,68,.1); }
.people-suggestions {
  position: absolute; z-index: 20; top: calc(100% + .35rem); left: 0; right: 0; max-height: 240px; overflow: auto;
  border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--paper-strong); box-shadow: 0 18px 45px rgba(23,32,29,.12);
}
.people-suggestions button { display: grid; width: 100%; gap: .18rem; padding: .75rem .85rem; border: 0; border-bottom: 1px solid var(--line); background: transparent; cursor: pointer; text-align: left; }
.people-suggestions button:hover { background: var(--paper); }
.people-suggestions strong { font-size: .73rem; }
.people-suggestions span { color: var(--muted); font-size: .65rem; }
.builder-step-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.75rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.template-search { display: flex; min-height: 48px; align-items: center; gap: .65rem; margin-bottom: 1rem; padding: 0 .85rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--paper-strong); }
.template-search svg { width: 1rem; color: var(--muted-2); }
.template-search input { width: 100%; border: 0; outline: 0; background: transparent; font-size: .78rem; }
.template-list-v2 { display: grid; border-top: 1px solid var(--line-strong); }
.template-option {
  display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: .9rem;
  min-height: 86px; padding: .9rem .25rem; border: 0; border-bottom: 1px solid var(--line); background: transparent; cursor: pointer; text-align: left;
}
.template-option:hover { background: rgba(255,255,255,.43); }
.template-option:disabled { cursor: not-allowed; opacity: .52; }
.template-option:disabled:hover { background: transparent; }
.template-option.is-unavailable .template-option-meta b { color: var(--muted-2); }
.template-number { color: var(--muted-2); font-family: var(--font-mono); font-size: .62rem; }
.template-option-copy { display: grid; gap: .22rem; min-width: 0; }
.template-option-copy strong { font-size: .78rem; }
.template-option-copy span { overflow: hidden; color: var(--muted); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }
.template-option-meta { display: grid; justify-items: end; gap: .25rem; color: var(--muted-2); font-family: var(--font-mono); font-size: .57rem; text-transform: uppercase; }
.template-option-meta b { color: var(--ovo-red); font-weight: 500; }
.selected-template-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: rgba(255,255,255,.38); }
.selected-template-bar strong { font-size: .75rem; }
.selected-template-bar span { color: var(--muted); font-family: var(--font-mono); font-size: .58rem; text-transform: uppercase; }
.terms-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.terms-form .field[data-type="textarea"] { grid-column: 1 / -1; }
.advanced-fields { margin-top: 1.25rem; border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); }
.advanced-fields summary { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 0; cursor: pointer; font-size: .72rem; font-weight: 750; }
.advanced-fields summary span { color: var(--muted); font-size: .64rem; font-weight: 500; }
.advanced-fields > .terms-form { padding: .4rem 0 1.25rem; }
.visibility-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.25rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.visibility-row > div { display: grid; gap: .22rem; }
.visibility-row strong { font-size: .72rem; }
.visibility-row span { color: var(--muted); font-size: .64rem; }
.visibility-row select { width: auto; min-width: 170px; }
.form-error { margin-top: 1rem; padding: .75rem .9rem; border: 1px solid #efabb5; border-radius: var(--radius-sm); background: var(--ovo-red-soft); color: var(--ovo-red-dark); font-size: .7rem; }
.builder-preview { position: sticky; top: 100px; }
.preview-meta { display: flex; align-items: center; justify-content: space-between; margin-bottom: .65rem; }
.preview-meta > span { color: var(--muted-2); font-family: var(--font-mono); font-size: .58rem; text-transform: uppercase; }
.preview-paper { min-height: 620px; padding: clamp(1.5rem, 3vw, 2.6rem); border: 1px solid var(--line-strong); background: var(--paper-strong); box-shadow: 0 24px 70px rgba(23,32,29,.08); }
.preview-logo { color: var(--ink); font-size: 1.75rem; font-weight: 800; letter-spacing: -.1em; }
.preview-logo span { color: var(--ovo-red); }
.preview-confidential { margin: 2.8rem 0 .7rem; color: var(--muted-2); font-family: var(--font-mono); font-size: .55rem; letter-spacing: .1em; text-transform: uppercase; }
.preview-paper h2 { max-width: 370px; margin: 0; font-size: clamp(1.55rem, 3vw, 2.25rem); line-height: 1.04; letter-spacing: -.055em; }
.preview-rule { width: 52px; height: 3px; margin: 1.4rem 0 1.8rem; background: var(--ovo-red); }
.preview-summary { margin: 0; border-top: 1px solid var(--line); }
.preview-summary > div { display: grid; grid-template-columns: 100px 1fr; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.preview-summary dt { color: var(--muted-2); font-family: var(--font-mono); font-size: .55rem; text-transform: uppercase; }
.preview-summary dd { margin: 0; overflow-wrap: anywhere; font-size: .68rem; font-weight: 700; }
.preview-terms { display: grid; gap: 1rem; margin-top: 2.2rem; }
.preview-terms > div { display: grid; gap: .45rem; }
.preview-terms span { display: block; height: 5px; border-radius: 3px; background: var(--paper-deep); }
.preview-terms span:last-child { width: 72%; }
.preview-signatures { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-top: 3rem; }
.preview-signatures span { padding-top: .6rem; border-top: 1px solid var(--ink); color: var(--muted); font-size: .57rem; }
.preview-note { margin: .75rem 0 0; color: var(--muted-2); font-size: .6rem; line-height: 1.5; }

.draft-recovery {
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  margin: -1.3rem 0 2.5rem; padding: 1.15rem 1.25rem;
  border: 1px solid var(--line-strong); border-left: 3px solid var(--ovo-red); background: var(--paper-strong);
}
.draft-recovery h2 { margin: .25rem 0; font-size: 1.1rem; letter-spacing: -.035em; }
.draft-recovery > div > p:last-child { margin: 0; color: var(--muted); font-size: .68rem; }
.draft-recovery-actions { display: flex; flex: 0 0 auto; align-items: center; gap: .8rem; }
.builder-dialog {
  width: min(470px, calc(100% - 2rem)); padding: 0; border: 1px solid var(--line-strong); border-radius: var(--radius);
  background: var(--paper-strong); color: var(--ink); box-shadow: var(--shadow-float);
}
.builder-dialog::backdrop { background: rgba(23,32,29,.32); backdrop-filter: blur(3px); }
.builder-dialog form { padding: 1.5rem; }
.builder-dialog h2 { margin: .35rem 0 .65rem; font-size: 1.7rem; letter-spacing: -.05em; }
.builder-dialog form > p:last-of-type { margin: 0; color: var(--muted); font-size: .74rem; line-height: 1.65; }
.builder-dialog-actions { display: flex; align-items: center; justify-content: flex-end; gap: 1rem; margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid var(--line); }

/* Authentication */
.login-page {
  min-height: 100dvh; display: grid; place-items: center; padding: clamp(1rem, 4vw, 3.5rem);
  background:
    radial-gradient(circle at 12% 8%, rgba(239,40,68,.09), transparent 32rem),
    linear-gradient(135deg, var(--paper) 0 57%, var(--ink) 57% 100%);
}
.login-shell {
  display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr);
  width: min(1080px, 100%); min-height: min(720px, calc(100dvh - 2rem));
  overflow: hidden; border: 1px solid var(--line-strong); background: var(--paper-strong); box-shadow: 0 32px 100px rgba(23,32,29,.2);
}
.login-panel { display: flex; min-width: 0; flex-direction: column; padding: clamp(1.5rem, 5vw, 4.6rem); }
.login-brand { width: fit-content; }
.login-copy { max-width: 590px; margin: auto 0 2.2rem; }
.login-copy h1 { margin: .65rem 0 1rem; font-size: clamp(3rem, 6vw, 5.6rem); line-height: .92; letter-spacing: -.075em; }
.login-copy > p:last-child { max-width: 510px; margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.7; }
.login-google {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .9rem;
  width: min(100%, 510px); min-height: 56px; padding: .85rem 1rem; border: 1px solid var(--ink); border-radius: var(--radius-sm);
  background: var(--ink); color: white; text-decoration: none; font-size: .78rem; font-weight: 800; transition: transform .16s ease, background .16s ease;
}
.login-google:hover { transform: translateY(-1px); background: var(--ink-2); }
.login-google svg { width: 1.15rem; }
.login-google > span:last-child { color: rgba(255,255,255,.68); font-size: 1rem; }
.login-access-note { max-width: 510px; margin: .85rem 0 2rem; color: var(--muted-2); font-size: .63rem; line-height: 1.6; }
.login-access-note strong { color: var(--ink-2); }
.login-footer { display: flex; justify-content: space-between; gap: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); color: var(--muted-2); font-family: var(--font-mono); font-size: .56rem; text-transform: uppercase; }
.login-footer span:first-child { display: flex; align-items: center; gap: .45rem; }
.login-footer i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px var(--green-soft); }
.login-proof { display: flex; min-width: 0; flex-direction: column; justify-content: flex-end; padding: clamp(2rem, 5vw, 4.6rem); background: var(--ink); color: white; }
.login-proof .section-kicker { margin-bottom: 2rem; color: rgba(255,255,255,.5); }
.login-proof ol { margin: 0; padding: 0; border-top: 1px solid rgba(255,255,255,.16); list-style: none; }
.login-proof li { display: grid; grid-template-columns: 36px 1fr; gap: 1rem; padding: 1.35rem 0; border-bottom: 1px solid rgba(255,255,255,.16); }
.login-proof li > span { color: var(--ovo-red); font-family: var(--font-mono); font-size: .6rem; }
.login-proof strong { font-size: .78rem; }
.login-proof p { margin: .4rem 0 0; color: rgba(255,255,255,.52); font-size: .66rem; line-height: 1.6; }

/* Review and sign */
.sign-page { background: var(--ink); color: #fff; }
.sign-header {
  position: sticky; z-index: 80; top: 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  min-height: 72px; padding: 0 clamp(1rem, 3vw, 2.5rem); border-bottom: 1px solid rgba(255,255,255,.1); background: rgba(23,32,29,.94); backdrop-filter: blur(18px);
}
.sign-brand { justify-self: start; }
.sign-mark { color: white; font-size: 1.3rem; }
.sign-progress { display: flex; align-items: center; gap: .65rem; color: rgba(255,255,255,.68); font-size: .66rem; font-weight: 700; }
.sign-progress span { display: flex; align-items: center; gap: .4rem; white-space: nowrap; }
.sign-progress i { display: grid; width: 21px; height: 21px; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; font-family: var(--font-mono); font-size: .52rem; font-style: normal; }
.sign-progress b { width: 28px; height: 1px; background: rgba(255,255,255,.15); }
.sign-progress span.is-active, .sign-progress span.is-complete { color: white; }
.sign-progress span.is-active i { border-color: var(--ovo-red); background: var(--ovo-red); }
.sign-progress span.is-complete i { border-color: var(--green); background: var(--green); }
.secure-label { display: flex; align-items: center; justify-self: end; gap: .45rem; color: rgba(255,255,255,.68); font-family: var(--font-mono); font-size: .58rem; text-transform: uppercase; }
.secure-label svg { width: .85rem; }
.sign-main { min-height: calc(100vh - 140px); }
.sign-loading { display: grid; min-height: 70vh; place-items: center; align-content: center; gap: 1rem; color: rgba(255,255,255,.6); }
.sign-loading p { margin: 0; font-size: .76rem; }
.sign-error-state { width: min(720px, calc(100% - 2rem)); margin: 12vh auto; text-align: center; }
.sign-error-state h1 { margin: .7rem 0 1rem; font-size: clamp(2.4rem, 7vw, 5rem); line-height: .95; letter-spacing: -.065em; }
.sign-error-state > p:not(.section-kicker) { max-width: 540px; margin: 0 auto 2rem; color: rgba(255,255,255,.58); line-height: 1.7; }
.sign-layout { display: grid; grid-template-columns: minmax(0, 860px) minmax(290px, 360px); justify-content: center; gap: clamp(2rem, 5vw, 5rem); padding: clamp(2.4rem, 6vw, 6rem) clamp(1rem, 4vw, 4rem) 7rem; }
.sign-document-column { min-width: 0; }
.sign-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.4rem; }
.sign-intro .eyebrow { color: rgba(255,255,255,.68); }
.sign-intro h1 { max-width: 680px; margin: .5rem 0 .7rem; font-size: clamp(2.45rem, 5vw, 4.6rem); line-height: .98; letter-spacing: -.06em; }
.sign-intro p:last-child { max-width: 620px; margin: 0; color: rgba(255,255,255,.58); font-size: .8rem; line-height: 1.6; }
.document-status { flex: 0 0 auto; margin-bottom: .3rem; padding: .45rem .65rem; border: 1px solid rgba(255,255,255,.13); border-radius: 100px; color: rgba(255,255,255,.7); font-family: var(--font-mono); font-size: .57rem; text-transform: uppercase; }
.document-jump { display: flex; align-items: center; gap: 1.2rem; min-height: 48px; margin-bottom: .65rem; border-top: 1px solid rgba(255,255,255,.12); border-bottom: 1px solid rgba(255,255,255,.12); }
.document-jump a, .document-jump button { border: 0; background: transparent; color: rgba(255,255,255,.58); cursor: pointer; font-size: .67rem; font-weight: 700; text-decoration: none; }
.document-jump a:hover, .document-jump button:hover { color: white; }
.document-jump button { margin-left: auto; }
.document-surface { overflow: hidden; min-height: 700px; scroll-margin-top: 5rem; background: var(--paper-strong); color: var(--ink); box-shadow: 0 30px 90px rgba(0,0,0,.23); }
.document-loading { display: grid; min-height: 700px; place-items: center; align-content: center; gap: .8rem; color: var(--muted); }
.document-loading p { margin: 0; font-size: .72rem; }
#document-root { min-width: 0; }

/* Safe, style-free rendering of generated contract content. */
#document-root .sign-banner, #document-root .banner-btn, #document-root .banner-status,
#document-root .contract-footer, #document-root .bca-footer, #document-root .doc-footer { display: none !important; }
#document-root .contract, #document-root .bca-doc, #document-root .doc { width: 100% !important; max-width: none !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--ink) !important; box-shadow: none !important; font-family: Georgia, "Times New Roman", serif !important; }
#document-root .contract-header, #document-root .bca-header { padding: clamp(2rem, 6vw, 4.5rem) clamp(1.35rem, 6vw, 5rem) 2.2rem !important; border: 0 !important; background: var(--ink) !important; color: white !important; }
#document-root .logo-img, #document-root .bca-logo { display: none !important; }
#document-root .contract-header::before, #document-root .bca-header::before { content: "OVO."; display: block; margin-bottom: clamp(2.5rem, 6vw, 5rem); color: white; font-family: var(--font-sans); font-size: 2rem; font-weight: 800; letter-spacing: -.1em; }
#document-root .confidential, #document-root .bca-confidential { color: rgba(255,255,255,.68) !important; font-family: var(--font-mono) !important; font-size: .58rem !important; letter-spacing: .12em !important; text-transform: uppercase !important; }
#document-root .title { max-width: 620px !important; margin: .6rem 0 0 !important; color: white !important; font-family: var(--font-sans) !important; font-size: clamp(2.1rem, 7vw, 4rem) !important; font-weight: 700 !important; line-height: .98 !important; letter-spacing: -.06em !important; text-transform: none !important; overflow-wrap: anywhere !important; }
#document-root .bca-title-block { max-width: none !important; margin: 0 !important; padding: 0 clamp(1.35rem, 6vw, 5rem) 2.2rem !important; background: var(--ink) !important; color: white !important; }
#document-root .bca-title-block h1 { max-width: 620px !important; margin: 0 !important; color: white !important; font-family: var(--font-sans) !important; font-size: clamp(2.1rem, 7vw, 4rem) !important; font-weight: 700 !important; line-height: .98 !important; letter-spacing: -.06em !important; text-transform: none !important; overflow-wrap: anywhere !important; }
#document-root .bca-subtitle { margin-top: .75rem !important; color: rgba(255,255,255,.5) !important; font-family: var(--font-mono) !important; font-size: .6rem !important; letter-spacing: .08em !important; text-transform: uppercase !important; }
#document-root .header-rule, #document-root .bca-divider { width: 54px !important; height: 3px !important; margin: 1.5rem 0 0 !important; border: 0 !important; background: var(--ovo-red) !important; }
#document-root .deal-summary { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; margin: 0 !important; padding: 0 clamp(1.35rem, 6vw, 5rem) !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; background: var(--paper) !important; }
#document-root .bca-deal-summary { display: block !important; margin: 0 !important; padding: 1.2rem clamp(1.35rem, 6vw, 5rem) 0 !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; background: var(--paper) !important; }
#document-root .bca-deal-summary-header { padding: 0 0 .8rem !important; color: var(--ink) !important; font-family: var(--font-sans) !important; font-size: .78rem !important; font-weight: 800 !important; }
#document-root .bca-deal-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
#document-root .summary-item, #document-root .bca-deal-cell { min-width: 0 !important; padding: 1rem 0 !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; background: transparent !important; }
#document-root .summary-item:nth-child(odd), #document-root .bca-deal-cell:nth-child(odd) { padding-right: 1rem !important; }
#document-root .summary-item:nth-child(even), #document-root .bca-deal-cell:nth-child(even) { padding-left: 1rem !important; border-left: 1px solid var(--line) !important; }
#document-root .summary-item .label, #document-root .bca-deal-label { display: block !important; margin-bottom: .3rem !important; color: var(--muted-2) !important; font-family: var(--font-mono) !important; font-size: .55rem !important; letter-spacing: .07em !important; text-transform: uppercase !important; }
#document-root .summary-item .value, #document-root .bca-deal-value { color: var(--ink) !important; font-family: var(--font-sans) !important; font-size: .72rem !important; font-weight: 750 !important; overflow-wrap: anywhere !important; }
#document-root .contract-body, #document-root .bca-body { padding: clamp(2rem, 6vw, 4.5rem) clamp(1.35rem, 6vw, 5rem) !important; background: var(--paper-strong) !important; color: var(--ink-2) !important; font-size: clamp(.83rem, 1.5vw, .96rem) !important; line-height: 1.82 !important; }
#document-root p { overflow-wrap: anywhere; }
#document-root .preamble, #document-root .bca-preamble { margin: 0 0 2rem !important; color: var(--ink-2) !important; font-size: 1em !important; line-height: inherit !important; }
#document-root .section-header, #document-root .bca-section-header { display: flex !important; align-items: baseline !important; gap: .8rem !important; margin: 2.5rem 0 .8rem !important; padding: 0 0 .55rem !important; border: 0 !important; border-bottom: 1px solid var(--ink) !important; color: var(--ink) !important; background: transparent !important; font-family: var(--font-sans) !important; font-size: 1rem !important; font-weight: 800 !important; line-height: 1.3 !important; letter-spacing: -.02em !important; text-transform: none !important; }
#document-root .section-num, #document-root .num { color: var(--ovo-red) !important; font-family: var(--font-mono) !important; font-size: .62rem !important; }
#document-root .subsection, #document-root .bca-subsection { margin: 0 0 1.3rem !important; color: var(--ink-2) !important; }
#document-root .subsection-title, #document-root .bca-subsection-title, #document-root .block-title { margin: 1.2rem 0 .4rem !important; color: var(--ink) !important; font-family: var(--font-sans) !important; font-size: .82rem !important; font-weight: 800 !important; }
#document-root .callout, #document-root .overview-block { margin: 1.4rem 0 !important; padding: 1rem 1.1rem !important; border: 1px solid var(--line) !important; border-left: 3px solid var(--ovo-red) !important; border-radius: 0 !important; background: var(--paper) !important; color: var(--ink-2) !important; }
#document-root table, #document-root .terms-table { display: table !important; width: 100% !important; margin: 1.25rem 0 !important; border-collapse: collapse !important; font-family: var(--font-sans) !important; font-size: .68rem !important; }
#document-root th, #document-root td { padding: .7rem .55rem !important; border: 1px solid var(--line) !important; color: var(--ink-2) !important; background: transparent !important; text-align: left !important; overflow-wrap: anywhere !important; }
#document-root th { background: var(--paper) !important; color: var(--ink) !important; font-weight: 800 !important; }
#document-root ul, #document-root ol { padding-left: 1.3rem !important; }
#document-root li { margin-bottom: .45rem !important; }
#document-root .signatures-section, #document-root .sig-block, #document-root .bca-signatures { margin: 3rem 0 0 !important; padding: 1.4rem 0 0 !important; border: 0 !important; border-top: 2px solid var(--ink) !important; background: transparent !important; }
#document-root .sig-header, #document-root .bca-signatures > *:first-child { color: var(--ink) !important; font-family: var(--font-sans) !important; }
#document-root .sig-grid, #document-root .bca-sig-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 2rem !important; }
#document-root .sig-column, #document-root .bca-sig-grid > * { min-width: 0 !important; }
#document-root .contract .sig-row, #document-root .bca-doc .bca-sig-row { display: grid !important; grid-template-columns: 72px minmax(0, 1fr) !important; gap: .7rem !important; align-items: start !important; margin-bottom: .75rem !important; }
#document-root .contract .sig-label, #document-root .bca-doc .bca-sig-label { width: auto !important; padding: .5rem 0 !important; color: var(--muted-2) !important; font-family: var(--font-mono) !important; font-size: .55rem !important; line-height: 1.45 !important; text-transform: uppercase !important; }
#document-root .sig-value, #document-root .bca-sig-value { min-height: 36px !important; padding: .5rem 0 !important; border: 0 !important; border-bottom: 1px solid var(--ink) !important; background: transparent !important; color: var(--ink) !important; overflow-wrap: anywhere !important; }
#document-root img { max-width: 100% !important; height: auto !important; }
#document-root .ovo-signature-receipt { margin: 0 !important; padding: clamp(2rem, 6vw, 4rem) clamp(1.35rem, 6vw, 5rem) !important; border-top: 4px solid var(--ovo-red) !important; background: var(--paper) !important; color: var(--ink) !important; font-family: var(--font-sans) !important; }
#document-root .ovo-signature-kicker { margin: 0 0 .55rem !important; color: var(--muted) !important; font-family: var(--font-mono) !important; font-size: .58rem !important; letter-spacing: .1em !important; text-transform: uppercase !important; }
#document-root .ovo-signature-receipt h2 { margin: 0 0 1.5rem !important; font-size: clamp(1.8rem, 5vw, 3rem) !important; letter-spacing: -.05em !important; }
#document-root .ovo-signature-receipt dl { margin: 1.5rem 0 !important; border-top: 1px solid var(--line) !important; }
#document-root .ovo-signature-receipt dl > div { display: grid !important; grid-template-columns: 120px 1fr !important; gap: 1rem !important; padding: .7rem 0 !important; border-bottom: 1px solid var(--line) !important; }
#document-root .ovo-signature-receipt dt { color: var(--muted) !important; font-family: var(--font-mono) !important; font-size: .58rem !important; text-transform: uppercase !important; }
#document-root .ovo-signature-receipt dd { margin: 0 !important; overflow-wrap: anywhere !important; font-size: .72rem !important; font-weight: 700 !important; }
#document-root .ovo-typed-signature { margin: .75rem 0 1rem !important; font-family: "Darlington", "Brush Script MT", cursive !important; font-size: clamp(2.5rem, 8vw, 5rem) !important; line-height: 1 !important; }
#document-root .ovo-drawn-signature { width: min(360px, 100%) !important; max-height: 150px !important; object-fit: contain !important; object-position: left center !important; }

/* The editor agreement predates the shared contract dialect. Normalize its
   structural classes here so it receives the same safe, responsive surface. */
#document-root .doc-header { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 1rem !important; padding: clamp(2rem, 6vw, 4.5rem) clamp(1.35rem, 6vw, 5rem) 1.2rem !important; border: 0 !important; background: var(--ink) !important; color: white !important; }
#document-root .doc-logo { display: none !important; }
#document-root .doc-header::before { content: "OVO."; color: white; font-family: var(--font-sans); font-size: 2rem; font-weight: 800; letter-spacing: -.1em; }
#document-root .doc-label { color: rgba(255,255,255,.62) !important; font-family: var(--font-mono) !important; font-size: .58rem !important; letter-spacing: .1em !important; text-transform: uppercase !important; }
#document-root .doc-title { margin: 0 !important; padding: 1.2rem clamp(1.35rem, 6vw, 5rem) 2.4rem !important; background: var(--ink) !important; color: white !important; }
#document-root .doc-title h1 { max-width: 620px !important; margin: 0 !important; color: white !important; font-family: var(--font-sans) !important; font-size: clamp(2.1rem, 7vw, 4rem) !important; font-weight: 700 !important; line-height: .98 !important; letter-spacing: -.06em !important; overflow-wrap: anywhere !important; }
#document-root .doc-title .subtitle { margin-top: .75rem !important; color: rgba(255,255,255,.5) !important; font-family: var(--font-mono) !important; font-size: .6rem !important; line-height: 1.5 !important; }
#document-root .doc-title .accent-rule { width: 54px !important; height: 3px !important; margin: 1.5rem 0 0 !important; background: var(--ovo-red) !important; }
#document-root .doc .deal-summary { display: block !important; margin: 0 !important; padding: 1.2rem clamp(1.35rem, 6vw, 5rem) 0 !important; border: 0 !important; border-radius: 0 !important; background: var(--paper) !important; }
#document-root .doc .deal-summary-header, #document-root .doc .table-title { padding: 0 0 .8rem !important; border: 0 !important; background: transparent !important; color: var(--ink) !important; font-family: var(--font-sans) !important; font-size: .78rem !important; font-weight: 800 !important; letter-spacing: 0 !important; text-transform: none !important; }
#document-root .doc .deal-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
#document-root .doc .deal-cell { min-width: 0 !important; padding: 1rem !important; border: 1px solid var(--line) !important; border-width: 1px 1px 0 0 !important; background: var(--paper-strong) !important; }
#document-root .doc .deal-label { margin-bottom: .3rem !important; color: var(--muted-2) !important; font-family: var(--font-mono) !important; font-size: .55rem !important; letter-spacing: .07em !important; text-transform: uppercase !important; }
#document-root .doc .deal-value { color: var(--ink) !important; font-family: var(--font-sans) !important; font-size: .72rem !important; font-weight: 750 !important; overflow-wrap: anywhere !important; }
#document-root .doc .deal-value.highlight, #document-root .doc td.green { color: var(--green) !important; }
#document-root .doc .deliverables-table { margin: 0 !important; padding: 2rem clamp(1.35rem, 6vw, 5rem) 0 !important; background: var(--paper) !important; }
#document-root .doc-body { margin: 0 !important; padding: clamp(2rem, 6vw, 4.5rem) clamp(1.35rem, 6vw, 5rem) !important; background: var(--paper-strong) !important; color: var(--ink-2) !important; font-size: clamp(.83rem, 1.5vw, .96rem) !important; line-height: 1.82 !important; }
#document-root .doc .deal-summary + .deliverables-table { border-top: 1px solid var(--line) !important; }
#document-root .doc .signatures { margin: 0 !important; padding: 2rem clamp(1.35rem, 6vw, 5rem) clamp(2.5rem, 6vw, 4rem) !important; border: 0 !important; border-top: 3px solid var(--ink) !important; background: var(--paper) !important; color: var(--ink) !important; }
#document-root .doc .sig-col-title { margin-bottom: 1rem !important; color: var(--ink) !important; font-family: var(--font-sans) !important; font-size: .7rem !important; font-weight: 800 !important; }
#document-root .doc .sig-row { display: grid !important; grid-template-columns: 72px 1fr !important; gap: .6rem !important; margin-bottom: .8rem !important; }
#document-root .doc .sig-label { width: auto !important; color: var(--muted-2) !important; font-family: var(--font-mono) !important; font-size: .55rem !important; }
#document-root .doc .sig-value { min-height: 30px !important; padding: .35rem 0 !important; border: 0 !important; border-bottom: 1px solid var(--ink) !important; border-radius: 0 !important; background: transparent !important; color: var(--ink) !important; font-family: var(--font-sans) !important; font-size: .7rem !important; overflow-wrap: anywhere !important; }

#signature-section { margin-top: 2rem; padding: clamp(1.4rem, 4vw, 2.3rem); scroll-margin-top: 5rem; background: var(--paper); color: var(--ink); }
.signature-section-head { max-width: 670px; margin-bottom: 1.5rem; }
.signature-section-head h2 { margin: .35rem 0 .4rem; font-size: clamp(1.8rem, 4vw, 2.7rem); letter-spacing: -.055em; }
.signature-section-head p:last-child { margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.6; }
.signature-method { min-width: 0; margin: 1.2rem 0 0; padding: 0; border: 0; }
.signature-method legend { margin-bottom: .45rem; font-size: .68rem; font-weight: 750; }
.signature-tabs { display: inline-flex; padding: 3px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--paper-deep); }
.signature-tabs button { min-width: 90px; min-height: 38px; border: 0; border-radius: 4px; background: transparent; color: var(--muted); cursor: pointer; font-size: .67rem; font-weight: 750; }
.signature-tabs button[aria-selected="true"] { background: var(--paper-strong); color: var(--ink); box-shadow: 0 1px 4px rgba(23,32,29,.08); }
.typed-signature, .drawn-signature { margin-top: .7rem; }
.typed-signature label { display: block; margin-bottom: .4rem; color: var(--muted); font-size: .62rem; }
.typed-signature > input { width: 100%; min-height: 44px; padding: .65rem .8rem; border: 1px solid var(--line-strong); border-radius: var(--radius-sm) var(--radius-sm) 0 0; outline: none; background: var(--paper-strong); color: var(--ink); font-size: .75rem; }
.typed-signature > input:focus { border-color: var(--blue); }
.typed-signature canvas { display: block; width: 100%; height: 132px; border: 1px solid var(--line-strong); border-top: 0; background: var(--paper-strong); }
.draw-canvas-wrap { position: relative; overflow: hidden; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--paper-strong); }
.draw-canvas-wrap canvas { display: block; width: 100%; height: 180px; touch-action: none; }
.draw-canvas-wrap > span { position: absolute; left: 1rem; bottom: .8rem; color: var(--muted-2); font-family: var(--font-mono); font-size: .56rem; pointer-events: none; text-transform: uppercase; }
.field-error { display: block; min-height: 1rem; margin: .15rem 0 0; color: var(--ovo-red-dark); font-size: .61rem; line-height: 1.4; }
.field input[aria-invalid="true"], .typed-signature input[aria-invalid="true"] { border-color: var(--ovo-red); box-shadow: 0 0 0 3px rgba(239,40,68,.1); }
.field input[readonly] { cursor: not-allowed; border-color: var(--line); background: var(--paper-deep); color: var(--muted); }
.email-verification { display: grid; gap: 1rem; margin: 1.3rem 0; padding: 1.1rem; border: 1px solid var(--line-strong); border-left: 3px solid var(--amber); background: var(--amber-soft); }
.email-verification > div:first-child { display: grid; gap: .3rem; }
.email-verification h3 { margin: 0; font-size: 1rem; letter-spacing: -.025em; }
.email-verification p { margin: 0; color: var(--ink-2); font-size: .66rem; line-height: 1.55; }
.email-verification .section-kicker { color: var(--amber); font-size: .55rem; }
.verification-actions { display: grid; grid-template-columns: auto minmax(140px, 1fr) auto; align-items: end; gap: .6rem; }
.verification-code-field { gap: .3rem; }
.verification-code-field input { min-height: 42px; font-family: var(--font-mono); font-size: .85rem; letter-spacing: .18em; text-align: center; }
.verification-status { min-height: 1rem; color: var(--muted) !important; font-family: var(--font-mono); font-size: .58rem !important; }
.email-verification.is-verified { border-left-color: var(--green); background: var(--green-soft); }
.email-verification.is-verified .section-kicker, .email-verification.is-verified .verification-status { color: var(--green) !important; }
.consent-line { display: grid; grid-template-columns: auto 1fr; gap: .7rem; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--line); cursor: pointer; }
.consent-line input { width: 18px; height: 18px; margin: .12rem 0 0; accent-color: var(--ovo-red); }
.consent-line span { color: var(--muted); font-size: .68rem; line-height: 1.6; }

.intake-workspace { min-width: 0; }
.intake-layout .terms-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.intake-dropzone { position: relative; display: grid; justify-items: center; gap: .55rem; padding: clamp(2rem, 6vw, 4.5rem) 1.5rem; border: 1px dashed var(--line-strong); background: rgba(255, 255, 255, .38); text-align: center; cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.intake-dropzone:hover, .intake-dropzone:focus-within, .intake-dropzone.is-dragging { border-color: var(--ovo-red); background: var(--ovo-red-soft); transform: translateY(-1px); }
.intake-dropzone.has-file { border-style: solid; border-color: var(--green); background: var(--green-soft); }
.intake-dropzone input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.intake-drop-mark { display: grid; place-items: center; width: 54px; aspect-ratio: 1; border-radius: 50%; background: var(--ink); color: var(--paper); font-family: var(--font-mono); font-size: .7rem; letter-spacing: .06em; }
.intake-dropzone.has-file .intake-drop-mark { background: var(--green); }
.intake-dropzone strong { font-size: 1rem; }
.intake-dropzone small { color: var(--muted); font-size: .7rem; line-height: 1.5; }
.intake-preview-paper { min-height: 560px; }
.intake-route { display: grid; gap: 1rem; margin: 2.2rem 0; padding: 0; list-style: none; }
.intake-route li { display: grid; grid-template-columns: 30px 1fr; gap: .8rem; align-items: start; }
.intake-route > li > span { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 50%; font-family: var(--font-mono); font-size: .62rem; color: var(--ovo-red); }
.intake-route div { display: grid; gap: .18rem; }
.intake-route strong { font-size: .76rem; }
.intake-route small { color: var(--muted); font-size: .67rem; line-height: 1.55; }

@media (max-width: 720px) {
  .intake-layout .terms-form { grid-template-columns: 1fr; }
}
.signature-date { margin: 1rem 0 0; color: var(--muted-2); font-family: var(--font-mono); font-size: .58rem; }
.signature-date strong { color: var(--ink); font-weight: 500; }
.sign-rail { min-width: 0; }
.sign-rail-inner { position: sticky; top: 112px; padding: 1.35rem; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.035); }
.sign-rail .section-kicker { color: rgba(255,255,255,.68); }
.sign-rail h2 { margin: .55rem 0 1.3rem; font-size: 1.35rem; line-height: 1.15; letter-spacing: -.045em; }
.sign-rail dl { margin: 0; border-top: 1px solid rgba(255,255,255,.1); }
.sign-rail dl > div { display: grid; grid-template-columns: 86px 1fr; gap: .6rem; padding: .72rem 0; border-bottom: 1px solid rgba(255,255,255,.1); }
.sign-rail dt { color: rgba(255,255,255,.68); font-family: var(--font-mono); font-size: .55rem; text-transform: uppercase; }
.sign-rail dd { margin: 0; overflow-wrap: anywhere; color: rgba(255,255,255,.78); font-size: .66rem; font-weight: 650; }
.rail-security { display: flex; align-items: flex-start; gap: .7rem; margin: 1.2rem 0; color: rgba(255,255,255,.68); }
.rail-security svg { flex: 0 0 auto; width: 1.1rem; color: var(--green); }
.rail-security span { display: grid; gap: .25rem; font-size: .61rem; line-height: 1.45; }
.rail-security strong { color: rgba(255,255,255,.78); font-size: .64rem; }
.sign-primary-action { display: flex; width: 100%; min-height: 52px; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1rem; border-radius: var(--radius-sm); background: var(--ovo-red); color: white; font-size: .75rem; font-weight: 800; }
.sign-primary-action:hover { background: var(--ovo-red-dark); }
.sign-primary-action:disabled { cursor: not-allowed; opacity: .55; }
.sign-primary-action svg { width: 1rem; }
.action-hint { margin: .65rem 0 0; color: rgba(255,255,255,.68); font-size: .57rem; line-height: 1.5; text-align: center; }
.completion-state { width: min(760px, calc(100% - 2rem)); margin: 8vh auto; padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid rgba(255,255,255,.12); text-align: center; }
.completion-check { display: grid; width: 58px; height: 58px; margin: 0 auto 1.5rem; place-items: center; border-radius: 50%; background: var(--green); color: white; }
.completion-check svg { width: 1.6rem; stroke-width: 2.5; }
.completion-state .section-kicker { color: rgba(255,255,255,.68); }
.completion-state h1 { margin: .65rem 0 1rem; font-size: clamp(2.6rem, 7vw, 5rem); line-height: .95; letter-spacing: -.065em; }
.completion-state > p:not(.section-kicker) { max-width: 560px; margin: 0 auto 2rem; color: rgba(255,255,255,.58); line-height: 1.7; }
.completion-meta { margin: 0 auto 2rem; border-top: 1px solid rgba(255,255,255,.12); text-align: left; }
.completion-meta > div { display: grid; grid-template-columns: 130px 1fr; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.completion-meta dt { color: rgba(255,255,255,.68); font-family: var(--font-mono); font-size: .58rem; text-transform: uppercase; }
.completion-meta dd { margin: 0; overflow-wrap: anywhere; font-size: .7rem; }
.completion-actions { display: flex; justify-content: center; gap: .65rem; }
.completion-state .button-secondary { border-color: rgba(255,255,255,.2); color: white; }
.sign-footer { display: flex; min-height: 68px; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 clamp(1rem, 4vw, 4rem); border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.68); font-family: var(--font-mono); font-size: .57rem; }
.sign-footer a { text-decoration: none; }
.sign-footer a:hover { color: white; }
.toast-dark { background: white; color: var(--ink); }

@media (max-width: 1024px) {
  .app-header { grid-template-columns: 1fr auto; }
  .app-nav { display: none; }
  .icon-button.mobile-nav-trigger { display: inline-grid; }
  .mobile-nav-menu { position: fixed; z-index: 95; top: 66px; right: .8rem; display: grid; min-width: 210px; padding: .45rem; border: 1px solid var(--line-strong); border-radius: var(--radius); background: var(--paper-strong); box-shadow: var(--shadow-float); }
  .mobile-nav-menu a, .mobile-nav-menu button { min-height: 44px; padding: .75rem .85rem; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--ink); cursor: pointer; font-size: .72rem; font-weight: 700; text-align: left; text-decoration: none; }
  .mobile-nav-menu a:hover, .mobile-nav-menu button:hover, .mobile-nav-menu [aria-current="page"] { background: var(--paper-deep); }
  .action-grid { grid-template-columns: 1fr; }
  .action-tile { border-right: 0; border-bottom: 1px solid var(--line); }
  .action-tile:last-child { border-bottom: 0; }
  .workspace-head { align-items: stretch; flex-direction: column; }
  .workspace-tools { width: 100%; }
  .search-box { width: 100%; }
  .contract-table-head { display: none; }
  .contract-row { grid-template-columns: minmax(0, 1fr) auto; column-gap: .9rem; min-height: 82px; }
  .contract-primary { grid-column: 1; }
  .contract-party { grid-column: 1; font-size: .68rem; }
  .contract-status { grid-column: 2; grid-row: 1; justify-self: end; }
  .contract-date { grid-column: 2; grid-row: 2; justify-self: end; }
  .row-action { display: none; }
  .builder-layout { grid-template-columns: minmax(0, 1fr) minmax(300px, .65fr); gap: 2rem; }
  .party-type { grid-template-columns: repeat(2, 1fr); }
  .party-type button { min-height: 84px; }
  .login-shell { grid-template-columns: minmax(0, 1fr) minmax(300px, .72fr); }
  .sign-layout { grid-template-columns: minmax(0, 760px); }
  .sign-rail { position: fixed; z-index: 75; inset: auto 0 0; padding: .65rem max(.8rem, env(safe-area-inset-right)) max(.65rem, env(safe-area-inset-bottom)) max(.8rem, env(safe-area-inset-left)); background: rgba(23,32,29,.95); backdrop-filter: blur(20px); }
  .sign-rail-inner { position: static; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 1rem; padding: 0; border: 0; background: transparent; }
  .sign-rail .section-kicker, .sign-rail h2, .sign-rail dl, .rail-security { display: none; }
  .sign-primary-action { min-width: 250px; }
  .action-hint { margin: 0; text-align: left; }
  .sign-footer { padding-bottom: 74px; }
}

@media (max-width: 767px) {
  .app-header { min-height: 60px; padding: 0 .9rem; }
  .brand-name { display: none; }
  .command-trigger, .builder-reset { display: none; }
  .button-compact { min-height: 42px; }
  .desk-main, .builder-main { padding: 2.5rem 1rem 5rem; }
  .desk-intro { align-items: flex-start; flex-direction: column; gap: 1.3rem; }
  .desk-intro h1, .builder-intro h1 { font-size: clamp(2.6rem, 14vw, 4rem); }
  .identity-chip { align-self: flex-start; }
  .section-heading-row { align-items: flex-start; }
  .section-note { display: none; }
  .action-tile { min-height: 88px; }
  .workspace-tools { align-items: stretch; }
  .search-box kbd { display: none; }
  .filter-toggle { flex: 0 0 auto; }
  .saved-views { gap: 1.15rem; }
  .filter-panel { align-items: stretch; flex-direction: column; }
  .filter-panel > label:not(.check-line) { width: 100%; }
  .check-line { margin-left: 0; }
  .contract-row { padding: .8rem .15rem; }
  .contract-primary strong { white-space: normal; line-height: 1.35; }
  .drawer-body { padding: 1rem; }
  .drawer-actions { grid-template-columns: 1fr; }
  .detail-list > div { grid-template-columns: 90px 1fr; }
  .builder-intro { margin-bottom: 2rem; }
  .builder-layout { grid-template-columns: 1fr; gap: 2rem; }
  .party-type { grid-template-columns: 1fr; }
  .draft-recovery { align-items: flex-start; flex-direction: column; margin-top: -.8rem; }
  .draft-recovery-actions { width: 100%; }
  .draft-recovery-actions .button { flex: 1; }
  .builder-dialog-actions { align-items: stretch; flex-direction: column-reverse; }
  .builder-dialog-actions .button, .builder-dialog-actions .text-button { width: 100%; }
  .builder-steps li { gap: .35rem; }
  .builder-steps li strong { display: none; }
  .field-grid, .terms-form { grid-template-columns: 1fr; }
  .field-wide, .terms-form .field[data-type="textarea"] { grid-column: auto; }
  .builder-preview { position: static; margin-top: 2rem; }
  .preview-paper { min-height: 500px; }
  .visibility-row { align-items: flex-start; flex-direction: column; }
  .visibility-row select { width: 100%; }
  .sign-header { grid-template-columns: 1fr auto; min-height: 60px; padding: 0 1rem; }
  .sign-mark { font-size: 1.15rem; }
  .secure-label { display: none; }
  .sign-progress { gap: .35rem; }
  .sign-progress span { gap: .25rem; font-size: .54rem; }
  .sign-progress i { font-size: .5rem; }
  .sign-progress b { width: 16px; }
  .sign-layout { display: block; padding: 2rem 0 7rem; }
  .sign-intro, .document-jump { margin-left: 1rem; margin-right: 1rem; }
  .sign-intro { align-items: flex-start; flex-direction: column; }
  .document-status { margin-bottom: 0; }
  .document-jump { gap: 1rem; overflow-x: auto; }
  .document-jump * { white-space: nowrap; }
  .document-surface { min-height: 560px; box-shadow: none; }
  #document-root .contract-header, #document-root .bca-header, #document-root .doc-header { padding: 2rem 1.25rem 1rem !important; }
  #document-root .contract-header::before, #document-root .bca-header::before { margin-bottom: 2.5rem; }
  #document-root .title, #document-root .bca-title-block h1 { font-size: clamp(2rem, 13vw, 3.4rem) !important; }
  #document-root .bca-title-block { padding: 0 1.25rem 2rem !important; }
  #document-root .deal-summary { grid-template-columns: 1fr !important; padding: 0 1.25rem !important; }
  #document-root .bca-deal-summary { padding: 1.2rem 1.25rem 0 !important; }
  #document-root .bca-deal-grid { grid-template-columns: 1fr !important; }
  #document-root .summary-item, #document-root .bca-deal-cell,
  #document-root .summary-item:nth-child(odd), #document-root .summary-item:nth-child(even),
  #document-root .bca-deal-cell:nth-child(odd), #document-root .bca-deal-cell:nth-child(even) { padding: .8rem 0 !important; border-left: 0 !important; }
  #document-root .contract-body, #document-root .bca-body { padding: 2rem 1.25rem !important; font-size: .88rem !important; }
  #document-root .doc-title { padding: 1rem 1.25rem 2rem !important; }
  #document-root .doc .deal-summary, #document-root .doc .deliverables-table { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
  #document-root .doc .deal-grid { grid-template-columns: 1fr !important; }
  #document-root .doc .deal-cell { border-right: 0 !important; }
  #document-root .doc-body { padding: 2rem 1.25rem !important; font-size: .88rem !important; }
  #document-root .doc .signatures { padding: 2rem 1.25rem !important; }
  #document-root .sig-grid, #document-root .bca-sig-grid { grid-template-columns: 1fr !important; gap: 1.5rem !important; }
  #document-root table, #document-root .terms-table { display: block !important; overflow-x: auto !important; }
  #signature-section { margin-top: 0; padding: 2rem 1.25rem; }
  #signature-section .field-grid { grid-template-columns: 1fr; }
  .verification-actions { grid-template-columns: 1fr; }
  .verification-actions .button { width: 100%; }
  .sign-rail-inner { grid-template-columns: 1fr; gap: .45rem; }
  .action-hint { display: none; }
  .sign-primary-action { width: 100%; min-width: 0; }
  .completion-state { margin: 4vh auto 10vh; }
  .completion-actions { flex-direction: column; }
  .sign-footer { align-items: flex-start; flex-direction: column; justify-content: center; }
  .login-page { display: block; padding: 0; background: var(--paper); }
  .login-shell { display: block; min-height: 100dvh; border: 0; box-shadow: none; }
  .login-panel { min-height: 100dvh; padding: 1.4rem 1.2rem; }
  .login-copy { margin: auto 0 2rem; }
  .login-copy h1 { font-size: clamp(3rem, 15vw, 4.5rem); }
  .login-google { width: 100%; }
  .login-proof { display: none; }
}

@media (max-width: 420px) {
  .header-actions .button svg { display: none; }
  .action-copy strong { font-size: 1.45rem; }
  .builder-step-actions { align-items: stretch; flex-direction: column-reverse; }
  .builder-step-actions .button { width: 100%; }
  .template-option { grid-template-columns: 32px 1fr; }
  .template-option-meta { display: none; }
  .advanced-fields summary span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
.external-pdf-review {
  display: block;
  width: 100%;
  min-height: min(76vh, 920px);
  border: 0;
  background: #fff;
}