.coding-tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;list-style:none;padding:0;margin:32px 0 20px}
.coding-tool-grid li{display:flex;align-items:center;gap:16px;padding:20px;border:1px solid #ccd1d4;border-radius:12px;background:#fff;color:#14191f;font-weight:700}
.coding-tool-grid img{width:40px;height:40px;object-fit:contain;flex-shrink:0}
.coding-tool-note{color:var(--x-t3);font-size:14px;line-height:1.6;max-width:75ch;margin-bottom:16px}
@media(max-width:900px){.coding-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.coding-tool-grid{grid-template-columns:1fr}}
.coding-page .x-hero.x-hero-wide .x-wrap{align-items:center}
.dev-flow{margin:0;padding:26px;border:1px solid #ccd1d4;border-radius:20px;background:#f1f8f8;box-shadow:0 24px 50px -32px #17394c55;color:#242e38}
.dev-flow figcaption{font-size:18px;font-weight:800;margin-bottom:22px}
.dev-flow-tools{display:flex;flex-wrap:wrap;gap:8px}
.dev-flow-tools>span{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e1e3e3;padding:10px;border-radius:6px;font-size:13px;font-weight:700}
.dev-flow-tools img{object-fit:contain}
.dev-flow-arrow{display:flex;align-items:center;gap:12px;font-size:13px;color:#485C70;padding:13px 8px}
.dev-flow-arrow>span{font-size:25px;color:#0f8c99}
.dev-flow-gateway{background:#1c242c;color:#fff;border-radius:12px;padding:20px}
.dev-flow-gateway>strong{font-size:20px}
.dev-flow-gateway>div{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.dev-flow-gateway>div>span{font-size:12px;border:1px solid #0F8C99;border-radius:6px;padding:6px 8px;color:#b9e3e7}
.dev-flow-models{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dev-flow-models>div{padding:16px;border:1px solid #7ed6df;background:#e4f5ec;border-radius:12px}
.dev-flow-models strong,.dev-flow-models span{display:block;font-size:14px}
.dev-flow-models span{margin-top:5px;color:#3a4a5a}
.dev-flow>p,.dev-policy>p{font-size:12px;line-height:1.5;color:#587089;margin:16px 0 0}
.dev-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:36px}
.dev-benefits article{border-top:2px solid #0f8c99;padding-top:20px}
.dev-label{font-size:11px;letter-spacing:.08em;font-weight:800;color:#0f8c99}
.dev-benefits h3{font-size:23px;line-height:1.25;margin:15px 0 12px;letter-spacing:-.5px}
.dev-benefits p,.dev-routing p{font-size:15px;line-height:1.65;color:#485C70;margin:0 0 20px}
.dev-routing{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:30px 0 24px}
.dev-routing article{border:1px solid #ccd1d4;border-radius:12px;padding:26px;background:#f7f7f6;min-width:0}
.dev-routing h3{font-size:21px;margin:0 0 10px}
.dev-route-line{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin:12px 0;font-size:13px}
.dev-route-line>span:first-child,.dev-route-line>strong{border:1px solid #ccd1d4;background:#fff;padding:12px;border-radius:6px}
.dev-route-line>strong{background:#e4f5ec;border-color:#7ed6df;color:#1F6B49}
.dev-routing .dev-example{font-size:12px;margin:18px 0 0}
.dev-lock-request{border:1px solid #ccd1d4;background:#fff;border-radius:6px;padding:14px;font-size:14px}
.dev-lock-request small{display:block;margin-top:6px;color:#587089}
.dev-lock-result{display:flex;align-items:center;gap:12px;padding:15px 0 0;font-size:14px;color:#1F6B49}
.dev-lock-result>span{font-size:25px}
.dev-lock-result>strong{background:#e4f5ec;border:1px solid #7ed6df;padding:12px;border-radius:6px;flex:1}
.dev-endpoint{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.dev-policy{margin:0;background:white;border:1px solid #ccd1d4;border-radius:12px;padding:24px}
.dev-policy figcaption{font-size:17px;font-weight:800;margin-bottom:20px}
.dev-policy>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 0;border-top:1px solid #e1e3e3;font-size:14px}
.dev-policy strong{font-size:12px;padding:7px 10px;border-radius:6px;white-space:nowrap}
.dev-allowed{color:#1F6B49;background:#e4f5ec}.dev-observed{color:#7c4a0e;background:#fbf1dc}.dev-blocked{color:#d14343;background:#fbe9e9}
@media(max-width:900px){.coding-page .x-hero.x-hero-wide .x-wrap,.dev-endpoint{grid-template-columns:1fr}.dev-benefits{gap:20px}.dev-benefits h3{font-size:20px}}
@media(max-width:650px){.dev-benefits,.dev-routing{grid-template-columns:1fr}.dev-flow{padding:20px}.dev-routing article{padding:20px}.dev-endpoint{gap:26px}.dev-policy{padding:20px}}
/* Page-specific reading rhythm; keep shared site typography intact. */
.coding-page .x-hero h1{line-height:1.12;margin:22px 0 24px}
.coding-page .x-hero .x-one-line{line-height:1.8;margin:0 0 24px;color:#a2b2c3}
.coding-page .x-checks{gap:14px 22px;line-height:1.6;margin-top:24px}
.coding-page .x-cta{margin-top:30px}
.coding-page .x-sec h2{line-height:1.22;margin:14px 0 22px}
.coding-page .x-sub{font-size:16px;line-height:1.8;max-width:64ch;color:#a2b2c3;margin:0 0 26px}
.coding-page .dev-benefits h3{line-height:1.35;margin:16px 0}
.coding-page .dev-benefits p{line-height:1.8;color:#a2b2c3;margin-bottom:22px}
.coding-page .dev-label{color:#7ed6df}
.coding-page .dev-routing h3{color:#242e38;line-height:1.35;margin-bottom:14px}
.coding-page .dev-routing p{line-height:1.8;margin-bottom:22px}
.coding-page .dev-routing .dev-example{line-height:1.7;margin:20px 0 0}
.coding-page .dev-policy{color:#242e38;line-height:1.7}
.coding-page .dev-flow{line-height:1.6}
.coding-page .dev-flow-arrow{line-height:1.65;padding:16px 8px}
.coding-page .dev-flow-models strong{line-height:1.5}
.coding-page .dev-route-line{line-height:1.6}
.coding-page .dev-lock-request,.coding-page .dev-lock-result{line-height:1.6;color:#242e38}
.coding-page .coding-tool-grid{margin:34px 0 24px}
.coding-page .coding-tool-grid li{line-height:1.6;padding:22px 20px}
.coding-page .coding-tool-note{line-height:1.8;margin:0 0 24px;color:#a2b2c3}
.coding-page .site-close h2{line-height:1.22;margin:18px 0 24px}
.coding-page .site-close p:last-child{line-height:1.8;max-width:55ch;font-size:15px}
.coding-page .x-more{display:inline-block;line-height:1.65}
@media(max-width:650px){.coding-page .x-sec{padding:56px 0}.coding-page .dev-benefits{gap:32px}.coding-page .x-hero h1{letter-spacing:-1px}.coding-page .dev-flow-tools>span{font-size:12px}}
.coding-page .dev-route-line{color:#242e38}
.coding-page .dev-flow-tools img[src*="codex"],.coding-page .coding-tool-grid img[src*="codex"]{filter:brightness(.25)}
.coding-page #coding-tools-title{scroll-margin-top:150px}
@media(max-width:560px){.coding-page .coding-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.coding-page .coding-tool-grid li{padding:18px 12px;gap:9px;font-size:13px}.coding-page .coding-tool-grid img{width:28px;height:28px}}
.dev-setup-options{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:30px 0}
.dev-setup-options article{padding:26px;border:1px solid var(--d-bd-2);border-radius:12px;background:var(--navy-2)}
.coding-page .dev-setup-options h3{font-size:21px;line-height:1.35;margin:0 0 14px}
.dev-setup-options p{color:#a2b2c3;font-size:15px;line-height:1.8;margin:0 0 18px}
.dev-setup-options .dev-platform{display:inline-block;color:#a9e4ea;border:1px solid #0f8c99;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:700}
.dev-setup-options .dev-setup-note{font-size:13px;margin-bottom:0}
@media(max-width:650px){.dev-setup-options{grid-template-columns:1fr}.dev-setup-options article{padding:22px}}
/* Coding controls reused in the combined Shadow AI solution. */
.solution-readable .dev-benefits p{color:#bdcbd6;line-height:1.85}
.solution-readable .dev-label{color:#88dce6}
.solution-readable .dev-routing h3{color:#242e38;line-height:1.4}
.solution-readable .dev-routing p{color:#485c70}
.solution-readable .dev-route-line,.solution-readable .dev-lock-request{color:#242e38}
.solution-readable .dev-setup-options h3{font-size:21px;line-height:1.4;margin:0 0 14px}
.solution-readable .dev-setup-options p,.solution-readable .coding-tool-note{color:#bdcbd6}
.solution-readable [id$="-title"]{scroll-margin-top:110px}
.solution-readable .coding-tool-grid img[src*="codex"],.security-v3 .coding-tool-grid img[src*="codex"]{filter:brightness(.25)}