:root{color-scheme:dark;--bg:#06101c;--panel:rgba(6,16,28,.88);--border:#1e3347;--muted:#7890a6;--text:#e7f0f7;--cyan:#60a5fa;--green:#25d6b1;--amber:#fbbf24;--red:#ef4444}*{box-sizing:border-box}body,html{margin:0;min-height:100%;background:var(--bg);font-family:Arial,Helvetica,sans-serif;color:var(--text)}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.app-shell{min-height:100vh;background:var(--bg)}.topbar{gap:24px;flex-wrap:wrap;padding:12px 18px;border-bottom:1px solid #15283a;background:rgba(4,12,23,.96);position:-webkit-sticky;position:sticky;top:0;z-index:50}.brand,.topbar{display:flex;align-items:center}.brand{gap:10px;min-width:200px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:rgba(37,145,220,.13);color:#60a5fa}.brand strong{display:block;font-size:18px;letter-spacing:.08em}.brand span,.user-block span{display:block;color:#74889d;font-size:10px;letter-spacing:.06em;text-transform:uppercase}.topbar nav{gap:4px;flex-wrap:wrap}.topbar nav,.topbar nav button{display:flex;align-items:center}.topbar nav button{gap:7px;border:1px solid transparent;border-radius:8px;background:transparent;padding:9px 10px;color:#8ea1b4;font-size:12px}.topbar nav button.active,.topbar nav button:hover{background:rgba(37,145,220,.14);border-color:rgba(96,165,250,.18);color:#bfe4ff}.alarm-count,.topbar nav b{display:inline-grid;place-items:center;min-width:19px;height:19px;border-radius:999px;background:#ef4444;color:#fff;font-size:10px}.user-block{display:flex;align-items:center;gap:10px;margin-left:auto;text-align:right}.user-block strong{display:block;font-size:12px}.user-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#263a4d;margin-left:4px}.dashboard-wrap{width:100%;padding:14px 18px 20px}.dashboard-grid{grid-template-columns:minmax(0,1fr) minmax(0,3fr) minmax(0,1fr);align-items:start}.dashboard-grid,.left-rail{display:grid;grid-gap:12px;gap:12px}.panel{border:1px solid var(--border);border-radius:12px;background:var(--panel);box-shadow:0 16px 35px rgba(0,0,0,.14);min-width:0}.bottom-title,.panel-title{display:flex;align-items:center;justify-content:space-between;padding:11px 12px;border-bottom:1px solid #1a3043;color:#d6e3ee;font-size:11px;letter-spacing:.08em;text-transform:uppercase}.status-content{display:flex;align-items:center;gap:8px;padding:12px}.status-donut{width:95px;height:95px;flex:none}.status-list{display:grid;grid-gap:8px;gap:8px;font-size:12px}.status-list span{display:grid;grid-template-columns:10px 15px 1fr;grid-gap:7px;gap:7px;align-items:center}.status-list b{font-weight:400;color:#8ea1b4}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex:none}.dot.online{background:#22c55e}.dot.warning{background:#fbbf24}.dot.critical{background:#ef4444}.dot.offline{background:#64748b}.metric-card{padding:12px}.metric-heading{display:flex;justify-content:space-between;align-items:center;color:#8ea1b4;font-size:11px;text-transform:uppercase;letter-spacing:.05em}.metric-heading span{display:flex;align-items:center;gap:7px}.metric-heading em{font-style:normal;color:#25d6b1}.metric-value{display:flex;align-items:baseline;gap:7px;margin-top:10px;font-size:25px;font-weight:700}.metric-value small{color:#8ea1b4;font-size:11px;font-weight:400}.sparkline{display:block;width:100%;height:34px;margin-top:6px}.infra-panel{padding-bottom:4px}.infra-row{display:grid;grid-template-columns:18px minmax(0,1fr) auto 8px auto;grid-gap:5px;gap:5px;align-items:center;padding:7px 11px;border-bottom:1px solid #102235;color:#91a5b8;font-size:11px}.infra-row:last-child{border-bottom:0}.infra-row strong{color:#e2edf6;font-weight:500}.infra-row b{color:#25d6b1;font-weight:400}.infra-icon{display:grid;place-items:center;color:#71899d}.twin-panel{padding:10px}.twin-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 5px 10px}.eyebrow{margin:0;color:#5abaff;font-size:11px;letter-spacing:.16em;text-transform:uppercase}.simple-page h1,.twin-heading h1{margin:5px 0 0;font-size:21px}.api-status{display:flex;align-items:center;gap:7px;margin:5px 0 0;color:#25d6b1;font-size:11px}.flow-button,.icon-button,.primary-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:8px;border:1px solid #2b465d;background:rgba(13,31,49,.85);padding:9px 11px;color:#b5c8d8;font-size:11px}.flow-button.active{border-color:rgba(37,214,177,.4);background:rgba(37,214,177,.1);color:#6ff1d2}.map-stage{position:relative;overflow:hidden;width:100%;aspect-ratio:3/2;border:1px solid #223c52;border-radius:9px;background:#020913}.map-image{object-fit:fill}.flow-layer,.map-image{position:absolute;inset:0;width:100%;height:100%}.flow-layer{pointer-events:none}.central-label{position:absolute;z-index:3;transform:translate(-50%,-100%);width:15%;min-width:74px;padding:7px 8px;border:1px solid rgba(123,160,186,.46);border-radius:8px;background:rgba(5,18,30,.6);text-align:left;transition:.2s}.central-label.selected,.central-label:hover{border-color:#60a5fa;background:rgba(7,36,57,.72);box-shadow:0 0 18px rgba(96,165,250,.25)}.central-label.is-warning{border-color:rgba(251,191,36,.55)}.central-label span,.central-label strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.central-label span{font-size:10px;color:#e2edf6}.central-label strong{margin-top:3px;color:#25d6b1;font-size:11px}.central-label.is-warning strong{color:#fbbf24}.map-legend{position:absolute;z-index:4;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:12px;white-space:nowrap;border:1px solid #2c4358;border-radius:7px;background:rgba(4,14,25,.8);padding:7px 10px;color:#b5c6d4;font-size:10px}.map-legend span{display:flex;align-items:center;gap:5px}.legend-line{display:block;width:18px;height:2px}.legend-line.green{background:#25d6b1}.legend-line.yellow{background:#fbbf24}.legend-line.red{background:#ef4444}.loading-state{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;gap:8px;color:#9ab0c3;font-size:12px;background:rgba(3,11,20,.35)}.detail-panel{padding:12px}.detail-heading{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;padding-bottom:11px;border-bottom:1px solid #1a3043}.detail-heading h2{margin:5px 0 0;font-size:18px}.icon-button{padding:8px;color:#7c9bb2}.state-banner{display:flex;align-items:center;gap:8px;margin-top:12px;padding:11px;border:1px solid rgba(251,191,36,.25);border-radius:8px;background:rgba(251,191,36,.09);font-size:12px}.state-banner strong{margin-left:auto;color:#fbbf24;font-weight:500}.detail-tabs{display:flex;gap:2px;overflow:auto;margin-top:10px;border-bottom:1px solid #1a3043}.detail-tabs button{border:0;border-bottom:2px solid transparent;background:transparent;padding:8px 6px;color:#7890a6;white-space:nowrap;font-size:10px}.detail-tabs button.active{border-color:#60a5fa;color:#60a5fa}.detail-rows{display:grid;grid-gap:0;gap:0;margin-top:10px}.detail-rows div{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid #162a3d;font-size:11px}.detail-rows span{color:#7890a6}.detail-rows strong{font-weight:500;text-align:right}.ok-text{color:#25d6b1}.detail-placeholder{margin-top:12px;padding:14px;border:1px solid #1b3349;border-radius:8px;background:#0b1928;color:#8ea5b8;font-size:12px;line-height:1.5}.primary-button{border-color:#60a5fa;background:#60a5fa;color:#04101d;font-weight:700}.primary-button.full{width:100%;margin-top:14px}.secondary-button{width:100%;margin-top:10px}.bottom-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:12px;gap:12px;margin-top:12px}.bottom-panel{padding:0 12px 10px}.bottom-title{padding-left:0;padding-right:0}.agent-row,.event-row{display:flex;align-items:center;gap:8px;width:100%;padding:8px 0;border:0;border-bottom:1px solid #102235;background:transparent;text-align:left;color:#8ea1b4;font-size:11px}.agent-row:last-child,.event-row:last-child{border-bottom:0}.agent-row{cursor:pointer}.agent-row:hover{color:#e4f0f8}.agent-avatar{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#142a40;color:#71c7ff}.agent-row>span:nth-child(2){flex:1 1}.agent-row strong{display:flex;align-items:center;gap:5px;color:#25d6b1;font-size:10px;font-weight:400}.alarm-count{margin-left:auto}.alarm-card{margin-top:10px;padding:11px;border:1px solid rgba(251,191,36,.26);border-radius:8px;background:rgba(251,191,36,.1)}.alarm-card div{display:flex;justify-content:space-between;gap:8px;font-size:12px}.alarm-card div span{color:#fbbf24}.alarm-card p{margin:8px 0 0;color:#93a7b8;font-size:11px;line-height:1.4}.network-values{display:flex;justify-content:space-between;gap:8px;padding:12px 0 5px}.network-values span,.network-values strong{display:block}.network-values span{color:#7890a6;font-size:10px}.network-values strong{margin-top:4px;font-size:17px;color:#25d6b1}.network-values>div:last-child strong,.toast{color:#e2edf6}.toast{position:fixed;right:18px;bottom:18px;z-index:100;display:flex;align-items:center;gap:8px;padding:11px 14px;border:1px solid #2c6178;border-radius:8px;background:#091a2a;box-shadow:0 12px 35px rgba(0,0,0,.4);font-size:12px}.simple-page{display:grid;place-items:start;grid-gap:10px;gap:10px;max-width:720px;margin:40px auto;padding:24px}.simple-page p{color:#91a5b8}.simple-page .primary-button{margin-top:8px}.section-page{width:min(1440px,100%);margin:0 auto;padding:24px 18px 40px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px}.section-heading h1{margin:6px 0 4px;font-size:26px}.section-heading p:last-child{margin:0;color:#7890a6;font-size:12px}.secondary-button.compact{width:auto;margin:0}.page-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:12px;gap:12px;margin-bottom:12px}.page-stat{position:relative;overflow:hidden;padding:15px}.page-stat>small,.page-stat>span{display:block;color:#7890a6;font-size:11px}.page-stat>span{text-transform:uppercase;letter-spacing:.08em}.page-stat>strong{display:block;margin:8px 0 4px;font-size:25px}.page-stat>small{color:#8fa5b7}.page-stat .sparkline{position:absolute;right:12px;bottom:10px;width:34%;opacity:.7}.page-stat.green{border-top:2px solid #25d6b1}.page-stat.blue{border-top:2px solid #60a5fa}.page-stat.amber{border-top:2px solid #fbbf24}.data-panel{overflow:hidden}.data-panel-title{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #1a3043;color:#60a5fa}.data-panel-title h2{margin:0;color:#e7f0f7;font-size:15px}.data-panel-title span{display:block;margin-top:4px;color:#7890a6;font-size:11px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:760px}td,th{padding:13px 16px;border-bottom:1px solid #14283a;text-align:left;font-size:12px}th{background:#081624;color:#7890a6;font-size:10px;letter-spacing:.08em;text-transform:uppercase}td{color:#aabccb}td span,td strong{display:block}td strong{color:#e1ecf4;font-weight:600}td>span:not(.status-pill){margin-top:4px;color:#657f95;font-size:10px}.wide-cell{max-width:440px}.status-pill{display:inline-flex!important;align-items:center;gap:6px;width:max-content;padding:5px 8px;border:1px solid rgba(37,214,177,.28);border-radius:999px;background:rgba(37,214,177,.08);color:#5be7c7!important;font-size:10px!important}.status-pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.status-pill.warning{border-color:rgba(251,191,36,.3);background:rgba(251,191,36,.09);color:#fbbf24!important}.status-pill.neutral{border-color:#2b465d;background:#102235;color:#9ab0c3!important}.agent-grid,.resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:12px;gap:12px}.resource-card{display:grid;grid-template-columns:auto 1fr auto;grid-gap:12px;gap:12px;align-items:center;padding:16px}.resource-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:10px;background:rgba(96,165,250,.1);color:#60a5fa}.resource-icon svg{width:20px}.resource-card>div:nth-child(2)>span{color:#7890a6;font-size:10px;text-transform:uppercase}.agent-card h2,.report-card h2,.resource-card h2{margin:4px 0 0;font-size:14px}.resource-card dl{grid-column:1/-1;margin:4px 0 0}.resource-card dl div{display:flex;justify-content:space-between;padding:8px 0;border-top:1px solid #14283a;font-size:11px}.resource-card dt{color:#7890a6}.resource-card dd{margin:0;color:#d7e4ed}.agent-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.agent-card{padding:16px}.agent-card-head{display:flex;align-items:center;justify-content:space-between}.agent-avatar.large{width:42px;height:42px}.agent-card h2{margin-top:14px;font-size:16px}.agent-card>p{min-height:42px;color:#879daf;font-size:11px;line-height:1.55}.agent-metrics{display:grid;grid-template-columns:1fr 1fr;margin:14px 0;border:1px solid #183047;border-radius:8px}.agent-metrics div{padding:10px}.agent-metrics div+div{border-left:1px solid #183047}.agent-metrics span,.agent-metrics strong{display:block}.agent-metrics span{color:#7890a6;font-size:9px;text-transform:uppercase}.agent-metrics strong{margin-top:5px;font-size:15px}.report-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:12px;gap:12px}.report-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;grid-gap:14px;gap:14px;padding:18px;color:#60a5fa}.report-card p,.report-card span{margin:5px 0 0;color:#7890a6;font-size:11px}.report-card span{display:block;color:#25d6b1}.report-card .icon-button{color:#8da5b8}@media (max-width:1100px){.dashboard-grid{grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,1fr)}.topbar{gap:12px}.brand{min-width:180px}.topbar nav button{padding:8px 7px;font-size:11px}.agent-grid,.resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:820px){.dashboard-grid{grid-template-columns:1fr}.bottom-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.user-block{display:none}.topbar nav{width:100%}.twin-heading h1{font-size:19px}.page-stats,.report-grid{grid-template-columns:1fr}}@media (max-width:560px){.dashboard-wrap,.section-page{padding:10px}.agent-grid,.bottom-grid,.resource-grid{grid-template-columns:1fr}.section-heading{align-items:flex-start;flex-direction:column}.map-legend{max-width:94%;overflow:auto;left:3%;right:3%;transform:none}.central-label{width:20%;min-width:58px;padding:5px}.central-label span{font-size:8px}.central-label strong{font-size:9px}.twin-heading{align-items:flex-start;flex-direction:column}.flow-button{align-self:stretch}}@media (prefers-reduced-motion:reduce){*,:after,:before{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}