.ex-main{background:var(--bg-page);width:100%;color:var(--text-primary);font-family:var(--font-body)}.ex-band{box-sizing:border-box;border-bottom:1px solid var(--border);width:100%;padding:clamp(56px,8vh,104px) clamp(20px,4vw,48px);position:relative}.ex-band--alt{background:color-mix(in oklab, var(--bg-elevated) 38%, var(--bg-page) 62%)}.ex-band__inner{max-width:1200px;margin:0 auto;position:relative}.ex-hero{isolation:isolate;position:relative;overflow:hidden}.ex-hero:after{content:"";z-index:-1;background-image:linear-gradient(to right, color-mix(in oklab, var(--border) 55%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in oklab, var(--border) 55%, transparent) 1px, transparent 1px);opacity:.4;background-size:56px 56px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(60% 55% at 22% 30%,#000 25%,#0000 78%);mask-image:radial-gradient(60% 55% at 22% 30%,#000 25%,#0000 78%)}.ex-hero__path{font-family:var(--font-mono,ui-monospace, monospace);letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);border:1px solid var(--border);background:color-mix(in oklab, var(--bg-elevated) 55%, transparent);align-items:center;gap:10px;padding:6px 10px;font-size:12px;animation:.6s ease-out both exFade;display:inline-flex}.ex-hero__path:before{content:"❯";color:var(--accent)}.ex-hero__path b{color:var(--text-primary);font-weight:600}.ex-hero__h1{font-family:var(--font-display);letter-spacing:-.022em;max-width:22ch;margin:22px 0 18px;font-size:clamp(34px,5vw,56px);font-weight:500;line-height:1.05;animation:.7s ease-out 80ms both exFade}.ex-hero__h1 em{color:var(--accent);font-style:normal}.ex-hero__lede{color:var(--text-muted);max-width:60ch;font-size:clamp(15px,1.1vw,18px);line-height:1.55;animation:.7s ease-out .16s both exFade}.ex-hero__lede strong{color:var(--text-primary);font-weight:500}.ex-hero__ctas{flex-wrap:wrap;gap:12px;margin-top:28px;animation:.7s ease-out .24s both exFade;display:flex}.ex-cta{letter-spacing:.01em;border-radius:var(--radius);transition:background var(--motion-ms) ease-out, border-color var(--motion-ms) ease-out, color var(--motion-ms) ease-out;white-space:nowrap;border:1px solid #0000;align-items:center;gap:10px;padding:13px 22px;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}.ex-cta--primary{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}.ex-cta--primary:hover{background:color-mix(in oklab, var(--accent) 86%, white)}.ex-cta--ghost{color:var(--text-primary);border-color:var(--border);background:0 0}.ex-cta--ghost:hover{border-color:var(--text-muted)}.ex-cta:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.ex-hero__stats{border-top:1px solid var(--border);flex-wrap:wrap;gap:20px 36px;margin-top:36px;padding-top:22px;animation:.7s ease-out .32s both exFade;display:flex}.ex-hero__stat{flex-direction:column;gap:4px;min-width:140px;display:flex}.ex-hero__stat-k{font-family:var(--font-mono,ui-monospace, monospace);letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);font-size:10px}.ex-hero__stat-v{color:var(--text-primary);font-size:14px;font-weight:500}.ex-tagstrip{border-bottom:1px solid var(--border);background:var(--bg-page);flex-wrap:wrap;align-items:center;gap:10px;padding:22px clamp(20px,4vw,48px);display:flex}.ex-tagstrip__label{font-family:var(--font-mono,ui-monospace, monospace);letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);margin-right:6px;font-size:11px}.ex-tag{font-family:var(--font-mono,ui-monospace, monospace);letter-spacing:.04em;color:var(--text-primary);border:1px solid var(--border);background:color-mix(in oklab, var(--bg-elevated) 38%, transparent);transition:border-color var(--motion-ms) ease-out, color var(--motion-ms) ease-out;border-radius:20px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;display:inline-flex}.ex-tag:before{content:"";background:var(--accent);width:6px;height:6px;box-shadow:0 0 6px color-mix(in oklab, var(--accent) 55%, transparent);border-radius:999px}.ex-h2{font-family:var(--font-display);letter-spacing:-.012em;margin:0 0 8px;font-size:clamp(24px,2.4vw,32px);font-weight:500}.ex-eyebrow{font-family:var(--font-mono,ui-monospace, monospace);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);align-items:center;gap:8px;font-size:11px;display:inline-flex}.ex-eyebrow:before{content:"❯";color:var(--accent)}.ex-lede{color:var(--text-muted);max-width:64ch;margin:6px 0 32px;font-size:15px;line-height:1.6}.ex-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.ex-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;animation:.7s ease-out both exFade;display:flex;overflow:hidden}.ex-card--feat{border-color:var(--accent)}.ex-card__bar{border-bottom:1px solid color-mix(in oklab, var(--border) 70%, var(--text-muted) 30%);background:color-mix(in oklab, var(--bg-elevated) 75%, var(--bg-page) 25%);font-family:var(--font-mono,ui-monospace, monospace);color:var(--text-muted);align-items:center;gap:12px;padding:10px 14px;font-size:12px;display:flex}.ex-card__bar em{color:var(--text-primary);font-style:normal}.ex-card__chip{letter-spacing:.18em;text-transform:uppercase;color:var(--accent);align-items:center;gap:6px;margin-left:auto;font-size:10px;display:inline-flex}.ex-card__chip:before{content:"";background:var(--accent);border-radius:999px;width:7px;height:7px}.ex-card__code{font-family:var(--font-mono,ui-monospace, monospace);color:var(--text-primary);white-space:pre;flex:1;margin:0;padding:14px 16px;font-size:12.5px;line-height:1.7;overflow-x:auto}.ex-card__code .k{color:color-mix(in oklab, var(--accent) 55%, var(--text-primary) 45%)}.ex-card__code .s{color:var(--accent-alt)}.ex-card__code .c{color:color-mix(in oklab, var(--text-muted) 75%, transparent);font-style:italic}.ex-card__code .n{color:color-mix(in oklab, var(--accent-alt) 70%, var(--text-primary) 30%)}.ex-card__code .p{color:var(--text-muted)}.ex-card__foot{border-top:1px solid color-mix(in oklab, var(--border) 70%, var(--text-muted) 30%);background:color-mix(in oklab, var(--bg-elevated) 78%, var(--bg-page) 22%);padding:14px 16px}.ex-card__title{font-family:var(--font-display);letter-spacing:-.012em;margin:0 0 4px;font-size:18px;font-weight:500}.ex-card__body{color:var(--text-muted);margin:0;font-size:13.5px;line-height:1.55}.ex-feature{grid-template-columns:1.05fr 1fr;align-items:center;gap:clamp(28px,4vw,64px);display:grid}.ex-feature__title{font-family:var(--font-display);letter-spacing:-.018em;margin:12px 0 14px;font-size:clamp(26px,2.6vw,36px);font-weight:500;line-height:1.15}.ex-feature__title em{color:var(--accent);font-style:normal}.ex-feature__body{color:var(--text-muted);max-width:56ch;margin:0 0 18px;font-size:15px;line-height:1.65}.ex-feature__body strong{color:var(--text-primary);font-weight:500}.ex-feature__list{gap:10px;margin:0 0 22px;padding:0;list-style:none;display:grid}.ex-feature__list li{color:var(--text-primary);align-items:flex-start;gap:12px;font-size:14.5px;line-height:1.5;display:flex}.ex-feature__list li:before{content:"✓";color:var(--accent);font-family:var(--font-mono,ui-monospace, monospace);flex-shrink:0;margin-top:2px;font-size:14px}.ex-term{background:var(--bg-elevated);border:1px solid var(--border);font-family:var(--font-mono,ui-monospace, monospace);overflow:hidden}.ex-term__bar{border-bottom:1px solid color-mix(in oklab, var(--border) 70%, var(--text-muted) 30%);background:color-mix(in oklab, var(--bg-elevated) 78%, var(--bg-page) 22%);color:var(--text-muted);letter-spacing:.16em;text-transform:uppercase;gap:10px;padding:10px 14px;font-size:11px;display:flex}.ex-term__bar b{color:var(--text-primary);letter-spacing:.16em;font-weight:600}.ex-term__body{color:var(--text-primary);white-space:pre;margin:0;padding:16px 18px;font-size:13px;line-height:1.8;overflow-x:auto}.ex-term__body .ok{color:var(--accent)}.ex-term__body .dim{color:var(--text-muted)}.ex-term__body .num{color:var(--accent-alt)}.ex-runtimes{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;display:grid}.ex-runtime{border:1px solid var(--border);background:color-mix(in oklab, var(--bg-elevated) 25%, var(--bg-page) 75%);transition:border-color var(--motion-ms) ease-out;flex-direction:column;gap:10px;padding:18px 18px 16px;display:flex}.ex-runtime:hover{border-color:var(--accent)}.ex-runtime__row{align-items:center;gap:10px;display:flex}.ex-runtime__code{font-family:var(--font-mono,ui-monospace, monospace);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);border:1px solid color-mix(in oklab, var(--accent) 45%, var(--border) 55%);padding:3px 8px;font-size:11px}.ex-runtime__name{color:var(--text-primary);font-size:15px;font-weight:500}.ex-runtime__cmd{font-family:var(--font-mono,ui-monospace, monospace);color:var(--text-muted);background:var(--bg-page);border:1px solid var(--border);padding:8px 10px;font-size:12.5px}.ex-runtime__cmd:before{content:"$ ";color:var(--accent)}.ex-steps{border:1px solid var(--border);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;display:grid}.ex-step{border-right:1px solid var(--border);background:var(--bg-page);flex-direction:column;gap:10px;padding:26px 22px 24px;display:flex}.ex-step:last-child{border-right:none}.ex-step__n{font-family:var(--font-mono,ui-monospace, monospace);letter-spacing:.2em;color:var(--accent);font-size:11px}.ex-step__title{font-family:var(--font-display);letter-spacing:-.01em;margin:0;font-size:17px;font-weight:500}.ex-step__body{color:var(--text-muted);margin:0;font-size:13.5px;line-height:1.6}.ex-cta-band{border:1px solid var(--border);background:color-mix(in oklab, var(--bg-elevated) 55%, var(--bg-page) 45%);grid-template-columns:1.5fr auto;align-items:center;gap:28px;padding:clamp(28px,4vw,48px);display:grid}.ex-cta-band__title{font-family:var(--font-display);letter-spacing:-.014em;margin:0 0 6px;font-size:clamp(22px,2.2vw,30px);font-weight:500}.ex-cta-band__body{color:var(--text-muted);max-width:60ch;margin:0;font-size:14.5px}.ex-cta-band__actions{flex-wrap:wrap;gap:10px;display:flex}@keyframes exFade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.ex-main *,.ex-card{animation:none!important}}@media (max-width:880px){.ex-grid,.ex-feature,.ex-cta-band{grid-template-columns:1fr}.ex-step{border-right:none;border-bottom:1px solid var(--border)}.ex-step:last-child{border-bottom:none}}