:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:var(--lightningcss-light,#fff)var(--lightningcss-dark,#1b1b1f);--bg-soft:var(--lightningcss-light,#f6f6f7)var(--lightningcss-dark,#202127);--bg-code:var(--lightningcss-light,#f6f6f7)var(--lightningcss-dark,#161618);--ink:var(--lightningcss-light,#3c3c43)var(--lightningcss-dark,#dfdfd6);--ink-strong:var(--lightningcss-light,#18181b)var(--lightningcss-dark,#fffff5);--ink-muted:var(--lightningcss-light,#67676c)var(--lightningcss-dark,#98989f);--line:var(--lightningcss-light,#e2e2e3)var(--lightningcss-dark,#2e2e32);--brand:var(--lightningcss-light,#0f766e)var(--lightningcss-dark,#2dd4bf);--brand-strong:var(--lightningcss-light,#115e59)var(--lightningcss-dark,#5eead4);--brand-soft:var(--lightningcss-light,#ccfbf1)var(--lightningcss-dark,#134e4a);--grad-a:#0f766e;--grad-b:#6d28d9;--radius:12px;--content:1152px;color:var(--ink);background:var(--bg);--slc-accent:var(--brand);font:16px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box}body{background:var(--bg);min-width:300px;margin:0}a{color:var(--brand);text-underline-offset:3px}code,pre,textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}:not(pre)>code{background:var(--bg-soft);color:var(--ink-strong);border-radius:4px;padding:.12em .36em;font-size:.88em}.skip-link{z-index:20;background:var(--bg);border-radius:8px;padding:10px 14px;position:fixed;top:-80px;left:12px}.skip-link:focus{top:12px}.topbar{z-index:10;padding:10px max(16px, calc((100% - var(--content)) / 2));border-bottom:1px solid var(--line);background:color-mix(in srgb, var(--bg) 88%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 24px;display:flex;position:sticky;top:0}.brand{min-height:44px;color:var(--ink-strong);align-items:center;gap:8px;font-size:1.05rem;font-weight:700;text-decoration:none;display:inline-flex}.brand-mark{color:var(--brand);font-size:1.3rem}.topbar nav{flex-wrap:wrap;gap:4px 18px;display:flex}.topbar nav a{min-height:44px;color:var(--ink);align-items:center;font-size:.92rem;font-weight:500;text-decoration:none;display:inline-flex}.topbar nav a:hover{color:var(--brand)}main,footer{width:min(var(--content), calc(100% - 32px));margin-inline:auto}section{padding:56px 0 8px;scroll-margin-top:80px}h2{border-top:1px solid var(--line);color:var(--ink-strong);letter-spacing:-.02em;margin:0 0 12px;padding-top:24px;font-size:clamp(1.6rem,3vw,2rem)}h3{color:var(--ink-strong)}.section-lede{max-width:760px;margin:0 0 24px;font-size:1.05rem}.hero{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:40px;padding:clamp(40px,8vw,96px) 0 24px;display:grid}.hero h1{letter-spacing:-.035em;margin:0;font-size:clamp(2.4rem,6vw,3.8rem);line-height:1.08}.gradient{background:linear-gradient(120deg, var(--grad-a) 20%, var(--grad-b));color:#0000;-webkit-background-clip:text;background-clip:text}@media (prefers-color-scheme:dark){:root{--grad-a:#2dd4bf;--grad-b:#a78bfa}}.tagline{color:var(--ink-strong);letter-spacing:-.02em;margin:10px 0 0;font-size:clamp(1.4rem,3vw,2rem);font-weight:600;line-height:1.25}.lede{max-width:560px;color:var(--ink-muted);margin:16px 0 0;font-size:1.1rem}.actions{flex-wrap:wrap;gap:12px;margin-top:28px;display:flex}.button{border:1px solid var(--line);background:var(--bg-soft);min-height:44px;color:var(--ink-strong);border-radius:999px;align-items:center;padding:0 20px;font-weight:600;text-decoration:none;display:inline-flex}.button.primary{border-color:var(--brand);background:var(--brand);color:var(--lightningcss-light,#fff)var(--lightningcss-dark,#042f2e)}.button:hover{border-color:var(--brand)}.hero-visual{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-soft);min-width:0;margin:0;padding:12px}.hero-visual figcaption{color:var(--ink-muted);margin-top:6px;font-size:.85rem}.feature-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;display:grid}.feature-grid article{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-soft);padding:20px 22px}.feature-grid h3{margin:0 0 8px;font-size:1.05rem}.feature-grid p{color:var(--ink-muted);margin:0;font-size:.95rem}.steps{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px;display:grid}.steps h3{margin:0 0 8px;font-size:1rem}.code{border:1px solid var(--line);background:var(--bg-code);color:var(--ink-strong);white-space:pre;border-radius:8px;margin:0;padding:14px 16px;font-size:.85rem;line-height:1.55;overflow:auto}.clone{margin-top:16px}.clone summary{cursor:pointer;align-items:center;min-height:44px;font-weight:600;display:flex}.lesson{margin:40px 0}.lesson h3{align-items:center;gap:10px;margin:0 0 8px;font-size:1.3rem;display:flex}.step{background:var(--brand-soft);width:32px;height:32px;color:var(--brand-strong);border-radius:50%;place-items:center;font-size:.95rem;font-weight:700;display:inline-grid}.lesson>p{max-width:760px}.example{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:16px;margin:16px 0 0;display:grid}.example-code{gap:8px;min-width:0;display:grid}.example-code .code{max-height:520px}.example-toolbar{gap:8px;display:flex}.example-toolbar button{border:1px solid var(--line);background:var(--bg-soft);min-height:36px;color:var(--ink-strong);font:inherit;cursor:pointer;border-radius:999px;padding:0 14px;font-size:.88rem;font-weight:600}.example-toolbar button[data-action=run]{border-color:var(--brand);background:var(--brand);color:var(--lightningcss-light,#fff)var(--lightningcss-dark,#042f2e)}.example-editor{border:1px solid var(--brand);background:var(--bg-code);width:100%;min-height:160px;color:var(--ink-strong);tab-size:2;resize:vertical;border-radius:8px;padding:14px 16px;font-size:.85rem;line-height:1.55}.example-output{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);gap:12px;min-width:0;padding:12px;display:grid}.example-output .row{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;display:grid}.example-output [hidden]{display:none!important}.example.wide{grid-template-columns:minmax(0,1fr)}.example.wide .example-code .code{max-height:360px}.dash-intro{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:start;gap:32px;margin:8px 0 24px;display:grid}.anatomy{margin:0}.anatomy-page{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-soft);gap:8px;padding:12px;font-size:.82rem;font-weight:600;display:grid}.anatomy-page span{border:1px dashed var(--line);background:var(--bg);min-height:44px;color:var(--ink-muted);text-align:center;border-radius:8px;place-items:center;padding:4px 8px;display:grid}.anatomy-tier{gap:8px;display:grid}.anatomy-top{grid-template-columns:repeat(4,minmax(0,1fr))}.anatomy-top span{border-style:solid;border-color:var(--brand);background:var(--brand-soft);color:var(--brand-strong)}.anatomy-middle{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}.anatomy-middle span{min-height:112px}.anatomy-bar{justify-content:space-between;gap:8px;display:flex}.anatomy-bar span{background:0 0;border:0;min-height:32px}.anatomy-foot span{min-height:28px}.anatomy figcaption{color:var(--ink-muted);margin-top:8px;font-size:.9rem}.plan h3,.checklist h3{margin:0 0 8px;font-size:1.15rem}.plan ol,.checklist ul{gap:8px;margin:0;padding-left:22px;display:grid}.blocks{border:1px solid var(--line);border-radius:var(--radius);margin:0 0 8px;overflow-x:auto}.blocks table{border-collapse:collapse;width:100%;font-size:.92rem}.blocks th,.blocks td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:10px 14px}.blocks tbody tr:last-child td{border-bottom:0}.blocks th{background:var(--bg-soft);color:var(--ink-strong)}.blocks td:last-child,.blocks th:last-child{text-align:center}.dash-steps-title{margin:40px 0 8px;font-size:1.3rem}.checklist{border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:var(--radius);background:var(--bg-soft);margin:40px 0 0;padding:18px 22px}.hint{color:var(--ink-muted);margin:0;font-size:.9rem}#dashboard>.hint{margin-top:16px}.forms-demo{border:1px solid var(--line);border-radius:var(--radius);margin-top:16px;padding:12px}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:16px;display:grid}.gallery-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);grid-template-rows:1fr auto;min-width:0;transition:border-color .15s,box-shadow .15s;display:grid;overflow:hidden}.gallery-card:hover{border-color:var(--brand);box-shadow:0 8px 24px color-mix(in srgb, var(--brand) 14%, transparent)}.gallery-specimen{min-width:0;max-height:340px;padding:8px;overflow:hidden}.gallery-meta{border-top:1px solid var(--line);background:var(--bg-soft);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 12px;padding:10px 14px;display:flex}.gallery-card.editing{grid-column:1/-1;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.gallery-card.editing .gallery-specimen{max-height:none}.gallery-card.editing .gallery-editor{grid-area:1/2/span 2}.gallery-editor{border-left:1px solid var(--line);background:var(--bg-soft);align-content:start;gap:8px;min-width:0;padding:12px;display:grid}.gallery-editor[hidden]{display:none}.gallery-editor .example-editor{border-color:var(--line);min-height:280px;max-height:60vh}.gallery-editor .example-editor:focus-visible{border-color:var(--brand);outline:none}.format-switch{border:1px solid var(--line);border-radius:999px;justify-self:start;display:inline-flex;overflow:hidden}.format-switch button{background:var(--bg);min-height:36px;color:var(--ink);font:inherit;cursor:pointer;border:0;padding:0 14px;font-size:.88rem;font-weight:600}.format-switch button+button{border-left:1px solid var(--line)}.format-switch button[aria-pressed=true]{background:var(--brand-soft);color:var(--brand-strong)}.editor-note{color:var(--ink-muted);margin:0;font-size:.85rem}.editor-error{color:var(--ink-strong);white-space:pre-wrap;background:#dc26261a;border-left:3px solid #dc2626;border-radius:6px;margin:0;padding:8px 12px;font-size:.88rem}.editor-error[hidden]{display:none}.gallery-actions{align-items:center;gap:12px;display:flex}.gallery-actions button{border:1px solid var(--line);background:var(--bg);min-height:32px;color:var(--ink-strong);font:inherit;cursor:pointer;border-radius:999px;padding:0 12px;font-size:.85rem;font-weight:600}.gallery-actions button[aria-expanded=true]{border-color:var(--brand)}.gallery-meta h3{margin:0;font-size:.98rem}.gallery-meta a{align-items:center;min-height:44px;font-size:.85rem;font-weight:600;text-decoration:none;display:inline-flex}.apps-title{margin:40px 0 12px;font-size:1.3rem}.apps-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:12px;display:grid}.app-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-soft);color:var(--ink);gap:6px;padding:16px 18px;text-decoration:none;display:grid}.app-card:hover{border-color:var(--brand)}.app-card strong{color:var(--ink-strong)}.app-card span:last-child{color:var(--ink-muted);font-size:.9rem}.badge{background:var(--brand-soft);color:var(--brand-strong);letter-spacing:.05em;text-transform:uppercase;border-radius:999px;justify-self:start;padding:2px 8px;font-size:.72rem;font-weight:700}footer{border-top:1px solid var(--line);color:var(--ink-muted);margin-top:56px;padding:24px 0 40px;font-size:.88rem}@media (width<=640px){.anatomy-top{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{flex-wrap:nowrap;gap:16px}.topbar nav{scrollbar-width:none;flex-wrap:nowrap;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#000 85%,#0000);mask-image:linear-gradient(90deg,#000 85%,#0000)}.topbar nav a{flex:none}}@media (width<=860px){.hero,.dash-intro,.example{grid-template-columns:minmax(0,1fr)}.gallery-card.editing{grid-template-rows:none;grid-template-columns:minmax(0,1fr)}.gallery-card.editing .gallery-editor{border-top:1px solid var(--line);border-left:0;grid-area:auto}}@media (pointer:coarse){.format-switch button,.gallery-actions button,.example-toolbar button{min-height:44px}}
