/* Refs #119. Stage-3 operating screens (오늘, 장비 상세 요약·통신 이상, 전체 장비 비교, 생산, 알람·작업) and the
   six-menu shell, after output/claude-ops-research/mockups/insight-*.html. Colours are the design-system scales the
   mockups copied (red/yellow/green/primary/gray). Red: act now. Orange: attention. Grey: outside run time / no data.
   Green only for data (charge, reception). Long-text rules: design/wording.md §3 (numbers, chips, times, buttons never
   wrap; names one line with an ellipsis and a title; one flexible text column, two lines at most). */
:root{--i-crit-bg:var(--ds-color-scale-red-100);--i-crit-line:var(--ds-color-scale-red-200);--i-crit-ink:var(--ds-color-scale-red-700);--i-crit-solid:var(--ds-color-scale-red-600);--i-warn-bg:var(--ds-color-scale-yellow-100);--i-warn-line:var(--ds-color-scale-yellow-200);--i-warn-ink:var(--ds-color-scale-yellow-900);--i-warn-solid:var(--ds-color-scale-yellow-600);--i-ok-bg:var(--ds-color-scale-green-100);--i-ok-line:var(--ds-color-scale-green-200);--i-ok-ink:var(--ds-color-scale-green-700);--i-ok-solid:var(--ds-color-scale-green-500);--i-info-bg:var(--ds-color-scale-primary-100);--i-info-ink:var(--ds-color-scale-primary-600);--i-off-bg:var(--ds-color-scale-gray-200);--i-line-strong:var(--ds-color-scale-gray-300);--i-subtle:var(--ds-color-scale-gray-600);--i-bar:var(--ds-color-scale-gray-500);--i-track:var(--ds-color-scale-gray-100);--i-radius:.5rem;--chart-charge:var(--ds-color-scale-green-500);--chart-use:var(--ds-color-scale-gray-500);--chart-alert:var(--ds-color-scale-red-600);--chart-alert-ink:var(--ds-color-scale-red-700);--chart-strong:var(--ds-color-scale-gray-900)}

