:root{--spacing-unit:1rem}.blog-content h1,.blog-content h2,.blog-content h3,.blog-content h4,.blog-content h5,.blog-content h6{color:hsl(var(--p));font-weight:700;line-height:1.2}.blog-content h1{font-size:2.75rem;margin-bottom:calc(var(--spacing-unit) * 2);color:hsl(var(--p))}.blog-content h2{font-size:2.25rem;border-bottom:2px solid hsl(var(--p));padding-bottom:calc(var(--spacing-unit) * .5)}.blog-content h2,.blog-content h3{margin-top:calc(var(--spacing-unit) * 3);margin-bottom:calc(var(--spacing-unit) * 1.5)}.blog-content h3{font-size:1.75rem}.blog-content h4{font-size:1.5rem;margin-top:calc(var(--spacing-unit) * 2.5);margin-bottom:var(--spacing-unit)}.blog-content h5{font-size:1.25rem;margin-top:calc(var(--spacing-unit) * 2);margin-bottom:calc(var(--spacing-unit) * .75)}.blog-content h6{font-size:1.125rem;margin-top:calc(var(--spacing-unit) * 1.5);margin-bottom:calc(var(--spacing-unit) * .5)}.blog-content p{margin-bottom:var(--spacing-unit);line-height:1.6}.blog-content a{color:hsl(var(--p));text-decoration:underline}.blog-content a:hover{color:hsl(var(--pf))}.blog-content dl,.blog-content ol,.blog-content ul{margin-bottom:var(--spacing-unit);padding-left:calc(var(--spacing-unit) * 2)}.blog-content dd,.blog-content li{margin-bottom:calc(var(--spacing-unit) * .5)}.blog-content ul{list-style-type:disc}.blog-content ul ul{list-style-type:circle}.blog-content ul ul ul{list-style-type:square}.blog-content ol{list-style-type:decimal}.blog-content ol ol{list-style-type:lower-alpha}.blog-content ol ol ol{list-style-type:lower-roman}.blog-content dt{font-weight:700;margin-top:calc(var(--spacing-unit) * .5)}.blog-content dd{margin-left:calc(var(--spacing-unit) * 2)}.blog-content blockquote{border-left:4px solid hsl(var(--p));padding:var(--spacing-unit);margin:var(--spacing-unit) 0;background-color:hsl(var(--b2));font-style:italic;color:hsl(var(--bc))}.blog-content .callout{border-radius:.5rem;padding:1rem 1.25rem;margin:1.25rem 0;font-style:normal;border-left:4px solid}.blog-content .callout p{margin:0}.blog-content .callout-tip{background-color:#eff6ff;border-left-color:#3b82f6;color:#1e3a5f}.blog-content .callout-warning{background-color:#fffbeb;border-left-color:#f59e0b;color:#78350f}.blog-content .callout-example{background-color:#f5f3ff;border-left-color:#8b5cf6;color:#4c1d95}.blog-content .callout-good{background-color:#ecfdf5;border-left-color:#10b981;color:#065f46}.blog-content .callout-bad{background-color:#fef2f2;border-left-color:#ef4444;color:#7f1d1d}.blog-content .callout-note{background-color:#f8fafc;border-left-color:#64748b;color:#1e293b}.blog-content img{max-width:100%;height:auto;border-radius:.5rem;margin:var(--spacing-unit) 0}.blog-content input,.blog-content textarea{width:100%;padding:calc(var(--spacing-unit) * .5);margin-bottom:var(--spacing-unit);border:1px solid hsl(var(--b3));border-radius:.25rem;background-color:hsl(var(--b1));color:hsl(var(--bc))}.blog-content button{background-color:hsl(var(--p));color:hsl(var(--pc));padding:calc(var(--spacing-unit) * .5) var(--spacing-unit);border:none;border-radius:.25rem;cursor:pointer}.blog-content button:hover{background-color:hsl(var(--pf))}.blog-content table{width:100%;border-collapse:collapse;margin-bottom:var(--spacing-unit);border:2px solid #e5e7eb;overflow-x:auto;border-radius:.5rem;overflow:hidden;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06)}.blog-content td,.blog-content th{border:1px solid #e5e7eb;padding:calc(var(--spacing-unit) * .75) calc(var(--spacing-unit) * 1);text-align:left;vertical-align:top}.blog-content th{background-color:#f3f4f6;font-weight:700;color:#111827;border-bottom:2px solid #9ca3af}.blog-content tbody tr:nth-child(2n){background-color:#f9fafb}.blog-content tbody tr:hover{background-color:#f3f4f6;transition:background-color .2s ease}.blog-content code,.blog-content pre{background-color:hsl(var(--b2));border-radius:.25rem;font-family:monospace}.blog-content code{padding:calc(var(--spacing-unit) * .2) calc(var(--spacing-unit) * .4)}.blog-content pre{padding:var(--spacing-unit);margin-bottom:var(--spacing-unit);overflow-x:auto}.blog-content pre code{background-color:transparent;padding:0}.blog-content hr{border:none;border-top:1px solid hsl(var(--b3));margin:calc(var(--spacing-unit) * 2) 0}@media (max-width:768px){:root{--spacing-unit:0.875rem}.blog-content h1{font-size:2.25rem}.blog-content h2{font-size:1.875rem;margin-top:calc(var(--spacing-unit) * 2.5);margin-bottom:calc(var(--spacing-unit) * 1.25)}.blog-content h3{font-size:1.5rem}.blog-content h4{font-size:1.25rem}.blog-content h5{font-size:1.125rem}.blog-content h6{font-size:1rem}.blog-content table{display:block}}