/* ai-infra-overview: figure components only. The page itself uses the notes'
   layout and type from infra-notes.css (same as ai-infra-from-zero-02). */
.prose .io-note figure.io-fig{margin:36px 0}
.prose .io-note figure.io-map{width:min(1000px,calc(100vw - 32px))}
.prose .io-note h3 .num{font-style:italic;color:var(--ink-soft);margin-right:8px}
.prose .io-note .map-shell{border:1px solid #e3e9eb;background:#fbfcfc;border-radius:14px;padding:8px 10px;overflow:hidden}
.prose .io-note .map-svg .svg-note-link{text-decoration:none;cursor:pointer}
.prose .io-note .map-svg .svg-note-link:hover .svg-cta{fill:#C9D14E}
.prose .io-note .fighead{font-family:var(--sans)}
.prose .io-note .diagram h3,.prose .io-note .diagram h4{margin-top:0}
.prose .io-note .fighead{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:15px;font-weight:700;color:#7e8e92;font-size:10px;text-transform:uppercase;letter-spacing:1.8px}
.prose .io-note .fighead .fig-topic{font-weight:500;letter-spacing:1.1px;text-align:right}
.prose .io-note .diagram{border:1px solid #dce5dd;border-radius:19px;background:#fffefa;padding:25px;box-shadow:0 5px 22px rgba(50,73,57,.025)}
.prose .io-note .origin-grid{display:grid;grid-template-columns:1fr 30px 1fr 30px 1fr;align-items:center;gap:6px}
.prose .io-note .origin-card{border:1px solid #d7e2df;border-radius:14px;background:#f9fbf9;padding:23px 12px;min-height:178px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.prose .io-note .origin-card:nth-of-type(3){background:#f3f8f5}
.prose .io-note .icon-circle{width:52px;height:52px;border-radius:50%;border:1px solid #cadfda;background:white;display:flex;justify-content:center;align-items:center;font-size:25px;margin-bottom:14px;color:#6b9988}
.prose .io-note .icon-circle svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.prose .io-note .origin-card h3{font-size:14px;margin:0 0 7px;color:#2b4950;line-height:1.5}
.prose .io-note .origin-card p{font-size:11.5px;margin:0!important;color:#788b91;line-height:1.55!important}
.prose .io-note .arw{color:#9fb5b6;text-align:center;font-size:24px}
.prose .io-note .mini-caption{text-align:center;color:#718a83;font-family:var(--serif);font-size:22px;font-style:italic;margin-top:19px}
.prose .io-note .track-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:26px 0}
.prose .io-note .track-card{border-radius:18px;padding:26px 26px 24px;border:1px solid #cfdddf;background:#eef5f8;position:relative}
.prose .io-note .track-card:last-child{background:#edf6f0;border-color:#cee2d4}
.prose .io-note .track-label{font-size:11px;letter-spacing:1.7px;font-weight:700;color:#5e83a2;margin-bottom:7px}
.prose .io-note .track-card:last-child .track-label{color:#578f79}
.prose .io-note .track-card h3{font-family:var(--serif);font-size:30px;font-weight:600;line-height:1.12;margin:0 0 13px}
.prose .io-note .track-card p{font-size:13.5px!important;line-height:1.85!important;min-height:74px;margin-bottom:15px!important}
.prose .io-note .track-card ul{padding:0;list-style:none;margin:0;display:grid;gap:8px}
.prose .io-note .track-card li{padding:9px 11px;background:rgba(255,255,255,.65);border:1px solid rgba(190,211,212,.6);border-radius:9px;color:#45616c;font-size:12.5px;line-height:1.5}
.prose .io-note .bridge{display:flex;justify-content:center;position:relative;padding-top:12px}
.prose .io-note .bridge svg{width:100%;max-width:500px;height:60px}
.prose .io-note .bridge-answer{border:1px solid #bdd6c9;background:#eaf5ed;text-align:center;max-width:520px;margin:-1px auto 0;border-radius:15px;padding:20px 22px}
.prose .io-note .bridge-answer .bridge-title{font-family:var(--serif);font-size:31px;font-weight:600;line-height:1.1}
.prose .io-note .bridge-answer .bridge-small{font-size:12px;color:#628779;line-height:1.7;margin-top:8px}
.prose .io-note .process-line{margin:34px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:9px}
.prose .io-note .process-node{border-top:2px solid #a8c7bb;padding:11px 10px;background:#f5f9f6;border-radius:0 0 10px 10px;min-height:91px}
.prose .io-note .process-node .count{font-family:var(--serif);font-size:26px;line-height:1;color:#83a49b}
.prose .io-note .process-node h4{margin:8px 0 0;font-weight:600;font-size:12px;line-height:1.6}
.prose .io-note .process-node p{font-size:10.5px!important;line-height:1.7!important;color:#7a8990!important;margin:4px 0 0!important}
.prose .io-note .map-shell{border:1px solid #d8e1db;background:#fffefb;border-radius:18px;padding:8px 10px;overflow:hidden}
.prose .io-note .map-scroll{overflow:auto;scrollbar-width:thin;scrollbar-color:#c1d0cb transparent}
.prose .io-note .map-svg{width:100%;height:auto;min-width:900px;display:block;font-family:"DM Sans","Noto Sans SC",sans-serif}
.prose .io-note .map-svg .svg-note-link{text-decoration:none;cursor:pointer}
.prose .io-note .map-svg .svg-note-link rect{transition:filter .2s}
.prose .io-note .map-svg .svg-note-link:hover rect{filter:brightness(.97)}
.prose .io-note .map-svg .svg-note-link:hover text:first-of-type{text-decoration:underline}
.prose .io-note .scale-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch}
.prose .io-note .scale-card{background:#f5f7f6;border:1px solid #dde6e2;border-radius:14px;padding:19px;text-align:center}
.prose .io-note .scale-card.many{background:#edf5f2}
.prose .io-note .scale-card h4{font-family:var(--serif);font-size:25px;margin:0 0 13px;line-height:1.2;font-weight:600}
.prose .io-note .person-row{display:flex;justify-content:center;align-items:center;gap:7px;height:45px}
.prose .io-note .person{width:24px;height:31px;display:inline-block;position:relative}
.prose .io-note .person:before{content:"";position:absolute;top:2px;left:8px;width:9px;height:9px;background:#89a7b1;border-radius:50%}
.prose .io-note .person:after{content:"";position:absolute;top:13px;left:4px;width:17px;height:16px;border-radius:8px 8px 3px 3px;background:#89a7b1}
.prose .io-note .many .person:before,.prose .io-note .many .person:after{background:#7dae9b}
.prose .io-note .downline{height:25px;width:1px;background:#a0b5ba;position:relative;margin:7px auto 13px}
.prose .io-note .downline:after{content:"";width:6px;height:6px;border-bottom:1px solid #a0b5ba;border-right:1px solid #a0b5ba;transform:rotate(45deg);position:absolute;bottom:0;left:-3px}
.prose .io-note .pipeline-box{border:1px solid #c7d6d7;background:#fffefa;border-radius:10px;padding:10px 9px;font-size:12px;font-weight:700;min-height:43px}
.prose .io-note .pipeline-box span{display:block;font-size:10px;color:#82979a;font-weight:500;line-height:1.8}
.prose .io-note .pipeline-box.emph{border-color:#accdbd;background:#f3faf5}
.prose .io-note .gpu-tile{margin-top:11px;border:1px solid #c7d6d7;background:#fffefa;border-radius:10px;padding:10px;font-size:11px;color:#657c82}
.prose .io-note .gpu-tile strong{font-size:12px;color:#354d54}
.prose .io-note .metric-head{padding:16px;text-align:center;background:#f2f6f3;border:1px solid #dce4da;border-radius:12px;font-weight:700;font-size:14px}
.prose .io-note .metric-branches{display:grid;grid-template-columns:1fr 1fr;gap:17px;padding-top:42px;position:relative}
.prose .io-note .metric-branches:before{content:"";position:absolute;top:14px;left:25%;right:25%;height:1px;background:#b3c6c1}
.prose .io-note .metric-branches:after{content:"";position:absolute;top:0;left:50%;height:14px;width:1px;background:#b3c6c1}
.prose .io-note .metric-branch{background:#f0f7f1;border:1px solid #c9e0d2;border-radius:12px;padding:17px;text-align:center;position:relative;min-height:116px}
.prose .io-note .metric-branch:before{content:"";position:absolute;top:-28px;left:50%;height:28px;width:1px;background:#b3c6c1}
.prose .io-note .metric-branch.warn{background:#faf3e8;border-color:#e5d5bc}
.prose .io-note .metric-branch h4{margin:0 0 5px;font-size:15px}
.prose .io-note .metric-branch p{font-size:12px!important;line-height:1.7!important;color:#687a7b!important;margin:0!important}
.prose .io-note .metric-join{display:grid;place-items:center;font-size:23px;color:#9eaaa6;margin:13px 0}
.prose .io-note .metric-bottom{text-align:center;background:#fffefa;border:1px solid #b7d4c5;border-radius:12px;padding:19px;font-weight:700;font-size:15px;color:#345f51}
.prose .io-note .metric-bottom span{font-size:12px;color:#748983;font-weight:400;display:block;margin-top:4px}
.prose .io-note .reflection-art{margin:38px 0 20px;border-radius:19px;background:linear-gradient(145deg,#f0f5ef,#f6f5ec);border:1px solid #dce6dc;padding:20px}
.prose .io-note .reflection-art svg{width:100%;height:auto;display:block}
.prose .io-note .final-quote{font-family:var(--serif);font-size:clamp(30px,4.3vw,48px);text-align:center;line-height:1.2;color:#4a7869;margin:50px auto 12px;font-style:italic}
.prose .io-note .final-quote-cn{text-align:center;color:#758b84;font-size:12px;letter-spacing:.5px}
@media(max-width:980px){.prose .io-note .map-svg{min-width:880px}}
@media(max-width:730px){.prose .io-note .origin-grid{grid-template-columns:1fr;gap:8px}.prose .io-note .origin-card{min-height:115px;padding:18px}.prose .io-note .arw{transform:rotate(90deg)}.prose .io-note .track-pair{grid-template-columns:1fr}.prose .io-note .track-card p{min-height:0}.prose .io-note .bridge svg{height:45px}.prose .io-note .process-line{grid-template-columns:repeat(2,1fr)}.prose .io-note .process-node:last-child{grid-column:span 2}.prose .io-note .map-shell{padding:5px}.prose .io-note .scale-grid{grid-template-columns:1fr}.prose .io-note .fighead{flex-direction:column;align-items:flex-start}.prose .io-note .fighead .fig-topic{text-align:left}.prose .io-note .metric-branches{gap:8px}.prose .io-note .metric-branch{padding:13px 9px}.prose .io-note .metric-branch h4{font-size:13px}.prose .io-note .metric-branch p{font-size:11px!important}}
@media print{.prose .io-note .map-scroll{overflow:visible}.prose .io-note .map-svg{min-width:0}}