/* Shell: 72 px rail with icon + label, top bar with search, refresh control and account; phone: bottom tabs. */
.ops-rail{position:fixed;inset:0 auto 0 0;width:4.5rem;z-index:20;display:flex;flex-direction:column;align-items:center;gap:.875rem;padding:.875rem 0;background:var(--bg);border-right:1px solid var(--line);overflow-y:auto}
.ops-rail .rail-logo{width:1.5rem;height:1.5rem;margin-bottom:.375rem}
.ops-rail .rail-logo img{display:block;width:100%;height:100%}
.ops-rail nav{display:contents}
.ops-rail a{display:flex;flex-direction:column;align-items:center;gap:.125rem;width:4rem;font-size:.6875rem;line-height:.875rem;color:var(--muted);text-decoration:none;text-align:center;white-space:nowrap}
.ops-rail a .box{display:grid;place-items:center;width:2.25rem;height:1.875rem;border-radius:.375rem}
.ops-rail a .nav-icon{width:1.25rem;height:1.25rem}
.ops-rail a.on{color:var(--strong);font-weight:700}
.ops-rail a.on .box,.ops-rail a:hover .box{background:var(--ds-color-scale-gray-200)}
.ops-rail a.mobile-only{display:none}
.ops-shell{margin-left:4.5rem;min-width:0}
.ops-top{position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:3rem;padding:.375rem 1.5rem;background:var(--bg);border-bottom:1px solid var(--line);flex-wrap:wrap}
.ops-top .brand{display:flex;align-items:baseline;gap:.5rem;min-width:0}
.ops-top .brand strong{font-size:.9375rem;color:var(--strong);white-space:nowrap}
.ops-top .brand .scope-copy{white-space:nowrap}
.ops-top .brand-logo{width:4.5rem;height:auto;display:block;align-self:center}
.ops-top .side-footer{margin:0;padding:0 .375rem;border:0;border-radius:.25rem;background:var(--ds-color-scale-gray-200);color:var(--muted);font-size:.6875rem;line-height:1rem;white-space:nowrap;text-align:left}
.ops-top .side-footer:empty{display:none}
.ops-top form{display:flex;flex:0 1 17.5rem;min-width:0}
.ops-top form input{width:100%;height:2rem;min-height:2rem;font-size:.8125rem}
.ops-top .top-right{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}
.ops-top .who{display:block;font-size:.8125rem;color:var(--muted);white-space:nowrap;max-width:14rem;overflow:hidden;text-overflow:ellipsis;cursor:pointer;list-style:none;padding:.375rem .25rem}
.ops-top .who::-webkit-details-marker{display:none}
.ops-top details.menu{position:relative}
.ops-top details.menu .menu-list{position:absolute;right:0;top:calc(100% + .25rem);z-index:30;min-width:10rem;padding:.25rem 0;background:var(--floating);border:1px solid var(--line);border-radius:var(--i-radius);box-shadow:var(--ds-elevation-shadow-s2-value)}
.ops-top details.menu .menu-list>a,.ops-top details.menu .menu-list>button{display:flex;align-items:center;width:100%;min-height:2.25rem;padding:0 .75rem;background:transparent;border:0;border-radius:0;font-size:.8125rem;color:var(--ink);text-decoration:none;justify-content:flex-start}
.ops-top details.menu .menu-list>a:hover,.ops-top details.menu .menu-list>button:hover{background:var(--surface)}
details.menu:not([open]) .menu-list{display:none}
@media(max-width:73.75rem){.ops-top .brand .scope-copy{display:none}.ops-top form{flex-basis:12rem}}
.ops-top button{min-height:2rem}
.refresh-control{display:flex;align-items:center;gap:.375rem;flex-wrap:wrap;font-size:.75rem;color:var(--muted)}
.refresh-control label{display:flex;align-items:center;gap:.25rem;white-space:nowrap}
.refresh-control select{height:2rem;min-height:2rem;padding:0 .375rem;font-size:.8125rem}
.refresh-control .refresh-state{white-space:nowrap}
.refresh-control .refresh-state.failed{color:var(--i-crit-ink);font-weight:700}
.refresh-control .refresh-state.held{color:var(--i-warn-ink)}
.ops-shell main{padding:1.25rem 1.5rem 3.5rem;max-width:82.5rem;margin:0}
.more-sheet{position:fixed;left:0;right:0;bottom:3.75rem;z-index:24;background:var(--floating);border-top:1px solid var(--line);box-shadow:var(--ds-elevation-shadow-s3-value);padding:.5rem 1rem}
.more-sheet a,.more-sheet button{display:flex;align-items:center;width:100%;min-height:2.75rem;padding:0 .5rem;font-size:.9375rem;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line);text-decoration:none;justify-content:flex-start}
.more-sheet>:last-child{border-bottom:0}
@media(max-width:47.5rem){
 .ops-rail{top:auto;bottom:0;right:0;width:auto;height:3.75rem;flex-direction:row;justify-content:space-around;align-items:center;gap:0;padding:.25rem 0;border-right:0;border-top:1px solid var(--line);background:var(--floating);overflow:visible}
 .ops-rail .rail-logo,.ops-rail a.desk{display:none}
 .ops-rail a{width:auto;flex:1;font-size:.75rem;line-height:1rem}
 .ops-rail a.mobile-only{display:flex}
 .ops-shell{margin-left:0}
 .ops-top{padding:.375rem 1rem;gap:.5rem}
 .ops-top form,.ops-top .who-menu,.ops-top .brand .scope-copy,.ops-top .brand-logo{display:none}
 .ops-top .top-right{flex:1 1 100%;justify-content:flex-start}
 .insight table.t.resp td.desk-only{display:none}
 .ops-top .top-right{gap:.375rem}
 .ops-shell main{padding:.875rem 1rem 5.25rem}
 #feedback{left:1rem;right:1rem;bottom:4.5rem;max-width:none}
}

