/* ══ SafeDomain Premium -- Tahap 1 (Okt 2026) ══════════════════════════════
   Dimuat SESUDAH main.css di base.html. Isi: emblem perisai 3D (components/_emblem.html),
   sidebar (latar, kartu akun, menu aktif) dan kartu utama /monitoring.
   Hanya tampilan: tidak ada logika atau isi yang berubah. Status emblem membaca
   body[data-sd] yang SAMA dengan logo detak, pill, dan lonceng.
   Aturan per halaman diawali `body` supaya menang atas <style> di template anak. */

/* ── Emblem ───────────────────────────────────────────────────────────── */
.sdp-emb{
  --st:#10B981; --i-ok:inline; --i-bad:none; --i-dash:none; --i-plus:none; --i-ekg:inline; --i-flat:none; --beat:2.8s;
  position:relative; display:inline-grid; place-items:center; flex:none; vertical-align:middle;
}
body[data-sd="blokir"] .sdp-emb{ --st:#EF4444; --i-ok:none; --i-bad:inline; --beat:1.3s; }
body[data-sd="jeda"] .sdp-emb{ --st:#94A3B8; --i-ok:none; --i-dash:inline; --i-ekg:none; --i-flat:inline; }
body[data-sd="kosong"] .sdp-emb{ --st:#F59E0B; --i-ok:none; --i-plus:inline; }
/* `st` eksplisit (kartu Monitoring) menang atas status akun -- spesifisitas sama, urutan belakangan */
body .sdp-emb[data-st="aman"]{ --st:#10B981; --i-ok:inline; --i-bad:none; --i-dash:none; --i-plus:none; --i-ekg:inline; --i-flat:none; --beat:2.8s; }
body .sdp-emb[data-st="blokir"]{ --st:#EF4444; --i-ok:none; --i-bad:inline; --i-dash:none; --i-plus:none; --i-ekg:inline; --i-flat:none; --beat:1.3s; }
body .sdp-emb[data-st="sebagian"]{ --st:#FB923C; --i-ok:none; --i-bad:none; --i-dash:inline; --i-plus:none; --i-ekg:inline; --i-flat:none; --beat:2s; }
body .sdp-emb[data-st="kosong"]{ --st:#F59E0B; --i-ok:none; --i-bad:none; --i-dash:none; --i-plus:inline; --i-ekg:none; --i-flat:inline; --beat:2.8s; }

.sdp-emb .sdp-fl{ width:100%; height:100%; position:relative; display:block; }
.sdp-emb svg{ display:block; width:100%; height:100%; overflow:visible; }
.sdp-emb .sdp-halo{
  position:absolute; inset:-10%; border-radius:50%; pointer-events:none;
  background:radial-gradient(closest-side, color-mix(in srgb, var(--st) 38%, transparent), transparent 72%);
  filter:blur(5px); opacity:.85; animation:sdpBreathe 3.2s ease-in-out infinite;
}
.sdp-emb.sdp-big .sdp-halo{ inset:-18%; filter:blur(7px); }
.sdp-emb.sdp-big .sdp-fl{ animation:sdpFloat 5s ease-in-out infinite; }
.sdp-emb .sdp-pulse{ stroke:var(--st); filter:drop-shadow(0 0 3px var(--st)) drop-shadow(0 0 7px color-mix(in srgb, var(--st) 55%, transparent)); }
.sdp-emb .sdp-ekg{ display:var(--i-ekg); animation:sdpBeat var(--beat) ease-in-out infinite; }
.sdp-emb .sdp-flat{ display:var(--i-flat); }
.sdp-emb .sdp-bring, .sdp-emb .sdp-ic{ stroke:var(--st); }
.sdp-emb .sdp-dot{ fill:var(--st); stroke:none; }
.sdp-emb .sdp-i-ok{ display:var(--i-ok); } .sdp-emb .sdp-i-bad{ display:var(--i-bad); }
.sdp-emb .sdp-i-dash{ display:var(--i-dash); } .sdp-emb .sdp-i-plus{ display:var(--i-plus); }
@keyframes sdpBreathe{ 0%,100%{ opacity:.5; transform:scale(.96) } 50%{ opacity:.95; transform:scale(1.04) } }
@keyframes sdpFloat{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-4px) } }
@keyframes sdpBeat{ 0%,100%{ opacity:.65 } 45%{ opacity:1 } }

/* ── Sidebar ──────────────────────────────────────────────────────────── */
/* Logo: emblem 3D menggantikan tampilan .sd-mark (markup & logikanya tetap ada). */
.sd-brand .sd-mark{ display:none; }
.sd-brand .sdp-logo{ margin-right:2px; }
.sidebar.glass-card{
  background:linear-gradient(180deg, #111a2d 0%, #0c1324 46%, #0a0f1c 100%) !important;
  border-color:rgba(255,255,255,.06) !important;
  border-right-color:rgba(245,158,11,.10) !important;
  box-shadow:6px 0 34px rgba(0,0,0,.38), inset -1px 0 0 rgba(245,158,11,.05) !important;
}
.sidebar .logo-text{ font-family:'Syne', var(--sans) !important; font-weight:800 !important; font-size:16px !important; letter-spacing:-.015em; }
.sidebar .user-card{ box-shadow:0 12px 30px -16px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.07); }
.sidebar .user-card:hover{ box-shadow:0 14px 34px -14px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.09); }
.sidebar .sb-stats-card{ background:rgba(2,6,23,.55); border-color:rgba(255,255,255,.07); box-shadow:inset 0 1px 2px rgba(0,0,0,.4); }
.sidebar .nav-label{ color:#5B6B85; letter-spacing:.14em; }
.sidebar .nav-item:hover{ transform:none; }
.sidebar .nav-item.active{
  background:linear-gradient(90deg, rgba(245,158,11,.22), rgba(245,158,11,.05));
  border-color:rgba(245,158,11,.38);
  box-shadow:0 0 22px -6px rgba(245,158,11,.5), inset 0 1px 0 rgba(255,255,255,.06);
  color:#FCD34D;
}
.sidebar .nav-item.active .nav-icon{ color:#FBBF24; filter:drop-shadow(0 0 6px rgba(245,158,11,.55)); }

/* ── Latar area utama: kedalaman, bukan hitam rata ───────────────────────── */
body .main{
  background:
    radial-gradient(900px 420px at 12% -6%, rgba(245,158,11,.07), transparent 60%),
    radial-gradient(700px 400px at 78% 8%, rgba(16,185,129,.05), transparent 65%),
    linear-gradient(180deg, rgba(15,23,42,.55), rgba(11,17,32,.7));
}

/* ── /monitoring: kartu & kartu utama ──────────────────────────────────── */
body .pp-card{
  background:linear-gradient(165deg, #111a2d, #0c1322 70%);
  border-color:#1b2640;
  box-shadow:0 16px 36px -24px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.04);
}
body .mv-hero{
  border:1px solid transparent;
  background:
    radial-gradient(520px 260px at 80px 60px, var(--mv-glow), transparent 70%) padding-box,
    linear-gradient(150deg, #131e34, #0b1220 70%) padding-box,
    linear-gradient(135deg, color-mix(in srgb, var(--mv-st) 60%, transparent), rgba(255,255,255,.06) 40%, rgba(245,158,11,.32)) border-box;
  box-shadow:0 26px 60px -32px color-mix(in srgb, var(--mv-st) 70%, transparent), inset 0 1px 0 rgba(255,255,255,.04);
}
body .mv-hero h1{ font-weight:800; letter-spacing:-.015em; }
body .mv-emblem.sdp-host{ width:auto; height:auto; background:none; box-shadow:none; border-radius:0; }
body .mv-kpi{ background:rgba(0,0,0,.16); }
body #ppRingArc{ stroke:url(#sdp-ring); filter:drop-shadow(0 0 5px rgba(245,158,11,.5)); }
@media (max-width:760px){
  body .mv-emblem.sdp-host .sdp-emb{ width:62px !important; height:78px !important; }
}

@media (prefers-reduced-motion:reduce){
  .sdp-emb .sdp-halo, .sdp-emb.sdp-big .sdp-fl, .sdp-emb .sdp-ekg{ animation:none; }
}

/* ══ Premium Tahap 3 (G178): Overview, kondisi kosong, tombol utama ═══════════════ */
body .ov-card{
  background:linear-gradient(165deg, #111a2d, #0c1322 70%);
  border-color:#1b2640;
  box-shadow:0 16px 36px -24px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.04);
}
body .ov-hero{
  border:1px solid transparent;
  background:
    radial-gradient(520px 260px at 80px 60px, var(--ov-glow), transparent 70%) padding-box,
    linear-gradient(150deg, #131e34, #0b1220 70%) padding-box,
    linear-gradient(135deg, color-mix(in srgb, var(--ov-st) 60%, transparent), rgba(255,255,255,.06) 40%, rgba(245,158,11,.32)) border-box;
  box-shadow:0 26px 60px -32px color-mix(in srgb, var(--ov-st) 70%, transparent), inset 0 1px 0 rgba(255,255,255,.04);
}
body .ov-hero h1{ font-weight:800; letter-spacing:-.015em; }
body .ov-emblem.sdp-host{ width:auto; height:auto; background:none; border-radius:0; }
body .ov-emblem.sdp-host::before, body .ov-emblem.sdp-host::after{ display:none; }
body .ov-status-ic.sdp-host{ width:auto; height:auto; background:none; border-radius:0; }
body .ov .ov-btn-pri, body .dm-btn-primary{
  background:linear-gradient(180deg, #FCD34D, #F59E0B 55%, #D97706);
  box-shadow:0 10px 22px -12px rgba(245,158,11,.8), inset 0 1px 0 rgba(255,255,255,.45);
}
body .ov .ov-btn-pri:hover{ background:linear-gradient(180deg, #FDE68A, #FBBF24 55%, #F59E0B); }
/* Halaman Domain: "Belum ada domain" dirender JS -> emblem lewat CSS saja (skrip tidak disentuh). */
body .dr-empty:has(b)::before{
  content:""; display:block; width:64px; height:80px; margin:0 auto 14px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 150'%3E%3Cdefs%3E%3ClinearGradient id='r' x1='0' y1='0' x2='1' y2='1'%3E%3Cstop offset='0' stop-color='%23FDE68A'/%3E%3Cstop offset='.35' stop-color='%23F59E0B'/%3E%3Cstop offset='.7' stop-color='%23B45309'/%3E%3Cstop offset='1' stop-color='%23FCD34D'/%3E%3C/linearGradient%3E%3ClinearGradient id='s' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%2392400E'/%3E%3Cstop offset='1' stop-color='%23451a03'/%3E%3C/linearGradient%3E%3CradialGradient id='f' cx='.38' cy='.28' r='.9'%3E%3Cstop offset='0' stop-color='%2322304a'/%3E%3Cstop offset='.55' stop-color='%23111a2c'/%3E%3Cstop offset='1' stop-color='%23070b14'/%3E%3C/radialGradient%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='.38'/%3E%3Cstop offset='1' stop-color='%23fff' stop-opacity='0'/%3E%3C/linearGradient%3E%3CclipPath id='c'%3E%3Cpath d='M60 17 L98 29.5 V63 C98 91 80.5 111.5 60 121.5 C39.5 111.5 22 91 22 63 V29.5 Z'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M60 13 L108 29 V69 C108 103 86 127 60 139 C34 127 12 103 12 69 V29 Z' fill='url(%23s)'/%3E%3Cpath d='M60 6 L108 22 V63 C108 97 86 121 60 133 C34 121 12 97 12 63 V22 Z' fill='url(%23r)'/%3E%3Cpath d='M60 17 L98 29.5 V63 C98 91 80.5 111.5 60 121.5 C39.5 111.5 22 91 22 63 V29.5 Z' fill='url(%23f)'/%3E%3Cg clip-path='url(%23c)'%3E%3Cellipse cx='44' cy='30' rx='44' ry='26' fill='url(%23g)' transform='rotate(-18 44 30)'/%3E%3C/g%3E%3Cpath d='M30 70 H90' stroke='%23F59E0B' stroke-width='5' stroke-linecap='round'/%3E%3Cg transform='translate(97 113)'%3E%3Ccircle r='15' fill='%230b1220' stroke='%23F59E0B' stroke-width='2.5'/%3E%3Cpath d='M-7 0 H7 M0 -7 V7' stroke='%23F59E0B' stroke-width='3.2' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
  filter:drop-shadow(0 10px 18px rgba(245,158,11,.25));
}
@media (max-width:760px){
  body .ov-emblem.sdp-host .sdp-emb{ width:62px !important; height:78px !important; }
}

/* ══ Premium Tahap 4 (G179): kartu akun sidebar gaya kartu member ═══════════════ */
.sidebar .user-card.sdp-acct{
  display:grid; gap:11px; position:relative; overflow:hidden; text-decoration:none; margin-bottom:8px;
  padding:13px 13px 11px; border-radius:16px;
  background:
    radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--pc) 16%, transparent), transparent 55%),
    linear-gradient(160deg, #1a2338 0%, #0f1728 55%, #0b1120 100%);
  border:1px solid color-mix(in srgb, var(--pc) 28%, rgba(255,255,255,.06));
  box-shadow:0 18px 36px -20px rgba(0,0,0,.95), 0 0 0 1px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.08);
}
.sidebar .user-card.sdp-acct:hover{ border-color:color-mix(in srgb, var(--pc) 45%, rgba(255,255,255,.08)); }
.sdp-acct::before{ content:""; position:absolute; inset:-40% -60%; pointer-events:none;
  background:linear-gradient(115deg, transparent 42%, rgba(255,255,255,.08) 50%, transparent 58%); animation:sdpSheen 7s ease-in-out infinite; }
@keyframes sdpSheen{ 0%,60%{ transform:translateX(-30%) } 100%{ transform:translateX(30%) } }
.sdp-acct-wm{ position:absolute; right:-16px; bottom:-20px; width:96px; height:116px; opacity:.07; pointer-events:none;
  fill:none; stroke:#fff; stroke-width:6; stroke-linecap:round; stroke-linejoin:round; }
.sdp-acct-top{ display:flex; align-items:center; gap:11px; position:relative; min-width:0; }
.sdp-acct-ring{ display:inline-flex; flex:none; padding:2px; border-radius:50%;
  background:conic-gradient(from 210deg, var(--pc2), var(--pc), color-mix(in srgb, var(--pc) 30%, #000), var(--pc2));
  box-shadow:0 0 16px -4px var(--pc); }
.sdp-acct-ring > div{ background:radial-gradient(circle at 35% 30%, #22304a, #0b1220) !important; border:0 !important; }
.sdp-acct-who{ min-width:0; display:grid; gap:4px; }
.sdp-acct-who strong{ font-family:'Syne', var(--sans); font-weight:700; font-size:14.5px; color:#F1F5F9; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sdp-acct-badge{ justify-self:start; font-size:9.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; padding:2px 9px; border-radius:999px;
  color:#1a1206; background:linear-gradient(180deg, var(--pc2), var(--pc)); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 4px 10px -4px var(--pc); }
.sdp-acct-health{ display:grid; gap:5px; position:relative; }
.sdp-acct-ht{ display:flex; justify-content:space-between; gap:8px; font-size:11px; color:#94A3B8; }
.sdp-acct-ht b{ color:#E2E8F0; font-weight:600; white-space:nowrap; } .sdp-acct-ht b.bad{ color:#F87171; }
.sdp-acct-bar{ height:6px; border-radius:9px; background:rgba(255,255,255,.07); display:flex; gap:2px; overflow:hidden; }
.sdp-acct-bar i{ display:block; height:100%; min-width:0; }
.sdp-acct-bar .a{ background:linear-gradient(90deg, #0f766e, #10B981); box-shadow:0 0 8px rgba(16,185,129,.6); }
.sdp-acct-bar .b{ background:linear-gradient(90deg, #b91c1c, #EF4444); box-shadow:0 0 8px rgba(239,68,68,.6); }
.sdp-acct-bar .r{ background:rgba(148,163,184,.35); }
.sidebar .sdp-acct .sb-stats-card{ grid-template-columns:repeat(3, 1fr); gap:6px; background:none; border:0; box-shadow:none; overflow:visible; position:relative; border-radius:0; }
.sidebar .sdp-acct .sb-stats-card > div, .sidebar .sdp-acct .sb-stats-card > div:first-child{
  border:1px solid rgba(255,255,255,.06); border-radius:10px; padding:7px 4px 6px; background:rgba(2,6,23,.5); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }
.sidebar .sdp-acct .sb-stat-num{ font-family:var(--mono); font-variant-numeric:tabular-nums; font-size:17px; }
.sidebar .sdp-acct .sb-stat-lbl{ font-size:9px; letter-spacing:.12em; }
.sdp-acct-foot{ display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:11px; color:#94A3B8; position:relative; }
.sdp-acct-foot .warn{ color:#FBBF24; } .sdp-acct-foot .bad{ color:#F87171; }
.sdp-acct-link{ color:var(--pc2); font-weight:600; white-space:nowrap; }
@media (prefers-reduced-motion:reduce){ .sdp-acct::before{ animation:none; } }

/* ══ Premium Tahap 5 (G180): Monitoring "ruang kontrol" ═════════════════════════ */
body .mv-hero.sdp-ctrl{ padding:24px; position:relative; }
body .mv-hero.sdp-ctrl::after{ content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:28px 28px; -webkit-mask-image:linear-gradient(90deg, transparent, #000 45%); mask-image:linear-gradient(90deg, transparent, #000 45%); }
.sdp-ctrl-grid{ display:grid; grid-template-columns:250px minmax(0, 1fr); gap:28px; align-items:center; position:relative; z-index:1; }
.sdp-radar{ position:relative; width:220px; height:220px; margin:10px auto 46px; }
.sdp-radar.is-idle{ margin-bottom:10px; }
.sdp-rg{ position:absolute; inset:0; border-radius:50%; border:1px solid color-mix(in srgb, var(--mv-st) 22%, transparent); }
.sdp-rg.r2{ inset:28px; border-color:color-mix(in srgb, var(--mv-st) 16%, transparent); }
.sdp-rg.r3{ inset:56px; border-color:color-mix(in srgb, var(--mv-st) 11%, transparent); }
.sdp-cross{ position:absolute; inset:0; border-radius:50%;
  background:linear-gradient(color-mix(in srgb, var(--mv-st) 12%, transparent), color-mix(in srgb, var(--mv-st) 12%, transparent)) center/1px 100% no-repeat,
             linear-gradient(90deg, color-mix(in srgb, var(--mv-st) 12%, transparent), color-mix(in srgb, var(--mv-st) 12%, transparent)) center/100% 1px no-repeat; }
.sdp-sweep{ position:absolute; inset:4px; border-radius:50%; animation:sdpSweep 4s linear infinite;
  background:conic-gradient(from 0deg, transparent 0deg, transparent 290deg, color-mix(in srgb, var(--mv-st) 35%, transparent) 355deg, color-mix(in srgb, var(--mv-st) 60%, transparent) 360deg); }
@keyframes sdpSweep{ to{ transform:rotate(360deg) } }
.sdp-blip{ position:absolute; width:7px; height:7px; border-radius:50%; background:var(--mv-st); box-shadow:0 0 10px var(--mv-st); animation:sdpBlip 4s linear infinite; }
@keyframes sdpBlip{ 0%,100%{ opacity:.25 } 10%{ opacity:1 } 40%{ opacity:.35 } }
body .sdp-radar .pp-ring.sdp-arc{ position:absolute; inset:-10px; width:auto; height:auto; display:block; }
body .sdp-radar .pp-ring.sdp-arc svg{ width:100% !important; height:100% !important; }
body .sdp-radar .sdp-cd{ position:absolute; inset:auto; left:50%; bottom:-44px; transform:translateX(-50%); text-align:center; white-space:nowrap; display:block; }
body .sdp-radar .sdp-cd .pp-ring-val{ font:500 20px/1.1 var(--mono, 'DM Mono', monospace); color:#F8FAFC; }
.sdp-radar-c{ position:absolute; inset:0; display:grid !important; place-items:center; }
.sdp-ctrl-txt{ display:grid; gap:8px; min-width:0; }
.sdp-live{ display:inline-flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.16em; font-weight:700; color:#34D399; }
.sdp-live > i{ width:8px; height:8px; border-radius:50%; background:#10B981; animation:sdpPing 1.8s ease-out infinite; }
@keyframes sdpPing{ 0%{ box-shadow:0 0 0 0 rgba(16,185,129,.6) } 100%{ box-shadow:0 0 0 10px rgba(16,185,129,0) } }
.sdp-live-off{ display:none; }
body[data-sd="jeda"] .sdp-live{ color:#94A3B8; } body[data-sd="jeda"] .sdp-live > i{ background:#64748B; animation:none; }
body[data-sd="jeda"] .sdp-live-on{ display:none; } body[data-sd="jeda"] .sdp-live-off{ display:inline; }
body[data-sd="jeda"] .sdp-sweep, body[data-sd="jeda"] .sdp-blip{ display:none; }
.sdp-ctrl-txt h1{ margin-top:0 !important; }
.sdp-sensors{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; margin-top:8px; }
.sdp-sensor{ border-radius:12px; padding:11px 13px; background:rgba(2,6,23,.45); border:1px solid rgba(255,255,255,.07);
  display:grid; gap:3px; min-width:0; box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }
.sdp-sensor .k{ display:flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#7C8BA3; }
.sdp-sensor .k i{ width:7px; height:7px; border-radius:50%; flex:none; background:#10B981; box-shadow:0 0 8px #10B981; }
.sdp-sensor.bad .k i{ background:#EF4444; box-shadow:0 0 8px #EF4444; }
.sdp-sensor.warn .k i, .sdp-sensor.amb .k i{ background:#F59E0B; box-shadow:0 0 8px #F59E0B; }
.sdp-sensor.none .k i{ background:#64748B; box-shadow:none; }
.sdp-sensor b{ color:#F1F5F9; font-size:14.5px; font-weight:600; }
.sdp-sensor.bad b{ color:#FCA5A5; }
.sdp-sensor > span:last-child{ font-size:12px; color:#94A3B8; overflow-wrap:anywhere; }
@media (max-width:900px){
  .sdp-ctrl-grid{ grid-template-columns:1fr; gap:14px; }
}
@media (max-width:560px){
  .sdp-radar{ width:180px; height:180px; }
  .sdp-radar-c .sdp-emb{ width:76px !important; height:95px !important; }
  .sdp-sensors{ grid-template-columns:1fr; }
  body .mv-hero.sdp-ctrl{ padding:18px 16px; }
}
@media (prefers-reduced-motion:reduce){ .sdp-sweep, .sdp-blip, .sdp-live > i{ animation:none; } }

/* ══ Premium Tahap 6 (G181): halaman Domain ══════════════════════════════════════ */
body .dp-card{
  background:linear-gradient(165deg, #111a2d, #0c1322 70%); border-color:#1b2640; border-radius:16px;
  box-shadow:0 16px 36px -24px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.04);
}
body .dp-card:has(.dp-add){
  background:radial-gradient(600px 200px at 0% 0%, rgba(245,158,11,.10), transparent 60%), linear-gradient(160deg, rgba(30,41,59,.75), rgba(15,23,42,.9));
  border-color:rgba(255,255,255,.10); box-shadow:0 18px 38px -24px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.07);
}
body .dp-add input{ background:rgba(2,6,23,.6); box-shadow:0 0 0 4px rgba(245,158,11,.06), inset 0 1px 2px rgba(0,0,0,.5); border-radius:12px; height:46px; }
body .dp-add input:focus{ box-shadow:0 0 0 4px rgba(245,158,11,.16), inset 0 1px 2px rgba(0,0,0,.5); }
body .dp-btn{ height:46px; border-radius:12px; background:linear-gradient(180deg, #FCD34D, #F59E0B 55%, #D97706);
  box-shadow:0 10px 22px -10px rgba(245,158,11,.8), inset 0 1px 0 rgba(255,255,255,.45); }
body .dp-btn:hover{ background:linear-gradient(180deg, #FDE68A, #FBBF24 55%, #F59E0B); }
body .dp-hint .ok{ text-shadow:0 0 8px rgba(52,211,153,.8); }
body .dp-chip{ background:rgba(255,255,255,.03); border-color:rgba(255,255,255,.08); }
body .dp-chip b{ font-family:var(--mono, 'DM Mono', monospace); font-size:11px; padding:1px 7px; border-radius:999px; background:rgba(255,255,255,.07); }
body .dp-chip[aria-pressed="true"]{ color:#FCD34D; background:linear-gradient(180deg, rgba(245,158,11,.18), rgba(245,158,11,.06));
  border-color:rgba(245,158,11,.45); box-shadow:0 0 18px -6px rgba(245,158,11,.6); }
body .dp-chip[aria-pressed="true"] b{ background:rgba(245,158,11,.25); color:#FDE68A; }
body .dp-search, body .dp-ibtn{ background:rgba(2,6,23,.5); border-color:rgba(255,255,255,.1); }
body .dr-list{ display:grid; gap:6px; }
body .dr-th{ border-bottom:0; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; padding:8px 12px 2px; }
body .dr-row{ border:1px solid rgba(255,255,255,.05); border-left:3px solid #10B981; border-radius:10px; padding:11px 12px;
  background:rgba(255,255,255,.025); transition:background .2s, border-color .2s; }
body .dr-row:hover{ background:rgba(255,255,255,.05); }
body .dr-row.bad, body .dr-row:has(.dr-st.blokir){ border-left-color:#EF4444; background:rgba(239,68,68,.06); }
body .dr-row:has(.dr-st.error){ border-left-color:#F59E0B; }
body .dr-row:has(.dr-st.checking), body .dr-row:has(.dr-st.unknown){ border-left-color:#64748B; }
body .dr-row.open{ border-radius:10px 10px 0 0; border-bottom-color:transparent; background:rgba(255,255,255,.045); }
body .dr-detail{ margin-top:-6px; border:1px solid rgba(255,255,255,.05); border-top:0; border-left:3px solid transparent; border-radius:0 0 10px 10px;
  background:linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.015)); }
body .dr-st{ border:1px solid transparent; }
body .dr-st.aman{ border-color:rgba(52,211,153,.28); box-shadow:0 0 14px -5px rgba(52,211,153,.7); }
body .dr-st.blokir{ border-color:rgba(248,113,113,.4); box-shadow:0 0 14px -5px rgba(248,113,113,.8); }
body .dr-st.error{ border-color:rgba(245,158,11,.35); }
body .dr-c-dom{ display:grid; grid-template-columns:28px minmax(0, 1fr); column-gap:10px; align-items:center; }
body .dr-c-dom > .dr-dom, body .dr-c-dom > .dr-sub{ grid-column:2; }
.sdp-fav{ grid-column:1; grid-row:1 / 3; width:28px; height:28px; border-radius:8px; display:grid; place-items:center;
  font:700 12px var(--mono, 'DM Mono', monospace); color:#FDE68A;
  background:radial-gradient(circle at 30% 25%, rgba(252,211,77,.25), rgba(245,158,11,.06)); border:1px solid rgba(245,158,11,.25); }
body .dr-row.bad .sdp-fav, body .dr-row:has(.dr-st.blokir) .sdp-fav{ color:#FECACA; border-color:rgba(239,68,68,.35);
  background:radial-gradient(circle at 30% 25%, rgba(248,113,113,.25), rgba(239,68,68,.06)); }
.sdp-mb{ display:block; width:68px; max-width:100%; height:4px; margin:5px 0 0 auto; border-radius:9px; background:rgba(255,255,255,.07); overflow:hidden; }
.sdp-mb b{ display:block; height:100%; border-radius:9px; background:linear-gradient(90deg, #0f766e, #10B981); }
.sdp-mb.warn b{ background:linear-gradient(90deg, #B45309, #F59E0B); }
.sdp-mb.bad b{ background:linear-gradient(90deg, #b91c1c, #EF4444); }
.sdp-mb.na{ display:none; }
@media (max-width:640px){
  body .dr-row{ padding:11px 8px; }
  body .dr-detail{ margin-top:-6px; }
}

/* ══ Premium Tahap 7 (G182): Bulk Check ══════════════════════════════════════════ */
body .bulk-card{ background:linear-gradient(165deg, #111a2d, #0c1322 70%); border-color:#1b2640; border-radius:16px;
  box-shadow:0 16px 36px -24px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.04); }
body .bulk-hdr{ align-items:center; }
body .bulk-title{ font-family:'Syne', var(--sans); font-weight:800; font-size:19px; letter-spacing:-.01em; color:#F8FAFC; }
body .bulk-sub{ font-size:12.5px; }
body .sdp-pb{ font-size:10px; font-weight:800; letter-spacing:.14em; padding:4px 12px; border:0; color:#1a1206;
  background:linear-gradient(180deg, #FCD34D, #F59E0B); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 6px 16px -8px #F59E0B; }
body .sdp-pb-agency{ color:#06281c; background:linear-gradient(180deg, #6EE7B7, #10B981); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 6px 16px -8px #10B981; }
body .sdp-pb-starter{ color:#06223a; background:linear-gradient(180deg, #BAE6FD, #63B3ED); box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 6px 16px -8px #63B3ED; }
body .sdp-pb-free{ color:#0f172a; background:linear-gradient(180deg, #E2E8F0, #94A3B8); box-shadow:inset 0 1px 0 rgba(255,255,255,.5); }
body .sdp-ed{ border-radius:14px; overflow:hidden; border:1px solid rgba(245,158,11,.32); background:#060a14;
  box-shadow:0 0 0 4px rgba(245,158,11,.05), 0 20px 40px -26px rgba(0,0,0,.95); }
body .sdp-ed:focus-within{ border-color:rgba(245,158,11,.6); box-shadow:0 0 0 4px rgba(245,158,11,.12), 0 20px 40px -26px rgba(0,0,0,.95); }
.sdp-ed-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:8px 14px; font-size:12px; color:#94A3B8;
  background:linear-gradient(180deg, #121a2b, #0d1424); border-bottom:1px solid rgba(255,255,255,.07); }
.sdp-ed-bar > b{ font-family:var(--mono); font-weight:500; color:#E2E8F0; }
.sdp-ed-pills{ display:flex; gap:6px; flex-wrap:wrap; }
.sdp-ed-pills span{ font-size:11.5px; padding:1px 9px; border-radius:999px; border:1px solid rgba(255,255,255,.1); }
.sdp-ed-pills .ok{ color:#6EE7B7; border-color:rgba(16,185,129,.35); }
.sdp-ed-pills .warn{ color:#FCD34D; border-color:rgba(245,158,11,.35); }
.sdp-ed-pills .bad{ color:#FCA5A5; border-color:rgba(239,68,68,.4); }
body .sdp-ed .line-count{ position:static; margin-left:auto; font-family:var(--mono); color:#94A3B8; }
.sdp-ed-body{ display:grid; grid-template-columns:44px minmax(0, 1fr); }
.sdp-gut{ padding:12px 10px 12px 0; text-align:right; font:12px/1.7 var(--mono); color:rgba(255,255,255,.25); white-space:pre; overflow:hidden;
  background:rgba(255,255,255,.02); border-right:1px solid rgba(255,255,255,.06); user-select:none; max-height:100%; }
/* main.css punya aturan textarea global ber-!important -> ditimpa KHUSUS di dalam editor */
body .sdp-ed textarea, body .sdp-ed textarea:focus{ border:0 !important; border-radius:0 !important; background:transparent !important;
  box-shadow:none !important; outline:none !important; min-height:190px; padding:12px 14px; color:#E2E8F0; }
body .btn-cek{ background:linear-gradient(180deg, #FCD34D, #F59E0B 55%, #D97706); color:#1a1206; border-radius:12px; padding:11px 24px;
  box-shadow:0 10px 22px -10px rgba(245,158,11,.8), inset 0 1px 0 rgba(255,255,255,.45); }
body .prog-fill{ background:linear-gradient(90deg, #B45309, #FCD34D); box-shadow:0 0 10px rgba(245,158,11,.7); }
body .result-hdr{ padding:14px 20px; }
.sdp-rsum{ display:flex; gap:2px; height:8px; margin:12px 20px 4px; border-radius:9px; overflow:hidden; background:rgba(255,255,255,.06); }
.sdp-rsum i{ display:block; min-width:0; }
.sdp-rsum .a, .sdp-leg .a{ background:linear-gradient(90deg, #0f766e, #10B981); }
.sdp-rsum .b, .sdp-leg .b{ background:linear-gradient(90deg, #b91c1c, #EF4444); }
.sdp-rsum .e, .sdp-leg .e{ background:linear-gradient(90deg, #92400E, #F59E0B); }
body .d-row{ margin:6px 12px; padding:12px 14px; border:1px solid rgba(255,255,255,.05); border-left:3px solid #10B981; border-radius:10px; background:rgba(255,255,255,.025); }
body .d-row:last-child{ border-bottom:1px solid rgba(255,255,255,.05); }
body .d-row.row-blokir{ border-left-color:#EF4444; background:rgba(239,68,68,.06); }
body .d-row:has(.dot-error){ border-left-color:#F59E0B; }
body .d-name{ font-size:13px; color:#F1F5F9; }
body .dot{ box-shadow:0 0 8px currentColor; } body .dot-aman{ color:#10b981; } body .dot-blokir{ color:#ef4444; } body .dot-error{ color:#f59e0b; }
body .badge-aman{ box-shadow:0 0 14px -5px rgba(16,185,129,.8); } body .badge-blokir{ box-shadow:0 0 14px -5px rgba(239,68,68,.9); }
body .btn-isp, body .btn-monitor, body .btn-sm{ background:rgba(245,158,11,.08); border-color:rgba(245,158,11,.28); color:#FCD34D; }
body .btn-isp:hover, body .btn-monitor:hover, body .btn-sm:hover{ background:rgba(245,158,11,.16); }
body .stat-box{ background:linear-gradient(165deg, #111a2d, #0c1322 70%); border-color:#1b2640; border-radius:14px;
  box-shadow:0 14px 30px -22px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.04); }
body .stat-num{ font-family:var(--mono); font-weight:500; }
.sdp-empty{ display:grid; justify-items:center; gap:10px; }
.sdp-mradar{ width:116px; height:116px; border-radius:50%; position:relative; display:grid; place-items:center; margin-bottom:4px;
  border:1px solid rgba(245,158,11,.18); background:radial-gradient(circle, rgba(245,158,11,.08), transparent 70%); }
.sdp-mradar::before{ content:""; position:absolute; inset:18px; border-radius:50%; border:1px dashed rgba(245,158,11,.18); }
.sdp-empty b{ color:#F1F5F9; font-size:15px; }
.sdp-empty p{ margin:0; max-width:52ch; color:#94A3B8; font-size:13px; }
.sdp-leg{ display:flex; gap:14px; flex-wrap:wrap; justify-content:center; font-size:12px; color:#94A3B8; margin-top:2px; }
.sdp-leg span{ display:inline-flex; align-items:center; gap:6px; }
.sdp-leg i{ width:9px; height:9px; border-radius:50%; display:inline-block; }
body .sdp-guide{ background:linear-gradient(165deg, #111a2d, #0c1322 70%) !important; border-color:#1b2640 !important; border-radius:14px !important; }
body .sdp-guide [style*="#00d4ff"]{ color:#FCD34D !important; }
body .sdp-guide [style*="0,212,255"]{ border-color:rgba(245,158,11,.18) !important; background:rgba(245,158,11,.05) !important; }
body .sdp-guide svg[stroke="#00d4ff"]{ stroke:#F59E0B; }
@media (max-width:640px){ body .d-row{ margin:6px 8px; } .sdp-ed-body{ grid-template-columns:36px minmax(0, 1fr); } }