.device-layout{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:16px;align-items:start}.device-primary,.device-health{min-width:0;display:grid;gap:16px}.device-main-graph .cardhead small,.device-interfaces .cardhead small,.device-explorer .cardhead small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.device-metric-tabs{display:flex;align-items:center;gap:6px;padding:10px 16px;border-bottom:1px solid var(--line)}.device-metric-tabs .selected{background:#e3f4ef;color:#087f70;border-color:#b6e1d4}.device-metric-tabs span{margin-left:auto;color:var(--muted);font-size:10px}.device-metric-stats{display:flex;gap:35px;padding:14px 20px}.device-metric-stats div{display:grid;gap:4px}.device-metric-stats small{font-size:11px;color:var(--muted)}.device-metric-stats strong{font-size:25px;letter-spacing:-1px}.device-metric-stats em{font-size:11px;font-weight:500;font-style:normal;color:var(--muted);letter-spacing:0}.device-metric-stats span{font-size:10px;color:var(--muted)}.device-history-chart{height:290px;width:100%}.device-graph-link{display:block;color:inherit}.device-graph-link:hover{background:#f8fbfd}.device-port-chart{height:42px;min-width:125px;width:100%}.device-health-value{padding:14px 16px;border-bottom:1px solid var(--line)}.device-health-value>div:first-child{display:flex;justify-content:space-between;font-size:12px}.device-health-value span{font-weight:700}.device-health-meter{height:4px;background:#eef2f6;border-radius:4px;margin:9px 0}.device-health-meter i{display:block;height:100%;background:#14a88b;border-radius:4px}.device-health-facts{padding:12px 16px;display:grid;gap:12px}.device-health-facts span{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted)}.device-health-facts strong{color:#263c50;text-align:right}.device-event{padding:13px 16px;border-top:1px solid var(--line);display:grid;gap:5px}.device-event time{color:#71849b;font-size:10px}.device-event strong{font-size:12px}.device-event small{color:var(--muted);font-size:11px;line-height:1.5}.device-interfaces table{font-size:11px}.device-interfaces th{font-size:10px}.device-interfaces td{padding:10px 12px}.device-interfaces th small{display:block;font-weight:400;text-transform:none}.device-range-buttons{display:flex;gap:6px;padding:12px 18px 0}#device-range-form{display:flex;align-items:end;gap:12px;padding:12px 18px;flex-wrap:wrap}#device-range-form label{font-size:11px;margin:0}#device-range-form input{padding:8px}#device-range-error{font-size:11px;color:#b84742}.device-explorer .device-history-chart{height:430px}.device-chart-hint{padding:0 18px 14px;font-size:11px;color:var(--muted)}.device-sample-table{margin:0 18px 18px;font-size:12px}.device-sample-table summary{cursor:pointer}.device-sample-table .tablewrap{max-height:350px;overflow:auto;margin-top:12px}.device-no-data{padding:12px 18px;background:#f7f9fc;font-size:12px;color:var(--muted)}
@media(max-width:1100px){.device-layout{grid-template-columns:minmax(0,1fr)}.device-health{grid-template-columns:1fr 1fr}.device-metric-tabs{flex-wrap:wrap}.device-metric-tabs span{margin-left:0;width:100%}}@media(max-width:650px){.device-health{grid-template-columns:1fr}.device-metric-stats{gap:20px;padding:12px}.device-metric-stats strong{font-size:21px}.device-history-chart{height:250px}.device-explorer .device-history-chart{height:320px}.device-explore{font-size:11px}}
.device-layout .card{margin-bottom:0}.device-interfaces .device-port-chart{width:160px;min-width:160px;max-width:160px}.device-interfaces td:last-child{width:184px}.device-log .cardhead h2{font-size:15px;white-space:nowrap}.device-main-graph{padding-bottom:6px}.device-layout .cardhead{padding:14px 16px}.main:has(.device-layout)>.heading{margin-bottom:16px}
.device-zoom-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:0 18px 12px}.device-zoom-controls button{font-size:11px;padding:6px 10px}.device-zoom-controls button[aria-pressed="true"]{background:#e3f4ef;color:#087f70;border-color:#b6e1d4}.device-zoom-controls span{font-size:11px;color:var(--muted);margin-left:8px}

.device-history-chart{height:325px}.device-explorer .device-history-chart{height:465px}
@media(max-width:650px){.device-history-chart{height:285px}.device-explorer .device-history-chart{height:355px}}
.device-interface-name{color:#087f70;text-decoration:none}.device-interface-name:hover{text-decoration:underline}.device-range-buttons{flex-wrap:wrap}
.device-smoke-key{display:flex;flex-wrap:wrap;gap:8px 18px;padding:4px 18px 12px;color:var(--muted);font-size:10px}.device-smoke-key span{display:flex;gap:6px;align-items:center}.device-smoke-key i{display:inline-block;width:18px;height:9px}.smoke-swatch{background:linear-gradient(to bottom,#50647820,#50647885,#50647820)}.loss-swatch{background:linear-gradient(to right,#d3b23b,#dc8739,#d14b56);border-radius:4px}
.device-graph-link{position:relative;cursor:zoom-in;text-decoration:none}.device-graph-link .device-history-chart{pointer-events:none}.device-graph-open{position:absolute;right:18px;bottom:6px;font-size:10px;color:var(--muted);background:#fffc;padding:2px 6px;border-radius:4px;opacity:0;transition:opacity .15s}.device-graph-link:hover .device-graph-open,.device-graph-link:focus-visible .device-graph-open{opacity:1;color:#087f70}
.device-monitored-interfaces .interface-errors>span{display:block;margin-bottom:4px}.device-monitored-interfaces .interface-errors small{color:var(--muted)}
.device-health-caption{display:block;font-size:10px;color:var(--muted);margin-top:-3px}.device-health-caption strong{color:#263c50}.device-health-value span em{font-style:normal;font-weight:500;color:var(--muted)}.device-health-meter.warning i{background:#dc8739}.device-health-meter.critical i{background:#d14b56}
.device-hardware-row{display:grid;grid-template-columns:10px auto 1fr;align-items:center;gap:8px;padding:12px 16px;border-top:1px solid var(--line);font-size:12px}.device-hardware-row>span:last-child{text-align:right;color:var(--muted);font-size:11px}.hardware-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#a7b4c2}.hardware-dot.ok{background:#14a88b}.hardware-dot.warning{background:#dc8739}.hardware-dot.critical{background:#d14b56}.device-hardware-problems{list-style:none;margin:-4px 0 0;padding:0 16px 12px 34px;display:grid;gap:5px;font-size:11px}.device-hardware-problems li{display:flex;align-items:center;gap:6px}.device-hardware-problems .hardware-dot{width:7px;height:7px}
.health-hardware-note{margin:-6px 16px 14px;font-size:11px}
.device-errors-graph{border-top:1px solid var(--line);margin-top:6px;padding-top:12px}.device-errors-head{padding:0 18px}.device-errors-head h3{font-size:13px;margin:0}.device-errors-head small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.device-errors-chart{height:230px;width:100%}
/* Interface graph page: identity strip and the "In view" summary that follows graph zoom. */
.interface-identity{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:10px 18px;margin:0 18px 12px;border:1px solid var(--line);border-radius:8px;background:#f6f9fc;font-size:12px}.interface-state{display:inline-flex;align-items:center;gap:6px;font-weight:600;padding:3px 10px;border-radius:999px;background:#e6f6f2;color:#087f70}.interface-state i{width:8px;height:8px;border-radius:50%;background:currentColor}.interface-state.down{background:#fbe9eb;color:#b23a45}.interface-state.off{background:#eef1f5;color:#66768a}.interface-since{color:var(--muted)}.interface-facts{display:flex;flex-wrap:wrap;gap:6px 16px;margin-left:auto}.interface-facts span{display:inline-flex;gap:5px;align-items:baseline;overflow-wrap:anywhere}.interface-facts small{font-size:10px;color:var(--muted)}
.interface-window{margin:0 18px 14px}.interface-window-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-bottom:8px}.interface-window-head h3{font-size:13px;margin:0}.interface-window-head small{font-size:11px;color:var(--muted)}.interface-window-hint{margin-left:auto}.interface-window-tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.interface-window-tiles>div{display:grid;gap:4px;align-content:start;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#fff}.interface-window-tiles small{font-size:10px;color:var(--muted)}.interface-window-tiles strong{font-size:14px;line-height:1.3}.interface-window-tiles span{font-size:10px;color:var(--muted)}
@media(max-width:1100px){.interface-window-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:650px){.interface-identity{margin:0 12px 12px;padding:10px 12px}.interface-facts{margin-left:0}.interface-window{margin:0 12px 14px}.interface-window-tiles{grid-template-columns:1fr 1fr}.interface-window-hint{margin-left:0}}
.interface-window-head{align-items:center;gap:6px 12px}.interface-direction-legend{display:flex;align-items:center;gap:12px;margin-left:auto;color:#40576b;font-size:10px;font-weight:600}.interface-direction-legend span{display:inline-flex;align-items:center;gap:5px}.interface-direction-legend i{width:9px;height:9px;border-radius:50%}.interface-direction-legend i.inbound{background:#087f70}.interface-direction-legend i.outbound{background:#4f63d9}.interface-window-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}.interface-window-tiles>div{min-height:76px}.interface-window-tiles strong.interface-pair{display:flex;flex-wrap:wrap;gap:3px 6px;font-size:13px;font-variant-numeric:tabular-nums}.interface-pair i{font-style:normal;color:#9aa8b5;font-weight:400}.interface-pair .inbound-value{color:#087f70}.interface-pair .outbound-value{color:#4f63d9}.device-errors-head small{max-width:900px;line-height:1.5}
@media(max-width:1100px){.interface-window-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.interface-window-head{align-items:flex-start}.interface-direction-legend{margin-left:0;flex-basis:100%}.interface-window-tiles{grid-template-columns:1fr 1fr}.interface-window-tiles>div{padding:9px;min-width:0}.interface-window-tiles strong.interface-pair{font-size:12px}.interface-window-hint{margin-left:0}}
/* Device events: overview card links and the full event log page. */
.device-log .cardhead h2 a{color:inherit;text-decoration:none}.device-log .cardhead h2 a:hover{text-decoration:underline}.device-event.event-problem{box-shadow:inset 3px 0 #d14b56}.device-event.event-recovered{box-shadow:inset 3px 0 #14a88b}.device-log-more{display:block;padding:11px 16px;border-top:1px solid var(--line);font-size:12px;font-weight:600;color:#087f70;text-decoration:none}.device-log-more:hover{text-decoration:underline}
.device-back{flex-shrink:0;white-space:nowrap;padding:7px 12px}
/* Log page: one compact line per entry, filters as checkbox dropdowns. */
.device-events-log .device-events-empty{padding:18px 14px;color:var(--muted);font-size:12px}
.log-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 12px;border-bottom:1px solid var(--line)}.log-bar h2{font-size:14px;margin:0 8px 0 0}.log-bar select,.log-bar input,.log-bar .button,.log-bar button,.log-multi>summary{height:28px;padding:0 8px;font-size:12px;border-radius:6px}.log-bar input[type=date]{width:130px}.log-search{width:170px}.log-count{margin-left:auto;font-size:11px;color:var(--muted);white-space:nowrap}.log-filter-error{flex-basis:100%;margin:0;color:#b23a45;font-size:12px}
.log-multi{position:relative}.log-multi>summary{display:flex;align-items:center;gap:4px;list-style:none;cursor:pointer;border:1px solid var(--line);background:#fff;white-space:nowrap;font-weight:600;color:var(--ink)}.log-multi>summary::-webkit-details-marker{display:none}.log-multi>summary::after{content:"▾";color:var(--muted);font-size:10px}.log-multi[open]>summary{border-color:#9fcfc2}
.log-multi-menu{position:absolute;z-index:20;top:32px;left:0;min-width:190px;max-height:280px;overflow:auto;padding:4px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px #16293c22}.log-multi-menu label{display:flex;align-items:center;gap:8px;padding:5px 8px;border-radius:5px;font-size:12px;cursor:pointer;white-space:nowrap}.log-multi-menu label:hover{background:#f2f6f9}.log-multi-menu input{margin:0}.log-multi-menu span{flex:1}.log-multi-menu small{color:var(--muted);font-variant-numeric:tabular-nums}
.log-table{width:100%;font-size:12px;border-collapse:collapse}.log-table th{font-size:10px;text-transform:uppercase;letter-spacing:.03em;padding:5px 8px;color:var(--muted);text-align:left;white-space:nowrap}.log-table td{padding:3px 8px;border-top:1px solid #eef2f5;white-space:nowrap;vertical-align:middle;line-height:1.5}.log-table tr:hover td{background:#f8fafc}.log-time{font-variant-numeric:tabular-nums;color:#5d6f84}.log-source{display:inline-block;padding:0 6px;border-radius:4px;background:#e9eef4;color:#3f5167;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.03em}.log-severity{font-weight:600}.log-table tr.problem .log-severity{color:#b23a45}.log-table tr.recovery .log-severity{color:#087f70}.log-table tr.info .log-severity{color:#66768a}.log-table tr.problem td:first-child{box-shadow:inset 3px 0 #d14b56}.log-table tr.recovery td:first-child{box-shadow:inset 3px 0 #14a88b}.log-subject{max-width:180px;overflow:hidden;text-overflow:ellipsis}.log-message{width:100%;max-width:0;overflow:hidden;text-overflow:ellipsis}.log-message span{color:var(--muted)}
.log-pages{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:6px 12px;font-size:11px;color:var(--muted);border-top:1px solid var(--line)}.log-pages .button{height:26px;padding:0 8px;font-size:11px}.log-note{margin:0;padding:6px 12px 10px;font-size:11px;color:var(--muted)}
@media(max-width:650px){.log-count{margin-left:0;flex-basis:100%}.log-search{flex:1}.log-message{max-width:none;overflow:visible}}
.log-message strong,.log-message span{display:inline;margin:0}.log-message strong{font-weight:600;margin-right:6px}.log-multi-menu label{font-weight:400;color:var(--ink)}.log-bar input[type=date]{width:122px}
.log-chips{display:flex;flex-wrap:wrap;gap:6px;padding:6px 12px;border-bottom:1px solid var(--line)}.log-chips a{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;background:#e3f4ef;color:#087f70;font-size:11px;font-weight:600;text-decoration:none}.log-chips a:hover{background:#cdebe2}.log-source.audit{background:#efe9f7;color:#5b3f8a}
.device-log-card{margin-top:16px}.device-log-card .cardhead h2{font-size:14px}.device-log-card .cardhead h2 a{color:inherit;text-decoration:none}.device-log-card .cardhead h2 a:hover{text-decoration:underline}.device-log-card .log-message a{color:inherit}
.log-table .log-details{height:24px;padding:0 8px;font-size:11px;border-radius:5px}.log-pages select{height:26px;font-size:11px;padding:0 6px}
.device-reading-link{cursor:pointer;transition:background .15s}.device-reading-link:hover{background:#f8fbfd}.device-reading-link a{display:block}
.device-wireless-band{display:flex;justify-content:space-between;align-items:baseline;padding:10px 16px 8px;background:#f7f9fc;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}.device-wireless-band strong{color:#263c50}.device-wireless-band a{font-size:11px;font-weight:600;color:#087f70;text-decoration:none}.device-wireless-band a:hover{text-decoration:underline}