/* =========================================================
   TRADER MAGER — UNIFIED BRAND THEME v3.4.6
   Satu bahasa visual untuk seluruh situs: putih, biru kabut,
   navy, border lembut, radius modern, dan bayangan halus.
   File ini sengaja dimuat SETELAH style.css agar tidak mengubah
   struktur/layout komponen inti.
   ========================================================= */

:root{
  --ink:#0b3a6b;
  --ink-2:#29445f;
  --kuning:#dceeff;
  --kuning-tua:#0f6bc4;
  --kuning-lembut:#eef6fd;
  --biru:#0f6bc4;
  --biru-tua:#0b5fb8;
  --biru-gelap:#0b3a6b;
  --biru-lembut:#eaf3fc;
  --biru-tipis:#f7fbff;
  --navy:#0b3a6b;
  --biru-terang:#0f6bc4;
  --biru-terang-tua:#0b5fb8;
  --biru-kabut:#eaf3fc;
  --awan:#f4f8fc;
  --kertas:#f4f8fc;
  --garis:#dce6f0;
  --garis-tebal:#bfd3e7;
  --garis-lembut:#dce6f0;
  --tubuh:#40566c;
  --tubuh-lembut:#5b6b7d;
  --redup:#74879a;
  --bayang:0 12px 30px -24px rgba(11,58,107,.42);
  --bayang-kuat:0 24px 48px -28px rgba(11,58,107,.45);
  --bayang-keras:0 18px 38px -28px rgba(11,58,107,.55);
}

