:root{--bg:#0b1120;--bg-soft:#0f172a;--surface:#111a2e;--surface-2:#16213a;--border:#233049;--ink:#f1f5f9;--ink-2:#cbd5e1;--muted:#94a3b8;--accent:var(--xj-accent-400);--accent-ink:var(--xj-accent-300);--accent-soft:#4cbb8e1f;--btn-ink:#0b231b;--shadow:0 1px 2px #0000004d, 0 12px 32px -12px #00000080;--glow:radial-gradient(60rem 30rem at 70% -10%, #2f9e7429, transparent 60%);--ill-box-a:#0d2a20;--ill-box-b:#0d1729;--ill-box-stroke:#4cbb8e73;--ill-chip:var(--xj-accent-500);--ill-chip-text:#0b231b;--ill-surface:#131d33;--ill-card-stroke:#26344f;--ill-glyph-bg:#4cbb8e29;--ill-glyph:var(--xj-accent-300);--ill-ink:#f1f5f9;--ill-muted:#8696ad;--ill-accent-ink:var(--xj-accent-300);--ill-line:#3a4863;--ill-ghost-fill:#94a3b80a;--ill-ghost-chip:#1f2a40;color-scheme:dark}:root[data-theme=light]{--bg:#fff;--bg-soft:#f6f8fb;--surface:#fff;--surface-2:#f6f8fb;--border:#e2e8f0;--ink:var(--xj-navy);--ink-2:#334155;--muted:#5b6b80;--accent:var(--xj-accent-700);--accent-ink:var(--xj-accent-700);--accent-soft:var(--xj-accent-50);--btn-ink:#fff;--shadow:0 1px 2px #0f172a0f, 0 12px 32px -12px #0f172a29;--glow:radial-gradient(60rem 30rem at 70% -10%, #2f9e741f, transparent 60%);--ill-box-a:#effaf5;--ill-box-b:#fff;--ill-box-stroke:#23805e59;--ill-chip:var(--xj-accent-700);--ill-chip-text:#fff;--ill-surface:#fff;--ill-card-stroke:#e2e8f0;--ill-glyph-bg:var(--xj-accent-50);--ill-glyph:var(--xj-accent-700);--ill-ink:var(--xj-navy);--ill-muted:#64748b;--ill-accent-ink:var(--xj-accent-700);--ill-line:#cbd5e1;--ill-ghost-fill:#fafbfc;--ill-ghost-chip:#eef2f6;color-scheme:light}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--ink);font-family:var(--xj-font-sans);-webkit-font-smoothing:antialiased;margin:0;font-size:1rem;line-height:1.6}img,svg{max-width:100%;display:block}a{color:var(--accent-ink)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}.container{width:100%;max-width:72rem;margin-inline:auto;padding-inline:1rem}@media (width>=48rem){.container{padding-inline:1.5rem}}.skip-link{background:var(--accent);color:var(--btn-ink);z-index:10;border-radius:.5rem;padding:.5rem .9rem;position:absolute;top:-3rem;left:1rem}.skip-link:focus{top:.75rem}.logo-dark,:root[data-theme=dark] .logo-light{display:none}:root[data-theme=dark] .logo-dark{display:block}.site-header{z-index:5;background:color-mix(in srgb, var(--bg) 82%, transparent);backdrop-filter:saturate(1.4)blur(10px);border-bottom:1px solid var(--border);position:sticky;top:0}.header-inner{justify-content:space-between;align-items:center;height:4rem;display:flex}.brand{align-items:center;display:flex}.brand .logo{width:auto;height:1.85rem}.header-nav{align-items:center;gap:.5rem;display:flex}.header-nav>a:not(.icon-link){color:var(--ink-2);border-radius:.5rem;padding:.5rem .75rem;font-weight:550;text-decoration:none}.header-nav>a:hover{color:var(--ink);background:var(--surface-2)}.icon-link,.theme-toggle{width:2.5rem;height:2.5rem;color:var(--ink-2);cursor:pointer;background:0 0;border:0;border-radius:.6rem;place-items:center;display:inline-grid}.icon-link:hover,.theme-toggle:hover{color:var(--ink);background:var(--surface-2)}.icon-moon,:root[data-theme=light] .icon-sun{display:none}:root[data-theme=light] .icon-moon{display:block}.section{padding-block:clamp(3.5rem,8vw,6rem)}.section-alt{background:var(--bg-soft);border-block:1px solid var(--border)}.section-head{max-width:44rem;margin-bottom:2.5rem}.eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--accent-ink);margin:0 0 .75rem;font-size:.8rem;font-weight:650;display:inline-block}h1,h2,h3{letter-spacing:-.02em;margin:0;line-height:1.15}h2{font-size:clamp(1.75rem,3.5vw,2.4rem);font-weight:750}h3{letter-spacing:-.01em;font-size:1.1rem;font-weight:650}.lead{color:var(--ink-2);margin:1rem 0 0;font-size:1.1rem}.hero{background:var(--glow);padding-block:clamp(3rem,8vw,6rem) clamp(3rem,7vw,5rem);position:relative}.hero-grid{align-items:center;gap:3rem;display:grid}@media (width>=62rem){.hero-grid{grid-template-columns:.95fr 1.15fr;gap:3rem}}.hero h1{letter-spacing:-.035em;font-size:clamp(2.3rem,6vw,3.6rem);font-weight:800}.hero h1 .accent{color:var(--accent-ink)}.hero .lead{max-width:34rem;font-size:clamp(1.05rem,2vw,1.2rem)}.hero-meta{flex-wrap:wrap;gap:.5rem;margin:0 0 1.25rem;padding:0;list-style:none;display:flex}.hero-meta li{color:var(--ink-2);border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:.25rem .65rem;font-size:.8rem;font-weight:600}.actions{flex-wrap:wrap;gap:.75rem;margin-top:2rem;display:flex}.btn{border:1px solid #0000;border-radius:.75rem;align-items:center;gap:.5rem;min-height:2.9rem;padding:0 1.3rem;font-weight:650;text-decoration:none;transition:transform .15s,background-color .15s,border-color .15s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--accent);color:var(--btn-ink);box-shadow:0 8px 24px -10px #2f9e748c}.btn-primary:hover{background:color-mix(in srgb, var(--accent) 88%, var(--ink))}.btn-secondary{background:var(--surface);color:var(--ink);border-color:var(--border)}.btn-secondary:hover{border-color:var(--muted)}.install{font-family:var(--xj-font-mono);color:var(--ink-2);align-items:center;gap:.6rem;margin-top:1.5rem;font-size:.9rem;display:inline-flex}.install code{background:var(--surface);border:1px solid var(--border);border-radius:.5rem;padding:.35rem .65rem}.install .prompt{color:var(--muted);user-select:none}.hero-art{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:1.5rem;padding:clamp(1rem,3vw,1.75rem)}.steps{gap:1.25rem;margin:0;padding:0;list-style:none;display:grid}@media (width>=62rem){.steps{grid-template-columns:repeat(3,minmax(0,1fr))}}.step{background:var(--surface);border:1px solid var(--border);min-width:0;box-shadow:var(--shadow);border-radius:1.25rem;flex-direction:column;padding:1.5rem;display:flex}.step-num{background:linear-gradient(135deg, var(--xj-accent-400), var(--xj-accent-700));color:#fff;border-radius:.7rem;place-items:center;width:2.25rem;height:2.25rem;margin-bottom:1rem;font-weight:750;display:inline-grid}.step p{color:var(--ink-2);margin:.5rem 0 1rem;font-size:.95rem}.step-more{margin-top:auto;padding-top:1rem;font-size:.9rem;font-weight:600}.code{border:1px solid var(--border);background:var(--code-bg);border-radius:.8rem;margin:0;overflow:hidden}.code pre{font-family:var(--xj-font-mono);white-space:pre-wrap;overflow-wrap:anywhere;margin:0;padding:.9rem 1rem;font-size:.78rem;line-height:1.65;overflow-x:auto;background:0 0!important}.code+.code{margin-top:.75rem}:root{--code-bg:#0d1424}:root[data-theme=light]{--code-bg:#fff}.astro-code,.astro-code span{color:var(--shiki-dark)}:root[data-theme=light] .astro-code,:root[data-theme=light] .astro-code span{color:var(--shiki-light)}.tabs{margin-bottom:.75rem}.tablist{flex-wrap:wrap;gap:.25rem;margin-bottom:.6rem;display:flex}.tablist button{font:inherit;border:1px solid var(--border);color:var(--muted);cursor:pointer;background:0 0;border-radius:.5rem;min-height:2rem;padding:.3rem .6rem;font-size:.78rem;font-weight:600}.tablist button[aria-selected=true]{background:var(--accent-soft);border-color:color-mix(in srgb, var(--accent) 45%, transparent);color:var(--accent-ink)}.tabpanel[hidden]{display:none}.tab-note{color:var(--muted);margin:.5rem 0 0;font-size:.82rem}.features{grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:1rem;display:grid}.feature{background:var(--surface);border:1px solid var(--border);border-radius:1.1rem;padding:1.4rem}.feature svg{width:2.75rem;height:2.75rem;margin-bottom:1rem}.feature p{color:var(--ink-2);margin:.45rem 0 0;font-size:.93rem}.feature a{font-weight:600;text-decoration:none}.feature a:hover{text-decoration:underline}.feature :not(pre)>code,.step :not(pre)>code,.lead code,.status code,.tab-note code{font-family:var(--xj-font-mono);background:var(--surface-2);border:1px solid var(--border);border-radius:.35em;padding:.1em .35em;font-size:.85em}.ic-bg-a{stop-color:var(--xj-accent-400)}.ic-bg-b{stop-color:var(--xj-accent-700)}.ic{fill:none;stroke:#fff;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round}.ic-fill{fill:#fff}.ic-soft{fill:#ffffffb3}.browser{border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow);border-radius:1rem;overflow:hidden}.browser-bar{border-bottom:1px solid var(--border);background:var(--surface-2);align-items:center;gap:.75rem;padding:.65rem .9rem;display:flex}.dots{gap:.4rem;display:flex}.dots span{background:var(--border);border-radius:50%;width:.7rem;height:.7rem}.address{min-width:0;font-family:var(--xj-font-mono);color:var(--muted);background:var(--surface);border:1px solid var(--border);white-space:nowrap;text-overflow:ellipsis;border-radius:.5rem;flex:1;padding:.25rem .6rem;font-size:.78rem;overflow:hidden}.shots,.shots figure{margin:0}.shots figure[hidden]{display:none}.shots img{width:100%;height:auto}.shots .shot-dark,:root[data-theme=dark] .shots .shot-light{display:none}:root[data-theme=dark] .shots .shot-dark{display:block}.shot-tabs{flex-wrap:wrap;gap:.4rem;margin-bottom:1rem;display:flex}.shot-tabs button{font:inherit;border:1px solid var(--border);background:var(--surface);min-height:2.5rem;color:var(--ink-2);cursor:pointer;border-radius:.65rem;padding:.45rem .85rem;font-size:.88rem;font-weight:600}.shot-tabs button[aria-selected=true]{background:var(--accent-soft);border-color:color-mix(in srgb, var(--accent) 45%, transparent);color:var(--accent-ink)}.shot-caption{color:var(--muted);margin:.9rem 0 0;font-size:.92rem}.split{gap:1.25rem;display:grid}@media (width>=56rem){.split{grid-template-columns:1fr 1fr}}.panel{background:var(--surface);border:1px solid var(--border);border-radius:1.25rem;padding:clamp(1.5rem,3vw,2.25rem)}.metric{letter-spacing:-.03em;color:var(--accent-ink);margin:.75rem 0 .25rem;font-size:clamp(2.2rem,5vw,3rem);font-weight:800;line-height:1.1}.metric small{color:var(--ink-2);letter-spacing:0;margin-top:.35rem;font-size:.42em;font-weight:650;display:block}.panel p{color:var(--ink-2);margin:.75rem 0 0}.panel ul{color:var(--ink-2);margin:.75rem 0 0;padding-left:1.2rem}.panel li+li{margin-top:.35rem}.panel .link{margin-top:1.25rem;font-weight:650;text-decoration:none;display:inline-block}.panel .link:hover{text-decoration:underline}.site-footer{border-top:1px solid var(--border);padding-block:2.5rem}.footer-inner{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1.5rem 3rem;display:flex}.footer-brand .logo{width:auto;height:1.6rem}.footer-brand p{color:var(--muted);margin:.6rem 0 0;font-size:.9rem}.footer-nav{flex-wrap:wrap;gap:.25rem 1.25rem;display:flex}.footer-nav a{color:var(--ink-2);padding-block:.35rem;font-size:.92rem;text-decoration:none}.footer-nav a:hover{color:var(--ink);text-decoration:underline}