:root{
  --pb-white:#ffffff;
  --pb-soft:#f8fafc;
  --pb-orange:#f97316;
  --pb-green:#22c55e;
  --pb-blue:#2563eb;
  --pb-blue2:#3b82f6;
  --pb-black:#020617;
  --pb-slate:#0f172a;
  --pb-muted:#64748b;
  --pb-border:#e5e7eb;
  --pb-shadow:0 16px 40px rgba(2,6,23,.10);
  --pb-shadow-lg:0 28px 70px rgba(2,6,23,.18);
  --pb-gradient:linear-gradient(135deg,#ffffff 0%,#fff7ed 18%,#f97316 34%,#22c55e 56%,#3b82f6 78%,#020617 100%);
  --pb-gradient-dark:linear-gradient(180deg,#020617 0%,#0f172a 36%,#1e3a8a 74%,#2563eb 100%);
  --pb-gradient-card:linear-gradient(135deg,#f97316 0%,#22c55e 45%,#3b82f6 75%,#020617 100%);
}

html,body{background:#f6f8fb;color:#0f172a;font-family:"Inter","Nunito",Arial,sans-serif;}
a{transition:.18s ease}.text-pantau{color:var(--pb-blue)!important}.text-muted-soft{color:#94a3b8!important}

/* Login */
.login-gradient{min-height:100vh;background:radial-gradient(circle at 15% 10%,rgba(249,115,22,.20),transparent 28%),radial-gradient(circle at 85% 18%,rgba(37,99,235,.22),transparent 30%),radial-gradient(circle at 50% 100%,rgba(34,197,94,.18),transparent 32%),linear-gradient(135deg,#ffffff 0%,#f8fafc 40%,#eff6ff 100%);}
.login-shell{min-height:100vh;display:flex;align-items:center;}
.brand-beta{font-size:2.6rem;font-weight:900;letter-spacing:-.04em;background:linear-gradient(45deg,#f97316,#22c55e,#2563eb,#020617);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.beta-symbol{display:inline-grid;place-items:center;width:58px;height:58px;border-radius:18px;background:var(--pb-gradient-card);color:#fff;font-size:2rem;font-weight:900;box-shadow:var(--pb-shadow)}
.glass-card{border:1px solid rgba(255,255,255,.7)!important;border-radius:28px!important;background:rgba(255,255,255,.92)!important;backdrop-filter:blur(16px);box-shadow:var(--pb-shadow-lg)!important;overflow:hidden}.login-side{border-radius:24px;background:linear-gradient(155deg,#020617,#1e3a8a 48%,#16a34a 74%,#f97316);color:#fff;min-height:470px;padding:2rem;position:relative;overflow:hidden}.login-side:after{content:"";position:absolute;right:-70px;bottom:-70px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.14)}

/* Bootstrap override */
.btn-pantau{background:linear-gradient(45deg,#f97316,#22c55e,#2563eb);border:0;color:#fff!important;box-shadow:0 8px 20px rgba(37,99,235,.20)}.btn-pantau:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(37,99,235,.25);opacity:.96}.btn-dark-soft{background:#0f172a;color:#fff;border:0}.form-control{border-radius:14px;border-color:#dbe3ef}.form-control:focus{border-color:#3b82f6;box-shadow:0 0 0 .15rem rgba(59,130,246,.15)}.badge{border-radius:999px;padding:.38rem .65rem;font-weight:700}.badge-success{background:#dcfce7;color:#166534}.badge-info{background:#dbeafe;color:#1d4ed8}.badge-warning{background:#ffedd5;color:#9a3412}.badge-danger{background:#fee2e2;color:#991b1b}.badge-dark{background:#0f172a;color:#fff}

/* SB Admin Layout */
.sidebar.bg-gradient-primary{background:var(--pb-gradient-dark)!important;box-shadow:8px 0 30px rgba(15,23,42,.13)}.sidebar .sidebar-brand{height:5.25rem}.sidebar .sidebar-brand .sidebar-brand-text{font-weight:900;letter-spacing:-.03em}.sidebar .nav-item .nav-link{border-radius:14px;margin:.1rem .65rem;width:auto}.sidebar .nav-item.active .nav-link,.sidebar .nav-item .nav-link:hover{background:rgba(255,255,255,.12)}.sidebar .sidebar-brand-icon{width:38px;height:38px;border-radius:14px;background:rgba(255,255,255,.15);display:grid;place-items:center;transform:none!important}
.topbar{background:rgba(255,255,255,.88)!important;backdrop-filter:blur(12px);border-bottom:1px solid #edf2f7;box-shadow:0 10px 30px rgba(15,23,42,.05)!important}.topbar .brand-pill{display:inline-flex;align-items:center;gap:.55rem;font-weight:900;color:#0f172a}.brand-dot{width:12px;height:12px;border-radius:999px;background:linear-gradient(45deg,#f97316,#22c55e,#3b82f6)}
.container-fluid{padding-left:1.4rem!important;padding-right:1.4rem!important}.page-title{font-weight:900;letter-spacing:-.035em;color:#0f172a}.text-gradient{background:linear-gradient(45deg,#f97316,#22c55e,#2563eb,#020617);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.subtle{color:#64748b}.section-actions .btn{border-radius:12px}

/* Cards */
.card-modern{border:1px solid rgba(226,232,240,.85)!important;border-radius:22px!important;box-shadow:var(--pb-shadow)!important;overflow:hidden}.card-modern .card-header{border-bottom:1px solid #edf2f7;background:#fff!important;padding:1rem 1.15rem}.card-modern .card-body{padding:1.15rem}.metric-card,.metric-blue,.metric-green,.metric-orange,.metric-black{border:0!important;border-radius:24px!important;box-shadow:var(--pb-shadow)!important;color:#fff;position:relative;overflow:hidden}.metric-card:after,.metric-blue:after,.metric-green:after,.metric-orange:after,.metric-black:after{content:"";position:absolute;right:-40px;top:-50px;width:140px;height:140px;border-radius:50%;background:rgba(255,255,255,.18)}.metric-card{background:var(--pb-gradient-card)}.metric-blue{background:linear-gradient(135deg,#3b82f6,#1e3a8a,#020617)}.metric-green{background:linear-gradient(135deg,#22c55e,#0f766e,#052e16)}.metric-orange{background:linear-gradient(135deg,#f97316,#c2410c,#431407)}.metric-black{background:linear-gradient(135deg,#334155,#0f172a,#020617)}.metric-label{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;opacity:.9}.metric-value{font-size:2rem;font-weight:900;line-height:1;margin:.35rem 0}.metric-icon{position:absolute;right:1rem;bottom:1rem;font-size:2rem;opacity:.30}

/* Tables */
.table{color:#0f172a}.table thead th{border-top:0;border-bottom:1px solid #e2e8f0;color:#475569;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em}.table-hover tbody tr:hover{background:#f8fafc}.table td,.table th{vertical-align:middle}.table-card{border-radius:18px;overflow:hidden;border:1px solid #e5e7eb}

/* Map & Monitoring */
#map{height:calc(100vh - 230px);min-height:540px;border-radius:22px;border:1px solid #e2e8f0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);z-index:1}.map-card .card-body{padding:.75rem}.control-stack{display:grid;gap:.7rem}.chat-box{height:210px;overflow-y:auto;background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:10px}.chat-item{border-bottom:1px solid #eef2f7;margin-bottom:8px;padding-bottom:8px}.surveyor-item,.target-item{cursor:pointer;border:1px solid #e5e7eb;border-radius:14px;padding:9px;margin-bottom:8px;background:#fff;transition:.16s ease}.surveyor-item:hover,.target-item:hover{background:#eff6ff;border-color:#bfdbfe}.small-muted{font-size:.78rem;color:#64748b}.mini-panel{max-height:230px;overflow:auto;padding-right:3px}.leaflet-control-layers{border:0!important;border-radius:14px!important;box-shadow:var(--pb-shadow)!important}.leaflet-control-zoom a{border-radius:12px!important;margin-bottom:4px!important;border:1px solid #e2e8f0!important;box-shadow:var(--pb-shadow)}

/* Upload */
.upload-box{border:2px dashed #cbd5e1;border-radius:20px;padding:1.25rem;background:linear-gradient(180deg,#fff,#f8fafc)}.upload-icon{width:54px;height:54px;border-radius:18px;background:linear-gradient(45deg,#f97316,#22c55e,#3b82f6);color:#fff;display:grid;place-items:center;font-size:1.5rem;margin-bottom:.75rem}

/* Utility */
.rounded-2xl{border-radius:22px}.shadow-soft{box-shadow:var(--pb-shadow)}.bg-soft{background:#f8fafc}.divider-soft{height:1px;background:#e5e7eb;margin:.85rem 0}.nowrap{white-space:nowrap}

@media(max-width:991.98px){.container-fluid{padding-left:1rem!important;padding-right:1rem!important}.sidebar{z-index:1040}#map{height:62vh;min-height:430px}.monitoring-grid .col-lg-8,.monitoring-grid .col-lg-4{padding-left:.5rem;padding-right:.5rem}.card-modern .card-body{padding:1rem}.login-side{min-height:260px;margin-bottom:1rem}.brand-beta{font-size:2.2rem}}
@media(max-width:576px){.container-fluid{padding-left:.75rem!important;padding-right:.75rem!important}.page-title{font-size:1.45rem}.metric-value{font-size:1.65rem}.card-modern{border-radius:18px!important}.topbar{height:4rem}.chat-box{height:150px}#map{height:58vh;min-height:390px;border-radius:18px}.btn-block-mobile{width:100%;margin-bottom:.4rem}.login-shell{align-items:flex-start;padding-top:1rem}.glass-card .card-body{padding:1.25rem!important}}