:root{--ink: #161513;--ink-2: #3a3731;--ink-3: #6b665c;--ink-4: #a8a298;--paper: #f5f2ec;--paper-2: #ece8df;--paper-3: #dfdbd1;--line: #1615131a;--line-strong: #16151333;--accent: oklch(.62 .16 35);--accent-soft: oklch(.62 .16 35 / .12);--font-display: "Fraunces", "Times New Roman", serif;--font-body: "Inter", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace}[data-accent=signal]{--accent: oklch(.72 .18 145);--accent-soft: oklch(.72 .18 145 / .15)}[data-accent=cobalt]{--accent: oklch(.52 .18 255);--accent-soft: oklch(.52 .18 255 / .12)}[data-accent=ember]{--accent: oklch(.62 .16 35);--accent-soft: oklch(.62 .16 35 / .12)}[data-variant=terminal]{--ink: #e7e3d9;--ink-2: #bcb6a6;--ink-3: #8a8579;--ink-4: #55524a;--paper: #0f0f0e;--paper-2: #161614;--paper-3: #1f1e1c;--line: #ffffff1a;--line-strong: #ffffff33;--accent: oklch(.78 .18 140);--accent-soft: oklch(.78 .18 140 / .15);--font-display: "JetBrains Mono", ui-monospace, monospace}[data-variant=brutalist]{--ink: #0a0a0a;--ink-2: #1f1f1f;--ink-3: #555;--ink-4: #999;--paper: #f0ead6;--paper-2: #e6dfc7;--paper-3: #d7cfae;--line: #0a0a0a;--line-strong: #0a0a0a;--accent: oklch(.58 .22 28);--accent-soft: oklch(.58 .22 28 / .15);--font-display: "Inter", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;padding-bottom:64px}a{color:inherit;text-decoration:none}.page{max-width:1100px;margin:0 auto;padding:0 56px}@media(max-width:900px){.page{padding:0 24px}}.mono{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}.display{font-family:var(--font-display);font-weight:400;letter-spacing:-.02em;line-height:1.02}[data-variant=terminal] .display{font-weight:500;letter-spacing:-.04em}[data-variant=brutalist] .display{font-weight:800;letter-spacing:-.035em;text-transform:uppercase}.accent-link{color:var(--accent);font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.accent-link:hover{text-decoration:underline;text-underline-offset:3px}.chip{padding:4px 10px;font-family:var(--font-mono);font-size:11px;background:var(--paper-2);color:var(--ink-2);border-radius:4px}.nav{position:sticky;top:0;z-index:20;background:color-mix(in oklab,var(--paper),transparent 10%);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.nav-inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:16px 0;gap:24px}.nav-brand a{display:flex;align-items:center;gap:10px;color:inherit;font-weight:500}.nav-brand .dot{width:8px;height:8px;background:var(--accent);border-radius:0;flex-shrink:0}.nav-links{display:flex;gap:2px;font-family:var(--font-mono);font-size:12px;letter-spacing:.04em}.nav-links a{padding:6px 12px;color:var(--ink-2);border-radius:999px}.nav-links a:hover,.nav-links a.active{background:var(--paper-2);color:var(--ink)}.nav-cta{justify-self:end;display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;padding:8px 14px;border:1px solid var(--line-strong);border-radius:999px;background:var(--paper);transition:all .15s ease}.nav-cta:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}@media(max-width:800px){.nav-links{display:none}}.listing-hero{padding:72px 0 56px;border-bottom:1px solid var(--line)}.section-head{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}.section-idx{grid-column:span 2;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}.section-idx .n{color:var(--accent)}.section-title{grid-column:3 / span 7;font-family:var(--font-display);font-size:clamp(36px,5vw,68px);font-weight:400;letter-spacing:-.025em;line-height:1.02;margin:0}.section-aside{grid-column:10 / span 3;font-family:var(--font-mono);font-size:11px;color:var(--ink-3);text-transform:uppercase;padding-top:8px}@media(max-width:900px){.section-idx,.section-title,.section-aside{grid-column:span 12}}.listing-body{padding:0 0 40px}.empty{color:var(--ink-3);font-family:var(--font-mono);font-size:13px;padding:48px 0}.post-row{display:grid;grid-template-columns:200px 1fr auto;gap:32px;align-items:center;padding:32px 0;border-bottom:1px solid var(--line);transition:padding-left .2s ease}.post-row:first-of-type{border-top:1px solid var(--line)}.post-row:hover{padding-left:8px}.post-row:hover .post-row-arrow{opacity:1;transform:translate(0);color:var(--accent)}.post-row-img{aspect-ratio:16/10;overflow:hidden;border:1px solid var(--line);flex-shrink:0}.post-row-img img{width:100%;height:100%;object-fit:cover;display:block}.post-row-body{display:flex;flex-direction:column;gap:10px}.post-row-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.post-row-body h2{font-family:var(--font-display);font-size:clamp(22px,2.5vw,32px);font-weight:400;letter-spacing:-.02em;margin:0;line-height:1.1}.post-row-body p{margin:0;color:var(--ink-2);font-size:15px;line-height:1.55;max-width:60ch}.post-row-arrow{font-family:var(--font-mono);font-size:18px;color:var(--ink-3);opacity:0;transform:translate(-6px);transition:all .2s ease}@media(max-width:800px){.post-row{grid-template-columns:1fr;gap:16px}.post-row-img{max-width:240px}.post-row-arrow{display:none}}.footer{padding:32px 0 24px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;font-family:var(--font-mono);font-size:11px;color:var(--ink-3);letter-spacing:.06em}.footer .sig{text-align:right;display:flex;gap:16px;justify-content:flex-end}.footer a:hover{color:var(--ink)}.status{position:fixed;left:0;right:0;bottom:0;z-index:15;background:var(--ink);color:var(--paper);font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;padding:6px 16px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line-strong);pointer-events:none}.status .left,.status .right{display:flex;gap:16px;align-items:center}.status .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 2s infinite}@keyframes pulse{50%{opacity:.3}}@media(max-width:700px){.status .hide-sm{display:none}}@media(prefers-reduced-motion:reduce){*,:before,:after{animation:none!important;transition:none!important}}
