.article{padding-block:4rem;max-width:680px}.article--with-sidebar{max-width:min(1000px,92vw);display:grid;grid-template-columns:1fr 240px;grid-template-areas:"header header" "body   sidebar" "tail   sidebar";column-gap:3.5rem;align-items:start}.article--with-sidebar .article-header{grid-area:header}.article--with-sidebar .article-body{grid-area:body}.article--with-sidebar .article-related,.article--with-sidebar .article-links{grid-area:tail}.article-sidebar{grid-area:sidebar}.article-sidebar-inner{position:sticky;top:2rem;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1.25rem 1.25rem 1rem}.article-sidebar-inner h2{font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 .875rem}.article-sidebar-inner ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.6rem}.article-sidebar-inner li{font-size:.875rem;color:#111;line-height:1.5;padding-left:.875rem;position:relative}.article-sidebar-inner li:before{content:"→";position:absolute;left:0;color:var(--ink-muted);font-size:.75rem;top:.15em}.article-sidebar-inner p{font-size:.875rem;color:#111;line-height:1.5;margin:0 0 .5rem}.article-sidebar-inner a{font-size:.8125rem;color:var(--primary-deep);text-decoration:underline;text-underline-offset:2px}@media(max-width:720px){.article--with-sidebar{grid-template-columns:1fr;grid-template-areas:"header" "body" "sidebar" "tail";max-width:680px}.article-sidebar-inner{position:static;background:none;border:none;border-top:1px solid var(--line);border-radius:0;padding:1.5rem 0 0}.article-sidebar-inner h2{margin-bottom:.75rem}}.article-back{display:inline-block;font-size:.875rem;color:var(--ink-muted);text-decoration:none;margin-bottom:1.5rem}.article-back:hover{color:var(--primary-deep)}.article-header{margin-bottom:3rem}.article-header h1{font-family:DM Sans,Spline Sans,sans-serif;font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700;line-height:1.1;margin-block:.5rem .75rem;color:#111;letter-spacing:-.02em}.article-header-meta{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-top:.25rem}.article-header time{font-size:.875rem;color:var(--ink-muted)}.article-tags{display:flex;flex-wrap:wrap;gap:.35rem;list-style:none;padding:0;margin:0}.article-body{font-family:"Source Serif 4",Georgia,serif;font-size:1.125rem;font-weight:380;line-height:1.75;color:#111}.article-body h2{font-family:DM Sans,Spline Sans,sans-serif;font-size:1.375rem;font-weight:600;margin-block:2.5rem .75rem;color:#111;letter-spacing:-.01em}.article-body h3{font-family:DM Sans,Spline Sans,sans-serif;font-size:1.125rem;font-weight:600;margin-block:2rem .5rem;letter-spacing:-.01em}.article-body p{margin-block:0 1rem}.article-body p:has(>.screenshot-frame){margin-bottom:0}.screenshot-frame{display:inline-block;max-width:min(560px,100%);margin-block:.25rem .75rem;border-radius:10px;border:1px solid var(--line);box-shadow:0 4px 16px #00000014,0 1px 3px #0000000f;overflow:hidden;cursor:zoom-in}.screenshot-frame:before{content:"− □ ×";display:flex;align-items:center;justify-content:flex-end;padding:0 10px;height:28px;background:#d6d3ce;border-bottom:1px solid var(--line);font-size:.65rem;font-family:ui-monospace,Cascadia Code,Source Code Pro,Menlo,Consolas,monospace;letter-spacing:.35em;color:#555;user-select:none}.screenshot-frame img{display:block;width:100%;height:auto}.article-body img:not(.screenshot-frame img){max-width:100%;height:auto;border-radius:8px;border:1px solid var(--line);margin-block:.5rem 1.5rem;display:block}.lightbox-overlay{display:none;position:fixed;inset:0;background:#000000d1;align-items:center;justify-content:center;z-index:1000;cursor:zoom-out;padding:1.5rem}.lightbox-overlay.is-open{display:flex}.lightbox-overlay img{max-width:min(1100px,100%);max-height:90vh;width:auto;height:auto;border-radius:8px;box-shadow:0 8px 48px #0006;pointer-events:none}.article-body ul,.article-body ol{padding-left:1.5rem;margin-block:0 1rem}.article-body li+li{margin-top:.25rem}.article-body code{font-size:.9em;background:var(--bg-soft);border:1px solid var(--line);border-radius:4px;padding:.1em .35em}.article-body pre{position:relative;border:1px solid var(--line);border-radius:8px;padding:1.25rem 1.5rem;overflow-x:auto;margin-block:0 1.5rem;font-size:.8rem;line-height:1.65;font-family:JetBrains Mono,ui-monospace,Cascadia Code,Menlo,monospace}.article-body pre code{background:none;border:none;padding:0;font-size:inherit;color:inherit;font-family:inherit}.code-copy-btn{position:absolute;top:.6rem;right:.6rem;padding:.2rem .55rem;font-size:.7rem;font-family:JetBrains Mono,ui-monospace,Cascadia Code,Menlo,monospace;line-height:1.5;color:var(--ink-muted);background:var(--bg-soft);border:1px solid var(--line);border-radius:4px;cursor:pointer;transition:color .15s,background .15s;user-select:none}.code-copy-btn:hover{color:var(--ink);background:var(--card)}.code-copy-btn[data-copied=true]{color:var(--primary-deep);border-color:var(--primary)}.article-body a{color:var(--primary-deep);text-decoration:underline;text-underline-offset:2px}.article-block{border-radius:10px;padding:1.25rem 1.5rem;margin-block:1.75rem}.article-block>:last-child{margin-bottom:0}.article-block--tldr{background:var(--card);border:1.5px solid var(--line);box-shadow:0 2px 8px #0000000d}.article-block--tldr:before{content:"TL;DR";display:block;font-size:.6875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--primary-deep);margin-bottom:.75rem}.article-block--tldr ul{padding-left:1.25rem;margin:0}.article-block--tldr li{color:var(--ink);line-height:1.55}.article-block--quote{border-left:3px solid var(--primary);background:var(--bg-soft);font-style:italic;color:var(--ink-muted);padding-left:1.5rem}.article-block--takeaway{background:color-mix(in srgb,var(--primary) 12%,var(--bg-soft));border:1px solid color-mix(in srgb,var(--primary) 30%,transparent)}.article-block--takeaway:before{content:"Key takeaway";display:block;font-size:.6875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--primary-deep);margin-bottom:.5rem}.article-block--final-note{background:var(--bg-soft);border:1px solid var(--line);border-left:3px solid var(--ink-muted);color:#111;font-size:.9375rem}.article-block--final-note:before{content:"Final note";display:block;font-size:.6875rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:.5rem}.article-what-next,.article-related{margin-top:3rem;padding-top:2rem;border-top:1px solid var(--line)}.article-what-next h2,.article-related h2{font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-muted);margin-bottom:.75rem}.article-what-next p{color:var(--ink);line-height:1.6;margin-bottom:.75rem}.article-what-next ul{padding-left:1.25rem;margin:0 0 .75rem;display:flex;flex-direction:column;gap:.4rem}.article-what-next li{color:var(--ink);line-height:1.6}.article-what-next a{color:var(--primary-deep);font-weight:600;text-decoration:underline;text-underline-offset:2px}.article-related ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem}.article-related a{color:var(--primary-deep);text-decoration:underline;text-underline-offset:2px}.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-block:0 1.5rem;border-radius:8px;border:1px solid var(--line)}.article-body table{width:100%;border-collapse:collapse;font-size:.9375rem;margin:0}.article-body .table-scroll+*{margin-top:0}.article-body th{text-align:left;font-weight:600;padding:.6rem 1rem;background:var(--bg-soft);border-bottom:1px solid var(--line);white-space:nowrap}.article-body td{padding:.55rem 1rem;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.55}.article-body tr:last-child td{border-bottom:none}.article-links{margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:baseline;gap:.35rem .5rem}.article-links-label{font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);white-space:nowrap;margin-right:.15rem}.article-links ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.35rem}.article-links li{display:flex}.article-links a{font-size:.8rem;color:var(--ink-muted);text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:.2rem .6rem;transition:color .12s,border-color .12s;white-space:nowrap}.article-links a:hover{color:#111;border-color:var(--ink-muted)}.article-body ul,.article-body ol{font-size:.9375rem;color:#444;line-height:1.65}.article-body li code{color:#111}@media(max-width:600px){.article{padding-block:2.5rem}.article-header h1{font-size:1.5rem}.article-body pre{white-space:pre-wrap!important;word-break:break-word;overflow-x:visible!important;padding-right:2.5rem}.code-copy-btn{font-size:.65rem;padding:.15rem .4rem}.article-body th,.article-body td{padding:.5rem .75rem;font-size:.875rem}}