@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;450;500;550;600;650;700;750&display=swap');
/* Scoped to onboarding chrome. The native customer widget keeps its own theme. */
html[data-provider="openai"] {
  --onboarding-accent:#087f67; --onboarding-accent-2:#25a788; --provider-bg:#edf6f2;
  --provider-surface:#f5faf7; --provider-border:#cedfd7;
  --provider-heading:"Avenir Next","Helvetica Neue",sans-serif;
}
html[data-provider="anthropic"] {
  --onboarding-accent:#a54c30; --onboarding-accent-2:#cd8061; --provider-bg:#f4eee5;
  --provider-surface:#fbf7f0; --provider-border:#e3d7c8;
  --provider-heading:Georgia,"Times New Roman",serif;
}
html[data-provider="gemini"] {
  --onboarding-accent:#365bd6; --onboarding-accent-2:#8850c7; --provider-bg:#edf1ff;
  --provider-surface:#f6f7ff; --provider-border:#d5dcef;
  --provider-heading:"Avenir Next","Segoe UI",sans-serif;
  --provider-ink:#202124; --provider-muted:#626777; --provider-input:#fff;
  --provider-frame:#d9e2f5;
}
html[data-provider="grok"] {
  --onboarding-accent:#171717; --onboarding-accent-2:#666666; --provider-bg:#eaeaea;
  --provider-surface:#f5f5f5; --provider-border:#d3d3d3;
  --provider-heading:"Helvetica Neue",Arial,sans-serif;
  --provider-ink:#111; --provider-muted:#666; --provider-input:#fff;
  --provider-frame:#222;
}
html[data-provider="muse"] {
  --onboarding-accent:#5844b7; --onboarding-accent-2:#a34aa0; --provider-bg:#f2edfb;
  --provider-surface:#faf6ff; --provider-border:#dfd4ef;
  --provider-heading:Georgia,"Times New Roman",serif;
  --provider-ink:#212344; --provider-muted:#686986; --provider-input:#fff;
  --provider-frame:#d8d8f2;
}
html[data-provider] body {
  background:radial-gradient(ellipse at 50% 0%,#fff 0%,transparent 62%),var(--provider-bg);
}
html[data-provider] .topbar {padding-top:26px;gap:12px}
html[data-provider] .brand-logo {width:28px;height:28px;object-fit:contain}
html[data-provider] #onboardingBrandName {font-size:15px;font-weight:650;letter-spacing:-.02em}
html[data-provider] .wizard-shell {border-color:var(--provider-border)}
html[data-provider] .preview-panel {background:var(--provider-surface);border-color:var(--provider-border)}
html[data-provider] .preview-grid {
  background-image:radial-gradient(var(--provider-border) 1px,transparent 1px);
}
html[data-provider] .browser-card,
html[data-provider] .sources-card {
  background:linear-gradient(#fff,#fff) padding-box,
    linear-gradient(115deg,var(--onboarding-accent),var(--onboarding-accent-2)) border-box;
}
html[data-provider] .step-card h1 {font-family:var(--provider-heading);font-size:30px;line-height:1.15}
html[data-provider] .provider-brand {color:var(--onboarding-accent);margin-bottom:16px}
html[data-provider] .step-dot.active,
html[data-provider] .step-dot.done {background:var(--onboarding-accent)}
/* Account for the native floating widget's 30px inset inside its preview. */
html[data-provider] .chat-widget-preview-shell {max-width:380px;height:520px;margin:0 auto;background:transparent}
html[data-provider] #widgetPreviewFrame {width:calc(100% + 60px)!important;height:calc(100% + 60px)!important;margin:-30px}
@media(max-width:760px){
  html[data-provider] #widgetPreviewFrame{width:100%!important;height:100%!important;margin:0}
  html[data-provider] .chat-widget-preview-shell{height:520px;max-height:75svh;min-height:300px}
  html[data-provider] #onboardingBrandName{min-width:0;font-size:clamp(16px,5vw,20px)}
  html[data-provider="anthropic"] #onboardingBrandName{font-size:clamp(20px,6vw,27px)}
}
html[data-provider] .step-dot {background:var(--provider-border)}
html[data-provider] .btn-primary,
html[data-provider] .billing-cycle-btn.active {
  background:linear-gradient(115deg,var(--onboarding-accent),var(--onboarding-accent-2));color:#fff;
}
html[data-provider] .btn-primary:hover {filter:brightness(.92)}
html[data-provider] .field input:focus,
html[data-provider] .field textarea:focus,
html[data-provider] .field select:focus {
  border-color:var(--onboarding-accent);outline:2px solid var(--provider-border);outline-offset:2px;
}
html[data-provider] .plan-card.selected {border-color:var(--onboarding-accent)}
html[data-provider] .file-drop:hover,
html[data-provider] .file-drop.dragover {background:var(--provider-surface)}
html[data-provider] button:focus-visible {outline:3px solid var(--onboarding-accent);outline-offset:3px}
html[data-provider="grok"] .wizard-shell {border-radius:16px}
html[data-provider="grok"] .btn {border-radius:8px}
@media(max-width:600px) {
  html[data-provider] .topbar {padding-top:18px}
  html[data-provider] .step-card h1 {font-size:26px}
}

/* Shared landing-page layout, with provider-specific typography and surfaces. */
html[data-provider="openai"] {
  --onboarding-accent:#070707; --onboarding-accent-2:#070707;
  --provider-bg:#fff; --provider-surface:#f4f5f6; --provider-border:#d9dadd;
  --provider-ink:#090909; --provider-muted:#6c727a; --provider-input:#fff;
  --provider-frame:#484848; --provider-heading:Inter,Arial,Helvetica,sans-serif;
}
html[data-provider="anthropic"] {
  --onboarding-accent:#191914; --onboarding-accent-2:#191914;
  --provider-bg:#f0efe6; --provider-surface:#e9dfcb; --provider-border:#d5d3c7;
  --provider-ink:#171713; --provider-muted:#6b6a5e; --provider-input:#faf9f5;
  --provider-frame:#c5bdac; --provider-heading:Inter,Arial,Helvetica,sans-serif;
}
html[data-provider] body {
  background:var(--provider-bg);color:var(--provider-ink);
  font-family:Inter,Arial,Helvetica,sans-serif;font-synthesis:none;
}
html[data-provider] .topbar {
  justify-content:flex-start;gap:13px;min-height:92px;
  padding:18px max(56px,calc((100% - 1340px)/2));
  border-bottom:1px solid var(--provider-border);
}
html[data-provider] .brand-logo {width:48px;height:43px}
html[data-provider] #onboardingBrandName {
  font-size:28px;font-weight:700;letter-spacing:-1.2px;
}
html[data-provider="anthropic"] #onboardingBrandName {
  font-family:Georgia,"Times New Roman",serif;font-size:38px;font-weight:400;letter-spacing:-1.1px;
}
html[data-provider="anthropic"] .brand-logo {mix-blend-mode:multiply}
html[data-provider] .wizard-shell {
  width:calc(100% - 112px);max-width:1340px;margin:54px auto;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:58px;
  background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible;
}
html[data-provider] .wizard-panel {
  padding:0;background:transparent;min-height:620px;
}
html[data-provider] .preview-panel {
  padding:24px;border:1px solid var(--provider-frame);border-radius:4px;min-height:620px;
}
html[data-provider="anthropic"] .preview-panel {border-radius:9px}
html[data-provider] .preview-grid {display:none}
html[data-provider] .step-card {max-width:none}
html[data-provider] .step-card h1 {
  font-size:clamp(30px,2.7vw,42px);font-weight:750;line-height:1.12;letter-spacing:-1.5px;margin-bottom:22px;
}
html[data-provider] .step-copy {
  color:var(--provider-ink);font-size:18px;line-height:1.5;letter-spacing:-.35px;margin-bottom:32px;
}
html[data-provider="anthropic"] .step-copy {font-family:Georgia,"Times New Roman",serif;font-size:23px;line-height:1.35}
html[data-provider] .step-count,
html[data-provider] .provider-brand {
  color:var(--provider-muted);font-size:12px;font-weight:550;letter-spacing:.065em;text-transform:uppercase;
}
html[data-provider] .provider-brand img {width:24px;height:24px}
html[data-provider] .step-rail {margin-bottom:32px}
html[data-provider] .step-dot {height:3px}
html[data-provider] .btn {
  border-radius:5px;font-weight:550;font-size:15px;padding:14px 23px;line-height:1.3;
}
html[data-provider] .btn-primary,
html[data-provider] .billing-cycle-btn.active {
  background:var(--onboarding-accent);border:1px solid var(--onboarding-accent);color:#fff;
}
html[data-provider] .btn-secondary {
  background:transparent;border:1px solid var(--provider-border);color:var(--provider-ink);
}
html[data-provider] .field input,
html[data-provider] .field textarea,
html[data-provider] .field select {
  background:var(--provider-input);border-color:var(--provider-border);border-radius:5px;color:var(--provider-ink);
}
html[data-provider] .browser-card,
html[data-provider] .sources-card {
  background:var(--provider-input);border:1px solid var(--provider-border);border-radius:11px;
  box-shadow:0 4px 15px #00000013;
}
html[data-provider] .source-row,
html[data-provider] .plan-card {
  border-radius:6px;background:var(--provider-input);border-color:var(--provider-border);
}
html[data-provider] .plan-card.selected {border-color:var(--onboarding-accent)}
@media(max-width:1100px) {
  html[data-provider] .wizard-shell {width:calc(100% - 72px);gap:30px}
  html[data-provider] .topbar {padding-inline:36px}
}
@media(max-width:760px) {
  html[data-provider] .topbar {padding:16px 20px;min-height:77px;gap:9px}
  html[data-provider] .brand-logo {width:36px;height:33px}
  html[data-provider] #onboardingBrandName {font-size:20px;letter-spacing:-.8px}
  html[data-provider="anthropic"] #onboardingBrandName {font-size:31px}
  html[data-provider] .wizard-shell {width:calc(100% - 40px);grid-template-columns:1fr;margin:32px auto;gap:32px}
  html[data-provider] .wizard-panel {min-height:0}
  html[data-provider] .preview-panel {min-height:420px;padding:18px}
  html[data-provider] .browser-card {margin:55px auto}
  html[data-provider] .step-card h1 {font-size:33px}
}

