.ai-page{--nav-height:68px}.ai-nav{position:sticky;z-index:30;top:0;border-bottom:1px solid var(--border-subtle);background:color-mix(in srgb,var(--bg) 84%,transparent);backdrop-filter:blur(18px)}
.ai-nav__inner{min-height:var(--nav-height);display:flex;align-items:center;gap:28px}.ai-brand{display:inline-flex;align-items:baseline;gap:5px;margin-right:auto;color:var(--text);text-decoration:none;font-size:1.04rem;font-variation-settings:var(--type-ui-strong)}.ai-brand b{color:var(--accent)}.ai-brand span{color:var(--text-muted);font-family:var(--font-mono);font-size:.67rem}.ai-nav nav{display:flex;gap:22px}.ai-nav nav a{color:var(--text-secondary);text-decoration:none;font-size:.84rem;font-weight:560}.ai-nav nav a:hover{color:var(--text)}
.article-hero{padding:clamp(66px,8vw,118px) 0 clamp(48px,6vw,82px);border-bottom:1px solid var(--border-subtle);background:radial-gradient(circle at 80% 12%,var(--accent-soft),transparent 32%)}
.article-hero h1{max-width:17ch;margin:16px 0 0;font-size:clamp(2.8rem,5vw,5.8rem);line-height:.98;letter-spacing:-.05em;font-variation-settings:var(--type-display);text-wrap:balance}.article-hero h1 em{color:var(--accent);font-style:normal}.article-lead{max-width:820px;margin:24px 0 0;color:var(--text-secondary);font-size:clamp(1.02rem,.45vw + .82rem,1.28rem);line-height:1.72}.article-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;color:var(--text-muted);font-family:var(--font-mono);font-size:.66rem}.article-meta span{padding:6px 9px;border:1px solid var(--border);border-radius:999px;background:var(--bg-card-solid)}
.article-body{padding:clamp(54px,7vw,96px) 0}.article-layout{display:grid;grid-template-columns:minmax(0,780px) minmax(250px,330px);justify-content:center;gap:clamp(42px,7vw,100px)}.article-main{min-width:0}.article-main h2{margin:54px 0 16px;font-size:clamp(1.7rem,2.3vw,2.7rem);line-height:1.08;letter-spacing:-.03em}.article-main h2:first-child{margin-top:0}.article-main h3{margin:34px 0 12px;font-size:1.25rem}.article-main p,.article-main li{color:var(--text-secondary);font-size:1rem;line-height:1.78}.article-main ul,.article-main ol{padding-left:1.3rem}.article-main li+li{margin-top:9px}.article-main strong{color:var(--text)}.article-main a{color:var(--accent)}
.article-callout{margin:28px 0;padding:22px 24px;border:1px solid color-mix(in srgb,var(--accent) 26%,var(--border));border-radius:var(--radius);background:linear-gradient(135deg,var(--accent-soft),var(--bg-card-solid))}.article-callout b{display:block;margin-bottom:7px;color:var(--accent);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.06em}.article-callout p{margin:0}.article-example{margin:24px 0;padding:22px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-deep)}
.article-side{align-self:start;position:sticky;top:96px;padding:24px}.article-side h3{margin:0 0 14px;font-size:1rem}.article-side a{display:block;padding:10px 0;border-top:1px solid var(--border-subtle);color:var(--text-secondary);text-decoration:none;font-size:.82rem}.article-side a:hover{color:var(--accent)}.article-side a:first-of-type{border-top:0}.article-side .a1s-btn{margin-top:18px}
.article-related{padding:clamp(54px,7vw,92px) 0;border-top:1px solid var(--border-subtle);background:color-mix(in srgb,var(--bg-deep) 65%,transparent)}.article-related h2{margin:0 0 28px;font-size:clamp(2rem,3vw,3.4rem);letter-spacing:-.04em}.article-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.article-related-card{display:block;min-height:190px;padding:24px;color:inherit;text-decoration:none}.article-related-card span{color:var(--accent);font-family:var(--font-mono);font-size:.65rem}.article-related-card h3{margin:24px 0 8px}.article-related-card p{margin:0;color:var(--text-secondary);font-size:.83rem}.ai-footer{padding:36px 0 52px;border-top:1px solid var(--border-subtle)}.ai-footer__inner{display:flex;justify-content:space-between;gap:30px}.ai-footer p{margin:0;color:var(--text-muted);font-size:.76rem}.ai-footer a{color:var(--text-secondary)}
@media(max-width:900px){.ai-nav nav{display:none}.article-layout{grid-template-columns:1fr}.article-side{position:static}.article-related-grid{grid-template-columns:1fr}}
@media(max-width:600px){.ai-brand span{display:none}.article-hero h1{font-size:clamp(2.55rem,13vw,4.2rem)}.ai-footer__inner{flex-direction:column}}