@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,400..800;1,14..32,400..700&display=swap";:root{--neutral-950: #0b0f17;--neutral-900: #121826;--neutral-850: #161d2c;--neutral-800: #1a2234;--neutral-750: #212b40;--neutral-700: #2a3343;--neutral-600: #3a465c;--neutral-500: #5a6781;--neutral-400: #94a3b8;--neutral-300: #c3ccda;--neutral-200: #e5e7eb;--neutral-100: #f3f5f9;--purple-700: #6d28d9;--purple-600: #7c3aed;--purple-500: #9333ea;--purple-400: #a855f7;--purple-300: #c4a7ff;--cyan-500: #06b6d4;--cyan-400: #22d3ee;--cyan-300: #67e8f9;--cyan-200: #a5f3fc;--red-live: #ef4444;--red-600: #dc2626;--red-700: #b91c1c;--green-500: #22c55e;--green-700: #166534;--amber-500: #f59e0b;--amber-300: #fcd34d;--app-bg: var(--neutral-950);--app-panel: var(--neutral-900);--app-bar: var(--neutral-850);--app-raised: var(--neutral-800);--app-hover: var(--neutral-750);--app-line: var(--neutral-700);--app-line-strong: var(--neutral-600);--app-ink: var(--neutral-200);--app-ink-bright:var(--neutral-100);--app-muted: var(--neutral-400);--app-faint: var(--neutral-500);--app-accent: var(--cyan-400);--app-accent-quiet: rgba(34, 211, 238, .14);--app-accent-line: rgba(34, 211, 238, .4);--app-brand: var(--purple-500);--app-brand-2: var(--cyan-400);--app-on-accent: #06121a;--app-selected-bg: #0e2b33;--app-selected-line: var(--cyan-400)}:root{--font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;--font-display: "Inter", var(--font-sans);--num-feature: "tnum" 1, "cv01" 1;--weight-regular: 400;--weight-medium: 500;--weight-semibold:600;--weight-bold: 700;--weight-heavy: 750;--text-display: 2.5rem;--text-h1: 2rem;--text-h2: 1.5rem;--text-h3: 1.125rem;--text-body-lg: 1rem;--text-body: .875rem;--text-sm: .8125rem;--text-xs: .6875rem;--text-label: .75rem;--leading-tight: 1.15;--leading-snug: 1.35;--leading-normal: 1.5;--tracking-display: -.03em;--tracking-tight: -.02em;--tracking-normal: 0;--tracking-label: .08em;--tracking-wide: .06em}:root{--space-0: 0;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--gap-xs: var(--space-1);--gap-sm: var(--space-2);--gap-md: var(--space-4);--gap-lg: var(--space-6);--gap-xl: var(--space-8);--pad-control: 8px 12px;--pad-panel: var(--space-4);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--radius-pill: 999px;--border-thin: 1px;--border-med: 2px;--shadow-none: none;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 6px 18px rgba(0, 0, 0, .35);--shadow-lg: 0 18px 50px rgba(0, 0, 0, .5);--shadow-pop: 0 12px 36px rgba(0, 0, 0, .55);--shadow-inset: inset 0 0 0 1px rgba(255, 255, 255, .04);--glow-brand: 0 6px 22px rgba(147, 51, 234, .35);--glow-accent: 0 0 0 2px rgba(34, 211, 238, .25);--rail-width: 320px;--bar-height: 48px;--canvas-pad: 28px;--safe-title: 5%;--safe-action: 3.5%}:root{--dur-fast: .12s;--dur-base: .2s;--dur-slow: .32s;--dur-enter: .48s;--dur-exit: .22s;--dur-emph: .28s;--dur-pulse: 2s;--ease-entrance: cubic-bezier(.22, 1, .36, 1);--ease-exit: cubic-bezier(.4, 0, 1, 1);--ease-emphasis: cubic-bezier(.2, .8, .2, 1);--ease-standard: cubic-bezier(.4, 0, .2, 1);--ease-overshoot: cubic-bezier(.34, 1.56, .64, 1);--stagger: 70ms;--feel-calm-fast: .18s;--feel-calm-base: .36s;--feel-calm-slow: .68s;--feel-calm-stagger: 90ms;--feel-snappy-fast: .1s;--feel-snappy-base: .22s;--feel-snappy-slow: .38s;--feel-snappy-stagger: 50ms;--feel-energetic-fast: .1s;--feel-energetic-base: .24s;--feel-energetic-slow: .42s;--feel-energetic-stagger: 60ms;--feel-broadcast-fast: .14s;--feel-broadcast-base: .3s;--feel-broadcast-slow: .52s;--feel-broadcast-stagger: 70ms}@media(prefers-reduced-motion:reduce){:root{--dur-fast: 1ms;--dur-base: 1ms;--dur-slow: 1ms;--dur-enter: 1ms;--dur-exit: 1ms;--dur-emph: 1ms;--stagger: 0ms}}[data-motion=off]{--dur-fast: 1ms;--dur-base: 1ms;--dur-slow: 1ms;--dur-enter: 1ms;--dur-exit: 1ms;--dur-emph: 1ms;--stagger: 0ms}:root{--text-primary: var(--app-ink);--text-secondary: var(--app-muted);--text-faint: var(--app-faint);--text-inverse: var(--neutral-950);--text-accent: var(--cyan-300);--text-brand: var(--purple-300);--surface-app: var(--app-bg);--surface-panel: var(--app-panel);--surface-bar: var(--app-bar);--surface-card: var(--app-raised);--surface-hover: var(--app-hover);--surface-inset: var(--neutral-950);--border-subtle: var(--app-line);--border-strong: var(--app-line-strong);--border-active: var(--app-accent-line);--border-focus: var(--cyan-400);--state-live: var(--red-live);--state-draft: var(--amber-500);--state-published: var(--green-500);--state-connected: var(--green-500);--state-offline: var(--amber-500);--state-danger: var(--red-600);--state-success: var(--green-500);--state-warning: var(--amber-500);--tint-live: rgba(239, 68, 68, .14);--tint-draft: rgba(245, 158, 11, .15);--tint-published: rgba(34, 197, 94, .15);--tint-danger: rgba(220, 38, 38, .15);--tint-accent: var(--app-accent-quiet);--focus-ring: 0 0 0 2px var(--app-bg), 0 0 0 4px var(--cyan-400);--grad-brand: linear-gradient(135deg, var(--purple-500) 0%, var(--cyan-400) 100%);--grad-brand-soft: linear-gradient(135deg, var(--purple-600) 0%, var(--purple-500) 100%);--button-primary-bg: var(--grad-brand);--button-primary-text: #ffffff;--button-secondary-bg: var(--app-raised);--button-secondary-text:var(--app-ink);--control-track: var(--neutral-700);--control-fill: var(--cyan-400);--control-thumb: var(--neutral-100);--panel-bg: var(--app-panel);--panel-border: var(--app-line);--row-bg: var(--app-raised);--input-bg: var(--surface-inset);--input-border: var(--app-line)}:root{--ds-font: "Inter", system-ui, sans-serif;--ds-text: #f4f7fb;--ds-muted: rgba(244, 247, 251, .62);--ds-accent: #22d3ee;--ds-accent-2: #7c3aed;--ds-grad: linear-gradient(135deg, #7c3aed 0%, #22d3ee 100%);--ds-surface: linear-gradient(180deg, rgba(18, 24, 38, .94) 0%, rgba(11, 15, 23, .96) 100%);--ds-surface-2: rgba(255, 255, 255, .06);--ds-border: rgba(34, 211, 238, .28);--ds-radius: 14px;--ds-shadow: 0 14px 40px rgba(0, 0, 0, .5);--ds-glow: rgba(34, 211, 238, .4);--ds-on-accent: #06121a;--ds-dur-fast: .14s;--ds-dur-base: .3s;--ds-dur-slow: .52s;--ds-ease-entrance: cubic-bezier(.22, 1, .36, 1);--ds-ease-exit: cubic-bezier(.4, 0, 1, 1);--ds-ease-emphasis: cubic-bezier(.2, .8, .2, 1);--ds-stagger: 70ms}*,*:before,*:after{box-sizing:border-box}html,body,#app{height:100%}body{margin:0;background:var(--app-bg);color:var(--app-ink);font-family:var(--font-sans);font-size:var(--text-body);line-height:var(--leading-normal);font-feature-settings:var(--num-feature);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}h1,h2,h3,h4,h5,h6{margin:0;letter-spacing:var(--tracking-tight);line-height:var(--leading-tight)}a{color:var(--text-accent);text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:var(--radius-sm)}.app-section-label{font-size:var(--text-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--app-accent);font-weight:var(--weight-semibold)}.app-tnum{font-feature-settings:var(--num-feature);font-variant-numeric:tabular-nums}*{scrollbar-width:thin;scrollbar-color:var(--app-line-strong) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:var(--app-line-strong);border:2px solid transparent;background-clip:content-box;border-radius:var(--radius-pill)}*::-webkit-scrollbar-thumb:hover{background:var(--app-faint);background-clip:content-box}*::-webkit-scrollbar-track{background:transparent}:root{--bg: var(--app-bg);--bg-2: var(--app-panel);--surface: var(--app-panel);--line: var(--app-line);--ink: var(--app-ink);--muted: var(--app-muted);--accent: var(--app-brand);--accent-2: var(--app-brand-2);--radius: var(--radius-lg);--maxw: 1080px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:radial-gradient(1100px 600px at 50% -10%,rgba(147,51,234,.22),transparent 60%),radial-gradient(900px 500px at 90% 0%,rgba(34,211,238,.12),transparent 55%),var(--app-bg);color:var(--ink);font-family:var(--font-sans);line-height:1.5;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}h1,h2,h3{line-height:1.15;margin:0}.muted{color:var(--muted)}.grad{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:10px;font-weight:600;font-size:14px;border:1px solid transparent;cursor:pointer;transition:transform .12s ease,filter .12s ease,background .12s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--grad-brand);color:var(--app-on-accent);box-shadow:var(--glow-brand)}.btn-primary:hover{filter:brightness(1.08)}.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}.btn-ghost:hover{background:var(--surface)}.btn-lg{padding:13px 24px;font-size:16px;border-radius:12px}.nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:16px 28px;max-width:var(--maxw);margin:0 auto;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.brand{font-weight:800;letter-spacing:.2px;font-size:18px}.nav-links{display:flex;align-items:center;gap:22px}.nav-links a:not(.btn){color:var(--muted);font-size:14px;font-weight:500}.nav-links a:not(.btn):hover{color:var(--ink)}main{max-width:var(--maxw);margin:0 auto;padding:0 28px}.hero{text-align:center;padding:64px 0 40px}.badge{display:inline-block;padding:5px 14px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;color:var(--muted);background:#ffffff05}.hero h1{font-size:clamp(34px,6vw,60px);font-weight:800;margin:22px 0 0;letter-spacing:var(--tracking-tight)}.lead{max-width:640px;margin:18px auto 0;color:var(--muted);font-size:18px}.cta-row{display:flex;gap:12px;justify-content:center;margin-top:28px;flex-wrap:wrap}.hero-stage{margin:48px auto 0;max-width:760px;height:280px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(0deg,var(--bg-2),var(--bg-2)),repeating-conic-gradient(#0d1018 0% 25%,#11141d 0% 50%) 0 0 / 26px 26px;display:flex;align-items:center;justify-content:center;overflow:hidden}.alert-demo{display:flex;align-items:center;gap:16px;padding:18px 28px;border-radius:14px;background:linear-gradient(135deg,#6d28d9,#9333ea);color:#fff;box-shadow:0 18px 50px #6d28d973;animation:rise .7s cubic-bezier(.2,.8,.2,1) both}.alert-demo-icon{font-size:2.4em}.alert-demo-title{font-size:.85em;opacity:.85;text-transform:uppercase;letter-spacing:.06em}.alert-demo-name{font-size:1.8em;font-weight:700}@keyframes rise{0%{opacity:0;transform:translateY(22px) scale(.96)}to{opacity:1;transform:none}}section{padding:28px 0}h2{font-size:clamp(24px,4vw,34px);font-weight:800;text-align:center;letter-spacing:var(--tracking-tight)}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-top:36px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px}.card-icon{font-size:26px}.card h3{margin:12px 0 6px;font-size:18px}.card p{margin:0;color:var(--muted);font-size:14.5px}.steps{padding-top:44px}.step-list{list-style:none;padding:0;margin:28px auto 0;max-width:720px;display:grid;gap:14px}.step-list li{display:flex;gap:16px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}.step-n{flex-shrink:0;width:30px;height:30px;border-radius:999px;display:grid;place-items:center;font-weight:800;background:var(--grad-brand);color:var(--app-on-accent)}.step-list strong{font-size:16px}.step-list p{margin:2px 0 0;color:var(--muted);font-size:14px}.templates{text-align:center;padding-top:44px}.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:24px 0 28px}.chip{padding:9px 16px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:14px;font-weight:600}.obs{text-align:center;padding-top:44px}.obs-sub{color:var(--muted);margin:14px 0 18px}.obs-url{display:inline-block;max-width:100%;overflow-x:auto;padding:14px 20px;border-radius:12px;border:1px solid var(--line);background:var(--surface-inset);color:var(--app-accent);font-family:var(--font-mono);font-size:14px}.footer{max-width:var(--maxw);margin:56px auto 0;padding:24px 28px 48px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;flex-wrap:wrap}.footer span:first-child{font-weight:800}@media(max-width:720px){.features{grid-template-columns:1fr}.nav-links a:not(.btn){display:none}}
