:root{--bg:#0a101b;--panel:#111b2a;--line:#25354a;--text:#e8f0fa;--muted:#95a6bd;--control:#58b7ff;--sbi:#c59cff;--pfcp:#ffc374;--user:#66e6b1;font-family:Inter,Segoe UI,system-ui,sans-serif;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}header{padding:24px 32px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:16px;align-items:center}.logo{font-weight:800;background:var(--user);color:#0a2422;border-radius:12px;padding:12px;font-size:25px}h1{font-size:26px;font-weight:650;letter-spacing:-.7px;margin:0}p{margin:5px 0 0;color:var(--muted);font-size:14px}.status{display:flex;gap:12px;align-items:center}.badge{font-size:11px;font-weight:700;letter-spacing:1.2px;padding:8px 10px;border:1px solid var(--line);border-radius:7px}.connected{color:var(--user)}.lab-label{font-size:12px;color:var(--muted)}main{padding:20px 32px 24px;max-width:2000px;margin:auto}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.playback,.legend{display:flex;gap:10px;align-items:center}button,select,input{font:inherit}button,select{border:1px solid #33475e;background:#172536;color:var(--text);padding:10px 14px;border-radius:7px;cursor:pointer;font-size:13px;font-weight:550}button:hover{background:#253b53;border-color:#668bb2}button:disabled{opacity:.4;cursor:default}button.primary{background:#234c65;border-color:#4782a3}button.danger{border-color:#9e5454;color:#ffb8af}button.quiet{background:transparent;padding:5px 9px;font-size:11px}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--control);outline-offset:3px}#buffer{font-size:12px;color:var(--muted)}.legend{gap:18px}.legend label{display:flex;align-items:center;gap:6px;font-size:12px;cursor:pointer}.legend input{accent-color:#93b8d8}.legend i{width:7px;height:7px;border-radius:50%}.control{background:var(--control)}.sbi{background:var(--sbi)}.pfcp{background:var(--pfcp)}.user{background:var(--user)}.metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:16px}.metrics article{border:1px solid var(--line);border-radius:10px;padding:16px 20px;background:var(--panel)}.metrics span{display:block;font-size:10px;letter-spacing:1.4px;color:#a5b7ca}.metrics strong{font-size:34px;font-weight:600;display:block;margin:5px 0}.metrics em{font-style:normal;font-size:14px;color:var(--muted)}.metrics small{font-size:11px;color:var(--muted)}.blue strong,.blue-text{color:var(--control)}.green strong,.green-text{color:var(--user)}.workspace{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(340px,1fr);gap:16px}.panel{border:1px solid var(--line);background:var(--panel);border-radius:12px;overflow:hidden}.panel-heading{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;gap:10px}.panel-heading h2{font-size:16px;margin:0;font-weight:600}.panel-heading p{font-size:12px}.panel-heading>span{font-size:11px;color:var(--muted)}#topology{display:block;width:100%;max-height:480px}.cloud{fill:#192238;stroke:#364465;stroke-dasharray:5 5}.cloud-label{font-size:12px;letter-spacing:2px;fill:#ac9ecc}.node rect{fill:#1c2b3e;stroke:#41566f;stroke-width:1.5}.node text{fill:var(--text);font-size:20px;font-weight:600;text-anchor:middle}.node .node-subtitle{font-size:11px;fill:#a9bbce;font-weight:400}.node{transition:opacity 1.5s;cursor:pointer}.node.idle{opacity:.5}.node.pulse rect{stroke:var(--user);stroke-width:3}.node.selected rect{fill:#274f60;stroke:var(--user)}.network-link{fill:none;stroke:#34485f;stroke-width:2}.network-link.control-link{stroke:#335477;stroke-dasharray:6 4}.network-link.user-link{stroke:#315e55;stroke-width:4}.link-label{fill:#8da9c2;font-size:12px;text-anchor:middle}.path-caption{fill:#89c8b4;font-size:12px;letter-spacing:2px}.ue-detail{border-top:1px solid var(--line);padding:14px 20px;display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted);min-height:48px}.detail-dot{width:7px;height:7px;flex-shrink:0;border-radius:50%;background:var(--user)}.ladder{display:flex;flex-direction:column;min-width:0}#ladder-scroll{height:400px;overflow:auto;margin:0 12px;scrollbar-width:thin}#ladder{width:100%;display:block}.ladder-head{fill:#9cb0c5;font-size:11px;text-anchor:middle}.ladder-line{stroke:#324258;stroke-dasharray:3 5}.ladder-message{font-size:10px;fill:#e2eaf8}.latest{border-top:1px solid var(--line);padding:15px 20px;min-height:50px;font-size:12px;color:var(--muted);margin-top:auto}.narration{border:1px solid #35566c;border-left:4px solid var(--control);border-radius:9px;margin:16px 0;padding:18px 22px;background:#142332}.narration>span{font-size:10px;font-weight:700;letter-spacing:1.8px;color:var(--control)}.narration p{font-size:20px;line-height:1.5;color:var(--text);margin-top:7px}.lower{display:grid;grid-template-columns:1.1fr 1fr;gap:16px;margin-bottom:16px}.chart-panel{padding-bottom:10px}.chart-panel canvas{display:block;width:100%;padding:0 12px}.chart-key,#chart-legend{font-size:11px;display:flex;gap:20px;justify-content:center;min-height:22px}.chart-panel .panel-heading{padding-bottom:8px}.scenarios .panel-heading a{color:var(--control);text-decoration:none;font-size:12px}.scenario-buttons{display:flex;flex-wrap:wrap;gap:8px;padding:0 20px 16px}.scenario-buttons button{font-size:12px}#chat-form{display:flex;align-items:center;gap:12px;padding:0 20px 12px}#chat-form label{font-size:12px;color:var(--muted)}#chat-message{flex:1;background:#0e1825;color:var(--text);border:1px solid var(--line);border-radius:6px;padding:10px;max-width:500px}#action-output{margin:0;border-top:1px solid var(--line);padding:12px 20px;white-space:pre-wrap;font:12px/1.5 Consolas,monospace;color:#a4bacd;max-height:130px;overflow:auto}footer{display:flex;justify-content:space-between;padding:0 32px 22px;color:#6f839d;font-size:11px}.warning{color:var(--pfcp)!important}@media(min-width:1800px){h1{font-size:32px}.panel-heading h2{font-size:20px}.legend label,button,select{font-size:16px}.metrics strong{font-size:42px}.narration p{font-size:26px}#topology{max-height:600px}#ladder-scroll{height:510px}}@media(max-width:1100px){header{padding:20px}.lab-label{display:none}main{padding:16px}.toolbar{flex-wrap:wrap}.workspace{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(3,1fr)}.lower{grid-template-columns:1fr}#ladder-scroll{height:240px}.narration p{font-size:17px}}@media(max-width:600px){header{align-items:flex-start}.status{flex-direction:column;gap:5px}h1{font-size:21px}.metrics{grid-template-columns:repeat(2,1fr)}.metrics article{padding:12px}.metrics strong{font-size:27px}.legend{gap:8px;flex-wrap:wrap}.playback{flex-wrap:wrap}#chat-form{flex-wrap:wrap}footer{gap:10px}}
.sms{margin-bottom:16px}.sms-workspace{display:grid;grid-template-columns:minmax(280px,.9fr) minmax(0,1.2fr);gap:24px;padding:0 20px 20px}.sms-compose{display:flex;flex-direction:column;gap:10px}.sms-addresses{display:flex;align-items:end;gap:12px}.sms-addresses label{flex:1;display:flex;flex-direction:column;gap:7px}.sms-compose label{font-size:12px;color:var(--muted)}.sms-addresses select{width:100%}.sms-addresses>button{margin-bottom:6px}textarea{font:inherit;background:#0e1825;color:var(--text);border:1px solid var(--line);border-radius:8px;padding:12px;resize:vertical;min-height:112px;width:100%;line-height:1.5}textarea:focus-visible{outline:2px solid var(--control);outline-offset:3px}.sms-compose-footer{display:flex;justify-content:space-between;align-items:center;gap:10px}.sms-compose-footer>span,.sms-playback-note{font-size:11px;color:var(--muted)}#sms-status{font-size:12px;line-height:1.6;min-height:38px}.sms-inbox{min-width:0;border-left:1px solid var(--line);padding-left:24px}.sms-inbox-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.sms-inbox h3{font-size:14px;margin:0}#sms-messages{max-height:300px;overflow:auto;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin}.sms-empty{padding:22px 12px;border:1px dashed var(--line);border-radius:8px;font-size:13px;text-align:center}.sms-message{border:1px solid #2e504b;border-radius:9px;padding:12px 14px;background:#132722}.sms-message.failed{border-color:#725046;background:#2b201e}.sms-message-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:12px}.sms-message time{font-size:10px;color:var(--muted)}.sms-message-text{font-size:15px;line-height:1.5;color:var(--text);margin:8px 0;white-space:pre-wrap;overflow-wrap:anywhere}.sms-message small{font-size:11px;color:var(--user);overflow-wrap:anywhere}.sms-message.failed small{color:var(--pfcp)}.sms-playback-note{margin-top:10px}@media(max-width:700px){.sms-workspace{grid-template-columns:1fr;gap:16px}.sms-inbox{border-left:0;border-top:1px solid var(--line);padding:16px 0 0}.sms .panel-heading{align-items:flex-start}.sms .panel-heading h2{font-size:15px}.sms .panel-heading>button{padding:8px 10px;flex-shrink:0;font-size:11px}}

.traffic-evidence{margin:10px 20px;padding:12px 14px;background:#f3f8f7;border:1px solid #d5e6e2;border-radius:10px;font-size:12px;color:#244b51}.traffic-evidence p{margin:4px 0;line-height:1.6}.traffic-evidence>p:first-child{font-weight:650}.traffic-evidence ul{padding-left:18px;margin:8px 0;line-height:1.7;font-variant-numeric:tabular-nums}.traffic-evidence .traffic-note{font-size:11px;color:#526f77}.sequence-view{display:flex;align-items:center;gap:10px;padding:0 20px 10px;font-size:12px}.sequence-view select{min-width:0;max-width:100%;font:inherit;padding:7px;border:1px solid #c6dada;border-radius:7px;background:white;color:#003f4d}.sequence-activity{margin:0 20px 12px;font-size:11px;line-height:1.6;color:#526f77}
