:root{color-scheme:dark}
body{font-family:Inter,ui-sans-serif,system-ui;background:radial-gradient(circle at 10% 0,#172554 0,transparent 28rem),#030712}.panel,.modal-card{background:rgba(17,24,39,.94);border:1px solid #273244;border-radius:1rem;padding:1.25rem;box-shadow:0 24px 70px rgba(0,0,0,.35)}.eyebrow{font-size:.72rem;letter-spacing:.18em;color:#60a5fa;font-weight:800}.muted{color:#94a3b8}.input{width:100%;background:#0b1220;border:1px solid #334155;border-radius:.65rem;padding:.7rem .8rem;color:#f8fafc}.input:focus{outline:2px solid #3b82f6;border-color:transparent}.btn-primary,.btn-secondary{border-radius:.65rem;padding:.65rem 1rem;font-weight:700;transition:.18s}.btn-primary{background:#2563eb;color:white}.btn-primary:hover{background:#3b82f6}.btn-secondary{background:#1e293b;color:#e2e8f0;border:1px solid #334155}.btn-secondary:hover{background:#334155}.error{color:#fecaca;background:#450a0a;border:1px solid #7f1d1d;border-radius:.6rem;padding:.7rem}.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:50;padding:1rem;overflow:auto;display:grid;place-items:center}.modal.hidden{display:none}.modal-card{width:100%;max-height:94vh;overflow:auto}.close{font-size:2rem;line-height:1;color:#94a3b8}th,td{text-align:left;padding:.75rem;border-bottom:1px solid #253044;white-space:nowrap}th{color:#94a3b8;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}.rule-box{background:#0b1220;border:1px solid #273244;border-radius:.75rem;padding:1rem}.rule-box summary{font-weight:700;cursor:pointer}.badge{display:inline-flex;border-radius:999px;padding:.2rem .55rem;font-size:.72rem;font-weight:800}.badge-active{background:#064e3b;color:#6ee7b7}.badge-disabled{background:#4c0519;color:#fda4af}.action{color:#93c5fd;margin-right:.65rem;font-weight:700}.toast{position:fixed;right:1rem;bottom:1rem;background:#172554;border:1px solid #3b82f6;padding:.8rem 1rem;border-radius:.65rem;z-index:80}.stat-card{background:#0b1220;border:1px solid #273244;border-radius:.8rem;padding:1rem}.bar{height:.45rem;background:#1e293b;border-radius:999px;overflow:hidden}.bar>i{display:block;height:100%;background:#3b82f6}
.rule-sections{display:grid;gap:1rem}.rule-section{border:1px solid #253044;border-radius:.75rem;padding:1rem;background:#080f1c}.rule-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}.rule-heading h3{font-weight:800}.rule-heading p{font-size:.82rem;color:#94a3b8;margin-top:.15rem}.rule-list{display:grid;gap:.65rem;margin-top:.8rem}.rule-list:empty:after{content:"Belum ada aturan";color:#64748b;font-size:.82rem;padding:.35rem 0}.rule-row{display:flex;align-items:end;gap:.6rem;padding:.65rem;border-radius:.65rem;background:#0b1220;border:1px solid #253044}.rule-row label{display:grid;gap:.35rem;font-size:.78rem;color:#cbd5e1}.rule-row .input{min-width:9rem}.rule-grow{flex:1}.remove-rule{color:#fda4af;font-weight:800;padding:.72rem .45rem}.proxy-row{margin-top:.8rem}@media(max-width:720px){.rule-row{align-items:stretch;flex-direction:column}.rule-row .input{min-width:0}.remove-rule{align-self:flex-end}.rule-heading{align-items:flex-start}}