/* ============================================================
   KP STUDIO — Premium Design System
   White background · Black type · Apple-inspired minimalism
   ============================================================ */

/* ── Reset & Base ─────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:          #eef4f8;
  --bg-subtle:   #f5f8fb;
  --bg-hover:    #e7eef5;
  --bg-card:     #ffffff;
  --bg-elevated: #f9fbfd;
  --border:      #dce5ed;
  --border-med:  #c8d5df;
  --border-strong:#a9bac8;

  --text-primary:   #0f172a;
  --text-secondary: #475569;
  --text-tertiary:  #718094;
  --text-muted:     #9aa8b8;

  --accent:         #0f172a;
  --accent-hover:   #1e293b;
  --accent-light:   #e8f1f8;
  --accent-muted:   rgba(15,23,42,.075);
  --focus-ring:     rgba(45,86,128,.18);

  --green:    #16856a;
  --green-bg: #eaf7f2;
  --red:      #b45353;
  --red-bg:   #fbefef;
  --amber:    #b7791f;
  --amber-bg: #fff7e6;
  --blue:     #2c5f8f;
  --blue-bg:  #e9f3fb;

  --planet-sun:     #c8793c;
  --planet-moon:    #738397;
  --planet-mars:    #b45353;
  --planet-mercury: #16856a;
  --planet-jupiter: #a76f21;
  --planet-venus:   #a75f7d;
  --planet-saturn:  #344256;
  --planet-rahu:    #2b7c8f;
  --planet-ketu:    #a65f37;
  --planet-asc:     #2c5f8f;

  --shadow-xs:   0 1px 2px rgba(15,23,42,.035);
  --shadow-sm:   0 12px 35px rgba(65,91,118,.08), 0 1px 1px rgba(15,23,42,.03);
  --shadow-md:   0 24px 70px rgba(65,91,118,.12), 0 2px 4px rgba(15,23,42,.04);
  --shadow-lg:   0 34px 90px rgba(35,63,92,.18);

  --radius-sm:  12px;
  --radius-md:  16px;
  --radius-lg:  22px;
  --radius-xl:  28px;

  --sidebar-w:  280px;
  --topbar-h:   76px;
  --font:       'Urbanist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:  'SF Mono', 'Fira Code', 'Cascadia Code', monospace;
}

html { font-size: 15px; -webkit-font-smoothing: antialiased; }
body { font-family: var(--font); background: linear-gradient(145deg,#f8fbfe 0%,#edf4f8 44%,#e5eef6 100%); color: var(--text-primary); line-height: 1.6; }
a    { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: none; color: var(--accent-hover); }
img  { max-width: 100%; }

/* ── Layout ───────────────────────────────────────────────── */
.app-layout  { display: flex; min-height: 100vh; }
.app-sidebar { width: var(--sidebar-w); background: rgba(255,255,255,.88); backdrop-filter: blur(18px); border-right: 1px solid var(--border); position: fixed; top: 0; left: 0; height: 100vh; overflow-y: auto; display: flex; flex-direction: column; z-index: 100; }
.app-main    { margin-left: var(--sidebar-w); flex: 1; display: flex; flex-direction: column; min-height: 100vh; }
.app-topbar  { height: var(--topbar-h); background: rgba(255,255,255,.82); backdrop-filter: blur(18px); border-bottom: 1px solid var(--border); display: flex; align-items: center; padding: 0 32px; position: sticky; top: 0; z-index: 90; box-shadow: 0 1px 0 rgba(17,17,17,.03); }
.app-content { flex: 1; padding: 32px; width: 100%; max-width: 1600px; }

/* ── Sidebar ──────────────────────────────────────────────── */
.sidebar-brand { padding: 22px 18px 18px; border-bottom: 1px solid var(--border); }
.sidebar-logo  { font-size: 19px; font-weight: 800; color: var(--text-primary); letter-spacing: -.55px; }
.sidebar-logo span { color: var(--text-primary); }
.sidebar-tagline { font-size: 10px; color: var(--text-tertiary); letter-spacing: .8px; text-transform: uppercase; margin-top: 3px; }

