:root{--ink:#12283e;--muted:#53677c;--nav:#0d2239;--green:#087e6c;--line:#dce4eb;--bg:#f1f5f8}*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:1.6;background:var(--bg);color:var(--ink)}button,input,textarea,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--line);background:white;color:var(--ink);padding:8px 14px;border-radius:7px;font-weight:600}button:hover{background:#e8f7f2}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #049f83;outline-offset:3px}header{min-height:88px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:16px 32px;gap:20px}.brand{display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none;font-weight:800;font-size:14px;letter-spacing:1px}.brand small{display:block;color:var(--muted);font-size:13px;font-weight:400;letter-spacing:0}.mark{background:var(--nav);color:#4bd6b5;padding:5px 15px;border-radius:8px;font-size:26px}.timer{display:flex;align-items:center;gap:9px}.timer span{font-variant-numeric:tabular-nums;font-size:24px;font-weight:700;margin-right:8px}#start,.primary{background:var(--green);color:white;border-color:var(--green)}.layout{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:calc(100vh - 88px)}aside{background:var(--nav);color:white;padding:28px 20px}nav{display:grid;gap:5px;margin:14px 0 30px}nav a{padding:10px 12px;border-radius:6px;text-decoration:none;color:#c7d4e2;font-size:15px}nav a.active{background:#203d55;color:#64e2c2;border-left:3px solid #64e2c2}.eyebrow{font-size:12px;letter-spacing:1.6px;font-weight:800;color:var(--muted)}aside .eyebrow{color:#90abc1}.sidecard{border-top:1px solid #345066;padding-top:24px}.sidecard p{font-size:18px;line-height:1.9}.sidefoot{color:#90abc1;font-size:13px;margin-top:35px}main{padding:32px 40px;max-width:1500px;width:100%;margin:0 auto}h1{font-size:32px;line-height:1.2;margin:7px 0 12px;letter-spacing:-.7px}h2{font-size:23px;line-height:1.3;margin:0 0 12px}h3{font-size:18px;margin:0 0 8px}p{margin:0 0 15px}.subtitle{color:var(--muted);max-width:760px}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.between{justify-content:space-between}.card{background:white;border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:18px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.full{grid-column:1/-1}.key{background:#e5f5ef;border-left:4px solid var(--green);padding:15px 18px;border-radius:0 8px 8px 0;margin:16px 0}.key b{display:block;font-size:12px;letter-spacing:1px;color:var(--green);margin-bottom:5px}.pill{font-size:13px;font-weight:700;padding:4px 10px;border-radius:20px;background:#e8eef4;color:#39566f}.muted{color:var(--muted)}.phases{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:24px 0}.phase{text-align:left;padding:15px;min-height:94px}.phase span{display:block;font-size:13px;color:var(--muted)}.phase strong{display:block;margin-top:5px;font-size:15px}.phase.active{background:var(--nav);color:white;border-color:var(--nav)}.phase.active span{color:#a6c5d6}.answer{font-size:18px;line-height:1.8}details{border:1px solid var(--line);border-radius:8px;margin:10px 0;background:white}summary{cursor:pointer;padding:14px 18px;font-weight:600}details[open] summary{border-bottom:1px solid var(--line)}.detail-body{padding:18px}ul{padding-left:23px}li{margin-bottom:7px}input[type=search],select,textarea{width:100%;border:1px solid #becbd7;border-radius:7px;padding:11px 14px;background:white;color:var(--ink)}textarea{min-height:140px;resize:vertical}.searchbar{display:grid;grid-template-columns:1fr 210px;gap:12px;margin:22px 0}.band{display:grid;grid-template-columns:160px 1fr;gap:16px;border:1px solid var(--line);border-left:5px solid #577c9c;background:white;padding:20px;margin-bottom:10px;border-radius:9px}.band.cloud{border-left-color:#d69927}.band.dmz{border-left-color:#b86649}.band.uns{border-left-color:#07846f}.nodes{display:flex;gap:9px;flex-wrap:wrap}.node{text-align:left;font-size:14px;padding:10px 13px;background:#f4f7fa}.flowlabel{text-align:center;color:var(--muted);font-size:13px;margin:4px}.split{display:grid;grid-template-columns:1.25fr 1fr;gap:22px}.sticky{position:sticky;top:20px;align-self:start}.node.selected{border:2px solid var(--green);background:#e5f5ef}.number{font-size:12px;color:var(--green);font-weight:800;letter-spacing:1px}.step{border-left:3px solid var(--green);padding:15px 20px;margin:10px 0;background:white}.code{background:var(--nav);color:#bce9de;border-radius:8px;padding:20px;font-family:monospace;font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere}.tablewrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}th{text-align:left;background:#eaf0f5}th,td{padding:13px;border-bottom:1px solid var(--line);vertical-align:top}a{color:var(--green)}.checks label{display:flex;gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid var(--line)}input[type=checkbox]{width:18px;height:18px;margin-top:4px;accent-color:var(--green)}.progress{height:6px;background:#dfe9e4;border-radius:8px;overflow:hidden;margin:10px 0}.progress span{display:block;background:var(--green);height:100%}.qtitle{font-size:25px;line-height:1.45}.empty{padding:50px;text-align:center;color:var(--muted)}#toast{position:fixed;bottom:24px;right:24px;background:var(--nav);color:white;padding:12px 20px;border-radius:8px;display:none}.ref{font-size:14px}.controls{margin:18px 0}.small{font-size:14px}footer{margin-top:28px;color:var(--muted);font-size:13px}@media(max-width:1100px){main{padding:28px 24px}.split{grid-template-columns:1fr}.sticky{position:static}.phases{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){header{padding:16px;flex-wrap:wrap}.layout{display:block}aside{padding:12px 16px}.sidecard,.sidefoot,aside>.eyebrow{display:none}nav{display:flex;overflow-x:auto;margin:0;gap:6px}nav a{white-space:nowrap}main{padding:24px 16px}.grid{grid-template-columns:1fr}.band{grid-template-columns:1fr}.searchbar{grid-template-columns:1fr}h1{font-size:28px}.card{padding:20px}.timer span{font-size:20px}.brand small{font-size:12px}}@media print{header,.layout>aside,.controls,button,.searchbar{display:none}.layout,main,.grid,.split{display:block}main{padding:0}.card,details,.band{break-inside:avoid}.sticky{position:static}body{background:white}}
