:root{--font-ui: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--bg: #ffffff;--bg-2: #f4f2ed;--bg-3: #ebe8e2;--text: #1b1f23;--text-2: #5e6369;--text-3: #63676d;--border: #e4e1da;--border-2: #827e74;--primary: #1b1f23;--primary-hover: #3a3e43;--on-primary: #ffffff;--accent: #1f6b45;--accent-hover: #185a3a;--accent-soft: #efede8;--accent-text: #1f6b45;--on-accent: #ffffff;--focus: #1f6b45;--success: #1f6b45;--success-soft: #e8f1ec;--danger: #b3261e;--danger-soft: #fbeeed;--warn: #8a5a00;--warn-soft: #fbf3e2;--pro: #1b1f23;--pro-soft: #efede8;--radius-s: 6px;--radius: 10px;--radius-l: 14px;--shadow-1: 0 1px 2px rgba(27, 31, 35, .06), 0 1px 1px rgba(27, 31, 35, .04);--shadow-2: 0 4px 16px rgba(27, 31, 35, .1), 0 1px 3px rgba(27, 31, 35, .06);--frame: 1360px;--frame-read: 1160px;--max-w: 1280px;--gutter: 16px;--topbar-h: 56px;--pad: 16px;--measure: 72ch;--fs-xs: 12px;--fs-s: 13px;--fs-m: 14px;--fs-l: 16px;--fs-xl: 20px;--fs-2xl: 26px;--fs-3xl: 32px;color-scheme:light}@media(min-width:720px){:root{--gutter: 24px;--pad: 24px;--fs-3xl: 36px}}@media(min-width:1280px){:root{--pad: 32px}}@media(min-width:1680px){:root{--pad: 40px}}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--topbar-h) + 8px)}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-ui);font-size:var(--fs-m);line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}img,svg{display:block;max-width:100%}a{color:var(--accent-text);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,h4{margin:0;font-weight:650;letter-spacing:-.01em;line-height:1.2}h1{font-size:var(--fs-2xl)}h2{font-size:var(--fs-xl)}h3{font-size:var(--fs-l)}p{margin:0 0 1em}code,kbd,pre{font-family:var(--font-mono);font-size:.92em}kbd{display:inline-block;min-width:1.6em;padding:0 5px;border:1px solid var(--border-2);border-bottom-width:2px;border-radius:4px;background:var(--bg-2);color:var(--text-2);font-size:11px;line-height:1.6;text-align:center}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.wrap{width:100%;max-width:var(--max-w);margin:0 auto;padding-inline:var(--gutter)}.wrap-full{width:100%;padding-inline:max(var(--pad),env(safe-area-inset-left)) max(var(--pad),env(safe-area-inset-right))}.frame{width:100%;max-width:calc(var(--frame) + 2 * var(--pad));margin-inline:auto;padding-inline:max(var(--pad),env(safe-area-inset-left)) max(var(--pad),env(safe-area-inset-right))}.skip-link{position:absolute;left:8px;top:-40px;z-index:100;padding:8px 12px;background:var(--primary);color:var(--on-primary);border-radius:var(--radius-s)}.skip-link:focus{top:8px}.topbar{position:sticky;top:0;z-index:50;height:var(--topbar-h);background:#fffffff5;backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid var(--border)}.topbar .wrap-full{display:flex;align-items:center;gap:12px;height:100%}.wordmark{display:inline-flex;align-items:center;gap:8px;color:var(--text);font-weight:700;font-size:15px;letter-spacing:-.01em;white-space:nowrap}.wordmark:hover{text-decoration:none}.wordmark .mark{width:24px;height:24px;border-radius:6px;background:var(--primary);display:grid;place-items:center}.wordmark .mark svg{width:16px;height:16px}.wordmark .sub{color:var(--text-2);font-weight:500}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:16px;font-size:var(--fs-s);white-space:nowrap}.topbar-right a{color:var(--text-2)}@media(max-width:719px){.topbar-right .hide-s{display:none}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 14px;border:1px solid var(--border-2);border-radius:var(--radius-s);background:var(--bg);color:var(--text);font-weight:550;font-size:var(--fs-s);cursor:pointer;white-space:nowrap;transition:background .12s,border-color .12s}.btn:hover{background:var(--bg-2);text-decoration:none}.btn:disabled{opacity:.55;cursor:default}.btn-primary{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}.btn-primary:hover{background:var(--primary-hover);border-color:var(--primary-hover)}.btn-sm{height:30px;padding:0 10px;font-size:var(--fs-xs)}.btn-ghost{border-color:transparent;background:transparent;color:var(--text-2)}.btn-ghost:hover{background:var(--bg-3)}.badge{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.01em;white-space:nowrap}.badge-free{background:var(--bg-3);color:var(--text-2)}.badge-pro{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px var(--border-2)}.badge-soon{background:var(--warn-soft);color:var(--warn)}.badge-cat{background:var(--bg-3);color:var(--text-2)}.input{height:36px;padding:0 10px;border:1px solid var(--border-2);border-radius:var(--radius-s);background:var(--bg);color:var(--text);font:inherit;font-size:var(--fs-m);width:100%}.input::placeholder{color:var(--text-3)}.input:focus{border-color:var(--focus);outline:1px solid var(--focus);outline-offset:0}.input.mono{font-family:var(--font-mono);letter-spacing:.02em}.footer{margin-top:56px;border-top:1px solid var(--border);padding:28px 0 max(40px,calc(16px + env(safe-area-inset-bottom)));color:var(--text-2);font-size:var(--fs-s)}.footer .frame{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center}.footer a{color:var(--text-2)}.footer .copy{margin-left:auto}.prose{max-width:720px;margin-inline:auto;padding-block:32px 24px}.prose h1{margin-bottom:6px}.prose .lede{color:var(--text-2);font-size:var(--fs-l);margin-bottom:28px}.prose h2{margin:32px 0 10px;font-size:var(--fs-l)}.prose p,.prose li{font-size:15px;line-height:1.65}.prose ul{padding-left:20px}.prose li{margin-bottom:6px}.prose .meta{color:var(--text-3);font-size:var(--fs-s)}.prose h3{margin:22px 0 6px;font-size:15px;font-weight:650}@media(max-width:719px),(pointer:coarse){input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea{font-size:16px!important}}