:root{--bg: #0b0f14;--panel: #121924;--panel-2: #0e141d;--sempadan: #1e2a38;--teks: #e6edf3;--redup: #8b98a5;--aksen: #37d399;--hijau: #37d399;--potensi: #f5c344;--perhatian: #f28b3c;--kritikal: #ef5f6b;--gred-bar: #4589ff;--fon: "IBM Plex Sans", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);color:var(--teks);font-family:var(--fon);font-size:15px;line-height:1.5}button{font-family:inherit;cursor:pointer}select,input{font-family:inherit;font-size:14px;color:var(--teks);background:var(--panel-2);border:1px solid var(--sempadan);border-radius:8px;padding:8px 10px}select:focus,input:focus{outline:2px solid var(--aksen);outline-offset:1px}.btn{border:1px solid var(--sempadan);background:var(--panel);color:var(--teks);border-radius:8px;padding:9px 16px;font-weight:600;font-size:14px}.btn.utama{background:var(--aksen);border-color:var(--aksen);color:#06281c}.btn.utama:hover{filter:brightness(1.1)}.btn.utama:disabled{opacity:.6;cursor:wait}.btn.ghost{background:transparent}.btn.ghost:hover{border-color:var(--redup)}.btn.kecil{padding:5px 10px;font-size:13px}.btn.penuh{width:100%}.login-latar{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:20px;background:radial-gradient(1200px 500px at 20% -10%,rgba(55,211,153,.08),transparent),radial-gradient(900px 400px at 90% 110%,rgba(239,95,107,.07),transparent),var(--bg)}.login-kad{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--sempadan);border-radius:14px;padding:32px 28px;display:grid;gap:14px}.login-jenama{font-family:var(--mono);font-weight:600;font-size:26px;letter-spacing:.18em;color:var(--aksen);text-align:center}.login-sub{text-align:center;color:var(--redup);font-size:13px;margin-top:-10px}.medan{display:grid;gap:5px;font-size:13px;color:var(--redup)}.medan input{width:100%}.mesej-ralat{color:var(--kritikal);background:#ef5f6b1a;border:1px solid rgba(239,95,107,.35);border-radius:8px;padding:9px 12px;font-size:13.5px}.halaman-ralat{margin:40px auto;max-width:560px}.topbar{display:flex;align-items:center;gap:22px;padding:12px 22px;background:var(--panel-2);border-bottom:1px solid var(--sempadan);position:sticky;top:0;z-index:20;flex-wrap:wrap}.brand{font-family:var(--mono);font-weight:600;letter-spacing:.14em;color:var(--aksen);font-size:17px;display:flex;flex-direction:column;line-height:1.15}.brand span{font-size:10.5px;letter-spacing:.08em;color:var(--redup);font-weight:400}.navbar{display:flex;gap:4px}.navbar a{color:var(--redup);text-decoration:none;font-size:14px;font-weight:600;padding:7px 12px;border-radius:8px}.navbar a:hover{color:var(--teks);background:var(--panel)}.navbar a.aktif{color:var(--teks);background:var(--panel);border:1px solid var(--sempadan)}.user-box{margin-left:auto;display:flex;align-items:center;gap:10px}.user-email{color:var(--redup);font-size:13px}.kandungan{max-width:1280px;margin:0 auto;padding:20px 22px 60px;display:grid;gap:18px}.memuat{color:var(--redup);padding:40px;text-align:center}.toolbar{display:flex;align-items:end;gap:16px;flex-wrap:wrap}.medan-inline{display:grid;gap:4px;font-size:12px;color:var(--redup)}.medan-inline select{min-width:220px}.sayap-toggle{display:flex;background:var(--panel-2);border:1px solid var(--sempadan);border-radius:9px;padding:3px;gap:3px}.sayap-toggle button{border:0;background:transparent;color:var(--redup);font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.06em;padding:7px 16px;border-radius:7px}.sayap-toggle button:hover{color:var(--teks)}.sayap-toggle button.aktif{background:var(--aksen);color:#06281c}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}.kpi{background:var(--panel);border:1px solid var(--sempadan);border-radius:11px;padding:13px 15px}.kpi-nilai{font-family:var(--mono);font-size:26px;font-weight:600;line-height:1.2}.kpi-label{color:var(--redup);font-size:12px;margin-top:2px}.kpi-status.status-hijau .kpi-nilai{color:var(--hijau)}.kpi-status.status-potensi .kpi-nilai{color:var(--potensi)}.kpi-status.status-perhatian .kpi-nilai{color:var(--perhatian)}.kpi-status.status-kritikal .kpi-nilai{color:var(--kritikal)}.panel{background:var(--panel);border:1px solid var(--sempadan);border-radius:12px;padding:18px}.panel-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}.panel-tajuk{font-size:15px;font-weight:600;margin-bottom:14px}.panel-kepala{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:6px}.panel-kepala .panel-tajuk{margin-bottom:0}.placeholder{text-align:center;padding:60px 20px;color:var(--redup)}.placeholder h2{color:var(--teks);margin-bottom:8px}.dun-senarai{display:grid;gap:13px}.dun-nama{font-size:13.5px;font-weight:600;margin-bottom:5px;display:flex;justify-content:space-between}.dun-jumlah{color:var(--redup);font-weight:400;font-size:12px}.bar-tindan{display:flex;height:26px;border-radius:6px;overflow:hidden;background:var(--panel-2)}.seg{display:grid;place-items:center;font-family:var(--mono);font-size:12px;font-weight:600;color:#06281c;min-width:22px}.status-bg-hijau{background:var(--hijau)}.status-bg-potensi{background:var(--potensi)}.status-bg-perhatian{background:var(--perhatian)}.status-bg-kritikal{background:var(--kritikal)}.gred-senarai{display:grid;gap:9px}.gred-baris{display:grid;grid-template-columns:26px 1fr 44px;align-items:center;gap:10px}.gred-label{font-family:var(--mono);font-weight:600;color:var(--redup);text-align:center}.gred-bar-latar{background:var(--panel-2);border-radius:5px;height:18px;overflow:hidden}.gred-bar{height:100%;background:var(--gred-bar);border-radius:5px;min-width:2px}.gred-baris.redup .gred-bar{background:var(--sempadan)}.gred-nilai{font-family:var(--mono);font-size:13px;text-align:right}.nota-kecil{color:var(--redup);font-size:12px;margin-top:6px}.legenda{display:flex;gap:7px;flex-wrap:wrap}.cip{border:1px solid var(--sempadan);background:var(--panel-2);color:var(--redup);border-radius:999px;padding:5px 13px;font-size:12.5px;font-weight:600}.cip b{font-family:var(--mono);margin-left:3px}.cip:hover{color:var(--teks)}.status-cip-hijau.aktif{border-color:var(--hijau);color:var(--hijau);background:#37d3991f}.status-cip-potensi.aktif{border-color:var(--potensi);color:var(--potensi);background:#f5c3441f}.status-cip-perhatian.aktif{border-color:var(--perhatian);color:var(--perhatian);background:#f28b3c1f}.status-cip-kritikal.aktif{border-color:var(--kritikal);color:var(--kritikal);background:#ef5f6b1f}.cip-reset{color:var(--teks)}.dun-tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--sempadan);margin:6px 0 14px}.dun-tabs button{background:transparent;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--redup);font-family:var(--mono);font-size:12.5px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;padding:9px 14px}.dun-tabs button:hover{color:var(--teks)}.dun-tabs button.aktif{color:var(--aksen);border-bottom-color:var(--aksen)}.board{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:9px}.sel{text-align:left;background:var(--panel-2);border:1px solid var(--sempadan);border-left-width:4px;border-radius:9px;padding:11px 12px;color:var(--teks);display:grid;gap:7px;transition:border-color .15s,transform .1s}.sel:hover{transform:translateY(-1px);border-color:var(--redup)}.status-sisi-hijau{border-left-color:var(--hijau)}.status-sisi-potensi{border-left-color:var(--potensi)}.status-sisi-perhatian{border-left-color:var(--perhatian)}.status-sisi-kritikal{border-left-color:var(--kritikal)}.status-sisi-tiada{border-left-color:var(--sempadan)}.sel-nama{font-size:13px;font-weight:600;line-height:1.3}.sel-stat{display:flex;gap:9px;color:var(--redup);font-family:var(--mono);font-size:11.5px}.sel-bawah{display:flex;gap:6px;align-items:center}.tag{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.05em;border-radius:5px;padding:2px 7px;text-transform:uppercase}.status-tag-hijau{background:#37d39926;color:var(--hijau)}.status-tag-potensi{background:#f5c34426;color:var(--potensi)}.status-tag-perhatian{background:#f28b3c26;color:var(--perhatian)}.status-tag-kritikal{background:#ef5f6b26;color:var(--kritikal)}.status-tag-tiada{background:var(--panel);color:var(--redup)}.tag-manual{background:var(--panel);color:var(--potensi);border:1px solid var(--potensi)}.tag-admin{background:#37d39926;color:var(--aksen)}.modal-latar{position:fixed;inset:0;background:#04070abf;display:grid;place-items:center;padding:18px;z-index:50}.modal-latar[hidden]{display:none}.modal-kad{background:var(--panel);border:1px solid var(--sempadan);border-radius:13px;width:100%;max-width:760px;max-height:85vh;display:flex;flex-direction:column;overflow:hidden}.modal-kepala{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;border-bottom:1px solid var(--sempadan)}.modal-kepala h3{font-size:15px}#modal-isi{overflow-y:auto;padding:15px 18px}.modal-info{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--redup);margin-bottom:13px}.modal-info b{color:var(--teks);font-weight:600}.jadual-balut{overflow-x:auto}.jadual{width:100%;border-collapse:collapse;font-size:13.5px}.jadual th{text-align:left;color:var(--redup);font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;padding:7px 10px;border-bottom:1px solid var(--sempadan)}.jadual td{padding:7px 10px;border-bottom:1px solid var(--panel-2)}.jadual tr:hover td{background:var(--panel-2)}.mono{font-family:var(--mono)}.ya{color:var(--hijau);font-weight:600}.redup{color:var(--redup)}.toast-bekas{position:fixed;bottom:18px;right:18px;display:grid;gap:8px;z-index:100}.toast{background:var(--panel);border:1px solid var(--aksen);color:var(--teks);border-radius:9px;padding:10px 16px;font-size:13.5px;font-weight:600;box-shadow:0 6px 24px #00000073;animation:toast-masuk .25s ease}.toast.ralat{border-color:var(--kritikal);color:var(--kritikal)}.toast.hilang{opacity:0;transition:opacity .3s}@keyframes toast-masuk{0%{transform:translateY(8px);opacity:0}}.tag-viewer{background:#f5c34426;color:var(--potensi);align-self:center}.tag.besar{font-size:13px;padding:5px 12px}.pratonton{display:flex;align-items:center;gap:10px}.pratonton-label{color:var(--redup);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.borang-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:13px;margin-bottom:10px}.medan.luas{grid-column:1 / -1}.medan small{color:var(--redup);font-weight:400}.jadual-edit select{padding:5px 8px;font-size:13px}.jadual-edit input[type=checkbox]{width:17px;height:17px;accent-color:var(--aksen);cursor:pointer}.jadual-edit .tengah{text-align:center}.jadual-edit .dikemaskini{color:var(--redup);font-size:11.5px;white-space:nowrap}tr.disimpan td{animation:baris-simpan 1.2s ease}@keyframes baris-simpan{0%{background:#37d39933}to{background:transparent}}.sub-tajuk{font-size:13.5px;font-weight:600;margin:16px 0 9px;color:var(--teks)}.borang-baris{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:8px 0}.borang-baris .medan{min-width:170px}.borang-grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.borang-kotak{background:var(--panel-2);border:1px solid var(--sempadan);border-radius:10px;padding:14px;display:grid;gap:10px;align-content:start}.borang-kotak .sub-tajuk{margin:0}.btn.bahaya{color:var(--kritikal)}.btn.bahaya:hover{border-color:var(--kritikal)}textarea{width:100%;font-family:var(--mono);font-size:12.5px;color:var(--teks);background:var(--panel-2);border:1px solid var(--sempadan);border-radius:8px;padding:10px;resize:vertical}textarea:focus{outline:2px solid var(--aksen);outline-offset:1px}.nota-panjang{margin-top:14px;color:var(--redup);font-size:13px}.nota-panjang summary{cursor:pointer;font-weight:600;color:var(--teks)}.nota-panjang ol{margin:10px 0 0 20px;display:grid;gap:6px}code{font-family:var(--mono);font-size:12px;background:var(--panel-2);border:1px solid var(--sempadan);border-radius:5px;padding:1px 6px}select,input,textarea{max-width:100%}.medan,.medan-inline,.borang-kotak,.borang-grid,.borang-grid-2,.jadual-edit td,.jadual-keahlian td{min-width:0}.medan select,.medan input,.medan-inline select{width:100%;min-width:0}body{overflow-x:hidden}@media(max-width:1024px){.panel-grid{grid-template-columns:1fr}.kpi-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:860px){.kandungan{padding:14px 12px 50px;gap:14px}.topbar{padding:10px 12px;gap:8px 12px}.user-email{display:none}.board{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.medan-inline select{min-width:160px}}@media(max-width:700px){.brand{font-size:15px}.navbar{order:3;width:100%}.navbar a{flex:1;text-align:center;padding:8px 4px}.user-box{margin-left:auto}.toolbar{flex-direction:column;align-items:stretch;gap:10px}.medan-inline select{width:100%;min-width:0}.sayap-toggle{width:100%}.sayap-toggle button{flex:1;padding:9px 6px}.kpi-grid{grid-template-columns:repeat(2,1fr)}.kpi{padding:10px 12px}.kpi-nilai{font-size:21px}.dun-tabs button{flex:1;padding:9px 6px;text-align:center}.modal-latar{padding:0;place-items:end center}.modal-kad{max-width:none;max-height:92dvh;border-radius:16px 16px 0 0;border-bottom:0}.jadual-edit thead{display:none}.jadual-edit,.jadual-edit tbody{display:block;width:100%}.jadual-edit tr{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;background:var(--panel-2);border:1px solid var(--sempadan);border-radius:11px;padding:12px 14px;margin-bottom:10px}.jadual-edit td{display:flex;flex-direction:column;gap:4px;border:none;padding:0}.jadual-edit td:before{content:attr(data-label);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--redup)}.jadual-edit td[data-label=Lokaliti]{grid-column:1 / -1;font-weight:600}.jadual-edit td[data-label=Dikemaskini]{grid-column:1 / -1}.jadual-edit .tengah{text-align:left}.jadual-edit tr:hover td{background:transparent}.jadual-keahlian thead{display:none}.jadual-keahlian,.jadual-keahlian tbody{display:block;width:100%}.jadual-keahlian tr{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;background:var(--panel-2);border:1px solid var(--sempadan);border-radius:11px;padding:12px 14px;margin-bottom:10px}.jadual-keahlian td{display:flex;flex-direction:column;gap:4px;border:none;padding:0}.jadual-keahlian td:before{content:attr(data-label);font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--redup)}.jadual-keahlian td[data-label=""]:before{content:none}.jadual-keahlian .sel-emel{grid-column:1 / -1;font-weight:600}.jadual-keahlian .sel-tindakan{grid-column:1 / -1}.jadual-keahlian .sel-tindakan .btn{width:100%}.jadual-keahlian tr:hover td{background:transparent}.borang-baris .medan{min-width:0;flex:1 1 100%}.panel{padding:14px}.toast-bekas{left:12px;right:12px;bottom:12px}.toast{text-align:center}}.sel-emel,.nota-panjang code{overflow-wrap:anywhere}@media(pointer:coarse){select,input:not([type=checkbox]),.btn{min-height:42px}.jadual-edit input[type=checkbox]{width:24px;height:24px}.navbar a{padding:9px 12px}.cip{padding:8px 14px}.sel{padding:13px 14px}}