.sidebar-nav   { flex: 1; padding: 14px 10px; }
.nav-section   { margin-bottom: 18px; }
.nav-label     { font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1.2px; padding: 0 10px; margin-bottom: 7px; }
.nav-item      { position:relative; display: flex; align-items: center; gap: 11px; padding: 10px 12px; border-radius: 12px; font-size: 14px; font-weight: 600; color: var(--text-secondary); cursor: pointer; text-decoration: none; transition: background .15s, color .15s, transform .15s; }
.nav-item:hover { background: var(--bg-hover); color: var(--text-primary); text-decoration: none; }
.nav-item.active { background: var(--text-primary); color: #fff; text-decoration: none; box-shadow: var(--shadow-xs); }
.nav-item svg  { flex-shrink: 0; opacity: .7; }
.nav-item.active svg { opacity: 1; }
.nav-badge     { margin-left: auto; font-size: 10px; background: var(--text-primary); color: #fff; padding: 2px 7px; border-radius: 999px; font-weight: 700; letter-spacing:.25px; }
.nav-badge.free { background: var(--accent-light); color: var(--text-secondary); border:1px solid var(--border); }

.sidebar-footer { padding: 14px; border-top: 1px solid var(--border); }
.user-card     { display: flex; align-items: center; gap: 11px; padding: 10px; border:1px solid var(--border); border-radius: 16px; background: var(--bg-elevated); }
.user-avatar   { width: 36px; height: 36px; border-radius: 12px; object-fit: cover; background: var(--accent-light); flex-shrink: 0; border:1px solid var(--border); }
.user-avatar-placeholder { width: 36px; height: 36px; border-radius: 12px; background: var(--text-primary); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; color: #fff; flex-shrink: 0; }
.user-name     { font-size: 13px; font-weight: 600; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; }
.user-role     { font-size: 11px; color: var(--text-tertiary); }
.user-role.premium { color: var(--accent); font-weight: 600; }

/* ── Topbar ───────────────────────────────────────────────── */
.topbar-title  { font-size: 15px; font-weight: 700; color: var(--text-primary); letter-spacing:-.15px; }
.topbar-right  { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.plan-badge    { font-size: 11px; font-weight: 700; padding: 5px 10px; border-radius: 999px; border:1px solid var(--border); letter-spacing:.2px; }
.plan-badge.free    { background: var(--bg-elevated); color: var(--text-secondary); }
.plan-badge.premium { background: var(--text-primary); color: #fff; border-color: var(--text-primary); }

/* ── Buttons ──────────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; justify-content:center; gap: 8px; padding: 10px 18px; border-radius: 12px; font-size: 14px; font-weight: 700; cursor: pointer; border: 1px solid transparent; transition: background .15s, color .15s, border-color .15s, transform .15s, box-shadow .15s; line-height: 1; text-decoration: none; white-space: nowrap; font-family: var(--font); }
.btn:hover { text-decoration: none; }
.btn:disabled { opacity: .5; pointer-events: none; }

.btn-primary   { background: var(--text-primary); color: #fff; box-shadow: 0 1px 2px rgba(17,17,17,.10), 0 8px 18px rgba(17,17,17,.10); }
.btn-primary:hover { background: var(--accent-hover); box-shadow: 0 1px 2px rgba(17,17,17,.12), 0 12px 24px rgba(17,17,17,.14); transform: translateY(-1px); color: #fff; }
.btn-secondary { background: var(--bg-card); color: var(--text-primary); border: 1px solid var(--border); box-shadow: var(--shadow-xs); }
.btn-secondary:hover { border-color: var(--border-med); background: var(--bg-elevated); color: var(--text-primary); }
.btn-ghost     { background: transparent; color: var(--text-secondary); }
.btn-ghost:hover { background: var(--bg-hover); color: var(--text-primary); }
.btn-danger    { background: var(--red); color: #fff; }
.btn-danger:hover { background: #8f1b13; color: #fff; }
.btn-sm  { padding: 6px 13px; font-size: 13px; }
.btn-lg  { padding: 13px 28px; font-size: 15px; }
.btn-icon{ padding: 8px; border-radius: var(--radius-sm); }

/* ── Cards ────────────────────────────────────────────────── */
.card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); overflow: hidden; }
.card-header { padding: 18px 22px 0; display: flex; align-items: center; justify-content: space-between; gap:14px; }
.card-title  { font-size: 14px; font-weight: 800; color: var(--text-primary); letter-spacing:-.1px; }
.card-body   { padding: 18px 22px; }
.card-footer { padding: 16px 24px; border-top: 1px solid var(--border); background: var(--bg-subtle); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.card-sm .card-body { padding: 16px; }

/* ── Form elements ────────────────────────────────────────── */
.form-group  { margin-bottom: 16px; }
.form-label  { display: block; font-size: 11px; font-weight: 800; color: var(--text-secondary); margin-bottom: 7px; text-transform: uppercase; letter-spacing: .65px; }
.form-control{ width: 100%; min-height:42px; padding: 10px 13px; background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; font-size: 14px; font-family: var(--font); color: var(--text-primary); transition: border-color .15s, box-shadow .15s, background .15s; }
.form-control:focus { outline: none; border-color: var(--text-primary); box-shadow: 0 0 0 4px var(--focus-ring); }
.form-control::placeholder { color: var(--text-muted); }
.form-hint   { font-size: 12px; color: var(--text-tertiary); margin-top: 4px; }
.form-row    { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.form-row-3  { grid-template-columns: repeat(3, 1fr); }
.form-row-4  { grid-template-columns: repeat(4, 1fr); }

/* ── Tables ───────────────────────────────────────────────── */
.table-wrap  { overflow-x: auto; border-radius: var(--radius-lg); border: 1px solid var(--border); background: var(--bg-card); }
table        { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
thead th     { background: #f8f8f7; color: var(--text-tertiary); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .9px; padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--border); white-space: nowrap; }
tbody td     { padding: 12px 14px; border-bottom: 1px solid var(--border); color: var(--text-secondary); vertical-align: middle; }
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover td { background: var(--bg-subtle); }
.td-planet   { font-weight: 600; color: var(--text-primary); display: flex; align-items: center; gap: 8px; }
.td-mono     { font-family: var(--font-mono); font-size: 12px; color: var(--text-primary); }
.td-number   { font-weight: 700; color: var(--text-primary); }

/* ── Planet colour dots ───────────────────────────────────── */
.planet-dot  { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.pd-Sun      { background: var(--planet-sun); }
.pd-Moon     { background: var(--planet-moon); }
.pd-Mars     { background: var(--planet-mars); }
.pd-Mercury  { background: var(--planet-mercury); }
.pd-Jupiter  { background: var(--planet-jupiter); }
.pd-Venus    { background: var(--planet-venus); }
.pd-Saturn   { background: var(--planet-saturn); }
.pd-Rahu     { background: var(--planet-rahu); }
.pd-Ketu     { background: var(--planet-ketu); }
.pd-Ascendant{ background: var(--planet-asc); }

/* ── Badges ───────────────────────────────────────────────── */
.badge       { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 20px; }
.badge-retro { background: var(--red-bg); color: var(--red); }
.badge-combust { background: var(--amber-bg); color: var(--amber); }
.badge-exalted { background: var(--green-bg); color: var(--green); }
.badge-debil   { background: var(--red-bg); color: var(--red); }
.badge-mool    { background: var(--blue-bg); color: var(--blue); }
.badge-running { background: var(--accent-light); color: var(--accent); }

/* ── KP Chart SVG area ────────────────────────────────────── */
.chart-grid  { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.chart-svg-wrap { background: linear-gradient(180deg,#fff 0%,#fbfbfa 100%); border: 1px solid var(--border); border-radius: var(--radius-xl); padding: 20px; box-shadow: var(--shadow-sm); }
.chart-svg-title { font-size: 12px; font-weight: 600; color: var(--text-tertiary); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 12px; }
.chart-canvas { width: 100%; aspect-ratio: 1; }

/* ── Dasha tree ───────────────────────────────────────────── */
.dasha-list  { display: flex; flex-direction: column; gap: 6px; }
.dasha-item  { border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; background: var(--bg-card); transition: border-color .2s, box-shadow .2s; }
.dasha-item.running { border-color: var(--accent); }
.dasha-head  { display: flex; align-items: center; gap: 12px; padding: 12px 16px; cursor: pointer; user-select: none; }
.dasha-head:hover { background: var(--bg-subtle); }
.dasha-lord  { font-size: 14px; font-weight: 700; color: var(--text-primary); min-width: 80px; }
.dasha-item.running .dasha-lord { color: var(--accent); }
.dasha-dates { font-size: 12px; color: var(--text-tertiary); font-family: var(--font-mono); }
.dasha-arrow { margin-left: auto; color: var(--text-muted); transition: transform .2s; font-size: 12px; }
.dasha-item.open .dasha-arrow { transform: rotate(90deg); }
.dasha-body  { display: none; padding: 4px 16px 12px; }
.dasha-item.open .dasha-body { display: block; }

.bhukti-list { display: flex; flex-direction: column; gap: 4px; }
.bhukti-item { border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-subtle); overflow: hidden; }
.bhukti-item.running { border-color: var(--accent); background: var(--accent-muted); }
.bhukti-head { display: flex; align-items: center; gap: 10px; padding: 8px 14px; cursor: pointer; font-size: 13px; }
.bhukti-lord { font-weight: 600; color: var(--text-primary); min-width: 72px; }
.bhukti-item.running .bhukti-lord { color: var(--accent); }
.bhukti-body { display: none; padding: 4px 14px 10px; }
.bhukti-item.open .bhukti-body { display: block; }

.antara-table { width: 100%; font-size: 12px; margin-top: 6px; }
.antara-table td { padding: 4px 8px; border-bottom: 1px solid var(--border); color: var(--text-secondary); }
.antara-table tr.running td { background: var(--accent-muted); color: var(--accent); font-weight: 600; }
.antara-table tr:last-child td { border: none; }

/* ── Significator grid ────────────────────────────────────── */
.sig-grid    { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.sig-card    { background: var(--bg-subtle); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 14px; }
.sig-house   { font-size: 11px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; }
.sig-level   { margin-bottom: 6px; }
.sig-level-label { font-size: 10px; color: var(--text-muted); margin-bottom: 3px; font-weight: 600; }
.sig-planets { display: flex; flex-wrap: wrap; gap: 4px; }
.sig-planet  { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 20px; background: var(--accent-light); color: var(--accent); }
.sig-planet.empty { background: var(--bg-hover); color: var(--text-muted); font-weight: 400; font-style: italic; }

/* ── KP Points panel ──────────────────────────────────────── */
.kp-points-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.kp-point-card  { background: var(--bg-subtle); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 16px; }
.kp-point-name  { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); margin-bottom: 6px; }
.kp-point-deg   { font-size: 15px; font-weight: 700; color: var(--text-primary); font-family: var(--font-mono); }
.kp-point-meta  { font-size: 12px; color: var(--text-tertiary); margin-top: 4px; }

/* ── Aspect table ─────────────────────────────────────────── */
.asp-benefic  { color: var(--green); font-weight: 600; }
.asp-malefic  { color: var(--red); font-weight: 600; }
.asp-special  { color: var(--accent); font-weight: 600; }
.asp-neutral  { color: var(--text-secondary); }
.asp-bar      { height: 4px; border-radius: 2px; background: var(--border); overflow: hidden; }
.asp-bar-fill { height: 100%; border-radius: 2px; }

/* ── Dashboard stats ──────────────────────────────────────── */
.stat-grid   { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 28px; }
.stat-card   { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 20px 22px; box-shadow: var(--shadow-xs); }
.stat-label  { font-size: 11px; font-weight: 600; color: var(--text-tertiary); text-transform: uppercase; letter-spacing: .8px; margin-bottom: 8px; }
.stat-value  { font-size: 28px; font-weight: 700; color: var(--text-primary); line-height: 1; }
.stat-sub    { font-size: 12px; color: var(--text-tertiary); margin-top: 6px; }
.stat-icon   { float: right; width: 40px; height: 40px; border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; margin-top: -4px; }

/* ── Premium gate overlay ─────────────────────────────────── */
.premium-gate { position: relative; }
.premium-gate-overlay { position: absolute; inset: 0; background: rgba(255,255,255,.88); backdrop-filter: blur(8px); border-radius: var(--radius-lg); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; z-index: 10; border: 1px dashed var(--border-strong); }
.premium-gate-icon { font-size: 32px; }
.premium-gate-text { font-size: 14px; font-weight: 600; color: var(--text-primary); text-align: center; }
.premium-gate-sub  { font-size: 12px; color: var(--text-tertiary); text-align: center; }

/* ── Tabs ─────────────────────────────────────────────────── */
.tab-bar  { display: flex; gap: 4px; background: #f3f3f1; border: 1px solid var(--border); border-radius: 14px; padding: 4px; margin-bottom: 20px; width: fit-content; max-width:100%; overflow-x:auto; }
.tab-btn  { padding: 8px 16px; border-radius: 10px; font-size: 13px; font-weight: 700; color: var(--text-secondary); cursor: pointer; border: none; background: transparent; transition: all .15s; white-space:nowrap; }
.tab-btn.active { background: var(--bg-card); color: var(--text-primary); font-weight: 800; box-shadow: var(--shadow-xs); }
.tab-pane { display: none; }
.tab-pane.active { display: block; }

/* ── North Indian Chart ───────────────────────────────────── */
.ni-chart { position: relative; }
.ni-chart svg text { font-family: var(--font); }

/* ── South Indian Chart ───────────────────────────────────── */
.si-chart { position: relative; }

/* ── Alerts / Toasts ──────────────────────────────────────── */
.alert      { padding: 12px 16px; border-radius: var(--radius-sm); font-size: 13px; margin-bottom: 16px; display: flex; align-items: flex-start; gap: 10px; }
.alert-info { background: var(--blue-bg); color: var(--blue); border: 1px solid #bfdbfe; }
.alert-success { background: var(--green-bg); color: var(--green); border: 1px solid #bbf7d0; }
.alert-warn { background: var(--amber-bg); color: var(--amber); border: 1px solid #fde68a; }
.alert-error { background: var(--red-bg); color: var(--red); border: 1px solid #fecaca; }

.toast-container { position: fixed; bottom: 24px; right: 24px; z-index: 9999; display: flex; flex-direction: column; gap: 8px; }
.toast { background: var(--text-primary); color: #fff; padding: 12px 18px; border-radius: var(--radius-md); font-size: 13px; box-shadow: var(--shadow-lg); animation: slideUp .25s ease; max-width: 340px; }
.toast.success { background: var(--green); }
.toast.error   { background: var(--red); }
@keyframes slideUp { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }

/* ── Loading spinner ──────────────────────────────────────── */
.spinner { width: 20px; height: 20px; border: 2px solid var(--border); border-top-color: var(--accent); border-radius: 50%; animation: spin .7s linear infinite; }
.spinner-lg { width: 36px; height: 36px; border-width: 3px; }
@keyframes spin { to { transform: rotate(360deg); } }
.loading-overlay { position: absolute; inset: 0; background: rgba(255,255,255,.7); display: flex; align-items: center; justify-content: center; border-radius: var(--radius-lg); z-index: 20; }

/* ── Autocomplete ─────────────────────────────────────────── */
.autocomplete-wrap { position: relative; }
.autocomplete-drop { position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: var(--bg-card); border: 1.5px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-md); z-index: 200; max-height: 240px; overflow-y: auto; display: none; }
.autocomplete-drop.open { display: block; }
.autocomplete-item { padding: 10px 14px; font-size: 13px; color: var(--text-secondary); cursor: pointer; border-bottom: 1px solid var(--border); transition: background .1s; }
.autocomplete-item:last-child { border-bottom: none; }
.autocomplete-item:hover, .autocomplete-item.selected { background: var(--accent-muted); color: var(--accent); }
.autocomplete-item strong { color: var(--text-primary); }

/* ── Client cards ─────────────────────────────────────────── */
.client-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.client-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 20px; box-shadow: var(--shadow-xs); transition: all .2s; }
.client-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.client-initials { width: 44px; height: 44px; border-radius: 50%; background: var(--accent-light); color: var(--accent); display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; margin-bottom: 12px; }
.client-name { font-size: 15px; font-weight: 600; color: var(--text-primary); margin-bottom: 4px; }
.client-meta { font-size: 12px; color: var(--text-tertiary); }
.client-actions { margin-top: 14px; display: flex; gap: 8px; }

/* ── Billing page ─────────────────────────────────────────── */
.pricing-card { max-width: 480px; margin: 0 auto; background: var(--bg-card); border: 1px solid var(--text-primary); border-radius: 28px; padding: 38px; text-align: center; box-shadow: var(--shadow-lg); }
.pricing-plan  { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--accent); margin-bottom: 12px; }
.pricing-price { font-size: 48px; font-weight: 800; color: var(--text-primary); line-height: 1; }
.pricing-price sup { font-size: 20px; vertical-align: top; margin-top: 10px; }
.pricing-price sub { font-size: 16px; font-weight: 400; color: var(--text-tertiary); }
.pricing-features { text-align: left; margin: 24px 0; }
.pricing-feature { display: flex; align-items: center; gap: 10px; padding: 6px 0; font-size: 14px; color: var(--text-secondary); }
.pricing-check  { width: 18px; height: 18px; background: var(--green-bg); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--green); font-size: 10px; font-weight: 700; }

/* ── Page headers ─────────────────────────────────────────── */
.page-header { margin-bottom: 20px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.page-title  { font-size: 25px; font-weight: 850; color: var(--text-primary); letter-spacing: -.6px; line-height:1.15; }
.page-sub    { font-size: 14px; color: var(--text-tertiary); margin-top: 6px; }

/* ── Misc utilities ───────────────────────────────────────── */
.flex   { display: flex; }
.items-center { align-items: center; }
.gap-2  { gap: 8px; }
.gap-3  { gap: 12px; }
.mt-4   { margin-top: 16px; }
.mt-6   { margin-top: 24px; }
.mb-4   { margin-bottom: 16px; }
.mb-6   { margin-bottom: 24px; }
.text-sm { font-size: 13px; }
.text-muted { color: var(--text-tertiary); }
.font-mono  { font-family: var(--font-mono); }
.hidden     { display: none !important; }
.truncate   { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Responsive ───────────────────────────────────────────── */


/* ============================================================
   Monochrome SaaS refinement layer
   Keeps existing markup/selectors intact; improves visual polish.
   ============================================================ */
:focus-visible { outline: 2px solid var(--text-primary); outline-offset: 2px; }
::selection { background: #111; color: #fff; }
button, input, select, textarea { font: inherit; }
select.form-control { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--text-tertiary) 50%), linear-gradient(135deg, var(--text-tertiary) 50%, transparent 50%); background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; padding-right: 36px; }
textarea.form-control { min-height: 96px; resize: vertical; }
.card:hover, .stat-card:hover, .client-card:hover { border-color: var(--border-med); }
.stat-grid { gap: 18px; }
.stat-card { border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); background: linear-gradient(180deg,#fff 0%,#fbfbfa 100%); }
.stat-label { font-weight: 800; letter-spacing: .9px; }
.stat-value { font-size: 30px; letter-spacing: -.9px; }
.badge, .st-badge, .nav-badge, .plan-badge { border: 1px solid var(--border); }
.badge-running, .sig-planet, .pricing-check, .plan-feat .ck { background: var(--accent-light); color: var(--text-primary); }
.alert { border-radius: 14px; border-width: 1px; }
.alert-info { background:#f5f7fb; color:#334155; border-color:#dbe1ea; }
.toast { border-radius: 14px; box-shadow: var(--shadow-lg); }
.chart-canvas svg { filter: drop-shadow(0 1px 1px rgba(17,17,17,.02)); }
.chart-svg-title { color: var(--text-secondary); font-weight: 800; letter-spacing: 1.1px; }
.client-card { border-radius: var(--radius-xl); box-shadow: var(--shadow-sm); }
.client-initials { border-radius: 14px; background: var(--text-primary); color: #fff; }
.btn-outline { background: #fff; color: var(--text-primary); border:1px solid var(--border); }
.btn-outline:hover { border-color: var(--text-primary); }
.muted, .text-muted { color: var(--text-tertiary) !important; }
.mono { font-family: var(--font-mono); }


/* ============================================================
   Screenshot QA fixes + premium data presentations
   - Keeps existing actions/IDs/API selectors intact.
   ============================================================ */
html, body { min-height: 100%; }
body { overflow-x: hidden; }
.app-layout { align-items: stretch; }
.app-main { min-width: 0; background: radial-gradient(circle at 50% -10%, rgba(17,17,17,.035), transparent 34%), linear-gradient(180deg,#fafaf8 0%,#f4f3f0 100%); }
.app-content { max-width: 1560px; margin: 0 auto; padding: 32px clamp(22px, 2.4vw, 40px) 44px; }

/* Sidebar hardening: prevents the unstyled/cramped rail seen in screenshots. */
.app-sidebar {
  width: var(--sidebar-w) !important;
  min-width: var(--sidebar-w) !important;
  background: rgba(255,255,255,.94) !important;
  box-shadow: inset -1px 0 0 rgba(17,17,17,.035);
}
.sidebar-brand { padding: 18px 16px 16px; }
.sidebar-brand-main { display:flex; align-items:center; gap:12px; min-width:0; }
.sidebar-logo-mark {
  width: 42px; height: 42px; border-radius: 14px;
  background:#111; color:#fff; display:flex; align-items:center; justify-content:center;
  font-size: 13px; font-weight: 850; letter-spacing:-.35px;
  box-shadow:0 1px 2px rgba(17,17,17,.14),0 12px 26px rgba(17,17,17,.12);
  flex:0 0 auto;
}
.sidebar-logo { line-height:1.1; }
.sidebar-tagline { white-space:nowrap; }
.sidebar-nav { display:flex; flex-direction:column; gap: 2px; padding: 14px 10px 16px; }
.nav-section { margin-bottom: 14px; }
.nav-item {
  min-height: 40px;
  width: 100%;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  line-height:1.15;
}
.nav-icon { width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; flex:0 0 20px; color:inherit; }
.nav-icon svg { width:15px; height:15px; display:block; }
.nav-text { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-item.active { background:#111 !important; color:#fff !important; }
.nav-item.active .nav-badge { background:#fff; color:#111; border-color:rgba(255,255,255,.4); }
.sidebar-footer { margin-top:auto; }
.user-card { min-width:0; }
.user-card > div:last-child { min-width:0; }
.user-avatar, .user-avatar-placeholder { border-radius: 14px; }

/* Topbar and page shell polish */
.app-topbar { min-width:0; }
.topbar-title { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.page-header, .dh, .ws-header, .hv-header, .hr-hdr, .rl-header { width:100%; }
.page-header .btn, .dh-right .btn, .ws-actions .btn { flex-shrink:0; }

/* Directory/list cards: a premium CRM feel instead of tiny regular rows. */
.client-directory, .chart-library, .client-chart-stack { display:flex; flex-direction:column; gap:12px; }
.client-card-row,
.chart-library-card,
.client-chart-card {
  display:flex; align-items:center; gap:16px;
  width:100%; padding:16px 18px;
  background:linear-gradient(180deg,#fff 0%,#fbfbfa 100%);
  border:1px solid var(--border); border-radius:20px;
  box-shadow:var(--shadow-sm);
  transition:border-color .16s, box-shadow .16s, transform .16s;
}
.client-card-row:hover,
.chart-library-card:hover,
.client-chart-card:hover { border-color:var(--border-med); box-shadow:var(--shadow-md); transform:translateY(-1px); }
.client-card-row .client-initials { margin:0; flex:0 0 auto; width:46px; height:46px; }
.client-row-main, .chart-library-main, .client-chart-main { flex:1; min-width:0; }
.client-contact { margin-top:3px; }
.client-row-stat {
  min-width:76px; padding:8px 12px; border:1px solid var(--border);
  border-radius:14px; background:#fff; color:var(--text-tertiary);
  font-size:11px; font-weight:750; text-align:center; text-transform:uppercase; letter-spacing:.6px;
}
.client-row-stat span { display:block; font-size:18px; line-height:1; color:var(--text-primary); letter-spacing:-.4px; margin-bottom:3px; }
.client-card-row .client-actions, .chart-library-actions { margin:0; display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.chart-library-mark,
.client-chart-mark {
  width:44px; height:44px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:#111; color:#fff; font-weight:850; font-size:14px; flex:0 0 auto;
  box-shadow:0 1px 2px rgba(17,17,17,.12),0 10px 22px rgba(17,17,17,.10);
}
.chart-library-mark.is-starred { color:#111; background:#fff7dd; border:1px solid #f5d77a; box-shadow:none; }
.chart-library-title, .client-chart-title { color:var(--text-primary); font-size:14px; font-weight:800; letter-spacing:-.15px; }
.chart-library-title:hover { color:#000; }
.chart-library-subtitle { color:var(--text-tertiary); font-size:12px; margin-top:2px; }
.chart-library-meta, .client-chart-meta { display:flex; flex-wrap:wrap; gap:8px 14px; margin-top:6px; color:var(--text-tertiary); font-size:12px; }
.chart-library-meta span, .client-chart-meta span { display:inline-flex; align-items:center; gap:6px; }
.chart-library-meta span:not(:last-child)::after, .client-chart-meta span:not(:last-child)::after { content:""; width:3px; height:3px; border-radius:50%; background:var(--border-strong); margin-left:6px; opacity:.7; }
.client-chart-stack { padding:14px; }
.client-chart-card { padding:13px 14px; box-shadow:none; border-radius:16px; }
.client-chart-mark { width:36px; height:36px; border-radius:12px; font-size:13px; }

/* Dashboard transit table becomes a premium card matrix while preserving <tbody id="tr-body"> JS. */
.tr-card .tt { display:block; width:100%; border-collapse:separate; }
.tr-card .tt thead { display:none; }
.tr-card .tt tbody { display:grid; grid-template-columns:repeat(auto-fit,minmax(238px,1fr)); gap:10px; padding:14px; }
.tr-card .tt tbody tr {
  display:grid; grid-template-columns:1fr 1fr; gap:8px 12px;
  padding:14px; background:#fff; border:1px solid var(--border); border-radius:17px;
  box-shadow:0 1px 2px rgba(17,17,17,.025);
}
.tr-card .tt tbody tr:hover { border-color:var(--border-med); background:#fff; }
.tr-card .tt tbody td { display:flex; align-items:center; justify-content:space-between; gap:10px; border:0 !important; padding:0 !important; min-width:0; font-size:12px; }
.tr-card .tt tbody td:first-child { grid-column:1 / -1; justify-content:flex-start; padding-bottom:4px !important; border-bottom:1px solid var(--border) !important; }
.tr-card .tt tbody td::before { content:attr(data-label); color:var(--text-muted); font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.75px; flex:0 0 auto; }
.tr-card .tt tbody td:first-child::before { display:none; }
.tr-card .tt tbody td[data-label="Status"] { grid-column:1 / -1; justify-content:flex-start; padding-top:2px !important; }
.tr-card .tt tbody td[data-label="Status"]::before { margin-right:auto; }
.tr-card .tt tbody td[colspan] { display:block; grid-column:1 / -1; text-align:center; }
.tr-card .tt tbody td[colspan]::before { display:none; }

/* Dense astrology data can stay tabular, but looks like a data console instead of a plain table. */
.ws-table-wrap, .table-wrap, .compare-wrap {
  background:linear-gradient(180deg,#fff 0%,#fbfbfa 100%) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), var(--shadow-xs) !important;
}
.ws-table, .sig-table, .compare-table, table { border-collapse:separate; border-spacing:0; }
.ws-table thead th, .sig-table thead th, .compare-table th, table thead th { position:relative; }
.ws-table tbody tr, .sig-table tbody tr { transition:background .12s, box-shadow .12s; }
.ws-table tbody tr:hover td, .sig-table tbody tr:hover td { background:#fff !important; box-shadow:inset 0 1px 0 var(--border), inset 0 -1px 0 var(--border); }
.sig-table td, .ws-table td { border-bottom:1px solid #eeece7 !important; }
.sig-table tbody tr:last-child td, .ws-table tbody tr:last-child td { border-bottom:0 !important; }

/* Horary list/research cards */
.hr-card { border-radius:22px !important; box-shadow:var(--shadow-sm) !important; }
.hr-row { padding:16px 18px !important; }
.hr-row-icon { width:40px; height:40px; border-radius:14px; background:var(--accent-light); display:flex; align-items:center; justify-content:center; }
.hr-row-badges { margin-left:auto; }
.rl-results-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:12px; padding:14px; }
.rl-result-card { border:1px solid var(--border); border-radius:18px; padding:14px; background:#fff; box-shadow:var(--shadow-xs); }
.rl-result-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.rl-result-title { font-size:13px; font-weight:800; color:var(--text-primary); }
.rl-result-question { color:var(--text-secondary); font-size:12px; line-height:1.45; min-height:34px; }
.rl-result-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }

/* Workspace balance from screenshots: tighter chart panels, cleaner gutters. */
.ws-analytics-row, .hv-main-grid { gap:18px !important; }
.ws-col, .hv-panel { overflow:hidden; }
.chart-svg-wrap { border-radius:20px; }


.hb { display:inline-flex; align-items:center; gap:5px; font-size:10px; font-weight:800; padding:3px 9px; border-radius:999px; text-transform:uppercase; letter-spacing:.35px; border:1px solid rgba(17,17,17,.06); }
.hb-open{background:#e9f3fb;color:#2c5f8f}.hb-pending{background:#fff7e6;color:#a76f21}.hb-resolved{background:#eaf7f2;color:#16856a}.hb-closed{background:#edf2f7;color:#718094}.hb-draft{background:#f3f3f1;color:var(--text-tertiary)}

/* ============================================================
   V3 — Soft premium dashboard OS theme
   Inspired by the supplied rounded financial dashboard reference.
   UI-only: keeps IDs/actions/data attributes intact.
   ============================================================ */
:root {
  --bg: #f5f3ef;
  --bg-subtle: #f0eee9;
  --bg-hover: #ebe7df;
  --bg-card: #fffdf9;
  --bg-elevated: #fffaf3;
  --border: rgba(34, 28, 22, .075);
  --border-med: rgba(34, 28, 22, .16);
  --border-strong: rgba(34, 28, 22, .28);
  --text-primary: #1b1715;
  --text-secondary: #5d554f;
  --text-tertiary: #8a8178;
  --text-muted: #b3aaa1;
  --accent: #ec624a;
  --accent-hover: #db513c;
  --accent-light: #fff0eb;
  --accent-muted: rgba(236, 98, 74, .12);
  --focus-ring: rgba(236, 98, 74, .22);
  --green-bg: #eefaf2;
  --amber-bg: #fff5df;
  --red-bg: #fff0eb;
  --blue-bg: #eef5ff;
  --shadow-xs: 0 1px 2px rgba(51, 38, 30, .03);
  --shadow-sm: 0 1px 1px rgba(51, 38, 30, .035), 0 18px 46px rgba(51, 38, 30, .055);
  --shadow-md: 0 2px 4px rgba(51, 38, 30, .045), 0 28px 74px rgba(51, 38, 30, .08);
  --shadow-lg: 0 4px 10px rgba(51, 38, 30, .08), 0 40px 100px rgba(51, 38, 30, .14);
  --radius-sm: 14px;
  --radius-md: 18px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --sidebar-w: 302px;
  --topbar-h: 74px;
}

html { background: #ece9e2; }
body {
  background:
    radial-gradient(circle at 10% -10%, rgba(236,98,74,.12), transparent 34%),
    radial-gradient(circle at 95% 10%, rgba(255,255,255,.9), transparent 36%),
    linear-gradient(135deg, #f7f5f0 0%, #efebe3 100%) !important;
  color: var(--text-primary);
  overflow-x: hidden;
}
body::before {
  content:"";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(27,23,21,.045) 1px, transparent 1px);
  background-size: 22px 22px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.36), transparent 42%);
  z-index: -1;
}

/* App shell: sidebar becomes a premium drawer opened by hamburger. */
.app-layout { display:block; min-height:100vh; }
.app-main {
  margin-left: 0 !important;
  min-height: 100vh;
  background: transparent !important;
  padding: 16px clamp(14px, 2vw, 24px) 20px;
}
.app-content {
  max-width: 1480px;
  width: 100%;
  margin: 0 auto;
  padding: 28px clamp(12px, 1.6vw, 26px) 44px;
}
.app-topbar {
  max-width: 1480px;
  height: var(--topbar-h);
  margin: 0 auto;
  padding: 0 16px 0 14px;
  position: sticky;
  top: 16px;
  z-index: 80;
  border: 1px solid rgba(255,255,255,.74) !important;
  border-radius: 30px;
  background: rgba(255,253,249,.82) !important;
  backdrop-filter: blur(24px) saturate(145%);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  box-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255,255,255,.9) !important;
}
.topbar-left { display:flex; align-items:center; gap:12px; min-width:0; }
.topbar-title-block { display:flex; flex-direction:column; min-width:0; line-height:1.1; }
.topbar-title { font-size:15px; font-weight:850; letter-spacing:-.35px; }
.topbar-kicker { font-size:12px; color:var(--text-tertiary); margin-top:3px; }
.topbar-menu-btn,
.sidebar-toggle-float {
  width: 42px; height: 42px;
  display: inline-flex; align-items:center; justify-content:center;
  border: 1px solid rgba(34,28,22,.07);
  border-radius: 16px;
  background: rgba(255,255,255,.78);
  color: var(--text-primary);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 12px 28px rgba(51,38,30,.06);
  cursor:pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}
.topbar-menu-btn:hover,
.sidebar-toggle-float:hover { transform: translateY(-1px); background:#fff; border-color:rgba(34,28,22,.14); box-shadow:var(--shadow-sm); }
.sidebar-toggle-float {
  position: fixed;
  top: 24px;
  left: 24px;
  z-index: 120;
  display: none;
}
body.sidebar-open .sidebar-toggle-float { display:none; }
.sidebar-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(22,18,15,.22);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
  z-index: 102;
}
body.sidebar-open .sidebar-backdrop { opacity:1; pointer-events:auto; }
.app-sidebar {
  top: 18px !important;
  left: 18px !important;
  height: calc(100vh - 36px) !important;
  width: var(--sidebar-w) !important;
  min-width: var(--sidebar-w) !important;
  border: 1px solid rgba(255,255,255,.78) !important;
  border-radius: 32px;
  background: rgba(255,253,249,.92) !important;
  backdrop-filter: blur(28px) saturate(150%);
  -webkit-backdrop-filter: blur(28px) saturate(150%);
  box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.92) !important;
  transform: translateX(calc(-100% - 36px));
  transition: transform .26s cubic-bezier(.2,.8,.2,1), opacity .2s ease;
  opacity: .4;
  overflow: hidden auto;
  z-index: 130;
}
.app-sidebar.open { transform: translateX(0) !important; opacity:1; }
.sidebar-brand { padding: 22px 20px 18px !important; border-bottom:0 !important; }
.sidebar-brand-main { gap:13px; }
.sidebar-logo-mark {
  width: 50px !important; height: 50px !important; border-radius: 18px !important;
  background: #101010 !important; color:#fff !important;
  box-shadow: 0 18px 42px rgba(17,17,17,.18), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.sidebar-logo { font-size: 18px; font-weight:900; letter-spacing:-.5px; }
.sidebar-tagline { font-size:12px; letter-spacing:0; text-transform:none; }
.sidebar-nav { padding: 10px 14px 16px !important; gap:10px; }
.nav-section { padding: 6px; border-radius: 22px; background: rgba(255,255,255,.38); border: 1px solid rgba(34,28,22,.045); }
.nav-label { padding: 4px 10px 8px; font-size: 10px; letter-spacing:.9px; color:var(--text-muted); }
.nav-item {
  min-height: 46px !important;
  padding: 12px 12px !important;
  border-radius: 17px !important;
  font-size: 14px;
  font-weight: 760;
  color: var(--text-secondary);
}
.nav-item:hover { background: rgba(236,98,74,.08) !important; color: var(--text-primary); transform: translateX(2px); }
.nav-item.active {
  background: #1b1715 !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(27,23,21,.16) !important;
}
.nav-icon { width:26px !important; height:26px !important; border-radius:10px; background:rgba(255,255,255,.5); }
.nav-item.active .nav-icon { background:rgba(255,255,255,.16); }
.nav-badge.free { background: var(--accent-light) !important; color: var(--accent) !important; border-color: rgba(236,98,74,.18) !important; }
.sidebar-footer { padding: 14px 16px 18px !important; border-top:0 !important; }
.user-card {
  border: 1px solid rgba(34,28,22,.07) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.62) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
}
.user-avatar, .user-avatar-placeholder { width:42px; height:42px; border-radius:16px !important; }

.topbar-right { gap: 10px; }
.topbar-user {
  display:flex; align-items:center; gap:10px;
  min-width:0;
  padding: 7px 10px 7px 8px;
  border-radius: 22px;
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(34,28,22,.055);
}
.topbar-avatar, .topbar-avatar-placeholder {
  width: 42px; height:42px; border-radius:16px; object-fit:cover; flex:0 0 auto;
  border: 2px solid #fff; box-shadow: 0 8px 22px rgba(51,38,30,.10);
}
.topbar-avatar-placeholder { display:flex; align-items:center; justify-content:center; background:#111; color:#fff; font-weight:850; }
.topbar-user-copy { display:flex; flex-direction:column; line-height:1.08; min-width:0; max-width:150px; }
.topbar-user-copy span { font-size:12.5px; font-weight:800; color:var(--text-primary); overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.topbar-user-copy small { font-size:11px; color:var(--text-tertiary); margin-top:4px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.plan-badge {
  border-radius: 999px !important;
  padding: 7px 11px !important;
  background: rgba(255,255,255,.72) !important;
  color: var(--text-secondary) !important;
  border-color: rgba(34,28,22,.07) !important;
}
.plan-badge.premium { background:#111 !important; color:#fff !important; border-color:#111 !important; }

/* Soft reference-style buttons, cards and forms. */
.btn, .btn-new-chart, .rfbtn, .ws-btn, .ts-search-btn, .nc-btn-generate, .prem-gate-btn, .up-cta {
  border-radius: 18px !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease, color .18s ease !important;
}
.btn-primary, .btn-new-chart, .nc-btn-generate, .ts-search-btn, .up-cta, .prem-gate-btn {
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  color:#fff !important;
  box-shadow: 0 16px 34px rgba(236,98,74,.22), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
.btn-primary:hover, .btn-new-chart:hover, .nc-btn-generate:hover, .ts-search-btn:hover, .up-cta:hover, .prem-gate-btn:hover {
  background: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
  transform: translateY(-1px);
  box-shadow: 0 20px 44px rgba(236,98,74,.28) !important;
}
.btn-secondary, .btn-ghost, .rfbtn, .ws-btn-ghost {
  background: rgba(255,255,255,.7) !important;
  border: 1px solid rgba(34,28,22,.07) !important;
  color: var(--text-secondary) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
}
.btn-secondary:hover, .btn-ghost:hover, .rfbtn:hover, .ws-btn-ghost:hover {
  color: var(--text-primary) !important;
  background: #fff !important;
  border-color: rgba(34,28,22,.16) !important;
}

.card, .snapshot, .tr-card, .rp-card, .cl-card, .stat-card, .client-card, .pricing-card,
.nc-card, .nc-guide-card, .nc-chart-output, .ts-form-card, .ts-gate-card, .rl-filters,
.rl-stat, .hv-panel, .ws-col, .ws-notes-card, .ws-accuracy-card, .dasha-detail-panel,
.prem-gate-wrap, .chart-library-card, .client-card-row, .client-chart-card, .hr-card, .p-card {
  border: 1px solid rgba(255,255,255,.78) !important;
  background: rgba(255,253,249,.72) !important;
  border-radius: 32px !important;
  box-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255,255,255,.88) !important;
}
.card:hover, .client-card-row:hover, .chart-library-card:hover, .client-chart-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md), inset 0 1px 0 rgba(255,255,255,.88) !important;
}
.card-header, .snapshot-hdr, .tr-hdr, .rp-hdr, .cl-hdr, .nc-section-head, .hv-panel-hdr, .ws-col-hdr, .ws-section-hdr {
  border-bottom-color: rgba(34,28,22,.06) !important;
}
.form-control, .nc-input, .nc-select, .nc-textarea, .ts-select, .ts-date-input, .ts-place-input, .ts-coord, .rl-filter-select, .hv-status-sel {
  min-height: 46px !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(34,28,22,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9) !important;
}
.form-control:focus, .nc-input:focus, .nc-select:focus, .nc-textarea:focus, .ts-select:focus, .ts-date-input:focus, .ts-place-input:focus, .ts-coord:focus, .rl-filter-select:focus, .hv-status-sel:focus {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 5px var(--focus-ring), inset 0 1px 0 rgba(255,255,255,.9) !important;
}

/* Dashboard reference composition. */
.dh {
  min-height: 122px;
  padding: 10px 4px 20px;
  align-items: center !important;
}
.dh-greet, .page-title, .ws-client-name, .hv-title, .hindex-title, .rl-header-title, .ts-title, .nc-header h1 {
  font-size: clamp(26px, 2.3vw, 42px) !important;
  letter-spacing: -1.25px !important;
  line-height: .98 !important;
}
.dh-sub, .page-sub, .ws-meta-strip, .hv-sub, .hindex-sub, .rl-header-sub, .ts-subtitle, .nc-header-sub { font-size: 13px !important; }
.dh-clock {
  padding: 16px 24px;
  border-radius: 30px;
  background: rgba(255,255,255,.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.moon-pill {
  min-width: 205px !important;
  border: 1px solid rgba(255,255,255,.74) !important;
  border-radius: 26px !important;
  background: rgba(255,253,249,.70) !important;
  box-shadow: var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.9);
}
.snapshot { overflow:hidden; }
.snapshot-body {
  gap: 14px;
  padding: 14px;
  background: transparent;
}
.snap-chart-col, .snap-info-col { border:0 !important; background: transparent !important; }
.snap-chart-col {
  border-radius: 28px;
  background: rgba(255,255,255,.56) !important;
  border: 1px solid rgba(34,28,22,.055) !important;
}
.snap-info-row {
  gap: 12px;
  border:0 !important;
  min-height: 88px;
}
.si-cell {
  border: 1px solid rgba(34,28,22,.055) !important;
  border-radius: 24px;
  background: rgba(255,255,255,.58);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88);
  margin: 0 !important;
}
.si-cell + .si-cell { border-left: 1px solid rgba(34,28,22,.055) !important; }
.si-ico {
  background: var(--accent-muted) !important;
  color: var(--accent) !important;
  border-radius: 16px !important;
  width: 38px !important;
  height: 38px !important;
}
.snap-focus-planet { color:var(--accent) !important; }
.data-row { gap: 18px !important; }
.tr-card .tt tbody tr { border-radius: 24px !important; background: rgba(255,255,255,.68) !important; }
.rp-row { padding: 12px 0 !important; }
.rp-bar-bg { height: 7px !important; background: rgba(34,28,22,.08) !important; }
.rp-bar-fg { background: var(--accent) !important; }
.cl-row-item { border-bottom-color: rgba(34,28,22,.055) !important; }
.cl-row-item:hover { background: rgba(236,98,74,.055) !important; }
.cl-av, .client-initials, .chart-library-mark, .client-chart-mark { background: var(--accent) !important; color:#fff !important; }

/* Premium data rows: dense tables become soft row-cards instead of flat spreadsheets. */
.table-wrap, .ws-table-wrap, .compare-wrap {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 28px !important;
}
.ws-table, .sig-table, .compare-table {
  border-collapse: separate !important;
  border-spacing: 0 8px !important;
  background: transparent !important;
}
.ws-table thead th, .sig-table thead th, .compare-table th {
  background: transparent !important;
  border: 0 !important;
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}
.ws-table tbody td, .sig-table tbody td, .compare-table td {
  background: rgba(255,253,249,.78) !important;
  border-top: 1px solid rgba(34,28,22,.055) !important;
  border-bottom: 1px solid rgba(34,28,22,.055) !important;
}
.ws-table tbody td:first-child, .sig-table tbody td:first-child, .compare-table td:first-child {
  border-left: 1px solid rgba(34,28,22,.055) !important;
  border-radius: 18px 0 0 18px !important;
}
.ws-table tbody td:last-child, .sig-table tbody td:last-child, .compare-table td:last-child {
  border-right: 1px solid rgba(34,28,22,.055) !important;
  border-radius: 0 18px 18px 0 !important;
}
.ws-table tbody tr:hover td, .sig-table tbody tr:hover td, .compare-table tr:hover td {
  background: #fff !important;
  box-shadow: 0 12px 28px rgba(51,38,30,.045) !important;
}
.tt thead th { background: transparent !important; }

/* Unified themed house-number pills. No more green/red/multi-color house chips. */
.house-num-pill,
.kp-house,
.sig-h,
.sig-h.p,
.sig-h.o,
.sig-csl-chip,
.sig-csl-chip.p,
.sig-csl-chip.o {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width: 25px !important;
  height: 25px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  background: var(--accent) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.55) !important;
  box-shadow: 0 8px 18px rgba(236,98,74,.18), inset 0 1px 0 rgba(255,255,255,.22) !important;
  font-size: 11px !important;
  font-weight: 850 !important;
}
.house-num-pill {
  width: 34px !important;
  height: 34px !important;
  padding:0 !important;
  flex-direction: column;
  gap: 0;
}
.house-num-pill span { color:#fff !important; line-height:1 !important; }
.house-num-pill span:first-child { font-size:7px !important; opacity:.76; letter-spacing:.45px; }
.house-num-pill span:last-child { font-size:14px !important; }
.sig-legend .sig-h { box-shadow:none !important; }

/* Tabs as floating segmented controls. */
.tab-bar, .ws-tabs, #ws-tab-bar, .sky-toggle-grp, .ts-chip-row {
  background: rgba(255,255,255,.48) !important;
  border: 1px solid rgba(34,28,22,.06) !important;
  border-radius: 22px !important;
  padding: 5px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}
.tab-btn, .ws-tab, .sky-btn, .ts-chip {
  border-radius: 17px !important;
}
.tab-btn.active, .ws-tab.active, .sky-btn.on, .ts-chip.active {
  background:#fff !important;
  color: var(--text-primary) !important;
  box-shadow: 0 12px 24px rgba(51,38,30,.06), inset 0 1px 0 rgba(255,255,255,.9) !important;
  border-bottom-color: transparent !important;
}

/* Subtle motion. */
@keyframes kpSoftIn { from { opacity:0; transform: translateY(10px) scale(.985); } to { opacity:1; transform:none; } }
.app-content > * { animation: kpSoftIn .36s ease both; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Workspace pages keep their own scroll, but adopt softer shell. */
.ws-page, .hv-page { background: transparent !important; }
.ws-header, .hv-header {
  border: 1px solid rgba(255,255,255,.78) !important;
  background: rgba(255,253,249,.78) !important;
  border-radius: 0 0 30px 30px !important;
  box-shadow: var(--shadow-xs), inset 0 1px 0 rgba(255,255,255,.88) !important;
}
.ws-tabs { margin: 16px 24px 0 !important; border-bottom: 0 !important; width: fit-content; max-width: calc(100% - 48px); }
.ws-tab { border-bottom:0 !important; margin-bottom:0 !important; padding: 10px 16px !important; }
.ws-pane.active { background: transparent !important; }
.ws-analytics-row { gap: 14px !important; padding: 14px 20px 0; }
.ws-col { border-right:0 !important; }

@media (min-width: 901px) {
  .sidebar-toggle-float { display: none; }
}


body:has(.ws-page) .sidebar-toggle-float,
body:has(.hv-page) .sidebar-toggle-float { display:inline-flex; }
body:has(.ws-page) .app-sidebar.open + .sidebar-toggle-float,
body:has(.hv-page) .app-sidebar.open + .sidebar-toggle-float { display:none; }
body:has(.ws-page) .app-main { height:100vh !important; min-height:100vh !important; padding:0 !important; overflow:hidden !important; }
body:has(.ws-page) .app-content { max-width:none !important; padding:0 !important; overflow-y:auto !important; min-height:0 !important; }
body:has(.ws-page) .sidebar-toggle-float { top:22px; left:22px; }

/* ============================================================
   V4 — Saledash-inspired professional base theme
   Final app-wide normalization for public + authenticated pages.
   ============================================================ */
:root {
  --bg:#eef4f8; --bg-subtle:#f5f8fb; --bg-hover:#e7eef5; --bg-card:#fff; --bg-elevated:#f9fbfd;
  --border:#dce5ed; --border-med:#c8d5df; --border-strong:#a9bac8;
  --text-primary:#0f172a; --text-secondary:#475569; --text-tertiary:#718094; --text-muted:#9aa8b8;
  --accent:#0f172a; --accent-hover:#1e293b; --accent-light:#e8f1f8; --accent-muted:rgba(15,23,42,.075); --focus-ring:rgba(45,86,128,.18);
  --green:#16856a; --green-bg:#eaf7f2; --red:#b45353; --red-bg:#fbefef; --amber:#b7791f; --amber-bg:#fff7e6; --blue:#2c5f8f; --blue-bg:#e9f3fb;
  --planet-sun:#c8793c; --planet-moon:#738397; --planet-mars:#b45353; --planet-mercury:#16856a; --planet-jupiter:#a76f21; --planet-venus:#a75f7d; --planet-saturn:#344256; --planet-rahu:#2b7c8f; --planet-ketu:#a65f37; --planet-asc:#2c5f8f;
  --shadow-xs:0 1px 2px rgba(15,23,42,.035); --shadow-sm:0 12px 35px rgba(65,91,118,.08),0 1px 1px rgba(15,23,42,.03); --shadow-md:0 24px 70px rgba(65,91,118,.12),0 2px 4px rgba(15,23,42,.04); --shadow-lg:0 34px 90px rgba(35,63,92,.18);
  --radius-sm:12px; --radius-md:16px; --radius-lg:22px; --radius-xl:28px; --sidebar-w:280px; --topbar-h:76px;
}
html{background:#eef4f8!important;}
body{background:linear-gradient(145deg,#f8fbfe 0%,#edf4f8 44%,#e5eef6 100%)!important;color:var(--text-primary)!important;}
body::before{background-image:none!important;mask-image:none!important;}
.app-sidebar{background:linear-gradient(180deg,rgba(247,251,254,.96),rgba(231,240,248,.88))!important;border-color:rgba(210,224,235,.9)!important;}
.app-topbar,.card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,.nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,.hv-panel,.ws-col,.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,.client-card,.pricing-card,.up-wrap,.price-card,.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,.login-card,.hero-card,.feature-card,.faq-card{background:rgba(255,255,255,.86)!important;border-color:rgba(219,230,239,.92)!important;box-shadow:var(--shadow-sm),inset 0 1px 0 rgba(255,255,255,.9)!important;}
.btn-primary,.btn-new-chart,.nc-btn-generate,.ts-search-btn,.up-cta,.prem-gate-btn,.ws-btn-primary{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important;box-shadow:0 16px 34px rgba(15,23,42,.15),inset 0 1px 0 rgba(255,255,255,.14)!important;}
.btn-primary:hover,.btn-new-chart:hover,.nc-btn-generate:hover,.ts-search-btn:hover,.up-cta:hover,.prem-gate-btn:hover,.ws-btn-primary:hover{background:var(--accent-hover)!important;border-color:var(--accent-hover)!important;color:#fff!important;}
.btn-secondary,.btn-ghost,.rfbtn,.ws-btn,.ws-btn-ghost,.ts-cancel-btn,.sky-btn,.hr-filter-btn{background:#fff!important;border-color:#dbe6ef!important;color:var(--text-secondary)!important;}
.nav-item:hover{background:rgba(255,255,255,.72)!important;color:var(--text-primary)!important;}
.nav-item.active{background:#e3eaf2!important;color:var(--text-primary)!important;border-color:#d5e0ea!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 8px 18px rgba(78,105,130,.06)!important;}
.nav-badge.free{background:#f2f6fa!important;color:var(--accent)!important;border-color:#d9e5ee!important;}
.form-control,.nc-input,.nc-select,.nc-textarea,.ts-select,.ts-date-input,.ts-place-input,.ts-coord,.rl-filter-select,.hv-status-sel,input[type="text"],input[type="email"],input[type="date"],input[type="time"],input[type="number"],select,textarea{background:#fff!important;border-color:#dbe6ef!important;border-radius:16px!important;color:var(--text-primary)!important;}
.form-control:focus,.nc-input:focus,.nc-select:focus,.nc-textarea:focus,.ts-select:focus,.ts-date-input:focus,.ts-place-input:focus,.ts-coord:focus,.rl-filter-select:focus,.hv-status-sel:focus,input:focus,select:focus,textarea:focus{border-color:#87a9c3!important;box-shadow:0 0 0 5px var(--focus-ring)!important;}
.house-num-pill,.kp-house,.sig-h,.sig-h.p,.sig-h.o,.sig-csl-chip,.sig-csl-chip.p,.sig-csl-chip.o,.h-pill,.house-pill,[class*="house-chip"],[class*="house-pill"]{background:#e7f0f7!important;color:#12324f!important;border:1px solid #cfdeea!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.88)!important;}
.hb-open{background:#e9f3fb!important;color:#2c5f8f!important}.hb-pending{background:#fff7e6!important;color:#a76f21!important}.hb-resolved{background:#eaf7f2!important;color:#16856a!important}.hb-closed,.hb-draft{background:#edf2f7!important;color:#718094!important}

/* ============================================================
   V5 surgical global polish: sharper borders + wider shell vars
   ============================================================ */
:root{
  --content-max-w:1840px;
  --radius-sm:4px;
  --radius-md:6px;
  --radius-lg:8px;
  --radius-xl:10px;
  --sidebar-w:292px;
  --topbar-h:72px;
}
.card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,
.nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,
.hv-panel,.ws-col,.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,
.client-card,.pricing-card,.up-wrap,.price-card,.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,
.settings-card,.billing-card,.section-card,.form-card,.login-card,.hero-card,.feature-card,.faq-card{
  border-radius:8px!important;
}
.btn,.btn-new-chart,.nc-btn-generate,.ts-search-btn,.up-cta,.prem-gate-btn,.ws-btn-primary,
.rfbtn,.ws-btn,.ws-btn-ghost,.ts-cancel-btn,.sky-btn,.hr-filter-btn,
input,select,textarea,.tab-bar,.ws-tabs,#ws-tab-bar,.sky-toggle-grp,.ts-chip-row,.tab-btn,.ws-tab,.ts-chip{
  border-radius:6px!important;
}
.app-content{max-width:var(--content-max-w)!important;}
.house-num-pill,.kp-house,.sig-h,.sig-h.p,.sig-h.o,.sig-csl-chip,.sig-csl-chip.p,.sig-csl-chip.o,.h-pill,.house-pill,[class*="house-chip"],[class*="house-pill"]{
  background:#e7f0f7!important;
  color:#12324f!important;
  border:1px solid #cfdeea!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88)!important;
}

  /* ============================================================
     V11 premium experience layer
     Reference direction: soft neumorphism, glass surfaces, calm blue-grey,
     intentional spacing, tactile motion, and elevated data clarity.
     ============================================================ */
  :root{
    --premium-bg-1:#f8fbff;
    --premium-bg-2:#eef6fc;
    --premium-bg-3:#e5eff8;
    --premium-surface:rgba(255,255,255,.78);
    --premium-surface-strong:rgba(255,255,255,.92);
    --premium-border:rgba(194,211,226,.78);
    --premium-border-strong:#b9ccdd;
    --premium-text:#07111f;
    --premium-muted:#6c8298;
    --premium-soft-shadow:18px 18px 44px rgba(116,139,160,.14), -14px -14px 34px rgba(255,255,255,.9);
    --premium-card-shadow:0 18px 50px rgba(41,72,102,.10),0 1px 0 rgba(255,255,255,.92) inset;
    --premium-card-shadow-hover:0 28px 80px rgba(41,72,102,.16),0 1px 0 rgba(255,255,255,.96) inset;
    --premium-radius:24px;
    --premium-radius-sm:16px;
    --premium-ease:cubic-bezier(.2,.8,.2,1);
  }

  html{scroll-behavior:smooth;background:var(--premium-bg-2)!important;}
  body{
    background:
      radial-gradient(circle at 14% 8%,rgba(255,255,255,.95),transparent 30%),
      radial-gradient(circle at 88% 0%,rgba(186,215,236,.62),transparent 34%),
      radial-gradient(circle at 75% 72%,rgba(220,232,243,.58),transparent 28%),
      linear-gradient(145deg,var(--premium-bg-1) 0%,var(--premium-bg-2) 48%,var(--premium-bg-3) 100%)!important;
    color:var(--premium-text)!important;
    text-rendering:optimizeLegibility;
  }
  body::before{display:none!important;}
  body.is-ready .app-layout{opacity:1;}
  .app-layout{opacity:1;transition:opacity .34s var(--premium-ease);}

  .kp-ambient-shell{
    position:fixed;
    inset:0;
    z-index:-1;
    pointer-events:none;
    overflow:hidden;
  }
  .kp-ambient-shell::before,
  .kp-ambient-shell::after,
  .kp-ambient-shell span{
    content:"";
    position:absolute;
    border-radius:999px;
    filter:blur(6px);
    opacity:.72;
    transform:translateZ(0);
  }
  .kp-ambient-shell::before{width:420px;height:420px;left:-140px;top:12%;background:rgba(255,255,255,.72);box-shadow:0 0 80px rgba(180,205,225,.55);}
  .kp-ambient-shell::after{width:520px;height:520px;right:-180px;top:-170px;background:rgba(195,221,240,.62);box-shadow:0 0 90px rgba(160,190,215,.45);}
  .kp-ambient-shell span:nth-child(1){width:320px;height:320px;right:12%;bottom:-120px;background:rgba(231,240,248,.82);}
  .kp-ambient-shell span:nth-child(2){width:180px;height:180px;left:42%;top:18%;background:rgba(255,255,255,.55);}
  .kp-ambient-shell span:nth-child(3){width:240px;height:240px;left:12%;bottom:20%;background:rgba(210,226,239,.38);}

  .app-main{transition:margin-left .34s var(--premium-ease),padding .34s var(--premium-ease),filter .34s var(--premium-ease)!important;}
  .app-topbar{
    min-height:76px!important;
    border-radius:28px 28px 0 0!important;
    background:linear-gradient(180deg,rgba(255,255,255,.91),rgba(248,252,255,.78))!important;
    border:1px solid rgba(255,255,255,.86)!important;
    border-bottom-color:rgba(205,220,232,.82)!important;
    box-shadow:0 18px 48px rgba(51,83,112,.08),inset 0 1px 0 rgba(255,255,255,.96)!important;
    backdrop-filter:blur(24px) saturate(160%)!important;
    -webkit-backdrop-filter:blur(24px) saturate(160%)!important;
    transition:box-shadow .24s var(--premium-ease),background .24s var(--premium-ease),transform .24s var(--premium-ease)!important;
  }
  .app-topbar.is-scrolled{box-shadow:0 20px 58px rgba(51,83,112,.13),inset 0 1px 0 rgba(255,255,255,.96)!important;background:rgba(255,255,255,.9)!important;}
  .topbar-title{font-weight:950!important;color:var(--premium-text)!important;letter-spacing:-.045em!important;}
  .topbar-kicker{color:var(--premium-muted)!important;font-weight:650!important;}
  .topbar-brandmark,.sidebar-logo-mark{border-radius:14px!important;}

  .app-content{
    border-radius:0 0 28px 28px!important;
    background:
      linear-gradient(180deg,rgba(255,255,255,.58),rgba(255,255,255,.38)),
      radial-gradient(circle at 100% 0%,rgba(219,235,247,.62),transparent 36%)!important;
    border:1px solid rgba(255,255,255,.82)!important;
    border-top:0!important;
    box-shadow:var(--premium-soft-shadow)!important;
  }
  .app-footer{border-radius:20px!important;background:rgba(255,255,255,.76)!important;border-color:rgba(207,222,234,.86)!important;}

  .app-sidebar{
    border-radius:26px!important;
    background:
      radial-gradient(circle at 22% 0%,rgba(255,255,255,.96),transparent 38%),
      linear-gradient(180deg,rgba(248,252,255,.98),rgba(232,243,251,.96))!important;
    border:1px solid rgba(185,205,222,.92)!important;
    box-shadow:0 32px 90px rgba(23,52,80,.24),inset 0 1px 0 rgba(255,255,255,.98)!important;
    backdrop-filter:blur(26px) saturate(150%)!important;
    -webkit-backdrop-filter:blur(26px) saturate(150%)!important;
    transition:transform .34s var(--premium-ease),opacity .28s var(--premium-ease)!important;
  }
  .sidebar-brand,.nav-section{border-radius:18px!important;}
  .nav-section{background:rgba(255,255,255,.72)!important;border:1px solid rgba(205,221,234,.9)!important;box-shadow:0 12px 28px rgba(80,111,140,.06),inset 0 1px 0 rgba(255,255,255,.92)!important;}
  .nav-item{position:relative!important;overflow:hidden!important;isolation:isolate!important;}
  .nav-item::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.72),transparent 42%);
    opacity:0;
    transition:opacity .22s var(--premium-ease);
    z-index:-1;
  }
  .nav-item:hover::before{opacity:1;}
  .nav-item.active::before{display:none;}
  .sidebar-backdrop{background:rgba(8,18,31,.32)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;}

  .card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,
  .nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,
  .hv-panel,.ws-col,.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,
  .client-card,.pricing-card,.up-wrap,.price-card,.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,
  .settings-card,.billing-card,.section-card,.form-card,.login-card,.hero-card,.feature-card,.faq-card{
    position:relative!important;
    isolation:isolate!important;
    border-radius:var(--premium-radius)!important;
    background:
      linear-gradient(145deg,rgba(255,255,255,.94),rgba(247,251,254,.76))!important;
    border:1px solid var(--premium-border)!important;
    box-shadow:var(--premium-card-shadow)!important;
    transition:transform .24s var(--premium-ease),box-shadow .24s var(--premium-ease),border-color .24s var(--premium-ease),background .24s var(--premium-ease)!important;
  }
  .card::before,.snapshot::before,.tr-card::before,.rp-card::before,.cl-card::before,.quick-card::before,.activity-card::before,
  .birthday-card::before,.favourite-card::before,.nc-card::before,.ts-form-card::before,.rl-stat::before,.hv-panel::before,
  .ws-col::before,.client-card-row::before,.chart-library-card::before,.client-chart-card::before,.hr-card::before,.pricing-card::before,
  .settings-card::before,.billing-card::before,.section-card::before,.form-card::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    pointer-events:none;
    z-index:0;
    background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.92),transparent 44%);
    opacity:0;
    transition:opacity .22s var(--premium-ease);
  }
  .card:hover,.snapshot:hover,.tr-card:hover,.rp-card:hover,.cl-card:hover,.quick-card:hover,.activity-card:hover,
  .birthday-card:hover,.favourite-card:hover,.nc-card:hover,.ts-form-card:hover,.rl-stat:hover,.hv-panel:hover,.ws-col:hover,
  .client-card-row:hover,.chart-library-card:hover,.client-chart-card:hover,.hr-card:hover,.pricing-card:hover,.settings-card:hover,
  .billing-card:hover,.section-card:hover,.form-card:hover{
    transform:translateY(-3px)!important;
    border-color:var(--premium-border-strong)!important;
    box-shadow:var(--premium-card-shadow-hover)!important;
  }
  .card:hover::before,.snapshot:hover::before,.tr-card:hover::before,.rp-card:hover::before,.cl-card:hover::before,.quick-card:hover::before,
  .activity-card:hover::before,.birthday-card:hover::before,.favourite-card:hover::before,.nc-card:hover::before,.ts-form-card:hover::before,
  .rl-stat:hover::before,.hv-panel:hover::before,.ws-col:hover::before,.client-card-row:hover::before,.chart-library-card:hover::before,
  .client-chart-card:hover::before,.hr-card:hover::before,.pricing-card:hover::before,.settings-card:hover::before,.billing-card:hover::before,
  .section-card:hover::before,.form-card:hover::before{opacity:.75;}
  .card > *,.snapshot > *,.tr-card > *,.rp-card > *,.cl-card > *,.quick-card > *,.activity-card > *,.birthday-card > *,
  .favourite-card > *,.nc-card > *,.ts-form-card > *,.rl-stat > *,.hv-panel > *,.ws-col > *,.client-card-row > *,
  .chart-library-card > *,.client-chart-card > *,.hr-card > *,.pricing-card > *,.settings-card > *,.billing-card > *{position:relative;z-index:1;}

  .snapshot-hdr,.tr-hdr,.rp-hdr,.cl-hdr,.nc-section-head,.hv-panel-hdr,.ws-col-hdr,.ws-section-hdr,.card-header{
    background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(244,249,253,.72))!important;
    border-bottom:1px solid rgba(213,226,237,.9)!important;
  }
  .card-title,.dh-greet,.page-title,.rl-header-title,.ts-title,.hindex-title,.hv-title,.nc-header h1,.ws-client-name{
    color:var(--premium-text)!important;
    letter-spacing:-.055em!important;
  }
  .dh-sub,.page-sub,.rl-header-sub,.ts-subtitle,.hindex-sub,.hv-sub,.nc-header-sub{color:var(--premium-muted)!important;}

  .btn,.btn-new-chart,.nc-btn-generate,.ts-search-btn,.up-cta,.prem-gate-btn,.ws-btn-primary,.rfbtn,.ws-btn,.ws-btn-ghost,.ts-cancel-btn,.sky-btn,.hr-filter-btn,
  button,[role="button"],.tab-btn,.ws-tab,.ts-chip,.aspect-filter-btn{
    position:relative;
    overflow:hidden;
    transform:translateZ(0);
  }
  .btn,.btn-new-chart,.nc-btn-generate,.ts-search-btn,.up-cta,.prem-gate-btn,.ws-btn-primary{
    border-radius:16px!important;
  }
  .btn-primary,.btn-new-chart,.nc-btn-generate,.ts-search-btn,.up-cta,.prem-gate-btn,.ws-btn-primary{
    background:linear-gradient(135deg,#07111f 0%,#223a54 100%)!important;
    border-color:rgba(7,17,31,.92)!important;
    box-shadow:0 18px 38px rgba(7,17,31,.18),inset 0 1px 0 rgba(255,255,255,.18)!important;
  }
  .btn-primary:hover,.btn-new-chart:hover,.nc-btn-generate:hover,.ts-search-btn:hover,.up-cta:hover,.prem-gate-btn:hover,.ws-btn-primary:hover{
    transform:translateY(-2px)!important;
    box-shadow:0 24px 54px rgba(7,17,31,.24),inset 0 1px 0 rgba(255,255,255,.22)!important;
  }
  .btn-secondary,.btn-ghost,.rfbtn,.ws-btn,.ws-btn-ghost,.ts-cancel-btn,.sky-btn,.hr-filter-btn{
    background:rgba(255,255,255,.74)!important;
    border-color:rgba(199,216,230,.92)!important;
    box-shadow:0 10px 24px rgba(80,111,140,.07),inset 0 1px 0 rgba(255,255,255,.9)!important;
  }
  .ui-ripple{
    position:absolute;
    border-radius:999px;
    pointer-events:none;
    background:rgba(255,255,255,.42);
    transform:scale(0);
    animation:kpRipple .62s var(--premium-ease);
    z-index:3;
  }
  @keyframes kpRipple{to{transform:scale(1);opacity:0;}}

  .form-group,.nc-field,.ts-field,.rl-filter-field{transition:transform .18s var(--premium-ease),filter .18s var(--premium-ease);}
  .field-focus{transform:translateY(-1px);}
  .form-control,.nc-input,.nc-select,.nc-textarea,.ts-select,.ts-date-input,.ts-place-input,.ts-coord,.rl-filter-select,.hv-status-sel,
  input[type="text"],input[type="email"],input[type="date"],input[type="time"],input[type="number"],input[type="password"],select,textarea{
    border-radius:15px!important;
    background:rgba(255,255,255,.9)!important;
    border-color:rgba(198,216,231,.96)!important;
    box-shadow:inset 4px 4px 10px rgba(116,139,160,.055),inset -4px -4px 10px rgba(255,255,255,.92)!important;
    transition:border-color .2s var(--premium-ease),box-shadow .2s var(--premium-ease),transform .2s var(--premium-ease),background .2s var(--premium-ease)!important;
  }
  .form-control:focus,.nc-input:focus,.nc-select:focus,.nc-textarea:focus,.ts-select:focus,.ts-date-input:focus,.ts-place-input:focus,.ts-coord:focus,.rl-filter-select:focus,.hv-status-sel:focus,
  input:focus,select:focus,textarea:focus{
    background:#fff!important;
    border-color:#86a9c5!important;
    box-shadow:0 0 0 5px rgba(75,119,154,.16),inset 0 1px 0 rgba(255,255,255,.95)!important;
    transform:translateY(-1px)!important;
  }

  .tab-bar,.ws-tabs,#ws-tab-bar,.sky-toggle-grp,.ts-chip-row,.aspect-filter-bar{
    background:rgba(231,241,248,.72)!important;
    border:1px solid rgba(203,219,232,.88)!important;
    box-shadow:inset 3px 3px 9px rgba(116,139,160,.08),inset -4px -4px 10px rgba(255,255,255,.92)!important;
  }
  .tab-btn.active,.ws-tab.active,.ts-chip.active,.sky-btn.on,.hr-filter-btn.active,.aspect-filter-btn.active{
    background:linear-gradient(180deg,#fff,#f8fbfe)!important;
    box-shadow:0 12px 26px rgba(80,111,140,.13),inset 0 1px 0 rgba(255,255,255,.96)!important;
  }

  .table-wrap,.ws-table-wrap,.compare-wrap{overflow:auto!important;scrollbar-width:thin;scrollbar-color:#b8cbdb transparent;}
  .ws-table tbody tr,.sig-table tbody tr,.compare-table tr,.tt tbody tr,.table tbody tr{transition:transform .18s var(--premium-ease),filter .18s var(--premium-ease)!important;}
  .ws-table tbody tr:hover,.sig-table tbody tr:hover,.compare-table tr:hover,.tt tbody tr:hover,.table tbody tr:hover{transform:translateY(-1px)!important;}
  .ws-table tbody td,.sig-table tbody td,.compare-table td,.tt tbody td,.table tbody td{
    background:rgba(255,255,255,.86)!important;
    border-color:rgba(211,225,236,.92)!important;
  }

  .toast-container{position:fixed!important;right:22px!important;bottom:22px!important;z-index:9999!important;display:grid!important;gap:10px!important;}
  .toast{
    border-radius:18px!important;
    background:rgba(255,255,255,.92)!important;
    border:1px solid rgba(198,216,231,.96)!important;
    box-shadow:0 20px 50px rgba(30,58,86,.18),inset 0 1px 0 rgba(255,255,255,.96)!important;
    color:var(--premium-text)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    animation:kpToastIn .28s var(--premium-ease) both!important;
  }
  .toast.success{border-color:rgba(92,183,148,.52)!important;}
  .toast.error{border-color:rgba(210,95,95,.52)!important;}
  @keyframes kpToastIn{from{opacity:0;transform:translateY(10px) scale(.98);}to{opacity:1;transform:none;}}

  @media (prefers-reduced-motion:no-preference){
    .kp-ambient-shell span:nth-child(1){animation:kpDrift 18s ease-in-out infinite alternate;}
    .kp-ambient-shell span:nth-child(2){animation:kpDrift 22s ease-in-out infinite alternate-reverse;}
    .reveal-ready{opacity:0;transform:translateY(16px) scale(.985);}
    .reveal-ready.reveal-in{animation:kpPremiumReveal .62s var(--premium-ease) var(--reveal-delay,0ms) both;}
    @keyframes kpPremiumReveal{to{opacity:1;transform:none;}}
    @keyframes kpDrift{from{transform:translate3d(0,0,0) scale(1);}to{transform:translate3d(18px,-16px,0) scale(1.04);}}
  }
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto!important;}
    .app-layout{opacity:1!important;transition:none!important;}
    .reveal-ready{opacity:1!important;transform:none!important;}
    .ui-ripple{display:none!important;}
  }
  

  


  /* ============================================================
     V13 top navigation visibility fix
     Ensures every primary menu item renders horizontally in the sticky top bar.
     ============================================================ */
  .app-layout-topnav .app-topbar-menu{
    display:grid!important;
    grid-template-columns:auto minmax(520px,1fr) auto!important;
    align-items:center!important;
    gap:14px!important;
    overflow:visible!important;
  }
  .app-layout-topnav .topbar-nav{
    display:block!important;
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  .app-layout-topnav .topbar-nav-scroll{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    padding:4px!important;
    border-radius:20px!important;
    background:rgba(232,242,249,.74)!important;
    border:1px solid rgba(204,221,234,.88)!important;
    box-shadow:inset 4px 4px 12px rgba(113,137,158,.07), inset -5px -5px 14px rgba(255,255,255,.88)!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .app-layout-topnav .topbar-nav-scroll::-webkit-scrollbar{display:none!important;}
  .app-layout-topnav .topbar-nav-scroll > .top-nav-item,
  .app-layout-topnav .topbar-nav .top-nav-item,
  .app-layout-topnav .topbar-nav .nav-item{
    display:inline-flex!important;
    flex:0 0 auto!important;
    width:auto!important;
    max-width:none!important;
    min-width:max-content!important;
    min-height:42px!important;
    height:42px!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 12px!important;
    gap:8px!important;
    border-radius:15px!important;
    color:#34485d!important;
    background:transparent!important;
    border:1px solid transparent!important;
    box-shadow:none!important;
    font-size:13px!important;
    font-weight:900!important;
    line-height:1!important;
    letter-spacing:-.015em!important;
    white-space:nowrap!important;
    transform:none!important;
  }
  .app-layout-topnav .topbar-nav .top-nav-item:hover{
    color:#07111f!important;
    background:linear-gradient(180deg,#fff,#f7fbff)!important;
    border-color:#cadbea!important;
    box-shadow:0 10px 22px rgba(65,91,118,.10), inset 0 1px 0 rgba(255,255,255,.96)!important;
    transform:translateY(-1px)!important;
  }
  .app-layout-topnav .topbar-nav .top-nav-item.active{
    width:auto!important;
    flex:0 0 auto!important;
    color:#fff!important;
    background:linear-gradient(135deg,#07111f 0%,#264460 100%)!important;
    border-color:rgba(7,17,31,.65)!important;
    box-shadow:0 13px 28px rgba(15,42,73,.22), inset 0 1px 0 rgba(255,255,255,.17)!important;
  }
  .app-layout-topnav .topbar-nav .top-nav-item .nav-icon{
    display:inline-flex!important;
    width:24px!important;
    height:24px!important;
    flex:0 0 24px!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:10px!important;
    background:rgba(255,255,255,.82)!important;
    border:1px solid rgba(185,205,222,.88)!important;
    color:#58718a!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.96)!important;
  }
  .app-layout-topnav .topbar-nav .top-nav-item.active .nav-icon{
    color:#fff!important;
    background:rgba(255,255,255,.15)!important;
    border-color:rgba(255,255,255,.28)!important;
    box-shadow:none!important;
  }
  .app-layout-topnav .topbar-nav .top-nav-item .nav-text{
    display:inline!important;
    color:inherit!important;
    text-shadow:none!important;
  }
  .app-layout-topnav .topbar-nav .nav-badge.free{
    display:inline-flex!important;
    margin-left:1px!important;
    padding:3px 7px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.86)!important;
    color:#1f3a54!important;
    border:1px solid rgba(190,208,224,.9)!important;
    font-size:9px!important;
    font-weight:950!important;
  }
  

  


/* ============================================================
   V14 monochrome premium top navigation
   White background · black foreground · categorized dropdown menus
   ============================================================ */
:root{
  --bg:#ffffff!important;
  --bg-subtle:#fafafa!important;
  --bg-hover:#f4f4f5!important;
  --bg-card:#ffffff!important;
  --bg-elevated:#ffffff!important;
  --border:#e5e5e5!important;
  --border-med:#d4d4d4!important;
  --border-strong:#111111!important;
  --text-primary:#050505!important;
  --text-secondary:#171717!important;
  --text-tertiary:#525252!important;
  --text-muted:#737373!important;
  --accent:#050505!important;
  --accent-hover:#000000!important;
  --accent-light:#f5f5f5!important;
  --accent-muted:rgba(0,0,0,.055)!important;
  --focus-ring:rgba(0,0,0,.18)!important;
  --shadow-xs:0 1px 2px rgba(0,0,0,.04)!important;
  --shadow-sm:0 10px 28px rgba(0,0,0,.06),0 1px 1px rgba(0,0,0,.04)!important;
  --shadow-md:0 20px 55px rgba(0,0,0,.09),0 2px 4px rgba(0,0,0,.05)!important;
  --shadow-lg:0 34px 90px rgba(0,0,0,.14)!important;
  --topbar-h:78px!important;
  --topbar-sticky-offset:96px!important;
}
html,body{background:#ffffff!important;color:#050505!important;}
body::before,body::after,.kp-ambient-shell{display:none!important;}
a{color:#050505;}
.app-layout,.app-main{background:#ffffff!important;}
.app-layout-topnav .app-main{margin-left:0!important;padding:0 22px 22px!important;}
.app-content{
  background:#ffffff!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:#050505!important;
}
.app-footer{background:#ffffff!important;color:#525252!important;border-top:1px solid #e5e5e5!important;}
.app-topbar,.app-layout-topnav .app-topbar-menu{
  position:sticky!important;
  top:0!important;
  z-index:300!important;
  min-height:var(--topbar-h)!important;
  height:auto!important;
  display:grid!important;
  grid-template-columns:auto minmax(280px,1fr) auto!important;
  align-items:center!important;
  gap:18px!important;
  padding:12px 16px!important;
  margin:0 auto!important;
  width:100%!important;
  max-width:1720px!important;
  overflow:visible!important;
  background:rgba(255,255,255,.94)!important;
  border:0!important;
  border-bottom:1px solid #e5e5e5!important;
  border-radius:0!important;
  box-shadow:0 10px 30px rgba(0,0,0,.045)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.app-topbar.is-scrolled,.app-layout-topnav .app-topbar-menu.is-scrolled{
  background:rgba(255,255,255,.98)!important;
  box-shadow:0 12px 38px rgba(0,0,0,.07)!important;
}
.topbar-brand-link{color:#050505!important;text-decoration:none!important;}
.topbar-brandmark,.sidebar-logo-mark{
  background:#050505!important;
  color:#ffffff!important;
  border:1px solid #050505!important;
  box-shadow:none!important;
}
.topbar-title{color:#050505!important;font-weight:900!important;letter-spacing:-.04em!important;}
.topbar-kicker{color:#525252!important;font-weight:650!important;}
.app-layout-topnav .topbar-nav,
.app-layout-topnav .topbar-nav-scroll{
  overflow:visible!important;
  min-width:0!important;
  width:100%!important;
}
.app-layout-topnav .topbar-nav-scroll{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  white-space:normal!important;
}
.topbar-dropdown{position:relative!important;display:block!important;}
.topbar-dropdown > summary{list-style:none!important;}
.topbar-dropdown > summary::-webkit-details-marker{display:none!important;}
.topbar-menu-trigger,
.topbar-user{
  user-select:none!important;
  cursor:pointer!important;
  outline:none!important;
}
.topbar-menu-trigger{
  min-height:48px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:0 16px!important;
  border-radius:999px!important;
  color:#050505!important;
  background:#ffffff!important;
  border:1px solid #d4d4d4!important;
  box-shadow:0 6px 16px rgba(0,0,0,.04)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.topbar-menu-trigger::after,
.topbar-profile-menu > .topbar-user::after{
  content:"⌄";
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  margin-left:2px;
  color:#050505;
  font-size:13px;
  line-height:1;
  transition:transform .18s ease;
}
.topbar-dropdown[open] > .topbar-menu-trigger::after,
.topbar-profile-menu[open] > .topbar-user::after{transform:rotate(180deg);}
.topbar-menu-trigger:hover,
.topbar-menu-trigger.active,
.topbar-dropdown[open] > .topbar-menu-trigger{
  background:#fafafa!important;
  border-color:#050505!important;
  box-shadow:0 10px 24px rgba(0,0,0,.075)!important;
  transform:translateY(-1px)!important;
}
.topbar-menu-trigger-copy{display:flex!important;flex-direction:column!important;line-height:1.04!important;}
.topbar-menu-trigger-copy strong{font-size:13px!important;font-weight:900!important;color:#050505!important;letter-spacing:-.02em!important;}
.topbar-menu-trigger-copy small{font-size:11px!important;font-weight:700!important;color:#737373!important;margin-top:4px!important;}
.topbar-dropdown-panel{
  position:absolute!important;
  top:calc(100% + 12px)!important;
  left:0!important;
  z-index:500!important;
  width:min(320px,calc(100vw - 32px))!important;
  padding:10px!important;
  background:#ffffff!important;
  color:#050505!important;
  border:1px solid #d4d4d4!important;
  border-radius:22px!important;
  box-shadow:0 26px 70px rgba(0,0,0,.14),0 1px 0 rgba(255,255,255,.95) inset!important;
  transform-origin:top center!important;
  animation:kpMenuIn .16s cubic-bezier(.2,.8,.2,1) both!important;
}
.topbar-profile-menu .topbar-dropdown-panel,
.topbar-account-popover{left:auto!important;right:0!important;width:min(340px,calc(100vw - 32px))!important;}
@keyframes kpMenuIn{from{opacity:0;transform:translateY(-8px) scale(.98);}to{opacity:1;transform:translateY(0) scale(1);}}
.topbar-dropdown-label{
  padding:8px 10px 9px!important;
  color:#737373!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.nav-dropdown-item{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-height:58px!important;
  padding:10px 11px!important;
  border-radius:16px!important;
  color:#050505!important;
  text-decoration:none!important;
  background:#ffffff!important;
  border:1px solid transparent!important;
  box-shadow:none!important;
  transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease!important;
  overflow:hidden!important;
}
.nav-dropdown-item:hover{
  background:#fafafa!important;
  border-color:#d4d4d4!important;
  transform:translateX(2px)!important;
  box-shadow:0 10px 22px rgba(0,0,0,.055)!important;
}
.nav-dropdown-item.active{
  background:#f5f5f5!important;
  border-color:#050505!important;
  color:#050505!important;
}
.nav-dropdown-item.active::before{
  content:"";
  position:absolute;
  left:0;
  top:12px;
  bottom:12px;
  width:3px;
  border-radius:999px;
  background:#050505;
}
.nav-dropdown-item .nav-icon{
  width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:13px!important;
  color:#050505!important;
  background:#f5f5f5!important;
  border:1px solid #e5e5e5!important;
  box-shadow:none!important;
}
.nav-dropdown-item.active .nav-icon{background:#050505!important;color:#ffffff!important;border-color:#050505!important;}
.nav-dropdown-item svg{width:16px!important;height:16px!important;opacity:1!important;}
.nav-copy{display:flex!important;flex-direction:column!important;min-width:0!important;line-height:1.08!important;}
.nav-copy strong{font-size:13px!important;font-weight:900!important;color:inherit!important;letter-spacing:-.015em!important;}
.nav-copy small{font-size:11.5px!important;font-weight:650!important;color:#737373!important;margin-top:5px!important;white-space:normal!important;}
.nav-dropdown-item.active .nav-copy small{color:#525252!important;}
.nav-badge.free{
  margin-left:auto!important;
  border-radius:999px!important;
  background:#ffffff!important;
  color:#050505!important;
  border:1px solid #050505!important;
  font-size:10px!important;
  font-weight:950!important;
  padding:3px 7px!important;
}
.topbar-right{gap:10px!important;overflow:visible!important;}
.plan-badge,
.plan-badge.premium,
.plan-badge.free{
  background:#ffffff!important;
  color:#050505!important;
  border:1px solid #d4d4d4!important;
  box-shadow:none!important;
}
.topbar-profile-menu{flex:0 0 auto!important;}
.topbar-profile-menu > .topbar-user{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-height:50px!important;
  padding:6px 8px!important;
  border-radius:999px!important;
  background:#ffffff!important;
  border:1px solid #d4d4d4!important;
  color:#050505!important;
  box-shadow:0 6px 16px rgba(0,0,0,.04)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.topbar-profile-menu > .topbar-user:hover,
.topbar-profile-menu > .topbar-user.active,
.topbar-profile-menu[open] > .topbar-user{
  background:#fafafa!important;
  border-color:#050505!important;
  transform:translateY(-1px)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.075)!important;
}
.topbar-avatar,.topbar-avatar-placeholder,.account-menu-avatar{
  width:38px!important;
  height:38px!important;
  border-radius:50%!important;
  border:1px solid #050505!important;
  box-shadow:none!important;
}
.topbar-avatar-placeholder,.account-menu-avatar-placeholder{background:#050505!important;color:#ffffff!important;font-weight:900!important;display:flex!important;align-items:center!important;justify-content:center!important;}
.topbar-user-copy span{color:#050505!important;font-weight:900!important;}
.topbar-user-copy small{color:#737373!important;font-weight:650!important;}
.account-menu-head{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  padding:10px 10px 14px!important;
  margin-bottom:6px!important;
  border-bottom:1px solid #e5e5e5!important;
}
.account-menu-head strong{display:block!important;color:#050505!important;font-size:14px!important;font-weight:950!important;letter-spacing:-.02em!important;}
.account-menu-head small{display:block!important;margin-top:4px!important;color:#737373!important;font-size:12px!important;font-weight:650!important;}
.topbar-dropdown-divider{height:1px!important;background:#e5e5e5!important;margin:8px 4px!important;}
.btn-primary,.button-primary,button.primary,[type="submit"].btn-primary{
  background:#050505!important;
  color:#ffffff!important;
  border-color:#050505!important;
  box-shadow:0 10px 22px rgba(0,0,0,.12)!important;
}
.btn-primary:hover,.button-primary:hover,button.primary:hover,[type="submit"].btn-primary:hover{background:#000000!important;color:#ffffff!important;}
.btn-secondary,.btn-ghost,.btn-outline,.btn{border-color:#d4d4d4!important;}
.card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,
.nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,.hv-panel,.ws-col,
.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,.client-card,.pricing-card,.up-wrap,.price-card,
.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,.login-card,.hero-card,.feature-card,.faq-card,
.settings-card,.billing-card,.section-card,.form-card,.dh-card,.widget,.panel{
  background:#ffffff!important;
  color:#050505!important;
  border-color:#e5e5e5!important;
  box-shadow:0 12px 34px rgba(0,0,0,.055)!important;
}
.card::before,.snapshot::before,.tr-card::before,.rp-card::before,.cl-card::before,.quick-card::before,.activity-card::before,
.birthday-card::before,.favourite-card::before,.nc-card::before,.ts-form-card::before,.rl-stat::before,.hv-panel::before,
.ws-col::before,.client-card-row::before,.chart-library-card::before,.client-chart-card::before,.hr-card::before,
.pricing-card::before,.settings-card::before,.billing-card::before,.section-card::before,.form-card::before{background:transparent!important;}
input,select,textarea,.input,.form-control{
  background:#ffffff!important;
  color:#050505!important;
  border-color:#d4d4d4!important;
  box-shadow:none!important;
}
input:focus,select:focus,textarea:focus,.input:focus,.form-control:focus{
  border-color:#050505!important;
  box-shadow:0 0 0 4px rgba(0,0,0,.08)!important;
}
.text-muted,.muted,small,.help-text,.form-help{color:#737373!important;}
.badge,.pill,.status,.tag{border-color:#d4d4d4!important;}
.table,table{color:#050505!important;}
th{color:#525252!important;}
hr{border-color:#e5e5e5!important;}


/* Monochrome status normalization */
:root{--green:#050505!important;--green-bg:#f5f5f5!important;--red:#050505!important;--red-bg:#f5f5f5!important;--amber:#050505!important;--amber-bg:#f5f5f5!important;--blue:#050505!important;--blue-bg:#f5f5f5!important;}
.alert-info,.alert-success,.alert-warn,.alert-error,.badge-retro,.badge-combust,.badge-exalted,.badge-debil,.badge-mool{background:#f5f5f5!important;color:#050505!important;border-color:#d4d4d4!important;}
.asp-benefic,.asp-malefic,.asp-neutral{color:#050505!important;}


/* ============================================================
   V15 topbar brand clipping fix
   Keeps the KP logo + brand readable and prevents unwanted "..." truncation
   on desktop while staying safe on smaller screens.
   ============================================================ */
.app-layout-topnav .topbar-left{
  min-width:clamp(190px,16vw,280px)!important;
  max-width:360px!important;
  overflow:visible!important;
  flex:0 0 auto!important;
}
.app-layout-topnav .topbar-brand-link{
  display:inline-flex!important;
  align-items:center!important;
  gap:12px!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:visible!important;
  white-space:nowrap!important;
  vertical-align:middle!important;
}
.app-layout-topnav .topbar-brandmark{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  flex:0 0 42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:14px!important;
  font-size:13px!important;
  font-weight:950!important;
  letter-spacing:-.04em!important;
  line-height:1!important;
  overflow:hidden!important;
}
.app-layout-topnav .topbar-brandmark span{
  display:inline!important;
  line-height:1!important;
}
.app-layout-topnav .topbar-title-block{
  flex:1 1 auto!important;
  min-width:0!important;
  max-width:none!important;
  overflow:visible!important;
  line-height:1.08!important;
}
.app-layout-topnav .topbar-title,
.app-layout-topnav .topbar-kicker{
  display:block!important;
  max-width:none!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
}
.app-layout-topnav .topbar-title{
  font-size:15px!important;
  letter-spacing:-.035em!important;
}
.app-layout-topnav .topbar-kicker{
  font-size:11.5px!important;
  margin-top:4px!important;
}


/* ============================================================
   V16 fixed sticky app shell header
   Keeps the full logo + menu + profile bar locked to the viewport
   while page content scrolls underneath.
   ============================================================ */
:root{
  --topbar-shell-gap:16px!important;
  --topbar-shell-space:calc(var(--topbar-h) + var(--topbar-shell-gap))!important;
}
.app-layout-topnav .app-topbar-menu{
  position:fixed!important;
  top:0!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:min(1720px, calc(100vw - 44px))!important;
  max-width:none!important;
  margin:0!important;
  z-index:9999!important;
  will-change:box-shadow, background, backdrop-filter!important;
}
.app-layout-topnav .app-topbar-menu.is-scrolled,
.app-layout-topnav .app-topbar-menu:hover{
  background:rgba(255,255,255,.985)!important;
  box-shadow:0 14px 40px rgba(0,0,0,.085)!important;
}
.app-layout-topnav .app-content{
  margin-top:var(--topbar-shell-space)!important;
}
.app-layout-topnav .topbar-dropdown-panel{
  z-index:10000!important;
}
body:has(.ws-page) .app-content{
  margin-top:var(--topbar-shell-space)!important;
  height:calc(100vh - var(--topbar-shell-space))!important;
}


/* ============================================================
   V17 app-shell footer + theme/font personalization
   Header and footer are fixed shell chrome; content scrolls inside.
   ============================================================ */
:root{
  --font-inter:'Urbanist', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-manrope:'Manrope', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-plus-jakarta:'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-dm-sans:'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-sora:'Sora', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-space-grotesk:'Space Grotesk', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-outfit:'Outfit', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-urbanist:'Urbanist', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-instrument:'Instrument Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-geist:'Geist', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --app-font-family:var(--font-urbanist);
  --app-footer-h:62px!important;
  --app-footer-gap:16px!important;
  --app-footer-shell-space:calc(var(--app-footer-h) + var(--app-footer-gap))!important;
}
html[data-font="inter"]{--app-font-family:var(--font-urbanist);}
html[data-font="manrope"]{--app-font-family:var(--font-manrope);}
html[data-font="plus-jakarta"]{--app-font-family:var(--font-plus-jakarta);}
html[data-font="dm-sans"]{--app-font-family:var(--font-dm-sans);}
html[data-font="sora"]{--app-font-family:var(--font-sora);}
html[data-font="space-grotesk"]{--app-font-family:var(--font-space-grotesk);}
html[data-font="outfit"]{--app-font-family:var(--font-outfit);}
html[data-font="urbanist"]{--app-font-family:var(--font-urbanist);}
html[data-font="instrument"]{--app-font-family:var(--font-instrument);}
html[data-font="geist"]{--app-font-family:var(--font-geist);}
html,body,button,input,select,textarea,.btn,.nav-dropdown-item,.topbar-menu-trigger,.topbar-user{font-family:var(--app-font-family)!important;}

html[data-theme="light"]{
  --bg:#ffffff!important;
  --bg-subtle:#fafafa!important;
  --bg-hover:#f4f4f5!important;
  --bg-card:#ffffff!important;
  --bg-elevated:#ffffff!important;
  --border:#e5e5e5!important;
  --border-med:#d4d4d4!important;
  --border-strong:#050505!important;
  --text-primary:#050505!important;
  --text-secondary:#171717!important;
  --text-tertiary:#525252!important;
  --text-muted:#737373!important;
  --accent:#050505!important;
  --accent-hover:#000000!important;
  --accent-light:#f5f5f5!important;
  --accent-muted:rgba(0,0,0,.055)!important;
  --focus-ring:rgba(0,0,0,.16)!important;
}
html[data-theme="dark"]{
  --bg:#050505!important;
  --bg-subtle:#0b0b0c!important;
  --bg-hover:#18181b!important;
  --bg-card:#0f0f10!important;
  --bg-elevated:#141416!important;
  --border:#27272a!important;
  --border-med:#3f3f46!important;
  --border-strong:#f5f5f5!important;
  --text-primary:#ffffff!important;
  --text-secondary:#e5e5e5!important;
  --text-tertiary:#a3a3a3!important;
  --text-muted:#737373!important;
  --accent:#ffffff!important;
  --accent-hover:#f5f5f5!important;
  --accent-light:#18181b!important;
  --accent-muted:rgba(255,255,255,.08)!important;
  --focus-ring:rgba(255,255,255,.18)!important;
  --shadow-xs:0 1px 2px rgba(0,0,0,.45)!important;
  --shadow-sm:0 12px 34px rgba(0,0,0,.34),0 1px 1px rgba(255,255,255,.04)!important;
  --shadow-md:0 22px 60px rgba(0,0,0,.44),0 2px 4px rgba(0,0,0,.32)!important;
  --shadow-lg:0 34px 90px rgba(0,0,0,.60)!important;
}

html:has(.app-layout-topnav),
body:has(.app-layout-topnav){height:100%!important;overflow:hidden!important;}
.app-layout-topnav{height:100vh!important;min-height:100vh!important;overflow:hidden!important;background:var(--bg)!important;}
.app-layout-topnav .app-main{height:100vh!important;min-height:100vh!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;padding:0 22px!important;background:var(--bg)!important;}
.app-layout-topnav .app-topbar-menu{
  position:fixed!important;
  top:0!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:min(1720px, calc(100vw - 44px))!important;
  max-width:none!important;
  margin:0!important;
  z-index:10000!important;
  background:color-mix(in srgb, var(--bg-card) 94%, transparent)!important;
  color:var(--text-primary)!important;
  border-bottom:1px solid var(--border)!important;
  box-shadow:0 10px 30px rgba(0,0,0,.055)!important;
  backdrop-filter:blur(20px)!important;
  -webkit-backdrop-filter:blur(20px)!important;
}
.app-layout-topnav .app-content{
  flex:0 0 auto!important;
  height:calc(100vh - var(--topbar-shell-space) - var(--app-footer-shell-space))!important;
  min-height:0!important;
  max-height:calc(100vh - var(--topbar-shell-space) - var(--app-footer-shell-space))!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  margin-top:var(--topbar-shell-space)!important;
  margin-bottom:var(--app-footer-shell-space)!important;
  padding-bottom:clamp(34px,4vh,58px)!important;
  scrollbar-gutter:stable!important;
  background:var(--bg)!important;
  color:var(--text-primary)!important;
  border:0!important;
  box-shadow:none!important;
}
.app-layout-topnav .app-footer{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:0!important;
  transform:translateX(-50%)!important;
  width:min(1720px, calc(100vw - 44px))!important;
  min-height:var(--app-footer-h)!important;
  max-width:none!important;
  margin:0!important;
  z-index:9999!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  padding:12px 18px!important;
  background:color-mix(in srgb, var(--bg-card) 94%, transparent)!important;
  color:var(--text-tertiary)!important;
  border:0!important;
  border-top:1px solid var(--border)!important;
  border-radius:0!important;
  box-shadow:0 -10px 30px rgba(0,0,0,.055)!important;
  backdrop-filter:blur(20px)!important;
  -webkit-backdrop-filter:blur(20px)!important;
}
.app-layout-topnav .app-footer-copy,
.app-layout-topnav .app-footer-copy strong,
.app-layout-topnav .app-footer-links a{color:var(--text-tertiary)!important;}
.app-layout-topnav .app-footer-links a:hover{color:var(--text-primary)!important;}
body:has(.ws-page) .app-footer,
body:has(.hv-outer) .app-footer{display:flex!important;}
body:has(.ws-page) .app-topbar{display:grid!important;}
body:has(.ws-page) .app-main{height:100vh!important;min-height:100vh!important;overflow:hidden!important;padding:0 22px!important;}
body:has(.ws-page) .app-content{height:calc(100vh - var(--topbar-shell-space) - var(--app-footer-shell-space))!important;max-height:calc(100vh - var(--topbar-shell-space) - var(--app-footer-shell-space))!important;margin-top:var(--topbar-shell-space)!important;margin-bottom:var(--app-footer-shell-space)!important;overflow-y:auto!important;border:0!important;border-radius:0!important;padding-bottom:44px!important;}
body:has(.ws-page) .ws-header,
body:has(.hv-outer) .hv-case-header{top:0!important;}
body:has(.hv-outer) .hv-sidebar{top:82px!important;max-height:calc(100vh - var(--topbar-shell-space) - var(--app-footer-shell-space) - 100px)!important;}

/* Light/dark controls */
.theme-switch{
  height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:9px!important;
  padding:5px 10px 5px 6px!important;
  border-radius:999px!important;
  border:1px solid var(--border-med)!important;
  background:var(--bg-card)!important;
  color:var(--text-primary)!important;
  box-shadow:0 6px 16px rgba(0,0,0,.045)!important;
  cursor:pointer!important;
  font-weight:850!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.theme-switch:hover{transform:translateY(-1px)!important;border-color:var(--border-strong)!important;box-shadow:0 10px 24px rgba(0,0,0,.08)!important;}
.theme-switch-track{width:44px!important;height:30px!important;border-radius:999px!important;background:var(--bg-hover)!important;border:1px solid var(--border)!important;padding:3px!important;display:inline-flex!important;align-items:center!important;transition:background .2s ease,border-color .2s ease!important;}
.theme-switch-thumb{width:22px!important;height:22px!important;border-radius:999px!important;background:var(--accent)!important;box-shadow:0 2px 6px rgba(0,0,0,.16)!important;transform:translateX(0)!important;transition:transform .2s ease,background .2s ease!important;}
.theme-switch.is-dark .theme-switch-thumb{transform:translateX(14px)!important;background:var(--bg-card)!important;}
.theme-switch.is-dark .theme-switch-track{background:#ffffff!important;border-color:#ffffff!important;}
.theme-switch-label{font-size:12px!important;font-weight:900!important;color:var(--text-primary)!important;min-width:34px!important;text-align:left!important;}

/* Profile font submenu */
.account-submenu{border-radius:16px!important;margin:4px 0!important;background:var(--bg-card)!important;border:1px solid transparent!important;overflow:hidden!important;}
.account-submenu > summary{list-style:none!important;}
.account-submenu > summary::-webkit-details-marker{display:none!important;}
.account-submenu-trigger{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-height:58px!important;
  padding:10px 11px!important;
  border-radius:16px!important;
  color:var(--text-primary)!important;
  cursor:pointer!important;
  user-select:none!important;
  transition:background .18s ease,border-color .18s ease!important;
}
.account-submenu-trigger:hover{background:var(--bg-subtle)!important;}
.font-menu-icon{font-size:12px!important;font-weight:950!important;letter-spacing:-.04em!important;}
.submenu-chevron{margin-left:auto!important;color:var(--text-tertiary)!important;font-size:20px!important;line-height:1!important;transition:transform .18s ease!important;}
.account-submenu[open] .submenu-chevron{transform:rotate(90deg)!important;}
.font-options{display:grid!important;grid-template-columns:1fr!important;gap:6px!important;padding:0 8px 10px 57px!important;}
.font-option{
  appearance:none!important;
  border:1px solid var(--border)!important;
  background:var(--bg-card)!important;
  color:var(--text-primary)!important;
  min-height:48px!important;
  border-radius:14px!important;
  padding:8px 10px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  cursor:pointer!important;
  transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease!important;
}
.font-option:hover{transform:translateX(2px)!important;border-color:var(--border-strong)!important;background:var(--bg-subtle)!important;box-shadow:0 8px 18px rgba(0,0,0,.06)!important;}
.font-option.active{border-color:var(--border-strong)!important;background:var(--accent-light)!important;box-shadow:inset 3px 0 0 var(--accent)!important;}
.font-option span{font-size:13px!important;font-weight:900!important;color:var(--text-primary)!important;letter-spacing:-.02em!important;}
.font-option small{font-size:11px!important;font-weight:650!important;color:var(--text-tertiary)!important;margin-top:3px!important;}

/* Theme color normalization: light */
html[data-theme="light"] body,
html[data-theme="light"] .app-layout,
html[data-theme="light"] .app-main,
html[data-theme="light"] .app-content{background:#ffffff!important;color:#050505!important;}
html[data-theme="light"] .app-topbar-menu,
html[data-theme="light"] .app-footer,
html[data-theme="light"] .topbar-dropdown-panel,
html[data-theme="light"] .topbar-menu-trigger,
html[data-theme="light"] .topbar-profile-menu > .topbar-user,
html[data-theme="light"] .card,
html[data-theme="light"] .snapshot,
html[data-theme="light"] .tr-card,
html[data-theme="light"] .rp-card,
html[data-theme="light"] .cl-card,
html[data-theme="light"] .quick-card,
html[data-theme="light"] .activity-card,
html[data-theme="light"] .birthday-card,
html[data-theme="light"] .favourite-card,
html[data-theme="light"] .nc-card,
html[data-theme="light"] .nc-guide-card,
html[data-theme="light"] .nc-chart-output,
html[data-theme="light"] .ts-form-card,
html[data-theme="light"] .ts-gate-card,
html[data-theme="light"] .rl-filters,
html[data-theme="light"] .rl-stat,
html[data-theme="light"] .hv-panel,
html[data-theme="light"] .ws-col,
html[data-theme="light"] .ws-notes-card,
html[data-theme="light"] .ws-accuracy-card,
html[data-theme="light"] .dasha-detail-panel,
html[data-theme="light"] .prem-gate-wrap,
html[data-theme="light"] .client-card,
html[data-theme="light"] .pricing-card,
html[data-theme="light"] .up-wrap,
html[data-theme="light"] .price-card,
html[data-theme="light"] .p-card,
html[data-theme="light"] .chart-library-card,
html[data-theme="light"] .client-card-row,
html[data-theme="light"] .client-chart-card,
html[data-theme="light"] .hr-card,
html[data-theme="light"] .settings-card,
html[data-theme="light"] .billing-card,
html[data-theme="light"] .section-card,
html[data-theme="light"] .form-card{background:#ffffff!important;color:#050505!important;border-color:#e5e5e5!important;}
html[data-theme="light"] .topbar-title,
html[data-theme="light"] .topbar-user-copy span,
html[data-theme="light"] .topbar-menu-trigger-copy strong,
html[data-theme="light"] .nav-copy strong,
html[data-theme="light"] .account-menu-head strong,
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] .page-title,
html[data-theme="light"] .dh-greet{color:#050505!important;}

/* Theme color normalization: dark */
html[data-theme="dark"],
html[data-theme="dark"] body,
html[data-theme="dark"] .app-layout,
html[data-theme="dark"] .app-main,
html[data-theme="dark"] .app-content{background:#050505!important;color:#ffffff!important;}
html[data-theme="dark"] body{background:#050505!important;}
html[data-theme="dark"] a{color:#ffffff!important;}
html[data-theme="dark"] .app-topbar-menu,
html[data-theme="dark"] .app-footer,
html[data-theme="dark"] .topbar-dropdown-panel,
html[data-theme="dark"] .topbar-menu-trigger,
html[data-theme="dark"] .topbar-profile-menu > .topbar-user,
html[data-theme="dark"] .account-submenu,
html[data-theme="dark"] .font-option,
html[data-theme="dark"] .card,
html[data-theme="dark"] .snapshot,
html[data-theme="dark"] .tr-card,
html[data-theme="dark"] .rp-card,
html[data-theme="dark"] .cl-card,
html[data-theme="dark"] .quick-card,
html[data-theme="dark"] .activity-card,
html[data-theme="dark"] .birthday-card,
html[data-theme="dark"] .favourite-card,
html[data-theme="dark"] .nc-card,
html[data-theme="dark"] .nc-guide-card,
html[data-theme="dark"] .nc-chart-output,
html[data-theme="dark"] .ts-form-card,
html[data-theme="dark"] .ts-gate-card,
html[data-theme="dark"] .rl-filters,
html[data-theme="dark"] .rl-stat,
html[data-theme="dark"] .hv-panel,
html[data-theme="dark"] .ws-col,
html[data-theme="dark"] .ws-notes-card,
html[data-theme="dark"] .ws-accuracy-card,
html[data-theme="dark"] .dasha-detail-panel,
html[data-theme="dark"] .prem-gate-wrap,
html[data-theme="dark"] .client-card,
html[data-theme="dark"] .pricing-card,
html[data-theme="dark"] .up-wrap,
html[data-theme="dark"] .price-card,
html[data-theme="dark"] .p-card,
html[data-theme="dark"] .chart-library-card,
html[data-theme="dark"] .client-card-row,
html[data-theme="dark"] .client-chart-card,
html[data-theme="dark"] .hr-card,
html[data-theme="dark"] .settings-card,
html[data-theme="dark"] .billing-card,
html[data-theme="dark"] .section-card,
html[data-theme="dark"] .form-card,
html[data-theme="dark"] .dh-card,
html[data-theme="dark"] .widget,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .ws-table-wrap,
html[data-theme="dark"] .compare-wrap{background:#0f0f10!important;color:#ffffff!important;border-color:#27272a!important;box-shadow:0 14px 38px rgba(0,0,0,.35)!important;}
html[data-theme="dark"] .topbar-menu-trigger:hover,
html[data-theme="dark"] .topbar-menu-trigger.active,
html[data-theme="dark"] .topbar-dropdown[open] > .topbar-menu-trigger,
html[data-theme="dark"] .topbar-profile-menu > .topbar-user:hover,
html[data-theme="dark"] .topbar-profile-menu > .topbar-user.active,
html[data-theme="dark"] .topbar-profile-menu[open] > .topbar-user,
html[data-theme="dark"] .nav-dropdown-item:hover,
html[data-theme="dark"] .account-submenu-trigger:hover,
html[data-theme="dark"] .font-option:hover{background:#18181b!important;border-color:#3f3f46!important;color:#ffffff!important;}
html[data-theme="dark"] .nav-dropdown-item,
html[data-theme="dark"] .topbar-dropdown-label,
html[data-theme="dark"] .nav-copy strong,
html[data-theme="dark"] .topbar-title,
html[data-theme="dark"] .topbar-menu-trigger-copy strong,
html[data-theme="dark"] .topbar-user-copy span,
html[data-theme="dark"] .account-menu-head strong,
html[data-theme="dark"] .font-option span,
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] .page-title,
html[data-theme="dark"] .dh-greet{color:#ffffff!important;}
html[data-theme="dark"] .topbar-kicker,
html[data-theme="dark"] .topbar-menu-trigger-copy small,
html[data-theme="dark"] .topbar-user-copy small,
html[data-theme="dark"] .account-menu-head small,
html[data-theme="dark"] .nav-copy small,
html[data-theme="dark"] small,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .muted,
html[data-theme="dark"] .help-text,
html[data-theme="dark"] .form-help,
html[data-theme="dark"] .app-footer-copy,
html[data-theme="dark"] .app-footer-copy strong,
html[data-theme="dark"] .app-footer-links a{color:#a3a3a3!important;}
html[data-theme="dark"] .nav-dropdown-item.active,
html[data-theme="dark"] .font-option.active,
html[data-theme="dark"] .tab-btn.active,
html[data-theme="dark"] .ws-tab.active,
html[data-theme="dark"] .ts-chip.active,
html[data-theme="dark"] .sky-btn.on{background:#18181b!important;color:#ffffff!important;border-color:#ffffff!important;}
html[data-theme="dark"] .nav-dropdown-item .nav-icon,
html[data-theme="dark"] .si-ico,
html[data-theme="dark"] .badge,
html[data-theme="dark"] .pill,
html[data-theme="dark"] .status,
html[data-theme="dark"] .tag{background:#18181b!important;color:#ffffff!important;border-color:#27272a!important;}
html[data-theme="dark"] .nav-dropdown-item.active .nav-icon,
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-new-chart,
html[data-theme="dark"] .nc-btn-generate,
html[data-theme="dark"] .ts-search-btn,
html[data-theme="dark"] .up-cta,
html[data-theme="dark"] .prem-gate-btn,
html[data-theme="dark"] .ws-btn-primary{background:#ffffff!important;color:#050505!important;border-color:#ffffff!important;}
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-ghost,
html[data-theme="dark"] .rfbtn,
html[data-theme="dark"] .ws-btn,
html[data-theme="dark"] .ws-btn-ghost,
html[data-theme="dark"] .ts-cancel-btn,
html[data-theme="dark"] .sky-btn,
html[data-theme="dark"] .hr-filter-btn,
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .input,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .nc-input,
html[data-theme="dark"] .nc-select,
html[data-theme="dark"] .nc-textarea,
html[data-theme="dark"] .ts-select,
html[data-theme="dark"] .ts-date-input,
html[data-theme="dark"] .ts-place-input,
html[data-theme="dark"] .ts-coord,
html[data-theme="dark"] .rl-filter-select{background:#0b0b0c!important;color:#ffffff!important;border-color:#3f3f46!important;box-shadow:none!important;}
html[data-theme="dark"] .ws-table tbody td,
html[data-theme="dark"] .sig-table tbody td,
html[data-theme="dark"] .compare-table td,
html[data-theme="dark"] .tt tbody td,
html[data-theme="dark"] .table tbody td,
html[data-theme="dark"] td{background:#0f0f10!important;color:#ffffff!important;border-color:#27272a!important;}
html[data-theme="dark"] th,
html[data-theme="dark"] .ws-table thead th,
html[data-theme="dark"] .sig-table thead th,
html[data-theme="dark"] .compare-table th,
html[data-theme="dark"] .tt thead th,
html[data-theme="dark"] .table thead th{color:#a3a3a3!important;}
html[data-theme="dark"] .topbar-brandmark,
html[data-theme="dark"] .sidebar-logo-mark,
html[data-theme="dark"] .topbar-avatar-placeholder,
html[data-theme="dark"] .account-menu-avatar-placeholder{background:#ffffff!important;color:#050505!important;border-color:#ffffff!important;}
html[data-theme="dark"] .plan-badge,
html[data-theme="dark"] .plan-badge.premium,
html[data-theme="dark"] .plan-badge.free{background:#0f0f10!important;color:#ffffff!important;border-color:#3f3f46!important;}
html[data-theme="dark"] hr,
html[data-theme="dark"] .topbar-dropdown-divider,
html[data-theme="dark"] .account-menu-head{border-color:#27272a!important;background-color:#27272a!important;}


/* ============================================================
   V18 final shell lock: Urbanist + white/black only
   ============================================================ */
:root{
  --font:'Urbanist', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif!important;
  --font-urbanist:'Urbanist', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif!important;
  --app-font-family:var(--font-urbanist)!important;
  --bg:#ffffff!important;
  --bg-subtle:#fafafa!important;
  --bg-hover:#f4f4f5!important;
  --bg-card:#ffffff!important;
  --bg-elevated:#ffffff!important;
  --border:#e5e5e5!important;
  --border-med:#d4d4d4!important;
  --border-strong:#050505!important;
  --text-primary:#050505!important;
  --text-secondary:#171717!important;
  --text-tertiary:#525252!important;
  --text-muted:#737373!important;
  --accent:#050505!important;
  --accent-hover:#000000!important;
  --accent-light:#f5f5f5!important;
  --accent-muted:rgba(0,0,0,.055)!important;
  --focus-ring:rgba(0,0,0,.16)!important;
  --topbar-shell-gap:16px!important;
  --topbar-shell-space:calc(var(--topbar-h) + var(--topbar-shell-gap))!important;
  --app-footer-h:62px!important;
  --app-footer-gap:16px!important;
  --app-footer-shell-space:calc(var(--app-footer-h) + var(--app-footer-gap))!important;
}
html,
html[data-theme],
html[data-font],
body,
button,
input,
select,
textarea,
.btn,
.nav-dropdown-item,
.topbar-menu-trigger,
.topbar-user,
.card,
.table,
.tt,
.ws-table,
.sig-table,
.compare-table,
svg text{font-family:var(--app-font-family)!important;}
html,
html[data-theme="dark"],
html[data-theme="light"]{background:#ffffff!important;color:#050505!important;}
body,
body:has(.app-layout-topnav){height:100dvh!important;min-height:100dvh!important;overflow:hidden!important;background:#ffffff!important;color:#050505!important;}
.kp-ambient-shell{display:none!important;}
.app-layout-topnav{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;min-height:100dvh!important;overflow:hidden!important;background:#ffffff!important;color:#050505!important;}
.app-layout-topnav .app-main{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;min-height:100dvh!important;margin:0!important;padding:0 22px!important;overflow:hidden!important;background:#ffffff!important;color:#050505!important;}
.app-layout-topnav .app-topbar-menu{position:fixed!important;top:0!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translateX(-50%)!important;width:min(1720px, calc(100vw - 44px))!important;max-width:none!important;margin:0!important;z-index:10000!important;background:rgba(255,255,255,.98)!important;color:#050505!important;border-color:#e5e5e5!important;box-shadow:0 10px 30px rgba(0,0,0,.055)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;}
.app-layout-topnav .app-content{position:fixed!important;top:var(--topbar-shell-space)!important;bottom:var(--app-footer-shell-space)!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;width:min(1560px, calc(100vw - 44px))!important;height:auto!important;min-height:0!important;max-height:none!important;margin:0!important;padding:24px clamp(18px,2.2vw,38px) 44px!important;overflow-y:auto!important;overflow-x:hidden!important;background:#ffffff!important;color:#050505!important;border:0!important;border-radius:0!important;box-shadow:none!important;scrollbar-gutter:stable!important;-webkit-overflow-scrolling:touch!important;}
.app-layout-topnav .app-footer{position:fixed!important;left:50%!important;right:auto!important;bottom:0!important;top:auto!important;transform:translateX(-50%)!important;width:min(1720px, calc(100vw - 44px))!important;min-height:var(--app-footer-h)!important;max-height:var(--app-footer-h)!important;max-width:none!important;margin:0!important;z-index:9999!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;padding:12px 18px!important;background:rgba(255,255,255,.98)!important;color:#525252!important;border:0!important;border-top:1px solid #e5e5e5!important;border-radius:0!important;box-shadow:0 -10px 30px rgba(0,0,0,.055)!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;}
.theme-switch,
.account-submenu.font-submenu{display:none!important;}
html[data-theme="dark"] body,
html[data-theme="dark"] .app-layout,
html[data-theme="dark"] .app-main,
html[data-theme="dark"] .app-content,
html[data-theme="dark"] .app-topbar-menu,
html[data-theme="dark"] .app-footer,
html[data-theme="dark"] .topbar-dropdown-panel,
html[data-theme="dark"] .topbar-menu-trigger,
html[data-theme="dark"] .topbar-profile-menu > .topbar-user,
html[data-theme="dark"] .card,
html[data-theme="dark"] .snapshot,
html[data-theme="dark"] .tr-card,
html[data-theme="dark"] .rp-card,
html[data-theme="dark"] .cl-card,
html[data-theme="dark"] .quick-card,
html[data-theme="dark"] .activity-card,
html[data-theme="dark"] .birthday-card,
html[data-theme="dark"] .favourite-card,
html[data-theme="dark"] .nc-card,
html[data-theme="dark"] .nc-guide-card,
html[data-theme="dark"] .nc-chart-output,
html[data-theme="dark"] .ts-form-card,
html[data-theme="dark"] .ts-gate-card,
html[data-theme="dark"] .rl-filters,
html[data-theme="dark"] .rl-stat,
html[data-theme="dark"] .hv-panel,
html[data-theme="dark"] .ws-col,
html[data-theme="dark"] .ws-notes-card,
html[data-theme="dark"] .ws-accuracy-card,
html[data-theme="dark"] .dasha-detail-panel,
html[data-theme="dark"] .prem-gate-wrap,
html[data-theme="dark"] .client-card,
html[data-theme="dark"] .pricing-card,
html[data-theme="dark"] .up-wrap,
html[data-theme="dark"] .price-card,
html[data-theme="dark"] .p-card,
html[data-theme="dark"] .chart-library-card,
html[data-theme="dark"] .client-card-row,
html[data-theme="dark"] .client-chart-card,
html[data-theme="dark"] .hr-card,
html[data-theme="dark"] .settings-card,
html[data-theme="dark"] .billing-card,
html[data-theme="dark"] .section-card,
html[data-theme="dark"] .form-card{background:#ffffff!important;color:#050505!important;border-color:#e5e5e5!important;box-shadow:none;}
html[data-theme="dark"] a,
html[data-theme="dark"] .nav-dropdown-item,
html[data-theme="dark"] .topbar-title,
html[data-theme="dark"] .topbar-user-copy span,
html[data-theme="dark"] .topbar-menu-trigger-copy strong,
html[data-theme="dark"] .nav-copy strong,
html[data-theme="dark"] .account-menu-head strong,
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] .page-title,
html[data-theme="dark"] .dh-greet{color:#050505!important;}


/* ============================================================
   V19 desktop overflow hardening
   Keeps large workspace surfaces from clipping inside the frame.
   Mobile and tablet browsing is blocked by the desktop-only gate.
   ============================================================ */
.app-layout-topnav .app-content,
.app-layout-topnav .app-topbar-menu,
.app-layout-topnav .app-footer{max-width:100vw!important;}
.app-layout-topnav .app-content *{max-width:100%;box-sizing:border-box;}
#north-chart svg,
#south-chart svg,
#sky-chart svg,
.chart-svg-wrap svg,
.snap-chart-col svg{max-width:100%!important;height:auto!important;display:block!important;margin-inline:auto!important;}
.table-wrap,.ws-table-wrap,.compare-wrap{max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
.ws-table,.sig-table,.compare-table,.table{min-width:max-content!important;}


/* ============================================================
   V19 shell border + full-height page fill
   ============================================================ */
.app-layout-topnav .app-content{
  border:1px solid #e5e7eb!important;
  border-radius:18px!important;
  box-shadow:0 10px 30px rgba(0,0,0,.045)!important;
  box-sizing:border-box!important;
  background:#ffffff!important;
}
body:has(.ws-page) .app-content{
  padding:0!important;
  border:1px solid #e5e7eb!important;
  border-radius:18px!important;
  background:#f7f7f8!important;
}
body:has(.ws-page) .ws-page,
body:has(.hv-outer) .hv-outer,
.nc-page,
.ts-page,
.hr-page,
.up-wrap{
  min-height:100%!important;
  box-sizing:border-box!important;
}


/* ============================================================
   V20 joined shell: reduced header gap + continuous outer border
   ============================================================ */
:root{
  --kp-joined-shell-w:min(1720px, calc(100vw - 44px))!important;
  --topbar-shell-gap:6px!important;
  --topbar-shell-space:calc(var(--topbar-h) + var(--topbar-shell-gap))!important;
  --app-footer-gap:6px!important;
  --app-footer-shell-space:calc(var(--app-footer-h) + var(--app-footer-gap))!important;
}
.app-layout-topnav{position:relative!important;}
.app-layout-topnav::before{
  content:""!important;
  position:fixed!important;
  top:0!important;
  bottom:0!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:var(--kp-joined-shell-w)!important;
  border:1px solid #e5e7eb!important;
  border-radius:22px!important;
  box-shadow:0 10px 30px rgba(0,0,0,.035)!important;
  pointer-events:none!important;
  z-index:9996!important;
  box-sizing:border-box!important;
}
.app-layout-topnav .app-topbar-menu,
.app-layout-topnav .app-content,
.app-layout-topnav .app-footer{
  width:var(--kp-joined-shell-w)!important;
  max-width:none!important;
  box-sizing:border-box!important;
}
.app-layout-topnav .app-topbar-menu{
  border:0!important;
  border-bottom:1px solid #e5e7eb!important;
  border-radius:22px 22px 0 0!important;
  box-shadow:none!important;
}
.app-layout-topnav .app-content{
  position:fixed!important;
  top:var(--topbar-shell-space)!important;
  bottom:var(--app-footer-shell-space)!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:16px clamp(16px,1.8vw,30px) 28px!important;
  background:#ffffff!important;
  border-left:1px solid #e5e7eb!important;
  border-right:1px solid #e5e7eb!important;
  border-top:0!important;
  border-bottom:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  scrollbar-gutter:stable!important;
}
.app-layout-topnav .app-footer{
  border:0!important;
  border-top:1px solid #e5e7eb!important;
  border-radius:0 0 22px 22px!important;
  box-shadow:none!important;
}
body:has(.ws-page) .app-content,
body:has(.hv-outer) .app-content{
  padding:0!important;
  background:#f7f7f8!important;
}
body:has(.ws-page) .ws-page,
body:has(.hv-outer) .hv-outer{
  width:100%!important;
  min-height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  box-sizing:border-box!important;
}
body:has(.ws-page) .ws-pane.active{
  flex:1 1 auto!important;
  min-height:0!important;
}
body:has(.ws-page) .ws-header,
body:has(.hv-outer) .hv-case-header{
  border-left:0!important;
  border-right:0!important;
  border-top:0!important;
  border-radius:0!important;
  margin:0!important;
}
body:has(.ws-page) .ws-tabs{
  margin:10px 14px 0!important;
  width:auto!important;
  max-width:calc(100% - 28px)!important;
}
.app-layout-topnav .app-content > .ts-page,
.app-layout-topnav .app-content > .nc-page,
.app-layout-topnav .app-content > .hr-page,
.app-layout-topnav .app-content > .up-wrap,
.app-layout-topnav .app-content > .page-shell,
.app-layout-topnav .app-content > .section-card,
.app-layout-topnav .app-content > .settings-page,
.app-layout-topnav .app-content > .billing-page{
  width:100%!important;
  max-width:none!important;
  min-height:100%!important;
  margin:0!important;
  box-sizing:border-box!important;
}
.app-layout-topnav .app-content > .ts-page,
.app-layout-topnav .app-content > .nc-page,
.app-layout-topnav .app-content > .hr-page{
  padding:clamp(16px,1.8vw,28px)!important;
}


/* ============================================================
   V20 SaaS workspace density + continuous shell refinement
   - reduce first-fold dead space
   - keep header/content/footer visually joined
   - make section discovery feel intentional on data-heavy pages
   ============================================================ */
:root{
  --topbar-shell-gap:8px!important;
  --topbar-shell-space:calc(var(--topbar-h) + var(--topbar-shell-gap))!important;
  --app-footer-gap:10px!important;
  --app-footer-shell-space:calc(var(--app-footer-h) + var(--app-footer-gap))!important;
}
.app-layout-topnav .app-topbar-menu{
  border-left:1px solid var(--border)!important;
  border-right:1px solid var(--border)!important;
  border-bottom:1px solid var(--border)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.045)!important;
}
.app-layout-topnav .app-content{
  padding-top:14px!important;
  padding-bottom:28px!important;
  border-left:1px solid var(--border)!important;
  border-right:1px solid var(--border)!important;
}
.app-layout-topnav .app-footer{
  border-left:1px solid var(--border)!important;
  border-right:1px solid var(--border)!important;
  border-top:1px solid var(--border)!important;
  box-shadow:0 -8px 24px rgba(0,0,0,.045)!important;
}
body:has(.ws-page) .app-content{
  padding-top:12px!important;
  padding-bottom:24px!important;
}


/* ============================================================
   V21 UX polish: no wasted shell gap + compact fixed chrome
   ============================================================ */
:root{
  --topbar-h:66px!important;
  --topbar-shell-gap:0px!important;
  --topbar-shell-space:var(--topbar-h)!important;
  --app-footer-gap:0px!important;
  --app-footer-shell-space:var(--app-footer-h)!important;
}
.app-layout-topnav .app-topbar-menu{
  min-height:var(--topbar-h)!important;
  padding:8px 14px!important;
  border-radius:22px 22px 0 0!important;
  box-shadow:none!important;
}
.app-layout-topnav .topbar-brandmark{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  flex-basis:38px!important;
  border-radius:13px!important;
}
.topbar-menu-trigger,
.topbar-profile-menu > .topbar-user{
  min-height:42px!important;
}
.app-layout-topnav .app-content{
  top:var(--topbar-shell-space)!important;
  bottom:var(--app-footer-shell-space)!important;
  padding-top:0!important;
  padding-bottom:24px!important;
  border-top:0!important;
  border-bottom:0!important;
}
body:has(.ws-page) .app-content,
body:has(.hv-outer) .app-content{
  padding-top:0!important;
  padding-bottom:0!important;
}
.app-layout-topnav .app-footer{
  border-radius:0 0 22px 22px!important;
  box-shadow:none!important;
}


/* ============================================================
   V22 workspace UX system: no hidden content + sticky context
   - fixed footer no longer traps the final rows/sections
   - chart tabs stay available while the workspace scrolls
   - top chrome is tighter so the client header starts immediately
   ============================================================ */
:root{
  --topbar-h:64px!important;
  --topbar-shell-gap:0px!important;
  --topbar-shell-space:var(--topbar-h)!important;
  --app-footer-h:42px!important;
  --app-footer-gap:0px!important;
  --app-footer-shell-space:var(--app-footer-h)!important;
  --workspace-bottom-safe:calc(var(--app-footer-h) + 44px + env(safe-area-inset-bottom, 0px))!important;
}
.app-layout-topnav .app-topbar-menu{
  min-height:var(--topbar-h)!important;
  height:var(--topbar-h)!important;
  padding:7px 14px!important;
  align-items:center!important;
  border-radius:22px 22px 0 0!important;
  box-shadow:none!important;
}
.app-layout-topnav .topbar-brandmark{
  width:36px!important;height:36px!important;min-width:36px!important;flex-basis:36px!important;border-radius:12px!important;
}
.app-layout-topnav .topbar-title{font-size:15px!important;line-height:1.1!important;}
.app-layout-topnav .topbar-kicker{font-size:11px!important;line-height:1.1!important;}
.app-layout-topnav .topbar-menu-trigger,
.app-layout-topnav .topbar-profile-menu > .topbar-user{min-height:40px!important;padding-top:6px!important;padding-bottom:6px!important;}
.app-layout-topnav .app-content{
  top:var(--topbar-shell-space)!important;
  bottom:0!important;
  padding-top:0!important;
  padding-bottom:var(--workspace-bottom-safe)!important;
  scroll-padding-top:58px!important;
  scroll-padding-bottom:var(--workspace-bottom-safe)!important;
  overscroll-behavior:contain!important;
}
body:has(.ws-page) .app-content,
body:has(.hv-outer) .app-content{
  top:var(--topbar-shell-space)!important;
  bottom:0!important;
  padding:0!important;
  scroll-padding-top:62px!important;
  scroll-padding-bottom:var(--workspace-bottom-safe)!important;
  background:#f7f7f8!important;
}
.app-layout-topnav .app-footer{
  min-height:var(--app-footer-h)!important;
  max-height:var(--app-footer-h)!important;
  height:var(--app-footer-h)!important;
  padding:7px 18px!important;
  font-size:11px!important;
  z-index:9997!important;
  background:rgba(255,255,255,.96)!important;
  border-radius:0 0 22px 22px!important;
  box-shadow:0 -8px 22px rgba(0,0,0,.035)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.app-footer-copy,
.app-footer-links{font-size:11px!important;line-height:1.2!important;}
.app-footer-links{gap:14px!important;}
body:has(.ws-page) .ws-page,
body:has(.hv-outer) .hv-outer{
  min-height:calc(100dvh - var(--topbar-shell-space))!important;
  padding-bottom:var(--workspace-bottom-safe)!important;
  box-sizing:border-box!important;
}
body:has(.ws-page) .ws-header,
body:has(.hv-outer) .hv-case-header{
  padding:12px 20px!important;
  margin:0!important;
  border-radius:0!important;
  border-left:0!important;border-right:0!important;border-top:0!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:none!important;
}
body:has(.ws-page) .ws-client-name{font-size:30px!important;line-height:1.02!important;letter-spacing:-.04em!important;}
body:has(.ws-page) .ws-meta-strip{margin-top:7px!important;gap:8px!important;}
body:has(.ws-page) .ws-header-actions{gap:8px!important;}
body:has(.ws-page) .ws-btn{min-height:36px!important;padding:8px 12px!important;}
body:has(.ws-page) .ws-notes-icon-btn{width:36px!important;height:36px!important;min-width:36px!important;}
body:has(.ws-page) .ws-tabs{
  position:sticky!important;
  top:0!important;
  z-index:700!important;
  margin:0!important;
  width:100%!important;
  max-width:100%!important;
  padding:8px 12px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  overflow-x:auto!important;
  white-space:nowrap!important;
  scrollbar-width:none!important;
  background:rgba(255,255,255,.96)!important;
  border-top:1px solid var(--border)!important;
  border-bottom:1px solid var(--border)!important;
  border-radius:0!important;
  box-shadow:0 8px 24px rgba(0,0,0,.045)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
body:has(.ws-page) .ws-tabs::-webkit-scrollbar{display:none!important;}
body:has(.ws-page) .ws-tab{
  flex:1 0 max(132px, calc((100% - 40px) / 6))!important;
  justify-content:center!important;
  min-height:38px!important;
  padding:9px 12px!important;
  border-radius:12px!important;
}
body:has(.ws-page) .ws-tab.active{
  box-shadow:0 8px 20px rgba(0,0,0,.065)!important;
}
body:has(.ws-page) .ws-pane{
  padding-bottom:28px!important;
}
body:has(.ws-page) .ws-pane.active{
  min-height:auto!important;
}
body:has(.ws-page) .ws-pane > *:last-child,
body:has(.hv-outer) .hv-outer > *:last-child,
.app-layout-topnav .app-content > *:last-child{
  margin-bottom:24px!important;
}
body:has(.ws-page) #chart-summary-card,
body:has(.ws-page) .ws-pane > div:first-child:not(.ws-tabs){
  margin-top:14px!important;
}
body:has(.ws-page) #chart-planets-card{
  margin-bottom:24px!important;
}
body:has(.ws-page) .ws-table-wrap,
body:has(.ws-page) .table-wrap,
body:has(.ws-page) .compare-wrap{
  overflow:auto!important;
  max-height:none!important;
  -webkit-overflow-scrolling:touch!important;
}
body:has(.ws-page) .ws-table thead th,
body:has(.ws-page) .sig-table thead th,
body:has(.ws-page) .compare-table th{
  position:sticky!important;
  top:0!important;
  z-index:2!important;
  background:#f8f9fa!important;
}
.notes-drawer{
  top:var(--topbar-shell-space)!important;
  height:calc(100dvh - var(--topbar-shell-space))!important;
  border-radius:18px 0 0 0!important;
}
.notes-drawer-backdrop{top:var(--topbar-shell-space)!important;}


/* ── V8 consultation notes drawer: compact editor sheet ───────────── */
body:has(.ws-page) .notes-drawer{
  height:auto!important;
  max-height:calc(100dvh - var(--topbar-shell-space) - 28px)!important;
  width:min(540px,calc(100vw - 28px))!important;
  border:1px solid var(--border)!important;
  border-right:0!important;
  border-radius:18px 0 0 18px!important;
  overflow:hidden!important;
}
body:has(.ws-page) .notes-drawer-body{
  flex:0 0 auto!important;
  padding:16px 20px!important;
}
body:has(.ws-page) .notes-drawer .ws-notes-textarea{
  flex:0 0 auto!important;
  min-height:260px!important;
  height:clamp(260px,42dvh,430px)!important;
  max-height:430px!important;
  resize:vertical!important;
}


/* ============================================================
   V9 — Executive SaaS polish pass
   Goal: premium first impression, calmer workspace density,
   tactile micro-interactions, and no hidden content.
   ============================================================ */
:root{
  --font:'Plus Jakarta Sans','Urbanist',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
  --app-font-family:'Plus Jakarta Sans','Urbanist',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif!important;
  --topbar-h:62px!important;
  --topbar-shell-gap:0px!important;
  --topbar-shell-space:var(--topbar-h)!important;
  --app-footer-h:40px!important;
  --app-footer-gap:0px!important;
  --app-footer-shell-space:var(--app-footer-h)!important;
  --workspace-bottom-safe:calc(var(--app-footer-h) + 68px + env(safe-area-inset-bottom,0px))!important;
  --kp-ink:#07111f;
  --kp-ink-2:#172338;
  --kp-muted:#6d7f92;
  --kp-line:rgba(148,163,184,.26);
  --kp-line-strong:rgba(100,116,139,.32);
  --kp-gold:#c4934d;
  --kp-gold-soft:#fff6e6;
  --kp-blue:#5f91bf;
  --kp-blue-soft:#edf7ff;
  --kp-shell:#fbfdff;
  --kp-surface:rgba(255,255,255,.86);
  --kp-surface-strong:rgba(255,255,255,.96);
  --kp-shadow-soft:0 18px 55px rgba(30,58,86,.09),0 1px 0 rgba(255,255,255,.86) inset;
  --kp-shadow-lift:0 28px 80px rgba(30,58,86,.14),0 1px 0 rgba(255,255,255,.92) inset;
  --kp-ease:cubic-bezier(.2,.8,.2,1);
}

html,body,button,input,select,textarea,.btn,.nav-dropdown-item,.topbar-menu-trigger,.topbar-user,.ws-tab,.tab-btn{
  font-family:var(--font)!important;
}
body:has(.app-layout-topnav){
  background:
    radial-gradient(circle at 9% 7%, rgba(255,255,255,.92), transparent 26%),
    radial-gradient(circle at 78% 0%, rgba(211,231,247,.62), transparent 30%),
    radial-gradient(circle at 86% 86%, rgba(245,231,204,.28), transparent 25%),
    linear-gradient(140deg,#f7fbff 0%,#eef6fb 44%,#e8f0f7 100%)!important;
  color:var(--kp-ink)!important;
}
.kp-ambient-shell{opacity:.9!important;}
.kp-ambient-shell::before{background:rgba(255,255,255,.78)!important;}
.kp-ambient-shell::after{background:rgba(194,222,243,.60)!important;}

/* Joined shell + reliable scroll area */
.app-layout-topnav .app-main{background:transparent!important;padding:0 22px!important;}
.app-layout-topnav .app-topbar-menu,
.app-layout-topnav .app-content,
.app-layout-topnav .app-footer{
  width:min(1740px,calc(100vw - 44px))!important;
  max-width:none!important;
}
.app-layout-topnav .app-content{
  top:var(--topbar-shell-space)!important;
  bottom:var(--app-footer-shell-space)!important;
  padding:0 16px calc(var(--workspace-bottom-safe) + 16px)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.68),rgba(247,251,255,.48))!important;
  border-left:1px solid rgba(191,207,222,.42)!important;
  border-right:1px solid rgba(191,207,222,.42)!important;
  border-radius:0!important;
  box-shadow:0 28px 90px rgba(30,58,86,.10)!important;
  scroll-padding-top:72px!important;
  scroll-padding-bottom:var(--workspace-bottom-safe)!important;
}
body:has(.ws-page) .app-content,
body:has(.hv-outer) .app-content{
  padding:0 0 calc(var(--workspace-bottom-safe) + 20px)!important;
}
.app-layout-topnav .app-footer{
  min-height:var(--app-footer-h)!important;
  height:var(--app-footer-h)!important;
  padding:8px 18px!important;
  background:rgba(255,255,255,.88)!important;
  border:1px solid rgba(191,207,222,.42)!important;
  border-top-color:rgba(148,163,184,.22)!important;
  border-radius:0 0 22px 22px!important;
  box-shadow:0 -10px 28px rgba(30,58,86,.055)!important;
  backdrop-filter:blur(18px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%)!important;
}
.app-footer-copy,.app-footer-links,.app-footer-links a{font-size:10.5px!important;color:#7b8795!important;}
.app-footer-links a:hover{color:var(--kp-ink)!important;}

/* Premium header/menu treatment */
.app-layout-topnav .app-topbar-menu{
  height:var(--topbar-h)!important;
  min-height:var(--topbar-h)!important;
  padding:8px 16px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(249,252,255,.88))!important;
  border:1px solid rgba(191,207,222,.42)!important;
  border-bottom-color:rgba(148,163,184,.25)!important;
  border-radius:22px 22px 0 0!important;
  box-shadow:0 16px 45px rgba(30,58,86,.09),0 1px 0 rgba(255,255,255,.92) inset!important;
  backdrop-filter:blur(22px) saturate(165%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(165%)!important;
  overflow:visible!important;
}
.app-layout-topnav .app-topbar-menu::before{
  content:"";
  position:absolute;
  left:14px;right:14px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(196,147,77,.55),rgba(95,145,191,.42),transparent);
  opacity:.9;
  pointer-events:none;
}
.kp-scroll-progress{
  position:absolute;left:0;bottom:-1px;height:2px;width:var(--kp-scroll-progress,0%);
  background:linear-gradient(90deg,var(--kp-gold),var(--kp-blue));
  border-radius:999px;box-shadow:0 0 12px rgba(196,147,77,.28);
  transition:width .12s linear;
}
.topbar-brand-link{gap:11px!important;}
.app-layout-topnav .topbar-brandmark{
  width:38px!important;height:38px!important;min-width:38px!important;flex-basis:38px!important;
  border-radius:14px!important;
  background:radial-gradient(circle at 24% 20%,#3a475a 0%,#111827 44%,#020617 100%)!important;
  color:#fff!important;
  box-shadow:0 12px 30px rgba(2,6,23,.20),0 0 0 1px rgba(196,147,77,.35),inset 0 1px 0 rgba(255,255,255,.22)!important;
}
.app-layout-topnav .topbar-brandmark span{font-weight:900!important;letter-spacing:-.08em!important;}
.app-layout-topnav .topbar-title{font-weight:900!important;letter-spacing:-.045em!important;color:var(--kp-ink)!important;}
.app-layout-topnav .topbar-kicker{font-weight:650!important;color:var(--kp-muted)!important;}
.app-layout-topnav .topbar-nav{margin-inline:auto!important;}
.app-layout-topnav .topbar-nav-scroll{gap:10px!important;}
.topbar-menu-trigger{
  min-height:42px!important;
  padding:6px 14px 6px 8px!important;
  gap:10px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(191,207,222,.70)!important;
  box-shadow:0 10px 26px rgba(30,58,86,.06),inset 0 1px 0 rgba(255,255,255,.92)!important;
  transition:transform .18s var(--kp-ease),box-shadow .18s var(--kp-ease),border-color .18s var(--kp-ease),background .18s var(--kp-ease)!important;
}
.topbar-menu-trigger:hover,
.topbar-menu-trigger.active,
.topbar-dropdown[open] > .topbar-menu-trigger{
  transform:translateY(-1px)!important;
  background:#fff!important;
  border-color:rgba(196,147,77,.36)!important;
  box-shadow:0 16px 38px rgba(30,58,86,.10),0 0 0 4px rgba(196,147,77,.07)!important;
}
.topbar-menu-emblem{
  width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 30px;
  border-radius:999px;color:#223047;
  background:linear-gradient(180deg,#fff,#eef6fb);
  border:1px solid rgba(191,207,222,.76);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 8px 18px rgba(30,58,86,.06);
}
.topbar-menu-emblem svg{width:15px!important;height:15px!important;}
.topbar-menu-trigger-copy strong{font-size:12.5px!important;font-weight:900!important;color:var(--kp-ink)!important;}
.topbar-menu-trigger-copy small{font-size:10.5px!important;font-weight:650!important;color:var(--kp-muted)!important;margin-top:2px!important;}
.plan-badge{
  display:inline-flex!important;align-items:center!important;gap:7px!important;
  padding:7px 11px!important;border-radius:999px!important;
  background:linear-gradient(180deg,#fffdf8,#fff4df)!important;
  color:#7d5421!important;border:1px solid rgba(196,147,77,.34)!important;
  box-shadow:0 9px 22px rgba(196,147,77,.09),inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.plan-badge.free{background:#fff!important;color:var(--kp-muted)!important;border-color:var(--kp-line)!important;}
.plan-badge-dot{width:7px;height:7px;border-radius:50%;background:var(--kp-gold);box-shadow:0 0 0 4px rgba(196,147,77,.15),0 0 12px rgba(196,147,77,.45);}
.plan-badge.free .plan-badge-dot{background:#94a3b8;box-shadow:0 0 0 4px rgba(148,163,184,.15);}
.topbar-user{
  border-radius:999px!important;background:#fff!important;border:1px solid rgba(191,207,222,.72)!important;
  box-shadow:0 10px 26px rgba(30,58,86,.07)!important;
  transition:transform .18s var(--kp-ease),box-shadow .18s var(--kp-ease)!important;
}
.topbar-user:hover,.topbar-profile-menu[open]>.topbar-user{transform:translateY(-1px)!important;box-shadow:0 16px 38px rgba(30,58,86,.11)!important;}
.topbar-avatar,.topbar-avatar-placeholder{box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(196,147,77,.38),0 10px 22px rgba(30,58,86,.12)!important;}
.topbar-dropdown-panel{
  border-radius:22px!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(191,207,222,.70)!important;
  box-shadow:0 28px 80px rgba(15,23,42,.17),inset 0 1px 0 rgba(255,255,255,.96)!important;
  backdrop-filter:blur(24px) saturate(160%)!important;
  -webkit-backdrop-filter:blur(24px) saturate(160%)!important;
  transform-origin:top center;
}
.topbar-dropdown[open] .topbar-dropdown-panel{animation:kpDropIn .18s var(--kp-ease) both;}
@keyframes kpDropIn{from{opacity:0;transform:translateY(-6px) scale(.985);}to{opacity:1;transform:translateY(0) scale(1);}}
.nav-dropdown-item{border-radius:15px!important;transition:background .16s var(--kp-ease),transform .16s var(--kp-ease),box-shadow .16s var(--kp-ease)!important;}
.nav-dropdown-item:hover{transform:translateX(2px)!important;background:linear-gradient(90deg,var(--kp-blue-soft),#fff)!important;box-shadow:inset 3px 0 0 var(--kp-blue)!important;}
.nav-dropdown-item.active{background:linear-gradient(90deg,var(--kp-gold-soft),#fff)!important;box-shadow:inset 3px 0 0 var(--kp-gold)!important;}

/* Cards and data surfaces: premium but stable */
.card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,
.nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,
.hv-panel,.ws-col,.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,
.client-card,.pricing-card,.up-wrap,.price-card,.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,
.settings-card,.billing-card,.section-card,.form-card,.login-card,.hero-card,.feature-card,.faq-card{
  border-radius:22px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(248,252,255,.84))!important;
  border:1px solid rgba(191,207,222,.62)!important;
  box-shadow:var(--kp-shadow-soft)!important;
  transition:box-shadow .22s var(--kp-ease),border-color .22s var(--kp-ease),transform .22s var(--kp-ease)!important;
}
.ws-col:hover,.hv-panel:hover,.card:hover{transform:none!important;}
.client-card-row:hover,.chart-library-card:hover,.client-chart-card:hover,.quick-card:hover,.pricing-card:hover,.hr-card:hover{
  transform:translateY(-2px)!important;box-shadow:var(--kp-shadow-lift)!important;border-color:rgba(95,145,191,.34)!important;
}
.card-header,.snapshot-hdr,.tr-hdr,.rp-hdr,.cl-hdr,.nc-section-head,.hv-panel-hdr,.ws-col-hdr,.ws-section-hdr{
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(244,249,253,.72))!important;
  border-bottom:1px solid rgba(191,207,222,.45)!important;
}
.card-title,.dh-greet,.page-title,.rl-header-title,.ts-title,.hindex-title,.hv-title,.nc-header h1,.ws-client-name{
  letter-spacing:-.055em!important;font-weight:900!important;color:var(--kp-ink)!important;
}
.text-muted,.page-sub,.dh-sub,.rl-header-sub,.ts-subtitle,.hindex-sub,.hv-sub,.nc-header-sub{color:var(--kp-muted)!important;}

/* Workspace page hierarchy */
body:has(.ws-page) .ws-page,
body:has(.hv-outer) .hv-outer{padding-bottom:calc(var(--workspace-bottom-safe) + 12px)!important;}
body:has(.ws-page) .ws-header,
body:has(.hv-outer) .hv-case-header{
  padding:14px 20px!important;margin:0!important;border-radius:0!important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,252,255,.92))!important;
  border-bottom:1px solid rgba(191,207,222,.42)!important;
  box-shadow:0 8px 28px rgba(30,58,86,.045)!important;
}
body:has(.ws-page) .ws-client-name{font-size:clamp(26px,2.1vw,34px)!important;}
body:has(.ws-page) .ws-meta-strip{gap:10px 14px!important;color:var(--kp-muted)!important;}
body:has(.ws-page) .ws-header-actions{gap:9px!important;}
.ws-btn,.ws-btn-ghost,.btn-secondary,.btn-ghost,.rfbtn,.sky-btn,.hr-filter-btn{
  background:rgba(255,255,255,.86)!important;
  border-color:rgba(191,207,222,.68)!important;
  box-shadow:0 9px 22px rgba(30,58,86,.06),inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.ws-btn-primary,.btn-primary,.btn-new-chart,.nc-btn-generate,.ts-search-btn,.up-cta,.prem-gate-btn{
  background:linear-gradient(135deg,#07111f,#1f344f 58%,#2f4966)!important;
  color:#fff!important;border-color:rgba(7,17,31,.88)!important;
  box-shadow:0 18px 42px rgba(7,17,31,.18),inset 0 1px 0 rgba(255,255,255,.20)!important;
}
.btn:hover,.ws-btn:hover,.ws-btn-primary:hover,.btn-primary:hover,.btn-secondary:hover,.btn-ghost:hover{transform:translateY(-1px)!important;}
body:has(.ws-page) .ws-tabs{
  top:0!important;
  padding:8px 12px!important;
  gap:8px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(242,248,252,.88))!important;
  border-top:0!important;border-bottom:1px solid rgba(191,207,222,.45)!important;
  box-shadow:0 12px 28px rgba(30,58,86,.075)!important;
  backdrop-filter:blur(20px) saturate(160%)!important;-webkit-backdrop-filter:blur(20px) saturate(160%)!important;
}
body:has(.ws-page) .ws-tabs.is-scrolled{box-shadow:0 16px 38px rgba(30,58,86,.11)!important;}
body:has(.ws-page) .ws-tab{
  min-height:38px!important;border-radius:999px!important;font-weight:850!important;color:#5c6b7c!important;
  border:1px solid transparent!important;background:transparent!important;transition:background .18s var(--kp-ease),box-shadow .18s var(--kp-ease),color .18s var(--kp-ease),transform .18s var(--kp-ease)!important;
}
body:has(.ws-page) .ws-tab:hover{background:rgba(255,255,255,.78)!important;color:var(--kp-ink)!important;transform:translateY(-1px)!important;}
body:has(.ws-page) .ws-tab.active{
  color:var(--kp-ink)!important;background:#fff!important;border-color:rgba(196,147,77,.30)!important;
  box-shadow:0 12px 26px rgba(30,58,86,.10),0 0 0 4px rgba(196,147,77,.06)!important;
}
body:has(.ws-page) .ws-tab.active::after{
  content:"";position:absolute;left:22%;right:22%;bottom:4px;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--kp-gold),var(--kp-blue));
}
body:has(.ws-page) #chart-summary-card,
body:has(.ws-page) .ws-pane > div:first-child:not(.ws-tabs){margin-top:12px!important;}
body:has(.ws-page) .ws-pane{padding-bottom:36px!important;}
body:has(.ws-page) #chart-planets-card{margin-bottom:calc(var(--workspace-bottom-safe) + 18px)!important;}

/* Tables: more legible premium console */
.table-wrap,.ws-table-wrap,.compare-wrap,.kp-data-surface{
  border-radius:18px!important;background:rgba(255,255,255,.56)!important;border:1px solid rgba(191,207,222,.42)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.86)!important;
  scrollbar-width:thin;scrollbar-color:rgba(95,145,191,.48) transparent;
}
.table-wrap::-webkit-scrollbar,.ws-table-wrap::-webkit-scrollbar,.compare-wrap::-webkit-scrollbar{height:10px;width:10px;}
.table-wrap::-webkit-scrollbar-thumb,.ws-table-wrap::-webkit-scrollbar-thumb,.compare-wrap::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#cbdbea,#9db7ce);border-radius:999px;border:2px solid rgba(255,255,255,.72);}
.ws-table,.sig-table,.compare-table,.table,table{border-collapse:separate!important;border-spacing:0!important;}
.ws-table thead th,.sig-table thead th,.compare-table th,table thead th{
  background:linear-gradient(180deg,#f8fbfe,#eef6fb)!important;
  color:#71859a!important;border-bottom:1px solid rgba(191,207,222,.56)!important;
  font-size:10px!important;font-weight:900!important;letter-spacing:.08em!important;padding:10px 14px!important;
}
body:has(.ws-page) .ws-table thead th,
body:has(.ws-page) .sig-table thead th,
body:has(.ws-page) .compare-table th{top:0!important;z-index:5!important;background:linear-gradient(180deg,#f8fbfe,#eef6fb)!important;}
.ws-table tbody td,.sig-table tbody td,.compare-table td,table tbody td{
  background:rgba(255,255,255,.72)!important;border-bottom:1px solid rgba(191,207,222,.42)!important;color:#263449!important;
  transition:background .16s var(--kp-ease),box-shadow .16s var(--kp-ease)!important;
}
.ws-table tbody tr:hover td,.sig-table tbody tr:hover td,table tbody tr:hover td{
  background:#fff!important;box-shadow:inset 3px 0 0 rgba(95,145,191,.62)!important;
}
.td-planet,.td-number,.td-mono{color:var(--kp-ink)!important;}
.badge,.hb,.house-num-pill,.kp-house,.sig-h,.h-pill,.house-pill,[class*="house-chip"],[class*="house-pill"]{
  border-radius:999px!important;font-weight:850!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.86)!important;
}

/* Forms and focus */
.form-control,.nc-input,.nc-select,.nc-textarea,.ts-select,.ts-date-input,.ts-place-input,.ts-coord,.rl-filter-select,.hv-status-sel,
input[type="text"],input[type="email"],input[type="date"],input[type="time"],input[type="number"],input[type="password"],select,textarea{
  border-radius:14px!important;background:#fff!important;border-color:rgba(191,207,222,.72)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.86),inset 0 1px 2px rgba(15,23,42,.025)!important;
}
.form-control:focus,.nc-input:focus,.nc-select:focus,.nc-textarea:focus,.ts-select:focus,.ts-date-input:focus,.ts-place-input:focus,.ts-coord:focus,.rl-filter-select:focus,.hv-status-sel:focus,
input:focus,select:focus,textarea:focus{
  border-color:rgba(95,145,191,.78)!important;box-shadow:0 0 0 5px rgba(95,145,191,.16),0 10px 24px rgba(30,58,86,.06)!important;background:#fff!important;
}
:focus-visible{outline:2px solid rgba(196,147,77,.48)!important;outline-offset:2px!important;}

/* Notes drawer: compact, premium, less intrusive */
.notes-drawer-backdrop{
  background:rgba(7,17,31,.30)!important;
  backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important;
}
body:has(.ws-page) .notes-drawer{
  top:calc(var(--topbar-shell-space) + 12px)!important;
  right:calc((100vw - min(1740px,calc(100vw - 44px))) / 2 + 16px)!important;
  width:min(500px,calc(100vw - 32px))!important;
  max-height:min(640px,calc(100dvh - var(--topbar-shell-space) - var(--app-footer-shell-space) - 28px))!important;
  border-radius:22px!important;border:1px solid rgba(191,207,222,.64)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(249,252,255,.94))!important;
  box-shadow:0 30px 90px rgba(7,17,31,.22),0 1px 0 rgba(255,255,255,.9) inset!important;
  transform:translateX(calc(100% + 34px)) scale(.98)!important;
  transition:transform .28s var(--kp-ease),opacity .22s var(--kp-ease)!important;
}
.notes-drawer.open{transform:translateX(0) scale(1)!important;}
.notes-drawer-hdr{padding:16px 18px 13px!important;background:linear-gradient(180deg,#fff,#f7fbff)!important;}
.notes-drawer-title{font-size:15px!important;font-weight:900!important;letter-spacing:-.035em!important;}
.notes-drawer-sub{font-size:11.5px!important;color:var(--kp-muted)!important;}
body:has(.ws-page) .notes-drawer .ws-notes-textarea{
  min-height:220px!important;height:clamp(220px,34dvh,360px)!important;max-height:380px!important;
  line-height:1.55!important;border-radius:16px!important;
}
.notes-drawer-footer{background:#f8fbfe!important;}
.ws-notes-icon-btn{border-radius:14px!important;background:#fff!important;border-color:rgba(191,207,222,.70)!important;}
.ws-notes-icon-btn.has-notes .ws-notes-dot{background:var(--kp-gold)!important;box-shadow:0 0 0 2px #fff,0 0 12px rgba(196,147,77,.48)!important;}

/* Premium gates, empty/loading states */
.premium-gate-overlay,.prem-gate-wrap{
  background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(255,246,230,.78))!important;
  border:1px solid rgba(196,147,77,.28)!important;
  box-shadow:0 24px 70px rgba(196,147,77,.12)!important;
}
.spinner{border-color:rgba(95,145,191,.20)!important;border-top-color:var(--kp-blue)!important;}
.loading-overlay{background:rgba(255,255,255,.72)!important;backdrop-filter:blur(7px)!important;-webkit-backdrop-filter:blur(7px)!important;}
.toast{border-radius:16px!important;}

/* Gentle animations */
@media (prefers-reduced-motion:no-preference){
  .app-layout-topnav .app-topbar-menu{animation:kpHeaderIn .42s var(--kp-ease) both;}
  .app-layout-topnav .app-content{animation:kpContentIn .52s var(--kp-ease) both;}
  .topbar-brandmark{animation:kpBrandPulse 4.8s ease-in-out infinite alternate;}
  .ws-tab.active{animation:kpActiveTab .24s var(--kp-ease) both;}
  .btn-primary,.ws-btn-primary,.ts-search-btn,.nc-btn-generate{background-size:160% 160%!important;animation:kpPrimarySheen 5.5s ease-in-out infinite alternate;}
  @keyframes kpHeaderIn{from{opacity:0;transform:translate(-50%,-10px);}to{opacity:1;transform:translateX(-50%);}}
  @keyframes kpContentIn{from{opacity:0;filter:blur(4px);}to{opacity:1;filter:none;}}
  @keyframes kpBrandPulse{from{box-shadow:0 12px 30px rgba(2,6,23,.18),0 0 0 1px rgba(196,147,77,.28),inset 0 1px 0 rgba(255,255,255,.22);}to{box-shadow:0 14px 34px rgba(2,6,23,.24),0 0 0 1px rgba(196,147,77,.48),0 0 24px rgba(196,147,77,.16),inset 0 1px 0 rgba(255,255,255,.24);}}
  @keyframes kpActiveTab{from{transform:scale(.985);}to{transform:scale(1);}}
  @keyframes kpPrimarySheen{from{background-position:0% 50%;}to{background-position:100% 50%;}}
}
@media (prefers-reduced-motion:reduce){
  .app-layout-topnav .app-topbar-menu,.app-layout-topnav .app-content,.topbar-brandmark,.ws-tab.active,.btn-primary,.ws-btn-primary,.ts-search-btn,.nc-btn-generate{animation:none!important;}
}


/* ── V10 Notes drawer default-collapsed safety patch ─────────────── */
.notes-drawer[hidden],
.notes-drawer[aria-hidden="true"]{
  display:flex!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateX(calc(100% + 56px)) scale(.985)!important;
}
.notes-drawer.open[aria-hidden="false"]{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateX(0) scale(1)!important;
}
.notes-drawer-close{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  min-width:38px!important;
  padding:0 10px!important;
  font-size:18px!important;
  font-weight:850!important;
  color:#263449!important;
  transition:transform .16s var(--kp-ease, ease), box-shadow .16s var(--kp-ease, ease), background .16s var(--kp-ease, ease)!important;
}
.notes-drawer-close:hover{
  background:#f4f8fc!important;
  box-shadow:0 8px 22px rgba(15,23,42,.08)!important;
  transform:translateY(-1px)!important;
}
.notes-drawer-close-text{
  font-size:11px!important;
  font-weight:850!important;
  letter-spacing:.01em!important;
}
.ws-notes-icon-btn[aria-expanded="true"]{
  background:#07111f!important;
  color:#fff!important;
  border-color:#07111f!important;
  box-shadow:0 14px 34px rgba(7,17,31,.22)!important;
}


/* V12 mirror: production shell reset; layout_end.php contains the authoritative final override. */
:root{--workspace-bottom-safe:0px!important;}
html:has(.app-layout-topnav),body:has(.app-layout-topnav){height:auto!important;overflow-y:auto!important;overflow-x:hidden!important;}
.app-layout-topnav,.app-layout-topnav .app-main{height:auto!important;min-height:100dvh!important;overflow:visible!important;}
.app-layout-topnav .app-topbar-menu{position:sticky!important;top:0!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;margin:0 auto!important;z-index:10000!important;}
.app-layout-topnav .app-content{height:auto!important;max-height:none!important;overflow:visible!important;margin:0 auto!important;}
.app-layout-topnav .app-footer{position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;transform:none!important;margin:0 auto!important;}
body:has(.ws-page) .ws-header{position:relative!important;top:auto!important;}
body:has(.ws-page) .ws-tabs{position:sticky!important;top:var(--topbar-h)!important;z-index:900!important;}

/* ── V13 Emergency scroll authority reset ─────────────────────────
   Root cause: older premium shell experiments left .app-layout-topnav
   and .app-main as fixed, viewport-sized elements. That makes the page
   itself only 100vh tall, so the browser has no vertical scrollbar.
   This final override restores normal document flow and body scrolling. */
html,
body,
html:has(.app-layout-topnav),
body:has(.app-layout-topnav){
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:scroll!important;
  scrollbar-gutter:stable!important;
}
.app-layout-topnav,
body:has(.app-layout-topnav) .app-layout-topnav,
body:has(.ws-page) .app-layout-topnav,
body:has(.hv-outer) .app-layout-topnav{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  transform:none!important;
  width:auto!important;
  max-width:none!important;
  height:auto!important;
  min-height:100dvh!important;
  max-height:none!important;
  overflow:visible!important;
  display:block!important;
}
.app-layout-topnav .app-main,
body:has(.app-layout-topnav) .app-layout-topnav .app-main,
body:has(.ws-page) .app-layout-topnav .app-main,
body:has(.hv-outer) .app-layout-topnav .app-main{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  transform:none!important;
  width:100%!important;
  height:auto!important;
  min-height:100dvh!important;
  max-height:none!important;
  overflow:visible!important;
  display:flex!important;
  flex-direction:column!important;
}
.app-layout-topnav .app-content,
body:has(.app-layout-topnav) .app-layout-topnav .app-content,
body:has(.ws-page) .app-layout-topnav .app-content,
body:has(.hv-outer) .app-layout-topnav .app-content{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  transform:none!important;
  height:auto!important;
  min-height:calc(100dvh - var(--topbar-h,64px) - var(--app-footer-h,42px))!important;
  max-height:none!important;
  overflow:visible!important;
  overflow-x:clip!important;
  overflow-y:visible!important;
  flex:1 0 auto!important;
}
.app-layout-topnav .app-footer,
body:has(.app-layout-topnav) .app-layout-topnav .app-footer{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  bottom:auto!important;
  left:auto!important;
  transform:none!important;
  flex:0 0 auto!important;
}
body:has(.ws-page) .ws-page,
body:has(.hv-outer) .hv-outer,
.ws-page,
.hv-outer{
  max-height:none!important;
  overflow:visible!important;
}
/* Sticky elements stay sticky, but no parent may become the scroll jail. */
.app-layout-topnav .app-topbar-menu{
  position:sticky!important;
  top:0!important;
}
body:has(.ws-page) .ws-tabs{
  position:sticky!important;
  top:var(--topbar-h,64px)!important;
}

/* ── V14 Sticky shell chrome: header + footer + workspace tabs ─────────────
   Uses fixed outer chrome with normal document/body scrolling. The content
   gets only the safe space it needs, so tables remain fully reachable without
   recreating the old scroll jail. */
:root{
  --kp-shell-w:min(1640px, calc(100vw - 44px));
  --kp-shell-x:22px;
  --kp-sticky-header-h:var(--topbar-h,76px);
  --kp-sticky-footer-h:48px;
  --kp-content-bottom-safe:calc(var(--kp-sticky-footer-h) + 14px + env(safe-area-inset-bottom,0px));
  --kp-tabs-sticky-top:var(--kp-sticky-header-h);
}
html,
body,
html:has(.app-layout-topnav),
body:has(.app-layout-topnav){
  height:auto!important;
  min-height:100%!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  scrollbar-gutter:stable!important;
}
body:has(.app-layout-topnav){
  padding:0!important;
}
.app-layout-topnav,
.app-layout-topnav .app-main,
body:has(.app-layout-topnav) .app-layout-topnav,
body:has(.app-layout-topnav) .app-main{
  position:relative!important;
  inset:auto!important;
  height:auto!important;
  min-height:100dvh!important;
  max-height:none!important;
  overflow:visible!important;
}
.app-layout-topnav .app-main,
body:has(.app-layout-topnav) .app-main{
  display:flex!important;
  flex-direction:column!important;
  padding:0 var(--kp-shell-x) 0!important;
}
.app-layout-topnav .app-topbar-menu,
body:has(.app-layout-topnav) .app-topbar-menu{
  position:fixed!important;
  top:0!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  transform:translateX(-50%)!important;
  width:var(--kp-shell-w)!important;
  max-width:var(--kp-shell-w)!important;
  height:var(--kp-sticky-header-h)!important;
  min-height:var(--kp-sticky-header-h)!important;
  margin:0!important;
  z-index:10000!important;
  border-radius:0 0 18px 18px!important;
  border-top:0!important;
  box-shadow:0 12px 32px rgba(30,58,86,.10),0 1px 0 rgba(255,255,255,.85) inset!important;
}
.app-layout-topnav .app-content,
body:has(.app-layout-topnav) .app-content{
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  width:100%!important;
  max-width:var(--kp-shell-w)!important;
  height:auto!important;
  min-height:calc(100dvh - var(--kp-sticky-header-h) - var(--kp-sticky-footer-h))!important;
  max-height:none!important;
  overflow:visible!important;
  overflow-x:clip!important;
  margin:var(--kp-sticky-header-h) auto 0!important;
  padding-bottom:var(--kp-content-bottom-safe)!important;
  flex:1 0 auto!important;
}
.app-layout-topnav .app-footer,
body:has(.app-layout-topnav) .app-footer{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  top:auto!important;
  bottom:0!important;
  transform:translateX(-50%)!important;
  width:var(--kp-shell-w)!important;
  max-width:var(--kp-shell-w)!important;
  min-height:var(--kp-sticky-footer-h)!important;
  max-height:var(--kp-sticky-footer-h)!important;
  margin:0!important;
  padding:9px 16px calc(9px + env(safe-area-inset-bottom,0px))!important;
  z-index:9998!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid #e5e7eb!important;
  border-bottom:0!important;
  border-radius:18px 18px 0 0!important;
  box-shadow:0 -12px 32px rgba(30,58,86,.08)!important;
  backdrop-filter:blur(18px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%)!important;
}
.app-layout-topnav .app-footer-copy,
.app-layout-topnav .app-footer-links,
.app-layout-topnav .app-footer-links a{
  white-space:nowrap!important;
}
.app-layout-topnav .app-footer-links{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
body:has(.ws-page) .app-content,
body:has(.hv-outer) .app-content{
  margin-top:var(--kp-sticky-header-h)!important;
  padding-bottom:var(--kp-content-bottom-safe)!important;
  min-height:calc(100dvh - var(--kp-sticky-header-h) - var(--kp-sticky-footer-h))!important;
}
body:has(.ws-page) .ws-header,
body:has(.hv-outer) .hv-case-header{
  position:relative!important;
  top:auto!important;
  z-index:2!important;
}
body:has(.ws-page) .ws-tabs,
body:has(.hv-outer) .ws-tabs{
  position:sticky!important;
  top:var(--kp-tabs-sticky-top)!important;
  z-index:9500!important;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(238,247,253,.98))!important;
  border-bottom:1px solid #dce6ef!important;
  box-shadow:0 10px 26px rgba(30,58,86,.10)!important;
  backdrop-filter:blur(18px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%)!important;
}
body:has(.hv-outer) .hv-sidebar{
  top:calc(var(--kp-sticky-header-h) + 16px)!important;
  max-height:calc(100dvh - var(--kp-sticky-header-h) - var(--kp-sticky-footer-h) - 32px)!important;
}
.notes-drawer{
  max-height:calc(100dvh - var(--kp-sticky-header-h) - var(--kp-sticky-footer-h) - 28px)!important;
}
body:has(.ws-page) .notes-drawer{
  top:calc(var(--kp-sticky-header-h) + 12px)!important;
}


/* ============================================================
   V16 production alignment pass
   - one exact viewport-based frame width for header/content/footer
   - chart identity header sticks cleanly with breathing space
   - chart tabs stick beneath identity header without overlap
   - horary tabs return to clean in-flow/sticky behavior
   - wider Key Positions column for readable rows
   ============================================================ */
:root{
  --kp-frame-w:min(1680px, calc(100vw - 72px))!important;
  --kp-frame-pad-x:32px!important;
  --kp-sticky-header-h:72px!important;
  --kp-sticky-footer-h:46px!important;
  --kp-client-header-h:86px!important;
  --kp-client-gap:12px!important;
  --kp-content-bottom-safe:calc(var(--kp-sticky-footer-h) + 18px + env(safe-area-inset-bottom,0px))!important;
}
html,body,html:has(.app-layout-topnav),body:has(.app-layout-topnav){
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable!important;
}
.app-layout-topnav .app-topbar-menu,
body:has(.app-layout-topnav) .app-topbar-menu,
.app-layout-topnav .app-content,
body:has(.app-layout-topnav) .app-content,
.app-layout-topnav .app-footer,
body:has(.app-layout-topnav) .app-footer{
  width:var(--kp-frame-w)!important;
  max-width:var(--kp-frame-w)!important;
  box-sizing:border-box!important;
}
.app-layout-topnav .app-topbar-menu,
body:has(.app-layout-topnav) .app-topbar-menu{
  height:var(--kp-sticky-header-h)!important;
  min-height:var(--kp-sticky-header-h)!important;
  padding-left:var(--kp-frame-pad-x)!important;
  padding-right:var(--kp-frame-pad-x)!important;
}
.app-layout-topnav .app-content,
body:has(.app-layout-topnav) .app-content{
  margin-top:var(--kp-sticky-header-h)!important;
  padding:18px 18px var(--kp-content-bottom-safe)!important;
  min-height:calc(100dvh - var(--kp-sticky-header-h) - var(--kp-sticky-footer-h))!important;
}
.app-layout-topnav .app-footer,
body:has(.app-layout-topnav) .app-footer{
  height:var(--kp-sticky-footer-h)!important;
  min-height:var(--kp-sticky-footer-h)!important;
  max-height:var(--kp-sticky-footer-h)!important;
  padding-left:var(--kp-frame-pad-x)!important;
  padding-right:var(--kp-frame-pad-x)!important;
}

/* Chart record sticky identity header */
body:has(.ws-page):not(:has(.hv-outer)) .ws-header{
  position:sticky!important;
  top:var(--kp-sticky-header-h)!important;
  z-index:9600!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  min-height:var(--kp-client-header-h)!important;
  margin:0 8px var(--kp-client-gap)!important;
  padding:16px 22px 15px!important;
  border-radius:0 0 18px 18px!important;
  background:rgba(255,255,255,.98)!important;
  border:1px solid #dfe9f1!important;
  box-shadow:0 14px 30px rgba(30,58,86,.10), inset 0 1px 0 rgba(255,255,255,.9)!important;
  backdrop-filter:blur(18px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%)!important;
}
body:has(.ws-page):not(:has(.hv-outer)) .ws-header-left{
  display:flex!important;
  flex-direction:column!important;
  gap:9px!important;
  min-width:0!important;
}
body:has(.ws-page):not(:has(.hv-outer)) .ws-client-name{
  line-height:1.05!important;
}
body:has(.ws-page):not(:has(.hv-outer)) .ws-meta-strip{
  margin-top:2px!important;
  row-gap:6px!important;
}
body:has(.ws-page):not(:has(.hv-outer)) .ws-header-actions{
  flex-shrink:0!important;
}
body:has(.ws-page):not(:has(.hv-outer)) .ws-tabs{
  position:sticky!important;
  top:calc(var(--kp-sticky-header-h) + var(--kp-client-header-h) + var(--kp-client-gap))!important;
  z-index:9500!important;
  margin:0 8px 16px!important;
  width:calc(100% - 16px)!important;
  max-width:calc(100% - 16px)!important;
  box-sizing:border-box!important;
  background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(235,246,253,.99))!important;
  border:1px solid #d8e5ee!important;
  border-radius:16px!important;
  box-shadow:0 10px 24px rgba(30,58,86,.10), inset 0 1px 0 rgba(255,255,255,.9)!important;
  backdrop-filter:blur(18px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%)!important;
}

/* The analytical summary needs a readable Key Positions column. */
body:has(.ws-page) .ws-analytics-row{
  grid-template-columns:minmax(500px,1.22fr) minmax(370px,.92fr) minmax(340px,.86fr)!important;
}
body:has(.ws-page) .ws-col{min-width:0!important;}
body:has(.ws-page) .kp-row{
  display:grid!important;
  grid-template-columns:10px minmax(74px,.9fr) minmax(78px,.8fr) minmax(94px,1fr) auto!important;
  gap:8px!important;
  align-items:center!important;
}
body:has(.ws-page) .kp-name,
body:has(.ws-page) .kp-sign,
body:has(.ws-page) .kp-deg,
body:has(.ws-page) .kp-house{
  min-width:0!important;
  white-space:nowrap!important;
}
body:has(.ws-page) .kp-deg{font-size:11.5px!important;}

/* Horary: keep case header in document flow, keep tabs clean and not overlaid mid-card. */
body:has(.hv-outer) .hv-case-header{
  position:relative!important;
  top:auto!important;
  z-index:2!important;
  margin:0 8px 18px!important;
  min-height:auto!important;
  padding:16px 20px!important;
  border-radius:0 0 18px 18px!important;
}
body:has(.hv-outer) .hv-outer{
  display:grid!important;
  grid-template-columns:320px minmax(0,1fr)!important;
  gap:20px!important;
  align-items:start!important;
  margin:0 8px 18px!important;
  width:calc(100% - 16px)!important;
  max-width:calc(100% - 16px)!important;
}
body:has(.hv-outer) .hv-sidebar{
  position:sticky!important;
  top:calc(var(--kp-sticky-header-h) + 16px)!important;
  max-height:calc(100dvh - var(--kp-sticky-header-h) - var(--kp-sticky-footer-h) - 34px)!important;
  overflow:auto!important;
}
body:has(.hv-outer) .ws-page{
  margin:0!important;
  padding:0!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
body:has(.hv-outer) .ws-tabs{
  position:sticky!important;
  top:calc(var(--kp-sticky-header-h) + 8px)!important;
  z-index:9400!important;
  margin:0 0 16px!important;
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  border-radius:16px!important;
  border:1px solid #d8e5ee!important;
  background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(235,246,253,.99))!important;
  box-shadow:0 10px 24px rgba(30,58,86,.10), inset 0 1px 0 rgba(255,255,255,.9)!important;
}
body:has(.hv-outer) .ws-pane.active{
  padding-top:0!important;
  margin-top:0!important;
  overflow:visible!important;
}
body:has(.hv-outer) .ws-pane.active > div:first-child{
  margin-top:0!important;
}
body:has(.hv-outer) .ws-analytics-row{
  grid-template-columns:minmax(470px,1.12fr) minmax(360px,.9fr) minmax(340px,.86fr)!important;
}
body:has(.hv-outer) .ws-col{padding:18px 20px!important;}

@media(max-width:1420px){
  body:has(.ws-page) .ws-analytics-row,
  body:has(.hv-outer) .ws-analytics-row{
    grid-template-columns:1fr!important;
  }
  body:has(.ws-page) .ws-col{border-right:0!important;border-bottom:1px solid var(--border)!important;}
  body:has(.ws-page) .ws-col:last-child{border-bottom:0!important;}
}


/* ============================================================
   V17 footer alignment hardening
   Fixes the footer looking detached/misaligned by forcing the
   copyright and links to sit inside one centered footer bar that
   uses the exact same frame as the header/content shell.
   ============================================================ */
:root{
  --kp-frame-w:min(1680px, calc(100vw - 72px))!important;
  --kp-frame-pad-x:32px!important;
  --kp-sticky-footer-h:46px!important;
  --kp-content-bottom-safe:calc(var(--kp-sticky-footer-h) + 18px + env(safe-area-inset-bottom,0px))!important;
}
.app-layout-topnav .app-topbar-menu,
body:has(.app-layout-topnav) .app-topbar-menu,
.app-layout-topnav .app-content,
body:has(.app-layout-topnav) .app-content,
.app-layout-topnav .app-footer,
body:has(.app-layout-topnav) .app-footer{
  width:var(--kp-frame-w)!important;
  max-width:var(--kp-frame-w)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}
.app-layout-topnav .app-footer,
body:has(.app-layout-topnav) .app-footer{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:0!important;
  top:auto!important;
  transform:translateX(-50%)!important;
  height:var(--kp-sticky-footer-h)!important;
  min-height:var(--kp-sticky-footer-h)!important;
  max-height:var(--kp-sticky-footer-h)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  justify-content:normal!important;
  gap:22px!important;
  padding:0 var(--kp-frame-pad-x)!important;
  margin:0!important;
  overflow:hidden!important;
  background:#ffffff!important;
  border:1px solid rgba(210,224,235,.96)!important;
  border-bottom:0!important;
  border-radius:18px 18px 0 0!important;
  box-shadow:0 -10px 28px rgba(30,58,86,.075)!important;
  backdrop-filter:blur(18px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(150%)!important;
  z-index:9998!important;
}
.app-layout-topnav .app-footer-copy,
.app-layout-topnav .app-footer-links,
.app-layout-topnav .app-footer-links a,
body:has(.app-layout-topnav) .app-footer-copy,
body:has(.app-layout-topnav) .app-footer-links,
body:has(.app-layout-topnav) .app-footer-links a{
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
  font-size:11px!important;
  white-space:nowrap!important;
  color:#687789!important;
  text-decoration:none!important;
}
.app-layout-topnav .app-footer-copy,
body:has(.app-layout-topnav) .app-footer-copy{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.app-layout-topnav .app-footer-copy strong,
body:has(.app-layout-topnav) .app-footer-copy strong{
  color:#0f172a!important;
  font-weight:800!important;
}
.app-layout-topnav .app-footer-links,
body:has(.app-layout-topnav) .app-footer-links{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:18px!important;
  flex-wrap:nowrap!important;
  overflow:hidden!important;
}
.app-layout-topnav .app-footer-links a:hover,
body:has(.app-layout-topnav) .app-footer-links a:hover{
  color:#0f172a!important;
}
.app-layout-topnav .app-content,
body:has(.app-layout-topnav) .app-content{
  padding-bottom:var(--kp-content-bottom-safe)!important;
}


/* ============================================================
   V18 footer alignment correction
   The footer now has one inner rail that aligns the copy and links
   with the visible application content instead of letting text sit
   against the outer rounded shell edge.
   ============================================================ */
.app-layout-topnav .app-footer,
body:has(.app-layout-topnav) .app-footer{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  bottom:0!important;
  top:auto!important;
  transform:translateX(-50%)!important;
  width:var(--kp-frame-w)!important;
  max-width:var(--kp-frame-w)!important;
  height:var(--kp-sticky-footer-h)!important;
  min-height:var(--kp-sticky-footer-h)!important;
  max-height:var(--kp-sticky-footer-h)!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  display:block!important;
  overflow:hidden!important;
  background:#ffffff!important;
  border:1px solid rgba(210,224,235,.96)!important;
  border-bottom:0!important;
  border-radius:18px 18px 0 0!important;
  box-shadow:0 -10px 28px rgba(30,58,86,.075)!important;
  z-index:9998!important;
}
.app-layout-topnav .app-footer-inner,
body:has(.app-layout-topnav) .app-footer-inner{
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  justify-content:normal!important;
  gap:22px!important;
  padding:0 clamp(48px,3.8vw,72px)!important;
  margin:0!important;
}
.app-layout-topnav .app-footer-copy,
body:has(.app-layout-topnav) .app-footer-copy{
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  line-height:1!important;
  font-size:11px!important;
  color:#687789!important;
}
.app-layout-topnav .app-footer-links,
body:has(.app-layout-topnav) .app-footer-links{
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:18px!important;
  flex-wrap:nowrap!important;
  min-width:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
}
.app-layout-topnav .app-footer-links a,
body:has(.app-layout-topnav) .app-footer-links a{
  margin:0!important;
  padding:0!important;
  line-height:1!important;
  font-size:11px!important;
  color:#687789!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}


/* ============================================================
   KP Studio V31 — Lotus brand polish
   White canvas + soft reddish-pink tint, aligned shell/header/footer,
   warmer buttons and safer desktop flow.
   ============================================================ */
:root{
  --kp-lotus:#f47474!important;
  --kp-lotus-dark:#d94f62!important;
  --kp-lotus-deep:#8f2f45!important;
  --kp-lotus-ink:#221216!important;
  --kp-lotus-muted:#705c62!important;
  --kp-lotus-line:#f6d7dc!important;
  --kp-lotus-line-strong:#efbfc7!important;
  --kp-lotus-blush:#fff3f5!important;
  --kp-lotus-blush-2:#ffe8ec!important;
  --kp-lotus-cream:#fffaf8!important;
  --kp-ref-page:#f7f1ef!important;
  --kp-ref-ink:#171116!important;
  --kp-ref-muted:#6f5d63!important;
  --kp-ref-line:rgba(246,215,220,.96)!important;
  --kp-ref-line-strong:rgba(239,191,199,.96)!important;
  --kp-ref-card:rgba(255,255,255,.88)!important;
  --kp-ref-card-solid:#ffffff!important;
  --kp-ref-blue:#fff1f4!important;
  --kp-ref-cyan:#fff7f8!important;
  --kp-ref-mint:#fffaf8!important;
  --kp-ref-shell:linear-gradient(135deg,rgba(255,255,255,.97) 0%,rgba(255,247,248,.98) 48%,rgba(255,232,236,.86) 100%)!important;
  --kp-ref-footer:linear-gradient(118deg,rgba(255,255,255,.97) 0%,rgba(255,248,249,.98) 48%,rgba(255,235,239,.92) 100%)!important;
  --kp-ref-shadow:0 30px 90px rgba(150,74,91,.12),0 2px 4px rgba(41,18,25,.035)!important;
  --kp-ref-shadow-soft:0 18px 46px rgba(150,74,91,.095),0 1px 2px rgba(41,18,25,.035)!important;
  --kp-ref-radius:34px!important;
  --kp-ref-radius-sm:18px!important;
  --accent:var(--kp-lotus-deep)!important;
  --accent-hover:#702338!important;
  --accent-light:var(--kp-lotus-blush)!important;
  --focus-ring:rgba(244,116,116,.20)!important;
  --border:var(--kp-lotus-line)!important;
  --border-med:var(--kp-lotus-line-strong)!important;
  --text-primary:var(--kp-lotus-ink)!important;
  --text-secondary:var(--kp-lotus-muted)!important;
  --text-tertiary:#8e767c!important;
  --shadow-sm:0 14px 36px rgba(150,74,91,.08),0 1px 1px rgba(41,18,25,.035)!important;
  --shadow-md:0 24px 70px rgba(150,74,91,.12),0 2px 4px rgba(41,18,25,.045)!important;
}
html,body{background:var(--kp-ref-page)!important;color:var(--kp-lotus-ink)!important;overflow-x:hidden!important;}
body{
  background:
    radial-gradient(circle at 8% -8%,rgba(255,232,236,.95),transparent 31%),
    radial-gradient(circle at 96% 0%,rgba(255,246,248,.98),transparent 35%),
    radial-gradient(circle at 16% 82%,rgba(255,255,255,.95),transparent 28%),
    linear-gradient(180deg,#faf4f2 0%,#f5edeb 100%)!important;
}
body::before{
  inset:18px!important;border-radius:36px!important;background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(255,242,245,.28))!important;border:1px solid rgba(255,255,255,.9)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.kp-ambient-shell span:nth-child(1){background:rgba(255,215,222,.72)!important;filter:blur(18px)!important;}
.kp-ambient-shell span:nth-child(2){background:rgba(255,242,245,.82)!important;filter:blur(18px)!important;}
.kp-ambient-shell span:nth-child(3){background:rgba(255,255,255,.78)!important;filter:blur(10px)!important;}

/* Shell, header and content rail */
.app-layout-topnav .app-topbar-menu,
.login-shell-app .app-topbar-menu,
body:has(.app-layout-topnav) .app-topbar-menu,
body:has(.login-shell-app) .app-topbar-menu{
  border-radius:32px 32px 0 0!important;
  border:1px solid rgba(255,255,255,.92)!important;
  border-bottom:1px solid rgba(246,215,220,.95)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,247,248,.92))!important;
  box-shadow:0 16px 44px rgba(150,74,91,.10),inset 0 1px 0 rgba(255,255,255,1)!important;
}
.app-layout-topnav .app-content,
.login-shell-app .app-content,
body:has(.app-layout-topnav) .app-content,
body:has(.login-shell-app) .app-content{
  border:1px solid rgba(255,255,255,.92)!important;
  border-top:0!important;
  border-radius:0 0 var(--kp-ref-radius) var(--kp-ref-radius)!important;
  background:
    radial-gradient(circle at 0% 0%,rgba(255,232,236,.82),transparent 34%),
    radial-gradient(circle at 100% 2%,rgba(255,246,248,.96),transparent 42%),
    linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,249,250,.98) 52%,rgba(255,235,239,.78))!important;
  box-shadow:var(--kp-ref-shadow),inset 0 1px 0 rgba(255,255,255,.86)!important;
}
.topbar-brandmark,.sidebar-logo-mark,.brand-mark,.mini-brand-mark,.kp-footer-mark{
  background:linear-gradient(145deg,#fff,#fff2f4)!important;border-color:rgba(246,203,211,.96)!important;box-shadow:0 12px 28px rgba(150,74,91,.10),inset 0 1px 0 rgba(255,255,255,.95)!important;
}
.topbar-brandmark img,.kp-footer-mark img,.brand-mark img,.mini-brand-mark img{filter:drop-shadow(0 5px 10px rgba(244,116,116,.16));}
.topbar-title,.brand-copy strong,.kp-footer-logo strong{color:var(--kp-lotus-ink)!important;letter-spacing:-.045em!important;}
.topbar-kicker,.brand-copy span{color:#8d6e76!important;}

/* Navigation */
.topbar-menu-trigger,.top-nav-item,.nav-links,.nav-links a,.price-chip,.plan-badge,.topbar-user{
  border-color:rgba(246,215,220,.94)!important;background:rgba(255,255,255,.74)!important;color:var(--kp-lotus-ink)!important;box-shadow:0 8px 18px rgba(150,74,91,.055)!important;
}
.topbar-menu-trigger:hover,.top-nav-item:hover,.nav-links a:hover,.topbar-user:hover{
  background:linear-gradient(135deg,#fff,#fff2f5)!important;border-color:rgba(239,191,199,.98)!important;color:var(--kp-lotus-deep)!important;transform:translateY(-1px);
}
.app-layout-topnav .topbar-menu-trigger.active,
.app-layout-topnav .topbar-menu-group[open] .topbar-menu-trigger,
.login-shell-app .top-nav-item.active,
body:has(.app-layout-topnav) .topbar-menu-trigger.active,
body:has(.app-layout-topnav) .topbar-menu-group[open] .topbar-menu-trigger,
body:has(.login-shell-app) .top-nav-item.active{
  background:linear-gradient(135deg,#fff7f8,#ffe4e9)!important;color:var(--kp-lotus-deep)!important;border-color:rgba(244,116,116,.40)!important;box-shadow:0 14px 28px rgba(244,116,116,.15),inset 0 1px 0 rgba(255,255,255,.90)!important;
}
.topbar-menu-emblem,.plan-badge-dot,.price-chip::before{background:var(--kp-lotus-blush-2)!important;border-color:rgba(244,116,116,.22)!important;color:var(--kp-lotus-deep)!important;}
.topbar-menu-trigger.active .topbar-menu-emblem,.topbar-menu-group[open] .topbar-menu-trigger .topbar-menu-emblem{background:rgba(255,255,255,.72)!important;border-color:rgba(244,116,116,.32)!important;color:var(--kp-lotus-deep)!important;}
.topbar-dropdown-panel,.account-menu-popover,.topbar-account-popover{
  border-radius:24px!important;background:rgba(255,255,255,.96)!important;border-color:rgba(246,215,220,.96)!important;box-shadow:0 28px 80px rgba(150,74,91,.16)!important;
}
.nav-dropdown-item:hover,.nav-dropdown-item.active{background:linear-gradient(135deg,#fff8f9,#ffecef)!important;color:var(--kp-lotus-deep)!important;}
.nav-dropdown-item.active{box-shadow:inset 4px 0 0 var(--kp-lotus)!important;}

/* Buttons and CTAs — remove the old navy/black system */
.btn,.google-btn,.plan-cta,.btn-new-chart,.new-chart-btn,.ws-btn,.ws-btn-primary,.nc-btn-generate,.ts-search-btn,.rfbtn,.sky-btn,.hr-filter-btn,.billing-cta,.action-line,button[type="submit"]{
  border-radius:999px!important;font-weight:900!important;letter-spacing:-.01em!important;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease!important;
}
.btn-primary,.btn.btn-primary,.btn-new-chart,.new-chart-btn,.ws-btn-primary,.nc-btn-generate,.ts-search-btn,.plan-cta,.plan-card.pro .plan-cta,.billing-cta.primary,.action-line,button[type="submit"]{
  background:linear-gradient(135deg,var(--kp-lotus),var(--kp-lotus-dark))!important;color:#fff!important;border:1px solid rgba(244,116,116,.35)!important;box-shadow:0 16px 32px rgba(244,116,116,.24),inset 0 1px 0 rgba(255,255,255,.24)!important;text-shadow:0 1px 0 rgba(98,24,39,.16)!important;
}
.btn-primary:hover,.btn.btn-primary:hover,.btn-new-chart:hover,.new-chart-btn:hover,.ws-btn-primary:hover,.nc-btn-generate:hover,.ts-search-btn:hover,.plan-cta:hover,.billing-cta.primary:hover,.action-line:hover,button[type="submit"]:hover{
  transform:translateY(-1px)!important;background:linear-gradient(135deg,#ff8585,#d94f62)!important;box-shadow:0 20px 38px rgba(244,116,116,.30),inset 0 1px 0 rgba(255,255,255,.28)!important;
}
.btn-secondary,.btn.btn-secondary,.btn-ghost,.ws-btn-ghost,.sky-btn,.rfbtn,.hr-filter-btn,.plan-card:not(.pro) .plan-cta,.google-btn{
  background:rgba(255,255,255,.84)!important;color:var(--kp-lotus-ink)!important;border:1px solid rgba(246,215,220,.96)!important;box-shadow:0 12px 26px rgba(150,74,91,.075),inset 0 1px 0 rgba(255,255,255,.94)!important;text-shadow:none!important;
}
.btn-secondary:hover,.btn.btn-secondary:hover,.btn-ghost:hover,.ws-btn-ghost:hover,.sky-btn:hover,.rfbtn:hover,.hr-filter-btn:hover,.plan-card:not(.pro) .plan-cta:hover,.google-btn:hover{
  background:linear-gradient(135deg,#fff,#fff1f4)!important;color:var(--kp-lotus-deep)!important;border-color:rgba(244,116,116,.34)!important;transform:translateY(-1px)!important;
}
.kp-footer-newsletter button{background:linear-gradient(135deg,var(--kp-lotus),var(--kp-lotus-dark))!important;color:#fff!important;border:0!important;}

/* Cards, sections, tables and form surfaces */
.app-layout-topnav *:where(.card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,.nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,.hv-panel,.ws-col,.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,.client-card,.pricing-card,.up-wrap,.price-card,.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,.settings-card,.billing-card,.section-card,.form-card,.kd-hero-panel,.kd-card,.kd-info-tile,.kd-chart-shell,.kd-energy-card,.kd-focus-panel,.ws-header,.ws-tabs,.hv-case-header,.hv-sidebar,.hv-outer,.learn-card,.bill-hero,.bill-status,.bill-feature,.matrix,.plan-card,.pricing-card,.hero-board,.access-card,.preview-wrap,.workspace-rail,.screen-window,.real-app-shell,.screen-frame,.feature-card,.plan-copy,.ui-card,.metric-card,.table-surface,.chart-surface,.south-chart,.north-chart,.micro-card,.case-card,.export-card),
body:has(.app-layout-topnav) *:where(.card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,.nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,.hv-panel,.ws-col,.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,.client-card,.pricing-card,.up-wrap,.price-card,.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,.settings-card,.billing-card,.section-card,.form-card,.kd-hero-panel,.kd-card,.kd-info-tile,.kd-chart-shell,.kd-energy-card,.kd-focus-panel,.ws-header,.ws-tabs,.hv-case-header,.hv-sidebar,.hv-outer,.learn-card,.bill-hero,.bill-status,.bill-feature,.matrix,.plan-card,.pricing-card,.hero-board,.access-card,.preview-wrap,.workspace-rail,.screen-window,.real-app-shell,.screen-frame,.feature-card,.plan-copy,.ui-card,.metric-card,.table-surface,.chart-surface,.south-chart,.north-chart,.micro-card,.case-card,.export-card){
  border-radius:26px!important;background:rgba(255,255,255,.86)!important;border-color:rgba(246,215,220,.88)!important;box-shadow:var(--kp-ref-shadow-soft)!important;backdrop-filter:blur(14px) saturate(126%)!important;-webkit-backdrop-filter:blur(14px) saturate(126%)!important;
}
.app-layout-topnav *:where(.page-header,.dh,.nc-header,.ts-hero,.rl-header,.hindex-header,.hv-header,.bill-hero,.kd-hero),
body:has(.app-layout-topnav) *:where(.page-header,.dh,.nc-header,.ts-hero,.rl-header,.hindex-header,.hv-header,.bill-hero,.kd-hero){
  border-radius:30px!important;border:1px solid rgba(255,255,255,.9)!important;background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,236,240,.76))!important;box-shadow:var(--kp-ref-shadow-soft)!important;
}
.table-wrap,.ws-table-wrap,.compare-wrap,.matrix,.kp-data-surface,.table-surface{background:rgba(255,255,255,.72)!important;border-color:rgba(246,215,220,.92)!important;box-shadow:0 12px 34px rgba(150,74,91,.07)!important;}
input,select,textarea,.form-control,.nc-input,.nc-select,.nc-textarea,.ts-select,.ts-date-input,.ts-place-input,.ts-coord,.rl-filter-select,.hv-status-sel,.kp-footer-newsletter input{
  background:rgba(255,255,255,.88)!important;border-color:rgba(246,215,220,.96)!important;color:var(--kp-lotus-ink)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.90)!important;
}
input:focus,select:focus,textarea:focus,.form-control:focus,.nc-input:focus,.nc-select:focus,.nc-textarea:focus{border-color:rgba(244,116,116,.58)!important;box-shadow:0 0 0 4px rgba(244,116,116,.14),inset 0 1px 0 rgba(255,255,255,.90)!important;outline:0!important;}
.badge,.pill,.tag,.nav-badge,.plan-badge2,.mini-badge,.route-badge,.screen-tag,.kicker,.secure-badge,.free-badge,.trust-row span,.plan-label span,.check,.filter-chip,.avatar,.star{border-radius:999px!important;background:var(--kp-lotus-blush)!important;border-color:rgba(246,215,220,.94)!important;color:var(--kp-lotus-deep)!important;}

/* Login/marketing page composition */
.login-shell-app .hero-board,
body:has(.login-shell-app) .hero-board{
  grid-template-columns:minmax(0,1fr) minmax(300px,390px)!important;align-items:center!important;padding:clamp(24px,4vw,56px)!important;border-radius:34px!important;background:radial-gradient(circle at 8% 0%,rgba(255,226,232,.88),transparent 34%),linear-gradient(135deg,rgba(255,255,255,.90),rgba(255,246,248,.90))!important;
}
.login-shell-app h1 span,body:has(.login-shell-app) h1 span{color:var(--kp-lotus-deep)!important;}
.login-shell-app .hero-sub{color:#6f5d63!important;}
.login-shell-app .access-card{background:rgba(255,255,255,.90)!important;}
.login-shell-app .preview-wrap{background:rgba(255,255,255,.80)!important;}
.login-shell-app .plan-copy::after{border-radius:22px!important;border-color:rgba(246,215,220,.9)!important;background:linear-gradient(90deg,#fff,#fff1f4)!important;color:var(--kp-lotus-deep)!important;}
.login-shell-app .plan-card.pro{border-color:rgba(244,116,116,.46)!important;box-shadow:0 24px 68px rgba(244,116,116,.16)!important;}
.login-error{border-radius:16px!important;background:#fff1f4!important;border:1px solid rgba(244,116,116,.28)!important;color:var(--kp-lotus-deep)!important;}

/* Footer aligned to the same rail */
.app-layout-topnav .app-content > .app-footer,
.login-shell-app .app-content > .app-footer,
body:has(.app-layout-topnav) .app-content > .app-footer,
body:has(.login-shell-app) .app-content > .app-footer{margin:clamp(34px,5vw,64px) 0 0!important;width:100%!important;max-width:100%!important;position:relative!important;bottom:auto!important;height:auto!important;max-height:none!important;overflow:visible!important;}
.kp-reference-footer{
  border-radius:30px!important;border:1px solid rgba(255,255,255,.9)!important;background:var(--kp-ref-footer)!important;box-shadow:0 18px 56px rgba(150,74,91,.10),inset 0 1px 0 rgba(255,255,255,.92)!important;
}
.kp-reference-footer::before{background:radial-gradient(circle at 6% 0%,rgba(255,226,232,.82),transparent 38%),radial-gradient(circle at 100% 4%,rgba(255,246,248,.95),transparent 36%)!important;}
.kp-footer-column h3{color:#8f6872!important;}
.kp-footer-column a{color:#2a171d!important;}
.kp-footer-column a:hover{color:var(--kp-lotus-dark)!important;}
.kp-footer-bottom{border-top-color:rgba(246,215,220,.78)!important;color:#8d7078!important;}

/* ============================================================
   KP Studio V32 — White-first lotus UI correction
   Fixes heavy pink wash, legacy blue table chrome, clipped header
   actions and desktop shell spacing. This block must remain last.
   ============================================================ */
:root{
  --kp-lotus:#ef6b73!important;
  --kp-lotus-soft:#fff7f8!important;
  --kp-lotus-soft-2:#fffbfb!important;
  --kp-lotus-dark:#d85864!important;
  --kp-lotus-deep:#8e2f45!important;
  --kp-lotus-ink:#1f1518!important;
  --kp-lotus-muted:#706166!important;
  --kp-lotus-line:rgba(238,213,218,.86)!important;
  --kp-lotus-line-strong:rgba(226,185,194,.92)!important;
  --bg:#fffdfd!important;
  --bg-subtle:#fff8f9!important;
  --bg-hover:#fff2f4!important;
  --bg-card:#ffffff!important;
  --bg-elevated:#fffdfd!important;
  --border:var(--kp-lotus-line)!important;
  --border-med:var(--kp-lotus-line-strong)!important;
  --border-strong:rgba(185,116,129,.48)!important;
  --text-primary:var(--kp-lotus-ink)!important;
  --text-secondary:#57484d!important;
  --text-tertiary:#857279!important;
  --text-muted:#a8949b!important;
  --accent:var(--kp-lotus-deep)!important;
  --accent-hover:#702337!important;
  --accent-light:#fff4f6!important;
  --accent-muted:rgba(239,107,115,.10)!important;
  --focus-ring:rgba(239,107,115,.16)!important;
  --blue:var(--kp-lotus-deep)!important;
  --blue-bg:#fff4f6!important;
  --red:#b04458!important;
  --red-bg:#fff3f5!important;
  --green:#3a806a!important;
  --green-bg:#f4faf7!important;
  --amber:#9c6f28!important;
  --amber-bg:#fff9ee!important;
  --kp-frame-w:min(1460px, calc(100vw - 72px))!important;
  --kp-frame-pad-x:clamp(18px,2.2vw,34px)!important;
  --kp-sticky-header-h:76px!important;
  --topbar-h:76px!important;
  --kp-content-bottom-safe:28px!important;
  --kp-ref-page:#fffdfc!important;
  --kp-ref-shell:linear-gradient(138deg,#ffffff 0%,#fffefe 48%,#fff8f9 100%)!important;
  --kp-ref-footer:linear-gradient(135deg,#ffffff 0%,#fffdfd 56%,#fff7f8 100%)!important;
  --shadow-xs:0 1px 2px rgba(69,30,40,.035)!important;
  --shadow-sm:0 14px 36px rgba(96,42,54,.055),0 1px 1px rgba(69,30,40,.025)!important;
  --shadow-md:0 24px 70px rgba(96,42,54,.075),0 2px 4px rgba(69,30,40,.032)!important;
  --shadow-lg:0 34px 90px rgba(96,42,54,.105),0 4px 10px rgba(69,30,40,.04)!important;
}
html,
body,
html:has(.app-layout-topnav),
body:has(.app-layout-topnav),
html:has(.login-shell-app),
body:has(.login-shell-app){
  background:#fffdfc!important;
  color:var(--kp-lotus-ink)!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  scrollbar-gutter:stable!important;
}
body{
  background:
    radial-gradient(circle at 7% -12%,rgba(239,107,115,.075),transparent 30%),
    radial-gradient(circle at 95% -6%,rgba(239,107,115,.045),transparent 31%),
    linear-gradient(180deg,#ffffff 0%,#fffdfc 52%,#fff9f8 100%)!important;
}
body::before{
  content:""!important;
  display:block!important;
  position:fixed!important;
  inset:18px!important;
  z-index:-1!important;
  pointer-events:none!important;
  border-radius:38px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(255,247,248,.16))!important;
  border:1px solid rgba(238,213,218,.42)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.96)!important;
  mask-image:none!important;
}
body::after{display:none!important;}
.kp-ambient-shell{display:block!important;pointer-events:none!important;opacity:.42!important;}
.kp-ambient-shell span{filter:blur(26px)!important;opacity:.34!important;}
.kp-ambient-shell span:nth-child(1){background:rgba(239,107,115,.14)!important;}
.kp-ambient-shell span:nth-child(2){background:rgba(255,235,238,.42)!important;}
.kp-ambient-shell span:nth-child(3){background:rgba(255,255,255,.70)!important;}

/* One calm rail: header, content and footer align precisely. */
.app-layout-topnav,
.login-shell-app,
.app-layout-topnav .app-main,
.login-shell-app .app-main,
body:has(.app-layout-topnav) .app-layout-topnav,
body:has(.login-shell-app) .login-shell-app{
  position:relative!important;
  display:block!important;
  min-height:100dvh!important;
  height:auto!important;
  width:100%!important;
  overflow:visible!important;
  background:transparent!important;
  padding:0!important;
  margin:0!important;
}
.app-layout-topnav .app-topbar-menu,
.login-shell-app .app-topbar-menu,
body:has(.app-layout-topnav) .app-topbar-menu,
body:has(.login-shell-app) .app-topbar-menu{
  position:sticky!important;
  top:10px!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:var(--kp-frame-w)!important;
  max-width:var(--kp-frame-w)!important;
  min-height:var(--kp-sticky-header-h)!important;
  height:auto!important;
  margin:10px auto 0!important;
  padding:12px var(--kp-frame-pad-x)!important;
  display:grid!important;
  grid-template-columns:minmax(210px,auto) minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:14px!important;
  overflow:visible!important;
  border-radius:30px 30px 0 0!important;
  border:1px solid rgba(238,213,218,.74)!important;
  border-bottom-color:rgba(238,213,218,.84)!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 18px 48px rgba(96,42,54,.065),inset 0 1px 0 rgba(255,255,255,.98)!important;
  backdrop-filter:blur(22px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(145%)!important;
  z-index:10000!important;
}
.app-layout-topnav .app-content,
.login-shell-app .app-content,
body:has(.app-layout-topnav) .app-content,
body:has(.login-shell-app) .app-content{
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:var(--kp-frame-w)!important;
  max-width:var(--kp-frame-w)!important;
  min-height:auto!important;
  height:auto!important;
  max-height:none!important;
  margin:0 auto 12px!important;
  padding:clamp(18px,2.4vw,34px) clamp(18px,2.4vw,34px) 32px!important;
  overflow:visible!important;
  overflow-x:clip!important;
  border:1px solid rgba(238,213,218,.58)!important;
  border-top:0!important;
  border-radius:0 0 34px 34px!important;
  background:
    radial-gradient(circle at 12% 4%,rgba(239,107,115,.045),transparent 34%),
    radial-gradient(circle at 94% 0%,rgba(239,107,115,.030),transparent 32%),
    linear-gradient(145deg,rgba(255,255,255,.985),rgba(255,255,255,.97) 48%,rgba(255,249,250,.72))!important;
  box-shadow:0 28px 84px rgba(96,42,54,.075),0 1px 2px rgba(69,30,40,.025),inset 0 1px 0 rgba(255,255,255,.96)!important;
}
.app-layout-topnav .app-footer,
.login-shell-app .app-footer,
.app-layout-topnav .app-content > .app-footer,
.login-shell-app .app-content > .app-footer,
body:has(.app-layout-topnav) .app-footer,
body:has(.login-shell-app) .app-footer{
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-height:0!important;
  height:auto!important;
  max-height:none!important;
  margin:clamp(34px,5vw,64px) 0 0!important;
  padding:0!important;
  overflow:visible!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  z-index:auto!important;
}

/* Header internals: no clipped buttons, no broken floats. */
.topbar-left{min-width:0!important;grid-column:1!important;}
.topbar-brand-link{min-width:0!important;display:inline-flex!important;align-items:center!important;gap:12px!important;color:var(--kp-lotus-ink)!important;}
.topbar-brandmark,.sidebar-logo-mark,.brand-mark,.mini-brand-mark,.kp-footer-mark{
  background:linear-gradient(145deg,#fff,#fff7f8)!important;
  border:1px solid rgba(238,213,218,.92)!important;
  color:var(--kp-lotus-deep)!important;
  box-shadow:0 10px 24px rgba(96,42,54,.07),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.topbar-title,.brand-copy strong,.kp-footer-logo strong{color:var(--kp-lotus-ink)!important;}
.topbar-kicker,.brand-copy span{color:#8a737b!important;}
.topbar-nav{min-width:0!important;justify-self:center!important;width:100%!important;}
.topbar-nav-scroll{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;min-width:0!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;}
.topbar-nav-scroll::-webkit-scrollbar{display:none!important;}
.topbar-right,.login-public-actions{min-width:0!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:10px!important;flex-wrap:nowrap!important;overflow:visible!important;}
.login-public-actions{min-width:max-content!important;}
.login-public-actions .price-chip{max-width:270px!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.topbar-menu-trigger,.top-nav-item,.nav-links a,.price-chip,.plan-badge,.topbar-user,.filter-chip,.route-badge,.screen-tag{
  background:rgba(255,255,255,.84)!important;
  border:1px solid rgba(238,213,218,.86)!important;
  color:var(--kp-lotus-ink)!important;
  box-shadow:0 8px 18px rgba(96,42,54,.035),inset 0 1px 0 rgba(255,255,255,.94)!important;
}
.topbar-menu-trigger:hover,.top-nav-item:hover,.nav-links a:hover,.price-chip:hover,.topbar-user:hover,
.topbar-menu-trigger.active,.topbar-menu-group[open] .topbar-menu-trigger,.top-nav-item.active,.nav-links a.active{
  background:linear-gradient(135deg,#fff,#fff6f7)!important;
  border-color:rgba(239,107,115,.28)!important;
  color:var(--kp-lotus-deep)!important;
  box-shadow:0 12px 26px rgba(96,42,54,.07),inset 0 1px 0 rgba(255,255,255,.96)!important;
}
.topbar-menu-emblem,.plan-badge-dot,.price-chip::before{background:#fff3f5!important;border-color:rgba(239,107,115,.22)!important;color:var(--kp-lotus-deep)!important;}
.topbar-dropdown-panel,.account-menu-popover,.topbar-account-popover{
  background:rgba(255,255,255,.98)!important;
  border-color:rgba(238,213,218,.92)!important;
  box-shadow:0 28px 80px rgba(96,42,54,.13)!important;
}
.nav-dropdown-item:hover,.nav-dropdown-item.active{background:linear-gradient(135deg,#fff,#fff7f8)!important;color:var(--kp-lotus-deep)!important;}
.nav-dropdown-item.active{box-shadow:inset 4px 0 0 rgba(239,107,115,.58)!important;}

/* Buttons: softer lotus CTAs and clean white secondary actions. */
.btn,.google-btn,.plan-cta,.btn-new-chart,.new-chart-btn,.ws-btn,.ws-btn-primary,.nc-btn-generate,.ts-search-btn,.rfbtn,.sky-btn,.hr-filter-btn,.billing-cta,.action-line,button[type="submit"]{
  border-radius:999px!important;
  font-weight:850!important;
  letter-spacing:-.01em!important;
  min-width:0!important;
  text-decoration:none!important;
}
.btn-primary,.btn.btn-primary,.btn-new-chart,.new-chart-btn,.ws-btn-primary,.nc-btn-generate,.ts-search-btn,.plan-cta,.plan-card.pro .plan-cta,.billing-cta.primary,.action-line,button[type="submit"]{
  background:linear-gradient(135deg,#f27a80,#df5967)!important;
  color:#fff!important;
  border:1px solid rgba(239,107,115,.42)!important;
  box-shadow:0 14px 28px rgba(239,107,115,.18),inset 0 1px 0 rgba(255,255,255,.26)!important;
  text-shadow:none!important;
}
.btn-primary:hover,.btn.btn-primary:hover,.btn-new-chart:hover,.new-chart-btn:hover,.ws-btn-primary:hover,.nc-btn-generate:hover,.ts-search-btn:hover,.plan-cta:hover,.billing-cta.primary:hover,.action-line:hover,button[type="submit"]:hover{
  background:linear-gradient(135deg,#ee6d75,#cf4c5d)!important;
  color:#fff!important;
  box-shadow:0 18px 36px rgba(239,107,115,.24),inset 0 1px 0 rgba(255,255,255,.30)!important;
  transform:translateY(-1px)!important;
}
.btn-secondary,.btn.btn-secondary,.btn-ghost,.ws-btn,.ws-btn-ghost,.sky-btn,.rfbtn,.hr-filter-btn,.plan-card:not(.pro) .plan-cta,.google-btn,.btn-icon{
  background:rgba(255,255,255,.92)!important;
  color:var(--kp-lotus-ink)!important;
  border:1px solid rgba(238,213,218,.92)!important;
  box-shadow:0 10px 22px rgba(96,42,54,.045),inset 0 1px 0 rgba(255,255,255,.96)!important;
}
.btn-secondary:hover,.btn.btn-secondary:hover,.btn-ghost:hover,.ws-btn:hover,.ws-btn-ghost:hover,.sky-btn:hover,.rfbtn:hover,.hr-filter-btn:hover,.plan-card:not(.pro) .plan-cta:hover,.google-btn:hover,.btn-icon:hover{
  background:#fff8f9!important;
  border-color:rgba(239,107,115,.30)!important;
  color:var(--kp-lotus-deep)!important;
  box-shadow:0 14px 28px rgba(96,42,54,.065),inset 0 1px 0 rgba(255,255,255,.98)!important;
}
.btn-danger{background:#b94758!important;border-color:#b94758!important;color:#fff!important;}

/* Surfaces: white dominates, pink is only flavour. */
.app-layout-topnav *:where(.card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,.nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,.hv-panel,.ws-col,.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,.client-card,.pricing-card,.up-wrap,.price-card,.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,.settings-card,.billing-card,.section-card,.form-card,.kd-hero-panel,.kd-card,.kd-info-tile,.kd-chart-shell,.kd-energy-card,.kd-focus-panel,.ws-header,.ws-tabs,.hv-case-header,.hv-sidebar,.hv-outer,.learn-card,.bill-hero,.bill-status,.bill-feature,.matrix,.plan-card,.pricing-card,.hero-board,.access-card,.preview-wrap,.workspace-rail,.screen-window,.real-app-shell,.screen-frame,.feature-card,.plan-copy,.ui-card,.metric-card,.table-surface,.chart-surface,.south-chart,.north-chart,.micro-card,.case-card,.export-card),
body:has(.app-layout-topnav) *:where(.card,.snapshot,.tr-card,.rp-card,.cl-card,.quick-card,.activity-card,.birthday-card,.favourite-card,.nc-card,.nc-guide-card,.nc-chart-output,.ts-form-card,.ts-gate-card,.rl-filters,.rl-stat,.hv-panel,.ws-col,.ws-notes-card,.ws-accuracy-card,.dasha-detail-panel,.prem-gate-wrap,.client-card,.pricing-card,.up-wrap,.price-card,.p-card,.chart-library-card,.client-card-row,.client-chart-card,.hr-card,.settings-card,.billing-card,.section-card,.form-card,.kd-hero-panel,.kd-card,.kd-info-tile,.kd-chart-shell,.kd-energy-card,.kd-focus-panel,.ws-header,.ws-tabs,.hv-case-header,.hv-sidebar,.hv-outer,.learn-card,.bill-hero,.bill-status,.bill-feature,.matrix,.plan-card,.pricing-card,.hero-board,.access-card,.preview-wrap,.workspace-rail,.screen-window,.real-app-shell,.screen-frame,.feature-card,.plan-copy,.ui-card,.metric-card,.table-surface,.chart-surface,.south-chart,.north-chart,.micro-card,.case-card,.export-card),
.login-shell-app *:where(.hero-board,.access-card,.preview-wrap,.workspace-rail,.screen-window,.real-app-shell,.screen-frame,.feature-card,.plan-card,.plan-copy,.ui-card,.metric-card,.table-surface,.chart-surface,.south-chart,.north-chart,.micro-card,.case-card,.export-card){
  background:rgba(255,255,255,.92)!important;
  border-color:rgba(238,213,218,.80)!important;
  box-shadow:0 16px 44px rgba(96,42,54,.055),0 1px 2px rgba(69,30,40,.025)!important;
  backdrop-filter:blur(10px) saturate(118%)!important;
  -webkit-backdrop-filter:blur(10px) saturate(118%)!important;
}
.app-layout-topnav *:where(.page-header,.dh,.nc-header,.ts-hero,.rl-header,.hindex-header,.hv-header,.bill-hero,.kd-hero),
body:has(.app-layout-topnav) *:where(.page-header,.dh,.nc-header,.ts-hero,.rl-header,.hindex-header,.hv-header,.bill-hero,.kd-hero){
  background:linear-gradient(135deg,#fff,#fff9fa)!important;
  border:1px solid rgba(238,213,218,.78)!important;
  box-shadow:0 16px 44px rgba(96,42,54,.052)!important;
}
.login-shell-app .hero-board,body:has(.login-shell-app) .hero-board{
  background:
    radial-gradient(circle at 12% 0%,rgba(239,107,115,.070),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,255,255,.96) 52%,rgba(255,248,249,.80))!important;
  border-color:rgba(238,213,218,.78)!important;
}
.login-shell-app h1 span,body:has(.login-shell-app) h1 span{color:var(--kp-lotus-deep)!important;background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;}
.login-shell-app .hero-sub{color:#625158!important;}
.login-shell-app .access-card{background:rgba(255,255,255,.95)!important;}
.login-shell-app .preview-wrap{background:rgba(255,255,255,.88)!important;}

/* Tables and data grids: purge the remaining blue/grey chrome. */
.table-wrap,.ws-table-wrap,.compare-wrap,.matrix,.kp-data-surface,.table-surface,.mini-table,.data-table-wrap{
  background:rgba(255,255,255,.90)!important;
  border:1px solid rgba(238,213,218,.86)!important;
  box-shadow:0 12px 30px rgba(96,42,54,.045)!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(226,185,194,.82) transparent!important;
}
.table-wrap::-webkit-scrollbar,.ws-table-wrap::-webkit-scrollbar,.compare-wrap::-webkit-scrollbar{height:10px!important;width:10px!important;}
.table-wrap::-webkit-scrollbar-thumb,.ws-table-wrap::-webkit-scrollbar-thumb,.compare-wrap::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#f1d6dc,#e7bac4)!important;border-radius:999px!important;border:2px solid rgba(255,255,255,.82)!important;}
.ws-table,.sig-table,.compare-table,.table,table{border-collapse:separate!important;border-spacing:0!important;}
thead th,
.table thead th,
.ws-table thead th,
.sig-table thead th,
.compare-table th,
.mini-table th,
.tt thead th,
.table-surface th,
body:has(.ws-page) .ws-table thead th,
body:has(.ws-page) .sig-table thead th,
body:has(.ws-page) .compare-table th{
  background:linear-gradient(180deg,#ffffff,#fff8f9)!important;
  color:#80646d!important;
  border-bottom:1px solid rgba(238,213,218,.92)!important;
  box-shadow:none!important;
}
tbody td,
.table tbody td,
.ws-table tbody td,
.sig-table tbody td,
.compare-table td,
.mini-table td,
.tt tbody td,
.table-surface td{
  background:rgba(255,255,255,.88)!important;
  color:#4e4146!important;
  border-bottom:1px solid rgba(238,213,218,.70)!important;
}
tbody tr:hover td,.table tbody tr:hover td,.ws-table tbody tr:hover td,.sig-table tbody tr:hover td,.compare-table tr:hover td,.tt tbody tr:hover td{
  background:#fffafb!important;
  box-shadow:inset 3px 0 0 rgba(239,107,115,.34)!important;
}
.ws-tabs,
body:has(.ws-page) .ws-tabs,
body:has(.hv-outer) .ws-tabs{
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(238,213,218,.86)!important;
  box-shadow:0 10px 26px rgba(96,42,54,.055),inset 0 1px 0 rgba(255,255,255,.96)!important;
}
.ws-tab.active,.tab.active,[role="tab"].active{
  background:#fff7f8!important;
  border-color:rgba(239,107,115,.32)!important;
  color:var(--kp-lotus-deep)!important;
}

/* Chips, badges and utility colours. */
.badge,.pill,.tag,.nav-badge,.plan-badge2,.mini-badge,.route-badge,.screen-tag,.kicker,.secure-badge,.free-badge,.trust-row span,.plan-label span,.check,.filter-chip,.avatar,.star,
.house-num-pill,.kp-house,.sig-h,.sig-h.p,.sig-h.o,.sig-csl-chip,.sig-csl-chip.p,.sig-csl-chip.o,.h-pill,.house-pill,[class*="house-chip"],[class*="house-pill"]{
  background:#fff5f6!important;
  border-color:rgba(238,213,218,.92)!important;
  color:var(--kp-lotus-deep)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.90)!important;
}
.hb-open,.badge-mool,.alert-info,.preview-disclaimer,.dasha-item-mini.on{background:#fff5f6!important;color:var(--kp-lotus-deep)!important;border-color:rgba(238,213,218,.92)!important;}
.spinner{border-color:rgba(239,107,115,.18)!important;border-top-color:var(--kp-lotus)!important;}
.asp-bar,.bar-track{background:rgba(238,213,218,.70)!important;}
.bar-fill,.asp-bar-fill{background:linear-gradient(90deg,#ef6b73,#e7a3ad)!important;}
.ni-frame,.ni-line,.chart-line{stroke:#ead6db!important;}
.ni-asc-fill,.chart-fill{fill:#fff7f8!important;}
.chart-svg-wrap,.chart-canvas,.chart-surface,.north-chart,.south-chart{border-color:rgba(238,213,218,.80)!important;background:#fff!important;}

/* Forms */
input,select,textarea,.form-control,.nc-input,.nc-select,.nc-textarea,.ts-select,.ts-date-input,.ts-place-input,.ts-coord,.rl-filter-select,.hv-status-sel,.kp-footer-newsletter input{
  background:rgba(255,255,255,.94)!important;
  border-color:rgba(238,213,218,.92)!important;
  color:var(--kp-lotus-ink)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.94)!important;
}
input:focus,select:focus,textarea:focus,.form-control:focus,.nc-input:focus,.nc-select:focus,.nc-textarea:focus,.ts-select:focus,.ts-date-input:focus,.ts-place-input:focus,.ts-coord:focus{
  border-color:rgba(239,107,115,.50)!important;
  box-shadow:0 0 0 4px rgba(239,107,115,.12),inset 0 1px 0 rgba(255,255,255,.96)!important;
  outline:0!important;
}

/* Reference-style footer: airy, white-dominant and aligned. */
.kp-reference-footer{
  border-radius:30px!important;
  border:1px solid rgba(238,213,218,.72)!important;
  background:linear-gradient(135deg,#ffffff 0%,#fffefe 56%,#fff7f8 100%)!important;
  box-shadow:0 18px 54px rgba(96,42,54,.060),inset 0 1px 0 rgba(255,255,255,.96)!important;
}
.kp-reference-footer::before{
  opacity:.72!important;
  background:
    radial-gradient(circle at 8% 0%,rgba(239,107,115,.060),transparent 35%),
    radial-gradient(circle at 100% 4%,rgba(239,107,115,.035),transparent 35%)!important;
}
.kp-footer-column h3{color:#8b6972!important;}
.kp-footer-column a{color:#2d2024!important;}
.kp-footer-column a:hover{color:var(--kp-lotus-deep)!important;}
.kp-footer-bottom{border-top-color:rgba(238,213,218,.70)!important;color:#8d727a!important;}
.kp-footer-newsletter button{background:linear-gradient(135deg,#f27a80,#df5967)!important;color:#fff!important;border:0!important;}

/* Narrow desktop/laptop rail tuning; mobile and tablet screens are blocked by the desktop-only gate. */
@media(max-width:1280px){
  :root{--kp-frame-w:calc(100vw - 36px)!important;--kp-frame-pad-x:18px!important;}
  .login-public-actions .price-chip{display:none!important;}
  .app-layout-topnav .app-topbar-menu,
  .login-shell-app .app-topbar-menu,
  body:has(.app-layout-topnav) .app-topbar-menu,
  body:has(.login-shell-app) .app-topbar-menu{grid-template-columns:minmax(190px,auto) minmax(0,1fr) auto!important;gap:10px!important;}
}



/* ── KP Studio global processing progress overlay ───────────── */
.kp-processing-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:2147483000!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
  background:rgba(255,255,255,.48)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  opacity:0!important;
  pointer-events:none!important;
  transition:opacity .22s ease!important;
}
.kp-processing-backdrop.show{opacity:1!important;pointer-events:auto!important;}
.kp-processing-card{
  width:min(430px,calc(100vw - 48px))!important;
  border-radius:30px!important;
  border:1px solid rgba(219,230,239,.96)!important;
  background:
    radial-gradient(circle at 18% 8%,rgba(239,107,115,.14),transparent 34%),
    radial-gradient(circle at 82% 18%,rgba(15,23,42,.08),transparent 32%),
    linear-gradient(145deg,rgba(255,255,255,.96),rgba(248,251,253,.94))!important;
  box-shadow:0 34px 90px rgba(15,23,42,.18),inset 0 1px 0 rgba(255,255,255,.92)!important;
  padding:28px!important;
  color:var(--text-primary,#0f172a)!important;
  transform:translateY(12px) scale(.98)!important;
  transition:transform .24s ease!important;
}
.kp-processing-backdrop.show .kp-processing-card{transform:translateY(0) scale(1)!important;}
.kp-processing-orbit{
  width:72px!important;
  height:72px!important;
  margin:0 auto 16px!important;
  border-radius:999px!important;
  border:1px solid rgba(239,107,115,.22)!important;
  position:relative!important;
  background:rgba(255,247,247,.78)!important;
  box-shadow:inset 0 0 0 12px rgba(255,255,255,.68),0 14px 32px rgba(180,83,83,.13)!important;
}
.kp-processing-orbit:before{
  content:'✦'!important;
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  place-items:center!important;
  color:#b45353!important;
  font-size:28px!important;
  line-height:1!important;
}
.kp-processing-orbit span{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:7px!important;
  height:7px!important;
  border-radius:999px!important;
  background:#b45353!important;
  transform-origin:-28px 0!important;
  animation:kpProcessingOrbit 1.4s linear infinite!important;
}
.kp-processing-orbit span:nth-child(2){animation-duration:1.9s!important;background:#16856a!important;opacity:.78!important;}
.kp-processing-orbit span:nth-child(3){animation-duration:2.4s!important;background:#0f172a!important;opacity:.58!important;}
.kp-processing-copy{text-align:center!important;margin-bottom:14px!important;}
.kp-processing-copy strong{display:block!important;font-size:18px!important;font-weight:900!important;letter-spacing:-.35px!important;color:#0f172a!important;}
.kp-processing-copy span{display:block!important;margin-top:4px!important;font-size:12px!important;font-weight:750!important;color:#64748b!important;}
.kp-processing-title{text-align:center!important;font-size:13px!important;font-weight:850!important;color:#334155!important;margin:14px 0 12px!important;}
.kp-processing-track{height:10px!important;border-radius:999px!important;background:#eef2f6!important;overflow:hidden!important;border:1px solid rgba(219,230,239,.92)!important;}
.kp-processing-fill{height:100%!important;width:0%;border-radius:999px!important;background:linear-gradient(90deg,#b45353,#ef6b73,#0f172a)!important;box-shadow:0 0 18px rgba(239,107,115,.34)!important;transition:width .24s ease!important;}
.kp-processing-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;margin-top:10px!important;font-size:11px!important;font-weight:850!important;color:#718094!important;}
.kp-processing-foot b{color:#0f172a!important;}
html.kp-is-processing body{cursor:progress!important;}
@keyframes kpProcessingOrbit{from{transform:rotate(0deg) translateX(28px) rotate(0deg);}to{transform:rotate(360deg) translateX(28px) rotate(-360deg);}}

/* ============================================================
   V24 non-sticky app footer alignment
   Footer is now part of the normal centered shell flow instead
   of being pinned to the viewport. It attaches under the app
   content and uses the same rail as the header/content frame.
   ============================================================ */
.app-layout-topnav .app-content,
body:has(.app-layout-topnav) .app-content{
  margin-bottom:0!important;
  padding-bottom:32px!important;
  border-bottom-left-radius:0!important;
  border-bottom-right-radius:0!important;
}
.app-layout-topnav .app-footer.app-footer-slim,
body:has(.app-layout-topnav) .app-footer.app-footer-slim{
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:var(--kp-frame-w)!important;
  max-width:var(--kp-frame-w)!important;
  height:auto!important;
  min-height:42px!important;
  max-height:none!important;
  margin:0 auto 22px!important;
  padding:10px var(--kp-frame-pad-x)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  color:#7d6670!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(238,213,218,.78)!important;
  border-top:0!important;
  border-radius:0 0 30px 30px!important;
  box-shadow:0 18px 50px rgba(96,42,54,.060),inset 0 1px 0 rgba(255,255,255,.88)!important;
  backdrop-filter:blur(18px) saturate(125%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(125%)!important;
  z-index:1!important;
}
.app-layout-topnav .app-footer.app-footer-slim .app-footer-copy,
body:has(.app-layout-topnav) .app-footer.app-footer-slim .app-footer-copy{
  flex:1 1 auto!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  line-height:1.2!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.app-layout-topnav .app-footer.app-footer-slim .app-footer-links,
body:has(.app-layout-topnav) .app-footer.app-footer-slim .app-footer-links{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:16px!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
}
@media(max-width:1280px){
  .app-layout-topnav .app-footer.app-footer-slim,
  body:has(.app-layout-topnav) .app-footer.app-footer-slim{
    bottom:auto!important;
    margin-bottom:16px!important;
  }
}

