/* ================================================================== */
/* v7: EXECUTIVE PRIVATE-BANKING PALETTE -- locked direction, replaces v4-v6 dark+gold */
/* Ivory bg, Pearl surfaces, Dark Executive selective, Deep Emerald positive, */
/* Champagne Gold thin accent only. Scoped entirely to .ksig-body / .ksig-* classes. */
/* ================================================================== */
:root{
  --ks-bg:#070A0F;
  --ks-surface:#FBFAF7;
  --ks-surface-dark:#1C2024;
  --ks-text:#151719;
  --ks-text-muted:#666B70;
  --ks-text-faint:#858A8F;
  --ks-emerald:#174C42;
  --ks-emerald-soft:rgba(23,76,66,.10);
  --ks-gold:#C6AA72;
  --ks-gold-soft:rgba(198,170,114,.16);
  --ks-danger:#963F3F;
  --ks-danger-soft:rgba(150,63,63,.10);
  --ks-warning:#9C7A3C;
  --ks-warning-soft:rgba(156,122,60,.12);
  --ks-notif-red:#e5484d;
  --ks-border:rgba(21,23,25,.10);
  --ks-border-gold:rgba(198,170,114,.40);
  --ks-shadow:0 10px 28px rgba(21,23,25,.07);
  --ks-radius:18px;
}

/* App background: warm ivory + very subtle tonal variation, no orb/texture */
.ksig-body{
  background:
    radial-gradient(1200px 700px at 12% -10%, rgba(198,170,114,.07), transparent 60%),
    radial-gradient(1000px 700px at 100% 0%, rgba(23,76,66,.05), transparent 55%),
    var(--ks-bg) !important;
  color:var(--ks-text) !important;
}

/* ---------- Header: light & clean, remove dark-strip-era decorations ---------- */
.ksig-header{ background:transparent !important; }
.ksig-header-title{ color:#F4F6F8 !important; background:none !important; padding-left:0 !important; }
.ksig-header-title::before{ display:none !important; }
.ksig-header-title::after{ display:none !important; }
.ksig-header-sub{ color:var(--ks-text-muted) !important; }
.ksig-live-dot{ background:var(--ks-emerald) !important; }
.ksig-install-btn{ background:var(--ks-gold-soft) !important; border:1px solid var(--ks-border-gold) !important; color:var(--ks-emerald) !important; }
.ksig-install-btn:hover{ background:rgba(198,170,114,.26) !important; }

/* ---------- Login: ivory bg, pearl panel, logo floats above card, dark-executive CTA ---------- */
.ksig-center-card{
  background:var(--ks-surface) !important;
  border:1px solid var(--ks-border) !important;
  box-shadow:var(--ks-shadow) !important;
  margin-top:16vh !important;
}
.ksig-center-card::before{ display:none !important; }
.ksig-center-card::after{
  top:-34px !important;
  background-color:var(--ks-surface-dark) !important;
  box-shadow:0 12px 26px rgba(21,23,25,.28), 0 0 0 4px var(--ks-surface), 0 0 0 5px var(--ks-border-gold) !important;
}
.ksig-center-card h1{ margin:46px 26px 4px !important; color:var(--ks-text) !important; }
.ksig-center-card p{ color:var(--ks-text-muted) !important; }
.ksig-field label{ color:var(--ks-text-muted) !important; }
.ksig-field input{
  background:#fff !important; border:1px solid var(--ks-border) !important; color:var(--ks-text) !important;
}
.ksig-field input:focus{
  border-color:var(--ks-emerald) !important;
  box-shadow:0 0 0 3px var(--ks-emerald-soft), 0 0 0 1px var(--ks-gold) !important;
  outline:none !important;
}
.ksig-btn.primary{
  background:var(--ks-surface-dark) !important;
  background-image:none !important;
  border:1px solid var(--ks-surface-dark) !important;
  color:#F5F1E8 !important;
  box-shadow:none !important;
}
.ksig-btn.primary:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(21,23,25,.22) !important; }
.ksig-center-card .ksig-login-install{
  color:var(--ks-emerald) !important; border:1px solid var(--ks-border-gold) !important; background:var(--ks-gold-soft) !important;
}
.ksig-center-card .ksig-login-install:hover{ background:rgba(198,170,114,.26) !important; }

/* ---------- Overview cards: pearl surface, semantic accent, gold hairline (always visible) ---------- */
.ksig-card{
  background:var(--ks-surface) !important;
  border:1px solid var(--ks-border) !important;
  box-shadow:var(--ks-shadow) !important;
}
.ksig-card::before{
  background:linear-gradient(90deg,var(--ks-gold),rgba(198,170,114,.10) 75%,transparent) !important;
  opacity:1 !important;
}
.ksig-card.profit::before, .ksig-card.aktif::before{ background:linear-gradient(90deg,var(--ks-emerald),rgba(23,76,66,.10) 75%,transparent) !important; }
.ksig-card.loss::before{ background:linear-gradient(90deg,var(--ks-danger),rgba(150,63,63,.10) 75%,transparent) !important; }
.ksig-card.archive::before{ background:linear-gradient(90deg,var(--ks-text-faint),rgba(133,138,143,.10) 75%,transparent) !important; }
.ksig-card:hover{ border-color:var(--ks-border-gold) !important; }
.ksig-card-label{ color:var(--ks-text-muted) !important; }
.ksig-card-label::before{ background:var(--ks-gold) !important; }
.ksig-card.profit .ksig-card-label::before, .ksig-card.aktif .ksig-card-label::before{ background:var(--ks-emerald) !important; }
.ksig-card.loss .ksig-card-label::before{ background:var(--ks-danger) !important; }
.ksig-card.archive .ksig-card-label::before{ background:var(--ks-text-faint) !important; }
.ksig-card-count{ color:var(--ks-text) !important; }
.ksig-card.profit .ksig-card-count{ color:var(--ks-emerald) !important; }
.ksig-card.loss .ksig-card-count{ color:var(--ks-danger) !important; }
.ksig-card.archive .ksig-card-count{ color:var(--ks-text-faint) !important; }
.ksig-card-arrow{ color:var(--ks-gold) !important; }
.ksig-card-badge{ background:var(--ks-notif-red) !important; }

