.arch-explorer{--arch-ink:#203e50;--arch-accent:#347f78;--arch-line:#bed5cc;color:var(--arch-ink);margin:42px 0 30px}
.arch-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px;font-size:12px;color:#536f64}
.arch-modes{display:flex;gap:4px;background:#dfe9df;padding:4px;border:1px solid #c7d7cb;border-radius:30px}
.arch-modes button{padding:9px 16px;border:0;background:transparent;border-radius:25px;font-size:12px;color:#4d675e}
.arch-modes button[aria-pressed=true]{color:#fff;background:#2b635d;box-shadow:0 2px 5px #1c423d14}
.arch-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.25fr) minmax(0,1fr);gap:38px;align-items:stretch}
.arch-node{display:block;position:relative;text-align:left;color:var(--arch-ink);background:#fbfdfb;border:1px solid var(--arch-line);border-radius:15px;padding:23px;min-width:0;transition:box-shadow .18s,border-color .18s,background .18s;cursor:pointer}
.arch-node:hover{border-color:#669a8e;box-shadow:0 5px 18px #1b4b3910}
.arch-node:focus-visible,.arch-modes button:focus-visible{outline:3px solid #3c8d82;outline-offset:4px}
.arch-node.is-selected{border-color:#347f78;box-shadow:inset 0 0 0 1px #347f78,0 4px 20px #1d453b08}
.arch-node strong{display:block;font-family:var(--heading);font-size:24px;font-weight:600;letter-spacing:-.035em;line-height:1.2;margin:8px 0}
.arch-kicker{display:block;font-size:9px;font-weight:650;letter-spacing:.09em;line-height:1.6;color:#577a6d}
.arch-summary{display:block;font-size:11px;line-height:1.65;color:#57736a;font-weight:400}
.arch-icon{display:block;width:66px;height:66px;color:#33596b;margin:16px 0 10px}
.arch-skills{background:linear-gradient(130deg,#f9f4e6,#fffdf6);border-color:#dcd2b5}
.arch-sessions{background:linear-gradient(130deg,#eef0fa,#fcfcff);border-color:#c9cfe4}
.arch-side-arrow{position:absolute;top:50%;right:-30px;transform:translateY(-50%);font-size:27px;line-height:1;color:#45887d;pointer-events:none}
.arch-sessions .arch-side-arrow{right:auto;left:-30px}
.arch-runtime{text-align:center;background:linear-gradient(140deg,#e6f4ec,#fbfefa);padding-top:27px}
.arch-runtime strong{font-size:30px;margin-top:7px}
.arch-loop{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:25px}
.arch-loop-step{display:block;font-size:14px;font-weight:600;background:#fff;border:1px solid #c9dfd2;border-radius:9px;padding:12px 13px;min-width:80px;white-space:nowrap}
.arch-loop-step span{display:block;font-size:9px;letter-spacing:.04em;font-weight:400;color:#668372;margin-top:4px}
.arch-loop>b{font-size:19px;font-weight:400;color:#45887d}
.arch-loop-return{width:100%;height:23px;margin:3px 0 11px;stroke:#45887d;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.arch-wire{display:flex;align-items:center;justify-content:center;gap:10%;padding:16px 0;font-size:11px;color:#58746a}
.arch-wire>span{display:flex;align-items:center;gap:12px}
.arch-wire b{font-size:27px;font-weight:500;line-height:1;color:#368278}
.arch-wire>span:last-child b{color:#4b7697}
.arch-extension{display:flex;align-items:center;width:100%;gap:22px;padding:22px 28px;background:#e6f2ee}
.arch-extension>.arch-icon{margin:0;width:64px;height:64px;flex-shrink:0}
.arch-extension-title{flex:1}
.arch-extension strong{font-size:26px}
.arch-contract{padding:10px 0 10px 24px;border-left:1px solid #bdd3c7}
.arch-contract-branches{display:flex;gap:8px;margin-top:11px}
.arch-contract-branches>span{border:1px solid #c4d6cb;background:#ffffff70;padding:9px 12px;border-radius:8px;font-size:11px;color:#5e796d}
.arch-contract-branches>span.is-active{background:#2e7169;color:#fff;border-color:#2e7169}
.arch-downstream{border:1px solid #c8d9cd;border-radius:17px;background:#f9fcf7;padding:23px}
.arch-downstream-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px;font-size:11px;color:#5e796d}
.arch-service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;position:relative}
.arch-service{padding:18px;background:white;display:flex;flex-direction:column;align-items:flex-start}
.arch-service strong{font-size:22px;margin:14px 0 7px}
.arch-environments{background:#eef7fa;border-color:#bfdbe3}.arch-robots{background:#fff8ed;border-color:#e4d4b8}.arch-policies{background:#f2f0fc;border-color:#d6ceec}.arch-toolchain{background:#fff3eb;border-color:#ead1bc}
.arch-service-image{display:block;width:100%;height:95px;border-radius:8px;overflow:hidden;align-self:center;background:#ffffff7d}
.arch-service-image img{width:100%;height:100%;object-fit:contain}
.arch-environments .arch-service-image img{object-fit:cover}
.arch-policies .arch-service-image{width:100px;background:transparent}
.arch-groot img{width:auto;max-width:none;height:95px;display:block}
.arch-explore{font-size:10px;color:#617a6e;margin-top:auto;padding-top:16px}
.arch-execution-note{font-size:11px;color:#5e796d;text-align:center;margin:19px 0 0;line-height:1.6}
.arch-detail{margin-top:20px;display:grid;grid-template-columns:1fr 1.15fr;gap:35px;border:1px solid #bfd5ca;border-radius:15px;padding:28px;background:#ffffffb3;align-items:start;min-height:215px}
.arch-detail-copy h3{font-size:25px;line-height:1.2;letter-spacing:-.035em;margin:8px 0 13px}
.arch-detail-copy p:not(.arch-kicker){font-size:13px;line-height:1.75;margin-bottom:18px;color:#536d61}
.arch-detail-copy .arch-kicker{margin:0}
.arch-detail-copy .text-link{font-size:12px;white-space:normal;display:inline-block}
.arch-detail-sequence{display:grid;gap:6px;text-align:center;color:#466d60}
.arch-detail-sequence span{border:1px solid #cfdfd4;border-radius:9px;padding:11px 12px;background:#f3f8f2;font-size:12px}
.arch-detail-sequence b{font-weight:400;font-size:18px;line-height:1;transform:rotate(90deg)}
.arch-detail-code{margin:0;padding:20px;border:1px solid #d0dfd6;border-radius:10px;background:#eef5ee;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.9;color:#34574b}
.arch-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.arch-tile{padding:10px;border:1px solid #d7e3db;border-radius:8px;background:#fff;min-width:0;display:flex;flex-direction:column;justify-content:center}
.arch-tile img{width:100%;height:64px;object-fit:contain;margin-bottom:7px}
.arch-tile span{display:block;font-size:10px;line-height:1.5;text-align:center;color:#3e5a4f}
@media(max-width:1000px){.arch-top{gap:25px;grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,1fr)}.arch-node{padding:18px}.arch-kicker{font-size:8px}.arch-node strong{font-size:22px}.arch-runtime strong{font-size:28px}.arch-loop{gap:5px}.arch-loop-step{min-width:0;padding:10px 7px;font-size:12px}.arch-loop>b{font-size:14px}.arch-side-arrow{right:-22px;font-size:21px}.arch-sessions .arch-side-arrow{left:-22px}.arch-summary{font-size:10px}.arch-extension{gap:15px}.arch-extension strong{font-size:23px}.arch-contract{padding-left:15px}.arch-contract-branches{gap:5px}.arch-contract-branches>span{font-size:10px;padding:8px}.arch-service-grid{gap:10px}.arch-service{padding:13px}.arch-service strong{font-size:20px}.arch-detail{gap:22px}}
@media(max-width:720px){.arch-explorer{margin-top:30px}.arch-toolbar{display:block}.arch-toolbar>span{display:block;margin-bottom:12px}.arch-modes{display:inline-flex}.arch-modes button{font-size:11px;padding:9px 14px}.arch-top{grid-template-columns:1fr 1fr;gap:25px 14px}.arch-skills{grid-column:1;grid-row:1}.arch-sessions{grid-column:2;grid-row:1}.arch-runtime{grid-column:1/-1;grid-row:2}.arch-node strong{font-size:23px}.arch-icon{width:53px;height:53px;margin:12px 0 8px}.arch-side-arrow{top:auto;bottom:-23px;left:50%;right:auto;transform:translateX(-50%) rotate(90deg)}.arch-sessions .arch-side-arrow{left:50%}.arch-runtime{padding:22px 15px}.arch-runtime strong{font-size:29px}.arch-loop{gap:9px;margin-top:19px}.arch-loop-step{font-size:13px;padding:11px 9px}.arch-wire{font-size:10px;gap:14px;justify-content:space-between;padding:16px 3px}.arch-wire>span{gap:6px;max-width:53%}.arch-wire b{font-size:23px}.arch-extension{display:grid;grid-template-columns:44px 1fr;padding:20px 16px;gap:13px}.arch-extension>.arch-icon{width:43px;height:43px}.arch-extension strong{font-size:24px}.arch-contract{grid-column:1/-1;border-left:0;border-top:1px solid #c6d9ce;padding:15px 0 0}.arch-contract-branches{gap:8px}.arch-contract-branches>span{flex:1;text-align:center;font-size:11px}.arch-downstream{padding:16px 12px}.arch-downstream-heading{display:block}.arch-downstream-heading>span:last-child{display:block;margin-top:4px;font-size:10px}.arch-service-grid{grid-template-columns:1fr 1fr;gap:10px}.arch-service{padding:12px}.arch-service strong{font-size:21px}.arch-service-image{height:80px}.arch-groot img{height:80px}.arch-policies .arch-service-image{width:84px}.arch-summary{font-size:11px}.arch-execution-note{font-size:10px}.arch-detail{grid-template-columns:1fr;gap:24px;padding:22px;min-height:0}.arch-detail-copy h3{font-size:25px}.arch-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.arch-detail-sequence{grid-template-columns:1fr;gap:6px}}
.arch-dialog{width:min(1000px,94vw);max-height:85vh;padding:45px 28px 28px;border-color:#bcd2c6;background:#f6faf5;overscroll-behavior:contain}
.arch-dialog .arch-detail{border:0;margin:0;padding:0;background:transparent;min-height:0}
#arch-dialog-close{position:absolute;top:12px;right:14px;border:1px solid #c5d7cb;border-radius:50%;width:32px;height:32px;background:white;font-size:24px;line-height:1;color:#34584b}
@media(max-width:720px){.arch-dialog{padding:50px 22px 25px}.arch-dialog .arch-detail{padding:0}}

.arch-tile-media{width:100%;height:96px;margin-bottom:9px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.arch-tile-media img{width:100%;height:96px;object-fit:contain;margin:0}
.arch-tile-groot{width:96px;align-self:center;justify-content:flex-start}
.arch-tile-groot img{width:auto;max-width:none;height:96px;flex-shrink:0}
