/* EBM webapp — minimal, mudah dirawat, tanpa build step */
:root{font-family:system-ui,sans-serif;color:#1a1a1a;background:#f6f7f9}
body{margin:0}nav{display:flex;gap:1rem;align-items:center;padding:.6rem 1rem;background:#12263a;color:#fff}
nav a{color:#fff;text-decoration:none}nav .spacer{flex:1}nav form{margin:0}
main{max-width:1100px;margin:1rem auto;padding:0 1rem}
article{background:#fff;border:1px solid #dde1e6;border-radius:8px;padding:.8rem 1rem;margin:.6rem 0}
.account .balance{font-size:1.6rem;font-weight:600}.account.has-alarm .balance{color:#b00020}
.account.unregistered{border-style:dashed;background:#fffbe6}
.tag{display:inline-block;padding:.1rem .5rem;border-radius:999px;font-size:.8rem;background:#e8ecf1}
.tag.alarm{background:#ffd6d6;color:#8a0000}.tag.armed{background:#dff5e1}.tag.disarm{background:#fde9c9}
.tag.needs-config{background:#fff0a6;color:#5a4a00}
.alarm.active{border-left:6px solid #b00020}.alarm.fully_acked{border-left:6px solid #2e7d32}
.alarm.resolved{border-left:6px solid #607d8b}.alarm.suppressed{border-left:6px solid #9e9e9e;background:#f2f2f2;opacity:.9}
.alarm.suppressed h3::after{content:" (by schedule)";font-weight:400;color:#666}
table{border-collapse:collapse;width:100%;background:#fff}th,td{border-bottom:1px solid #e3e6ea;padding:.4rem .6rem;text-align:left;font-variant-numeric:tabular-nums}
.up{color:#2e7d32}.down{color:#b00020}.banner{background:#fff0a6;border:1px solid #e0c200;padding:.6rem 1rem;border-radius:8px;margin:.6rem 0}
.error{background:#ffd6d6;border:1px solid #b00020;padding:.6rem 1rem;border-radius:8px}
button{cursor:pointer;border:0;border-radius:6px;padding:.5rem .9rem;background:#12263a;color:#fff}button.ack{background:#b00020;font-size:1.1rem}
small,.muted{color:#666}
/* admin (M9) */
nav .sep{opacity:.5}.note{color:#666}form.inline{display:inline}button.danger{background:#b00020}button.ghost{background:#e8ecf1;color:#1a1a1a}
.confirm ul{list-style:none;padding:0}.confirm li{padding:.2rem 0;border-bottom:1px dashed #e3e6ea}
fieldset{border:1px solid #dde1e6;border-radius:8px;margin:.6rem 0}label{display:inline-block;margin:.2rem .6rem .2rem 0}
.filters{display:flex;flex-wrap:wrap;gap:.4rem;align-items:end;margin:.6rem 0}td.json{font-family:ui-monospace,monospace;font-size:.8rem;max-width:32rem;overflow-wrap:anywhere}
.tag.off{background:#ffd6d6;color:#8a0000}.tag.on{background:#dff5e1}.tag.inactive{background:#e0e0e0;color:#555}
.login-card{max-width:420px;margin:3rem auto;text-align:center}
.login-card .g_id_signin{display:flex;justify-content:center;margin:1rem 0}  /* v1.114 A: tombol Google di tengah kartu */
button.ack.done{background:#9e9e9e;color:#fff;cursor:default}.progress{display:block;margin:.3rem 0}
article h3 a,article strong a{color:inherit;text-decoration:none;border-bottom:1px dotted #888}article h3 a:hover,article strong a:hover{border-bottom-style:solid}

/* ---- A6 (v1.71): token, grid 3 kolom, sparkline, mode monitor (prototype 5 Okt) ---- */
:root{--bg:#f6f7f9;--surface:#fff;--line:#dde1e6;--ink:#1a1a1a;--muted:#666;--navy:#12263a;--alarm:#b00020;--alarm-soft:#ffd6d6;--alarm-ink:#8a0000;
  --up:#2e7d32;--down:#b00020;--spark:#12263a;--grid:#e3e7ec;--card-pad:16px;--saldo:28px;--ref:15px;--meta:12.5px;--spark-h:64px;--gap:14px}
body.monitor{--bg:#0f1520;--surface:#18202d;--line:#283444;--ink:#e9eef5;--muted:#8798ab;--navy:#0b111a;--alarm:#c4232c;--alarm-soft:#3a1216;--alarm-ink:#ffb4b8;
  --up:#3ecf8e;--down:#f0545c;--spark:#5aa7ff;--grid:#243041;--card-pad:22px;--saldo:38px;--ref:18px;--meta:14.5px;--spark-h:92px;--gap:18px;
  background:var(--bg);color:var(--ink)}
body.monitor nav{background:var(--navy)}
body.monitor nav a,body.monitor nav .sep,body.monitor nav .who,body.monitor .page-title{display:none}
body.monitor main{max-width:none;padding:18px 22px 40px}
body.monitor article{background:var(--surface);border-color:var(--line);color:var(--ink)}
body.monitor small,body.monitor .muted,body.monitor .note{color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
@media (max-width:1100px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.grid{grid-template-columns:1fr}}
.grid article{margin:0;padding:var(--card-pad)}
.account .ref{font-size:var(--ref)}.account .balance{font-size:var(--saldo)}.account .meta,.account .lbl{font-size:var(--meta)}
.account .balance.red{color:var(--alarm)}
.account .up{color:var(--up)}.account .down{color:var(--down)}
.pills{margin-top:6px}
body.monitor .account.has-alarm{box-shadow:0 0 0 2px var(--alarm);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 2px var(--alarm)}50%{box-shadow:0 0 0 6px rgba(196,35,44,.25)}}
@media (prefers-reduced-motion:reduce){body.monitor .account.has-alarm{animation:none}}
.spark{margin-top:10px;height:var(--spark-h);width:100%;display:block}
.spark .g{stroke:var(--grid);stroke-width:1}
.spark .l{fill:none;stroke:var(--spark);stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.spark .d{fill:none;stroke:var(--down);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.spark .s{fill:none;stroke:var(--muted);stroke-width:1.4;stroke-dasharray:3 4}
.spark-cap{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-top:3px;font-variant-numeric:tabular-nums}
.empty{color:var(--muted);font-size:var(--meta);margin-top:10px;height:var(--spark-h);display:flex;align-items:center;justify-content:center;border:1px dashed var(--line);border-radius:6px}
nav .toggle{display:inline-flex;border:1px solid rgba(255,255,255,.35);border-radius:8px;overflow:hidden;margin:0}
nav .toggle button{background:transparent;color:#fff;border:0;border-radius:0;padding:5px 11px;font-size:13px;opacity:.75}
nav .toggle button.on{background:#fff;color:var(--navy);opacity:1;font-weight:600}
nav .who{opacity:.8}nav form.logout{margin:0}
.heartbeat{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:#fff}
.heartbeat i{width:9px;height:9px;border-radius:50%;background:#3ecf8e;display:inline-block}
.heartbeat.lost i{background:#f0545c}.heartbeat i.blink{animation:beat .6s ease-out 1}
@keyframes beat{0%{transform:scale(1.8);opacity:.5}100%{transform:scale(1);opacity:1}}
.banner.lost{background:var(--alarm);color:#fff;border:0;font-weight:600}
.spark .n{fill:var(--muted);font-size:10px;font-variant-numeric:tabular-nums}body.monitor .spark .n{font-size:12px}
/* pill di mode monitor: token gelap prototype (latar gelap pekat, teks terang) — ARMED hijau tua */
body.monitor .tag.armed{background:#163626;color:#7fe3a8}
body.monitor .tag.disarm{background:#3a2b12;color:#f0c27b}
body.monitor .tag.alarm{background:#3a1216;color:#ffb4b8}
body.monitor .tag.needs-config{background:#3a3410;color:#f5de7a}
body.monitor .tag{font-size:13px;padding:3px 11px}
nav button.sound{padding:5px 11px;font-size:13px}nav #sound-silence{background:var(--alarm);color:#fff}
/* B1 tahap 1 (FSD v1.80): logo di app bar & halaman login; favicon dari logo */
nav .brand{display:inline-flex;align-items:center;gap:8px}
nav .brand img{width:24px;height:24px;display:block}
.login-brand{display:flex;flex-direction:column;align-items:center;gap:4px;margin:4px 0 18px}
.login-brand img{width:72px;height:72px;display:block}
.login-brand .name{font-size:28px;font-weight:700;letter-spacing:.5px;color:var(--navy)}
.login-brand .tagline{color:var(--muted);font-size:14px}

/* S1 SIMULATION 🎮 (FSD v1.94/v1.95, prototype 8 Okt) */
:root{--sim:#5b3a9e;--sim-soft:#efe9fa;--sim-line:#cdbdeb}
.simbanner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--sim);color:#fff;padding:8px 1rem;font-size:14px}
.simbanner form{margin:0 0 0 auto}.simbanner button{background:#fff;color:var(--sim);font-weight:600;padding:4px 10px}
.lede{color:var(--muted);max-width:720px}
.simacc{border-left:4px solid var(--sim)}.simacc.inactive{border-left-color:#9e9e9e}
.sa-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.sa-head .code{font-weight:700;font-size:16px}.sa-head .lbl{color:var(--muted)}
.sa-bal{margin-left:auto;text-align:right}.sa-bal .amt{font-size:22px;font-weight:700;display:block}.sa-bal .note{display:block}
.sa-bal form{margin-top:6px}.sa-bal button{font-size:12.5px;padding:3px 10px}
.chip{font-size:11.5px;font-weight:700;padding:1px 8px;border-radius:999px}
.chip.act{background:#dff5e1;color:#1b5e20}.chip.ina{background:#e0e0e0;color:#555}.chip.run{background:var(--sim);color:#fff}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:900px){.grid3{grid-template-columns:1fr}}
.box{border:1px solid var(--line);border-radius:8px;padding:12px}.box.narrow{max-width:420px}
.box h4{margin:0 0 8px;font-size:13.5px}.box h4+form,.box form+h4{margin-top:10px}
.box input[type=number]{width:5rem}.box input[type=text]{width:10rem}
.hint{font-size:12px;color:var(--muted);margin:6px 0 0}.hint.alarm{color:var(--alarm);font-weight:600}
.simacc .log{margin-top:12px;border-top:1px dashed var(--line);padding-top:10px}.simacc .log table{font-size:12.5px}
.src{font-size:11px;font-weight:700;padding:0 6px;border-radius:4px;background:#e8ecf1;color:#555}
.src.sim_scheduler{background:var(--sim-soft);color:var(--sim)}.src.sim_adhoc{background:#fff6d6;color:#6b5300}
.tag.sim{background:var(--sim-soft);color:var(--sim);border:1px solid var(--sim-line);font-weight:700}
.acc-title{margin:.2rem 0 .6rem}
/* H1 (v1.100/v1.101): tab berupa tautan di Settings & Logs */
nav.tabs{display:flex;gap:4px;background:none;padding:0;margin:.4rem 0 1rem;border-bottom:1px solid var(--line)}
nav.tabs a{color:var(--ink);padding:6px 12px;border-radius:6px 6px 0 0;text-decoration:none}
nav.tabs a:hover,nav.tabs a:focus-visible{background:#e8ecf1}
nav.tabs a[aria-current="page"]{font-weight:700;box-shadow:inset 0 -3px 0 var(--navy)}
/* H1 #152: banner ruang disk (80 % peringatan, 90 % peringatan keras) */
.diskbanner{padding:8px 1rem;font-size:14px}.diskbanner a{color:inherit;font-weight:600}
.diskbanner.warn{background:#fff0a6;color:#5a4a00}.diskbanner.critical{background:var(--alarm);color:#fff;font-weight:600}
table.hk td.rows{text-align:right;font-variant-numeric:tabular-nums}
/* H1 #158 (v1.100 D[8]): sorotan butir menu saat kursor diarahkan / fokus keyboard (latar);
   penanda halaman aktif tetap berbeda (garis bawah + tebal). Tanpa style inline -> CSP tidak dilonggarkan. */
nav a{padding:5px 9px;border-radius:6px}
nav a:hover,nav a:focus-visible{background:rgba(255,255,255,.18);outline:none}
nav a:focus-visible{box-shadow:0 0 0 2px #8fc1ff}
nav a[aria-current="page"]{font-weight:700;box-shadow:inset 0 -3px 0 #8fc1ff}
nav a[aria-current="page"]:focus-visible{box-shadow:inset 0 -3px 0 #8fc1ff,0 0 0 2px #8fc1ff}
.licbanner{padding:8px 1rem;font-size:14px}.licbanner.invalid{background:var(--alarm);color:#fff;font-weight:600}
.licbanner.test{background:#e8e2ff;color:#3b2a8a}