/* ---------- Recap: dark-executive segmented control (selective dark surface) ---------- */
.ksig-recap-card{
  background:var(--ks-surface) !important;
  border:1px solid var(--ks-border) !important;
  box-shadow:none !important;
}
.ksig-recap-card::before{ background:linear-gradient(90deg,transparent,var(--ks-border-gold),transparent) !important; }
.ksig-tabs{ background:var(--ks-surface-dark) !important; }
.ksig-tab{ color:rgba(245,241,232,.55) !important; }
.ksig-tab.active{
  background:linear-gradient(160deg,#2A3138,var(--ks-surface-dark)) !important;
  color:#F5F1E8 !important;
  box-shadow:0 4px 14px rgba(0,0,0,.3), inset 0 0 0 1px var(--ks-border-gold) !important;
}
.ksig-tab:hover:not(.active){ color:#F5F1E8 !important; }

/* ---------- Activity: pearl surface, gold accent rail ---------- */
.ksig-activity-card{
  background:var(--ks-surface) !important;
  border:1px solid var(--ks-border) !important;
}
.ksig-activity-card .ksig-row::before{ background:var(--ks-border-gold) !important; }
.ksig-row-symbol{ color:var(--ks-text) !important; }
.ksig-badge.fresh{ background:var(--ks-gold-soft) !important; color:#8a6a2e !important; }
.ksig-badge.aktif, .ksig-badge.profit, .ksig-badge.buy{ background:var(--ks-emerald-soft) !important; color:var(--ks-emerald) !important; }
.ksig-badge.loss, .ksig-badge.sell{ background:var(--ks-danger-soft) !important; color:var(--ks-danger) !important; }

/* ---------- Section labels ---------- */
.ksig-section-label{ color:var(--ks-text-muted) !important; }
.ksig-section-label::before{ background:var(--ks-gold) !important; box-shadow:0 0 0 3px var(--ks-gold-soft) !important; }
.ksig-section-action{ color:var(--ks-emerald) !important; }/* ==========================================================================
Kamar Signal — app stylesheet v2 (professional UI/UX redesign)
Dibangun di atas token --km-* dari kamar-dashboard-identity-v2.css supaya
1:1 dengan identitas Kamar Kajian Market. Semua class di sini dinamespace
"ksig-" supaya tidak bentrok dengan CSS halaman utama.
Prinsip wajib: compact rows, tidak ada card besar per-field, depth terkendali,
microinteraction subtle, aman untuk smartphone (safe-area, sticky toolbar tipis).
========================================================================== */

html,body{ min-height:100%; }
:root{
  --ksig-t-hover:200ms; --ksig-t-press:140ms; --ksig-t-tab:220ms;
  --ksig-t-badge:220ms; --ksig-t-entrance:300ms;
  --ksig-notif-red:#e5484d;
}
.ksig-body{
  margin:0;
  background:
    radial-gradient(circle at 10% 0%, rgba(184,138,61,.14), transparent 34rem),
    radial-gradient(circle at 90% 10%, rgba(14,95,84,.10), transparent 30rem),
    linear-gradient(180deg,#f9f5ed 0%,#eee6d7 48%,#f6f1e8 100%);
  color:var(--km-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.ksig-root{ min-height:100%; display:flex; flex-direction:column; }
*{ box-sizing:border-box; }

/* ---------- Reduced motion (global safety net) ---------- */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- Focus visibility (accessibility) ---------- */
.ksig-card:focus-visible, .ksig-row:focus-visible, .ksig-guide-card:focus-visible,
.ksig-appbar-back:focus-visible, .ksig-install-btn:focus-visible, .ksig-tool-btn:focus-visible,
.ksig-tab:focus-visible, .ksig-btn:focus-visible, .ksig-chip-opt:focus-visible,
.ksig-section-action:focus-visible, .ksig-login-install:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible{
  outline:2px solid var(--km-gold); outline-offset:2px;
}

.ksig-boot{ display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:100vh; gap:6px; }
.ksig-boot-mark{ font-weight:950; letter-spacing:-.02em; font-size:20px; color:var(--km-ink); }
.ksig-boot-sub{ font-size:13px; color:var(--km-muted); }

/* ---------- Entrance / content-swap animation ---------- */
@keyframes ksigFadeUp{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:translateY(0); } }
.ksig-cnum{ font-variant-numeric: tabular-nums; }
.ksig-fade{ animation: ksigFadeUp .28s ease both; }
.ksig-stagger-1{ animation-delay:0ms; }
.ksig-stagger-2{ animation-delay:50ms; }
.ksig-stagger-3{ animation-delay:100ms; }
.ksig-stagger-4{ animation-delay:150ms; }
.ksig-stagger-5{ animation-delay:200ms; }

/* ---------- App bar (sticky, compact — sub-pages) ---------- */
.ksig-appbar{
  position:sticky; top:0; z-index:40;
  padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px;
  background:rgba(249,245,237,.78);
  backdrop-filter:none;
  border-bottom:1px solid transparent;
  min-height:52px;
  transition:background .22s ease, backdrop-filter .22s ease, border-color .22s ease, box-shadow .22s ease, padding .22s ease;
}
.ksig-appbar.scrolled{
  background:rgba(249,245,237,.86);
  backdrop-filter:blur(16px) saturate(1.4);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);
  border-bottom-color:var(--km-line);
  box-shadow:0 6px 20px rgba(17,20,23,.05);
}
.ksig-appbar-inner{ display:flex; align-items:center; gap:10px; width:100%; max-width:640px; margin:0 auto; }
.ksig-appbar-back{
  width:32px; height:32px; border-radius:999px; border:1px solid var(--km-line);
  background:#fff; display:flex; align-items:center; justify-content:center;
  font-size:16px; color:var(--km-ink); flex:0 0 auto; cursor:pointer;
  transition:border-color .18s ease, transform .18s ease;
}
.ksig-appbar-back:hover{ border-color:rgba(184,138,61,.4); }
.ksig-appbar-back:active{ transform:scale(.94); }
.ksig-appbar-title{ font-weight:950; font-size:15px; letter-spacing:-.01em; flex:1 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ksig-appbar-sub{ font-size:11px; color:var(--km-muted); font-weight:700; }

/* ---------- LIVE indicator (compact, subtle pulse) ---------- */
.ksig-live{ display:flex; align-items:center; gap:5px; font-size:11px; font-weight:900; letter-spacing:.02em; color:var(--km-muted); flex:0 0 auto; }
.ksig-live-dot{ width:7px; height:7px; border-radius:999px; background:#9aa0a6; }
.ksig-live.on .ksig-live-dot{ background:#0e5f54; animation: ksigPulse 2.4s ease-out infinite; }
@keyframes ksigPulse{
  0%{ box-shadow:0 0 0 0 rgba(14,95,84,.32); }
  70%{ box-shadow:0 0 0 6px rgba(14,95,84,0); }
  100%{ box-shadow:0 0 0 0 rgba(14,95,84,0); }
}
.ksig-live.on{ color:#0e5f54; }
.ksig-live.warn .ksig-live-dot{ background:#b8862c; }
.ksig-live.warn{ color:#8a5a12; }
.ksig-live.off .ksig-live-dot{ background:#8a2b2b; }
.ksig-live.off{ color:#8a2b2b; }

.ksig-install-btn{
  width:32px; height:32px; border-radius:999px; border:1px solid var(--km-line);
  background:#fff; display:flex; align-items:center; justify-content:center;
  font-size:14px; color:var(--km-ink); flex:0 0 auto; cursor:pointer; padding:0;
  transition:border-color .18s ease, transform .18s ease;
}
.ksig-install-btn:hover{ border-color:rgba(184,138,61,.4); }
.ksig-install-btn.on{ border-color:rgba(14,95,84,.5); background:rgba(14,95,84,.08); color:#0e5f54; }
.ksig-install-btn:active{ transform:scale(.94); }
.ksig-login-install{ display:block; text-align:center; margin-top:14px; font-size:12.5px; font-weight:800; color:var(--km-muted); text-decoration:none; cursor:pointer; }
.ksig-login-install:hover{ color:var(--km-ink); }

.ksig-main{ flex:1 1 auto; padding:12px 14px calc(env(safe-area-inset-bottom,0px) + 28px); max-width:640px; width:100%; margin:0 auto; }
@media (min-width:760px){
  .ksig-main{ max-width:780px; padding-left:20px; padding-right:20px; }
  .ksig-appbar-inner, .ksig-header-row{ max-width:780px; }
}
@media (min-width:1024px){
  .ksig-main{ max-width:1040px; padding-top:22px; }
  .ksig-appbar-inner, .ksig-header-row{ max-width:1040px; }
}

/* ---------- Buttons / pills (reuse identity conventions) ---------- */
.ksig-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  border-radius:999px; font-weight:900; font-size:13px; padding:10px 18px;
  border:1px solid var(--km-line); background:#fff; color:var(--km-ink); cursor:pointer;
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.ksig-btn:hover{ border-color:rgba(184,138,61,.4); }
.ksig-btn:active{ transform:scale(.98); }
.ksig-btn.primary{
  background:linear-gradient(135deg,#c99d51,#f1d893); color:#15120b; border:1px solid rgba(17,20,23,.12);
  box-shadow:0 12px 30px rgba(184,138,61,.22);
}
.ksig-btn.block{ width:100%; }
.ksig-btn:disabled{ opacity:.5; cursor:default; }

.ksig-backnav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px;}
.ksig-backnav-btn{padding:7px 14px;font-size:12px;gap:5px;}
@media (max-width:479px){.ksig-backnav{margin-bottom:8px;}}

.ksig-badge{ display:inline-flex; align-items:center; padding:2px 9px; border-radius:999px; font-size:11px; font-weight:950; letter-spacing:.03em; text-transform:uppercase; }
.ksig-badge.fresh{ background:rgba(184,138,61,.14); color:#8a5a12; }
.ksig-badge.aktif{ background:rgba(14,95,84,.10); color:#0e5f54; }
.ksig-badge.profit{ background:rgba(14,95,84,.16); color:#0e5f54; }
.ksig-badge.loss{ background:rgba(196,60,60,.10); color:#8a2b2b; }
.ksig-badge.buy{ background:rgba(14,95,84,.10); color:#0e5f54; }
.ksig-badge.sell{ background:rgba(196,60,60,.10); color:#8a2b2b; }
.ksig-badge.lastcall{ background:rgba(59,95,166,.12); color:#2c4d8a; }
.ksig-badge.critical{ background:rgba(196,60,60,.16); color:#c43c3c; animation:ksigCriticalPulse 1.8s ease-in-out infinite; }
@keyframes ksigCriticalPulse{ 0%,100%{ opacity:1; } 50%{ opacity:.6; } }
.ksig-lastcall-banner{ margin:10px 0 0; padding:10px 14px; border-radius:10px; background:rgba(59,95,166,.10); border:1px solid rgba(59,95,166,.28); color:#2c4d8a; font-size:13px; font-weight:600; display:flex; align-items:center; gap:8px; }
.ksig-critical-banner{ margin:10px 0 0; padding:10px 14px; border-radius:10px; background:rgba(196,60,60,.10); border:1px solid rgba(196,60,60,.30); color:#8a2b2b; font-size:13px; font-weight:600; display:flex; align-items:center; gap:8px; }

/* ---------- Login / access-denied ---------- */
.ksig-center-card{
  margin-top:10vh; max-width:380px; margin-left:auto; margin-right:auto;
  background:#fff; border:1px solid var(--km-line); border-radius:var(--km-radius-lg);
  box-shadow:var(--km-shadow); padding:26px 22px;
}
.ksig-center-card h1{ font-size:19px; margin:2px 0 4px; letter-spacing:-.02em; }
.ksig-center-card p{ font-size:13px; color:var(--km-muted); margin:0 0 16px; line-height:1.5; }
.ksig-field{ margin-bottom:10px; }
.ksig-field label{ display:block; font-size:11.5px; font-weight:800; color:var(--km-muted); margin-bottom:4px; }
.ksig-field input{
  width:100%; padding:11px 12px; border-radius:14px; border:1px solid var(--km-line);
  background:#fff; color:var(--km-ink); font-size:14px;
}
.ksig-status-line{ font-size:12.5px; font-weight:700; margin:8px 0 4px; min-height:16px; }
.ksig-status-line.err{ color:#8a2b2b; }
.ksig-status-line.ok{ color:#0e5f54; }
.ksig-deny-icon{ font-size:26px; margin-bottom:6px; }

/* ---------- Dashboard header ---------- */
.ksig-header{
  position:sticky; top:0; z-index:40;
  padding:calc(env(safe-area-inset-top,0px) + 14px) 14px 14px;
  background:rgba(249,245,237,.78);
  backdrop-filter:none;
  border-bottom:1px solid transparent;
  transition:background .22s ease, backdrop-filter .22s ease, border-color .22s ease, box-shadow .22s ease, padding .22s ease;
}
.ksig-header.scrolled{
  padding-top:calc(env(safe-area-inset-top,0px) + 10px);
  padding-bottom:10px;
  background:rgba(249,245,237,.86);
  backdrop-filter:blur(16px) saturate(1.4);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);
  border-bottom-color:var(--km-line);
  box-shadow:0 6px 20px rgba(17,20,23,.05);
}
.ksig-header-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:14px; width:100%; max-width:640px; margin:0 auto; flex-wrap:wrap; }
.ksig-header-title{ font-size:19px; font-weight:950; letter-spacing:-.02em; }
.ksig-header-sub{ font-size:12.5px; color:var(--km-muted); font-weight:700; margin-top:2px; }
.ksig-status-banner{ display:inline-flex; align-items:center; gap:6px; margin-top:6px; font-size:11.5px; font-weight:800; padding:5px 10px; border-radius:999px; text-decoration:none; width:fit-content; }
.ksig-status-banner.warn{ color:#a9720f; background:rgba(245,166,35,.14); border:1px solid rgba(245,166,35,.3); }
.ksig-status-banner.warn-strong{ color:#b3261e; background:rgba(217,45,32,.12); border:1px solid rgba(217,45,32,.28); }
.ksig-status-banner.off{ color:#8a8a8a; background:rgba(120,120,120,.12); border:1px solid rgba(120,120,120,.26); }

.ksig-header-meta{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.ksig-header-updated{ font-size:11px; color:var(--km-muted); font-weight:700; white-space:nowrap; }
@media (max-width:479px){
  .ksig-header-row{ flex-direction:column; align-items:flex-start; }
  .ksig-header-meta{ width:100%; justify-content:space-between; }
}

.ksig-main.ksig-dashboard{ padding-top:18px; }
.ksig-block{ margin-bottom:26px; }

.ksig-section-label-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.ksig-section-label{ font-size:11.5px; font-weight:950; letter-spacing:.09em; text-transform:uppercase; color:var(--km-muted); }
.ksig-section-action{ font-size:12px; font-weight:900; color:#8a5a12; text-decoration:none; cursor:pointer; transition:opacity .18s ease; }
.ksig-section-action:hover{ opacity:.72; }

.ksig-minifooter{ text-align:center; font-size:10.5px; font-weight:800; letter-spacing:.06em; color:var(--km-muted); padding:10px 0 6px; text-transform:uppercase; margin-top:-12px; }

/* ---------- Overview cards ---------- */
.ksig-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.ksig-card{
  background:#fff; border:1px solid var(--km-line); border-radius:20px;
  box-shadow:0 8px 24px rgba(17,20,23,.05); padding:15px 16px;
  display:flex; flex-direction:column; gap:3px; cursor:pointer;
  transition:transform var(--ksig-t-hover) ease, box-shadow var(--ksig-t-hover) ease, border-color var(--ksig-t-hover) ease;
  position:relative; overflow:hidden;
}
.ksig-card-top{ display:flex; align-items:center; justify-content:space-between; }
.ksig-card-top-right{ display:flex; align-items:center; gap:7px; }
.ksig-card-arrow{ font-size:12.5px; color:var(--km-muted); transition:transform var(--ksig-t-hover) ease, color var(--ksig-t-hover) ease; }
.ksig-card:hover{ transform:translateY(-3px); box-shadow:0 16px 36px rgba(17,20,23,.10); border-color:rgba(184,138,61,.38); }
.ksig-card:hover .ksig-card-arrow{ transform:translate(2px,-2px); color:#8a5a12; }
.ksig-card:active{ transform:translateY(-1px) scale(.988); transition-duration:var(--ksig-t-press); }

/* Extremely subtle cursor-aware highlight, desktop only (set via JS --ksig-px/--ksig-py) */
@media (hover:hover) and (pointer:fine){
  .ksig-pointer-light::after{
    content:""; position:absolute; inset:0; pointer-events:none; opacity:0;
    background:radial-gradient(220px circle at var(--ksig-px,50%) var(--ksig-py,50%), rgba(255,255,255,.55), transparent 62%);
    transition:opacity .25s ease;
  }
  .ksig-pointer-light:hover::after{ opacity:.5; }
}

/* Unread notification badge — distinct "needs attention" red, separate from Loss semantic red */
.ksig-card-badge{
  display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px;
  padding:0 5px; border-radius:999px; background:var(--ksig-notif-red); color:#fff;
  font-size:10.5px; font-weight:950; line-height:1; letter-spacing:0;
}
.ksig-badge-pop{ animation:ksigBadgePop var(--ksig-t-badge) ease both; }
@keyframes ksigBadgePop{ from{ opacity:0; transform:scale(.85); } to{ opacity:1; transform:scale(1); } }
.ksig-card-label{ font-size:11.5px; font-weight:900; letter-spacing:.05em; text-transform:uppercase; color:var(--km-muted); }
.ksig-card-count{ font-size:29px; font-weight:950; letter-spacing:-.03em; color:var(--km-ink); line-height:1.15; }
.ksig-card-desc{ font-size:11.5px; color:var(--km-muted); font-weight:700; }
.ksig-card.profit .ksig-card-count{ color:#0e5f54; }
.ksig-card.loss .ksig-card-count{ color:#8a2b2b; }
.ksig-card.archive .ksig-card-count{ color:#5b6472; }
.ksig-skel-inline{ display:inline-block; width:30px; height:23px; border-radius:6px; background:linear-gradient(90deg,#f1ede2 25%,#f8f4ea 37%,#f1ede2 63%); background-size:400% 100%; animation:ksigShimmer 1.4s ease infinite; vertical-align:middle; }

@media (min-width:600px){
  .ksig-card{ padding:18px 20px; }
  .ksig-card-count{ font-size:32px; }
}

/* ---------- Recap card ---------- */
.ksig-recap-card{ background:#fff; border:1px solid var(--km-line); border-radius:var(--km-radius-lg); box-shadow:var(--km-shadow); padding:16px; }
.ksig-tabs{ display:flex; gap:6px; background:#f1ede2; border-radius:999px; padding:3px; margin-bottom:14px; position:relative; }
.ksig-tab{ flex:1; text-align:center; padding:8px 0; border-radius:999px; font-size:12px; font-weight:900; color:var(--km-muted); cursor:pointer; transition:color .2s ease, background .2s ease, box-shadow .2s ease; }
.ksig-tab.active{ background:#fff; color:var(--km-ink); box-shadow:0 4px 14px rgba(17,20,23,.08); }
.ksig-tab:hover:not(.active){ color:var(--km-ink); }

.ksig-recap-list{ display:flex; flex-direction:column; }
.ksig-recap-row{ padding:12px 0; border-bottom:1px solid var(--km-line); }
.ksig-recap-row:last-child{ border-bottom:none; }
.ksig-recap-row.sub{ padding:9px 0 9px 14px; border-bottom:1px dashed var(--km-line); }
.ksig-recap-row-top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:3px; }
.ksig-recap-row-label{ font-size:14px; font-weight:950; letter-spacing:-.01em; }
.ksig-recap-row-pips{ font-size:13.5px; font-weight:950; flex:0 0 auto; }
.ksig-recap-row-pips.pos{ color:#0e5f54; }
.ksig-recap-row-pips.neg{ color:#8a2b2b; }
.ksig-recap-row-stats{ font-size:12px; color:var(--km-muted); font-weight:700; }
.ksig-recap-tf-block{ padding:10px 0; border-bottom:1px solid var(--km-line); }
.ksig-recap-tf-block:last-child{ border-bottom:none; }
.ksig-recap-tf-heading{ font-size:11px; font-weight:950; letter-spacing:.06em; text-transform:uppercase; color:var(--km-muted); margin-bottom:4px; }
.ksig-recap-period{ font-size:11px; color:var(--km-muted); margin-top:12px; padding-top:12px; border-top:1px solid var(--km-line); }
.ksig-recap-empty{ text-align:center; padding:22px 12px; }
.ksig-recap-empty-icon{ font-size:15px; color:#8a5a12; margin-bottom:6px; }
.ksig-recap-empty-title{ font-weight:900; color:var(--km-ink); font-size:13px; margin-bottom:3px; }
.ksig-recap-empty-desc{ font-size:11.5px; color:var(--km-muted); line-height:1.5; max-width:280px; margin:0 auto; }

.ksig-recap-card{ position:relative; }
.ksig-recap-picker{ position:relative; display:flex; justify-content:flex-end; margin:0 0 10px; z-index:5; }
.ksig-recap-picker-btn{ display:flex; align-items:center; justify-content:center; width:34px; height:34px; background:#f1ede2; border:1px solid var(--km-line); border-radius:999px; color:var(--km-ink); cursor:pointer; transition:background .15s ease, border-color .15s ease; }
.ksig-recap-picker-btn:hover{ background:#e9e3d4; }
.ksig-recap-picker-menu{ position:absolute; top:calc(100% + 6px); right:0; min-width:150px; max-height:260px; overflow-y:auto; background:#fff; border:1px solid var(--km-line); border-radius:12px; box-shadow:0 12px 30px rgba(17,20,23,.14); padding:6px; display:none; z-index:20; }
.ksig-recap-picker-menu.open{ display:block; }
.ksig-recap-picker-item{ padding:8px 10px; border-radius:8px; font-size:12px; font-weight:700; color:var(--km-ink); cursor:pointer; transition:background .12s ease; }
.ksig-recap-picker-item:hover{ background:#f5f1e8; }
.ksig-recap-picker-item.active{ background:var(--km-gold); color:#fff; }

.ksig-recap-summary{ margin:14px 0 4px; padding:14px; background:#faf7f0; border:1px solid var(--km-line); border-radius:14px; }
.ksig-recap-summary-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.ksig-recap-summary-head strong{ font-size:12.5px; font-weight:900; color:var(--km-ink); }
.ksig-recap-summary-pips{ font-size:14px; font-weight:900; }
.ksig-recap-summary-pips.pos{ color:#0e5f54; }
.ksig-recap-summary-pips.neg{ color:#8a2b2b; }
.ksig-recap-summary-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.ksig-recap-summary-item{ text-align:center; }
.ksig-recap-summary-val{ display:block; font-size:15px; font-weight:900; color:var(--km-ink); }
.ksig-recap-summary-label{ display:block; font-size:10.5px; color:var(--km-muted); margin-top:2px; }
@media(max-width:480px){ .ksig-recap-summary-grid{ grid-template-columns:repeat(2,1fr); } }

.ksig-recap-customrange{ margin-bottom:14px; }
.ksig-recap-preset-row{ display:flex; flex-wrap:wrap; gap:6px; }
.ksig-recap-preset-btn{ background:#f1ede2; border:1px solid var(--km-line); border-radius:999px; padding:7px 13px; font-size:11.5px; font-weight:800; color:var(--km-ink); cursor:pointer; transition:background .15s ease, color .15s ease; }
.ksig-recap-preset-btn:hover{ background:#e9e3d4; }
.ksig-recap-preset-btn.active{ background:var(--km-gold); color:#fff; border-color:var(--km-gold); }
.ksig-recap-daterange-row{ display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }
.ksig-recap-date-input{ border:1px solid var(--km-line); border-radius:10px; padding:8px 10px; font-size:12.5px; font-weight:700; color:var(--km-ink); background:#fff; font-family:inherit; }
.ksig-recap-daterange-sep{ color:var(--km-muted); font-size:12px; }
.ksig-recap-apply-btn{ background:var(--km-gold); color:#fff; border:none; border-radius:10px; padding:8px 16px; font-size:12px; font-weight:900; cursor:pointer; transition:filter .15s ease; }
.ksig-recap-apply-btn:hover{ filter:brightness(1.06); }
@media(max-width:480px){ .ksig-recap-date-input{ flex:1; min-width:0; } }

/* ---------- Activity card ---------- */
.ksig-activity-card{ background:#fff; border:1px solid var(--km-line); border-radius:var(--km-radius-lg); box-shadow:var(--km-shadow); padding:8px 14px; }
.ksig-activity-card .ksig-list{ margin-top:0; gap:0; }
.ksig-activity-card .ksig-row{ border:none; border-radius:0; border-bottom:1px solid var(--km-line); background:transparent; box-shadow:none; padding:12px 2px; min-height:auto; }
.ksig-activity-card .ksig-row:last-child{ border-bottom:none; }
.ksig-activity-card .ksig-row:hover{ background:rgba(184,138,61,.04); }
.ksig-activity-card .ksig-empty, .ksig-activity-card .ksig-error{ padding:24px 8px; }

/* ---------- Panduan Kamar Signal ---------- */
.ksig-guide-grid{ display:grid; grid-template-columns:1fr; gap:10px; }
@media (min-width:600px){ .ksig-guide-grid{ grid-template-columns:1fr 1fr; } }
.ksig-guide-card{
  background:#fff; border:1px solid var(--km-line); border-radius:20px; padding:16px;
  display:flex; flex-direction:column; gap:8px; opacity:.72; cursor:not-allowed;
}
.ksig-guide-icon{ font-size:17px; color:#8a5a12; }
.ksig-guide-title{ font-size:13.5px; font-weight:950; }
.ksig-guide-desc{ font-size:12px; color:var(--km-muted); line-height:1.5; }
.ksig-guide-cta{ font-size:11px; font-weight:900; letter-spacing:.04em; text-transform:uppercase; color:var(--km-muted); margin-top:2px; }
.ksig-guide-card.ksig-guide-card-active{ opacity:1; cursor:pointer; text-decoration:none; color:inherit; transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.ksig-guide-card.ksig-guide-card-active:hover{ transform:translateY(-2px); box-shadow:var(--km-shadow); border-color:var(--ks-emerald,#1f6f4f); }
.ksig-guide-card.ksig-guide-card-active .ksig-guide-cta{ color:var(--ks-emerald,#1f6f4f); }
.ksig-info-list{ display:flex; flex-direction:column; gap:10px; margin-top:4px; }
.ksig-info-row{ display:flex; align-items:center; gap:12px; padding:14px; border:1px solid var(--km-line); border-radius:16px; background:#fff; opacity:.65; cursor:not-allowed; text-decoration:none; color:inherit; }
.ksig-info-row-active{ opacity:1; cursor:pointer; transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.ksig-info-row-active:hover{ transform:translateY(-1px); box-shadow:var(--km-shadow); border-color:var(--ks-emerald,#1f6f4f); }
.ksig-info-row-body{ flex:1; min-width:0; }
.ksig-info-row-title{ font-size:13.5px; font-weight:900; }
.ksig-info-row-desc{ font-size:12px; color:var(--km-muted); line-height:1.5; margin-top:2px; }
.ksig-info-row-arrow{ font-size:16px; color:var(--ks-emerald,#1f6f4f); font-weight:900; flex-shrink:0; }
.ksig-info-row-tag{ font-size:10.5px; font-weight:900; letter-spacing:.04em; text-transform:uppercase; color:var(--km-muted); flex-shrink:0; white-space:nowrap; }

/* ---------- Sticky toolbar (list view) ---------- */
.ksig-toolbar{
  position:sticky; top:52px; z-index:30; display:flex; gap:8px; padding:8px 0;
  background:rgba(249,245,237,.95); backdrop-filter:blur(10px);
}
.ksig-search{ flex:1; display:flex; align-items:center; gap:6px; background:#fff; border:1px solid var(--km-line); border-radius:999px; padding:8px 14px; }
.ksig-search input{ border:none; outline:none; background:transparent; font-size:13px; width:100%; color:var(--km-ink); }
.ksig-tool-btn{
  display:flex; align-items:center; gap:6px; height:38px; padding:0 14px; flex:0 0 auto; border-radius:999px; border:1px solid var(--km-line);
  background:#fff; font-size:12.5px; font-weight:800; color:var(--km-ink); cursor:pointer; position:relative; white-space:nowrap;
  transition:border-color .18s ease, transform .18s ease, background .18s ease;
}
.ksig-tool-btn:hover{ border-color:rgba(184,138,61,.4); }
.ksig-tool-btn:active{ transform:scale(.94); }
.ksig-tool-btn.on{ border-color:var(--km-gold); color:#8a5a12; background:rgba(184,138,61,.10); }
.ksig-tool-icon{ font-size:14px; line-height:1; }
.ksig-tool-dot{ position:absolute; top:5px; right:5px; width:7px; height:7px; border-radius:999px; background:#c43c3c; }

/* ---------- Unread summary bar (compact, per category) ---------- */
.ksig-unread-bar{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:6px 2px 10px; font-size:12px; font-weight:800; color:var(--km-muted);
}
.ksig-mark-all-btn{
  border:none; background:none; padding:0; margin:0; cursor:pointer;
  font-size:11.5px; font-weight:900; color:#8a5a12; text-decoration:none;
  transition:opacity .18s ease;
}
.ksig-mark-all-btn:hover{ opacity:.72; }
.ksig-mark-all-btn:disabled{ opacity:.4; cursor:default; }

/* ---------- Signal list rows ---------- */
.ksig-list{ display:flex; flex-direction:column; gap:8px; margin-top:4px; }
.ksig-row{
  display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--km-line);
  border-radius:16px; padding:12px 14px; min-height:68px; cursor:pointer; position:relative;
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.ksig-row:hover{ border-color:rgba(184,138,61,.35); box-shadow:0 8px 20px rgba(17,20,23,.06); }
.ksig-row:hover .ksig-row-chev{ transform:translateX(2px); color:#8a5a12; }

/* Inline Reveal (V3 Compact Progressive Reveal, Section 10) */
.ksig-row-reveal-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; margin-left:2px; padding:0; flex:0 0 auto;
  background:transparent; border:none; border-radius:8px; cursor:pointer;
  color:rgba(244,246,248,.55); font-size:17px; line-height:1;
  transform:rotate(90deg); transition:transform .22s ease, color .18s ease, background .18s ease;
}
.ksig-row-reveal-btn:hover{ color:#F4F6F8; background:rgba(244,246,248,.07); }
.ksig-row-reveal-btn[aria-expanded="true"]{ transform:rotate(-90deg); color:#c99d51; }
.ksig-row-reveal-btn:focus-visible{ outline:2px solid var(--km-gold); outline-offset:2px; }

.ksig-reveal-panel{
  max-height:0; opacity:0; overflow:hidden;
  transition:max-height .26s ease, opacity .22s ease;
}
.ksig-reveal-panel.ksig-reveal-open{ opacity:1; }
.ksig-reveal-inner{
  padding:2px 18px 16px 18px; margin-top:2px;
  border-top:1px dashed var(--km-line);
  display:flex; flex-direction:column; gap:8px;
}
.ksig-reveal-title{ font-size:10.5px; font-weight:900; letter-spacing:.05em; color:rgba(244,246,248,.5); margin-top:10px; }
.ksig-reveal-tpgrid{ display:flex; flex-wrap:wrap; gap:8px; }
.ksig-reveal-tp{ display:flex; align-items:center; gap:6px; background:rgba(244,246,248,.05); border:1px solid var(--km-line); border-radius:8px; padding:4px 10px; font-size:12px; }
.ksig-reveal-tp span{ color:rgba(244,246,248,.55); font-weight:700; }
.ksig-reveal-tp strong{ color:#F4F6F8; font-weight:900; }
.ksig-reveal-tp.cl strong{ color:#e35b5b; }
.ksig-reveal-row{ display:flex; align-items:center; justify-content:space-between; font-size:12.5px; color:rgba(244,246,248,.6); }
.ksig-reveal-row strong{ color:#F4F6F8; font-weight:800; }
.ksig-reveal-row strong.pos{ color:#3fbf8f; }
.ksig-reveal-row strong.neg{ color:#e35b5b; }
.ksig-reveal-risk{ font-size:11.5px; font-weight:700; color:#f0b74d; background:rgba(240,183,77,.08); border:1px solid rgba(240,183,77,.25); border-radius:8px; padding:7px 10px; }
.ksig-reveal-footer{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:2px; padding-top:4px; }
.ksig-reveal-id{ font-size:10.5px; color:rgba(244,246,248,.45); font-family:ui-monospace,monospace; }
.ksig-reveal-cta{ font-size:11.5px; font-weight:900; color:#c99d51; cursor:pointer; white-space:nowrap; }
.ksig-reveal-cta:hover{ text-decoration:underline; }
@media (prefers-reduced-motion: reduce){
  .ksig-reveal-panel, .ksig-row-reveal-btn{ transition:none !important; }
}
.ksig-row:active{ transform:scale(.99); }
.ksig-row-unread{ background:rgba(184,138,61,.045); }
.ksig-row-unread:hover{ background:rgba(184,138,61,.075); }
.ksig-row-unread .ksig-row-symbol{ font-weight:1000; }
.ksig-new-badge{
  display:inline-flex; align-items:center; padding:1px 7px; border-radius:999px;
  background:var(--ksig-notif-red); color:#fff; font-size:9.5px; font-weight:950;
  letter-spacing:.04em; line-height:1.6; margin-left:auto;
}
.ksig-row-main{ flex:1; min-width:0; }
.ksig-row-top{ display:flex; align-items:center; gap:6px; margin-bottom:3px; flex-wrap:wrap; }
.ksig-row-symbol{ font-weight:950; font-size:14.5px; }
.ksig-row-tf{ font-size:12px; color:var(--km-muted); font-weight:800; }
.ksig-row-info{ font-size:12.5px; color:var(--km-muted); white-space:normal; line-height:1.5; }
.ksig-row-time{ font-size:11.5px; color:var(--km-muted); margin-top:2px; font-weight:700; }
.ksig-row-result{ font-size:12.5px; font-weight:900; margin-top:3px; letter-spacing:.01em; }
.ksig-row-result.profit{ color:#3fbf8f; }
.ksig-row-result.loss{ color:#e35b5b; }
.ksig-row-chev{ color:var(--km-muted); font-size:15px; flex:0 0 auto; transition:transform .18s ease, color .18s ease; }

/* Desktop: kartu list Kamar Signal terasa kecil di layar lebar (mis. Safari macOS) --
   naikkan lagi khusus di sini, PWA/mobile pakai ukuran dasar di atas. */
@media (min-width:760px){
  .ksig-row{ padding:14px 18px; min-height:76px; }
  .ksig-row-symbol{ font-size:16px; }
  .ksig-row-tf{ font-size:13px; }
  .ksig-row-info{ font-size:14px; }
  .ksig-row-time{ font-size:12.5px; }
  .ksig-badge{ font-size:12px; padding:3px 10px; }
}

/* ---------- Empty / loading / error states ---------- */
.ksig-empty{ text-align:center; padding:40px 20px; color:var(--km-muted); font-size:13px; }
.ksig-empty-title{ font-weight:900; color:var(--km-ink); margin-bottom:4px; font-size:14px; }
.ksig-error{ text-align:center; padding:30px 20px; }
.ksig-error p{ color:#8a2b2b; font-size:13px; font-weight:700; margin-bottom:12px; }

.ksig-skel{ display:flex; flex-direction:column; gap:8px; }
.ksig-skel-row{ height:64px; border-radius:16px; background:linear-gradient(90deg,#f1ede2 25%,#f8f4ea 37%,#f1ede2 63%); background-size:400% 100%; animation:ksigShimmer 1.4s ease infinite; }
@keyframes ksigShimmer{ 0%{background-position:100% 0} 100%{background-position:0 0} }

/* ---------- Pagination / load more ---------- */.ksig-loadmore{ margin-top:12px; }

/* ---------- Signal list: flat 3-column grid (desktop, replaces old Timeframe Board) ---------- */
@media (min-width:1024px){
  #ksigListBody .ksig-list{ display:grid; grid-auto-flow:dense; grid-template-columns:repeat(3,minmax(280px,1fr)); align-items:start; row-gap:4px; column-gap:16px; }
  #ksigListBody .ksig-list > .ksig-reveal-panel{ grid-column:1 / -1; }
}

/* ---------- Executive Card header: CRITICAL badge beside pair name (not its own row) ---------- */
.ksig-xc-pairline{ position:relative; flex-wrap:nowrap !important; padding-right:44px; }
.ksig-xc-pairline > *{ flex-shrink:0; }
.ksig-badge.critical{ white-space:nowrap; }
.ksig-new-badge{ position:absolute; top:0; right:0; margin-left:0 !important; }

/* ---------- Filter sheet ---------- */
.ksig-sheet-backdrop{ position:fixed; inset:0; background:rgba(17,20,23,.42); z-index:60; display:flex; align-items:flex-end; }
.ksig-sheet{
  background:#fff; width:100%; max-width:640px; margin:0 auto; border-radius:24px 24px 0 0;
  padding:16px 16px calc(env(safe-area-inset-bottom,0px) + 16px); max-height:80vh; overflow:auto;
}
.ksig-sheet-handle{ width:36px; height:4px; border-radius:999px; background:var(--km-line); margin:0 auto 14px; }
.ksig-sheet-title{ font-weight:950; font-size:15px; margin-bottom:12px; }
.ksig-sheet-group{ margin-bottom:14px; }
.ksig-sheet-group-label{ font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.04em; color:var(--km-muted); margin-bottom:8px; }
.ksig-chip-row{ display:flex; flex-wrap:wrap; gap:8px; }
.ksig-chip-opt{ padding:8px 14px; border-radius:999px; border:1px solid var(--km-line); background:#fbf7ee; font-size:12.5px; font-weight:800; color:var(--km-ink); cursor:pointer; transition:background .18s ease, color .18s ease, border-color .18s ease; }
.ksig-chip-opt.active{ background:linear-gradient(135deg,#0e5f54,#17483f); color:#eafff5; border-color:#0e5f54; }
.ksig-sheet-actions{ display:flex; gap:10px; margin-top:16px; }
.ksig-sheet-actions .ksig-btn{ flex:1; }

/* ---------- Detail view ---------- */
.ksig-detail-head{ background:#fff; border:1px solid var(--km-line); border-radius:var(--km-radius-lg); box-shadow:var(--km-shadow); padding:18px 16px; margin-bottom:12px; }
.ksig-detail-top{ margin-bottom:10px; }
.ksig-detail-symbol{ display:block; font-size:22px; font-weight:950; letter-spacing:-.02em; margin-bottom:6px; }
.ksig-detail-meta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ksig-detail-tf{ font-size:11.5px; font-weight:900; color:var(--km-muted); }
.ksig-detail-sub{ font-size:12px; color:var(--km-muted); margin:8px 0 4px; line-height:1.5; }
.ksig-detail-rows{ display:flex; flex-direction:column; margin-top:8px; }
.ksig-detail-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--km-line); font-size:13px; }
.ksig-detail-row:last-child{ border-bottom:none; }
.ksig-detail-row span{ color:var(--km-muted); font-weight:700; flex:0 0 auto; }
.ksig-detail-row strong{ color:var(--km-ink); font-weight:900; text-align:right; }

.ksig-timeline-card{ background:#fff; border:1px solid var(--km-line); border-radius:var(--km-radius-lg); box-shadow:var(--km-shadow); padding:16px; }
.ksig-timeline-title{ font-weight:950; font-size:13.5px; margin-bottom:10px; letter-spacing:-.01em; }
.ksig-tl-item{ display:flex; gap:10px; padding:8px 0; border-bottom:1px solid var(--km-line); font-size:12.5px; }
.ksig-tl-item:last-child{ border-bottom:none; }
.ksig-tl-time{ flex:0 0 auto; width:46px; color:var(--km-muted); font-weight:800; font-size:11px; padding-top:1px; }
.ksig-tl-body strong{ display:block; font-size:12.5px; color:var(--km-ink); }
.ksig-tl-body span{ color:var(--km-muted); font-size:11.5px; }

/* ==========================================================================
Kamar Signal — Executive Luxury polish layer (v4)
Extend di atas token --km-* bersama (kamar-dashboard-identity-v2.css) dan
sistem ksig- yang sudah ada. Namespace token baru: --ksig-dark-*, --ksig-gold-metal.
Prinsip: gold sebagai aksen tipis, dark surface selektif, tanpa ubah struktur/logic.
========================================================================== */
:root{
  --ksig-dark-1:#12161c;
  --ksig-dark-2:#1c232c;
  --ksig-dark-line:rgba(212,175,120,.22);
  --ksig-dark-ink:#f3ecdd;
  --ksig-dark-muted:rgba(243,236,221,.64);
  --ksig-gold-metal:#b8863d;
}

/* ---------- Boot / splash premium ---------- */
.ksig-boot{ gap:14px; }
.ksig-boot-logo{
  width:76px; height:76px; border-radius:22px; display:block;
  opacity:0; transform:scale(.96);
  animation:ksigBootLogoIn .5s cubic-bezier(.2,.8,.2,1) forwards;
  box-shadow:0 18px 40px rgba(17,20,23,.18);
}
.ksig-boot-mark{
  font-size:14px; font-weight:950; letter-spacing:.14em; text-transform:uppercase;
  color:var(--km-ink); opacity:0; animation:ksigBootTextIn .5s ease .12s forwards;
}
.ksig-boot-sub{
  font-size:10.5px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color:var(--km-muted); opacity:0; animation:ksigBootTextIn .5s ease .22s forwards;
}
@keyframes ksigBootLogoIn{ from{ opacity:0; transform:scale(.96); } to{ opacity:1; transform:scale(1); } }
@keyframes ksigBootTextIn{ from{ opacity:0; transform:translateY(4px); } to{ opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion: reduce){
  .ksig-boot-logo, .ksig-boot-mark, .ksig-boot-sub{ animation:none; opacity:1; transform:none; }
}

/* ---------- Primary CTA: executive dark, gold jadi aksen tepi bukan fill ---------- */
.ksig-btn.primary{
  background:linear-gradient(180deg,var(--ksig-dark-2),var(--ksig-dark-1));
  color:var(--ksig-dark-ink);
  border:1px solid var(--ksig-dark-line);
  box-shadow:0 14px 30px rgba(17,20,23,.26), inset 0 1px 0 rgba(255,255,255,.05);
}
.ksig-btn.primary:hover{ border-color:rgba(212,175,120,.42); box-shadow:0 18px 36px rgba(17,20,23,.32), inset 0 1px 0 rgba(255,255,255,.06); }
.ksig-btn.primary:active{ box-shadow:0 8px 18px rgba(17,20,23,.24); }

/* ---------- Header brand accent tipis ---------- */
.ksig-header-title, .ksig-appbar-title{ display:inline-flex; align-items:center; gap:9px; }
.ksig-header-title::after, .ksig-appbar-title::after{
  content:""; display:inline-block; width:18px; height:2px; border-radius:2px;
  background:linear-gradient(90deg,var(--ksig-gold-metal),transparent);
}

/* ---------- Login page: executive composition ---------- */
.ksig-center-card{
  border-radius:24px; border:1.5px solid transparent;
  box-shadow:0 26px 64px rgba(17,20,23,.12);
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(120deg,var(--ksig-gold-metal),rgba(212,175,120,.15)) border-box;
}
.ksig-center-card h1{ letter-spacing:-.02em; }
.ksig-field input{ transition:border-color .18s ease, box-shadow .18s ease; }
.ksig-field input:focus{ outline:none; border-color:rgba(184,138,61,.55); box-shadow:0 0 0 3px rgba(184,138,61,.14); }

/* ==========================================================================
Kamar Signal — Executive Luxury polish layer v5 (deeper pass)
Fokus: login identity strip + logo, install button lebih terlihat,
overview card accent, recap tab dark-active, header icon mark.
========================================================================== */

/* ---------- Login: dark identity strip + logo badge ---------- */
.ksig-center-card{
  padding:0; overflow:visible; position:relative; text-align:center;
  border-radius:26px; border:1px solid var(--km-line);
  box-shadow:0 30px 70px rgba(17,20,23,.16), 0 10px 26px rgba(184,138,61,.10);
  background:#fff;
}
.ksig-center-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:96px; border-radius:26px 26px 0 0;
  background:
    radial-gradient(180px circle at 88% -25%, rgba(212,175,120,.38), transparent 62%),
    linear-gradient(155deg, var(--ksig-dark-2), var(--ksig-dark-1));
  border-bottom:1px solid var(--ksig-dark-line);
}
.ksig-center-card::after{
  content:""; position:absolute; top:52px; left:50%; transform:translateX(-50%);
  width:56px; height:56px; border-radius:16px; background-color:#0d1015;
  background-image:url('/signal/assets/icons/kamar-signal-icon-192-v2.png');
  background-size:70%; background-position:center; background-repeat:no-repeat;
  box-shadow:0 10px 24px rgba(17,20,23,.4), 0 0 0 4px #fff, 0 0 0 5px var(--ksig-dark-line);
}
.ksig-center-card h1{
  position:relative; z-index:1; margin:124px 26px 4px; font-size:19px; letter-spacing:-.02em;
}
.ksig-center-card > p{ padding:0 26px; margin:0 0 20px; }
.ksig-center-card form{ padding:0 26px; }
.ksig-center-card .ksig-status-line{ text-align:left; }
.ksig-center-card .ksig-field{ text-align:left; }

/* ---------- Install: lebih terlihat, bukan link kecil pudar ---------- */
.ksig-center-card .ksig-login-install{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  margin:2px 0 26px; padding:10px 20px; border-radius:999px;
  border:1px solid rgba(184,138,61,.45); background:rgba(184,138,61,.09);
  color:#8a5a12 !important; font-weight:800; font-size:12.5px; text-decoration:none;
  transition:background .18s ease, border-color .18s ease;
}
.ksig-center-card .ksig-login-install:hover{ background:rgba(184,138,61,.16); border-color:rgba(184,138,61,.65); }
.ksig-install-btn{
  background:linear-gradient(135deg, rgba(184,138,61,.18), rgba(184,138,61,.07));
  border-color:rgba(184,138,61,.5) !important; color:#8a5a12 !important;
}
.ksig-install-btn:hover{ background:rgba(184,138,61,.24); }

/* ---------- Header: icon mark kecil sebelum judul dashboard ---------- */
.ksig-header-title{ padding-left:30px; position:relative; }
.ksig-header-title::before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:22px; height:22px; border-radius:7px; background-color:#0d1015;
  background-image:url('/signal/assets/icons/kamar-signal-icon-192-v2.png');
  background-size:80%; background-position:center; background-repeat:no-repeat;
  box-shadow:0 4px 10px rgba(17,20,23,.3);
}

/* ---------- Overview card: aksen gold tipis di top saat hover ---------- */
.ksig-card{ position:relative; }
.ksig-card::before{
  content:""; position:absolute; top:0; left:16px; right:16px; height:2px; border-radius:0 0 2px 2px;
  background:linear-gradient(90deg,var(--ksig-gold-metal),transparent); opacity:0; transition:opacity .2s ease;
}
.ksig-card:hover::before{ opacity:1; }

/* ---------- Recap tab aktif: dark executive pill ---------- */
.ksig-tab.active{
  background:linear-gradient(180deg,var(--ksig-dark-2),var(--ksig-dark-1)) !important;
  color:var(--ksig-dark-ink) !important;
  box-shadow:0 6px 16px rgba(17,20,23,.28) !important;
}

/* ============================================================== */
/* v6: Dashboard executive redesign -- ALWAYS VISIBLE, tidak hover-only */
/* Card, recap, activity kini punya identitas gold/dark permanen supaya */
/* terlihat jelas di screenshot statis, bukan cuma saat kursor di atasnya. */
/* ============================================================== */

.ksig-section-label{ position:relative; padding-left:13px; color:#6b5a3d; }
.ksig-section-label::before{
  content:''; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:5px; height:5px; border-radius:50%; background:var(--ksig-gold-metal,#b8863d);
  box-shadow:0 0 0 3px rgba(184,138,61,.14);
}

.ksig-card{
  background:linear-gradient(180deg,#ffffff 0%,#fdf9ef 100%) !important;
  border:1px solid rgba(184,138,61,.26) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset, 0 10px 26px rgba(17,20,23,.07) !important;
}
.ksig-card::before{
  content:'' !important; position:absolute !important; top:0 !important; left:0 !important; right:0 !important; height:3px !important;
  border-radius:0 !important;
  background:linear-gradient(90deg,var(--ksig-gold-metal,#b8863d),rgba(184,138,61,.1) 75%,transparent) !important;
  opacity:1 !important;
}
.ksig-card.profit::before{ background:linear-gradient(90deg,#0e5f54,rgba(14,95,84,.1) 75%,transparent) !important; }
.ksig-card.aktif::before{ background:linear-gradient(90deg,#0e5f54,rgba(14,95,84,.1) 75%,transparent) !important; }
.ksig-card.loss::before{ background:linear-gradient(90deg,#8a2b2b,rgba(138,43,43,.1) 75%,transparent) !important; }
.ksig-card.archive::before{ background:linear-gradient(90deg,#5b6472,rgba(91,100,114,.1) 75%,transparent) !important; }
.ksig-card:hover{ border-color:rgba(184,138,61,.55) !important; }
.ksig-card:hover::before{ opacity:1 !important; }

.ksig-card-label{ position:relative; padding-left:13px; color:#6b5a3d; }
.ksig-card-label::before{
  content:''; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:6px; height:6px; border-radius:50%; background:var(--ksig-gold-metal,#b8863d);
}
.ksig-card.profit .ksig-card-label::before,
.ksig-card.aktif .ksig-card-label::before{ background:#0e5f54; }
.ksig-card.loss .ksig-card-label::before{ background:#8a2b2b; }
.ksig-card.archive .ksig-card-label::before{ background:#5b6472; }
.ksig-card-arrow{ color:rgba(184,138,61,.6) !important; }

.ksig-recap-card{
  background:linear-gradient(180deg,#ffffff 0%,#fdf9ef 100%) !important;
  border:1px solid rgba(184,138,61,.24) !important;
  position:relative;
}
.ksig-recap-card::before{
  content:''; position:absolute; top:0; left:18px; right:18px; height:1px;
  background:linear-gradient(90deg,transparent,rgba(184,138,61,.55),transparent);
}
.ksig-tabs{ background:var(--ksig-dark-1,#12161c) !important; }
.ksig-tab{ color:rgba(243,236,221,.5) !important; }
.ksig-tab.active{
  background:linear-gradient(160deg,#232b35,#12161c) !important;
  color:#f3ecdd !important;
  box-shadow:0 4px 14px rgba(0,0,0,.32), inset 0 0 0 1px rgba(212,175,120,.32) !important;
}
.ksig-tab:hover:not(.active){ color:#f3ecdd !important; }

.ksig-activity-card{
  background:linear-gradient(180deg,#ffffff 0%,#fdf9ef 100%) !important;
  border:1px solid rgba(184,138,61,.22) !important;
}
.ksig-activity-card .ksig-row{ position:relative; padding-left:14px; }
.ksig-activity-card .ksig-row::before{
  content:''; position:absolute; left:0; top:8px; bottom:8px; width:3px; border-radius:3px;
  background:rgba(184,138,61,.34);
}
.ksig-row-symbol{ font-weight:950 !important; letter-spacing:-.01em; }
.ksig-badge{ font-weight:950 !important; }

.ksig-empty, .ksig-recap-empty-icon{ color:#8a5a12; }

/* ================================================================== */
/* v7-FINAL: EXECUTIVE PRIVATE-BANKING PALETTE -- this copy is the one that WINS cascade (true end of file) */
/* Ivory bg, Pearl surfaces, Dark Executive selective, Deep Emerald positive, */
/* Champagne Gold thin accent only. Scoped entirely to .ksig-body / .ksig-* classes. */
/* ================================================================== */
:root{
  --ks-bg:#070A0F;
  --ks-surface:#FBFAF7;
  --ks-surface-dark:#1C2024;
  --ks-text:#151719;
  --ks-text-muted:#666B70;
  --ks-text-faint:#858A8F;
  --ks-emerald:#174C42;
  --ks-emerald-soft:rgba(23,76,66,.10);
  --ks-gold:#C6AA72;
  --ks-gold-soft:rgba(198,170,114,.16);
  --ks-danger:#963F3F;
  --ks-danger-soft:rgba(150,63,63,.10);
  --ks-warning:#9C7A3C;
  --ks-warning-soft:rgba(156,122,60,.12);
  --ks-notif-red:#e5484d;
  --ks-border:rgba(21,23,25,.10);
  --ks-border-gold:rgba(198,170,114,.40);
  --ks-shadow:0 10px 28px rgba(21,23,25,.07);
  --ks-radius:18px;
}

.ksig-body{
  background:
    radial-gradient(1200px 700px at 12% -10%, rgba(198,170,114,.07), transparent 60%),
    radial-gradient(1000px 700px at 100% 0%, rgba(23,76,66,.05), transparent 55%),
    var(--ks-bg) !important;
  color:var(--ks-text) !important;
}

.ksig-header{ background:transparent !important; }
.ksig-header-title{ color:#F4F6F8 !important; background:none !important; padding-left:0 !important; }
.ksig-header-title::before{ display:none !important; }
.ksig-header-title::after{ display:none !important; }
.ksig-header-sub{ color:var(--ks-text-muted) !important; }
.ksig-live-dot{ background:var(--ks-emerald) !important; }
.ksig-install-btn{ background:var(--ks-gold-soft) !important; border:1px solid var(--ks-border-gold) !important; color:var(--ks-emerald) !important; }
.ksig-install-btn:hover{ background:rgba(198,170,114,.26) !important; }

.ksig-center-card{
  background:var(--ks-surface) !important;
  border:1px solid var(--ks-border) !important;
  box-shadow:var(--ks-shadow) !important;
  margin-top:16vh !important;
}
.ksig-center-card::before{ display:none !important; }
.ksig-center-card::after{
  top:-34px !important;
  background-color:var(--ks-surface-dark) !important;
  box-shadow:0 12px 26px rgba(21,23,25,.28), 0 0 0 4px var(--ks-surface), 0 0 0 5px var(--ks-border-gold) !important;
}
.ksig-center-card h1{ margin:46px 26px 4px !important; color:var(--ks-text) !important; }
.ksig-center-card p{ color:var(--ks-text-muted) !important; }
.ksig-field label{ color:var(--ks-text-muted) !important; }
.ksig-field input{
  background:#fff !important; border:1px solid var(--ks-border) !important; color:var(--ks-text) !important;
}
.ksig-field input:focus{
  border-color:var(--ks-emerald) !important;
  box-shadow:0 0 0 3px var(--ks-emerald-soft), 0 0 0 1px var(--ks-gold) !important;
  outline:none !important;
}
.ksig-btn.primary{
  background:var(--ks-surface-dark) !important;
  background-image:none !important;
  border:1px solid var(--ks-surface-dark) !important;
  color:#F5F1E8 !important;
  box-shadow:none !important;
}
.ksig-btn.primary:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(21,23,25,.22) !important; }
.ksig-center-card .ksig-login-install{
  color:var(--ks-emerald) !important; border:1px solid var(--ks-border-gold) !important; background:var(--ks-gold-soft) !important;
}
.ksig-center-card .ksig-login-install:hover{ background:rgba(198,170,114,.26) !important; }

.ksig-card{
  background:var(--ks-surface) !important;
  border:1px solid var(--ks-border) !important;
  box-shadow:var(--ks-shadow) !important;
}
.ksig-card::before{
  background:linear-gradient(90deg,var(--ks-gold),rgba(198,170,114,.10) 75%,transparent) !important;
  opacity:1 !important;
}
.ksig-card.profit::before, .ksig-card.aktif::before{ background:linear-gradient(90deg,var(--ks-emerald),rgba(23,76,66,.10) 75%,transparent) !important; }
.ksig-card.loss::before{ background:linear-gradient(90deg,var(--ks-danger),rgba(150,63,63,.10) 75%,transparent) !important; }
.ksig-card.archive::before{ background:linear-gradient(90deg,var(--ks-text-faint),rgba(133,138,143,.10) 75%,transparent) !important; }
.ksig-card:hover{ border-color:var(--ks-border-gold) !important; }
.ksig-card-label{ color:var(--ks-text-muted) !important; }
.ksig-card-label::before{ background:var(--ks-gold) !important; }
.ksig-card.profit .ksig-card-label::before, .ksig-card.aktif .ksig-card-label::before{ background:var(--ks-emerald) !important; }
.ksig-card.loss .ksig-card-label::before{ background:var(--ks-danger) !important; }
.ksig-card.archive .ksig-card-label::before{ background:var(--ks-text-faint) !important; }
.ksig-card-count{ color:var(--ks-text) !important; }
.ksig-card.profit .ksig-card-count{ color:var(--ks-emerald) !important; }
.ksig-card.loss .ksig-card-count{ color:var(--ks-danger) !important; }
.ksig-card.archive .ksig-card-count{ color:var(--ks-text-faint) !important; }
.ksig-card-arrow{ color:var(--ks-gold) !important; }
.ksig-card-badge{ background:var(--ks-notif-red) !important; }

.ksig-recap-card{
  background:var(--ks-surface) !important;
  border:1px solid var(--ks-border) !important;
  box-shadow:none !important;
}
.ksig-recap-card::before{ background:linear-gradient(90deg,transparent,var(--ks-border-gold),transparent) !important; }
.ksig-tabs{ background:var(--ks-surface-dark) !important; }
.ksig-tab{ color:rgba(245,241,232,.55) !important; }
.ksig-tab.active{
  background:linear-gradient(160deg,#2A3138,var(--ks-surface-dark)) !important;
  color:#F5F1E8 !important;
  box-shadow:0 4px 14px rgba(0,0,0,.3), inset 0 0 0 1px var(--ks-border-gold) !important;
}
.ksig-tab:hover:not(.active){ color:#F5F1E8 !important; }

.ksig-activity-card{
  background:var(--ks-surface) !important;
  border:1px solid var(--ks-border) !important;
}
.ksig-activity-card .ksig-row::before{ background:var(--ks-border-gold) !important; }
.ksig-row-symbol{ color:var(--ks-text) !important; }
.ksig-badge.fresh{ background:var(--ks-gold-soft) !important; color:#8a6a2e !important; }
.ksig-badge.aktif, .ksig-badge.profit, .ksig-badge.buy{ background:var(--ks-emerald-soft) !important; color:var(--ks-emerald) !important; }
.ksig-badge.loss, .ksig-badge.sell{ background:var(--ks-danger-soft) !important; color:var(--ks-danger) !important; }

.ksig-section-label{ color:var(--ks-text-muted) !important; }
.ksig-section-label::before{ background:var(--ks-gold) !important; box-shadow:0 0 0 3px var(--ks-gold-soft) !important; }
.ksig-section-action{ color:var(--ks-emerald) !important; }

/* ---------- Access Card (masa berlaku) -- new component, uses existing state.access ---------- */
.ksig-access-card{
  position:relative; border-radius:var(--ks-radius); padding:16px 18px; margin-bottom:14px;
  background:linear-gradient(160deg,#232B35,var(--ks-surface-dark)); color:#F5F1E8;
  box-shadow:0 10px 26px rgba(21,23,25,.18);
  display:flex; flex-direction:column; justify-content:space-between; min-height:132px;
}
.ksig-access-top-group{ display:flex; flex-direction:column; }
.ksig-access-foot{
  display:flex; align-items:center; gap:7px; margin-top:14px; padding-top:10px;
  border-top:1px solid rgba(245,241,232,.14);
}
.ksig-access-card.expired .ksig-access-foot{ border-top-color:var(--ks-border); }
.ksig-access-foot-icon{ font-size:12px; color:var(--ks-gold); line-height:1; }
.ksig-access-foot-text{ font-size:10.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:rgba(245,241,232,.55); }
.ksig-access-card.expired .ksig-access-foot-text{ color:var(--ks-text-muted); }
.ksig-access-card.warn{ background:linear-gradient(160deg,#3A2E1B,var(--ks-surface-dark)); }
.ksig-access-card.expired{ background:var(--ks-surface); color:var(--ks-text); border:1px solid var(--ks-border); box-shadow:var(--ks-shadow); }
.ksig-access-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.ksig-access-label{ font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; color:rgba(245,241,232,.7); }
.ksig-access-card.expired .ksig-access-label{ color:var(--ks-text-muted); }
.ksig-access-status{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:900; letter-spacing:.04em; color:var(--ks-gold); }
.ksig-access-card.expired .ksig-access-status{ color:var(--ks-danger); }
.ksig-access-dot{ width:6px; height:6px; border-radius:50%; background:currentColor; display:inline-block; }
.ksig-access-days{ font-size:20px; font-weight:950; letter-spacing:-.01em; margin-bottom:2px; }
.ksig-access-until{ font-size:12.5px; color:rgba(245,241,232,.65); }
.ksig-access-card.expired .ksig-access-until{ color:var(--ks-text-muted); }
.ksig-access-source{ font-size:11.5px; color:var(--ks-gold); margin-top:6px; font-weight:700; }

/* ---------- Install Card (PWA) -- new component, wraps existing install functions ---------- */
.ksig-install-card{
  position:relative; border-radius:var(--ks-radius); padding:18px; margin-bottom:14px;
  background:linear-gradient(160deg,#1E3D36,var(--ks-emerald)); color:#F5F1E8;
  box-shadow:0 10px 26px rgba(23,76,66,.22);
  display:flex; flex-direction:column; gap:10px;
}
.ksig-install-card.installed{ background:var(--ks-surface); color:var(--ks-text); border:1px solid var(--ks-border); box-shadow:var(--ks-shadow); flex-direction:row; align-items:center; }
.ksig-install-icon{ font-size:18px; color:var(--ks-gold); line-height:1; }
.ksig-install-card.installed .ksig-install-icon{ color:var(--ks-emerald); }
.ksig-install-title{ font-size:12px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; color:var(--ks-gold); margin-bottom:4px; }
.ksig-install-card.installed .ksig-install-title{ color:var(--ks-emerald); }
.ksig-install-desc{ font-size:13px; line-height:1.5; color:rgba(245,241,232,.82); max-width:440px; }
.ksig-install-card.installed .ksig-install-desc{ color:var(--ks-text-muted); }
.ksig-install-card-btn{
  align-self:flex-start; margin-top:2px; padding:11px 20px; border-radius:12px; border:none; cursor:pointer;
  background:#F5F1E8; color:var(--ks-surface-dark); font-weight:900; font-size:13px;
  transition:transform .18s ease, box-shadow .18s ease;
}
.ksig-install-card-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.22); }
@media (min-width:600px){
  .ksig-install-card{ flex-direction:row; align-items:center; justify-content:space-between; }
  .ksig-install-card-btn{ align-self:center; margin-top:0; white-space:nowrap; }
}


/* ============================================================
   v8: List / Detail / Timeline / Appbar -- align to v7-FINAL tokens
   Scoped .ksig-* only. Additive polish, no logic touched.
   ============================================================ */
.ksig-appbar{ background:var(--ks-bg) !important; }
.ksig-appbar.scrolled{ background:rgba(243,240,232,.92) !important; border-bottom-color:var(--ks-border) !important; box-shadow:var(--ks-shadow) !important; }
.ksig-appbar-back{ background:var(--ks-surface) !important; border-color:var(--ks-border) !important; color:var(--ks-text) !important; }
.ksig-appbar-title{ color:var(--ks-text) !important; }

.ksig-row{ background:var(--ks-surface) !important; border:1px solid var(--ks-border) !important; border-radius:var(--ks-radius) !important; box-shadow:none !important; }
.ksig-row:hover{ border-color:var(--ks-border-gold) !important; box-shadow:var(--ks-shadow) !important; }
.ksig-row-chev{ color:var(--ks-gold) !important; }

.ksig-detail-head{ background:var(--ks-surface) !important; border:1px solid var(--ks-border) !important; border-radius:var(--ks-radius) !important; box-shadow:var(--ks-shadow) !important; position:relative; overflow:hidden; }
.ksig-detail-head::before{ content:''; position:absolute; left:0; right:0; top:0; height:3px; background:var(--ks-gold); opacity:.55; }
.ksig-detail-row{ border-bottom-color:var(--ks-border) !important; }
.ksig-detail-symbol{ color:var(--ks-text) !important; }

.ksig-timeline-card{ background:var(--ks-surface) !important; border:1px solid var(--ks-border) !important; border-radius:var(--ks-radius) !important; box-shadow:var(--ks-shadow) !important; }
.ksig-timeline-title{ color:var(--ks-text) !important; }

.ksig-empty, .ksig-error{ background:var(--ks-surface) !important; border:1px solid var(--ks-border) !important; border-radius:var(--ks-radius) !important; color:var(--ks-text-muted) !important; }
.ksig-skel-row{ background:var(--ks-gold-soft) !important; }


/* v9: Boot/splash screen -- pin to locked v7 tokens */
.ksig-boot{ background:var(--ks-bg) !important; }
.ksig-boot-mark{ color:var(--ks-text) !important; }
.ksig-boot-sub{ color:var(--ks-text-muted) !important; }


/* v10: Access Card + Install Card side-by-side on wider viewports -- fixes empty-looking full-width banners on desktop */
.ksig-top-row{ display:flex; flex-direction:column; gap:14px; margin-bottom:34px; padding-bottom:22px; border-bottom:1px solid rgba(0,0,0,.07); }
.ksig-top-row .ksig-access-card, .ksig-top-row .ksig-install-card{ margin-bottom:0 !important; }
@media (min-width:760px){
  .ksig-top-row{ flex-direction:row; align-items:stretch; }
  .ksig-top-row .ksig-access-card, .ksig-top-row .ksig-install-card{ flex:1 1 0; min-width:0; }
  .ksig-top-row .ksig-install-card{ flex-direction:column; align-items:flex-start; justify-content:center; }
  .ksig-top-row .ksig-install-card .ksig-install-icon{ font-size:22px; }
}

/* ==========================================================================
   v11: Promo card (instal & notifikasi) - panduan per platform Android/iOS
   Scoped .ksig-promo* dan .ksig-install-card-actions saja. Additive.
   ========================================================================== */
.ksig-promo-tabs{ display:flex; gap:8px; margin-bottom:14px; }
.ksig-promo-tab{
  flex:1; padding:9px 10px; border-radius:12px; border:1px solid var(--ks-border);
  background:var(--ks-surface); color:var(--ks-text-muted); font-weight:900; font-size:12.5px;
  cursor:pointer; transition:background .18s ease, color .18s ease, border-color .18s ease; text-align:center;
}
.ksig-promo-tab.active{
  background:linear-gradient(135deg,#c99d51,#f1d893); color:#15120b; border-color:transparent;
  box-shadow:0 8px 20px rgba(184,138,61,.22);
}
.ksig-promo-badge{
  width:52px; height:52px; border-radius:16px; display:flex; align-items:center; justify-content:center;
  font-size:26px; margin-bottom:12px; background:var(--ks-emerald-soft);
}
.ksig-promo-badge.ios{ background:var(--ks-gold-soft); }
.ksig-promo-desc{ color:var(--ks-text-muted); font-size:13.5px; line-height:1.6; margin:0 0 16px; }
.ksig-promo-steps{ list-style:none; margin:0 0 4px; padding:0; display:flex; flex-direction:column; gap:11px; }
.ksig-promo-steps li{ display:flex; align-items:flex-start; gap:10px; font-size:13px; line-height:1.6; color:var(--ks-text); }
.ksig-promo-num{
  flex:0 0 auto; width:22px; height:22px; border-radius:999px; background:var(--ks-emerald); color:#F5F1E8;
  font-size:11px; font-weight:950; display:flex; align-items:center; justify-content:center; margin-top:1px;
}

.ksig-install-card-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:2px; }
.ksig-install-card-actions .ksig-install-card-btn{ flex:1 1 auto; text-align:center; }
.ksig-install-card-btn.ios{ background:rgba(245,241,232,.14); color:#F5F1E8; border:1px solid rgba(245,241,232,.35); }
.ksig-install-card.installed .ksig-install-card-actions{ display:none; }
@media (min-width:600px){
  .ksig-install-card-actions{ margin-top:0; }
}

/* ==========================================================================
   v12: Toast update PWA (ksigShowUpdateToast). Scoped .ksig-update-toast* saja.
   ========================================================================== */
.ksig-update-toast{
  position:fixed; left:50%; bottom:18px; transform:translateX(-50%) translateY(20px);
  opacity:0; pointer-events:none; transition:transform .25s ease, opacity .25s ease;
  z-index:80; display:flex; align-items:center; gap:12px;
  background:var(--ks-surface-dark); color:#F5F1E8; border-radius:999px;
  padding:10px 10px 10px 18px; box-shadow:0 14px 32px rgba(21,23,25,.28);
  max-width:calc(100vw - 32px);
}
.ksig-update-toast.show{ opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.ksig-update-toast-text{ font-size:13px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ksig-update-toast-btn{
  border:none; border-radius:999px; padding:8px 16px; font-weight:900; font-size:12.5px;
  background:linear-gradient(135deg,#c99d51,#f1d893); color:#15120b; cursor:pointer;
  white-space:nowrap; flex:0 0 auto;}

/* ==== KSIG info chips (list & detail rows) - ditambahkan 2026-08-24 ==== */
.ksig-info-chip{ display:inline-flex; align-items:center; padding:2px 8px; border-radius:999px; font-size:11.5px; font-weight:800; margin:0 4px 4px 0; }
.ksig-chip-zona{ background:rgba(21,23,25,.06); color:#15120b; }
.ksig-chip-area{ background:rgba(21,23,25,.06); color:#15120b; }
.ksig-chip-tp{ background:rgba(14,95,84,.14); color:#0e5f54; }
.ksig-chip-cl{ background:rgba(196,60,60,.14); color:#8a2b2b; }
.ksig-row-info{ display:flex; flex-wrap:wrap; align-items:center; }

.ksig-detail-row-zona strong, .ksig-detail-row-area strong{ background:rgba(21,23,25,.06) !important; color:#15120b !important; padding:3px 10px; border-radius:999px; font-weight:900; }
.ksig-detail-row-tp strong{ background:rgba(14,95,84,.14) !important; color:#0e5f54 !important; padding:3px 10px; border-radius:999px; font-weight:900; }
.ksig-detail-row-cl strong{ background:rgba(196,60,60,.14) !important; color:#8a2b2b !important; padding:3px 10px; border-radius:999px; font-weight:900; }

/* ==== recap toprow + kalender rentang tanggal - ditambahkan 2026-08-24 ==== */
.ksig-recap-toprow{ display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.ksig-recap-toprow .ksig-tabs{ flex:1; margin-bottom:0; }
.ksig-cal-btn{ flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:34px; height:34px; background:#f1ede2; border:1px solid var(--km-line); border-radius:999px; color:var(--km-ink); cursor:pointer; transition:background .15s ease, border-color .15s ease; }
.ksig-cal-btn:hover{ background:#e9e3d4; }

.ksig-cal-popup-backdrop{ position:fixed; inset:0; background:rgba(21,23,25,.4); z-index:200; display:flex; align-items:center; justify-content:center; padding:16px; }
.ksig-cal-popup{ background:#fff; border-radius:16px; box-shadow:0 20px 60px rgba(21,23,25,.28); padding:16px; width:100%; max-width:320px; }
.ksig-cal-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.ksig-cal-nav{ width:30px; height:30px; border-radius:999px; border:1px solid var(--km-line); background:#f8f5ec; color:var(--km-ink); font-size:16px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.ksig-cal-nav:hover{ background:#efe9d8; }
.ksig-cal-title{ font-weight:900; font-size:14px; color:var(--km-ink); }
.ksig-cal-dow{ display:grid; grid-template-columns:repeat(7,1fr); text-align:center; font-size:11px; font-weight:800; color:var(--km-muted); margin-bottom:4px; }
.ksig-cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.ksig-cal-cell{ aspect-ratio:1/1; display:flex; align-items:center; justify-content:center; font-size:12.5px; font-weight:700; color:var(--km-ink); border-radius:8px; cursor:pointer; }
.ksig-cal-cell.empty{ cursor:default; }
.ksig-cal-cell:not(.empty):not(.disabled):hover{ background:#f1ede2; }
.ksig-cal-cell.in-range{ background:rgba(184,138,61,.16); border-radius:0; }
.ksig-cal-cell.selected{ background:var(--km-gold); color:#fff; font-weight:900; }
.ksig-cal-cell.today:not(.selected){ box-shadow:inset 0 0 0 1.5px var(--km-gold); }
.ksig-cal-cell.disabled{ color:rgba(21,23,25,.25); cursor:not-allowed; }
.ksig-cal-range-label{ margin-top:10px; text-align:center; font-size:12.5px; font-weight:800; color:var(--km-ink); }
.ksig-cal-actions{ display:flex; gap:8px; margin-top:12px; }
.ksig-cal-actions .ksig-btn{ flex:1; }

/* ==== scroll wheel bulan/tahun kalender - ditambahkan 2026-08-24 ==== */
.ksig-cal-month-part, .ksig-cal-year-part{ cursor:ns-resize; padding:2px 5px; border-radius:6px; transition:background .15s ease; }
.ksig-cal-month-part:hover, .ksig-cal-year-part:hover{ background:rgba(184,138,61,.12); }


/* ==================================================================
   KAMAR SIGNAL — EXECUTIVE DESKTOP REFINEMENT (Phase 2, additive)
   Scope: desktop only (min-width:1024px), matches existing breakpoint.
   Dark executive shell + light data-surface hybrid (cards untouched --
   they already use var(--ks-surface)/var(--ks-text) correctly and stay
   as premium light "paper" surfaces floating on the dark shell).
   Does not edit any rule above -- pure cascade override, mobile/tablet
   untouched per KAMAR_MASTER_PROMPT_KAMAR_SIGNAL_EXECUTIVE_DESKTOP.
   ================================================================== */
@media (min-width:1024px){
  .ksig-body{
    background:
      radial-gradient(1200px 700px at 12% -10%, rgba(198,170,114,.05), transparent 60%),
      radial-gradient(1100px 800px at 100% 0%, rgba(31,111,79,.12), transparent 55%),
      radial-gradient(900px 700px at 50% 110%, rgba(198,170,114,.03), transparent 62%),
      #070A0F !important;
    color:#F4F6F8 !important;
  }
  .ksig-main{ max-width:960px !important; }
  .ksig-appbar-inner, .ksig-header-row{ max-width:960px !important; }
  .ksig-appbar{ background:rgba(11,16,23,.72) !important; border-bottom-color:rgba(244,246,248,.08) !important; }
  .ksig-appbar.scrolled{
    background:rgba(11,16,23,.86) !important;
    backdrop-filter:blur(16px) saturate(1.4) !important;
    -webkit-backdrop-filter:blur(16px) saturate(1.4) !important;
    box-shadow:0 6px 24px rgba(0,0,0,.35) !important;
  }
  .ksig-appbar-back{
    background:rgba(244,246,248,.06) !important;
    border-color:rgba(244,246,248,.16) !important;
    color:#F4F6F8 !important;
  }
  .ksig-header-title{ color:#F4F6F8 !important; }
  .ksig-header-sub{ color:rgba(244,246,248,.64) !important; }
  .ksig-boot-mark{ color:#F4F6F8 !important; }
  .ksig-boot-sub{ color:rgba(244,246,248,.55) !important; }
  .ksig-boot .ksig-error p{ color:rgba(244,246,248,.72) !important; }

  /* Section labels sit directly on the dark shell between cards */
  .ksig-section-label, .ksig-block > .ksig-section-label{ color:rgba(244,246,248,.5) !important; }

  /* Restrained pointer-follow gloss: subtle, no hard white hotspot */
  .ksig-pointer-light::after{
    background:radial-gradient(260px circle at var(--ksig-px,50%) var(--ksig-py,50%), rgba(255,255,255,.10), transparent 62%) !important;
  }
  .ksig-pointer-light:hover::after{ opacity:.65 !important; }
}


/* =====================================================================
   KAMAR SIGNAL - FULL DARK CARD SURFACE (Phase 2b, additive)
   User explicitly confirmed after reviewing screenshots: match the LIVE
   homepage's full-dark card language (facility cards = #101720), not a
   light "paper card on dark shell" hybrid. Root cause of the previous
   "cards still cream" bug: the Overview/Recap/Tabs/Guide/Field/Row/
   AppbarBack rules hardcode background:#fff / #f1ede2 directly (NOT
   var(--ks-surface)) and use the site-wide --km-line/--km-muted/--km-ink
   tokens (from kamar-dashboard-identity-v2.css) for border/text, not the
   --ks-* tokens the Phase 2 block above only touched. This block fixes
   BOTH systems in one place: token redeclaration for anything already
   using var(), PLUS direct !important overrides for the hardcoded
   selectors token overrides can't reach. Desktop-only (min-width:1024px),
   additive, does not edit any existing rule above. Mobile keeps the
   original light ivory theme untouched. */
@media (min-width:1024px){

  :root{
    --ks-surface:#101720 !important;
    --ks-bg:#0B0F14 !important;
    --ks-surface-dark:#1E2833 !important;
    --ks-text:#F4F6F8 !important;
    --ks-text-muted:#8E98A8 !important;
    --ks-text-faint:#5C6672 !important;
    --ks-border:rgba(244,246,248,.10) !important;
    --ks-shadow:0 14px 42px rgba(0,0,0,.35) !important;
    --ks-emerald-soft:rgba(66,180,140,.16) !important;
    --ks-gold-soft:rgba(198,170,114,.18) !important;
    --ks-danger-soft:rgba(229,110,105,.16) !important;
    --ks-emerald:#34D399 !important;
    --ks-danger:#F87171 !important;
    --ks-warning-soft:rgba(198,150,80,.18) !important;
    --km-line:rgba(244,246,248,.12) !important;
    --km-muted:#8E98A8 !important;
    --km-ink:#F4F6F8 !important;
  }

  .ksig-card{
    background:#101720 !important;
    border-color:rgba(244,246,248,.10) !important;
    box-shadow:0 14px 42px rgba(0,0,0,.35) !important;
  }
  .ksig-card-count, .ksig-row-symbol{ color:#F4F6F8 !important; }

  .ksig-recap-card{
    background:#101720 !important;
    border-color:rgba(244,246,248,.10) !important;
  }
  .ksig-tabs{ background:#1E2833 !important; }
  .ksig-tab{ color:rgba(244,246,248,.55) !important; }

  .ksig-guide-card{
    background:#101720 !important;
    border-color:rgba(244,246,248,.10) !important;
  }
  .ksig-guide-icon{ color:#C6AA72 !important; }
  .ksig-badge.fresh{ color:#D7B46D !important; }
  .ksig-detail-tf{ background:var(--ks-gold-soft) !important; color:#D7B46D !important; font-weight:950 !important; letter-spacing:.04em !important; padding:2px 10px !important; border-radius:999px !important; font-size:11.5px !important; }
  .ksig-chip-tp{ background:rgba(66,180,140,.18) !important; color:#34D399 !important; font-weight:800 !important; }
  .ksig-chip-cl{ background:rgba(229,110,105,.18) !important; color:#F87171 !important; font-weight:800 !important; }

  .ksig-row{
    background:#101720 !important;
    border-color:rgba(244,246,248,.10) !important;
  }
  .ksig-row:hover{ border-color:rgba(198,170,114,.35) !important; }

  .ksig-field input{
    background:rgba(244,246,248,.05) !important;
    border-color:rgba(244,246,248,.16) !important;
    color:#F4F6F8 !important;
  }
  .ksig-field input::placeholder{ color:#5C6672 !important; }

  .ksig-center-card{
    background:#101720 !important;
    border-color:rgba(244,246,248,.10) !important;
  }

  .ksig-appbar-back, .ksig-tool-btn, .ksig-install-btn{
    background:rgba(244,246,248,.06) !important;
    border-color:rgba(244,246,248,.16) !important;
  }
  .ksig-cal-nav{ background:rgba(244,246,248,.06) !important; border-color:rgba(244,246,248,.16) !important; color:#F4F6F8 !important; }
  .ksig-cal-nav:hover{ background:rgba(244,246,248,.14) !important; }
}


/* =====================================================================
   KAMAR SIGNAL - DARK SURFACE COVERAGE PART 2 (Phase 2c, additive)
   Continuation of the dark-card fix above: covers hardcoded #fff/#f1ede2/
   cream selectors NOT yet reached -- generic secondary button, custom
   date range picker + inputs, Informasi Teknis modal rows, list-page
   sticky search/filter toolbar, Detail Signal timeline card, calendar
   popup, and the bottom sheet/modal shell used by Notification Settings
   and Filter. Desktop-only (min-width:1024px), additive. */
@media (min-width:1024px){

  .ksig-btn{
    background:#1E2833 !important;
    border-color:rgba(244,246,248,.14) !important;
    color:#F4F6F8 !important;
  }
  .ksig-btn:hover{ border-color:rgba(198,170,114,.4) !important; }

  .ksig-recap-picker-menu{
    background:#1E2833 !important;
    border-color:rgba(244,246,248,.14) !important;
  }
  .ksig-recap-picker-btn:hover{ background:rgba(244,246,248,.08) !important; }
  .ksig-recap-date-input{
    background:rgba(244,246,248,.05) !important;
    border-color:rgba(244,246,248,.16) !important;
    color:#F4F6F8 !important;
  }
  .ksig-recap-summary{
    background:#0D131B !important;
    border-color:rgba(244,246,248,.10) !important;
  }
  .ksig-recap-summary-pips.pos{ color:#42B48C !important; }
  .ksig-recap-summary-pips.neg{ color:#E56E69 !important; }

  .ksig-info-row{
    background:#101720 !important;
    border-color:rgba(244,246,248,.10) !important;
  }

  .ksig-toolbar{
    background:rgba(11,16,23,.92) !important;
  }
  .ksig-search{
    background:rgba(244,246,248,.05) !important;
    border-color:rgba(244,246,248,.16) !important;
  }
  .ksig-search input{ color:#F4F6F8 !important; }
  .ksig-search input::placeholder{ color:#5C6672 !important; }

  .ksig-timeline-card{
    background:#101720 !important;
    border-color:rgba(244,246,248,.10) !important;
  }

  .ksig-cal-popup{
    background:#1E2833 !important;
  }
  .ksig-cal-popup-backdrop{ background:rgba(3,5,8,.55) !important; }

  .ksig-sheet{
    background:#131B25 !important;
  }
  .ksig-sheet-handle{ background:rgba(244,246,248,.20) !important; }
  .ksig-sheet-backdrop{ background:rgba(3,5,8,.55) !important; }
}

@media (min-width:1024px){
  .ksig-chip-opt{
    background:#101720 !important;
    border-color:rgba(244,246,248,.16) !important;
    color:#B8C2CE !important;
  }
  .ksig-chip-opt.active{
    background:linear-gradient(135deg,#0e5f54,#17483f) !important;
    color:#EAFFF5 !important;
    border-color:#0e5f54 !important;
  }
  .ksig-chip-zona, .ksig-chip-area{
    background:rgba(244,246,248,.08) !important;
    color:#B8C2CE !important;
  }
}

@media (min-width:1024px){
  .ksig-recap-preset-btn{
    background:#101720 !important;
    border-color:rgba(244,246,248,.16) !important;
    color:#B8C2CE !important;
  }
  .ksig-recap-preset-btn:hover{ background:#1a2530 !important; }

  .ksig-cal-btn{
    background:#1E2833 !important;
    border-color:rgba(244,246,248,.16) !important;
    color:#F4F6F8 !important;
  }
  .ksig-cal-btn:hover{ background:#28323d !important; }

  .ksig-cal-cell:not(.empty):not(.disabled):hover{
    background:#1E2833 !important;
  }

  .ksig-install-card-btn.android{
    background:#101720 !important;
    color:#F4F6F8 !important;
    border:1px solid rgba(244,246,248,.16) !important;
  }
}

@media (min-width:1024px){
  .ksig-recap-date-input{
    background:#101720 !important;
    border-color:rgba(244,246,248,.16) !important;
    color:#F4F6F8 !important;
    -webkit-appearance:none !important;
    color-scheme:dark !important;
  }
  .ksig-recap-date-input::-webkit-calendar-picker-indicator{
    filter:invert(1) !important;
  }
}

@media (min-width:1024px){
  #ksigCustomFrom.ksig-recap-date-input,
  #ksigCustomTo.ksig-recap-date-input{
    background:#101720 !important;
  }
}

@media (min-width:1024px){
  #ksigSearchInput,
  .ksig-search input:not([type="checkbox"]):not([type="radio"]),
  .ksig-field input:not([type="checkbox"]):not([type="radio"]),
  input.ksig-recap-date-input:not([type="checkbox"]):not([type="radio"]){
    background:#101720 !important;
    border-color:rgba(244,246,248,.16) !important;
    color:#F4F6F8 !important;
  }
  #ksigSearchInput::placeholder,
  .ksig-search input::placeholder{
    color:#5C6672 !important;
  }
}

/* ===== Signal Intelligence View (Detail redesign) ===== */
.ksig-detail-summary{ display:flex; flex-direction:column; gap:2px; padding:12px 14px; border-radius:12px; background:rgba(244,246,248,.04); border:1px solid rgba(244,246,248,.08); margin:10px 0; }
.ksig-detail-summary-tag{ font-size:11px; font-weight:900; letter-spacing:.04em; color:var(--km-muted); }
.ksig-detail-summary-title{ font-size:14px; font-weight:800; color:var(--km-ink); }
.ksig-detail-summary-pips{ font-size:20px; font-weight:950; margin-top:2px; }
.ksig-detail-summary.pos .ksig-detail-summary-pips{ color:#1E9E73; }
.ksig-detail-summary.neg .ksig-detail-summary-pips{ color:#D24B4B; }
.ksig-detail-summary.running .ksig-detail-summary-pips{ color:#1E9E73; }
.ksig-detail-summary.pos .ksig-detail-summary-tag{ color:#1E9E73; }
.ksig-detail-summary.neg .ksig-detail-summary-tag{ color:#D24B4B; }
.ksig-detail-idrow{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:8px; margin-top:6px; border-top:1px solid var(--km-line); }
.ksig-detail-idlabel{ font-size:11.5px; font-weight:700; color:var(--km-muted); word-break:break-all; }
.ksig-copy-btn{ flex:0 0 auto; border:1px solid var(--km-line); background:transparent; border-radius:999px; padding:5px 14px; font-size:11.5px; font-weight:800; color:var(--km-ink); cursor:pointer; transition:background .15s; }
.ksig-copy-btn:hover{ background:rgba(244,246,248,.06); }
.ksig-detail-meta2{ display:flex; gap:14px; flex-wrap:wrap; font-size:11px; color:var(--km-muted); margin-top:8px; }
.ksig-detail-split{ display:flex; flex-direction:column; gap:10px; margin:12px 0; }
.ksig-detail-panel{ flex:1; background:#101720; border:1px solid var(--km-line); border-radius:var(--km-radius-lg); padding:14px; }
.ksig-detail-panel-title{ font-size:11px; font-weight:900; letter-spacing:.04em; color:var(--km-muted); margin-bottom:8px; }
.ksig-detail-panel-value{ font-size:15px; font-weight:800; color:var(--km-ink); }
.ksig-detail-panel-sub{ font-size:12px; color:var(--km-muted); margin-top:2px; }
.ksig-tr-row{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:7px 0; border-bottom:1px solid rgba(244,246,248,.06); font-size:12.5px; }
.ksig-tr-row:last-child{ border-bottom:none; }
.ksig-tr-row span:first-child{ color:var(--km-muted); font-weight:700; }
.ksig-tr-row strong{ font-weight:800; color:var(--km-ink); }
.ksig-tr-row.hit strong{ color:#1E9E73; }
.ksig-tr-row.cl strong{ color:#D24B4B; }
.ksig-tr-row.cl .ksig-tr-mark{ color:#D24B4B; }
.ksig-tr-mark{ font-size:12px; color:var(--km-muted); }
.ksig-detail-panel-tr .ksig-tr-row{ display:grid; grid-template-columns:112px 1fr 22px; align-items:center; }
.ksig-detail-panel-tr .ksig-tr-row span:first-child{ text-align:left; }
.ksig-detail-panel-tr .ksig-tr-row strong{ text-align:center; }
.ksig-detail-panel-tr .ksig-tr-mark{ text-align:center; }
.ksig-tr-row.hit .ksig-tr-mark{ color:#1E9E73; }
.ksig-progress-card{ background:#101720; border:1px solid var(--km-line); border-radius:var(--km-radius-lg); padding:14px; margin:10px 0; }
.ksig-progress-title{ font-size:11px; font-weight:900; letter-spacing:.04em; color:var(--km-muted); margin-bottom:12px; }
.ksig-progress-track{ display:flex; align-items:center; }
.ksig-progress-step{ display:flex; flex-direction:column; align-items:center; gap:6px; flex:0 0 auto; }
.ksig-progress-dot{ width:10px; height:10px; border-radius:50%; background:rgba(244,246,248,.18); border:2px solid rgba(244,246,248,.24); }
.ksig-progress-step.entered .ksig-progress-dot, .ksig-progress-step.hit .ksig-progress-dot{ background:#1E9E73; border-color:#1E9E73; }
.ksig-progress-label{ font-size:9.5px; font-weight:800; color:var(--km-muted); letter-spacing:.03em; white-space:nowrap; }
.ksig-progress-step.entered .ksig-progress-label, .ksig-progress-step.hit .ksig-progress-label{ color:var(--km-ink); }
.ksig-progress-line{ flex:1 1 auto; height:2px; background:rgba(244,246,248,.14); margin:0 4px; margin-bottom:16px; min-width:10px; }
.ksig-tl-list{ display:flex; flex-direction:column; }
.ksig-tl-item2{ display:flex; gap:10px; padding:9px 0; }
.ksig-tl-icon{ flex:0 0 auto; width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:900; background:rgba(244,246,248,.08); color:var(--km-muted); }
.ksig-tl-icon.ok{ background:rgba(30,158,115,.16); color:#1E9E73; }
.ksig-tl-icon.warn{ background:rgba(214,158,46,.16); color:#D69E2E; }
.ksig-tl-icon.x{ background:rgba(210,75,75,.16); color:#D24B4B; }
.ksig-tl-content{ flex:1 1 auto; }
.ksig-tl-content .ksig-tl-time{ font-size:10.5px; font-weight:800; color:var(--km-muted); }
.ksig-tl-content strong{ display:block; font-size:12.5px; color:var(--km-ink); margin-top:1px; }
.ksig-tl-content span{ display:block; font-size:11.5px; color:var(--km-muted); margin-top:1px; }
.ksig-tl-toggle{ display:inline-block; background:none; border:none; padding:0; margin-top:5px; font-size:11px; font-weight:800; color:#c99d51; cursor:pointer; }
.ksig-tl-toggle:hover{ text-decoration:underline; }
.ksig-tl-toggle:focus-visible{ outline:2px solid var(--km-gold); outline-offset:2px; }
.ksig-tl-detail{ display:none; margin-top:6px; padding:8px 10px; background:rgba(244,246,248,.04); border:1px solid var(--km-line); border-radius:8px; font-size:11.5px; color:rgba(244,246,248,.65); line-height:1.55; }
.ksig-tl-detail.ksig-tl-open{ display:block; }
.ksig-toast-plain{ padding:10px 18px; }
@media (min-width:1024px){
  .ksig-detail-split{ flex-direction:row; }
}

/* Active filter chips (brief Section 9) */
.ksig-active-filters{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:10px 0 4px; }
.ksig-filter-chip{ display:inline-flex; align-items:center; gap:6px; padding:5px 8px 5px 12px; border-radius:999px; background:var(--ks-surface,#101720); border:1px solid var(--km-line,#2a3242); color:var(--km-ink,#e8ecf4); font-size:12px; font-weight:600; line-height:1; }
.ksig-filter-chip-x{ appearance:none; border:none; background:transparent; color:var(--km-muted,#8a93a6); cursor:pointer; font-size:14px; line-height:1; padding:2px 2px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; }
.ksig-filter-chip-x:hover{ color:var(--km-ink,#e8ecf4); background:rgba(255,255,255,0.08); }
.ksig-filter-clearall{ appearance:none; border:none; background:transparent; color:var(--km-accent,#c9a24b); font-size:12px; font-weight:700; cursor:pointer; padding:5px 4px; text-decoration:underline; text-underline-offset:2px; }
.ksig-filter-clearall:hover{ opacity:0.85; }
@media (min-width:1024px){
  .ksig-active-filters{ margin:12px 0 6px; }
}

/* ==========================================================
   EXECUTIVE SIGNAL CARD + GLOBAL BOARD PAGINATION
   (Master prompt: EXECUTIVE_CARD_3TP_PAGINATION, 2026-09-05)
   Additive only. Reuses .ksig-row as card container + existing
   --km-*/--ks-* tokens. Global pager reuses .ksig-tf-pager-btn.
   ========================================================== */
.ksig-xc{ align-items:flex-start; }
.ksig-xc .ksig-row-main{ display:flex; flex-direction:column; gap:6px; flex:1; min-width:0; }
.ksig-xc .ksig-row-reveal-btn{ margin-top:2px; flex:0 0 auto; }
.ksig-xc-pairline{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ksig-xc-pair{ font-size:16px; font-weight:950; color:var(--km-ink); letter-spacing:.2px; }
.ksig-xc-meta{ font-size:11.5px; color:var(--km-muted); font-weight:800; text-transform:uppercase; letter-spacing:.3px; }
.ksig-xc-meta .buy{ color:var(--ks-emerald); }
.ksig-xc-meta .sell{ color:var(--ks-danger); }
.ksig-xc-zone{ font-size:11px; color:var(--km-gold); font-weight:800; text-transform:uppercase; letter-spacing:.4px; }
.ksig-xc-block{ margin-top:2px; }
.ksig-xc-label{ font-size:10px; font-weight:900; color:var(--km-muted); text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
.ksig-xc-entrygrid{ display:grid; grid-template-columns:repeat(2, minmax(96px, 1fr)); gap:8px; }
.ksig-xc-tpgrid{ display:grid; grid-template-columns:repeat(3, minmax(84px, 1fr)); gap:6px; }
.ksig-xc-cell{ display:flex; flex-direction:column; gap:2px; padding:6px 8px; border:1px solid var(--km-line); border-radius:10px; }
.ksig-xc-cell strong{ white-space:nowrap; }
.ksig-xc-tpgrid strong{ font-size:11px; line-height:1.25; }
.ksig-xc-entrygrid strong{ font-size:12px; }
.ksig-xc-cell.empty strong{ color:var(--km-muted); }
.ksig-xc-sub{ font-size:9px; color:var(--km-muted); font-weight:800; text-transform:uppercase; letter-spacing:.4px; }
.ksig-xc-cell strong, .ksig-xc-row strong{ font-variant-numeric:tabular-nums; font-size:13px; font-weight:900; color:var(--km-ink); white-space:nowrap; flex-shrink:0; }
.ksig-xc-tpgrid strong{ color:var(--ks-emerald); }
.ksig-xc-tpgrid .empty strong{ color:var(--km-muted); }
.ksig-xc-row{ display:flex; align-items:center; justify-content:space-between; font-size:11.5px; color:var(--km-muted); font-weight:700; text-transform:uppercase; letter-spacing:.3px; }
.ksig-xc-row.ksig-xc-cl strong{ color:var(--ks-danger); }
.ksig-xc-divider{ height:1px; background:var(--km-line); margin:2px 0; }
.ksig-xc-running strong.pos{ color:var(--ks-emerald); }
.ksig-xc-running strong.neg{ color:var(--ks-danger); }
.ksig-xc-result{ border-radius:10px; padding:6px 8px; }
.ksig-xc-result.profit{ background:var(--ks-emerald-soft); }
.ksig-xc-result.loss{ background:var(--ks-danger-soft); }
.ksig-xc-resultval{ font-size:12.5px; font-weight:900; color:var(--km-ink); }
.ksig-xc-resultval strong.pos{ color:var(--ks-emerald); }
.ksig-xc-resultval strong.neg{ color:var(--ks-danger); }
.ksig-tf-empty{ padding:14px 8px; text-align:center; color:var(--km-muted); font-size:13px; border:1px dashed var(--km-line); border-radius:12px; }
.ksig-board-pager{ margin-top:14px; }

/* Accessibility pass: pager focus-visible + reduced-motion safety (Executive Card master prompt AA) */
.ksig-tf-pager-btn:focus-visible{ outline:2px solid var(--km-gold); outline-offset:2px; }
@media (prefers-reduced-motion: reduce){
  .ksig-xc-cell, .ksig-xc-result, .ksig-row-reveal-btn, .ksig-tf-pager-btn{ transition:none !important; }
}

/* Microinteraction gloss: hover lift + border lighten + chevron shift (Executive Card master prompt S) */
/* Reuse homepage interaction DNA: --mx/--my cursor-follow gloss sudah aktif via .ksig-pointer-light (lihat fix bindPointerLight di kamar-signal-main.js). Ini menambah lift/border/chevron, restrained (bukan neon/tilt/giant glow). */
@media (hover:hover) and (pointer:fine){
  .ksig-xc:hover{ transform:translateY(-2px); }
  .ksig-xc:hover .ksig-row-reveal-btn{ margin-left:2px; }
}
@media (prefers-reduced-motion: reduce){
  .ksig-xc:hover{ transform:none; }
  .ksig-xc:hover .ksig-row-reveal-btn{ margin-left:0; }
}