/* Page head and tabs */
.insight .head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}
.insight .head>div:first-child{min-width:0;flex:1 1 20rem}
.insight h1{margin:0;font-size:1.375rem;line-height:1.75rem;font-weight:700;color:var(--strong);overflow-wrap:normal}
.insight h1 .chip{vertical-align:.25rem;margin-left:.375rem}
.insight .sub{margin:.25rem 0 0;color:var(--muted);font-size:.8125rem;line-height:1.25rem}
.insight .sub .site-line{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.insight .actions{display:flex;gap:.5rem;flex-wrap:wrap}
.insight .btn{display:inline-flex;align-items:center;justify-content:center;height:2rem;min-height:2rem;padding:0 .75rem;border-radius:.375rem;border:1px solid var(--i-line-strong);background:var(--floating);font:inherit;font-size:.8125rem;font-weight:700;line-height:1;color:var(--ink);text-decoration:none;white-space:nowrap;flex:none;cursor:pointer}
.insight .btn:hover{background:var(--surface)}
.insight .btn.primary{background:var(--brand);border-color:var(--ds-color-scale-green-400);color:var(--brand-ink)}
.insight .btn.small{height:1.75rem;min-height:1.75rem;padding:0 .625rem;font-size:.75rem}
.insight .btn[aria-pressed=true]{border-color:var(--strong);box-shadow:inset 0 0 0 1px var(--strong)}
.insight .btn:disabled{cursor:not-allowed;color:var(--i-subtle);background:var(--surface)}
.insight .itabs{display:flex;gap:.25rem;border-bottom:1px solid var(--line);margin:0 0 1rem;overflow-x:auto;overflow-y:hidden}
.insight .itabs a{padding:.5rem .75rem;color:var(--muted);text-decoration:none;font-weight:700;font-size:.8125rem;border-bottom:2px solid transparent;white-space:nowrap}
.insight .itabs a.on{color:var(--strong);border-color:var(--strong)}

/* Layout */
.insight .igrid{display:grid;gap:1rem;align-items:start}
.insight .c2{grid-template-columns:repeat(2,minmax(0,1fr))}.insight .c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.insight .span2{grid-column:span 2}
.insight .card{background:var(--floating);border:1px solid var(--line);border-radius:var(--i-radius);padding:1rem;min-width:0}
.insight .card+.card,.insight .card+.igrid,.insight .igrid+.card,.insight .igrid+.igrid{margin-top:1rem}
.insight .card h2{margin:0;font-size:.9375rem;line-height:1.25rem;font-weight:700;color:var(--strong)}
.insight .card h3{margin:0 0 .375rem;font-size:.8125rem;color:var(--strong)}
.insight .card .q{margin:.125rem 0 .75rem;color:var(--muted);font-size:.8125rem;line-height:1.25rem}
.insight .answer{font-size:.9375rem;line-height:1.375rem;color:var(--strong);margin:0 0 .625rem}
.insight .answer b{font-weight:700}
.insight .card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem}
.insight .card-head>div:first-child{min-width:0}
.insight .k-label{font-size:.8125rem;color:var(--muted);font-weight:700;margin-bottom:.375rem}
.insight .crit-text{color:var(--i-crit-ink)}.insight .ok-text{color:var(--i-ok-ink)}.insight .warn-text{color:var(--i-warn-ink)}

/* Chips and tags */
.insight .chip{display:inline-flex;align-items:center;height:1.5rem;padding:0 .5rem;border-radius:.375rem;font-size:.8125rem;line-height:1.25rem;font-weight:700;border:1px solid transparent;white-space:nowrap;vertical-align:middle}
.insight .chip.crit{background:var(--i-crit-bg);color:var(--i-crit-ink);border-color:var(--i-crit-line)}
.insight .chip.warn{background:var(--i-warn-bg);color:var(--i-warn-ink);border-color:var(--i-warn-line)}
.insight .chip.off{background:var(--i-off-bg);color:var(--muted)}
.insight .chip.ok{background:var(--floating);color:var(--i-ok-ink);border-color:var(--i-ok-line)}
.insight .chip.none{border:1px dashed var(--ds-color-scale-gray-400);color:var(--muted);background:transparent}
.insight .chip.info{background:var(--i-info-bg);color:var(--i-info-ink)}
.insight .tag{display:inline-block;font-size:.6875rem;line-height:1rem;padding:0 .375rem;border-radius:.25rem;background:var(--ds-color-scale-gray-200);color:var(--muted);margin-left:.375rem;vertical-align:1px;white-space:nowrap}
.insight .age{color:var(--muted);font-size:.8125rem}
.insight .stale{opacity:.55}