/* Product-name + bold service-name lockup, consistent across all editions. */
html[data-provider] #onboardingBrandName {font-weight:400;font-size:27px;letter-spacing:-.8px}
html[data-provider] #onboardingBrandName strong {font-weight:400}
html[data-provider="openai"] #onboardingBrandName>span {font-weight:600}
html[data-provider="anthropic"] .topbar {gap:20px}
html[data-provider="anthropic"] #onboardingBrandName {text-shadow:none;letter-spacing:-.8px}
html[data-provider] .pipeline-bar-fill,
html[data-provider] .step-dot.active,
html[data-provider] .step-dot.done {background:var(--onboarding-accent)}
html[data-provider="anthropic"] #onboardingBrandName {font-family:Georgia,"Times New Roman",serif}
html[data-provider="gemini"] {
  --provider-bg:#fff; --provider-surface:#f1f5ff;
  --provider-heading:Inter,Arial,sans-serif;
  --onboarding-accent:#315bd9; --onboarding-accent-2:#a247c2;
}
html[data-provider="gemini"] .step-card h1 {
  font-weight:550;letter-spacing:-1.8px;
  background:linear-gradient(95deg,#2873d7 0%,#7354bf 55%,#b24483 100%);
  color:transparent;background-clip:text;
}
html[data-provider="gemini"] .preview-panel {
  border-radius:28px;background:linear-gradient(145deg,#eef4ff,#f5efff 65%,#fff4f7);
}
html[data-provider="gemini"] .btn-primary {border-radius:999px;background:#315bd9;border-color:#315bd9}
html[data-provider="gemini"] .field input,
html[data-provider="gemini"] .field textarea {border-radius:12px;background:#f8faff}
html[data-provider="gemini"] .browser-card,
html[data-provider="gemini"] .sources-card {border-radius:18px;box-shadow:0 8px 32px #365bd612}
html[data-provider="gemini"] .step-dot.active {background:linear-gradient(90deg,#2873d7,#a247c2)}
html[data-provider="grok"] {--provider-bg:#fff;--provider-surface:#f4f4f4}
html[data-provider="grok"] .step-card h1 {letter-spacing:-2px;font-weight:750}
html[data-provider="grok"] .preview-panel {border-radius:0;border-color:#222;background:#f4f4f4}
html[data-provider="grok"] .btn,
html[data-provider="grok"] .field input {border-radius:2px}
html[data-provider="grok"] .step-count {font-family:monospace;letter-spacing:.12em}
html[data-provider="grok"] .browser-card,
html[data-provider="grok"] .sources-card {border-radius:2px;box-shadow:5px 5px 0 #dedede;border-color:#222}
html[data-provider="muse"] {--provider-bg:#fcfbff;--provider-surface:#eeedfb;--provider-heading:Inter,Arial,sans-serif}
html[data-provider="muse"] .step-card h1 {font-weight:550;letter-spacing:-1.5px;color:#343b8d}
html[data-provider="muse"] .preview-panel {border-radius:24px;background:linear-gradient(150deg,#e8f1ff,#f0eafa)}
html[data-provider="muse"] .btn-primary {border-radius:12px;background:#5146b5;border-color:#5146b5}
html[data-provider="muse"] .field input {border-radius:10px}
html[data-provider="muse"] .browser-card,
html[data-provider="muse"] .sources-card {border-radius:18px;box-shadow:0 12px 30px #464da315}
@media(max-width:760px) {
  html[data-provider] #onboardingBrandName {font-size:20px;letter-spacing:-.6px}
  html[data-provider] .brand-logo {width:32px;height:32px}
  html[data-provider] .topbar {gap:10px}
}
@media(max-width:360px) {
  html[data-provider] #onboardingBrandName {font-size:18px}
}

/* Meta Muse reference: electric-blue handwritten mark on an ice-blue surface. */
html[data-provider="muse"] {
  --onboarding-accent:#0865de;--onboarding-accent-2:#0865de;
  --provider-bg:#f8fbff;--provider-surface:#edf6ff;--provider-border:#d8e7f8;
  --provider-ink:#080e17;--provider-muted:#607086;--provider-frame:#d8e7f8;
}
html[data-provider="muse"] .step-card h1 {color:#0865de;font-weight:650}
html[data-provider="muse"] #onboardingBrandName>span {color:#0865de}
html[data-provider="muse"] #onboardingBrandName strong {color:#080e17}
html[data-provider="muse"] .preview-panel {background:linear-gradient(140deg,#d9f0ff,#f0f1ff 55%,#f1fbff);border-color:#d8e7f8}
html[data-provider="muse"] .btn-primary {background:#0865de;border-color:#0865de}
html[data-provider="muse"] .browser-card,
html[data-provider="muse"] .sources-card {box-shadow:0 12px 30px #0865de12}