@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--paper-50:#fffdf8;--paper-100:#faf6ee;--paper-200:#f2ecdd;--paper-300:#e6ddc7;--ink-900:#12130f;--ink-700:#33322c;--ink-500:#55534c;--ink-300:#8b887d;--ink-150:#cdc7b8;--ink-100:#e2ddd0;--cobalt-700:#5b6adf;--cobalt-600:#7f8cf0;--cobalt-500:#a3aefa;--cobalt-100:#eef0fe;--signal-700:#d68f66;--signal-600:#eba784;--signal-500:#f5bfa0;--signal-100:#fcede4;--grid-line:rgba(18,19,15,.09);--grid-line-strong:rgba(18,19,15,.16);--bg-page:var(--paper-100);--bg-page-alt:var(--paper-200);--bg-surface:var(--paper-50);--bg-inverse:var(--ink-900);--text-primary:var(--ink-900);--text-secondary:var(--ink-500);--text-tertiary:var(--ink-300);--text-on-inverse:var(--paper-100);--text-on-accent:var(--ink-900);--border-default:var(--ink-150);--border-strong:var(--ink-900);--border-subtle:var(--grid-line);--accent-primary:var(--cobalt-500);--accent-primary-hover:var(--cobalt-600);--accent-primary-press:var(--cobalt-700);--accent-primary-tint:var(--cobalt-100);--accent-secondary:var(--signal-500);--accent-secondary-hover:var(--signal-600);--accent-secondary-press:var(--signal-700);--accent-secondary-tint:var(--signal-100);--accent-primary-text:#3548c9;--accent-primary-text-hover:#232f96;--accent-secondary-text:#a8531f;--focus-ring:var(--cobalt-500);--status-ok:#7fae93;--status-ok-tint:#eaf4ee}:root{--font-display:"Space Grotesk",ui-sans-serif,system-ui,sans-serif;--font-body:"Inter",ui-sans-serif,system-ui,sans-serif;--font-mono:"JetBrains Mono",ui-monospace,"SF Mono",monospace;--fs-display-1:5.5rem;--fs-display-2:4rem;--fs-h1:2.75rem;--fs-h2:1.75rem;--fs-h3:1.375rem;--fs-h4:1.125rem;--fs-body-lg:1.125rem;--fs-body:1rem;--fs-body-sm:.9375rem;--fs-caption:.8125rem;--fs-micro:.6875rem;--leading-tight:1.02;--leading-snug:1.15;--leading-normal:1.5;--leading-relaxed:1.65;--tracking-tightest:-.04em;--tracking-tight:-.02em;--tracking-normal:0;--tracking-wide:.04em;--tracking-widest:.14em;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700}:root{--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:128px;--space-11:192px;--container-max:1200px;--container-pad:clamp(20px,4vw,64px)}:root{--radius-sm:2px;--radius-md:4px;--radius-lg:8px;--radius-pill:999px;--radius-focus:2px;--shadow-1:0 1px 2px rgba(18,19,15,.06);--shadow-2:0 4px 16px rgba(18,19,15,.08);--shadow-3:0 16px 48px rgba(18,19,15,.14);--shadow-inset-line:inset 0 0 0 1px var(--border-default);--ease-out:cubic-bezier(.16,.8,.32,1);--ease-mech:cubic-bezier(.5,0,.15,1);--ease-in-out:cubic-bezier(.65,0,.35,1);--duration-fast:.12s;--duration-base:.22s;--duration-slow:.42s;--stroke-hair:1px;--stroke-mid:1.5px;--stroke-heavy:2px}*{box-sizing:border-box}html{background:var(--bg-page)}body{margin:0;font-family:var(--font-body);color:var(--text-primary);background:var(--bg-page);font-size:var(--text-body);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased}a{color:var(--accent-primary-text);text-decoration-thickness:1px;text-underline-offset:2px}a:hover{color:var(--accent-primary-text-hover)}::selection{background:var(--cobalt-500);color:var(--paper-50)}:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px;border-radius:var(--radius-focus)}:root{--bg-page: var(--paper-50);--bg-page-alt: var(--paper-100);--accent-site: var(--accent-primary-text);--accent-tailored: var(--accent-secondary-text);--media-mat: #2c261b;--media-mat-strong: #221d14;--gap-line-break: .82em;--gap-line-break: .5lh;--gap-paragraph: 1.65em;--gap-paragraph: 1lh}body{font-size:var(--fs-body);line-height:var(--leading-normal)}.name-mc{color:var(--accent-site)}.lede h1 .name-mc{color:var(--cobalt-700)}.container{width:100%;max-width:1080px;margin:0 auto;padding-inline:var(--container-pad)}.mono{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--text-tertiary)}.prose{max-width:62ch;font-size:var(--fs-body-lg);line-height:var(--leading-relaxed);color:var(--text-secondary)}.prose p{margin:0 0 var(--gap-paragraph)}.prose p:last-child{margin-bottom:0}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.reveal{opacity:0;transform:translateY(10px)}.reveal.is-in{opacity:1;transform:none;transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}@media(prefers-reduced-motion:reduce){.reveal,.reveal.is-in{opacity:1;transform:none;transition:none}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}.site-header{position:sticky;top:0;z-index:20;background:var(--bg-page);border-bottom:1px solid var(--border-default)}.site-header__inner{display:flex;align-items:center;gap:var(--space-4);min-height:56px;padding-block:var(--space-2)}.wordmark{font-family:var(--font-mono);font-size:var(--fs-caption);font-weight:var(--weight-medium);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--text-primary);text-decoration:none;white-space:nowrap}.site-header__spacer{flex:1}.header-link{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-secondary);text-decoration:none;white-space:nowrap}.header-link:hover{color:var(--text-primary)}.preset-chip{display:inline-flex;align-items:center;gap:var(--space-2);padding:4px 4px 4px 10px;border:1px solid var(--accent-tailored);border-radius:var(--radius-pill);background:var(--accent-secondary-tint);font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--accent-tailored);white-space:nowrap}.preset-chip__clear{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:none;border-radius:var(--radius-pill);background:transparent;color:inherit;cursor:pointer;transition:background var(--duration-fast) var(--ease-mech)}.preset-chip__clear:hover{background:var(--accent-secondary);color:var(--ink-900)}.lede{position:relative;padding-block:var(--space-9) var(--space-8);overflow:hidden}.lede:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(to right,var(--grid-line) 1px,transparent 1px),linear-gradient(to bottom,var(--grid-line) 1px,transparent 1px);background-size:32px 32px;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.5),transparent 85%);mask-image:linear-gradient(to bottom,rgba(0,0,0,.5),transparent 85%);pointer-events:none}.lede__inner{position:relative}.lede__kicker{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);margin-bottom:var(--space-4)}.lede__kicker .rule{flex:1;min-width:24px;height:1px;background:var(--border-default)}.lede__kicker .is-tailored{color:var(--accent-tailored)}.lede h1{margin:0 0 var(--space-5);font-family:var(--font-display);font-size:clamp(2.5rem,7vw,var(--fs-display-2));font-weight:var(--weight-medium);line-height:var(--leading-tight);letter-spacing:var(--tracking-tightest);color:var(--text-primary)}.lede .prose{color:var(--text-primary)}.emphasis-tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-6)}.index{padding-block:var(--space-6) var(--space-8)}.index__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);padding-bottom:var(--space-3)}.index__list{border-top:1px solid var(--border-strong)}.index__row{display:grid;grid-template-columns:56px minmax(0,1.1fr) minmax(0,1fr) 24px;align-items:baseline;gap:var(--space-3);width:100%;padding:var(--space-3) var(--space-2);margin:0;border:none;border-bottom:1px solid var(--border-subtle);background:transparent;text-align:left;cursor:pointer;color:inherit;transition:background var(--duration-fast) var(--ease-mech)}.index__row:hover{background:var(--paper-200)}.index__num{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-wide);color:var(--accent-primary-text)}.index__title{font-family:var(--font-body);font-size:var(--fs-body);font-weight:var(--weight-medium);color:var(--text-primary)}.index__context{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-tertiary)}.index__row:hover .index__num,.index__row:focus-visible .index__num{color:var(--accent-tailored)}.index__arrow{font-family:var(--font-mono);font-size:var(--fs-caption);color:var(--accent-tailored);opacity:0;transform:translate(-4px);transition:opacity var(--duration-fast) var(--ease-mech),transform var(--duration-fast) var(--ease-mech)}.index__row:hover .index__arrow,.index__row:focus-visible .index__arrow{opacity:1;transform:none}.examples{padding-bottom:var(--space-9)}.example{display:grid;grid-template-columns:168px minmax(0,1fr);gap:var(--space-7);padding-block:var(--space-8);border-top:1px solid var(--border-default);scroll-margin-top:80px}.example__aside{position:sticky;top:88px;align-self:start;display:flex;flex-direction:column;gap:var(--space-4)}.example__fig{font-family:var(--font-mono);font-size:var(--fs-caption);letter-spacing:var(--tracking-wide);color:var(--accent-primary-text)}.example__taglist{display:flex;flex-direction:column;gap:var(--space-2)}.example__taglist span{font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-tertiary);line-height:1.4}.example__taglist span.is-emphasised{color:var(--accent-tailored)}.example h2{margin:0 0 var(--space-2);font-family:var(--font-display);font-size:clamp(1.5rem,3.2vw,var(--fs-h1));font-weight:var(--weight-medium);line-height:var(--leading-snug);letter-spacing:var(--tracking-tight);color:var(--text-primary)}.example__context{font-family:var(--font-mono);font-size:var(--fs-caption);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-secondary);margin-bottom:var(--space-5)}.example__body{max-width:62ch;font-size:var(--fs-body-lg);line-height:var(--leading-relaxed);color:var(--text-primary);margin:0}.example__body p{margin:0 0 var(--gap-paragraph)}.example__body p:last-child{margin-bottom:0}.example__mobile-tags{display:none;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-5)}.media{margin-top:var(--space-6)}.media__stage{position:relative;aspect-ratio:16 / 9;background:var(--media-mat);overflow:hidden}.media__stage img,.media__stage video{width:100%;height:100%;object-fit:contain;display:block;background:var(--media-mat)}.media__poster{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;padding:0;border:none;background:var(--media-mat);cursor:pointer;color:var(--paper-50)}.media__poster img{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.85;transition:opacity var(--duration-base) var(--ease-mech)}.media__poster:hover img{opacity:1}.media__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:var(--space-2);padding:10px 16px 10px 14px;border:1px solid var(--accent-secondary);background:#221d1499;color:var(--accent-secondary);font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-widest);text-transform:uppercase;transition:background var(--duration-fast) var(--ease-mech)}.media__poster:hover .media__play{background:var(--media-mat-strong)}.media__caption{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);margin-top:var(--space-3)}.media__thumbs{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}.media__thumb{position:relative;width:88px;aspect-ratio:16 / 9;padding:0;border:1px solid var(--border-default);background:var(--media-mat);cursor:pointer;overflow:hidden;transition:border-color var(--duration-fast) var(--ease-mech)}.media__thumb img{width:100%;height:100%;object-fit:cover;display:block}.media__thumb[aria-current=true]{border-color:var(--border-strong);box-shadow:inset 0 0 0 1px var(--border-strong)}.media__thumb-kind{position:absolute;left:4px;bottom:3px;font-family:var(--font-mono);font-size:9px;letter-spacing:var(--tracking-wide);color:var(--paper-100);text-shadow:0 1px 2px rgba(18,19,15,.9)}.site-footer{border-top:1px solid var(--border-strong);padding-block:var(--space-6) var(--space-8)}.site-footer__inner{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:baseline;justify-content:space-between}.site-footer p{margin:0;max-width:52ch;font-size:var(--fs-body-sm);color:var(--text-secondary)}.state{padding-block:var(--space-9);text-align:left}.state h1{font-family:var(--font-display);font-size:var(--fs-h2);font-weight:var(--weight-medium);margin:0 0 var(--space-3)}.preview-bar{position:sticky;top:0;z-index:40;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--container-pad);background:var(--bg-inverse);color:var(--text-on-inverse);font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-wide);text-transform:uppercase}.preview-bar a,.preview-bar button{color:var(--cobalt-500);background:none;border:none;padding:0;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:2px}.tailored-flag{display:inline-block;margin-bottom:var(--space-3);padding:2px 8px;border:1px dashed var(--accent-secondary-text);border-radius:var(--radius-pill);font-family:var(--font-mono);font-size:var(--fs-micro);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--accent-secondary-text)}@media(max-width:860px){.example{grid-template-columns:1fr;gap:var(--space-4)}.example__aside{position:static;flex-direction:row;align-items:center}.example__taglist{display:none}.example__mobile-tags{display:flex}.index__row{grid-template-columns:56px minmax(0,1fr);row-gap:var(--space-1)}.index__num{white-space:nowrap}.index__context{grid-column:2}.index__arrow{display:none}.lede{padding-block:var(--space-7) var(--space-6)}}@media(max-width:620px){.site-header .header-link{display:none}.site-header__inner{gap:var(--space-3)}}.example__links{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-5);margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid var(--border-subtle)}.example__link{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:var(--fs-caption);letter-spacing:var(--tracking-wide);color:var(--accent-site);text-decoration:none;border-bottom:1px solid transparent;transition:border-color var(--duration-fast) var(--ease-mech)}.example__link:hover{color:var(--accent-primary-text-hover);border-bottom-color:currentColor}.media__loop-toggle{position:absolute;right:var(--space-3);bottom:var(--space-3);display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:1px solid var(--accent-secondary);border-radius:var(--radius-pill);background:#221d1499;color:var(--accent-secondary);cursor:pointer;opacity:0;transition:opacity var(--duration-base) var(--ease-mech),background var(--duration-fast) var(--ease-mech)}.media__stage:hover .media__loop-toggle,.media__loop-toggle:focus-visible,.media__loop-toggle.is-paused{opacity:1}.media__loop-toggle:hover{background:var(--media-mat-strong)}@media(hover:none){.media__loop-toggle{opacity:1}}.pline{display:block}.pline:not(:last-child){margin-bottom:var(--gap-line-break)}