/* Status summary (filters) */
.insight .summary{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.insight .summary a{display:flex;flex-direction:column;gap:.125rem;min-width:8.25rem;flex:1 1 8.25rem;max-width:13.75rem;padding:.625rem .75rem;border-radius:var(--i-radius);border:1px solid var(--line);background:var(--floating);text-decoration:none;color:var(--ink)}
.insight .summary a b{font-size:1.5rem;line-height:1.75rem;color:var(--strong);font-variant-numeric:tabular-nums;white-space:nowrap}
.insight .summary a span{font-size:.8125rem;font-weight:700}
.insight .summary a small{font-size:.75rem;color:var(--muted)}
.insight .summary a.crit{border-color:var(--i-crit-line);background:var(--i-crit-bg)}.insight .summary a.crit b{color:var(--i-crit-ink)}
.insight .summary a.warn{border-color:var(--i-warn-line);background:var(--i-warn-bg)}.insight .summary a.warn b{color:var(--i-warn-ink)}

/* Key values */
.insight .kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr));gap:.75rem;margin-bottom:1rem}
.insight .kpi{background:var(--floating);border:1px solid var(--line);border-radius:var(--i-radius);padding:.75rem .875rem;min-width:0}
.insight .kpi .k{font-size:.8125rem;color:var(--muted);font-weight:700;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.insight .kpi .v{font-size:1.625rem;line-height:2rem;font-weight:700;color:var(--strong);font-variant-numeric:tabular-nums;white-space:nowrap}
.insight .kpi .v small{font-size:.875rem;color:var(--muted);margin-left:.125rem}
.insight .kpi .r{font-size:.75rem;line-height:1rem;color:var(--muted)}
.insight .kpi.plain{border:0;padding:0}
.insight .meter{height:.375rem;background:var(--ds-color-scale-gray-200);border-radius:.1875rem;margin:.375rem 0 .25rem;position:relative}
.insight .meter i{position:absolute;left:0;top:0;bottom:0;border-radius:.1875rem;background:var(--accent)}
.insight .meter em{position:absolute;top:-.1875rem;bottom:-.1875rem;width:2px;background:var(--i-crit-solid)}
.insight .flow{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.8125rem;margin:0 0 1rem}
.insight .flow .node{border:1px solid var(--line);background:var(--floating);border-radius:var(--i-radius);padding:.5rem .75rem;min-width:7.5rem}
.insight .flow .node b{display:block;font-size:1.125rem;line-height:1.5rem;color:var(--strong);font-variant-numeric:tabular-nums;white-space:nowrap}
.insight .flow .arrow{color:var(--i-subtle);white-space:nowrap}

/* Tables (phone: cards) */
.insight table.t{width:100%;min-width:0;border-collapse:collapse;font-size:.8125rem;background:transparent}
.insight table.t th{text-align:left;font-weight:700;color:var(--muted);font-size:.75rem;padding:.375rem .5rem;border-bottom:1px solid var(--line);white-space:nowrap;background:transparent;height:auto;vertical-align:bottom}
.insight table.t th.wrap{white-space:normal;min-width:5rem}
.insight table.t td{padding:.5rem;border-bottom:1px solid var(--line);vertical-align:middle;overflow-wrap:normal;line-height:1.25rem}
.insight table.t th:first-child,.insight table.t td:first-child{padding-left:.5rem}
.insight table.t tr:last-child td{border-bottom:0}
.insight table.t tbody tr:hover{background:transparent}
.insight table.t td.n{font-variant-numeric:tabular-nums;white-space:nowrap}
.insight td.dev{min-width:7.5rem;max-width:14.375rem}
.insight td.dev .site{max-width:13.75rem}
.insight td.judge{width:100%;min-width:13.75rem}
.insight td.btns{white-space:normal}
.insight td.btns .bwrap{display:flex;flex-wrap:wrap;gap:.375rem}
.insight td.what{min-width:7.5rem}
.insight td .bar-cell{max-width:17.5rem;min-width:9.375rem}
.insight .at{display:block;white-space:nowrap}.insight .at small{display:block;color:var(--muted);font-size:.75rem;white-space:nowrap}
.insight a.no,.insight .no{font-weight:700;color:var(--accent);display:inline-block;line-height:1.5rem;white-space:nowrap}
.insight span.no{color:var(--strong)}
.insight .site{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:.75rem;line-height:1rem;font-weight:500;min-width:0}
.insight .clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal}
.insight .more{font-size:.75rem;font-weight:700;white-space:nowrap;background:none;border:0;padding:0;min-height:0;height:auto;color:var(--accent);text-decoration:underline;cursor:pointer}
.insight .nw,.insight time,.insight .val{white-space:nowrap}
.insight .num{font-variant-numeric:tabular-nums}

