:root{--bg: #080b14;--surface: #121826;--surface-alt: #18202f;--surface-hover: #1d2534;--border: #232c3e;--border-strong: #33405a;--text: #e7ecf3;--text-muted: #94a3b8;--text-subtle: #64748b;--accent: #7c83ff;--accent-hover: #969cff;--accent-soft: rgba(124, 131, 255, .15);--p1: #ff6b7d;--p1-soft: rgba(255, 107, 125, .14);--p2: #ffb454;--p2-soft: rgba(255, 180, 84, .14);--p3: #56b8e8;--p3-soft: rgba(86, 184, 232, .13);--p4: #8fa0b8;--p4-soft: rgba(143, 160, 184, .12);--ok: #34d9a3;--ok-soft: rgba(52, 217, 163, .14);--fatal: #e879f9;--radius-sm: 7px;--radius: 11px;--radius-lg: 16px;--shadow-sm: none;--shadow: none;--ring: 0 0 0 3px rgba(99, 102, 241, .35);--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 24px;--sp-6: 32px;--sp-7: 48px;--sidebar-w: 244px;--topbar-h: 64px;--content-max: none;--font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;color-scheme:dark}:root[data-theme=light]{--bg: #f6f8fb;--surface: #ffffff;--surface-alt: #f1f5f9;--surface-hover: #f8fafc;--border: #e2e8f0;--border-strong: #cbd5e1;--text: #0f172a;--text-muted: #5a6b82;--text-subtle: #94a3b8;--accent: #4f46e5;--accent-hover: #4338ca;--accent-soft: #eef2ff;--p1: #dc2626;--p1-soft: #fee2e2;--p2: #b45309;--p2-soft: #fef3c7;--p3: #0284c7;--p3-soft: #e0f2fe;--p4: #64748b;--p4-soft: #f1f5f9;--ok: #15803d;--ok-soft: #dcfce7;--fatal: #a21caf;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .04);--shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);color-scheme:light}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}a{color:inherit;text-decoration:none}h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.011em}:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--radius-sm)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}.icon{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.icon-sm{width:14px;height:14px}.icon-lg{width:20px;height:20px}.shell{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100vh}.sidebar{background:var(--surface);border-right:1px solid var(--border);padding:var(--sp-5) var(--sp-3) var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-5);position:sticky;top:0;height:100vh;overflow-y:auto}.brand{display:block;padding:0 var(--sp-2)}.brand-logo{height:26px;width:auto;display:block}.brand-logo--light{display:none}:root[data-theme=light] .brand-logo--dark{display:none}:root[data-theme=light] .brand-logo--light{display:block}.brand-sub{font-size:11.5px;color:var(--text-subtle);margin-top:5px;letter-spacing:.01em}.nav{display:flex;flex-direction:column;gap:2px}.nav-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-subtle);padding:0 10px var(--sp-2)}.nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radius-sm);color:var(--text-muted);font-weight:500;font-size:13.5px;position:relative;transition:background .15s,color .15s}.nav a:hover{background:var(--surface-alt);color:var(--text)}.nav a.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.nav a.active:before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--accent)}.nav a .icon{opacity:.85}.nav .count{margin-left:auto;font-size:11px;font-variant-numeric:tabular-nums;font-weight:650;color:var(--p1);background:var(--p1-soft);padding:1px 7px;border-radius:999px}.sidebar-foot{margin-top:auto;display:flex;flex-direction:column;gap:var(--sp-3)}.user-chip{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:var(--radius-sm);background:var(--surface-alt)}.avatar{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-weight:650;font-size:12px}.user-name{font-size:12.5px;font-weight:600;line-height:1.3}.user-role{font-size:11px;color:var(--text-subtle)}.main{display:flex;flex-direction:column;min-width:0}.topbar{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;min-height:var(--topbar-h);padding:var(--sp-3) var(--sp-6);border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--bg) 86%,transparent);position:sticky;top:0;z-index:20}.topbar h1{font-size:20px;font-weight:650}.topbar .sub{font-size:13px;color:var(--text-muted);margin-top:1px}.spacer{flex:1}.content{padding:var(--sp-5) var(--sp-6) var(--sp-7);display:flex;flex-direction:column;gap:var(--sp-5);width:100%;max-width:var(--content-max);margin:0 auto}@media(max-width:1080px){.topbar,.content{padding-left:var(--sp-5);padding-right:var(--sp-5)}}@media(max-width:860px){.shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;flex-direction:row;align-items:center;gap:var(--sp-4);overflow-x:auto;padding:var(--sp-3) var(--sp-4);border-right:none;border-bottom:1px solid var(--border)}.sidebar .nav{flex-direction:row}.nav a.active:before{display:none}.nav-label,.brand-sub,.sidebar-foot .user-chip{display:none}.sidebar-foot{margin-top:0;flex-direction:row}.topbar{padding:var(--sp-3) var(--sp-4)}.content{padding:var(--sp-4) var(--sp-4) var(--sp-6);gap:var(--sp-4)}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.card-head{display:flex;align-items:center;gap:10px;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--border)}.card-head h3{font-size:15px;font-weight:620}.card-head .hint{font-size:12.5px;color:var(--text-subtle)}.card-body{padding:var(--sp-5)}.grid{display:grid;gap:var(--sp-4)}.grid-kpi{grid-template-columns:repeat(auto-fit,minmax(216px,1fr))}.grid-2{grid-template-columns:1.75fr 1fr;gap:var(--sp-5)}.grid-2b{grid-template-columns:1fr 1fr;gap:var(--sp-5)}.grid-3{grid-template-columns:2.1fr 1fr 1.15fr;gap:var(--sp-5)}@media(max-width:1500px){.grid-3{grid-template-columns:1.6fr 1fr}}@media(max-width:1100px){.grid-2,.grid-2b,.grid-3{grid-template-columns:1fr}}.kpi{padding:var(--sp-5);display:flex;flex-direction:column;gap:10px}.kpi-top{display:flex;align-items:flex-start;gap:var(--sp-3)}.kpi .label{font-size:12.5px;font-weight:500;color:var(--text-muted);letter-spacing:.01em;flex:1}.kpi-icon{width:32px;height:32px;border-radius:9px;flex:none;display:grid;place-items:center;background:var(--surface-alt);color:var(--text-muted)}.kpi .value{font-size:27px;font-weight:700;line-height:1.08;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.kpi .foot{font-size:12.5px;color:var(--text-muted);display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kpi.is-p1 .value{color:var(--p1)}.kpi.is-p1 .kpi-icon{background:var(--p1-soft);color:var(--p1)}.kpi.is-p2 .value{color:var(--p2)}.kpi.is-p2 .kpi-icon{background:var(--p2-soft);color:var(--p2)}.kpi.is-ok .value{color:var(--ok)}.kpi.is-ok .kpi-icon{background:var(--ok-soft);color:var(--ok)}.delta{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:620;padding:2px 7px;border-radius:999px;font-variant-numeric:tabular-nums}.delta-up{color:var(--p2);background:var(--p2-soft)}.delta-down{color:var(--ok);background:var(--ok-soft)}.delta-flat{color:var(--text-muted);background:var(--surface-alt)}.badge{display:inline-flex;align-items:center;gap:5px;padding:2.5px 9px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap;border:1px solid transparent;line-height:1.5}.badge-P1{color:var(--p1);background:var(--p1-soft);border-color:color-mix(in srgb,var(--p1) 26%,transparent)}.badge-P2{color:var(--p2);background:var(--p2-soft);border-color:color-mix(in srgb,var(--p2) 26%,transparent)}.badge-P3{color:var(--p3);background:var(--p3-soft);border-color:color-mix(in srgb,var(--p3) 26%,transparent)}.badge-P4{color:var(--p4);background:var(--p4-soft);border-color:color-mix(in srgb,var(--p4) 26%,transparent)}.badge-soft{color:var(--text-muted);background:var(--surface-alt);border-color:var(--border)}.badge-ok{color:var(--ok);background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 26%,transparent)}.lvl{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.02em}.lvl-FATAL{color:var(--fatal)}.lvl-ERROR{color:var(--p1)}.lvl-WARNING{color:var(--p2)}.lvl-INFO{color:var(--p3)}.lvl-DEBUG{color:var(--text-subtle)}.tag{font-size:11px;padding:1.5px 7px;border-radius:5px;background:var(--surface-alt);color:var(--text-muted);border:1px solid var(--border);font-family:var(--mono)}select,input[type=search],input[type=text],input[type=password],textarea{background:var(--surface-alt);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:7px 11px;font-size:13px;font-family:inherit;outline:none;min-width:0;transition:border-color .15s,box-shadow .15s}select:hover,input:hover,textarea:hover{border-color:var(--border-strong)}select:focus,input:focus,textarea:focus{border-color:var(--accent);box-shadow:var(--ring)}input::placeholder,textarea::placeholder{color:var(--text-subtle)}input[type=search]{min-width:230px}input:disabled,select:disabled{opacity:.55;cursor:not-allowed}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;background:var(--surface-alt);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:7px 13px;font-size:13px;font-weight:550;font-family:inherit;white-space:nowrap;transition:background .15s,border-color .15s,color .15s,transform .06s}.btn:hover{background:var(--surface-hover);border-color:var(--border-strong)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn-ghost{background:transparent;border-color:transparent;color:var(--text-muted)}.btn-ghost:hover{background:var(--surface-alt);color:var(--text);border-color:var(--border)}.btn-danger:hover{color:var(--p1);border-color:color-mix(in srgb,var(--p1) 40%,transparent)}.filters{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13px}thead th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-subtle);font-weight:600;padding:11px var(--sp-4);border-bottom:1px solid var(--border);white-space:nowrap;background:var(--surface);position:sticky;top:0;z-index:1}tbody td{padding:13px var(--sp-4);border-bottom:1px solid var(--border);vertical-align:top}tbody tr:last-child td{border-bottom:none}tbody tr.clickable{cursor:pointer;transition:background .12s}tbody tr.clickable:hover{background:var(--surface-alt)}.cell-msg{max-width:540px}.cell-msg .title{font-weight:570}.cell-msg .meta{color:var(--text-subtle);font-size:12px;margin-top:3px}.num{font-variant-numeric:tabular-nums;text-align:right}.mono{font-family:var(--mono);font-size:12px}.meter{height:6px;border-radius:999px;background:var(--surface-alt);overflow:hidden}.meter>span{display:block;height:100%;border-radius:999px;transition:width .4s ease}.stack-bar{display:flex;height:10px;border-radius:999px;overflow:hidden;background:var(--surface-alt)}.stack-bar>span{display:block;height:100%}.legend{display:flex;flex-wrap:wrap;gap:var(--sp-4);font-size:12px;color:var(--text-muted)}.legend i{width:9px;height:9px;border-radius:3px;display:inline-block;margin-right:6px}.drawer-backdrop{position:fixed;inset:0;background:#02061099;backdrop-filter:blur(3px);z-index:60;opacity:0;pointer-events:none;transition:opacity .2s}.drawer-backdrop.open{opacity:1;pointer-events:auto}.drawer{position:fixed;top:0;right:0;height:100vh;width:min(600px,100vw);background:var(--surface);border-left:1px solid var(--border);z-index:61;transform:translate(100%);transition:transform .24s cubic-bezier(.32,.72,0,1);overflow-y:auto;display:flex;flex-direction:column}.drawer.open{transform:none}.drawer-head{padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--surface);z-index:2}.drawer-body{padding:var(--sp-5) var(--sp-5) var(--sp-7);display:flex;flex-direction:column;gap:var(--sp-5)}.section-title{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--text-subtle);font-weight:600;margin-bottom:var(--sp-2)}pre.code{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 13px;overflow-x:auto;font-family:var(--mono);font-size:11.5px;line-height:1.6;color:var(--text-muted);margin:0;white-space:pre-wrap;word-break:break-word}ul.reasons{margin:0;padding-left:18px;color:var(--text-muted);font-size:13px}ul.reasons li{margin-bottom:5px}.kv{display:grid;grid-template-columns:132px 1fr;gap:7px var(--sp-3);font-size:13px}.kv dt{color:var(--text-subtle)}.kv dd{margin:0}.empty{padding:var(--sp-6) var(--sp-4);text-align:center;color:var(--text-subtle);font-size:13px}.skeleton{background:linear-gradient(90deg,var(--surface-alt) 25%,var(--border) 50%,var(--surface-alt) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--radius-sm);height:12px}@keyframes shimmer{to{background-position:-200% 0}}.status-pill{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--text-muted)}.status-pill i{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px var(--ok-soft);flex:none}.status-pill.offline i{background:var(--p1);box-shadow:0 0 0 3px var(--p1-soft)}.banner{display:flex;gap:10px;align-items:flex-start;padding:12px var(--sp-4);border-radius:var(--radius-sm);background:var(--p1-soft);border:1px solid color-mix(in srgb,var(--p1) 30%,transparent);color:var(--text);font-size:13px;line-height:1.55}.live-dot{width:7px;height:7px;border-radius:50%;flex:none;background:var(--ok);box-shadow:0 0 0 0 var(--ok-soft);animation:pulse 2s ease-out infinite}.live-dot.is-offline{background:var(--p4);animation:none}.live-dot.is-connecting{background:var(--p2);animation:pulse 1s ease-out infinite}@keyframes pulse{0%{box-shadow:0 0 color-mix(in srgb,var(--ok) 55%,transparent)}70%{box-shadow:0 0 0 7px transparent}to{box-shadow:0 0 0 0 transparent}}.stream{max-height:420px;overflow-y:auto;overflow-x:hidden}.stream-row{display:grid;grid-template-columns:62px 58px 1fr;gap:var(--sp-2);align-items:baseline;padding:8px var(--sp-4);border-bottom:1px solid var(--border);cursor:pointer;transition:background .12s}.stream-row:hover{background:var(--surface-alt)}.stream-row .time{font-family:var(--mono);font-size:11px;color:var(--text-subtle)}.stream-row .body{min-width:0}.stream-row .msg{display:block;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stream-row .meta{display:block;font-size:11px;color:var(--text-subtle);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stream-row.is-new{animation:flash-in .9s ease-out}@keyframes flash-in{0%{background:var(--accent-soft);transform:translateY(-3px);opacity:.4}to{background:transparent;transform:none;opacity:1}}.stream-row.is-p1{box-shadow:inset 2px 0 0 var(--p1)}.stream-row.is-p2{box-shadow:inset 2px 0 0 var(--p2)}.counter{font-variant-numeric:tabular-nums;font-size:12px;font-weight:600;color:var(--text-muted);background:var(--surface-alt);padding:2px 8px;border-radius:999px}.uptime-strip{display:flex;flex-wrap:wrap;gap:var(--sp-2)}.uptime-item{display:flex;align-items:center;gap:8px;padding:7px 11px;border-radius:999px;border:1px solid var(--border);background:var(--surface-alt);font-size:12.5px;line-height:1.35;white-space:nowrap;transition:border-color .15s,transform .06s}.uptime-item:hover{border-color:var(--border-strong)}.uptime-item:active{transform:translateY(1px)}.uptime-item.is-down{border-color:color-mix(in srgb,var(--p1) 50%,transparent);background:var(--p1-soft)}.uptime-item.is-degraded{border-color:color-mix(in srgb,var(--p2) 45%,transparent)}.uptime-dot{width:8px;height:8px;border-radius:50%;flex:none}.uptime-item.is-down .uptime-dot{animation:pulse 1.6s ease-out infinite}.uptime-name{font-weight:600}.uptime-meta{color:var(--text-subtle);font-variant-numeric:tabular-nums;font-size:11.5px}.uptime-item.is-down .uptime-meta{color:var(--p1);font-weight:600}:root[data-focus] .sidebar{display:none}:root[data-focus] .shell{grid-template-columns:1fr}:root[data-focus] .topbar{padding-left:var(--sp-5)}.btn-focus.is-active{background:var(--accent);border-color:var(--accent);color:#fff}.cell-pick{width:38px;padding-right:0!important}.cell-pick input[type=checkbox]{cursor:pointer;margin:0}thead th.cell-pick{width:38px}.bulkbar{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;padding:10px var(--sp-5);background:var(--accent-soft);border-bottom:1px solid color-mix(in srgb,var(--accent) 28%,transparent)}.bulkbar .jumlah{font-weight:650;font-variant-numeric:tabular-nums;color:var(--accent)}.bulkbar .pisah{width:1px;height:20px;background:var(--border-strong);margin:0 4px}tbody tr.terpilih{background:var(--accent-soft)}tbody tr.terpilih:hover{background:color-mix(in srgb,var(--accent) 18%,transparent)}.diagnosa-jenis{display:flex;flex-direction:column;gap:3px;padding:9px 11px;border:1px solid color-mix(in srgb,var(--jenis) 32%,transparent);background:color-mix(in srgb,var(--jenis) 9%,transparent);border-radius:var(--radius-sm);font-size:12.5px}.diagnosa-jenis b{color:var(--jenis)}.diagnosa-jenis span{color:var(--text-muted);line-height:1.45}.rantai{margin-top:10px}.rantai-judul{font-size:11.5px;color:var(--text-muted);margin-bottom:5px}.rantai ol{margin:0;padding-left:19px;display:flex;flex-direction:column;gap:4px}.rantai li{font-size:11.8px;color:var(--text-muted);line-height:1.4;word-break:break-word}.rantai li:last-child{color:var(--text)}.cell-msg .tag-row{margin-top:5px;display:flex;gap:4px;flex-wrap:wrap}.cell-msg .tag-row:empty{display:none}.cell-msg .culprit{margin-top:4px;font-size:11.2px;color:var(--text-subtle);direction:rtl;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:34ch}.tag-jenis{border-color:color-mix(in srgb,var(--jenis-warna) 38%,transparent);background:color-mix(in srgb,var(--jenis-warna) 12%,transparent);color:var(--jenis-warna);font-weight:500}.tag-bug_kode{--jenis-warna: var(--p1)}.tag-infrastruktur{--jenis-warna: var(--p2)}.tag-dependensi{--jenis-warna: var(--accent)}.tag-konfigurasi{--jenis-warna: var(--p3)}.tag-input{--jenis-warna: var(--text-subtle)}.agentdocs{margin-top:14px;padding:12px 14px;border:1px dashed var(--border-strong);border-radius:var(--radius-sm);background:var(--surface-alt)}.agentdocs-judul{font-weight:600;font-size:13px;margin-bottom:5px}.agentdocs p{margin:0 0 8px;font-size:12.5px;color:var(--text-muted);line-height:1.55}.agentdocs ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--text-muted)}.agentdocs a{color:var(--accent)}.legenda-tier{display:flex;gap:14px;flex-wrap:wrap;align-items:baseline;padding:0 2px;font-size:12px;color:var(--text-subtle)}.legenda-tier b{color:var(--text);margin-right:3px}.legenda-tier i{font-style:normal;font-variant-numeric:tabular-nums;opacity:.7;margin-left:3px}.layanan-body{display:flex;flex-direction:column;gap:12px}.layanan-desc{font-size:12.5px;color:var(--text-muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}.layanan-angka{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:10px 0;border-block:1px solid var(--border)}.layanan-angka>div{min-width:0;display:grid;grid-template-rows:2.1em auto;align-content:start}.layanan-angka span{font-size:10.5px;line-height:1.25;letter-spacing:.03em;text-transform:uppercase;color:var(--text-subtle)}.layanan-angka b{font-size:19px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.15}.layanan-angka b.nyala{color:var(--p1)}.layanan-angka b.kecil{font-size:12.5px;font-weight:550;color:var(--text-muted)}.layanan-aksi{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.layanan-status{flex:1;min-width:0;font-size:12px;color:var(--text-muted)}.layanan-status b{color:var(--text);font-variant-numeric:tabular-nums}.layanan-atur{display:flex;flex-direction:column;gap:12px;padding-top:2px}.layanan-atur[hidden]{display:none}.card.sedang-diatur{border-color:color-mix(in srgb,var(--accent) 40%,var(--border))}.btn-sm{padding:4px 10px;font-size:12px}.card.lipat>summary{display:flex;align-items:center;gap:10px;padding:13px 16px;cursor:pointer;list-style:none;user-select:none}.card.lipat>summary::-webkit-details-marker{display:none}.card.lipat>summary:hover{background:var(--surface-hover)}.lipat-judul{font-weight:600;font-size:14px}.lipat-tanda{font-size:11.5px;color:var(--text-subtle);border:1px solid var(--border);border-radius:999px;padding:2px 9px}.card.lipat[open]>summary .lipat-tanda:after{content:""}.card.lipat[open]>summary .lipat-tanda{color:var(--accent)}.langkah-peta .card-body{display:flex;flex-direction:column;gap:14px}.langkah-kepala{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start;justify-content:space-between}.langkah-kepala h3{margin-bottom:4px}.langkah-alamat{display:flex;flex-direction:column;gap:3px;font-size:11px;letter-spacing:.03em;text-transform:uppercase;color:var(--text-subtle);text-align:right}.langkah-alamat .mono{font-size:12.5px;text-transform:none;letter-spacing:0;color:var(--text-muted)}.langkah-daftar{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:9px;counter-reset:none}.langkah-daftar a{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-alt);text-decoration:none;color:inherit;transition:border-color .15s,background .15s}.langkah-daftar a:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--border));background:var(--surface-hover)}.langkah-daftar b{flex:none;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:var(--accent-soft, color-mix(in srgb, var(--accent) 16%, transparent));color:var(--accent);font-size:12.5px;font-weight:600}.langkah-daftar span{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:13px;font-weight:550}.langkah-daftar i{font-style:normal;font-size:11.5px;font-weight:400;color:var(--text-subtle)}.langkah .card-head h3,.jalur-pintas .card-head h3{display:flex;align-items:center;gap:9px}.langkah-no{flex:none;width:23px;height:23px;display:grid;place-items:center;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent);font-size:12px;font-weight:600}.langkah-no.pintas{border-color:color-mix(in srgb,var(--p2) 45%,transparent);background:color-mix(in srgb,var(--p2) 14%,transparent);color:var(--p2)}.jalur-pintas{border-color:color-mix(in srgb,var(--p2) 30%,var(--border))}.jalur-pintas>.card-head{background:color-mix(in srgb,var(--p2) 7%,transparent)}.langkah .card-body>div:not(.banner):not(.filters):not(.agentdocs),.jalur-pintas .card-body>div:not(.banner):not(.filters):not(.agentdocs){max-width:78ch}.kpi-utama{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;min-width:0}.kpi-utama .value{margin:0}.spark{flex:none;overflow:visible;opacity:.9;margin-bottom:3px}.kpi{position:relative;overflow:hidden}.kpi:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--border-strong)}.kpi.is-p1:before{background:var(--p1)}.kpi.is-p2:before{background:var(--p2)}.kpi.is-ok:before{background:var(--ok)}.legend-baris{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}.legend-baris .legend{flex:1;margin:0}.legend-angka{font-size:11.5px;color:var(--text-subtle);white-space:nowrap}.legend-angka b{color:var(--text-muted);font-variant-numeric:tabular-nums}.stream:has(>.empty){min-height:0;display:grid;place-items:center;padding:var(--sp-5) var(--sp-4)}.stream>.empty{font-size:12.5px;line-height:1.6;text-align:center}.grid-3>.card>.card-body:has(>[data-chart-trend]),.grid-3>.card>.card-body:has(>[data-chart-priority]){display:flex;flex-direction:column;justify-content:center;flex:1}.grid-3>.card:has([data-chart-trend]),.grid-3>.card:has([data-chart-priority]){display:flex;flex-direction:column}.pil-baru{display:block;width:100%;padding:8px 14px;border:0;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font:inherit;font-size:12.5px;font-weight:550;text-align:center;cursor:pointer}.pil-baru:hover{background:color-mix(in srgb,var(--accent) 19%,transparent)}.trafik-isi{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);gap:var(--sp-4);padding:var(--sp-4) var(--sp-5) var(--sp-5)}@media(max-width:1080px){.trafik-isi{grid-template-columns:1fr}}.trafik-peta{min-width:0;display:grid;place-items:center}.radar{max-width:100%}.trafik-angka{display:flex;gap:6px;flex-wrap:wrap}.chip-trafik{font-size:11.5px;padding:3px 9px;border:1px solid var(--border);border-radius:999px;color:var(--text-muted);white-space:nowrap}.chip-trafik.peringatan{border-color:color-mix(in srgb,var(--p2) 42%,transparent);background:color-mix(in srgb,var(--p2) 12%,transparent);color:var(--p2);font-weight:550}.chip-trafik.aman{border-color:color-mix(in srgb,var(--ok) 38%,transparent);color:var(--ok)}.trafik-daftar{display:flex;flex-direction:column;gap:2px;min-width:0;align-self:start}.trafik-baris{display:grid;grid-template-columns:8px minmax(0,1fr) auto auto;grid-template-rows:auto 3px;align-items:center;gap:0 9px;padding:7px 8px 5px;border-radius:var(--radius-sm)}.trafik-baris:hover{background:var(--surface-alt)}.trafik-baris .titik{width:8px;height:8px;border-radius:50%}.trafik-baris .nama{display:flex;flex-direction:column;min-width:0}.trafik-baris .nama b{font-size:12.5px;font-weight:550;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trafik-baris .nama i,.trafik-baris .jumlah i{font-style:normal;font-size:10.5px;color:var(--text-subtle)}.trafik-baris .spark{display:flex;opacity:.85}.trafik-baris .spark .spark{width:72px;height:22px}.trafik-baris .jumlah{display:flex;flex-direction:column;align-items:flex-end;min-width:54px}.trafik-baris .jumlah b{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}.trafik-baris .bilah{grid-column:1 / -1;height:3px;border-radius:2px;background:var(--surface-alt);overflow:hidden}.trafik-baris .bilah>span{display:block;height:100%;border-radius:2px;opacity:.55}@media(prefers-reduced-motion:reduce){.radar animate,.radar animateMotion{display:none}.radar circle{animation:none!important}}@media(min-width:1600px){:root{--sp-4: 20px;--sp-5: 28px;--sp-6: 40px;--topbar-h: 76px}body{font-size:clamp(14px,.78vw,19px)}.page-title{font-size:clamp(20px,1.35vw,32px)}.card-head h3{font-size:clamp(15px,.95vw,22px)}.kpi .label{font-size:clamp(12px,.72vw,17px)}.kpi .value{font-size:clamp(29px,2.1vw,46px);line-height:1.04}.kpi .foot{font-size:clamp(11.5px,.66vw,15px)}.kpi-icon{transform:scale(1.15)}.spark{width:clamp(104px,7vw,150px);height:auto}.trafik-baris .nama b{font-size:clamp(13px,.8vw,18px)}.trafik-baris .jumlah b{font-size:clamp(14px,.92vw,21px)}.chip-trafik{font-size:clamp(12px,.68vw,16px);padding:5px 12px}.stream-row .msg{font-size:clamp(12.5px,.72vw,16px)}table{font-size:clamp(13px,.76vw,17px)}}:root[data-focus]{--border: #2b3549;--border-strong: #3d4b66;--surface: #151b2b;--text-muted: #a9b6c9;--text-subtle: #7d8b9f}:root[data-focus] .content{padding:var(--sp-5) var(--sp-6) var(--sp-6);gap:var(--sp-5)}:root[data-focus] .card{border-width:1.5px}:root[data-focus] .page-title{font-size:clamp(24px,1.7vw,40px)}:root[data-focus] .kpi{padding:clamp(20px,1.6vw,38px)}:root[data-focus] .kpi .value{font-size:clamp(46px,4.4vw,110px)}:root[data-focus] .kpi .label{font-size:clamp(13px,.85vw,20px);letter-spacing:.06em;text-transform:uppercase}:root[data-focus] .kpi:before{height:4px}:root[data-focus] .kpi.is-p1 .value{color:#ff8f8f}:root[data-focus] .kpi.is-p2 .value{color:#ffd04d}:root[data-focus] .kpi.is-ok .value{color:#4ade80}:root[data-focus] .badge-P1,:root[data-focus] .chip-trafik.peringatan{font-weight:650}:root[data-focus] .card-head .btn-ghost,:root[data-focus] [data-live-pause],:root[data-focus] .pil-baru{display:none}:root[data-focus] .trafik-isi{grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr)}:root[data-focus] .trafik-baris{padding:10px 10px 7px}:root[data-focus] .trafik-baris .nama b{font-size:clamp(14px,.95vw,22px)}:root[data-focus] .trafik-baris .jumlah b{font-size:clamp(16px,1.1vw,26px)}:root[data-focus] .stream-row{padding:9px 12px}:root[data-focus] .stream-row .msg{font-size:clamp(13px,.82vw,19px)}:root[data-focus] .legend-baris,:root[data-focus] .legend{font-size:clamp(12px,.72vw,17px)}.trafik-asal{padding:0 var(--sp-5) var(--sp-5)}.asal-judul{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-subtle);margin-bottom:9px;padding-top:var(--sp-4);border-top:1px solid var(--border)}.asal-baris{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}.asal-item{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 3px;align-items:center;gap:3px 10px;padding:9px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-alt)}.asal-item.samar{opacity:.72}.asal-bendera{font-size:21px;line-height:1;grid-row:1}.asal-item.samar .asal-bendera{color:var(--text-subtle);font-size:17px}.asal-teks{display:flex;flex-direction:column;min-width:0}.asal-teks b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.asal-teks i{font-style:normal;font-size:10.5px;color:var(--text-subtle);font-variant-numeric:tabular-nums}.asal-bilah{grid-column:1 / -1;height:3px;border-radius:2px;background:color-mix(in srgb,var(--border) 70%,transparent);overflow:hidden}.asal-bilah>span{display:block;height:100%;border-radius:2px;background:var(--accent);opacity:.7}@media(min-width:1600px){.asal-bendera{font-size:clamp(21px,1.5vw,34px)}.asal-teks b{font-size:clamp(13px,.82vw,19px)}}.card{border-radius:14px;background-image:linear-gradient(to bottom,color-mix(in srgb,var(--text) 4%,transparent) 0,transparent 1px)}.papan-kpi{display:grid;grid-template-columns:1.25fr repeat(4,1fr);gap:0;overflow:hidden}@media(max-width:1180px){.papan-kpi{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}}.papan-kpi>.kpi{position:relative;padding:var(--sp-5);gap:8px;border:0;border-radius:0;background:transparent}.papan-kpi>.kpi+.kpi{box-shadow:inset 1px 0 0 var(--border)}.papan-kpi>.kpi:before{inset:var(--sp-4) auto var(--sp-4) 0;width:3px;height:auto;border-radius:0 3px 3px 0;background:transparent}.papan-kpi>.kpi.is-p1:before{background:var(--p1)}.papan-kpi>.kpi.is-p2:before{background:var(--p2)}.papan-kpi>.kpi.is-ok:before{background:var(--ok)}.papan-kpi>.kpi.utama .value{font-size:clamp(32px,2.4vw,44px)}.papan-kpi>.kpi.utama .label{color:var(--text-muted)}.kpi .label{font-size:10.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--text-subtle)}.kpi .value{font-variant-numeric:tabular-nums;letter-spacing:-.02em}.kpi .foot{font-size:11.5px}.card-head h3{letter-spacing:-.01em}[data-chart-priority]>div{justify-content:center}.stream{max-height:372px}:root{--p3: #4a9fd8}.grid-3 .stream{max-height:330px}.grid-3>.card{min-height:0}:root{--pendar-p1: 0 0 20px color-mix(in srgb, var(--p1) 34%, transparent);--pendar-p2: 0 0 18px color-mix(in srgb, var(--p2) 30%, transparent);--pendar-ok: 0 0 18px color-mix(in srgb, var(--ok) 30%, transparent);--kaca: color-mix(in srgb, var(--surface) 96%, transparent)}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background:radial-gradient(880px 520px at 18% -8%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 65%),radial-gradient(720px 460px at 92% 8%,color-mix(in srgb,var(--p3) 10%,transparent),transparent 62%)}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5;background-image:linear-gradient(to right,color-mix(in srgb,var(--text) 3%,transparent) 1px,transparent 1px),linear-gradient(to bottom,color-mix(in srgb,var(--text) 3%,transparent) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(circle at 50% 0%,#000 0%,transparent 78%)}.shell,.topbar{position:relative;z-index:1}.sidebar{z-index:2}.card{background-color:var(--kaca);border-color:color-mix(in srgb,var(--border) 88%,var(--accent))}.hud-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--sp-4);align-items:stretch}.hud-grid>.span-3{grid-column:span 3}.hud-grid>.span-4{grid-column:span 4}.hud-grid>.span-5{grid-column:span 5}.hud-grid>.span-8{grid-column:span 8}@media(max-width:1240px){.hud-grid>[class*=span-]{grid-column:span 6}}@media(max-width:760px){.hud-grid>[class*=span-]{grid-column:span 12}}.kartu-aliran{display:flex;flex-direction:column;min-height:0}.kartu-aliran .stream{flex:1;max-height:none}.kpi.is-p1 .value{text-shadow:var(--pendar-p1)}.kpi.is-p2 .value{text-shadow:var(--pendar-p2)}.kpi.is-ok .value{text-shadow:var(--pendar-ok)}.papan-kpi>.kpi.is-p1:before{box-shadow:var(--pendar-p1)}.papan-kpi>.kpi.is-p2:before{box-shadow:var(--pendar-p2)}.papan-kpi>.kpi.is-ok:before{box-shadow:var(--pendar-ok)}.kpi .value{font-family:var(--mono);font-weight:600;letter-spacing:-.03em}.card-head h3{display:flex;align-items:center;gap:9px}.card-head h3:before{content:"";width:3px;height:15px;border-radius:2px;background:color-mix(in srgb,var(--accent) 75%,transparent);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 55%,transparent)}[data-trafik-card]{border-color:color-mix(in srgb,var(--accent) 26%,var(--border));background-image:radial-gradient(620px 340px at 34% 55%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 70%)}[data-trafik-card] .trafik-peta{background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 13%,transparent),transparent 72%)}.stream-row.is-new{box-shadow:inset 2px 0 0 var(--accent)}[data-chart-trend] svg{max-height:360px}.papan{display:grid;grid-template-columns:var(--pias, 1fr);gap:0;overflow:hidden}.papan>.pias{display:flex;flex-direction:column;min-width:0}.papan>.pias+.pias{box-shadow:inset 1px 0 0 var(--border)}.papan>.pias>.card-body{flex:1}@media(max-width:1180px){.papan{grid-template-columns:1fr}.papan>.pias+.pias{box-shadow:inset 0 1px 0 var(--border)}}.papan-status{overflow:hidden}.papan-kaki{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;padding:11px var(--sp-5);box-shadow:inset 0 1px 0 var(--border);background:color-mix(in srgb,var(--surface-alt) 55%,transparent)}.kaki-judul{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--text-subtle)}.card-head.bertepi{box-shadow:inset 0 1px 0 var(--border)}.papan .card-head h3,.papan-tumpuk .card-head h3{font-size:13.5px}.papan .card-head{border-bottom-color:color-mix(in srgb,var(--border) 70%,transparent)}.trafik-peta .radar{max-height:330px}.trafik-isi{padding:var(--sp-4) var(--sp-5)}:root[data-theme=light]{--p1: #e11d48;--p2: #c2740a;--p3: #0f7fb8;--ok: #0f9d76;--accent: #5b5fdb;--accent-hover: #4b4fc4;--kaca: color-mix(in srgb, var(--surface) 88%, transparent);--pendar-p1: none;--pendar-p2: none;--pendar-ok: none}:root[data-theme=light] .kpi .value{text-shadow:none}:root[data-theme=light] .papan-kpi>.kpi:before{box-shadow:none}:root[data-theme=light] .radar{filter:none}:root[data-theme=light] .card-head h3:before{box-shadow:none}:root[data-theme=light] body:before{opacity:.45}:root[data-theme=light] body:after{opacity:.28}.sidebar{background:linear-gradient(to bottom,color-mix(in srgb,var(--accent) 7%,transparent),transparent 260px),color-mix(in srgb,var(--surface) 72%,transparent);border-right-color:color-mix(in srgb,var(--border) 85%,var(--accent));padding:var(--sp-5) var(--sp-3) var(--sp-4);gap:var(--sp-4)}.brand-sub{padding-left:1px;font-size:11.5px;letter-spacing:.01em}.nav-label{display:flex;align-items:center;gap:8px;padding:0 10px 7px}.nav-label:after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--border),transparent)}.nav a{gap:11px;padding:8px 10px;font-size:13px}.nav a:hover{background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--text)}.nav a.active{background:linear-gradient(to right,color-mix(in srgb,var(--accent) 22%,transparent),color-mix(in srgb,var(--accent) 6%,transparent) 70%,transparent);color:var(--text)}.nav a.active:before{top:6px;bottom:6px;box-shadow:0 0 14px color-mix(in srgb,var(--accent) 70%,transparent)}.nav a.active .icon{opacity:1;color:var(--accent)}.sidebar-foot{gap:var(--sp-2);padding-top:var(--sp-3);border-top:1px solid var(--border)}.user-chip{background:color-mix(in srgb,var(--surface-alt) 70%,transparent);border:1px solid var(--border)}.sidebar-foot .btn-ghost{padding:7px 8px;font-size:12px;border:1px solid var(--border)}.sidebar-foot .btn-ghost:hover{border-color:color-mix(in srgb,var(--accent) 45%,var(--border))}:root[data-focus] .content{height:calc(100vh - var(--topbar-h));padding:var(--sp-4);gap:var(--sp-4);overflow:hidden;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto minmax(0,1.05fr) minmax(0,.95fr);grid-template-areas:"status  status" "sinyal  tren" "analitik masalah"}:root[data-focus] .content>.papan-status{grid-area:status}:root[data-focus] .content>[data-trafik-card]{grid-area:sinyal}:root[data-focus] .content>.papan:not(.papan-status){grid-area:tren}:root[data-focus] .content>.papan:not(.papan-status)~.papan{grid-area:analitik}:root[data-focus] .content>.papan-tumpuk{grid-area:masalah}:root[data-focus] .content>*{min-height:0;display:flex;flex-direction:column;overflow:hidden}:root[data-focus] .card-body,:root[data-focus] .table-wrap,:root[data-focus] .trafik-isi,:root[data-focus] .stream{min-height:0;overflow:hidden}:root[data-focus] .stream,:root[data-focus] .papan-tumpuk .table-wrap{overflow-y:auto}:root[data-focus] .papan{display:grid}:root[data-focus] .papan>.pias{min-height:0;overflow:hidden}:root[data-focus] .trafik-asal,:root[data-focus] .papan-kaki{display:none}:root[data-focus] .card-head{padding:10px var(--sp-4)}:root[data-focus] .card-body{padding:var(--sp-3) var(--sp-4)}:root[data-focus] .kpi{padding:12px var(--sp-4)}:root[data-focus] .papan-kpi{grid-template-columns:1.2fr repeat(4,1fr)}:root[data-focus] .trafik-isi{grid-template-columns:minmax(0,1fr) minmax(190px,.85fr)}:root[data-focus] .trafik-peta .radar{max-height:none;height:100%}:root[data-focus] .trafik-daftar{overflow:auto}:root[data-focus] .papan-tumpuk .card-head.bertepi,:root[data-focus] .papan-tumpuk .card-head.bertepi+.table-wrap{display:none}:root[data-focus] th:nth-child(n+6):not(:last-child),:root[data-focus] td:nth-child(n+6):not(:last-child){display:none}@media(max-width:1100px){:root[data-focus] .content{height:auto;overflow:visible;grid-template-columns:1fr;grid-template-areas:"status" "sinyal" "tren" "analitik" "masalah"}}:root[data-focus] .papan-kpi>.kpi .value{font-size:clamp(34px,2.5vw,52px)}:root[data-focus] .papan-kpi>.kpi.utama .value{font-size:clamp(44px,3.3vw,70px)}:root[data-focus] .papan-kpi>.kpi{display:grid;grid-template-rows:auto 1fr auto;gap:4px}:root[data-focus] .kpi-top{align-items:center;min-height:26px}:root[data-focus] .kpi-utama{align-items:center}:root[data-focus] .card-head{flex-wrap:nowrap}:root[data-focus] .card-head h3{white-space:nowrap}:root[data-focus] .card-head .hint{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}:root[data-focus] [data-chart-priority] svg{width:132px;height:132px}:root[data-focus] [data-chart-priority]>div{gap:12px}:root[data-focus] [data-trafik-card] .card-head{flex-wrap:nowrap}:root[data-focus] .trafik-angka{flex-wrap:nowrap;min-width:0;overflow:hidden}:root[data-focus] .trafik-angka .chip-trafik{font-size:11px;padding:3px 8px}:root[data-focus] [data-trafik-card] .card-head>.hint{display:none}.antrian-panel{display:flex;flex-direction:column;gap:var(--sp-4);height:100%;min-height:0}.antrian-cincin{display:grid;place-items:center;min-height:0}.antrian-cincin svg{width:100%;max-width:190px;height:auto;max-height:190px}.antrian-daftar{display:flex;flex-direction:column;gap:2px}.antrian-baris{display:grid;grid-template-columns:9px minmax(0,1fr) auto;grid-template-rows:auto 3px;align-items:center;gap:2px 10px;padding:6px 8px 5px;border-radius:var(--radius-sm)}.antrian-baris:hover{background:var(--surface-alt)}.antrian-titik{width:9px;height:9px;border-radius:3px;background:var(--warna);box-shadow:0 0 10px color-mix(in srgb,var(--warna) 55%,transparent)}.antrian-nama{display:flex;flex-direction:column;min-width:0}.antrian-nama b{font-size:12.5px;font-weight:550;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.antrian-nama i{font-style:normal;font-size:10.5px;color:var(--text-subtle)}.antrian-nilai{font-family:var(--mono);font-size:16px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--warna)}.antrian-bilah{grid-column:1 / -1;height:3px;border-radius:2px;background:color-mix(in srgb,var(--border) 70%,transparent);overflow:hidden}.antrian-bilah>span{display:block;height:100%;border-radius:2px;background:var(--warna);opacity:.75}:root[data-focus] .antrian-cincin svg{max-width:150px;max-height:150px}:root[data-focus] .antrian-nama b{font-size:13.5px}:root[data-focus] .antrian-nilai{font-size:19px}.brand-logo{height:34px}.brand{padding:0 var(--sp-2) 2px}.topbar-brand{display:none}.topbar-brand .brand-logo{height:30px}:root[data-focus] .topbar-brand{display:flex;align-items:center;padding-right:var(--sp-4);margin-right:var(--sp-4);border-right:1px solid var(--border)}:root[data-focus] .topbar-brand .brand-logo{height:clamp(28px,2vw,40px)}.trafik-daftar{display:flex;flex-direction:column;gap:2px;overflow:hidden}:root[data-focus] .trafik-daftar{overflow:hidden}:root[data-focus] .trafik-isi{overflow:hidden}:root[data-focus] .trafik-baris{padding:5px 6px 4px}:root[data-focus] .trafik-baris .spark .spark{width:56px;height:18px}.meter>span,.trafik-baris .bilah>span,.antrian-bilah>span,.asal-bilah>span{background-image:linear-gradient(to right,color-mix(in srgb,#fff 22%,transparent),transparent 60%);opacity:1}.badge-P1,.badge-P2,.badge-P3,.badge-P4{background-image:linear-gradient(135deg,color-mix(in srgb,currentColor 26%,transparent),color-mix(in srgb,currentColor 8%,transparent));border-color:color-mix(in srgb,currentColor 42%,transparent)}.chip-trafik.peringatan{box-shadow:0 0 16px color-mix(in srgb,var(--p2) 22%,transparent)}.chip-trafik.aman{background:color-mix(in srgb,var(--ok) 10%,transparent)}.kpi-icon{background-image:linear-gradient(140deg,color-mix(in srgb,currentColor 22%,transparent),transparent)}:root[data-focus] .trafik-isi{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-3)}:root[data-focus] .trafik-baris{grid-template-rows:auto 2px;padding:3px 6px}:root[data-focus] .trafik-baris .nama i,:root[data-focus] .trafik-baris .jumlah i{display:none}:root[data-focus] .trafik-baris .nama b{font-size:13px}:root[data-focus] .trafik-baris .jumlah b{font-size:16px}:root[data-focus] .trafik-baris .spark .spark{width:64px;height:17px}:root[data-focus] .antrian-panel{gap:var(--sp-3)}:root[data-focus] .antrian-cincin svg{max-width:96px;max-height:96px}:root[data-focus] .antrian-baris{padding:4px 7px}:root[data-focus] .antrian-nama b{font-size:12.5px}:root[data-focus] .antrian-nilai{font-size:17px}.topbar .filters{gap:6px;padding:4px;border:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--surface-alt) 60%,transparent)}.topbar .filters label.btn input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}.topbar .filters label.btn{position:relative;gap:8px;padding:6px 13px 6px 11px;border:1px solid transparent;border-radius:999px;color:var(--text-subtle);font-weight:500;transition:color .15s,background .15s,border-color .15s}.topbar .filters label.btn:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--border-strong);transition:background .15s,box-shadow .15s}.topbar .filters label.btn:hover{color:var(--text-muted)}.topbar .filters label.btn:has(input:checked){color:var(--text);background:color-mix(in srgb,var(--accent) 16%,transparent);border-color:color-mix(in srgb,var(--accent) 38%,transparent)}.topbar .filters label.btn:has(input:checked):before{background:var(--accent);box-shadow:0 0 10px color-mix(in srgb,var(--accent) 75%,transparent)}.topbar .filters label.btn:focus-within{outline:none;box-shadow:var(--ring)}.topbar .filters select{border-radius:999px;border-color:transparent;background-color:color-mix(in srgb,var(--surface) 70%,transparent);padding:6px 30px 6px 13px}.topbar .filters select:hover{border-color:color-mix(in srgb,var(--accent) 35%,transparent)}.topbar .filters .btn-primary{border-radius:999px}.btn-focus{border-radius:999px;border:1px solid var(--border)}.btn-focus.is-active{background:color-mix(in srgb,var(--accent) 18%,transparent);border-color:color-mix(in srgb,var(--accent) 45%,transparent);color:var(--text)}:root[data-focus] [data-chart-services],:root[data-focus] [data-chart-categories]{overflow:hidden}:root[data-focus] [data-chart-services]>div:last-child,:root[data-focus] [data-chart-categories]>div:last-child{margin-bottom:0}:root[data-focus] [data-chart-trend]{overflow:hidden}:root[data-focus] .stream,:root[data-focus] .papan-tumpuk .table-wrap,:root[data-focus] .content,:root[data-focus] .content *{overflow:hidden!important;scrollbar-width:none}:root[data-focus] .content *::-webkit-scrollbar{display:none}.topbar-jam{display:flex;flex-direction:column;align-items:flex-end;gap:1px;padding-right:var(--sp-4);margin-right:var(--sp-2);border-right:1px solid var(--border);line-height:1.1}.jam-waktu{font-family:var(--mono);font-size:19px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--text)}.jam-tanggal{font-size:11px;color:var(--text-subtle);white-space:nowrap}:root[data-focus] .jam-waktu{font-size:clamp(22px,1.7vw,38px)}:root[data-focus] .jam-tanggal{font-size:clamp(11px,.7vw,15px)}@media(min-width:1600px){.jam-waktu{font-size:clamp(19px,1.2vw,28px)}}@media(max-width:900px){.topbar-jam{display:none}}:root[data-focus],:root[data-focus] body{overflow:hidden;height:100%}:root[data-focus] .card-head h3{overflow:hidden;text-overflow:ellipsis;min-width:0}