:root{color-scheme:dark;--bg:#030a07;--panel:#08120d;--tile:#0c1b12;--border:#1d3828;--fg:#c7e8d4;--muted:#83a993;--green:#59f995;--yellow:#ffc65c;--red:#ff6977;--grey:#8b9d92;--blue:#72bafa;--purple:#ba9cfa}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.5 Consolas,'Courier New',monospace}button,input,select{font:inherit}button,.button{display:inline-block;color:#a5d9b9;background:#0a1911;border:1px solid #294a37;padding:9px 15px;border-radius:4px;text-decoration:none;cursor:pointer}button:hover,.button:hover{border-color:#68b67f;background:#132b1c}button:disabled{opacity:.5;cursor:wait}button.active,button.primary{background:#183a25;color:#72ffa6;border-color:#4e9764}a{color:var(--green)}h1{font-size:23px;letter-spacing:1px;color:#d0f5dc;margin:3px 0 0;font-weight:500}h2{font-size:14px;font-weight:500;letter-spacing:1px;margin:0;color:#93caaa}small,.muted{color:var(--muted);font-size:12px}.eyebrow{color:#64ff9d;font-size:12px;letter-spacing:2px}.app-header,.header-status,.panel-heading,.toolbar,.app-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.header-status{justify-content:flex-end}.human-mode #stage{max-width:1600px;margin:auto;padding:25px}.app-nav{justify-content:flex-start;margin:22px 0}.nav-spacer{flex:1}.app-nav form{margin:0}time{font-variant-numeric:tabular-nums}.summary{padding:12px 16px;background:#09170f;border-left:3px solid var(--green);margin-bottom:18px}.summary.warning{border-color:var(--yellow)}.summary.critical{border-color:var(--red)}.summary.unknown{border-color:var(--grey)}.summary small{margin-left:10px}.overview-grid{display:grid;grid-template-columns:1.85fr 1fr;gap:16px}.panel{background:var(--panel);border:1px solid var(--border);padding:18px;border-radius:5px;margin-bottom:16px}.panel-heading{margin-bottom:16px}.panel>h2{margin-bottom:16px}.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tile{background:var(--tile);border:1px solid #244831;padding:14px;border-radius:4px;min-width:0}.tile strong{overflow-wrap:anywhere}.tile .panel-heading{margin:0;flex-wrap:nowrap;align-items:flex-start}.metric{font-size:25px;color:#e1f6e8;margin:8px 0 0;font-variant-numeric:tabular-nums}.badge{font-size:11px;white-space:nowrap;color:var(--grey)}.badge.ok{color:var(--green)}.badge.warning{color:var(--yellow)}.badge.critical{color:var(--red)}.badge.maintenance{color:var(--purple)}.orb{display:inline-block;width:11px;height:11px;border-radius:50%;background:var(--grey);margin-right:8px;flex-shrink:0}.orb.ok{background:var(--green);box-shadow:0 0 12px #59f99577}.orb.warning{background:var(--yellow);box-shadow:0 0 12px #ffc65c66}.orb.critical{background:var(--red);box-shadow:0 0 12px #ff697777}.orb.maintenance{background:var(--purple)}.row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid #1b3023}.row:last-child{border:0}.row>span{min-width:0}.row small{display:block}.row .value{text-align:right;overflow-wrap:anywhere;max-width:55%}.stats{display:flex;gap:26px;flex-wrap:wrap;margin:12px 0}.stats strong{color:#e1f6e8;font-size:21px;font-weight:500;white-space:nowrap}.event{display:grid;grid-template-columns:49px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid #1b3023}.event:last-child{border:0}.event time{color:#789b86;font-size:12px}.event p{margin:0;overflow-wrap:anywhere}.severity-warning{color:var(--yellow)}.severity-critical{color:var(--red)}.empty{color:var(--muted);padding:10px 0}.legend .download{color:var(--green)}.legend .upload{color:var(--blue);margin-left:15px}.chart-container{position:relative;height:220px}#chart{display:block;width:100%;height:100%}.empty-chart{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted)}.chart-tooltip{position:absolute;pointer-events:none;background:#102318;border:1px solid #43664e;border-radius:4px;padding:8px;font-size:12px;z-index:2;white-space:nowrap}.traffic-panel .panel-heading{margin-bottom:5px}footer{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;color:#8faf99;font-size:12px}footer .orb{width:8px;height:8px;margin-left:10px;margin-right:4px}footer .orb:first-child{margin-left:0}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px 7px;border-bottom:1px solid #20392b}th{color:var(--muted);font-weight:400}td{overflow-wrap:anywhere}td .button,td button{padding:6px 10px;margin:2px}.toolbar{justify-content:flex-end}.inline{display:flex;align-items:center;gap:8px}label{display:grid;gap:6px}input,select{background:#0b1a12;color:var(--fg);border:1px solid #2b4936;padding:10px;width:100%;border-radius:4px}input[type=checkbox]{width:18px;height:18px}.check-label{display:flex;align-items:center;gap:10px}.form-grid,.integration-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.error{background:#32171e;border-left:3px solid var(--red);padding:10px;color:#ffadba}.danger{color:#ff9eaa;border-color:#66313b}dialog{color:var(--fg);background:#08160e;border:1px solid #41664c;border-radius:7px;padding:22px;max-width:650px;width:calc(100% - 30px);max-height:90vh;overflow:auto;box-shadow:0 15px 90px #0009}dialog::backdrop{background:#000b}.modal-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.modal-heading button{padding:3px 10px;font-size:22px}.toasts{position:fixed;right:22px;top:22px;z-index:20;display:grid;gap:10px;max-width:min(420px,calc(100vw - 40px))}.toast{background:#12281b;border:1px solid #3a6447;border-left:3px solid var(--green);border-radius:5px;padding:12px 16px;box-shadow:0 8px 30px #0007;display:flex;gap:15px;align-items:flex-start}.toast.warning{border-left-color:var(--yellow)}.toast.critical{border-left-color:var(--red)}.toast button{padding:0 7px;background:transparent}.toast-text{flex:1;overflow-wrap:anywhere}.login-body{min-height:100vh;display:grid;place-items:center;padding:20px}.login{width:420px;max-width:100%;padding:30px}.login form{display:grid;gap:16px;margin:22px 0}.integration-grid>div{background:var(--tile);padding:16px;border:1px solid #244831;border-radius:4px}.token-output{word-break:break-all;background:#0c2115;padding:12px;user-select:all}.screen-mode{height:100vh;overflow:hidden}.screen-mode #stage{position:absolute;width:1600px;height:900px;padding:22px 28px;transform-origin:top left;display:flex;flex-direction:column;overflow:hidden}.screen-mode .app-header{height:55px;flex-shrink:0;flex-wrap:nowrap}.screen-mode h1{font-size:21px}.screen-mode #fullscreen{font-size:12px;padding:5px 10px;opacity:.5}.screen-mode #fullscreen:hover{opacity:1}.screen-mode main{flex:1;min-height:0;margin-top:14px}.screen-mode #overview{height:100%;display:flex;flex-direction:column}.screen-mode .summary{margin-bottom:12px;padding:9px 14px;flex-shrink:0}.screen-mode .overview-grid{flex:1;min-height:0;grid-template-columns:1.85fr 1fr;gap:14px}.screen-mode .status-column,.screen-mode .side-column{display:flex;flex-direction:column;min-height:0;gap:12px}.screen-mode .panel{margin:0;padding:15px 18px;overflow:hidden}.screen-mode .status-panel{flex:1;min-height:0}.screen-mode .services-panel{flex:1.05;min-height:0}.screen-mode .security-panel{flex:1.02;min-height:0}.screen-mode .events-panel{flex:1.28;min-height:0}.screen-mode .collector-panel{flex:.55;min-height:0}.screen-mode .panel-heading,.screen-mode .panel>h2{margin-bottom:9px}.screen-mode .tiles{height:calc(100% - 30px);grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:10px}.screen-mode .tile{padding:10px 14px;overflow:hidden}.screen-mode .metric{font-size:26px;margin-top:3px}.screen-mode .tile small{font-size:12px}.screen-mode .row{padding:8px 0}.screen-mode .event{padding:7px 0}.screen-mode .event p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.screen-mode .traffic-panel{height:258px;margin-top:12px;flex-shrink:0;display:flex;flex-direction:column}.screen-mode .traffic-panel .stats{margin:4px 0;gap:40px}.screen-mode .traffic-panel .stats strong{font-size:22px}.screen-mode .chart-container{flex:1;min-height:0;height:auto}.screen-mode footer{height:28px;flex-shrink:0;margin-top:8px}.screen-mode .detail-line{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.screen-mode .stats{gap:25px;margin:5px 0}.screen-mode .empty{padding:6px 0}.screen-mode .tile .badge{font-size:11px}.screen-mode .incident-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.screen-mode .security-panel .row{padding:6px 0}.screen-mode .security-panel small{font-size:12px}.screen-mode .header-status{flex-wrap:nowrap}[hidden]{display:none!important}
@media(max-width:800px){.human-mode #stage{padding:15px}.human-mode .overview-grid{grid-template-columns:1fr}.human-mode .form-grid,.human-mode .integration-grid{grid-template-columns:1fr}.human-mode .app-nav{gap:7px}.human-mode .app-nav button,.human-mode .app-nav .button{padding:8px 10px}.human-mode .nav-spacer{display:none}.human-mode h1{font-size:20px}}@media(max-width:480px){.human-mode .tiles{grid-template-columns:1fr}.human-mode .stats{gap:18px}.human-mode .stats strong{font-size:18px}.human-mode .row{align-items:flex-start}.human-mode .toolbar{justify-content:flex-start}.human-mode footer>span{line-height:2}}
@media print{body{background:white;color:black}.app-header{color:black}.eyebrow,h1,h2,small,.muted{color:#222}.app-nav,.toolbar,footer,.toasts,dialog{display:none!important}.panel{background:white;border:1px solid #ccc;break-inside:avoid}#overview,#admin{display:none!important}#reports{display:block!important}th,td{color:black;border-color:#ccc}.human-mode #stage{padding:0}}

/* Compact display composition: reference canvas 1600 x 900, no inner scrolling. */
.screen-mode .panel{padding:12px 18px}
.screen-mode .panel-heading,.screen-mode .panel>h2{margin-bottom:7px}
.screen-mode .tile{padding:7px 12px}
.screen-mode .tile .panel-heading{margin:0}
.screen-mode .screen-tile-content{display:flex;gap:18px;align-items:center;min-width:0}
.screen-mode .metric{font-size:22px;margin:0;white-space:nowrap;flex-shrink:0}
.screen-mode .tile-meta{min-width:0;flex:1}
.screen-mode .tile-meta small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.screen-mode .services-panel .row{padding:6px 0;white-space:nowrap}
.screen-mode .services-panel .row>span>small{display:none}
.screen-mode .services-panel .value{max-width:65%;overflow:hidden;text-overflow:ellipsis}
.screen-mode .services-panel .value small{display:inline;margin-left:8px}
.screen-mode .events-panel .event{padding:7px 0}
.screen-mode .events-panel .event small,.screen-mode .events-panel .event br{display:none}
.screen-mode .security-summary{margin:6px 0 10px}
.screen-mode .security-summary strong{font-size:23px;color:#e1f6e8;font-weight:500}

.screen-mode .services-panel .row{padding:4px 0}
.screen-mode .events-panel .event{padding:5px 0}
.screen-mode .collector-panel br{display:none}
.screen-mode .collector-panel small{margin-left:8px}
.screen-mode .security-panel .detail-line{display:block}