:root,:root[data-theme=dark]{--bg:#0d1117;--surface:#161b22;--border:#21262d;--text:#e6edf3;--muted:#8b949e;--accent:#58a6ff;--title:#fc51e1}:root[data-theme=light]{--bg:#fff;--surface:#f6f8fa;--border:#d0d7de;--text:#1f2328;--muted:#57606a;--accent:#0969da;--title:#fc51e1}*,:before,:after{box-sizing:border-box}*{margin:0}html{-webkit-text-size-adjust:100%}body{min-height:100svh;line-height:1.6}img,svg{max-width:100%;display:block}a{color:inherit}.site-header{border-bottom:1px solid var(--border);background:var(--bg);z-index:10;position:sticky;top:0}.nav{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;width:min(100% - 2rem,72rem);margin-inline:auto;padding:.9rem 0}.nav .brand{flex-shrink:0;font-weight:700;text-decoration:none}.nav ul{flex-wrap:wrap;gap:.75rem;margin:0;padding:0;list-style:none;display:flex}.nav a{color:var(--text);text-decoration:none}.nav a[aria-current=page]{color:var(--accent);text-underline-offset:4px;text-decoration:underline}.site-footer{width:min(100% - 2rem,72rem);color:var(--muted);border-top:1px solid var(--border);margin-inline:auto;flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-top:3rem;padding:2rem 0;display:flex}.nav-actions{flex-wrap:wrap;justify-content:space-around;align-items:center;gap:.75rem;min-width:0;display:flex}.theme-toggle{background:var(--surface);color:var(--text);border:1px solid var(--border);cursor:pointer;white-space:nowrap;border-radius:999px;flex-shrink:0;padding:.3rem .7rem;font-size:.9rem;line-height:1.4}@media (width<=30rem){.nav{font-size:.95rem}.nav-actions{gap:.5rem}#theme-toggle-label{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.theme-toggle{padding:.3rem .55rem}}.grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr));gap:1.25rem;margin-block:1.5rem;display:grid}.card{background:var(--surface);border:1px solid var(--border);border-radius:.75rem;transition:border-color .15s;overflow:hidden}.card:hover{border-color:var(--accent)}.card .card-link{color:inherit;height:100%;padding:1.25rem;text-decoration:none;display:block}.card h2{margin-bottom:.5rem;font-size:1.15rem}.card p{color:var(--muted);font-size:.95rem}.card .card-meta{color:var(--muted);margin-top:.75rem;font-size:.85rem}.prose{max-width:65rem;margin:auto}.prose h1,.prose h2,.prose h3{margin:1.5em 0 .5em;line-height:1.25}.prose p,.prose ul,.prose ol{margin-block:1em}.prose a{color:var(--accent)}.prose pre{border-radius:.75rem;padding:1rem;overflow-x:auto}.tags{flex-wrap:wrap;gap:.5rem;margin-block:1rem;padding:0;list-style:none;display:flex}.tags a{border:1px solid var(--border);border-radius:999px;padding:.2rem .7rem;font-size:.85rem;text-decoration:none}.hero-grid{align-items:center;gap:2rem;padding-block:2rem 1rem;display:grid}@media (width>=48rem){.hero-grid{grid-template-columns:1fr minmax(0,20rem)}}.hero-text h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1}.hero-text p{color:var(--muted);max-width:60ch;margin-top:.75rem}.hero-photo{justify-self:center;width:min(100%,20rem);margin:0}.hero-photo img{aspect-ratio:3/4;object-fit:cover;border:1px solid var(--border);background:var(--surface);border-radius:1rem;width:100%;height:auto}.share{border-top:1px solid var(--border);margin-block:2rem 1rem;padding-top:1.5rem}.share .share-title{margin-bottom:.75rem;font-weight:600}.share ul{flex-wrap:wrap;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.share a,.share .share-copy{border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:999px;padding:.35rem .85rem;font-family:inherit;font-size:.85rem;line-height:1.4;text-decoration:none;display:inline-block}.share a:hover,.share .share-copy:hover{border-color:var(--accent)}:root{--max-width:72rem;--gap:1.25rem;color-scheme:dark}:root[data-theme=light]{color-scheme:light}html{color-scheme:light dark}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.container{width:min(100% - 2rem, var(--max-width,72rem));margin-inline:auto;padding-block:2rem}.hero{padding-block:2rem 1rem}.hero h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1}.hero p{color:var(--muted);max-width:60ch;margin-top:.75rem}.good{border:1px solid var(--accent);border-radius:8px;max-width:100%;height:auto;margin:0 auto;display:block}blockquote p{background:var(--surface);border:1px dashed var(--border);padding:1rem}
