:root { --ai-dev-rule: #d4d7cb; --ai-dev-accent: #2445db; }
.ai-dev-hero { border-bottom: 1px solid var(--ai-dev-rule); padding: clamp(64px,8vw,112px) 0 72px; }
.ai-dev-hero h1 { font-size: clamp(34px,5vw,64px); letter-spacing: -.035em; line-height: 1.18; margin: 12px 0 24px; }
.ai-dev-hero .container { max-width: 1060px; }
.ai-dev-lead { font-size: clamp(21px,2.8vw,29px); line-height: 1.55; font-weight: 700; }
.ai-dev-small { font-size: 14px; color: #555d50; margin-top: 24px; }
.ai-dev-hero a,.ai-dev-section a,.ai-dev-article a { color: var(--ai-dev-accent); text-decoration: underline; text-underline-offset: .2em; }
.ai-dev-section { padding: clamp(60px,7vw,90px) 0; }
.ai-dev-section-title { display: flex; align-items: end; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-bottom: 24px; border-bottom: 1px solid var(--ai-dev-rule); }
.ai-dev-section h2 { font-size: clamp(26px,3vw,38px); }
.ai-dev-section-title p { max-width: 420px; }
.ai-dev-section .article-list { display: grid; gap: 0; }
.ai-dev-section .article-entry { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 20px; text-decoration: none; padding: 26px 6px; border-bottom: 1px solid var(--ai-dev-rule); color: inherit; }
.ai-dev-section .article-entry:hover .article-title,.ai-dev-section .article-entry:focus-visible .article-title { color: var(--ai-dev-accent); text-decoration: underline; }
.ai-dev-section .article-kicker { font-size: 13px; color: #555d50; letter-spacing: .06em; margin-bottom: 6px; }
.ai-dev-section .article-title { font-size: clamp(18px,2.3vw,24px); line-height: 1.5; font-weight: 700; }
.ai-dev-section .article-summary { color: #555d50; margin-top: 8px; line-height: 1.8; }
.ai-dev-section .article-arrow { font-size: 20px; }
.ai-dev-empty { padding: 20px 0; color: #555d50; }
.ai-dev-empty[hidden] { display:none; }
.ai-dev-method { background: rgba(170,176,150,.09); }
.ai-dev-method .container { max-width: 1060px; }
.ai-dev-method p { margin-top: 16px; max-width: 780px; }
.ai-dev-article-hero { border-bottom: 1px solid var(--ai-dev-rule); padding: 52px 0; }
.ai-dev-article-hero h1 { font-size: clamp(27px,4vw,46px); line-height: 1.3; margin: 14px 0 20px; }
.ai-dev-article-hero .container { max-width: 780px; }
.ai-dev-article { max-width: 780px; margin: 0 auto; padding: 42px 20px 92px; font-size: 17px; line-height: 2; }
.ai-dev-article h2 { font-size: 1.55em; margin: 2em 0 .8em; }
.ai-dev-article h3 { font-size: 1.2em; margin: 1.6em 0 .7em; }
.ai-dev-article p,.ai-dev-article ul,.ai-dev-article ol { margin: 0 0 1.2em; }
.ai-dev-article code { font-size: .89em; overflow-wrap: anywhere; }
.ai-dev-article pre { padding: 16px; overflow: auto; background: #e9ece2; }
.ai-dev-article table { display: block; overflow-x: auto; width: max-content; max-width: 100%; border-collapse: collapse; }
.ai-dev-article th,.ai-dev-article td { padding: 9px 14px; border: 1px solid var(--ai-dev-rule); }
.ai-dev-article .source-note { border-top: 1px solid var(--ai-dev-rule); padding-top: 20px; margin-top: 48px; }
.ai-dev-article .priority { font-weight: 750; }
.ai-dev-article-breadcrumb { margin: 22px auto; max-width: 780px; font-size: 14px; }
.ai-dev-article-breadcrumb a { text-decoration: underline; }
@media (max-width: 600px) { .ai-dev-article { font-size: 16px; } .ai-dev-section .article-entry { padding: 22px 0; } }