body{background:#fff;color:var(--tubuh)}
h1,h2,h3,h4,strong{color:var(--navy)}
a{color:var(--biru-terang-tua)}
.section-lembut{background:#f4f8fc}

/* ----- Permukaan umum ----- */
.kartu,
.tabel-bungkus,
.kosong,
.catatan,
.alur-item,
.panel-beli,
.jarak,
.grafik-kartu,
.kalender-bingkai,
.rapor-angka div,
.sp-item,
.produk-baris,
.unduh-samping .kartu{
  border-color:#d4e2ef;
  box-shadow:0 10px 28px -26px rgba(11,58,107,.5);
}
.kartu{border-width:1px;border-radius:16px}
.tabel-bungkus{border-width:1px;border-radius:16px}
table.tabel th{background:#f4f8fc;color:var(--navy)}
table.tabel th,table.tabel td{border-bottom-color:#e3ebf3}

/* Halaman judul publik mengikuti napas visual hero. */
.kepala-halaman{
  border-bottom:1px solid #dce8f4;
  background:linear-gradient(180deg,#f0f7ff 0%,#f8fbff 100%);
}
.kepala-halaman h1{color:var(--navy)}
.kepala-halaman .pengantar{color:var(--tubuh-lembut)}
.remah,.remah a{color:#7a8da1}

/* ----- Tombol, field, chip ----- */
.btn-gelap{--btn-bg:var(--navy);--btn-br:var(--navy)}
.btn-kuning{--btn-bg:var(--biru-terang);--btn-fg:#fff;--btn-br:var(--biru-terang)}
.btn-kuning:hover{--btn-bg:var(--biru-terang-tua);--btn-br:var(--biru-terang-tua)}
.field input:focus,.field select:focus,.field textarea:focus,
.kotak-cari input:focus,.cari-admin input:focus{
  border-color:var(--biru-terang);
  box-shadow:0 0 0 4px rgba(15,107,196,.12);
}
.field-cek input{accent-color:var(--biru-terang)}
.chip{border:1px solid #cdddea;color:#40566c;border-radius:999px}
.chip:hover{border-color:#8fbce4;color:var(--navy)}
.chip.aktif{background:var(--navy);border-color:var(--navy);color:#fff}

/* Badge kuning lama dinormalisasi menjadi badge brand biru. */
.badge-kuning{background:#eaf3fc;color:#0b5fb8;border-color:#bfd7ef}
.badge-biru{background:#eaf3fc;color:#0b5fb8;border-color:#cfe2f5}
.badge-abu{background:#f2f6fa;color:#607589;border-color:#dce6f0}

/* Daftar cek dan catatan tidak lagi terlihat kuning/retro. */
.daftar-cek li::before{
  background:#dceeff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f6bc4' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat;
}
.catatan{border-width:1px;border-left:4px solid #8fbce4;background:#f8fbff}
.catatan-kuning{border-color:#cfe2f5;border-left-color:var(--biru-terang);background:#eef6fd}
.catatan-hijau{border-color:#bfe6d1;border-left-color:var(--hijau);background:#f0faf5}
.catatan-merah{border-color:#f4caca;border-left-color:var(--merah);background:#fff5f5}

/* Accordion / tab */
.akordeon{border-top:1px solid #bfd3e7}
.akordeon details{border-bottom-color:#dce8f4}
.akordeon summary{color:var(--navy)}
.akordeon summary::after{border:1px solid #bcd7f2;color:var(--biru-terang-tua)}
.akordeon summary:hover::after,.akordeon details[open] summary::after{background:#eaf3fc}
.tab-bar{border-bottom:1px solid #c9d9e8}
.tab-bar button[aria-selected="true"]{color:var(--navy);border-bottom-color:var(--biru-terang)}

/* CTA publik */
.cta-kotak{
  background:linear-gradient(135deg,#e9f4ff 0%,#dceeff 100%);
  color:var(--navy);border:1px solid #bcd7f2;border-radius:20px;
  box-shadow:0 16px 38px -30px rgba(11,58,107,.65);
}
.cta-kotak h2{color:var(--navy)}
.cta-kotak p{color:var(--tubuh-lembut)}

/* ----- Produk / katalog ----- */
.kartu-produk,
.info-kartu,
.info-utama{
  border:1px solid #cfddeb;
  box-shadow:0 12px 34px -28px rgba(11,58,107,.55);
}
.kartu-produk:hover,.info-kartu:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 38px -24px rgba(11,58,107,.5);
  border-color:#a9cae9;
}
.info-utama{box-shadow:0 18px 44px -32px rgba(11,58,107,.5)}
.kp-media,.ik-gambar,.iu-gambar{border-color:#dce8f4;background:#eef5fb}
.sampul-jenis,.kategori{background:#dceeff;color:var(--navy)}
.produk-baris{border-width:1px;border-radius:16px}
.produk-baris:hover{border-color:#9fc4e5;box-shadow:0 14px 34px -28px rgba(11,58,107,.55)}
.tautan-lihat{color:var(--biru-terang-tua)}

/* ----- Market Analysis / Insight ----- */
.tangga li.tg-kini,.panel-rinci li.lv-kini{background:#eaf3fc}
.sp-item{border-width:1px}
.sp-item:hover{border-color:#8fbce4}
.sp-item.aktif{background:var(--navy);border-color:var(--navy)}
.sp-item.aktif .sp-arah{color:#8fc8ff}
.grafik-kartu,.kalender-bingkai{border-width:1px}
.rapor-publik{border-top-color:#bfd3e7}
.rapor-angka div{border-width:1px}
.kolom-pair a.tf-mini:hover{background:#eaf3fc;color:var(--navy)}

/* ----- Login / Register ----- */
.auth{
  border:1px solid #cbddeb;
  box-shadow:0 24px 60px -40px rgba(11,58,107,.55);
}
.auth-sisi{
  background:linear-gradient(145deg,#0b3a6b 0%,#0f5f9e 100%);
  background-image:radial-gradient(rgba(255,255,255,.09) 1.1px,transparent 1.2px),linear-gradient(145deg,#0b3a6b 0%,#0f5f9e 100%);
  background-size:20px 20px,auto;
}
.auth-merek{background:#dceeff;color:var(--navy)}
.auth-daftar li{border-top-color:rgba(255,255,255,.14)}
.auth-daftar li::before{background:#8fc8ff}
.auth-kartu h1{color:var(--navy)}

/* ----- Client Area ----- */
.pita-admin{background:#eaf3fc;color:var(--navy);border-bottom:1px solid #cfe2f5}
.pita-admin a{color:var(--biru-terang-tua)}
.klien-kecil{background:#eaf3fc;color:var(--biru-terang-tua)}
.klien-tab{border-bottom:1px solid #bfd3e7}
.klien-tab a{border-width:1px}
.klien-tab a.aktif{color:var(--navy);border-color:#bfd3e7;box-shadow:inset 0 3px 0 var(--biru-terang)}
.klien-angka{border:1px solid #cfddeb;box-shadow:0 12px 34px -30px rgba(11,58,107,.45)}
.klien-angka div{border-right:1px solid #dce8f4}
.klien-tool,.klien-unduh{border:1px solid #cfddeb;box-shadow:0 12px 34px -30px rgba(11,58,107,.45)}
.klien-sambut{background:#eef6fd;border:1px solid #c7def2}
.klien-bantuan{background:linear-gradient(135deg,#0b3a6b,#0f5f9e)}
.klien-bantuan .btn-utama{--btn-bg:#fff;--btn-fg:var(--navy);--btn-br:#fff}
.file-ikon{background:var(--navy);color:#8fc8ff}
.unduh-lisensi{background:#eef6fd;border:1px solid #bfd7ef}

/* ----- Admin panel ----- */
.app{background:#f4f8fc}
.app-side{background:#082f58;border-right:1px solid rgba(255,255,255,.07)}
.app-side .wordmark{color:#fff}
.app-side .wordmark span:last-child{color:#8fc8ff}
.app-nav-judul{color:#87a5bf}
.app-nav a{color:#c8d8e7}
.app-nav a:hover{background:rgba(143,200,255,.10);color:#fff}
.app-nav a.aktif{background:#eaf3fc;color:#0b3a6b;box-shadow:none}
.app-side-kaki{border-top-color:rgba(255,255,255,.12);color:#a9bfd2}
.app-topbar{border-bottom:1px solid #dce6f0;box-shadow:0 8px 24px -24px rgba(11,58,107,.55)}
.app-topbar h1{color:var(--navy)}
.app-isi{background:#f4f8fc}
.side-toggle{border-color:#bfd3e7}
.side-toggle span{background:var(--navy)}
.stat,.baris-lisensi{border:1px solid #d4e2ef;box-shadow:0 12px 30px -28px rgba(11,58,107,.55)}
.stat strong{color:var(--navy)}
.kunci{background:#f4f8fc;border:1px dashed #aec8df;color:var(--navy)}
.kunci-besar{background:#fff;border-color:#9dbfdd}
.tombol-salin{border:1px solid #9fc2e2;color:var(--biru-terang-tua);background:#fff}
.tombol-salin:hover{background:#eaf3fc}
.link-salin{border:1px solid #c9d9e8;background:#f8fbff;color:#29445f}
.saklar-tombol{color:var(--navy)}
.saklar-tombol[aria-pressed="true"] .saklar{background:var(--biru-terang)}
.saklar-tombol[aria-pressed="true"] .saklar::after{background:#fff}
.menu-titik summary{border:1px solid #bfd3e7;color:var(--navy)}
.menu-titik[open] summary{border-color:#8fbce4;background:#eaf3fc}
.menu-titik>div{border:1px solid #cbddeb;box-shadow:0 18px 38px -24px rgba(11,58,107,.45)}
.tab-cepat{border-bottom:1px solid #bfd3e7}
.tab-cepat a{border-width:1px}
.tab-cepat a.aktif{color:var(--navy);border-color:#bfd3e7;box-shadow:inset 0 3px 0 var(--biru-terang)}
.form-kaki{background:linear-gradient(transparent,#f4f8fc 30%)}
.cari-admin input{border:1px solid #bfd3e7}
.pilih-dua label{border:1px solid #cbddeb}
.pilih-dua label:has(input:checked){border-color:#8fbce4;background:#eef6fd}
.pilih-dua input{accent-color:var(--biru-terang)}
.tugas{border-color:#dce6f0;border-left-color:var(--biru-terang)}
.thumb-admin{border-color:#cbddeb}
.nav-bawah{border-top:1px solid #dce6f0}
.nav-bawah a.aktif{color:var(--navy);background:#eaf3fc}

/* ----- Footer selalu memakai identitas brand ----- */
.footer{background:#082f58;color:#c8d8e7}
.footer-atas,.footer-bawah{border-color:rgba(255,255,255,.13)}
.footer-tautan h3{color:#8fc8ff}
.footer-tautan a,.footer-sosial a{color:#c8d8e7}
.footer-risiko{color:#9fb7cd}
.footer-risiko a{color:#8fc8ff}
.footer .btn-kuning{--btn-bg:#fff;--btn-fg:var(--navy);--btn-br:#fff}
.footer .btn-kuning:hover{--btn-bg:#eaf3fc;--btn-br:#eaf3fc}

/* =========================================================
   BERANDA — penyelarasan komponen khusus halaman depan
   ========================================================= */
.beranda .section-lembut{background:#f4f8fc}
.beranda main>.section:not(.hero):not(.section-lembut){background:#fff}
.beranda main>.section h2,
.beranda main>.section h3{color:var(--navy)}
.beranda main>.section .pengantar{color:var(--tubuh-lembut)}
.beranda .alasan-kartu{border:1px solid #dce8f4;box-shadow:0 10px 28px -24px rgba(11,58,107,.45)}
.beranda .linimasa::before{border-top-color:#bcd7f2}
.beranda .linimasa li::before{background:#fff;border-color:var(--biru-terang);box-shadow:0 0 0 5px #eaf3fc}
.beranda .linimasa li:nth-child(2)::before,
.beranda .linimasa li:nth-child(3)::before,
.beranda .linimasa li:last-child::before{background:var(--biru-terang);border-color:var(--biru-terang)}
.beranda .linimasa time{background:var(--biru-kabut);color:var(--biru-terang-tua)}
.beranda .linimasa p{color:var(--tubuh-lembut)}
.beranda .kartu-produk{border:1px solid #cfddeb;border-radius:18px;box-shadow:0 12px 34px -28px rgba(11,58,107,.55)}
.beranda .kartu-produk:hover{transform:translateY(-3px);box-shadow:0 18px 38px -24px rgba(11,58,107,.5);border-color:#a9cae9}
.beranda .kp-media{border-bottom:1px solid #dce8f4;background:#eef5fb}
.beranda .kp-bawah{border-top:1px solid #dce8f4}
.beranda .kp-isi>p{color:var(--tubuh-lembut)}
.beranda .kp-video{background:var(--biru-kabut);color:var(--navy);border:1px solid #bcd7f2}
.beranda .kp-video::before{border-left-color:var(--biru-terang)}
.beranda .produk-tag .badge-kuning,
.beranda .produk-tag .badge-hijau,
.beranda .produk-tag .badge-biru{background:var(--biru-kabut);color:var(--biru-terang-tua);border-color:#cfe2f5}
.beranda .mode{border:1px solid #cfddeb;border-radius:14px;box-shadow:none}
.beranda .mode:hover{border-color:#8fbce4;background:#fbfdff}
.beranda .mode strong{color:var(--navy)}
.beranda .mode[aria-pressed="true"]{border-color:var(--biru-terang);background:#f8fbff;box-shadow:0 0 0 3px rgba(15,107,196,.10),0 12px 28px -24px rgba(11,58,107,.6);transform:none}
.beranda .mode[aria-pressed="true"] .saklar{background:var(--biru-terang)}
.beranda .mode[aria-pressed="true"] .saklar::after{background:#fff}
.beranda .mode-jelas{background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1.1px),linear-gradient(145deg,#0b3a6b 0%,#0f5f9e 100%);background-size:20px 20px,auto;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 45px -32px rgba(11,58,107,.75)}
.beranda .mode-kecil{background:#dceeff;color:var(--biru-gelap)}
.beranda .mode-jelas h3{color:#fff}
.beranda .mode-jelas p{color:rgba(255,255,255,.82)}
.beranda .banding{border:1px solid #cfddeb;border-radius:18px;box-shadow:0 12px 34px -30px rgba(11,58,107,.5)}
.beranda .banding-sebelum{background:#f7f9fc;border-right:1px solid #dce8f4}
.beranda .banding-kotak li{border-bottom-color:#dce8f4}
.beranda .banding-sesudah{background:#fff}
.beranda .banding-sesudah h3::after{background:var(--biru-kabut);color:var(--biru-terang-tua)}
.beranda .kutipan{border:1px solid #cfddeb;border-radius:16px;box-shadow:0 10px 30px -28px rgba(11,58,107,.5)}
.beranda .kutipan-grid .kutipan:nth-child(2){background:#eef6fd}
.beranda .kutipan blockquote{color:#29445f}
.beranda .kutipan figcaption strong{color:var(--navy)}
.beranda .kutipan-inisial{background:var(--navy);color:#fff}

@media (max-width:1000px){
  .app-side{box-shadow:0 0 44px rgba(11,58,107,.22)}
}
@media (max-width:900px){
  .beranda .banding-sebelum{border-right:0;border-bottom:1px solid #dce8f4}
}

/* =========================================================
   PLATFORM EXPANSION v3.5.0 — Client Area, Finder, Compare,
   Release management, Watchlist, dan Analytics
   ========================================================= */

/* Client Area V2 */
.klien-angka{grid-template-columns:repeat(4,1fr)}
.client-section-block{margin-top:34px}
.klien-tool{border-color:#d4e2ef;box-shadow:0 10px 28px -26px rgba(11,58,107,.5)}
.klien-tool-atas>div{min-width:0}
.klien-license-progress{margin:16px 0 14px;display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;font-size:.82rem;color:var(--tubuh-lembut)}
.klien-license-progress strong{font-size:.84rem}
.klien-license-progress>div{grid-column:1/-1;height:6px;border-radius:99px;background:#e6eef6;overflow:hidden}
.klien-license-progress i{display:block;height:100%;border-radius:inherit;background:var(--biru-terang)}
.release-note{min-height:38px;margin:0 0 14px}
.lisensi-v2{display:block;padding:0;overflow:hidden;border:1px solid #d4e2ef;border-radius:18px;background:#fff;margin-bottom:20px}
.lisensi-v2-utama{padding:24px}
.lisensi-form-klien{margin-top:18px;padding-top:18px;border-top:1px solid #e2ebf3}
.lisensi-form-kaki{display:flex;gap:18px;align-items:center;justify-content:space-between;margin-top:8px}
.lisensi-form-kaki p{margin:0}
.klien-market-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:22px}
.klien-market-head h2{margin:0 0 6px}
.watch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.watch-card{display:block;padding:18px;border:1px solid #d4e2ef;border-radius:16px;background:#fff;box-shadow:0 10px 28px -26px rgba(11,58,107,.5);color:inherit;text-decoration:none;transition:.18s ease}
.watch-card:hover{transform:translateY(-2px);border-color:#a9cae9;box-shadow:0 18px 36px -28px rgba(11,58,107,.55)}
.watch-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.watch-top strong{font-size:1.03rem}
.watch-price{font-family:"Bricolage Grotesque",sans-serif;font-size:1.6rem;font-weight:800;color:var(--navy);margin:12px 0 4px}
.watch-meta{display:flex;justify-content:space-between;gap:12px;color:var(--redup);font-size:.78rem}
.watch-card p{margin:12px 0 0;color:var(--tubuh-lembut);font-size:.86rem;line-height:1.5}
.watch-setting{margin-top:22px}.watch-checks{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0 20px}
.watch-checks label{cursor:pointer}.watch-checks input{position:absolute;opacity:0;pointer-events:none}
.watch-checks span{display:block;border:1px solid #cbddeb;border-radius:999px;padding:8px 12px;font-weight:700;font-size:.82rem;color:var(--tubuh)}
.watch-checks input:checked+span{background:var(--biru-kabut);border-color:#8fbce4;color:var(--navy)}
.activity-list{border:1px solid #d4e2ef;border-radius:16px;background:#fff;overflow:hidden}
.activity-list>div{display:flex;gap:12px;padding:15px 18px;border-bottom:1px solid #e5edf4}.activity-list>div:last-child{border-bottom:0}
.activity-dot{width:9px;height:9px;border-radius:50%;background:var(--biru-terang);margin-top:7px;flex:0 0 auto}
.activity-list p{margin:0;display:grid;grid-template-columns:auto 1fr auto;gap:7px 10px;width:100%;align-items:center}.activity-list p small{color:var(--redup)}

/* Release / downloads */
.release-card{border:1px solid #d4e2ef;border-radius:18px;padding:24px;background:#fff;box-shadow:0 10px 28px -26px rgba(11,58,107,.5)}
.release-head{align-items:flex-start}.release-badges{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}
.release-info{margin:14px 0 18px;padding:15px 16px;border-radius:12px;background:#f4f8fc;border:1px solid #dce6f0}
.release-info p{margin:0 0 8px}.release-info p:last-child{margin-bottom:0}.release-info details{margin-top:8px}.release-info summary{cursor:pointer;font-weight:700;color:var(--navy)}
.release-changelog{margin-top:10px;line-height:1.7;color:var(--tubuh)}
.release-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid #e3ebf3}

/* Tool Finder */
.finder-layout{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:34px;align-items:start}.finder-form{position:sticky;top:100px}
.finder-empty{min-height:360px;border:1px dashed #bfd3e7;border-radius:20px;background:#f8fbff;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:44px}.finder-empty h2{font-size:clamp(1.65rem,3vw,2.5rem);max-width:620px;margin:14px 0}.finder-empty p{max-width:650px}
.finder-results{display:grid;gap:14px}.finder-result{display:grid;grid-template-columns:36px 108px 1fr auto;gap:16px;align-items:center;padding:16px;border:1px solid #d4e2ef;border-radius:17px;background:#fff;box-shadow:0 10px 28px -26px rgba(11,58,107,.5)}
.finder-rank{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--biru-kabut);color:var(--navy);font-weight:800}.finder-result .produk-thumb{width:108px}.finder-copy h3{margin:2px 0 5px}.finder-copy p{margin:0}.finder-action{display:grid;gap:12px;justify-items:end;min-width:145px}.finder-action>strong{font-size:1rem}

/* Comparison */
.compare-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:12px;align-items:end;margin-bottom:28px;padding:18px;border:1px solid #d4e2ef;border-radius:16px;background:#f8fbff}.compare-picker .field{margin:0}
.compare-table-wrap{overflow:auto;border:1px solid #d4e2ef;border-radius:18px;background:#fff}.compare-table{width:100%;border-collapse:collapse;min-width:820px}.compare-table th,.compare-table td{padding:18px;border-right:1px solid #e3ebf3;border-bottom:1px solid #e3ebf3;vertical-align:top;text-align:left}.compare-table tr:last-child th,.compare-table tr:last-child td{border-bottom:0}.compare-table th:last-child,.compare-table td:last-child{border-right:0}.compare-table thead th{background:#f4f8fc}.compare-table thead th:not(:first-child){min-width:230px}.compare-table thead strong{display:block;font-size:1.08rem;margin:4px 0}.compare-table thead small{color:var(--biru-terang-tua);font-weight:700}.compare-list{margin:0;padding-left:18px;display:grid;gap:8px}

/* Analytics */
.analytics-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:18px}.analytics-head p{margin:0}.analytics-grid{margin-top:26px}.analytics-grid>.kartu{overflow:hidden}.analytics-trend{margin-top:22px}.mini-bars{height:210px;display:flex;gap:5px;align-items:flex-end;padding:20px 4px 0;border-top:1px solid #e3ebf3}.mini-bars>div{height:100%;flex:1;min-width:6px;display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;gap:7px}.mini-bars i{display:block;min-height:4px;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#0f6bc4,#6fb0e8)}.mini-bars span{font-size:.65rem;color:var(--redup);text-align:center;white-space:nowrap;overflow:hidden}

@media(max-width:1000px){
 .klien-angka{grid-template-columns:repeat(2,1fr)}.watch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.finder-layout{grid-template-columns:1fr}.finder-form{position:static}.compare-picker{grid-template-columns:repeat(2,1fr)}.finder-result{grid-template-columns:34px 90px 1fr}.finder-result .produk-thumb{width:90px}.finder-action{grid-column:3;justify-items:start;display:flex;align-items:center;flex-wrap:wrap}
}
@media(max-width:680px){
 .klien-angka,.watch-grid{grid-template-columns:1fr}.klien-market-head,.lisensi-form-kaki,.analytics-head{align-items:stretch;flex-direction:column}.activity-list p{grid-template-columns:1fr}.activity-list p small{grid-column:1}.finder-result{grid-template-columns:32px 1fr}.finder-result .produk-thumb{display:none}.finder-copy{grid-column:2}.finder-action{grid-column:2}.compare-picker{grid-template-columns:1fr}.mini-bars span{display:none}
}

/* Checkout & order workflow */
.panel-release{margin:14px 0;padding:12px 13px;border:1px solid #dce6f0;border-radius:11px;background:#f4f8fc}.panel-release strong{display:block;font-size:.82rem}.panel-release p{margin:4px 0 0;font-size:.82rem;line-height:1.45}.panel-release small{display:block;margin-top:6px;color:var(--redup)}
.checkout-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:28px;align-items:start}.checkout-product h2{font-size:1.7rem;margin:12px 0 6px}.checkout-price{margin-top:20px;padding-top:16px;border-top:1px solid #e3ebf3;display:flex;justify-content:space-between;align-items:end}.checkout-price span{color:var(--redup)}.checkout-price strong{font-size:1.5rem}.checkout-steps{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:step}.checkout-steps li{position:relative;padding:0 0 18px 34px;border-left:1px solid #bfd3e7;margin-left:10px}.checkout-steps li:last-child{border-left-color:transparent;padding-bottom:0}.checkout-steps li::before{counter-increment:step;content:counter(step);position:absolute;left:-12px;top:0;width:23px;height:23px;border-radius:50%;background:var(--biru-kabut);border:1px solid #8fbce4;color:var(--navy);display:grid;place-items:center;font-size:.72rem;font-weight:800}.checkout-steps strong,.checkout-steps span{display:block}.checkout-steps span{color:var(--redup);font-size:.84rem;margin-top:2px}.payment-box{padding:14px 15px;border-radius:12px;background:#eef6fd;border:1px solid #bfd8ee;display:grid;gap:3px;margin:10px 0}.payment-box span{font-size:.78rem;color:var(--redup);font-weight:700}.payment-box strong{font-size:1.18rem;letter-spacing:.03em}.payment-box small{color:var(--tubuh-lembut)}
.order-list-client{display:grid;gap:18px}.client-order{border:1px solid #d4e2ef;border-radius:18px;background:#fff;overflow:hidden;box-shadow:0 10px 28px -26px rgba(11,58,107,.5)}.client-order.fokus{box-shadow:0 0 0 3px rgba(15,107,196,.1),0 16px 34px -26px rgba(11,58,107,.5);border-color:#9bc4e8}.client-order-head{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 22px;background:#f8fbff;border-bottom:1px solid #e3ebf3}.client-order-head h3{margin:3px 0 0}.client-order-head>div:last-child{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.client-payment-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding:22px}.client-payment-grid h4{margin:0 0 10px}.proof-form{display:grid;gap:10px}.proof-form input[type=file]{width:100%;border:1px solid #cbddeb;border-radius:10px;padding:9px;background:#fff}.proof-status{margin-bottom:12px}.proof-status p{margin:7px 0 0}.client-order-actions{padding:14px 22px;border-top:1px solid #e3ebf3;display:flex;gap:12px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.client-order-actions>span{margin-right:auto;color:var(--tubuh-lembut)}
@media(max-width:850px){.checkout-grid,.client-payment-grid{grid-template-columns:1fr}.client-order-head{align-items:flex-start;flex-direction:column}.client-order-head>div:last-child{justify-content:flex-start}.client-order-actions{justify-content:flex-start}.client-order-actions>span{width:100%}}

/* In-app notifications */
.alert-toggle{display:flex;gap:12px;align-items:flex-start;padding:14px 15px;margin:0 0 18px;border:1px solid #d4e2ef;border-radius:12px;background:#f8fbff;cursor:pointer}.alert-toggle input{margin-top:4px;accent-color:var(--biru-terang)}.alert-toggle span,.alert-toggle strong,.alert-toggle small{display:block}.alert-toggle small{margin-top:3px;color:var(--redup);font-weight:400;line-height:1.45}.notif-head{align-items:center}.notif-list{display:grid;gap:12px}.notif-item{display:grid;grid-template-columns:38px 1fr auto;gap:14px;align-items:start;padding:18px;border:1px solid #d4e2ef;border-radius:15px;background:#fff}.notif-item.unread{background:#f8fbff;border-color:#a9cae9}.notif-icon{width:36px;height:36px;border-radius:10px;background:var(--biru-kabut);color:var(--navy);display:grid;place-items:center;font-weight:800}.notif-title{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.notif-item p{margin:5px 0;color:var(--tubuh)}.notif-item small{color:var(--redup)}.notif-actions{display:flex;gap:8px;align-items:center}.notif-actions form{margin:0}
@media(max-width:680px){.notif-item{grid-template-columns:36px 1fr}.notif-actions{grid-column:2;justify-content:flex-start;flex-wrap:wrap}}

/* =========================================================
   v3.5.3 — PASSWORD VISIBILITY + BERANDA CONTRAST FIX
   ========================================================= */

/* Tombol mata pada seluruh kolom kata sandi (publik, client, admin). */
.password-wrap{position:relative;width:100%}
.password-wrap>input{padding-right:50px!important}
.password-toggle{
  position:absolute;right:7px;top:50%;transform:translateY(-50%);
  width:38px;height:38px;padding:0;border:0;border-radius:9px;
  display:grid;place-items:center;background:transparent;color:#5f7690;
  cursor:pointer;transition:background .15s ease,color .15s ease;
}
.password-toggle:hover{background:#eaf3fc;color:var(--navy)}
.password-toggle:focus-visible{outline:2px solid var(--biru-terang);outline-offset:1px}
.password-toggle svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.password-toggle .pw-eye-off{display:none}
.password-toggle[aria-pressed="true"] .pw-eye{display:none}
.password-toggle[aria-pressed="true"] .pw-eye-off{display:block}

/*
   Kontras beranda dibuat eksplisit. Sebelumnya selector global untuk judul
   bisa menang terhadap teks yang berada di panel gelap, sementara beberapa
   teks sekunder terlalu pucat di permukaan putih/biru muda.
*/
.beranda .hero h1{color:#0b3a6b}
.beranda .hero-sub{color:#0b5fb8}
.beranda .hero .pengantar{color:#40566c}
.beranda .hero-angka strong{color:#0b3a6b}
.beranda .hero-angka small{color:#5f7388}

.beranda main>.section:not(.hero) .tumpuk-judul h2,
.beranda main>.section:not(.hero) .judul-bagian h2,
.beranda .alasan-kartu h3,
.beranda .linimasa h3,
.beranda .kp-isi h3,
.beranda .banding-kotak h3,
.beranda .faq-beranda summary{color:#0b3a6b}

.beranda main>.section:not(.hero) .pengantar,
.beranda .alasan-kartu p,
.beranda .linimasa p,
.beranda .kp-isi>p,
.beranda .mode small,
.beranda .banding-kotak li,
.beranda .kutipan blockquote,
.beranda .faq-beranda .isi p,
.beranda .cta-kotak p{color:#40566c}

/* Panel Assisted/Manual/Auto memang gelap: teks harus tetap terang. */
.beranda main>.section .mode-jelas h3,
.beranda .mode-jelas h3{color:#fff!important}
.beranda main>.section .mode-jelas>p:not(.mode-kecil),
.beranda .mode-jelas>p:not(.mode-kecil){color:rgba(255,255,255,.86)!important}
.beranda .mode-jelas .mode-kecil{color:#0b3a6b!important;background:#dceeff}

/* Teks harga/link pada kartu tetap tegas di atas putih. */
.beranda .produk-harga{color:#0b3a6b}
.beranda .tautan-lihat{color:#0b5fb8}
.beranda .mode strong{color:#0b3a6b}


/* v3.5.4 — Email OTP registration */
.otp-input{
  text-align:center;
  font-size:1.45rem;
  font-weight:750;
  letter-spacing:.35em;
  font-variant-numeric:tabular-nums;
}
.otp-aksi{
  margin-top:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  font-size:.92rem;
}
.otp-aksi form{margin:0}
.otp-aksi .btn{padding:6px 0}

/* Pastikan tombol putih di footer tidak mewarisi warna link putih. */
.footer a.btn-kuning,
.footer a.btn-putih{
  color:var(--navy)!important;
}
.footer a.btn-kuning:hover,
.footer a.btn-putih:hover{
  color:var(--navy)!important;
}

/* v3.5.9 — paket lisensi */
.baris-field.empat{grid-template-columns:repeat(4,minmax(0,1fr))}
.license-plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:16px 0}
.license-plan{display:block;border:1px solid #cbddeb;border-radius:14px;padding:14px;background:#fff;cursor:pointer}
.license-plan:hover{border-color:#8fbce4;background:#f8fbff}
.license-plan input{margin-right:8px;accent-color:var(--biru-terang)}
.license-plan strong{display:block;margin-top:6px;color:var(--navy)}
.license-expiry{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:10px 0 16px;padding:12px 14px;background:#f8fbff;border:1px solid #d4e2ef;border-radius:12px}
@media(max-width:900px){.baris-field.empat{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.baris-field.empat{grid-template-columns:1fr}}