:root{--color-accent: #C2410C;--color-accent-hover: #A63A0A;--color-orange: #FF731E;--color-orange-soft: #FFF1E8;--color-ink: #1C1917;--color-ink-hover: #292524;--color-muted: #6B7280;--color-faint: #A8A29E;--color-fg-on-dark: #F6F2ED;--color-fg-on-dark-2: #CFC7BD;--color-bg: #FCFBF9;--color-bg-soft: #F4F0EA;--color-dark: #131110;--color-tile: #1C1917;--color-line: #E7E2DA;--color-line-soft: #e6eaec;--color-success: #00875A;--color-warning: #8A5A00;--color-error: #C53E31;--color-white: #ffffff;--section-pad-y: 5.5rem;--section-pad-y-mobile: 2rem}html,body{margin:0;padding:0}body{font-family:Inter,Arial,sans-serif;background:#fff}:root{--orange: #FF731E;--orange-deep: #C2410C;--orange-soft: #FFF1E8;--ink: #1C1917;--ink-hover: #292524;--muted: #6B7280;--bg: #FCFBF9;--bg-soft: #F4F0EA;--white: #FFFFFF;--line: #E7E2DA;--container: 74.5rem;--content: 44rem}*{box-sizing:border-box}html{scroll-behavior:smooth}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:var(--ink);text-decoration-color:var(--line);text-underline-offset:3px}a:hover{text-decoration-color:var(--orange)}.container{max-width:var(--container);margin:0 auto;padding:0 1.25rem}.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.75rem 1.5rem}@media(max-width:900px){.post-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.post-grid{grid-template-columns:1fr}}.post-card{display:flex;flex-direction:column;text-decoration:none}.post-card .thumb{aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:var(--bg-soft);border:1px solid var(--line)}.post-card .thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}.post-card:hover .thumb img{transform:scale(1.03)}.post-card h3{font-size:1.06rem;line-height:1.4;margin:.8rem 0 .35rem;letter-spacing:-.01em}.post-card:hover h3{color:var(--orange-deep)}.card-meta{font-size:.8rem;color:var(--muted);display:flex;gap:.5rem;align-items:center}.chip{display:inline-block;background:var(--orange-soft);color:var(--orange-deep);border-radius:999px;padding:.12rem .6rem;font-size:.72rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase;text-decoration:none}a.chip:hover{background:var(--orange);color:var(--ink)}.prose{max-width:var(--content);margin:0 auto;font-size:1.06rem}.prose>*+*{margin-top:1.1em}.prose h2{font-size:1.65rem;letter-spacing:-.02em;line-height:1.25;margin-top:2.2em}.prose h3{font-size:1.25rem;letter-spacing:-.01em;margin-top:1.8em}.prose h4{font-size:1.05rem}.prose img{max-width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}.prose blockquote{margin:1.5em 0;padding:.2em 1.2em;border-left:3px solid var(--orange);background:var(--orange-soft);border-radius:0 12px 12px 0;color:var(--ink)}.prose pre{background:var(--ink);color:#e7e2da;padding:1.1rem 1.25rem;border-radius:12px;overflow-x:auto;font-size:.88rem}.prose code{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.92em}.prose :not(pre)>code{background:var(--bg-soft);padding:.12em .35em;border-radius:5px}.prose table{width:100%;border-collapse:collapse;font-size:.92rem;display:block;overflow-x:auto}.prose th,.prose td{border:1px solid var(--line);padding:.55rem .75rem;text-align:left}.prose th{background:var(--bg-soft)}.prose iframe{max-width:100%;border-radius:12px}.prose hr{border:0;border-top:1px solid var(--line);margin:2.5em 0}.prose a{color:var(--orange-deep);text-decoration-color:currentColor}.btn{display:inline-block;background:#1c1917;color:#fff;border-radius:10px;padding:.55rem 1.05rem;font-weight:600;font-size:.92rem;text-decoration:none}.btn:hover{background:#292524}sf-* styles resolve to these). Values from SYNUP-DESIGN-SYSTEM.md. If the main site's token stylesheet
changes,update here too. --color-accent/-hover are best-guess (flagged). */ :root{--color-ink: #1C1917;--color-orange: #FF731E;--color-white: #FFFFFF;--color-line: #E7E2DA;--color-bg-soft: #F4F0EA;--color-muted: #6B7280;--color-accent: #C2410C;--color-accent-hover: #A63A0A}