main {width:min(800px,calc(100% - 48px));margin-inline:auto;}
h1,h2,h3,p {margin:0;}
.hero {padding:56px 0 32px;}
h1 {font-size:clamp(32px,4vw,46px);line-height:1.12;font-weight:650;letter-spacing:-1.5px;margin-bottom:18px;text-wrap:balance;}
.intro {max-width:620px;color:var(--muted);font-size:17px;line-height:1.7;}
h2 {font-size:20px;line-height:1.4;font-weight:600;letter-spacing:-.3px;}
h3 {font-size:15px;font-weight:600;}
.setup {border:1px solid var(--line);border-radius:8px;padding:28px;background:var(--surface);}
.setup-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;}
.terminal {background:var(--paper);border:1px solid var(--line);border-radius:4px;overflow:hidden;}
.terminal-bar {display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;color:var(--muted);font-size:12px;}
.terminal button {background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:8px 12px;min-height:44px;font-size:12px;}
.terminal pre {margin:0;padding:6px 16px 18px;font:13px/1.8 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;}
.install-meta {display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px 16px;margin:16px 0;color:var(--muted);font-size:13px;}
summary {list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:14px;cursor:pointer;min-height:44px;}
summary::-webkit-details-marker {display:none;}
summary>span {font-size:18px;color:var(--muted);}
details[open]>summary>span {transform:rotate(45deg);}
.primary-button {background:var(--ink);color:var(--paper);border:1px solid var(--ink);border-radius:4px;padding:10px 16px;min-height:44px;font-size:13px;font-weight:600;}
.setup-prompt {display:block;width:100%;resize:vertical;border:1px solid var(--line);border-radius:4px;padding:16px;background:var(--paper);color:var(--ink);font-size:14px;line-height:1.8;min-height:240px;}
.manual-install {padding:12px 0 0;}
.manual-body {padding-top:16px;}
.manual-body>p {color:var(--muted);font-size:14px;margin-bottom:18px;}
.copy-status {font-size:13px;color:var(--muted);min-height:22px;}
.next-steps {display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:32px 0;}
.next-steps article {display:flex;align-items:baseline;gap:10px;}
.step-number {color:var(--muted);font:12px var(--mono);}
.next-steps p {font-size:13px;line-height:1.7;color:var(--muted);margin-top:6px;}
.next-steps .example-prompt {color:var(--ink);}
.questions {border-top:1px solid var(--line);padding-bottom:24px;}
.questions details {padding:12px 0;border-bottom:1px solid var(--line);}
.questions p {font-size:14px;color:var(--muted);line-height:1.8;margin:12px 0;}
.download-link {display:inline-block;margin-left:18px;}
code {font:.95em var(--mono);}
@media(hover:hover) and (pointer:fine) {.primary-button:hover:not(:disabled) {background:#3e5045;}.terminal button:hover:not(:disabled) {background:var(--sage);}}
@media(max-width:600px) {.hero {padding:36px 0 24px;}.setup {padding:24px;}.setup-heading {flex-wrap:wrap;}.setup-prompt {font-size:16px;}.next-steps {grid-template-columns:1fr;gap:20px;}.download-link {margin:6px 12px 0 0;}}

/* Shared with the landing page; appended after legacy page styles. */
:root {
  color-scheme: light;
  --paper: #fafafa;
  --surface: #fff;
  --ink: #141214;
  --muted: #756f77;
  --line: #5a475018;
  --sage: #f2eff3;
  --pink: #edb5c2;
  --accent-ink: #8c617c;
  --sans: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --public-width: 1120px;
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
}
html { background: var(--paper); scroll-padding-top: 88px; }
body { display: block; margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.6 var(--sans); }
button, input, textarea, select { font-family: inherit; }
:focus-visible { outline: 2px solid var(--accent-ink); outline-offset: 4px; }
.public-header {
  position: sticky; top: 0; z-index: 30; width: 100%; margin: 0;
  border: 0; border-bottom: 1px solid var(--line); border-radius: 0;
  background: var(--paper); box-shadow: none;
}
.public-header-inner {
  width: min(var(--public-width), calc(100% - 80px)); max-width: none;
  min-height: 76px; margin: auto; padding: 12px 0; gap: 24px;
}
.public-brand { gap: 9px; font-size: 27px; font-weight: 500; letter-spacing: -1px; }
.public-brand svg { width: 29px; height: 29px; }
.public-beta { margin-left: 6px; padding: 3px 6px; border-radius: 4px; background: #ede8eb; color: #491529; font: 10px/1.2 var(--sans); letter-spacing: .06em; }
.public-header nav { gap: 24px; }
.public-header nav a { min-height: 40px; font-size: 15px; font-weight: 400; gap: 8px; color: #655e67; }
.public-header nav .public-nav-action { padding: 0 20px; border: 0; border-radius: 999px; color: #fff; background: #0c0b0c; }
.public-nav-action svg { width: 15px; height: 15px; }
body > main, .public-main {
  width: min(var(--public-width), calc(100% - 80px)); max-width: none;
  min-height: calc(100svh - 180px); margin: 0 auto; padding: 56px 32px;
  border-inline: 1px solid var(--line);
}
.public-main h1, main h1 { font: 500 clamp(32px, 4vw, 48px)/1.12 var(--sans); letter-spacing: -.045em; margin: 0 0 22px; text-wrap: balance; }
.public-main h2, main h2 { font: 500 26px/1.2 var(--sans); letter-spacing: -.035em; }
.public-main h3, main h3 { font: 500 18px/1.35 var(--sans); letter-spacing: -.02em; }
.public-hero, main > .hero { max-width: 720px; margin: 0 0 40px; padding: 8px 0 0; }
.public-lead, .intro { max-width: 58ch; font-size: 17px; line-height: 1.6; color: #504b52; }
.public-eyebrow { color: var(--muted); font: 11px/1.5 var(--mono); letter-spacing: .07em; margin-bottom: 16px; }
.public-grid { gap: 0; border: 1px solid var(--line); }
.public-card { padding: 32px; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.public-card + .public-card { border-top: 1px solid var(--line); }
.public-card:last-child { border-left: 1px solid var(--line); }
.public-wide { background: transparent; }
.public-card > p { max-width: 64ch; }
.public-actions { gap: 12px; margin-block: 24px; flex-wrap: wrap; }
.public-button, main button:not(.provider-button), .primary-button {
  min-height: 42px; padding: 10px 20px; border: 1px solid #0c0b0c;
  border-radius: 999px; background: #0c0b0c; color: white;
  font: 500 15px/20px var(--sans); box-shadow: none;
}
.public-button.secondary, main .terminal button { background: #fff; color: var(--ink); border-color: #dedbdd; }
.public-status { border-color: #c8b9c7; background: #f2eff3; }
.public-small, .install-meta, .public-status, .provider-help, .field-help, .status { color: var(--muted); font-size: 13px; }
.public-footer { width: min(var(--public-width), calc(100% - 80px)); padding: 24px 0; margin: 0 auto; border-top: 1px solid var(--line); font-size: 13px; }
.public-footer-brand { display: flex; align-items: center; gap: 8px; color: var(--ink); font-size: 17px; }
.public-footer-brand svg { width: 22px; height: 22px; }
.public-footer nav { gap: 24px; }
/* A single framed setup surface, with useful content instead of empty height. */
.setup { padding: 28px; border: 1px solid var(--line); border-radius: 0; background: transparent; }
.setup-heading { gap: 20px; }
.setup-heading h2 { font-size: 23px; }
.setup-heading .primary-button { flex: none; }
.setup-prompt { background: #fff; border-color: #dedbdd; border-radius: 8px; font-size: 15px; line-height: 1.65; min-height: 230px; padding: 20px; }
.terminal { border-color: var(--line); border-radius: 8px; background: #f3f1f3; }
.terminal pre { font-size: 13px; overflow-wrap: anywhere; }
.next-steps { gap: 0; padding: 0; margin-block: 32px; border-block: 1px solid var(--line); }
.next-steps article { padding: 24px 20px; }
.next-steps article + article { border-left: 1px solid var(--line); }
.next-steps p, .questions p, .manual-body > p { font-size: 15px; line-height: 1.6; }
.questions summary, .manual-install summary { font-size: 16px; padding-block: 6px; }
.questions details { border-color: var(--line); }
/* Signup and approval stay compact within the same full-width grid rails. */
.signup-card { max-width: 420px; margin: 12px auto 32px; }
.signup-card h1 { font-size: 36px; text-align: left; }
.inbox-mark { border: 0; border-radius: 0; background: none; color: var(--accent-ink); }
.provider-button { border: 1px solid #dedbdd; border-radius: 999px; background: #fff; font-weight: 500; min-height: 48px; padding: 12px 18px; }
input, .username-field { border: 1px solid #dedbdd; border-radius: 8px; background: #fff; }
.username-field:focus-within { outline-color: var(--accent-ink); }
.public-main.public-prose > *, .public-main.public-narrow > * { max-width: 680px; margin-left: auto; margin-right: auto; }
.public-prose h2 { margin-top: 32px; }
.public-main.public-narrow > * { max-width: 480px; }
.public-code { border: 1px solid var(--line); background: #fff; border-radius: 8px; padding: 18px 24px; color: var(--ink); }
.public-prose pre { white-space: pre-wrap; overflow-wrap: anywhere; }
@media (hover:hover) and (pointer:fine) {
  .primary-button:hover:not(:disabled), .public-button:hover, main button:hover:not(:disabled):not(.provider-button) { background: #292529; color: #fff; }
  .provider-button:hover:not(:disabled), .public-button.secondary:hover, .terminal button:hover:not(:disabled) { background: #f2eff3; color: var(--ink); }
}
@media (max-width: 700px) {
  .public-header-inner, body > main, .public-main, .public-footer { width: calc(100% - 40px); }
  .public-header-inner { gap: 16px; min-height: 68px; }
  .public-brand { font-size: 23px; }
  .public-brand svg { width: 25px; height: 25px; }
  .public-header nav { gap: 14px; }
  .public-header nav a { font-size: 13px; }
  .public-header nav .public-nav-action { padding-inline: 14px; }
  body > main, .public-main { padding: 36px 20px; }
  .public-grid { grid-template-columns: 1fr; }
  .public-card { padding: 24px 20px; }
  .public-card:last-child { border-left: 0; }
  .setup { padding: 20px; }
  .setup-heading { flex-wrap: wrap; }
  .setup-prompt { font-size: 16px; padding: 14px; }
  .next-steps { grid-template-columns: 1fr; }
  .next-steps article + article { border-left: 0; border-top: 1px solid var(--line); }
  .public-footer { gap: 16px; }
  .public-footer nav { gap: 16px; }
}
@media (max-width: 440px) {
  .public-header-inner { flex-wrap: wrap; gap: 8px; padding-block: 12px; }
  .public-header nav { width: 100%; justify-content: flex-start; }
  .public-header nav .public-nav-action { margin-left: auto; }
  .public-hero, main > .hero { margin-bottom: 28px; }
  .signup-card { margin-block: 0; }
  .signup-card h1 { font-size: 32px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
