.article-header{padding:var(--space-10) 0;text-align:center;background:var(--surface-subtle)}.article-header .category{color:var(--brand-text);text-transform:uppercase;font-weight:700;font-size:var(--text-ui-md);margin-bottom:var(--space-4)}.article-header h1{font-size:var(--text-h1);color:var(--text-strong);font-weight:800;line-height:var(--leading-h2);margin-bottom:var(--space-5)}.article-header .author-info{justify-content:center;align-items:center;gap:var(--space-3);color:var(--text-muted);font-size:var(--text-small);display:flex}.article-header .author-info img{width:var(--space-10);height:var(--space-10);border-radius:var(--radius-pill);object-fit:cover}.featured-image{object-fit:cover;object-position:center;width:100%;height:400px;margin-bottom:var(--space-10);display:block}.article-layout{gap:var(--space-8);padding:var(--space-10) 0;grid-template-columns:minmax(0,1fr) 320px;align-items:start;display:grid}.article-content{overflow-wrap:anywhere;word-break:break-word;min-width:0;font-size:var(--text-ui-xl);line-height:var(--leading-body);color:var(--text-strong)}.article-content h1,.article-content h2,.article-content h3,.article-content h4,.article-content h5,.article-content h6{color:var(--text-strong);font-weight:700;line-height:var(--leading-h3);margin-top:2em;margin-bottom:1em}.article-content h1{font-size:var(--text-ui-5xl)}.article-content h2{font-size:var(--text-ui-4xl)}.article-content h3{font-size:var(--text-ui-3xl)}.article-content h4{font-size:var(--text-ui-2xl)}.article-content h5{font-size:var(--text-ui-xl)}.article-content h6{font-size:var(--text-ui-lg)}.article-content p{margin-bottom:1.5em}.article-content img,.article-content pre,.article-content code,.article-content table,.article-content blockquote{box-sizing:border-box;max-width:100%}.article-content img{border-radius:var(--radius-lg);height:auto;margin:2em 0}.article-content pre{background:var(--surface-muted);padding:var(--space-4);border-radius:var(--radius-md);font-size:var(--text-ui-md);margin:1.5em 0;overflow-x:auto}.article-content blockquote{border-left:var(--space-1) solid var(--brand);padding-left:var(--space-6);color:var(--text-muted);margin:1.5em 0;font-style:italic}.article-content ul,.article-content ol{padding-left:var(--space-8);line-height:var(--leading-prose);margin-top:1em;margin-bottom:1.5em}.article-content ul{list-style-type:disc;list-style-position:outside}.article-content ol{list-style-type:decimal;list-style-position:outside}.article-content li{padding-left:var(--space-2);margin-bottom:.75em}.article-content li::marker{color:var(--brand-text);font-weight:600}.article-content ul ul,.article-content ol ul{margin-top:.5em;margin-bottom:.5em}.article-content ul ul{list-style-type:circle}.article-content strong,.article-content b{color:var(--text-strong);font-weight:700}.article-content em,.article-content i{font-style:italic}.article-content a{color:var(--brand-text);text-underline-offset:2px;text-decoration:underline;text-decoration-thickness:1px;transition:color .2s,text-decoration-thickness .2s}.article-content a:hover{color:var(--brand-hover);text-decoration-thickness:2px}.article-content code{background:var(--surface-subtle);color:var(--danger);border-radius:var(--radius-sm);font-size:var(--text-ui-md);padding:.2em .4em;font-family:Courier New,Courier,monospace}.article-content pre code{color:inherit;background:0 0;padding:0}.article-content table{border-collapse:collapse;width:100%;font-size:var(--text-small);margin:2em 0}.article-content table th,.article-content table td{border:1px solid var(--border-subtle);padding:var(--space-3) var(--space-4);text-align:left}.article-content table th{background:var(--surface-subtle);color:var(--text-strong);font-weight:700}.article-content table tr:hover{background:var(--surface-muted)}.sidebar{top:var(--space-25);position:sticky}.sidebar-widget{background:var(--surface-default);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);padding:var(--space-6);margin-bottom:var(--space-6);box-shadow:var(--shadow-md)}.sidebar-widget h4{font-size:var(--text-ui-xl);color:var(--text-strong);margin-bottom:var(--space-4);font-weight:700}.sidebar-widget ul{margin:0;padding:0;list-style:none}.sidebar-widget li{margin-bottom:var(--space-2)}.sidebar-widget li a{color:var(--text-strong);font-size:var(--text-small);line-height:var(--leading-small);text-decoration:none;transition:color .2s}.sidebar-widget li a:hover{color:var(--brand-text)}.article-navigation{gap:var(--space-8);padding:var(--space-10) 0;border-top:1px solid var(--border-subtle);margin-top:var(--space-10);grid-template-columns:1fr 1fr;display:grid}.nav-post{padding:var(--space-6);background:var(--surface-default);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-md)}.nav-post .label{font-size:var(--text-ui-md);color:var(--text-subtle);margin-bottom:var(--space-2);text-transform:uppercase;font-weight:600;display:block}.nav-post a{color:var(--text-strong);font-weight:600;font-size:var(--text-ui-xl);line-height:var(--leading-ui);text-decoration:none;transition:color .2s}.nav-post a:hover{color:var(--brand-text)}@media not all and (min-width:64rem){.article-layout{grid-template-columns:1fr}.sidebar{position:static}.article-navigation{gap:var(--space-4);grid-template-columns:1fr}}@media not all and (min-width:48rem){.article-header{padding:var(--space-8) 0}.article-header .container,.article-layout,.article-navigation{padding-left:var(--space-4);padding-right:var(--space-4);box-sizing:border-box}.article-header h1{font-size:var(--text-ui-5xl)}.featured-image{height:250px;margin-bottom:var(--space-8)}.article-layout{padding:var(--space-8) var(--space-4);gap:var(--space-6)}.article-content{font-size:var(--text-ui-lg)}}.sidebar-widget-text{font-size:var(--text-ui-md);color:var(--text-muted);margin-bottom:var(--space-4)}.sidebar-widget[data-related-module] .sidebar-widget-module{margin-bottom:var(--space-1)}.sidebar-widget[data-related-module] .sidebar-widget-module a{color:var(--text-strong);font-weight:600;font-size:var(--text-ui-md);text-decoration:none;transition:color .2s}.sidebar-widget[data-related-module] .sidebar-widget-module a:hover{color:var(--brand-text)}.sidebar-widget[data-related-module] .sidebar-widget-text{-webkit-line-clamp:2;line-clamp:2;margin-bottom:var(--space-4);-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.sidebar-widget[data-related-module] .sidebar-widget-module:last-child,.sidebar-widget[data-related-module] .sidebar-widget-text:last-child{margin-bottom:0}
