:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#162031;background:#eef3f8;font-synthesis:none;text-rendering:optimizeLegibility;--brand: #4f46e5;--brand-strong: #3730a3;--ink: #162031;--muted: #5e6a78;--line: #d8e0ea;--surface: #ffffff;--surface-muted: #f5f8fb;--success: #167a5b;--warning: #9a5b00;--danger: #a12632}*{box-sizing:border-box}html,body{min-width:320px;min-height:100%;margin:0}body{min-height:100vh}a{color:inherit}.surface-page{background:radial-gradient(circle at 12% 4%,rgba(79,70,229,.12),transparent 28rem),linear-gradient(180deg,#f8fafc,#eef3f8)}.preview-layout,.compare-layout{width:min(1180px,calc(100% - 40px));margin:0 auto}.preview-layout{display:grid;min-height:100vh;grid-template-rows:auto 1fr;padding:24px 0 36px}.brand-bar,.compare-header,.frame-card>header{display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}.brand-mark{display:block;width:38px;height:38px;border-radius:10px;box-shadow:0 8px 20px #4f46e538}.brand>span:last-child{display:grid;gap:1px}.brand strong{font-size:15px;letter-spacing:-.01em}.brand small{color:var(--muted);font-size:11px}.compare-link,.frame-card a{color:var(--brand-strong);font-size:13px;font-weight:700;text-decoration:none}.compare-link:hover,.frame-card a:hover{text-decoration:underline;text-underline-offset:3px}.preview-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(440px,1.08fr);gap:clamp(40px,8vw,96px);align-items:center;padding:64px 0}.status-column{display:grid;align-content:center}.environment-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}.environment-badge,.state-badge{display:inline-flex;min-height:28px;align-items:center;padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:#ffffffd1;color:var(--muted);font-size:11px;font-weight:750;letter-spacing:.02em}.environment-badge[data-environment=test]{border-color:#b7ccef;background:#edf4ff;color:#204c91}.environment-badge[data-environment=prod]{border-color:#bdd9cf;background:#edf8f4;color:#185f49}.state-badge[data-tone=success]{border-color:#acd7c8;background:#e7f6f0;color:var(--success)}.state-badge[data-tone=warning]{border-color:#e5c996;background:#fff7e7;color:var(--warning)}.state-badge[data-tone=danger]{border-color:#e5b7bc;background:#fff0f2;color:var(--danger)}.eyebrow,.card-label{margin:0 0 9px;color:var(--brand-strong);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}h1,h2,p{margin-top:0}h1{max-width:720px;margin-bottom:18px;font-size:clamp(36px,5vw,62px);line-height:.98;letter-spacing:-.052em}.lede,.compare-intro{color:var(--muted);font-size:16px;line-height:1.65}.lede{max-width:600px;margin-bottom:30px}.readiness-card{display:grid;gap:20px;padding:22px;border:1px solid rgba(216,224,234,.95);border-radius:14px;background:#ffffffd6;box-shadow:0 18px 50px #1b2a3f14;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.readiness-card h2{margin:0;font-size:18px;letter-spacing:-.02em}.readiness-list{display:grid;gap:0;margin:0}.readiness-list>div{display:grid;grid-template-columns:minmax(130px,.7fr) minmax(0,1fr);gap:18px;padding:11px 0;border-top:1px solid #e7edf3}.readiness-list dt{color:var(--muted);font-size:13px}.readiness-list dd{margin:0;font-size:13px;font-weight:700;text-align:right}.request-note{margin:16px 2px 0;color:var(--muted);font-size:12px;line-height:1.5}.device-stage{min-width:0;overflow:hidden;border:1px solid #ccd7e3;border-radius:18px;background:var(--surface);box-shadow:0 32px 80px #192b4629}.browser-chrome{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center;min-height:46px;padding:0 16px;border-bottom:1px solid var(--line);background:#f7f9fc}.browser-chrome strong{color:#465466;font-size:11px;font-weight:750}.browser-chrome div{min-width:0;overflow:hidden;padding-left:8px;color:#6b7785;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.widget-stage{position:relative;display:grid;min-height:560px;place-items:center;padding:32px;background:linear-gradient(#ffffffd1,#ffffffeb),repeating-linear-gradient(0deg,transparent 0 31px,rgba(79,70,229,.055) 31px 32px),repeating-linear-gradient(90deg,transparent 0 31px,rgba(79,70,229,.055) 31px 32px)}.widget-stage[data-ready=true]{display:block}.inactive-state{display:grid;max-width:330px;justify-items:center;text-align:center}.inactive-state[hidden]{display:none}.inactive-state strong{margin-bottom:8px;font-size:17px}.inactive-state p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}.compare-page{background:#f3f6fa}.compare-layout{padding:30px 0 48px}.compare-header{align-items:flex-start;margin-bottom:30px}.compare-header>div{max-width:760px}.compare-header h1{margin-bottom:12px;font-size:clamp(30px,4vw,46px);line-height:1.04}.compare-intro{margin-bottom:0}.frame-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.frame-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 20px 52px #1a2a4217}.frame-card>header{min-height:54px;padding:0 16px;border-bottom:1px solid var(--line)}.frame-card>header>div{display:inline-flex;align-items:center;gap:8px}.environment-dot{width:9px;height:9px;border-radius:50%;background:#7e8b99}.environment-dot[data-environment=test]{background:var(--brand)}.environment-dot[data-environment=prod]{background:var(--success)}.frame-card iframe{display:block;width:100%;height:720px;border:0;background:#f8fafc}.is-embedded .preview-layout{width:min(100% - 24px,720px);padding:12px 0}.is-embedded .brand-bar{display:none}.is-embedded .preview-grid{grid-template-columns:1fr;gap:20px;align-content:start;padding:16px 0}.is-embedded h1{font-size:34px}.is-embedded .device-stage{box-shadow:0 18px 44px #192b461f}.is-embedded .widget-stage{min-height:330px}@media(max-width:900px){.preview-grid,.frame-grid{grid-template-columns:1fr}.preview-grid{gap:34px;padding:44px 0}.compare-header{display:grid}}@media(max-width:560px){.preview-layout,.compare-layout{width:min(100% - 24px,1180px)}.preview-layout,.compare-layout{padding-top:14px}.brand-bar{align-items:flex-start}.compare-link{max-width:120px;text-align:right}h1{font-size:38px}.readiness-card,.widget-stage{padding:18px}.readiness-list>div{grid-template-columns:1fr;gap:4px}.readiness-list dd{text-align:left}.widget-stage{min-height:420px}.frame-card iframe{height:660px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}}