[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-automattic-spatial-rhythm-and-whitespace":3,"mdc--gqhr51-key":36,"related-org-automattic-spatial-rhythm-and-whitespace":4866,"related-repo-automattic-spatial-rhythm-and-whitespace":5049},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":11,"stars":25,"repoUrl":26,"updatedAt":27,"license":28,"forks":29,"topics":30,"repo":31,"sourceUrl":34,"mdContent":35},"spatial-rhythm-and-whitespace","apply premium spatial rhythm and whitespace","Apply the spacing, container, grid, and border-radius rhythm of premium VC-funded sites. Generous 80-160px section padding, intentional non-strict spacing scales (including 20\u002F28\u002F40), deliberate radius architecture (binary 0-or-pill, asymmetric interlocking, per-element variety), 40px paragraph-spacing on h2, 1px hairline dividers at 4-10% opacity. Use when layouts feel cramped, monotonous, or use \"rounded-md everywhere.\"",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},"automattic","Automattic","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Fautomattic.png",[12,16,19,22],{"name":13,"slug":14,"type":15},"Frontend","frontend","tag",{"name":17,"slug":18,"type":15},"Visual Design","visual-design",{"name":20,"slug":21,"type":15},"UX Design","ux-design",{"name":23,"slug":24,"type":15},"Design","design",1,"https:\u002F\u002Fgithub.com\u002FAutomattic\u002Fdesign-polish-suite","2026-06-20T07:57:14.328471",null,0,[],{"repoUrl":26,"stars":25,"forks":29,"topics":32,"description":33},[],"This suite contains 6 focused skills that together form a full-stack design intervention for interfaces suffering from Terminal Blandness Syndrome (TBS). Symptoms include: identical card radiuses everywhere, #000 text on #fff backgrounds, hover states that just make things darker, and gradients that scream “I asked an AI to make this.”","https:\u002F\u002Fgithub.com\u002FAutomattic\u002Fdesign-polish-suite\u002Ftree\u002FHEAD\u002Fspatial-rhythm-and-whitespace","---\nname: spatial-rhythm-and-whitespace\ndescription: Apply the spacing, container, grid, and border-radius rhythm of premium VC-funded sites. Generous 80-160px section padding, intentional non-strict spacing scales (including 20\u002F28\u002F40), deliberate radius architecture (binary 0-or-pill, asymmetric interlocking, per-element variety), 40px paragraph-spacing on h2, 1px hairline dividers at 4-10% opacity. Use when layouts feel cramped, monotonous, or use \"rounded-md everywhere.\"\n---\n\n# Spatial Rhythm and Whitespace\n\nThe way space is used separates premium sites from templates. Extracted from Cal.com, Duna, Antimetal, Cohere, AngelList, Incident, Hex, Reducto.\n\n## When to invoke\n\n- Sections are `py-12` or `py-16` across the whole page\n- Every element uses `rounded-md` (8px) or `rounded-lg` (8px)\n- Cards are tight against each other with 16px gaps\n- The `h2 → p` gap is default `1em` line-height\n- Container width feels arbitrary\n- User says design feels \"cramped\" or \"monotonous\"\n\n## The 7 core rules\n\n### Rule 1: Border-radius is a designed system, not a default\n\nPremium sites use **different radii per element type**. Generic sites use one radius everywhere.\n\n**Four radius architectures** observed in case studies — pick ONE:\n\n**(A) Duna's binary system** — only `0` OR `9999px` (pill):\n```css\n\u002F* Sharp rectangular cards *\u002F\n.card { border-radius: 0; }\n\u002F* Fully pill buttons *\u002F\n.btn  { border-radius: 9999px; }\n\u002F* Nothing in between — no rounded-md 8px *\u002F\n```\nThis is the most aggressive and recognizable move.\n\n**(B) Cohere's asymmetric interlocking** — `20px` on outer corners, `0` at joins:\n```css\n\u002F* Card in a 2x2 grid, top-left position *\u002F\n.grid-card:nth-child(1) { border-radius: 20px 0 0 20px; }\n.grid-card:nth-child(2) { border-radius: 0 20px 20px 0; }\n.grid-card:nth-child(3) { border-radius: 20px 0 0 18px; }\n.grid-card:nth-child(4) { border-radius: 0 20px 18px 0; }\n\n\u002F* Stitched \"top of section\" panel *\u002F\n.panel-top { border-radius: 20px 20px 0 0; }\n\u002F* Stitched \"bottom\" *\u002F\n.panel-bottom { border-radius: 0 0 18px 20px; }\n```\nCards visually lock together like quilt tiles.\n\n**(C) Per-element variety** (Hex, Cal, AngelList) — radius matches semantic role:\n```css\n.btn-pill   { border-radius: 9999px; } \u002F* primary pills *\u002F\n.btn-chip   { border-radius: 30px; }   \u002F* chips and secondary *\u002F\n.card       { border-radius: 12px; }   \u002F* most cards *\u002F\n.card-large { border-radius: 20px; }   \u002F* feature cards *\u002F\n.input      { border-radius: 8px; }\n.avatar     { border-radius: 50%; }\n.tag        { border-radius: 2px; }    \u002F* micro chips *\u002F\n.feature    { border-radius: 40px; }   \u002F* large hero elements *\u002F\n```\n\n**(D) Extreme-radius for art** (AngelList) — 200–300px radius creates \"stadium\" shapes:\n```css\n.art-plate { border-radius: 300px; overflow: hidden; aspect-ratio: 2\u002F1; }\n```\n\nAnti-pattern: `border-radius: 8px` on every card, button, input, image.\n\n### Rule 2: Section padding is 80-160px, not 48-64px\n\nPremium sites breathe. Section vertical padding is generous:\n\n```css\n\u002F* Minimum acceptable *\u002F\n.section { padding-block: 80px; }\n\n\u002F* Premium default *\u002F\n.section { padding-block: 120px; }\n\n\u002F* Hero\u002Fmarketing sections *\u002F\n.section-hero { padding-block: 140px 96px; }\n\n\u002F* Editorial\u002Frhythm-heavy sections *\u002F\n.section-editorial { padding-block: 160px; }\n```\n\n**Duna's observed values**: `128px 40px`, `140px 40px`, `128px 40px 96px` — vertical padding dominates, paired with fixed horizontal.\n\n**Incident \u002F AngelList**: section padding ranges `80-160px` fluid.\n\n**Amplemarket**: `120-200px` on desktop.\n\n### Rule 3: Spacing scales include non-4-multiples\n\nStrict 4\u002F8\u002F12\u002F16 multiples are a tell. Premium sites **include oddballs** — 20, 28, 40, 64, 96, 128, 140.\n\n**Observed scales**:\n\n| Site | Spacing scale |\n|---|---|\n| Duna | 4, 8, 12, 16, **20**, 24, 40, 64, 80, 96, 128 |\n| Cal | 4, 8, 12, 16, 24, **28**, 40 |\n| Hex | 4, 8, **10**, 12, 16, **20**, 24, 32, 40, 48, 60, 80, 120 |\n| Cohere | 4, 8, 12, 16, 20, 24, 32, 40, 48, 64, 80, 96, 128, **160** |\n| Antimetal | (Tailwind v4 arbitrary-multiples — `w-120`, `calc(1120*1px)`) |\n\n**The 20px and 28px entries** break the strict-4-multiples habit. Use them for:\n- 20px: intermediate padding between \"tight\" (16px) and \"comfortable\" (24px)\n- 28px: h4 tier, card-body pairings\n\nAnti-pattern: `gap-4 p-4 m-4` (Tailwind monotone).\n\n### Rule 4: Paragraph spacing is explicit and generous\n\nAfter `h2`, set a deliberate paragraph-spacing of **40px** (Cal's observed default). Don't rely on margins from line-height.\n\n```css\nh2 { margin-block-end: 40px; }      \u002F* Cal's spec *\u002F\nh3 { margin-block-end: 24px; }\np + p { margin-block-start: 1.25em; }\n```\n\n**Framer's `paragraphSpacing` pattern** (from Cal.com and Duna):\n```css\nh2 { padding-block-end: 40px; }\np { padding-block-end: 20px; }\n```\n\n### Rule 5: Container widths are deliberate, and 1200-1280px is the sweet spot\n\n```css\n\u002F* Most common premium width *\u002F\n.container { max-width: 1280px; margin-inline: auto; padding-inline: 24px; }\n\n\u002F* Reducto *\u002F\n.container-reducto { max-width: 1280px; }\n\n\u002F* Editorial\u002Freading *\u002F\n.container-prose { max-width: 720px; }\n\n\u002F* Feature\u002Fhero blocks *\u002F\n.container-wide { max-width: 1440px; }\n```\n\n**Outseta** uses `width: 88%` of viewport (percent-based — more forgiving at wide screens).\n**Antimetal** has multiple: `400px, 568px, 768px, 992px, 1200px, 1536px`.\n\n**Horizontal padding** should scale with viewport:\n```css\n.container {\n  padding-inline: clamp(16px, 4vw, 80px);\n}\n```\n\n### Rule 6: Hairline dividers at 4-11% alpha, never solid\n\nPremium sites use hairlines with LOW opacity:\n\n```css\n\u002F* Observed hairline tokens *\u002F\n--hairline-subtle:  rgba(0, 0, 0, 0.04);     \u002F* Duna *\u002F\n--hairline-light:   rgba(0, 0, 0, 0.06);     \u002F* Hex, most common *\u002F\n--hairline-medium:  rgba(0, 0, 0, 0.10);     \u002F* default *\u002F\n--hairline-navy:    rgba(12, 38, 77, 0.04);  \u002F* Antimetal (theme-tinted) *\u002F\n--hairline-warm:    rgba(0, 45, 51, 0.10);   \u002F* AngelList *\u002F\n\n\u002F* Use as 1px border *\u002F\nhr { border: 0; border-top: 1px solid var(--hairline-light); }\n\n\u002F* Better: use as box-shadow 1px ring (common pattern) *\u002F\n.card { box-shadow: 0 0 0 1px var(--hairline-light); }\n\n\u002F* Bottom-line shadow trick (AngelList's \"shadow-b\") *\u002F\n.nav-item { box-shadow: 0 1px 0 #002d331a; }\n```\n\nAnti-pattern: `border: 1px solid #e5e7eb` (cold\u002Fgeneric).\n\n### Rule 7: Grid gaps match typographic rhythm\n\nGaps between cards should echo the spacing of text below them. Options:\n\n```css\n\u002F* Tight editorial grid (like a newspaper) — 8-12px gaps *\u002F\n.grid-editorial { gap: 12px; }\n\n\u002F* Standard content grid — 16-24px *\u002F\n.grid-cards { gap: 24px; }\n\n\u002F* Spacious feature grid — 32-48px *\u002F\n.grid-features { gap: 40px; }\n```\n\n**Reducto** uses tight `2-16px` gaps between components with generous `py-16 to py-32` section padding — **small gaps, big sections** is a deliberate rhythm.\n\n**AngelList** has tight internal content with giant section breaks.\n\n## Complete spacing system starter\n\n```css\n:root {\n  \u002F* Spacing scale — includes non-4 multiples *\u002F\n  --space-1:  4px;\n  --space-2:  8px;\n  --space-3:  12px;\n  --space-4:  16px;\n  --space-5:  20px;    \u002F* breaker *\u002F\n  --space-6:  24px;\n  --space-7:  28px;    \u002F* breaker *\u002F\n  --space-8:  32px;\n  --space-10: 40px;\n  --space-12: 48px;\n  --space-16: 64px;\n  --space-20: 80px;\n  --space-24: 96px;\n  --space-32: 128px;\n  --space-40: 160px;\n\n  \u002F* Section padding presets *\u002F\n  --section-py-tight:    var(--space-20);   \u002F* 80px *\u002F\n  --section-py-default:  var(--space-24);   \u002F* 96px *\u002F\n  --section-py-generous: var(--space-32);   \u002F* 128px *\u002F\n  --section-py-hero:     var(--space-40);   \u002F* 160px *\u002F\n\n  \u002F* Container widths *\u002F\n  --container-prose:  720px;\n  --container-main:   1280px;\n  --container-wide:   1440px;\n\n  \u002F* Radius system (per-element) *\u002F\n  --radius-chip:   2px;\n  --radius-input:  8px;\n  --radius-card:   12px;\n  --radius-large:  20px;\n  --radius-hero:   40px;\n  --radius-pill:   9999px;\n\n  \u002F* Hairlines *\u002F\n  --hairline: rgba(0, 0, 0, 0.06);\n}\n\n\u002F* Layout primitives *\u002F\n.container {\n  max-width: var(--container-main);\n  margin-inline: auto;\n  padding-inline: clamp(16px, 4vw, 80px);\n}\n\n.section {\n  padding-block: var(--section-py-default);\n}\n.section--hero      { padding-block: var(--section-py-hero) var(--space-24); }\n.section--generous  { padding-block: var(--section-py-generous); }\n\n\u002F* Typographic rhythm *\u002F\nh2 { margin-block-end: 40px; }\nh3 { margin-block-end: 24px; }\np  { margin-block-end: 20px; }\np:last-child { margin-block-end: 0; }\n\n\u002F* Hairlines *\u002F\n.divider { height: 1px; background: var(--hairline); border: 0; }\n.card    { box-shadow: 0 0 0 1px var(--hairline); }\n```\n\n## Application workflow\n\n1. **Choose a radius architecture** — binary \u002F asymmetric \u002F per-element \u002F extreme — and commit to it.\n2. **Upgrade section padding** to 80-160px (usually +50% more than you'd default).\n3. **Add 20 and 28 to your spacing scale** if you're stuck in strict-4-multiples.\n4. **Set explicit `margin-block-end: 40px` on h2** for generous paragraph spacing.\n5. **Set container max-width: 1280px** for main content, 720px for prose.\n6. **Drop hairlines to 4-10% alpha** (rarely solid gray).\n7. **Tighten grid gaps** to 8-24px, but increase section padding to compensate.\n\n## Anti-patterns to kill\n\n- `rounded-md` (8px) on every surface\n- `py-12` as the section padding across the whole site\n- Strict Tailwind 4-multiple scale with no 20\u002F28\u002F40 interpolation\n- `border: 1px solid #e5e7eb` instead of a translucent hairline\n- `max-width: 100%` with no container (text blocks flow edge-to-edge at wide)\n- Monotone `gap-4` between everything\n- Tight 48px section padding that makes the page feel cramped\n- Missing paragraph-spacing after h2 (text runs into prose)\n\n## Site references\n\n| Pattern | Case study |\n|---|---|\n| Binary `0` or `9999px` radius | Duna |\n| Asymmetric interlocking radius | Cohere (20px on outer, 0 at joins) |\n| Per-element radius variety | Hex, Cal, AngelList |\n| Extreme 200-300px radius art plates | AngelList |\n| 128-160px section padding | Duna, Incident, Amplemarket |\n| 40px margin-block-end on h2 | Cal |\n| 20px + 28px in spacing scale | Cal, Duna, Hex |\n| Theme-tinted hairlines | Antimetal (navy 4%) |\n| 1280px main container | Reducto, Incident, most sites |\n| Tight 2-16px component gaps + huge section padding | Reducto |\n",{"data":37,"body":38},{"name":4,"description":6},{"type":39,"children":40},"root",[41,49,55,62,146,152,159,172,182,208,335,340,365,785,790,800,1136,1146,1236,1249,1255,1260,1474,1507,1525,1542,1548,1560,1569,1708,1718,1731,1743,1749,1768,1887,1905,1975,1981,2224,2255,2265,2346,2352,2357,2861,2873,2879,2884,3038,3071,3081,3087,4527,4533,4615,4621,4693,4699,4860],{"type":42,"tag":43,"props":44,"children":45},"element","h1",{"id":4},[46],{"type":47,"value":48},"text","Spatial Rhythm and Whitespace",{"type":42,"tag":50,"props":51,"children":52},"p",{},[53],{"type":47,"value":54},"The way space is used separates premium sites from templates. Extracted from Cal.com, Duna, Antimetal, Cohere, AngelList, Incident, Hex, Reducto.",{"type":42,"tag":56,"props":57,"children":59},"h2",{"id":58},"when-to-invoke",[60],{"type":47,"value":61},"When to invoke",{"type":42,"tag":63,"props":64,"children":65},"ul",{},[66,89,110,115,136,141],{"type":42,"tag":67,"props":68,"children":69},"li",{},[70,72,79,81,87],{"type":47,"value":71},"Sections are ",{"type":42,"tag":73,"props":74,"children":76},"code",{"className":75},[],[77],{"type":47,"value":78},"py-12",{"type":47,"value":80}," or ",{"type":42,"tag":73,"props":82,"children":84},{"className":83},[],[85],{"type":47,"value":86},"py-16",{"type":47,"value":88}," across the whole page",{"type":42,"tag":67,"props":90,"children":91},{},[92,94,100,102,108],{"type":47,"value":93},"Every element uses ",{"type":42,"tag":73,"props":95,"children":97},{"className":96},[],[98],{"type":47,"value":99},"rounded-md",{"type":47,"value":101}," (8px) or ",{"type":42,"tag":73,"props":103,"children":105},{"className":104},[],[106],{"type":47,"value":107},"rounded-lg",{"type":47,"value":109}," (8px)",{"type":42,"tag":67,"props":111,"children":112},{},[113],{"type":47,"value":114},"Cards are tight against each other with 16px gaps",{"type":42,"tag":67,"props":116,"children":117},{},[118,120,126,128,134],{"type":47,"value":119},"The ",{"type":42,"tag":73,"props":121,"children":123},{"className":122},[],[124],{"type":47,"value":125},"h2 → p",{"type":47,"value":127}," gap is default ",{"type":42,"tag":73,"props":129,"children":131},{"className":130},[],[132],{"type":47,"value":133},"1em",{"type":47,"value":135}," line-height",{"type":42,"tag":67,"props":137,"children":138},{},[139],{"type":47,"value":140},"Container width feels arbitrary",{"type":42,"tag":67,"props":142,"children":143},{},[144],{"type":47,"value":145},"User says design feels \"cramped\" or \"monotonous\"",{"type":42,"tag":56,"props":147,"children":149},{"id":148},"the-7-core-rules",[150],{"type":47,"value":151},"The 7 core rules",{"type":42,"tag":153,"props":154,"children":156},"h3",{"id":155},"rule-1-border-radius-is-a-designed-system-not-a-default",[157],{"type":47,"value":158},"Rule 1: Border-radius is a designed system, not a default",{"type":42,"tag":50,"props":160,"children":161},{},[162,164,170],{"type":47,"value":163},"Premium sites use ",{"type":42,"tag":165,"props":166,"children":167},"strong",{},[168],{"type":47,"value":169},"different radii per element type",{"type":47,"value":171},". Generic sites use one radius everywhere.",{"type":42,"tag":50,"props":173,"children":174},{},[175,180],{"type":42,"tag":165,"props":176,"children":177},{},[178],{"type":47,"value":179},"Four radius architectures",{"type":47,"value":181}," observed in case studies — pick ONE:",{"type":42,"tag":50,"props":183,"children":184},{},[185,190,192,198,200,206],{"type":42,"tag":165,"props":186,"children":187},{},[188],{"type":47,"value":189},"(A) Duna's binary system",{"type":47,"value":191}," — only ",{"type":42,"tag":73,"props":193,"children":195},{"className":194},[],[196],{"type":47,"value":197},"0",{"type":47,"value":199}," OR ",{"type":42,"tag":73,"props":201,"children":203},{"className":202},[],[204],{"type":47,"value":205},"9999px",{"type":47,"value":207}," (pill):",{"type":42,"tag":209,"props":210,"children":215},"pre",{"className":211,"code":212,"language":213,"meta":214,"style":214},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F* Sharp rectangular cards *\u002F\n.card { border-radius: 0; }\n\u002F* Fully pill buttons *\u002F\n.btn  { border-radius: 9999px; }\n\u002F* Nothing in between — no rounded-md 8px *\u002F\n","css","",[216],{"type":42,"tag":73,"props":217,"children":218},{"__ignoreMap":214},[219,230,278,287,326],{"type":42,"tag":220,"props":221,"children":223},"span",{"class":222,"line":25},"line",[224],{"type":42,"tag":220,"props":225,"children":227},{"style":226},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[228],{"type":47,"value":229},"\u002F* Sharp rectangular cards *\u002F\n",{"type":42,"tag":220,"props":231,"children":233},{"class":222,"line":232},2,[234,240,246,251,257,262,268,273],{"type":42,"tag":220,"props":235,"children":237},{"style":236},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[238],{"type":47,"value":239},".",{"type":42,"tag":220,"props":241,"children":243},{"style":242},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[244],{"type":47,"value":245},"card",{"type":42,"tag":220,"props":247,"children":248},{"style":236},[249],{"type":47,"value":250}," {",{"type":42,"tag":220,"props":252,"children":254},{"style":253},"--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6",[255],{"type":47,"value":256}," border-radius",{"type":42,"tag":220,"props":258,"children":259},{"style":236},[260],{"type":47,"value":261},":",{"type":42,"tag":220,"props":263,"children":265},{"style":264},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[266],{"type":47,"value":267}," 0",{"type":42,"tag":220,"props":269,"children":270},{"style":236},[271],{"type":47,"value":272},";",{"type":42,"tag":220,"props":274,"children":275},{"style":236},[276],{"type":47,"value":277}," }\n",{"type":42,"tag":220,"props":279,"children":281},{"class":222,"line":280},3,[282],{"type":42,"tag":220,"props":283,"children":284},{"style":226},[285],{"type":47,"value":286},"\u002F* Fully pill buttons *\u002F\n",{"type":42,"tag":220,"props":288,"children":290},{"class":222,"line":289},4,[291,295,300,305,309,313,318,322],{"type":42,"tag":220,"props":292,"children":293},{"style":236},[294],{"type":47,"value":239},{"type":42,"tag":220,"props":296,"children":297},{"style":242},[298],{"type":47,"value":299},"btn",{"type":42,"tag":220,"props":301,"children":302},{"style":236},[303],{"type":47,"value":304},"  {",{"type":42,"tag":220,"props":306,"children":307},{"style":253},[308],{"type":47,"value":256},{"type":42,"tag":220,"props":310,"children":311},{"style":236},[312],{"type":47,"value":261},{"type":42,"tag":220,"props":314,"children":315},{"style":264},[316],{"type":47,"value":317}," 9999px",{"type":42,"tag":220,"props":319,"children":320},{"style":236},[321],{"type":47,"value":272},{"type":42,"tag":220,"props":323,"children":324},{"style":236},[325],{"type":47,"value":277},{"type":42,"tag":220,"props":327,"children":329},{"class":222,"line":328},5,[330],{"type":42,"tag":220,"props":331,"children":332},{"style":226},[333],{"type":47,"value":334},"\u002F* Nothing in between — no rounded-md 8px *\u002F\n",{"type":42,"tag":50,"props":336,"children":337},{},[338],{"type":47,"value":339},"This is the most aggressive and recognizable move.",{"type":42,"tag":50,"props":341,"children":342},{},[343,348,350,356,358,363],{"type":42,"tag":165,"props":344,"children":345},{},[346],{"type":47,"value":347},"(B) Cohere's asymmetric interlocking",{"type":47,"value":349}," — ",{"type":42,"tag":73,"props":351,"children":353},{"className":352},[],[354],{"type":47,"value":355},"20px",{"type":47,"value":357}," on outer corners, ",{"type":42,"tag":73,"props":359,"children":361},{"className":360},[],[362],{"type":47,"value":197},{"type":47,"value":364}," at joins:",{"type":42,"tag":209,"props":366,"children":368},{"className":211,"code":367,"language":213,"meta":214,"style":214},"\u002F* Card in a 2x2 grid, top-left position *\u002F\n.grid-card:nth-child(1) { border-radius: 20px 0 0 20px; }\n.grid-card:nth-child(2) { border-radius: 0 20px 20px 0; }\n.grid-card:nth-child(3) { border-radius: 20px 0 0 18px; }\n.grid-card:nth-child(4) { border-radius: 0 20px 18px 0; }\n\n\u002F* Stitched \"top of section\" panel *\u002F\n.panel-top { border-radius: 20px 20px 0 0; }\n\u002F* Stitched \"bottom\" *\u002F\n.panel-bottom { border-radius: 0 0 18px 20px; }\n",[369],{"type":42,"tag":73,"props":370,"children":371},{"__ignoreMap":214},[372,380,454,522,591,659,669,678,727,736],{"type":42,"tag":220,"props":373,"children":374},{"class":222,"line":25},[375],{"type":42,"tag":220,"props":376,"children":377},{"style":226},[378],{"type":47,"value":379},"\u002F* Card in a 2x2 grid, top-left position *\u002F\n",{"type":42,"tag":220,"props":381,"children":382},{"class":222,"line":232},[383,387,392,396,402,407,412,417,421,425,429,434,438,442,446,450],{"type":42,"tag":220,"props":384,"children":385},{"style":236},[386],{"type":47,"value":239},{"type":42,"tag":220,"props":388,"children":389},{"style":242},[390],{"type":47,"value":391},"grid-card",{"type":42,"tag":220,"props":393,"children":394},{"style":236},[395],{"type":47,"value":261},{"type":42,"tag":220,"props":397,"children":399},{"style":398},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[400],{"type":47,"value":401},"nth-child",{"type":42,"tag":220,"props":403,"children":404},{"style":236},[405],{"type":47,"value":406},"(",{"type":42,"tag":220,"props":408,"children":409},{"style":264},[410],{"type":47,"value":411},"1",{"type":42,"tag":220,"props":413,"children":414},{"style":236},[415],{"type":47,"value":416},")",{"type":42,"tag":220,"props":418,"children":419},{"style":236},[420],{"type":47,"value":250},{"type":42,"tag":220,"props":422,"children":423},{"style":253},[424],{"type":47,"value":256},{"type":42,"tag":220,"props":426,"children":427},{"style":236},[428],{"type":47,"value":261},{"type":42,"tag":220,"props":430,"children":431},{"style":264},[432],{"type":47,"value":433}," 20px",{"type":42,"tag":220,"props":435,"children":436},{"style":264},[437],{"type":47,"value":267},{"type":42,"tag":220,"props":439,"children":440},{"style":264},[441],{"type":47,"value":267},{"type":42,"tag":220,"props":443,"children":444},{"style":264},[445],{"type":47,"value":433},{"type":42,"tag":220,"props":447,"children":448},{"style":236},[449],{"type":47,"value":272},{"type":42,"tag":220,"props":451,"children":452},{"style":236},[453],{"type":47,"value":277},{"type":42,"tag":220,"props":455,"children":456},{"class":222,"line":280},[457,461,465,469,473,477,482,486,490,494,498,502,506,510,514,518],{"type":42,"tag":220,"props":458,"children":459},{"style":236},[460],{"type":47,"value":239},{"type":42,"tag":220,"props":462,"children":463},{"style":242},[464],{"type":47,"value":391},{"type":42,"tag":220,"props":466,"children":467},{"style":236},[468],{"type":47,"value":261},{"type":42,"tag":220,"props":470,"children":471},{"style":398},[472],{"type":47,"value":401},{"type":42,"tag":220,"props":474,"children":475},{"style":236},[476],{"type":47,"value":406},{"type":42,"tag":220,"props":478,"children":479},{"style":264},[480],{"type":47,"value":481},"2",{"type":42,"tag":220,"props":483,"children":484},{"style":236},[485],{"type":47,"value":416},{"type":42,"tag":220,"props":487,"children":488},{"style":236},[489],{"type":47,"value":250},{"type":42,"tag":220,"props":491,"children":492},{"style":253},[493],{"type":47,"value":256},{"type":42,"tag":220,"props":495,"children":496},{"style":236},[497],{"type":47,"value":261},{"type":42,"tag":220,"props":499,"children":500},{"style":264},[501],{"type":47,"value":267},{"type":42,"tag":220,"props":503,"children":504},{"style":264},[505],{"type":47,"value":433},{"type":42,"tag":220,"props":507,"children":508},{"style":264},[509],{"type":47,"value":433},{"type":42,"tag":220,"props":511,"children":512},{"style":264},[513],{"type":47,"value":267},{"type":42,"tag":220,"props":515,"children":516},{"style":236},[517],{"type":47,"value":272},{"type":42,"tag":220,"props":519,"children":520},{"style":236},[521],{"type":47,"value":277},{"type":42,"tag":220,"props":523,"children":524},{"class":222,"line":289},[525,529,533,537,541,545,550,554,558,562,566,570,574,578,583,587],{"type":42,"tag":220,"props":526,"children":527},{"style":236},[528],{"type":47,"value":239},{"type":42,"tag":220,"props":530,"children":531},{"style":242},[532],{"type":47,"value":391},{"type":42,"tag":220,"props":534,"children":535},{"style":236},[536],{"type":47,"value":261},{"type":42,"tag":220,"props":538,"children":539},{"style":398},[540],{"type":47,"value":401},{"type":42,"tag":220,"props":542,"children":543},{"style":236},[544],{"type":47,"value":406},{"type":42,"tag":220,"props":546,"children":547},{"style":264},[548],{"type":47,"value":549},"3",{"type":42,"tag":220,"props":551,"children":552},{"style":236},[553],{"type":47,"value":416},{"type":42,"tag":220,"props":555,"children":556},{"style":236},[557],{"type":47,"value":250},{"type":42,"tag":220,"props":559,"children":560},{"style":253},[561],{"type":47,"value":256},{"type":42,"tag":220,"props":563,"children":564},{"style":236},[565],{"type":47,"value":261},{"type":42,"tag":220,"props":567,"children":568},{"style":264},[569],{"type":47,"value":433},{"type":42,"tag":220,"props":571,"children":572},{"style":264},[573],{"type":47,"value":267},{"type":42,"tag":220,"props":575,"children":576},{"style":264},[577],{"type":47,"value":267},{"type":42,"tag":220,"props":579,"children":580},{"style":264},[581],{"type":47,"value":582}," 18px",{"type":42,"tag":220,"props":584,"children":585},{"style":236},[586],{"type":47,"value":272},{"type":42,"tag":220,"props":588,"children":589},{"style":236},[590],{"type":47,"value":277},{"type":42,"tag":220,"props":592,"children":593},{"class":222,"line":328},[594,598,602,606,610,614,619,623,627,631,635,639,643,647,651,655],{"type":42,"tag":220,"props":595,"children":596},{"style":236},[597],{"type":47,"value":239},{"type":42,"tag":220,"props":599,"children":600},{"style":242},[601],{"type":47,"value":391},{"type":42,"tag":220,"props":603,"children":604},{"style":236},[605],{"type":47,"value":261},{"type":42,"tag":220,"props":607,"children":608},{"style":398},[609],{"type":47,"value":401},{"type":42,"tag":220,"props":611,"children":612},{"style":236},[613],{"type":47,"value":406},{"type":42,"tag":220,"props":615,"children":616},{"style":264},[617],{"type":47,"value":618},"4",{"type":42,"tag":220,"props":620,"children":621},{"style":236},[622],{"type":47,"value":416},{"type":42,"tag":220,"props":624,"children":625},{"style":236},[626],{"type":47,"value":250},{"type":42,"tag":220,"props":628,"children":629},{"style":253},[630],{"type":47,"value":256},{"type":42,"tag":220,"props":632,"children":633},{"style":236},[634],{"type":47,"value":261},{"type":42,"tag":220,"props":636,"children":637},{"style":264},[638],{"type":47,"value":267},{"type":42,"tag":220,"props":640,"children":641},{"style":264},[642],{"type":47,"value":433},{"type":42,"tag":220,"props":644,"children":645},{"style":264},[646],{"type":47,"value":582},{"type":42,"tag":220,"props":648,"children":649},{"style":264},[650],{"type":47,"value":267},{"type":42,"tag":220,"props":652,"children":653},{"style":236},[654],{"type":47,"value":272},{"type":42,"tag":220,"props":656,"children":657},{"style":236},[658],{"type":47,"value":277},{"type":42,"tag":220,"props":660,"children":662},{"class":222,"line":661},6,[663],{"type":42,"tag":220,"props":664,"children":666},{"emptyLinePlaceholder":665},true,[667],{"type":47,"value":668},"\n",{"type":42,"tag":220,"props":670,"children":672},{"class":222,"line":671},7,[673],{"type":42,"tag":220,"props":674,"children":675},{"style":226},[676],{"type":47,"value":677},"\u002F* Stitched \"top of section\" panel *\u002F\n",{"type":42,"tag":220,"props":679,"children":681},{"class":222,"line":680},8,[682,686,691,695,699,703,707,711,715,719,723],{"type":42,"tag":220,"props":683,"children":684},{"style":236},[685],{"type":47,"value":239},{"type":42,"tag":220,"props":687,"children":688},{"style":242},[689],{"type":47,"value":690},"panel-top",{"type":42,"tag":220,"props":692,"children":693},{"style":236},[694],{"type":47,"value":250},{"type":42,"tag":220,"props":696,"children":697},{"style":253},[698],{"type":47,"value":256},{"type":42,"tag":220,"props":700,"children":701},{"style":236},[702],{"type":47,"value":261},{"type":42,"tag":220,"props":704,"children":705},{"style":264},[706],{"type":47,"value":433},{"type":42,"tag":220,"props":708,"children":709},{"style":264},[710],{"type":47,"value":433},{"type":42,"tag":220,"props":712,"children":713},{"style":264},[714],{"type":47,"value":267},{"type":42,"tag":220,"props":716,"children":717},{"style":264},[718],{"type":47,"value":267},{"type":42,"tag":220,"props":720,"children":721},{"style":236},[722],{"type":47,"value":272},{"type":42,"tag":220,"props":724,"children":725},{"style":236},[726],{"type":47,"value":277},{"type":42,"tag":220,"props":728,"children":730},{"class":222,"line":729},9,[731],{"type":42,"tag":220,"props":732,"children":733},{"style":226},[734],{"type":47,"value":735},"\u002F* Stitched \"bottom\" *\u002F\n",{"type":42,"tag":220,"props":737,"children":739},{"class":222,"line":738},10,[740,744,749,753,757,761,765,769,773,777,781],{"type":42,"tag":220,"props":741,"children":742},{"style":236},[743],{"type":47,"value":239},{"type":42,"tag":220,"props":745,"children":746},{"style":242},[747],{"type":47,"value":748},"panel-bottom",{"type":42,"tag":220,"props":750,"children":751},{"style":236},[752],{"type":47,"value":250},{"type":42,"tag":220,"props":754,"children":755},{"style":253},[756],{"type":47,"value":256},{"type":42,"tag":220,"props":758,"children":759},{"style":236},[760],{"type":47,"value":261},{"type":42,"tag":220,"props":762,"children":763},{"style":264},[764],{"type":47,"value":267},{"type":42,"tag":220,"props":766,"children":767},{"style":264},[768],{"type":47,"value":267},{"type":42,"tag":220,"props":770,"children":771},{"style":264},[772],{"type":47,"value":582},{"type":42,"tag":220,"props":774,"children":775},{"style":264},[776],{"type":47,"value":433},{"type":42,"tag":220,"props":778,"children":779},{"style":236},[780],{"type":47,"value":272},{"type":42,"tag":220,"props":782,"children":783},{"style":236},[784],{"type":47,"value":277},{"type":42,"tag":50,"props":786,"children":787},{},[788],{"type":47,"value":789},"Cards visually lock together like quilt tiles.",{"type":42,"tag":50,"props":791,"children":792},{},[793,798],{"type":42,"tag":165,"props":794,"children":795},{},[796],{"type":47,"value":797},"(C) Per-element variety",{"type":47,"value":799}," (Hex, Cal, AngelList) — radius matches semantic role:",{"type":42,"tag":209,"props":801,"children":803},{"className":211,"code":802,"language":213,"meta":214,"style":214},".btn-pill   { border-radius: 9999px; } \u002F* primary pills *\u002F\n.btn-chip   { border-radius: 30px; }   \u002F* chips and secondary *\u002F\n.card       { border-radius: 12px; }   \u002F* most cards *\u002F\n.card-large { border-radius: 20px; }   \u002F* feature cards *\u002F\n.input      { border-radius: 8px; }\n.avatar     { border-radius: 50%; }\n.tag        { border-radius: 2px; }    \u002F* micro chips *\u002F\n.feature    { border-radius: 40px; }   \u002F* large hero elements *\u002F\n",[804],{"type":42,"tag":73,"props":805,"children":806},{"__ignoreMap":214},[807,850,892,934,975,1013,1051,1093],{"type":42,"tag":220,"props":808,"children":809},{"class":222,"line":25},[810,814,819,824,828,832,836,840,845],{"type":42,"tag":220,"props":811,"children":812},{"style":236},[813],{"type":47,"value":239},{"type":42,"tag":220,"props":815,"children":816},{"style":242},[817],{"type":47,"value":818},"btn-pill",{"type":42,"tag":220,"props":820,"children":821},{"style":236},[822],{"type":47,"value":823},"   {",{"type":42,"tag":220,"props":825,"children":826},{"style":253},[827],{"type":47,"value":256},{"type":42,"tag":220,"props":829,"children":830},{"style":236},[831],{"type":47,"value":261},{"type":42,"tag":220,"props":833,"children":834},{"style":264},[835],{"type":47,"value":317},{"type":42,"tag":220,"props":837,"children":838},{"style":236},[839],{"type":47,"value":272},{"type":42,"tag":220,"props":841,"children":842},{"style":236},[843],{"type":47,"value":844}," }",{"type":42,"tag":220,"props":846,"children":847},{"style":226},[848],{"type":47,"value":849}," \u002F* primary pills *\u002F\n",{"type":42,"tag":220,"props":851,"children":852},{"class":222,"line":232},[853,857,862,866,870,874,879,883,887],{"type":42,"tag":220,"props":854,"children":855},{"style":236},[856],{"type":47,"value":239},{"type":42,"tag":220,"props":858,"children":859},{"style":242},[860],{"type":47,"value":861},"btn-chip",{"type":42,"tag":220,"props":863,"children":864},{"style":236},[865],{"type":47,"value":823},{"type":42,"tag":220,"props":867,"children":868},{"style":253},[869],{"type":47,"value":256},{"type":42,"tag":220,"props":871,"children":872},{"style":236},[873],{"type":47,"value":261},{"type":42,"tag":220,"props":875,"children":876},{"style":264},[877],{"type":47,"value":878}," 30px",{"type":42,"tag":220,"props":880,"children":881},{"style":236},[882],{"type":47,"value":272},{"type":42,"tag":220,"props":884,"children":885},{"style":236},[886],{"type":47,"value":844},{"type":42,"tag":220,"props":888,"children":889},{"style":226},[890],{"type":47,"value":891},"   \u002F* chips and secondary *\u002F\n",{"type":42,"tag":220,"props":893,"children":894},{"class":222,"line":280},[895,899,903,908,912,916,921,925,929],{"type":42,"tag":220,"props":896,"children":897},{"style":236},[898],{"type":47,"value":239},{"type":42,"tag":220,"props":900,"children":901},{"style":242},[902],{"type":47,"value":245},{"type":42,"tag":220,"props":904,"children":905},{"style":236},[906],{"type":47,"value":907},"       {",{"type":42,"tag":220,"props":909,"children":910},{"style":253},[911],{"type":47,"value":256},{"type":42,"tag":220,"props":913,"children":914},{"style":236},[915],{"type":47,"value":261},{"type":42,"tag":220,"props":917,"children":918},{"style":264},[919],{"type":47,"value":920}," 12px",{"type":42,"tag":220,"props":922,"children":923},{"style":236},[924],{"type":47,"value":272},{"type":42,"tag":220,"props":926,"children":927},{"style":236},[928],{"type":47,"value":844},{"type":42,"tag":220,"props":930,"children":931},{"style":226},[932],{"type":47,"value":933},"   \u002F* most cards *\u002F\n",{"type":42,"tag":220,"props":935,"children":936},{"class":222,"line":289},[937,941,946,950,954,958,962,966,970],{"type":42,"tag":220,"props":938,"children":939},{"style":236},[940],{"type":47,"value":239},{"type":42,"tag":220,"props":942,"children":943},{"style":242},[944],{"type":47,"value":945},"card-large",{"type":42,"tag":220,"props":947,"children":948},{"style":236},[949],{"type":47,"value":250},{"type":42,"tag":220,"props":951,"children":952},{"style":253},[953],{"type":47,"value":256},{"type":42,"tag":220,"props":955,"children":956},{"style":236},[957],{"type":47,"value":261},{"type":42,"tag":220,"props":959,"children":960},{"style":264},[961],{"type":47,"value":433},{"type":42,"tag":220,"props":963,"children":964},{"style":236},[965],{"type":47,"value":272},{"type":42,"tag":220,"props":967,"children":968},{"style":236},[969],{"type":47,"value":844},{"type":42,"tag":220,"props":971,"children":972},{"style":226},[973],{"type":47,"value":974},"   \u002F* feature cards *\u002F\n",{"type":42,"tag":220,"props":976,"children":977},{"class":222,"line":328},[978,982,987,992,996,1000,1005,1009],{"type":42,"tag":220,"props":979,"children":980},{"style":236},[981],{"type":47,"value":239},{"type":42,"tag":220,"props":983,"children":984},{"style":242},[985],{"type":47,"value":986},"input",{"type":42,"tag":220,"props":988,"children":989},{"style":236},[990],{"type":47,"value":991},"      {",{"type":42,"tag":220,"props":993,"children":994},{"style":253},[995],{"type":47,"value":256},{"type":42,"tag":220,"props":997,"children":998},{"style":236},[999],{"type":47,"value":261},{"type":42,"tag":220,"props":1001,"children":1002},{"style":264},[1003],{"type":47,"value":1004}," 8px",{"type":42,"tag":220,"props":1006,"children":1007},{"style":236},[1008],{"type":47,"value":272},{"type":42,"tag":220,"props":1010,"children":1011},{"style":236},[1012],{"type":47,"value":277},{"type":42,"tag":220,"props":1014,"children":1015},{"class":222,"line":661},[1016,1020,1025,1030,1034,1038,1043,1047],{"type":42,"tag":220,"props":1017,"children":1018},{"style":236},[1019],{"type":47,"value":239},{"type":42,"tag":220,"props":1021,"children":1022},{"style":242},[1023],{"type":47,"value":1024},"avatar",{"type":42,"tag":220,"props":1026,"children":1027},{"style":236},[1028],{"type":47,"value":1029},"     {",{"type":42,"tag":220,"props":1031,"children":1032},{"style":253},[1033],{"type":47,"value":256},{"type":42,"tag":220,"props":1035,"children":1036},{"style":236},[1037],{"type":47,"value":261},{"type":42,"tag":220,"props":1039,"children":1040},{"style":264},[1041],{"type":47,"value":1042}," 50%",{"type":42,"tag":220,"props":1044,"children":1045},{"style":236},[1046],{"type":47,"value":272},{"type":42,"tag":220,"props":1048,"children":1049},{"style":236},[1050],{"type":47,"value":277},{"type":42,"tag":220,"props":1052,"children":1053},{"class":222,"line":671},[1054,1058,1062,1067,1071,1075,1080,1084,1088],{"type":42,"tag":220,"props":1055,"children":1056},{"style":236},[1057],{"type":47,"value":239},{"type":42,"tag":220,"props":1059,"children":1060},{"style":242},[1061],{"type":47,"value":15},{"type":42,"tag":220,"props":1063,"children":1064},{"style":236},[1065],{"type":47,"value":1066},"        {",{"type":42,"tag":220,"props":1068,"children":1069},{"style":253},[1070],{"type":47,"value":256},{"type":42,"tag":220,"props":1072,"children":1073},{"style":236},[1074],{"type":47,"value":261},{"type":42,"tag":220,"props":1076,"children":1077},{"style":264},[1078],{"type":47,"value":1079}," 2px",{"type":42,"tag":220,"props":1081,"children":1082},{"style":236},[1083],{"type":47,"value":272},{"type":42,"tag":220,"props":1085,"children":1086},{"style":236},[1087],{"type":47,"value":844},{"type":42,"tag":220,"props":1089,"children":1090},{"style":226},[1091],{"type":47,"value":1092},"    \u002F* micro chips *\u002F\n",{"type":42,"tag":220,"props":1094,"children":1095},{"class":222,"line":680},[1096,1100,1105,1110,1114,1118,1123,1127,1131],{"type":42,"tag":220,"props":1097,"children":1098},{"style":236},[1099],{"type":47,"value":239},{"type":42,"tag":220,"props":1101,"children":1102},{"style":242},[1103],{"type":47,"value":1104},"feature",{"type":42,"tag":220,"props":1106,"children":1107},{"style":236},[1108],{"type":47,"value":1109},"    {",{"type":42,"tag":220,"props":1111,"children":1112},{"style":253},[1113],{"type":47,"value":256},{"type":42,"tag":220,"props":1115,"children":1116},{"style":236},[1117],{"type":47,"value":261},{"type":42,"tag":220,"props":1119,"children":1120},{"style":264},[1121],{"type":47,"value":1122}," 40px",{"type":42,"tag":220,"props":1124,"children":1125},{"style":236},[1126],{"type":47,"value":272},{"type":42,"tag":220,"props":1128,"children":1129},{"style":236},[1130],{"type":47,"value":844},{"type":42,"tag":220,"props":1132,"children":1133},{"style":226},[1134],{"type":47,"value":1135},"   \u002F* large hero elements *\u002F\n",{"type":42,"tag":50,"props":1137,"children":1138},{},[1139,1144],{"type":42,"tag":165,"props":1140,"children":1141},{},[1142],{"type":47,"value":1143},"(D) Extreme-radius for art",{"type":47,"value":1145}," (AngelList) — 200–300px radius creates \"stadium\" shapes:",{"type":42,"tag":209,"props":1147,"children":1149},{"className":211,"code":1148,"language":213,"meta":214,"style":214},".art-plate { border-radius: 300px; overflow: hidden; aspect-ratio: 2\u002F1; }\n",[1150],{"type":42,"tag":73,"props":1151,"children":1152},{"__ignoreMap":214},[1153],{"type":42,"tag":220,"props":1154,"children":1155},{"class":222,"line":25},[1156,1160,1165,1169,1173,1177,1182,1186,1191,1195,1201,1205,1210,1214,1219,1224,1228,1232],{"type":42,"tag":220,"props":1157,"children":1158},{"style":236},[1159],{"type":47,"value":239},{"type":42,"tag":220,"props":1161,"children":1162},{"style":242},[1163],{"type":47,"value":1164},"art-plate",{"type":42,"tag":220,"props":1166,"children":1167},{"style":236},[1168],{"type":47,"value":250},{"type":42,"tag":220,"props":1170,"children":1171},{"style":253},[1172],{"type":47,"value":256},{"type":42,"tag":220,"props":1174,"children":1175},{"style":236},[1176],{"type":47,"value":261},{"type":42,"tag":220,"props":1178,"children":1179},{"style":264},[1180],{"type":47,"value":1181}," 300px",{"type":42,"tag":220,"props":1183,"children":1184},{"style":236},[1185],{"type":47,"value":272},{"type":42,"tag":220,"props":1187,"children":1188},{"style":253},[1189],{"type":47,"value":1190}," overflow",{"type":42,"tag":220,"props":1192,"children":1193},{"style":236},[1194],{"type":47,"value":261},{"type":42,"tag":220,"props":1196,"children":1198},{"style":1197},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[1199],{"type":47,"value":1200}," hidden",{"type":42,"tag":220,"props":1202,"children":1203},{"style":236},[1204],{"type":47,"value":272},{"type":42,"tag":220,"props":1206,"children":1207},{"style":253},[1208],{"type":47,"value":1209}," aspect-ratio",{"type":42,"tag":220,"props":1211,"children":1212},{"style":236},[1213],{"type":47,"value":261},{"type":42,"tag":220,"props":1215,"children":1216},{"style":264},[1217],{"type":47,"value":1218}," 2",{"type":42,"tag":220,"props":1220,"children":1221},{"style":1197},[1222],{"type":47,"value":1223},"\u002F",{"type":42,"tag":220,"props":1225,"children":1226},{"style":264},[1227],{"type":47,"value":411},{"type":42,"tag":220,"props":1229,"children":1230},{"style":236},[1231],{"type":47,"value":272},{"type":42,"tag":220,"props":1233,"children":1234},{"style":236},[1235],{"type":47,"value":277},{"type":42,"tag":50,"props":1237,"children":1238},{},[1239,1241,1247],{"type":47,"value":1240},"Anti-pattern: ",{"type":42,"tag":73,"props":1242,"children":1244},{"className":1243},[],[1245],{"type":47,"value":1246},"border-radius: 8px",{"type":47,"value":1248}," on every card, button, input, image.",{"type":42,"tag":153,"props":1250,"children":1252},{"id":1251},"rule-2-section-padding-is-80-160px-not-48-64px",[1253],{"type":47,"value":1254},"Rule 2: Section padding is 80-160px, not 48-64px",{"type":42,"tag":50,"props":1256,"children":1257},{},[1258],{"type":47,"value":1259},"Premium sites breathe. Section vertical padding is generous:",{"type":42,"tag":209,"props":1261,"children":1263},{"className":211,"code":1262,"language":213,"meta":214,"style":214},"\u002F* Minimum acceptable *\u002F\n.section { padding-block: 80px; }\n\n\u002F* Premium default *\u002F\n.section { padding-block: 120px; }\n\n\u002F* Hero\u002Fmarketing sections *\u002F\n.section-hero { padding-block: 140px 96px; }\n\n\u002F* Editorial\u002Frhythm-heavy sections *\u002F\n.section-editorial { padding-block: 160px; }\n",[1264],{"type":42,"tag":73,"props":1265,"children":1266},{"__ignoreMap":214},[1267,1275,1313,1320,1328,1364,1371,1379,1421,1428,1436],{"type":42,"tag":220,"props":1268,"children":1269},{"class":222,"line":25},[1270],{"type":42,"tag":220,"props":1271,"children":1272},{"style":226},[1273],{"type":47,"value":1274},"\u002F* Minimum acceptable *\u002F\n",{"type":42,"tag":220,"props":1276,"children":1277},{"class":222,"line":232},[1278,1282,1287,1291,1296,1300,1305,1309],{"type":42,"tag":220,"props":1279,"children":1280},{"style":236},[1281],{"type":47,"value":239},{"type":42,"tag":220,"props":1283,"children":1284},{"style":242},[1285],{"type":47,"value":1286},"section",{"type":42,"tag":220,"props":1288,"children":1289},{"style":236},[1290],{"type":47,"value":250},{"type":42,"tag":220,"props":1292,"children":1293},{"style":253},[1294],{"type":47,"value":1295}," padding-block",{"type":42,"tag":220,"props":1297,"children":1298},{"style":236},[1299],{"type":47,"value":261},{"type":42,"tag":220,"props":1301,"children":1302},{"style":264},[1303],{"type":47,"value":1304}," 80px",{"type":42,"tag":220,"props":1306,"children":1307},{"style":236},[1308],{"type":47,"value":272},{"type":42,"tag":220,"props":1310,"children":1311},{"style":236},[1312],{"type":47,"value":277},{"type":42,"tag":220,"props":1314,"children":1315},{"class":222,"line":280},[1316],{"type":42,"tag":220,"props":1317,"children":1318},{"emptyLinePlaceholder":665},[1319],{"type":47,"value":668},{"type":42,"tag":220,"props":1321,"children":1322},{"class":222,"line":289},[1323],{"type":42,"tag":220,"props":1324,"children":1325},{"style":226},[1326],{"type":47,"value":1327},"\u002F* Premium default *\u002F\n",{"type":42,"tag":220,"props":1329,"children":1330},{"class":222,"line":328},[1331,1335,1339,1343,1347,1351,1356,1360],{"type":42,"tag":220,"props":1332,"children":1333},{"style":236},[1334],{"type":47,"value":239},{"type":42,"tag":220,"props":1336,"children":1337},{"style":242},[1338],{"type":47,"value":1286},{"type":42,"tag":220,"props":1340,"children":1341},{"style":236},[1342],{"type":47,"value":250},{"type":42,"tag":220,"props":1344,"children":1345},{"style":253},[1346],{"type":47,"value":1295},{"type":42,"tag":220,"props":1348,"children":1349},{"style":236},[1350],{"type":47,"value":261},{"type":42,"tag":220,"props":1352,"children":1353},{"style":264},[1354],{"type":47,"value":1355}," 120px",{"type":42,"tag":220,"props":1357,"children":1358},{"style":236},[1359],{"type":47,"value":272},{"type":42,"tag":220,"props":1361,"children":1362},{"style":236},[1363],{"type":47,"value":277},{"type":42,"tag":220,"props":1365,"children":1366},{"class":222,"line":661},[1367],{"type":42,"tag":220,"props":1368,"children":1369},{"emptyLinePlaceholder":665},[1370],{"type":47,"value":668},{"type":42,"tag":220,"props":1372,"children":1373},{"class":222,"line":671},[1374],{"type":42,"tag":220,"props":1375,"children":1376},{"style":226},[1377],{"type":47,"value":1378},"\u002F* Hero\u002Fmarketing sections *\u002F\n",{"type":42,"tag":220,"props":1380,"children":1381},{"class":222,"line":680},[1382,1386,1391,1395,1399,1403,1408,1413,1417],{"type":42,"tag":220,"props":1383,"children":1384},{"style":236},[1385],{"type":47,"value":239},{"type":42,"tag":220,"props":1387,"children":1388},{"style":242},[1389],{"type":47,"value":1390},"section-hero",{"type":42,"tag":220,"props":1392,"children":1393},{"style":236},[1394],{"type":47,"value":250},{"type":42,"tag":220,"props":1396,"children":1397},{"style":253},[1398],{"type":47,"value":1295},{"type":42,"tag":220,"props":1400,"children":1401},{"style":236},[1402],{"type":47,"value":261},{"type":42,"tag":220,"props":1404,"children":1405},{"style":264},[1406],{"type":47,"value":1407}," 140px",{"type":42,"tag":220,"props":1409,"children":1410},{"style":264},[1411],{"type":47,"value":1412}," 96px",{"type":42,"tag":220,"props":1414,"children":1415},{"style":236},[1416],{"type":47,"value":272},{"type":42,"tag":220,"props":1418,"children":1419},{"style":236},[1420],{"type":47,"value":277},{"type":42,"tag":220,"props":1422,"children":1423},{"class":222,"line":729},[1424],{"type":42,"tag":220,"props":1425,"children":1426},{"emptyLinePlaceholder":665},[1427],{"type":47,"value":668},{"type":42,"tag":220,"props":1429,"children":1430},{"class":222,"line":738},[1431],{"type":42,"tag":220,"props":1432,"children":1433},{"style":226},[1434],{"type":47,"value":1435},"\u002F* Editorial\u002Frhythm-heavy sections *\u002F\n",{"type":42,"tag":220,"props":1437,"children":1439},{"class":222,"line":1438},11,[1440,1444,1449,1453,1457,1461,1466,1470],{"type":42,"tag":220,"props":1441,"children":1442},{"style":236},[1443],{"type":47,"value":239},{"type":42,"tag":220,"props":1445,"children":1446},{"style":242},[1447],{"type":47,"value":1448},"section-editorial",{"type":42,"tag":220,"props":1450,"children":1451},{"style":236},[1452],{"type":47,"value":250},{"type":42,"tag":220,"props":1454,"children":1455},{"style":253},[1456],{"type":47,"value":1295},{"type":42,"tag":220,"props":1458,"children":1459},{"style":236},[1460],{"type":47,"value":261},{"type":42,"tag":220,"props":1462,"children":1463},{"style":264},[1464],{"type":47,"value":1465}," 160px",{"type":42,"tag":220,"props":1467,"children":1468},{"style":236},[1469],{"type":47,"value":272},{"type":42,"tag":220,"props":1471,"children":1472},{"style":236},[1473],{"type":47,"value":277},{"type":42,"tag":50,"props":1475,"children":1476},{},[1477,1482,1484,1490,1492,1498,1499,1505],{"type":42,"tag":165,"props":1478,"children":1479},{},[1480],{"type":47,"value":1481},"Duna's observed values",{"type":47,"value":1483},": ",{"type":42,"tag":73,"props":1485,"children":1487},{"className":1486},[],[1488],{"type":47,"value":1489},"128px 40px",{"type":47,"value":1491},", ",{"type":42,"tag":73,"props":1493,"children":1495},{"className":1494},[],[1496],{"type":47,"value":1497},"140px 40px",{"type":47,"value":1491},{"type":42,"tag":73,"props":1500,"children":1502},{"className":1501},[],[1503],{"type":47,"value":1504},"128px 40px 96px",{"type":47,"value":1506}," — vertical padding dominates, paired with fixed horizontal.",{"type":42,"tag":50,"props":1508,"children":1509},{},[1510,1515,1517,1523],{"type":42,"tag":165,"props":1511,"children":1512},{},[1513],{"type":47,"value":1514},"Incident \u002F AngelList",{"type":47,"value":1516},": section padding ranges ",{"type":42,"tag":73,"props":1518,"children":1520},{"className":1519},[],[1521],{"type":47,"value":1522},"80-160px",{"type":47,"value":1524}," fluid.",{"type":42,"tag":50,"props":1526,"children":1527},{},[1528,1533,1534,1540],{"type":42,"tag":165,"props":1529,"children":1530},{},[1531],{"type":47,"value":1532},"Amplemarket",{"type":47,"value":1483},{"type":42,"tag":73,"props":1535,"children":1537},{"className":1536},[],[1538],{"type":47,"value":1539},"120-200px",{"type":47,"value":1541}," on desktop.",{"type":42,"tag":153,"props":1543,"children":1545},{"id":1544},"rule-3-spacing-scales-include-non-4-multiples",[1546],{"type":47,"value":1547},"Rule 3: Spacing scales include non-4-multiples",{"type":42,"tag":50,"props":1549,"children":1550},{},[1551,1553,1558],{"type":47,"value":1552},"Strict 4\u002F8\u002F12\u002F16 multiples are a tell. Premium sites ",{"type":42,"tag":165,"props":1554,"children":1555},{},[1556],{"type":47,"value":1557},"include oddballs",{"type":47,"value":1559}," — 20, 28, 40, 64, 96, 128, 140.",{"type":42,"tag":50,"props":1561,"children":1562},{},[1563,1568],{"type":42,"tag":165,"props":1564,"children":1565},{},[1566],{"type":47,"value":1567},"Observed scales",{"type":47,"value":261},{"type":42,"tag":1570,"props":1571,"children":1572},"table",{},[1573,1592],{"type":42,"tag":1574,"props":1575,"children":1576},"thead",{},[1577],{"type":42,"tag":1578,"props":1579,"children":1580},"tr",{},[1581,1587],{"type":42,"tag":1582,"props":1583,"children":1584},"th",{},[1585],{"type":47,"value":1586},"Site",{"type":42,"tag":1582,"props":1588,"children":1589},{},[1590],{"type":47,"value":1591},"Spacing scale",{"type":42,"tag":1593,"props":1594,"children":1595},"tbody",{},[1596,1617,1637,1663,1681],{"type":42,"tag":1578,"props":1597,"children":1598},{},[1599,1605],{"type":42,"tag":1600,"props":1601,"children":1602},"td",{},[1603],{"type":47,"value":1604},"Duna",{"type":42,"tag":1600,"props":1606,"children":1607},{},[1608,1610,1615],{"type":47,"value":1609},"4, 8, 12, 16, ",{"type":42,"tag":165,"props":1611,"children":1612},{},[1613],{"type":47,"value":1614},"20",{"type":47,"value":1616},", 24, 40, 64, 80, 96, 128",{"type":42,"tag":1578,"props":1618,"children":1619},{},[1620,1625],{"type":42,"tag":1600,"props":1621,"children":1622},{},[1623],{"type":47,"value":1624},"Cal",{"type":42,"tag":1600,"props":1626,"children":1627},{},[1628,1630,1635],{"type":47,"value":1629},"4, 8, 12, 16, 24, ",{"type":42,"tag":165,"props":1631,"children":1632},{},[1633],{"type":47,"value":1634},"28",{"type":47,"value":1636},", 40",{"type":42,"tag":1578,"props":1638,"children":1639},{},[1640,1645],{"type":42,"tag":1600,"props":1641,"children":1642},{},[1643],{"type":47,"value":1644},"Hex",{"type":42,"tag":1600,"props":1646,"children":1647},{},[1648,1650,1655,1657,1661],{"type":47,"value":1649},"4, 8, ",{"type":42,"tag":165,"props":1651,"children":1652},{},[1653],{"type":47,"value":1654},"10",{"type":47,"value":1656},", 12, 16, ",{"type":42,"tag":165,"props":1658,"children":1659},{},[1660],{"type":47,"value":1614},{"type":47,"value":1662},", 24, 32, 40, 48, 60, 80, 120",{"type":42,"tag":1578,"props":1664,"children":1665},{},[1666,1671],{"type":42,"tag":1600,"props":1667,"children":1668},{},[1669],{"type":47,"value":1670},"Cohere",{"type":42,"tag":1600,"props":1672,"children":1673},{},[1674,1676],{"type":47,"value":1675},"4, 8, 12, 16, 20, 24, 32, 40, 48, 64, 80, 96, 128, ",{"type":42,"tag":165,"props":1677,"children":1678},{},[1679],{"type":47,"value":1680},"160",{"type":42,"tag":1578,"props":1682,"children":1683},{},[1684,1689],{"type":42,"tag":1600,"props":1685,"children":1686},{},[1687],{"type":47,"value":1688},"Antimetal",{"type":42,"tag":1600,"props":1690,"children":1691},{},[1692,1694,1700,1701,1707],{"type":47,"value":1693},"(Tailwind v4 arbitrary-multiples — ",{"type":42,"tag":73,"props":1695,"children":1697},{"className":1696},[],[1698],{"type":47,"value":1699},"w-120",{"type":47,"value":1491},{"type":42,"tag":73,"props":1702,"children":1704},{"className":1703},[],[1705],{"type":47,"value":1706},"calc(1120*1px)",{"type":47,"value":416},{"type":42,"tag":50,"props":1709,"children":1710},{},[1711,1716],{"type":42,"tag":165,"props":1712,"children":1713},{},[1714],{"type":47,"value":1715},"The 20px and 28px entries",{"type":47,"value":1717}," break the strict-4-multiples habit. Use them for:",{"type":42,"tag":63,"props":1719,"children":1720},{},[1721,1726],{"type":42,"tag":67,"props":1722,"children":1723},{},[1724],{"type":47,"value":1725},"20px: intermediate padding between \"tight\" (16px) and \"comfortable\" (24px)",{"type":42,"tag":67,"props":1727,"children":1728},{},[1729],{"type":47,"value":1730},"28px: h4 tier, card-body pairings",{"type":42,"tag":50,"props":1732,"children":1733},{},[1734,1735,1741],{"type":47,"value":1240},{"type":42,"tag":73,"props":1736,"children":1738},{"className":1737},[],[1739],{"type":47,"value":1740},"gap-4 p-4 m-4",{"type":47,"value":1742}," (Tailwind monotone).",{"type":42,"tag":153,"props":1744,"children":1746},{"id":1745},"rule-4-paragraph-spacing-is-explicit-and-generous",[1747],{"type":47,"value":1748},"Rule 4: Paragraph spacing is explicit and generous",{"type":42,"tag":50,"props":1750,"children":1751},{},[1752,1754,1759,1761,1766],{"type":47,"value":1753},"After ",{"type":42,"tag":73,"props":1755,"children":1757},{"className":1756},[],[1758],{"type":47,"value":56},{"type":47,"value":1760},", set a deliberate paragraph-spacing of ",{"type":42,"tag":165,"props":1762,"children":1763},{},[1764],{"type":47,"value":1765},"40px",{"type":47,"value":1767}," (Cal's observed default). Don't rely on margins from line-height.",{"type":42,"tag":209,"props":1769,"children":1771},{"className":211,"code":1770,"language":213,"meta":214,"style":214},"h2 { margin-block-end: 40px; }      \u002F* Cal's spec *\u002F\nh3 { margin-block-end: 24px; }\np + p { margin-block-start: 1.25em; }\n",[1772],{"type":42,"tag":73,"props":1773,"children":1774},{"__ignoreMap":214},[1775,1812,1844],{"type":42,"tag":220,"props":1776,"children":1777},{"class":222,"line":25},[1778,1782,1786,1791,1795,1799,1803,1807],{"type":42,"tag":220,"props":1779,"children":1780},{"style":242},[1781],{"type":47,"value":56},{"type":42,"tag":220,"props":1783,"children":1784},{"style":236},[1785],{"type":47,"value":250},{"type":42,"tag":220,"props":1787,"children":1788},{"style":253},[1789],{"type":47,"value":1790}," margin-block-end",{"type":42,"tag":220,"props":1792,"children":1793},{"style":236},[1794],{"type":47,"value":261},{"type":42,"tag":220,"props":1796,"children":1797},{"style":264},[1798],{"type":47,"value":1122},{"type":42,"tag":220,"props":1800,"children":1801},{"style":236},[1802],{"type":47,"value":272},{"type":42,"tag":220,"props":1804,"children":1805},{"style":236},[1806],{"type":47,"value":844},{"type":42,"tag":220,"props":1808,"children":1809},{"style":226},[1810],{"type":47,"value":1811},"      \u002F* Cal's spec *\u002F\n",{"type":42,"tag":220,"props":1813,"children":1814},{"class":222,"line":232},[1815,1819,1823,1827,1831,1836,1840],{"type":42,"tag":220,"props":1816,"children":1817},{"style":242},[1818],{"type":47,"value":153},{"type":42,"tag":220,"props":1820,"children":1821},{"style":236},[1822],{"type":47,"value":250},{"type":42,"tag":220,"props":1824,"children":1825},{"style":253},[1826],{"type":47,"value":1790},{"type":42,"tag":220,"props":1828,"children":1829},{"style":236},[1830],{"type":47,"value":261},{"type":42,"tag":220,"props":1832,"children":1833},{"style":264},[1834],{"type":47,"value":1835}," 24px",{"type":42,"tag":220,"props":1837,"children":1838},{"style":236},[1839],{"type":47,"value":272},{"type":42,"tag":220,"props":1841,"children":1842},{"style":236},[1843],{"type":47,"value":277},{"type":42,"tag":220,"props":1845,"children":1846},{"class":222,"line":280},[1847,1851,1856,1861,1865,1870,1874,1879,1883],{"type":42,"tag":220,"props":1848,"children":1849},{"style":242},[1850],{"type":47,"value":50},{"type":42,"tag":220,"props":1852,"children":1853},{"style":236},[1854],{"type":47,"value":1855}," +",{"type":42,"tag":220,"props":1857,"children":1858},{"style":242},[1859],{"type":47,"value":1860}," p",{"type":42,"tag":220,"props":1862,"children":1863},{"style":236},[1864],{"type":47,"value":250},{"type":42,"tag":220,"props":1866,"children":1867},{"style":253},[1868],{"type":47,"value":1869}," margin-block-start",{"type":42,"tag":220,"props":1871,"children":1872},{"style":236},[1873],{"type":47,"value":261},{"type":42,"tag":220,"props":1875,"children":1876},{"style":264},[1877],{"type":47,"value":1878}," 1.25em",{"type":42,"tag":220,"props":1880,"children":1881},{"style":236},[1882],{"type":47,"value":272},{"type":42,"tag":220,"props":1884,"children":1885},{"style":236},[1886],{"type":47,"value":277},{"type":42,"tag":50,"props":1888,"children":1889},{},[1890,1903],{"type":42,"tag":165,"props":1891,"children":1892},{},[1893,1895,1901],{"type":47,"value":1894},"Framer's ",{"type":42,"tag":73,"props":1896,"children":1898},{"className":1897},[],[1899],{"type":47,"value":1900},"paragraphSpacing",{"type":47,"value":1902}," pattern",{"type":47,"value":1904}," (from Cal.com and Duna):",{"type":42,"tag":209,"props":1906,"children":1908},{"className":211,"code":1907,"language":213,"meta":214,"style":214},"h2 { padding-block-end: 40px; }\np { padding-block-end: 20px; }\n",[1909],{"type":42,"tag":73,"props":1910,"children":1911},{"__ignoreMap":214},[1912,1944],{"type":42,"tag":220,"props":1913,"children":1914},{"class":222,"line":25},[1915,1919,1923,1928,1932,1936,1940],{"type":42,"tag":220,"props":1916,"children":1917},{"style":242},[1918],{"type":47,"value":56},{"type":42,"tag":220,"props":1920,"children":1921},{"style":236},[1922],{"type":47,"value":250},{"type":42,"tag":220,"props":1924,"children":1925},{"style":253},[1926],{"type":47,"value":1927}," padding-block-end",{"type":42,"tag":220,"props":1929,"children":1930},{"style":236},[1931],{"type":47,"value":261},{"type":42,"tag":220,"props":1933,"children":1934},{"style":264},[1935],{"type":47,"value":1122},{"type":42,"tag":220,"props":1937,"children":1938},{"style":236},[1939],{"type":47,"value":272},{"type":42,"tag":220,"props":1941,"children":1942},{"style":236},[1943],{"type":47,"value":277},{"type":42,"tag":220,"props":1945,"children":1946},{"class":222,"line":232},[1947,1951,1955,1959,1963,1967,1971],{"type":42,"tag":220,"props":1948,"children":1949},{"style":242},[1950],{"type":47,"value":50},{"type":42,"tag":220,"props":1952,"children":1953},{"style":236},[1954],{"type":47,"value":250},{"type":42,"tag":220,"props":1956,"children":1957},{"style":253},[1958],{"type":47,"value":1927},{"type":42,"tag":220,"props":1960,"children":1961},{"style":236},[1962],{"type":47,"value":261},{"type":42,"tag":220,"props":1964,"children":1965},{"style":264},[1966],{"type":47,"value":433},{"type":42,"tag":220,"props":1968,"children":1969},{"style":236},[1970],{"type":47,"value":272},{"type":42,"tag":220,"props":1972,"children":1973},{"style":236},[1974],{"type":47,"value":277},{"type":42,"tag":153,"props":1976,"children":1978},{"id":1977},"rule-5-container-widths-are-deliberate-and-1200-1280px-is-the-sweet-spot",[1979],{"type":47,"value":1980},"Rule 5: Container widths are deliberate, and 1200-1280px is the sweet spot",{"type":42,"tag":209,"props":1982,"children":1984},{"className":211,"code":1983,"language":213,"meta":214,"style":214},"\u002F* Most common premium width *\u002F\n.container { max-width: 1280px; margin-inline: auto; padding-inline: 24px; }\n\n\u002F* Reducto *\u002F\n.container-reducto { max-width: 1280px; }\n\n\u002F* Editorial\u002Freading *\u002F\n.container-prose { max-width: 720px; }\n\n\u002F* Feature\u002Fhero blocks *\u002F\n.container-wide { max-width: 1440px; }\n",[1985],{"type":42,"tag":73,"props":1986,"children":1987},{"__ignoreMap":214},[1988,1996,2069,2076,2084,2120,2127,2135,2172,2179,2187],{"type":42,"tag":220,"props":1989,"children":1990},{"class":222,"line":25},[1991],{"type":42,"tag":220,"props":1992,"children":1993},{"style":226},[1994],{"type":47,"value":1995},"\u002F* Most common premium width *\u002F\n",{"type":42,"tag":220,"props":1997,"children":1998},{"class":222,"line":232},[1999,2003,2008,2012,2017,2021,2026,2030,2035,2039,2044,2048,2053,2057,2061,2065],{"type":42,"tag":220,"props":2000,"children":2001},{"style":236},[2002],{"type":47,"value":239},{"type":42,"tag":220,"props":2004,"children":2005},{"style":242},[2006],{"type":47,"value":2007},"container",{"type":42,"tag":220,"props":2009,"children":2010},{"style":236},[2011],{"type":47,"value":250},{"type":42,"tag":220,"props":2013,"children":2014},{"style":253},[2015],{"type":47,"value":2016}," max-width",{"type":42,"tag":220,"props":2018,"children":2019},{"style":236},[2020],{"type":47,"value":261},{"type":42,"tag":220,"props":2022,"children":2023},{"style":264},[2024],{"type":47,"value":2025}," 1280px",{"type":42,"tag":220,"props":2027,"children":2028},{"style":236},[2029],{"type":47,"value":272},{"type":42,"tag":220,"props":2031,"children":2032},{"style":253},[2033],{"type":47,"value":2034}," margin-inline",{"type":42,"tag":220,"props":2036,"children":2037},{"style":236},[2038],{"type":47,"value":261},{"type":42,"tag":220,"props":2040,"children":2041},{"style":1197},[2042],{"type":47,"value":2043}," auto",{"type":42,"tag":220,"props":2045,"children":2046},{"style":236},[2047],{"type":47,"value":272},{"type":42,"tag":220,"props":2049,"children":2050},{"style":253},[2051],{"type":47,"value":2052}," padding-inline",{"type":42,"tag":220,"props":2054,"children":2055},{"style":236},[2056],{"type":47,"value":261},{"type":42,"tag":220,"props":2058,"children":2059},{"style":264},[2060],{"type":47,"value":1835},{"type":42,"tag":220,"props":2062,"children":2063},{"style":236},[2064],{"type":47,"value":272},{"type":42,"tag":220,"props":2066,"children":2067},{"style":236},[2068],{"type":47,"value":277},{"type":42,"tag":220,"props":2070,"children":2071},{"class":222,"line":280},[2072],{"type":42,"tag":220,"props":2073,"children":2074},{"emptyLinePlaceholder":665},[2075],{"type":47,"value":668},{"type":42,"tag":220,"props":2077,"children":2078},{"class":222,"line":289},[2079],{"type":42,"tag":220,"props":2080,"children":2081},{"style":226},[2082],{"type":47,"value":2083},"\u002F* Reducto *\u002F\n",{"type":42,"tag":220,"props":2085,"children":2086},{"class":222,"line":328},[2087,2091,2096,2100,2104,2108,2112,2116],{"type":42,"tag":220,"props":2088,"children":2089},{"style":236},[2090],{"type":47,"value":239},{"type":42,"tag":220,"props":2092,"children":2093},{"style":242},[2094],{"type":47,"value":2095},"container-reducto",{"type":42,"tag":220,"props":2097,"children":2098},{"style":236},[2099],{"type":47,"value":250},{"type":42,"tag":220,"props":2101,"children":2102},{"style":253},[2103],{"type":47,"value":2016},{"type":42,"tag":220,"props":2105,"children":2106},{"style":236},[2107],{"type":47,"value":261},{"type":42,"tag":220,"props":2109,"children":2110},{"style":264},[2111],{"type":47,"value":2025},{"type":42,"tag":220,"props":2113,"children":2114},{"style":236},[2115],{"type":47,"value":272},{"type":42,"tag":220,"props":2117,"children":2118},{"style":236},[2119],{"type":47,"value":277},{"type":42,"tag":220,"props":2121,"children":2122},{"class":222,"line":661},[2123],{"type":42,"tag":220,"props":2124,"children":2125},{"emptyLinePlaceholder":665},[2126],{"type":47,"value":668},{"type":42,"tag":220,"props":2128,"children":2129},{"class":222,"line":671},[2130],{"type":42,"tag":220,"props":2131,"children":2132},{"style":226},[2133],{"type":47,"value":2134},"\u002F* Editorial\u002Freading *\u002F\n",{"type":42,"tag":220,"props":2136,"children":2137},{"class":222,"line":680},[2138,2142,2147,2151,2155,2159,2164,2168],{"type":42,"tag":220,"props":2139,"children":2140},{"style":236},[2141],{"type":47,"value":239},{"type":42,"tag":220,"props":2143,"children":2144},{"style":242},[2145],{"type":47,"value":2146},"container-prose",{"type":42,"tag":220,"props":2148,"children":2149},{"style":236},[2150],{"type":47,"value":250},{"type":42,"tag":220,"props":2152,"children":2153},{"style":253},[2154],{"type":47,"value":2016},{"type":42,"tag":220,"props":2156,"children":2157},{"style":236},[2158],{"type":47,"value":261},{"type":42,"tag":220,"props":2160,"children":2161},{"style":264},[2162],{"type":47,"value":2163}," 720px",{"type":42,"tag":220,"props":2165,"children":2166},{"style":236},[2167],{"type":47,"value":272},{"type":42,"tag":220,"props":2169,"children":2170},{"style":236},[2171],{"type":47,"value":277},{"type":42,"tag":220,"props":2173,"children":2174},{"class":222,"line":729},[2175],{"type":42,"tag":220,"props":2176,"children":2177},{"emptyLinePlaceholder":665},[2178],{"type":47,"value":668},{"type":42,"tag":220,"props":2180,"children":2181},{"class":222,"line":738},[2182],{"type":42,"tag":220,"props":2183,"children":2184},{"style":226},[2185],{"type":47,"value":2186},"\u002F* Feature\u002Fhero blocks *\u002F\n",{"type":42,"tag":220,"props":2188,"children":2189},{"class":222,"line":1438},[2190,2194,2199,2203,2207,2211,2216,2220],{"type":42,"tag":220,"props":2191,"children":2192},{"style":236},[2193],{"type":47,"value":239},{"type":42,"tag":220,"props":2195,"children":2196},{"style":242},[2197],{"type":47,"value":2198},"container-wide",{"type":42,"tag":220,"props":2200,"children":2201},{"style":236},[2202],{"type":47,"value":250},{"type":42,"tag":220,"props":2204,"children":2205},{"style":253},[2206],{"type":47,"value":2016},{"type":42,"tag":220,"props":2208,"children":2209},{"style":236},[2210],{"type":47,"value":261},{"type":42,"tag":220,"props":2212,"children":2213},{"style":264},[2214],{"type":47,"value":2215}," 1440px",{"type":42,"tag":220,"props":2217,"children":2218},{"style":236},[2219],{"type":47,"value":272},{"type":42,"tag":220,"props":2221,"children":2222},{"style":236},[2223],{"type":47,"value":277},{"type":42,"tag":50,"props":2225,"children":2226},{},[2227,2232,2234,2240,2242,2246,2248,2254],{"type":42,"tag":165,"props":2228,"children":2229},{},[2230],{"type":47,"value":2231},"Outseta",{"type":47,"value":2233}," uses ",{"type":42,"tag":73,"props":2235,"children":2237},{"className":2236},[],[2238],{"type":47,"value":2239},"width: 88%",{"type":47,"value":2241}," of viewport (percent-based — more forgiving at wide screens).\n",{"type":42,"tag":165,"props":2243,"children":2244},{},[2245],{"type":47,"value":1688},{"type":47,"value":2247}," has multiple: ",{"type":42,"tag":73,"props":2249,"children":2251},{"className":2250},[],[2252],{"type":47,"value":2253},"400px, 568px, 768px, 992px, 1200px, 1536px",{"type":47,"value":239},{"type":42,"tag":50,"props":2256,"children":2257},{},[2258,2263],{"type":42,"tag":165,"props":2259,"children":2260},{},[2261],{"type":47,"value":2262},"Horizontal padding",{"type":47,"value":2264}," should scale with viewport:",{"type":42,"tag":209,"props":2266,"children":2268},{"className":211,"code":2267,"language":213,"meta":214,"style":214},".container {\n  padding-inline: clamp(16px, 4vw, 80px);\n}\n",[2269],{"type":42,"tag":73,"props":2270,"children":2271},{"__ignoreMap":214},[2272,2288,2338],{"type":42,"tag":220,"props":2273,"children":2274},{"class":222,"line":25},[2275,2279,2283],{"type":42,"tag":220,"props":2276,"children":2277},{"style":236},[2278],{"type":47,"value":239},{"type":42,"tag":220,"props":2280,"children":2281},{"style":242},[2282],{"type":47,"value":2007},{"type":42,"tag":220,"props":2284,"children":2285},{"style":236},[2286],{"type":47,"value":2287}," {\n",{"type":42,"tag":220,"props":2289,"children":2290},{"class":222,"line":232},[2291,2296,2300,2306,2310,2315,2320,2325,2329,2333],{"type":42,"tag":220,"props":2292,"children":2293},{"style":253},[2294],{"type":47,"value":2295},"  padding-inline",{"type":42,"tag":220,"props":2297,"children":2298},{"style":236},[2299],{"type":47,"value":261},{"type":42,"tag":220,"props":2301,"children":2303},{"style":2302},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[2304],{"type":47,"value":2305}," clamp",{"type":42,"tag":220,"props":2307,"children":2308},{"style":236},[2309],{"type":47,"value":406},{"type":42,"tag":220,"props":2311,"children":2312},{"style":264},[2313],{"type":47,"value":2314},"16px",{"type":42,"tag":220,"props":2316,"children":2317},{"style":236},[2318],{"type":47,"value":2319},",",{"type":42,"tag":220,"props":2321,"children":2322},{"style":264},[2323],{"type":47,"value":2324}," 4vw",{"type":42,"tag":220,"props":2326,"children":2327},{"style":236},[2328],{"type":47,"value":2319},{"type":42,"tag":220,"props":2330,"children":2331},{"style":264},[2332],{"type":47,"value":1304},{"type":42,"tag":220,"props":2334,"children":2335},{"style":236},[2336],{"type":47,"value":2337},");\n",{"type":42,"tag":220,"props":2339,"children":2340},{"class":222,"line":280},[2341],{"type":42,"tag":220,"props":2342,"children":2343},{"style":236},[2344],{"type":47,"value":2345},"}\n",{"type":42,"tag":153,"props":2347,"children":2349},{"id":2348},"rule-6-hairline-dividers-at-4-11-alpha-never-solid",[2350],{"type":47,"value":2351},"Rule 6: Hairline dividers at 4-11% alpha, never solid",{"type":42,"tag":50,"props":2353,"children":2354},{},[2355],{"type":47,"value":2356},"Premium sites use hairlines with LOW opacity:",{"type":42,"tag":209,"props":2358,"children":2360},{"className":211,"code":2359,"language":213,"meta":214,"style":214},"\u002F* Observed hairline tokens *\u002F\n--hairline-subtle:  rgba(0, 0, 0, 0.04);     \u002F* Duna *\u002F\n--hairline-light:   rgba(0, 0, 0, 0.06);     \u002F* Hex, most common *\u002F\n--hairline-medium:  rgba(0, 0, 0, 0.10);     \u002F* default *\u002F\n--hairline-navy:    rgba(12, 38, 77, 0.04);  \u002F* Antimetal (theme-tinted) *\u002F\n--hairline-warm:    rgba(0, 45, 51, 0.10);   \u002F* AngelList *\u002F\n\n\u002F* Use as 1px border *\u002F\nhr { border: 0; border-top: 1px solid var(--hairline-light); }\n\n\u002F* Better: use as box-shadow 1px ring (common pattern) *\u002F\n.card { box-shadow: 0 0 0 1px var(--hairline-light); }\n\n\u002F* Bottom-line shadow trick (AngelList's \"shadow-b\") *\u002F\n.nav-item { box-shadow: 0 1px 0 #002d331a; }\n",[2361],{"type":42,"tag":73,"props":2362,"children":2363},{"__ignoreMap":214},[2364,2372,2423,2473,2522,2574,2626,2633,2641,2712,2719,2727,2789,2797,2806],{"type":42,"tag":220,"props":2365,"children":2366},{"class":222,"line":25},[2367],{"type":42,"tag":220,"props":2368,"children":2369},{"style":226},[2370],{"type":47,"value":2371},"\u002F* Observed hairline tokens *\u002F\n",{"type":42,"tag":220,"props":2373,"children":2374},{"class":222,"line":232},[2375,2380,2384,2388,2392,2396,2400,2404,2408,2413,2418],{"type":42,"tag":220,"props":2376,"children":2377},{"style":1197},[2378],{"type":47,"value":2379},"--hairline-subtle:  rgba(0",{"type":42,"tag":220,"props":2381,"children":2382},{"style":236},[2383],{"type":47,"value":2319},{"type":42,"tag":220,"props":2385,"children":2386},{"style":1197},[2387],{"type":47,"value":267},{"type":42,"tag":220,"props":2389,"children":2390},{"style":236},[2391],{"type":47,"value":2319},{"type":42,"tag":220,"props":2393,"children":2394},{"style":1197},[2395],{"type":47,"value":267},{"type":42,"tag":220,"props":2397,"children":2398},{"style":236},[2399],{"type":47,"value":2319},{"type":42,"tag":220,"props":2401,"children":2402},{"style":1197},[2403],{"type":47,"value":267},{"type":42,"tag":220,"props":2405,"children":2406},{"style":236},[2407],{"type":47,"value":239},{"type":42,"tag":220,"props":2409,"children":2410},{"style":242},[2411],{"type":47,"value":2412},"04",{"type":42,"tag":220,"props":2414,"children":2415},{"style":1197},[2416],{"type":47,"value":2417},");     ",{"type":42,"tag":220,"props":2419,"children":2420},{"style":226},[2421],{"type":47,"value":2422},"\u002F* Duna *\u002F\n",{"type":42,"tag":220,"props":2424,"children":2425},{"class":222,"line":280},[2426,2431,2435,2439,2443,2447,2451,2455,2459,2464,2468],{"type":42,"tag":220,"props":2427,"children":2428},{"style":1197},[2429],{"type":47,"value":2430},"--hairline-light:   rgba(0",{"type":42,"tag":220,"props":2432,"children":2433},{"style":236},[2434],{"type":47,"value":2319},{"type":42,"tag":220,"props":2436,"children":2437},{"style":1197},[2438],{"type":47,"value":267},{"type":42,"tag":220,"props":2440,"children":2441},{"style":236},[2442],{"type":47,"value":2319},{"type":42,"tag":220,"props":2444,"children":2445},{"style":1197},[2446],{"type":47,"value":267},{"type":42,"tag":220,"props":2448,"children":2449},{"style":236},[2450],{"type":47,"value":2319},{"type":42,"tag":220,"props":2452,"children":2453},{"style":1197},[2454],{"type":47,"value":267},{"type":42,"tag":220,"props":2456,"children":2457},{"style":236},[2458],{"type":47,"value":239},{"type":42,"tag":220,"props":2460,"children":2461},{"style":242},[2462],{"type":47,"value":2463},"06",{"type":42,"tag":220,"props":2465,"children":2466},{"style":1197},[2467],{"type":47,"value":2417},{"type":42,"tag":220,"props":2469,"children":2470},{"style":226},[2471],{"type":47,"value":2472},"\u002F* Hex, most common *\u002F\n",{"type":42,"tag":220,"props":2474,"children":2475},{"class":222,"line":289},[2476,2481,2485,2489,2493,2497,2501,2505,2509,2513,2517],{"type":42,"tag":220,"props":2477,"children":2478},{"style":1197},[2479],{"type":47,"value":2480},"--hairline-medium:  rgba(0",{"type":42,"tag":220,"props":2482,"children":2483},{"style":236},[2484],{"type":47,"value":2319},{"type":42,"tag":220,"props":2486,"children":2487},{"style":1197},[2488],{"type":47,"value":267},{"type":42,"tag":220,"props":2490,"children":2491},{"style":236},[2492],{"type":47,"value":2319},{"type":42,"tag":220,"props":2494,"children":2495},{"style":1197},[2496],{"type":47,"value":267},{"type":42,"tag":220,"props":2498,"children":2499},{"style":236},[2500],{"type":47,"value":2319},{"type":42,"tag":220,"props":2502,"children":2503},{"style":1197},[2504],{"type":47,"value":267},{"type":42,"tag":220,"props":2506,"children":2507},{"style":236},[2508],{"type":47,"value":239},{"type":42,"tag":220,"props":2510,"children":2511},{"style":242},[2512],{"type":47,"value":1654},{"type":42,"tag":220,"props":2514,"children":2515},{"style":1197},[2516],{"type":47,"value":2417},{"type":42,"tag":220,"props":2518,"children":2519},{"style":226},[2520],{"type":47,"value":2521},"\u002F* default *\u002F\n",{"type":42,"tag":220,"props":2523,"children":2524},{"class":222,"line":328},[2525,2530,2534,2539,2543,2548,2552,2556,2560,2564,2569],{"type":42,"tag":220,"props":2526,"children":2527},{"style":1197},[2528],{"type":47,"value":2529},"--hairline-navy:    rgba(12",{"type":42,"tag":220,"props":2531,"children":2532},{"style":236},[2533],{"type":47,"value":2319},{"type":42,"tag":220,"props":2535,"children":2536},{"style":1197},[2537],{"type":47,"value":2538}," 38",{"type":42,"tag":220,"props":2540,"children":2541},{"style":236},[2542],{"type":47,"value":2319},{"type":42,"tag":220,"props":2544,"children":2545},{"style":1197},[2546],{"type":47,"value":2547}," 77",{"type":42,"tag":220,"props":2549,"children":2550},{"style":236},[2551],{"type":47,"value":2319},{"type":42,"tag":220,"props":2553,"children":2554},{"style":1197},[2555],{"type":47,"value":267},{"type":42,"tag":220,"props":2557,"children":2558},{"style":236},[2559],{"type":47,"value":239},{"type":42,"tag":220,"props":2561,"children":2562},{"style":242},[2563],{"type":47,"value":2412},{"type":42,"tag":220,"props":2565,"children":2566},{"style":1197},[2567],{"type":47,"value":2568},");  ",{"type":42,"tag":220,"props":2570,"children":2571},{"style":226},[2572],{"type":47,"value":2573},"\u002F* Antimetal (theme-tinted) *\u002F\n",{"type":42,"tag":220,"props":2575,"children":2576},{"class":222,"line":661},[2577,2582,2586,2591,2595,2600,2604,2608,2612,2616,2621],{"type":42,"tag":220,"props":2578,"children":2579},{"style":1197},[2580],{"type":47,"value":2581},"--hairline-warm:    rgba(0",{"type":42,"tag":220,"props":2583,"children":2584},{"style":236},[2585],{"type":47,"value":2319},{"type":42,"tag":220,"props":2587,"children":2588},{"style":1197},[2589],{"type":47,"value":2590}," 45",{"type":42,"tag":220,"props":2592,"children":2593},{"style":236},[2594],{"type":47,"value":2319},{"type":42,"tag":220,"props":2596,"children":2597},{"style":1197},[2598],{"type":47,"value":2599}," 51",{"type":42,"tag":220,"props":2601,"children":2602},{"style":236},[2603],{"type":47,"value":2319},{"type":42,"tag":220,"props":2605,"children":2606},{"style":1197},[2607],{"type":47,"value":267},{"type":42,"tag":220,"props":2609,"children":2610},{"style":236},[2611],{"type":47,"value":239},{"type":42,"tag":220,"props":2613,"children":2614},{"style":242},[2615],{"type":47,"value":1654},{"type":42,"tag":220,"props":2617,"children":2618},{"style":1197},[2619],{"type":47,"value":2620},");   ",{"type":42,"tag":220,"props":2622,"children":2623},{"style":226},[2624],{"type":47,"value":2625},"\u002F* AngelList *\u002F\n",{"type":42,"tag":220,"props":2627,"children":2628},{"class":222,"line":671},[2629],{"type":42,"tag":220,"props":2630,"children":2631},{"emptyLinePlaceholder":665},[2632],{"type":47,"value":668},{"type":42,"tag":220,"props":2634,"children":2635},{"class":222,"line":680},[2636],{"type":42,"tag":220,"props":2637,"children":2638},{"style":226},[2639],{"type":47,"value":2640},"\u002F* Use as 1px border *\u002F\n",{"type":42,"tag":220,"props":2642,"children":2643},{"class":222,"line":729},[2644,2649,2653,2658,2662,2666,2670,2675,2679,2684,2689,2694,2698,2703,2708],{"type":42,"tag":220,"props":2645,"children":2646},{"style":242},[2647],{"type":47,"value":2648},"hr",{"type":42,"tag":220,"props":2650,"children":2651},{"style":236},[2652],{"type":47,"value":250},{"type":42,"tag":220,"props":2654,"children":2655},{"style":253},[2656],{"type":47,"value":2657}," border",{"type":42,"tag":220,"props":2659,"children":2660},{"style":236},[2661],{"type":47,"value":261},{"type":42,"tag":220,"props":2663,"children":2664},{"style":264},[2665],{"type":47,"value":267},{"type":42,"tag":220,"props":2667,"children":2668},{"style":236},[2669],{"type":47,"value":272},{"type":42,"tag":220,"props":2671,"children":2672},{"style":253},[2673],{"type":47,"value":2674}," border-top",{"type":42,"tag":220,"props":2676,"children":2677},{"style":236},[2678],{"type":47,"value":261},{"type":42,"tag":220,"props":2680,"children":2681},{"style":264},[2682],{"type":47,"value":2683}," 1px",{"type":42,"tag":220,"props":2685,"children":2686},{"style":1197},[2687],{"type":47,"value":2688}," solid ",{"type":42,"tag":220,"props":2690,"children":2691},{"style":2302},[2692],{"type":47,"value":2693},"var",{"type":42,"tag":220,"props":2695,"children":2696},{"style":236},[2697],{"type":47,"value":406},{"type":42,"tag":220,"props":2699,"children":2700},{"style":1197},[2701],{"type":47,"value":2702},"--hairline-light",{"type":42,"tag":220,"props":2704,"children":2705},{"style":236},[2706],{"type":47,"value":2707},");",{"type":42,"tag":220,"props":2709,"children":2710},{"style":236},[2711],{"type":47,"value":277},{"type":42,"tag":220,"props":2713,"children":2714},{"class":222,"line":738},[2715],{"type":42,"tag":220,"props":2716,"children":2717},{"emptyLinePlaceholder":665},[2718],{"type":47,"value":668},{"type":42,"tag":220,"props":2720,"children":2721},{"class":222,"line":1438},[2722],{"type":42,"tag":220,"props":2723,"children":2724},{"style":226},[2725],{"type":47,"value":2726},"\u002F* Better: use as box-shadow 1px ring (common pattern) *\u002F\n",{"type":42,"tag":220,"props":2728,"children":2730},{"class":222,"line":2729},12,[2731,2735,2739,2743,2748,2752,2756,2760,2764,2768,2773,2777,2781,2785],{"type":42,"tag":220,"props":2732,"children":2733},{"style":236},[2734],{"type":47,"value":239},{"type":42,"tag":220,"props":2736,"children":2737},{"style":242},[2738],{"type":47,"value":245},{"type":42,"tag":220,"props":2740,"children":2741},{"style":236},[2742],{"type":47,"value":250},{"type":42,"tag":220,"props":2744,"children":2745},{"style":253},[2746],{"type":47,"value":2747}," box-shadow",{"type":42,"tag":220,"props":2749,"children":2750},{"style":236},[2751],{"type":47,"value":261},{"type":42,"tag":220,"props":2753,"children":2754},{"style":264},[2755],{"type":47,"value":267},{"type":42,"tag":220,"props":2757,"children":2758},{"style":264},[2759],{"type":47,"value":267},{"type":42,"tag":220,"props":2761,"children":2762},{"style":264},[2763],{"type":47,"value":267},{"type":42,"tag":220,"props":2765,"children":2766},{"style":264},[2767],{"type":47,"value":2683},{"type":42,"tag":220,"props":2769,"children":2770},{"style":2302},[2771],{"type":47,"value":2772}," var",{"type":42,"tag":220,"props":2774,"children":2775},{"style":236},[2776],{"type":47,"value":406},{"type":42,"tag":220,"props":2778,"children":2779},{"style":1197},[2780],{"type":47,"value":2702},{"type":42,"tag":220,"props":2782,"children":2783},{"style":236},[2784],{"type":47,"value":2707},{"type":42,"tag":220,"props":2786,"children":2787},{"style":236},[2788],{"type":47,"value":277},{"type":42,"tag":220,"props":2790,"children":2792},{"class":222,"line":2791},13,[2793],{"type":42,"tag":220,"props":2794,"children":2795},{"emptyLinePlaceholder":665},[2796],{"type":47,"value":668},{"type":42,"tag":220,"props":2798,"children":2800},{"class":222,"line":2799},14,[2801],{"type":42,"tag":220,"props":2802,"children":2803},{"style":226},[2804],{"type":47,"value":2805},"\u002F* Bottom-line shadow trick (AngelList's \"shadow-b\") *\u002F\n",{"type":42,"tag":220,"props":2807,"children":2809},{"class":222,"line":2808},15,[2810,2814,2819,2823,2827,2831,2835,2839,2843,2848,2853,2857],{"type":42,"tag":220,"props":2811,"children":2812},{"style":236},[2813],{"type":47,"value":239},{"type":42,"tag":220,"props":2815,"children":2816},{"style":242},[2817],{"type":47,"value":2818},"nav-item",{"type":42,"tag":220,"props":2820,"children":2821},{"style":236},[2822],{"type":47,"value":250},{"type":42,"tag":220,"props":2824,"children":2825},{"style":253},[2826],{"type":47,"value":2747},{"type":42,"tag":220,"props":2828,"children":2829},{"style":236},[2830],{"type":47,"value":261},{"type":42,"tag":220,"props":2832,"children":2833},{"style":264},[2834],{"type":47,"value":267},{"type":42,"tag":220,"props":2836,"children":2837},{"style":264},[2838],{"type":47,"value":2683},{"type":42,"tag":220,"props":2840,"children":2841},{"style":264},[2842],{"type":47,"value":267},{"type":42,"tag":220,"props":2844,"children":2845},{"style":236},[2846],{"type":47,"value":2847}," #",{"type":42,"tag":220,"props":2849,"children":2850},{"style":1197},[2851],{"type":47,"value":2852},"002d331a",{"type":42,"tag":220,"props":2854,"children":2855},{"style":236},[2856],{"type":47,"value":272},{"type":42,"tag":220,"props":2858,"children":2859},{"style":236},[2860],{"type":47,"value":277},{"type":42,"tag":50,"props":2862,"children":2863},{},[2864,2865,2871],{"type":47,"value":1240},{"type":42,"tag":73,"props":2866,"children":2868},{"className":2867},[],[2869],{"type":47,"value":2870},"border: 1px solid #e5e7eb",{"type":47,"value":2872}," (cold\u002Fgeneric).",{"type":42,"tag":153,"props":2874,"children":2876},{"id":2875},"rule-7-grid-gaps-match-typographic-rhythm",[2877],{"type":47,"value":2878},"Rule 7: Grid gaps match typographic rhythm",{"type":42,"tag":50,"props":2880,"children":2881},{},[2882],{"type":47,"value":2883},"Gaps between cards should echo the spacing of text below them. Options:",{"type":42,"tag":209,"props":2885,"children":2887},{"className":211,"code":2886,"language":213,"meta":214,"style":214},"\u002F* Tight editorial grid (like a newspaper) — 8-12px gaps *\u002F\n.grid-editorial { gap: 12px; }\n\n\u002F* Standard content grid — 16-24px *\u002F\n.grid-cards { gap: 24px; }\n\n\u002F* Spacious feature grid — 32-48px *\u002F\n.grid-features { gap: 40px; }\n",[2888],{"type":42,"tag":73,"props":2889,"children":2890},{"__ignoreMap":214},[2891,2899,2936,2943,2951,2987,2994,3002],{"type":42,"tag":220,"props":2892,"children":2893},{"class":222,"line":25},[2894],{"type":42,"tag":220,"props":2895,"children":2896},{"style":226},[2897],{"type":47,"value":2898},"\u002F* Tight editorial grid (like a newspaper) — 8-12px gaps *\u002F\n",{"type":42,"tag":220,"props":2900,"children":2901},{"class":222,"line":232},[2902,2906,2911,2915,2920,2924,2928,2932],{"type":42,"tag":220,"props":2903,"children":2904},{"style":236},[2905],{"type":47,"value":239},{"type":42,"tag":220,"props":2907,"children":2908},{"style":242},[2909],{"type":47,"value":2910},"grid-editorial",{"type":42,"tag":220,"props":2912,"children":2913},{"style":236},[2914],{"type":47,"value":250},{"type":42,"tag":220,"props":2916,"children":2917},{"style":253},[2918],{"type":47,"value":2919}," gap",{"type":42,"tag":220,"props":2921,"children":2922},{"style":236},[2923],{"type":47,"value":261},{"type":42,"tag":220,"props":2925,"children":2926},{"style":264},[2927],{"type":47,"value":920},{"type":42,"tag":220,"props":2929,"children":2930},{"style":236},[2931],{"type":47,"value":272},{"type":42,"tag":220,"props":2933,"children":2934},{"style":236},[2935],{"type":47,"value":277},{"type":42,"tag":220,"props":2937,"children":2938},{"class":222,"line":280},[2939],{"type":42,"tag":220,"props":2940,"children":2941},{"emptyLinePlaceholder":665},[2942],{"type":47,"value":668},{"type":42,"tag":220,"props":2944,"children":2945},{"class":222,"line":289},[2946],{"type":42,"tag":220,"props":2947,"children":2948},{"style":226},[2949],{"type":47,"value":2950},"\u002F* Standard content grid — 16-24px *\u002F\n",{"type":42,"tag":220,"props":2952,"children":2953},{"class":222,"line":328},[2954,2958,2963,2967,2971,2975,2979,2983],{"type":42,"tag":220,"props":2955,"children":2956},{"style":236},[2957],{"type":47,"value":239},{"type":42,"tag":220,"props":2959,"children":2960},{"style":242},[2961],{"type":47,"value":2962},"grid-cards",{"type":42,"tag":220,"props":2964,"children":2965},{"style":236},[2966],{"type":47,"value":250},{"type":42,"tag":220,"props":2968,"children":2969},{"style":253},[2970],{"type":47,"value":2919},{"type":42,"tag":220,"props":2972,"children":2973},{"style":236},[2974],{"type":47,"value":261},{"type":42,"tag":220,"props":2976,"children":2977},{"style":264},[2978],{"type":47,"value":1835},{"type":42,"tag":220,"props":2980,"children":2981},{"style":236},[2982],{"type":47,"value":272},{"type":42,"tag":220,"props":2984,"children":2985},{"style":236},[2986],{"type":47,"value":277},{"type":42,"tag":220,"props":2988,"children":2989},{"class":222,"line":661},[2990],{"type":42,"tag":220,"props":2991,"children":2992},{"emptyLinePlaceholder":665},[2993],{"type":47,"value":668},{"type":42,"tag":220,"props":2995,"children":2996},{"class":222,"line":671},[2997],{"type":42,"tag":220,"props":2998,"children":2999},{"style":226},[3000],{"type":47,"value":3001},"\u002F* Spacious feature grid — 32-48px *\u002F\n",{"type":42,"tag":220,"props":3003,"children":3004},{"class":222,"line":680},[3005,3009,3014,3018,3022,3026,3030,3034],{"type":42,"tag":220,"props":3006,"children":3007},{"style":236},[3008],{"type":47,"value":239},{"type":42,"tag":220,"props":3010,"children":3011},{"style":242},[3012],{"type":47,"value":3013},"grid-features",{"type":42,"tag":220,"props":3015,"children":3016},{"style":236},[3017],{"type":47,"value":250},{"type":42,"tag":220,"props":3019,"children":3020},{"style":253},[3021],{"type":47,"value":2919},{"type":42,"tag":220,"props":3023,"children":3024},{"style":236},[3025],{"type":47,"value":261},{"type":42,"tag":220,"props":3027,"children":3028},{"style":264},[3029],{"type":47,"value":1122},{"type":42,"tag":220,"props":3031,"children":3032},{"style":236},[3033],{"type":47,"value":272},{"type":42,"tag":220,"props":3035,"children":3036},{"style":236},[3037],{"type":47,"value":277},{"type":42,"tag":50,"props":3039,"children":3040},{},[3041,3046,3048,3054,3056,3062,3064,3069],{"type":42,"tag":165,"props":3042,"children":3043},{},[3044],{"type":47,"value":3045},"Reducto",{"type":47,"value":3047}," uses tight ",{"type":42,"tag":73,"props":3049,"children":3051},{"className":3050},[],[3052],{"type":47,"value":3053},"2-16px",{"type":47,"value":3055}," gaps between components with generous ",{"type":42,"tag":73,"props":3057,"children":3059},{"className":3058},[],[3060],{"type":47,"value":3061},"py-16 to py-32",{"type":47,"value":3063}," section padding — ",{"type":42,"tag":165,"props":3065,"children":3066},{},[3067],{"type":47,"value":3068},"small gaps, big sections",{"type":47,"value":3070}," is a deliberate rhythm.",{"type":42,"tag":50,"props":3072,"children":3073},{},[3074,3079],{"type":42,"tag":165,"props":3075,"children":3076},{},[3077],{"type":47,"value":3078},"AngelList",{"type":47,"value":3080}," has tight internal content with giant section breaks.",{"type":42,"tag":56,"props":3082,"children":3084},{"id":3083},"complete-spacing-system-starter",[3085],{"type":47,"value":3086},"Complete spacing system starter",{"type":42,"tag":209,"props":3088,"children":3090},{"className":211,"code":3089,"language":213,"meta":214,"style":214},":root {\n  \u002F* Spacing scale — includes non-4 multiples *\u002F\n  --space-1:  4px;\n  --space-2:  8px;\n  --space-3:  12px;\n  --space-4:  16px;\n  --space-5:  20px;    \u002F* breaker *\u002F\n  --space-6:  24px;\n  --space-7:  28px;    \u002F* breaker *\u002F\n  --space-8:  32px;\n  --space-10: 40px;\n  --space-12: 48px;\n  --space-16: 64px;\n  --space-20: 80px;\n  --space-24: 96px;\n  --space-32: 128px;\n  --space-40: 160px;\n\n  \u002F* Section padding presets *\u002F\n  --section-py-tight:    var(--space-20);   \u002F* 80px *\u002F\n  --section-py-default:  var(--space-24);   \u002F* 96px *\u002F\n  --section-py-generous: var(--space-32);   \u002F* 128px *\u002F\n  --section-py-hero:     var(--space-40);   \u002F* 160px *\u002F\n\n  \u002F* Container widths *\u002F\n  --container-prose:  720px;\n  --container-main:   1280px;\n  --container-wide:   1440px;\n\n  \u002F* Radius system (per-element) *\u002F\n  --radius-chip:   2px;\n  --radius-input:  8px;\n  --radius-card:   12px;\n  --radius-large:  20px;\n  --radius-hero:   40px;\n  --radius-pill:   9999px;\n\n  \u002F* Hairlines *\u002F\n  --hairline: rgba(0, 0, 0, 0.06);\n}\n\n\u002F* Layout primitives *\u002F\n.container {\n  max-width: var(--container-main);\n  margin-inline: auto;\n  padding-inline: clamp(16px, 4vw, 80px);\n}\n\n.section {\n  padding-block: var(--section-py-default);\n}\n.section--hero      { padding-block: var(--section-py-hero) var(--space-24); }\n.section--generous  { padding-block: var(--section-py-generous); }\n\n\u002F* Typographic rhythm *\u002F\nh2 { margin-block-end: 40px; }\nh3 { margin-block-end: 24px; }\np  { margin-block-end: 20px; }\np:last-child { margin-block-end: 0; }\n\n\u002F* Hairlines *\u002F\n.divider { height: 1px; background: var(--hairline); border: 0; }\n.card    { box-shadow: 0 0 0 1px var(--hairline); }\n",[3091],{"type":42,"tag":73,"props":3092,"children":3093},{"__ignoreMap":214},[3094,3109,3117,3139,3160,3181,3202,3228,3249,3274,3295,3315,3336,3357,3377,3397,3419,3440,3448,3457,3493,3529,3564,3600,3608,3617,3639,3661,3683,3691,3700,3722,3743,3765,3786,3808,3830,3838,3847,3902,3910,3918,3927,3943,3973,3994,4038,4046,4054,4070,4100,4108,4170,4216,4224,4233,4265,4297,4329,4370,4378,4387,4467],{"type":42,"tag":220,"props":3095,"children":3096},{"class":222,"line":25},[3097,3101,3105],{"type":42,"tag":220,"props":3098,"children":3099},{"style":236},[3100],{"type":47,"value":261},{"type":42,"tag":220,"props":3102,"children":3103},{"style":398},[3104],{"type":47,"value":39},{"type":42,"tag":220,"props":3106,"children":3107},{"style":236},[3108],{"type":47,"value":2287},{"type":42,"tag":220,"props":3110,"children":3111},{"class":222,"line":232},[3112],{"type":42,"tag":220,"props":3113,"children":3114},{"style":226},[3115],{"type":47,"value":3116},"  \u002F* Spacing scale — includes non-4 multiples *\u002F\n",{"type":42,"tag":220,"props":3118,"children":3119},{"class":222,"line":280},[3120,3125,3129,3134],{"type":42,"tag":220,"props":3121,"children":3122},{"style":1197},[3123],{"type":47,"value":3124},"  --space-1",{"type":42,"tag":220,"props":3126,"children":3127},{"style":236},[3128],{"type":47,"value":261},{"type":42,"tag":220,"props":3130,"children":3131},{"style":264},[3132],{"type":47,"value":3133},"  4px",{"type":42,"tag":220,"props":3135,"children":3136},{"style":236},[3137],{"type":47,"value":3138},";\n",{"type":42,"tag":220,"props":3140,"children":3141},{"class":222,"line":289},[3142,3147,3151,3156],{"type":42,"tag":220,"props":3143,"children":3144},{"style":1197},[3145],{"type":47,"value":3146},"  --space-2",{"type":42,"tag":220,"props":3148,"children":3149},{"style":236},[3150],{"type":47,"value":261},{"type":42,"tag":220,"props":3152,"children":3153},{"style":264},[3154],{"type":47,"value":3155},"  8px",{"type":42,"tag":220,"props":3157,"children":3158},{"style":236},[3159],{"type":47,"value":3138},{"type":42,"tag":220,"props":3161,"children":3162},{"class":222,"line":328},[3163,3168,3172,3177],{"type":42,"tag":220,"props":3164,"children":3165},{"style":1197},[3166],{"type":47,"value":3167},"  --space-3",{"type":42,"tag":220,"props":3169,"children":3170},{"style":236},[3171],{"type":47,"value":261},{"type":42,"tag":220,"props":3173,"children":3174},{"style":264},[3175],{"type":47,"value":3176},"  12px",{"type":42,"tag":220,"props":3178,"children":3179},{"style":236},[3180],{"type":47,"value":3138},{"type":42,"tag":220,"props":3182,"children":3183},{"class":222,"line":661},[3184,3189,3193,3198],{"type":42,"tag":220,"props":3185,"children":3186},{"style":1197},[3187],{"type":47,"value":3188},"  --space-4",{"type":42,"tag":220,"props":3190,"children":3191},{"style":236},[3192],{"type":47,"value":261},{"type":42,"tag":220,"props":3194,"children":3195},{"style":264},[3196],{"type":47,"value":3197},"  16px",{"type":42,"tag":220,"props":3199,"children":3200},{"style":236},[3201],{"type":47,"value":3138},{"type":42,"tag":220,"props":3203,"children":3204},{"class":222,"line":671},[3205,3210,3214,3219,3223],{"type":42,"tag":220,"props":3206,"children":3207},{"style":1197},[3208],{"type":47,"value":3209},"  --space-5",{"type":42,"tag":220,"props":3211,"children":3212},{"style":236},[3213],{"type":47,"value":261},{"type":42,"tag":220,"props":3215,"children":3216},{"style":264},[3217],{"type":47,"value":3218},"  20px",{"type":42,"tag":220,"props":3220,"children":3221},{"style":236},[3222],{"type":47,"value":272},{"type":42,"tag":220,"props":3224,"children":3225},{"style":226},[3226],{"type":47,"value":3227},"    \u002F* breaker *\u002F\n",{"type":42,"tag":220,"props":3229,"children":3230},{"class":222,"line":680},[3231,3236,3240,3245],{"type":42,"tag":220,"props":3232,"children":3233},{"style":1197},[3234],{"type":47,"value":3235},"  --space-6",{"type":42,"tag":220,"props":3237,"children":3238},{"style":236},[3239],{"type":47,"value":261},{"type":42,"tag":220,"props":3241,"children":3242},{"style":264},[3243],{"type":47,"value":3244},"  24px",{"type":42,"tag":220,"props":3246,"children":3247},{"style":236},[3248],{"type":47,"value":3138},{"type":42,"tag":220,"props":3250,"children":3251},{"class":222,"line":729},[3252,3257,3261,3266,3270],{"type":42,"tag":220,"props":3253,"children":3254},{"style":1197},[3255],{"type":47,"value":3256},"  --space-7",{"type":42,"tag":220,"props":3258,"children":3259},{"style":236},[3260],{"type":47,"value":261},{"type":42,"tag":220,"props":3262,"children":3263},{"style":264},[3264],{"type":47,"value":3265},"  28px",{"type":42,"tag":220,"props":3267,"children":3268},{"style":236},[3269],{"type":47,"value":272},{"type":42,"tag":220,"props":3271,"children":3272},{"style":226},[3273],{"type":47,"value":3227},{"type":42,"tag":220,"props":3275,"children":3276},{"class":222,"line":738},[3277,3282,3286,3291],{"type":42,"tag":220,"props":3278,"children":3279},{"style":1197},[3280],{"type":47,"value":3281},"  --space-8",{"type":42,"tag":220,"props":3283,"children":3284},{"style":236},[3285],{"type":47,"value":261},{"type":42,"tag":220,"props":3287,"children":3288},{"style":264},[3289],{"type":47,"value":3290},"  32px",{"type":42,"tag":220,"props":3292,"children":3293},{"style":236},[3294],{"type":47,"value":3138},{"type":42,"tag":220,"props":3296,"children":3297},{"class":222,"line":1438},[3298,3303,3307,3311],{"type":42,"tag":220,"props":3299,"children":3300},{"style":1197},[3301],{"type":47,"value":3302},"  --space-10",{"type":42,"tag":220,"props":3304,"children":3305},{"style":236},[3306],{"type":47,"value":261},{"type":42,"tag":220,"props":3308,"children":3309},{"style":264},[3310],{"type":47,"value":1122},{"type":42,"tag":220,"props":3312,"children":3313},{"style":236},[3314],{"type":47,"value":3138},{"type":42,"tag":220,"props":3316,"children":3317},{"class":222,"line":2729},[3318,3323,3327,3332],{"type":42,"tag":220,"props":3319,"children":3320},{"style":1197},[3321],{"type":47,"value":3322},"  --space-12",{"type":42,"tag":220,"props":3324,"children":3325},{"style":236},[3326],{"type":47,"value":261},{"type":42,"tag":220,"props":3328,"children":3329},{"style":264},[3330],{"type":47,"value":3331}," 48px",{"type":42,"tag":220,"props":3333,"children":3334},{"style":236},[3335],{"type":47,"value":3138},{"type":42,"tag":220,"props":3337,"children":3338},{"class":222,"line":2791},[3339,3344,3348,3353],{"type":42,"tag":220,"props":3340,"children":3341},{"style":1197},[3342],{"type":47,"value":3343},"  --space-16",{"type":42,"tag":220,"props":3345,"children":3346},{"style":236},[3347],{"type":47,"value":261},{"type":42,"tag":220,"props":3349,"children":3350},{"style":264},[3351],{"type":47,"value":3352}," 64px",{"type":42,"tag":220,"props":3354,"children":3355},{"style":236},[3356],{"type":47,"value":3138},{"type":42,"tag":220,"props":3358,"children":3359},{"class":222,"line":2799},[3360,3365,3369,3373],{"type":42,"tag":220,"props":3361,"children":3362},{"style":1197},[3363],{"type":47,"value":3364},"  --space-20",{"type":42,"tag":220,"props":3366,"children":3367},{"style":236},[3368],{"type":47,"value":261},{"type":42,"tag":220,"props":3370,"children":3371},{"style":264},[3372],{"type":47,"value":1304},{"type":42,"tag":220,"props":3374,"children":3375},{"style":236},[3376],{"type":47,"value":3138},{"type":42,"tag":220,"props":3378,"children":3379},{"class":222,"line":2808},[3380,3385,3389,3393],{"type":42,"tag":220,"props":3381,"children":3382},{"style":1197},[3383],{"type":47,"value":3384},"  --space-24",{"type":42,"tag":220,"props":3386,"children":3387},{"style":236},[3388],{"type":47,"value":261},{"type":42,"tag":220,"props":3390,"children":3391},{"style":264},[3392],{"type":47,"value":1412},{"type":42,"tag":220,"props":3394,"children":3395},{"style":236},[3396],{"type":47,"value":3138},{"type":42,"tag":220,"props":3398,"children":3400},{"class":222,"line":3399},16,[3401,3406,3410,3415],{"type":42,"tag":220,"props":3402,"children":3403},{"style":1197},[3404],{"type":47,"value":3405},"  --space-32",{"type":42,"tag":220,"props":3407,"children":3408},{"style":236},[3409],{"type":47,"value":261},{"type":42,"tag":220,"props":3411,"children":3412},{"style":264},[3413],{"type":47,"value":3414}," 128px",{"type":42,"tag":220,"props":3416,"children":3417},{"style":236},[3418],{"type":47,"value":3138},{"type":42,"tag":220,"props":3420,"children":3422},{"class":222,"line":3421},17,[3423,3428,3432,3436],{"type":42,"tag":220,"props":3424,"children":3425},{"style":1197},[3426],{"type":47,"value":3427},"  --space-40",{"type":42,"tag":220,"props":3429,"children":3430},{"style":236},[3431],{"type":47,"value":261},{"type":42,"tag":220,"props":3433,"children":3434},{"style":264},[3435],{"type":47,"value":1465},{"type":42,"tag":220,"props":3437,"children":3438},{"style":236},[3439],{"type":47,"value":3138},{"type":42,"tag":220,"props":3441,"children":3443},{"class":222,"line":3442},18,[3444],{"type":42,"tag":220,"props":3445,"children":3446},{"emptyLinePlaceholder":665},[3447],{"type":47,"value":668},{"type":42,"tag":220,"props":3449,"children":3451},{"class":222,"line":3450},19,[3452],{"type":42,"tag":220,"props":3453,"children":3454},{"style":226},[3455],{"type":47,"value":3456},"  \u002F* Section padding presets *\u002F\n",{"type":42,"tag":220,"props":3458,"children":3460},{"class":222,"line":3459},20,[3461,3466,3470,3475,3479,3484,3488],{"type":42,"tag":220,"props":3462,"children":3463},{"style":1197},[3464],{"type":47,"value":3465},"  --section-py-tight",{"type":42,"tag":220,"props":3467,"children":3468},{"style":236},[3469],{"type":47,"value":261},{"type":42,"tag":220,"props":3471,"children":3472},{"style":2302},[3473],{"type":47,"value":3474},"    var",{"type":42,"tag":220,"props":3476,"children":3477},{"style":236},[3478],{"type":47,"value":406},{"type":42,"tag":220,"props":3480,"children":3481},{"style":1197},[3482],{"type":47,"value":3483},"--space-20",{"type":42,"tag":220,"props":3485,"children":3486},{"style":236},[3487],{"type":47,"value":2707},{"type":42,"tag":220,"props":3489,"children":3490},{"style":226},[3491],{"type":47,"value":3492},"   \u002F* 80px *\u002F\n",{"type":42,"tag":220,"props":3494,"children":3496},{"class":222,"line":3495},21,[3497,3502,3506,3511,3515,3520,3524],{"type":42,"tag":220,"props":3498,"children":3499},{"style":1197},[3500],{"type":47,"value":3501},"  --section-py-default",{"type":42,"tag":220,"props":3503,"children":3504},{"style":236},[3505],{"type":47,"value":261},{"type":42,"tag":220,"props":3507,"children":3508},{"style":2302},[3509],{"type":47,"value":3510},"  var",{"type":42,"tag":220,"props":3512,"children":3513},{"style":236},[3514],{"type":47,"value":406},{"type":42,"tag":220,"props":3516,"children":3517},{"style":1197},[3518],{"type":47,"value":3519},"--space-24",{"type":42,"tag":220,"props":3521,"children":3522},{"style":236},[3523],{"type":47,"value":2707},{"type":42,"tag":220,"props":3525,"children":3526},{"style":226},[3527],{"type":47,"value":3528},"   \u002F* 96px *\u002F\n",{"type":42,"tag":220,"props":3530,"children":3532},{"class":222,"line":3531},22,[3533,3538,3542,3546,3550,3555,3559],{"type":42,"tag":220,"props":3534,"children":3535},{"style":1197},[3536],{"type":47,"value":3537},"  --section-py-generous",{"type":42,"tag":220,"props":3539,"children":3540},{"style":236},[3541],{"type":47,"value":261},{"type":42,"tag":220,"props":3543,"children":3544},{"style":2302},[3545],{"type":47,"value":2772},{"type":42,"tag":220,"props":3547,"children":3548},{"style":236},[3549],{"type":47,"value":406},{"type":42,"tag":220,"props":3551,"children":3552},{"style":1197},[3553],{"type":47,"value":3554},"--space-32",{"type":42,"tag":220,"props":3556,"children":3557},{"style":236},[3558],{"type":47,"value":2707},{"type":42,"tag":220,"props":3560,"children":3561},{"style":226},[3562],{"type":47,"value":3563},"   \u002F* 128px *\u002F\n",{"type":42,"tag":220,"props":3565,"children":3567},{"class":222,"line":3566},23,[3568,3573,3577,3582,3586,3591,3595],{"type":42,"tag":220,"props":3569,"children":3570},{"style":1197},[3571],{"type":47,"value":3572},"  --section-py-hero",{"type":42,"tag":220,"props":3574,"children":3575},{"style":236},[3576],{"type":47,"value":261},{"type":42,"tag":220,"props":3578,"children":3579},{"style":2302},[3580],{"type":47,"value":3581},"     var",{"type":42,"tag":220,"props":3583,"children":3584},{"style":236},[3585],{"type":47,"value":406},{"type":42,"tag":220,"props":3587,"children":3588},{"style":1197},[3589],{"type":47,"value":3590},"--space-40",{"type":42,"tag":220,"props":3592,"children":3593},{"style":236},[3594],{"type":47,"value":2707},{"type":42,"tag":220,"props":3596,"children":3597},{"style":226},[3598],{"type":47,"value":3599},"   \u002F* 160px *\u002F\n",{"type":42,"tag":220,"props":3601,"children":3603},{"class":222,"line":3602},24,[3604],{"type":42,"tag":220,"props":3605,"children":3606},{"emptyLinePlaceholder":665},[3607],{"type":47,"value":668},{"type":42,"tag":220,"props":3609,"children":3611},{"class":222,"line":3610},25,[3612],{"type":42,"tag":220,"props":3613,"children":3614},{"style":226},[3615],{"type":47,"value":3616},"  \u002F* Container widths *\u002F\n",{"type":42,"tag":220,"props":3618,"children":3620},{"class":222,"line":3619},26,[3621,3626,3630,3635],{"type":42,"tag":220,"props":3622,"children":3623},{"style":1197},[3624],{"type":47,"value":3625},"  --container-prose",{"type":42,"tag":220,"props":3627,"children":3628},{"style":236},[3629],{"type":47,"value":261},{"type":42,"tag":220,"props":3631,"children":3632},{"style":264},[3633],{"type":47,"value":3634},"  720px",{"type":42,"tag":220,"props":3636,"children":3637},{"style":236},[3638],{"type":47,"value":3138},{"type":42,"tag":220,"props":3640,"children":3642},{"class":222,"line":3641},27,[3643,3648,3652,3657],{"type":42,"tag":220,"props":3644,"children":3645},{"style":1197},[3646],{"type":47,"value":3647},"  --container-main",{"type":42,"tag":220,"props":3649,"children":3650},{"style":236},[3651],{"type":47,"value":261},{"type":42,"tag":220,"props":3653,"children":3654},{"style":264},[3655],{"type":47,"value":3656},"   1280px",{"type":42,"tag":220,"props":3658,"children":3659},{"style":236},[3660],{"type":47,"value":3138},{"type":42,"tag":220,"props":3662,"children":3664},{"class":222,"line":3663},28,[3665,3670,3674,3679],{"type":42,"tag":220,"props":3666,"children":3667},{"style":1197},[3668],{"type":47,"value":3669},"  --container-wide",{"type":42,"tag":220,"props":3671,"children":3672},{"style":236},[3673],{"type":47,"value":261},{"type":42,"tag":220,"props":3675,"children":3676},{"style":264},[3677],{"type":47,"value":3678},"   1440px",{"type":42,"tag":220,"props":3680,"children":3681},{"style":236},[3682],{"type":47,"value":3138},{"type":42,"tag":220,"props":3684,"children":3686},{"class":222,"line":3685},29,[3687],{"type":42,"tag":220,"props":3688,"children":3689},{"emptyLinePlaceholder":665},[3690],{"type":47,"value":668},{"type":42,"tag":220,"props":3692,"children":3694},{"class":222,"line":3693},30,[3695],{"type":42,"tag":220,"props":3696,"children":3697},{"style":226},[3698],{"type":47,"value":3699},"  \u002F* Radius system (per-element) *\u002F\n",{"type":42,"tag":220,"props":3701,"children":3703},{"class":222,"line":3702},31,[3704,3709,3713,3718],{"type":42,"tag":220,"props":3705,"children":3706},{"style":1197},[3707],{"type":47,"value":3708},"  --radius-chip",{"type":42,"tag":220,"props":3710,"children":3711},{"style":236},[3712],{"type":47,"value":261},{"type":42,"tag":220,"props":3714,"children":3715},{"style":264},[3716],{"type":47,"value":3717},"   2px",{"type":42,"tag":220,"props":3719,"children":3720},{"style":236},[3721],{"type":47,"value":3138},{"type":42,"tag":220,"props":3723,"children":3725},{"class":222,"line":3724},32,[3726,3731,3735,3739],{"type":42,"tag":220,"props":3727,"children":3728},{"style":1197},[3729],{"type":47,"value":3730},"  --radius-input",{"type":42,"tag":220,"props":3732,"children":3733},{"style":236},[3734],{"type":47,"value":261},{"type":42,"tag":220,"props":3736,"children":3737},{"style":264},[3738],{"type":47,"value":3155},{"type":42,"tag":220,"props":3740,"children":3741},{"style":236},[3742],{"type":47,"value":3138},{"type":42,"tag":220,"props":3744,"children":3746},{"class":222,"line":3745},33,[3747,3752,3756,3761],{"type":42,"tag":220,"props":3748,"children":3749},{"style":1197},[3750],{"type":47,"value":3751},"  --radius-card",{"type":42,"tag":220,"props":3753,"children":3754},{"style":236},[3755],{"type":47,"value":261},{"type":42,"tag":220,"props":3757,"children":3758},{"style":264},[3759],{"type":47,"value":3760},"   12px",{"type":42,"tag":220,"props":3762,"children":3763},{"style":236},[3764],{"type":47,"value":3138},{"type":42,"tag":220,"props":3766,"children":3768},{"class":222,"line":3767},34,[3769,3774,3778,3782],{"type":42,"tag":220,"props":3770,"children":3771},{"style":1197},[3772],{"type":47,"value":3773},"  --radius-large",{"type":42,"tag":220,"props":3775,"children":3776},{"style":236},[3777],{"type":47,"value":261},{"type":42,"tag":220,"props":3779,"children":3780},{"style":264},[3781],{"type":47,"value":3218},{"type":42,"tag":220,"props":3783,"children":3784},{"style":236},[3785],{"type":47,"value":3138},{"type":42,"tag":220,"props":3787,"children":3789},{"class":222,"line":3788},35,[3790,3795,3799,3804],{"type":42,"tag":220,"props":3791,"children":3792},{"style":1197},[3793],{"type":47,"value":3794},"  --radius-hero",{"type":42,"tag":220,"props":3796,"children":3797},{"style":236},[3798],{"type":47,"value":261},{"type":42,"tag":220,"props":3800,"children":3801},{"style":264},[3802],{"type":47,"value":3803},"   40px",{"type":42,"tag":220,"props":3805,"children":3806},{"style":236},[3807],{"type":47,"value":3138},{"type":42,"tag":220,"props":3809,"children":3811},{"class":222,"line":3810},36,[3812,3817,3821,3826],{"type":42,"tag":220,"props":3813,"children":3814},{"style":1197},[3815],{"type":47,"value":3816},"  --radius-pill",{"type":42,"tag":220,"props":3818,"children":3819},{"style":236},[3820],{"type":47,"value":261},{"type":42,"tag":220,"props":3822,"children":3823},{"style":264},[3824],{"type":47,"value":3825},"   9999px",{"type":42,"tag":220,"props":3827,"children":3828},{"style":236},[3829],{"type":47,"value":3138},{"type":42,"tag":220,"props":3831,"children":3833},{"class":222,"line":3832},37,[3834],{"type":42,"tag":220,"props":3835,"children":3836},{"emptyLinePlaceholder":665},[3837],{"type":47,"value":668},{"type":42,"tag":220,"props":3839,"children":3841},{"class":222,"line":3840},38,[3842],{"type":42,"tag":220,"props":3843,"children":3844},{"style":226},[3845],{"type":47,"value":3846},"  \u002F* Hairlines *\u002F\n",{"type":42,"tag":220,"props":3848,"children":3850},{"class":222,"line":3849},39,[3851,3856,3860,3865,3869,3873,3877,3881,3885,3889,3893,3898],{"type":42,"tag":220,"props":3852,"children":3853},{"style":1197},[3854],{"type":47,"value":3855},"  --hairline",{"type":42,"tag":220,"props":3857,"children":3858},{"style":236},[3859],{"type":47,"value":261},{"type":42,"tag":220,"props":3861,"children":3862},{"style":2302},[3863],{"type":47,"value":3864}," rgba",{"type":42,"tag":220,"props":3866,"children":3867},{"style":236},[3868],{"type":47,"value":406},{"type":42,"tag":220,"props":3870,"children":3871},{"style":264},[3872],{"type":47,"value":197},{"type":42,"tag":220,"props":3874,"children":3875},{"style":236},[3876],{"type":47,"value":2319},{"type":42,"tag":220,"props":3878,"children":3879},{"style":264},[3880],{"type":47,"value":267},{"type":42,"tag":220,"props":3882,"children":3883},{"style":236},[3884],{"type":47,"value":2319},{"type":42,"tag":220,"props":3886,"children":3887},{"style":264},[3888],{"type":47,"value":267},{"type":42,"tag":220,"props":3890,"children":3891},{"style":236},[3892],{"type":47,"value":2319},{"type":42,"tag":220,"props":3894,"children":3895},{"style":264},[3896],{"type":47,"value":3897}," 0.06",{"type":42,"tag":220,"props":3899,"children":3900},{"style":236},[3901],{"type":47,"value":2337},{"type":42,"tag":220,"props":3903,"children":3905},{"class":222,"line":3904},40,[3906],{"type":42,"tag":220,"props":3907,"children":3908},{"style":236},[3909],{"type":47,"value":2345},{"type":42,"tag":220,"props":3911,"children":3913},{"class":222,"line":3912},41,[3914],{"type":42,"tag":220,"props":3915,"children":3916},{"emptyLinePlaceholder":665},[3917],{"type":47,"value":668},{"type":42,"tag":220,"props":3919,"children":3921},{"class":222,"line":3920},42,[3922],{"type":42,"tag":220,"props":3923,"children":3924},{"style":226},[3925],{"type":47,"value":3926},"\u002F* Layout primitives *\u002F\n",{"type":42,"tag":220,"props":3928,"children":3930},{"class":222,"line":3929},43,[3931,3935,3939],{"type":42,"tag":220,"props":3932,"children":3933},{"style":236},[3934],{"type":47,"value":239},{"type":42,"tag":220,"props":3936,"children":3937},{"style":242},[3938],{"type":47,"value":2007},{"type":42,"tag":220,"props":3940,"children":3941},{"style":236},[3942],{"type":47,"value":2287},{"type":42,"tag":220,"props":3944,"children":3946},{"class":222,"line":3945},44,[3947,3952,3956,3960,3964,3969],{"type":42,"tag":220,"props":3948,"children":3949},{"style":253},[3950],{"type":47,"value":3951},"  max-width",{"type":42,"tag":220,"props":3953,"children":3954},{"style":236},[3955],{"type":47,"value":261},{"type":42,"tag":220,"props":3957,"children":3958},{"style":2302},[3959],{"type":47,"value":2772},{"type":42,"tag":220,"props":3961,"children":3962},{"style":236},[3963],{"type":47,"value":406},{"type":42,"tag":220,"props":3965,"children":3966},{"style":1197},[3967],{"type":47,"value":3968},"--container-main",{"type":42,"tag":220,"props":3970,"children":3971},{"style":236},[3972],{"type":47,"value":2337},{"type":42,"tag":220,"props":3974,"children":3976},{"class":222,"line":3975},45,[3977,3982,3986,3990],{"type":42,"tag":220,"props":3978,"children":3979},{"style":253},[3980],{"type":47,"value":3981},"  margin-inline",{"type":42,"tag":220,"props":3983,"children":3984},{"style":236},[3985],{"type":47,"value":261},{"type":42,"tag":220,"props":3987,"children":3988},{"style":1197},[3989],{"type":47,"value":2043},{"type":42,"tag":220,"props":3991,"children":3992},{"style":236},[3993],{"type":47,"value":3138},{"type":42,"tag":220,"props":3995,"children":3997},{"class":222,"line":3996},46,[3998,4002,4006,4010,4014,4018,4022,4026,4030,4034],{"type":42,"tag":220,"props":3999,"children":4000},{"style":253},[4001],{"type":47,"value":2295},{"type":42,"tag":220,"props":4003,"children":4004},{"style":236},[4005],{"type":47,"value":261},{"type":42,"tag":220,"props":4007,"children":4008},{"style":2302},[4009],{"type":47,"value":2305},{"type":42,"tag":220,"props":4011,"children":4012},{"style":236},[4013],{"type":47,"value":406},{"type":42,"tag":220,"props":4015,"children":4016},{"style":264},[4017],{"type":47,"value":2314},{"type":42,"tag":220,"props":4019,"children":4020},{"style":236},[4021],{"type":47,"value":2319},{"type":42,"tag":220,"props":4023,"children":4024},{"style":264},[4025],{"type":47,"value":2324},{"type":42,"tag":220,"props":4027,"children":4028},{"style":236},[4029],{"type":47,"value":2319},{"type":42,"tag":220,"props":4031,"children":4032},{"style":264},[4033],{"type":47,"value":1304},{"type":42,"tag":220,"props":4035,"children":4036},{"style":236},[4037],{"type":47,"value":2337},{"type":42,"tag":220,"props":4039,"children":4041},{"class":222,"line":4040},47,[4042],{"type":42,"tag":220,"props":4043,"children":4044},{"style":236},[4045],{"type":47,"value":2345},{"type":42,"tag":220,"props":4047,"children":4049},{"class":222,"line":4048},48,[4050],{"type":42,"tag":220,"props":4051,"children":4052},{"emptyLinePlaceholder":665},[4053],{"type":47,"value":668},{"type":42,"tag":220,"props":4055,"children":4057},{"class":222,"line":4056},49,[4058,4062,4066],{"type":42,"tag":220,"props":4059,"children":4060},{"style":236},[4061],{"type":47,"value":239},{"type":42,"tag":220,"props":4063,"children":4064},{"style":242},[4065],{"type":47,"value":1286},{"type":42,"tag":220,"props":4067,"children":4068},{"style":236},[4069],{"type":47,"value":2287},{"type":42,"tag":220,"props":4071,"children":4073},{"class":222,"line":4072},50,[4074,4079,4083,4087,4091,4096],{"type":42,"tag":220,"props":4075,"children":4076},{"style":253},[4077],{"type":47,"value":4078},"  padding-block",{"type":42,"tag":220,"props":4080,"children":4081},{"style":236},[4082],{"type":47,"value":261},{"type":42,"tag":220,"props":4084,"children":4085},{"style":2302},[4086],{"type":47,"value":2772},{"type":42,"tag":220,"props":4088,"children":4089},{"style":236},[4090],{"type":47,"value":406},{"type":42,"tag":220,"props":4092,"children":4093},{"style":1197},[4094],{"type":47,"value":4095},"--section-py-default",{"type":42,"tag":220,"props":4097,"children":4098},{"style":236},[4099],{"type":47,"value":2337},{"type":42,"tag":220,"props":4101,"children":4103},{"class":222,"line":4102},51,[4104],{"type":42,"tag":220,"props":4105,"children":4106},{"style":236},[4107],{"type":47,"value":2345},{"type":42,"tag":220,"props":4109,"children":4111},{"class":222,"line":4110},52,[4112,4116,4121,4125,4129,4133,4137,4141,4146,4150,4154,4158,4162,4166],{"type":42,"tag":220,"props":4113,"children":4114},{"style":236},[4115],{"type":47,"value":239},{"type":42,"tag":220,"props":4117,"children":4118},{"style":242},[4119],{"type":47,"value":4120},"section--hero",{"type":42,"tag":220,"props":4122,"children":4123},{"style":236},[4124],{"type":47,"value":991},{"type":42,"tag":220,"props":4126,"children":4127},{"style":253},[4128],{"type":47,"value":1295},{"type":42,"tag":220,"props":4130,"children":4131},{"style":236},[4132],{"type":47,"value":261},{"type":42,"tag":220,"props":4134,"children":4135},{"style":2302},[4136],{"type":47,"value":2772},{"type":42,"tag":220,"props":4138,"children":4139},{"style":236},[4140],{"type":47,"value":406},{"type":42,"tag":220,"props":4142,"children":4143},{"style":1197},[4144],{"type":47,"value":4145},"--section-py-hero",{"type":42,"tag":220,"props":4147,"children":4148},{"style":236},[4149],{"type":47,"value":416},{"type":42,"tag":220,"props":4151,"children":4152},{"style":2302},[4153],{"type":47,"value":2772},{"type":42,"tag":220,"props":4155,"children":4156},{"style":236},[4157],{"type":47,"value":406},{"type":42,"tag":220,"props":4159,"children":4160},{"style":1197},[4161],{"type":47,"value":3519},{"type":42,"tag":220,"props":4163,"children":4164},{"style":236},[4165],{"type":47,"value":2707},{"type":42,"tag":220,"props":4167,"children":4168},{"style":236},[4169],{"type":47,"value":277},{"type":42,"tag":220,"props":4171,"children":4173},{"class":222,"line":4172},53,[4174,4178,4183,4187,4191,4195,4199,4203,4208,4212],{"type":42,"tag":220,"props":4175,"children":4176},{"style":236},[4177],{"type":47,"value":239},{"type":42,"tag":220,"props":4179,"children":4180},{"style":242},[4181],{"type":47,"value":4182},"section--generous",{"type":42,"tag":220,"props":4184,"children":4185},{"style":236},[4186],{"type":47,"value":304},{"type":42,"tag":220,"props":4188,"children":4189},{"style":253},[4190],{"type":47,"value":1295},{"type":42,"tag":220,"props":4192,"children":4193},{"style":236},[4194],{"type":47,"value":261},{"type":42,"tag":220,"props":4196,"children":4197},{"style":2302},[4198],{"type":47,"value":2772},{"type":42,"tag":220,"props":4200,"children":4201},{"style":236},[4202],{"type":47,"value":406},{"type":42,"tag":220,"props":4204,"children":4205},{"style":1197},[4206],{"type":47,"value":4207},"--section-py-generous",{"type":42,"tag":220,"props":4209,"children":4210},{"style":236},[4211],{"type":47,"value":2707},{"type":42,"tag":220,"props":4213,"children":4214},{"style":236},[4215],{"type":47,"value":277},{"type":42,"tag":220,"props":4217,"children":4219},{"class":222,"line":4218},54,[4220],{"type":42,"tag":220,"props":4221,"children":4222},{"emptyLinePlaceholder":665},[4223],{"type":47,"value":668},{"type":42,"tag":220,"props":4225,"children":4227},{"class":222,"line":4226},55,[4228],{"type":42,"tag":220,"props":4229,"children":4230},{"style":226},[4231],{"type":47,"value":4232},"\u002F* Typographic rhythm *\u002F\n",{"type":42,"tag":220,"props":4234,"children":4236},{"class":222,"line":4235},56,[4237,4241,4245,4249,4253,4257,4261],{"type":42,"tag":220,"props":4238,"children":4239},{"style":242},[4240],{"type":47,"value":56},{"type":42,"tag":220,"props":4242,"children":4243},{"style":236},[4244],{"type":47,"value":250},{"type":42,"tag":220,"props":4246,"children":4247},{"style":253},[4248],{"type":47,"value":1790},{"type":42,"tag":220,"props":4250,"children":4251},{"style":236},[4252],{"type":47,"value":261},{"type":42,"tag":220,"props":4254,"children":4255},{"style":264},[4256],{"type":47,"value":1122},{"type":42,"tag":220,"props":4258,"children":4259},{"style":236},[4260],{"type":47,"value":272},{"type":42,"tag":220,"props":4262,"children":4263},{"style":236},[4264],{"type":47,"value":277},{"type":42,"tag":220,"props":4266,"children":4268},{"class":222,"line":4267},57,[4269,4273,4277,4281,4285,4289,4293],{"type":42,"tag":220,"props":4270,"children":4271},{"style":242},[4272],{"type":47,"value":153},{"type":42,"tag":220,"props":4274,"children":4275},{"style":236},[4276],{"type":47,"value":250},{"type":42,"tag":220,"props":4278,"children":4279},{"style":253},[4280],{"type":47,"value":1790},{"type":42,"tag":220,"props":4282,"children":4283},{"style":236},[4284],{"type":47,"value":261},{"type":42,"tag":220,"props":4286,"children":4287},{"style":264},[4288],{"type":47,"value":1835},{"type":42,"tag":220,"props":4290,"children":4291},{"style":236},[4292],{"type":47,"value":272},{"type":42,"tag":220,"props":4294,"children":4295},{"style":236},[4296],{"type":47,"value":277},{"type":42,"tag":220,"props":4298,"children":4300},{"class":222,"line":4299},58,[4301,4305,4309,4313,4317,4321,4325],{"type":42,"tag":220,"props":4302,"children":4303},{"style":242},[4304],{"type":47,"value":50},{"type":42,"tag":220,"props":4306,"children":4307},{"style":236},[4308],{"type":47,"value":304},{"type":42,"tag":220,"props":4310,"children":4311},{"style":253},[4312],{"type":47,"value":1790},{"type":42,"tag":220,"props":4314,"children":4315},{"style":236},[4316],{"type":47,"value":261},{"type":42,"tag":220,"props":4318,"children":4319},{"style":264},[4320],{"type":47,"value":433},{"type":42,"tag":220,"props":4322,"children":4323},{"style":236},[4324],{"type":47,"value":272},{"type":42,"tag":220,"props":4326,"children":4327},{"style":236},[4328],{"type":47,"value":277},{"type":42,"tag":220,"props":4330,"children":4332},{"class":222,"line":4331},59,[4333,4337,4341,4346,4350,4354,4358,4362,4366],{"type":42,"tag":220,"props":4334,"children":4335},{"style":242},[4336],{"type":47,"value":50},{"type":42,"tag":220,"props":4338,"children":4339},{"style":236},[4340],{"type":47,"value":261},{"type":42,"tag":220,"props":4342,"children":4343},{"style":398},[4344],{"type":47,"value":4345},"last-child",{"type":42,"tag":220,"props":4347,"children":4348},{"style":236},[4349],{"type":47,"value":250},{"type":42,"tag":220,"props":4351,"children":4352},{"style":253},[4353],{"type":47,"value":1790},{"type":42,"tag":220,"props":4355,"children":4356},{"style":236},[4357],{"type":47,"value":261},{"type":42,"tag":220,"props":4359,"children":4360},{"style":264},[4361],{"type":47,"value":267},{"type":42,"tag":220,"props":4363,"children":4364},{"style":236},[4365],{"type":47,"value":272},{"type":42,"tag":220,"props":4367,"children":4368},{"style":236},[4369],{"type":47,"value":277},{"type":42,"tag":220,"props":4371,"children":4373},{"class":222,"line":4372},60,[4374],{"type":42,"tag":220,"props":4375,"children":4376},{"emptyLinePlaceholder":665},[4377],{"type":47,"value":668},{"type":42,"tag":220,"props":4379,"children":4381},{"class":222,"line":4380},61,[4382],{"type":42,"tag":220,"props":4383,"children":4384},{"style":226},[4385],{"type":47,"value":4386},"\u002F* Hairlines *\u002F\n",{"type":42,"tag":220,"props":4388,"children":4390},{"class":222,"line":4389},62,[4391,4395,4400,4404,4409,4413,4417,4421,4426,4430,4434,4438,4443,4447,4451,4455,4459,4463],{"type":42,"tag":220,"props":4392,"children":4393},{"style":236},[4394],{"type":47,"value":239},{"type":42,"tag":220,"props":4396,"children":4397},{"style":242},[4398],{"type":47,"value":4399},"divider",{"type":42,"tag":220,"props":4401,"children":4402},{"style":236},[4403],{"type":47,"value":250},{"type":42,"tag":220,"props":4405,"children":4406},{"style":253},[4407],{"type":47,"value":4408}," height",{"type":42,"tag":220,"props":4410,"children":4411},{"style":236},[4412],{"type":47,"value":261},{"type":42,"tag":220,"props":4414,"children":4415},{"style":264},[4416],{"type":47,"value":2683},{"type":42,"tag":220,"props":4418,"children":4419},{"style":236},[4420],{"type":47,"value":272},{"type":42,"tag":220,"props":4422,"children":4423},{"style":253},[4424],{"type":47,"value":4425}," background",{"type":42,"tag":220,"props":4427,"children":4428},{"style":236},[4429],{"type":47,"value":261},{"type":42,"tag":220,"props":4431,"children":4432},{"style":2302},[4433],{"type":47,"value":2772},{"type":42,"tag":220,"props":4435,"children":4436},{"style":236},[4437],{"type":47,"value":406},{"type":42,"tag":220,"props":4439,"children":4440},{"style":1197},[4441],{"type":47,"value":4442},"--hairline",{"type":42,"tag":220,"props":4444,"children":4445},{"style":236},[4446],{"type":47,"value":2707},{"type":42,"tag":220,"props":4448,"children":4449},{"style":253},[4450],{"type":47,"value":2657},{"type":42,"tag":220,"props":4452,"children":4453},{"style":236},[4454],{"type":47,"value":261},{"type":42,"tag":220,"props":4456,"children":4457},{"style":264},[4458],{"type":47,"value":267},{"type":42,"tag":220,"props":4460,"children":4461},{"style":236},[4462],{"type":47,"value":272},{"type":42,"tag":220,"props":4464,"children":4465},{"style":236},[4466],{"type":47,"value":277},{"type":42,"tag":220,"props":4468,"children":4470},{"class":222,"line":4469},63,[4471,4475,4479,4483,4487,4491,4495,4499,4503,4507,4511,4515,4519,4523],{"type":42,"tag":220,"props":4472,"children":4473},{"style":236},[4474],{"type":47,"value":239},{"type":42,"tag":220,"props":4476,"children":4477},{"style":242},[4478],{"type":47,"value":245},{"type":42,"tag":220,"props":4480,"children":4481},{"style":236},[4482],{"type":47,"value":1109},{"type":42,"tag":220,"props":4484,"children":4485},{"style":253},[4486],{"type":47,"value":2747},{"type":42,"tag":220,"props":4488,"children":4489},{"style":236},[4490],{"type":47,"value":261},{"type":42,"tag":220,"props":4492,"children":4493},{"style":264},[4494],{"type":47,"value":267},{"type":42,"tag":220,"props":4496,"children":4497},{"style":264},[4498],{"type":47,"value":267},{"type":42,"tag":220,"props":4500,"children":4501},{"style":264},[4502],{"type":47,"value":267},{"type":42,"tag":220,"props":4504,"children":4505},{"style":264},[4506],{"type":47,"value":2683},{"type":42,"tag":220,"props":4508,"children":4509},{"style":2302},[4510],{"type":47,"value":2772},{"type":42,"tag":220,"props":4512,"children":4513},{"style":236},[4514],{"type":47,"value":406},{"type":42,"tag":220,"props":4516,"children":4517},{"style":1197},[4518],{"type":47,"value":4442},{"type":42,"tag":220,"props":4520,"children":4521},{"style":236},[4522],{"type":47,"value":2707},{"type":42,"tag":220,"props":4524,"children":4525},{"style":236},[4526],{"type":47,"value":277},{"type":42,"tag":56,"props":4528,"children":4530},{"id":4529},"application-workflow",[4531],{"type":47,"value":4532},"Application workflow",{"type":42,"tag":4534,"props":4535,"children":4536},"ol",{},[4537,4547,4557,4567,4585,4595,4605],{"type":42,"tag":67,"props":4538,"children":4539},{},[4540,4545],{"type":42,"tag":165,"props":4541,"children":4542},{},[4543],{"type":47,"value":4544},"Choose a radius architecture",{"type":47,"value":4546}," — binary \u002F asymmetric \u002F per-element \u002F extreme — and commit to it.",{"type":42,"tag":67,"props":4548,"children":4549},{},[4550,4555],{"type":42,"tag":165,"props":4551,"children":4552},{},[4553],{"type":47,"value":4554},"Upgrade section padding",{"type":47,"value":4556}," to 80-160px (usually +50% more than you'd default).",{"type":42,"tag":67,"props":4558,"children":4559},{},[4560,4565],{"type":42,"tag":165,"props":4561,"children":4562},{},[4563],{"type":47,"value":4564},"Add 20 and 28 to your spacing scale",{"type":47,"value":4566}," if you're stuck in strict-4-multiples.",{"type":42,"tag":67,"props":4568,"children":4569},{},[4570,4583],{"type":42,"tag":165,"props":4571,"children":4572},{},[4573,4575,4581],{"type":47,"value":4574},"Set explicit ",{"type":42,"tag":73,"props":4576,"children":4578},{"className":4577},[],[4579],{"type":47,"value":4580},"margin-block-end: 40px",{"type":47,"value":4582}," on h2",{"type":47,"value":4584}," for generous paragraph spacing.",{"type":42,"tag":67,"props":4586,"children":4587},{},[4588,4593],{"type":42,"tag":165,"props":4589,"children":4590},{},[4591],{"type":47,"value":4592},"Set container max-width: 1280px",{"type":47,"value":4594}," for main content, 720px for prose.",{"type":42,"tag":67,"props":4596,"children":4597},{},[4598,4603],{"type":42,"tag":165,"props":4599,"children":4600},{},[4601],{"type":47,"value":4602},"Drop hairlines to 4-10% alpha",{"type":47,"value":4604}," (rarely solid gray).",{"type":42,"tag":67,"props":4606,"children":4607},{},[4608,4613],{"type":42,"tag":165,"props":4609,"children":4610},{},[4611],{"type":47,"value":4612},"Tighten grid gaps",{"type":47,"value":4614}," to 8-24px, but increase section padding to compensate.",{"type":42,"tag":56,"props":4616,"children":4618},{"id":4617},"anti-patterns-to-kill",[4619],{"type":47,"value":4620},"Anti-patterns to kill",{"type":42,"tag":63,"props":4622,"children":4623},{},[4624,4634,4644,4649,4659,4670,4683,4688],{"type":42,"tag":67,"props":4625,"children":4626},{},[4627,4632],{"type":42,"tag":73,"props":4628,"children":4630},{"className":4629},[],[4631],{"type":47,"value":99},{"type":47,"value":4633}," (8px) on every surface",{"type":42,"tag":67,"props":4635,"children":4636},{},[4637,4642],{"type":42,"tag":73,"props":4638,"children":4640},{"className":4639},[],[4641],{"type":47,"value":78},{"type":47,"value":4643}," as the section padding across the whole site",{"type":42,"tag":67,"props":4645,"children":4646},{},[4647],{"type":47,"value":4648},"Strict Tailwind 4-multiple scale with no 20\u002F28\u002F40 interpolation",{"type":42,"tag":67,"props":4650,"children":4651},{},[4652,4657],{"type":42,"tag":73,"props":4653,"children":4655},{"className":4654},[],[4656],{"type":47,"value":2870},{"type":47,"value":4658}," instead of a translucent hairline",{"type":42,"tag":67,"props":4660,"children":4661},{},[4662,4668],{"type":42,"tag":73,"props":4663,"children":4665},{"className":4664},[],[4666],{"type":47,"value":4667},"max-width: 100%",{"type":47,"value":4669}," with no container (text blocks flow edge-to-edge at wide)",{"type":42,"tag":67,"props":4671,"children":4672},{},[4673,4675,4681],{"type":47,"value":4674},"Monotone ",{"type":42,"tag":73,"props":4676,"children":4678},{"className":4677},[],[4679],{"type":47,"value":4680},"gap-4",{"type":47,"value":4682}," between everything",{"type":42,"tag":67,"props":4684,"children":4685},{},[4686],{"type":47,"value":4687},"Tight 48px section padding that makes the page feel cramped",{"type":42,"tag":67,"props":4689,"children":4690},{},[4691],{"type":47,"value":4692},"Missing paragraph-spacing after h2 (text runs into prose)",{"type":42,"tag":56,"props":4694,"children":4696},{"id":4695},"site-references",[4697],{"type":47,"value":4698},"Site references",{"type":42,"tag":1570,"props":4700,"children":4701},{},[4702,4718],{"type":42,"tag":1574,"props":4703,"children":4704},{},[4705],{"type":42,"tag":1578,"props":4706,"children":4707},{},[4708,4713],{"type":42,"tag":1582,"props":4709,"children":4710},{},[4711],{"type":47,"value":4712},"Pattern",{"type":42,"tag":1582,"props":4714,"children":4715},{},[4716],{"type":47,"value":4717},"Case study",{"type":42,"tag":1593,"props":4719,"children":4720},{},[4721,4746,4759,4772,4784,4797,4809,4822,4835,4848],{"type":42,"tag":1578,"props":4722,"children":4723},{},[4724,4742],{"type":42,"tag":1600,"props":4725,"children":4726},{},[4727,4729,4734,4735,4740],{"type":47,"value":4728},"Binary ",{"type":42,"tag":73,"props":4730,"children":4732},{"className":4731},[],[4733],{"type":47,"value":197},{"type":47,"value":80},{"type":42,"tag":73,"props":4736,"children":4738},{"className":4737},[],[4739],{"type":47,"value":205},{"type":47,"value":4741}," radius",{"type":42,"tag":1600,"props":4743,"children":4744},{},[4745],{"type":47,"value":1604},{"type":42,"tag":1578,"props":4747,"children":4748},{},[4749,4754],{"type":42,"tag":1600,"props":4750,"children":4751},{},[4752],{"type":47,"value":4753},"Asymmetric interlocking radius",{"type":42,"tag":1600,"props":4755,"children":4756},{},[4757],{"type":47,"value":4758},"Cohere (20px on outer, 0 at joins)",{"type":42,"tag":1578,"props":4760,"children":4761},{},[4762,4767],{"type":42,"tag":1600,"props":4763,"children":4764},{},[4765],{"type":47,"value":4766},"Per-element radius variety",{"type":42,"tag":1600,"props":4768,"children":4769},{},[4770],{"type":47,"value":4771},"Hex, Cal, AngelList",{"type":42,"tag":1578,"props":4773,"children":4774},{},[4775,4780],{"type":42,"tag":1600,"props":4776,"children":4777},{},[4778],{"type":47,"value":4779},"Extreme 200-300px radius art plates",{"type":42,"tag":1600,"props":4781,"children":4782},{},[4783],{"type":47,"value":3078},{"type":42,"tag":1578,"props":4785,"children":4786},{},[4787,4792],{"type":42,"tag":1600,"props":4788,"children":4789},{},[4790],{"type":47,"value":4791},"128-160px section padding",{"type":42,"tag":1600,"props":4793,"children":4794},{},[4795],{"type":47,"value":4796},"Duna, Incident, Amplemarket",{"type":42,"tag":1578,"props":4798,"children":4799},{},[4800,4805],{"type":42,"tag":1600,"props":4801,"children":4802},{},[4803],{"type":47,"value":4804},"40px margin-block-end on h2",{"type":42,"tag":1600,"props":4806,"children":4807},{},[4808],{"type":47,"value":1624},{"type":42,"tag":1578,"props":4810,"children":4811},{},[4812,4817],{"type":42,"tag":1600,"props":4813,"children":4814},{},[4815],{"type":47,"value":4816},"20px + 28px in spacing scale",{"type":42,"tag":1600,"props":4818,"children":4819},{},[4820],{"type":47,"value":4821},"Cal, Duna, Hex",{"type":42,"tag":1578,"props":4823,"children":4824},{},[4825,4830],{"type":42,"tag":1600,"props":4826,"children":4827},{},[4828],{"type":47,"value":4829},"Theme-tinted hairlines",{"type":42,"tag":1600,"props":4831,"children":4832},{},[4833],{"type":47,"value":4834},"Antimetal (navy 4%)",{"type":42,"tag":1578,"props":4836,"children":4837},{},[4838,4843],{"type":42,"tag":1600,"props":4839,"children":4840},{},[4841],{"type":47,"value":4842},"1280px main container",{"type":42,"tag":1600,"props":4844,"children":4845},{},[4846],{"type":47,"value":4847},"Reducto, Incident, most sites",{"type":42,"tag":1578,"props":4849,"children":4850},{},[4851,4856],{"type":42,"tag":1600,"props":4852,"children":4853},{},[4854],{"type":47,"value":4855},"Tight 2-16px component gaps + huge section padding",{"type":42,"tag":1600,"props":4857,"children":4858},{},[4859],{"type":47,"value":3045},{"type":42,"tag":4861,"props":4862,"children":4863},"style",{},[4864],{"type":47,"value":4865},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"items":4867,"total":5048},[4868,4885,4903,4917,4934,4949,4963,4978,4993,5004,5019,5033],{"slug":4869,"name":4869,"fn":4870,"description":4871,"org":4872,"tags":4873,"stars":4882,"repoUrl":4883,"updatedAt":4884},"annotate","collect visual feedback with browser annotation tools","Open a browser with visual annotation tools. The user clicks elements on their site and leaves feedback — the agent reads annotations and makes changes. Use this when the user wants to point at specific elements to fix, tweak, or redesign.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4874,4875,4878,4881],{"name":13,"slug":14,"type":15},{"name":4876,"slug":4877,"type":15},"Productivity","productivity",{"name":4879,"slug":4880,"type":15},"UX Copy","ux-copy",{"name":20,"slug":21,"type":15},484,"https:\u002F\u002Fgithub.com\u002FAutomattic\u002Fstudio","2026-05-06T05:40:01.516544",{"slug":4886,"name":4886,"fn":4887,"description":4888,"org":4889,"tags":4890,"stars":4882,"repoUrl":4883,"updatedAt":4902},"block-content","write editable WordPress block markup","Write editable WordPress block markup for local Studio sites, including core\u002Fhtml limits, block-theme layout rules, full-width sections, validation, and skeleton-first page\u002FCSS recipes.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4891,4894,4896,4899],{"name":4892,"slug":4893,"type":15},"Block Editor","block-editor",{"name":4895,"slug":213,"type":15},"CSS",{"name":4897,"slug":4898,"type":15},"HTML","html",{"name":4900,"slug":4901,"type":15},"WordPress","wordpress","2026-05-27T07:01:55.629681",{"slug":4904,"name":4904,"fn":4905,"description":4906,"org":4907,"tags":4908,"stars":4882,"repoUrl":4883,"updatedAt":4916},"hosting-plans-helper","provide WordPress.com hosting plan information","Answer WordPress.com plan, pricing, upgrade, and feature-tier questions (plan names, what each tier unlocks — plugins, themes, custom code, SSH, hosting — and current prices) from authoritative live data. Load before answering ANY plan, pricing, or feature-gating question; never answer these from memory.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4909,4912,4915],{"name":4910,"slug":4911,"type":15},"Pricing","pricing",{"name":4913,"slug":4914,"type":15},"Reference","reference",{"name":4900,"slug":4901,"type":15},"2026-07-02T07:42:33.654791",{"slug":4918,"name":4918,"fn":4919,"description":4920,"org":4921,"tags":4922,"stars":4882,"repoUrl":4883,"updatedAt":4933},"liberate","migrate websites to WordPress","Import and rebuild a website from a closed platform (Wix, Squarespace, Webflow, Shopify, GoDaddy, Hostinger, HubSpot, Weebly) into a Studio WordPress site. Extracts pages\u002Fposts\u002Fproducts + media, then reconstructs the design as editable blocks + WooCommerce OR as a high-fidelity replica theme. Invoke when the user wants to migrate, import, liberate, or rebuild a site from one of these platforms.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4923,4926,4929,4932],{"name":4924,"slug":4925,"type":15},"CMS","cms",{"name":4927,"slug":4928,"type":15},"Migration","migration",{"name":4930,"slug":4931,"type":15},"Web Development","web-development",{"name":4900,"slug":4901,"type":15},"2026-07-09T06:47:33.454311",{"slug":4935,"name":4935,"fn":4936,"description":4937,"org":4938,"tags":4939,"stars":4882,"repoUrl":4883,"updatedAt":4948},"need-for-speed","run frontend performance audits for WordPress sites","Run a frontend performance audit on a WordPress site and get actionable optimization recommendations.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4940,4943,4944,4947],{"name":4941,"slug":4942,"type":15},"Audit","audit",{"name":13,"slug":14,"type":15},{"name":4945,"slug":4946,"type":15},"Performance","performance",{"name":4900,"slug":4901,"type":15},"2026-05-06T05:40:06.433267",{"slug":4950,"name":4950,"fn":4951,"description":4952,"org":4953,"tags":4954,"stars":4882,"repoUrl":4883,"updatedAt":4962},"plugin-recommendations","recommend WordPress plugins for site features","Choose recommended plugins and plugin-provided blocks for features core WordPress blocks do not cover - ecommerce (WooCommerce), forms and newsletters (Jetpack), online courses and quizzes (Sensei LMS), polls, surveys and ratings (Crowdsignal), spam protection (Akismet) - while keeping generated content editable and avoiding raw HTML fallbacks. Any request to sell products or build a shop, store, or storefront requires WooCommerce with products.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4955,4958,4961],{"name":4956,"slug":4957,"type":15},"Content Creation","content-creation",{"name":4959,"slug":4960,"type":15},"Plugin Development","plugin-development",{"name":4900,"slug":4901,"type":15},"2026-05-27T07:01:58.249105",{"slug":4964,"name":4964,"fn":4965,"description":4966,"org":4967,"tags":4968,"stars":4882,"repoUrl":4883,"updatedAt":4977},"rank-me-up","run on-page SEO audits for WordPress sites","Run an on-page SEO audit on a WordPress site and get actionable recommendations to improve search visibility.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4969,4970,4973,4976],{"name":4941,"slug":4942,"type":15},{"name":4971,"slug":4972,"type":15},"Marketing","marketing",{"name":4974,"slug":4975,"type":15},"SEO","seo",{"name":4900,"slug":4901,"type":15},"2026-05-06T05:40:05.196367",{"slug":4979,"name":4979,"fn":4980,"description":4981,"org":4982,"tags":4983,"stars":4882,"repoUrl":4883,"updatedAt":4992},"site-spec","gather specifications for new WordPress sites","Gather the site name and layout preference before building a WordPress site. Run this before creating any new site.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4984,4985,4988,4991],{"name":23,"slug":24,"type":15},{"name":4986,"slug":4987,"type":15},"Product Management","product-management",{"name":4989,"slug":4990,"type":15},"Specs","specs",{"name":4900,"slug":4901,"type":15},"2026-05-06T05:40:02.739409",{"slug":4994,"name":4994,"fn":4995,"description":4996,"org":4997,"tags":4998,"stars":4882,"repoUrl":4883,"updatedAt":5003},"studio-cli","manage local WordPress sites with Studio CLI","Use the Studio CLI to manage local WordPress sites, authentication, and preview sites. Invoke this skill when you need to run Studio CLI commands, manage sites, or troubleshoot site issues.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[4999,5002],{"name":5000,"slug":5001,"type":15},"CLI","cli",{"name":4900,"slug":4901,"type":15},"2026-04-06T18:02:57.150231",{"slug":5005,"name":5005,"fn":5006,"description":5007,"org":5008,"tags":5009,"stars":4882,"repoUrl":4883,"updatedAt":5018},"taxonomist","optimize WordPress category taxonomy","Analyze and optimize a WordPress site's category taxonomy. Exports all posts, uses AI to suggest an improved category structure — merging duplicates, retiring dead categories, creating missing ones, writing descriptions, and re-categorizing posts. Run this when the user wants to clean up or improve their categories.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5010,5013,5016,5017],{"name":5011,"slug":5012,"type":15},"Content Strategy","content-strategy",{"name":5014,"slug":5015,"type":15},"Data Cleaning","data-cleaning",{"name":4974,"slug":4975,"type":15},{"name":4900,"slug":4901,"type":15},"2026-05-06T05:40:03.966799",{"slug":18,"name":18,"fn":5020,"description":5021,"org":5022,"tags":5023,"stars":4882,"repoUrl":4883,"updatedAt":5032},"plan and execute visual design direction","Plan and execute high-quality visual direction for site creation, redesign, layout, typography, color, motion, and visual polish.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5024,5027,5028,5031],{"name":5025,"slug":5026,"type":15},"Animation","animation",{"name":23,"slug":24,"type":15},{"name":5029,"slug":5030,"type":15},"Typography","typography",{"name":17,"slug":18,"type":15},"2026-07-24T05:40:57.887452",{"slug":5034,"name":5034,"fn":5035,"description":5036,"org":5037,"tags":5038,"stars":4882,"repoUrl":4883,"updatedAt":5047},"visual-polish","verify and polish website visual design","Verify and polish a built or redesigned site by diagnosing rendered-DOM issues against intent and fixing them in a planned, batched screenshot-and-fix loop.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5039,5042,5043,5046],{"name":5040,"slug":5041,"type":15},"Debugging","debugging",{"name":13,"slug":14,"type":15},{"name":5044,"slug":5045,"type":15},"Screenshots","screenshots",{"name":17,"slug":18,"type":15},"2026-06-06T07:09:59.809812",81,{"items":5050,"total":661},[5051,5064,5075,5088,5101,5108],{"slug":5052,"name":5052,"fn":5053,"description":5054,"org":5055,"tags":5056,"stars":25,"repoUrl":26,"updatedAt":5063},"de-slopify-audit","audit and remove AI-slop design patterns","Scan a site for AI-slop defaults and replace them with premium patterns. Detects generic giveaways (Inter everywhere,",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5057,5058,5059,5062],{"name":4941,"slug":4942,"type":15},{"name":23,"slug":24,"type":15},{"name":5060,"slug":5061,"type":15},"Design Critique","design-critique",{"name":13,"slug":14,"type":15},"2026-06-20T07:57:10.581611",{"slug":5065,"name":5065,"fn":5066,"description":5067,"org":5068,"tags":5069,"stars":25,"repoUrl":26,"updatedAt":5074},"design-polish-suite","apply design polish to web interfaces","The full design glow-up toolkit. Turns forgettable interfaces into something that looks like a real designer touched it. Routes to 6 sub-skills for de-slopifying, typography, spacing, gradients, motion, and adding that one detail people actually remember. Use when a UI feels mid, generic, AI-generated, or just painfully beige.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5070,5071,5072,5073],{"name":23,"slug":24,"type":15},{"name":5029,"slug":5030,"type":15},{"name":20,"slug":21,"type":15},{"name":17,"slug":18,"type":15},"2026-06-20T07:57:06.690815",{"slug":5076,"name":5076,"fn":5077,"description":5078,"org":5079,"tags":5080,"stars":25,"repoUrl":26,"updatedAt":5087},"motion-and-micro-interactions","apply premium motion and micro-interactions","Apply the motion language of premium VC-funded sites — specific cubic-bezier easings (not ease-in-out), snappy 75-200ms durations, mechanical press feedback, orchestrated hover deltas, width-animated buttons, mouse-tracking gradients, blur-in reveals, scroll-linked reveals. Use when interactions feel \"springy and generic\" or when the user wants their site to feel responsive, alive, physical.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5081,5082,5083,5084],{"name":5025,"slug":5026,"type":15},{"name":23,"slug":24,"type":15},{"name":13,"slug":14,"type":15},{"name":5085,"slug":5086,"type":15},"Interaction","interaction","2026-06-20T07:57:09.291269",{"slug":5089,"name":5089,"fn":5090,"description":5091,"org":5092,"tags":5093,"stars":25,"repoUrl":26,"updatedAt":5100},"soft-gradient-dreamy","apply premium soft gradient aesthetic","Apply the warm, atmospheric, multi-layer shadow aesthetic used by premium SaaS sites like Hex, Antimetal, Incident, Outseta, Cohere, and Amplemarket. Warm off-white grounds, tinted shadows that harmonize with theme, multi-stop gradients at deliberate angles, inset highlights for dual-edge lighting. Use when the user wants their site to feel atmospheric, luminous, warm, editorial — NOT cold SaaS purple\u002Fblue.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5094,5097,5098,5099],{"name":5095,"slug":5096,"type":15},"Creative","creative",{"name":23,"slug":24,"type":15},{"name":13,"slug":14,"type":15},{"name":17,"slug":18,"type":15},"2026-06-20T07:57:11.884466",{"slug":4,"name":4,"fn":5,"description":6,"org":5102,"tags":5103,"stars":25,"repoUrl":26,"updatedAt":27},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5104,5105,5106,5107],{"name":23,"slug":24,"type":15},{"name":13,"slug":14,"type":15},{"name":20,"slug":21,"type":15},{"name":17,"slug":18,"type":15},{"slug":5109,"name":5109,"fn":5110,"description":5111,"org":5112,"tags":5113,"stars":25,"repoUrl":26,"updatedAt":5120},"typography-that-sells","upgrade typography for premium design","Upgrade typography from generic SaaS to premium, authored, high-conviction design. Uses distinct display fonts, lighter body weights, tight negative tracking, mono eyebrows, restrained serif accents, and OpenType details to create typography with taste, authority, and emotional signal. Use when a page feels flat, template-y, overly safe, or visually anonymous.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[5114,5115,5118,5119],{"name":23,"slug":24,"type":15},{"name":5116,"slug":5117,"type":15},"Design System","design-system",{"name":13,"slug":14,"type":15},{"name":5029,"slug":5030,"type":15},"2026-06-20T07:57:08.002685"]