/* Bars, stacks, timelines, steps */
.insight .bars .row{display:grid;grid-template-columns:minmax(6.875rem,11.875rem) minmax(0,1fr) max-content;gap:.625rem;align-items:center;padding:.375rem 0;border-bottom:1px solid var(--line);font-size:.8125rem}
.insight .bars .row:last-child{border-bottom:0}
.insight .bars .row.compact{grid-template-columns:3rem minmax(0,1fr) 3.25rem;padding:.125rem 0;border:0}
.insight .bars.rank .row{grid-template-columns:minmax(6.875rem,11.875rem) minmax(0,1fr) 8rem}
.insight .bars .row.cause{grid-template-columns:minmax(6rem,7.5rem) minmax(0,1fr) 2.5rem}
.insight .bars .who{min-width:0}
.insight .bars .track{position:relative;height:.875rem;background:var(--i-track);border-radius:.1875rem}
.insight .bars .track i{position:absolute;left:0;top:0;bottom:0;border-radius:.1875rem;background:var(--i-bar)}
.insight .bars .track i.low{background:var(--i-warn-solid)}.insight .bars .track i.bad{background:var(--i-crit-solid)}
.insight .bars .track i.none{background:repeating-linear-gradient(45deg,var(--i-track) 0 3px,var(--ds-color-scale-gray-400) 3px 5px)}
.insight .bars .track em{position:absolute;top:-.25rem;bottom:-.25rem;width:0;border-left:2px dashed var(--strong)}
.insight .bars .why{grid-column:2 / 4;font-size:.75rem;color:var(--muted);margin-top:-.25rem;min-width:0}
.insight .bars .val{text-align:right}
.insight .bars .val small{display:block;color:var(--muted)}
.insight .stack{display:flex;height:1.375rem;border-radius:.25rem;overflow:hidden;margin:.375rem 0;background:var(--i-track)}
.insight .stack span{display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;min-width:0}
.insight .stack .s0{background:var(--accent)}.insight .stack .s1{background:var(--i-subtle)}.insight .stack .s2{background:var(--ds-color-scale-gray-400)}.insight .stack .s3{background:var(--ds-color-scale-gray-300);color:var(--ink)}
.insight .legend{display:flex;gap:.875rem;flex-wrap:wrap;font-size:.75rem;color:var(--muted);margin-top:.375rem}
.insight .legend i{display:inline-block;width:.75rem;height:.75rem;border-radius:2px;vertical-align:-2px;margin-right:.25rem}
.insight .legend i.charge{background:var(--i-ok-solid)}.insight .legend i.use{background:var(--i-bar)}
.insight .legend i.partial{background:repeating-linear-gradient(45deg,var(--i-ok-bg) 0 3px,var(--i-ok-solid) 3px 5px)}
.insight .legend i.nodata{border:1px dashed var(--i-bar)}
.insight .legend i.run{background:var(--ds-color-scale-gray-200)}.insight .legend i.recv{background:var(--i-ok-solid)}.insight .legend i.late{background:var(--ds-color-scale-yellow-500)}
.insight .legend i.stop{background:repeating-linear-gradient(45deg,var(--i-crit-bg) 0 3px,var(--i-crit-solid) 3px 5px)}
.insight .legend i.gap{background:repeating-linear-gradient(45deg,var(--i-track) 0 3px,var(--ds-color-scale-gray-400) 3px 5px)}
.insight ul.tl{list-style:none;margin:0;padding:0}
.insight ul.tl li{display:grid;grid-template-columns:6rem minmax(0,1fr);gap:.75rem;padding:.5rem 0;border-bottom:1px solid var(--line);font-size:.8125rem;line-height:1.25rem}
.insight ul.tl li:last-child{border-bottom:0}
.insight ul.tl li>div{min-width:0}
.insight ul.tl time{color:var(--muted);font-variant-numeric:tabular-nums}
.insight ul.tl .src{color:var(--muted);font-size:.75rem}
.insight .steps{display:flex;flex-wrap:wrap}
.insight .steps .s{flex:1 1 6.875rem;min-width:6.875rem;border:1px solid var(--line);margin-left:-1px;padding:.625rem .75rem;background:var(--floating);color:var(--ink);text-decoration:none}
.insight .steps .s:first-child{border-radius:var(--i-radius) 0 0 var(--i-radius);margin-left:0}.insight .steps .s:last-child{border-radius:0 var(--i-radius) var(--i-radius) 0}
.insight .steps .s b{display:block;font-size:1.5rem;line-height:1.75rem;color:var(--strong);font-variant-numeric:tabular-nums;white-space:nowrap}
.insight .steps .s span{font-size:.8125rem;font-weight:700}
.insight .steps .s small{display:block;color:var(--muted);font-size:.75rem}
.insight .steps .s.warn{background:var(--i-warn-bg);border-color:var(--i-warn-line)}.insight .steps .s.crit{background:var(--i-crit-bg);border-color:var(--i-crit-line)}
.insight .wo-steps{display:flex;height:1.125rem;border-radius:.25rem;overflow:hidden;min-width:12rem}
.insight .wo-steps span{flex:1;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:700;white-space:nowrap;background:var(--ds-color-scale-gray-300);color:var(--ink)}
.insight .wo-steps span.done{background:var(--accent);color:#fff}.insight .wo-steps span.wait{background:var(--ds-color-scale-yellow-500);color:var(--strong)}
.insight .cause{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.25rem .75rem;font-size:.8125rem;line-height:1.25rem}
.insight .cause .yes{color:var(--i-crit-ink);font-weight:700;white-space:nowrap}.insight .cause .no{color:var(--i-subtle);white-space:nowrap}.insight .cause .unk{color:var(--muted);white-space:nowrap}
.insight .next{margin:.75rem 0 0;padding:.75rem;border-radius:var(--i-radius);background:var(--surface);border:1px solid var(--line)}
.insight .next h3{margin:0 0 .375rem;font-size:.8125rem;color:var(--strong)}
.insight .next ol{margin:0;padding-left:1.125rem;font-size:.8125rem;line-height:1.375rem}
.insight .note{font-size:.75rem;line-height:1.125rem;color:var(--muted);margin:.5rem 0 0}
.insight .empty{border:1px dashed var(--i-line-strong);border-radius:var(--i-radius);padding:.875rem;color:var(--muted);font-size:.8125rem;background:var(--surface)}
.insight .err{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem .75rem;align-items:start;padding:.625rem .75rem;border:1px solid var(--i-crit-line);background:var(--i-crit-bg);border-radius:var(--i-radius);margin-top:.625rem}
.insight .err p{margin:0;font-size:.8125rem;line-height:1.25rem;color:var(--i-crit-ink);overflow-wrap:anywhere}
.insight .err b{display:block;color:var(--strong);font-size:.8125rem}
/* Status band (가동 이력): run window grey, received green, late start orange, stop red hatch, missing grey hatch. */
.insight .band{position:relative;height:.875rem;background:var(--surface);border:1px solid var(--line);border-radius:2px;overflow:hidden}
.insight .band.tall{height:1.25rem}
.insight .band .seg{position:absolute;top:0;bottom:0}
.insight .band .seg.run{background:var(--ds-color-scale-gray-200)}
.insight .band .seg.recv{background:var(--i-ok-solid);top:2px;bottom:2px}
.insight .band .seg.late{background:var(--ds-color-scale-yellow-500);top:2px;bottom:2px}
.insight .band .seg.stop{background:repeating-linear-gradient(45deg,var(--i-crit-bg) 0 3px,var(--i-crit-solid) 3px 5px);top:2px;bottom:2px}
.insight .band .seg.gap{background:repeating-linear-gradient(45deg,var(--i-track) 0 3px,var(--ds-color-scale-gray-400) 3px 5px);top:2px;bottom:2px}
.insight .band .now{position:absolute;top:-2px;bottom:-2px;width:0;border-left:2px solid var(--strong)}
.insight .band-axis{display:flex;justify-content:space-between;font-size:.6875rem;line-height:1rem;color:var(--muted);margin-top:.125rem}
.insight .band-axis time{color:var(--muted)}
/* uPlot charts */
.insight .ichart{position:relative;width:100%;min-height:9rem}
.insight .ichart .u-legend{display:none}
.insight .ichart .chart-fallback{padding:.875rem;color:var(--muted);font-size:.8125rem}
.insight .chart-note{font-size:.75rem;color:var(--muted);margin:.25rem 0 0}
.insight .mobile-only{display:none}

@media(max-width:73.75rem){
 .insight .c2{grid-template-columns:minmax(0,1fr)}.insight .span2{grid-column:auto}
 .insight td.judge{min-width:10rem}
 .insight table.t td,.insight table.t th{padding-left:.375rem;padding-right:.375rem}
 .insight td.dev{max-width:10.625rem}.insight td.dev .site{max-width:10rem}
 .insight td.btns{width:1%}.insight td.btns .bwrap{flex-direction:column;align-items:flex-start}
}
@media(max-width:47.5rem){
 .insight h1{font-size:1.25rem;line-height:1.625rem}
 .insight .c3{grid-template-columns:minmax(0,1fr)}
 .insight .kpis{grid-template-columns:repeat(auto-fit,minmax(9.375rem,1fr))}
 .insight .summary a{min-width:0;flex:1 1 30%}
 .insight .bars .row,.insight .bars.rank .row{grid-template-columns:minmax(5.25rem,7.5rem) minmax(0,1fr) max-content}
 .insight ul.tl li{grid-template-columns:4rem minmax(0,1fr)}
 .insight table.t.resp thead{display:none}
 .insight table.t.resp,.insight table.t.resp tbody{display:block}
 .insight table.t.resp tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.25rem .75rem;padding:.625rem 0;border-bottom:1px solid var(--line)}
 .insight table.t.resp tr:last-child{border-bottom:0}
 .insight table.t.resp td{display:block;border:0;padding:.125rem 0;min-width:0}
 .insight table.t.resp td.dev{grid-column:1 / -1;grid-row:1;max-width:none}
 .insight table.t.resp td.dev .site{max-width:none}
 .insight table.t.resp td.st{grid-column:2;grid-row:1;justify-self:end;align-self:start}
 .insight table.t.resp td.st[data-l]::before{display:none}
 .insight table.t.resp td.judge{min-width:0;width:auto}
 .insight table.t.resp td[data-l]::before{content:attr(data-l);display:block;font-size:.6875rem;color:var(--muted);font-weight:500}
 .insight table.t.resp td[data-l=""]::before{display:none}
 .insight table.t.resp td.full{grid-column:1 / -1}
 .insight table.t.resp td.btns{width:auto}.insight td.btns .bwrap{flex-direction:row}
 .insight .desk-only{display:none}.insight .mobile-only{display:block}
 .insight .steps .s{flex:1 1 45%}
 .insight .flow{display:none}
 .insight .wo-steps{min-width:0}
}
/* Dropdown menus in the page head (원격 설정·제어 ▾, 더보기 ▾), second-level tabs, screen-reader text. */
.insight details.menu{position:relative}
.insight details.menu>summary{list-style:none;cursor:pointer}
.insight details.menu>summary::-webkit-details-marker{display:none}
.insight details.menu .menu-list{position:absolute;right:0;top:calc(100% + .25rem);z-index:12;min-width:12rem;padding:.25rem 0;background:var(--floating);border:1px solid var(--line);border-radius:var(--i-radius);box-shadow:var(--ds-elevation-shadow-s2-value)}
.insight details.menu .menu-list>a,.insight details.menu .menu-list>button{display:flex;align-items:center;width:100%;min-height:2.25rem;padding:0 .75rem;background:transparent;border:0;border-radius:0;font-size:.8125rem;font-weight:500;color:var(--ink);text-decoration:none;text-align:left;justify-content:flex-start;white-space:nowrap}
.insight details.menu .menu-list>a:hover,.insight details.menu .menu-list>button:hover{background:var(--surface)}
.insight .itabs.sub-tabs{border-bottom:0;margin-top:-.5rem}
.insight .itabs.sub-tabs a{font-weight:500;padding:.375rem .625rem;border-bottom:0;border-radius:.375rem}
.insight .itabs.sub-tabs a.on{background:var(--ds-color-scale-gray-200);color:var(--strong);font-weight:700}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.insight select.btn{appearance:auto;padding:0 .5rem;font-weight:700;width:auto;max-width:16rem}
@media(max-width:47.5rem){.insight details.menu .menu-list{right:auto;left:0}}
.insight .legend i.stack-key.s0{background:var(--accent)}.insight .legend i.stack-key.s1{background:var(--i-subtle)}.insight .legend i.stack-key.s2{background:var(--ds-color-scale-gray-400)}.insight .legend i.stack-key.s3{background:var(--ds-color-scale-gray-300)}
.refresh-control #refresh-now{min-height:2rem;height:2rem;padding:0 .625rem;border:1px solid var(--i-line-strong);border-radius:.375rem;background:var(--floating);font-weight:700;font-size:.8125rem;color:var(--ink)}
.refresh-control #refresh-now[aria-busy=true]{cursor:progress;color:var(--muted)}
