.ai-roadmap-page{--air-bg:#090d24;--air-panel:#111936;--air-line:#2b3a68;--air-text:#eef2ff;--air-muted:#aeb8da;--air-cyan:#55ddff;--air-violet:#a979ff;--air-pink:#ff70c8;--air-yellow:#ffd447;color:var(--air-text)}
.ai-roadmap-page .article-featured,.ai-roadmap-page .roadmap-figure img{display:block;width:100%;height:auto}.ai-roadmap-page .article-featured{max-width:1200px;margin:clamp(1.5rem,4vw,3rem) auto;border-radius:24px;box-shadow:0 26px 80px rgba(0,0,0,.4)}.ai-roadmap-hero{background:radial-gradient(circle at 82% 18%,rgba(169,121,255,.2),transparent 33%),radial-gradient(circle at 12% 80%,rgba(85,221,255,.13),transparent 28%)}
.ai-roadmap-page .article-content h2,.ai-roadmap-page .article-content h3{scroll-margin-top:110px}.ai-roadmap-page .article-content h2{margin-top:3.25rem}.ai-roadmap-page .article-content h3{margin-top:1.4rem}.ai-roadmap-page .article-content p,.ai-roadmap-page .article-content li{color:var(--air-muted)}.ai-roadmap-page .article-content a{font-weight:650}.ai-roadmap-page .article-content code{color:#fff09b}
.roadmap-toc{margin:2rem 0;padding:1.4rem;border:1px solid var(--air-line);border-radius:20px;background:linear-gradient(145deg,rgba(85,221,255,.06),rgba(169,121,255,.06))}.roadmap-toc strong{display:block;margin-bottom:.85rem;color:var(--air-cyan)}.roadmap-toc ol{columns:2;gap:2rem;margin:0;padding-left:1.2rem}.roadmap-toc li{break-inside:avoid;margin:.38rem 0}.roadmap-toc a{color:var(--air-text)}
.ai-roadmap-page .code-block{position:relative;margin:1.5rem 0;border:1px solid var(--air-line);border-radius:18px;background:#050817;overflow:auto}.ai-roadmap-page .code-block__label{display:block;padding:.75rem 1rem;border-bottom:1px solid var(--air-line);color:var(--air-cyan);font-size:.78rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.ai-roadmap-page pre{margin:0;padding:1.2rem;color:#edf4ff;font-size:.88rem;line-height:1.72;white-space:pre;overflow:auto}
.roadmap-stack-row,.simple-ai-flow,.vector-flow{display:flex;align-items:stretch;gap:.55rem;margin:1.5rem 0;overflow:auto}.roadmap-stack-row span,.simple-ai-flow span,.vector-flow span{display:grid;place-items:center;min-width:120px;padding:1rem;border:1px solid var(--air-line);border-radius:14px;background:var(--air-panel);color:var(--air-text);font-weight:850;text-align:center}.roadmap-stack-row span:nth-of-type(odd),.simple-ai-flow span:nth-of-type(odd),.vector-flow span:nth-of-type(odd){border-color:rgba(85,221,255,.55);color:var(--air-cyan)}.roadmap-stack-row span:nth-of-type(even),.simple-ai-flow span:nth-of-type(even),.vector-flow span:nth-of-type(even){border-color:rgba(169,121,255,.55);color:#cfb4ff}.roadmap-stack-row i,.simple-ai-flow i,.vector-flow i{align-self:center;color:var(--air-yellow);font-style:normal;font-weight:900}
.roadmap-figure{margin:2rem 0;padding:10px;border-radius:24px;background:linear-gradient(135deg,rgba(85,221,255,.38),rgba(169,121,255,.15),rgba(255,112,200,.34))}.roadmap-figure img{border-radius:17px}.roadmap-figure figcaption{padding:.85rem .8rem .35rem;color:var(--air-muted);font-size:.92rem}
.project-callout{margin:1.4rem 0;padding:1.25rem;border:1px solid rgba(85,221,255,.35);border-left:4px solid var(--air-cyan);border-radius:16px;background:rgba(85,221,255,.055)}.project-callout span{color:var(--air-cyan);font-size:.76rem;font-weight:900;letter-spacing:.09em}.project-callout h3{margin:.4rem 0!important}.project-callout p{margin:0}.project-pair{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.project-pair .project-callout:nth-child(2){border-color:rgba(169,121,255,.35);border-left-color:var(--air-violet);background:rgba(169,121,255,.055)}.project-pair .project-callout:nth-child(2) span{color:#c6a7ff}
.agent-flow,.mcp-tree{display:grid;justify-items:center;gap:.55rem;margin:1.5rem 0;padding:1.3rem;border:1px solid var(--air-line);border-radius:20px;background:#0b112b}.agent-flow>span,.mcp-tree>span{min-width:190px;padding:.8rem 1rem;border:1px solid var(--air-cyan);border-radius:12px;color:var(--air-cyan);font-weight:900;text-align:center}.agent-flow>i,.mcp-tree>i{color:var(--air-yellow);font-style:normal}.agent-flow>div,.mcp-tree>div{display:grid;grid-template-columns:repeat(4,1fr);gap:.65rem;width:100%}.agent-flow b,.mcp-tree b{padding:.75rem;border:1px solid var(--air-violet);border-radius:10px;color:#d5c1ff;text-align:center}
.stack-ladder{display:grid;gap:.7rem;margin:1.5rem 0;counter-reset:stack}.stack-ladder div{position:relative;display:grid;grid-template-columns:minmax(190px,.65fr) 1.35fr;gap:1rem;align-items:center;padding:1rem 1rem 1rem 4rem;border:1px solid var(--air-line);border-radius:14px;background:linear-gradient(90deg,rgba(85,221,255,.06),rgba(169,121,255,.035));counter-increment:stack}.stack-ladder div:before{content:counter(stack);position:absolute;left:1rem;display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--air-yellow);border-radius:50%;color:var(--air-yellow);font-weight:900}.stack-ladder strong{color:var(--air-cyan)}.stack-ladder span{color:var(--air-muted)}
.project-roadmap{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.5rem 0}.project-roadmap article{position:relative;padding:1.2rem;border:1px solid var(--air-line);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.012))}.project-roadmap article>b{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--air-cyan);border-radius:50%;color:var(--air-cyan)}.project-roadmap article:nth-child(3n+2)>b{border-color:var(--air-violet);color:#c7a9ff}.project-roadmap article:nth-child(3n)>b{border-color:var(--air-pink);color:#ff9bd9}.project-roadmap h3{margin:.8rem 0 .45rem!important}.project-roadmap p{margin:0;font-size:.94rem}
.month-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin:1.5rem 0}.month-grid article{padding:1.2rem;border:1px solid var(--air-line);border-radius:18px;background:var(--air-panel)}.month-grid article>span{color:var(--air-yellow);font-size:.76rem;font-weight:900;letter-spacing:.1em}.month-grid h3{margin:.45rem 0!important}.month-grid ol{margin:0;padding-left:1.2rem}.month-grid li{margin:.35rem 0}
.language-choice{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}.language-choice article{padding:1.25rem;border:1px solid rgba(85,221,255,.4);border-radius:18px;background:rgba(85,221,255,.05)}.language-choice article:nth-child(2){border-color:rgba(169,121,255,.4);background:rgba(169,121,255,.05)}.language-choice h3{margin:0 0 .7rem!important}.mistake-list{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;list-style:none;padding:0}.mistake-list li{position:relative;padding:.9rem 1rem .9rem 2.4rem;border:1px solid var(--air-line);border-radius:12px;background:#0e1632}.mistake-list li:before{content:"×";position:absolute;left:1rem;color:#ff88b8;font-weight:900}
.final-roadmap{display:flex;flex-wrap:wrap;gap:.65rem;margin:1.5rem 0}.final-roadmap span{position:relative;padding:.75rem 1.75rem .75rem 1rem;border:1px solid var(--air-line);border-radius:999px;background:var(--air-panel);color:var(--air-text);font-weight:800}.final-roadmap span:not(:last-child):after{content:"→";position:absolute;right:-.85rem;color:var(--air-yellow);z-index:2}
.roadmap-faq details{margin:.8rem 0;border:1px solid var(--air-line);border-radius:14px;background:var(--air-panel)}.roadmap-faq summary{padding:1rem 1.15rem;cursor:pointer;font-weight:800}.roadmap-faq details p{padding:0 1.15rem 1rem;margin:0}.roadmap-resources{margin-top:3rem}.roadmap-resources ul{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;list-style:none;padding:0}.roadmap-resources li{padding:.8rem 1rem;border:1px solid var(--air-line);border-radius:12px}.roadmap-resources a{color:var(--air-cyan)}
.roadmap-cta{margin:3rem 0;padding:clamp(1.4rem,4vw,2.4rem);border:1px solid rgba(255,212,71,.45);border-radius:24px;background:radial-gradient(circle at 90% 10%,rgba(255,112,200,.16),transparent 35%),linear-gradient(145deg,rgba(85,221,255,.08),rgba(169,121,255,.09))}.roadmap-cta>span{color:var(--air-yellow);font-size:.78rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.roadmap-cta h2{margin:.45rem 0!important}.roadmap-cta p{max-width:650px}.ai-roadmap-page .article-toc .blog-button{display:inline-flex;margin-top:1rem}
@media (max-width:991px){.project-roadmap{grid-template-columns:1fr 1fr}.agent-flow>div,.mcp-tree>div{grid-template-columns:1fr 1fr}}
@media (max-width:767px){.roadmap-toc ol{columns:1}.roadmap-stack-row,.simple-ai-flow,.vector-flow{display:grid}.roadmap-stack-row i,.simple-ai-flow i,.vector-flow i{justify-self:center;transform:rotate(90deg)}.project-pair,.month-grid,.language-choice{grid-template-columns:1fr}.stack-ladder div{grid-template-columns:1fr;padding-left:4rem}.project-roadmap{grid-template-columns:1fr}.mistake-list,.roadmap-resources ul{grid-template-columns:1fr}}
@media (max-width:480px){.agent-flow>div,.mcp-tree>div{grid-template-columns:1fr}.final-roadmap{display:grid}.final-roadmap span:not(:last-child):after{content:"↓";right:auto;left:50%;bottom:-.85rem}.ai-roadmap-page pre{font-size:.8rem}}
