:root{--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-display:ui-rounded, "SF Pro Rounded", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--bg:#fff8ee;--bg-alt:#fff0db;--hero-bg:radial-gradient(900px 480px at 88% 0%, #ffdca3 0%, transparent 62%), radial-gradient(600px 300px at 0% 30%, #fff1c9 0%, transparent 70%), #fff8ee;--surface:#fff;--header-bg:#fff8eedb;--text:#3a2417;--muted:#7a5a43;--border:#f0dcc0;--border-strong:#e3c59c;--hover:#fdebd2;--accent:#f4a13a;--accent-hover:#f7b35c;--accent-text:#3a2417;--link:#a85a00;--focus:#e07b00;--code-bg:#fdecd3;--code-block-bg:#2a1a10;--code-text:#fbe7cf;--ok-bg:#e5f2d6;--ok-text:#3f6b1f;--soon-bg:#ffe6b8;--soon-text:#7a4a00;--window-bar:#fff3e2;--phone-bezel:#2a1d14;--shadow:0 30px 60px -24px #7a481461, 0 8px 20px -10px #7a481433;--mascot-shadow:#7a481452;--button-radius:999px;--card-radius:22px;--window-radius:18px}@media (prefers-color-scheme:dark){:root{--bg:#1b120b;--bg-alt:#22170e;--hero-bg:radial-gradient(900px 480px at 88% 0%, #f4a13a3d 0%, transparent 62%), #1b120b;--surface:#26190f;--header-bg:#1b120bdb;--text:#fbead6;--muted:#c9a98a;--border:#3d2a1b;--border-strong:#573c27;--hover:#2f2013;--accent-text:#2a1a10;--link:#ffb860;--focus:#ffb860;--code-bg:#34231a;--code-block-bg:#120b06;--ok-bg:#213018;--ok-text:#a8d48a;--soon-bg:#3a2810;--soon-text:#ffcf87;--window-bar:#2b1c11;--phone-bezel:#5a4130;--shadow:0 30px 60px -24px #000000b3;--mascot-shadow:#0000008c}}*,:before,:after{box-sizing:border-box}html{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}@media (prefers-color-scheme:dark){html{--lightningcss-light: ;--lightningcss-dark:initial}}body{background:var(--bg);color:var(--text);font:17px/1.6 var(--font-sans);-webkit-font-smoothing:antialiased;margin:0}img{max-width:100%;height:auto;display:block}a{color:var(--link);text-underline-offset:3px}code{font-family:var(--font-mono);background:var(--code-bg);border-radius:6px;padding:.1em .35em;font-size:.88em}pre code{font-size:inherit;background:0 0;padding:0}:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}.container{width:100%;max-width:1160px;margin:0 auto;padding:0 24px}.skip-link{z-index:20;background:var(--surface);color:var(--text);border-radius:8px;padding:10px 16px;position:absolute;top:-60px;left:16px}.skip-link:focus{top:12px}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.site-header{z-index:10;border-bottom:1px solid var(--border);background:var(--header-bg);-webkit-backdrop-filter:saturate(1.4)blur(12px);backdrop-filter:saturate(1.4)blur(12px);position:sticky;top:0}.header-inner{justify-content:space-between;align-items:center;gap:16px;height:64px;display:flex}.brand{color:var(--text);align-items:center;gap:10px;font-size:18px;font-weight:700;text-decoration:none;display:inline-flex}.site-nav{align-items:center;gap:4px;display:flex}.site-nav a{color:var(--muted);border-radius:8px;align-items:center;gap:6px;padding:8px 12px;font-size:15px;font-weight:500;text-decoration:none;display:inline-flex}.site-nav a:hover{background:var(--hover);color:var(--text)}.hero{background:var(--hero-bg);padding:72px 0 56px}.hero-inner{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:48px;display:grid}.hero-text{max-width:700px}.eyebrow{background:var(--soon-bg);color:var(--soon-text);letter-spacing:.01em;border-radius:999px;margin:0 0 18px;padding:6px 14px;font-size:14px;font-weight:600;display:inline-flex}h1,h2{font-family:var(--font-display);letter-spacing:-.025em;margin:0}h1{font-size:clamp(38px,6vw,62px);font-weight:800;line-height:1.04}h2{font-size:clamp(28px,4vw,40px);font-weight:750;line-height:1.15}h3{margin:0;font-size:20px;line-height:1.3}.lead{max-width:620px;color:var(--muted);margin:20px 0 0;font-size:clamp(18px,2.2vw,20px)}.actions{flex-wrap:wrap;gap:12px;margin-top:32px;display:flex}.button{border-radius:var(--button-radius);border:1px solid #0000;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:0 22px;font-size:16px;font-weight:650;text-decoration:none;display:inline-flex}.button.primary{background:var(--accent);color:var(--accent-text)}.button.primary:hover{background:var(--accent-hover)}.button.secondary{border-color:var(--border-strong);background:var(--surface);color:var(--text)}.button.secondary:hover{background:var(--hover)}.hero-meta{color:var(--muted);margin:16px 0 0;font-size:14px}.hero-mascot img{width:270px;height:270px;filter:drop-shadow(0 26px 40px var(--mascot-shadow));transform:rotate(-6deg)}.hero-shot{grid-column:1/-1}.window{border:1px solid var(--border);border-radius:var(--window-radius);background:var(--surface);box-shadow:var(--shadow);margin:0;overflow:hidden}.window-bar{border-bottom:1px solid var(--border);background:var(--window-bar);gap:8px;padding:12px 14px;display:flex}.window-bar span{background:#f4a13a;border-radius:50%;width:12px;height:12px}.window-bar span:nth-child(2){background:#ffd45e}.window-bar span:nth-child(3){background:#5e8c31}.window img{width:100%}.device-pair{position:relative}.phone{border:5px solid var(--phone-bezel);background:var(--surface);width:24%;box-shadow:var(--shadow);border-radius:22px;margin:0;position:absolute;bottom:-40px;left:-30px;overflow:hidden}.phone img{width:100%;height:auto;display:block}.zoom{cursor:zoom-in;background:0 0;border:0;width:100%;padding:0;display:block;position:relative}.zoom:focus-visible{outline-offset:-4px}.zoom-icon{color:#fff8ee;opacity:0;background:#3a2417c7;border-radius:50%;place-items:center;width:38px;height:38px;transition:opacity .15s;display:grid;position:absolute;bottom:14px;right:14px}.zoom:hover .zoom-icon,.zoom:focus-visible .zoom-icon{opacity:1}@media (hover:none){.zoom-icon{opacity:1}}.lightbox{background:0 0;border:0;width:100vw;max-width:none;height:100vh;max-height:none;margin:0;padding:64px 24px 24px;overflow:auto}.lightbox[open]{place-items:center;display:grid}.lightbox::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1b120be0}.lightbox-frame{justify-items:center;gap:14px;margin:0;animation:.18s ease-out lightbox-in;display:grid}.lightbox-view{border-radius:12px;max-width:100%;overflow:auto;box-shadow:0 30px 80px #00000080}.lightbox-frame img{background:var(--surface);cursor:zoom-out;width:auto;max-width:min(100%,1600px);height:auto;max-height:calc(100vh - 150px);display:block}.lightbox-hint{color:#c9a98a;flex-basis:100%;display:none}.lightbox-frame figcaption{color:#fbead6;text-align:center;flex-wrap:wrap;justify-content:center;gap:6px 18px;max-width:720px;font-size:14px;display:flex}.lightbox-frame figcaption a{color:#ffb860;font-weight:600}.lightbox-close{color:#fbead6;cursor:pointer;background:#26190fd1;border:1px solid #fbead647;border-radius:50%;width:42px;height:42px;font-size:26px;line-height:1;position:fixed;top:16px;right:16px}.lightbox-close:hover{background:#3a2417f2}html.lightbox-open{overflow:hidden}@keyframes lightbox-in{0%{opacity:0;transform:scale(.98)}}.section{padding:96px 0}.section-alt{background:var(--bg-alt)}.section-head{max-width:720px;margin-bottom:48px}.section-lead{color:var(--muted);margin:12px 0 0;font-size:18px}.showcase{gap:80px;display:grid}.showcase-row{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:48px;display:grid}.showcase-row:nth-child(2n) .showcase-text{order:2}.showcase-row:nth-child(2n){grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.showcase-text p{color:var(--muted);margin:12px 0 0}.feature-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:96px;display:grid}.feature,.step,.platform,.flow li{border:1px solid var(--border);border-radius:var(--card-radius);background:var(--surface)}.feature{padding:28px}.feature h3:before{content:"";background:radial-gradient(circle at 35% 35%,#ffd45e 0 30%,#f4a13a 31%);border-radius:12px;width:36px;height:36px;margin-bottom:16px;display:block}.feature p{color:var(--muted);margin:10px 0 0;font-size:16px}.steps{gap:20px;display:grid}.step{grid-template-columns:minmax(0,2fr) minmax(0,3fr);align-items:start;gap:16px 40px;min-width:0;padding:28px;display:grid}.step-head{flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:10px;display:flex}.step-text p{color:var(--muted);margin:0;font-size:16px}.step-body{min-width:0}.step-body ol{margin:0;padding-left:20px}.step-body li .code-block{margin-top:10px}.step li+li{margin-top:8px}.tag{white-space:nowrap;border-radius:999px;align-items:center;height:24px;padding:0 10px;font-size:12px;font-weight:650;display:inline-flex}.tag-ok{background:var(--ok-bg);color:var(--ok-text)}.npm-soon{background:var(--soon-bg);color:var(--soon-text);display:none}[data-npm=pending] .npm-soon{display:inline-flex}.npm-soon-note{display:none}[data-npm=pending] .npm-soon-note{display:inline}.code-block{border:1px solid var(--border);background:var(--code-block-bg);border-radius:10px;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px;margin:0;padding:8px 8px 8px 16px;display:grid}.code-block pre{color:var(--code-text);font:13.5px/1.55 var(--font-mono);margin:0;padding:6px 0;overflow-x:auto}.code-block+.code-block{margin-top:12px}.copy-button{border:1px solid var(--border-strong);background:var(--surface);min-height:30px;color:var(--muted);font:600 12px/1 var(--font-sans);cursor:pointer;border-radius:7px;padding:0 10px}.copy-button:hover{color:var(--text)}.note{color:var(--muted);font-size:15px}.note.centered{text-align:center;max-width:760px;margin:32px auto 0}.flow{grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;margin:0;padding:0;list-style:none;display:grid}.flow li{gap:6px;padding:24px;display:grid;position:relative}.flow strong{font-size:18px}.flow span{color:var(--muted);font-size:15px}.flow li:not(:last-child):after{content:"→";color:var(--muted);font-size:22px;position:absolute;top:50%;right:-36px;transform:translateY(-50%)}.platforms{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:24px;display:grid}.platform{padding:24px}.platform[data-current]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.platform-head p{color:var(--muted);margin:4px 0 0;font-size:15px}.files{gap:8px;margin:20px 0 0;padding:0;list-style:none;display:grid}.files a{border:1px solid var(--border-strong);min-height:44px;color:var(--text);border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:0 14px;font-size:15px;font-weight:600;text-decoration:none;display:flex}.files a:hover{background:var(--hover)}.files li:first-child a{background:var(--accent);color:var(--accent-text);border-color:#0000}.files li:first-child a:hover{background:var(--accent-hover)}.files .size{opacity:.75;font-size:13px;font-weight:500}.files .unavailable{border:1px dashed var(--border-strong);color:var(--muted);border-radius:10px;padding:10px 14px;font-size:15px}.platform details{margin-top:16px;font-size:15px}.platform summary{color:var(--muted);cursor:pointer;font-weight:600}.platform details p{color:var(--muted);margin:8px 0 0}.platform-note{background:var(--soon-bg);color:var(--soon-text);border-radius:8px;margin:12px 0 0;padding:10px 12px;font-size:14px}.more-links{flex-wrap:wrap;justify-content:center;gap:8px 28px;margin:36px 0 0;display:flex}.site-footer{border-top:1px solid var(--border);padding:32px 0}.footer-inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.footer-inner p{color:var(--muted);margin:0;font-size:14px}@media (max-width:960px){.step,.platforms{grid-template-columns:minmax(0,1fr)}}@media (max-width:860px){.hero-inner,.showcase-row,.showcase-row:nth-child(2n),.feature-grid{grid-template-columns:minmax(0,1fr)}.hero-mascot{display:none}.showcase-row{gap:24px}.phone{width:26%;bottom:-24px;left:-8px}.showcase-row:nth-child(2n) .showcase-text{order:0}.lightbox{padding:64px 12px 16px}.lightbox-frame,.lightbox-view{width:100%}.lightbox-frame img{width:1000px;max-width:none;max-height:none}.lightbox-hint{display:block}}@media (max-width:760px){.flow{grid-template-columns:minmax(0,1fr);gap:40px}.flow li:not(:last-child):after{content:"↓";top:auto;bottom:-34px;right:50%;transform:translate(50%)}}@media (max-width:640px){.container{padding:0 16px}.site-nav a[href=\#features],.site-nav a[href=\#get-started]{display:none}.hero{padding:48px 0 40px}.section{padding:64px 0}.actions .button{flex:100%}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.lightbox-frame{animation:none}.zoom-icon{transition:none}}
