:root {
  color-scheme: light;
  --page-background: #ececec;
  --paper: #ffffff;
  --text: #000000;
  --muted: #5f6368;
  --border: #dadce0;
  --accent: #111827;
  --danger: #b91c1c;
  --success: #166534;
}
* { box-sizing: border-box; }
html, body {
  margin: 0;
  min-height: 100%;
  background: var(--page-background);
  color: var(--text);
  font-family: Arial, Helvetica, sans-serif;
}
.page-shell { width: 100%; margin: 0 auto; padding: 24px 12px 48px; }
.brand-card, .sign-card, .message-card {
  width: min(8.5in, 100%);
  margin-left: auto;
  margin-right: auto;
  background: var(--paper);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 24px;
}
.brand-card { margin-bottom: 18px; }
.brand-card h1 { margin: 5px 0 4px; color: #000; font-size: 28px; line-height: 1.15; }
.eyebrow { color:#333; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.muted { color: var(--muted); }
.compact-copy { margin-top:0; margin-bottom:14px; }
.paper {
  width:min(8.5in,100%);
  margin:0 auto 18px;
  padding:.35in .7in .45in;
  background:#fff;
  color:#000;
  border:1px solid #d8d8d8;
  box-shadow:0 3px 14px rgba(0,0,0,.12);
}
.agreement-content { width:100%; color:#000; font-size:11pt; line-height:1.25; }
.document-paragraph { margin:0 0 3px; line-height:1.25; }
.document-heading { margin-top:22px; margin-bottom:6px; line-height:1.15; font-weight:700; }
.document-title { margin-top:0; font-size:18pt; }
.document-section-heading { font-size:14pt; }
.sign-card { margin-top:18px; }
.sign-card h2 { margin:0 0 8px; line-height:1.2; }
.signing-divider { height:1px; margin:28px 0; background:var(--border); }
.items-checklist { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 12px; margin:14px 0 8px; }
.item-option { display:flex; align-items:center; gap:10px; min-height:44px; padding:9px 11px; border:1px solid var(--border); border-radius:8px; background:#fff; cursor:pointer; }
.item-option:hover { background:#f8f9fa; }
.item-option input { width:20px; height:20px; margin:0; }
.item-option span { font-size:15px; line-height:1.25; }
.selection-count { min-height:20px; margin:8px 0 0; font-size:14px; font-weight:700; }
.selection-count.valid { color:var(--success); }
.selection-count.invalid { color:var(--danger); }
.field { display:block; margin:18px 0; }
.field > span, .field-label { display:block; margin-bottom:7px; font-weight:700; }
.required-marker { color:var(--danger); }
input[type="text"], input[type="email"] {
  width:100%; min-height:48px; padding:11px 13px; border:1px solid var(--border);
  border-radius:8px; background:#fff; color:#000; font-size:17px;
}
.signature-wrapper {
  position:relative; width:100%; min-height:190px; overflow:hidden;
  border:2px solid var(--border); border-radius:8px;
  background:linear-gradient(to bottom,transparent calc(100% - 42px),#e5e7eb calc(100% - 41px),#e5e7eb calc(100% - 40px),transparent calc(100% - 39px)),#fff;
}
.signature-canvas { position:relative; z-index:2; display:block; width:100%; height:190px; cursor:crosshair; touch-action:none; }
.signature-placeholder { position:absolute; z-index:1; inset:0; display:grid; place-items:center; padding:20px; color:#8a8a8a; text-align:center; pointer-events:none; }
.signature-actions { display:flex; justify-content:flex-end; margin-top:9px; }
.secondary-button { min-height:40px; padding:8px 14px; border:1px solid var(--border); border-radius:8px; background:#fff; color:#111; font-size:14px; font-weight:700; cursor:pointer; }
.consent { display:flex; gap:12px; align-items:flex-start; margin:20px 0; line-height:1.45; }
.consent input { width:20px; height:20px; margin-top:2px; }
.primary-button { width:100%; min-height:52px; border:0; border-radius:8px; background:var(--accent); color:#fff; font-size:18px; font-weight:700; cursor:pointer; }
.primary-button:disabled { opacity:.55; cursor:wait; }
.status-message { min-height:22px; margin-top:12px; color:var(--muted); }
.status-message.error { color:var(--danger); font-weight:700; }
.required-note { margin:12px 0 0; color:var(--muted); font-size:13px; }
.success-icon { width:58px; height:58px; display:grid; place-items:center; margin-bottom:14px; border-radius:50%; font-size:32px; font-weight:800; background:#dcfce7; color:var(--success); }
.signing-progress { margin-top:16px; }
.signing-progress[hidden] { display:none; }
.progress-track { width:100%; height:12px; overflow:hidden; border-radius:999px; background:#e5e7eb; }
.progress-bar { width:0; height:100%; border-radius:inherit; background:#2563eb; transition:width .4s ease; }
.progress-details { display:flex; justify-content:space-between; gap:12px; margin-top:7px; color:var(--muted); font-size:13px; }
#progressPercent { font-weight:700; color:#374151; }
/* Tighter normal paragraph spacing with a small gap below each line */
.agreement-content .document-paragraph {
  margin: 0;
  padding: 0 0 3px;
  line-height: 1.25;
}

/* Keep larger spacing only above headings */
.agreement-content .document-heading {
  margin-top: 22px;
  margin-bottom: 6px;
  padding: 0;
}
/* Force Google Doc lists completely flush-left */
.agreement-content .document-list-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 6px !important;

  margin: 0 !important;
  margin-left: 0 !important;

  padding: 0 0 3px 0 !important;
  padding-left: 0 !important;

  text-indent: 0 !important;
  line-height: 1.25 !important;
}

/* Small bullet with controlled spacing */
.agreement-content .document-list-bullet {
  flex: 0 0 8px !important;
  width: 8px !important;

  margin: 0 !important;
  margin-left: 0 !important;

  padding: 0 !important;

  font-size: 7pt !important;
  line-height: 1.75 !important;
  text-align: left !important;
}

/* Flush-left list text */
.agreement-content .document-list-content {
  flex: 1 1 auto !important;
  min-width: 0 !important;

  margin: 0 !important;
  margin-left: 0 !important;

  padding: 0 !important;
  padding-left: 0 !important;

  text-indent: 0 !important;
}
@media (max-width:760px) {
  .page-shell { padding:8px 6px 32px; }
  .paper { width:100%; padding:20px 18px; }
  .agreement-content { font-size:10.5pt; }
  .brand-card, .sign-card { width:100%; padding:18px; }
  .items-checklist { grid-template-columns:1fr; }
  .signature-wrapper, .signature-canvas { min-height:170px; height:170px; }
}
