/* =====================================================================
   Ronk Global — shared design system (single stylesheet)
   Tokens → base → shell → components → overlays → pages → responsive

   EDIT THIS FILE IN PLACE — never rewrite it whole. Several sessions work in it at once, and the
   dark theme lives at the bottom in a generated block between the DARK-START / DARK-END markers.
   After changing any colour here, run:  tools/php/php tools-dev/build-dark.php
   Never hand-edit inside the generated block; dark corrections go in tools-dev/dark-overrides.css.
   Colours drawn by JavaScript (SVG charts) must come from a --chart-* custom property, not a literal,
   or the dark pass cannot reach them.
   ===================================================================== */

/* ---------- 1. Tokens ------------------------------------------------ */
:root {
  --font: "IBM Plex Sans Condensed", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --color-bg: #F3F8FD; --color-surface: #FFFFFF; --color-surface-muted: #F1F5F9; --color-surface-hover: #F8FAFC;
  --color-border: #E5ECF4; --color-border-strong: #CBD5E1; --color-divider: #EDF2F7;
  --color-text: #0F172A; --color-text-secondary: #536987; --color-text-muted: #5D6B80; --color-text-faint: #6D7A90;
  --color-sidebar: #08182A; --color-sidebar-text: #9AA8BC; --color-sidebar-hover: rgba(255,255,255,.06); --color-sidebar-active: #0069FC; --color-sidebar-promo: #0C1E31; --color-sidebar-border: rgba(255,255,255,.08);
  --color-primary: #2563EB; --color-primary-hover: #1D4ED8; --color-primary-active: #1E40AF; --color-primary-soft: #EFF6FF; --color-primary-soft-2: #DBEAFE; --color-primary-text: #1D4ED8;
  --color-navy: #0F172A; --color-navy-hover: #1E293B;
  --color-success: #16A34A; --color-success-hover: #15803D; --color-success-soft: #DCFCE7; --color-success-text: #15803D;
  --color-warning: #F59E0B; --color-warning-soft: #FEF3C7; --color-warning-text: #B45309;
  --color-danger: #EF4444; --color-danger-hover: #DC2626; --color-danger-soft: #FEE2E2; --color-danger-text: #B91C1C;
  --color-info: #0EA5E9; --color-info-soft: #E0F2FE; --color-info-text: #0369A1;
  --color-purple: #7C3AED; --color-purple-soft: #EDE9FE; --color-purple-text: #6D28D9;
  --color-orange: #F97316; --color-orange-soft: #FFEDD5; --color-orange-text: #C2410C;
  --color-pink: #EC4899; --color-pink-soft: #FCE7F3; --color-pink-text: #BE185D;
  --color-teal: #14B8A6; --color-teal-soft: #CCFBF1; --color-teal-text: #0F766E;
  --color-slate: #64748B; --color-slate-soft: #E2E8F0; --color-slate-text: #334155;
  --color-auth-primary: #059669; --color-auth-primary-hover: #047857;
  --fs-display: 48px; --fs-h1: 28px; --fs-h2: 22px; --fs-h3: 16px; --fs-kpi: 26px; --fs-body-lg: 15px; --fs-body: 14px; --fs-small: 12px; --fs-label: 12px; --fs-caption: 11px;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px; --sp-16: 64px;
  --r-xs: 4px; --r-sm: 6px; --r-md: 8px; --r-lg: 10px; --r-xl: 12px; --r-2xl: 16px; --r-full: 999px;
  --shadow-xs: 0 1px 2px rgba(15,23,42,.04); --shadow-sm: 0 1px 3px rgba(15,23,42,.08), 0 1px 2px rgba(15,23,42,.04); --shadow-md: 0 4px 12px rgba(15,23,42,.08); --shadow-lg: 0 12px 32px rgba(15,23,42,.14); --shadow-xl: 0 24px 64px rgba(15,23,42,.24);
  --sidebar-w: 210px; --sidebar-rail-w: 64px; --topbar-h: 60px; --panel-w: 384px; --content-max: 1680px; --page-pad: 24px; --gap: 16px;
  --z-sticky: 10; --z-sidebar: 20; --z-topbar: 30; --z-dropdown: 40; --z-drawer: 50; --z-modal: 60; --z-toast: 70; --z-palette: 80;
  --t-fast: 120ms ease; --t-base: 200ms ease; --t-drawer: 260ms cubic-bezier(.2,.8,.2,1);
  --focus-ring: 0 0 0 3px rgba(37,99,235,.35);
  --row-h: 46px; --th-h: 40px;
  /* Colours used by the hand-drawn SVG charts. They live here (not in the JS) so the dark pass can flip
     them — a hex hard-coded inside generated SVG survives the theme untouched. */
  --chart-grid: #F2F6FC; --chart-grid-zero: #E7EEF8; --chart-grid-v: #EEF2F8; --chart-grid-strong: #E6EDF7;
  /* choropleth buckets, darkest first — drawn by JS, so they must live on a custom property */
  --chart-geo-4: #1E40AF; --chart-geo-3: #2563EB; --chart-geo-2: #60A5FA; --chart-geo-1: #BFDBFE; --chart-geo-0: #E7EEF8;
  --chart-track: #E2E8F0; --chart-ring-track: #E6EBF3; --chart-crosshair: #CBD5E1;
  --chart-prev-line: #CBD5E5; --chart-prev-dot: #C3CFE2; --chart-grey: #C7D2E2;
  --chart-bar-soft: #BFD4FB; --chart-bar-soft-2: #C4B5FD; --chart-dot-ring: #FFFFFF; --chart-axis: #64748B;
}

/* IBM Plex Sans Condensed (self-hosted, SIL Open Font License) — the typeface of the design references */
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/PlexSansCondensed-400-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/PlexSansCondensed-400-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/PlexSansCondensed-500-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/PlexSansCondensed-500-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/PlexSansCondensed-600-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/PlexSansCondensed-600-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/PlexSansCondensed-700-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/PlexSansCondensed-700-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
/* Inter stays available as the fallback face */
/* Inter (variable, self-hosted; SIL Open Font License) */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/Inter-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/Inter-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ---------- 2. Base -------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; height: 100%; }
body { margin: 0; font-family: var(--font); font-size: var(--fs-body); line-height: 1.5; color: var(--color-text); background: var(--color-bg); -webkit-font-smoothing: antialiased; min-height: 100%; }
h1, h2, h3, h4, p { margin: 0; }
a { color: var(--color-primary-text); text-decoration: none; }
a:hover { text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }
img, svg { display: block; max-width: 100%; }
table { border-collapse: collapse; width: 100%; }
[hidden] { display: none !important; }
.icon { display: inline-block; width: 1em; height: 1em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; vertical-align: -0.125em; }
/* unified icon sizes (approved UI asset pack: 1.8px line icons) */
.ui-icon-sm { width: 14px; height: 14px; } .ui-icon-md { width: 16px; height: 16px; } .ui-icon-lg { width: 20px; height: 20px; } .ui-icon-xl { width: 24px; height: 24px; }
.icon.brand-icon { stroke: none; fill: currentColor; }
img.icon { fill: none; stroke: none; }
.skip-link { position: absolute; left: -999px; top: 8px; background: var(--color-navy); color: #fff; padding: 8px 12px; border-radius: var(--r-md); z-index: 100; }
.skip-link:focus { left: 8px; }
:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--r-sm); }
.tabular, .num, .kpi-value, .data-table td.num, .money { font-variant-numeric: tabular-nums; }
::selection { background: var(--color-primary-soft-2); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

/* Typography utilities */
.text-muted { color: var(--color-text-muted); } .text-secondary { color: var(--color-text-secondary); } .text-faint { color: var(--color-text-faint); }
.text-primary { color: var(--color-primary-text); } .text-green, .text-success { color: var(--color-success-text); } .text-red, .text-danger { color: var(--color-danger-text); } .text-amber, .text-warning { color: var(--color-warning-text); } .text-purple { color: var(--color-purple-text); } .text-blue { color: var(--color-primary-text); }
.text-sm { font-size: var(--fs-small); } .text-xs { font-size: var(--fs-caption); } .text-lg { font-size: var(--fs-body-lg); }
.fw-500 { font-weight: 500; } .fw-600 { font-weight: 600; } .fw-700 { font-weight: 700; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nowrap { white-space: nowrap; } .text-right { text-align: right; } .text-center { text-align: center; }
.flex { display: flex; } .flex-col { flex-direction: column; } .items-center { align-items: center; } .justify-between { justify-content: space-between; } .gap-1 { gap: var(--sp-1); } .gap-2 { gap: var(--sp-2); } .gap-3 { gap: var(--sp-3); } .gap-4 { gap: var(--sp-4); } .grow { flex: 1 1 auto; min-width: 0; }
.mt-1 { margin-top: var(--sp-1); } .mt-2 { margin-top: var(--sp-2); } .mt-3 { margin-top: var(--sp-3); } .mt-4 { margin-top: var(--sp-4); } .mt-6 { margin-top: var(--sp-6); } .mb-2 { margin-bottom: var(--sp-2); } .mb-3 { margin-bottom: var(--sp-3); } .mb-4 { margin-bottom: var(--sp-4); } .mb-6 { margin-bottom: var(--sp-6); }
.w-full { width: 100%; } .hidden-mobile { } .only-mobile { display: none !important; }

/* ---------- 3. App shell --------------------------------------------- */
.app-shell { display: flex; min-height: 100vh; }
.app-main { flex: 1 1 auto; min-width: 0; margin-left: var(--sidebar-w); display: flex; flex-direction: column; transition: margin-left var(--t-base); }
.page-content { padding: var(--sp-5) var(--page-pad) var(--sp-8); flex: 1; width: 100%; max-width: var(--content-max); }
.page-content:focus { box-shadow: none; }

/* Sidebar */
.sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar-w); background: var(--color-sidebar); color: #fff; display: flex; flex-direction: column; z-index: var(--z-sidebar); transition: width var(--t-base), transform var(--t-drawer); }
.sidebar-brand { display: flex; align-items: center; justify-content: space-between; padding: 20px 16px 12px; }
.brand-link { display: flex; align-items: center; gap: 12px; color: #fff; min-width: 0; }
.brand-mark { width: 38px; height: 38px; flex: none; }
.brand-text { display: flex; flex-direction: column; min-width: 0; }
.brand-name { font-weight: 700; font-size: 16px; line-height: 1.2; letter-spacing: -.01em; white-space: nowrap; }
.brand-tag { font-size: 12px; color: var(--color-sidebar-text); white-space: nowrap; }
.sidebar-close { display: none; color: var(--color-sidebar-text); }
.sidebar-nav { padding: 14px 14px 6px; display: flex; flex-direction: column; gap: 4px; overflow-y: auto; flex: 1; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.15) transparent; }
.nav-item { display: flex; align-items: center; gap: 12px; height: 38px; padding: 0 14px; border-radius: var(--r-md); color: var(--color-sidebar-text); font-weight: 500; font-size: 13.5px; position: relative; white-space: nowrap; transition: background var(--t-fast), color var(--t-fast); }
.nav-item:hover { background: var(--color-sidebar-hover); color: #fff; }
.nav-item.is-active { background: var(--color-sidebar-active); color: #fff; }
.nav-item .nav-icon { width: 18px; height: 18px; flex: none; }
.nav-badge { margin-left: auto; background: var(--color-danger); color: #fff; font-size: 11px; font-weight: 700; min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--r-full); display: inline-flex; align-items: center; justify-content: center; }
.sidebar-promo { margin: 12px 14px; padding: 14px 14px; background: var(--color-sidebar-promo); border: 1px solid var(--color-sidebar-border); border-radius: var(--r-2xl); display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }
.promo-text { display: flex; flex-direction: column; font-weight: 600; font-size: 13.5px; line-height: 1.5; color: #fff; }
.promo-text span:last-child { color: var(--color-sidebar-text); font-weight: 500; }
.promo-lines { grid-column: 1 / -1; list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--color-sidebar-text); }
.promo-lines li::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--color-primary); margin-right: 8px; vertical-align: middle; }
.promo-art { width: 60px; height: 40px; object-fit: contain; }
.sidebar-user { border-top: 1px solid var(--color-sidebar-border); padding: 12px 16px 16px; position: relative; }
.user-row { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; color: #fff; border-radius: var(--r-lg); padding: 6px; }
.user-row:hover { background: var(--color-sidebar-hover); }
.user-meta { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.user-name { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-role { font-size: 12px; color: var(--color-sidebar-text); }
.user-chevron { color: var(--color-sidebar-text); }
.sidebar-collapse { position: absolute; right: -12px; top: 22px; width: 24px; height: 24px; border-radius: 50%; background: #fff; color: var(--color-text-secondary); border: 1px solid var(--color-border); display: none; align-items: center; justify-content: center; box-shadow: var(--shadow-sm); opacity: 0; transition: opacity var(--t-fast); }
.sidebar:hover .sidebar-collapse, .sidebar-collapse:focus-visible { opacity: 1; }
.sidebar-backdrop { display: none; position: fixed; inset: 0; background: rgba(15,23,42,.5); z-index: calc(var(--z-sidebar) - 1); }
/* collapsed rail */
body.sidebar-collapsed .sidebar { width: var(--sidebar-rail-w); }
body.sidebar-collapsed .app-main { margin-left: var(--sidebar-rail-w); }
body.sidebar-collapsed .brand-text, body.sidebar-collapsed .nav-label, body.sidebar-collapsed .sidebar-promo, body.sidebar-collapsed .user-meta, body.sidebar-collapsed .user-chevron { display: none; }
body.sidebar-collapsed .sidebar-brand { justify-content: center; padding: 18px 8px 14px; }
body.sidebar-collapsed .nav-item { justify-content: center; padding: 0; }
body.sidebar-collapsed .nav-badge { position: absolute; top: 4px; right: 6px; min-width: 16px; height: 16px; font-size: 10px; padding: 0 4px; }
body.sidebar-collapsed .sidebar-user { padding: 12px 10px; }
body.sidebar-collapsed .user-row { justify-content: center; }
body.sidebar-collapsed .nav-item:hover::after { content: attr(data-tooltip); position: absolute; left: calc(100% + 10px); top: 50%; transform: translateY(-50%); background: var(--color-navy); color: #fff; font-size: 12px; font-weight: 500; padding: 6px 10px; border-radius: var(--r-md); white-space: nowrap; box-shadow: var(--shadow-md); z-index: 5; }
body.sidebar-collapsed .sidebar-collapse .icon { transform: rotate(180deg); }
.mobile-nav { display: none; }

/* Topbar */
.topbar { position: sticky; top: 0; z-index: var(--z-topbar); height: var(--topbar-h); background: var(--color-surface); display: flex; align-items: center; gap: 12px; padding: 0 var(--page-pad); border-bottom: 1px solid var(--color-border); }
.topbar.is-scrolled { background: rgba(248,250,252,.92); backdrop-filter: blur(8px); border-bottom-color: var(--color-border); }
.topbar .topbar-menu, .topbar .topbar-brand-mobile { display: none; }
.topbar-search { display: flex; align-items: center; gap: 10px; height: 36px; width: min(410px, 100%); max-width: 410px; padding: 0 12px 0 14px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-md); color: var(--color-text-faint); text-align: left; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.topbar-search:hover { border-color: var(--color-border-strong); }
.topbar-search .icon { color: var(--color-text-muted); }
.topbar-search-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; color: var(--color-text-secondary); }
.kbd-group { display: inline-flex; gap: 3px; }
kbd { font-family: var(--font); font-size: 11px; font-weight: 600; color: var(--color-text-secondary); background: var(--color-surface-muted); border: 1px solid var(--color-border); border-radius: var(--r-xs); padding: 1px 5px; line-height: 1.4; min-width: 18px; text-align: center; }
.topbar-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.period-select { position: relative; display: flex; align-items: center; height: 36px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-md); padding: 0 8px 0 12px; gap: 6px; color: var(--color-text); }
.period-select .icon { color: var(--color-text-secondary); }
/* topbar date-range picker (the Geography-style control, used on every reporting page) */
.tb-rangewrap { position: relative; }
.tb-range { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 10px 0 11px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 9px; font-size: 13px; font-weight: 700; color: var(--color-text); box-shadow: 0 1px 2px rgba(15,23,42,.03); white-space: nowrap; cursor: pointer; }
.tb-range:hover { border-color: #C9D6EA; }
.tb-range-cal { color: #2563EB; flex: none; width: 17px; height: 17px; }
.tb-range-caret { color: #68768D; flex: none; }
.tb-range-menu { min-width: 236px; padding: 6px; right: 0; left: auto; }
.tb-range-menu .dropdown-item.is-on { background: #EEF3FF; color: #2563EB; font-weight: 600; }
.tb-range-custom { border-top: 1px solid var(--color-border); margin-top: 6px; padding: 10px 8px 4px; }
.tb-range-form { display: grid; gap: 8px; }
.tb-range-form label { display: grid; gap: 3px; font-size: 12px; color: var(--color-text-secondary); }
.tb-range-form input { height: 32px; border: 1px solid var(--color-border); border-radius: 8px; padding: 0 8px; font-size: 13px; background: var(--color-surface); color: var(--color-text); }
@media (max-width: 767px) { .tb-range-label { max-width: 128px; overflow: hidden; text-overflow: ellipsis; } .tb-range { padding: 0 8px; gap: 6px; } }
.period-input { border: 0; background: transparent; height: 100%; padding: 0 22px 0 2px; font-weight: 500; font-size: 13px; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 2px center; cursor: pointer; }
.period-input:focus { box-shadow: none; }
.topbar-bell { position: relative; width: 38px; height: 38px; }
.topbar-bell.has-unread:not(.has-count)::after { content: ""; position: absolute; top: 7px; right: 8px; width: 9px; height: 9px; border-radius: 50%; background: var(--color-danger); border: 2px solid var(--color-surface); }
.topbar-bell .bell-count { position: absolute; top: -2px; right: -2px; background: var(--color-danger); color: #fff; font-size: 10px; font-weight: 700; min-width: 18px; height: 18px; padding: 0 4px; border-radius: var(--r-full); display: flex; align-items: center; justify-content: center; border: 2px solid var(--color-bg); }
.topbar-bell.has-count .icon { color: var(--color-primary); }
.btn-add-new .btn-caret { margin-left: 2px; opacity: .8; }
.topbar-avatar { display: flex; align-items: center; gap: 10px; border-radius: var(--r-lg); padding: 2px; }
.topbar-user-meta { display: none; flex-direction: column; text-align: left; line-height: 1.25; }
.topbar-user-meta .user-name { font-size: 14px; font-weight: 600; color: var(--color-text); }
.topbar-user-meta .user-role { font-size: 12px; color: var(--color-text-secondary); display: inline-flex; align-items: center; gap: 2px; }

/* Page header */
.page-header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-4); margin: 6px 0 var(--sp-5); flex-wrap: wrap; }
.page-header-main { display: flex; align-items: center; gap: 14px; min-width: 0; flex: 1 1 480px; }
.page-header-main > div { min-width: 0; }
.page-actions { flex: none; }
.page-icon { width: 56px; height: 56px; border-radius: var(--r-xl); background: var(--color-primary-soft-2); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.page-icon.tone-green { background: var(--color-success-soft); color: var(--color-success); }
.eyebrow { font-size: var(--fs-label); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--color-text-muted); margin-bottom: 2px; }
.page-title { font-size: var(--fs-h1); font-weight: 700; letter-spacing: -.02em; line-height: 1.2; color: var(--color-text); }
.page-title .wave { display: inline-block; color: var(--color-warning); vertical-align: -3px; margin-left: 6px; }
.page-subtitle { margin-top: 4px; font-size: var(--fs-body-lg); color: var(--color-text-secondary); }
.page-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.page-meta { font-size: 12px; color: var(--color-text-muted); text-align: right; margin-top: 6px; }
.top-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--color-border); margin: -8px 0 var(--sp-5); overflow-x: auto; scrollbar-width: none; }
.top-tabs::-webkit-scrollbar { display: none; }
.top-tabs a { padding: 10px 14px; font-weight: 500; color: var(--color-text-secondary); border-bottom: 2px solid transparent; white-space: nowrap; margin-bottom: -1px; }
.top-tabs a:hover { color: var(--color-text); }
.top-tabs a.is-active { color: var(--color-primary-text); border-bottom-color: var(--color-primary); font-weight: 600; }

/* Layout grids */
.grid { display: grid; gap: var(--gap); }
.kpi-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--gap); margin-bottom: var(--gap); }
.kpi-grid.cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.kpi-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpi-grid.cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.layout-split { display: grid; grid-template-columns: minmax(0, 1fr) var(--panel-w); gap: var(--gap); align-items: start; }
@media (min-width: 1700px) { :root { --panel-w: 440px; } }
.layout-split.panel-wide { grid-template-columns: minmax(0, 1fr) 470px; }
.data-table td.trunc { max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
.layout-split.panel-narrow { grid-template-columns: minmax(0, 1fr) 360px; }
.layout-split > .panel-col { position: sticky; top: calc(var(--topbar-h) + 12px); }
.layout-split.panel-closed, .layout-split.panel-closed.panel-wide, .layout-split.panel-closed.panel-narrow { grid-template-columns: minmax(0, 1fr); }
.layout-split > .panel-col.panel-inline-hidden { display: none; }
.stack { display: flex; flex-direction: column; gap: var(--gap); min-width: 0; }

/* ---------- 4. Cards & KPI ------------------------------------------- */
.card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); box-shadow: var(--shadow-xs); min-width: 0; }
.card-body { padding: var(--sp-5); }
.card-body.compact { padding: var(--sp-4); }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px var(--sp-5) 0; }
.card-head + .card-body { padding-top: 14px; }
.card-head.bordered { padding-bottom: 14px; border-bottom: 1px solid var(--color-divider); }
.card-head.bordered + .card-body, .card-head.bordered + .table-wrap { padding-top: 0; }
.card-title { font-size: var(--fs-h3); font-weight: 600; letter-spacing: -.01em; display: flex; align-items: center; gap: 8px; }
.card-title .muted { font-weight: 500; color: var(--color-text-muted); font-size: 13px; }
.card-sub { font-size: 13px; color: var(--color-text-muted); margin-top: 2px; }
.card-link { font-size: 13px; font-weight: 500; color: var(--color-primary-text); display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.card-link:hover { text-decoration: underline; }
.card-foot { padding: 12px var(--sp-5) 16px; border-top: 1px solid var(--color-divider); display: flex; justify-content: center; }
.card.tinted-blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
.card.tinted-green { background: #F0FDF4; border-color: #BBF7D0; }
.card.tinted-red { background: #FEF2F2; border-color: #FECACA; }
/* the same tints on a status chip (Attention Center) — these used to be inline styles, which no theme
   or stylesheet rule could override */
.chip-stat.tinted-green { background: #F0FDF4; border-color: #BBF7D0; }
.chip-stat.tinted-red { background: #FEF2F2; border-color: #FECACA; }
.chip-stat.tinted-amber { background: #FFFBEB; border-color: #FDE68A; }
.chip-stat.tinted-blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
.card.tinted-amber { background: #FFFBEB; border-color: #FDE68A; }
.card-select { font-size: 13px; height: 32px; padding: 0 28px 0 10px; width: auto; flex: none; }
.card-head .form-select { width: auto; flex: none; }

.kpi { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 16px 18px; display: flex; gap: 12px; align-items: flex-start; min-width: 0; position: relative; box-shadow: var(--shadow-xs); }
.kpi-icon { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.kpi-icon.square { border-radius: var(--r-lg); }
.kpi-icon-right { flex-direction: row-reverse; justify-content: space-between; }
.kpi-body { min-width: 0; flex: 1; position: relative; z-index: 1; }
.kpi-label { font-size: 12.5px; font-weight: 500; color: var(--color-text-secondary); line-height: 1.3; white-space: nowrap; letter-spacing: -.005em; }
.kpi.value-first .kpi-body { display: flex; flex-direction: column-reverse; justify-content: center; }
.kpi.value-first .kpi-value { margin-top: 0; }
.kpi.value-first .kpi-label { margin-top: 2px; }
.kpi.value-first .kpi-delta, .kpi.value-first .kpi-sub { order: -1; margin-top: 4px; }
.kpi-value { font-size: var(--fs-kpi); font-weight: 700; letter-spacing: -.02em; line-height: 1.15; margin-top: 4px; color: var(--color-text); }
.kpi-delta { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 12px; white-space: nowrap; }
.kpi-sub { font-size: 12px; color: var(--color-text-muted); margin-top: 6px; }
.kpi-delta .kpi-sub { margin-top: 0; }
.kpi-compact { padding: 14px 16px; gap: 12px; }
.kpi-compact .kpi-value { font-size: 20px; }
.kpi-compact .kpi-icon { width: 36px; height: 36px; }
.kpi-spark { position: absolute; right: 12px; bottom: 10px; width: 72px; height: 40px; opacity: .35; z-index: 0; }
.kpi.kpi-tinted { border-color: transparent; }
.kpi.kpi-tinted.tone-green { background: linear-gradient(180deg, #F0FDF4, #fff); border-color: #DCFCE7; }
.kpi.kpi-tinted.tone-blue { background: linear-gradient(180deg, #EFF6FF, #fff); border-color: #DBEAFE; }
.kpi.kpi-tinted.tone-purple { background: linear-gradient(180deg, #F5F3FF, #fff); border-color: #EDE9FE; }
.kpi.kpi-tinted.tone-amber { background: linear-gradient(180deg, #FFFBEB, #fff); border-color: #FEF3C7; }
.kpi.kpi-tinted.tone-red { background: linear-gradient(180deg, #FEF2F2, #fff); border-color: #FEE2E2; }
/* tone helpers (icon tiles, dots) */
.tone-blue { background: var(--color-primary-soft-2); color: var(--color-primary); } .tone-green { background: var(--color-success-soft); color: var(--color-success); } .tone-amber { background: var(--color-warning-soft); color: var(--color-warning-text); } .tone-red { background: var(--color-danger-soft); color: var(--color-danger); } .tone-purple { background: var(--color-purple-soft); color: var(--color-purple); } .tone-info, .tone-sky { background: var(--color-info-soft); color: var(--color-info); } .tone-orange { background: var(--color-orange-soft); color: var(--color-orange); } .tone-pink { background: var(--color-pink-soft); color: var(--color-pink); } .tone-teal { background: var(--color-teal-soft); color: var(--color-teal-text); } .tone-grey, .tone-slate { background: var(--color-surface-muted); color: var(--color-text-secondary); } .tone-navy { background: var(--color-navy); color: #fff; }
.icon-tile { width: 32px; height: 32px; border-radius: var(--r-md); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.icon-tile-lg { width: 40px; height: 40px; border-radius: var(--r-lg); } .icon-tile-xl { width: 48px; height: 48px; border-radius: var(--r-xl); } .icon-tile-round { border-radius: 50%; }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--color-text-faint); flex: none; }
.dot-green { background: var(--color-success); } .dot-red { background: var(--color-danger); } .dot-amber { background: var(--color-warning); } .dot-blue { background: var(--color-primary); } .dot-purple { background: var(--color-purple); } .dot-grey { background: var(--color-border-strong); } .dot-teal { background: var(--color-teal); } .dot-orange { background: var(--color-orange); } .dot-pink { background: var(--color-pink); } .dot-sky { background: var(--color-info); }

/* ---------- 5. Buttons ----------------------------------------------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: var(--r-md); font-weight: 600; font-size: 14px; border: 1px solid transparent; white-space: nowrap; transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast), box-shadow var(--t-fast); cursor: pointer; text-decoration: none; }
.btn .icon { width: 16px; height: 16px; }
.btn:disabled, .btn.is-disabled { opacity: .55; cursor: not-allowed; pointer-events: none; }
.btn-primary { background: var(--color-primary); color: #fff; }
.btn-primary:hover { background: var(--color-primary-hover); } .btn-primary:active { background: var(--color-primary-active); }
.btn-dark, .btn-navy { background: var(--color-navy); color: #fff; }
.btn-dark:hover, .btn-navy:hover { background: var(--color-navy-hover); }
.btn-secondary { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
.btn-secondary:hover { background: var(--color-surface-hover); border-color: var(--color-border-strong); }
.btn-success { background: #0E7A37; color: #fff; } .btn-success:hover { background: var(--color-success-hover); }
.btn-danger { background: var(--color-danger); color: #fff; } .btn-danger:hover { background: var(--color-danger-hover); }
.btn-danger-outline { background: var(--color-surface); color: var(--color-danger-text); border-color: #FECACA; } .btn-danger-outline:hover { background: var(--color-danger-soft); }
.btn-ghost { background: transparent; color: var(--color-primary-text); } .btn-ghost:hover { background: var(--color-primary-soft); }
.btn-soft { background: var(--color-primary-soft); color: var(--color-primary-text); } .btn-soft:hover { background: var(--color-primary-soft-2); }
.btn-purple { background: var(--color-purple); color: #fff; } .btn-purple:hover { background: var(--color-purple-text); }
.btn-warning { background: var(--color-warning); color: #fff; } .btn-warning:hover { background: #D97706; }
.btn-auth { background: var(--color-auth-primary); color: #fff; } .btn-auth:hover { background: var(--color-auth-primary-hover); }
.btn-link { background: none; color: var(--color-primary-text); padding: 0; height: auto; font-weight: 500; } .btn-link:hover { text-decoration: underline; }
.btn-sm { height: 32px; padding: 0 10px; font-size: 13px; border-radius: var(--r-md); } .btn-sm .icon { width: 14px; height: 14px; }
.btn-xs { height: 28px; padding: 0 8px; font-size: 12px; }
.btn-lg { height: 44px; padding: 0 18px; font-size: 15px; }
.btn-block { width: 100%; }
.btn-icon { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: var(--r-md); color: var(--color-text-secondary); border: 1px solid transparent; transition: background var(--t-fast), color var(--t-fast); flex: none; }
.btn-icon:hover { background: var(--color-surface-muted); color: var(--color-text); }
.btn-icon.bordered { border-color: var(--color-border); background: var(--color-surface); width: 38px; height: 38px; }
.btn-icon.bordered:hover { border-color: var(--color-border-strong); }
.btn-icon.is-active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.btn-icon.btn-icon-sm { width: 28px; height: 28px; }
.btn-group { display: inline-flex; border: 1px solid var(--color-border); border-radius: var(--r-md); overflow: hidden; background: var(--color-surface); }
.btn-group .btn-icon { border-radius: 0; width: 36px; height: 36px; border: 0; }
.btn-group .btn-icon + .btn-icon { border-left: 1px solid var(--color-border); }
.btn-group .btn-icon.is-active { background: var(--color-primary-soft-2); color: var(--color-primary); }
.btn-spinner { width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }
.btn-secondary .btn-spinner { border-color: var(--color-border); border-top-color: var(--color-text-secondary); }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- 6. Forms ------------------------------------------------- */
.form-group { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.form-row { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-row.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-label { font-size: 13px; font-weight: 600; color: var(--color-text); }
.form-label .req { color: var(--color-danger); margin-left: 2px; }
.form-hint { font-size: 12px; color: var(--color-text-muted); }
.form-control, .form-select, .form-textarea { width: 100%; height: 40px; padding: 0 12px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-md); font-size: 14px; color: var(--color-text); transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.form-textarea { height: auto; min-height: 96px; padding: 10px 12px; resize: vertical; line-height: 1.5; }
.form-control::placeholder, .form-textarea::placeholder { color: var(--color-text-faint); }
.form-control:hover, .form-select:hover, .form-textarea:hover { border-color: var(--color-border-strong); }
.form-control:focus, .form-select:focus, .form-textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(37,99,235,.15); }
.form-control:disabled, .form-select:disabled { background: var(--color-surface-muted); color: var(--color-text-muted); cursor: not-allowed; }
.form-control.is-invalid, .form-select.is-invalid { border-color: var(--color-danger); box-shadow: 0 0 0 3px rgba(239,68,68,.12); }
.form-control.is-valid { border-color: var(--color-success); }
.form-error { font-size: 12px; color: var(--color-danger-text); display: flex; align-items: center; gap: 4px; }
.form-success { font-size: 12px; color: var(--color-success-text); }
.form-select { appearance: none; -webkit-appearance: none; padding-right: 32px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; cursor: pointer; }
.form-select-sm, .form-control-sm { height: 34px; font-size: 13px; padding: 0 10px; }
.form-select-sm { padding-right: 28px; background-position: right 8px center; }
.input-group { position: relative; display: flex; align-items: center; }
.input-group > .icon { position: absolute; left: 12px; color: var(--color-text-muted); pointer-events: none; }
.input-group .form-control { padding-left: 38px; }
.input-group .input-addon { position: absolute; right: 8px; display: flex; gap: 2px; }
.input-group .input-prefix { position: absolute; left: 12px; color: var(--color-text-muted); font-weight: 500; }
.input-group.has-prefix .form-control { padding-left: 28px; }
.input-group.has-addon .form-control { padding-right: 44px; }
.check, .radio { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: 14px; user-select: none; }
.check input, .radio input { position: absolute; opacity: 0; width: 0; height: 0; }
.check-box { width: 18px; height: 18px; border: 1.5px solid var(--color-border-strong); border-radius: var(--r-xs); background: var(--color-surface); display: inline-flex; align-items: center; justify-content: center; transition: all var(--t-fast); flex: none; }
.check-box .icon { width: 12px; height: 12px; color: #fff; opacity: 0; stroke-width: 3; }
.check input:checked + .check-box { background: var(--color-primary); border-color: var(--color-primary); }
.check input:checked + .check-box .icon { opacity: 1; }
.check input:focus-visible + .check-box { box-shadow: var(--focus-ring); }
.check input:indeterminate + .check-box { background: var(--color-primary); border-color: var(--color-primary); }
.check input:indeterminate + .check-box::after { content: ""; width: 10px; height: 2px; background: #fff; border-radius: 1px; }
.check-text { display: flex; flex-direction: column; line-height: 1.35; }
.check-text small { color: var(--color-text-muted); font-size: 12px; }
.radio-dot { width: 18px; height: 18px; border: 1.5px solid var(--color-border-strong); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--color-surface); flex: none; }
.radio input:checked + .radio-dot { border-color: var(--color-primary); border-width: 5px; }
.toggle { position: relative; display: inline-flex; align-items: center; width: 40px; height: 22px; flex: none; cursor: pointer; }
.toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.toggle-track { position: absolute; inset: 0; background: var(--color-border-strong); border-radius: var(--r-full); transition: background var(--t-fast); }
.toggle-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); transition: transform var(--t-fast); }
.toggle input:checked + .toggle-track { background: var(--color-success); }
.toggle input:checked + .toggle-track::after { transform: translateX(18px); }
.toggle input:focus-visible + .toggle-track { box-shadow: var(--focus-ring); }
.toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 16px; border: 1px solid var(--color-border); border-radius: var(--r-lg); background: var(--color-surface); }
.toggle-row + .toggle-row { margin-top: 10px; }
.toggle-row-text { display: flex; flex-direction: column; gap: 2px; }
.toggle-row-text strong { font-weight: 600; font-size: 14px; }
.toggle-row-text span { font-size: 12px; color: var(--color-text-muted); }
.tag-input { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-height: 40px; padding: 5px 8px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-surface); }
.tag-input input { border: 0; outline: none; flex: 1; min-width: 100px; height: 28px; padding: 0 4px; font-size: 14px; }
.tag-input input:focus { box-shadow: none; }
.otp-group { display: flex; gap: 10px; justify-content: center; }
.otp-input { width: 44px; height: 52px; text-align: center; font-size: 22px; font-weight: 600; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-surface); }
.otp-input:focus { border-color: var(--color-auth-primary); box-shadow: 0 0 0 3px rgba(5,150,105,.15); outline: none; }
.dropzone { border: 1.5px dashed var(--color-border-strong); border-radius: var(--r-xl); padding: 28px 20px; text-align: center; background: var(--color-surface); transition: border-color var(--t-fast), background var(--t-fast); cursor: pointer; }
.dropzone:hover, .dropzone.is-dragover { border-color: var(--color-primary); background: var(--color-primary-soft); }
.dropzone > .icon { color: var(--color-primary); margin: 0 auto 12px; width: 40px; height: 40px; display: block; }
.dropzone strong { display: block; font-weight: 600; margin-bottom: 4px; }
.dropzone span { display: block; font-size: 12px; color: var(--color-text-muted); }
.dropzone .btn { margin-top: 12px; }
.file-chip { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--r-lg); background: var(--color-surface); }
.file-chip-meta { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.file-chip-meta strong { font-weight: 600; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-chip-meta span { font-size: 12px; color: var(--color-text-muted); }
.strength { display: flex; gap: 4px; margin-top: 6px; align-items: center; }
.strength i { flex: 1; height: 4px; border-radius: 2px; background: var(--color-border); }
.strength[data-level="1"] i:nth-child(1) { background: var(--color-danger); } .strength[data-level="2"] i:nth-child(-n+2) { background: var(--color-warning); } .strength[data-level="3"] i:nth-child(-n+3) { background: var(--color-success); } .strength[data-level="4"] i:nth-child(-n+4) { background: var(--color-success); }
.strength span { font-size: 12px; font-weight: 600; margin-left: 6px; }
.field-inline { display: flex; align-items: center; gap: 10px; }

/* ---------- 7. Badges, tags, avatars, brand tiles -------------------- */
.badge { display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 8px; border-radius: var(--r-sm); font-size: 12px; font-weight: 600; line-height: 1; white-space: nowrap; background: var(--color-surface-muted); color: var(--color-text-secondary); }
.badge .icon { width: 12px; height: 12px; }
.badge-green { background: var(--color-success-soft); color: var(--color-success-text); } .badge-red { background: var(--color-danger-soft); color: var(--color-danger-text); } .badge-amber { background: var(--color-warning-soft); color: var(--color-warning-text); } .badge-blue { background: var(--color-primary-soft-2); color: var(--color-primary-text); } .badge-purple { background: var(--color-purple-soft); color: var(--color-purple-text); } .badge-grey { background: var(--color-surface-muted); color: var(--color-text-secondary); } .badge-orange { background: var(--color-orange-soft); color: var(--color-orange-text); } .badge-pink { background: var(--color-pink-soft); color: var(--color-pink-text); } .badge-teal { background: var(--color-teal-soft); color: var(--color-teal-text); } .badge-slate { background: var(--color-slate-soft); color: var(--color-slate-text); } .badge-sky, .badge-info { background: var(--color-info-soft); color: var(--color-info-text); } .badge-navy { background: var(--color-navy); color: #fff; }
.badge-lg { height: 26px; padding: 0 10px; font-size: 13px; border-radius: var(--r-md); }
.badge-pill { border-radius: var(--r-full); }
.badge-dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.badge-deal { font-weight: 600; }
.count-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--r-full); background: var(--color-surface-muted); color: var(--color-text-secondary); font-size: 11px; font-weight: 700; }
.tag { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 8px; border-radius: var(--r-sm); font-size: 12px; font-weight: 500; background: var(--color-surface-muted); color: var(--color-text-secondary); white-space: nowrap; }
.tag-blue { background: var(--color-primary-soft-2); color: var(--color-primary-text); } .tag-green { background: var(--color-success-soft); color: var(--color-success-text); } .tag-red { background: var(--color-danger-soft); color: var(--color-danger-text); } .tag-amber { background: var(--color-warning-soft); color: var(--color-warning-text); } .tag-purple { background: var(--color-purple-soft); color: var(--color-purple-text); } .tag-teal { background: var(--color-teal-soft); color: var(--color-teal-text); } .tag-grey { background: var(--color-surface-muted); color: var(--color-text-secondary); }
.tag-remove { display: inline-flex; color: inherit; opacity: .7; margin-left: 2px; } .tag-remove:hover { opacity: 1; }
.tag-add { width: 24px; height: 24px; border: 1px dashed var(--color-border-strong); border-radius: var(--r-sm); display: inline-flex; align-items: center; justify-content: center; color: var(--color-text-muted); }
.tag-add:hover { border-color: var(--color-primary); color: var(--color-primary); }
.tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.trend { display: inline-flex; align-items: center; gap: 2px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.trend .icon { width: 12px; height: 12px; stroke-width: 2.5; }
.trend-up { color: var(--color-success-text); } .trend-down { color: var(--color-danger-text); } .trend-flat { color: var(--color-text-muted); }
.trend-suffix { color: var(--color-text-muted); font-weight: 400; }
.avatar { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #E0E7FF; color: #3730A3; font-weight: 600; flex: none; overflow: hidden; text-transform: uppercase; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }
.avatar-20 { width: 20px; height: 20px; font-size: 9px; } .avatar-24 { width: 24px; height: 24px; font-size: 10px; } .avatar-28 { width: 28px; height: 28px; font-size: 11px; } .avatar-32 { width: 32px; height: 32px; font-size: 12px; } .avatar-36 { width: 36px; height: 36px; font-size: 13px; } .avatar-40 { width: 40px; height: 40px; font-size: 14px; } .avatar-48 { width: 48px; height: 48px; font-size: 16px; } .avatar-56 { width: 56px; height: 56px; font-size: 20px; } .avatar-80 { width: 80px; height: 80px; font-size: 26px; }
.avatar-96 { width: 96px; height: 96px; font-size: 32px; }
.avatar-64 { width: 64px; height: 64px; font-size: 22px; }
.avatar-22 { width: 22px; height: 22px; font-size: 9px; } .avatar-26 { width: 26px; height: 26px; font-size: 10px; } .avatar-30 { width: 30px; height: 30px; font-size: 11px; }
.avatar-34 { width: 34px; height: 34px; font-size: 12px; } .avatar-38 { width: 38px; height: 38px; font-size: 13px; } .avatar-44 { width: 44px; height: 44px; font-size: 15px; }
.avatar-46 { width: 46px; height: 46px; font-size: 16px; } .avatar-52 { width: 52px; height: 52px; font-size: 18px; } .avatar-104 { width: 104px; height: 104px; font-size: 34px; }
/* a drawn portrait brings its own tinted disc — the tone background must not ring it */
.avatar.has-photo { background: transparent; }
.sidebar .avatar.has-photo, .topbar .avatar.has-photo { background: transparent; }
.avatar-blue { background: #DBEAFE; color: #1D4ED8; } .avatar-green { background: #DCFCE7; color: #15803D; } .avatar-purple { background: #EDE9FE; color: #6D28D9; } .avatar-amber { background: #FEF3C7; color: #B45309; } .avatar-pink { background: #FCE7F3; color: #BE185D; } .avatar-teal { background: #CCFBF1; color: #0F766E; } .avatar-navy { background: var(--color-navy); color: #fff; } .avatar-slate { background: #E2E8F0; color: #334155; }
/* tones the Knowledge & Files people use, so the same person looks the same in Team and Tasks */
.avatar-violet { background: #F3E8FF; color: #7A2086; } .avatar-steel { background: #E9E3FD; color: #5A34C8; }
.sidebar .avatar, .topbar .avatar { background: #334155; color: #fff; } .topbar .avatar { background: #64748B; }
.avatar-stack { display: inline-flex; align-items: center; }
.avatar-stack > * { margin-left: -8px; border: 2px solid var(--color-surface); box-sizing: content-box; }
.avatar-stack > *:first-child { margin-left: 0; }
.avatar-stack .stack-more { display: inline-flex; align-items: center; justify-content: center; height: 24px; padding: 0 6px; border-radius: var(--r-full); background: var(--color-primary-soft-2); color: var(--color-primary-text); font-size: 11px; font-weight: 700; margin-left: 4px; border: 0; }
.brand { width: var(--brand-size, 32px); height: var(--brand-size, 32px); font-size: calc(var(--brand-size, 32px) * .34); display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--brand-bg, #0F172A); color: var(--brand-fg, #fff); font-weight: 800; letter-spacing: -.03em; flex: none; overflow: hidden; font-style: italic; }
.brand img { width: 100%; height: 100%; object-fit: cover; }
.brand.has-logo img { object-fit: contain; padding: 7%; box-sizing: border-box; }
.brand.has-logo.brand-20 img, .brand.has-logo.brand-24 img { padding: 8%; }
.brand-20 { width: 20px; height: 20px; font-size: 8px; } .brand-24 { width: 24px; height: 24px; font-size: 9px; } .brand-26 { width: 26px; height: 26px; font-size: 10px; } .brand-28 { width: 28px; height: 28px; font-size: 10px; } .brand-32 { width: 32px; height: 32px; font-size: 11px; } .brand-36 { width: 36px; height: 36px; font-size: 12px; } .brand-40 { width: 40px; height: 40px; font-size: 14px; } .brand-44 { width: 44px; height: 44px; font-size: 15px; } .brand-46 { width: 46px; height: 46px; font-size: 15px; } .brand-48 { width: 48px; height: 48px; font-size: 16px; } .brand-56 { width: 56px; height: 56px; font-size: 18px; } .brand-64 { width: 64px; height: 64px; font-size: 19px; } .brand-80 { width: 80px; height: 80px; font-size: 24px; } .brand-96 { width: 96px; height: 96px; font-size: 28px; }
/* Partner logos are round everywhere (user decision, 2026-09-18): the brand's own colour fills the
   circle and the wordmark sits inside it, which is how the partners publish their own avatars. */
.brand, .brand-20, .brand-24, .brand-26, .brand-28, .brand-32, .brand-34, .brand-36, .brand-40,
.brand-44, .brand-46, .brand-48, .brand-56, .brand-64, .brand-72, .brand-80, .brand-96 { border-radius: 50%; }
.brand.has-logo img { padding: 9%; object-fit: contain; }
.brand.has-logo.brand-20 img, .brand.has-logo.brand-24 img, .brand.has-logo.brand-26 img { padding: 10%; }
.brand.has-logo.brand-48 img, .brand.has-logo.brand-56 img, .brand.has-logo.brand-64 img,
.brand.has-logo.brand-72 img, .brand.has-logo.brand-96 img { padding: 12%; }
/* the square wrapper the dashboard rows used around a logo is now a circle of the same height */
.row-logo { width: 28px; height: 28px; border-radius: 50%; }
   circle and the wordmark sits inside it, which is how the partners publish their own avatars. */
.brand, .brand-20, .brand-24, .brand-26, .brand-28, .brand-32, .brand-34, .brand-36, .brand-40,
.brand-44, .brand-48, .brand-56, .brand-64, .brand-72, .brand-96 { border-radius: 50%; }
.brand.has-logo img { padding: 9%; object-fit: contain; }
.brand.has-logo.brand-20 img, .brand.has-logo.brand-24 img, .brand.has-logo.brand-26 img { padding: 10%; }
.brand.has-logo.brand-48 img, .brand.has-logo.brand-56 img, .brand.has-logo.brand-64 img,
.brand.has-logo.brand-72 img, .brand.has-logo.brand-96 img { padding: 12%; }
/* the square wrapper the dashboard rows used around a logo is now a circle of the same height */
.row-logo { width: 28px; height: 28px; border-radius: 50%; }
.site-icon { display: inline-flex; align-items: center; justify-content: center; border-radius: var(--r-md); background: var(--brand-bg, #1E293B); color: var(--brand-fg, #fff); font-weight: 700; flex: none; overflow: hidden; border: 1px solid rgba(15,23,42,.06); }
.site-icon img { width: 100%; height: 100%; object-fit: cover; }
.site-icon-24 { width: 24px; height: 24px; font-size: 11px; border-radius: var(--r-sm); } .site-icon-28 { width: 28px; height: 28px; font-size: 12px; } .site-icon-32 { width: 32px; height: 32px; font-size: 13px; } .site-icon-40 { width: 40px; height: 40px; font-size: 16px; border-radius: var(--r-lg); } .site-icon-48 { width: 48px; height: 48px; font-size: 18px; border-radius: var(--r-lg); } .site-icon-56 { width: 56px; height: 56px; font-size: 22px; border-radius: var(--r-xl); }
.flag-cell { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-weight: 500; }
.flag { width: 21px; height: 14px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,23,42,.08); flex: none; }
.flag-fallback { display: inline-flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 700; background: var(--color-surface-muted); color: var(--color-text-secondary); width: 20px; height: 15px; }
.health-score { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; height: 24px; padding: 0 8px; border-radius: var(--r-sm); font-weight: 700; font-size: 12px; }
.health-good { background: var(--color-success-soft); color: var(--color-success-text); } .health-warn { background: var(--color-warning-soft); color: var(--color-warning-text); } .health-bad { background: var(--color-danger-soft); color: var(--color-danger-text); }
.method { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; white-space: nowrap; }
.method-icon { width: 20px; height: 20px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.entity { display: flex; align-items: center; gap: 10px; min-width: 0; }
.entity-title .badge { margin-left: 4px; vertical-align: 1px; }
.entity-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.entity-title { font-weight: 600; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.entity-title a { color: inherit; } .entity-title a:hover { color: var(--color-primary-text); }
.entity-sub { font-size: 12px; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.link-url { display: inline-flex; align-items: center; gap: 6px; color: var(--color-primary-text); font-size: 13px; max-width: 100%; }
.link-url span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 150px; }
.link-url .btn-icon { width: 22px; height: 22px; color: var(--color-text-muted); }
.pill-count { display: inline-flex; align-items: center; height: 24px; padding: 0 8px; border-radius: var(--r-sm); background: var(--color-primary-soft); color: var(--color-primary-text); font-size: 12px; font-weight: 500; white-space: nowrap; }
.pill-count.grey { background: var(--color-surface-muted); color: var(--color-text-secondary); }

/* ---------- 8. Tables ------------------------------------------------ */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.data-table { width: 100%; font-size: 12.5px; }
.data-table .col-sel { width: 44px; padding-right: 0 !important; }
.data-table .col-sel .check { display: none; }
.data-table .col-sel .idx { display: inline-block; min-width: 18px; color: var(--color-text-muted); font-size: 12px; }
.data-table tbody tr:hover .col-sel .check, .data-table tbody tr.is-selected .col-sel .check, .data-table.has-selection .col-sel .check { display: inline-flex; }
.data-table tbody tr:hover .col-sel .idx, .data-table tbody tr.is-selected .col-sel .idx, .data-table.has-selection .col-sel .idx { display: none; }
.data-table thead .col-sel .check { display: inline-flex; }
.data-table thead th { height: var(--th-h); padding: 0 8px; text-align: left; font-size: 12px; font-weight: 600; color: var(--color-text-muted); background: var(--color-bg); border-bottom: 1px solid var(--color-border); white-space: nowrap; position: sticky; top: 0; z-index: 1; }
.data-table thead th:first-child { padding-left: 16px; border-top-left-radius: var(--r-md); } .data-table thead th:last-child { padding-right: 16px; }
.data-table tbody td { height: var(--row-h); padding: 6px 8px; border-bottom: 1px solid var(--color-divider); vertical-align: middle; color: var(--color-text); white-space: nowrap; }
.data-table tbody td.wrap { white-space: normal; }
.data-table thead th .th-sub { display: block; font-size: 11px; font-weight: 500; color: var(--color-text-faint); line-height: 1.1; }
.data-table thead th { line-height: 1.2; }
.data-table tbody td:first-child { padding-left: 16px; } .data-table tbody td:last-child { padding-right: 16px; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr { transition: background var(--t-fast); }
.data-table tbody tr:hover { background: var(--color-surface-hover); }
.data-table tbody tr.is-selected, .data-table tbody tr.is-active { background: var(--color-primary-soft); }
.data-table tbody tr.is-clickable { cursor: pointer; }
.data-table .num, .data-table .text-right { text-align: right; }
.data-table .col-idx { color: var(--color-text-muted); width: 32px; font-size: 12px; }
.data-table .col-check { width: 40px; padding-right: 0; }
.data-table .col-actions { width: 48px; text-align: right; }
.data-table .col-actions .dropdown { display: inline-flex; }
.data-table tfoot td { height: 44px; padding: 8px 12px; font-weight: 700; background: var(--color-bg); border-top: 1px solid var(--color-border); }
.data-table tfoot td:first-child { padding-left: 20px; }
.data-table.dense tbody td { height: 38px; font-size: 13px; }
.data-table.mini thead th { height: 32px; font-size: 11px; background: transparent; position: static; padding: 0 8px; }
.data-table.mini tbody td { height: 36px; padding: 4px 8px; }
.data-table.mini thead th:first-child, .data-table.mini tbody td:first-child { padding-left: 0; } .data-table.mini thead th:last-child, .data-table.mini tbody td:last-child { padding-right: 0; }
.th-sort { display: inline-flex; align-items: center; gap: 4px; color: inherit; }
.th-sort:hover { color: var(--color-text); }
.th-sort-icon { opacity: .5; } .is-sorted .th-sort { color: var(--color-text); } .is-sorted .th-sort-icon { opacity: 1; }
.cell-2 { display: flex; flex-direction: column; line-height: 1.3; }
.cell-2 strong { font-weight: 600; } .cell-2 span { font-size: 12px; color: var(--color-text-muted); }
.cell-2 .text-red { color: var(--color-danger-text); }
.row-empty td { text-align: center; padding: 40px 20px; }
.table-card { display: flex; flex-direction: column; }
.table-toolbar { display: flex; align-items: center; gap: 10px; padding: 14px 20px; flex-wrap: wrap; border-bottom: 1px solid var(--color-divider); }
.table-toolbar .spacer { flex: 1; }
.filter-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.filter-bar .input-group { width: 240px; }
.filter-bar .form-select, .filter-select { height: 34px; width: auto; min-width: 0; font-size: 12.5px; padding-left: 10px; padding-right: 26px; background-position: right 7px center; }
.filter-bar .btn-icon.bordered { width: 36px; height: 36px; }
.seg-tabs { display: inline-flex; gap: 4px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-lg); padding: 4px; }
.seg-tabs.plain { background: transparent; border: 0; padding: 0; gap: 6px; }
.seg-tab { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: var(--r-md); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); white-space: nowrap; transition: background var(--t-fast), color var(--t-fast); }
.seg-tab:hover { background: var(--color-surface-muted); color: var(--color-text); }
.seg-tab.is-active { background: var(--color-primary); color: #fff; font-weight: 600; }
.seg-tabs.plain .seg-tab { background: var(--color-surface-muted); }
.seg-tabs.plain .seg-tab.is-active { background: var(--color-primary); }
.seg-count { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--r-full); font-size: 11px; font-weight: 700; background: var(--color-surface-muted); color: var(--color-text-secondary); }
.seg-tab.is-active .seg-count { background: rgba(255,255,255,.22); color: #fff; }
.seg-tabs-sm .seg-tab { height: 28px; padding: 0 10px; font-size: 12px; }
.seg-tabs.soft .seg-tab.is-active { background: var(--color-primary-soft-2); color: var(--color-primary-text); }
.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--color-border); overflow-x: auto; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tab { padding: 10px 12px; font-size: 13px; font-weight: 500; color: var(--color-text-secondary); border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.tab:hover { color: var(--color-text); }
.tab.is-active { color: var(--color-primary-text); border-bottom-color: var(--color-primary); font-weight: 600; }
.tab .count-badge { height: 18px; min-width: 18px; font-size: 10px; }
.tab-panel[hidden] { display: none; }
.pagination-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-top: 1px solid var(--color-divider); flex-wrap: wrap; font-size: 13px; color: var(--color-text-secondary); }
.pagination { display: inline-flex; align-items: center; gap: 4px; }
.page-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 8px; border-radius: var(--r-md); border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text); font-weight: 500; font-size: 13px; }
.page-btn:hover { border-color: var(--color-border-strong); background: var(--color-surface-hover); }
.page-btn.is-active { background: var(--color-navy); color: #fff; border-color: var(--color-navy); }
.page-btn.is-disabled { opacity: .45; pointer-events: none; }
.page-ellipsis { padding: 0 4px; color: var(--color-text-muted); }
.pagination-per { display: inline-flex; align-items: center; gap: 8px; }
.pagination-per .form-select { width: 72px; }
.bulk-bar { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); opacity: 0; pointer-events: none; z-index: var(--z-drawer); display: flex; align-items: center; gap: 4px; background: var(--color-navy); color: #fff; padding: 8px 8px 8px 16px; border-radius: var(--r-xl); box-shadow: var(--shadow-lg); transition: transform var(--t-base), opacity var(--t-base); }
.bulk-bar.is-visible { transform: translateX(-50%); opacity: 1; pointer-events: auto; }
.bulk-count { font-weight: 600; font-size: 14px; display: inline-flex; align-items: center; gap: 8px; margin-right: 8px; padding-right: 12px; border-right: 1px solid rgba(255,255,255,.15); }
.bulk-bar .btn { color: #fff; background: transparent; height: 34px; padding: 0 10px; font-weight: 500; }
.bulk-bar .btn:hover { background: rgba(255,255,255,.1); }
.bulk-bar .btn-icon { color: #fff; } .bulk-bar .btn-icon:hover { background: rgba(255,255,255,.1); color: #fff; }

/* ---------- 9. Panels, key/value, feeds ------------------------------ */
.panel { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); box-shadow: var(--shadow-xs); display: flex; flex-direction: column; min-width: 0; }
.panel-head { display: flex; align-items: flex-start; gap: 14px; padding: 20px 20px 0; }
.panel-head .panel-title { font-size: 18px; font-weight: 700; letter-spacing: -.01em; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; line-height: 1.25; }
.panel-head .panel-title .badge, .panel-head .panel-title .btn-icon { flex: none; }
.panel-head .panel-sub { font-size: 13px; color: var(--color-text-muted); margin-top: 2px; }
.panel-head-main { flex: 1; min-width: 0; }
.panel-head-actions { display: flex; align-items: center; gap: 6px; flex: none; }
.panel-tabs { padding: 14px 20px 0; }
.panel-body { padding: 16px 20px 20px; display: flex; flex-direction: column; gap: 16px; }
.panel-section-title { font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mini-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.mini-kpis > .mini-kpi { padding: 10px; }
.mini-kpis > .mini-kpi .l { font-size: 10.5px; }
.mini-kpis.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .mini-kpis.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mini-kpi { background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--r-lg); padding: 12px; min-width: 0; }
.mini-kpi .v { font-size: 17px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; white-space: nowrap; }
.mini-kpi .l { font-size: 11px; color: var(--color-text-muted); margin-top: 2px; line-height: 1.25; }
.mini-kpi .trend { margin-top: 4px; }
.mini-kpi.tinted-green { background: #F0FDF4; border-color: #DCFCE7; } .mini-kpi.tinted-blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); } .mini-kpi.tinted-amber { background: #FFFBEB; border-color: #FEF3C7; } .mini-kpi.tinted-red { background: #FEF2F2; border-color: #FEE2E2; } .mini-kpi.tinted-purple { background: #F5F3FF; border-color: #EDE9FE; }
.mini-kpi.with-icon { display: flex; align-items: center; gap: 8px; padding: 10px; }
.mini-kpi.with-icon > div { min-width: 0; }
.kv { display: flex; flex-direction: column; }
.kv-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 34px; padding: 6px 0; border-bottom: 1px solid var(--color-divider); font-size: 13px; }
.kv-row:last-child { border-bottom: 0; }
.kv-label { color: var(--color-text-muted); flex: none; }
.kv-value { font-weight: 500; text-align: right; display: inline-flex; align-items: center; gap: 6px; min-width: 0; justify-content: flex-end; }
.kv.cols-2 { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; }
.kv.left .kv-value { text-align: left; justify-content: flex-start; }
.kv.left .kv-row { justify-content: flex-start; gap: 16px; } .kv.left .kv-label { width: 120px; }
.feed { display: flex; flex-direction: column; }
.feed-item { display: flex; align-items: flex-start; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--color-divider); }
.feed-item:last-child { border-bottom: 0; }
.feed-item .icon-tile { width: 32px; height: 32px; }
.feed-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.35; }
.feed-text strong { font-weight: 500; font-size: 13px; color: var(--color-text); }
.feed-text span { font-size: 12px; color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.feed-time { font-size: 12px; color: var(--color-text-faint); white-space: nowrap; }
.feed.compact .feed-item { padding: 7px 0; } .feed.compact .icon-tile { width: 24px; height: 24px; border-radius: var(--r-sm); } .feed.compact .icon-tile .icon { width: 13px; height: 13px; }
.timeline { display: flex; flex-direction: column; position: relative; padding-left: 4px; }
.timeline-item { display: flex; gap: 12px; position: relative; padding-bottom: 16px; }
.timeline-item::before { content: ""; position: absolute; left: 7px; top: 18px; bottom: -2px; width: 2px; background: var(--color-border); }
.timeline-item:last-child::before { display: none; }
.timeline-dot { width: 16px; height: 16px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; margin-top: 2px; background: var(--color-border-strong); color: #fff; }
.timeline-dot .icon { width: 10px; height: 10px; stroke-width: 3; }
.timeline-dot.blue { background: var(--color-primary); } .timeline-dot.green { background: var(--color-success); } .timeline-dot.amber { background: var(--color-warning); } .timeline-dot.red { background: var(--color-danger); } .timeline-dot.grey { background: var(--color-text-faint); }
.timeline-text { display: flex; flex-direction: column; line-height: 1.35; }
.timeline-text strong { font-weight: 500; font-size: 13px; } .timeline-text span { font-size: 12px; color: var(--color-text-muted); }
.bar-list { display: flex; flex-direction: column; gap: 10px; }
.bar-row { display: grid; grid-template-columns: minmax(90px, 1.1fr) 2fr auto auto; align-items: center; gap: 12px; font-size: 13px; }
.bar-row.with-idx { grid-template-columns: 18px minmax(90px, 1.1fr) 2fr auto auto; }
.bar-row .bar-idx { color: var(--color-text-muted); font-size: 12px; }
.bar-row .bar-label { display: flex; align-items: center; gap: 8px; font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-row .bar-value { font-weight: 600; text-align: right; white-space: nowrap; }
.bar-row .bar-pct { color: var(--color-text-muted); text-align: right; min-width: 44px; font-size: 12px; }
.bar-track { height: 8px; border-radius: var(--r-full); background: var(--color-surface-muted); overflow: hidden; }
.bar-fill { height: 100%; border-radius: var(--r-full); background: var(--color-primary); transition: width .6s ease; }
.bar-fill.green { background: var(--color-success); } .bar-fill.amber { background: var(--color-warning); } .bar-fill.red { background: var(--color-danger); } .bar-fill.purple { background: var(--color-purple); } .bar-fill.orange { background: var(--color-orange); } .bar-fill.teal { background: var(--color-teal); } .bar-fill.sky { background: var(--color-info); } .bar-fill.pink { background: var(--color-pink); } .bar-fill.grey { background: var(--color-border-strong); } .bar-fill.blue { background: var(--color-primary); } .bar-fill.navy { background: var(--color-navy); }
.bar-fill.gradient { background: linear-gradient(90deg, #6366F1, #A855F7); }
.progress { height: 8px; border-radius: var(--r-full); background: var(--color-surface-muted); overflow: hidden; flex: 1; }
.progress.lg { height: 12px; } .progress.sm { height: 6px; }
.progress-bar { height: 100%; border-radius: var(--r-full); background: var(--color-primary); transition: width .6s ease; }
.progress-bar.tone-green { background: var(--color-success); } .progress-bar.tone-amber { background: var(--color-warning); } .progress-bar.tone-red { background: var(--color-danger); } .progress-bar.tone-blue { background: var(--color-primary); } .progress-bar.tone-purple { background: var(--color-purple); }
.progress-row { display: flex; align-items: center; gap: 12px; }
.progress-row .pct { font-weight: 700; font-size: 14px; min-width: 40px; text-align: right; }
.stacked-bar { display: flex; height: 10px; border-radius: var(--r-full); overflow: hidden; background: var(--color-surface-muted); }
.stacked-bar > span { display: block; height: 100%; }
.legend { display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.legend-row { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 10px; }
.legend-row .legend-label { display: flex; align-items: center; gap: 8px; min-width: 60px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.legend-row .legend-label > :last-child { overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; }
.legend-row .legend-label .dot { flex: none; }
.legend-row .legend-pct { color: var(--color-text-secondary); font-weight: 500; min-width: 40px; text-align: right; }
.legend-row .legend-val { font-weight: 600; min-width: 60px; text-align: right; }
.legend.inline { flex-direction: row; flex-wrap: wrap; gap: 14px; }
.legend.inline .legend-row { grid-template-columns: auto auto; gap: 6px; }
.insight { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border-radius: var(--r-lg); background: var(--color-bg); border: 1px solid var(--color-divider); }
.insight + .insight { margin-top: 8px; }
.insight .icon-tile { width: 28px; height: 28px; border-radius: 50%; }
.insight-text { display: flex; flex-direction: column; line-height: 1.35; }
.insight-text strong { font-size: 13px; font-weight: 600; } .insight-text span { font-size: 12px; color: var(--color-text-muted); }
.health-list { display: flex; flex-direction: column; gap: 8px; }
.health-list .item { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; }
.health-list .item .icon { width: 16px; height: 16px; }
.quick-actions { display: flex; flex-direction: column; gap: 4px; }
.quick-action { display: flex; align-items: center; gap: 12px; padding: 8px 8px; border-radius: var(--r-lg); color: var(--color-text); }
.quick-action:hover { background: var(--color-surface-muted); }
.quick-action .icon-tile { width: 40px; height: 40px; border-radius: var(--r-lg); }
.quick-action-text { display: flex; flex-direction: column; line-height: 1.3; }
.quick-action-text strong { font-weight: 600; font-size: 14px; } .quick-action-text span { font-size: 12px; color: var(--color-text-muted); }
.action-list { display: flex; flex-direction: column; gap: 8px; }
.action-list .btn { justify-content: flex-start; height: 40px; }
.action-list .btn.centered { justify-content: center; }
.promo-dark { background: linear-gradient(135deg, #0F172A, #1E3A8A); color: #fff; border-radius: var(--r-2xl); padding: 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; position: relative; overflow: hidden; }
.promo-dark strong { display: block; font-size: 16px; font-weight: 700; line-height: 1.3; }
.promo-dark .promo-brand { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 13px; font-weight: 600; }
.promo-dark .promo-brand img { width: 20px; height: 20px; }
.chip-stat { display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); }
.chip-stat .icon-tile { width: 36px; height: 36px; border-radius: var(--r-lg); }
.chip-stat .v { font-size: 20px; font-weight: 700; line-height: 1.1; } .chip-stat .l { font-size: 12px; color: var(--color-text-muted); }
.alert { display: flex; align-items: flex-start; gap: 12px; padding: 12px 14px; border-radius: var(--r-lg); border: 1px solid; font-size: 13px; }
.alert .icon { flex: none; margin-top: 1px; }
.alert strong { font-weight: 600; }
.alert-success { background: #F0FDF4; border-color: #BBF7D0; color: var(--color-success-text); } .alert-info { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); color: var(--color-primary-text); } .alert-warning { background: #FFFBEB; border-color: #FDE68A; color: var(--color-warning-text); } .alert-danger { background: #FEF2F2; border-color: #FECACA; color: var(--color-danger-text); }
.alert .alert-body { flex: 1; color: var(--color-text); }
.alert .alert-body p { color: var(--color-text-secondary); margin-top: 2px; }
.alert-close { margin-left: auto; color: inherit; opacity: .7; }
.callout { display: flex; gap: 12px; padding: 14px 16px; border-radius: var(--r-xl); border: 1px solid; }
.callout-amber { background: #FFFBEB; border-color: #FDE68A; } .callout-red { background: #FEF2F2; border-color: #FECACA; } .callout-blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); } .callout-green { background: #F0FDF4; border-color: #BBF7D0; }
.callout .icon-tile { width: 40px; height: 40px; border-radius: 50%; }
.callout-text strong { display: block; font-weight: 600; font-size: 14px; } .callout-text span { font-size: 13px; color: var(--color-text-secondary); }
.danger-zone { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; background: #FEF2F2; border: 1px solid #FECACA; border-radius: var(--r-xl); }
.danger-zone .callout-text strong { color: var(--color-danger-text); }

/* ---------- 10. Dropdowns, modals, drawers, toasts ------------------- */
.dropdown { position: relative; display: inline-block; }
.dropdown-menu { position: absolute; top: calc(100% + 6px); right: 0; min-width: 200px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-lg); box-shadow: var(--shadow-lg); padding: 6px; z-index: var(--z-dropdown); display: none; }
.dropdown.is-open > .dropdown-menu { display: block; animation: pop .12s ease; }
.dropdown-menu.dropdown-left { right: auto; left: 0; }
.dropdown-menu.dropdown-up { top: auto; bottom: calc(100% + 6px); }
.dropdown-menu.dropdown-right { right: 0; }
/* a row/card menu lifted to <body> while open (RG.menu in app.js): above drawers, below toasts */
.rg-float { position: fixed; top: 0; left: 0; width: 0; height: 0; z-index: 65; display: block; }
.rg-float > .dropdown-menu { overflow-y: auto; overscroll-behavior: contain; }
.rg-float.is-up > .dropdown-menu { transform-origin: bottom right; }
.dropdown-item:focus-visible { outline: 2px solid var(--color-primary); outline-offset: -2px; background: var(--color-surface-muted); }
.dropdown-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border-radius: var(--r-md); font-size: 13px; font-weight: 500; color: var(--color-text); text-align: left; }
.dropdown-item .icon { color: var(--color-text-muted); width: 16px; height: 16px; }
.dropdown-item:hover { background: var(--color-surface-muted); }
.dropdown-item.is-danger { color: var(--color-danger-text); } .dropdown-item.is-danger .icon { color: var(--color-danger); } .dropdown-item.is-danger:hover { background: var(--color-danger-soft); }
.dropdown-divider { height: 1px; background: var(--color-divider); margin: 6px 0; }
.dropdown-header { padding: 8px 10px 10px; display: flex; flex-direction: column; border-bottom: 1px solid var(--color-divider); margin-bottom: 6px; }
.dropdown-header strong { font-weight: 600; font-size: 14px; } .dropdown-header span { font-size: 12px; color: var(--color-text-muted); }
.dropdown-menu form { margin: 0; }
@keyframes pop { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

.modal-root, .drawer-root { position: relative; z-index: var(--z-modal); }
.modal-backdrop { position: fixed; inset: 0; background: rgba(15,23,42,.55); backdrop-filter: blur(2px); display: flex; align-items: center; justify-content: center; padding: 20px; z-index: var(--z-modal); animation: fade .15s ease; overflow-y: auto; }
.modal { background: var(--color-surface); border-radius: var(--r-2xl); box-shadow: var(--shadow-xl); width: 100%; max-width: 560px; max-height: calc(100vh - 40px); display: flex; flex-direction: column; animation: rise .18s ease; position: relative; }
.modal-sm { max-width: 460px; } .modal-md { max-width: 640px; } .modal-lg { max-width: 880px; } .modal-xl { max-width: 1060px; }
.modal-head { display: flex; align-items: flex-start; gap: 14px; padding: 20px 24px 0; }
.modal-head h2 { font-size: var(--fs-h2); font-weight: 700; letter-spacing: -.01em; }
.modal-head p { font-size: 14px; color: var(--color-text-secondary); margin-top: 4px; }
.modal-head .modal-close { margin-left: auto; }
.modal-body { padding: 20px 24px; overflow-y: auto; display: flex; flex-direction: column; gap: 16px; }
.modal-foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 16px 24px 20px; border-top: 1px solid var(--color-divider); }
.modal-foot.split { justify-content: space-between; }
.modal-close { color: var(--color-text-muted); }
.confirm { text-align: center; padding: 28px 28px 24px; }
.confirm .confirm-icon { width: 56px; height: 56px; border-radius: 50%; margin: 0 auto 16px; display: inline-flex; align-items: center; justify-content: center; }
.confirm .confirm-icon .icon { width: 26px; height: 26px; }
.confirm h2 { font-size: 20px; font-weight: 700; }
.confirm p { color: var(--color-text-secondary); margin-top: 8px; font-size: 14px; }
.confirm .confirm-body { text-align: left; margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.confirm .confirm-actions { display: flex; gap: 10px; margin-top: 20px; }
.confirm .confirm-actions .btn { flex: 1; height: 42px; }
.impact-list { background: #FEF2F2; border: 1px solid #FECACA; border-radius: var(--r-lg); padding: 12px 14px; display: grid; gap: 6px; text-align: left; }
.impact-list.grid-2 { grid-template-columns: 1fr 1fr; }
.impact-list strong { grid-column: 1 / -1; font-size: 13px; font-weight: 600; color: var(--color-danger-text); }
.impact-list .impact-row { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--color-text); }
.impact-list .impact-row .icon { color: var(--color-danger); width: 14px; height: 14px; }
.impact-list.neutral { background: var(--color-bg); border-color: var(--color-border); } .impact-list.neutral .impact-row .icon { color: var(--color-text-muted); } .impact-list.neutral strong { color: var(--color-text); }
.summary-box { background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--r-lg); padding: 12px 14px; text-align: left; }
.summary-box .kv-row { min-height: 30px; padding: 4px 0; }
.record-pill { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--r-lg); background: var(--color-bg); text-align: left; }
.record-pill strong { font-weight: 600; font-size: 14px; } .record-pill span { font-size: 12px; color: var(--color-text-muted); display: block; }
.type-confirm .form-control { text-align: left; font-weight: 600; letter-spacing: .04em; }
.type-confirm .form-label { text-align: left; display: block; }
.link-replace { display: flex; flex-direction: column; gap: 8px; text-align: left; }
.link-replace .url-box { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-bg); font-size: 13px; }
.link-replace .url-box .lbl { color: var(--color-text-muted); flex: none; width: 60px; } .link-replace .url-box .url { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-primary-text); }
.link-replace .arrow { text-align: center; color: var(--color-text-faint); }
.drawer-backdrop { position: fixed; inset: 0; background: rgba(15,23,42,.45); z-index: var(--z-drawer); animation: fade .15s ease; }
.drawer { position: fixed; top: 0; right: 0; bottom: 0; width: min(560px, 100%); background: var(--color-surface); box-shadow: var(--shadow-xl); z-index: calc(var(--z-drawer) + 1); display: flex; flex-direction: column; animation: slide-in var(--t-drawer); }
.drawer-lg { width: min(760px, 100%); }
.drawer-head { display: flex; align-items: center; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--color-divider); }
.drawer-head h2 { font-size: 18px; font-weight: 700; flex: 1; }
.drawer-body { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 16px; }
.drawer-foot { padding: 14px 20px; border-top: 1px solid var(--color-divider); display: flex; justify-content: flex-end; gap: 10px; background: var(--color-surface); }
.drawer .panel { border: 0; box-shadow: none; border-radius: 0; }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes rise { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes slide-in { from { transform: translateX(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.toast-stack { position: fixed; top: 16px; right: 16px; z-index: var(--z-toast); display: flex; flex-direction: column; gap: 10px; width: min(380px, calc(100vw - 32px)); pointer-events: none; }
.toast { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border-radius: var(--r-lg); border: 1px solid; box-shadow: var(--shadow-md); background: var(--color-surface); pointer-events: auto; animation: rise .2s ease; font-size: 13px; }
.toast .icon { flex: none; margin-top: 1px; }
.toast strong { font-weight: 600; display: block; }
.toast span { color: var(--color-text-secondary); }
.toast .toast-close { margin-left: auto; color: var(--color-text-muted); }
.toast-success { background: #F0FDF4; border-color: #BBF7D0; } .toast-success .icon:first-child { color: var(--color-success); }
.toast-info { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); } .toast-info .icon:first-child { color: var(--color-primary); }
.toast-warning { background: #FFFBEB; border-color: #FDE68A; } .toast-warning .icon:first-child { color: var(--color-warning); }
.toast-error { background: #FEF2F2; border-color: #FECACA; } .toast-error .icon:first-child { color: var(--color-danger); }
.toast.is-leaving { opacity: 0; transform: translateX(20px); transition: all .2s ease; }
.sheet { position: fixed; left: 0; right: 0; bottom: 0; background: var(--color-surface); border-radius: var(--r-2xl) var(--r-2xl) 0 0; z-index: calc(var(--z-drawer) + 1); max-height: 85vh; display: flex; flex-direction: column; animation: sheet-up var(--t-drawer); box-shadow: var(--shadow-xl); }
.sheet-handle { width: 40px; height: 4px; border-radius: 2px; background: var(--color-border-strong); margin: 10px auto 0; }
@keyframes sheet-up { from { transform: translateY(100%); } to { transform: none; } }

/* Notifications panel */
.notif-panel { width: 440px; padding: 0; overflow: hidden; }
.notif-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 16px 12px; }
.notif-head h3 { font-size: 18px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.notif-head p { font-size: 13px; color: var(--color-text-muted); margin-top: 2px; }
.notif-head-actions { display: flex; align-items: center; gap: 6px; }
.notif-tabs { margin: 0 16px 8px; display: flex; }
.notif-tabs .seg-tab { flex: 1; justify-content: center; }
.notif-list { max-height: 440px; overflow-y: auto; padding: 0 8px; }
.notif-item { display: flex; align-items: flex-start; gap: 12px; padding: 12px 8px; border-radius: var(--r-lg); border-bottom: 1px solid var(--color-divider); position: relative; color: var(--color-text); }
.notif-item:hover { background: var(--color-surface-hover); }
.notif-item .icon-tile { width: 40px; height: 40px; border-radius: var(--r-lg); }
.notif-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.35; }
.notif-text strong { font-size: 14px; font-weight: 600; } .notif-text span { font-size: 13px; color: var(--color-text-secondary); }
.notif-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; font-size: 12px; color: var(--color-text-muted); flex: none; }
.notif-item.is-unread .notif-meta::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--color-danger); }
.notif-item.is-unread.sev-upcoming .notif-meta::after { background: var(--color-warning); } .notif-item.is-unread.sev-info .notif-meta::after, .notif-item.is-unread.sev-success .notif-meta::after { background: var(--color-primary); }
.notif-footer { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 12px; margin: 8px; background: var(--color-primary-soft); border-radius: var(--r-lg); font-weight: 600; color: var(--color-primary-text); font-size: 14px; }
.notif-footer:hover { background: var(--color-primary-soft-2); }
.notif-empty { padding: 32px 16px; text-align: center; color: var(--color-text-muted); font-size: 13px; }
.notif-loading { padding: 8px; display: flex; flex-direction: column; gap: 8px; }

/* Command palette */
.palette-backdrop { position: fixed; inset: 0; background: rgba(15,23,42,.5); backdrop-filter: blur(3px); z-index: var(--z-palette); display: flex; align-items: flex-start; justify-content: center; padding: 8vh 20px 20px; animation: fade .12s ease; }
.palette { width: 100%; max-width: 860px; background: var(--color-surface); border-radius: var(--r-2xl); box-shadow: var(--shadow-xl); display: flex; flex-direction: column; max-height: 78vh; animation: rise .16s ease; overflow: hidden; }
.palette-input { display: flex; align-items: center; gap: 12px; margin: 16px 16px 12px; padding: 0 14px; height: 52px; border: 1px solid var(--color-border); border-radius: var(--r-xl); background: var(--color-bg); }
.palette-input .icon { color: var(--color-text-muted); width: 20px; height: 20px; }
.palette-input input { flex: 1; border: 0; background: transparent; font-size: 18px; outline: none; height: 100%; }
.palette-input input:focus { box-shadow: none; }
.palette-input input::placeholder { color: var(--color-text-faint); }
.palette-chips { display: flex; gap: 6px; padding: 0 16px 12px; overflow-x: auto; scrollbar-width: none; }
.palette-chips::-webkit-scrollbar { display: none; }
.palette-chip { height: 32px; padding: 0 14px; border-radius: var(--r-md); background: var(--color-surface-muted); color: var(--color-text-secondary); font-size: 13px; font-weight: 500; white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; }
.palette-chip.is-active { background: var(--color-primary); color: #fff; }
.palette-body { display: grid; grid-template-columns: 250px 1fr; border-top: 1px solid var(--color-divider); overflow: hidden; min-height: 320px; }
.palette-side { border-right: 1px solid var(--color-divider); padding: 12px 8px; overflow-y: auto; }
.palette-main { padding: 12px 12px; overflow-y: auto; }
.palette-section { font-size: 12px; font-weight: 600; color: var(--color-text-secondary); display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px; }
.palette-section .icon { color: var(--color-text-muted); }
.palette-section a { font-weight: 500; }
.palette-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border-radius: var(--r-md); font-size: 14px; font-weight: 500; color: var(--color-text); text-align: left; }
.palette-item .icon-tile { width: 28px; height: 28px; border-radius: var(--r-sm); }
.palette-item:hover, .palette-item.is-active { background: var(--color-primary-soft); }
.palette-item .kbd-hint { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; }
.palette-item .kbd-hint .icon { color: var(--color-text-faint); }
.palette-result { display: flex; align-items: center; gap: 12px; width: 100%; padding: 9px 10px; border-radius: var(--r-lg); text-align: left; color: var(--color-text); }
.palette-result:hover, .palette-result.is-active { background: var(--color-primary-soft); }
.palette-result .icon-tile { width: 36px; height: 36px; border-radius: 50%; }
.palette-result-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.palette-result-text strong { font-weight: 600; font-size: 14px; } .palette-result-text span { font-size: 12px; color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.palette-result .badge { margin-left: 8px; }
.palette-recent { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: var(--r-md); font-size: 14px; color: var(--color-text); width: 100%; text-align: left; }
.palette-recent:hover { background: var(--color-surface-muted); }
.palette-recent .icon { color: var(--color-text-faint); } .palette-recent .time { margin-left: auto; font-size: 12px; color: var(--color-text-muted); }
.palette-foot { display: flex; align-items: center; justify-content: space-between; padding: 10px 16px; border-top: 1px solid var(--color-divider); font-size: 12px; color: var(--color-text-muted); background: var(--color-bg); }
.palette-foot kbd { margin: 0 2px; display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; }
.palette-foot > span { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 2px; }
.palette-foot kbd .icon { width: 11px; height: 11px; }
.palette-empty { padding: 40px 16px; text-align: center; color: var(--color-text-muted); }

/* Add New hub */
.addnew { max-width: 1060px; }
.addnew-head { display: flex; align-items: center; gap: 18px; padding: 24px 28px 16px; }
.addnew-head .icon-tile { width: 64px; height: 64px; border-radius: 50%; background: var(--color-success-soft); color: var(--color-success); }
.addnew-head h2 { font-size: 24px; font-weight: 700; }
.addnew-head p { color: var(--color-text-secondary); margin-top: 2px; }
.addnew-head .input-group { margin-left: auto; width: 340px; }
.addnew-chips { display: flex; gap: 8px; padding: 0 28px 16px; align-items: center; flex-wrap: wrap; }
.addnew-chips .spacer { flex: 1; }
.addnew-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; padding: 0 28px 24px; overflow-y: auto; }
.addnew-card { border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 18px; background: var(--color-surface); text-align: left; display: flex; flex-direction: column; gap: 10px; position: relative; transition: border-color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast); }
.addnew-card:hover { border-color: var(--color-primary); box-shadow: var(--shadow-md); transform: translateY(-1px); }
.addnew-card .icon-tile { width: 56px; height: 56px; border-radius: 50%; }
.addnew-card .icon-tile .icon { width: 24px; height: 24px; }
.addnew-card .chev { position: absolute; top: 18px; right: 16px; color: var(--color-text-faint); }
.addnew-card strong { font-size: 16px; font-weight: 700; margin-top: 6px; }
.addnew-card p { font-size: 13px; color: var(--color-text-secondary); line-height: 1.4; min-height: 36px; }
.addnew-card .tags .tag { height: 22px; font-size: 11px; }
.addnew-foot { display: flex; align-items: center; gap: 14px; padding: 16px 28px; border-top: 1px solid var(--color-divider); background: var(--color-bg); border-radius: 0 0 var(--r-2xl) var(--r-2xl); flex-wrap: wrap; }
.addnew-foot .icon-tile { width: 40px; height: 40px; border-radius: 50%; background: var(--color-warning-soft); color: var(--color-warning); }
.addnew-foot-text strong { display: block; font-weight: 600; font-size: 14px; } .addnew-foot-text span { font-size: 12px; color: var(--color-text-muted); }
.template-btn { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-lg); font-weight: 500; font-size: 13px; }
.template-btn:hover { border-color: var(--color-border-strong); }
.template-btn .icon { color: var(--color-primary); }
.template-btn .icon.green { color: var(--color-success); }
.addnew-foot .templates { display: flex; gap: 10px; margin-left: auto; flex-wrap: wrap; align-items: center; }

/* ---------- 11. Domain layouts --------------------------------------- */
/* Kanban */
.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(150px, 1fr); gap: 10px; overflow-x: auto; padding-bottom: 8px; align-items: start; }
.kanban-col { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); display: flex; flex-direction: column; min-width: 0; }
.kanban-col-head { padding: 12px 14px; border-radius: var(--r-xl) var(--r-xl) 0 0; display: flex; flex-direction: column; gap: 2px; }
.kanban-col-head .kanban-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-weight: 600; font-size: 14px; }
.kanban-col-head .kanban-total { font-size: 12px; color: var(--color-text-secondary); }
.kanban-col.stage-research .kanban-col-head { background: #EEF2F7; } .kanban-col.stage-contact_found .kanban-col-head { background: #EDE9FE; } .kanban-col.stage-contacted .kanban-col-head { background: #DBEAFE; } .kanban-col.stage-replied .kanban-col-head { background: #DCFCE7; } .kanban-col.stage-negotiating .kanban-col-head { background: #FEF3C7; } .kanban-col.stage-deal_agreed .kanban-col-head { background: #CCFBF1; }
.kanban-col.stage-research .kanban-title { color: #334155; } .kanban-col.stage-contact_found .kanban-title { color: #5B21B6; } .kanban-col.stage-contacted .kanban-title { color: #1D4ED8; } .kanban-col.stage-replied .kanban-title { color: #15803D; } .kanban-col.stage-negotiating .kanban-title { color: #B45309; } .kanban-col.stage-deal_agreed .kanban-title { color: #0F766E; }
.kanban-cards { display: flex; flex-direction: column; gap: 8px; padding: 8px; min-height: 60px; }
.kanban-cards.is-over { background: var(--color-primary-soft); border-radius: var(--r-lg); }
.kanban-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-lg); padding: 10px 10px; cursor: grab; display: flex; flex-direction: column; gap: 8px; transition: box-shadow var(--t-fast), border-color var(--t-fast); }
.kanban-card:hover { border-color: var(--color-border-strong); box-shadow: var(--shadow-sm); }
.kanban-card.is-selected { border-color: var(--color-primary); box-shadow: 0 0 0 2px var(--color-primary-soft-2); }
.kanban-card.is-dragging { opacity: .5; }
.kanban-card-top { display: flex; align-items: center; gap: 8px; }
.kanban-card-top .entity-text strong { font-size: 12.5px; }
.kanban-card-top .entity-sub { font-size: 11px; }
.kanban-col-head { padding: 10px 12px; }
.kanban-col-head .kanban-title { font-size: 13px; }
.kanban-col-head .kanban-total { font-size: 11px; }
.kanban-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 6px; font-size: 11px; white-space: nowrap; }
.kanban-card-foot .money { font-weight: 600; font-size: 12.5px; }
.kanban-card-foot .age { color: var(--color-text-muted); }
.kanban-add { display: flex; align-items: center; gap: 6px; padding: 10px 14px; font-size: 13px; font-weight: 500; color: var(--color-primary-text); }
.kanban-add:hover { text-decoration: underline; }
.stage-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.stage-tile { border-radius: var(--r-lg); padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; }
.stage-tile .l { font-size: 13px; font-weight: 600; } .stage-tile .v { font-size: 24px; font-weight: 700; letter-spacing: -.02em; }
.stage-tile.blue { background: #EFF6FF; } .stage-tile.blue .l { color: #1D4ED8; } .stage-tile.amber { background: #FFFBEB; } .stage-tile.amber .l { color: #B45309; } .stage-tile.green { background: #ECFDF5; } .stage-tile.green .l { color: #15803D; } .stage-tile.purple { background: #F5F3FF; } .stage-tile.purple .l { color: #6D28D9; } .stage-tile.grey { background: #F1F5F9; } .stage-tile.grey .l { color: #475569; }
/* Knowledge cards */
.k-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.k-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 14px; display: flex; flex-direction: column; gap: 10px; position: relative; cursor: pointer; transition: border-color var(--t-fast), box-shadow var(--t-fast); min-width: 0; }
.k-card:hover { border-color: var(--color-border-strong); box-shadow: var(--shadow-sm); }
.k-card.is-selected { border-color: var(--color-primary); box-shadow: 0 0 0 2px var(--color-primary-soft-2); }
.k-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.k-card-top .icon-tile { width: 40px; height: 40px; border-radius: var(--r-lg); }
.k-card-top .k-flags { display: flex; align-items: center; gap: 6px; }
.k-card-top .k-flags .btn-icon { width: 24px; height: 24px; color: var(--color-text-faint); }
.k-card-top .k-flags .btn-icon.is-on { color: var(--color-warning); }
.k-card .k-thumb { width: 100%; aspect-ratio: 16 / 7; border-radius: var(--r-md); background: linear-gradient(135deg, #0F172A, #1E3A8A); overflow: hidden; display: flex; align-items: center; justify-content: center; color: #93C5FD; }
.k-card strong { font-size: 15px; font-weight: 700; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.k-card p { font-size: 12px; color: var(--color-text-secondary); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.k-card .tags .tag { height: 22px; font-size: 11px; }
.k-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--color-text-muted); margin-top: auto; }
.k-card-meta .meta { display: inline-flex; align-items: center; gap: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.k-hero { width: 100%; aspect-ratio: 16 / 7; border-radius: var(--r-xl); background: linear-gradient(135deg, #0F172A, #1E40AF); color: #fff; display: flex; flex-direction: column; justify-content: center; padding: 20px 24px; position: relative; overflow: hidden; }
.k-hero strong { font-size: 24px; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; } .k-hero span { color: #93C5FD; font-weight: 600; margin-top: 4px; }
.tree { display: flex; flex-direction: column; gap: 2px; }
.tree-group { font-size: 13px; font-weight: 600; color: var(--color-text); display: flex; align-items: center; justify-content: space-between; padding: 8px 10px; }
.tree-group .count-badge { background: transparent; color: var(--color-text-muted); }
.tree-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px 7px 28px; border-radius: var(--r-md); font-size: 13px; color: var(--color-text-secondary); font-weight: 500; }
.tree-item .icon { width: 14px; height: 14px; color: var(--color-text-faint); }
.tree-item:hover { background: var(--color-surface-muted); color: var(--color-text); }
.tree-item.is-active { background: var(--color-primary-soft); color: var(--color-primary-text); }
.tree-item.is-active .icon { color: var(--color-primary); }
.tree-item .count-badge { margin-left: auto; }
.tree-item.top { padding-left: 10px; font-weight: 600; color: var(--color-text); }
.tag-list { display: flex; flex-direction: column; gap: 2px; }
.tag-list a { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-radius: var(--r-md); font-size: 13px; color: var(--color-text-secondary); }
.tag-list a:hover { background: var(--color-surface-muted); }
.tag-list a .count-badge { margin-left: auto; background: transparent; color: var(--color-text-muted); }
/* Attention inbox */
.inbox { display: grid; grid-template-columns: 380px minmax(0, 1fr) 300px; gap: var(--gap); align-items: start; }
.inbox-list { display: flex; flex-direction: column; }
.inbox-item { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--color-divider); border-left: 3px solid transparent; color: var(--color-text); position: relative; }
.inbox-item:hover { background: var(--color-surface-hover); }
.inbox-item.is-active { background: #FEF2F2; border-left-color: var(--color-danger); }
.inbox-item.is-active.sev-attention { background: #FFFBEB; border-left-color: var(--color-warning); } .inbox-item.is-active.sev-upcoming { background: var(--color-primary-soft); border-left-color: var(--color-primary); }
.inbox-item .icon-tile { width: 40px; height: 40px; border-radius: var(--r-lg); }
.inbox-item-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.35; }
.inbox-item-text strong { font-size: 14px; font-weight: 600; } .inbox-item-text span { font-size: 13px; color: var(--color-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inbox-item-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; font-size: 12px; color: var(--color-text-muted); flex: none; }
.inbox-item-meta .dot { width: 8px; height: 8px; }
.summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 14px 16px; border: 1px solid var(--color-border); border-radius: var(--r-xl) var(--r-xl) 0 0; background: var(--color-surface); }
.summary-grid .cell { display: flex; flex-direction: column; gap: 4px; }
.summary-grid .cell .l { font-size: 12px; color: var(--color-text-muted); } .summary-grid .cell .v { font-size: 16px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.summary-kv { border: 1px solid var(--color-border); border-top: 0; border-radius: 0 0 var(--r-xl) var(--r-xl); padding: 8px 16px; background: var(--color-surface); }
.note-composer { display: flex; align-items: center; gap: 10px; }
.note-composer .form-control { flex: 1; height: 44px; }
/* Import wizard */
.stepper { display: flex; align-items: center; justify-content: space-between; gap: 0; margin: 0 4px; }
.step { display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; flex: 1; font-size: 12px; color: var(--color-text-muted); font-weight: 500; }
.step-num { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; background: var(--color-surface-muted); color: var(--color-text-muted); border: 2px solid var(--color-border); z-index: 1; }
.step:not(:last-child)::after { content: ""; position: absolute; top: 14px; left: calc(50% + 16px); right: calc(-50% + 16px); height: 2px; background: var(--color-border); }
.step.is-active .step-num { background: var(--color-primary); color: #fff; border-color: var(--color-primary); } .step.is-active { color: var(--color-primary-text); font-weight: 600; }
.step.is-done .step-num { background: var(--color-success); color: #fff; border-color: var(--color-success); } .step.is-done::after { background: var(--color-success); }
.step.is-done .step-num .icon { width: 14px; height: 14px; stroke-width: 3; }
.wizard-title { font-size: 20px; font-weight: 700; } .wizard-sub { color: var(--color-text-secondary); margin-top: 2px; font-size: 14px; }
.count-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.count-tile { border-radius: var(--r-lg); padding: 12px 14px; display: flex; gap: 12px; align-items: center; border: 1px solid; }
.count-tile .icon-tile { width: 36px; height: 36px; border-radius: 50%; }
.count-tile .v { font-size: 20px; font-weight: 700; line-height: 1.1; } .count-tile .l { font-size: 12px; font-weight: 500; } .count-tile .s { font-size: 11px; color: var(--color-text-muted); }
.count-tile.green { background: #F0FDF4; border-color: #BBF7D0; } .count-tile.amber { background: #FFFBEB; border-color: #FDE68A; } .count-tile.red { background: #FEF2F2; border-color: #FECACA; } .count-tile.blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); } .count-tile.purple { background: #F5F3FF; border-color: #EDE9FE; } .count-tile.grey { background: var(--color-bg); border-color: var(--color-border); }
.map-row { display: grid; grid-template-columns: 1fr 24px 1fr auto; gap: 10px; align-items: center; }
.map-row .arrow { color: var(--color-text-faint); text-align: center; }
.map-head { display: grid; grid-template-columns: 1fr 24px 1fr auto; gap: 10px; font-size: 12px; font-weight: 600; color: var(--color-text-muted); }
.success-splash { text-align: center; padding: 20px 0 8px; }
.success-splash .big-check { width: 72px; height: 72px; border-radius: 50%; background: var(--color-success); color: #fff; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 16px; box-shadow: 0 0 0 10px #DCFCE7; }
.success-splash .big-check .icon { width: 34px; height: 34px; stroke-width: 3; }
.success-splash h2 { font-size: 24px; font-weight: 700; } .success-splash p { color: var(--color-text-secondary); margin-top: 6px; }
/* Funnel & aging */
.funnel { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; align-items: stretch; }
.funnel-step { background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--r-lg); padding: 12px; text-align: center; position: relative; }
.funnel-step .v { font-size: 18px; font-weight: 700; } .funnel-step .l { font-size: 12px; color: var(--color-text-muted); }
.funnel-step .rate { display: inline-flex; margin-top: 8px; }
.funnel-step:not(:last-child)::after { content: "→"; position: absolute; right: -10px; top: 50%; transform: translateY(-50%); color: var(--color-text-faint); font-size: 14px; z-index: 1; }
.aging { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.aging-tile { border-radius: var(--r-lg); padding: 14px; text-align: center; border: 1px solid; }
.aging-tile .v { font-size: 18px; font-weight: 700; } .aging-tile .l { font-size: 12px; color: var(--color-text-secondary); margin-top: 2px; }
.aging-tile.ok { background: var(--color-bg); border-color: var(--color-border); } .aging-tile.warn { background: #FFFBEB; border-color: #FDE68A; } .aging-tile.bad { background: #FEF2F2; border-color: #FECACA; }
.highlight-card { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); min-width: 0; }
.highlight-card .hl-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.highlight-card .hl-text .l { font-size: 12px; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .highlight-card .hl-text strong { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .highlight-card .hl-text .v { font-size: 16px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.report-list { display: flex; flex-direction: column; gap: 8px; }
.report-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--r-lg); color: var(--color-text); }
.report-item:hover { border-color: var(--color-border-strong); background: var(--color-surface-hover); }
.report-item .icon-tile { width: 36px; height: 36px; border-radius: var(--r-md); }
.report-item-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.report-item-text strong { font-size: 13px; font-weight: 600; } .report-item-text span { font-size: 12px; color: var(--color-text-muted); }
.integration-row { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--color-border); border-radius: var(--r-xl); }
.integration-row + .integration-row { margin-top: 10px; }
.integration-row img, .integration-row .integration-logo { width: 36px; height: 36px; flex: none; }
.integration-logo-brand { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--color-surface-muted); } .integration-logo-brand.brand-github { background: #F1F5F9; } .integration-logo-brand.brand-cloudflare { background: #FFEDD5; } .integration-logo-brand.brand-drive { background: #DCFCE7; }
.integration-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.integration-text strong { font-size: 14px; font-weight: 600; } .integration-text span { font-size: 12px; color: var(--color-text-muted); }
.integration-text .sub { font-size: 11px; color: var(--color-text-faint); }
.integration-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.integration-actions .sub { font-size: 11px; color: var(--color-text-faint); }
.integ-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.integ-tile { border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 16px; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.integ-tile img { width: 40px; height: 40px; margin-bottom: 4px; }
.integ-tile strong { font-size: 14px; font-weight: 600; }
.integ-tile .status { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--color-text-muted); }
.integ-tile .tile-actions { display: flex; gap: 6px; margin-top: 6px; }
.settings-list { border: 1px solid var(--color-border); border-radius: var(--r-xl); overflow: hidden; }
.settings-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--color-divider); color: var(--color-text); }
.settings-item:last-child { border-bottom: 0; } .settings-item:hover { background: var(--color-surface-hover); }
.settings-item .icon-tile { width: 36px; height: 36px; border-radius: var(--r-md); }
.settings-item-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.settings-item-text strong { font-size: 14px; font-weight: 600; } .settings-item-text span { font-size: 12px; color: var(--color-text-muted); }
.settings-item .chev { color: var(--color-text-faint); }
.settings-nav { display: flex; flex-direction: column; gap: 14px; }
.settings-nav-group h4 { font-size: 13px; font-weight: 600; color: var(--color-text); padding: 0 10px 6px; }
.settings-nav a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--r-md); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); }
.settings-nav a .icon { color: var(--color-text-faint); }
.settings-nav a:hover { background: var(--color-surface-muted); color: var(--color-text); }
.settings-nav a.is-active { background: var(--color-primary-soft); color: var(--color-primary-text); } .settings-nav a.is-active .icon { color: var(--color-primary); }
.storage-rows { display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.storage-rows .row { display: flex; justify-content: space-between; color: var(--color-text-secondary); } .storage-rows .row strong { color: var(--color-text); }
.channel-icons { display: inline-flex; gap: 6px; }
.channel-icons .btn-icon { width: 26px; height: 26px; border-radius: var(--r-sm); background: var(--color-primary-soft); color: var(--color-primary); }
.channel-icons .btn-icon.tg { background: #E0F2FE; color: #0284C7; } .channel-icons .btn-icon.wa { background: #DCFCE7; color: #16A34A; } .channel-icons .btn-icon.li { background: #DBEAFE; color: #1D4ED8; } .channel-icons .btn-icon.sk { background: #E0F2FE; color: #0EA5E9; } .channel-icons .btn-icon.em { background: #EDE9FE; color: #6D28D9; }
.task-row { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--color-divider); }
.task-row:last-child { border-bottom: 0; }
.task-row .check { margin-top: 2px; }
.task-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.35; }
.task-text strong { font-size: 14px; font-weight: 600; } .task-text span { font-size: 13px; color: var(--color-text-secondary); }
.task-text .text-red { color: var(--color-danger-text); }
.task-row.is-done .task-text strong { text-decoration: line-through; color: var(--color-text-muted); }
.due-chip { display: inline-flex; align-items: center; height: 24px; padding: 0 8px; border-radius: var(--r-sm); font-size: 12px; font-weight: 600; white-space: nowrap; background: var(--color-surface-muted); color: var(--color-text-secondary); }
.due-chip.red { background: var(--color-danger-soft); color: var(--color-danger-text); } .due-chip.amber { background: var(--color-warning-soft); color: var(--color-warning-text); } .due-chip.blue { background: var(--color-primary-soft-2); color: var(--color-primary-text); } .due-chip.grey { background: var(--color-surface-muted); }
.calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--color-border); border-left: 1px solid var(--color-border); }
.calendar .cal-head { padding: 8px; font-size: 12px; font-weight: 600; color: var(--color-text-muted); text-align: center; border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); background: var(--color-bg); }
.calendar .cal-day { min-height: 96px; padding: 6px; border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); font-size: 12px; display: flex; flex-direction: column; gap: 4px; }
.calendar .cal-day.is-other { background: var(--color-bg); color: var(--color-text-faint); }
.calendar .cal-day.is-today .cal-num { background: var(--color-primary); color: #fff; }
.calendar .cal-num { width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; }
.cal-event { display: block; padding: 2px 6px; border-radius: var(--r-xs); font-size: 11px; font-weight: 500; background: var(--color-primary-soft-2); color: var(--color-primary-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-event.red { background: var(--color-danger-soft); color: var(--color-danger-text); } .cal-event.green { background: var(--color-success-soft); color: var(--color-success-text); } .cal-event.amber { background: var(--color-warning-soft); color: var(--color-warning-text); } .cal-event.purple { background: var(--color-purple-soft); color: var(--color-purple-text); }
.url-bar { display: flex; align-items: center; gap: 8px; }
.url-bar .url-box { flex: 1; display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-bg); font-size: 13px; font-weight: 500; overflow: hidden; }
.url-bar .url-box span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-text); }
.matrix { font-size: 13px; }
.matrix th, .matrix td { text-align: center; }
.matrix th:first-child, .matrix td:first-child { text-align: left; }
.matrix .check { justify-content: center; }
.ring-card { display: flex; align-items: center; gap: 16px; }
.ring-card .ring-text .v { font-size: 20px; font-weight: 700; } .ring-card .ring-text .l { font-size: 12px; color: var(--color-text-muted); }

/* ---------- 12. Charts ------------------------------------------------ */
.chart { position: relative; width: 100%; min-height: 120px; }
.chart svg { width: 100%; height: 100%; display: block; overflow: visible; font-family: var(--font); }
.chart .axis text { font-size: 11px; fill: var(--color-text-muted); }
.chart .grid line { stroke: var(--color-divider); }
.chart-tooltip { position: absolute; pointer-events: none; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-lg); box-shadow: var(--shadow-lg); padding: 10px 12px; font-size: 12px; min-width: 150px; z-index: 5; transform: translate(-50%, calc(-100% - 12px)); opacity: 0; transition: opacity var(--t-fast); }
.chart-tooltip.is-visible { opacity: 1; }
.chart-tooltip strong { display: block; font-weight: 600; margin-bottom: 6px; font-size: 13px; }
.chart-tooltip .row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 2px 0; }
.chart-tooltip .row .lbl { display: inline-flex; align-items: center; gap: 6px; color: var(--color-text-secondary); }
.chart-tooltip .row .val { font-weight: 600; }
.chart-tooltip.dark { background: var(--color-navy); border-color: var(--color-navy); color: #fff; } .chart-tooltip.dark .row .lbl { color: #61768F; }
.donut-wrap { display: flex; align-items: center; gap: 16px; }
.donut-wrap > div:first-child { flex: none; }
.donut-wrap .chart { width: 160px; height: 160px; flex: none; min-height: 0; }
.donut-wrap .legend { flex: 1; min-width: 0; }
.donut-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; pointer-events: none; }
.donut-center .v { font-size: 20px; font-weight: 700; letter-spacing: -.02em; } .donut-center .l { font-size: 11px; color: var(--color-text-muted); }
.sparkline { width: 70px; height: 24px; }

/* ---------- 13. States ------------------------------------------------ */
.skeleton { background: linear-gradient(90deg, var(--color-surface-muted) 25%, #E9EEF5 37%, var(--color-surface-muted) 63%); background-size: 400% 100%; animation: shimmer 1.4s ease infinite; border-radius: var(--r-sm); }
.skeleton-row { height: 14px; margin: 8px 0; } .skeleton-row.short { width: 60%; } .skeleton-circle { width: 40px; height: 40px; border-radius: 50%; } .skeleton-block { height: 120px; border-radius: var(--r-lg); } .skeleton-text { height: 12px; }
@keyframes shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
.empty-state { text-align: center; padding: 48px 24px; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.empty-state .empty-art { position: relative; width: 160px; height: 120px; display: flex; align-items: center; justify-content: center; }
.empty-state .empty-art > img { position: absolute; inset: 0; width: 160px; height: 120px; }
.empty-state .empty-icon { position: relative; width: 72px; height: 72px; border-radius: 50%; background: var(--color-surface-muted); color: var(--color-text-muted); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 8px; }
.empty-state h3, .empty-state h2 { font-size: 18px; font-weight: 700; }
.empty-state p { color: var(--color-text-secondary); max-width: 380px; font-size: 14px; }
.empty-state .empty-actions { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; justify-content: center; }
.empty-state.error .empty-icon { background: var(--color-danger-soft); color: var(--color-danger); } .empty-state.warning .empty-icon { background: var(--color-warning-soft); color: var(--color-warning); } .empty-state.success .empty-icon { background: var(--color-success-soft); color: var(--color-success); } .empty-state.denied .empty-icon { background: var(--color-danger-soft); color: var(--color-danger); } .empty-state.offline .empty-icon { background: var(--color-surface-muted); color: var(--color-text-secondary); }
.state-card { border-radius: var(--r-xl); padding: 24px; text-align: center; border: 1px solid; }
.state-card.success { background: #F0FDF4; border-color: #BBF7D0; } .state-card.warning { background: #FFFBEB; border-color: #FDE68A; } .state-card.danger { background: #FEF2F2; border-color: #FECACA; } .state-card.neutral { background: var(--color-bg); border-color: var(--color-border); }
.state-card .state-icon { width: 52px; height: 52px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.state-card h3 { font-size: 17px; font-weight: 700; } .state-card p { color: var(--color-text-secondary); margin-top: 6px; font-size: 13px; }
.state-card .state-actions { display: flex; gap: 10px; justify-content: center; margin-top: 16px; }
.upload-progress { display: flex; flex-direction: column; gap: 8px; }
.upload-progress .row { display: flex; align-items: center; gap: 10px; }
.error-rows { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.error-rows .row { display: grid; grid-template-columns: 80px 1fr; gap: 10px; padding: 6px 0; border-bottom: 1px solid #FECACA; }
.error-rows .row .r { color: var(--color-danger-text); font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.maintenance-banner { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--color-primary-soft); border: 1px solid var(--color-primary-soft-2); border-radius: var(--r-lg); font-size: 13px; }
.maintenance-banner strong { color: var(--color-primary-text); }
.offline-banner { position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%); background: var(--color-navy); color: #fff; padding: 10px 16px; border-radius: var(--r-lg); display: flex; align-items: center; gap: 10px; z-index: var(--z-toast); font-size: 13px; font-weight: 500; box-shadow: var(--shadow-lg); }

/* ---------- 14. Auth pages ------------------------------------------- */
.auth-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--color-bg); }
.auth-card { width: 100%; max-width: 440px; background: var(--color-surface); border-radius: var(--r-2xl); box-shadow: var(--shadow-xl); padding: 40px 36px 32px; display: flex; flex-direction: column; gap: 20px; text-align: center; }
.auth-card.dark { background: linear-gradient(160deg, #0B1F2A 0%, #062834 55%, #041F2B 100%); color: #fff; position: relative; overflow: hidden; }
.auth-card.dark::after { content: ""; position: absolute; inset: auto -20% -30% -20%; height: 45%; background: radial-gradient(ellipse at 50% 100%, rgba(5,150,105,.35), transparent 70%); pointer-events: none; }
.auth-card.dark .auth-brand span, .auth-card.dark .auth-title, .auth-card.dark .form-label { color: #fff; }
.auth-card.dark .auth-sub, .auth-card.dark .auth-foot { color: #CBD5E1; }
.auth-card.dark .form-control { background: #fff; color: var(--color-text); border-color: transparent; }
.auth-card.dark .check-text, .auth-card.dark .auth-links a { color: #fff; }
.auth-card.dark .auth-links a.muted { color: #A7F3D0; }
.auth-card.dark .auth-divider { color: #94A3B8; } .auth-card.dark .auth-divider::before, .auth-card.dark .auth-divider::after { background: rgba(255,255,255,.15); }
.auth-card.dark .btn-secondary { background: #fff; color: var(--color-text); border-color: #fff; }
.auth-brand { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.auth-brand img { width: 44px; height: 44px; }
.auth-brand span { font-weight: 700; font-size: 18px; } .auth-brand small { font-size: 12px; color: var(--color-text-muted); }
.auth-card.dark .auth-brand small { color: #A7F3D0; }
.auth-title { font-size: 24px; font-weight: 700; letter-spacing: -.02em; }
.auth-sub { color: var(--color-text-secondary); font-size: 14px; margin-top: 6px; }
.auth-form { display: flex; flex-direction: column; gap: 14px; text-align: left; }
.auth-form .btn { height: 44px; margin-top: 4px; }
.auth-links { display: flex; align-items: center; justify-content: space-between; font-size: 13px; }
.auth-links a { color: var(--color-auth-primary); font-weight: 500; }
.auth-divider { display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--color-text-muted); }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--color-border); }
.auth-trust { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; color: var(--color-text-muted); }
.auth-trust .icon { color: var(--color-auth-primary); }
.auth-foot { font-size: 13px; color: var(--color-text-muted); line-height: 1.5; }
.auth-icon { width: 64px; height: 64px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; margin: 0 auto; }
.auth-icon .icon { width: 28px; height: 28px; }
.auth-icon.blue { background: var(--color-primary-soft-2); color: var(--color-primary); } .auth-icon.red { background: var(--color-danger-soft); color: var(--color-danger); } .auth-icon.green { background: var(--color-success-soft); color: var(--color-success); } .auth-icon.amber { background: var(--color-warning-soft); color: var(--color-warning); }
.auth-back { display: inline-flex; align-items: center; justify-content: center; gap: 6px; color: var(--color-auth-primary); font-weight: 500; font-size: 14px; }
.auth-tabs { display: flex; background: var(--color-surface-muted); border-radius: var(--r-md); padding: 4px; }
.auth-tabs button { flex: 1; height: 34px; border-radius: var(--r-sm); font-weight: 600; font-size: 13px; color: var(--color-text-secondary); }
.auth-tabs button.is-active { background: var(--color-surface); color: var(--color-primary-text); box-shadow: var(--shadow-xs); }
.device-box { border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; text-align: left; }
.device-box .row { display: flex; align-items: center; gap: 12px; }
.device-box .row .icon-tile { width: 36px; height: 36px; border-radius: 50%; }
.device-box .row .t { display: flex; flex-direction: column; line-height: 1.3; }
.device-box .row .t span { font-size: 12px; color: var(--color-text-muted); } .device-box .row .t strong { font-size: 14px; font-weight: 600; }
.cred-box { border: 1px solid var(--color-border); border-radius: var(--r-xl); text-align: left; overflow: hidden; }
.cred-row { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--color-divider); }
.cred-row:last-child { border-bottom: 0; }
.cred-row .t { flex: 1; display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.cred-row .t span { font-size: 12px; color: var(--color-text-muted); } .cred-row .t strong { font-size: 14px; font-weight: 600; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cred-row .t strong.masked { letter-spacing: .2em; }
.cred-row .btn-icon { color: var(--color-primary); }
.countdown-banner { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: #FFFBEB; border: 1px solid #FDE68A; border-radius: var(--r-lg); font-size: 13px; color: var(--color-warning-text); text-align: left; }
.audit-line { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; color: var(--color-text-muted); }
.audit-line .icon { color: var(--color-success); }
.setup-steps { display: flex; flex-direction: column; gap: 12px; text-align: left; }
.setup-step { display: flex; align-items: center; gap: 12px; }
.setup-step .step-num { width: 26px; height: 26px; }
.setup-step .t { display: flex; flex-direction: column; line-height: 1.25; } .setup-step .t strong { font-size: 13px; } .setup-step .t span { font-size: 12px; color: var(--color-text-muted); }
.auth-illustration { width: 120px; height: 120px; margin: 0 auto; }
.auth-two-col { display: grid; grid-template-columns: 1fr 200px; gap: 24px; text-align: left; align-items: start; }

/* ---------- 15. Misc utilities ---------------------------------------- */
.card-head .form-select, .form-select.card-select, .panel-section-title .form-select, .filter-bar .form-select { width: auto; flex: none; }
.divider { height: 1px; background: var(--color-divider); margin: 4px 0; }
.chip-row { display: flex; gap: 8px; flex-wrap: wrap; }
.view-switch { display: inline-flex; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-md); padding: 3px; }
.view-switch a, .view-switch button { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: var(--r-sm); font-size: 13px; font-weight: 500; color: var(--color-text-secondary); }
.view-switch .is-active { background: var(--color-primary); color: #fff; }
.two-line-title { display: flex; flex-direction: column; line-height: 1.25; }
.two-line-title strong { font-weight: 600; } .two-line-title span { font-size: 12px; color: var(--color-text-muted); }
.section-title { font-size: 16px; font-weight: 700; margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; }
.stat-line { display: flex; align-items: center; justify-content: space-between; font-size: 13px; padding: 8px 0; border-bottom: 1px solid var(--color-divider); }
.stat-line:last-child { border-bottom: 0; }
.stat-line strong { font-weight: 600; }
.stat-line .lbl { display: inline-flex; align-items: center; gap: 8px; color: var(--color-text-secondary); }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.overflow-hidden { overflow: hidden; }
.clickable { cursor: pointer; }
.pos-rel { position: relative; }
.fade-in { animation: fade .2s ease; }
[data-tooltip-top] { position: relative; }
.mobile-cards { display: none; }
.record-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--r-xl); padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.record-card-top { display: flex; align-items: center; gap: 10px; }
.record-card-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; font-size: 13px; }
.record-card-grid .l { font-size: 11px; color: var(--color-text-muted); display: block; }
.record-card-grid strong { font-weight: 600; }
.sticky-actions { display: none; }

/* ---------- 16. Responsive ------------------------------------------- */
@media (max-width: 1439px) {
  :root { --panel-w: 400px; }
  .kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kpi-grid.cols-8 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .kpi-grid.cols-5, .kpi-grid.cols-4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sidebar-collapse { display: inline-flex; }
}
@media (max-width: 1099px) {
  body:not(.sidebar-expanded) .sidebar { width: var(--sidebar-rail-w); }
  body:not(.sidebar-expanded) .app-main { margin-left: var(--sidebar-rail-w); }
  body:not(.sidebar-expanded) .brand-text, body:not(.sidebar-expanded) .nav-label, body:not(.sidebar-expanded) .sidebar-promo, body:not(.sidebar-expanded) .user-meta, body:not(.sidebar-expanded) .user-chevron { display: none; }
  body:not(.sidebar-expanded) .sidebar-brand { justify-content: center; padding: 18px 8px 14px; }
  body:not(.sidebar-expanded) .nav-item { justify-content: center; padding: 0; }
  body:not(.sidebar-expanded) .nav-badge { position: absolute; top: 4px; right: 6px; min-width: 16px; height: 16px; font-size: 10px; padding: 0 4px; }
  body:not(.sidebar-expanded) .sidebar-user { padding: 12px 10px; } body:not(.sidebar-expanded) .user-row { justify-content: center; }
  body:not(.sidebar-expanded) .nav-item:hover::after { content: attr(data-tooltip); position: absolute; left: calc(100% + 10px); top: 50%; transform: translateY(-50%); background: var(--color-navy); color: #fff; font-size: 12px; font-weight: 500; padding: 6px 10px; border-radius: var(--r-md); white-space: nowrap; box-shadow: var(--shadow-md); z-index: 5; }
  .layout-split, .layout-split.panel-wide, .layout-split.panel-narrow { grid-template-columns: minmax(0, 1fr); }
  .layout-split > .panel-col { position: static; }
  .layout-split > .panel-col.panel-inline-hidden { display: none; }
  .inbox { grid-template-columns: 340px minmax(0, 1fr); }
  .inbox > :nth-child(3) { grid-column: 1 / -1; }
  .k-grid, .addnew-grid, .integ-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .stage-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topbar-search { max-width: 380px; }
  .data-table [data-priority="3"] { display: none; }
}
@media (max-width: 1023px) {
  .kpi-grid, .kpi-grid.cols-5, .kpi-grid.cols-4, .kpi-grid.cols-8 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cols-3, .cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inbox { grid-template-columns: minmax(0, 1fr); }
  .k-grid, .addnew-grid, .integ-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .palette-body { grid-template-columns: 1fr; } .palette-side { display: none; }
  .form-row, .form-row.cols-3 { grid-template-columns: 1fr; }
  .funnel, .aging { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .count-tiles, .mini-kpis, .summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topbar-search-text { display: none; } .topbar-search { width: 40px; max-width: 40px; padding: 0; justify-content: center; } .topbar-search .kbd-group { display: none; }
  .page-content { --page-pad: 20px; }
  .data-table [data-priority="2"] { display: none; }
  .addnew-head .input-group { width: 100%; margin-left: 0; } .addnew-head { flex-wrap: wrap; }
}
@media (max-width: 767px) {
  :root { --topbar-h: 56px; --page-pad: 16px; }
  .only-mobile { display: initial !important; } .hidden-mobile { display: none !important; }
  .sidebar, body:not(.sidebar-expanded) .sidebar { transform: translateX(-100%); width: 280px; }
  body.sidebar-open .sidebar, body.sidebar-expanded .sidebar { transform: none; }
  .page-header-main { flex: 0 0 auto; }
  body.sidebar-open .sidebar-backdrop { display: block; }
  body .sidebar .brand-text, body .sidebar .nav-label, body .sidebar .user-meta, body .sidebar .user-chevron { display: flex; }
  body .sidebar .sidebar-promo { display: block; } body .sidebar .nav-item { justify-content: flex-start; padding: 0 12px; } body .sidebar .sidebar-brand { justify-content: space-between; padding: 18px 16px 14px; }
  body .sidebar .nav-badge { position: static; min-width: 20px; height: 20px; font-size: 11px; }
  .sidebar-close { display: inline-flex; } .sidebar-collapse { display: none; }
  .app-main, body.sidebar-collapsed .app-main, body:not(.sidebar-expanded) .app-main { margin-left: 0; }
  .topbar { padding: 0 12px; gap: 8px; }
  .topbar .topbar-menu { display: inline-flex; } .topbar .topbar-brand-mobile { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--color-text); }
  .topbar-search { display: none; }
  .period-select .period-input { padding-right: 18px; font-size: 13px; } .compare-select, .topbar-user { display: none; }
  .btn-add-new span { display: none; } .btn-add-new { width: 38px; padding: 0; justify-content: center; } .btn-add-new .btn-caret { display: none; }
  .page-content { padding-bottom: 88px; }
  .mobile-nav { display: flex; position: fixed; left: 0; right: 0; bottom: 0; height: 64px; background: var(--color-surface); border-top: 1px solid var(--color-border); z-index: var(--z-topbar); padding-bottom: env(safe-area-inset-bottom); }
  .mobile-nav-item { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 11px; font-weight: 500; color: var(--color-text-muted); min-height: 44px; }
  .mobile-nav-item.is-active { color: var(--color-primary); }
  .mobile-nav-icon { position: relative; display: inline-flex; }
  .mobile-nav-icon .nav-badge { position: absolute; top: -6px; right: -12px; min-width: 16px; height: 16px; font-size: 10px; padding: 0 4px; }
  .page-header { flex-direction: column; align-items: stretch; margin-bottom: 16px; }
  .page-title { font-size: 22px; } .page-subtitle { font-size: 14px; }
  .page-actions { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; padding-bottom: 2px; } .page-actions::-webkit-scrollbar { display: none; }
  .kpi-grid, .kpi-grid.cols-5, .kpi-grid.cols-4, .kpi-grid.cols-8 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .kpi { padding: 14px; gap: 10px; } .kpi-value { font-size: 20px; } .kpi-icon { width: 36px; height: 36px; } .kpi-spark { display: none; }
  .cols-2, .cols-3, .cols-4, .grid[style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) !important; }
  .card-body, .panel-body { padding: 16px; } .card-head { padding: 16px 16px 0; }
  .seg-tabs { overflow-x: auto; scrollbar-width: none; max-width: 100%; } .seg-tabs::-webkit-scrollbar { display: none; }
  .filter-bar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .filter-bar .input-group { width: 200px; flex: none; }
  .filter-bar.collapsible > :not(.input-group):not(.filter-toggle) { display: none; }
  .table-wrap.responsive .data-table { display: none; }
  .table-wrap.responsive .mobile-cards { display: flex; flex-direction: column; gap: 10px; padding: 12px; }
  .pagination-bar { justify-content: center; } .pagination-per { display: none; }
  .k-grid, .addnew-grid, .integ-grid, .stage-tiles, .count-tiles, .mini-kpis, .summary-grid, .funnel, .aging { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mini-kpis.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .modal-backdrop { padding: 0; align-items: flex-end; }
  .modal, .modal-sm, .modal-md, .modal-lg, .modal-xl { max-width: 100%; max-height: 100vh; height: 100vh; border-radius: 0; }
  .modal.modal-sheet { height: auto; border-radius: var(--r-2xl) var(--r-2xl) 0 0; }
  .confirm { padding: 24px 20px; }
  .drawer, .drawer-lg { width: 100%; }
  .toast-stack { top: auto; bottom: 80px; left: 16px; right: 16px; width: auto; }
  .palette-backdrop { padding: 0; } .palette { max-height: 100vh; height: 100vh; border-radius: 0; }
  .palette-chips { flex-wrap: nowrap; }
  .addnew-head { padding: 16px; gap: 12px; } .addnew-head .icon-tile { width: 48px; height: 48px; } .addnew-head h2 { font-size: 20px; }
  .addnew-chips, .addnew-grid, .addnew-foot { padding-left: 16px; padding-right: 16px; }
  .addnew-foot .templates { margin-left: 0; }
  .bulk-bar { left: 12px; right: 12px; transform: translateY(20px); bottom: 76px; flex-wrap: wrap; justify-content: center; } .bulk-bar.is-visible { transform: none; }
  .btn, .btn-icon.bordered, .form-control, .form-select { min-height: 44px; } .btn-sm { min-height: 40px; } .btn-icon { min-width: 40px; min-height: 40px; } .check-box, .radio-dot { width: 20px; height: 20px; }
  .sticky-actions { display: flex; position: sticky; bottom: 64px; background: var(--color-surface); padding: 12px 16px; border-top: 1px solid var(--color-border); gap: 10px; margin: 0 -16px; z-index: 5; }
  .sticky-actions .btn { flex: 1; }
  .kanban { grid-auto-columns: 80vw; scroll-snap-type: x mandatory; } .kanban-col { scroll-snap-align: start; }
  .stepper .step span.step-label { display: none; } .stepper .step.is-active span.step-label { display: block; }
  .auth-card { padding: 28px 22px 24px; }
  .auth-two-col { grid-template-columns: 1fr; }
  .top-tabs a { padding: 10px 12px; font-size: 13px; }
  .inbox-item .icon-tile { width: 36px; height: 36px; }
  .notif-panel { position: fixed; left: 8px; right: 8px; top: 64px; width: auto; }
  .dropdown-menu.dropdown-right, .dropdown-menu.dropdown-up { right: 0; }
  .layout-split > .panel-col { display: none; }
  .promo-dark { display: none; }
  .chart .axis text { font-size: 10px; }
}
@media (max-width: 400px) {
  .kpi-grid, .kpi-grid.cols-5, .kpi-grid.cols-4, .kpi-grid.cols-8 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .count-tiles, .mini-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .otp-input { width: 40px; height: 48px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }
@media print { .sidebar, .topbar, .mobile-nav, .page-actions, .bulk-bar, .toast-stack, .promo-dark { display: none !important; } .app-main { margin-left: 0 !important; } .card, .kpi, .panel { break-inside: avoid; box-shadow: none; } }

/* ---- Team & Access: roles list, permission matrix, scope picker ---- */
.role-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--r-md); color: inherit; text-decoration: none; border: 1px solid transparent; }
.role-item:hover { background: var(--color-surface-hover); }
.role-item.is-active { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
.role-item .entity-text { flex: 1; min-width: 0; }
.data-table.matrix th.center, .data-table.matrix td.center { text-align: center; }
.data-table.matrix td { padding: 6px 10px; }
.check.center { justify-content: center; }
.form-select.form-select-xs { height: 26px; padding: 0 22px 0 8px; font-size: 11.5px; border-radius: 6px; background-position: right 6px center; }
.form-select.ov-allow { border-color: var(--color-success); color: var(--color-success-text); background-color: var(--color-success-soft); }
.form-select.ov-deny { border-color: var(--color-danger); color: var(--color-danger-text); background-color: var(--color-danger-soft); }
.form-select.ov-role-on { color: var(--color-success-text); }
.form-select.ov-role-off { color: var(--text-muted); }
.sens-perm { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-surface-muted); }
.sens-perm .form-select-xs { width: 110px; flex: none; }
.scope-box { border: 1px solid var(--color-border); border-radius: var(--r-md); padding: 10px 12px; }
.scope-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 12px; max-height: 190px; overflow: auto; padding-top: 8px; border-top: 1px solid var(--color-border); }
.scope-list .check-text { font-size: 12.5px; }
@media (max-width: 767px) { .scope-list { grid-template-columns: 1fr 1fr; } }

/* ---- Settings & Integrations ---- */
.settings-tabs { margin-bottom: var(--gap); }
.settings-tabs .tab { display: inline-flex; align-items: center; gap: 6px; }
.settings-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); align-items: start; }
.settings-grid .span-2 { grid-column: span 2; }
.settings-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: var(--gap); align-items: start; }
.settings-subnav { position: sticky; top: calc(var(--topbar-h, 64px) + 16px); }
.subnav-group + .subnav-group { margin-top: 12px; }
.subnav-title { font-size: 12px; font-weight: 700; color: var(--color-text-secondary); text-transform: none; padding: 4px 10px 6px; }
.subnav-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--r-md); color: var(--color-text-secondary); font-size: 13.5px; font-weight: 500; text-decoration: none; }
.subnav-item:hover { background: var(--color-surface-hover); color: var(--color-text); }
.subnav-item.is-active { background: var(--color-primary-soft); color: var(--color-primary); font-weight: 600; }
.setting-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-surface-muted); }
.setting-row.plain { border: 0; background: transparent; padding: 6px 0; }
.setting-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; color: var(--color-text-secondary); }
.setting-text strong { font-size: 13.5px; color: var(--color-text); font-weight: 600; }
.setting-text code { font-size: 11.5px; word-break: break-all; }
.setting-link { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-surface); color: inherit; text-decoration: none; }
.setting-link:hover { border-color: var(--color-primary-soft-2); background: var(--color-primary-soft); }
.setting-link .setting-text { flex: 1; }
.owner-box { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--r-md); background: var(--color-surface-muted); }
.owner-box .entity-text { flex: 1; }
.ws-logo { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--color-border); background: #fff; object-fit: contain; padding: 4px; flex: none; }
.integration-row .setting-text { flex: 1; }
.integration-row { position: relative; flex-wrap: wrap; }
.int-meta { font-size: 11.5px; color: var(--color-text-muted); }
.integration-row .int-meta { width: 100%; text-align: right; margin-top: -4px; }
.integration-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.integration-tile { border: 1px solid var(--color-border); border-radius: var(--r-lg); padding: 16px; background: var(--color-surface); display: flex; flex-direction: column; }
.integration-tile .integration-logo { width: 40px; height: 40px; }
.integration-tile .flex.mt-3 { margin-top: auto; padding-top: 12px; }
.card-foot.center { text-align: center; }
.danger-zone { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 20px; border: 1px solid var(--color-danger-soft); background: var(--color-danger-soft); border-radius: var(--r-lg); color: var(--color-danger-text); }
.notif-matrix th.center, .notif-matrix td.center { text-align: center; width: 90px; }
.twofa-setup { display: grid; grid-template-columns: 200px 1fr; gap: 20px; align-items: start; }
.qr-box { width: 200px; height: 200px; border: 1px solid var(--color-border); border-radius: var(--r-lg); padding: 12px; background: #fff; display: flex; align-items: center; justify-content: center; }
.secret-key { padding: 10px 12px; background: var(--color-surface-muted); border: 1px dashed var(--color-border); border-radius: var(--r-md); font-size: 14px; letter-spacing: 1px; user-select: all; }
.otp-input { font-size: 22px; letter-spacing: 8px; text-align: center; font-weight: 700; }
.backup-codes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.backup-codes code { display: block; padding: 10px; text-align: center; background: var(--color-surface-muted); border: 1px solid var(--color-border); border-radius: var(--r-md); font-size: 15px; letter-spacing: 2px; font-weight: 600; }
.form-error { color: var(--color-danger-text); font-size: 12.5px; }
body.density-compact .data-table td { padding-top: 6px; padding-bottom: 6px; }
body.no-anim *, body.no-anim *::before, body.no-anim *::after { transition: none !important; animation: none !important; }
@media (max-width: 1279px) { .settings-grid { grid-template-columns: 1fr 1fr; } .settings-grid .span-2 { grid-column: span 2; } .integration-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1023px) { .settings-layout { grid-template-columns: minmax(0, 1fr); } .settings-subnav { position: static; } .settings-subnav .card-body { display: flex; flex-wrap: wrap; gap: 8px 16px; } .subnav-group + .subnav-group { margin-top: 0; } .integration-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 767px) { .settings-grid { grid-template-columns: 1fr; } .settings-grid .span-2 { grid-column: auto; } .integration-grid { grid-template-columns: 1fr; } .twofa-setup { grid-template-columns: 1fr; } .qr-box { margin: 0 auto; } .danger-zone { flex-direction: column; align-items: flex-start; } }
.settings-main .settings-grid { grid-template-columns: 1fr 1fr; }
@media (max-width: 1023px) { .settings-main .settings-grid { grid-template-columns: 1fr; } }


/* ---------- Dashboard fidelity pass (reference 1536x1024) ------------ */
.nav-more { display: contents; }
.nav-more summary { list-style: none; cursor: pointer; }
.nav-more summary::-webkit-details-marker { display: none; }
.nav-more-caret { margin-left: auto; width: 14px; height: 14px; transition: transform var(--t-fast); }
.nav-more[open] .nav-more-caret { transform: rotate(180deg); }
.nav-more .nav-sub { padding-left: 24px; height: 36px; font-size: 13px; }
body:not(.sidebar-expanded) .nav-more .nav-sub { padding-left: 0; }
.page-dashboard .page-header { margin: 2px 0 12px; }
.page-dashboard .page-title { font-size: 24px; letter-spacing: -.02em; }
.page-dashboard .page-title .wave { font-size: 22px; margin-left: 4px; vertical-align: -1px; color: inherit; }
.page-dashboard .page-subtitle { font-size: 14px; margin-top: 3px; color: var(--color-text-secondary); }
.dash-kpis { grid-template-columns: 1.4fr 1.4fr 1.4fr 1.4fr 1fr 2.12fr; gap: 12px; margin-bottom: 12px; }
.dash-kpis .kpi { padding: 15px 14px 13px 16px; gap: 12px; border-radius: 12px; min-height: 118px; box-shadow: 0 1px 2px rgba(15,23,42,.02), 0 4px 12px rgba(15,23,42,.025); }
.dash-kpis .kpi-icon { width: 44px; height: 44px; }
.dash-kpis .kpi-icon .icon { width: 20px; height: 20px; }
.dash-kpis .kpi-label { font-size: 12.5px; color: var(--color-text-secondary); }
.dash-kpis .kpi-value { font-size: 22px; margin-top: 6px; }
.dash-kpis .kpi-sub { font-size: 11.5px; margin-top: 8px; white-space: nowrap; }
.kpi-delta.kpi-delta-block { flex-direction: column; align-items: flex-start; gap: 3px; margin-top: 8px; }
.kpi-delta.kpi-delta-block .trend { font-size: 12.5px; }
.kpi-delta.kpi-delta-block .kpi-sub { font-size: 11.5px; margin-top: 0; }
.dash-kpis .kpi-with-spark .kpi-spark { right: 12px; bottom: 12px; width: 120px; height: 46px; opacity: .22; }
.dash-kpis .kpi-with-spark .kpi-spark rect, .dash-kpis .kpi-with-spark .kpi-spark path { fill: #34D399; stroke: none; }
.dash-layout { display: grid; grid-template-columns: minmax(0, 1fr) 294px; gap: 12px 16px; align-items: start; }
.dash-main { display: grid; gap: 12px; min-width: 0; }
.dash-row { display: grid; gap: 12px; min-width: 0; }
.dash-row-1 { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); }
.dash-row-2 { grid-template-columns: minmax(0, 1.41fr) minmax(0, 1fr); }
.dash-row-3 { grid-template-columns: minmax(0, 1.29fr) minmax(0, 1fr); }
.dash-rail { display: grid; gap: 12px; align-content: start; min-width: 0; }
.page-dashboard .card { border-radius: 12px; box-shadow: 0 1px 2px rgba(15,23,42,.02), 0 4px 12px rgba(15,23,42,.025); }
.page-dashboard .card-head { padding: 14px 16px 0; }
.page-dashboard .card-head + .card-body { padding-top: 8px; }
.page-dashboard .card-title { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.page-dashboard .card-body { padding: 10px 16px 12px; }
.page-dashboard .card-select { height: 32px; font-size: 12.5px; border-radius: 8px; padding: 0 26px 0 10px; color: var(--color-text); }
.page-dashboard .page-dashboard .chart-legend .dot { width: 8px; height: 8px; }
.dash-donut { gap: 20px; }
.dash-donut .chart { width: 168px; height: 168px; }
.dash-donut .donut-center .v { font-size: 20px; }
.dash-donut .donut-center .l { font-size: 11px; }
.dash-donut .legend { gap: 10px; font-size: 12.5px; }
.dash-donut .legend-row { gap: 8px; }
.dash-donut .legend-row .legend-pct { font-weight: 500; color: var(--color-text-secondary); min-width: 40px; }
.dash-table-wrap { padding: 8px 0 4px; }
.dash-table thead th { height: 34px; font-size: 10.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--color-text-muted); background: #F8FAFC; position: static; border-bottom: 1px solid var(--color-divider); }
.dash-table tbody td { height: 37px; font-size: 12.5px; padding: 3px 8px; }
.dash-table tbody tr:last-child td { border-bottom: 0; }
.dash-table.dash-table-compact tbody td { height: 31px; padding: 2px 8px; }
.dash-table.dash-table-compact thead th { height: 30px; }
.page-dashboard .page-content, .page-dashboard main.page-content { padding-bottom: 20px; }
.chart-tooltip.is-below { transform: translate(-50%, 14px); }
.chart-tooltip.is-rest { transform: translate(-50%, calc(-100% + 18px)); }
.dash-table .col-idx { font-size: 12px; width: 30px; }
.dash-table .entity { gap: 8px; }
.dash-table .entity-title { font-size: 12.5px; }
.dash-table .num.fw-600 { font-weight: 600; }
.dash-table .badge { height: 22px; font-size: 11.5px; border-radius: 6px; padding: 0 9px; }
.dash-company { font-weight: 700; font-size: 12.5px; }
.trend-pill { display: inline-flex; align-items: center; gap: 3px; height: 22px; padding: 0 8px; border-radius: 6px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.trend-pill .icon { width: 11px; height: 11px; stroke-width: 2.5; }
.trend-pill.up { background: #E9FAF3; color: #0E9F6E; }
.trend-pill.down { background: #FFF0F1; color: #E5484D; }
.trend-pill.flat { background: var(--color-surface-muted); color: var(--color-text-muted); }
.page-dashboard .stage-tiles { gap: 10px; }
.page-dashboard .stage-tile { padding: 12px 14px 12px; gap: 12px; border-radius: 10px; min-height: 86px; justify-content: space-between; }
.page-dashboard .stage-tile .l { font-size: 12px; font-weight: 600; }
.page-dashboard .stage-tile .v { font-size: 22px; line-height: 1; }
.page-dashboard .stage-tile.grey .l { color: #536987; }
.page-dashboard .quick-actions { gap: 2px; }
.page-dashboard .quick-action { padding: 6px 4px; gap: 12px; border-radius: 8px; }
.page-dashboard .quick-action .icon-tile { width: 34px; height: 34px; border-radius: 8px; }
.page-dashboard .quick-action .icon-tile .icon { width: 17px; height: 17px; }
.page-dashboard .quick-action-text strong { font-size: 13px; font-weight: 600; }
.page-dashboard .quick-action-text span { font-size: 11.5px; }
.dash-feed .feed-item { padding: 7px 0; gap: 10px; align-items: center; }
.dash-feed .feed-item:first-child { padding-top: 2px; }
.dash-feed .icon-tile { width: 32px; height: 32px; border-radius: 8px; }
.dash-feed .icon-tile .icon { width: 15px; height: 15px; }
.dash-feed .feed-text strong { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-feed .feed-text span { font-size: 11.5px; }
.dash-feed .feed-time { font-size: 11px; align-self: flex-start; padding-top: 2px; }
.dash-promo { padding: 16px 18px; border-radius: 12px; min-height: 80px; background: linear-gradient(120deg, #0F1B33 0%, #15264A 55%, #1A3A7A 100%); }
.dash-promo strong { font-size: 14px; line-height: 1.35; }
.dash-promo .promo-brand { margin-top: 8px; font-size: 12.5px; }
.dash-promo .promo-brand img { width: 18px; height: 18px; }
.dash-promo .promo-art { flex: none; width: 84px; height: 56px; object-fit: contain; }
@media (max-width: 1439px) { .dash-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } .dash-layout { grid-template-columns: minmax(0, 1fr) 280px; } .dash-donut { gap: 14px; } .dash-donut .chart { width: 136px; height: 136px; } .dash-donut .donut-center .v { font-size: 17px; } .dash-donut .legend { font-size: 12px; gap: 8px; } }
@media (max-width: 1279px) { .dash-layout { grid-template-columns: minmax(0, 1fr); } .dash-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dash-rail .dash-promo { grid-column: 1 / -1; } }
@media (max-width: 1023px) { .dash-row-1, .dash-row-2, .dash-row-3 { grid-template-columns: minmax(0, 1fr); } .dash-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .dash-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .dash-rail { grid-template-columns: 1fr; } .page-dashboard .stage-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } .dash-donut { flex-direction: column; align-items: stretch; } .dash-donut > div:first-child { margin: 0 auto; } }
@media (max-width: 400px) { .page-dashboard .stage-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---- Websites module ---- */
[data-website-panel] .panel-title { flex-wrap: wrap; row-gap: 4px; }
.site-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.partner-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.partner-tile { display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--color-border); border-radius: var(--r-md); color: inherit; min-width: 0; }
.partner-tile:hover { background: var(--color-surface-hover); }
.partner-tile .entity-text { min-width: 0; }
.mini-kpis.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1279px) { .site-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .site-cards { grid-template-columns: 1fr; } .partner-tiles { grid-template-columns: 1fr; } }

/* ---- Websites / Properties page fidelity ---- */
.website-page .page-header { margin-bottom: 14px; }
.website-kpis { gap: 12px; margin-bottom: 14px; }
.website-kpis .kpi { padding: 14px 16px; gap: 12px; align-items: center; border-radius: 12px; min-height: 104px; box-shadow: 0 1px 2px rgba(15,23,42,.02), 0 4px 12px rgba(15,23,42,.025); }
.website-kpis .kpi-icon { width: 44px; height: 44px; }
.website-kpis .kpi-body { display: flex; flex-direction: column; }
.website-kpis .kpi-value { order: 1; font-size: 22px; margin-top: 0; }
.website-kpis .kpi-label { order: 2; margin-top: 2px; font-size: 12.5px; }
.website-kpis .kpi-delta, .website-kpis .kpi-sub { order: 3; margin-top: 8px; }
.website-kpis .kpi-delta.kpi-delta-block { flex-direction: row; align-items: center; gap: 6px; }
.website-kpis .kpi-delta.kpi-delta-block .kpi-sub { margin-top: 0; }
.website-split { grid-template-columns: minmax(0, 1fr) 430px; gap: 16px; }
.website-page .table-toolbar { padding: 14px 16px 12px; gap: 12px; }
.website-page .data-table thead th { font-size: 11px; height: 40px; background: #F8FAFC; }
.website-page .data-table tbody td { height: 48px; }
.website-page .data-table .entity-title { font-size: 13px; }
.website-page .data-table .entity-sub { font-size: 11.5px; }
.website-page .cell-2 .trend { font-size: 11.5px; }
.website-page .avatar-stack .brand { border: 2px solid var(--color-surface); box-sizing: content-box; }
.website-page .avatar-stack .stack-more { height: 22px; font-size: 11px; }
.website-panel-head { align-items: flex-start; }
.website-panel-head .site-icon-56 { border-radius: 12px; }
.website-panel-title { font-size: 18px; flex-wrap: wrap; row-gap: 4px; }
.website-panel-title .ext-link { color: var(--color-primary); display: inline-flex; }
.website-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.website-stat { display: flex; align-items: center; gap: 8px; padding: 10px; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-surface); min-width: 0; }
.website-stat .icon-tile { width: 30px; height: 30px; border-radius: 50%; }
.website-stat .v { font-size: 15px; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; white-space: nowrap; }
.website-stat .l { font-size: 11px; color: var(--color-text-muted); white-space: nowrap; }
.website-quick { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.website-quick .btn-sm { height: 34px; font-size: 12.5px; }
.partner-tile .entity-sub strong { color: var(--color-text); font-size: 12.5px; }
@media (max-width: 1439px) { .website-split { grid-template-columns: minmax(0, 1fr) 400px; } .website-kpis .kpi-value { font-size: 20px; } }
@media (max-width: 1279px) { .website-split { grid-template-columns: minmax(0, 1fr); } }

/* ---- Add Website wizard (drawer for steps 1–2, workspace for steps 3–4) ---- */
.ww-overlay { position: fixed; inset: 0; z-index: var(--z-drawer); background: rgba(15,23,42,.42); animation: fade .15s ease; }
.ww-panel { position: absolute; background: var(--color-surface); display: flex; flex-direction: column; box-shadow: var(--shadow-xl); overflow: hidden; }
.ww-overlay.is-drawer .ww-panel { top: 0; right: 0; bottom: 0; width: min(528px, 100%); animation: slideIn .22s cubic-bezier(.2,.8,.2,1); }
.ww-overlay.is-workspace .ww-panel { top: 14px; bottom: 14px; left: calc(var(--sidebar-w) + 16px); right: 16px; border-radius: 16px; }
body.sidebar-collapsed .ww-overlay.is-workspace .ww-panel { left: calc(var(--sidebar-rail-w) + 16px); }
@keyframes slideIn { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
.ww-head { display: flex; align-items: center; gap: 14px; padding: 14px 20px; border-bottom: 1px solid var(--color-divider); flex: none; }
.ww-head-icon { width: 50px; height: 50px; border-radius: 50%; background: var(--color-primary-soft-2); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.ww-head-text { flex: 1; min-width: 0; }
.ww-head-text h1 { font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--color-text); }
.ww-head-text p { font-size: 13px; color: var(--color-text-secondary); margin-top: 2px; }
.is-workspace .ww-head-text h1 { font-size: 22px; }
.ww-close { width: 36px; height: 36px; }
.ww-draft-bar { display: flex; align-items: center; gap: 6px; padding: 6px 20px; background: var(--color-warning-soft); color: var(--color-warning-text); font-size: 12px; }
.ww-draft-bar .link { color: inherit; text-decoration: underline; font-weight: 600; }
.ww-drawer-scroll { flex: 1; overflow-y: auto; min-height: 0; }
.ww-drawer-body { display: grid; grid-template-columns: 158px minmax(0, 1fr); }
.ww-content-business { border-top: 1px solid var(--color-divider); padding: 18px 20px 26px; }
.ww-content-business .ww-grid.cols-4 .form-select { font-size: 12.5px; padding-left: 34px; padding-right: 26px; }
.ww-rail { padding: 18px 8px 18px 12px; border-right: 1px solid var(--color-divider); background: #FBFCFE; display: flex; flex-direction: column; gap: 4px; position: relative; align-self: start; position: sticky; top: 0; }
.ww-rail-item { display: flex; align-items: flex-start; gap: 10px; padding: 8px 6px; border-radius: 8px; text-align: left; color: var(--color-text-secondary); position: relative; }
.ww-rail-item:hover { background: var(--color-surface-muted); }
.ww-rail-item:not(:last-child)::after { content: ""; position: absolute; left: 17px; top: 34px; bottom: -6px; width: 2px; background: var(--color-border); }
.ww-rail-num { width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid var(--color-border-strong); background: var(--color-surface); color: var(--color-text-muted); font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex: none; position: relative; z-index: 1; }
.ww-rail-item.is-active .ww-rail-num { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.ww-rail-item.is-active { color: var(--color-primary-text); background: var(--color-primary-soft); }
.ww-rail-item.is-done .ww-rail-num { background: var(--color-success); border-color: var(--color-success); color: #fff; }
.ww-rail-text { display: flex; flex-direction: column; line-height: 1.25; }
.ww-rail-text strong { font-size: 12.5px; font-weight: 600; color: var(--color-text); white-space: nowrap; }
.ww-rail-item.is-active .ww-rail-text strong { color: var(--color-primary-text); }
.ww-rail-text span { font-size: 11.5px; color: var(--color-text-muted); }
.ww-content { padding: 18px 20px 22px; min-height: 0; min-width: 0; }
.ww-banner { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 10px; background: var(--color-primary-soft); border: 1px solid var(--color-primary-soft-2); color: var(--color-primary); margin-bottom: 18px; }
.ww-banner > .icon { flex: none; }
.ww-banner strong { display: block; font-size: 13px; font-weight: 600; color: var(--color-primary-text); }
.ww-banner span { font-size: 12.5px; color: var(--color-text-secondary); }
.ww-h2 { font-size: 17px; font-weight: 700; letter-spacing: -.01em; color: var(--color-text); display: flex; align-items: center; gap: 8px; }
.ww-h2.with-check .icon { color: var(--color-primary); }
.is-workspace .ww-h2 { font-size: 20px; color: var(--color-primary-text); }
.ww-sub { font-size: 12.5px; color: var(--color-text-secondary); margin: 2px 0 14px; }
.ww-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.ww-title-row .ww-sub { margin-bottom: 0; }
.ww-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.ww-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ww-grid.cols-3.logo-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.12fr); }
.ww-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ww-grid.cols-owner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); margin-top: 14px; }
.ww-grid + .ww-grid { margin-top: 14px; }
.ww-grid.ww-align-end { align-items: end; }
.ww-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ww-field.full { grid-column: 1 / -1; }
.ww-label { font-size: 12.5px; font-weight: 600; color: var(--color-text); }
.ww-label .req { color: var(--color-danger); margin-left: 2px; }
.ww-label-opt { font-weight: 400; color: var(--color-text-muted); font-size: 11.5px; }
.ww-hint { font-size: 11.5px; color: var(--color-text-muted); }
.ww-error { font-size: 12px; color: var(--color-danger-text); display: flex; align-items: center; gap: 4px; }
.ww-control { position: relative; display: flex; align-items: center; }
.ww-control .form-control, .ww-control .form-select { height: 40px; font-size: 13.5px; border-radius: 8px; }
.ww-control.has-icon .form-control, .ww-control.has-icon .form-select { padding-left: 38px; }
.ww-control.has-prefix .form-control { padding-left: 30px; }
.ww-control.has-suffix .form-control { padding-right: 52px; }
.ww-icon, .ww-prefix, .ww-suffix { position: absolute; display: inline-flex; align-items: center; color: var(--color-text-muted); pointer-events: none; }
.ww-icon { left: 12px; color: var(--color-primary); }
.ww-icon .flag { width: 18px; height: 12px; border-radius: 2px; }
.ww-prefix { left: 12px; font-weight: 600; color: var(--color-primary); }
.ww-suffix { right: 12px; font-size: 12.5px; font-weight: 500; }
.ww-addon { position: absolute; right: 8px; width: 30px; height: 30px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; color: var(--color-text-muted); }
.ww-addon:hover { background: var(--color-surface-muted); color: var(--color-text); }
.ww-domain-state { position: absolute; right: 12px; color: var(--color-success); display: inline-flex; }
.ww-domain-state.is-bad { color: var(--color-danger); }
.ww-avatar { width: 22px; height: 22px; border-radius: 50%; background: var(--color-primary-soft-2); color: var(--color-primary-text); font-size: 9.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.ww-avatar.sm { width: 18px; height: 18px; font-size: 8px; }
.ww-brand { width: 22px; height: 22px; border-radius: 6px; background: #0B1220; color: #fff; font-size: 9px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; font-style: italic; }
.ww-logo { display: flex; align-items: center; gap: 12px; }
.ww-logo-tile { width: 50px; height: 50px; border-radius: 50%; background: #0B1220; color: #fff; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; flex: none; }
.ww-logo-mono { font-size: 15px; font-weight: 800; letter-spacing: -.02em; }
.ww-logo-actions { display: flex; flex-direction: column; gap: 6px; }
.ww-upload { cursor: pointer; }
.ww-remove { background: var(--color-danger-soft); color: var(--color-danger-text); height: 28px; }
.ww-logo-actions .btn-xs { height: 28px; padding: 0 8px; font-size: 11.5px; gap: 5px; white-space: nowrap; }
.ww-logo { gap: 10px; }
.ww-remove:disabled { opacity: .5; cursor: not-allowed; }
.ww-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; min-height: 40px; }
.ww-chips.is-invalid { outline: 1px solid var(--color-danger); border-radius: 8px; }
.ww-chip { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 8px 0 10px; border-radius: 8px; background: var(--color-primary-soft); color: var(--color-primary-text); font-size: 12.5px; font-weight: 500; }
.ww-chip .flag { width: 18px; height: 12px; border-radius: 2px; }
.ww-chip-x { display: inline-flex; color: inherit; opacity: .7; border-radius: 4px; }
.ww-chip-x:hover { opacity: 1; background: rgba(37,99,235,.12); }
.ww-chip-add { display: inline-flex; align-items: center; gap: 6px; }
.ww-chip-btn { display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 0 10px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface); font-size: 12.5px; font-weight: 500; color: var(--color-primary-text); }
.ww-chip-btn:hover { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
.ww-chip-select, .ww-chip-input { height: 30px; font-size: 12.5px; border: 1px solid var(--color-border); border-radius: 8px; padding: 0 8px; background: var(--color-surface); min-width: 150px; }
.ww-radios { display: flex; gap: 10px; flex-wrap: wrap; }
.ww-radio { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px 0 10px; border-radius: 8px; font-size: 13px; font-weight: 500; color: var(--color-text-secondary); cursor: pointer; border: 1px solid transparent; }
.ww-radio input { position: absolute; opacity: 0; width: 0; height: 0; }
.ww-radio-dot { width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--color-border-strong); background: #fff; display: inline-block; }
.ww-radio.is-on { background: var(--color-success-soft); color: var(--color-success-text); font-weight: 600; }
.ww-radio.is-on .ww-radio-dot { border: 5px solid var(--color-primary); }
.ww-toggle-row { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ww-toggle-row.full { grid-column: 1 / -1; }
.ww-toggle { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; }
.ww-toggle .toggle { width: 46px; height: 26px; }
.ww-toggle .toggle-track::after { width: 20px; height: 20px; }
.ww-toggle .toggle input:checked + .toggle-track::after { transform: translateX(20px); }
.ww-toggle-state { font-size: 13.5px; font-weight: 600; color: var(--color-text); }
.ww-checks { display: flex; gap: 20px; flex-wrap: wrap; }
.ww-checks .check-text { font-size: 13px; }
.ww-note { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 8px; background: var(--color-primary-soft); color: var(--color-text-secondary); font-size: 12.5px; margin-top: 14px; }
.ww-note .icon { color: var(--color-primary); flex: none; margin-top: 2px; }
.ww-ssl { display: flex; align-items: center; gap: 10px; height: 40px; }
.ww-foot { display: flex; align-items: center; gap: 10px; padding: 14px 20px; border-top: 1px solid var(--color-divider); background: var(--color-surface); flex: none; }
.ww-foot-spacer { flex: 1; }
.ww-foot .btn { height: 42px; padding: 0 18px; border-radius: 8px; }
/* workspace */
.ww-stepper { display: flex; align-items: center; padding: 12px 24px; border-bottom: 1px solid var(--color-divider); gap: 12px; flex: none; }
.ww-step { display: flex; align-items: center; gap: 12px; text-align: left; flex: none; }
.ww-step-num { width: 32px; height: 32px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; background: var(--color-surface-muted); color: var(--color-text-muted); flex: none; }
.ww-step.is-active .ww-step-num { background: var(--color-primary); color: #fff; }
.ww-step.is-done .ww-step-num { background: var(--color-success); color: #fff; }
.ww-step-text { display: flex; flex-direction: column; line-height: 1.25; }
.ww-step-text strong { font-size: 14px; font-weight: 600; color: var(--color-text); }
.ww-step.is-active .ww-step-text strong, .ww-step.is-done .ww-step-text strong { color: var(--color-primary-text); }
.ww-step-text span { font-size: 12px; color: var(--color-text-muted); }
.ww-step.is-done .ww-step-text span { color: var(--color-success-text); }
.ww-step-line { flex: 1; height: 2px; background: var(--color-border); border-radius: 2px; }
.ww-workspace-body { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 16px; padding: 18px 24px; overflow-y: auto; align-items: start; background: var(--color-bg); }
.ww-workspace-body .ww-content { padding: 0; overflow: visible; }
.ww-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.ww-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ww-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; padding: 14px 16px 16px; box-shadow: 0 1px 2px rgba(15,23,42,.02); }
.ww-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.ww-card-head .icon-tile { width: 40px; height: 40px; border-radius: 10px; }
.ww-card-head h3 { font-size: 15px; font-weight: 700; color: var(--color-text); }
.ww-card-head p { font-size: 12.5px; color: var(--color-text-secondary); margin-top: 1px; }
.ww-card-body { display: flex; flex-direction: column; gap: 14px; }
.ww-card-body > .ww-grid { margin-top: 0; }
.ww-models { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.ww-model { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 4px; padding: 12px 6px 10px; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-surface); text-align: center; min-height: 92px; }
.ww-model:hover { border-color: var(--color-border-strong); }
.ww-model.is-on { border-color: var(--color-primary); background: var(--color-primary-soft); box-shadow: 0 0 0 1px var(--color-primary) inset; }
.ww-model-icon { width: 28px; height: 28px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; color: var(--color-primary); background: var(--color-primary-soft-2); }
.ww-model:nth-child(2) .ww-model-icon { color: var(--color-purple); background: var(--color-purple-soft); } .ww-model:nth-child(3) .ww-model-icon { color: var(--color-success); background: var(--color-success-soft); } .ww-model:nth-child(4) .ww-model-icon { color: var(--color-text-secondary); background: var(--color-surface-muted); } .ww-model:nth-child(5) .ww-model-icon { color: var(--color-text-secondary); background: var(--color-surface-muted); }
.ww-model strong { font-size: 13px; font-weight: 600; color: var(--color-text); }
.ww-model.is-on strong { color: var(--color-primary-text); }
.ww-model span { font-size: 10.5px; line-height: 1.25; color: var(--color-text-muted); }
.ww-models.is-invalid { outline: 1px solid var(--color-danger); border-radius: 10px; }
.ww-side { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 0; }
.ww-progress { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; padding: 16px; display: flex; align-items: center; gap: 14px; }
.ww-progress strong { display: block; font-size: 14px; font-weight: 700; color: var(--color-text); }
.ww-progress span { font-size: 11.5px; color: var(--color-text-secondary); line-height: 1.4; }
.ww-ring { position: relative; width: 80px; height: 80px; flex: none; display: inline-flex; align-items: center; justify-content: center; }
.ww-ring-svg { position: absolute; inset: 0; }
.ww-ring > span { position: relative; font-size: 15px; font-weight: 700; color: var(--color-primary-text); }
.ww-progress-list { list-style: none; margin: 0; padding: 4px 16px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; }
.ww-progress-list li { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--color-divider); font-size: 13px; }
.ww-progress-list li:last-child { border-bottom: 0; }
.ww-pl-dot { width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid var(--color-border-strong); display: inline-flex; align-items: center; justify-content: center; color: #fff; flex: none; }
.ww-progress-list li.is-done .ww-pl-dot { background: var(--color-success); border-color: var(--color-success); }
.ww-progress-list li.is-active .ww-pl-dot { border: 5px solid var(--color-primary); }
.ww-pl-text { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.25; }
.ww-pl-text strong { font-weight: 600; color: var(--color-text); }
.ww-pl-text span { font-size: 11.5px; color: var(--color-text-muted); }
.ww-progress-list li.is-active .ww-pl-text strong { color: var(--color-primary-text); }
.ww-pl-state { font-size: 12px; color: var(--color-success-text); font-weight: 500; }
.ww-tip { display: flex; gap: 10px; padding: 14px; border-radius: 12px; background: var(--color-primary-soft); border: 1px solid var(--color-primary-soft-2); }
.ww-tip > .icon { color: var(--color-primary); flex: none; margin-top: 1px; }
.ww-tip strong { display: block; font-size: 13.5px; font-weight: 700; color: var(--color-text); }
.ww-tip span { font-size: 12px; color: var(--color-text-secondary); line-height: 1.45; }
@media (max-width: 1279px) { .ww-workspace-body { grid-template-columns: minmax(0, 1fr); } .ww-workspace-body .ww-side { position: static; top: auto; } .ww-models { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1023px) { .ww-cols { grid-template-columns: minmax(0, 1fr); } .ww-overlay.is-workspace .ww-panel { left: 12px; right: 12px; top: 10px; bottom: 10px; } .ww-stepper { overflow-x: auto; scrollbar-width: none; } .ww-step-text span { display: none; } .ww-grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ww-grid.cols-owner { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .ww-overlay.is-drawer .ww-panel, .ww-overlay.is-workspace .ww-panel { inset: 0; border-radius: 0; width: 100%; } .ww-drawer-body { grid-template-columns: 1fr; } .ww-rail { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--color-divider); padding: 10px 12px; gap: 8px; } .ww-rail-item { flex: none; padding: 6px 8px; } .ww-rail-item::after { display: none; } .ww-rail-text span { display: none; } .ww-grid, .ww-grid.cols-3, .ww-grid.cols-4 { grid-template-columns: 1fr; } .ww-models { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ww-foot { position: sticky; bottom: 0; flex-wrap: wrap; } .ww-foot .btn { flex: 1 1 40%; min-height: 44px; } .ww-foot-spacer { display: none; } .ww-head-text p { display: none; } .ww-title-row { flex-direction: column; } }

.website-page .data-table thead th, .website-page .data-table tbody td { padding-left: 6px; padding-right: 6px; }
.website-page .data-table { font-size: 12px; }
.website-page .data-table .col-sel { width: 36px; }
.website-page .data-table .entity { gap: 8px; }
.website-page .data-table .entity-title { font-size: 12.5px; }
.website-page .data-table .flag-cell span { font-size: 12px; }
.website-page .data-table .avatar-stack .brand { width: 22px; height: 22px; }
.website-page .data-table tbody td { height: 46px; }
.website-kpis .kpi { min-height: 96px; padding: 12px 16px; }
.website-stat .v { font-size: 14px; }
.website-stat .l { font-size: 10.5px; white-space: normal; line-height: 1.2; }
.website-stat .icon-tile { width: 28px; height: 28px; }
.partner-tile { flex-wrap: wrap; padding: 8px 10px; }
.partner-tile .entity-text { flex: 1; }
.partner-tile .entity-sub { white-space: normal; font-size: 11px; line-height: 1.3; }
.website-panel-title { font-size: 17px; }

.website-split { grid-template-columns: minmax(0, 1fr) 404px; }
.website-page .data-table thead th, .website-page .data-table tbody td { padding-left: 5px; padding-right: 5px; }
.website-page .data-table thead th:first-child, .website-page .data-table tbody td:first-child { padding-left: 12px; }
.website-page .data-table thead th:last-child, .website-page .data-table tbody td:last-child { padding-right: 10px; }
.website-page .data-table .col-sel { width: 32px; }
.website-page .data-table .badge { height: 22px; padding: 0 7px; font-size: 11px; }
.website-page .data-table .col-actions { width: 40px; }
.website-page .data-table .avatar-stack .stack-more { height: 20px; padding: 0 5px; font-size: 10.5px; }
.website-page .data-table .avatar-stack > * { margin-left: -6px; }
.website-page .data-table .entity-sub { font-size: 11px; }
.website-page .data-table .text-secondary { font-size: 12px; }
@media (max-width: 1439px) { .website-split { grid-template-columns: minmax(0, 1fr) 380px; } }
.website-split { grid-template-columns: minmax(0, 1fr) 392px; }
.website-page .data-table .entity-text { max-width: 132px; }
.website-page .data-table td.text-secondary { max-width: 96px; overflow: hidden; text-overflow: ellipsis; }
.website-page .data-table thead th { letter-spacing: 0; }
@media (max-width: 1279px) { .ww-workspace-body { display: block; } .ww-workspace-body .ww-side { position: static; margin-top: 14px; } }
.website-split { grid-template-columns: minmax(0, 1fr) 372px; }
.website-page .data-table .entity-text { max-width: 124px; }
.website-page .data-table td.text-secondary { max-width: 88px; }
.website-panel-head .site-icon-56 { width: 48px; height: 48px; font-size: 18px; }
.website-panel-title { font-size: 16px; }
.website-panel-head .panel-head-actions { gap: 4px; }
.website-panel-head .panel-head-actions .btn-sm { padding: 0 10px; }
.website-split { grid-template-columns: minmax(0, 1fr) 400px; }
.website-page .data-table thead th { white-space: normal; line-height: 1.15; }
.website-page .data-table thead th .th-sub { display: block; font-size: 10.5px; font-weight: 500; }
.website-page .data-table thead th .sort-th, .website-page .data-table thead th a { white-space: normal; }
.website-page .data-table .entity-text { max-width: 134px; }
.website-page .data-table td.text-secondary { max-width: 96px; }
.website-panel-head .site-icon-56 { width: 52px; height: 52px; }
.website-page .data-table thead th .th-sort { display: inline-flex; flex-wrap: wrap; align-items: center; row-gap: 1px; }
.website-page .data-table thead th .th-sort .th-sub { order: 3; flex: 1 1 100%; }

/* brand tile sizes used by the Companies module */
.brand-34 { width: 34px; height: 34px; font-size: 11px; border-radius: 50%; } .brand-72 { width: 72px; height: 72px; font-size: 20px; border-radius: 50%; }

/* ---- Companies / Partners page fidelity (design-reference/Forms/Company/company-Main.png) ---- */
.company-page .page-header { margin-bottom: 14px; }
.company-page .page-header .page-title { font-size: 26px; }
.company-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.company-kpis .kpi { padding: 14px 16px; gap: 14px; align-items: flex-start; border-radius: 12px; min-height: 96px; box-shadow: 0 1px 2px rgba(15,23,42,.02), 0 4px 12px rgba(15,23,42,.025); }
.company-kpis .kpi-icon { width: 44px; height: 44px; border-radius: 12px; }
.company-kpis .kpi-icon .icon { width: 21px; height: 21px; }
.company-kpis .kpi-label { font-size: 12.5px; color: var(--color-text-secondary); }
.company-kpis .kpi-value { font-size: 22px; margin-top: 4px; }
.company-kpis .kpi-delta, .company-kpis .kpi-sub { margin-top: 7px; font-size: 12px; }
.company-kpis .kpi-delta .trend { font-size: 12px; }
.kpi-up { display: inline-flex; align-items: center; gap: 2px; color: var(--color-success-text); font-weight: 600; font-size: 12px; }
.kpi-up .icon { width: 12px; height: 12px; stroke-width: 2.5; }
.company-split { grid-template-columns: minmax(0, 1.03fr) minmax(0, 0.985fr); gap: 14px; }
.company-toolbar { padding: 14px 14px 12px; gap: 10px; flex-wrap: wrap; }
.company-toolbar .seg-tabs { padding: 3px; gap: 2px; border-radius: 10px; }
.company-toolbar .seg-tab { height: 34px; padding: 0 10px; font-size: 12.5px; gap: 6px; }
.company-toolbar .seg-tab .seg-count { min-width: 20px; height: 18px; font-size: 10.5px; }
.company-toolbar .filter-bar { gap: 8px; }
.company-search { width: 168px; }
.company-search > .icon { left: 10px; }
.company-search .form-control { padding-left: 32px; height: 36px; font-size: 12.5px; }
.company-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; flex-basis: 100%; padding-top: 4px; }
.company-filters[hidden] { display: none; }
.company-table { font-size: 12px; }
.company-table thead th { height: 40px; font-size: 10.5px; letter-spacing: .01em; text-transform: uppercase; color: var(--color-text-muted); background: #F8FAFC; padding-left: 8px; padding-right: 8px; }
.company-table thead th .th-sort-icon { display: none; }
.company-table thead th.is-sorted .th-sort-icon { display: inline-block; }
.company-table thead th:first-child, .company-table tbody td:first-child { padding-left: 8px; }
.company-table thead th, .company-table tbody td { padding-left: 4px; padding-right: 4px; }
.company-table thead th.num .th-sort { justify-content: flex-end; }
.company-table thead th .th-sort { display: inline-flex; align-items: center; gap: 3px; }
.company-table thead th:last-child, .company-table tbody td:last-child { padding-right: 12px; }
.company-table tbody td { height: 48px; padding-top: 5px; padding-bottom: 5px; }
.company-table .col-sel { width: 22px; }
.company-table .col-sel .idx { min-width: 14px; font-size: 11.5px; }
.company-table .entity { gap: 7px; }
.company-table .entity-title { font-size: 13px; }
.company-table .entity-sub { font-size: 11.5px; }
.company-table .entity-text { max-width: 94px; }
.company-table .badge-status { height: 21px; font-size: 10.5px; padding: 0 5px; border-radius: 6px; font-weight: 600; }
.company-table .brand-34 { width: 30px; height: 30px; }
.company-table .manager-cell { gap: 6px; }
.company-table .manager-cell .avatar-26 { width: 24px; height: 24px; font-size: 9.5px; }
.company-table .manager-name { font-size: 12px; font-weight: 500; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 96px; }
.company-table thead th:nth-child(5) .th-sort, .company-table thead th:nth-child(7) .th-sort { white-space: normal; display: inline-block; width: 50px; text-align: right; line-height: 1.15; }
.company-table thead th:nth-child(5), .company-table thead th:nth-child(7) { width: 50px; }
.company-table thead th:nth-child(6) { width: 54px; }
.company-table thead th:nth-child(8) { width: 46px; }
.company-table td.num, .company-table th.num { padding-left: 3px; padding-right: 3px; }
.company-table td.num { font-size: 12.5px; }
.company-table td.num.fw-600 { font-size: 12.5px; font-weight: 700; }
.company-table .trend-pill { height: 21px; padding: 0 5px; font-size: 11px; }
.company-table .col-actions { width: 56px; }
.company-table thead th.col-actions { letter-spacing: 0; padding-left: 0; }
.company-table thead th:last-child, .company-table tbody td:last-child { padding-right: 8px; }
.company-table .row-actions .btn-icon { width: 28px; height: 28px; border: 1px solid var(--color-border); border-radius: 7px; }
.company-page .pagination-bar { padding: 14px 16px; font-size: 12.5px; }
.company-page .pagination-bar .page-btn { min-width: 30px; height: 30px; }
/* panel */
.company-panel { border-radius: 14px; }
.cp-head { padding: 18px 20px 0; gap: 16px; align-items: center; }
.cp-logo.brand-72 { width: 72px; height: 72px; border-radius: 50%; font-size: 20px; }
.cp-logo.brand-72.has-logo img { padding: 12%; }
.cp-title { font-size: 20px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; color: var(--color-text); }
.cp-sub { font-size: 13px; color: var(--color-text-secondary); margin-top: 2px; }
.cp-badges { display: flex; align-items: center; gap: 10px; margin-top: 8px; flex-wrap: wrap; }
.cp-badges .cp-status { height: 24px; padding: 0 10px; border-radius: 6px; font-size: 12px; }
.cp-since { font-size: 13px; color: var(--color-text-secondary); }
.cp-head .panel-head-actions { align-self: flex-start; gap: 8px; }
.cp-head .panel-head-actions .btn-sm { height: 34px; padding: 0 12px; font-size: 13px; gap: 6px; }
.cp-head .bordered-menu .btn-icon { width: 34px; height: 34px; border: 1px solid var(--color-border); border-radius: 8px; }
.cp-tabs { padding: 12px 20px 0; }
.cp-tabs .tab { padding: 8px 10px; font-size: 13px; }
.cp-tabs .tab .count-badge { background: var(--color-surface-muted); color: var(--color-text-secondary); }
.cp-body { padding: 12px 20px 18px; gap: 10px; }
.cp-stack { gap: 10px; }
.cp-tiles { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.cp-tile { border-radius: 10px; padding: 10px 8px 9px; border: 1px solid transparent; min-width: 0; }
.cp-tile.tone-green { background: #F0FDF4; border-color: #DCFCE7; color: inherit; } .cp-tile.tone-blue { background: #EFF6FF; border-color: #DBEAFE; color: inherit; } .cp-tile.tone-red { background: #FEF2F2; border-color: #FEE2E2; color: inherit; } .cp-tile.tone-amber { background: #FFFBEB; border-color: #FEF3C7; color: inherit; }
.cp-tile .v { font-size: 15.5px; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; white-space: nowrap; color: var(--color-text); }
.cp-tile.tone-green .v { color: #15803D; } .cp-tile.tone-blue .v { color: #1D4ED8; } .cp-tile.tone-red .v { color: #B91C1C; }
.cp-tile .l { font-size: 10.5px; color: var(--color-text-secondary); margin-top: 3px; line-height: 1.2; letter-spacing: -.01em; }
.cp-tile .cp-trend { margin-top: 5px; }
.cp-trend { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.cp-trend .icon { width: 11px; height: 11px; stroke-width: 2.5; }
.cp-trend.up { color: #15803D; } .cp-trend.down { color: #DC2626; } .cp-trend.flat, .cp-trend.muted { color: var(--color-text-muted); font-weight: 500; }
.cp-grid-2 { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 8px; }
.cp-grid-3 { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr) minmax(0, 1.02fr); gap: 8px; align-items: start; }
.cp-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 10px 10px; min-width: 0; }
.cp-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.cp-card-head h4 { font-size: 13px; font-weight: 700; color: var(--color-text); letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-card-head h4 .muted { font-weight: 500; color: var(--color-text-muted); font-size: 10.5px; }
.cp-card-head h4 { min-width: 0; }
.cp-card-head .card-select { height: 26px; font-size: 11px; padding: 0 20px 0 7px; background-position: right 5px center; border-radius: 6px; max-width: 118px; }
.cp-card-head .card-link { font-size: 11.5px; }
.cp-legend { font-size: 12px; gap: 14px; margin-bottom: 2px; }
.cp-chart { margin: 0 -6px 0 -10px; }
.cp-traffic { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.cp-traffic-tile { background: #F5F8FC; border: 1px solid #EAF0F7; border-radius: 10px; padding: 9px 8px; min-width: 0; }
.cp-traffic-tile .v { font-size: 14px; font-weight: 700; letter-spacing: -.02em; color: var(--color-text); white-space: nowrap; }
.cp-traffic-tile .l { font-size: 11px; color: var(--color-text-secondary); margin-top: 2px; }
.cp-traffic-tile .cp-trend { margin-top: 5px; }
.cp-rates { margin-top: 10px; display: flex; flex-direction: column; }
.cp-rate { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 0; border-top: 1px solid var(--color-divider); font-size: 12.5px; }
.cp-rate span { color: var(--color-text-secondary); display: inline-flex; align-items: center; gap: 4px; }
.cp-rate span .icon { width: 11px; height: 11px; }
.cp-rate strong { font-weight: 700; color: var(--color-text); }
.cp-sites { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.cp-sites li .site-icon-24 { width: 20px; height: 20px; font-size: 10px; }
.cp-sites li { display: flex; align-items: center; gap: 6px; padding: 5px 0; border-bottom: 1px solid var(--color-divider); min-width: 0; }
.cp-sites li:last-child { border-bottom: 0; }
.cp-rank { width: 12px; font-size: 11px; color: var(--color-text-muted); text-align: center; flex: none; }
.cp-site-name { flex: 1; min-width: 0; font-size: 11.5px; font-weight: 500; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-site-name:hover { color: var(--color-primary-text); }
.cp-site-val { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.2; flex: none; }
.cp-site-val strong { font-size: 12px; font-weight: 700; }
.cp-site-val .cp-trend { font-size: 11px; }
.cp-mini { width: 100%; border-collapse: collapse; font-size: 12px; }
.cp-mini th { text-align: left; font-size: 10.5px; font-weight: 600; color: var(--color-text-muted); padding: 5px 3px; background: #F8FAFC; }
.cp-mini th:first-child { padding-left: 6px; border-radius: 6px 0 0 6px; } .cp-mini th:last-child { border-radius: 0 6px 6px 0; }
.cp-mini td { padding: 6px 3px; border-bottom: 1px solid var(--color-divider); white-space: nowrap; font-size: 11.5px; }
.cp-mini td:first-child { padding-left: 5px; color: var(--color-text-secondary); }
.cp-mini tr:last-child td { border-bottom: 0; }
.cp-mini .num, .cp-mini th.num { text-align: right; }
.cp-mini .badge { height: 20px; font-size: 10.5px; padding: 0 5px; border-radius: 5px; }
.cp-mini tr[data-href] { cursor: pointer; }
.cp-contact-top { display: flex; align-items: center; gap: 8px; }
.cp-contact-top .avatar-44 { width: 40px; height: 40px; font-size: 13px; }
.cp-contact-text { min-width: 0; flex: 1; }
.cp-contact-name { font-size: 13px; font-weight: 700; color: var(--color-text); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cp-contact-name a { color: inherit; }
.cp-primary { height: 18px; font-size: 10.5px; padding: 0 6px; border-radius: 5px; }
.cp-contact-role { font-size: 11.5px; color: var(--color-text-secondary); margin-top: 1px; }
.cp-channels { display: flex; gap: 5px; margin-top: 10px; flex-wrap: wrap; }
.cp-channels.sm { margin-top: 0; }
.cp-chan { width: 28px; height: 28px; border-radius: 8px; background: #F5F8FC; border: 1px solid #EAF0F7; display: inline-flex; align-items: center; justify-content: center; color: var(--color-text-secondary); }
.cp-chan:hover { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
.cp-chan-mail { color: #2563EB; }
.cp-channels.sm .cp-chan { width: 26px; height: 26px; border-radius: 6px; }
.brand-icon { display: inline-block; vertical-align: middle; }
.cp-contact-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--color-divider); }
.cp-contact-meta .l { display: block; font-size: 10.5px; color: var(--color-text-muted); white-space: nowrap; }
.cp-contact-meta strong { font-size: 12px; font-weight: 600; color: var(--color-text); white-space: nowrap; }
.cp-send { width: 100%; margin-top: 12px; height: 38px; gap: 8px; font-size: 13px; border-radius: 8px; }
.cp-activity .cp-feed { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 20px; }
.cp-feed-item { display: flex; align-items: center; gap: 8px; padding: 5px 0; min-width: 0; }
.cp-feed-item .icon-tile { width: 24px; height: 24px; border-radius: 6px; }
.cp-feed-text { flex: 1; min-width: 0; font-size: 12.5px; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cp-feed-time { font-size: 11.5px; color: var(--color-text-muted); white-space: nowrap; }
.cp-empty { font-size: 12.5px; color: var(--color-text-muted); padding: 8px 0; }
.cp-contact-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--color-divider); }
.cp-contact-row:last-of-type { border-bottom: 0; }
@media (max-width: 1439px) { .company-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } .company-split { grid-template-columns: minmax(0, 1fr) 372px; } .company-table [data-priority="2"] { display: none; } .cp-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cp-grid-2 { grid-template-columns: 1fr; } .cp-grid-3 { grid-template-columns: 1fr 1fr; } .cp-grid-3 .cp-contact { grid-column: 1 / -1; } .cp-head { gap: 12px; } .cp-logo.brand-72 { width: 56px; height: 56px; } .cp-open span { display: none; } .cp-open.btn-sm { width: 34px; padding: 0; justify-content: center; } .cp-title { font-size: 17px; } .cp-badges { gap: 6px; } .cp-body, .cp-tabs { padding-left: 14px; padding-right: 14px; } .cp-head { padding-left: 14px; padding-right: 14px; } }
@media (max-width: 1279px) { .company-split { grid-template-columns: minmax(0, 1fr); } .cp-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); } .cp-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cp-grid-3 .cp-contact { grid-column: auto; } .company-table .entity-text, .company-table .manager-name { max-width: none; } }
@media (max-width: 1023px) { .company-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cp-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cp-grid-2 { grid-template-columns: 1fr; } .cp-grid-3 { grid-template-columns: 1fr 1fr; } .cp-grid-3 .cp-contact { grid-column: 1 / -1; } }
@media (max-width: 767px) { .company-kpis { grid-template-columns: 1fr 1fr; } .company-toolbar .seg-tabs { width: 100%; overflow-x: auto; scrollbar-width: none; } .company-toolbar .filter-bar { width: 100%; } .company-search { flex: 1; width: auto; } .cp-tiles { grid-template-columns: 1fr 1fr; } .cp-grid-3 { grid-template-columns: 1fr; } .cp-activity .cp-feed { grid-template-columns: 1fr; } .cp-head { flex-wrap: wrap; } .cp-head .panel-head-actions { align-self: center; } }

/* ---- Add Company / Partner wizard (5 steps, wide drawer; reuses the .ww-* wizard system) ---- */
.ww-overlay.is-company .ww-panel { top: 0; right: 0; bottom: 0; width: min(708px, 100%); animation: slideIn .22s cubic-bezier(.2,.8,.2,1); }
.cw-body { display: grid; grid-template-columns: 152px minmax(0, 1fr); flex: 1; min-height: 0; }
.cw-rail { padding: 14px 8px 14px 8px; border-right: 1px solid var(--color-divider); background: #FBFCFE; display: flex; flex-direction: column; gap: 6px; }
.cw-rail .ww-rail-item { padding: 8px 6px; gap: 8px; }
.cw-rail .ww-rail-item:not(:last-child)::after { left: 17px; top: 36px; bottom: -8px; }
.cw-rail .ww-rail-num { width: 26px; height: 26px; font-size: 12.5px; }
.cw-rail .ww-rail-text strong { font-size: 12.5px; white-space: nowrap; line-height: 1.2; }
.cw-rail .ww-rail-text span { font-size: 11.5px; }
.cw-rail .ww-rail-item.is-done .ww-rail-text span { color: var(--color-success-text); }
.cw-content { padding: 18px 16px 24px; overflow-y: auto; min-height: 0; min-width: 0; }
.cw-content .ww-icon { color: var(--color-text-secondary); }
.cw-content .ww-prefix { color: var(--color-text-secondary); }
.cw-content .ww-icon-dyn .ww-avatar { color: var(--color-primary-text); }
.cw-content .ww-h2 { font-size: 17px; }
.cw-content .ww-sub { margin-bottom: 14px; }
.cw-content .ww-banner { margin-bottom: 16px; padding: 11px 14px; }
.cw-content .ww-banner-icon { width: 26px; height: 26px; border-radius: 50%; background: var(--color-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.cw-content .ww-banner span.only { font-size: 13px; color: var(--color-primary-text); font-weight: 500; }
.ww-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ww-grid.cols-2-1 { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.ww-grid.cols-geo1 { grid-template-columns: minmax(0, .66fr) minmax(0, 1fr); }
.ww-grid.cols-geo2 { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
.ww-grid.cols-4-eq { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.is-contact .ww-grid.cols-4-eq { gap: 14px 8px; }
.is-contact .ww-grid.cols-4-eq .ww-label { font-size: 11.5px; line-height: 1.2; }
.is-contact .ww-grid.cols-4-eq .form-select, .is-contact .ww-grid.cols-4-eq .form-control { font-size: 11px; padding-left: 28px; padding-right: 18px; background-position: right 5px center; }
.is-contact .ww-grid.cols-4-eq .ww-icon { left: 8px; }
.is-contact .ww-time-row { gap: 4px; }
.is-contact .ww-time-row .ww-addon-btn { width: 28px; height: 40px; border-radius: 6px; }
.is-contact .ww-grid.cols-geo-rel { grid-template-columns: minmax(0, .72fr) minmax(0, 1.6fr) minmax(0, 1fr); }
.cw-section { margin-top: 18px; }
.cw-section-title { font-size: 15px; font-weight: 700; color: var(--color-text); margin-bottom: 10px; letter-spacing: -.01em; }
.cw-section-title .opt { font-weight: 500; color: var(--color-text-secondary); }
.cw-section-title + .ww-sub { margin-top: -6px; }
.cw-divider { height: 1px; background: var(--color-divider); margin: 18px 0 16px; }
.cw-h3 { font-size: 16px; font-weight: 700; color: var(--color-text); }
.cw-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.cw-quick-card { border: 1px solid var(--color-border); border-radius: 10px; padding: 9px 7px 8px; min-width: 0; }
.cw-quick-card .ww-label { display: block; margin-bottom: 8px; font-size: 12.5px; }
.cw-quick-card .ww-control .form-select { height: 38px; font-size: 11.5px; padding-right: 20px; padding-left: 32px; background-position: right 5px center; }
.cw-quick-card .ww-control .ww-icon { left: 9px; }
.cw-quick-card .ww-field { gap: 0; }
.cw-quick-card .ww-hint { display: none; }
.ww-icon-dyn .flag { width: 18px; height: 12px; }
.ww-icon-dyn .ww-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.ww-icon-dyn .ww-avatar { width: 24px; height: 24px; font-size: 10px; }
.ww-icon-dyn .ww-bars { display: inline-flex; align-items: flex-end; gap: 2px; height: 14px; }
.ww-icon-dyn .ww-bars i { display: block; width: 3px; border-radius: 1px; background: currentColor; }
.ww-icon-dyn .ww-bars i:nth-child(1) { height: 6px; } .ww-icon-dyn .ww-bars i:nth-child(2) { height: 10px; } .ww-icon-dyn .ww-bars i:nth-child(3) { height: 14px; }
.ww-bars.low { color: #67768B; } .ww-bars.medium { color: #F59E0B; } .ww-bars.high { color: #DC2626; }
.ww-control.has-icon .form-select.ww-select-plain { padding-left: 38px; }
.cw-logo { display: flex; align-items: center; gap: 10px; }
.cw-logo-tile { width: 60px; height: 60px; border-radius: 12px; background: #0B1220; color: width: 60px; height: 60px; border-radius: 50%; background: #0B1220; color: #fff; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; flex: none; g: 12%; box-sizing: border-box; }
.cw-logo-tile .ww-logo-mono { font-size: 16px; }
.cw-logo-actions { display: flex; flex-direction: column; gap: 6px; }
.cw-logo-actions .btn { height: 28px; padding: 0 8px; font-size: 11.5px; border-radius: 7px; justify-content: center; white-space: nowrap; gap: 5px; }
.cw-logo-actions .btn.is-remove { color: var(--color-danger-text); border-color: transparent; }
.ww-textarea-wrap { position: relative; }
.ww-textarea-wrap .form-textarea { min-height: 84px; font-size: 13px; line-height: 1.5; padding: 10px 12px 22px; border-radius: 8px; resize: vertical; }
.ww-counter { position: absolute; right: 10px; bottom: 8px; font-size: 11px; color: var(--color-text-muted); pointer-events: none; }
.ww-chip.geo { gap: 6px; padding-left: 8px; }
.ww-chip .flag { width: 16px; height: 12px; border-radius: 2px; }
.ww-chip .ww-globe { color: var(--color-primary); display: inline-flex; }
.ww-stars { display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 8px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface); }
.ww-star { width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; color: #D5DCE6; border-radius: 6px; }
.ww-star .icon { width: 22px; height: 22px; fill: #fff; stroke: currentColor; }
.ww-star.is-on .icon { fill: currentColor; }
.ww-star.is-on { color: #F59E0B; }
.ww-star:hover { background: var(--color-surface-muted); }
.ww-upload-btn { display: flex; align-items: center; justify-content: center; gap: 8px; height: 40px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface); color: var(--color-primary-text); font-weight: 600; font-size: 13px; cursor: pointer; width: 100%; }
.ww-upload-btn:hover { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
.ww-upload-btn .icon { color: var(--color-primary); }
.ww-upload-btn.has-file { justify-content: space-between; padding: 0 10px 0 12px; color: var(--color-text); font-weight: 500; }
.ww-upload-btn .ww-file-x { display: inline-flex; color: var(--color-text-muted); }
.cw-check { display: flex; align-items: flex-start; gap: 10px; padding: 4px 0; }
.cw-check .check { margin-top: 1px; }
.cw-check-text strong { display: block; font-size: 13.5px; font-weight: 500; color: var(--color-text); }
.cw-check-text span { font-size: 12.5px; color: var(--color-text-secondary); }
.cw-add-contact { display: flex; align-items: center; gap: 14px; border: 1.5px dashed var(--color-border-strong); border-radius: 10px; padding: 14px 16px; background: var(--color-surface); text-align: left; width: 100%; }
.cw-add-contact:hover { border-color: var(--color-primary); background: var(--color-primary-soft); }
.cw-add-contact .plus { width: 48px; height: 48px; border-radius: 10px; background: var(--color-primary-soft); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.cw-add-contact strong { display: block; font-size: 14px; font-weight: 700; color: var(--color-primary-text); }
.cw-add-contact span { font-size: 12.5px; color: var(--color-text-secondary); }
.cw-extra-contact { border: 1px solid var(--color-border); border-radius: 10px; padding: 12px 14px; }
.cw-extra-contact-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; font-size: 13px; font-weight: 600; }
.cw-notes-card { background: #F5F8FC; border: 1px solid #EAF0F7; border-radius: 10px; padding: 14px; }
.cw-notes-card .cw-notes-head { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; margin-bottom: 10px; }
.cw-notes-card .cw-notes-head .icon { color: var(--color-primary); }
.cw-notes-card .cw-notes-head .opt { font-weight: 500; color: var(--color-text-secondary); }
.cw-notes-card .form-textarea { background: var(--color-surface); }
.cw-review { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cw-review-card { border: 1px solid var(--color-border); border-radius: 10px; padding: 12px 14px; }
.cw-review-card h5 { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--color-text-muted); font-weight: 600; margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center; }
.cw-review-card h5 button { font-size: 11.5px; text-transform: none; letter-spacing: 0; color: var(--color-primary-text); font-weight: 600; }
.cw-review-card .kv-row { padding: 3px 0; font-size: 12.5px; }
.ww-foot.cw-foot .btn { min-width: 96px; }
.ww-foot.cw-foot .btn-primary { min-width: 104px; }
@media (max-width: 1023px) { .cw-quick { grid-template-columns: 1fr 1fr; } .ww-grid.cols-3, .ww-grid.cols-4-eq { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ww-grid.cols-2-1, .ww-grid.cols-geo1, .ww-grid.cols-geo2 { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .ww-overlay.is-company .ww-panel { width: 100%; } .cw-body { grid-template-columns: 1fr; display: flex; flex-direction: column; } .cw-rail { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--color-divider); padding: 10px 12px; gap: 8px; flex: none; } .cw-rail .ww-rail-item { flex: none; padding: 6px 8px; } .cw-rail .ww-rail-item::after { display: none; } .cw-rail .ww-rail-text span { display: none; } .cw-quick, .ww-grid.cols-3, .ww-grid.cols-4-eq, .cw-review { grid-template-columns: 1fr; } .cw-content { flex: 1; } }

/* ---- Contacts / Affiliate Managers page fidelity (design-reference/Forms/Contacts/Contacts-main.png) ---- */
.contact-page .page-header { margin-bottom: 14px; }
.contact-page .page-header .page-title { font-size: 26px; }
.contact-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.contact-kpis .kpi { padding: 14px 16px; gap: 14px; align-items: flex-start; border-radius: 12px; min-height: 92px; box-shadow: 0 1px 2px rgba(15,23,42,.02), 0 4px 12px rgba(15,23,42,.025); }
.contact-kpis .kpi-icon { width: 44px; height: 44px; border-radius: 12px; }
.contact-kpis .kpi-icon .icon { width: 21px; height: 21px; }
.contact-kpis .kpi-label { font-size: 12.5px; color: var(--color-text-secondary); }
.contact-kpis .kpi-value { font-size: 22px; margin-top: 4px; }
.contact-kpis .kpi-delta, .contact-kpis .kpi-sub { margin-top: 7px; font-size: 12px; }
.kpi-down { display: inline-flex; align-items: center; gap: 2px; color: var(--color-danger-text); font-weight: 600; font-size: 12px; }
.kpi-down .icon { width: 12px; height: 12px; stroke-width: 2.5; }
.contact-split { grid-template-columns: minmax(0, 1fr) 440px; gap: 14px; }
.contact-toolbar { padding: 12px 14px 10px; gap: 10px; border-bottom: 0; }
.contact-toolbar .seg-tabs { padding: 3px; gap: 2px; border-radius: 10px; }
.contact-toolbar .seg-tab { height: 34px; padding: 0 10px; font-size: 12.5px; gap: 6px; }
.contact-toolbar .seg-tab .seg-count { min-width: 20px; height: 18px; font-size: 10.5px; }
.contact-adv { height: 36px; gap: 6px; font-size: 12.5px; }
.contact-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 0 14px 12px; }
.contact-filters + .contact-filters { padding-top: 0; }
.contact-filters[hidden] { display: none; }
.contact-filters .filter-select { height: 36px; font-size: 12.5px; min-width: 86px; padding-left: 9px; padding-right: 24px; border-radius: 8px; background-position: right 7px center; }
.contact-search { flex: 1 1 180px; min-width: 170px; }
.contact-search > .icon { left: 10px; }
.contact-search .form-control { padding-left: 32px; height: 36px; font-size: 12.5px; border-radius: 8px; }
.contact-page .table-wrap { border-top: 1px solid var(--color-divider); }
.contact-table { font-size: 12px; }
.contact-table thead th { height: 40px; font-size: 10.5px; letter-spacing: 0; text-transform: none; color: var(--color-text-secondary); background: #F8FAFC; font-weight: 600; }
.contact-table thead th .th-sort-icon { display: none; } .contact-table thead th.is-sorted .th-sort-icon { display: inline-block; }
.contact-table thead th, .contact-table tbody td { padding-left: 5px; padding-right: 5px; }
.contact-table thead th:first-child, .contact-table tbody td:first-child { padding-left: 10px; }
.contact-table tbody td { height: 49px; padding-top: 5px; padding-bottom: 5px; }
.contact-table .col-sel { width: 22px; }
.contact-table .col-sel .idx { display: none; }
.contact-table .col-sel .check { display: inline-flex; }
.contact-table .col-sel .check-box { width: 15px; height: 15px; border-radius: 4px; }
.ct-manager { gap: 9px; }
.ct-manager .avatar-40 { width: 36px; height: 36px; font-size: 12.5px; }
.ct-manager .entity-title { font-size: 12.5px; }
.ct-manager .entity-title a { color: var(--color-text); }
.ct-channels { display: inline-flex; gap: 4px; margin-top: 3px; }
.ct-chan { width: 16px; height: 16px; border-radius: 4px; display: inline-flex; align-items: center; justify-content: center; }
.ct-chan .icon { width: 12px; height: 12px; }
.ct-chan.tg { color: #229ED9; } .ct-chan.sk { color: #00AFF0; } .ct-chan.em { color: #2563EB; background: var(--color-primary-soft); } .ct-chan.wa { color: #25D366; } .ct-chan.li { color: #0A66C2; }
.ct-company { gap: 7px; }
.ct-company .brand-28 { width: 26px; height: 26px; border-radius: 50%; }
.ct-company-name { font-size: 12px; font-weight: 600; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 76px; }
.contact-table .col-role { max-width: 100px; white-space: normal; line-height: 1.25; font-size: 11.5px; }
.flag-stack { display: inline-flex; align-items: center; gap: 3px; }
.flag-stack .flag-cell .flag { width: 16px; height: 11px; }
.flag-more { font-size: 11px; font-weight: 600; color: var(--color-primary-text); background: var(--color-primary-soft); padding: 1px 5px; border-radius: 4px; }
.contact-table .badge-stage { height: 22px; font-size: 10.5px; padding: 0 6px; border-radius: 6px; font-weight: 600; }
.contact-table .badge-purple { background: var(--color-purple-soft); color: var(--color-purple-text); }
.ct-fu { font-size: 11px; font-weight: 600; white-space: nowrap; }
.contact-table .badge-stage { padding: 0 7px; }
.ct-manager .entity-text { max-width: 98px; }
.ct-fu-red { color: #DC2626; } .ct-fu-dark { color: var(--color-text); } .ct-fu-muted { color: var(--color-text-muted); font-weight: 500; }
.contact-table .col-owner { width: 50px; }
.contact-table .col-owner .ct-owner { width: 28px; height: 28px; font-size: 10.5px; }
.contact-table .col-owner .th-sort { justify-content: center; }
.contact-page .pagination-bar { padding: 12px 16px; font-size: 12.5px; }
.contact-page .pagination-bar .page-btn { min-width: 30px; height: 30px; }
/* right panel */
.contact-panel { border-radius: 14px; }
.ct-head { display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px 0; position: relative; }
.ct-head-main { display: flex; align-items: flex-start; gap: 12px; flex: 1; min-width: 0; }
.ct-avatar.avatar-64 { width: 64px; height: 64px; font-size: 20px; flex: none; }
.ct-head-text { min-width: 0; }
.ct-name { font-size: 20px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; color: var(--color-text); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ct-primary { height: 20px; font-size: 11px; padding: 0 7px; border-radius: 5px; }
.ct-role { font-size: 13px; color: var(--color-text-secondary); margin-top: 3px; }
.ct-company-line { display: flex; align-items: center; gap: 6px; margin-top: 8px; }
.ct-company-link { font-size: 13px; font-weight: 700; color: var(--color-text); }
.ct-ext { color: var(--color-primary); display: inline-flex; }
.ct-score { width: 126px; flex: none; border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 10px; margin-right: 26px; }
.ct-score-label { font-size: 11px; color: var(--color-text-secondary); white-space: nowrap; }
.ct-score-value { font-size: 12px; color: var(--color-text-secondary); margin: 2px 0 6px; }
.ct-score-value strong { font-size: 19px; font-weight: 700; color: var(--color-text); letter-spacing: -.02em; }
.ct-score .progress { height: 5px; }
.ct-score-sub { font-size: 10.5px; color: var(--color-text-muted); margin-top: 5px; white-space: nowrap; }
.ct-close { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; }
.ct-tiles { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; padding: 12px 18px 0; }
.ct-tile { display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 11px; color: var(--color-text-secondary); min-width: 0; text-align: center; }
.ct-tile-icon { width: 40px; height: 40px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: #F5F8FC; border: 1px solid #EAF0F7; color: var(--color-text-secondary); }
.ct-tile.tg .ct-tile-icon { background: #E8F4FC; } .ct-tile.sk .ct-tile-icon { background: #E6F6FE; } .ct-tile.em .ct-tile-icon { background: #EEF2FF; color: #2563EB; } .ct-tile.wa .ct-tile-icon { background: #E9FAF0; } .ct-tile.li .ct-tile-icon { background: #E8F0FA; }
.ct-tile:hover .ct-tile-icon { border-color: var(--color-primary-soft-2); }
.ct-tile.is-off { opacity: .55; cursor: default; }
.ct-tile-menu { display: block; }
.ct-tile-menu > .ct-tile { width: 100%; }
.ct-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding: 10px 18px 0; }
.ct-fact { border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 10px; min-width: 0; }
.ct-fact .l { display: block; font-size: 11px; color: var(--color-text-secondary); }
.ct-fact .v { display: block; font-size: 12px; font-weight: 600; color: var(--color-text); margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-fact .v .flag-stack { vertical-align: middle; }
.ct-actions { display: grid; grid-template-columns: 1fr 1fr 1fr 40px; gap: 6px; padding: 10px 18px 0; }
.ct-actions .btn { height: 38px; padding: 0 8px; font-size: 12.5px; gap: 6px; border-radius: 8px; white-space: nowrap; }
.ct-actions .ct-more .btn-icon { width: 40px; height: 38px; border: 1px solid var(--color-border); border-radius: 8px; }
.ct-tabs { padding: 10px 18px 0; }
.ct-tabs .tab { padding: 8px 7px; font-size: 12px; }
.ct-body { padding: 10px 18px 16px; gap: 8px; }
.ct-stack { gap: 8px; }
.ct-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.ct-metric { border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 7px 7px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ct-metric .l { font-size: 10.5px; letter-spacing: -.01em; color: var(--color-text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-metric strong { font-size: 17px; font-weight: 700; letter-spacing: -.02em; color: var(--color-text); line-height: 1.15; white-space: nowrap; }
.ct-metric strong.sm { font-size: 13.5px; }
.ct-metric .s { display: inline-flex; align-items: center; gap: 3px; font-size: 10px; letter-spacing: -.01em; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-metric .s .icon { width: 8px; height: 8px; flex: none; }
.ct-metric .s.green { color: #15803D; } .ct-metric .s.green .icon { fill: #22C55E; stroke: #22C55E; } .ct-metric .s.red { color: #DC2626; } .ct-metric .s.muted { color: var(--color-text-muted); font-weight: 500; }
.ct-card { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; background: var(--color-surface); min-width: 0; }
.ct-card-title { display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 700; color: var(--color-text); margin-bottom: 8px; }
.ct-card-title .card-link { font-size: 12px; font-weight: 500; }
.ct-edit-notes { width: 24px; height: 24px; color: var(--color-primary); }
.ct-fu-row { display: flex; align-items: center; gap: 10px; }
.ct-fu-row .icon-tile { width: 36px; height: 36px; border-radius: 9px; }
.ct-fu-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.ct-fu-text strong { font-size: 13.5px; font-weight: 700; color: var(--color-text); }
.ct-fu-text span { font-size: 12px; color: var(--color-text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-fu-row .btn-soft { height: 32px; gap: 5px; font-size: 12.5px; flex: none; }
.ct-quote { display: flex; gap: 10px; align-items: flex-start; }
.ct-quote-icon { width: 36px; height: 36px; border-radius: 9px; }
.ct-quote-text p { font-size: 13px; line-height: 1.5; color: var(--color-text); }
.ct-quote-text span { display: block; font-size: 11.5px; color: var(--color-text-muted); margin-top: 6px; }
.ct-grid-2 { display: grid; grid-template-columns: 1fr 1.1fr; gap: 10px; align-items: start; }
.ct-tags .tag { height: 24px; font-size: 11.5px; font-weight: 600; }
.ct-notes { font-size: 12.5px; line-height: 1.5; color: var(--color-text-secondary); }
@media (max-width: 1439px) { .contact-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } .contact-split { grid-template-columns: minmax(0, 1fr) 392px; } .contact-table [data-priority="2"], .contact-table .col-role, .contact-table th:nth-child(5), .contact-table td:nth-child(5), .contact-table th:nth-child(7), .contact-table td:nth-child(7) { display: none; } .ct-tiles { gap: 4px; } .ct-score { width: 118px; } }
@media (max-width: 1279px) { .contact-split { grid-template-columns: minmax(0, 1fr); } .contact-table .col-role, .contact-table th:nth-child(5), .contact-table td:nth-child(5), .contact-table th:nth-child(7), .contact-table td:nth-child(7) { display: table-cell; } .ct-company-name, .ct-manager .entity-text { max-width: none; } }
@media (max-width: 1023px) { .contact-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ct-metrics { grid-template-columns: 1fr 1fr; } }
@media (max-width: 767px) { .contact-kpis { grid-template-columns: 1fr 1fr; } .contact-toolbar .seg-tabs { width: 100%; overflow-x: auto; scrollbar-width: none; } .contact-adv { width: 100%; justify-content: center; } .contact-filters .filter-select { flex: 1 1 45%; } .ct-head { flex-wrap: wrap; } .ct-score { width: 100%; margin-right: 0; } .ct-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ct-facts { grid-template-columns: 1fr; } .ct-actions { grid-template-columns: 1fr 1fr; } .ct-actions .ct-more { grid-column: 1 / -1; } .ct-actions .ct-more .btn-icon { width: 100%; } .ct-grid-2 { grid-template-columns: 1fr; } .ct-actions .btn { min-height: 44px; } }

/* ---- Add Contact wizard (4 steps, 680px drawer; contact info + relationship share one scroll) ---- */
.ww-overlay.is-contact .ww-panel { top: 0; right: 0; bottom: 0; width: min(680px, 100%); animation: slideIn .22s cubic-bezier(.2,.8,.2,1); }
.is-contact .cw-body { grid-template-columns: 160px minmax(0, 1fr); }
.is-contact .cw-content { padding: 16px 18px 24px; }
.is-contact .ww-chip { height: 26px; font-size: 12px; padding: 0 6px 0 8px; gap: 4px; }
.is-contact .ww-chip-btn, .is-contact .ww-chip-select, .is-contact .ww-chip-input { height: 26px; font-size: 12px; padding: 0 8px; }
.is-contact .ww-chips { gap: 6px; min-height: 40px; }
.cw-title { margin-bottom: 14px; }
.cw-title strong { display: block; font-size: 17px; font-weight: 700; color: var(--color-text); }
.cw-title span { font-size: 12.5px; color: var(--color-text-secondary); }
.cw-section-card { border-top: 1px solid var(--color-divider); margin: 18px -18px 0; padding: 18px 18px 0; }
.cw-sec-head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.cw-sec-head .icon-tile { width: 34px; height: 34px; border-radius: 50%; }
.cw-sec-head h3 { font-size: 15px; font-weight: 700; color: var(--color-text); }
.cw-sec-head p { font-size: 12px; color: var(--color-text-secondary); margin-top: 1px; }
.cw-sec-head .cw-photo { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.cw-photo-tile { width: 56px; height: 56px; border-radius: 50%; background: #E2E8F0; color: #67768B; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; flex: none; }
.cw-photo-tile img { width: 100%; height: 100%; object-fit: cover; }
.cw-photo-text { display: flex; flex-direction: column; gap: 4px; }
.cw-photo-text strong { font-size: 12.5px; font-weight: 600; }
.cw-photo-text .btn { height: 28px; padding: 0 10px; font-size: 12px; gap: 5px; }
.cw-photo-text small { font-size: 10.5px; color: var(--color-text-muted); }
.ww-grid.cols-phone { grid-template-columns: 74px minmax(0, 1fr); gap: 6px; }
.ww-grid.cols-phone .form-select { padding-left: 34px; padding-right: 18px; font-size: 12px; }
.ww-field-inline { display: flex; align-items: center; gap: 6px; }
.ww-field-inline .form-control { flex: 1; }
.ww-field-inline .ww-addon-btn { width: 40px; height: 40px; border: 1px solid var(--color-border); border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; color: var(--color-primary); background: var(--color-surface); flex: none; }
.ww-time-row { display: flex; align-items: center; gap: 6px; }
.ww-time-row .ww-control { flex: 1; }
.cw-stars-inline .ww-stars { height: 40px; }
.cw-attach { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; align-items: start; }
.cw-upload-box { display: flex; align-items: center; gap: 12px; border: 1.5px dashed var(--color-border-strong); border-radius: 10px; padding: 14px; cursor: pointer; }
.cw-upload-box:hover { border-color: var(--color-primary); background: var(--color-primary-soft); }
.cw-upload-box .icon-tile { width: 40px; height: 40px; border-radius: 10px; }
.cw-upload-box strong { display: block; font-size: 13.5px; font-weight: 700; color: var(--color-primary-text); }
.cw-upload-box span { font-size: 11.5px; color: var(--color-text-secondary); }
.cw-files { display: flex; flex-direction: column; gap: 8px; }
.cw-file { display: flex; align-items: center; gap: 10px; }
.cw-file .icon-tile { width: 28px; height: 28px; border-radius: 6px; }
.cw-file-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.cw-file-text strong { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cw-file-text span { font-size: 11px; color: var(--color-text-muted); }
.cw-file .btn-icon { width: 26px; height: 26px; }
.cw-review-id { display: flex; align-items: center; gap: 14px; border: 1px solid var(--color-border); border-radius: 12px; padding: 14px 16px; }
.cw-review-id .avatar { flex: none; }
.cw-review-id .cw-rv-name { font-size: 18px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.cw-review-id .cw-rv-role { font-size: 13px; color: var(--color-text-secondary); margin-top: 2px; }
.cw-review-id .cw-rv-co { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-weight: 700; font-size: 13px; }
.cw-review-block { border: 1px solid var(--color-border); border-radius: 12px; padding: 12px 14px; }
.cw-review-block h5 { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--color-text); margin-bottom: 10px; }
.cw-review-block h5 .icon-tile { width: 28px; height: 28px; border-radius: 7px; }
.cw-review-block h5 .btn { margin-left: auto; height: 30px; padding: 0 12px; font-size: 12.5px; gap: 5px; }
.cw-review-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; align-items: start; }
.cw-review-col { min-width: 0; }
.cw-rv { display: flex; gap: 8px; padding: 4px 0; font-size: 12px; min-width: 0; }
.cw-rv .k { width: 96px; flex: none; color: var(--color-text-secondary); }
.cw-rv .v { color: var(--color-text); font-weight: 500; min-width: 0; flex: 1; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; word-break: break-word; }
.cw-rv .v > span, .cw-rv .v > svg, .cw-rv .v > img { flex: none; }
.cw-rv.wrap .v { white-space: normal; }
.cw-rv .v .flag { width: 18px; height: 12px; }
.cw-rv .v .tag { height: 22px; }
.cw-rv.full { grid-column: 1 / -1; flex-direction: column; gap: 2px; }
.cw-rv.full .v { white-space: normal; display: block; line-height: 1.45; }
.cw-followup { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 10px; background: var(--color-success-soft); border: 1px solid #BBF7D0; }
.cw-followup .cw-fu-text { flex: 1; min-width: 0; }
.cw-followup strong { display: block; font-size: 13.5px; font-weight: 600; }
.cw-followup span { font-size: 12px; color: var(--color-text-secondary); }
.cw-followup .form-control { width: 168px; height: 36px; }
.cw-split { position: relative; display: inline-flex; }
.cw-split .btn-primary { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.cw-split .cw-split-caret { height: 42px; width: 38px; border-radius: 0 8px 8px 0; background: var(--color-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; border-left: 1px solid rgba(255,255,255,.25); }
.cw-split .cw-split-caret:hover { background: var(--color-primary-hover); }
.cw-split-menu { position: absolute; right: 0; bottom: calc(100% + 8px); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 10px; box-shadow: var(--shadow-lg); min-width: 220px; padding: 6px; z-index: 5; }
.cw-split-menu[hidden] { display: none; }
.cw-split-menu button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border-radius: 7px; font-size: 13px; font-weight: 500; text-align: left; color: var(--color-text); }
.cw-split-menu button:hover { background: var(--color-surface-muted); }
.cw-split-menu button .icon { color: var(--color-text-secondary); }
@media (max-width: 767px) { .ww-overlay.is-contact .ww-panel { width: 100%; } .cw-attach, .cw-review-grid { grid-template-columns: 1fr; } .cw-sec-head { flex-wrap: wrap; } .cw-sec-head .cw-photo { margin-left: 0; width: 100%; } .ww-grid.cols-phone { grid-template-columns: 90px minmax(0, 1fr); } }

/* ===== Affiliate Accounts (design-reference/Forms/Affilaite/affiliate-main.png) ===== */
.aa-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.aa-kpis .kpi { padding: 14px 16px; gap: 12px; align-items: flex-start; border-radius: 12px; min-height: 88px; box-shadow: 0 1px 2px rgba(15,23,42,.02); }
.aa-kpis .kpi-icon { width: 44px; height: 44px; }
.aa-kpis .kpi-icon .icon { width: 20px; height: 20px; }
.aa-kpis .kpi-label { font-size: 12.5px; color: var(--color-text-secondary); }
.aa-kpis .kpi-value { font-size: 22px; margin-top: 3px; }
.aa-kpis .kpi-delta, .aa-kpis .kpi-sub { margin-top: 6px; font-size: 11.5px; }
.aa-split { grid-template-columns: minmax(0, 1fr) 496px; gap: 12px; }
.aa-card { border-radius: 12px; }
.aa-toolbar { padding: 10px 8px; gap: 3px; flex-wrap: wrap; }
.aa-tabs { padding: 3px; gap: 2px; border-radius: 9px; background: var(--color-surface-muted); border-color: var(--color-surface-muted); flex: none; }
.aa-tabs .seg-tab { height: 30px; padding: 0 5px; font-size: 11px; border-radius: 7px; gap: 3px; }
.aa-tabs .seg-tab .seg-count { height: 18px; min-width: 14px; font-size: 10.5px; padding: 0 4px; }
.aa-filters { gap: 3px; flex: 1; min-width: 0; flex-wrap: nowrap; justify-content: flex-start; }
.aa-filters .filter-select { height: 34px; font-size: 10.5px; padding-left: 6px; padding-right: 15px; border-radius: 8px; background-position: right 5px center; background-size: 11px; flex: none; width: auto; }
.aa-filters .filter-select[name=company] { width: 84px; } .aa-filters .filter-select[name=website] { width: 80px; } .aa-filters .filter-select[name=country] { width: 82px; } .aa-filters .filter-select[name=model] { width: 92px; } .aa-filters .filter-select[name=manager] { width: 94px; }
.aa-filters .aa-filter-btn { width: 26px; height: 34px; border-radius: 8px; color: var(--color-text-secondary); flex: none; }
.aa-table { table-layout: fixed; width: 100%; }
.aa-table thead th { font-size: 11.5px; padding: 0 5px; height: 36px; }
.aa-table tbody td { padding: 6px 5px; height: 47px; font-size: 12px; }
.aa-table thead th:first-child, .aa-table tbody td:first-child { padding-left: 10px; } .aa-table thead th:last-child, .aa-table tbody td:last-child { padding-right: 8px; }
.aa-table .col-sel { width: 28px; }
.aa-table .col-acct { width: 126px; } .aa-table .col-co { width: 92px; } .aa-table .col-site { width: 104px; } .aa-table .col-cc { width: 58px; } .aa-table .col-deal { width: 74px; } .aa-table .col-rate { width: 100px; } .aa-table .col-month { width: 64px; } .aa-table .col-status { width: 56px; } .aa-table .col-actions { width: 38px; }
.aa-table .col-site { overflow: hidden; text-overflow: ellipsis; font-size: 11px; letter-spacing: -.02em; }
.aa-acct { gap: 7px; }
.aa-acct .brand { --brand-size: 36px; border-radius: 50%; flex: none; }
.aa-acct .entity-title { font-size: 12px; font-weight: 700; }
.aa-acct .entity-sub { font-size: 10.5px; letter-spacing: -.01em; }
.aa-co { gap: 5px; }
.aa-co .brand { --brand-size: 20px; border-radius: 50%; flex: none; }
.aa-co-name { font-weight: 700; font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -.02em; }
.aa-table .flag-cell { font-size: 11.5px; gap: 4px; }
.aa-table .flag-cell .flag { width: 18px; height: 12px; }
.aa-table .flag-cell .icon { width: 14px; height: 14px; }
.aa-table .badge-deal { height: 22px; font-size: 11px; padding: 0 6px; border-radius: 6px; }
.aa-table .col-rate { font-weight: 500; white-space: nowrap; font-size: 11px; letter-spacing: -.01em; overflow: hidden; text-overflow: ellipsis; }
.aa-cpa { color: var(--color-primary-text); }
.aa-month { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; line-height: 1.2; }
.aa-month strong { font-size: 12.5px; font-weight: 700; }
.aa-month .trend { font-size: 11.5px; }
.aa-table .badge-status { height: 22px; font-size: 11px; padding: 0 7px; border-radius: 6px; }
.aa-table .col-actions .btn-icon { width: 26px; height: 26px; border: 1px solid var(--color-border); border-radius: 6px; }
.aa-card .pagination-bar { padding: 12px 16px; font-size: 12.5px; }
/* panel */
.aa-panel { border-radius: 12px; }
.aa-head { display: flex; align-items: flex-start; gap: 14px; padding: 14px 12px 0; position: relative; }
.aa-head .aa-logo { --brand-size: 96px; border-radius: 50%; flex: none; }
.aa-head-text { flex: 1; min-width: 0; padding-right: 48px; padding-top: 4px; }
.aa-title { display: flex; align-items: center; gap: 10px; font-size: 20px; font-weight: 700; letter-spacing: -.01em; line-height: 1.2; }
.aa-title .badge { height: 22px; font-size: 11.5px; padding: 0 10px; border-radius: 6px; }
.aa-sub { font-size: 12.5px; color: var(--color-text-secondary); margin-top: 5px; }
.aa-ids { display: flex; gap: 14px; margin-top: 8px; font-size: 12.5px; color: var(--color-text-secondary); flex-wrap: wrap; align-items: center; }
.aa-ids strong { color: var(--color-text); font-weight: 600; }
.aa-copy { display: inline-flex; color: var(--color-primary); vertical-align: -3px; margin-left: 2px; }
.aa-head-actions { position: absolute; right: 12px; top: 12px; display: flex; gap: 4px; }
.aa-head-actions .aa-more .btn-icon { width: 32px; height: 32px; border: 1px solid var(--color-border); border-radius: 8px; }
.aa-head-actions .aa-more .btn-icon .icon { transform: rotate(90deg); }
.aa-close { width: 32px; height: 32px; }
@media (min-width: 1280px) { .aa-close { display: none; } }
.aa-tabs-wrap { padding: 10px 12px 0; }
.aa-ptabs .tab { padding: 8px 8px; font-size: 12.5px; }
.aa-body { padding: 12px 12px 14px; }
.aa-overview { display: flex; flex-direction: column; gap: 10px; }
.aa-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.aa-tile { background: #F8FAFC; border: 1px solid #EDF2F7; border-radius: 10px; padding: 10px 10px 9px; min-width: 0; }
.aa-tile.green { background: #F0FDF4; border-color: #DCFCE7; }
.aa-tile .v { font-size: 18px; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; white-space: nowrap; }
.aa-tile .l { font-size: 11px; color: var(--color-text-secondary); margin-top: 3px; }
.aa-tile .trend { margin-top: 5px; font-size: 11.5px; }
.aa-cols { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 10px; align-items: start; }
.aa-col { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.aa-box { border: 1px solid var(--color-border); border-radius: 10px; padding: 11px 11px 12px; background: var(--color-surface); min-width: 0; }
.aa-box-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.aa-box-head h4 { font-size: 13.5px; font-weight: 700; color: var(--color-text); white-space: nowrap; }
.aa-box-head h4 span { font-weight: 500; color: var(--color-text-secondary); font-size: 12px; }
.aa-box-head .card-link { font-size: 11.5px; white-space: nowrap; }
.aa-range { height: 28px; font-size: 11.5px; padding-left: 8px; padding-right: 22px; width: auto; border-radius: 7px; background-position: right 6px center; }
.aa-edit { height: 26px; padding: 0 8px; font-size: 11.5px; gap: 4px; border-radius: 7px; }
.aa-chart { display: flex; align-items: flex-end; gap: 8px; height: 132px; padding: 0 2px; }
.aa-bar { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; min-width: 0; }
.aa-bar-val { font-size: 11px; font-weight: 600; color: var(--color-text); margin-bottom: 4px; white-space: nowrap; }
.aa-bar-fill { display: block; width: 100%; max-width: 30px; height: calc((100% - 34px) * var(--h) / 100%); min-height: 6px; border-radius: 4px 4px 2px 2px; background: linear-gradient(180deg, #60A5FA, #93C5FD); }
.aa-bar-fill.is-cur { background: linear-gradient(180deg, #2563EB, #3B82F6); }
.aa-bar-lbl { font-size: 11px; color: var(--color-text-secondary); margin-top: 6px; }
.aa-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
.aa-metric { background: #F8FAFC; border: 1px solid #EDF2F7; border-radius: 8px; padding: 8px 5px 8px 6px; min-width: 0; }
.aa-metric .v { font-size: 13px; font-weight: 700; letter-spacing: -.02em; white-space: nowrap; }
.aa-metric .l { font-size: 9px; color: var(--color-text-secondary); margin-top: 2px; letter-spacing: -.03em; white-space: nowrap; overflow: visible; margin-right: -6px; }
.aa-metric .trend { margin-top: 4px; font-size: 11px; }
.aa-recent { table-layout: auto; }
.aa-recent thead th { height: 24px; font-size: 9.5px; padding: 0 2px; letter-spacing: -.02em; }
.aa-recent tbody td { height: 25px; padding: 2px 2px; font-size: 9.5px; letter-spacing: -.03em; }
.aa-recent thead th:first-child, .aa-recent tbody td:first-child { padding-left: 4px; }
.aa-recent tbody td:first-child { color: var(--color-text-secondary); }
.aa-recent .fw-700 { font-weight: 700; }
.aa-kv .kv-row { min-height: 32px; padding: 4px 0; font-size: 12px; gap: 8px; }
.aa-kv .kv-label { color: var(--color-text-secondary); flex: none; width: 62px; }
.aa-kv .kv-value { font-weight: 500; justify-content: flex-start; text-align: left; flex: 1; min-width: 0; }
.aa-kv .kv-row { justify-content: flex-start; }
.aa-kv-logo { height: 14px; width: auto; max-width: 90px; display: inline-block; }
.aa-kv-co { display: inline-flex; align-items: center; gap: 6px; color: var(--color-text); font-weight: 600; }
.aa-kv-co .brand { --brand-size: 18px; border-radius: 50%; }
.aa-kv-site { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
.aa-kv-site > .icon { display: none; }
.aa-kv-site a { color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 11px; letter-spacing: -.01em; }
.aa-kv-site .aa-ext { color: var(--color-primary); display: inline-flex; margin-left: 2px; flex: none; }
.aa-kv-geo { display: inline-flex; align-items: center; gap: 6px; }
.aa-kv-geo .flag { width: 20px; height: 13px; border-radius: 2px; }
.aa-kv-mgr { display: inline-flex; align-items: center; gap: 6px; }
.aa-kv-mgr a { color: var(--color-text); }
.aa-kv .badge-status { height: 22px; font-size: 11.5px; border-radius: 6px; }
.aa-actions { display: flex; flex-direction: column; gap: 6px; }
.aa-actions .btn { height: 36px; justify-content: center; font-size: 12.5px; gap: 8px; border-radius: 8px; }
.aa-actions .btn .icon { width: 15px; height: 15px; }
.aa-actions .aa-more-actions .btn-icon { width: 100%; height: 36px; border: 1px solid var(--color-border); border-radius: 8px; font-size: 12.5px; font-weight: 500; color: var(--color-text); gap: 8px; }
.aa-actions .aa-more-actions .btn-icon::after { content: "More Actions"; }
.aa-actions .aa-more-actions .btn-icon .icon { transform: rotate(90deg); }
.aa-actions .aa-more-actions { width: 100%; }
.aa-bottom { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
.aa-sites { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.aa-site { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; }
.aa-site .brand { --brand-size: 28px; border-radius: 50%; }
.aa-site a { color: var(--color-text); }
.aa-site .badge { height: 22px; font-size: 11px; padding: 0 8px; border-radius: 6px; }
.aa-site-x { width: 22px; height: 22px; color: var(--color-text-muted); }
.aa-add-site { height: 32px; padding: 0 10px; font-size: 12px; gap: 5px; color: var(--color-primary-text); border-radius: 8px; }
.aa-add-site .icon { color: var(--color-primary); }
.aa-tags { gap: 6px; }
.aa-tags .tag { height: 28px; padding: 0 9px; font-size: 11.5px; font-weight: 600; border-radius: 8px; }
.aa-tags .tag-amber { background: #FEF3C7; color: #B45309; } .aa-tags .tag-grey { background: #F1F5F9; color: #475569; } .aa-tags .tag-red { background: #FEE2E2; color: #B91C1C; }
.aa-tags .tag-add { width: 26px; height: 28px; border-radius: 8px; }
@media (max-width: 1439px) { .aa-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } .aa-split { grid-template-columns: minmax(0, 1fr) 440px; } .aa-toolbar { flex-wrap: wrap; } .aa-filters { justify-content: flex-start; flex-wrap: wrap; } .aa-table { table-layout: auto; } .aa-cols, .aa-bottom { grid-template-columns: 1fr; } }
@media (max-width: 1279px) { .aa-split { grid-template-columns: minmax(0, 1fr); } .aa-cols, .aa-bottom { grid-template-columns: 1fr 1fr; } }
@media (max-width: 1023px) { .aa-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .aa-kpis { grid-template-columns: 1fr 1fr; gap: 10px; } .aa-tabs { width: 100%; overflow-x: auto; } .aa-cols, .aa-bottom, .aa-metrics, .aa-tiles { grid-template-columns: 1fr 1fr; } .aa-head .aa-logo { --brand-size: 64px; } .aa-head-text { padding-right: 40px; } }

/* ===== Add Affiliate Account wizard (design-reference/Forms/Affilaite/affiliate-1..8.png) ===== */
.ww-overlay.is-acw .ww-panel { top: 0; right: 0; bottom: 0; width: min(1070px, 100%); animation: slideIn .22s cubic-bezier(.2,.8,.2,1); }
.is-acw .ww-head { padding: 12px 22px; }
.is-acw .ww-head-text h1 { font-size: 21px; }
.is-acw .ww-close { border: 1px solid var(--color-border); border-radius: 8px; }
.acw-body { grid-template-columns: 208px minmax(0, 1fr); }
.acw-body.has-side { grid-template-columns: 208px minmax(0, 1fr) 258px; }
.acw-rail { padding: 14px 10px 14px 12px; gap: 6px; }
.acw-rail .ww-rail-item { padding: 8px 8px; }
.acw-rail .ww-rail-text strong { font-size: 13px; }
.acw-rail .ww-rail-text span { font-size: 11.5px; white-space: normal; line-height: 1.25; }
.acw-content { padding: 16px 18px 26px; }
.acw-title { margin-bottom: 12px; }
.acw-title h2 { font-size: 19px; }
.acw-side { padding: 16px 16px 24px 0; gap: 10px; }
.acw-side .ow-tip { padding: 12px; border-radius: 10px; }
.acw-tip p { font-size: 12px; }
.acw-tip.green { background: #F0FDF4; border-color: #DCFCE7; }
.acw-tip.blue { background: #EFF6FF; border-color: #DBEAFE; }
.acw-tip.purple { background: #F5F3FF; border-color: #EDE9FE; }
.acw-tip.amber { background: #FFFBEB; border-color: #FDE68A; }
.acw-tip.amber-soft { background: #FFFBEB; border-color: #FEF3C7; }
.acw-tip.amber .ow-tip-head strong { color: #B45309; }
.acw-tip.amber .icon-tile { background: #FEF3C7; color: #D97706; }
.acw-tip.purple .ow-tip-head strong { color: #6D28D9; }
.acw-tip.purple .icon-tile { background: #EDE9FE; color: #7C3AED; }
.acw-tip.amber-soft .icon-tile { background: #FEF3C7; color: #D97706; }
.acw-tip-inline { display: flex; gap: 10px; align-items: flex-start; }
.acw-tip-inline .icon-tile { width: 26px; height: 26px; border-radius: 50%; flex: none; margin-top: 1px; }
.acw-tip-inline strong { display: block; font-size: 12.5px; font-weight: 700; color: var(--color-text); margin-bottom: 2px; }
.acw-tip-inline p { font-size: 12px; line-height: 1.4; }
.acw-ticks li { font-size: 12px; }
.acw-ticks.blue li .icon { color: var(--color-primary); }
.acw-ticks.purple li .icon { color: #7C3AED; }
.acw-links { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.acw-links li { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.acw-links li a { flex: 1; color: #6D28D9; font-weight: 500; }
.acw-links li > .icon { color: #7C3AED; }
.acw-link-dot { width: 18px; height: 18px; border-radius: 50%; background: #EDE9FE; color: #7C3AED; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.acw-sum { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.acw-sum li { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--color-text-secondary); }
.acw-sum li strong { margin-left: auto; color: var(--color-text); font-weight: 600; text-align: right; }
.acw-sum-ic { width: 18px; height: 18px; border-radius: 50%; background: var(--color-primary-soft-2); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.acw-card { padding: 12px 14px 14px; }
.acw-card .ww-card-head { margin-bottom: 10px; }
.acw-card .ww-card-head .acw-head-btn { margin-left: auto; height: 32px; padding: 0 10px; font-size: 12px; gap: 5px; color: var(--color-primary-text); }
.acw-card .ww-card-head .acw-head-btn .icon { color: var(--color-primary); }
.acw-card-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.acw-card-title h3 { font-size: 14.5px; font-weight: 700; }
.acw-card-title p { font-size: 12px; color: var(--color-text-secondary); margin-top: 1px; }
.acw-card-title .acw-head-btn { height: 32px; padding: 0 10px; font-size: 12px; gap: 5px; flex: none; color: var(--color-primary-text); }
.acw-content .ww-label { font-size: 12.5px; font-weight: 600; margin-bottom: 6px; white-space: normal; line-height: 1.25; }
.acw-content .ww-control.has-icon .ww-icon-dyn + .form-select, .acw-content .ww-control.has-icon .ww-icon-dyn + .form-control, .acw-content .ww-grid.ow-grid .ww-control.has-icon .ww-icon-dyn + .form-select, .acw-content .ww-grid.cols-3 .ww-control.has-icon .ww-icon-dyn + .form-select, .acw-content .ww-grid.cols-4-eq .ww-control.has-icon .ww-icon-dyn + .form-select { padding-left: 42px; }
.acw-content .ww-control.has-addon .form-control { padding-right: 42px; }
.acw-content .ww-control .form-control[type=date] { font-size: 11.5px; padding-left: 30px; padding-right: 6px; }
.acw-cb > span:last-child { white-space: nowrap; }
.acw-cb .cw-check-text span { white-space: normal; }
.acw-content .ww-hint { font-size: 11px; margin-top: 4px; }
.acw-content .form-control, .acw-content .form-select { font-size: 12.5px; }
.acw-content .ww-control .form-control, .acw-content .ww-control .form-select { height: 40px; }
.acw-content .ww-grid.cols-3 .ww-control.has-icon .form-select, .acw-content .ww-grid.cols-4-eq .ww-control.has-icon .form-select { padding-left: 32px; font-size: 12px; }
.acw-content .ww-grid.cols-4-eq { gap: 12px 10px; }
.acw-content .ww-grid.cols-4-eq .form-select, .acw-content .ww-grid.cols-4-eq .form-control { font-size: 12px; }
.acw-content .ww-textarea-wrap .form-textarea { min-height: 72px; font-size: 12.5px; }
.acw-content .ww-chips.plain { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.acw-content .ww-chip { height: 28px; font-size: 12px; padding: 0 6px 0 9px; }
.acw-content .ww-chip-btn, .acw-content .ww-chip-input, .acw-content .ww-chip-select { height: 28px; font-size: 12px; }
.acw-block { margin: 14px 0; }
.acw-basics-top { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 14px; margin-bottom: 14px; }
.acw-company-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; background: #F8FAFC; border: 1px solid #EDF2F7; border-radius: 10px; padding: 10px; }
.acw-company .ww-control.has-icon .form-select { padding-left: 44px; }
.acw-company .ww-icon .brand { --brand-size: 26px; border-radius: 6px; }
.acw-newco { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; color: var(--color-text-secondary); padding-bottom: 6px; white-space: nowrap; }
.acw-newco .link-btn { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; color: var(--color-primary-text); font-size: 12px; }
.acw-desc-row { grid-template-columns: minmax(0, 1fr) 250px; }
.acw-desc .ww-textarea-wrap .form-textarea { min-height: 112px; }
.acw-logo-row { display: flex; gap: 8px; }
.acw-upload { flex: 1; border: 1.5px dashed var(--color-border-strong); border-radius: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 12px; cursor: pointer; background: #F8FAFC; min-height: 112px; }
.acw-upload:hover { border-color: var(--color-primary); }
.acw-upload .icon-tile { width: 32px; height: 32px; border-radius: 8px; }
.acw-upload strong { font-size: 12.5px; color: var(--color-primary-text); }
.acw-upload small { font-size: 10.5px; color: var(--color-text-muted); }
.acw-logo-preview { width: 92px; border: 1px solid var(--color-border); border-radius: 10px; dis width: 92px; border: 1px solid var(--color-border); border-radius: 50%; display: flex; align-items: center; justify-content: center; padding: 8px; background: var(--color-surface); ground: #EDE9FE; color: #6D28D9; }
.acw-grid-2-1 { grid-template-columns: minmax(0, 1fr) 240px; }
.acw-grid-1-2 { grid-template-columns: 220px minmax(0, 1fr); }
.acw-grid-3-2 { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.acw-cred-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 14px; margin-top: 14px; }
.acw-pass { display: flex; gap: 6px; align-items: center; }
.acw-pass .ww-control { flex: 1; }
.acw-eye { width: 40px; height: 40px; border: 1px solid var(--color-border); border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; color: var(--color-text-secondary); background: var(--color-surface); flex: none; }
.acw-generate { height: 40px; padding: 0 12px; font-size: 12.5px; color: var(--color-primary-text); background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); flex: none; }
.acw-status-row { margin-top: 14px; }
.acw-toggle { display: flex; align-items: center; gap: 8px; height: 40px; }
.acw-toggle-state { font-size: 13px; font-weight: 500; color: var(--color-text); }
.acw-check { padding: 4px 0; }
.acw-check .cw-check-text strong { font-size: 13px; }
.acw-check .cw-check-text span { font-size: 11.5px; }
.acw-share-row { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 12px; align-items: start; margin-top: 4px; }
.acw-members { display: flex; flex-direction: column; gap: 6px; }
.acw-member-box { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; border: 1px solid var(--color-border); border-radius: 8px; padding: 5px 8px; min-height: 40px; }
.acw-member { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 6px 0 3px; border-radius: 999px; background: var(--color-primary-soft); color: var(--color-primary-text); font-size: 12px; font-weight: 500; }
.acw-member .ww-avatar { width: 20px; height: 20px; font-size: 9px; }
.acw-member-caret { margin-left: auto; color: var(--color-text-muted); display: inline-flex; }
.acw-member-add .ww-chip-btn { color: var(--color-primary-text); background: var(--color-primary-soft); border-color: transparent; }
.acw-stack { display: flex; flex-direction: column; gap: 12px; }
.acw-notes .ww-textarea-wrap .form-textarea { min-height: 96px; }
.acw-verified { display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 40px; }
.acw-verified-ok { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: #15803D; font-weight: 500; }
.acw-verified .link-btn { font-size: 12px; color: var(--color-primary-text); font-weight: 600; }
/* step 3 */
.acw-3grid { display: grid; grid-template-columns: minmax(0, 1fr) 246px; gap: 12px; align-items: start; }
.acw-side3 { display: flex; flex-direction: column; gap: 10px; }
.acw-side3 .ow-tip { padding: 12px; border-radius: 10px; }
.acw-search .form-control { height: 38px; padding-left: 34px; font-size: 12.5px; }
.acw-search > .icon { left: 11px; }
.acw-site-list { display: flex; flex-direction: column; margin-top: 8px; border: 1px solid var(--color-border); border-radius: 10px; overflow: hidden; }
.acw-site-list.is-invalid { border-color: var(--color-danger); }
.acw-site-row { display: grid; grid-template-columns: 22px 32px minmax(0, 1fr) 96px 110px 30px; gap: 10px; align-items: center; padding: 9px 10px; border-bottom: 1px solid var(--color-divider); }
.acw-site-row:last-child { border-bottom: 0; }
.acw-site-row.is-on { background: #F8FAFF; }
.acw-site-text { min-width: 0; }
.acw-site-text strong { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; }
.acw-site-text strong .badge { height: 18px; font-size: 10px; padding: 0 6px; }
.acw-site-text span { display: block; font-size: 11px; color: var(--color-text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acw-site-meta { display: flex; flex-direction: column; line-height: 1.2; }
.acw-site-meta span { font-size: 10.5px; color: var(--color-text-secondary); }
.acw-site-meta strong { font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acw-site-menu .btn-icon { width: 28px; height: 28px; border: 1px solid var(--color-border); border-radius: 7px; }
.acw-geotabs { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 8px; }
.acw-geotab { height: 30px; padding: 0 12px; border-radius: 7px; font-size: 12px; font-weight: 500; color: var(--color-text-secondary); background: var(--color-surface); }
.acw-geotab:hover { background: var(--color-surface-muted); }
.acw-geotab.is-active { background: var(--color-primary); color: #fff; font-weight: 600; }
.acw-geo-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; margin-bottom: 10px; }
.acw-show { display: inline-flex; align-items: center; gap: 5px; height: 38px; padding: 0 10px; border: 1px solid var(--color-border); border-radius: 8px; font-size: 12px; color: var(--color-text-secondary); white-space: nowrap; }
.acw-show strong { color: var(--color-text); font-weight: 600; }
.acw-geo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.acw-geo-grid.is-invalid { outline: 2px solid var(--color-danger-soft); border-radius: 8px; }
.acw-geo { display: flex; align-items: center; gap: 6px; border: 1px solid var(--color-border); border-radius: 9px; padding: 8px 8px; cursor: pointer; min-height: 48px; background: var(--color-surface); }
.acw-geo.is-on { background: #EFF6FF; border-color: #BFDBFE; }
.acw-geo .flag { width: 22px; height: 15px; border-radius: 3px; flex: none; }
.acw-geo-text { flex: 1; min-width: 0; line-height: 1.2; }
.acw-geo-text strong { display: block; font-size: 11.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -.01em; }
.acw-geo-text span { font-size: 11px; color: var(--color-text-secondary); }
.acw-geo .badge { height: 18px; font-size: 9.5px; padding: 0 5px; flex: none; }
.acw-sel-box { margin-top: 10px; background: #F8FAFC; border: 1px solid #EDF2F7; border-radius: 10px; padding: 10px 12px; }
.acw-sel-box > strong { display: block; font-size: 12.5px; font-weight: 700; margin-bottom: 8px; }
.acw-sel-list { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.acw-sel-geo { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; }
.acw-sel-geo .flag { width: 18px; height: 12px; border-radius: 2px; }
.acw-sel-geo .badge { height: 20px; font-size: 10.5px; cursor: pointer; }
/* step 4 */
.acw-deal-row { display: flex; align-items: center; gap: 12px; background: #F8FAFC; border: 1px solid #EDF2F7; border-radius: 10px; padding: 10px 12px; }
.acw-deal-row .brand { --brand-size: 52px; border-radius: 8px; flex: none; }
.acw-deal-text { flex: 1; min-width: 0; }
.acw-deal-text strong { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 700; }
.acw-deal-text strong .badge { height: 20px; font-size: 10.5px; }
.acw-deal-text span { display: block; font-size: 12px; color: var(--color-text-secondary); }
.acw-deal-text small { display: block; font-size: 11.5px; color: var(--color-text-secondary); margin-top: 3px; }
.acw-deal-row .btn-sm { height: 32px; font-size: 12px; gap: 5px; flex: none; }
.acw-deal-row .btn-icon { width: 28px; height: 28px; flex: none; }
.acw-mini-check { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--color-text-secondary); margin-top: 6px; }
.acw-mini-check .check-box { width: 16px; height: 16px; border-radius: 4px; }
.acw-content .form-control:disabled, .acw-content .form-select:disabled { background: #F8FAFC; color: var(--color-text); opacity: 1; }
.acw-perm-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, .85fr); gap: 12px; }
.acw-cb-grid { display: grid; grid-template-columns: repeat(var(--cols, 3), auto); justify-content: start; gap: 8px 14px; }
.acw-cb { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--color-text); }
.acw-cb .check-box { width: 18px; height: 18px; border-radius: 5px; flex: none; }
.acw-cb .cw-check-text strong { font-size: 13px; }
.acw-cb .cw-check-text span { font-size: 11.5px; display: block; }
.acw-special .ww-textarea-wrap .form-textarea { min-height: 90px; }
.acw-contact-notes .ww-textarea-wrap .form-textarea { min-height: 40px; }
/* step 5 */
.acw-link-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.acw-link-chip { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border: 1px solid var(--color-border); border-radius: 8px; font-size: 12.5px; font-weight: 600; color: var(--color-text); }
.acw-link-chip.is-on { border-color: #BFDBFE; background: #F8FAFF; }
.acw-link-chip .badge { height: 20px; font-size: 10.5px; }
.acw-link-chip > .icon { color: var(--color-primary); }
.acw-link-row .btn { height: 38px; font-size: 12.5px; gap: 5px; color: var(--color-primary-text); }
.acw-link-row .btn .icon { color: var(--color-primary); }
.acw-link-select { margin-top: 8px; }
.acw-newlink { margin-top: 10px; }
.acw-newlink.is-hidden { display: none; }
.acw-url { display: flex; align-items: center; gap: 8px; margin-top: 10px; background: #EFF6FF; border: 1px solid #DBEAFE; border-radius: 8px; padding: 9px 12px; font-size: 12.5px; color: var(--color-primary-text); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; word-break: break-all; }
.acw-url .btn-icon { margin-left: auto; color: var(--color-primary); flex: none; width: 26px; height: 26px; }
.acw-params { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 12px; }
.acw-preview { background: #F8FAFC; border: 1px solid #EDF2F7; border-radius: 10px; padding: 10px; font-size: 11px; }
.acw-preview strong { display: block; font-size: 12px; margin-bottom: 6px; }
.acw-preview code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10.5px; color: var(--color-text-secondary); word-break: break-all; line-height: 1.45; }
.acw-check-data { display: flex; align-items: center; gap: 12px; background: #F8FAFC; border: 1px solid #EDF2F7; border-radius: 10px; padding: 10px 12px; margin-top: 12px; flex-wrap: wrap; }
.acw-check-data .icon-tile { width: 34px; height: 34px; border-radius: 50%; }
.acw-check-data > div { flex: 1; min-width: 160px; }
.acw-check-data strong { display: block; font-size: 12.5px; }
.acw-check-data span:not(.badge) { font-size: 11.5px; color: var(--color-text-secondary); }
.acw-check-data .btn-sm { height: 32px; font-size: 12px; gap: 5px; color: var(--color-primary-text); cursor: pointer; }
.acw-format-ok { height: 24px; }
/* step 6 */
.acw-methods { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.acw-method { position: relative; border: 1.5px solid var(--color-border); border-radius: 10px; padding: 12px 6px 10px; display: flex; flex-direction: column; align-items: center; gap: 6px; background: var(--color-surface); }
.acw-method strong { font-size: 11.5px; font-weight: 600; color: var(--color-text); white-space: nowrap; }
.acw-method.is-on { border-color: var(--color-primary); background: var(--color-primary-soft); }
.acw-method.is-on strong { color: var(--color-primary-text); }
.acw-method-ic { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; }
.acw-method-ic .icon, .acw-method-ic .brand { width: 20px; height: 20px; --brand-size: 20px; }
.acw-method-check { position: absolute; top: 6px; right: 6px; width: 16px; height: 16px; border-radius: 4px; background: var(--color-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.acw-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 12px; align-items: stretch; }
.acw-dashed { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; width: 100%; border: 1.5px dashed var(--color-border-strong); border-radius: 10px; padding: 14px 10px; background: var(--color-surface); cursor: pointer; text-align: center; }
.acw-dashed:hover { border-color: var(--color-primary); background: var(--color-primary-soft); }
.acw-dashed strong { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 700; color: var(--color-primary-text); }
.acw-dashed span { font-size: 11.5px; color: var(--color-text-secondary); }
.acw-dashed > .icon { color: var(--color-primary); }
.acw-upload-box { background: #F8FAFC; }
.acw-payhist { display: flex; flex-direction: column; gap: 8px; }
.acw-payrec { display: flex; align-items: center; gap: 10px; font-size: 12.5px; border: 1px solid var(--color-border); border-radius: 8px; padding: 6px 10px; }
/* step 7 */
.acw-docs { display: flex; flex-direction: column; margin-top: 8px; }
.acw-doc { display: flex; align-items: center; gap: 10px; padding: 8px 4px; border-bottom: 1px solid var(--color-divider); }
.acw-doc:last-child { border-bottom: 0; }
.acw-doc .icon-tile { width: 30px; height: 30px; border-radius: 7px; }
.acw-doc .cw-file-text strong { font-size: 12.5px; }
.acw-doc .cw-file-text span { font-size: 11px; }
.acw-doc .btn-icon { width: 28px; height: 28px; border: 1px solid var(--color-border); border-radius: 7px; }
.acw-expiry { display: flex; align-items: center; gap: 10px; }
.acw-expiry .acw-mini-check { margin-top: 0; white-space: nowrap; }
.acw-expiry .ww-control { flex: 1; }
.acw-reminder { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.acw-reminder .acw-toggle { height: auto; }
.acw-remind-days { width: 130px; height: 32px; font-size: 12px; }
.acw-reminder .ww-hint { width: 100%; margin-top: 0; }
.acw-content .ww-grid + .ww-field, .acw-content .ww-field + .ww-field { margin-top: 12px; }
.acw-vis { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 16px; align-items: start; }
.acw-vis-opts { display: flex; flex-direction: column; gap: 10px; }
.acw-vis-opts .acw-cb { align-items: flex-start; }
.acw-vis-opts .acw-cb .check-box { margin-top: 2px; }
.acw-vis-members { display: flex; flex-direction: column; gap: 6px; }
.acw-vis-members.is-off { opacity: .55; }
.acw-vis-members .form-select { height: 40px; }
/* review */
.acw-review-top { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 12px; margin-bottom: 12px; align-items: stretch; }
.acw-identity { display: flex; gap: 16px; align-items: center; border: 1px solid var(--color-border); border-radius: 12px; padding: 14px 16px; background: #F8FAFC; }
.acw-id-logo { border-radius: 10px; flex: none; }
.acw-id-text { flex: 1; min-width: 0; }
.acw-id-name { display: flex; align-items: center; gap: 8px; font-size: 18px; font-weight: 700; letter-spacing: -.01em; }
.acw-id-name .badge { height: 22px; font-size: 11.5px; }
.acw-id-edit { display: inline-flex; color: var(--color-primary); }
.acw-id-meta { font-size: 12.5px; color: var(--color-text-secondary); margin-top: 6px; }
.acw-id-meta .sep { margin: 0 4px; color: var(--color-text-muted); }
.acw-id-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.acw-ready { align-items: center; }
.acw-review-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: start; }
.acw-review-block { border: 1px solid var(--color-border); border-radius: 12px; padding: 12px 14px; background: var(--color-surface); min-width: 0; }
.acw-review-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.acw-review-head .icon-tile { width: 26px; height: 26px; border-radius: 7px; }
.acw-review-head strong { font-size: 13.5px; font-weight: 700; flex: 1; }
.acw-review-head .btn { height: 26px; padding: 0 8px; font-size: 11.5px; gap: 4px; }
.acw-rv { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 6px; padding: 3px 0; font-size: 12px; align-items: center; }
.acw-rv .k { color: var(--color-text-secondary); }
.acw-rv .v { color: var(--color-text); font-weight: 500; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; min-width: 0; word-break: break-word; }
.acw-rv.full { grid-template-columns: 1fr; }
.acw-rv.wrap { grid-template-columns: 60px minmax(0, 1fr); }
.acw-rv.full .v { line-height: 1.45; font-weight: 400; color: var(--color-text-secondary); }
.acw-rv .badge { height: 20px; font-size: 10.5px; }
.acw-rv-title { font-size: 12.5px; font-weight: 700; margin: 6px 0 4px; }
.acw-list { margin: 0; padding-left: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; font-size: 12px; }
.acw-list li { display: flex; align-items: center; gap: 6px; }
.acw-list li .badge { height: 18px; font-size: 10px; }
.acw-list.acw-geo-list .flag { width: 18px; height: 12px; border-radius: 2px; }
ol.acw-list { counter-reset: n; }
ol.acw-list li::before { counter-increment: n; content: counter(n) "."; color: var(--color-text-secondary); font-size: 11.5px; }
.acw-masked { letter-spacing: .15em; font-weight: 700; }
.acw-eye-sm { display: inline-flex; color: var(--color-primary); }
.acw-secure-note { display: flex; gap: 6px; align-items: flex-start; margin-top: 8px; background: #F0FDF4; border: 1px solid #DCFCE7; border-radius: 8px; padding: 8px 10px; font-size: 11.5px; color: #15803D; line-height: 1.4; }
.acw-secure-note .icon { flex: none; margin-top: 1px; }
.acw-link { color: var(--color-primary-text); display: inline-flex; align-items: center; gap: 4px; }
.acw-wallet { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.acw-doc-chips { display: flex; gap: 10px; flex-wrap: wrap; }
.acw-dates { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 8px; }
.acw-dates div { display: flex; flex-direction: column; gap: 2px; }
.acw-dates span { font-size: 11.5px; color: var(--color-text-secondary); }
.acw-dates strong { font-size: 12.5px; font-weight: 600; }
.acw-dates strong small { font-weight: 400; color: var(--color-text-secondary); }
.acw-next { background: #EFF6FF; border-color: #DBEAFE; }
.acw-next-list { margin-top: 0; }
.acw-foot .btn { height: 42px; }
@media (max-width: 1279px) { .acw-body.has-side { grid-template-columns: 208px minmax(0, 1fr); } .acw-side { display: none; } .acw-3grid { grid-template-columns: 1fr; } .acw-review-grid { grid-template-columns: 1fr 1fr; } .acw-methods { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1023px) { .acw-review-top { grid-template-columns: 1fr; } .acw-basics-top, .acw-desc-row, .acw-cred-row, .acw-share-row, .acw-grid-2-1, .acw-grid-1-2, .acw-grid-3-2, .acw-params, .acw-perm-grid, .acw-vis, .acw-two { grid-template-columns: 1fr; } .acw-site-row { grid-template-columns: 22px 32px minmax(0, 1fr) 30px; } .acw-site-meta { display: none; } }
@media (max-width: 767px) { .ww-overlay.is-acw .ww-panel { width: 100%; } .acw-body, .acw-body.has-side { grid-template-columns: 1fr; display: flex; flex-direction: column; } .acw-rail { flex-direction: row; overflow-x: auto; padding: 10px 12px; gap: 4px; border-right: 0; border-bottom: 1px solid var(--color-divider); } .acw-rail .ww-rail-item { flex: none; padding: 6px 8px; } .acw-rail .ww-rail-item::after { display: none; } .acw-rail .ww-rail-text span { display: none; } .acw-content { padding: 14px 14px 20px; } .acw-content .ww-grid, .acw-content .ww-grid.cols-3, .acw-content .ww-grid.cols-4-eq { grid-template-columns: 1fr; } .acw-geo-grid { grid-template-columns: 1fr 1fr; } .acw-review-grid { grid-template-columns: 1fr; } .acw-methods { grid-template-columns: repeat(2, minmax(0, 1fr)); } .acw-company-row { grid-template-columns: 1fr; } }

/* ===== Archive (Settings → Archive; hidden pages & page features) ===== */
:root { --archive-hl: #F59E0B; --archive-hl-bg: rgba(245,158,11,.14); }
.archive-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.archive-stat { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--color-border); border-radius: var(--r-lg); background: var(--color-bg); }
.archive-stat .v { font-size: 22px; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }
.archive-stat .l { font-size: 11.5px; color: var(--color-text-muted); margin-top: 2px; }
.count-chip { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: var(--r-full); background: var(--color-surface-muted); border: 1px solid var(--color-border); font-size: 11px; font-weight: 600; color: var(--color-text-secondary); }
.archive-row { background: var(--color-surface); }
.archive-row + .archive-row { margin-top: -1px; }
.archive-row.is-archived { background: var(--color-surface-muted); }
.archive-row.has-preview { align-items: flex-start; }
.archive-row.has-preview .icon-tile, .archive-row.has-preview .check, .archive-row.has-preview .flex { margin-top: 2px; }
.archive-look { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.archive-look .l { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--color-text-faint); }
.archive-look .avatar { margin-right: -4px; }
.archive-bulk { display: flex; align-items: center; gap: 12px; padding-top: 8px; border-top: 1px solid var(--color-divider); margin-top: 4px; }
.archive-preview-bar { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; padding: 12px 14px; border: 1px solid var(--archive-hl); border-left-width: 3px; border-radius: var(--r-md); background: var(--color-warning-soft); }
.archive-preview-bar.is-active-item { border-color: var(--color-border-strong); background: var(--color-surface-muted); }
.archive-preview-bar .setting-text strong { color: var(--color-text); }
@media (max-width: 900px) { .archive-stats { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .archive-row { flex-wrap: wrap; } .archive-row .flex { width: 100%; justify-content: flex-end; } .archive-preview-bar { flex-wrap: wrap; } }

/* =====================================================================
   12. Dashboard v2 (design-reference-new/dashboard.png)
   ===================================================================== */
body.page-dashboard { --page-pad: 20px; --gap: 16px; background: #F3F8FD; }

/* --- sidebar ------------------------------------------------------- */
.sidebar { background: var(--color-sidebar); }
.sidebar-brand { padding: 18px 14px 10px; }
.brand-mark { width: 36px; height: 36px; }
.brand-name { font-size: 15.5px; font-weight: 700; }
.brand-tag { font-size: 11.5px; }
.sidebar-nav { padding: 12px 13px 4px; gap: 3px; }
.nav-item { height: 37px; padding: 0 12px; gap: 11px; font-size: 13.5px; font-weight: 500; border-radius: 9px; color: #D2DCE8; }
.nav-item.is-active { background: var(--color-sidebar-active); color: #fff; font-weight: 600; box-shadow: 0 6px 14px rgba(0,105,252,.32); }
.nav-item .nav-icon { width: 17px; height: 17px; }
.sidebar-promo { position: relative; margin: 10px 13px 6px; padding: 12px 12px 11px; background: var(--color-sidebar-promo); border: 1px solid rgba(255,255,255,.09); border-radius: 12px; display: block; overflow: hidden; }
.promo-head { display: block; }
.promo-text { display: flex; flex-direction: column; font-size: 12.5px; font-weight: 700; line-height: 1.34; color: #fff; padding-right: 2px; }
.promo-text span:last-child { color: #fff; font-weight: 700; }
.promo-art { position: absolute; top: 10px; right: 10px; width: 52px; height: 36px; opacity: .95; }
.promo-lines { margin: 9px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: 12px; color: #C8D4E2; }
.promo-lines li { display: flex; align-items: center; gap: 8px; }
.promo-lines li::before { content: none; }
.promo-dot { width: 15px; height: 15px; flex: none; border-radius: 50%; background: #0069FC; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.promo-dot .icon { width: 9px; height: 9px; stroke-width: 3; }
.sidebar-user { border-top: 0; padding: 10px 14px 16px; }
.sidebar-user .user-row { gap: 10px; padding: 6px 4px; }
.sidebar-user .avatar { background: #5D7392; color: #fff; font-weight: 700; }
.sidebar-user .user-name { font-size: 13.5px; }
.sidebar-user .user-role { font-size: 11.5px; }
.user-chevron { color: #C9D5E3; }

/* --- topbar -------------------------------------------------------- */
.topbar { height: 55px; background: #F7FBFF; border-bottom: 1px solid #E4EEFA; gap: 10px; }
.topbar-search { height: 34px; width: min(432px, 100%); max-width: 432px; background: #EDF3FB; border-color: #E3EBF7; border-radius: 9px; padding: 0 8px 0 12px; }
.topbar-search .icon { color: #617695; width: 16px; height: 16px; }
.topbar-search-text { font-size: 13.5px; color: #5A6A85; }
.topbar-search kbd { background: #FFF; border-color: #E0E8F4; color: #67768D; font-size: 10.5px; }
.topbar-right { gap: 12px; }
.period-select { height: 36px; background: #fff; border: 1px solid #E1EAF7; border-radius: 9px; padding: 0 6px 0 11px; gap: 7px; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
.period-select .icon { color: #2563EB; width: 17px; height: 17px; }
.period-input { font-size: 13px; font-weight: 700; color: #0F2748; padding-right: 20px; }
.topbar-bell { width: 34px; height: 34px; color: #16233D; }
.topbar-bell .icon { color: #16233D; width: 23px; height: 23px; }
.topbar-bell.has-unread:not(.has-count)::after { width: 9px; height: 9px; }
.topbar-bell.has-unread:not(.has-count)::after { top: 5px; right: 6px; width: 8px; height: 8px; border-color: #F7FBFF; }
.topbar-avatar { gap: 9px; }
.topbar-user-meta { display: flex; }
.topbar-user-meta .user-name { font-size: 13px; font-weight: 700; color: #16233D; }
.topbar-user-meta .user-role { font-size: 11.5px; color: #66768D; }
.topbar-user .topbar-avatar > .avatar { background: #5D7392; color: #fff; font-weight: 700; }

/* --- page header --------------------------------------------------- */
body.page-dashboard .page-content { padding-top: 11px; padding-bottom: 0; }
body.page-dashboard .page-header { margin: 0 0 9px; align-items: center; gap: 12px; flex-wrap: nowrap; }
body.page-dashboard .page-header-main { flex: 1 1 auto; }
body.page-dashboard .page-title { font-size: 30px; font-weight: 800; letter-spacing: -.025em; line-height: 1.15; color: #0B1F3A; }
body.page-dashboard .page-title .wave { margin-left: 8px; vertical-align: -2px; }
body.page-dashboard .page-subtitle { margin-top: 1px; font-size: 14px; color: #5A7194; white-space: nowrap; }
body.page-dashboard .page-actions { gap: 12px; align-items: center; flex-wrap: nowrap; }
.quote-card { display: flex; align-items: center; gap: 9px; background: #E9F2FE; border: 1px solid #DCEAFD; border-radius: 10px; padding: 8px 10px; flex: 0 0 196px; min-height: 50px; }
.quote-card p { font-size: 12.5px; line-height: 1.42; color: #2F4A72; font-weight: 500; }
.quote-card .quote-art { color: #2563EB; flex: none; }
.btn-add-new { height: 48px; border-radius: 10px; background: #0B1A2F; color: #fff; font-size: 13.5px; font-weight: 600; padding: 0 12px; flex: none; display: inline-flex; align-items: center; gap: 9px; box-shadow: 0 6px 16px rgba(11,26,47,.22); }
.btn-add-new:hover { background: #142743; }
.btn-add-new .btn-sep { width: 1px; height: 20px; background: rgba(255,255,255,.18); margin: 0 2px 0 6px; }
.btn-add-new .btn-caret { opacity: .9; margin: 0; }

/* --- stat cards ------------------------------------------------------ */
.stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); margin-bottom: var(--gap); }
.stat-card { position: relative; display: flex; align-items: center; gap: 15px; background: #fff; border: 1px solid #E6EFF9; border-radius: 14px; padding: 16px 18px 16px 20px; box-shadow: 0 1px 2px rgba(15,23,42,.04); overflow: hidden; transition: box-shadow var(--t-fast), transform var(--t-fast); }
.stat-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--stat-accent, #2563EB); }
.stat-card:hover { box-shadow: 0 6px 18px rgba(15,23,42,.07); transform: translateY(-1px); }
.stat-body { flex: 1 1 auto; min-width: 0; }
.stat-icon { width: 46px; height: 46px; flex: none; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; background: var(--stat-soft, #EFF6FF); color: var(--stat-accent, #2563EB); }
.stat-icon .icon { width: 25px; height: 25px; stroke-width: 2.2; }
.stat-label { font-size: 12.5px; font-weight: 500; color: #64768E; letter-spacing: .01em; }
.stat-value { font-size: 28px; font-weight: 800; letter-spacing: -.025em; color: #0B1F3A; line-height: 1.18; margin-top: 1px; font-variant-numeric: tabular-nums; }
.stat-note { font-size: 12px; color: #647691; margin-top: 2px; }
.stat-card.tone-green  { --stat-accent: #12B76A; --stat-soft: #DCFBE9; }
.stat-card.tone-purple { --stat-accent: #8631FF; --stat-soft: #EDE4FE; }
.stat-card.tone-blue   { --stat-accent: #0A72FE; --stat-soft: #DBEDFE; }
.stat-card.tone-amber  { --stat-accent: #F79C0A; --stat-soft: #FEEFD8; }
.delta { display: inline-flex; align-items: center; gap: 3px; font-size: 12.5px; font-weight: 600; color: #0B7B3C; white-space: nowrap; }
.delta .icon { width: 13px; height: 13px; stroke-width: 2.6; }
.delta.down { color: #EF4444; }
.delta.flat { color: #67768B; }
.delta-chip { height: 26px; padding: 0 10px; border-radius: 999px; background: #E4F8EC; flex: none; align-self: flex-start; }
.delta-chip.down { background: #FDE7E7; }
.delta-chip.flat { background: #EEF2F8; }

/* --- shared card chrome -------------------------------------------- */
body.page-dashboard .card { border-color: #E6EFF9; border-radius: 12px; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
body.page-dashboard .card-head { padding: 12px 16px 0; align-items: flex-start; gap: 10px; }
.donut-card .card-head { padding: 12px 12px 0; gap: 6px; align-items: center; flex-wrap: nowrap; }
.donut-card .card-head-main { gap: 7px; flex: 0 1 auto; }
.donut-card .card-icon { width: 26px; height: 26px; border-radius: 7px; }
.donut-card .card-icon .icon { width: 16px; height: 16px; }
body.page-dashboard .donut-card .card-title { white-space: nowrap; font-size: 14px; }
.card-head-main { display: flex; align-items: center; gap: 11px; min-width: 0; }
.card-icon { width: 34px; height: 34px; flex: none; border-radius: 9px; background: #E6F3FE; color: #1B7BF8; display: inline-flex; align-items: center; justify-content: center; }
.mini-icon { color: #1B7BF8; display: inline-flex; flex: none; }
body.page-dashboard .card-title { font-size: 15px; font-weight: 700; letter-spacing: -.01em; line-height: 1.2; color: #0E2340; }
.card-sub { font-size: 13px; line-height: 1.3; color: #5F7694; margin-top: 2px; }
.card-tools { display: flex; align-items: center; gap: 6px; flex: none; }
.soft-select { height: 34px; border: 1px solid #E1EAF7; background: #fff; border-radius: 9px; font-size: 12.5px; font-weight: 600; color: #223A5E; padding: 0 26px 0 11px; appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23334E75' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 8px center; }
.btn-line { height: 34px; border: 1px solid #E1EAF7; background: #fff; border-radius: 9px; font-size: 12.5px; font-weight: 600; color: #223A5E; padding: 0 12px; display: inline-flex; align-items: center; gap: 6px; }
.btn-line:hover { background: #F6FAFF; }
.btn-line .icon { color: #33507C; }
.card-menu > button { width: 32px; height: 34px; border: 1px solid #E1EAF7; border-radius: 9px; background: #fff; color: #33507C; display: inline-flex; align-items: center; justify-content: center; }
.view-all { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; color: #1B6FE8; flex: none; white-space: nowrap; }
.view-all .icon { width: 14px; height: 14px; }

/* --- rows ----------------------------------------------------------- */
.dash-row { display: grid; gap: var(--gap); margin-bottom: var(--gap); }
.dash-row-charts { grid-template-columns: minmax(0, 1fr) 380px; align-items: stretch; }
.dash-row-two { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.dash-row > .card { display: flex; flex-direction: column; }

/* --- trend chart ---------------------------------------------------- */
.chart-tooltip { border-radius: 10px; }

/* --- donut ---------------------------------------------------------- */
.donut-card { display: flex; flex-direction: column; }
.donut-body { display: flex; align-items: center; gap: 8px; padding: 12px 11px 16px; flex: 1; }
.donut-wrap { position: relative; flex: none; width: 160px; height: 160px; }
.donut-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.donut-center .v { font-size: 19px; font-weight: 800; color: #0B1F3A; letter-spacing: -.02em; }
.donut-center .l { font-size: 11px; color: #647690; margin-top: 1px; }
.donut-legend { list-style: none; margin: 0; padding: 0; flex: 1 1 auto; min-width: 0; max-width: 340px; display: flex; flex-direction: column; gap: 10px; }
.donut-legend li { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto auto; align-items: center; gap: 6px; font-size: 12.5px; }
.donut-legend .dot { width: 9px; height: 9px; border-radius: 50%; }
.donut-legend .lg-name { color: #2C425F; font-weight: 500; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.donut-legend .lg-pct { color: #647691; font-size: 12px; min-width: 32px; text-align: right; }
.donut-legend .lg-val { color: #0B1F3A; font-weight: 700; font-size: 12.5px; min-width: 50px; text-align: right; }

/* --- mini tables ---------------------------------------------------- */
.mini-card .card-head { padding: 14px 15px 11px; align-items: center; gap: 8px; }
.mini-card .card-head-main { gap: 9px; }
body.page-dashboard .mini-card .card-title { font-size: 15px; white-space: nowrap; }
.mini-table { width: 100%; border-collapse: collapse; }
.mini-table th { background: #F1F6FD; font-size: 12px; font-weight: 600; color: #3E5A82; text-align: left; padding: 9px 10px; white-space: nowrap; }
.mini-table th.c-num, .mini-table th.c-pct { text-align: right; }
.mini-table th.c-rank { width: 34px; padding-left: 14px; text-align: left; }
.mini-table th.c-pct { padding-right: 14px; }
.mini-table td { padding: 8px 10px; font-size: 13.5px; border-bottom: 1px solid #F0F4FA; vertical-align: middle; }
.mini-table tr:last-child td { border-bottom: 0; }
.mini-table tbody tr[data-href] { cursor: pointer; }
.mini-table tbody tr[data-href]:hover { background: #F8FBFF; }
.mini-table td.c-rank { width: 34px; padding-left: 14px; font-weight: 700; color: #16294A; }
.mini-table td.c-num { text-align: right; font-weight: 700; color: #0B1F3A; font-variant-numeric: tabular-nums; }
.mini-table td.c-pct { text-align: right; padding-right: 14px; color: #657692; font-variant-numeric: tabular-nums; }
.mini-table .entity { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mini-table .entity-name { font-size: 13.5px; color: #223A5E; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-empty { text-align: center; color: #637692; padding: 18px 10px; font-size: 12.5px; }
.site-icon.is-other, .flag-badge.is-other { background: #E7F0FD; color: #1B6FE8; display: inline-flex; align-items: center; justify-content: center; }
.flag-badge { width: 24px; height: 24px; border-radius: 7px; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; flex: none; background: #F1F5FB; }
.flag-badge .flag-cell { gap: 0; }
.flag-badge img.flag { width: 24px !important; height: 24px !important; object-fit: cover; border-radius: 6px; }
.flag-badge.is-other { border-radius: 7px; }
.deal-pill { display: inline-flex; align-items: center; height: 26px; padding: 0 12px; border-radius: 7px; font-size: 12.5px; font-weight: 600; }
.deal-pill.tone-blue { background: #E4EFFE; color: #1B6FE8; }
.deal-pill.tone-green { background: #DFF7EA; color: #0C7A45; }
.deal-pill.tone-amber { background: #FDF1DC; color: #8F590B; }
.deal-pill.tone-orange { background: #FDF0DE; color: #C2700F; }
.deal-pill.tone-purple { background: #F0E8FE; color: #7B3BE8; }
.deal-pill.tone-slate { background: #FDE7EF; color: #D9317A; }
.deal-pill.tone-teal { background: #DFF7F1; color: #0F766E; }
.deal-pill.tone-pink { background: #FDE7EF; color: #D9317A; }
.deal-pill.tone-grey { background: #EEF2F8; color: #52637F; }

/* --- company performance -------------------------------------------- */
.perf-head { flex-wrap: nowrap; row-gap: 10px; padding: 13px 15px 12px; align-items: center; gap: 10px; }
.perf-card .card-head-main { flex: none; gap: 9px; }
body.page-dashboard .perf-card .card-title { font-size: 15px; white-space: nowrap; }
.perf-card .card-icon { width: 28px; height: 28px; border-radius: 8px; }
.perf-card .card-icon .icon { width: 17px; height: 17px; }
.perf-tabs { display: flex; gap: 5px; flex: 1; margin-left: 10px; }
.perf-tab { height: 32px; padding: 0 13px; border-radius: 8px; font-size: 12.5px; font-weight: 600; color: #4C6488; background: #F1F5FC; display: inline-flex; align-items: center; white-space: nowrap; }
.perf-tab:hover { background: #E7EFFA; }
.perf-tab.is-active { background: #1079FD; color: #fff; box-shadow: 0 4px 10px rgba(16,121,253,.26); }
.perf-tools { display: flex; align-items: center; gap: 8px; flex: none; }
.perf-search { display: flex; align-items: center; gap: 8px; height: 32px; width: 210px; border: 1px solid #E1EAF7; border-radius: 9px; padding: 0 11px; background: #fff; }
.perf-search .icon { color: #627694; flex: none; }
.perf-search input { border: 0; outline: 0; background: transparent; width: 100%; font-size: 13px; color: #16294A; }
.perf-search input::placeholder { color: #617694; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.perf-table { width: 100%; min-width: 900px; border-collapse: collapse; }
.perf-table th { background: #F1F6FD; font-size: 12px; font-weight: 600; color: #3E5A82; padding: 10px 8px; text-align: center; white-space: nowrap; }
.perf-table th.c-rank { width: 40px; padding-left: 15px; text-align: left; }
.perf-table th.c-name { text-align: left; min-width: 140px; }
.perf-table th.c-action { padding-right: 15px; }
.perf-table td { padding: 9px 8px; font-size: 13.5px; text-align: center; border-bottom: 1px solid #EFF3FA; vertical-align: middle; white-space: nowrap; font-variant-numeric: tabular-nums; }
.perf-table tbody tr:hover { background: #F9FBFF; }
.perf-table td.c-rank { width: 40px; padding-left: 15px; text-align: left; font-weight: 700; color: #16294A; }
.perf-table td.c-name { text-align: left; }
.perf-table td.c-mid { color: #3D69B8; font-weight: 500; }
.perf-table td.c-money { text-align: center; }
.perf-table td.c-money.strong { font-weight: 700; color: #0B1F3A; }
.perf-table td.c-money.muted { color: #647690; }
.perf-table .entity { display: flex; align-items: center; gap: 10px; min-width: 0; }
.perf-table .entity-name { font-size: 13.5px; font-weight: 600; color: #16294A; white-space: nowrap; }
.row-logo { width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.row-logo.is-other, .row-logo.is-deal { background: #EDF3FC; color: #1B6FE8; }
.perf-table .brand { --brand-size: 28px; width: 28px; height: 28px; border-radius: 50%; }
.perf-table .brand img { object-fit: contain; }
.model-pill { display: inline-flex; align-items: center; height: 26px; padding: 0 12px; border-radius: 7px; background: #F1F5FC; color: #35507A; font-size: 12.5px; font-weight: 500; white-space: nowrap; }
.profit-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 74px; height: 27px; padding: 0 11px; border-radius: 7px; background: #E4F8EC; color: #0B7B3C; font-size: 13.5px; font-weight: 700; }
.perf-table td.c-action { padding-right: 15px; }
.row-menu > button { width: 32px; height: 28px; border: 1px solid #E5EDF8; border-radius: 7px; background: #fff; color: #5A75A0; display: inline-flex; align-items: center; justify-content: center; }
.row-menu > button:hover { background: #F4F8FF; }
.perf-table tfoot td { background: #EDF3FB; border-bottom: 0; font-weight: 700; color: #113B7E; padding: 13px 8px; }
.perf-table tfoot td.c-name { color: #0B1F3A; padding-left: 15px; }
.perf-table tfoot td.c-mid { color: #1B5FC4; }
.perf-empty { padding: 20px !important; }

/* --- page footer ---------------------------------------------------- */
.page-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 74px; padding: 8px 2px 4px; font-size: 12.5px; color: #67768E; }
.page-footer-links { display: flex; gap: 30px; }
.page-footer-links a { color: #67768E; font-weight: 500; }
.page-footer-links a:hover { color: #1B6FE8; }


/* --- Add New hub (design-reference-new/dashboard-add-new-modal.png) --- */
.modal.addnew { max-width: 560px; border-radius: 16px; background: #FCFDFF; }
.addnew .addnew-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 24px 4px; }
.addnew .addnew-head h2 { font-size: 26px; font-weight: 800; letter-spacing: -.02em; color: #0B1F3A; }
.addnew .addnew-head p { font-size: 14px; color: #5C74A0; margin-top: 4px; }
.addnew-close { width: 34px; height: 34px; flex: none; border-radius: 9px; background: #EAF1FB; color: #33507C; display: inline-flex; align-items: center; justify-content: center; }
.addnew-close:hover { background: #DCE8F8; }
.addnew .addnew-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; padding: 17px 24px 0; overflow-y: auto; }
.addnew .addnew-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; text-align: left; background: #fff; border: 1px solid #E7EEF8; border-radius: 11px; padding: 12px 11px; transition: border-color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast); }
.addnew .addnew-card:hover { border-color: #B9D3F7; box-shadow: 0 6px 18px rgba(27,111,232,.12); transform: translateY(-1px); }
.addnew-icon { width: 46px; height: 46px; flex: none; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; }
.addnew-icon .icon { width: 26px; height: 26px; stroke-width: 2.3; }
.addnew-icon.tone-blue { background: #DDEBFE; color: #1B6FE8; }
.addnew-icon.tone-purple { background: #EDE3FE; color: #8B3DFD; }
.addnew-icon.tone-green { background: #D9F8E7; color: #12B76A; }
.addnew-icon.tone-orange { background: #FDEBD3; color: #F79C0A; }
.addnew-icon.tone-red { background: #FDDDE5; color: #F0436B; }
.addnew-icon.tone-slate { background: #E7ECF5; color: #3C4C6B; }
.addnew-icon.tone-pink { background: #FDDDE5; color: #F0436B; }
.addnew-text { min-width: 0; display: block; }
.addnew-text strong { display: block; font-size: 15px; font-weight: 700; color: #0E2340; }
.addnew-text span { display: block; font-size: 13px; line-height: 1.42; color: #5F769B; margin-top: 2px; }
.addnew-chev { color: #5D7698; align-self: center; display: inline-flex; margin-left: 2px; }
.addnew-tip { display: flex; align-items: flex-start; gap: 10px; margin: 15px 24px 22px; padding: 12px 14px; background: #E8F1FE; border: 1px solid #D8E7FC; border-radius: 11px; }
.addnew-tip-icon { color: #F2B23B; flex: none; }
.addnew-tip-text strong { display: block; font-size: 12.5px; font-weight: 700; color: #1C4E93; line-height: 1.45; }
.addnew-tip-text span { display: block; font-size: 12.5px; color: #4A6D9E; margin-top: 2px; }
@media (max-width: 560px) { .addnew .addnew-grid { grid-template-columns: minmax(0, 1fr); } .addnew .addnew-head { padding: 18px 16px 4px; } .addnew .addnew-grid { padding-left: 16px; padding-right: 16px; } .addnew-tip { margin-left: 16px; margin-right: 16px; } }

.addnew .addnew-card:focus { outline: none; box-shadow: none; }
.addnew .addnew-card:focus-visible { box-shadow: var(--focus-ring); border-color: #B9D3F7; }

/* dashboard responsive refinements */
@media (max-width: 1180px) {
  body.page-dashboard .page-header { flex-wrap: wrap; }
  body.page-dashboard .page-subtitle { white-space: normal; }
  body.page-dashboard .page-header-main { flex: 1 1 100%; }
  body.page-dashboard .page-actions { flex: 1 1 100%; justify-content: flex-start; }
  .quote-card { flex: 1 1 auto; max-width: 320px; }
}
@media (max-width: 900px) {
  .period-select { padding-left: 8px; }
  .period-input { max-width: 124px; }
  .topbar-user-meta { display: none; }
}
@media (max-width: 640px) {
  .quote-card { display: none; }
  body.page-dashboard .page-title { font-size: 24px; }
  .donut-body { flex-direction: column; align-items: stretch; }
  .donut-wrap { align-self: center; }
}

/* =====================================================================
   Companies / Partners  (design-reference-new/companies-list.png,
   design-reference-new/companies-detail.png)
   List view, compact split view and the partner detail panel.
   ===================================================================== */
.page-companies, .page-accounts {
  /* neutral slate text ramp — the old navy/indigo tints read purple and cheapened the page */
  --cmp-navy: #0F172A; --cmp-ink: #1C2536; --cmp-label: #475569; --cmp-muted: #64748B; --cmp-faint: #67768B;
  --cmp-since: #647596; /* "Partner since …" — deliberately a cooler tone than the category line */
  --cmp-line: #E6EDF7; --cmp-line-soft: #EFF4FB; --cmp-head-bg: #F3F7FD; --cmp-field: #F8FAFD;
  --cmp-blue: #1668F5; --cmp-blue-soft: #E8F0FE;
  --cmp-green: #0F8446; --cmp-green-soft: #E4F7EC;
  --cmp-amber: #A85F05; --cmp-amber-soft: #FDF0DF;
  --cmp-red: #E11D48; --cmp-red-soft: #FDE4E7;
  --cmp-purple-soft: #EFEAFE;
  --cmp-slate-soft: #EDF1F7;
  --cmp-orange: #B44E06; --cmp-orange-soft: #FDE8D6;
  --cmp-radius: 14px;
}
.page-companies .page-content { padding-top: 0; padding-bottom: var(--sp-6); }
.page-companies .page-header { margin: 12px 0 8px; align-items: flex-start; }
.page-companies .page-title { font-size: 30px; font-weight: 700; letter-spacing: -.03em; line-height: 1.16; color: var(--cmp-navy); }
.page-companies .page-subtitle { font-size: 15px; line-height: 1.4; color: #56679A; margin-top: 3px; }
.page-companies .page-actions { gap: 10px; padding-top: 4px; }

/* ---- buttons -------------------------------------------------------- */
.cmp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 18px; border-radius: 10px; font-size: 14.5px; font-weight: 600; white-space: nowrap; border: 1px solid transparent; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast); }
.cmp-btn .icon { flex: none; }
.cmp-btn .flip-y { transform: rotate(180deg); }
.cmp-btn-primary { background: var(--cmp-blue); color: #fff; box-shadow: 0 1px 2px rgba(22,104,245,.25); }
.cmp-btn-primary:hover { background: #0F5BDD; }
.cmp-btn-ghost { background: #fff; color: var(--cmp-ink); border-color: var(--cmp-line); }
.cmp-btn-ghost:hover { background: var(--cmp-field); border-color: #D9E3F2; }
.cmp-btn-soft { height: 31px; padding: 0 10px; border-radius: 9px; background: #fff; border-color: #DCE7F8; color: var(--cmp-blue); font-size: 12.5px; font-weight: 600; gap: 6px; }
.cmp-btn-soft:hover { background: var(--cmp-blue-soft); }

/* ---- status discs (the reference pills use a solid disc + white glyph) */
.cmp-dot { width: 16px; height: 16px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.cmp-dot .icon { width: 10px; height: 10px; stroke-width: 3; }
.cmp-dot i { font-style: normal; font-size: 11px; font-weight: 700; line-height: 1; }
.cmp-dot.tone-green { background: #16A34A; } .cmp-dot.tone-amber { background: #F59E0B; } .cmp-dot.tone-orange { background: #F97316; }
.cmp-dot.tone-red { background: #E11D48; } .cmp-dot.tone-grey { background: #94A3B8; } .cmp-dot.tone-blue { background: #2563EB; }

/* ---- stat tiles ----------------------------------------------------- */
.cmp-stats { display: flex; gap: 11px; margin-bottom: 12px; }
.cmp-tile { flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: 14px; height: 84px; padding: 0 15px; background: #fff; border: 1px solid var(--cmp-line); border-radius: var(--cmp-radius); }
.cmp-tile-icon { width: 38px; height: 38px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.cmp-tile-icon .icon { width: 23px; height: 23px; stroke-width: 2.3; }
.cmp-tile-icon.tone-blue { background: #E4EEFE; color: #1668F5; }
.cmp-tile-icon.tone-green { background: #DFF7E9; color: #16A34A; }
.cmp-tile-icon.tone-amber { background: #FDEFD8; color: #F59E0B; }
.cmp-tile-icon.tone-purple { background: #EDE7FE; color: #7C3AED; }
.cmp-tile-icon.tone-red { background: #FDE3E6; color: #F43F5E; }
.cmp-tile-icon.tone-slate { background: #E7EBF2; color: #6A758A; }
.cmp-tile-dot { width: 25px; height: 25px; border-radius: 50%; background: #16A34A; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.cmp-tile-dot .icon { width: 14px; height: 14px; stroke-width: 3; }
.cmp-tile-body { min-width: 0; }
.cmp-tile-value { font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--cmp-navy); line-height: 1.15; }
.cmp-tile-label { font-size: 14px; font-weight: 500; color: var(--cmp-label); line-height: 1.35; white-space: nowrap; }
.cmp-tile-sub { font-size: 12.5px; color: var(--cmp-muted); line-height: 1.4; white-space: nowrap; }
.cmp-tile-sub.is-up { color: var(--cmp-green); font-weight: 600; display: flex; align-items: center; gap: 3px; }
/* four-up inside the 508px list column of the split view */
.cmp-stats.is-compact { gap: 9px; }
.cmp-stats.is-compact .cmp-tile { flex: 1 1 auto; height: 84px; padding: 0 5px; gap: 6px; }
.cmp-stats.is-compact .cmp-tile-icon { width: 28px; height: 28px; }
.cmp-stats.is-compact .cmp-tile-icon .icon { width: 16px; height: 16px; }
.cmp-stats.is-compact .cmp-tile-dot { width: 18px; height: 18px; }
.cmp-stats.is-compact .cmp-tile-dot .icon { width: 11px; height: 11px; }
.cmp-stats.is-compact .cmp-tile-body { overflow: hidden; }
.cmp-stats.is-compact .cmp-tile-value { font-size: 17px; }
.cmp-stats.is-compact .cmp-tile-label { font-size: 10.5px; letter-spacing: -.01em; }
.cmp-stats.is-compact .cmp-tile-sub { font-size: 10px; letter-spacing: -.01em; }
.cmp-stats.is-compact .cmp-tile-sub .icon { width: 11px; height: 11px; }

/* ---- card + filter row ---------------------------------------------- */
.cmp-card { background: #fff; border: 1px solid var(--cmp-line); border-radius: var(--cmp-radius); overflow: hidden; }
.cmp-filters { display: flex; align-items: center; gap: 9px; padding: 9px; }
.cmp-filters-gap { flex: 1 1 auto; }
.cmp-filters > .cmp-select, .cmp-filters > .cmp-filter-btn { flex: none; }
.cmp-search { flex: 0 1 255px; min-width: 150px; display: flex; align-items: center; gap: 9px; height: 36px; padding: 0 12px; border: 1px solid #E5EDFA; border-radius: 10px; background: var(--cmp-field); }
.cmp-search .icon { flex: none; color: #5D6E95; stroke-width: 2; }
.cmp-search input { flex: 1 1 auto; min-width: 0; border: 0; background: none; outline: none; font-size: 14px; color: var(--cmp-ink); }
.cmp-search input::placeholder { color: #667595; }
.cmp-search input::-webkit-search-cancel-button { -webkit-appearance: none; }
/* a hidden ghost label sizes each select to its SELECTED option (a native select sizes to its widest one) */
.cmp-select { position: relative; overflow: hidden; display: inline-flex; align-items: center; height: 36px; border: 1px solid #E2ECFB; border-radius: 10px; background: #fff; }
.cmp-select:hover { border-color: #CFDDF3; }
.cmp-select.is-set { border-color: #C5D9FA; background: #F5F9FF; }
.cmp-select-ghost { display: block; height: 0; overflow: hidden; visibility: hidden; white-space: nowrap; font-size: 14px; font-weight: 500; padding: 0 28px 0 11px; }
.cmp-select > select { position: absolute; inset: 0; width: 100%; appearance: none; -webkit-appearance: none; border: 0; background: none; outline: none; padding: 0 28px 0 11px; font-size: 14px; font-weight: 500; color: var(--cmp-ink); cursor: pointer; }
.cmp-select-caret { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); pointer-events: none; color: #3B4C86; stroke-width: 2.2; }
.cmp-sort .cmp-sort-label { padding: 0 0 0 11px; font-size: 14px; font-weight: 500; color: var(--cmp-ink); }
.cmp-sort .cmp-select-ghost { padding: 0 38px 0 4px; }
.cmp-sort > select { left: 44px; width: calc(100% - 44px); padding-left: 4px; }
.cmp-select-sm { height: 34px; }
.cmp-select-sm .cmp-select-ghost, .cmp-select-sm > select { padding: 0 28px 0 11px; font-size: 14px; }
.cmp-filter-btn { width: 37px; height: 36px; flex: 0 0 37px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #E2ECFB; border-radius: 10px; background: #fff; color: #2C3D74; }
.cmp-filter-btn:hover { background: var(--cmp-field); }
.cmp-filter-btn.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: var(--cmp-blue-soft); }

/* ---- table ---------------------------------------------------------- */
.cmp-scroll { overflow-x: auto; }
.cmp-table { width: 100%; table-layout: fixed; border-collapse: collapse; min-width: 1180px; }
.cmp-table thead th { height: 50px; padding: 0; background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); border-bottom: 1px solid var(--cmp-line-soft); font-size: 14px; font-weight: 600; color: #3B4C86; text-align: left; vertical-align: middle; }
.cmp-th { display: inline-flex; align-items: center; gap: 7px; color: inherit; }
.cmp-th span { display: inline-flex; flex-direction: column; line-height: 1.15; }
.cmp-th em { font-style: normal; font-size: 12.5px; font-weight: 500; color: #667499; }
.cmp-th-icon { color: #65749C; stroke-width: 2; }
.cmp-table thead th.is-sorted, .cmp-table thead th.is-sorted .cmp-th-icon { color: var(--cmp-blue); }
.cmp-table tbody td { height: 58px; padding: 0; border-bottom: 1px solid var(--cmp-line-soft); vertical-align: middle; font-size: 14px; color: var(--cmp-ink); }
.cmp-table tbody tr:last-child td { border-bottom: 0; }
.cmp-table tbody tr.cmp-row { cursor: pointer; transition: background var(--t-fast); }
.cmp-table tbody tr.cmp-row:hover { background: #F7FBFF; }
.cmp-table tbody tr.is-selected { background: #F2F7FF; }
.cmp-table col.w-sel { width: 56px; } .cmp-table col.w-partner { width: 214px; } .cmp-table col.w-rel { width: 128px; } .cmp-table col.w-geo { width: 148px; }
.cmp-table col.w-com { width: 116px; } .cmp-table col.w-acct { width: 111px; } .cmp-table col.w-perf { width: 130px; } .cmp-table col.w-pay { width: 140px; }
.cmp-table col.w-att { width: 179px; } .cmp-table col.w-act { width: 68px; }
.cmp-table .c-sel { padding-left: 19px; }
.cmp-table tbody td.c-com { padding-right: 10px; }
.cmp-table tbody td.c-acct, .cmp-table tbody td.c-perf { padding-right: 4px; }
.cmp-check { display: inline-flex; cursor: pointer; }
.cmp-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.cmp-check span { width: 18px; height: 18px; border: 1.5px solid #CBD8EC; border-radius: 5px; background: #fff; display: inline-block; position: relative; transition: background var(--t-fast), border-color var(--t-fast); }
.cmp-check input:checked + span { background: var(--cmp-blue); border-color: var(--cmp-blue); }
.cmp-check input:checked + span::after { content: ""; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.cmp-check input:focus-visible + span { box-shadow: var(--focus-ring); }

.cmp-partner { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cmp-logo { border-radius: 50% !important; border: 1px solid rgba(15,23,42,.05); }
.cmp-partner-text { display: flex; flex-direction: column; min-width: 0; }
.cmp-partner-name { font-size: 15px; font-weight: 700; line-height: 19px; color: var(--cmp-navy); letter-spacing: -.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmp-partner-cat { font-size: 13px; line-height: 17px; color: #5D6E95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp-partner-since { font-size: 12.5px; line-height: 17px; color: var(--cmp-since); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.cmp-pill { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 8px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.cmp-pill.tone-green { background: var(--cmp-green-soft); color: var(--cmp-green); }
.cmp-pill.tone-amber { background: var(--cmp-amber-soft); color: var(--cmp-amber); }
.cmp-pill.tone-blue { background: #E6EFFE; color: #1D4ED8; }
.cmp-pill.tone-red { background: var(--cmp-red-soft); color: var(--cmp-red); }
.cmp-pill.tone-grey { background: var(--cmp-slate-soft); color: #5A6579; }
.cmp-pill.is-plain { height: 24px; padding: 0 9px; }
.cmp-sub { display: block; margin-top: 3px; font-size: 13px; color: var(--cmp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.c-acct .cmp-sub { font-size: 12px; }
.cmp-strong { display: block; font-size: 15px; font-weight: 700; color: var(--cmp-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp-strong.is-long { font-size: 13.5px; }
.cmp-muted { color: var(--cmp-faint); }

.cmp-geos { display: flex; align-items: center; gap: 8px; }
.cmp-flag, .cmp-flag .flag-cell { display: inline-flex; }
.cmp-flag .flag, .cmp-country .flag { width: 21px !important; height: 14px !important; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); }
.cmp-geo-more { width: 27px; height: 27px; flex: none; border-radius: 50%; background: #E7EEFA; color: #2E3E74; font-size: 12.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.cmp-country { display: inline-flex; align-items: center; gap: 9px; }
.cmp-country > span, .cmp-country .flag-cell + span { font-size: 14px; color: var(--cmp-ink); }

.cmp-money { display: block; font-size: 15.5px; font-weight: 700; color: var(--cmp-navy); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cmp-money.is-empty { color: var(--cmp-faint); font-weight: 600; }
.cmp-delta { display: inline-flex; align-items: center; gap: 4px; margin-top: 3px; font-size: 13.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.cmp-delta .icon { stroke-width: 2.4; }
.cmp-delta.is-up { color: var(--cmp-green); } .cmp-delta.is-down { color: var(--cmp-red); } .cmp-delta.is-flat { color: var(--cmp-faint); }

.cmp-pay { display: inline-flex; flex-direction: column; gap: 1px; padding: 4px 8px; border-radius: 10px; }
.cmp-pay-top { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; }
.cmp-pay-sub { font-size: 12.5px; }
.cmp-pay.tone-green { background: var(--cmp-green-soft); } .cmp-pay.tone-green .cmp-pay-top { color: var(--cmp-green); } .cmp-pay.tone-green .cmp-pay-sub { color: #5C6E9C; }
.cmp-pay.tone-amber { background: var(--cmp-amber-soft); } .cmp-pay.tone-amber .cmp-pay-top, .cmp-pay.tone-amber .cmp-pay-sub { color: var(--cmp-orange); }
.cmp-pay.tone-blue { background: #FDEAD4; } .cmp-pay.tone-blue .cmp-pay-top, .cmp-pay.tone-blue .cmp-pay-sub { color: var(--cmp-orange); }
.cmp-pay.tone-red { background: var(--cmp-red-soft); } .cmp-pay.tone-red .cmp-pay-top, .cmp-pay.tone-red .cmp-pay-sub { color: var(--cmp-red); }
.cmp-pay.tone-grey { background: #EEF2F8; } .cmp-pay.tone-grey .cmp-pay-top { color: #6B7588; } .cmp-pay.tone-grey .cmp-pay-sub { color: #69768B; }

.cmp-att { display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 10px; border-radius: 8px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.cmp-att-check { stroke-width: 3.4; }
.cmp-att.tone-green { background: #E1F7EA; color: var(--cmp-green); }
.cmp-att.tone-amber, .cmp-att.tone-orange { background: var(--cmp-orange-soft); color: var(--cmp-orange); }
.cmp-att.tone-red { background: #FCE0E5; color: var(--cmp-red); }

.cmp-table .dropdown { display: inline-flex; }
.cmp-menu .btn-icon, .cmp-ct-menu .btn-icon, .cmp-panel-menu .btn-icon, .cmp-quick-more .btn-icon { width: 33px; height: 33px; border: 1px solid #E3EBF7; border-radius: 9px; background: #fff; color: #37477A; display: inline-flex; align-items: center; justify-content: center; }
.cmp-menu .btn-icon:hover, .cmp-ct-menu .btn-icon:hover, .cmp-panel-menu .btn-icon:hover, .cmp-quick-more .btn-icon:hover { background: var(--cmp-field); border-color: #D3DEF0; }
.cmp-empty-row td { height: auto; padding: 24px 0; }
.cmp-empty-row .empty-state { border: 0; }

/* ---- footer --------------------------------------------------------- */
.cmp-foot { display: flex; align-items: center; gap: 16px; padding: 14px 18px 16px; border-top: 1px solid var(--cmp-line-soft); }
.cmp-foot-info { flex: 1 1 0; font-size: 14px; color: #5D6E95; white-space: nowrap; }
.cmp-pages { display: flex; align-items: center; gap: 8px; }
.cmp-page { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #E3EBF7; border-radius: 9px; background: #fff; font-size: 14px; font-weight: 600; color: var(--cmp-ink); }
.cmp-page:hover { background: var(--cmp-field); }
.cmp-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
.cmp-page.is-disabled { color: #627598; pointer-events: none; }
.cmp-page-gap { color: var(--cmp-faint); }
.cmp-per { flex: 1 1 0; display: flex; align-items: center; justify-content: flex-end; gap: 9px; font-size: 14px; color: #5D6E95; white-space: nowrap; }

/* ---- split view ----------------------------------------------------- */
.cmp-split { display: grid; grid-template-columns: 508px minmax(0, 1fr); gap: 13px; align-items: start; }
/* four tiles inside the 508px list column: sized so no label or sub-line is ever clipped */
.cmp-stats.is-mini { gap: 7px; margin-bottom: 10px; }
.cmp-stats.is-mini .cmp-tile { flex: 1 1 auto; height: 76px; padding: 0 9px; gap: 8px; min-width: 0; }
.cmp-stats.is-mini .cmp-tile-icon { width: 30px; height: 30px; border-radius: 9px; }
.cmp-stats.is-mini .cmp-tile-icon .icon { width: 16px; height: 16px; }
.cmp-stats.is-mini .cmp-tile-value { font-size: 18px; line-height: 1.2; }
.cmp-stats.is-mini .cmp-tile-label { font-size: 11px; letter-spacing: -.012em; line-height: 1.3; }
.cmp-stats.is-mini .cmp-tile-sub { font-size: 9.5px; letter-spacing: -.012em; line-height: 1.35; }
.cmp-stats.is-mini .cmp-tile-sub .icon { width: 10px; height: 10px; }
/* compact tab strip above the filter row */
.cmp-tabs.is-mini { gap: 6px; margin: 0 0 10px; }
.cmp-tabs.is-mini .cmp-tab { height: 34px; padding: 0 11px; gap: 7px; border-radius: 9px; font-size: 12.5px; }
.cmp-tabs.is-mini .cmp-tab-count { min-width: 20px; height: 18px; padding: 0 5px; border-radius: 5px; font-size: 11px; }
.cmp-left { min-width: 0; }
.cmp-tabs { display: flex; align-items: center; gap: 8px; margin: 10px 0; flex-wrap: nowrap; }
.cmp-tab { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 12px; border-radius: 10px; background: #EDF3FB; color: #34457C; font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.cmp-tab:hover { background: #E4EDFA; }
.cmp-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 21px; padding: 0 6px; border-radius: 6px; background: #fff; color: #34457C; font-size: 12.5px; font-weight: 700; }
.cmp-tab.is-active { background: var(--cmp-blue); color: #fff; }
.cmp-tab.is-active .cmp-tab-count { background: rgba(255,255,255,.24); color: #fff; }
.cmp-split .cmp-filters { gap: 8px; }
.cmp-split .cmp-search { flex: 1 1 auto; }
.cmp-split .cmp-select-ghost, .cmp-split .cmp-select > select { padding: 0 28px 0 11px; font-size: 14px; }
.cmp-split .cmp-foot { padding: 12px 14px 14px; gap: 10px; }
.cmp-split .cmp-foot-info, .cmp-split .cmp-per { font-size: 13px; }
.cmp-split .cmp-page { width: 31px; height: 31px; font-size: 13.5px; }
.cmp-table.is-compact { min-width: 0; }
.cmp-table.is-compact col.w-idx { width: 40px; } .cmp-table.is-compact col.w-co { width: 140px; } .cmp-table.is-compact col.w-cat { width: 104px; }
.cmp-table.is-compact col.w-country { width: 66px; } .cmp-table.is-compact col.w-status { width: 106px; } .cmp-table.is-compact col.w-act2 { width: 52px; }
.cmp-table.is-compact thead th { height: 44px; font-size: 13px; }
.cmp-table.is-compact tbody td { height: 49px; font-size: 14px; }
.cmp-table.is-compact .c-idx { padding-left: 11px; color: #5D6E95; font-size: 14px; }
.cmp-table.is-compact .cmp-partner { gap: 9px; }
.cmp-table.is-compact .cmp-logo { border-radius: 50% !important; }
.cmp-table.is-compact .cmp-partner-name { font-size: 13.5px; line-height: 17px; }
.cmp-table.is-compact .cmp-partner-since { font-size: 12.5px; line-height: 16px; }
.cmp-table.is-compact .c-cat { font-size: 13px; color: #5D6E95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 6px; }
.cmp-table.is-compact .cmp-country { gap: 7px; }
.cmp-table.is-compact .cmp-country > span, .cmp-table.is-compact .cmp-country .flag-cell + span { font-size: 13px; }
.cmp-table.is-compact .cmp-pill { height: 25px; padding: 0 8px; font-size: 12.5px; gap: 5px; }
.cmp-table.is-compact .cmp-menu .btn-icon { width: 30px; height: 30px; }
.cmp-table.is-compact tbody tr.is-selected { box-shadow: inset 3px 0 0 var(--cmp-blue); }

/* ---- detail panel ---------------------------------------------------- */
.cmp-panel { background: #fff; border: 1px solid var(--cmp-line); border-radius: var(--cmp-radius); overflow: hidden; }
.cmp-panel-inner { display: flex; flex-direction: column; }
.cmp-panel-empty { padding: 40px 20px; }
.cmp-panel-head { position: relative; display: flex; align-items: flex-start; gap: 16px; padding: 14px 16px 12px; }
.cmp-panel-logo { width: 94px !important; height: 94px !important; border-radius: 50% !important; }
.cmp-panel-title { display: flex; align-items: center; gap: 12px; }
.cmp-panel-title h2 { font-size: 26px; font-weight: 700; letter-spacing: -.03em; color: var(--cmp-navy); }
.cmp-verified { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 11px; border-radius: 8px; background: var(--cmp-green-soft); color: var(--cmp-green); font-size: 13.5px; font-weight: 600; }
.cmp-verified .icon { stroke-width: 2.4; }
.cmp-panel-tagline { margin-top: 4px; font-size: 16px; color: #5D6E95; }
.cmp-panel-pills { display: flex; align-items: center; gap: 9px; margin-top: 9px; flex-wrap: wrap; }
.cmp-chip { display: inline-flex; align-items: center; height: 27px; padding: 0 13px; border-radius: 8px; background: #EDF2FA; color: #3B4C86; font-size: 13.5px; font-weight: 600; }
.cmp-chip.is-tier { background: var(--cmp-purple-soft); color: #6D28D9; }
.cmp-chip.is-value.tone-high { background: #FEE7E9; color: #E11D48; }
.cmp-chip.is-value.tone-medium { background: #FDF0DC; color: #B4690E; }
.cmp-chip.is-value.tone-low { background: var(--cmp-slate-soft); color: #566076; }
.cmp-panel-cta { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; padding-right: 48px; }
.cmp-panel-link { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 500; color: var(--cmp-blue); }
.cmp-panel-link .icon:first-child { color: #2D7BF7; }
.cmp-panel-cta-row { display: flex; align-items: center; gap: 9px; }
.cmp-visit { height: 41px; padding: 0 26px; font-size: 15px; }
.cmp-panel-menu .btn-icon { width: 41px; height: 41px; border-radius: 10px; }
.cmp-panel-close { position: absolute; top: 14px; right: 16px; width: 33px; height: 33px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #E3EBF7; border-radius: 9px; background: #fff; color: #2C3D74; }
.cmp-panel-close:hover { background: var(--cmp-field); }
.cmp-panel-tabs { display: flex; align-items: center; gap: 4px; padding: 0 16px; border-bottom: 1px solid var(--cmp-line-soft); overflow-x: auto; scrollbar-width: none; }
.cmp-panel-tabs::-webkit-scrollbar { display: none; }
.cmp-panel-tab { position: relative; display: inline-flex; align-items: center; gap: 9px; height: 46px; padding: 0 14px; font-size: 15px; font-weight: 600; color: #46588A; white-space: nowrap; }
.cmp-panel-tab .cmp-tab-num { display: inline-flex; align-items: center; justify-content: center; min-width: 25px; height: 22px; padding: 0 6px; border-radius: 6px; background: #EDF2FA; color: #3B4C86; font-size: 13px; font-weight: 700; }
.cmp-panel-tab:hover, .cmp-panel-tab.is-active { color: var(--cmp-blue); }
.cmp-panel-tab.is-active::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--cmp-blue); }
.cmp-panel-body { padding: 10px; background: #FAFCFE; }
.cmp-ov { display: grid; grid-template-columns: minmax(0, 1fr) 276px; gap: 8px; align-items: start; }
.cmp-ov-main, .cmp-ov-side { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cmp-box { background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; overflow: hidden; }
.cmp-box-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; }
.cmp-box-title { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; }
.cmp-box-title em { font-style: normal; font-size: 13.5px; font-weight: 500; color: #677495; }
.cmp-box-icon { color: var(--cmp-blue); }
.cmp-box-tools { display: flex; align-items: center; gap: 8px; }
.cmp-box-empty { padding: 18px 14px; font-size: 14px; color: var(--cmp-muted); text-align: center; }

.cmp-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--cmp-line-soft); }
.cmp-metric { display: flex; align-items: flex-start; gap: 6px; padding: 10px 9px 12px; border-right: 1px solid var(--cmp-line-soft); min-width: 0; }
.cmp-metric:last-child { border-right: 0; }
.cmp-metric-icon { color: #2E3E74; padding-top: 3px; }
.cmp-metric-icon .icon { width: 15px; height: 15px; }
.cmp-metric-value { font-size: 17px; font-weight: 700; letter-spacing: -.02em; color: var(--cmp-navy); }
.cmp-metric-label { font-size: 11.5px; color: #5D6E95; margin-top: 1px; white-space: nowrap; }
.cmp-metric .cmp-delta { margin-top: 4px; font-size: 12px; }

.cmp-rel-head { display: flex; align-items: flex-start; gap: 11px; padding: 12px 13px; }
.cmp-rel-head.tone-green { background: #E4F8EC; } .cmp-rel-head.tone-amber { background: #FDF2DD; } .cmp-rel-head.tone-blue { background: #E8F0FE; } .cmp-rel-head.tone-grey { background: #EEF2F8; }
.cmp-rel-icon { width: 34px; height: 34px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #16A34A; color: #fff; }
.cmp-rel-head.tone-amber .cmp-rel-icon { background: #F59E0B; } .cmp-rel-head.tone-blue .cmp-rel-icon { background: #2563EB; } .cmp-rel-head.tone-grey .cmp-rel-icon { background: #7E8CA5; }
.cmp-rel-icon .icon { stroke-width: 3; }
.cmp-rel-title { font-size: 15.5px; font-weight: 700; color: #12803F; letter-spacing: -.01em; }
.cmp-rel-head.tone-amber .cmp-rel-title { color: #B4690E; } .cmp-rel-head.tone-blue .cmp-rel-title { color: #1D4ED8; } .cmp-rel-head.tone-grey .cmp-rel-title { color: #48556E; }
.cmp-rel-sub { font-size: 12px; color: #4C6383; margin-top: 2px; }
.cmp-rel-foot { display: grid; grid-template-columns: 1fr 1fr; }
.cmp-rel-cell { display: flex; align-items: center; gap: 8px; padding: 10px; border-right: 1px solid var(--cmp-line-soft); min-width: 0; }
.cmp-rel-cell:last-child { border-right: 0; }
.cmp-rel-cell .icon { color: #2E3E74; flex: none; }
.cmp-rel-cell > div { min-width: 0; }
.cmp-rel-cell span { display: block; font-size: 11px; color: #667499; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp-rel-cell strong { display: block; font-size: 13.5px; font-weight: 700; color: var(--cmp-navy); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.cmp-contacts { list-style: none; margin: 0; padding: 0; }
.cmp-contact { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-top: 1px solid var(--cmp-line-soft); }
.cmp-ct-avatar { width: 44px; height: 44px; font-size: 15px; flex: none; background: #E4EAF6; color: #3B4C86; font-weight: 700; }
.cmp-ct-body { flex: 1 1 auto; min-width: 0; }
.cmp-ct-name { display: flex; align-items: center; gap: 9px; font-size: 14.5px; font-weight: 700; color: var(--cmp-navy); }
.cmp-badge-primary { display: inline-flex; align-items: center; height: 21px; padding: 0 8px; border-radius: 7px; background: var(--cmp-green-soft); color: var(--cmp-green); font-size: 12px; font-weight: 600; }
.cmp-ct-role { font-size: 13px; color: #667499; margin-top: 1px; }
.cmp-ct-links { display: flex; align-items: center; gap: 12px; margin-top: 3px; flex-wrap: nowrap; min-width: 0; }
.cmp-ct-link { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: #55689A; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp-ct-link .icon { flex: none; width: 14px; height: 14px; color: #2D7BF7; }
.cmp-ct-actions { display: flex; align-items: center; gap: 6px; flex: none; }
.cmp-ct-btn, .cmp-ct-menu .btn-icon { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #E3EBF7; border-radius: 8px; background: #fff; color: #37477A; }
.cmp-ct-btn:hover { background: var(--cmp-field); }
.cmp-ct-btn.is-tg { border-color: #CFE2FE; color: #2D7BF7; }
.cmp-ct-btn.is-mail { border-color: #FBD5D9; color: #E4394B; }
.cmp-ct-btn.is-li { border-color: #1668F5; background: #1668F5; }
.cmp-ct-btn.is-off { opacity: .4; pointer-events: none; }
.cmp-ct-btn .icon { width: 16px; height: 16px; }

.cmp-mini-wrap { overflow-x: auto; }
.cmp-mini { width: 100%; border-collapse: collapse; table-layout: fixed; }
.cmp-mini thead th { height: 34px; padding: 0 6px; background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); border-bottom: 1px solid var(--cmp-line-soft); font-size: 12px; font-weight: 600; color: #3B4C86; text-align: left; white-space: nowrap; }
.cmp-mini tbody td { height: 39px; padding: 0 6px; border-bottom: 1px solid var(--cmp-line-soft); font-size: 12px; color: var(--cmp-ink); white-space: nowrap; }
.cmp-mini tbody tr:last-child td { border-bottom: 0; }
.cmp-mini td, .cmp-mini th { overflow: hidden; text-overflow: ellipsis; }
.cmp-mini .c-n { width: 26px; color: #667499; } .cmp-mini .c-geo { width: 56px; } .cmp-mini .c-st { width: 76px; } .cmp-mini .c-ac { width: 52px; }
.cmp-mini .cmp-pill { height: 22px; padding: 0 7px; font-size: 12px; gap: 4px; }
.cmp-mini .cmp-dot { width: 13px; height: 13px; } .cmp-mini .cmp-dot .icon { width: 8px; height: 8px; } .cmp-mini .cmp-dot i { font-size: 9px; }
.cmp-mini .cmp-menu .btn-icon { width: 25px; height: 25px; border-radius: 7px; }
.cmp-mini .cmp-country { gap: 6px; }
.cmp-mini .cmp-country .flag { width: 17px !important; height: 12px !important; }
.cmp-mini .cmp-country > span, .cmp-mini .cmp-country .flag-cell + span { font-size: 12px; }
.cmp-mono { font-variant-numeric: tabular-nums; }
.cmp-mini-strong { font-weight: 600; }
.cmp-ov-main .cmp-mini th:nth-child(2), .cmp-ov-main .cmp-mini td:nth-child(2) { width: 100px; }
.cmp-ov-main .cmp-mini th:nth-child(4), .cmp-ov-main .cmp-mini td:nth-child(4) { width: 78px; }
.cmp-ov-main .cmp-mini th:nth-child(5), .cmp-ov-main .cmp-mini td:nth-child(5) { width: 80px; }
.cmp-panel-body > .cmp-box .cmp-mini { table-layout: auto; min-width: 620px; }

.cmp-kvs { border-top: 1px solid var(--cmp-line-soft); }
.cmp-kv { display: flex; align-items: center; gap: 8px; padding: 6px 12px; border-bottom: 1px solid var(--cmp-line-soft); }
.cmp-kv:last-child { border-bottom: 0; }
.cmp-kv-k { flex: 0 0 120px; font-size: 11.5px; color: #667499; }
.cmp-kv-v { flex: 1 1 auto; min-width: 0; font-size: 12.5px; font-weight: 500; color: var(--cmp-ink); }
.cmp-kv-link { display: inline-flex; align-items: center; gap: 6px; color: var(--cmp-blue); }
.cmp-kv .cmp-country .flag { width: 19px !important; height: 13px !important; }
.cmp-kv .cmp-country > span, .cmp-kv .cmp-country .flag-cell + span { font-size: 12.5px; }

.cmp-quick { padding: 12px 13px 13px; }
.cmp-quick h3 { font-size: 15.5px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; }
.cmp-quick-row { display: flex; align-items: center; gap: 9px; margin-top: 10px; flex-wrap: wrap; }
.cmp-quick-btn { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 12px; border: 1px solid #E3EBF7; border-radius: 10px; background: #fff; color: var(--cmp-blue); font-size: 13px; font-weight: 600; }
.cmp-quick-btn:hover { background: var(--cmp-blue-soft); border-color: #CFE2FE; }
.cmp-quick-more .btn-icon { width: auto; height: 36px; padding: 0 12px; border-radius: 10px; gap: 7px; color: #37477A; font-size: 13px; font-weight: 600; }
.cmp-quick-more .btn-icon::after { content: "More Actions"; }

.cmp-notes, .cmp-docs { list-style: none; margin: 0; padding: 0; }
.cmp-note { display: flex; gap: 11px; padding: 11px 13px; border-top: 1px solid var(--cmp-line-soft); }
.cmp-note-avatar { flex: none; background: #E4EAF6; color: #3B4C86; font-weight: 700; }
.cmp-note-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cmp-note-head strong { font-size: 14.5px; font-weight: 700; color: var(--cmp-navy); }
.cmp-note-head span { font-size: 13px; color: var(--cmp-muted); }
.cmp-note-body { margin-top: 3px; font-size: 14px; color: #3D4E77; line-height: 1.55; }
.cmp-doc { display: flex; align-items: center; gap: 12px; padding: 10px 13px; border-top: 1px solid var(--cmp-line-soft); }
.cmp-doc-icon { width: 36px; height: 36px; flex: none; border-radius: 9px; background: var(--cmp-blue-soft); color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.cmp-doc-body { flex: 1 1 auto; min-width: 0; }
.cmp-doc-title { display: block; font-size: 14.5px; font-weight: 600; color: var(--cmp-navy); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmp-doc-meta { font-size: 13px; color: var(--cmp-muted); }

/* ---- responsive ------------------------------------------------------ */
@media (max-width: 1500px) {
  .cmp-split { grid-template-columns: 460px minmax(0, 1fr); }
}
@media (max-width: 1280px) {
  .cmp-split { grid-template-columns: minmax(0, 1fr); }
  .cmp-panel { position: fixed; inset: 0; z-index: var(--z-drawer); border-radius: 0; border: 0; overflow-y: auto; box-shadow: var(--shadow-xl); }
  .cmp-panel-inner { min-height: 100%; }
  .cmp-ov { grid-template-columns: minmax(0, 1fr); }
  .cmp-ov-side { order: -1; }
  .cmp-stats.is-compact .cmp-tile { padding: 0 15px; gap: 14px; }
  .cmp-stats.is-compact .cmp-tile-icon { width: 38px; height: 38px; }
  .cmp-stats.is-compact .cmp-tile-icon .icon { width: 23px; height: 23px; }
  .cmp-stats.is-compact .cmp-tile-value { font-size: 20px; }
  .cmp-stats.is-compact .cmp-tile-label { font-size: 14px; }
  .cmp-stats.is-compact .cmp-tile-sub { font-size: 12.5px; }
  .cmp-table.is-compact { min-width: 720px; }
}
@media (max-width: 1100px) {
  .cmp-stats { overflow-x: auto; padding-bottom: 4px; }
  .cmp-tile { flex: 0 0 auto; min-width: 190px; }
  .cmp-filters { flex-wrap: wrap; }
  .cmp-search { flex: 1 1 220px; }
  .cmp-filters-gap { display: none; }
  .cmp-tabs { overflow-x: auto; padding-bottom: 2px; }
}
@media (max-width: 900px) {
  .page-companies .page-title { font-size: 24px; }
  .cmp-panel-head { flex-wrap: wrap; padding-right: 60px; }
  .cmp-panel-cta { align-items: flex-start; padding-right: 0; width: 100%; }
  .cmp-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cmp-metric:nth-child(2) { border-right: 0; }
  .cmp-foot { flex-wrap: wrap; justify-content: center; }
  .cmp-foot-info, .cmp-per { flex: 1 1 100%; justify-content: center; text-align: center; }
}
@media (max-width: 640px) {
  .cmp-panel-logo { width: 68px !important; height: 58px !important; }
  .cmp-panel-title h2 { font-size: 21px; }
  .cmp-rel-foot, .cmp-metrics { grid-template-columns: minmax(0, 1fr); }
  .cmp-metric, .cmp-rel-cell { border-right: 0; border-bottom: 1px solid var(--cmp-line-soft); }
  .cmp-contact { flex-wrap: wrap; }
  .cmp-ct-actions { width: 100%; justify-content: flex-end; }
  .cmp-ct-links { flex-wrap: wrap; }
  .cmp-quick-row { display: grid; grid-template-columns: 1fr 1fr; }
  .cmp-panel-body { padding: 8px; }
}

/* compact list: tighter filter pills leave room for the search box */
.cmp-split .cmp-select-ghost, .cmp-split .cmp-select > select { padding: 0 26px 0 10px; font-size: 13px; }
.cmp-split .cmp-select-caret { right: 9px; width: 15px; height: 15px; }
.cmp-split .cmp-search { min-width: 120px; }
.cmp-split .cmp-search input { font-size: 13.5px; }
.cmp-table.is-compact .c-cat { font-size: 12.5px; }
/* panel header: keep the identity pills on one row next to the CTA column */
.cmp-panel-head { padding: 14px 14px 12px; gap: 14px; }
.cmp-panel-pills { gap: 8px; flex-wrap: nowrap; overflow: hidden; }
.cmp-chip { height: 26px; padding: 0 11px; font-size: 13px; white-space: nowrap; }
.cmp-visit { padding: 0 22px; }
.cmp-panel-head { padding: 12px 14px 8px; }
.cmp-panel-title h2 { font-size: 25px; }
.cmp-panel-tagline { margin-top: 2px; font-size: 15px; }
.cmp-panel-pills { margin-top: 7px; }
.cmp-panel-tab { height: 44px; padding: 0 12px; }
.cmp-panel-cta { gap: 8px; }
/* drawer breakpoints: keep the two-column overview while there is room, wrap the pills on phones */
@media (max-width: 1280px) {
  .cmp-ov { grid-template-columns: minmax(0, 1fr) 300px; }
  .cmp-ov-side { order: 0; }
}
@media (max-width: 900px) {
  .cmp-ov { grid-template-columns: minmax(0, 1fr); }
  .cmp-ov-side { order: -1; }
  .cmp-panel-pills { flex-wrap: wrap; overflow: visible; }
}
/* overview accounts table: widths that fit the real labels */
.cmp-ov-main .cmp-mini .c-n { width: 24px; } .cmp-ov-main .cmp-mini .c-geo { width: 52px; }
.cmp-ov-main .cmp-mini .c-st { width: 74px; } .cmp-ov-main .cmp-mini .c-ac { width: 46px; }
.cmp-ov-main .cmp-mini th:nth-child(2), .cmp-ov-main .cmp-mini td:nth-child(2) { width: 92px; }
.cmp-ov-main .cmp-mini th:nth-child(4), .cmp-ov-main .cmp-mini td:nth-child(4) { width: 70px; }
.cmp-ov-main .cmp-mini th:nth-child(5), .cmp-ov-main .cmp-mini td:nth-child(5) { width: 92px; }
.cmp-rel-cell { gap: 7px; }
.cmp-rel-cell .icon { width: 16px; height: 16px; }
.cmp-rel-cell span { font-size: 10.5px; }

/* company profile page reuses the detail panel as a full-width block */
.cmp-panel-standalone { margin-bottom: 16px; }
.page-company-profile .page-title { font-size: 26px; }
.page-company-profile .cmp-panel-close { display: none; }

/* =====================================================================
   Contacts / Affiliate Managers  (design-reference-new/contacts-*.png)
   List + grid views, the contact detail page and the add / edit form.
   Shares the .cmp-* component system with Companies; ct-* adds what is
   specific to a person rather than a partner.
   ===================================================================== */
.page-contacts {
  --cmp-navy: #0B1541; --cmp-ink: #16204F; --cmp-label: #46588A; --cmp-muted: #677495; --cmp-faint: #667595;
  --cmp-line: #E6EDF7; --cmp-line-soft: #F0F5FD; --cmp-head-bg: #F7FAFE; --cmp-field: #F8FAFD;
  --cmp-blue: #1668F5; --cmp-blue-soft: #E1EFFE;
  --cmp-green: #0F8446; --cmp-green-soft: #E1FDF1;
  --cmp-amber: #A85F05; --cmp-amber-soft: #FEF3DC;
  --cmp-red: #D92D3E; --cmp-red-soft: #FDE9EC;
  --cmp-purple: #6D28D9; --cmp-purple-soft: #EFEAFE;
  --cmp-slate: #64748B; --cmp-slate-soft: #ECF0F6;
  --cmp-orange: #B44E06; --cmp-orange-soft: #FDEEDD;
  --cmp-radius: 14px;
  --ct-pink-soft: #FEECF4;
}
.page-contacts .page-content { padding-top: 14px; padding-bottom: var(--sp-6); }
.page-contacts .page-header { margin-top: 2px; }
.page-contacts .page-header { margin-bottom: 11px; align-items: flex-start; }
.page-contacts .page-title { font-size: 31px; font-weight: 700; letter-spacing: 0; color: var(--cmp-navy); }
.page-contacts .page-subtitle { font-size: 16.5px; color: #56679A; margin-top: 3px; }
.page-contacts .page-actions { gap: 10px; padding-top: 4px; }

/* ---- tab row + view toggle ------------------------------------------ */
.page-contacts .ct-tabbar { display: flex; align-items: center; gap: 14px; margin-bottom: 11px; }
.page-contacts .ct-tabrow { padding: 0; display: flex; align-items: center; gap: 9px; flex: 1 1 auto; min-width: 0; flex-wrap: wrap; }
.page-contacts .ct-tab { display: inline-flex; align-items: center; gap: 8px; height: 41px; padding: 0 12px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #fff; color: #1E2A5A; font-size: 13px; font-weight: 600; white-space: nowrap; transition: border-color var(--t-fast), background var(--t-fast), color var(--t-fast); }
.page-contacts .ct-tab:hover { border-color: #C9DAF4; background: #FAFCFF; }
.page-contacts .ct-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 20px; padding: 0 5px; border-radius: 6px; background: #EEF3FB; color: #3B4C86; font-size: 12px; font-weight: 700; }
.page-contacts .ct-tab.is-active { color: var(--cmp-blue); border-color: #C4DAFC; box-shadow: inset 0 -2px 0 0 var(--cmp-blue); }
.page-contacts .ct-tab.is-active .ct-tab-count { background: #DCE9FE; color: var(--cmp-blue); }
.page-contacts .ct-tab:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.page-contacts .ct-tab-more .dropdown { display: inline-flex; }
.page-contacts .ct-tab-more .btn-icon { width: 42px; height: 41px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #fff; color: #3B4C86; display: inline-flex; align-items: center; justify-content: center; }
.page-contacts .ct-tab-more .btn-icon:hover { background: #FAFCFF; border-color: #C9DAF4; }
.page-contacts .ct-tab-more.is-active .btn-icon { color: var(--cmp-blue); border-color: #C4DAFC; background: #F5F9FF; }
.page-contacts .ct-viewtoggle { flex: none; display: inline-flex; padding: 3px; gap: 3px; border: 1px solid var(--cmp-line); border-radius: 11px; background: #fff; }
.page-contacts .ct-viewbtn { display: inline-flex; align-items: center; gap: 8px; height: 35px; padding: 0 14px; border-radius: 8px; font-size: 14px; font-weight: 600; color: #46588A; transition: background var(--t-fast), color var(--t-fast); }
.page-contacts .ct-viewbtn:hover { background: var(--cmp-field); }
.page-contacts .ct-viewbtn.is-active { background: #E1EEFD; color: var(--cmp-blue); }
.page-contacts .ct-viewbtn .icon { stroke-width: 2; }

/* ---- filter row ------------------------------------------------------ */
.page-contacts .cmp-filters { padding: 5px 6px; gap: 8px; flex-wrap: wrap; }
.page-contacts .ct-search { flex: 1 1 301px; max-width: 301px; min-width: 176px; height: 36px; }
.page-contacts .cmp-filters .cmp-select, .page-contacts .ct-morebtn { flex: none; }
.page-contacts .cmp-search input { font-size: 11.7px; }
.page-contacts .cmp-select select { padding: 0 29px 0 11px; font-size: 13.5px; }
.page-contacts .cmp-select-ghost { padding: 0 29px 0 11px; font-size: 13.5px; }
.page-contacts .cmp-sort .cmp-select-ghost { padding: 0 36px 0 4px; }
.page-contacts .cmp-select-caret { right: 9px; }
.page-contacts .cmp-select { height: 36px; }
.page-contacts .ct-morebtn { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 13px; border: 1px solid #E2ECFB; border-radius: 10px; background: #fff; color: var(--cmp-ink); font-size: 14.5px; font-weight: 600; white-space: nowrap; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast); }
.page-contacts .ct-morebtn:hover { background: var(--cmp-field); border-color: #CFDDF3; }
.page-contacts .ct-morebtn { font-size: 13.5px; }
.page-contacts .ct-morebtn.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: #F2F7FF; }
.page-contacts .ct-morebtn .icon { color: #3B4C86; stroke-width: 2; }
.page-contacts .ct-morebtn.is-on .icon { color: var(--cmp-blue); }
.page-contacts .ct-reset { flex: none; margin-left: auto; padding: 0 4px; font-size: 14px; font-weight: 600; color: var(--cmp-blue); text-decoration: underline; text-underline-offset: 3px; }
.page-contacts .ct-reset:hover { color: #0F4FC4; }
.page-contacts .ct-reset.is-idle { color: #5D75A4; }
.page-contacts .ct-more-row { display: flex; align-items: center; gap: 8px; padding: 0 8px 10px; flex-wrap: wrap; }
.page-contacts .ct-check-inline { display: inline-flex; align-items: center; gap: 9px; height: 38px; padding: 0 13px; border: 1px solid #E2ECFB; border-radius: 10px; background: #fff; font-size: 14.5px; font-weight: 500; color: var(--cmp-ink); cursor: pointer; }
.page-contacts .ct-check-inline input { position: absolute; opacity: 0; width: 0; height: 0; }
.page-contacts .ct-check-inline span { width: 18px; height: 18px; border: 1.5px solid #CBD8EC; border-radius: 5px; background: #fff; position: relative; transition: background var(--t-fast), border-color var(--t-fast); }
.page-contacts .ct-check-inline input:checked + span { background: var(--cmp-blue); border-color: var(--cmp-blue); }
.page-contacts .ct-check-inline input:checked + span::after { content: ""; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.page-contacts .ct-check-inline input:focus-visible + span { box-shadow: var(--focus-ring); }

/* ---- table ----------------------------------------------------------- */
.page-contacts .ct-table { min-width: 1120px; }
.page-contacts .ct-table col.w-sel { width: 52px; }
.page-contacts .ct-table col.w-name { width: 188px; }
.page-contacts .ct-table col.w-co { width: 222px; }
.page-contacts .ct-table col.w-geo { width: 163px; }
.page-contacts .ct-table col.w-chan { width: 166px; }
.page-contacts .ct-table col.w-rel { width: 139px; }
.page-contacts .ct-table col.w-last { width: 142px; }
.page-contacts .ct-table col.w-next { width: 140px; }
.page-contacts .ct-table col.w-act { width: 67px; }
.page-contacts .ct-table thead th { height: 41px; background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); font-size: 12.2px; font-weight: 400; color: #46619E; }
.page-contacts .ct-table .cmp-th.is-plain { cursor: default; }
.page-contacts .ct-table .c-sel { padding-left: 16px; }
.page-contacts .ct-table tbody td { height: 53px; }
.page-contacts .ct-table .c-act { text-align: right; padding-right: 13px; }

.page-contacts .ct-person { display: flex; align-items: center; gap: 15px; min-width: 0; }
.page-contacts .ct-avatar { flex: none; border-radius: 50%; overflow: hidden; }
.page-contacts .ct-avatar img { width: 100%; height: 100%; object-fit: cover; }
.page-contacts .ct-person-text { display: flex; flex-direction: column; align-items: flex-start; gap: 0; min-width: 0; }
.page-contacts .ct-person-name { font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--cmp-navy); letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.page-contacts .ct-primary { display: inline-flex; align-items: center; height: 22px; padding: 0 7px; border-radius: 6px; background: #DDF0FE; color: var(--cmp-blue); font-size: 11.5px; font-weight: 600; }

.page-contacts .ct-co { display: flex; align-items: center; gap: 12px; min-width: 0; }
.page-contacts .ct-logo { border-radius: 50% !important; border: 1px solid rgba(15,23,42,.05); flex: none; }
.page-contacts .ct-company-text { display: flex; flex-direction: column; min-width: 0; gap: 0; }
.page-contacts .ct-co-name { font-size: 13.8px; font-weight: 700; color: var(--cmp-blue); letter-spacing: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-contacts .ct-co-name:hover { text-decoration: underline; text-underline-offset: 2px; }
.page-contacts .ct-co-role { font-size: 11.9px; color: #5D6E95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.page-contacts .ct-geos { display: flex; align-items: center; gap: 6px; }
.page-contacts .ct-flag { display: inline-flex; }
.page-contacts .ct-flag .flag-cell { display: inline-flex; }
.page-contacts .ct-flag .flag { width: 22px !important; height: 15px !important; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.07); }
.page-contacts .ct-geo-more { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 22px; padding: 0 8px; border-radius: 7px; background: #F2F5FE; color: var(--cmp-blue); font-size: 11.5px; font-weight: 600; }

.page-contacts .ct-ch { display: flex; align-items: center; gap: 9px; min-width: 0; width: auto; height: auto; }
.page-contacts .ct-ch-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; color: #46588A; transition: background var(--t-fast); }
.page-contacts .ct-ch-icon.is-brand { width: 22px; height: 22px; }
.page-contacts .ct-ch-icon.is-brand .brand-icon { width: 22px; height: 22px; }
.page-contacts .ct-ch-icon:not(.is-brand):hover { background: var(--cmp-field); }
.page-contacts .ct-ch-icon .icon { stroke-width: 2; }
.page-contacts .ct-ch-value { font-size: 12.7px; color: var(--cmp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.page-contacts .ct-copy { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border: 0; border-radius: 6px; background: none; color: #60759D; cursor: pointer; transition: background var(--t-fast), color var(--t-fast); }
.page-contacts .ct-copy:hover { background: #EDF3FC; color: var(--cmp-blue); }
.page-contacts .ct-copy:focus-visible { opacity: 1; box-shadow: var(--focus-ring); }
/* the e-mail column needs every pixel for the address, so its copy button waits for hover */
.page-contacts .ct-ch.is-email .ct-copy { opacity: 0; width: 0; margin-left: -8px; }
.page-contacts .ct-row:hover .ct-ch.is-email .ct-copy, .page-contacts .ct-ch.is-email:focus-within .ct-copy { opacity: 1; width: 22px; margin-left: 0; }

.page-contacts .ct-pill { display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 11px 0 9px; border-radius: 8px; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.page-contacts .ct-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.page-contacts .ct-pill.tone-green { background: var(--cmp-green-soft); color: var(--cmp-green); }
.page-contacts .ct-pill.tone-blue { background: var(--cmp-blue-soft); color: #1D4ED8; }
.page-contacts .ct-pill.tone-amber { background: var(--cmp-amber-soft); color: var(--cmp-amber); }
.page-contacts .ct-pill.tone-grey { background: var(--cmp-slate-soft); color: #566076; }
.page-contacts .ct-pill.tone-red { background: var(--cmp-red-soft); color: var(--cmp-red); }
.page-contacts .ct-pill.tone-purple { background: var(--cmp-purple-soft); color: var(--cmp-purple); }

.page-contacts .ct-last-main { display: block; font-size: 13.5px; font-weight: 500; color: var(--cmp-navy); white-space: nowrap; }
.page-contacts .ct-last-main.is-never { color: var(--cmp-faint); }
.page-contacts .ct-last-sub { display: block; margin-top: 3px; font-size: 13px; color: #657593; white-space: nowrap; }

.page-contacts .ct-next { display: inline-flex; align-items: flex-start; gap: 9px; }
.page-contacts .ct-next.is-none { color: var(--cmp-faint); font-size: 15px; }
.page-contacts .ct-next-icon { flex: none; margin-top: 1px; stroke-width: 2; color: #2A3B6B; }
.page-contacts .ct-next-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.page-contacts .ct-next-main { font-size: 12.5px; font-weight: 600; color: var(--cmp-navy); white-space: nowrap; }
.page-contacts .ct-next-time { font-size: 10.6px; color: #657593; white-space: nowrap; }
.page-contacts .ct-next.is-tomorrow .ct-next-icon { color: #0E7A3C; }
.page-contacts .ct-next.is-tomorrow .ct-next-main { color: #0E7A3C; font-weight: 600; }
.page-contacts .ct-next.is-today .ct-next-icon, .page-contacts .ct-next.is-overdue .ct-next-icon { color: #EF4444; }
.page-contacts .ct-next.is-today .ct-next-main, .page-contacts .ct-next.is-overdue .ct-next-main { color: #E11D48; font-weight: 600; }
.page-contacts .ct-next.is-today .ct-next-time, .page-contacts .ct-next.is-overdue .ct-next-time { align-self: flex-start; padding: 2px 8px; margin-left: -6px; border-radius: 6px; background: var(--ct-pink-soft); color: #BE1B45; font-weight: 600; }

/* ---- grid view -------------------------------------------------------- */
.page-contacts .ct-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(288px, 1fr)); gap: 12px; padding: 4px 10px 14px; }
.page-contacts .ct-card-item { display: flex; flex-direction: column; gap: 12px; padding: 16px; border: 1px solid var(--cmp-line); border-radius: 13px; background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast); }
.page-contacts .ct-card-item:hover { border-color: #C9DAF4; box-shadow: 0 6px 18px rgba(15,32,79,.07); transform: translateY(-1px); }
.page-contacts .ct-card-top { display: flex; align-items: flex-start; gap: 12px; }
.page-contacts .ct-card-id { display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1 1 auto; }
.page-contacts .ct-card-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
.page-contacts .ct-card-name b { font-size: 15.5px; font-weight: 700; color: var(--cmp-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.page-contacts .ct-card-name .ct-primary { flex: none; }
.page-contacts .ct-card-rel { display: block; }
.page-contacts .ct-card-role { font-size: 13px; color: #5D6E95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.page-contacts .ct-card-co { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: var(--cmp-ink); min-width: 0; }
.page-contacts .ct-card-co > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-contacts .ct-card-geo { display: block; min-height: 26px; }
.page-contacts .ct-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1px solid var(--cmp-line-soft); }
.page-contacts .ct-card-meta { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: #5D6E95; white-space: nowrap; min-width: 0; }
.page-contacts .ct-card-meta .icon { flex: none; color: #62759A; stroke-width: 2; }
.page-contacts .ct-card-meta.is-today, .page-contacts .ct-card-meta.is-overdue { color: #E11D48; font-weight: 600; }
.page-contacts .ct-card-meta.is-today .icon, .page-contacts .ct-card-meta.is-overdue .icon { color: #EF4444; }
.page-contacts .ct-card-meta.is-tomorrow { color: #0E7A3C; font-weight: 600; }
.page-contacts .ct-card-meta.is-tomorrow .icon { color: #0E7A3C; }
.page-contacts .ct-grid-empty { grid-column: 1 / -1; }

/* ---- footer ----------------------------------------------------------- */
.page-contacts .cmp-foot { padding: 13px 18px 15px; }
/* the reference pager marks the current page in navy, like Companies */

/* header right cell: a mirrored select-all plus the table menu, as in the reference */
.page-contacts .ct-head-act { display: inline-flex; align-items: center; gap: 10px; justify-content: flex-end; }
.page-contacts .ct-headmenu .btn-icon { width: 28px; height: 28px; border: 0; background: none; color: #46619E; }
.page-contacts .ct-headmenu .btn-icon:hover { background: #E9F0FB; }

/* ---- contact detail page (design-reference-new/contact-detail.png) ------- */
.page-contact-detail .page-content { padding-top: 10px; }
.page-contacts .ctd-crumb { display: flex; align-items: center; gap: 8px; font-size: 12.8px; color: #5D6E95; }
.page-contacts .ctd-crumb a { color: #5D6E95; display: inline-flex; align-items: center; }
.page-contacts .ctd-crumb a:hover { color: var(--cmp-blue); }
.page-contacts .ctd-crumb-sep { color: #6175A0; stroke-width: 2; }
.page-contacts .ctd-crumb span[aria-current] { color: var(--cmp-navy); font-weight: 600; }

.page-contacts .ctd-topline { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 4px; }
.page-contacts .ctd-head { display: flex; align-items: flex-end; gap: 142px; margin-bottom: 6px; }
.page-contacts .ctd-id { display: flex; align-items: flex-start; gap: 34px; min-width: 0; }
.page-contacts .ctd-photo { position: relative; flex: none; display: inline-flex; }
.page-contacts .ctd-photo .avatar { width: 104px; height: 104px; font-size: 32px; border-radius: 50%; border: 4px solid #fff; box-shadow: 0 0 0 1px #E2E9F5, 0 4px 14px rgba(15,32,79,.08); overflow: hidden; }
.page-contacts .ctd-photo .avatar img { width: 100%; height: 100%; object-fit: cover; }
.page-contacts .ctd-photo.is-online::after { content: ""; position: absolute; right: 6px; bottom: 8px; width: 17px; height: 17px; border-radius: 50%; background: #16A34A; border: 3px solid #fff; }
.page-contacts .ctd-id-text { min-width: 0; padding-top: 2px; }
.page-contacts .ctd-name { display: flex; align-items: center; gap: 13px; font-size: 30px; font-weight: 700; letter-spacing: -.035em; color: var(--cmp-navy); line-height: 1.1; margin: 0; }
.page-contacts .ctd-primary { display: inline-flex; align-items: center; height: 25px; padding: 0 11px; border-radius: 7px; background: #DDF0FE; color: var(--cmp-blue); font-size: 12.5px; font-weight: 600; letter-spacing: 0; }
.page-contacts .ctd-job { margin: 0; font-size: 17.5px; font-weight: 500; color: #677495; }
.page-contacts .ctd-co { display: inline-flex; align-items: center; gap: 13px; margin-top: 6px; }
.page-contacts .ctd-co-logo { border-radius: 11px !important; border: 1px solid rgba(15,23,42,.05); }
.page-contacts .ctd-co-text { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.page-contacts .ctd-co-name { font-size: 16px; font-weight: 700; color: var(--cmp-navy); }
.page-contacts .ctd-co:hover .ctd-co-name { color: var(--cmp-blue); }
.page-contacts .ctd-co-cat { font-size: 14px; color: #677495; }

.page-contacts .ctd-reach { flex: none; margin-right: auto; display: flex; align-items: center; gap: 22px; padding-bottom: 8px; }
.page-contacts .ctd-reach-item { display: flex; align-items: center; gap: 13px; }
.page-contacts .ctd-reach-icon { flex: none; width: 40px; height: 40px; border-radius: 11px; background: #E8F1FE; color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.page-contacts .ctd-reach-icon.is-brand { background: none; border-radius: 50%; }
.page-contacts .ctd-reach-text { display: flex; flex-direction: column; gap: 2px; }
.page-contacts .ctd-reach-label { font-size: 13.5px; color: #677495; }
.page-contacts .ctd-reach-value { display: flex; align-items: center; gap: 6px; font-size: 15.5px; font-weight: 600; color: var(--cmp-navy); }
.page-contacts .ctd-reach-value a { color: inherit; }
.page-contacts .ctd-reach-value a:hover { color: var(--cmp-blue); }
.page-contacts .ctd-reach-sep { width: 1px; height: 46px; background: var(--cmp-line); }
.page-contacts .ctd-actions { flex: none; display: flex; align-items: center; gap: 11px; }
.page-contacts .ctd-menu .btn-icon { width: 42px; height: 40px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #fff; color: #37477A; display: inline-flex; align-items: center; justify-content: center; }
.page-contacts .ctd-menu .btn-icon:hover { background: var(--cmp-field); border-color: #D3DEF0; }

/* ---- stat strip ---- */
.page-contacts .ctd-strip { display: flex; background: #fff; border: 1px solid var(--cmp-line); border-radius: var(--cmp-radius); margin-bottom: 16px; }
.page-contacts .ctd-stat { flex: 1 1 auto; display: flex; align-items: flex-start; gap: 13px; padding: 17px 18px; min-width: 0; border-left: 1px solid var(--cmp-line-soft); }
.page-contacts .ctd-stat:first-child { border-left: 0; }
.page-contacts .ctd-stat-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-top: 1px; color: #2A3B6B; }
.page-contacts .ctd-stat-icon .icon { stroke-width: 1.8; }
.page-contacts .ctd-stat-icon .ct-dot { width: 11px; height: 11px; margin-top: 6px; }
.page-contacts .ct-dot.tone-green { background: #16A34A; } .page-contacts .ct-dot.tone-blue { background: #2563EB; }
.page-contacts .ct-dot.tone-amber { background: #F59E0B; } .page-contacts .ct-dot.tone-grey { background: #94A3B8; }
.page-contacts .ct-dot.tone-red { background: #EF4444; } .page-contacts .ct-dot.tone-purple { background: #7C3AED; }
.page-contacts .ctd-stat-body { display: flex; flex-direction: column; gap: 0; min-width: 0; }
.page-contacts .ctd-stat-label { font-size: 13.5px; line-height: 1.35; color: #657593; white-space: nowrap; }
.page-contacts .ctd-stat-value { font-size: 16.5px; line-height: 1.4; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-contacts .ctd-stat-value .ct-geos { margin-top: 2px; }
.page-contacts .ctd-stat-sub { font-size: 13.5px; line-height: 1.35; color: #677495; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---- tabs ---- */
.page-contacts .ctd-tabs { display: flex; align-items: center; gap: 6px; border-bottom: 1px solid var(--cmp-line); margin-bottom: 16px; overflow-x: auto; }
.page-contacts .ctd-tab { display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 16px; margin-bottom: -1px; border-bottom: 2px solid transparent; font-size: 15.5px; font-weight: 600; color: #46588A; white-space: nowrap; transition: color var(--t-fast), border-color var(--t-fast); }
.page-contacts .ctd-tab .icon { color: #65749C; stroke-width: 1.9; }
.page-contacts .ctd-tab:hover { color: var(--cmp-navy); }
.page-contacts .ctd-tab.is-active { color: var(--cmp-blue); border-bottom-color: var(--cmp-blue); }
.page-contacts .ctd-tab.is-active .icon { color: var(--cmp-blue); }
.page-contacts .ctd-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 19px; padding: 0 5px; border-radius: 6px; background: #EEF3FB; color: #3B4C86; font-size: 12px; font-weight: 700; }
.page-contacts .ctd-tab.is-active .ctd-tab-count { background: #DCE9FE; color: var(--cmp-blue); }

/* ---- cards ---- */
.page-contacts .ctd-cols { display: grid; grid-template-columns: minmax(0, 1fr) 434px; gap: 16px; align-items: start; }
.page-contacts .ctd-main, .page-contacts .ctd-rail { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.page-contacts .ctd-card { padding: 20px 22px 22px; }
.page-contacts .ctd-card-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 18px; }
.page-contacts .ctd-card-head.is-tight { align-items: center; margin-bottom: 14px; }
.page-contacts .ctd-card-icon { flex: none; width: 42px; height: 42px; border-radius: 12px; background: #E8F1FE; color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.page-contacts .ctd-card-icon.is-plain { width: 28px; height: 28px; border-radius: 0; background: none; }
.page-contacts .ctd-card-icon.tone-purple { background: #EFE9FE; color: #7C3AED; }
.page-contacts .ctd-card-icon.tone-green { background: #E2F7EC; color: #12904A; }
.page-contacts .ctd-card-icon.tone-amber { background: #FDF0DA; color: #C2740A; }
.page-contacts .ctd-card-icon .icon { stroke-width: 1.9; }
.page-contacts .ctd-card-title { flex: 1 1 auto; min-width: 0; }
.page-contacts .ctd-card-title h2 { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--cmp-navy); line-height: 1.25; }
.page-contacts .ctd-card-title p { margin: 4px 0 0; font-size: 14px; color: #677495; }
.page-contacts .ctd-card-head.is-tight .ctd-card-title h2 { font-size: 19px; }
.page-contacts .ctd-btn-ghost { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 15px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #fff; color: var(--cmp-ink); font-size: 14.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast); }
.page-contacts .ctd-btn-ghost:hover { background: var(--cmp-field); border-color: #CFDDF3; color: var(--cmp-blue); }
.page-contacts .ctd-btn-ghost .icon { color: var(--cmp-blue); stroke-width: 2; }

/* ---- key / value grid ---- */
.page-contacts .ctd-kvgrid { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr); gap: 0 34px; }
.page-contacts .ctd-kvgrid::before { content: ""; grid-column: 2; grid-row: 1; width: 1px; background: var(--cmp-line-soft); }
.page-contacts .ctd-kvcol { min-width: 0; }
.page-contacts .ctd-kvcol:last-of-type { grid-column: 3; }
.page-contacts .ctd-kv { display: grid; grid-template-columns: 148px minmax(0, 1fr); gap: 16px; align-items: center; min-height: 30px; padding: 5px 0; border-bottom: 1px solid var(--cmp-line-soft); }
.page-contacts .ctd-kv.is-last { border-bottom: 0; }
.page-contacts .ctd-kv.is-multiline { align-items: start; }
.page-contacts .ctd-kv-label { font-size: 14.5px; color: #677495; }
.page-contacts .ctd-kv-value { display: flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 500; color: var(--cmp-navy); min-width: 0; flex-wrap: wrap; }
.page-contacts .ctd-kv.is-multiline .ctd-kv-value { display: block; line-height: 1.6; font-weight: 500; }
.page-contacts .ctd-kv-value a { color: var(--cmp-blue); font-weight: 500; }
.page-contacts .ctd-kv-value a:hover { text-decoration: underline; text-underline-offset: 2px; }
.page-contacts .ctd-kv-co { display: inline-flex; align-items: center; gap: 12px; color: var(--cmp-navy) !important; font-weight: 700 !important; }
.page-contacts .ctd-kv-co:hover { text-decoration: none !important; }
.page-contacts .ctd-kv .ct-flag.has-code .flag-cell { display: inline-flex; align-items: center; gap: 7px; }
.page-contacts .ctd-kv .ct-flag.has-code span { font-size: 14px; font-weight: 600; color: var(--cmp-navy); }
.page-contacts .ctd-chanpill { display: inline-flex; align-items: center; gap: 9px; font-size: 14.5px; font-weight: 500; color: var(--cmp-navy); }
.page-contacts .ctd-chanpill + .ctd-chanpill { margin-left: 16px; }
.page-contacts .ctd-chanpill:hover { color: var(--cmp-blue); }

/* ---- linked business ---- */
.page-contacts .ctd-linked { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.page-contacts .ctd-link-tile { display: flex; align-items: center; gap: 15px; padding: 17px 18px; border: 1px solid var(--cmp-line); border-radius: 13px; background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.page-contacts .ctd-link-tile:hover { border-color: #C9DAF4; box-shadow: 0 6px 18px rgba(15,32,79,.06); }
.page-contacts .ctd-link-icon { flex: none; width: 48px; height: 48px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; }
.page-contacts .ctd-link-icon.tone-green { background: #E2F7EC; color: #12904A; }
.page-contacts .ctd-link-icon.tone-purple { background: #EFE9FE; color: #7C3AED; }
.page-contacts .ctd-link-text { flex: 1 1 auto; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.page-contacts .ctd-link-label { font-size: 14px; color: #677495; }
.page-contacts .ctd-link-value { font-size: 16.5px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; }
.page-contacts .ctd-link-sub { font-size: 13.5px; color: #677495; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-contacts .ctd-link-caret { flex: none; color: #62759A; stroke-width: 2; }

/* ---- next follow-up card ---- */
.page-contacts .ctd-fu-box { padding: 18px; border-radius: 12px; background: #EEF4FE; }
.page-contacts .ctd-fu-when { display: flex; align-items: center; gap: 15px; }
.page-contacts .ctd-fu-icon { flex: none; width: 46px; height: 46px; border-radius: 12px; background: #DCE8FD; color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.page-contacts .ctd-fu-date { display: flex; flex-direction: column; gap: 3px; font-size: 18px; font-weight: 700; letter-spacing: -.02em; color: var(--cmp-navy); }
.page-contacts .ctd-fu-date span { font-size: 15px; font-weight: 500; color: #46588A; }
.page-contacts .ctd-fu-note { display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 12px; margin-top: 16px; padding-top: 15px; border-top: 1px solid #DDE6F6; }
.page-contacts .ctd-fu-note-label { font-size: 14px; font-weight: 700; color: var(--cmp-navy); }
.page-contacts .ctd-fu-note p { margin: 0; font-size: 14.5px; line-height: 1.55; color: #46588A; }
.page-contacts .ctd-fu-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.page-contacts .ctd-fu-actions .cmp-btn { height: 46px; font-size: 15px; border-radius: 11px; }
.page-contacts .ctd-fu-actions .cmp-btn-ghost { color: var(--cmp-blue); border-color: #D5E2F7; }
.page-contacts .ctd-fu-actions .cmp-btn-ghost .icon { color: var(--cmp-blue); }
.page-contacts .ctd-fu-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 26px 18px; border-radius: 12px; background: #F6F9FE; color: #677495; text-align: center; }
.page-contacts .ctd-fu-empty p { margin: 0; font-size: 14.5px; }

/* ---- notes ---- */
.page-contacts .ctd-notes { display: flex; flex-direction: column; gap: 12px; }
.page-contacts .ctd-note { padding: 15px 16px; border: 1px solid var(--cmp-line-soft); border-radius: 12px; background: #FCFDFF; }
.page-contacts .ctd-note.is-empty { color: #677495; }
.page-contacts .ctd-note.is-empty p { margin: 0; font-size: 14.5px; }
.page-contacts .ctd-note-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.page-contacts .ctd-note-meta { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; color: #677495; }
.page-contacts .ctd-note-meta i { font-style: normal; color: #5F759D; }
.page-contacts .ctd-note-menu .btn-icon { width: 28px; height: 28px; border: 0; background: none; color: #62759A; }
.page-contacts .ctd-note-menu .btn-icon:hover { background: #EDF3FC; color: var(--cmp-blue); }
.page-contacts .ctd-note-body { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--cmp-ink); }
.page-contacts .ctd-notes-all { margin-top: 14px; align-self: flex-start; }
.page-contacts .ctd-notes-rest { margin-top: 12px; }

/* ---- tab panes: thread + tables ---- */
.page-contacts .ctd-thread { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.page-contacts .ctd-msg { display: flex; gap: 14px; padding: 15px 0; border-bottom: 1px solid var(--cmp-line-soft); }
.page-contacts .ctd-msg:last-child { border-bottom: 0; }
.page-contacts .ctd-msg.is-empty { display: block; padding: 8px 0; }
.page-contacts .ctd-msg-icon { flex: none; width: 36px; height: 36px; border-radius: 10px; background: #F1F5FD; display: inline-flex; align-items: center; justify-content: center; color: #46588A; }
.page-contacts .ctd-msg.is-in .ctd-msg-icon { background: #E2F7EC; }
.page-contacts .ctd-msg.is-note .ctd-msg-icon { background: #FDF0DA; }
.page-contacts .ctd-msg-body { min-width: 0; flex: 1 1 auto; }
.page-contacts .ctd-msg-top { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; flex-wrap: wrap; }
.page-contacts .ctd-msg-dir { font-size: 14.5px; font-weight: 700; color: var(--cmp-navy); }
.page-contacts .ctd-msg-chan { font-size: 12.5px; font-weight: 600; color: #46588A; background: #EEF3FB; border-radius: 6px; padding: 2px 8px; }
.page-contacts .ctd-msg-time { font-size: 13px; color: #677495; margin-left: auto; }
.page-contacts .ctd-msg-body p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--cmp-ink); }
.page-contacts .ctd-table { min-width: 720px; }
.page-contacts .ctd-table thead th { height: 42px; padding: 0 12px; background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); font-size: 14px; font-weight: 600; color: #46619E; text-align: left; }
.page-contacts .ctd-table tbody td { height: 56px; padding: 0 12px; font-size: 14px; }
.page-contacts .ctd-td-reason { color: var(--cmp-ink); }
.page-contacts .ctd-td-reason a { color: var(--cmp-blue); font-weight: 600; }
.page-contacts .ctd-td-actions { display: flex; align-items: center; gap: 8px; height: 56px; }
.page-contacts .ctd-table .cmp-btn-soft { height: 32px; padding: 0 11px; font-size: 13px; }

.page-contacts .ctd-chan-more { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; margin-left: 12px; border-radius: 6px; background: #F2F5FE; color: var(--cmp-blue); font-size: 12.5px; font-weight: 700; }

/* ---- add / edit contact form (design-reference-new/add-contact.png) ------ */
.page-contact-form .page-content { padding-top: 16px; }
.page-contacts .ctf-topbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 8px; }
.page-contacts .ctf-back { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px; font-weight: 500; color: #5D6E95; }
.page-contacts .ctf-back:hover { color: var(--cmp-blue); }
.page-contacts .ctf-back .icon { stroke-width: 2; }
.page-contacts .ctf-topbar-text h1 { margin: 4px 0 0; font-size: 33px; font-weight: 700; letter-spacing: 0; color: var(--cmp-navy); line-height: 1.0; }
.page-contacts .ctf-topbar-text p { margin: 0; font-size: 17.4px; color: #56679A; }
.page-contacts .ctf-topbar-actions { display: flex; align-items: center; gap: 11px; padding-top: 4px; }
.page-contacts .ctf-topbar-actions .cmp-btn { height: 42px; border-radius: 11px; }

.page-contacts .ctf-cols { display: grid; grid-template-columns: 711px minmax(0, 1fr); gap: 17px; align-items: start; }
.page-contacts .ctf-col { display: flex; flex-direction: column; gap: 15px; min-width: 0; }
.page-contacts .ctf-card { padding: 14px 20px 20px; }
.page-contacts .ctf-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.page-contacts .ctf-head-icon { flex: none; color: var(--cmp-blue); display: inline-flex; }
.page-contacts .ctf-head-icon .icon { stroke-width: 1.9; }
.page-contacts .ctf-head h2 { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -.02em; color: var(--cmp-navy); line-height: 1.2; }
.page-contacts .ctf-head p { margin: 4px 0 0; font-size: 14px; color: #677495; }

.page-contacts .ctf-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 44px; position: relative; }
.page-contacts .ctf-split::before { content: ""; position: absolute; left: calc(50% - 1px); top: 2px; bottom: 2px; width: 1px; background: var(--cmp-line-soft); }
.page-contacts .ctf-split-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 14px; }
.page-contacts .ctf-split-3::before { display: none; }
.page-contacts .ctf-split-photo { grid-template-columns: 272px minmax(0, 1fr); gap: 0 62px; }
.page-contacts .ctf-split-photo::before { left: 272px; }
.page-contacts .ctf-fields { display: flex; flex-direction: column; gap: 16px; }
.page-contacts .ctf-card .form-group { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.page-contacts .ctf-label { font-size: 14.5px; font-weight: 600; line-height: 1.15; color: var(--cmp-ink); }
.page-contacts .ctf-req { color: #E11D48; margin-left: 2px; }
.page-contacts .ctf-hint { font-size: 13px; line-height: 1.15; color: #60759D; }

/* photo uploader */
.page-contacts .ctf-photo-block { display: flex; flex-direction: column; align-items: flex-start; gap: 11px; padding-left: 8px; }
.page-contacts .ctf-photo-block .ctf-label { align-self: flex-start; margin-left: -8px; }
.page-contacts .ctf-photo { position: relative; width: 117px; height: 117px; border-radius: 50%; border: 2px dashed #C6D8F5; background: #FBFDFF; display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; transition: border-color var(--t-fast), background var(--t-fast); }
.page-contacts .ctf-photo:hover { border-color: var(--cmp-blue); background: #F4F9FF; }
.page-contacts .ctf-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.page-contacts .ctf-photo-inner { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--cmp-blue); font-size: 13.5px; font-weight: 600; text-align: center; }
.page-contacts .ctf-photo-inner .icon { stroke-width: 1.8; }
.page-contacts .ctf-photo.has-photo .ctf-photo-inner { opacity: 0; background: rgba(11,21,65,.55); color: #fff; position: absolute; inset: 0; justify-content: center; border-radius: 50%; transition: opacity var(--t-fast); }
.page-contacts .ctf-photo.has-photo:hover .ctf-photo-inner { opacity: 1; }
.page-contacts .ctf-photo-clear { border: 0; background: none; color: #E11D48; font-size: 13px; font-weight: 600; cursor: pointer; padding: 0; }
.page-contacts .ctf-photo-clear:hover { text-decoration: underline; }
/* with nothing chosen the circle previews the avatar this name would get, dimmed as a suggestion */
.page-contacts .ctf-photo:not(.has-photo) img { opacity: .3; }

/* bundled avatar picker */
.page-contacts .ctf-avpick { margin: 16px 0 2px; padding-top: 15px; border-top: 1px solid var(--cmp-line-soft); }
.page-contacts .ctf-avpick-head { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; margin-bottom: 10px; }
.page-contacts .ctf-avgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 8px; }
.page-contacts .ctf-av { width: 100%; aspect-ratio: 1; padding: 0; border: 2px solid transparent; border-radius: 50%; background: none; cursor: pointer; line-height: 0; transition: border-color var(--t-fast), transform var(--t-fast); }
.page-contacts .ctf-av img { width: 100%; height: 100%; border-radius: 50%; display: block; }
.page-contacts .ctf-av:hover { transform: translateY(-1px); border-color: #C6D8F5; }
.page-contacts .ctf-av:focus-visible { outline: 2px solid var(--cmp-blue); outline-offset: 2px; }
.page-contacts .ctf-av.is-on { border-color: var(--cmp-blue); box-shadow: 0 0 0 2px rgba(22,104,245,.18); }

/* inputs */
.page-contacts .ctf-input { width: 100%; height: 40px; padding: 0 14px; border: 1px solid #E2E9F5; border-radius: 10px; background: #fff; font: inherit; font-size: 14.5px; color: var(--cmp-navy); transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.page-contacts .ctf-input::placeholder { color: #627599; }
.page-contacts .ctf-input:hover { border-color: #CFDDF3; }
.page-contacts .ctf-input:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.14); }
.page-contacts .ctf-input:disabled { background: #F6F8FC; color: #627599; cursor: not-allowed; }
.page-contacts .ctf-input.is-invalid { border-color: #E11D48; box-shadow: 0 0 0 3px rgba(225,29,72,.12); }
.page-contacts .ctf-textarea { width: 100%; min-height: 128px; padding: 13px 14px; border: 1px solid #E2E9F5; border-radius: 10px; background: #fff; font: inherit; font-size: 14.5px; line-height: 1.6; color: var(--cmp-navy); resize: vertical; }
.page-contacts .ctf-textarea::placeholder { color: #627599; }
.page-contacts .ctf-textarea:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.14); }
.page-contacts .ctf-counter { align-self: flex-end; font-size: 13px; color: #627599; }
.page-contacts .ctf-input-group { position: relative; display: flex; align-items: center; }
.page-contacts .ctf-prefix { position: absolute; left: 13px; font-size: 14.5px; font-weight: 600; color: #677495; pointer-events: none; }
.page-contacts .ctf-input-group .ctf-prefix + .ctf-input { padding-left: 32px; }
.page-contacts .ctf-input-icon { position: absolute; left: 13px; color: #677495; pointer-events: none; stroke-width: 1.9; }
.page-contacts .ctf-input-group.has-icon .ctf-input { padding-left: 40px; }

/* selects */
.page-contacts .ctf-select { position: relative; display: flex; align-items: center; width: 100%; height: 40px; border: 1px solid #E2E9F5; border-radius: 10px; background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.page-contacts .ctf-select:hover { border-color: #CFDDF3; }
.page-contacts .ctf-select:focus-within { border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.14); }
.page-contacts .ctf-selectbox { appearance: none; -webkit-appearance: none; width: 100%; height: 100%; border: 0; background: none; outline: none; padding: 0 40px 0 14px; font: inherit; font-size: 14.5px; color: var(--cmp-navy); cursor: pointer; }
.page-contacts .ctf-selectbox:invalid, .page-contacts .ctf-selectbox option[value=""] { color: #627599; }
.page-contacts .ctf-select-caret { position: absolute; right: 13px; color: #46588A; pointer-events: none; stroke-width: 2; }
.page-contacts .ctf-select-lead { position: absolute; left: 14px; color: #677495; pointer-events: none; stroke-width: 2; }
.page-contacts .ctf-select.has-search .ctf-selectbox { padding-left: 40px; }
.page-contacts .ctf-select.has-dot .ctf-selectbox { padding-left: 34px; }
.page-contacts .ctf-select.has-dot .ct-dot { position: absolute; left: 15px; width: 10px; height: 10px; background: #16A34A; }
.page-contacts .ctf-select.has-dot[data-tone="partnered"] .ct-dot { background: #2563EB; }
.page-contacts .ctf-select.has-dot[data-tone="negotiating"] .ct-dot { background: #F59E0B; }
.page-contacts .ctf-select.has-dot[data-tone="paused"] .ct-dot { background: #94A3B8; }
.page-contacts .ctf-select.has-dot[data-tone="prospect"] .ct-dot { background: #7C3AED; }
.page-contacts .ctf-select.is-invalid { border-color: #E11D48; }

/* toggle rows */
.page-contacts .ctf-toggle-row { display: flex; align-items: flex-start; gap: 14px; margin-top: 20px; }
.page-contacts .ctf-toggle-row.is-inline { align-items: center; margin-top: 0; margin-bottom: 18px; }
.page-contacts .ctf-switch { position: relative; flex: none; display: inline-flex; cursor: pointer; }
.page-contacts .ctf-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.page-contacts .ctf-switch-track { width: 46px; height: 26px; border-radius: 999px; background: #D5DEEE; position: relative; transition: background var(--t-fast); }
.page-contacts .ctf-switch-track::after { content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(15,32,79,.25); transition: transform var(--t-fast); }
.page-contacts .ctf-switch input:checked + .ctf-switch-track { background: var(--cmp-blue); }
.page-contacts .ctf-switch input:checked + .ctf-switch-track::after { transform: translateX(20px); }
.page-contacts .ctf-switch input:focus-visible + .ctf-switch-track { box-shadow: var(--focus-ring); }
.page-contacts .ctf-toggle-text { display: flex; flex-direction: column; gap: 3px; }
.page-contacts .ctf-toggle-text strong { font-size: 14.5px; font-weight: 600; color: var(--cmp-navy); }
.page-contacts .ctf-toggle-text em { font-style: normal; font-size: 13.5px; color: #677495; }
.page-contacts .ctf-split.is-disabled .ctf-label { color: #627599; }
.page-contacts .ctf-split.is-disabled .ctf-input-icon { color: #5D759F; }

/* contact methods */
.page-contacts .ctf-method { flex-direction: row !important; align-items: flex-end; gap: 12px !important; }
.page-contacts .ctf-method-icon { flex: none; width: 44px; height: 44px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; }
.page-contacts .ctf-method-icon.tone-telegram { background: #E8F2FE; }
.page-contacts .ctf-method-icon.tone-mail { background: #E8F1FE; color: var(--cmp-blue); }
.page-contacts .ctf-method-body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.page-contacts .ctf-extra { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.page-contacts .ctf-extra-row { display: grid; grid-template-columns: 168px minmax(0, 1fr) 44px; gap: 10px; align-items: center; }
.page-contacts .ctf-extra-del { width: 44px; height: 40px; border: 1px solid #E2E9F5; border-radius: 10px; background: #fff; color: #62759A; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); }
.page-contacts .ctf-extra-del:hover { background: #FDF2F5; border-color: #F6D3DC; color: #E11D48; }
.page-contacts .ctf-addmethod { position: relative; margin-top: 16px; }
.page-contacts .ctf-addmethod-btn { width: 100%; height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 0; border-radius: 11px; background: #ECF4FE; color: var(--cmp-blue); font-size: 14.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast); }
.page-contacts .ctf-addmethod-btn:hover { background: #DEEBFD; }
.page-contacts .ctf-addmethod-btn .icon { stroke-width: 2.2; }
.page-contacts .ctf-addmethod-menu { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 30; padding: 6px; border: 1px solid var(--cmp-line); border-radius: 12px; background: #fff; box-shadow: 0 12px 32px rgba(15,32,79,.14); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
.page-contacts .ctf-addmethod-item { display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 12px; border: 0; border-radius: 9px; background: none; color: var(--cmp-ink); font-size: 14.5px; font-weight: 500; cursor: pointer; text-align: left; }
.page-contacts .ctf-addmethod-item:hover { background: var(--cmp-field); color: var(--cmp-blue); }

/* GEO chips */
.page-contacts .ctf-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.page-contacts .ctf-chip { display: inline-flex; align-items: center; gap: 9px; height: 36px; padding: 0 8px 0 10px; border: 1px solid #E2E9F5; border-radius: 10px; background: #fff; font-size: 14px; font-weight: 500; color: var(--cmp-navy); }
.page-contacts .ctf-chip .flag { width: 24px !important; height: 16px !important; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.07); }
.page-contacts .ctf-chip-x { width: 22px; height: 22px; border: 0; border-radius: 6px; background: none; color: #62759A; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.page-contacts .ctf-chip-x:hover { background: #FDF2F5; color: #E11D48; }
.page-contacts .ctf-chip-add { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 13px; border: 0; border-radius: 10px; background: #EDF5FE; color: var(--cmp-blue); font-size: 14px; font-weight: 600; cursor: pointer; }
.page-contacts .ctf-chip-add:hover { background: #DEEBFD; }
.page-contacts .ctf-card .form-error { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #E11D48; }

/* ---- Companies: type scale re-measured against the reference with IBM Plex Sans Condensed ---- */
.page-companies .page-title { font-size: 34px; letter-spacing: -.02em; }
.cmp-tile-value { font-size: 19px; }
.cmp-tile-label { font-size: 12.5px; }
.cmp-tile-sub { font-size: 12px; }
.cmp-table thead th { font-size: 12.5px; }
.cmp-th em { font-size: 11.5px; }
.cmp-partner-name { font-size: 14.5px; }
.cmp-pill { height: 27px; font-size: 12.5px; padding: 0 10px; }
.cmp-sub { font-size: 12px; }
.cmp-strong { font-size: 14px; }
.cmp-money { font-size: 17px; }
.cmp-delta { font-size: 14px; }
.cmp-pay-top, .cmp-pay-sub, .cmp-att { font-size: 12.5px; }
.cmp-stats.is-compact .cmp-tile { padding: 0 8px; gap: 8px; }
.cmp-stats.is-compact .cmp-tile-icon { width: 34px; height: 34px; }
.cmp-stats.is-compact .cmp-tile-icon .icon { width: 19px; height: 19px; }
.cmp-stats.is-compact .cmp-tile-dot { width: 22px; height: 22px; }
.cmp-stats.is-compact .cmp-tile-value { font-size: 19px; }
.cmp-stats.is-compact .cmp-tile-label { font-size: 12px; letter-spacing: 0; }
.cmp-stats.is-compact .cmp-tile-sub { font-size: 11.5px; letter-spacing: 0; }
.cmp-tab { font-size: 13.5px; }
.cmp-table.is-compact .cmp-partner-name { font-size: 14px; }
.cmp-table.is-compact .c-cat { font-size: 13px; }
.cmp-panel-title h2 { font-size: 27px; }
.cmp-panel-tagline { font-size: 16px; }
.cmp-chip { font-size: 13px; }
.cmp-panel-tab { font-size: 15px; }
.cmp-box-title { font-size: 16px; }
.cmp-metric-value { font-size: 18px; }
.cmp-metric-label { font-size: 12.5px; }
.cmp-ct-name { font-size: 15px; }
.cmp-ct-role { font-size: 13px; }
.cmp-ct-link { font-size: 12.5px; }
.cmp-kv-k { font-size: 12.5px; flex-basis: 118px; }
.cmp-kv-v { font-size: 13px; }
.cmp-mini thead th, .cmp-mini tbody td { font-size: 12.5px; }
.cmp-rel-title { font-size: 16px; }
.cmp-rel-sub { font-size: 12.5px; }
.cmp-rel-cell span { font-size: 11.5px; }
.cmp-rel-cell strong { font-size: 14px; }
.cmp-quick h3 { font-size: 16px; }
.cmp-quick-btn, .cmp-quick-more .btn-icon { font-size: 13px; }

/* ---- icon sizes -------------------------------------------------------- */
/* .icon is sized in em app-wide, so every contact-page context states its size. */
.page-contacts .cmp-btn .icon { width: 18px; height: 18px; }
.page-contacts .cmp-btn-soft .icon { width: 15px; height: 15px; }
.page-contacts .cmp-search .icon { width: 18px; height: 18px; }
.page-contacts .cmp-select-caret { width: 16px; height: 16px; }
.page-contacts .cmp-page .icon { width: 17px; height: 17px; }
.page-contacts .cmp-th-icon { width: 13px; height: 13px; }
.page-contacts .ct-morebtn .icon { width: 17px; height: 17px; }
.page-contacts .ct-viewbtn .icon { width: 17px; height: 17px; }
.page-contacts .ct-tab-more .btn-icon .icon, .page-contacts .ct-menu .btn-icon .icon, .page-contacts .ctd-menu .btn-icon .icon, .page-contacts .ctd-note-menu .btn-icon .icon, .page-contacts .ct-headmenu .btn-icon .icon { width: 17px; height: 17px; }
.page-contacts .ct-ch-icon .icon { width: 18px; height: 18px; }
.page-contacts .ct-copy .icon { width: 15px; height: 15px; }
.page-contacts .ct-next-icon { width: 17px; height: 17px; }
.page-contacts .ct-card-meta .icon { width: 15px; height: 15px; }
.page-contacts .ctd-crumb .icon { width: 16px; height: 16px; }
.page-contacts .ctd-crumb-sep { width: 15px; height: 15px; }
.page-contacts .ctd-reach-icon .icon { width: 21px; height: 21px; }
.page-contacts .ctd-stat-icon .icon { width: 22px; height: 22px; }
.page-contacts .ctd-tab .icon { width: 18px; height: 18px; }
.page-contacts .ctd-card-icon .icon { width: 27px; height: 27px; }
.page-contacts .ctd-btn-ghost .icon { width: 16px; height: 16px; }
.page-contacts .ctd-link-icon .icon { width: 24px; height: 24px; }
.page-contacts .ctd-link-caret { width: 20px; height: 20px; }
.page-contacts .ctd-fu-icon .icon { width: 22px; height: 22px; }
.page-contacts .ctd-fu-empty > .icon { width: 26px; height: 26px; }
.page-contacts .ctd-msg-icon .icon { width: 18px; height: 18px; }
.page-contacts .ctf-head-icon .icon { width: 28px; height: 28px; }
.page-contacts .ctf-photo-inner .icon { width: 26px; height: 26px; }
.page-contacts .ctf-select-caret, .page-contacts .ctf-select-lead, .page-contacts .ctf-input-icon { width: 18px; height: 18px; }
.page-contacts .ctf-method-icon .icon { width: 22px; height: 22px; }
.page-contacts .ctf-addmethod-btn .icon { width: 18px; height: 18px; }
.page-contacts .ctf-addmethod-item .icon { width: 18px; height: 18px; }
.page-contacts .ctf-chip-x .icon { width: 14px; height: 14px; }
.page-contacts .ctf-extra-del .icon { width: 17px; height: 17px; }
.page-contacts .ctf-back .icon { width: 18px; height: 18px; }

/* the detail-page card icons are plain blue glyphs in the reference, not tiles */
.page-contacts .ctd-card-icon { width: auto; height: auto; border-radius: 0; background: none !important; color: var(--cmp-blue) !important; }
.page-contacts .ctd-card-icon.tone-purple { color: #7C3AED !important; }
.page-contacts .ctd-card-icon.tone-green { color: #12904A !important; }
.page-contacts .ctd-card-icon.tone-amber { color: #C2740A !important; }

.page-contacts .ctf-input[type=date]::-webkit-calendar-picker-indicator,
.page-contacts .ctf-input[type=time]::-webkit-calendar-picker-indicator { opacity: .45; cursor: pointer; }
.page-contacts .ctf-chip-add .icon { width: 15px; height: 15px; }
/* pass 3: density of the panel blocks and the compact tiles */
.page-companies .page-title { font-size: 32px; }
.cmp-tile-label { font-size: 13.5px; }
.cmp-tile-sub { font-size: 12.5px; }
.cmp-filters .cmp-select select, .cmp-filters .cmp-select-ghost, .cmp-sort .cmp-sort-label, .cmp-search input { font-size: 13px; }
.cmp-table thead th { font-size: 13px; }
.cmp-stats.is-compact .cmp-tile { padding: 0 6px; gap: 7px; }
.cmp-stats.is-compact .cmp-tile-icon { width: 30px; height: 30px; }
.cmp-stats.is-compact .cmp-tile-icon .icon { width: 17px; height: 17px; }
.cmp-stats.is-compact .cmp-tile-dot { width: 20px; height: 20px; }
.cmp-stats.is-compact .cmp-tile-value { font-size: 18px; }
.cmp-stats.is-compact .cmp-tile-label { font-size: 11.5px; }
.cmp-stats.is-compact .cmp-tile-sub { font-size: 11px; }
.cmp-panel-body { padding: 8px; }
.cmp-ov { gap: 8px; }
.cmp-box-head { padding: 8px 12px; }
.cmp-metric { padding: 8px 9px 9px; }
.cmp-metric-value { font-size: 17px; }
.cmp-metric .cmp-delta { margin-top: 2px; }
.cmp-contact { padding: 6px 12px; gap: 10px; }
.cmp-ct-avatar { width: 40px; height: 40px; font-size: 14px; }
.cmp-ct-name { font-size: 14.5px; }
.cmp-ct-role { font-size: 12.5px; margin-top: 0; }
.cmp-ct-links { margin-top: 2px; }
.cmp-ct-link { font-size: 12px; }
.cmp-kv { padding: 2px 12px; min-height: 22px; gap: 8px; }
.cmp-kv-k, .cmp-kv-v { font-size: 12px; line-height: 18px; }
.cmp-kv .cmp-pill.is-plain { height: 18px; padding: 0 7px; font-size: 11.5px; }
.cmp-mini thead th { height: 26px; font-size: 12px; }
.cmp-mini tbody td { height: 25px; font-size: 12px; }
.cmp-mini .cmp-pill { height: 19px; padding: 0 6px; font-size: 11.5px; }
.cmp-mini .cmp-menu .btn-icon { width: 20px; height: 20px; border-radius: 6px; }
.cmp-rel-head { padding: 10px 12px; }
.cmp-rel-cell { padding: 8px 10px; }
.cmp-quick { padding: 10px 12px 12px; }
.cmp-quick-row { margin-top: 8px; }
.cmp-quick-btn, .cmp-quick-more .btn-icon { height: 32px; padding: 0 10px; font-size: 12.5px; }
.cmp-panel-head { padding: 12px 14px 6px; }
.cmp-panel-tab { height: 42px; }
/* pass 4: rhythm + weights against the reference */
.page-companies .page-header { margin: 8px 0 3px; }
.page-companies .page-title { font-size: 32px; font-weight: 700; }
.cmp-tile-label { font-size: 14px; }
.cmp-filters .cmp-select select, .cmp-filters .cmp-select-ghost, .cmp-sort .cmp-sort-label, .cmp-search input { font-size: 14px; }
.cmp-table thead th { font-size: 13.5px; }
.cmp-partner-name { font-size: 15px; }
.cmp-pill { height: 28px; font-size: 13px; }
.cmp-sub { font-size: 13px; }
.cmp-strong { font-size: 15px; }
.cmp-money { font-size: 16.5px; }
.cmp-pay-top, .cmp-pay-sub, .cmp-att { font-size: 13px; }
.cmp-split .cmp-select-ghost, .cmp-split .cmp-select > select { padding: 0 24px 0 9px; }
.cmp-panel-head { padding: 10px 14px 4px; }
.cmp-panel-tagline { margin-top: 1px; }
.cmp-panel-pills { margin-top: 6px; }
.cmp-chip { height: 24px; }
.cmp-panel-tab { height: 40px; }
.cmp-metric { padding: 7px 9px 8px; }
.cmp-metric-value { font-size: 16.5px; }
.cmp-contact { padding: 5px 12px; }
.cmp-ct-name { line-height: 18px; font-size: 14.5px; }
.cmp-ct-role { line-height: 15px; font-size: 12.5px; }
.cmp-ct-links { margin-top: 1px; line-height: 15px; }
.cmp-ct-link { font-size: 12px; }
.cmp-badge-primary { height: 18px; font-size: 11.5px; }
.cmp-ct-avatar { width: 40px; height: 40px; }
/* pass 5: vertical landmarks matched to the reference (title 76, tiles 137, panel blocks) */
.page-companies .page-header { margin: 11px 0 6px; }
.cmp-box-head { padding: 10px 12px; }
.cmp-metric { padding: 12px 10px 14px; }
.cmp-metric-value { font-size: 18px; }
.cmp-contact { padding: 7px 12px; }
/* pass 6: block heights matched to the reference panel */
.cmp-metric { padding: 14px 10px 16px; }
.cmp-metric-label { margin-top: 4px; }
.cmp-metric .cmp-delta { margin-top: 6px; }
.cmp-panel-head { padding-bottom: 0; }
.cmp-panel-tab { height: 38px; }
.cmp-tabs { margin: 12px 0; }
.cmp-split .cmp-filters { padding: 12px 9px; }
/* pass 7: metric cells 80px and account rows 29px, as in the reference panel */
.cmp-metric { padding: 18px 10px 20px; }
.cmp-mini tbody td { height: 29px; }

.page-contacts .avatar-48 { width: 48px; height: 48px; font-size: 16px; }
.page-contacts .avatar-52 { width: 52px; height: 52px; font-size: 17px; }

/* ---- contacts: responsive --------------------------------------------- */
@media (max-width: 1439px) {
  .page-contacts .ctd-cols { grid-template-columns: minmax(0, 1fr) 380px; }
  .page-contacts .ctf-cols { grid-template-columns: minmax(0, 1fr) 470px; }
}
@media (max-width: 1279px) {
  .page-contacts .ctd-cols, .page-contacts .ctf-cols { grid-template-columns: minmax(0, 1fr); }
  .page-contacts .ctd-rail { order: -1; }
  .page-contacts .ctd-strip { flex-wrap: wrap; }
  .page-contacts .ctd-stat { flex: 1 1 33.333%; border-left: 1px solid var(--cmp-line-soft); border-top: 1px solid var(--cmp-line-soft); }
  .page-contacts .ctd-stat:nth-child(-n+3) { border-top: 0; }
  .page-contacts .ctd-stat:nth-child(3n+1) { border-left: 0; }
  .page-contacts .ctf-split-photo { grid-template-columns: 240px minmax(0, 1fr); gap: 0 34px; }
  .page-contacts .ctf-split-photo::before { left: 241px; }
}
@media (max-width: 1100px) {
  .page-contacts .cmp-filters { flex-wrap: wrap; }
  .page-contacts .ct-search { flex: 1 1 100%; max-width: none; }
  .page-contacts .ct-reset { margin-left: auto; }
  .page-contacts .ct-tabrow { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 3px; }
  .page-contacts .ct-tab { flex: none; }
  .page-contacts .ctd-head { flex-direction: column; align-items: flex-start; gap: 14px; }
  .page-contacts .ctd-reach { margin-right: 0; flex-wrap: wrap; row-gap: 12px; }
}
@media (max-width: 900px) {
  .page-contacts .page-title, .page-contacts .ctf-topbar-text h1 { font-size: 24px; }
  .page-contacts .ctd-name { font-size: 25px; }
  .page-contacts .ctd-photo .avatar { width: 80px; height: 80px; font-size: 25px; }
  .page-contacts .ctd-id { gap: 20px; }
  .page-contacts .ctd-stat { flex: 1 1 50%; }
  .page-contacts .ctd-stat:nth-child(3n+1) { border-left: 1px solid var(--cmp-line-soft); }
  .page-contacts .ctd-stat:nth-child(-n+3) { border-top: 1px solid var(--cmp-line-soft); }
  .page-contacts .ctd-stat:nth-child(-n+2) { border-top: 0; }
  .page-contacts .ctd-stat:nth-child(2n+1) { border-left: 0; }
  .page-contacts .ctd-kvgrid { grid-template-columns: minmax(0, 1fr); }
  .page-contacts .ctd-kvgrid::before { display: none; }
  .page-contacts .ctd-kvcol:last-of-type { grid-column: 1; }
  .page-contacts .ctd-linked { grid-template-columns: minmax(0, 1fr); }
  .page-contacts .ctf-split, .page-contacts .ctf-split-photo, .page-contacts .ctf-split-3 { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .page-contacts .ctf-split::before, .page-contacts .ctf-split-photo::before { display: none; }
  .page-contacts .ctf-photo-block { align-items: flex-start; }
  .page-contacts .cmp-foot { flex-wrap: wrap; justify-content: center; row-gap: 12px; }
  .page-contacts .cmp-foot-info, .page-contacts .cmp-per { flex: 1 1 100%; justify-content: center; text-align: center; }
  .page-contacts .ctf-topbar { flex-direction: column; align-items: stretch; gap: 14px; }
  .page-contacts .ctf-topbar-actions { justify-content: flex-end; }
}
@media (max-width: 767px) {
  .page-contacts .ctd-topline { flex-wrap: wrap; row-gap: 10px; }
  .page-contacts .ctd-actions { flex: 1 1 100%; }
  .page-contacts .ctd-actions .cmp-btn { flex: 1 1 auto; }
  .page-contacts .ctd-reach { flex-wrap: wrap; row-gap: 12px; }
  .page-contacts .ctd-reach-sep { display: none; }
  .page-contacts .ctd-stat { flex: 1 1 100%; border-left: 0 !important; border-top: 1px solid var(--cmp-line-soft); }
  .page-contacts .ctd-stat:first-child { border-top: 0; }
  .page-contacts .ctd-kv { grid-template-columns: minmax(0, 1fr); gap: 4px; align-items: start; }
  .page-contacts .ctd-fu-actions { grid-template-columns: minmax(0, 1fr); }
  .page-contacts .ctd-card, .page-contacts .ctf-card { padding: 16px; }
  .page-contacts .ct-grid { grid-template-columns: minmax(0, 1fr); }
  .page-contacts .ctf-extra-row { grid-template-columns: minmax(0, 1fr) 44px; }
  .page-contacts .ctf-extra-channel { grid-column: 1 / -1; }
  .page-contacts .ctf-addmethod-menu { grid-template-columns: minmax(0, 1fr); }
  .page-contacts .ctd-table { min-width: 600px; }
}
@media (max-width: 560px) {
  .page-contacts .ctd-id { flex-direction: column; gap: 14px; }
  .page-contacts .ctd-name { flex-wrap: wrap; font-size: 22px; }
  .page-contacts .ctf-topbar-actions .cmp-btn { flex: 1 1 auto; }
  .page-contacts .ct-tab { font-size: 13px; }
}
/* overview accounts table: "Sub-Affiliate" and the Actions header fit on one line */
.cmp-ov-main .cmp-mini th:nth-child(2), .cmp-ov-main .cmp-mini td:nth-child(2) { width: 94px; }
.cmp-ov-main .cmp-mini th:nth-child(4), .cmp-ov-main .cmp-mini td:nth-child(4) { width: 86px; }
.cmp-ov-main .cmp-mini th:nth-child(5), .cmp-ov-main .cmp-mini td:nth-child(5) { width: 88px; }
.cmp-ov-main .cmp-mini .c-ac { width: 58px; padding-right: 4px; }
.cmp-ov-main .cmp-mini .c-geo { width: 50px; }
/* overview accounts table: column budget for a 462px card (all seven labels on one line) */
.cmp-ov-main .cmp-mini .c-n { width: 22px; }
.cmp-ov-main .cmp-mini th:nth-child(2), .cmp-ov-main .cmp-mini td:nth-child(2) { width: 86px; }
.cmp-ov-main .cmp-mini .c-geo { width: 48px; padding-right: 2px; }
.cmp-ov-main .cmp-mini th:nth-child(4), .cmp-ov-main .cmp-mini td:nth-child(4) { width: 80px; }
.cmp-ov-main .cmp-mini th:nth-child(5), .cmp-ov-main .cmp-mini td:nth-child(5) { width: 98px; }
.cmp-ov-main .cmp-mini .c-st { width: 70px; padding-right: 2px; }
.cmp-ov-main .cmp-mini .c-ac { width: 50px; padding: 0 4px; }
.cmp-mini .cmp-country { gap: 5px; }

.page-contacts .ct-menu .btn-icon { width: 30px; height: 30px; }

/* =====================================================================
   Companies — grid view (design-reference-new/companies-grid-view.png),
   full-page detail, header toolbar
   ===================================================================== */
.cmp-viewtoggle { display: inline-flex; align-items: center; gap: 12px; }
.cmp-viewbtn { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 13px; border: 1px solid var(--cmp-line); border-radius: 9px; background: #fff; font-size: 13.5px; font-weight: 600; color: #46588A; transition: background var(--t-fast), color var(--t-fast); }
.cmp-viewbtn:hover { color: var(--cmp-ink); background: var(--cmp-field); }
.cmp-viewbtn.is-active { background: #E8F0FE; border-color: #C6D8F9; color: var(--cmp-blue); }
body.view-grid .page-actions .cmp-btn-tool, body.view-grid .cmp-sortmenu .btn-icon { height: 36px; border-radius: 9px; font-size: 13.5px; }
body.view-grid .page-actions { gap: 12px; }
body.view-grid .page-actions .cmp-btn-primary { height: 40px; }
.cmp-btn-tool { padding: 0 14px; gap: 7px; font-size: 14px; }
.cmp-btn-tool.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: var(--cmp-blue-soft); }
.cmp-sortmenu .btn-icon { width: auto; height: 40px; padding: 0 14px; gap: 7px; border-radius: 10px; color: var(--cmp-ink); font-size: 14px; font-weight: 600; }
.cmp-sortmenu .btn-icon::after { content: "Sort"; }
.cmp-sortmenu .dropdown-menu { min-width: 220px; }
.cmp-sortmenu .dropdown-item .icon[href$="#circle"], .cmp-sortmenu .dropdown-item svg use[href$="#circle"] { opacity: .25; }

.cmp-stats.is-grid { justify-content: flex-start; gap: 10px; margin-bottom: 15px; }
.cmp-gtile { flex: 0 0 185px; display: flex; align-items: center; gap: 14px; height: 70px; padding: 0 15px; background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; }
.cmp-gtile .cmp-tile-icon { width: 36px; height: 36px; }
.cmp-gtile .cmp-tile-icon .icon { width: 18px; height: 18px; stroke-width: 2.2; }
.cmp-gtile .cmp-tile-dot { width: 20px; height: 20px; }
.cmp-gtile .cmp-tile-dot .icon { width: 11px; height: 11px; }
.cmp-gtile-label { font-size: 12px; color: #667499; line-height: 1.2; white-space: nowrap; }
.cmp-gtile-value { font-size: 18px; font-weight: 700; color: var(--cmp-navy); line-height: 1.2; margin-top: 2px; }

.cmp-filters.is-floating { background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; margin-bottom: 14px; }
.cmp-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 15px; }
.cmp-gcard { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--cmp-line); border-radius: 14px; overflow: hidden; cursor: pointer; transition: box-shadow var(--t-base), border-color var(--t-base), transform var(--t-base); }
.cmp-gcard:hover { box-shadow: 0 8px 24px rgba(15,23,42,.08); border-color: #D6E1F2; transform: translateY(-1px); }
.cmp-gcard:focus-within { box-shadow: var(--focus-ring); }
.cmp-gcard-head { display: flex; align-items: flex-start; gap: 13px; padding: 13px 13px 0 15px; }
.cmp-gcard-logo { width: 66px !important; height: 66px !important; border-radius: 50% !important; border: 1px solid rgba(15,23,42,.05); }
.cmp-gcard-name { display: flex; align-items: center; gap: 7px; font-size: 15px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp-verified-dot { width: 15px; height: 15px; flex: none; border-radius: 50%; background: #16A34A; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.cmp-verified-dot .icon { stroke-width: 3.2; }
.cmp-gcard-cat { font-size: 12.5px; color: #5D6E95; margin: 2px 0 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp-gcard-id .cmp-pill { height: 20px; padding: 0 8px; font-size: 12px; gap: 5px; }
.cmp-gcard-id .cmp-pill .cmp-dot { width: 12px; height: 12px; } .cmp-gcard-id .cmp-pill .cmp-dot .icon { width: 8px; height: 8px; }
.cmp-gcard-head .cmp-menu .btn-icon { width: 28px; height: 26px; border-radius: 7px; }
.cmp-gcard-geo { display: flex; align-items: center; gap: 12px; padding: 17px 15px 9px; border-bottom: 1px solid var(--cmp-line-soft); }
.cmp-gcard-geo-label { font-size: 12px; color: #667595; flex: 0 0 34px; }
.cmp-gcard-geos { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cmp-gflag { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: #3B4C86; }
.cmp-gflag .flag-cell { display: inline-flex; }
.cmp-gflag .flag { width: 16px !important; height: 11px !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); }
.cmp-gflag-more { display: inline-flex; align-items: center; justify-content: center; height: 18px; min-width: 26px; padding: 0 6px; border-radius: 6px; background: #EDF2FA; color: #3B4C86; font-size: 11.5px; font-weight: 700; }
.cmp-gcard-stats { display: grid; grid-template-columns: 1fr 1fr 1fr; padding: 8px 15px 10px; }
.cmp-gstat { min-width: 0; padding-right: 8px; }
.cmp-gstat + .cmp-gstat { padding-left: 12px; border-left: 1px solid var(--cmp-line-soft); }
.cmp-gstat-l { display: block; font-size: 11.5px; color: #667595; line-height: 1.25; white-space: nowrap; }
.cmp-gstat-v { display: block; font-size: 15px; font-weight: 700; color: var(--cmp-navy); line-height: 1.25; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp-gstat-v.is-empty { color: #667595; }
.cmp-gstat-s { display: flex; align-items: center; gap: 3px; font-size: 12px; color: #667499; line-height: 1.25; margin-top: 1px; white-space: nowrap; }
.cmp-gstat-s.is-up { color: var(--cmp-green); font-weight: 600; } .cmp-gstat-s.is-down { color: var(--cmp-red); font-weight: 600; }
.cmp-gstat-s .icon { stroke-width: 2.4; }
.cmp-gcard-foot { margin-top: auto; display: flex; align-items: center; gap: 9px; height: 32px; padding: 0 12px 0 15px; font-size: 12.5px; font-weight: 600; }
.cmp-gcard-foot .cmp-dot { flex: none; width: 16px; height: 16px; } .cmp-gcard-foot .cmp-dot .icon { width: 10px; height: 10px; }
.cmp-gcard-foot > span:not(.cmp-dot) { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp-gcard-arrow { color: #65749C; stroke-width: 2.2; }
.cmp-gcard-foot.tone-green { background: #EAF9F0; color: #12904A; }
.cmp-gcard-foot.tone-amber { background: #FDF3E1; color: #D2660C; }
.cmp-gcard-foot.tone-red { background: #FDECEE; color: #DC2637; }
.cmp-gcard-foot.tone-purple { background: #F1ECFE; color: #6D28D9; }
.cmp-gcard-foot.tone-grey { background: #EEF2F8; color: #5B6A85; }
.cmp-dot.tone-purple { background: #7C3AED; }
.cmp-grid-empty { grid-column: 1 / -1; background: #fff; border: 1px solid var(--cmp-line); border-radius: 14px; padding: 24px; }
.cmp-foot.is-grid { border-top: 0; padding: 22px 4px 4px; }
.cmp-foot.is-grid .cmp-page { width: 36px; height: 36px; }
.cmp-foot.is-grid .cmp-page.is-disabled { color: var(--cmp-ink); opacity: 1; }
.cmp-foot.is-grid .cmp-perpage select, .cmp-foot.is-grid .cmp-select { height: 36px; }
body.view-grid .page-content, .page-company-add .page-content { padding-left: 20px; padding-right: 18px; }

/* full-page detail */
.cmp-detail-page { display: flex; flex-direction: column; gap: 10px; }
.cmp-back { display: inline-flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 500; color: #5D6E95; align-self: flex-start; }
.cmp-back:hover { color: var(--cmp-blue); }
.cmp-panel-full .cmp-ov { grid-template-columns: minmax(0, 1fr) 360px; gap: 12px; }
.cmp-panel-full .cmp-panel-body { padding: 12px; }
.cmp-panel-full .cmp-metrics .cmp-metric { padding: 16px 14px 18px; }
.cmp-panel-full .cmp-ov-main .cmp-mini th:nth-child(2), .cmp-panel-full .cmp-ov-main .cmp-mini td:nth-child(2) { width: 130px; }
.cmp-panel-full .cmp-ov-main .cmp-mini th:nth-child(4), .cmp-panel-full .cmp-ov-main .cmp-mini td:nth-child(4) { width: 110px; }
.cmp-panel-full .cmp-ov-main .cmp-mini th:nth-child(5), .cmp-panel-full .cmp-ov-main .cmp-mini td:nth-child(5) { width: 130px; }
.cmp-panel-full .cmp-ov-main .cmp-mini .c-geo { width: 70px; } .cmp-panel-full .cmp-ov-main .cmp-mini .c-st { width: 90px; } .cmp-panel-full .cmp-ov-main .cmp-mini .c-ac { width: 60px; }
.cmp-panel-full .cmp-kv-k { flex-basis: 150px; }

@media (max-width: 1400px) { .cmp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .cmp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cmp-stats.is-grid { flex-wrap: wrap; } .cmp-gtile { flex: 1 1 160px; } .cmp-panel-full .cmp-ov { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .cmp-grid { grid-template-columns: minmax(0, 1fr); } .cmp-viewtoggle span { display: none; } }

/* =====================================================================
   Companies > All Companies — affiliate-program directory (companies/directory.php).
   No reference image exists for this page; it reuses the companies-grid-view card system above.
   ===================================================================== */
.nav-sub { display: flex; flex-direction: column; gap: 2px; margin: 2px 0 4px 30px; padding-left: 12px; border-left: 1px solid rgba(255,255,255,.12); }
.nav-subitem { display: flex; align-items: center; height: 30px; padding: 0 10px; border-radius: var(--r-md); color: var(--color-sidebar-text); font-size: 13px; font-weight: 500; white-space: nowrap; }
.nav-subitem:hover { background: var(--color-sidebar-hover); color: #fff; }
.nav-subitem.is-active { color: #fff; background: rgba(255,255,255,.08); font-weight: 600; }
body.sidebar-collapsed .nav-sub { display: none; }
@media (max-width: 1279px) { body:not(.sidebar-expanded) .nav-sub { display: none; } }

/* tags and contact chips used inside the drawer */
.dir-tags { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.dir-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 7px; font-size: 11.5px; font-weight: 700; background: #EEF3FB; color: #3B4C86; white-space: nowrap; }
.dir-tag.is-closed { background: #FDECEE; color: #DC2637; }
.dir-contact { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; height: 26px; padding: 0 9px; border-radius: 8px; background: #F3F7FD; border: 1px solid #E3EBF7; color: #2B3B6B; font-size: 12px; font-weight: 600; text-decoration: none; min-width: 0; }
.dir-contact span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dir-contact:hover { border-color: #C9D8F0; background: #EAF1FD; }
.dir-contact.is-telegram { color: #1B7FB4; } .dir-contact.is-email { color: #1D4ED8; } .dir-contact.is-website { color: #4B5B7A; }
.dir-logo { background: #fff !important; } .dir-logo img { object-fit: contain; }

/* detail drawer */
.dir-drawer .drawer-body { padding: 0; }
.dir-panel { display: flex; flex-direction: column; }
.dir-panel-head { display: flex; align-items: flex-start; gap: 14px; padding: 20px 20px 14px; border-bottom: 1px solid var(--cmp-line); }
.dir-panel-head .brand { flex: none; border-radius: 50%; border: 1px solid rgba(15,23,42,.06); }
.dir-panel-id { flex: 1 1 auto; min-width: 0; }
.dir-panel-id h2 { font-size: 19px; font-weight: 700; color: var(--cmp-navy); margin: 0; line-height: 1.25; }
.dir-panel-id p { font-size: 13px; color: #5D6E95; margin: 2px 0 8px; }
.dir-panel-id .dir-tags { padding: 0; min-height: 0; }
.dir-panel-actions { display: flex; gap: 8px; flex-wrap: wrap; padding: 14px 20px; border-bottom: 1px solid var(--cmp-line); }
.dir-panel-actions .cmp-btn { height: 34px; }
.dir-sec { padding: 16px 20px; border-bottom: 1px solid var(--cmp-line-soft); }
.dir-sec-title { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--cmp-navy); margin: 0 0 12px; }
.dir-sec-title .icon { color: var(--cmp-blue); }
.dir-sec-title em { font-style: normal; color: #667595; font-weight: 500; }
.dir-status-picker { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.dir-status-opt { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 34px; padding: 0 8px; border-radius: 9px; border: 1px solid var(--cmp-line); background: #fff; color: #3B4C86; font: 600 12.5px/1 inherit; font-family: inherit; cursor: pointer; white-space: nowrap; }
.dir-status-opt:hover { border-color: #C9D8F0; background: #F7FAFE; }
.dir-status-opt.is-active.tone-grey, .dir-status-opt.is-active.tone-slate { background: #EEF2F8; border-color: #94A3B8; color: #334155; }
.dir-status-opt.is-active.tone-blue { background: #E6EFFE; border-color: #2563EB; color: #1D4ED8; }
.dir-status-opt.is-active.tone-red { background: #FDECEE; border-color: #E11D48; color: #BE123C; }
.dir-status-opt.is-active.tone-purple { background: #F1ECFE; border-color: #7C3AED; color: #6D28D9; }
.dir-status-opt.is-active.tone-amber { background: #FDF3E1; border-color: #F59E0B; color: #B4570B; }
.dir-status-opt.is-active.tone-green { background: #EAF9F0; border-color: #16A34A; color: #12904A; }
.dir-followup { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.dir-followup .form-label { margin: 0; white-space: nowrap; }
.dir-followup .form-control { max-width: 190px; height: 34px; }
.dir-contact-list { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.dir-contact-list li { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; }
.dir-contact-list li em { font-style: normal; font-size: 12px; color: #667595; }
.dir-contact-del { margin-left: auto; width: 28px; height: 28px; color: #94A3B8; }
.dir-contact-del:hover { color: var(--cmp-red); }
.dir-kvs { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 18px; }
.dir-kv { min-width: 0; }
.dir-kv dt { font-size: 12px; color: #667595; margin: 0 0 2px; }
.dir-kv dd { margin: 0; font-size: 13.5px; font-weight: 600; color: var(--cmp-ink); overflow-wrap: anywhere; }
.dir-geo-list { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.dir-desc { margin: 12px 0 0; font-size: 13px; line-height: 1.55; color: #475569; }
.dir-note-form { display: flex; gap: 8px; align-items: flex-start; margin-bottom: 12px; }
.dir-note-form textarea { flex: 1 1 auto; min-height: 38px; resize: vertical; }
.dir-log { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.dir-log li { padding-left: 14px; border-left: 2px solid var(--cmp-line); }
.dir-log li.is-status { border-left-color: var(--cmp-blue); }
.dir-log-body { font-size: 13px; color: var(--cmp-ink); line-height: 1.45; }
.dir-log-meta { font-size: 11.5px; color: #667595; margin-top: 2px; }
@media (max-width: 600px) { .dir-status-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dir-kvs { grid-template-columns: minmax(0, 1fr); } .dir-panel-head, .dir-panel-actions, .dir-sec { padding-left: 16px; padding-right: 16px; } }
[data-theme="dark"] .dir-tag { background: #1E2836; color: #B8C4DA; }
[data-theme="dark"] .dir-contact { background: #1A2230; border-color: #2A3546; color: #C8D3E6; }
[data-theme="dark"] .dir-status-opt { background: #181F28; color: #C8D3E6; }

/* ---- "Betting Affiliate Directory" page (design-reference-new/companies-directory.png) ---- */
.page-directory .page-content { background: #F5F7FC; }
.bd-root { --bd-ink: #0E1630; --bd-text: #1F2937; --bd-muted: #6B7385; --bd-line: #E3E8F1; --bd-chip: #EDF0F7; --bd-navy: #0F1C4D; --bd-blue: #2550E0;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--bd-text); }
.bd-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin: -6px 0 15px; }
.bd-titles { flex: 1 1 auto; min-width: 0; }
body.page-directory .page-content { padding-left: 18px; padding-right: 15px; }
.bd-title { font-size: 27px; line-height: 1.15; font-weight: 700; letter-spacing: -.022em; color: #111A3D; margin: 14px 0 5px; white-space: nowrap; }
.bd-sub { font-size: 14px; line-height: 1.32; color: #5D667B; max-width: 400px; margin: 0; }
.bd-stats { display: flex; gap: 10px; flex: none; margin-top: 22px; }
.bd-stat { display: flex; align-items: center; gap: 11px; height: 66px; padding: 0 16px 0 11px; background: #fff; border: 1px solid #EBEFF6; border-radius: 12px; box-shadow: 0 1px 2px rgba(16,24,40,.03); color: inherit; text-decoration: none; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.bd-stat:hover { border-color: #CDD8EE; box-shadow: 0 4px 14px rgba(16,24,40,.06); }
.bd-stat strong { display: block; font-size: 19px; line-height: 1.1; font-weight: 700; color: var(--bd-ink); }
.bd-stat em { display: block; font-style: normal; font-size: 11.5px; color: var(--bd-muted); margin-top: 3px; white-space: nowrap; }
.bd-stat-icon { width: 40px; height: 40px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.bd-stat-icon .icon { width: 22px; height: 22px; stroke-width: 2; }
.bd-stat-icon.is-blue { background: #E8EEFF; color: #2550E0; }
.bd-stat-icon.is-green { background: #E3F7EC; color: #13A35A; }
.bd-stat-icon.is-orange { background: #FFF0E2; color: #F27A1A; }

.bd-filters { display: flex; align-items: center; gap: 11px; margin-bottom: 16px; }
.bd-select { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 34px 0 13px; background: #fff; border: 1px solid var(--bd-line); border-radius: 8px; font-size: 12px; font-weight: 500; color: var(--bd-text); white-space: nowrap; cursor: pointer; }
.bd-select select { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; font-size: 14px; }
.bd-select .bd-caret { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: #374151; pointer-events: none; stroke-width: 2; }
.bd-select:hover { border-color: #C9D3E6; }
.bd-select.is-set { border-color: #AFC3F5; background: #F7F9FF; }
.bd-select-text b { font-weight: 600; color: var(--bd-ink); }
.bd-filters > .bd-dd, .bd-filters > .bd-select { flex: 0 1 auto; min-width: 166px; }
.bd-filters > .bd-dd { min-width: 146px; }
.bd-filters > .bd-select:nth-of-type(1) { min-width: 133px; }
.bd-filters > .bd-select:nth-of-type(2) { min-width: 182px; }
.bd-filters > .bd-select:nth-of-type(3) { min-width: 168px; }
.bd-filters .bd-select-text { overflow: hidden; text-overflow: ellipsis; }
.bd-more { margin-left: auto; flex: none; display: inline-flex; align-items: center; gap: 9px; height: 34px; padding: 0 15px; background: #fff; border: 1px solid var(--bd-line); border-radius: 8px; color: var(--bd-blue); font: 600 12.5px/1 "Inter", system-ui, sans-serif; cursor: pointer; }
.bd-more .icon { width: 17px; height: 17px; }
.bd-more:hover, .bd-more.is-on { border-color: #AFC3F5; background: #F7F9FF; }

.bd-dd { position: relative; }
.bd-dd-btn { width: 100%; font-family: inherit; text-align: left; }
.bd-flag { width: 18px !important; height: 12px !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15,23,42,.08); flex: none; object-fit: cover; }
.bd-dd-menu { position: absolute; z-index: 40; top: calc(100% + 6px); left: 0; width: 260px; background: #fff; border: 1px solid var(--bd-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(15,23,42,.14); padding: 6px; }
.bd-dd-search { display: flex; align-items: center; gap: 7px; height: 34px; padding: 0 10px; margin-bottom: 4px; border: 1px solid var(--bd-line); border-radius: 8px; color: #8A93A6; }
.bd-dd-search input { border: 0; outline: 0; flex: 1; min-width: 0; font: 500 12.5px "Inter", system-ui, sans-serif; color: var(--bd-text); background: transparent; }
.bd-dd-list { max-height: 320px; overflow-y: auto; }
.bd-dd-item { display: flex; align-items: center; gap: 10px; height: 34px; padding: 0 9px; border-radius: 7px; font-size: 12.5px; font-weight: 500; color: var(--bd-text); text-decoration: none; }
.bd-dd-item[hidden] { display: none; }
.bd-dd-item span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bd-dd-item em { font-style: normal; font-size: 11.5px; color: var(--bd-muted); }
.bd-dd-item:hover { background: #F2F5FB; }
.bd-dd-item.is-on { background: #EEF3FF; color: var(--bd-blue); font-weight: 600; }
.bd-dd-globe { width: 18px; height: 18px; flex: none !important; display: inline-flex; align-items: center; justify-content: center; color: #6B7385; }

.bd-morebar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: -4px 0 15px; padding: 10px; background: #fff; border: 1px solid var(--bd-line); border-radius: 10px; }
.bd-morebar[hidden] { display: none; }
.bd-search { height: 35px; flex: 0 1 300px; }
.bd-reset { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: 12.5px; font-weight: 600; color: var(--bd-blue); text-decoration: none; }

.bd-chiprow { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 17px; }
.bd-qchips { display: flex; align-items: center; gap: 7px; flex-wrap: nowrap; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.bd-qchips::-webkit-scrollbar { display: none; }
.bd-qchip { flex: none; display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 12px; background: var(--bd-chip); border: 1px solid transparent; font-size: 11px; font-weight: 500; color: #3A4256; text-decoration: none; white-space: nowrap; transition: background var(--t-fast), color var(--t-fast); }
.bd-qchip:hover { background: #E2E7F2; }
.bd-qchip.is-on { background: #E6EDFF; border-color: #AFC3F5; color: var(--bd-blue); font-weight: 600; }
.bd-viewsort { display: flex; align-items: center; gap: 10px; flex: none; }
.bd-views { display: flex; gap: 6px; padding-right: 10px; border-right: 1px solid var(--bd-line); }
.bd-view { width: 31px; height: 31px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; color: #3A4256; background: transparent; }
.bd-view .icon { width: 17px; height: 17px; }
.bd-view:hover { background: #ECEFF6; }
.bd-view.is-on { background: var(--bd-navy); color: #fff; }
.bd-sort { height: 31px; padding-left: 12px; min-width: 116px; font-size: 11.5px; color: #4B5468; }

.bd-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px 9px; }
.bd-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid #EBEFF6; border-radius: 12px; padding: 13px 13px 11px; box-shadow: 0 1px 3px rgba(16,24,40,.04); cursor: pointer; transition: box-shadow var(--t-base), border-color var(--t-base), transform var(--t-base); min-width: 0; }
.bd-card:hover { box-shadow: 0 10px 28px rgba(16,24,40,.09); border-color: #D9E1EF; transform: translateY(-1px); }
.bd-card:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.bd-card.is-closed { opacity: .72; }
.bd-head { display: flex; align-items: center; gap: 8px; min-height: 34px; }
.bd-brand { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; height: 32px; overflow: hidden; }
.bd-wordmark { display: block; height: 30px; width: auto; max-width: min(112px, 100%); object-fit: contain; object-position: left center; border-radius: 5px; }
.bd-logo { width: 30px; height: 30px; flex: none; border-radius: 6px; overflow: hidden; background: #fff; border: 1px solid #EEF1F6; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: var(--bd-navy); }
.bd-logo img { width: 100%; height: 100%; object-fit: contain; }
.bd-logo.is-sm { width: 28px; height: 28px; border-radius: 7px; }
.bd-name { font-size: 15px; font-weight: 800; font-style: italic; letter-spacing: -.03em; color: var(--bd-ink); line-height: 1.15; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bd-status { flex: none; display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 9px 0 8px; border-radius: 12px; font-size: 10.5px; font-weight: 500; white-space: nowrap; }
.bd-status .icon { width: 12px; height: 12px; stroke-width: 2.2; }
.bd-status.is-partner { background: linear-gradient(180deg, #17B26F, #0E9058); color: #fff; padding: 0 13px 0 11px; box-shadow: 0 2px 6px rgba(14,144,88,.25); }
.bd-status.is-partner .icon { fill: #fff; }
.bd-status.is-applied { background: #E7EEFF; color: #2550E0; }
.bd-status.is-negotiating { background: #FFF1E3; color: #E9741B; }
.bd-status.is-no_reply { background: #FDECEC; color: #D92D20; }
.bd-status.is-not_applied { background: #F1F3F7; color: #5B6478; }
.bd-status.is-contacted { background: #F1ECFE; color: #6D28D9; }
.bd-status.is-rejected { background: #EEF1F6; color: #475467; }
.bd-menu { flex: none; }
.bd-menu .btn-icon { width: 22px; height: 28px; color: #303B57; }
.bd-chips { display: flex; align-items: center; gap: 7px; margin: 12px 0 12px; min-height: 22px; overflow: hidden; }
.bd-chip { display: inline-flex; align-items: center; height: 22px; padding: 0 10px; border-radius: 11px; background: var(--bd-chip); font-size: 10.5px; font-weight: 500; color: #3A4256; white-space: nowrap; }
.bd-chip.is-more { background: #ECEBFE; color: #4F46E5; padding: 0 8px; }
.bd-chips.is-inline { margin: 0; flex-wrap: nowrap; }
.bd-terms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; margin-bottom: 12px; }
.bd-term { border: 1px solid #E6EAF2; border-radius: 8px; padding: 7px 4px 7px 6px; min-width: 0; }
.bd-term-l { display: block; font-size: 10.5px; font-weight: 600; color: #111827; margin-bottom: 6px; }
.bd-term-v { display: inline-block; max-width: 100%; height: 19px; line-height: 19px; padding: 0 4px; border-radius: 5px; background: #EAF7EF; color: #12924F; font-size: 10.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: top; }
.bd-term-v.is-na { background: #F2F4F7; color: #8A93A6; }
.bd-payout { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--bd-text); margin-bottom: 9px; }
.bd-payout .icon { width: 17px; height: 17px; color: var(--bd-navy); stroke-width: 2; }
.bd-reach { display: flex; align-items: center; gap: 9px; height: 25px; margin-bottom: 5px; min-width: 0; }
.bd-reach-icon { width: 22px; height: 22px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: #2AABEE; }
.bd-reach-icon svg, .bd-reach-icon .icon { width: 12px; height: 12px; }
.bd-reach.is-email .bd-reach-icon { background: #5468F5; }
.bd-reach.is-website .bd-reach-icon { background: #64748B; }
.bd-reach.is-none .bd-reach-icon { background: #CBD2DE; }
.bd-reach a { flex: 1 1 auto; min-width: 0; font-size: 12.5px; font-weight: 500; color: #2B4FD9; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bd-reach a:hover { text-decoration: underline; }
.bd-reach.is-none > span:last-child { font-size: 12px; color: #9AA3B5; }
.bd-copy { flex: none; width: 24px; height: 24px; border: 0; background: transparent; color: #4B5468; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; cursor: pointer; }
.bd-copy:hover { background: #F0F3F9; color: var(--bd-ink); }
.bd-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin: 8px 0 13px; }
.bd-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 35px; border-radius: 7px; font: 600 12.5px/1 "Inter", system-ui, sans-serif; text-decoration: none; white-space: nowrap; cursor: pointer; }
.bd-btn .icon { width: 16px; height: 16px; stroke-width: 2; }
.bd-btn-site { background: #fff; border: 1px solid #DDE3EE; color: var(--bd-ink); }
.bd-btn-site:hover { border-color: #B9C6DD; background: #F8FAFD; }
.bd-btn-site.is-disabled { opacity: .45; cursor: default; }
.bd-btn-aff { --bd-brand: #14204A; background: var(--bd-brand); border: 1px solid var(--bd-brand); color: #fff; box-shadow: 0 2px 6px rgba(15,23,42,.12); }
.bd-btn-aff:hover { filter: brightness(1.08); }
.bd-foot { display: flex; align-items: center; justify-content: space-between; margin-top: auto; font-size: 10.5px; color: #8A93A6; }
.bd-save { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; padding: 2px 4px; font: 500 10.5px "Inter", system-ui, sans-serif; color: #5B6478; cursor: pointer; }
.bd-save .icon { width: 15px; height: 15px; color: #303B57; }
.bd-save.is-on { color: #B7791F; } .bd-save.is-on .icon { fill: #F5B70A; color: #E0A100; }
.bd-empty { grid-column: 1 / -1; background: #fff; border: 1px solid var(--bd-line); border-radius: 12px; padding: 24px; }

.bd-table-wrap { background: #fff; border: 1px solid #EBEFF6; border-radius: 12px; overflow-x: auto; }
.bd-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.bd-table th { text-align: left; font-size: 11px; font-weight: 600; color: var(--bd-muted); padding: 11px 12px; background: #F8FAFD; border-bottom: 1px solid #EBEFF6; white-space: nowrap; }
.bd-table td { padding: 10px 12px; border-bottom: 1px solid #F0F3F8; vertical-align: middle; white-space: nowrap; }
.bd-table tr:last-child td { border-bottom: 0; }
.bd-row { cursor: pointer; } .bd-row:hover td { background: #FAFBFE; }
.bd-table .bd-name { font-size: 13.5px; font-weight: 700; max-width: 180px; }
.bd-link { color: #2B4FD9; text-decoration: none; display: inline-block; max-width: 190px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
.bd-table .c-ac { width: 40px; text-align: right; }

.bd-pagefoot { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 2px 6px; }
.bd-count { font-size: 12.5px; color: var(--bd-muted); }

@media (max-width: 1180px) { .bd-top { flex-wrap: wrap; } .bd-stats { flex-wrap: wrap; } .bd-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .bd-filters { flex-wrap: wrap; } .bd-filters > .bd-dd, .bd-filters > .bd-select { flex: 1 1 160px; } }
@media (max-width: 1000px) { .bd-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bd-chiprow { flex-direction: column; align-items: stretch; } .bd-viewsort { justify-content: flex-end; } }
@media (max-width: 640px) { .bd-grid { grid-template-columns: minmax(0, 1fr); } .bd-stats { display: grid; grid-template-columns: 1fr 1fr; width: 100%; } .bd-stat { padding-right: 12px; } .bd-title { font-size: 23px; margin-top: 4px; } .bd-more { margin-left: 0; } .bd-pagefoot { flex-direction: column; } .bd-qchips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; } }
[data-theme="dark"] .page-directory .page-content { background: transparent; }
[data-theme="dark"] .bd-root { --bd-ink: #E6ECF7; --bd-text: #C8D3E6; --bd-muted: #8D99AF; --bd-line: #2A3546; --bd-chip: #1E2836; }
[data-theme="dark"] .bd-stat, [data-theme="dark"] .bd-card, [data-theme="dark"] .bd-select, [data-theme="dark"] .bd-more, [data-theme="dark"] .bd-morebar, [data-theme="dark"] .bd-dd-menu, [data-theme="dark"] .bd-table-wrap, [data-theme="dark"] .bd-empty { background: #181F28; border-color: #2A3546; }
[data-theme="dark"] .bd-term { border-color: #2A3546; } [data-theme="dark"] .bd-term-l { color: #C8D3E6; }
[data-theme="dark"] .bd-btn-site { background: #181F28; border-color: #2A3546; }
[data-theme="dark"] .bd-qchip, [data-theme="dark"] .bd-chip { color: #B8C4DA; }
[data-theme="dark"] .bd-table th { background: #1A2230; border-color: #2A3546; } [data-theme="dark"] .bd-table td { border-color: #222C3A; }
[data-theme="dark"] .bd-logo { border-color: #2A3546; }

/* =====================================================================
   Add Company wizard (design-reference-new/add-company-step1..4)
   ===================================================================== */
.page-company-add .page-header { display: none; }
.aw-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin: 14px 0 12px; }
.aw-back { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: #4F6191; margin-bottom: 6px; }
.aw-back .icon { width: 13px; height: 13px; }
.aw-back:hover { color: var(--cmp-blue); }
.aw-title { font-size: 30px; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; color: var(--cmp-navy); }
.aw-sub { font-size: 14px; color: #56679A; margin-top: 5px; }
.aw-top .cmp-btn { height: 36px; margin-top: 12px; }
.aw-steps { display: flex; align-items: stretch; background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; height: 67px; margin-bottom: 15px; overflow: hidden; }
.aw-step { position: relative; flex: 1 1 0; display: flex; align-items: center; gap: 16px; padding: 0 20px 0 22px; text-decoration: none; }
.aw-step + .aw-step::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 1px; background: linear-gradient(to bottom, transparent, #DCE5F2 30%, #DCE5F2 70%, transparent); }
.aw-step-num { width: 32px; height: 32px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; background: #EEF2F8; color: #667499; }
.aw-step.is-current .aw-step-num { background: var(--cmp-blue); color: #fff; }
.aw-step.is-done .aw-step-num { background: #16A34A; color: #fff; }
.aw-step.is-done .aw-step-num .icon { width: 15px; height: 15px; stroke-width: 3; }
.aw-step-t { font-size: 13.5px; font-weight: 700; color: #46588A; line-height: 1.2; }
.aw-step-d { font-size: 12px; color: #667595; margin-top: 3px; }
.aw-step.is-current .aw-step-t { color: var(--cmp-blue); }
.aw-step.is-current::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--cmp-blue); }
.aw-step.is-done .aw-step-t { color: var(--cmp-ink); }
.aw-steps.is-final .aw-step { gap: 12px; padding-left: 26px; }
.aw-steps.is-final .aw-step-idx { font-size: 13px; font-weight: 500; color: #46588A; margin-right: 4px; }
.aw-steps.is-final .aw-step-num { width: 28px; height: 28px; }
.aw-steps.is-final .aw-step.is-done .aw-step-num .icon { width: 14px; height: 14px; }
.aw-steps.is-final .aw-step::before { display: none; }
.aw-steps.is-final .aw-step.is-current::after { display: none; }
.aw-steps.is-final .aw-arrow { flex: 0 0 100px; display: flex; align-items: center; justify-content: center; color: #16A34A; }
.aw-steps.is-final .aw-arrow .icon { width: 98px; height: 16px; }
.aw-steps.is-final .aw-step.is-current { background: #F3F7FE; }

.aw-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 17px; align-items: start; }
.aw-main { display: flex; flex-direction: column; gap: 15px; }
.aw-card { background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; padding: 22px; }
.aw-card.is-fill { min-height: 720px; display: flex; flex-direction: column; padding-bottom: 27px; }
.aw-card.is-fill .aw-card-head { margin-bottom: 25px; }
.aw-card.is-fill .aw-info { margin-top: auto; }
.aw-card.is-tight { padding: 16px; }
.aw-card.is-review { padding: 13px; }
.aw-card-head { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 17px; }
.aw-card-icon { width: 30px; height: 30px; flex: none; border-radius: 7px; background: #E8F0FE; color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.aw-card-icon .icon { width: 19px; height: 19px; }
.aw-card-title { font-size: 16px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; line-height: 1.2; }
.aw-card-sub { font-size: 12.5px; color: #667499; margin-top: 3px; }
.aw-card-head .aw-edit { margin-left: auto; }
.aw-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 34px; }
.aw-grid2.is-wide-left { grid-template-columns: 1.29fr 1fr; gap: 22px 28px; }
.aw-grid3 { display: grid; grid-template-columns: 1.7fr 1fr 1fr; gap: 24px 26px; }
.aw-col { display: flex; flex-direction: column; gap: 22px; }
.aw-col.is-gap15, .aw-grid2.is-gap15 { gap: 15px; } .aw-grid2.is-gap15 { column-gap: 34px; } .aw-col.is-gap17 { gap: 17px; }
.aw-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.aw-field.is-span2 { grid-row: span 2; }
.aw-label { font-size: 13px; font-weight: 600; color: var(--cmp-ink); line-height: 1.3; }
.aw-label .req { color: #E11D48; margin-left: 3px; }
.aw-label .opt { font-weight: 400; color: #667595; margin-left: 2px; }
.aw-hint { font-size: 12px; color: #667595; }
.aw-help { font-size: 12.5px; color: #667499; margin-top: -2px; }
.aw-input, .aw-textarea, .aw-selectbtn { width: 100%; height: 38px; padding: 0 13px; background: #fff; border: 1px solid #DCE5F2; border-radius: 8px; font-size: 13.5px; color: var(--cmp-ink); transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.aw-input::placeholder, .aw-textarea::placeholder { color: #667595; }
.aw-input:hover, .aw-textarea:hover, .aw-selectbtn:hover { border-color: #C5D4EA; }
.aw-input:focus, .aw-textarea:focus, .aw-selectbtn:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.15); }
.aw-input.is-invalid, .aw-textarea.is-invalid, .aw-selectbtn.is-invalid, .aw-chips.is-invalid, .aw-seg.is-invalid, .aw-tiles.is-invalid { border-color: #E11D48; box-shadow: 0 0 0 3px rgba(225,29,72,.12); border-radius: 8px; }
.aw-input.is-link { color: #1D4ED8; }
.aw-textarea { height: auto; min-height: 108px; padding: 10px 13px; resize: vertical; line-height: 1.45; }
.aw-textarea.is-short { min-height: 59px; }
.aw-error { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: #E11D48; }
.aw-error .icon { stroke-width: 2.4; }
.aw-count { text-align: right; font-size: 11.5px; color: #667595; margin-top: -1px; line-height: 1.2; }
.aw-addon { position: relative; display: flex; align-items: center; }
.aw-addon .aw-input { padding-left: 42px; }
.aw-addon-ic { position: absolute; left: 13px; color: #5D6E95; pointer-events: none; display: inline-flex; }
.aw-addon-ic .icon { width: 15px; height: 15px; }
.aw-addon-ic.is-right { left: auto; right: 12px; }
.aw-addon.is-sep .aw-input { padding-left: 58px; }
.aw-addon.is-sep .aw-addon-ic { left: 0; width: 46px; height: 36px; top: 1px; display: inline-flex; align-items: center; justify-content: center; border-right: 1px solid #DCE5F2; }
.aw-prefix .aw-input { padding-left: 32px; }
.aw-prefix .aw-addon-ic { font-size: 13px; font-weight: 600; color: #5D6E95; }
.aw-suffix .aw-input { padding-right: 32px; }
.aw-suffix .aw-addon-ic { font-size: 13px; font-weight: 500; }
.aw-input[type=number]::-webkit-inner-spin-button { opacity: 0; }
.aw-input:read-only { cursor: pointer; }
/* custom selects */
.aw-select { position: relative; }
.aw-selectbtn { display: flex; align-items: center; gap: 10px; text-align: left; cursor: pointer; }
.aw-selectbtn .flag { width: 20px !important; height: 14px !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); }
.aw-selectbtn .aw-sel-caret { margin-left: auto; color: #3B4C86; stroke-width: 2.2; width: 16px; height: 16px; }
.aw-selectbtn .aw-sel-text { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aw-selectbtn .is-placeholder { color: #667595; }
.aw-selectbtn .aw-status-dot { width: 9px; height: 9px; border-radius: 50%; background: #16A34A; flex: none; }
.aw-menu { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 6px); background: #fff; border: 1px solid var(--cmp-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(15,23,42,.14); padding: 6px; max-height: 300px; overflow: auto; }
.aw-menu[hidden] { display: none; }
.aw-menu-search { display: flex; align-items: center; gap: 8px; padding: 6px 8px 8px; border-bottom: 1px solid var(--cmp-line-soft); margin-bottom: 4px; }
.aw-menu-search input { flex: 1; border: 0; outline: none; font-size: 13.5px; background: none; }
.aw-menu-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border-radius: 7px; font-size: 13.5px; color: var(--cmp-ink); text-align: left; cursor: pointer; }
.aw-menu-item:hover, .aw-menu-item.is-hl { background: var(--cmp-field); }
.aw-menu-item.is-selected { color: var(--cmp-blue); font-weight: 600; }
.aw-menu-item .flag { width: 20px !important; height: 14px !important; border-radius: 2px; }
.aw-menu-empty { padding: 10px; font-size: 13px; color: #667595; }
/* chips */
.aw-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.aw-chip { display: inline-flex; align-items: center; gap: 9px; height: 28px; padding: 0 10px 0 11px; border-radius: 7px; background: #EEF2F9; color: #2F3D6B; font-size: 13px; font-weight: 500; white-space: nowrap; }
.aw-chip .flag { width: 18px !important; height: 12px !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); }
.aw-chip-x { display: inline-flex; color: #3B4C86; opacity: .8; border-radius: 4px; }
.aw-chip-x .icon { width: 12px; height: 12px; stroke-width: 2.4; }
.aw-chip-x:hover { opacity: 1; color: #E11D48; }
.aw-chip-add { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 11px; border: 1px solid #DCE5F2; border-radius: 7px; background: #fff; color: var(--cmp-blue); font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.aw-chip-add .icon { width: 14px; height: 14px; stroke-width: 2.4; }
.aw-chip-add:hover { background: var(--cmp-blue-soft); border-color: #CFE2FE; }
.aw-chip-input { height: 28px; width: 140px; padding: 0 10px; border: 1px solid var(--cmp-blue); border-radius: 7px; font-size: 13px; outline: none; }
.aw-tags-row .aw-chip { height: 30px; border-radius: 8px; }
.aw-tags-row .aw-chip-add { height: 30px; border-radius: 8px; }
.aw-geo-search { margin-top: 2px; }
.aw-geo-search .aw-input { height: 32px; font-size: 13px; }
.aw-geo-search .aw-addon-ic { color: #65749C; }
.aw-suggest { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: #667499; margin-top: 4px; }
.aw-suggest > span { margin-right: 2px; }
.aw-suggest-chip { display: inline-flex; align-items: center; height: 22px; padding: 0 10px; border-radius: 6px; background: #EDF2FA; color: #3B4C86; font-size: 12px; font-weight: 500; cursor: pointer; }
.aw-suggest-chip:hover { background: #E1EAF8; }
/* segmented control / deal tabs */
.aw-seg { display: flex; border: 1px solid #DCE5F2; border-radius: 8px; overflow: hidden; background: #fff; height: 36px; }
.aw-seg-btn { flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 13px; font-weight: 500; color: #5D6E95; border-right: 1px solid #E6EDF7; cursor: pointer; white-space: nowrap; transition: background var(--t-fast), color var(--t-fast); }
.aw-seg-btn:last-child { border-right: 0; }
.aw-seg-btn:hover { background: var(--cmp-field); }
.aw-seg-btn.is-active { background: #EAF9F0; color: #12904A; font-weight: 600; box-shadow: inset 0 0 0 1px #A7E3C1; }
.aw-seg-btn.is-active .aw-seg-dot { background: #16A34A; color: #fff; }
.aw-seg-dot { width: 15px; height: 15px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #E7EDF6; color: #667499; }
.aw-seg-dot .icon { width: 9px; height: 9px; stroke-width: 3; }
.aw-seg.is-tabs .aw-seg-btn.is-active { background: #E8F0FE; color: var(--cmp-blue); box-shadow: none; }
/* logo */
.aw-logo { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 26px; }
.aw-logo-box { width: 98px; height: 96px; flex: none; border-radius: 12px; background: #0D1B3E; d width: 98px; height: 96px; flex: none; border-radius: 50%; background: #0D1B3E; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; border: 1px solid rgba(15,23,42,.06); ox-sizing: border-box; }
.aw-logo-box.is-empty { background: #F3F6FB; border: 1px dashed #C5D4EA; color: #667595; }
.aw-logo-actions { display: flex; flex-direction: column; gap: 12px; padding-top: 9px; }
.aw-logo-actions .row { display: flex; gap: 14px; }
.aw-logo .aw-hint { flex: 1 0 100%; margin-top: 2px; }
.aw-btn-soft { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 14px; border-radius: 8px; border: 1px solid #DCE5F2; background: #fff; font-size: 13px; font-weight: 600; color: var(--cmp-ink); cursor: pointer; transition: background var(--t-fast); }
.aw-btn-soft .icon { width: 15px; height: 15px; }
.aw-btn-soft:hover { background: var(--cmp-field); }
.aw-btn-soft.is-blue, .aw-btn-soft.is-red { height: 26px; padding: 0 12px; font-size: 12.5px; border-radius: 6px; gap: 7px; }
.aw-btn-soft.is-blue .icon, .aw-btn-soft.is-red .icon { width: 13px; height: 13px; }
.aw-btn-soft.is-blue { background: #E8F0FE; border-color: #E8F0FE; color: var(--cmp-blue); }
.aw-btn-soft.is-red { background: #FDECEE; border-color: #FDECEE; color: #DC2637; }
/* info bar, actions, collapsible */
.aw-info { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 16px; border-radius: 8px; background: #EEF4FD; color: #46588A; font-size: 12.5px; margin-top: 24px; }
.aw-info .icon { color: var(--cmp-blue); flex: none; width: 17px; height: 17px; }
.aw-info strong { color: var(--cmp-ink); font-weight: 600; }
.aw-actions { display: flex; align-items: center; justify-content: space-between; margin-top: 24px; }
.aw-actions .cmp-btn { height: 38px; font-size: 13.5px; }
.aw-actions .cmp-btn-ghost { padding: 0 22px; }
.aw-actions .cmp-btn-primary { padding: 0 24px; }
.aw-actions .cmp-btn .icon { width: 15px; height: 15px; }
.aw-collapse { background: #F1F5FB; border-radius: 8px; }
.aw-collapse-head { display: flex; align-items: center; gap: 10px; width: 100%; padding: 6px 16px; min-height: 50px; text-align: left; cursor: pointer; }
.aw-collapse-head .aw-card-icon { width: 26px; height: 26px; background: transparent; color: var(--cmp-blue); }
.aw-collapse-head .aw-card-icon .icon { width: 18px; height: 18px; }
.aw-collapse-t { font-size: 13px; font-weight: 600; color: var(--cmp-ink); }
.aw-collapse-d { font-size: 12px; color: #667499; margin-top: 2px; }
.aw-collapse-caret { margin-left: auto; color: #3B4C86; transition: transform var(--t-fast); width: 16px; height: 16px; }
.aw-collapse.is-open .aw-collapse-caret { transform: rotate(90deg); }
.aw-collapse-body { padding: 4px 16px 16px; border-top: 1px solid #E1E9F4; }
/* deal preview */
.aw-deal { background: #F3F6FB; border-radius: 10px; padding: 12px 20px 16px; align-self: stretch; }
.aw-deal-head { display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 700; color: var(--cmp-ink); }
.aw-deal-head .icon { color: var(--cmp-blue); width: 15px; height: 15px; }
.aw-deal-big { font-size: 26px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.02em; margin-top: 8px; line-height: 1.1; }
.aw-deal-big small { font-size: 15px; font-weight: 600; color: var(--cmp-ink); margin-left: 5px; }
.aw-deal-plus { font-size: 16px; font-weight: 700; color: var(--cmp-navy); margin-top: 9px; }
.aw-deal-plus small { font-weight: 500; color: #46588A; font-size: 13.5px; margin-left: 4px; }
.aw-deal-list { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.aw-deal-list li { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: #46588A; }
.aw-deal-list .icon { color: #4F7BE8; flex: none; width: 14px; height: 14px; }
/* payment method tiles */
.aw-tiles { display: flex; gap: 5px; }
.aw-tile { position: relative; flex: 0 0 84px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; height: 80px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; cursor: pointer; transition: border-color var(--t-fast), background var(--t-fast); }
.aw-tile:hover { border-color: #C5D4EA; background: var(--cmp-field); }
.aw-tile.is-active { border-color: var(--cmp-blue); background: #F3F7FF; box-shadow: inset 0 0 0 1px var(--cmp-blue); }
.aw-tile-check { position: absolute; top: 4px; right: 4px; width: 14px; height: 14px; border-radius: 50%; background: var(--cmp-blue); color: #fff; display: none; align-items: center; justify-content: center; }
.aw-tile.is-active .aw-tile-check { display: inline-flex; }
.aw-tile-check .icon { width: 8px; height: 8px; stroke-width: 3.5; }
.aw-tile-ic { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 12px; font-weight: 700; }
.aw-tile-ic.is-line { background: none; color: var(--cmp-blue); }
.aw-tile-ic.is-line .icon { width: 22px; height: 22px; }
.aw-tile-t { font-size: 12px; font-weight: 600; color: var(--cmp-ink); line-height: 1.2; text-align: center; }
.aw-tile-t small { display: block; font-size: 10px; font-weight: 400; color: #667499; margin-top: 1px; }
/* right rail */
.aw-rail { display: flex; flex-direction: column; gap: 15px; position: sticky; top: 16px; }
.aw-rail-card { background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; padding: 20px 22px 17px; }
.aw-rail-card:has(> .aw-check-head) { padding-top: 15px; }
.aw-rail-card.is-tall { min-height: 460px; }
.aw-rail-head { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 10px; }
.aw-rail-head .icon { color: var(--cmp-blue); flex: none; margin-top: 1px; width: 18px; height: 18px; }
.aw-rail-title { font-size: 15px; font-weight: 700; color: var(--cmp-navy); line-height: 1.2; }
.aw-rail-sub { font-size: 12.5px; color: #667499; margin-top: 3px; }
.aw-preview { background: #F3F6FB; border-radius: 10px; padding: 7px 10px 7px 7px; display: flex; align-items: flex-start; gap: 14px; }
.aw-preview-logo { width: 80px; height: 74px; flex: none; border-radius: 10px; background: #0D1B3E; di width: 80px; height: 74px; flex: none; border-radius: 50%; background: #0D1B3E; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; ; box-sizing: border-box; }
.aw-preview-logo.is-empty { background: #E7EDF6; color: #667595; font-weight: 700; font-size: 18px; }
.aw-preview-name { font-size: 16px; font-weight: 700; color: var(--cmp-navy); line-height: 1.2; margin-top: 3px; }
.aw-preview-cat { font-size: 13px; color: #5D6E95; margin-top: 4px; }
.aw-preview-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.aw-tag { display: inline-flex; align-items: center; height: 18px; padding: 0 8px; border-radius: 5px; font-size: 11px; font-weight: 600; background: #EDF2FA; color: #3B4C86; white-space: nowrap; }
.aw-tag.is-tier { background: #EFEAFE; color: #6D28D9; } .aw-tag.is-value { background: #FEE7E9; color: #E11D48; }
.aw-kvs { margin-top: 4px; }
.aw-kv { display: flex; align-items: center; gap: 0; height: 32px; padding: 0 2px 0 4px; border-bottom: 1px solid #EEF2F8; font-size: 13px; }
.aw-kv:last-child { border-bottom: 0; }
.aw-kv .icon { color: #667595; flex: none; width: 16px; height: 16px; margin-right: 13px; }
.aw-kv-k { color: #667499; font-size: 12.5px; flex: 0 0 116px; }
.aw-kv-v { color: var(--cmp-navy); font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: center; gap: 7px; }
.aw-kv-v a { color: #1D4ED8; display: inline-flex; align-items: center; gap: 5px; }
.aw-kv-v a .icon { color: #1D4ED8; width: 13px; height: 13px; margin: 0; }
.aw-kv-v .flag { width: 18px !important; height: 12px !important; border-radius: 2px; }
.aw-kv-v .aw-tag + .aw-tag { margin-left: 0; }
.aw-check-head { display: flex; align-items: center; justify-content: space-between; }
.aw-check-head .aw-rail-title { font-size: 15px; }
.aw-check-count { font-size: 12.5px; color: #667499; }
.aw-progress { height: 6px; border-radius: 3px; background: #E1E7F0; margin: 8px 0 16px; overflow: hidden; }
.aw-progress > span { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, #1668F5, #4C8DF8); transition: width var(--t-base); }
.aw-progress.is-done > span { background: #16A34A; }
.aw-checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.aw-check { display: flex; align-items: flex-start; gap: 10px; height: 40px; }
.aw-check-ic { width: 14px; height: 14px; flex: none; border-radius: 50%; border: 1.5px solid #CBD5E6; margin-top: 2px; display: inline-flex; align-items: center; justify-content: center; }
.aw-check.is-current .aw-check-ic { border: 0; background: var(--cmp-blue); }
.aw-check.is-done .aw-check-ic { border: 0; background: #16A34A; color: #fff; }
.aw-check.is-done .aw-check-ic .icon { width: 9px; height: 9px; stroke-width: 3.4; }
.aw-check-t { font-size: 13px; font-weight: 700; color: var(--cmp-ink); line-height: 1.2; }
.aw-check.is-pending .aw-check-t { color: #46588A; }
.aw-check-d { font-size: 12px; color: #667595; margin-top: 3px; }
.aw-check-badge { margin-left: auto; height: 18px; padding: 0 7px; border-radius: 5px; font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; white-space: nowrap; }
.aw-check-badge.is-progress { background: #E8F0FE; color: var(--cmp-blue); }
.aw-check-badge.is-complete { background: #DFF7E9; color: #12904A; }
.aw-checklist.is-final .aw-check { height: 48px; border-bottom: 1px solid #EEF2F8; gap: 14px; align-items: center; }
.aw-checklist.is-final .aw-check:last-child { border-bottom: 0; }
.aw-checklist.is-final .aw-check-ic { width: 22px; height: 22px; margin: 0; }
.aw-checklist.is-final .aw-check.is-done .aw-check-ic .icon { width: 12px; height: 12px; }
.aw-tip { display: flex; align-items: flex-start; gap: 12px; background: #EEF4FD; border: 1px solid #D5E3F7; border-radius: 8px; padding: 11px 14px; font-size: 12.5px; color: #46588A; line-height: 1.45; margin-top: 14px; }
.aw-tip .icon { color: var(--cmp-blue); flex: none; margin-top: 1px; width: 16px; height: 16px; }
.aw-tip strong { display: block; color: var(--cmp-ink); font-weight: 700; font-size: 13px; margin-bottom: 3px; }
.aw-tip.is-green { background: #EAF9F0; border-color: #BFE8CF; color: #2F6B49; padding: 16px; border-radius: 10px; margin-top: 18px; gap: 14px; }
.aw-tip.is-green .aw-tip-ic { width: 26px; height: 26px; flex: none; border-radius: 50%; background: #16A34A; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.aw-tip.is-green .aw-tip-ic .icon { color: #fff; width: 14px; height: 14px; stroke-width: 3; margin: 0; }
.aw-tip.is-green strong { color: #0F172A; font-size: 14px; }
.aw-key { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.aw-key li { display: flex; align-items: flex-start; gap: 12px; padding: 8px 10px; border-radius: 8px; min-height: 48px; }
.aw-key li.is-current { background: #EEF3FC; }
.aw-key-ic { width: 22px; height: 22px; flex: none; border-radius: 50%; background: #16A34A; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; margin-top: 2px; }
.aw-key-ic.is-num { background: #EEF2F8; color: #667499; } .aw-key-ic.is-current { background: var(--cmp-blue); color: #fff; }
.aw-key-ic .icon { width: 12px; height: 12px; stroke-width: 3; }
.aw-key-t { font-size: 13px; font-weight: 700; color: var(--cmp-ink); line-height: 1.2; }
.aw-key-d { font-size: 12px; color: #667499; margin-top: 3px; }
/* review */
.aw-review-sec { border: 1px solid var(--cmp-line); border-radius: 10px; padding: 17px 16px 9px; }
.aw-review-head { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.aw-review-head .aw-card-icon { width: 24px; height: 24px; background: none; }
.aw-review-head .aw-card-icon .icon { width: 20px; height: 20px; }
.aw-review-title { font-size: 15px; font-weight: 700; color: var(--cmp-navy); }
.aw-edit { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--cmp-blue); margin-left: auto; }
.aw-edit .icon { width: 13px; height: 13px; }
.aw-edit.is-btn { height: 34px; padding: 0 14px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; color: var(--cmp-ink); }
.aw-review-grid { display: grid; grid-template-columns: 397fr 421fr; gap: 0; padding: 0 0 0 38px; }
.aw-review-grid > div + div { border-left: 1px solid var(--cmp-line-soft); padding-left: 19px; }
.aw-review-brand { display: flex; align-items: flex-start; gap: 18px; padding: 15px 0 0; }
.aw-review-brand .aw-logo-box { width: 96px; height: 96px; border-radius: 10px; }
.aw-review-brand .aw-logo-box { width: 96px; height: 96px; border-radius: 50%; }
.aw-review-brand h4, .aw-review-brand h3, .aw-review-brand h2 { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; color: var(--cmp-navy); margin-top: 4px; }
.aw-review-brand h4 .cmp-verified-dot, .aw-review-brand h3 .cmp-verified-dot, .aw-review-brand h2 .cmp-verified-dot { width: 14px; height: 14px; }
.aw-review-brand p { font-size: 13px; color: #5D6E95; margin-top: 5px; }
.aw-review-brand .aw-preview-tags { margin-top: 10px; } .aw-review-brand .aw-tag { height: 20px; font-size: 11.5px; }
.aw-rv { display: flex; align-items: center; gap: 10px; height: 27px; border-bottom: 1px solid #EEF2F8; font-size: 13px; }
.aw-rv:last-child { border-bottom: 0; }
.aw-rv-k { flex: 0 0 138px; color: #667499; font-size: 12.5px; }
.aw-review-grid > div:first-child .aw-rv-k { flex-basis: 122px; }
.aw-rv-v { color: var(--cmp-navy); font-weight: 600; display: flex; align-items: center; gap: 8px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aw-rv-v .flag { width: 18px !important; height: 12px !important; border-radius: 2px; }
.aw-rv-v a { color: #1D4ED8; display: inline-flex; align-items: center; gap: 5px; }
.aw-rv-v a .icon { width: 13px; height: 13px; }
.aw-rv-v .cmp-dot { width: 10px; height: 10px; }
.aw-rv-v .cmp-gflag { gap: 4px; } .aw-rv-v .cmp-gflag .flag { width: 16px !important; height: 11px !important; }
.aw-dash { color: #667595; font-weight: 500; }
.aw-review-notes { display: flex; align-items: center; gap: 12px; padding: 7px 16px; min-height: 44px; }
.aw-card.is-review .aw-actions { margin-top: 12px; }
.aw-review-notes .aw-review-title { margin-right: 6px; }
.aw-pay-ic { display: inline-flex; gap: 5px; }
.aw-pay-ic span { width: 22px; height: 20px; border-radius: 4px; display: inline-flex; align-items: center; justify-content: center; font-size: 7.5px; font-weight: 700; color: #fff; letter-spacing: .02em; }
.aw-pay-ic span.is-round { border-radius: 50%; width: 20px; font-size: 10px; }
@media (max-width: 1200px) { .aw-layout { grid-template-columns: minmax(0, 1fr); } .aw-rail { position: static; } .aw-steps { height: auto; flex-wrap: wrap; } .aw-step { flex: 1 1 45%; padding: 12px 16px; } .aw-tiles { flex-wrap: wrap; } .aw-card.is-fill { min-height: 0; } }
@media (max-width: 800px) { .aw-grid2, .aw-grid2.is-wide-left, .aw-grid3, .aw-review-grid { grid-template-columns: minmax(0, 1fr); } .aw-review-grid { padding-left: 0; } .aw-review-grid > div + div { border-left: 0; padding-left: 0; } .aw-step { flex: 1 1 100%; } .aw-actions { flex-direction: column-reverse; gap: 10px; align-items: stretch; } .aw-field.is-span2 { grid-row: auto; } }

/* =====================================================================
   Outreach / Partnership Pipeline v2  (design-reference-new/pipeline-list.png,
   pipeline-board.png, pipeline-add-opportunity.png)
   List view, kanban board, Add Opportunity modal, detail drawer, Board Settings.
   Shares the Companies tokens (--cmp-*) through body.page-companies.
   ===================================================================== */
.page-pipeline { --pl-ink: #16204F; --pl-navy: #0F1A44; --pl-muted: #64738F; --pl-faint: #6F7C97; --pl-line: #E6EDF7; --pl-line-soft: #EEF3FA; --pl-blue: #1668F5; --pl-blue-soft: #E8F0FE; --pl-chip: #EEF3FB; }
.page-pipeline .page-header { margin: 20px 0 19px; }
.page-pipeline.is-board .page-header { margin: 16px 0 22px; }
.page-pipeline .page-actions { gap: 12px; padding-top: 2px; align-items: center; }
.page-pipeline .page-content { padding-bottom: 20px; }
.pl-btn-white { background: #fff; color: var(--pl-ink); border-color: var(--pl-line); }
.pl-btn-white:hover { background: #F7FAFF; border-color: #D3DEF0; }
.pl-btn-white.is-danger { color: var(--cmp-red); }
.pl-page-menu .btn-icon { width: 40px; height: 40px; border: 1px solid var(--pl-line); border-radius: 10px; background: #fff; color: var(--pl-ink); display: inline-flex; align-items: center; justify-content: center; }
.pl-page-menu .btn-icon:hover { background: #F7FAFF; }
.pl-seg { display: inline-flex; align-items: center; gap: 2px; height: 40px; padding: 3px; background: #fff; border: 1px solid var(--pl-line); border-radius: 10px; }
.pl-seg-btn { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border-radius: 8px; font-size: 14px; font-weight: 600; color: var(--pl-ink); }
.pl-seg-btn:hover { background: #F3F7FD; }
.pl-seg-btn.is-active { background: var(--pl-blue); color: #fff; }
.pl-seg-btn .icon { stroke-width: 2; }

/* ---- stage tabs ---------------------------------------------------- */
.pl-tabrow { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.pl-tabrow::-webkit-scrollbar { display: none; }
.pl-tab { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 11px 0 12px; border-radius: 10px; background: #fff; border: 1px solid var(--pl-line); color: var(--pl-ink); font-size: 14.5px; font-weight: 600; white-space: nowrap; flex: none; transition: background var(--t-fast), border-color var(--t-fast); }
.pl-tab:hover { background: #F7FAFF; border-color: #D3DEF0; }
.pl-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 22px; padding: 0 6px; border-radius: 7px; background: var(--pl-blue-soft); color: var(--pl-blue); font-size: 12.5px; font-weight: 700; }
.pl-tab.is-active { background: var(--pl-blue); border-color: var(--pl-blue); color: #fff; }
.pl-tab.is-active .pl-tab-count { background: rgba(255,255,255,.22); color: #fff; }
.pl-tab-more { position: relative; padding: 0 0 0 12px; gap: 0; }
.pl-tab-more .dropdown { position: static; }
.pl-tab-more .btn-icon { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 10px; color: transparent; }
.pl-tab-more .btn-icon .icon { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--pl-ink); stroke-width: 2.2; }
.pl-tab-more .dropdown-menu { top: calc(100% + 6px); }
.pl-tab-more-label { padding-right: 32px; pointer-events: none; }

/* ---- filters --------------------------------------------------------- */
.pl-listcard { border-radius: 14px; }
.pl-filters { display: flex; align-items: center; gap: 10px; padding: 10px 12px 0; flex-wrap: nowrap; }
.is-board .pl-filters { padding: 0; margin-bottom: 14px; }
.pl-filters .cmp-search { flex: 0 1 304px; min-width: 160px; height: 40px; border-radius: 10px; background: #fff; border-color: var(--pl-line); }
.is-board .pl-filters .cmp-search { flex: 0 0 257px; height: 38px; }
.pl-filters { gap: 11px; }
.is-board .pl-filters { gap: 12px; }
.pl-filters .cmp-search .icon { color: #5D6E95; stroke-width: 2.1; }
.pl-filters .cmp-search input::placeholder { color: #677497; }
.pl-select { height: 40px; border-color: var(--pl-line); border-radius: 10px; flex: none; }
.is-board .pl-select { height: 38px; }
.pl-select .cmp-select-ghost, .pl-select > select { padding: 0 27px 0 11px; font-size: 14.5px; font-weight: 500; color: var(--pl-ink); }
.pl-select .cmp-select-caret { right: 9px; color: var(--pl-ink); stroke-width: 2.1; }
.pl-select-prefix { padding-left: 11px; font-size: 14.5px; font-weight: 500; color: var(--pl-ink); white-space: nowrap; }
.pl-sortsel .cmp-select-ghost { padding: 0 36px 0 5px; }
.pl-sortsel > select { left: 45px; width: calc(100% - 45px); padding-left: 5px; }
.pl-morebtn { display: inline-flex; align-items: center; gap: 9px; height: 40px; padding: 0 14px 0 13px; border: 1px solid var(--pl-line); border-radius: 10px; background: #fff; color: var(--pl-ink); font-size: 14.5px; font-weight: 600; white-space: nowrap; flex: none; }
.is-board .pl-morebtn { height: 38px; }
.pl-morebtn .icon { stroke-width: 2.1; }
.pl-morebtn:hover { background: #F7FAFF; }
.pl-morebtn.is-on { border-color: var(--pl-blue); color: var(--pl-blue); background: var(--pl-blue-soft); }
.pl-viewtoggle { display: inline-flex; align-items: center; height: 40px; padding: 2px; gap: 1px; background: #fff; border: 1px solid var(--pl-line); border-radius: 10px; flex: none; }
.is-board .pl-viewtoggle { height: 38px; }
.pl-viewbtn { width: 20px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; color: var(--pl-ink); }
.is-board .pl-viewbtn { height: 30px; }
.pl-viewbtn .icon { stroke-width: 2; }
.pl-viewbtn:hover { background: #F3F7FD; }
.pl-viewbtn.is-accent { background: var(--pl-blue-soft); color: var(--pl-blue); }
.pl-more-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px 0; flex-wrap: wrap; }
.is-board .pl-more-row { padding: 0; margin: -4px 0 14px; }
.pl-check-inline { display: inline-flex; align-items: center; gap: 9px; font-size: 14px; color: var(--pl-ink); cursor: pointer; }
.pl-check-inline input { position: absolute; opacity: 0; width: 0; height: 0; }
.pl-check-inline span:first-of-type { width: 18px; height: 18px; border: 1.5px solid #CBD8EC; border-radius: 5px; background: #fff; display: inline-block; position: relative; flex: none; }
.pl-check-inline input:checked + span { background: var(--pl-blue); border-color: var(--pl-blue); }
.pl-check-inline input:checked + span::after { content: ""; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.pl-check-inline input:focus-visible + span { box-shadow: var(--focus-ring); }
.pl-per-inline { gap: 8px; }

/* ---- active filter chips ------------------------------------------- */
.pl-chips { display: flex; align-items: center; gap: 10px; padding: 14px 12px 0 2px; flex-wrap: wrap; }
.is-board .pl-chips { padding: 0; margin: -2px 0 14px; }
.pl-chip { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 9px 0 11px; border-radius: 8px; background: var(--pl-chip); color: var(--pl-ink); font-size: 14px; font-weight: 500; white-space: nowrap; }
.pl-chip:hover { background: #E4ECF8; }
.pl-chip-key { color: #5D6E95; }
.pl-chip-val { font-weight: 500; }
.pl-chip-x { margin-left: 8px; stroke-width: 2.4; color: var(--pl-ink); }
.pl-clear { margin-left: 16px; font-size: 14px; font-weight: 600; color: var(--pl-blue); text-decoration: underline; text-underline-offset: 3px; }

/* ---- list table ------------------------------------------------------ */
.pl-table { min-width: 1180px; margin-top: 7px; }
.pl-table col.w-sel { width: 50px; } .pl-table col.w-co { width: 139px; } .pl-table col.w-ct { width: 197px; } .pl-table col.w-stage { width: 132px; } .pl-table col.w-geo { width: 158px; }
.pl-table col.w-deal { width: 138px; } .pl-table col.w-act { width: 142px; } .pl-table col.w-next { width: 170px; } .pl-table col.w-prio { width: 114px; } .pl-table col.w-menu { width: auto; }
.pl-table thead th { height: 44px; background: #F6FAFE; border-top: 1px solid var(--pl-line-soft); border-bottom: 1px solid var(--pl-line-soft); font-size: 14px; font-weight: 500; color: #46588A; }
.pl-th { display: inline-flex; align-items: center; gap: 8px; color: inherit; font-weight: 500; }
.pl-th-icon { color: #65749C; stroke-width: 2; }
.pl-table thead th.is-sorted, .pl-table thead th.is-sorted .pl-th-icon { color: var(--pl-blue); }
.pl-table thead th.c-menu .pl-th { color: #46588A; }
.pl-table .c-sel { padding-left: 16px; }
.pl-table thead th.c-sel { padding-left: 16px; }
.pl-table tbody td { height: 56px; border-bottom: 1px solid var(--pl-line-soft); font-size: 14px; color: var(--pl-ink); }
.pl-table tbody tr:last-child td { border-bottom: 1px solid var(--pl-line-soft); }
.pl-row:focus-visible { box-shadow: inset 0 0 0 2px rgba(22,104,245,.35); border-radius: 0; }
.pl-co { display: flex; align-items: center; gap: 11px; min-width: 0; padding-left: 3px; }
.pl-logo { border-radius: 50% !important; border: 1px solid rgba(15,23,42,.06); flex: none; }
.pl-co-name { font-size: 13.5px; font-weight: 600; color: var(--cmp-navy); letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-ct { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pl-ct-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.pl-ct-name { font-size: 14.5px; font-weight: 600; color: var(--pl-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-ct-role { font-size: 13px; color: #5D6E95; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-avatar { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; font-weight: 700; letter-spacing: .01em; flex: none; overflow: hidden; }
.pl-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pl-avatar.has-photo { background: transparent; }
.pl-avatar-36 { width: 36px; height: 36px; font-size: 14px; } .pl-avatar-32 { width: 32px; height: 32px; font-size: 12.5px; } .pl-avatar-40 { width: 40px; height: 40px; font-size: 15px; }
.pl-avatar.tone-blue { background: #E4EEFE; color: #1E5FE0; } .pl-avatar.tone-amber { background: #FDF1DC; color: #C97A0A; } .pl-avatar.tone-purple { background: #EEE8FE; color: #6D3AE8; } .pl-avatar.tone-green { background: #E1F7EA; color: #12904A; }
.pl-pill { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 7px; font-size: 13px; font-weight: 500; white-space: nowrap; line-height: 1; }
.pl-pill .pl-dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.pl-pill.tone-amber { background: #FEF1DC; color: #A85F05; } .pl-pill.tone-amber .pl-dot { background: #F59E0B; }
.pl-pill.tone-green { background: #E1F7EA; color: #12904A; } .pl-pill.tone-green .pl-dot { background: #22C55E; }
.pl-pill.tone-blue { background: #E6EFFE; color: #1D4ED8; } .pl-pill.tone-blue .pl-dot { background: #2563EB; }
.pl-pill.tone-grey { background: #EEF2F8; color: #4B5A75; } .pl-pill.tone-grey .pl-dot { background: #64748B; }
.pl-pill.tone-purple { background: #EFEAFE; color: #6D28D9; } .pl-pill.tone-purple .pl-dot { background: #7C3AED; }
.pl-pill.tone-red { background: #FDE8EA; color: #E11D48; } .pl-pill.tone-red .pl-dot { background: #EF4444; }
.pl-pill.tone-teal { background: #DDF5F0; color: #0F766E; } .pl-pill.tone-teal .pl-dot { background: #14B8A6; }
.pl-prio.tone-grey { background: #EEF2F8; color: #4B5A75; }
.pl-geos { display: inline-flex; align-items: center; gap: 8px; }
.pl-flag { width: 24px; height: 16px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); object-fit: cover; flex: none; }
.pl-flag-fallback { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 16px; border-radius: 3px; background: #E2E8F0; font-size: 9px; font-weight: 700; }
.pl-geo-more { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 20px; padding: 0 6px; border-radius: 6px; background: #E8F0FE; color: #1E5FE0; font-size: 12.5px; font-weight: 600; margin-left: 2px; }
.pl-deal-type { display: block; font-size: 14.5px; font-weight: 600; color: var(--pl-navy); line-height: 1.2; }
.pl-deal-offer { display: block; margin-top: 3px; font-size: 13px; color: #5D6E95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-activity { font-size: 14px; color: var(--pl-ink); }
.pl-next { display: inline-flex; align-items: center; gap: 12px; }
.pl-next.is-none { color: #677497; font-size: 15px; }
.pl-next-icon { color: var(--pl-navy); stroke-width: 1.9; flex: none; }
.pl-next-text { display: flex; flex-direction: column; line-height: 1.2; }
.pl-next-main { font-size: 14.5px; font-weight: 600; color: var(--pl-navy); }
.pl-next-time { font-size: 13px; color: #5D6E95; margin-top: 3px; }
.pl-next.is-past .pl-next-main { color: var(--pl-navy); }
.pl-table .c-menu { padding-right: 8px; }
.pl-menu .btn-icon { width: 36px; height: 36px; border: 1px solid var(--pl-line); border-radius: 10px; background: #fff; color: #5D6E95; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 1px 1px rgba(16,26,63,.03); transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast); }
.pl-menu .btn-icon:hover { background: #EFF5FF; border-color: #BCD4F7; color: var(--cmp-blue); box-shadow: 0 2px 6px rgba(22,104,245,.14); transform: translateY(-1px); }
.pl-menu .btn-icon:active { transform: translateY(0); box-shadow: none; }
.pl-menu .btn-icon:focus-visible { outline: 2px solid var(--cmp-blue); outline-offset: 2px; }
.pl-menu.is-open .btn-icon, .pl-menu .btn-icon[aria-expanded="true"] { background: var(--cmp-blue); border-color: var(--cmp-blue); color: #fff; box-shadow: 0 2px 8px rgba(22,104,245,.28); }
.pl-menu .btn-icon .icon { width: 18px; height: 18px; }
.pl-row:hover .pl-menu .btn-icon { border-color: #CBDCF5; }
.pl-foot { padding: 17px 18px 18px; border-top: 0; }
.pl-foot .cmp-foot-info { font-size: 14.5px; color: #5D6E95; }
.pl-pages .cmp-page { width: 36px; height: 36px; border-radius: 8px; font-size: 14.5px; }
.pl-pages .cmp-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
.pl-per { font-size: 14.5px; color: #5D6E95; gap: 10px; }
.pl-per-select { height: 36px; }
.pl-per-select .cmp-select-ghost, .pl-per-select > select { padding: 0 36px 0 14px; font-size: 14.5px; font-weight: 600; }
.pl-bulkbar { display: flex; align-items: center; gap: 12px; padding: 10px 14px; margin: 10px 12px 0; background: var(--pl-blue-soft); border: 1px solid #C5D9FA; border-radius: 10px; font-size: 14px; color: var(--pl-ink); }
.pl-bulkbar .cmp-btn { height: 34px; padding: 0 12px; font-size: 13.5px; }
.pl-bulk-clear { margin-left: auto; color: var(--pl-blue); font-weight: 600; font-size: 13.5px; }
.pl-empty-row td { height: auto; }
#pl-root.is-loading { opacity: .6; pointer-events: none; transition: opacity .15s; }

/* ---- board ------------------------------------------------------------- */
.pl-board { position: relative; }
.pl-board-track { display: flex; gap: 10px; align-items: flex-start; overflow-x: auto; overflow-y: hidden; padding-bottom: 6px; scrollbar-width: none; scroll-behavior: smooth; }
.pl-board-track::-webkit-scrollbar { display: none; }
.pl-board.is-dnd .pl-board-track { scroll-behavior: auto; }
.pl-col { flex: 0 0 214px; width: 214px; display: flex; flex-direction: column; background: #EEF3FA; border-radius: 12px; padding: 0 3px 3px; min-height: 200px; transition: background var(--t-fast), box-shadow var(--t-fast); }
.pl-col-head { padding: 11px 6px 7px 9px; }
.pl-col-title { display: flex; align-items: center; gap: 8px; }
.pl-col-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--stage-color, #94A3B8); flex: none; }
.pl-col-name { font-size: 14.5px; font-weight: 600; letter-spacing: -.01em; color: var(--pl-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1 1 auto; min-width: 0; }
.pl-col-count { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 24px; padding: 0 7px; border-radius: 8px; font-size: 13.5px; font-weight: 600; background: #E4ECFA; color: #1E5FE0; flex: none; transition: transform .2s; }
.pl-col-count.is-bump { transform: scale(1.15); }
.pl-col-count.tone-blue { background: #DDE9FE; color: #1E5FE0; } .pl-col-count.tone-green { background: #D9F4EC; color: #0B7255; } .pl-col-count.tone-amber { background: #E8EEFB; color: #2F5FD0; } .pl-col-count.tone-purple { background: #ECE7FD; color: #6D3AE8; } .pl-col-count.tone-grey { background: #E4ECFA; color: #1E5FE0; } .pl-col-count.tone-red { background: #FDE4E7; color: #E11D48; }
.pl-col[data-key="ready"] .pl-col-count { background: #E4ECFA; color: #1E5FE0; }
.pl-col[data-stage="7"] .pl-col-count, .pl-col[data-kind="won"] .pl-col-count { background: #DDF6E6; color: #15A34A; }
.pl-col-menu .btn-icon { width: 22px; height: 22px; color: #5D6E95; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; margin-left: 0; }
.pl-col-menu .btn-icon:hover { background: rgba(15,23,42,.06); }
.pl-col-menu .btn-icon .icon { width: 18px; height: 18px; }
.pl-col-sub { margin: 3px 0 0 22px; font-size: 13.5px; color: var(--pl-muted); line-height: 1.3; }
.pl-col-wip.is-over { color: var(--cmp-red); font-weight: 600; }
.pl-col-cards { display: flex; flex-direction: column; gap: 10px; padding: 0 0 0; min-height: 40px; max-height: var(--pl-col-max, none); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #C9D3E2 transparent; }
.pl-col-add { display: flex; align-items: center; justify-content: center; gap: 9px; height: 42px; margin-top: 10px; border-radius: 12px; background: #fff; border: 1px solid var(--pl-line); color: var(--pl-blue); font-size: 14.5px; font-weight: 600; flex: none; transition: background var(--t-fast); }
.pl-col-add:hover { background: #F5F9FF; }
.pl-col-add .icon { stroke-width: 2.4; }
.pl-card { position: relative; background: #fff; border: 1px solid var(--pl-line); border-radius: 12px; padding: 12px 11px 12px; box-shadow: 0 1px 2px rgba(15,23,42,.04); cursor: grab; transition: box-shadow .15s, transform .15s, opacity .15s; outline: none; }
.pl-card:hover { box-shadow: 0 4px 12px rgba(15,23,42,.08); border-color: #D9E3F2; }
.pl-card:focus-visible { box-shadow: 0 0 0 3px rgba(22,104,245,.35); }
.pl-card:active { cursor: grabbing; }
.pl-card-head { display: flex; align-items: flex-start; gap: 12px; margin-right: 4px; height: 42px; }
.pl-card-logo { border-radius: 50% !important; border: 1px solid rgba(15,23,42,.06); flex: none; }
.pl-card-title { display: flex; flex-direction: column; justify-content: center; gap: 0; min-width: 0; }
.pl-card-line { display: flex; align-items: center; gap: 8px; min-width: 0; }
.pl-card-line > .pl-card-name { min-width: 0; }
.pl-card-name { font-size: 14.5px; font-weight: 600; color: var(--pl-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.25; letter-spacing: -.02em; }
.pl-prio-sm { height: 20px; padding: 0 5px; font-size: 11px; gap: 3px; border-radius: 6px; flex: none; margin-left: 0; letter-spacing: 0; }
.pl-prio-sm .pl-dot { width: 5px; height: 5px; }
.pl-card-status { display: block; margin-top: 3px; margin-right: -4px; font-size: 13px; letter-spacing: -.02em; color: #5D6E95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.2; }
.pl-card-menu { position: absolute; top: 10px; right: 5px; margin: 0; }
.pl-card-menu .btn-icon { width: 18px; height: 22px; color: #5D6E95; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; }
.pl-card-menu .btn-icon:hover { background: #F1F5FA; }
.pl-card-menu .btn-icon .icon { width: 18px; height: 18px; }
.pl-card-contact { display: flex; align-items: center; gap: 12px; margin-top: 8px; height: 34px; }
.pl-card-contact .pl-ct-name { font-size: 14.5px; line-height: 1.15; }
.pl-card-contact .pl-ct-role { font-size: 13.5px; margin-top: 3px; line-height: 1.15; }
.pl-avatar-34 { width: 34px; height: 34px; font-size: 13.5px; }
.pl-card-geos { display: flex; align-items: center; gap: 8px; margin-top: 9px; flex-wrap: wrap; }
.pl-geo-chip { display: inline-flex; align-items: center; gap: 8px; height: 23px; padding: 0 8px 0 5px; border-radius: 6px; background: #F1F5FA; font-size: 13px; font-weight: 500; color: var(--pl-ink); }
.pl-geo-chip .pl-flag { width: 20px; height: 13px; border-radius: 2.5px; }
.pl-card-geos .pl-geo-more { height: 22px; min-width: 28px; font-size: 12.5px; }
.pl-card-deal { margin-top: 9px; font-size: 15px; font-weight: 700; color: var(--pl-navy); line-height: 15px; height: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-card-deal-sub { margin-top: 4px; font-size: 13.5px; color: var(--pl-muted); line-height: 14px; }
.pl-card-contact-line { margin-top: 11px; gap: 9px; font-size: 13.5px; color: var(--pl-muted); line-height: 15px; height: 15px; white-space: nowrap; }
.pl-card-contact-line .icon { flex: none; }
.pl-card-contact-line.is-none { color: var(--pl-muted); }
.pl-card-contact-line.is-none .icon { color: var(--pl-navy); stroke-width: 1.9; }
.pl-ch-email, .pl-ch-call, .pl-ch-meeting, .pl-ch-message { color: var(--pl-blue); stroke-width: 1.9; }
.pl-ch-telegram { color: #2B9BE8; stroke-width: 1.9; }
.pl-sep { font-style: normal; color: #64738F; margin: 0 -2px; }
.pl-card-next { margin-top: 9px; gap: 9px; font-size: 14.5px; font-weight: 600; color: var(--pl-navy); line-height: 15px; height: 15px; }
.pl-card-next .icon { stroke-width: 1.9; flex: none; }
.pl-card-next.is-none { color: #677497; font-weight: 500; }
.pl-card-next.is-none .icon { color: var(--pl-navy); }
.pl-card-next.is-today { margin-top: 8px; padding: 0 10px; height: 30px; border-radius: 8px; background: #FDF1DC; color: #B45309; }
.pl-card-next.is-today .icon { color: #B45309; }
.pl-card-next.is-past { color: var(--pl-navy); }
/* drag & drop states */
.pl-card.is-dragging { opacity: .35; cursor: grabbing; }
.pl-card.is-kb { box-shadow: 0 0 0 3px rgba(22,104,245,.4), 0 12px 28px rgba(15,23,42,.16); }
.pl-card.is-saving { opacity: .7; }
.pl-card.is-dropped { animation: pl-drop .6s ease; }
.pl-card.is-new { animation: pl-drop .9s ease; }
.pl-col.has-more .pl-col-cards { max-height: var(--pl-col-max, none); }
.pl-card.is-shake { animation: pl-shake .4s ease; }
@keyframes pl-drop { 0% { box-shadow: 0 0 0 3px rgba(22,104,245,.45); } 100% { box-shadow: 0 1px 2px rgba(15,23,42,.04); } }
@keyframes pl-shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
.pl-placeholder { border: 2px dashed #B8CCF2; border-radius: 12px; background: rgba(22,104,245,.05); transition: height .12s; flex: none; }
.pl-col.is-target { background: #E3ECFB; box-shadow: inset 0 0 0 2px rgba(22,104,245,.45); }
.pl-drag-ghost { position: fixed; top: -9999px; left: -9999px; z-index: 1000; pointer-events: none; transform: rotate(2.5deg) scale(1.02); box-shadow: 0 18px 40px rgba(15,23,42,.22) !important; border-color: #C9D8F1 !important; cursor: grabbing; }
.pl-drag-ghost.is-touch { top: 0; left: 0; }
.pl-board-scroll { position: relative; height: 8px; margin: 12px 4px 0; border-radius: 4px; background: #E3E9F2; }
.pl-board-scroll.is-hidden { visibility: hidden; }
.pl-board-thumb { position: absolute; top: 0; left: 0; height: 8px; border-radius: 4px; background: #C4CEDD; cursor: grab; }
.pl-board-thumb:hover { background: #AEBBCF; }

/* ---- stage picker (menus) ------------------------------------------------ */
.pl-stage-list { display: flex; flex-direction: column; gap: 4px; }
.pl-stage-opt { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 12px; border-radius: 8px; font-size: 14px; font-weight: 500; color: var(--color-text); text-align: left; }
.pl-stage-opt:hover:not(:disabled) { background: var(--color-surface-muted); }
.pl-stage-opt:disabled { opacity: .5; cursor: default; }
.pl-stage-opt em { margin-left: auto; font-style: normal; font-size: 12px; color: var(--color-text-muted); }
.pl-stage-opt .pl-dot { width: 10px; height: 10px; border-radius: 50%; }
.pl-dlg { display: flex; flex-direction: column; gap: 12px; text-align: left; }

/* ---- Add / Edit Opportunity modal -------------------------------------- */
.modal-backdrop:has(.pl-modal-shell) { background: rgba(15,23,42,.46); padding-left: var(--sidebar-w); }
.sidebar-collapsed .modal-backdrop:has(.pl-modal-shell) { padding-left: var(--sidebar-rail-w); }
.pl-modal-shell { width: 856px; max-width: min(856px, calc(100vw - 32px)); flex: none; animation: none; align-self: flex-start; margin-top: clamp(0px, calc(100vh - 892px), 113px); padding: 0; border-radius: 14px; max-height: calc(100vh - 40px); display: flex; flex-direction: column; overflow: hidden; background: #fff; }
.pl-modal { display: flex; flex-direction: column; min-height: 0; }
.pl-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 17px 20px 9px; }
.pl-modal-title { font-size: 22px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.02em; line-height: 1.2; }
.pl-modal-sub { margin-top: 5px; font-size: 14.5px; color: #5D6E95; }
.pl-modal-x { width: 32px; height: 32px; margin: -4px -6px 0 0; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; color: var(--pl-ink); }
.pl-modal-x:hover { background: #F1F5FA; }
.pl-modal-body { padding: 2px 20px 4px; overflow-y: auto; display: flex; flex-direction: column; gap: 16px; }
.pl-sec { border: 1px solid var(--pl-line); border-radius: 12px; padding: 13px 15px 17px; background: #fff; }
.pl-sec-head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.pl-sec-num { width: 24px; height: 24px; border-radius: 50%; background: var(--pl-blue); color: #fff; font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pl-sec-head h3 { font-size: 16.5px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.01em; }
.pl-sec-head p { font-size: 13px; color: #6A7590; margin-left: 2px; }
.pl-grid-2 { display: grid; grid-template-columns: 403fr 360fr; gap: 22px; align-items: start; }
.pl-grid-contact { grid-template-columns: 1fr 1fr; gap: 19px; }
.pl-grid-3 { display: grid; grid-template-columns: 250fr 322fr 174fr; gap: 19px; align-items: start; }
.pl-grid-follow { margin-top: 10px; }
.pl-sec:last-child { padding-bottom: 12px; }
.pl-grid-follow .pl-field-notes { grid-column: 2 / 4; }
.pl-grid-extra { margin-top: 14px; }
.pl-sec-row { display: grid; grid-template-columns: 216px 1fr; gap: 16px; align-items: start; }
.pl-sec-contact { min-width: 0; }
.pl-field-stack { display: flex; flex-direction: column; gap: 16px; }
.pl-field { position: relative; min-width: 0; }
.pl-label { display: block; margin-bottom: 6px; font-size: 14px; font-weight: 600; color: var(--pl-ink); line-height: 18px; }
.pl-label b { color: #E11D48; font-weight: 600; margin-left: 3px; }
.pl-input { display: block; width: 100%; height: 34px; padding: 0 12px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; font-size: 14px; color: var(--pl-ink); outline: none; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.pl-input::placeholder { color: #667595; }
.pl-input:focus { border-color: var(--pl-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.12); }
.pl-textarea { height: auto; min-height: 60px; padding: 9px 12px; resize: none; line-height: 1.45; }
.pl-help { margin-top: 8px; font-size: 13px; color: #6A7590; line-height: 16px; }
.pl-err { margin-top: 5px; font-size: 12.5px; color: #E11D48; min-height: 0; }
.pl-err:empty { display: none; }
.pl-field.is-invalid .pl-input, .pl-field.is-invalid .pl-combo-input { border-color: #E11D48; }
.pl-selectwrap { position: relative; display: block; }
.pl-selectwrap select.pl-input { appearance: none; -webkit-appearance: none; padding-right: 34px; cursor: pointer; }
.pl-selectwrap .pl-caret { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--pl-ink); stroke-width: 2; }
.pl-dotselect select.pl-input { padding-left: 38px; }
.pl-dotselect .pl-dot { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; border-radius: 50%; background: var(--dot, #94A3B8); pointer-events: none; }
.pl-datewrap .pl-date-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--pl-ink); stroke-width: 1.9; pointer-events: none; }
.pl-datewrap .pl-date { padding-left: 42px; padding-right: 34px; color: var(--pl-ink); cursor: pointer; }
/* empty + not focused: hide the native "mm/dd/yyyy --:--" segments behind the placeholder text; focus or a value shows them */
.pl-datewrap:not(.has-value):not(:focus-within) .pl-date { color: transparent; }
.pl-datewrap .pl-date::-webkit-calendar-picker-indicator { opacity: 0; width: 0; height: 0; margin: 0; padding: 0; }
.pl-date-ph { position: absolute; left: 42px; top: 50%; transform: translateY(-50%); font-size: 14px; color: #667595; pointer-events: none; }
.pl-datewrap.has-value .pl-date-ph, .pl-datewrap:focus-within .pl-date-ph { display: none; }
.pl-datewrap .pl-caret { pointer-events: auto; cursor: pointer; }
.pl-combo { position: relative; }
.pl-combo-input { position: relative; display: flex; align-items: center; height: 34px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; padding: 0 34px 0 12px; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.pl-combo.is-open .pl-combo-input, .pl-combo-input:focus-within { border-color: var(--pl-blue); box-shadow: 0 0 0 1px var(--pl-blue) inset; }
.pl-combo-icon { color: var(--pl-ink); stroke-width: 2; margin-right: 10px; flex: none; }
.pl-combo-input input { flex: 1 1 auto; min-width: 40px; border: 0; background: none; outline: none; font-size: 14px; color: var(--pl-ink); height: 100%; }
.pl-combo-input input::placeholder { color: #667595; }
.pl-combo-caret { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: var(--pl-ink); stroke-width: 2; cursor: pointer; }
.pl-dd { position: absolute; z-index: 5; left: -4px; top: calc(100% + 3px); width: 216px; background: #fff; border: 1px solid #E6EDF7; border-radius: 10px; box-shadow: 0 12px 32px rgba(15,23,42,.14); padding: 6px 4px 0; }
.pl-combo[data-pl-combo="contact"] .pl-dd, .pl-combo[data-pl-combo="geo"] .pl-dd { left: 0; width: 100%; }
.pl-dd-scroll { max-height: 296px; overflow-y: auto; scrollbar-width: thin; }
.pl-dd-item { display: flex; align-items: center; gap: 11px; width: 100%; height: 41.5px; padding: 0 8px; border-radius: 8px; text-align: left; }
.pl-dd-item:hover, .pl-dd-item.is-active { background: #F3F7FD; }
.pl-dd-logo { border-radius: 8px !important; flex: none; }
.pl-dd-text { display: flex; flex-directi border-radius: 50% !important; flex: none; }
.pl-dd-name { font-size: 14px; font-weight: 600; color: var(--pl-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-dd-sub { font-size: 13px; color: #5D6E95; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-dd-flag { display: inline-flex; width: 24px; justify-content: center; }
.pl-dd-flag .pl-flag { width: 20px; height: 13px; }
.pl-dd-empty { padding: 12px; font-size: 13px; color: #6A7590; }
.pl-dd-foot { display: flex; align-items: center; gap: 8px; width: calc(100% - 8px); margin: 4px 4px 0; height: 40px; padding: 0 8px; border-top: 1px solid var(--pl-line); color: var(--pl-blue); font-size: 14px; font-weight: 600; border-radius: 0; }
.pl-dd-foot:hover { background: #F3F7FD; }
.pl-dd-foot .icon { stroke-width: 2.4; }
.pl-multi-input { height: auto; min-height: 34px; padding: 3px 34px 3px 8px; flex-wrap: wrap; gap: 4px; }
.pl-multi-input input { min-height: 28px; padding-left: 4px; }
.pl-multi-tags { display: contents; }
.pl-tag { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 6px 0 8px; border-radius: 6px; background: #EEF3FB; font-size: 13px; font-weight: 500; color: var(--pl-ink); }
.pl-tag .pl-flag { width: 18px; height: 12px; }
.pl-tag button { display: inline-flex; color: #5D6E95; }
.pl-btn-soft { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; height: 32px; margin-top: 10px; border-radius: 8px; background: #E4EEFE; color: var(--pl-blue); font-size: 14.5px; font-weight: 600; }
.pl-btn-soft:hover { background: #D8E6FD; }
.pl-btn-soft .icon { stroke-width: 2.4; }
.pl-inline-form { margin-top: 12px; padding: 12px; border: 1px dashed #C5D9FA; border-radius: 10px; background: #F8FAFF; display: flex; flex-direction: column; gap: 10px; }
.pl-inline-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: end; }
.pl-inline-actions { display: flex; justify-content: flex-end; gap: 8px; }
.pl-inline-actions .cmp-btn { height: 34px; padding: 0 12px; font-size: 13.5px; }
.pl-extra-toggle { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; font-size: 12.5px; font-weight: 600; color: var(--pl-blue); white-space: nowrap; }
.pl-extra-toggle .icon { transition: transform .15s; }
.pl-extra-toggle.is-open .icon { transform: rotate(180deg); }
.pl-modal-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 20px 16px; }
.pl-another { font-size: 14.5px; }
.pl-modal-actions { display: flex; align-items: center; gap: 10px; }
.pl-btn-cancel { min-width: 84px; }
.pl-btn-create { min-width: 168px; }
.pl-modal-foot .cmp-btn { height: 40px; }

/* ---- Board Settings -------------------------------------------------------- */
.pl-bs-shell { width: 820px; }
.pl-bs-head, .pl-bs-row { display: grid; grid-template-columns: 24px 1.2fr 1.1fr 60px 84px 64px 64px 44px; gap: 10px; align-items: center; }
.pl-bs-head { font-size: 12.5px; font-weight: 600; color: #6A7590; text-transform: uppercase; letter-spacing: .04em; padding: 0 6px 8px; }
.pl-bs-rows { display: flex; flex-direction: column; gap: 6px; }
.pl-bs-row { padding: 6px; border: 1px solid var(--pl-line); border-radius: 10px; background: #fff; }
.pl-bs-row.is-dragging { opacity: .5; }
.pl-bs-row.is-focus { border-color: var(--pl-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.12); }
.pl-bs-grip { display: inline-flex; color: #667597; cursor: grab; }
.pl-bs-color { position: relative; display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; border: 1px solid var(--pl-line); border-radius: 8px; cursor: pointer; }
.pl-bs-color input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.pl-bs-color .pl-dot { width: 16px; height: 16px; border-radius: 50%; pointer-events: none; }
.pl-bs-kind { font-size: 12px; color: #6A7590; }
.pl-bs-row .pl-err { grid-column: 1 / -1; }

/* ---- detail drawer ---------------------------------------------------------- */
.pl-drawer { width: 600px; max-width: 100vw; }
.pl-drawer .drawer-head { display: none; }
.pl-drawer .drawer-body { padding: 0; }
.pl-panel { display: flex; flex-direction: column; min-height: 100%; }
.pl-panel-head { display: flex; align-items: flex-start; gap: 14px; padding: 20px 20px 14px; border-bottom: 1px solid var(--pl-line); }
.pl-panel-title { flex: 1 1 auto; min-width: 0; }
.pl-panel-title h2 { font-size: 20px; font-weight: 700; color: var(--pl-navy); display: flex; align-items: center; gap: 8px; letter-spacing: -.01em; }
.pl-panel-title p { font-size: 14px; color: #5D6E95; margin-top: 2px; }
.pl-panel-pills { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.pl-panel-actions { display: flex; align-items: center; gap: 6px; flex: none; }
.pl-panel-stage { height: 34px; }
.pl-panel-stage .cmp-select-ghost, .pl-panel-stage > select { font-size: 13.5px; padding: 0 30px 0 11px; }
.pl-panel-btn { width: 34px; height: 34px; border: 1px solid var(--pl-line); border-radius: 8px; color: var(--pl-ink); display: inline-flex; align-items: center; justify-content: center; }
.pl-panel-btn:hover { background: #F7FAFF; }
.pl-star.is-on { color: #F59E0B; fill: #F59E0B; }
.pl-panel-tabs { display: flex; gap: 4px; padding: 10px 20px 0; border-bottom: 1px solid var(--pl-line); }
.pl-ptab { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 12px; font-size: 14px; font-weight: 600; color: #5D6E95; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.pl-ptab span { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 6px; background: #EEF3FB; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
.pl-ptab.is-active { color: var(--pl-blue); border-bottom-color: var(--pl-blue); }
.pl-ptab-body { padding: 18px 20px 24px; }
.pl-kv { display: flex; flex-direction: column; }
.pl-kv-row { display: grid; grid-template-columns: 130px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--pl-line-soft); font-size: 14px; }
.pl-kv-row > span { color: #6A7590; }
.pl-kv-row > b { font-weight: 600; color: var(--pl-navy); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pl-kv-row em { font-style: normal; font-weight: 400; color: #6A7590; }
.pl-kv-links a { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; }
.pl-panel-quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.pl-panel-quick .cmp-btn { height: 36px; padding: 0 12px; font-size: 13.5px; }
.pl-quickform { display: flex; gap: 8px; align-items: flex-start; margin-bottom: 16px; flex-wrap: wrap; }
.pl-quickform .pl-input { flex: 1 1 160px; }
.pl-quickform .pl-selectwrap { flex: 0 0 140px; }
.pl-quickform .cmp-btn { height: 36px; padding: 0 14px; font-size: 13.5px; flex: none; }
.pl-quickform-note { flex-direction: column; align-items: stretch; }
.pl-quickform-note .cmp-btn { align-self: flex-end; }
.pl-quickform-fu .pl-input[type=datetime-local] { flex: 0 0 200px; }
.pl-timeline { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; position: relative; }
.pl-tl-item { display: flex; gap: 12px; }
.pl-tl-icon { width: 32px; height: 32px; border-radius: 50%; background: #EEF3FB; color: var(--pl-ink); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pl-tl-item.is-stage_move .pl-tl-icon { background: #EFEAFE; color: #6D28D9; }
.pl-tl-item.is-contact .pl-tl-icon { background: #E4EEFE; color: var(--pl-blue); }
.pl-tl-item.is-follow_up .pl-tl-icon { background: #FDF1DC; color: #B45309; }
.pl-tl-item.is-deal .pl-tl-icon { background: #E1F7EA; color: #12904A; }
.pl-tl-title { font-size: 14px; font-weight: 600; color: var(--pl-navy); }
.pl-tl-title em { font-style: normal; font-weight: 500; color: #6A7590; }
.pl-tl-text { font-size: 13.5px; color: #3B4C86; margin-top: 2px; }
.pl-tl-meta { font-size: 12.5px; color: #677497; margin-top: 3px; }
.pl-tl-empty { font-size: 13.5px; color: #677497; }
.pl-fu-list, .pl-note-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pl-fu { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--pl-line); border-radius: 10px; }
.pl-fu.is-done { opacity: .6; }
.pl-fu.tone-today { background: #FFF8EC; border-color: #FBE3B8; }
.pl-fu.tone-past:not(.is-done) { border-color: #F5C2CB; }
.pl-fu-check { width: 22px; height: 22px; border: 1.5px solid #CBD8EC; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; color: transparent; flex: none; margin-top: 1px; }
.pl-fu-check.is-done { background: var(--pl-blue); border-color: var(--pl-blue); color: #fff; }
.pl-fu-body { flex: 1 1 auto; min-width: 0; }
.pl-fu-when { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--pl-navy); flex-wrap: wrap; }
.pl-fu-when em { font-style: normal; color: #6A7590; }
.pl-fu-note { font-size: 13.5px; color: #3B4C86; margin-top: 3px; }
.pl-fu-del { color: #677497; }
.pl-note { padding: 12px 14px; border: 1px solid var(--pl-line); border-radius: 10px; background: #fff; }
.pl-note.is-pinned { background: #FFFBEB; border-color: #FBE3B8; }
.pl-note-body { font-size: 14px; color: var(--pl-navy); line-height: 1.5; }
.pl-note-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; font-size: 12.5px; color: #677497; }
.pl-note-actions { display: inline-flex; gap: 6px; }
.pl-note-actions button { color: #677497; display: inline-flex; padding: 2px; }
.pl-note-actions button:hover { color: var(--pl-ink); }

/* ---- responsive ------------------------------------------------------------- */
@media (max-width: 1100px) {
  .pl-filters { flex-wrap: wrap; }
  .pl-filters .cmp-search { flex-basis: 100%; }
  .pl-grid-2, .pl-grid-3, .pl-sec-row { grid-template-columns: 1fr; }
  .pl-sec-spacer { display: none; }
  .pl-grid-follow .pl-field-notes { grid-column: auto; }
  .pl-dd { width: 100%; left: 0; }
}
@media (max-width: 760px) {
  .pl-drawer { width: 100vw; }
  .page-pipeline .page-actions { flex-wrap: wrap; justify-content: flex-start; }
  .pl-col { flex-basis: 84vw; width: 84vw; max-height: none; }
  .pl-board-track { scroll-snap-type: x mandatory; }
  .pl-col { scroll-snap-align: start; }
  .pl-modal-foot { flex-direction: column; align-items: stretch; }
  .pl-modal-actions { justify-content: flex-end; }
  .pl-bs-head { display: none; }
  .pl-bs-row { grid-template-columns: 24px 1fr 1fr; }
  .pl-kv-row { grid-template-columns: 1fr; gap: 2px; }
}
.pl-col.has-more { position: relative; }
.pl-col.has-more .pl-col-cards { scrollbar-width: none; }
.pl-col.has-more .pl-col-cards::-webkit-scrollbar { display: none; }
.pl-col.has-more .pl-col-cards:hover { scrollbar-width: thin; }

/* =====================================================================
   Deals & Agreements  (design-reference-new/deal-*.png)
   List + grid, the agreement page and the New Agreement form. Shares the
   .cmp-* component system; dl-* adds what is specific to an agreement.
   ===================================================================== */
.page-deals {
  --cmp-navy: #0B1541; --cmp-ink: #16204F; --cmp-label: #46588A; --cmp-muted: #677495; --cmp-faint: #667595;
  --cmp-line: #E6EDF7; --cmp-line-soft: #F0F5FD; --cmp-head-bg: #F7FAFE; --cmp-field: #F8FAFD;
  --cmp-blue: #1668F5; --cmp-blue-soft: #E8F1FE;
  --cmp-green: #0F8446; --cmp-green-soft: #DEFCEF;
  --cmp-amber: #A85F05; --cmp-amber-soft: #FEF6DD;
  --cmp-red: #D92D3E; --cmp-red-soft: #FEEAEA;
  --cmp-purple: #6D28D9; --cmp-purple-soft: #F2E9FE;
  --cmp-slate: #64748B; --cmp-slate-soft: #F2F6FC;
  --cmp-orange: #B44E06; --cmp-orange-soft: #FDF6DF;
  --cmp-radius: 14px;
}
.page-deals .page-content { padding-top: 14px; padding-bottom: var(--sp-6); }
.page-deals .page-header { margin-top: 2px; margin-bottom: 4px; align-items: flex-start; }
.page-deals .page-title { font-size: 31px; font-weight: 700; line-height: 1.2; letter-spacing: 0; color: var(--cmp-navy); }
.page-deals .page-subtitle { font-size: 16.5px; color: #56679A; margin-top: 4px; }
.page-deals .page-actions { gap: 10px; padding-top: 4px; }
.page-deals .cmp-btn .icon { width: 18px; height: 18px; }
.page-deals .cmp-search .icon { width: 18px; height: 18px; }
.page-deals .cmp-select-caret { width: 16px; height: 16px; right: 9px; }
.page-deals .cmp-page .icon { width: 17px; height: 17px; }
.page-deals .cmp-th-icon { width: 13px; height: 13px; }
.page-deals .cmp-select { height: 32px; }
.page-deals .cmp-select select { padding: 0 29px 0 11px; font-size: 13.5px; }
.page-deals .cmp-select-ghost { padding: 0 29px 0 11px; font-size: 13.5px; }
.page-deals .cmp-sort .cmp-select-ghost { padding: 0 40px 0 4px; }
.page-deals .cmp-search input { font-size: 12.7px; }
.page-deals .dl-headmenu .btn-icon { width: 42px; height: 42px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #fff; color: #37477A; display: inline-flex; align-items: center; justify-content: center; }
.page-deals .dl-headmenu .btn-icon:hover { background: var(--cmp-field); border-color: #D3DEF0; }
.page-deals .dl-headmenu .btn-icon .icon { width: 17px; height: 17px; }
.page-deals .page-actions .cmp-btn { height: 42px; border-radius: 10px; }

/* ---- summary line + status tabs -------------------------------------- */
.page-deals .dl-summary { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; font-size: 14px; color: #657593; }
.page-deals .dl-summary i { font-style: normal; color: #5F759D; }
.page-deals .dl-tabs { display: flex; align-items: center; gap: 4px; border-bottom: 1px solid var(--cmp-line); margin-bottom: 4px; overflow-x: auto; }
.page-deals .dl-tab { display: inline-flex; align-items: center; gap: 9px; height: 42px; padding: 0 14px; margin-bottom: -1px; border-bottom: 2px solid transparent; font-size: 14.5px; font-weight: 500; color: #46588A; white-space: nowrap; transition: color var(--t-fast), border-color var(--t-fast); }
.page-deals .dl-tab:hover { color: var(--cmp-navy); }
.page-deals .dl-tab.is-active { color: var(--cmp-blue); border-bottom-color: var(--cmp-blue); font-weight: 600; }
.page-deals .dl-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 23px; height: 20px; padding: 0 6px; border-radius: 6px; background: #EEF3FB; color: #3B4C86; font-size: 12px; font-weight: 700; }
.page-deals .dl-tab.is-active .dl-tab-count { background: #DCE9FE; color: #1450C8; }

/* ---- filter row + chips ---------------------------------------------- */
.page-deals .cmp-card { background: #fff; border: 1px solid var(--cmp-line); border-radius: var(--cmp-radius); overflow: hidden; }
.page-deals .cmp-filters { display: flex; align-items: center; gap: 8px; padding: 7px 10px; flex-wrap: wrap; }
.page-deals .dl-search { flex: 1 1 336px; max-width: 336px; min-width: 190px; height: 32px; }
.page-deals .cmp-filters .cmp-select, .page-deals .dl-morebtn { flex: none; }
.page-deals .dl-morebtn { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 13px; border: 1px solid #E2ECFB; border-radius: 10px; background: #fff; color: var(--cmp-ink); font-size: 13.5px; font-weight: 600; white-space: nowrap; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast); }
.page-deals .dl-morebtn:hover { background: var(--cmp-field); border-color: #CFDDF3; }
.page-deals .dl-morebtn.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: #F2F7FF; }
.page-deals .dl-morebtn .icon { width: 17px; height: 17px; color: #3B4C86; stroke-width: 2; }
.page-deals .dl-morebtn.is-on .icon { color: var(--cmp-blue); }
.page-deals .cmp-filters-gap { flex: 1 1 auto; }
.page-deals .dl-viewtoggle { flex: none; display: inline-flex; padding: 2px; gap: 2px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #fff; }
.page-deals .dl-viewbtn { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 28px; border-radius: 8px; color: #46588A; transition: background var(--t-fast), color var(--t-fast); }
.page-deals .dl-viewbtn:hover { background: var(--cmp-field); }
.page-deals .dl-viewbtn.is-active { background: #E1EEFD; color: var(--cmp-blue); }
.page-deals .dl-viewbtn .icon { width: 17px; height: 17px; }
.page-deals .dl-more-row { display: flex; align-items: center; gap: 8px; padding: 0 10px 10px; flex-wrap: wrap; }
.page-deals .dl-chips { display: flex; align-items: center; gap: 9px; padding: 9px 10px 7px; flex-wrap: wrap; }
.page-deals .dl-chips-label { font-size: 14px; color: #46588A; margin-right: 2px; }
.page-deals .dl-chip { display: inline-flex; align-items: center; gap: 9px; height: 30px; padding: 0 11px; border-radius: 8px; background: #E2ECFE; color: #1D4ED8; font-size: 13.5px; font-weight: 500; transition: background var(--t-fast); }
.page-deals .dl-chip:hover { background: #D3E2FD; }
.page-deals .dl-chip .icon { width: 14px; height: 14px; stroke-width: 2.4; color: #4C79D8; }
.page-deals .dl-chip-clear { font-size: 13.5px; font-weight: 500; color: var(--cmp-blue); padding: 0 2px; }
.page-deals .dl-chip-clear:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---- table ------------------------------------------------------------ */
.page-deals .dl-table { min-width: 1180px; }
.page-deals .dl-table col.w-sel { width: 44px; }
.page-deals .dl-table col.w-partner { width: 190px; }
.page-deals .dl-table col.w-terms { width: 224px; }
.page-deals .dl-table col.w-geo { width: 92px; }
.page-deals .dl-table col.w-acct { width: 132px; }
.page-deals .dl-table col.w-period { width: 254px; }
.page-deals .dl-table col.w-status { width: 118px; }
.page-deals .dl-table col.w-upd { width: 152px; }
.page-deals .dl-table col.w-act { width: 72px; }
.page-deals .dl-table thead th { height: 38px; background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); border-bottom: 1px solid var(--cmp-line-soft); font-size: 12.2px; font-weight: 400; color: #46619E; text-align: left; vertical-align: middle; }
.page-deals .dl-table .cmp-th.is-plain { cursor: default; }
.page-deals .dl-table .c-sel { padding-left: 16px; }
.page-deals .dl-table tbody td { height: 47px; padding: 0; border-bottom: 1px solid var(--cmp-line-soft); vertical-align: middle; font-size: 14px; color: var(--cmp-ink); }
.page-deals .dl-table tbody tr:last-child td { border-bottom: 0; }
.page-deals .dl-table tbody tr.dl-row { cursor: pointer; transition: background var(--t-fast); }
.page-deals .dl-table tbody tr.dl-row:hover { background: #F7FBFF; }
.page-deals .dl-table .c-act { text-align: right; padding-right: 14px; }
.page-deals .dl-menu .btn-icon { width: 30px; height: 30px; border: 1px solid #E3EBF7; border-radius: 9px; background: #fff; color: #37477A; display: inline-flex; align-items: center; justify-content: center; }
.page-deals .dl-menu .btn-icon:hover { background: var(--cmp-field); border-color: #D3DEF0; }
.page-deals .dl-menu .btn-icon .icon { width: 17px; height: 17px; }

.page-deals .dl-partner { display: flex; align-items: center; gap: 12px; min-width: 0; }
.page-deals .dl-logo { border-radius: 50% !important; border: 1px solid rgba(15,23,42,.05); flex: none; }
.page-deals .dl-partner-text { display: flex; flex-direction: column; min-width: 0; gap: 0; }
.page-deals .dl-partner-name { font-size: 14px; font-weight: 700; line-height: 1.3; color: var(--cmp-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-deals .dl-partner-cat { font-size: 11.9px; color: #5D6E95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.page-deals .dl-terms { display: flex; align-items: center; gap: 12px; min-width: 0; }
.page-deals .dl-rate { font-size: 13.5px; font-weight: 600; color: var(--cmp-navy); white-space: nowrap; }
.page-deals .dl-model { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 7px; font-size: 12.2px; font-weight: 600; white-space: nowrap; }
.page-deals .dl-model.tone-blue { background: #E8F1FE; color: #1D4ED8; }
.page-deals .dl-model.tone-amber { background: #FEF6DD; color: #AE4815; }
.page-deals .dl-model.tone-red { background: #FEEAEA; color: #D0161D; }
.page-deals .dl-model.tone-purple { background: #F2E9FE; color: #5B21B6; }
.page-deals .dl-model.tone-teal { background: #DFF5F3; color: #0F766E; }
.page-deals .dl-model.tone-grey { background: #ECF0F6; color: #566076; }

.page-deals .dl-geos { display: flex; align-items: center; gap: 7px; }
.page-deals .dl-flag { display: inline-flex; }
.page-deals .dl-flag .flag-cell { display: inline-flex; }
.page-deals .dl-flag .flag { width: 22px !important; height: 15px !important; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.07); }
.page-deals .dl-geo-more { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 22px; padding: 0 7px; border-radius: 7px; background: #F2F5FE; color: var(--cmp-blue); font-size: 11.5px; font-weight: 600; }
.page-deals .dl-acct { font-size: 13.5px; color: var(--cmp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.page-deals .dl-period { display: inline-flex; align-items: center; gap: 11px; white-space: nowrap; }
.page-deals .dl-period-from, .page-deals .dl-period-to { font-size: 13.5px; color: #46588A; }
.page-deals .dl-period-arrow { width: 15px; height: 15px; color: #667595; stroke-width: 2; flex: none; }
.page-deals .dl-period-to.is-open { color: #637597; }

.page-deals .dl-status { display: inline-flex; align-items: center; gap: 8px; height: 26px; padding: 0 11px 0 9px; border-radius: 8px; font-size: 12.8px; font-weight: 600; white-space: nowrap; }
.page-deals .dl-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.page-deals .dl-status.tone-green { background: #DEFCEF; color: #02743A; }
.page-deals .dl-status.tone-grey { background: #F2F6FC; color: #56627E; }
.page-deals .dl-status.tone-amber { background: #FDF6DF; color: #9A5205; }
.page-deals .dl-status.tone-orange { background: #FDF0DD; color: #C2600A; }
.page-deals .dl-status.tone-red { background: #FEE8E8; color: #D80214; }

.page-deals .dl-upd-main { display: block; font-size: 13.5px; color: var(--cmp-navy); white-space: nowrap; }
.page-deals .dl-upd-sub { display: block; margin-top: 1px; font-size: 12px; color: #62759A; white-space: nowrap; }

/* ---- reset control (both views): subtle danger — red text, light red tint on hover ---- */
.page-deals .dl-reset { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 11px; border: 1px solid transparent; border-radius: 9px; background: none; color: var(--dl-reset, #C81E3A); font-size: 13px; font-weight: 600; white-space: nowrap; text-decoration: none; transition: background var(--t-fast), border-color var(--t-fast); }
.page-deals .dl-reset .icon { stroke-width: 2.2; flex: none; }
.page-deals .dl-reset:hover { background: #FDECEF; border-color: #F9CDD5; }
.page-deals .dl-reset:focus-visible { outline: 2px solid #C81E3A; outline-offset: 2px; }

/* ---- Grid view (design-reference-new/deals-grid-view.png) ----------------------------------- */
.page-deals { --dlg-line: #E3EAF4; --dlg-div: #EDF2F9; --dlg-label: #5D6E95; --dlg-ink: #0B1541; --dlg-field: #FFFFFF; --dlg-chip: #E7EFFD; --dlg-chip-ink: #1A56DB; }
.page-deals .dlg-tabs { display: flex; align-items: center; gap: 12px; margin: 2px 0 12px; padding-bottom: 3px; border-bottom: 1px solid var(--dlg-div); overflow-x: auto; scrollbar-width: none; }
.page-deals .dlg-tabs::-webkit-scrollbar { display: none; }
.page-deals .dlg-tab { position: relative; height: 32px; margin: 0; padding: 0 13px; gap: 8px; border: 0; border-radius: 9px; font-size: 12.5px; font-weight: 600; color: var(--dlg-ink); }
.page-deals .dlg-tab:hover { background: #F2F6FC; color: var(--dlg-ink); }
.page-deals .dlg-tab.is-active { background: #E7EFFC; color: #1A56DB; }
.page-deals .dlg-tab.is-active::after { content: ""; position: absolute; left: 4px; right: 4px; bottom: -4px; height: 2px; border-radius: 2px; background: #1A6BF2; }
.page-deals .dlg-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 19px; padding: 0 6px; border-radius: 6px; background: #E8EDF5; color: #34457C; font-size: 11.5px; font-weight: 700; }
.page-deals .dlg-tab.is-active .dlg-tab-count { background: #D5E3FB; color: #1A56DB; }

.page-deals .dlg-bar { display: flex; align-items: center; gap: 9px; flex-wrap: nowrap; margin-bottom: 9px; }
.page-deals .dlg-bar > * { flex-shrink: 0; }
.page-deals .dlg-bar > .dlg-search { flex-shrink: 1; }
.page-deals .dlg-search { display: flex; align-items: center; gap: 9px; flex: 0 1 288px; min-width: 170px; height: 32px; padding: 0 11px; border: 1px solid var(--dlg-line); border-radius: 9px; background: var(--dlg-field); color: #677495; }
.page-deals .dlg-search input { flex: 1 1 auto; min-width: 0; border: 0; background: none; outline: none; font: inherit; font-size: 12.5px; color: var(--dlg-ink); }
.page-deals .dlg-search input::placeholder { color: #6A7897; }
.page-deals .dlg-search:focus-within { border-color: #9DBDF3; box-shadow: 0 0 0 3px rgba(26,107,242,.12); }
.page-deals .dlg-sel { height: 32px; border: 1px solid var(--dlg-line); border-radius: 9px; background: var(--dlg-field); }
.page-deals .dlg-sel .cmp-select-ghost, .page-deals .dlg-sel > select { padding: 0 30px 0 12px; font-size: 12px; font-weight: 600; color: var(--dlg-ink); }
.page-deals .dlg-sel .cmp-select-caret { right: 11px; width: 15px; height: 15px; color: #34457C; }
.page-deals .dlg-sel.is-set { border-color: #A9C4F3; background: #F4F8FF; }
.page-deals .dlg-more { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 13px; border: 1px solid var(--dlg-line); border-radius: 9px; background: var(--dlg-field); color: var(--dlg-ink); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.page-deals .dlg-more:hover, .page-deals .dlg-more.is-on { border-color: #A9C4F3; background: #F4F8FF; }
.page-deals .dlg-reset { height: 32px; padding: 0 8px; font-size: 12px; }
.page-deals .dlg-gap { flex: 1 1 auto; }
.page-deals .dlg-toggle { display: inline-flex; align-items: center; gap: 4px; height: 32px; padding: 1px; border: 1px solid var(--dlg-line); border-radius: 9px; background: var(--dlg-field); }
.page-deals .dlg-viewbtn { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 28px; border-radius: 7px; color: #34457C; }
.page-deals .dlg-viewbtn:hover { background: #F2F6FC; }
.page-deals .dlg-viewbtn.is-active { background: #1A6BF2; color: #fff; }
.page-deals .dlg-sort { height: 32px; border: 1px solid var(--dlg-line); border-radius: 9px; background: var(--dlg-field); }
.page-deals .dlg-sort .cmp-sort-label { padding-left: 12px; font-size: 12px; font-weight: 500; color: var(--dlg-ink); }
.page-deals .dlg-sort .cmp-select-ghost { padding: 0 32px 0 5px; font-size: 12px; font-weight: 600; color: var(--dlg-ink); }
.page-deals .dlg-sort > select { left: 38px; width: calc(100% - 38px); padding: 0 32px 0 5px; font-size: 12px; font-weight: 600; color: var(--dlg-ink); }
.page-deals .dlg-more-row { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 9px; }
.page-deals .dlg-more-row[hidden] { display: none; }

.page-deals .dlg-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin: 0 0 12px; }
.page-deals .dlg-chip { display: inline-flex; align-items: center; gap: 8px; height: 22px; padding: 0 8px 0 11px; border: 0; border-radius: 6px; background: var(--dlg-chip); color: var(--dlg-chip-ink); font-size: 11.5px; font-weight: 600; text-decoration: none; }
.page-deals .dlg-chip .icon { width: 12px; height: 12px; stroke-width: 2.6; color: currentColor; }
.page-deals .dlg-chip:hover { background: #D8E5FC; }
.page-deals .dlg-clear { font-size: 11.5px; font-weight: 700; color: var(--dlg-chip-ink); text-decoration: none; margin-left: 1px; }
.page-deals .dlg-clear:hover { text-decoration: underline; }

.page-deals .dlg-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px 12px; }
.page-deals .dlg-card { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 7px 13px 9px; border: 1px solid var(--dlg-line); border-radius: 11px; background: #fff; cursor: pointer; transition: border-color .14s, box-shadow .14s; }
.page-deals .dlg-card:hover { border-color: #A3C1F4; box-shadow: 0 4px 16px rgba(26,86,219,.10); }
.page-deals .dlg-card:focus-within { border-color: #A3C1F4; }

.page-deals .dlg-head { display: flex; align-items: flex-start; gap: 13px; min-width: 0; }
.page-deals .dlg-logo { flex: none; display: inline-flex; border-radius: 50%; }
.page-deals .dlg-logo-tile { border-radius: 50% !important; box-shadow: 0 0 0 1px rgba(15,23,42,.06); }
.page-deals .dlg-id { flex: 1 1 auto; min-width: 0; padding-top: 8px; }
.page-deals .dlg-name-row { display: flex; align-items: center; gap: 9px; min-width: 0; }
.page-deals .dlg-name { font-size: 14px; font-weight: 700; color: var(--dlg-ink); letter-spacing: -.005em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none; }
.page-deals .dlg-name:hover { color: #1A56DB; }
.page-deals .dlg-verified-wrap { display: inline-flex; flex: none; color: #16A34A; }
.page-deals .dlg-cat { margin-top: 2px; font-size: 11.5px; color: var(--dlg-label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-deals .dlg-head-r { flex: none; display: flex; align-items: center; gap: 12px; padding-top: 5px; }
.page-deals .dlg-card .dl-status { height: 24px; gap: 7px; padding: 0 10px 0 9px; border-radius: 7px; font-size: 11.8px; }
.page-deals .dlg-card .dl-dot { width: 7px; height: 7px; }
/* the reference's ⋯ has heavy dots; the sprite's are r=1, so the glyph is scaled rather than restroked */
.page-deals .dlg-card .dl-menu .btn-icon .icon { transform: scale(1.35); }
.page-deals .dlg-card .dl-menu .btn-icon { width: 28px; height: 28px; border: 1px solid var(--dlg-line); border-radius: 8px; background: #fff; color: var(--dlg-ink); transition: background var(--t-fast), border-color var(--t-fast); }
.page-deals .dlg-card .dl-menu .btn-icon:hover, .page-deals .dlg-card .dl-menu.is-open .btn-icon { background: #EFF5FF; border-color: #BCD4F7; color: #1A56DB; }

.page-deals .dlg-body { display: grid; grid-template-columns: minmax(0, 52%) minmax(0, 1fr); margin-top: 6px; }
.page-deals .dlg-col { display: flex; flex-direction: column; gap: 7px; min-width: 0; padding-right: 12px; }
.page-deals .dlg-col-r { padding: 0 0 0 13px; border-left: 1px solid var(--dlg-div); }
.page-deals .dlg-blk { min-width: 0; }
.page-deals .dlg-lbl { display: block; font-size: 11.2px; color: var(--dlg-label); line-height: 1.3; }
.page-deals .dlg-terms { display: flex; align-items: center; gap: 10px; min-width: 0; margin-top: 2px; }
.page-deals .dlg-terms b { font-size: 12.8px; font-weight: 700; color: var(--dlg-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.page-deals .dlg-card .dl-model { flex: none; height: 19px; padding: 0 8px; border-radius: 5px; font-size: 11px; }
.page-deals .dlg-geos { display: flex; align-items: center; gap: 19px; min-height: 19px; margin-top: 3px; }
.page-deals .dlg-flag { display: inline-flex; flex: none; }
.page-deals .dlg-flag .flag { width: 22px !important; height: 15px !important; border-radius: 2.5px; box-shadow: 0 0 0 1px rgba(15,23,42,.07); object-fit: cover; }
.page-deals .dlg-geo-more { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 19px; padding: 0 5px; border-radius: 5px; background: #E7EFFD; color: #1A56DB; font-size: 11px; font-weight: 700; margin-left: -1px; }
.page-deals .dlg-none { font-size: 11.5px; color: var(--dlg-label); }
.page-deals .dlg-aid { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; margin-top: 2px; }
.page-deals .dlg-aid b { font-size: 12.8px; font-weight: 700; color: var(--dlg-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.page-deals .dlg-copy { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin: -3px -4px -3px 0; padding: 0; border: 0; border-radius: 6px; background: none; color: #46588A; cursor: pointer; }
.page-deals .dlg-copy:hover { background: #EFF5FF; color: #1A56DB; }
.page-deals .dlg-copy:focus-visible { outline: 2px solid #1A6BF2; outline-offset: 1px; }
.page-deals .dlg-rev { display: flex; align-items: center; gap: 13px; margin-top: 2px; min-width: 0; }
.page-deals .dlg-rev b { font-size: 14.2px; font-weight: 700; color: var(--dlg-ink); letter-spacing: -.01em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.page-deals .dlg-trend { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.page-deals .dlg-trend.is-up { color: #15803D; }
.page-deals .dlg-trend.is-down { color: #DC2626; }

.page-deals .dlg-period { display: grid; grid-template-columns: minmax(max-content, 46%) max-content; align-items: center; column-gap: 14px; margin-top: 8px; padding: 5px 0 4px; border-top: 1px solid var(--dlg-div); }
.page-deals .dlg-dates { display: inline-flex; align-items: center; gap: 7px; font-size: 11.2px; color: #34457C; white-space: nowrap; }
.page-deals .dlg-cal { width: 14px; height: 14px; color: #34457C; stroke-width: 1.9; flex: none; margin-right: 1px; }
.page-deals .dlg-arrow { width: 12px; height: 12px; color: #34457C; stroke-width: 2.2; flex: none; }
.page-deals .dlg-dates .is-open { color: #34457C; }
.page-deals .dlg-days { justify-self: start; display: inline-flex; align-items: center; height: 19px; padding: 0 8px; border-radius: 5px; font-size: 10.8px; font-weight: 600; white-space: nowrap; }
.page-deals .dlg-days.tone-green { background: #DCF7E6; color: #11703A; }
.page-deals .dlg-days.tone-grey { background: #EDF1F7; color: #4B5873; }
.page-deals .dlg-days.tone-red { background: #FDE3E7; color: #C81E3A; }
.page-deals .dlg-days.tone-amber { background: #FDF0DA; color: #9A5205; }

.page-deals .dlg-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 6px; border-top: 1px solid var(--dlg-div); min-width: 0; }
.page-deals .dlg-mgr { display: flex; align-items: center; gap: 10px; min-width: 0; }
.page-deals .dlg-av { flex: none; }
.page-deals .dlg-mgr-t { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.page-deals .dlg-mgr-t b { font-size: 11.8px; font-weight: 700; color: var(--dlg-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-deals .dlg-mgr-t span { font-size: 10.5px; color: var(--dlg-label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-deals .dlg-mgr.is-none .dlg-mgr-t b { color: var(--dlg-label); font-weight: 600; }
.page-deals .dlg-view { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 27px; padding: 0 11px 0 12px; border: 1px solid #D5E2F6; border-radius: 8px; background: #fff; color: #1A56DB; font-size: 11.8px; font-weight: 700; text-decoration: none; white-space: nowrap; transition: background var(--t-fast), border-color var(--t-fast); }
.page-deals .dlg-view .icon { width: 14px; height: 14px; stroke-width: 2.3; }
.page-deals .dlg-view:hover { background: #EFF5FF; border-color: #A9C4F3; }
.page-deals .dlg-empty { grid-column: 1 / -1; padding: 30px 0; }
.page-deals .dlg-foot-bar { padding-top: 20px; }

/* 3 → 2 → 1: a card needs ~380px before the Deal Model line starts to clip */
@media (max-width: 1365px) { .page-deals .dlg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 899px) { .page-deals .dlg-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 1439px) { .page-deals .dlg-bar { flex-wrap: wrap; } .page-deals .dlg-bar > .dlg-search { flex: 1 1 260px; } .page-deals .dlg-gap { display: none; } .page-deals .dlg-toggle { margin-left: auto; } }
@media (max-width: 760px) {
  .page-deals .dlg-grid { grid-template-columns: minmax(0, 1fr); }
  .page-deals .dlg-search { flex: 1 1 100%; }
  .page-deals .dlg-gap { display: none; }
}
@media (max-width: 420px) {
  .page-deals .dlg-body { grid-template-columns: minmax(0, 1fr); row-gap: 9px; }
  .page-deals .dlg-col-r { padding: 9px 0 0; border-left: 0; border-top: 1px solid var(--dlg-div); }
  .page-deals .dlg-period { grid-template-columns: minmax(0, 1fr) max-content; }
  .page-deals .dlg-head-r { gap: 8px; }
}
@media (hover: none) {
  .page-deals .dlg-card .dl-menu .btn-icon, .page-deals .dlg-copy { min-width: 36px; min-height: 36px; }
  .page-deals .dlg-copy { margin: -9px -8px -9px 0; }
}
.page-deals .dl-foot { padding: 32px 14px 0 1px; border-top: 0; background: none; }
.page-deals .dl-foot .cmp-foot-info, .page-deals .dl-foot .cmp-per { font-size: 14.2px; }
.page-deals .dl-foot .cmp-select-sm { height: 36px; border-radius: 9px; }
.page-deals .dl-foot .cmp-select-sm .cmp-select-ghost, .page-deals .dl-foot .cmp-select-sm > select { padding: 0 44px 0 17px; font-size: 15px; font-weight: 600; color: var(--cmp-navy); }

/* ---- agreement page (design-reference-new/deal-detail.png) -------------- */
.page-deal-detail .page-content { padding-top: 2px; }
.page-deals .dv-topline { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 6px; }
.page-deals .dv-crumb { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: #5D6E95; }
.page-deals .dv-crumb-back { display: inline-flex; align-items: center; gap: 8px; color: #46588A; font-weight: 500; }
.page-deals .dv-crumb-back:hover { color: var(--cmp-blue); }
.page-deals .dv-crumb-back .icon { width: 17px; height: 17px; stroke-width: 2; }
.page-deals .dv-crumb-sep { width: 15px; height: 15px; color: #6175A0; stroke-width: 2; }
.page-deals .dv-crumb span[aria-current] { color: var(--cmp-navy); font-weight: 600; }
.page-deals .dv-actions { flex: none; display: flex; align-items: center; gap: 11px; }
.page-deals .dv-actions .cmp-btn { height: 40px; border-radius: 10px; }
.page-deals .dv-menu .btn-icon { width: 42px; height: 40px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #fff; color: #37477A; display: inline-flex; align-items: center; justify-content: center; }
.page-deals .dv-menu .btn-icon:hover { background: var(--cmp-field); border-color: #D3DEF0; }
.page-deals .dv-menu .btn-icon .icon { width: 17px; height: 17px; }

.page-deals .dv-head { display: flex; align-items: flex-start; gap: 22px; margin-bottom: 10px; }
.page-deals .dv-logo { flex: none; border-radius: 50% !important; border: 1px solid rgba(15,23,42,.06); }
.page-deals .dv-head-text h1 { margin: 0; font-size: 27px; font-weight: 700; letter-spacing: -.02em; line-height: 1.05; color: var(--cmp-navy); }
.page-deals .dv-headline { display: flex; align-items: center; gap: 11px; margin: 5px 0 0; font-size: 18px; font-weight: 600; color: var(--cmp-navy); }
.page-deals .dv-headline-flag .flag { width: 22px !important; height: 15px !important; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.07); }
.page-deals .dv-headline-pill { margin-left: 2px; }
.page-deals .dv-account { display: flex; align-items: center; gap: 7px; margin: 5px 0 0; font-size: 14px; color: #677495; }
.page-deals .dv-account a { color: var(--cmp-blue); font-weight: 500; }
.page-deals .dv-copy { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border: 0; border-radius: 6px; background: none; color: #60759D; cursor: pointer; transition: background var(--t-fast), color var(--t-fast); }
.page-deals .dv-copy:hover { background: #EDF3FC; color: var(--cmp-blue); }
.page-deals .dv-copy .icon { width: 15px; height: 15px; }
.page-deals .dv-chips { display: flex; align-items: center; gap: 9px; margin-top: 6px; flex-wrap: wrap; }
.page-deals .dv-chip { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 11px; border: 1px solid var(--cmp-line); border-radius: 8px; background: #fff; font-size: 13px; color: var(--cmp-ink); }
.page-deals .dv-chip .icon { width: 15px; height: 15px; color: #677495; }
a.dv-chip:hover { border-color: #C9DAF4; color: var(--cmp-blue); }

/* ---- stat strip ---- */
.page-deals .dv-strip { display: flex; background: #fff; border: 1px solid var(--cmp-line); border-radius: var(--cmp-radius); margin-bottom: 16px; }
.page-deals .dv-stat { flex: 1 1 auto; display: flex; align-items: center; gap: 15px; padding: 17px 20px; min-width: 0; border-left: 1px solid var(--cmp-line-soft); }
.page-deals .dv-stat:first-child { border-left: 0; }
.page-deals .dv-stat-icon { flex: none; width: 44px; height: 44px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; }
.page-deals .dv-stat-icon .icon { width: 22px; height: 22px; stroke-width: 1.9; }
.page-deals .dv-stat-icon.tone-green { background: #DEFCEF; color: #12904A; }
.page-deals .dv-stat-icon.tone-purple { background: #EFE9FE; color: #7C3AED; }
.page-deals .dv-stat-icon.tone-blue { background: #E4EEFE; color: var(--cmp-blue); }
.page-deals .dv-statdot { width: 13px; height: 13px; border-radius: 50%; background: #16A34A; display: inline-block; }
.page-deals .dv-statdot.tone-grey { background: #94A3B8; } .page-deals .dv-statdot.tone-amber { background: #F59E0B; }
.page-deals .dv-statdot.tone-red { background: #EF4444; } .page-deals .dv-statdot.tone-orange { background: #F97316; }
.page-deals .dv-stat-body { display: flex; flex-direction: column; min-width: 0; }
.page-deals .dv-stat-label { font-size: 11.5px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; color: #62759A; line-height: 1.5; white-space: nowrap; }
.page-deals .dv-stat-value { font-size: 17px; font-weight: 700; line-height: 1.35; color: var(--cmp-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-deals .dv-stat-sub { font-size: 13px; line-height: 1.35; color: #677495; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ---- tabs + columns ---- */
.page-deals .dv-tabs { display: flex; align-items: center; gap: 6px; border-bottom: 1px solid var(--cmp-line); margin-bottom: 16px; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.page-deals .dv-tabs::-webkit-scrollbar { display: none; }
.page-deals .dv-tab { flex: none; }
.page-deals .dv-tab { display: inline-flex; align-items: center; gap: 9px; height: 44px; padding: 0 15px; margin-bottom: -1px; border-bottom: 2px solid transparent; font-size: 14.5px; font-weight: 500; color: #46588A; white-space: nowrap; transition: color var(--t-fast), border-color var(--t-fast); }
.page-deals .dv-tab .icon { width: 17px; height: 17px; color: #65749C; stroke-width: 1.9; }
.page-deals .dv-tab:hover { color: var(--cmp-navy); }
.page-deals .dv-tab.is-active { color: var(--cmp-blue); border-bottom-color: var(--cmp-blue); font-weight: 600; }
.page-deals .dv-tab.is-active .icon { color: var(--cmp-blue); }
.page-deals .dv-cols { display: grid; grid-template-columns: minmax(0, 1fr) 466px; gap: 16px; align-items: start; }
.page-deals .dv-main, .page-deals .dv-rail { display: flex; flex-direction: column; gap: 13px; min-width: 0; }
.page-deals .dv-pane { display: flex; flex-direction: column; gap: 16px; }
.page-deals .dv-card { padding: 20px 22px 22px; }
.page-deals .dv-card-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 16px; }
.page-deals .dv-card-head.is-tight { align-items: center; margin-bottom: 14px; }
.page-deals .dv-card-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 11px; background: #E8F0FE; color: var(--cmp-blue); }
.page-deals .dv-card-icon .icon { width: 22px; height: 22px; stroke-width: 1.9; }
.page-deals .dv-card-icon.is-plain { width: auto; height: auto; border-radius: 0; background: none; }
.page-deals .dv-card-icon.is-plain .icon { width: 24px; height: 24px; }
.page-deals .dv-card-icon.tone-amber { background: #FDF1DC; color: #C2740A; }
.page-deals .dv-card-title { flex: 1 1 auto; min-width: 0; }
.page-deals .dv-card-title h2 { margin: 0; font-size: 19px; font-weight: 800; letter-spacing: -.02em; color: var(--cmp-navy); line-height: 1.25; }
.page-deals .dv-card-title p { margin: 3px 0 0; font-size: 13.5px; color: #677495; }
.page-deals .dv-rail-card { padding: 17px 20px 17px; }
.page-deals .dv-rail-card .dv-card-head.is-tight { margin-bottom: 11px; }
.page-deals .dv-rail-card .dv-btn-ghost { height: 32px; padding: 0 12px; gap: 7px; color: var(--cmp-blue); font-size: 13.5px; border-color: #DCE7F9; }
.page-deals .dv-btn-ghost { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #fff; color: var(--cmp-ink); font-size: 14px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast); }
.page-deals .dv-btn-ghost:hover { background: var(--cmp-field); border-color: #CFDDF3; color: var(--cmp-blue); }
.page-deals .dv-btn-ghost .icon { width: 16px; height: 16px; color: var(--cmp-blue); stroke-width: 2; }

/* ---- commercial terms grid ---- */
.page-deals .dv-kvgrid { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr); gap: 0 34px; }
.page-deals .dv-kvgrid::before { content: ""; grid-column: 2; grid-row: 1; width: 1px; background: var(--cmp-line-soft); }
.page-deals .dv-kvcol { min-width: 0; }
.page-deals .dv-kvcol:last-of-type { grid-column: 3; }
.page-deals .dv-kv { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 14px; align-items: center; min-height: 30px; padding: 6px 0; border-bottom: 1px solid var(--cmp-line-soft); }
.page-deals .dv-kv.is-last { border-bottom: 0; }
.page-deals .dv-kv-label { font-size: 14px; color: #677495; }
.page-deals .dv-kv-value { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--cmp-navy); min-width: 0; flex-wrap: wrap; }
.page-deals .dv-kv-value a { color: var(--cmp-blue); font-weight: 600; }
.page-deals .dv-kv-value a:hover { text-decoration: underline; text-underline-offset: 2px; }
.page-deals .dv-geoscope { display: inline-flex; align-items: center; gap: 8px; }
.page-deals .dv-geoscope .flag { width: 22px !important; height: 15px !important; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.07); }
.page-deals .dv-geo-name { color: var(--cmp-navy) !important; }
.page-deals .dv-geo-ext { width: 14px; height: 14px; color: #62759A; stroke-width: 2; }
.page-deals .dv-geo-more { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 23px; padding: 0 8px; border-radius: 7px; background: #F2F5FE; color: var(--cmp-blue); font-size: 12px; font-weight: 700; }
.page-deals .dv-terms-box { display: flex; align-items: flex-start; gap: 13px; margin-top: 18px; padding: 15px 17px; border-radius: 12px; background: #F1F5FD; }
.page-deals .dv-terms-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: #E1EBFD; color: var(--cmp-blue); }
.page-deals .dv-terms-icon .icon { width: 18px; height: 18px; }
.page-deals .dv-terms-box strong { display: block; font-size: 14.5px; font-weight: 700; color: var(--cmp-navy); }
.page-deals .dv-terms-box p { margin: 3px 0 0; font-size: 14px; line-height: 1.55; color: #46588A; }

/* ---- GEO coverage tiles ---- */
.page-deals .dv-geotiles { display: flex; flex-wrap: wrap; gap: 12px; }
.page-deals .dv-geotile { display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 15px; border: 1px solid var(--cmp-line); border-radius: 11px; background: #fff; font-size: 14.5px; font-weight: 600; color: var(--cmp-navy); }
.page-deals .dv-geotile .flag { width: 22px !important; height: 15px !important; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.07); }
.page-deals .dv-geotile em { font-style: normal; display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; background: #DEFCEF; color: #0B7A3E; font-size: 12px; font-weight: 600; }
.page-deals .dv-geotile.is-add { border-color: #DCE8FB; background: #EFF5FE; color: var(--cmp-blue); cursor: pointer; }
.page-deals .dv-geotile.is-add:hover { background: #E2ECFE; border-color: #B9D2F8; }
.page-deals .dv-geotile .icon { width: 16px; height: 16px; }

/* ---- version history / activity / notes ---- */
.page-deals .dv-versions { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.page-deals .dv-version { display: flex; gap: 14px; padding: 14px 16px; border: 1px solid var(--cmp-line-soft); border-radius: 12px; background: #FCFDFF; }
.page-deals .dv-version.is-current { border-color: #C4DAFC; background: #F6FAFF; }
.page-deals .dv-version.is-empty { display: block; border: 0; background: none; padding: 0; }
.page-deals .dv-version-tag { flex: none; display: inline-flex; flex-direction: column; align-items: center; gap: 3px; min-width: 52px; font-size: 14px; font-weight: 700; color: var(--cmp-navy); }
.page-deals .dv-version-tag em { font-style: normal; font-size: 11px; font-weight: 600; color: var(--cmp-blue); }
.page-deals .dv-version-body { min-width: 0; flex: 1 1 auto; }
.page-deals .dv-version-top { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.page-deals .dv-version-top strong { font-size: 15px; color: var(--cmp-navy); }
.page-deals .dv-version-when { font-size: 13px; color: #46588A; }
.page-deals .dv-version-by { font-size: 12.5px; color: #62759A; margin-left: auto; }
.page-deals .dv-version-reason { margin: 5px 0 0; font-size: 13.5px; color: #5D6E95; }
.page-deals .dv-diff { display: flex; flex-direction: column; gap: 5px; margin-top: 9px; }
.page-deals .dv-diff-row { display: inline-flex; align-items: center; gap: 9px; font-size: 13px; }
.page-deals .dv-diff-label { min-width: 132px; color: #677495; }
.page-deals .dv-diff-old { color: #B04A5A; text-decoration: line-through; }
.page-deals .dv-diff-new { color: #12904A; font-weight: 600; }
.page-deals .dv-diff-row .icon { width: 14px; height: 14px; color: #667595; }

.page-deals .dv-feed { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.page-deals .dv-feed-item { display: flex; align-items: flex-start; gap: 13px; padding: 13px 0; border-bottom: 1px solid var(--cmp-line-soft); }
.page-deals .dv-feed.is-compact { gap: 7px; }
.page-deals .dv-feed.is-compact .dv-feed-item { border-bottom: 0; }
.page-deals .dv-feed.is-compact .dv-feed-icon { border-radius: 50%; }
.page-deals .dv-feed.is-compact .dv-feed-item { padding: 0; gap: 12px; }
.page-deals .dv-feed.is-compact .dv-feed-icon { width: 34px; height: 34px; }
.page-deals .dv-feed-item:last-child { border-bottom: 0; }
.page-deals .dv-feed-item.is-empty { display: block; }
.page-deals .dv-feed-icon { flex: none; width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; }
.page-deals .dv-feed-icon .icon { width: 18px; height: 18px; }
.page-deals .dv-feed-icon.tone-green { background: #DEFCEF; color: #12904A; }
.page-deals .dv-feed-icon.tone-blue { background: #E4EEFE; color: var(--cmp-blue); }
.page-deals .dv-feed-icon.tone-purple { background: #EFE9FE; color: #7C3AED; }
.page-deals .dv-feed-icon.tone-amber { background: #FDF0DA; color: #C2740A; }
.page-deals .dv-feed-body { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; gap: 2px; }
.page-deals .dv-feed-body strong { font-size: 14.5px; font-weight: 700; color: var(--cmp-navy); }
.page-deals .dv-feed-body span { font-size: 13px; color: #677495; }
.page-deals .dv-feed-time { flex: none; font-size: 13px; color: #62759A; white-space: nowrap; }

.page-deals .dv-notes { display: flex; flex-direction: column; gap: 12px; }
.page-deals .dv-note { padding: 14px 16px; border: 1px solid var(--cmp-line-soft); border-radius: 12px; background: #FCFDFF; }
.page-deals .dv-note.is-empty { color: #677495; }
.page-deals .dv-note.is-empty p { margin: 0; font-size: 14px; }
.page-deals .dv-note-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.page-deals .dv-note-meta { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: #677495; }
.page-deals .dv-note-meta i { font-style: normal; color: #5F759D; }
.page-deals .dv-note-menu .btn-icon { width: 28px; height: 28px; border: 0; background: none; color: #62759A; }
.page-deals .dv-contact-menu .btn-icon { width: 34px; height: 34px; border: 1px solid var(--cmp-line); border-radius: 9px; background: #fff; color: #62759A; }
.page-deals .dv-note-menu .btn-icon:hover, .page-deals .dv-contact-menu .btn-icon:hover { background: #EDF3FC; color: var(--cmp-blue); }
.page-deals .dv-note-menu .btn-icon .icon, .page-deals .dv-contact-menu .btn-icon .icon { width: 17px; height: 17px; }
.page-deals .dv-note-body { margin: 0; font-size: 14px; line-height: 1.6; color: var(--cmp-ink); }

/* ---- right rail ---- */
.page-deals .dv-contacts { display: flex; flex-direction: column; gap: 10px; }
.page-deals .dv-contact { display: flex; align-items: center; gap: 13px; }
.page-deals .dv-contact-ava { flex: none; border-radius: 50%; }
.page-deals .avatar-44 { width: 44px; height: 44px; font-size: 15px; }
.page-deals .dv-contact-text { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.page-deals .dv-contact-name { font-size: 15px; font-weight: 700; color: var(--cmp-navy); }
.page-deals .dv-contact-name:hover { color: var(--cmp-blue); }
.page-deals .dv-contact-role { font-size: 13px; color: #677495; }
.page-deals .dv-contact-actions { flex: none; display: inline-flex; align-items: center; gap: 7px; }
.page-deals .dv-contact-btn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; transition: background var(--t-fast); }
.page-deals .dv-contact-btn.is-tg { background: #1D9BF0; color: #fff; border-radius: 50%; }
.page-deals .dv-contact-btn.is-tg svg, .page-deals .dv-contact-btn.is-tg svg * { fill: #fff !important; color: #fff; }
.page-deals .dv-contact-btn.is-tg svg circle, .page-deals .dv-contact-btn.is-tg svg rect { fill: none !important; }
.page-deals .dv-contact-btn.is-mail { background: #E8F1FE; color: var(--cmp-blue); }
.page-deals .dv-contact-btn:hover { filter: brightness(.97); }
.page-deals .dv-contact-btn .icon { width: 17px; height: 17px; }
.page-deals .dv-quick { display: flex; flex-wrap: nowrap; gap: 9px; padding: 4px 0 6px; }
.page-deals .dv-quick-btn { display: inline-flex; flex: 0 1 auto; min-width: 0; white-space: nowrap; align-items: center; justify-content: center; gap: 8px; height: 42px; padding: 0 11px; font-size: 13.2px; border: 1px solid var(--cmp-line); border-radius: 11px; background: #fff; color: var(--cmp-navy); font-size: 14.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast); }
.page-deals .dv-quick-btn:hover { background: var(--cmp-field); border-color: #C9DAF4; }
.page-deals .dv-quick-btn .icon { width: 17px; height: 17px; color: var(--cmp-blue); }
.page-deals .dv-reminders { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.page-deals .dv-reminder { display: inline-flex; align-items: center; gap: 9px; padding: 8px 11px; border-radius: 9px; background: #F6F9FE; font-size: 13px; color: var(--cmp-ink); }
.page-deals .dv-reminder em { font-style: normal; margin-left: auto; color: #677495; }
.page-deals .dv-reminder.is-done { opacity: .55; text-decoration: line-through; }
.page-deals .dv-reminder .icon { width: 15px; height: 15px; color: #C2740A; }

/* ---- tab tables + linked data ---- */
.page-deals .dv-table { min-width: 620px; }
.page-deals .dv-table thead th { height: 40px; padding: 0 12px; background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); font-size: 12.2px; font-weight: 400; color: #46619E; text-align: left; }
.page-deals .dv-table tbody td { height: 52px; padding: 0 12px; font-size: 14px; border-bottom: 1px solid var(--cmp-line-soft); }
.page-deals .dv-doc-name { display: flex; align-items: center; gap: 10px; height: 52px; font-weight: 600; color: var(--cmp-navy); }
.page-deals .dv-doc-name .icon { width: 17px; height: 17px; color: var(--cmp-blue); }
.page-deals .cmp-btn-soft .icon { width: 15px; height: 15px; }
.page-deals .dv-linked-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 24px; }
.page-deals .dv-linked-wide { grid-column: 1 / -1; }
.page-deals .dv-sub { margin: 0 0 9px; font-size: 13px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: #62759A; }
.page-deals .dv-linked-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--cmp-line-soft); border-radius: 10px; margin-bottom: 8px; font-size: 14px; color: var(--cmp-navy); }
.page-deals .dv-linked-row:hover { border-color: #C9DAF4; background: #FAFCFF; }
.page-deals .dv-linked-row .icon { width: 17px; height: 17px; color: var(--cmp-blue); flex: none; }
.page-deals .dv-linked-row span { font-weight: 600; }
.page-deals .dv-linked-row em { font-style: normal; margin-left: auto; font-size: 13px; color: #677495; }
.page-deals .dv-empty-line { margin: 0; font-size: 13.5px; color: #62759A; }

/* ---- New Agreement form (design-reference-new/deal-new-agreement.png) ---- */
.page-deal-form .page-content { padding-top: 0; padding-bottom: 96px; }
.page-deals .df-topline { margin-bottom: 2px; }
.page-deals .df-cancel-top { height: 40px; border-radius: 10px; padding: 0 22px; }
.page-deals .df-titleblock { margin-bottom: 8px; }
.page-deals .df-titleblock h1 { margin: 3px 0 0; font-size: 29px; font-weight: 700; line-height: 1.0; letter-spacing: 0; color: var(--cmp-navy); }
.page-deals .df-titleblock p { margin: 6px 0 0; font-size: 17px; color: #56679A; }
.page-deals .df-cols { display: grid; grid-template-columns: minmax(0, 1fr) 382px; gap: 22px; align-items: start; }
.page-deals .df-col { display: flex; flex-direction: column; gap: 15px; min-width: 0; }
.page-deals .df-rail { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.page-deals .df-rail .df-card { padding: 13px 13px 15px; }
.page-deals .df-card { padding: 13px 16px 15px; }
.page-deals .df-head { display: flex; align-items: flex-start; gap: 21px; margin-bottom: 13px; }
.page-deals .df-num { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--cmp-blue); color: #fff; font-size: 14.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.page-deals .df-head h2 { margin: 0; font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--cmp-navy); line-height: 1.3; }
.page-deals .df-head p { margin: 2px 0 0; font-size: 14px; color: #677495; }
.page-deals .df-grid-3 { display: grid; gap: 22px; }
.page-deals .df-grid-3.df-partnergrid { grid-template-columns: 282fr 261fr 252fr; }
.page-deals .df-grid-3.df-period { grid-template-columns: 254fr 237fr 303fr; }
.page-deals .df-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 36px; }
.page-deals .df-card .form-group { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.page-deals .df-label { font-size: 13.5px; font-weight: 600; color: var(--cmp-ink); }
.page-deals .df-req { color: #E11D48; margin-left: 2px; }

.page-deals .df-input { width: 100%; height: 40px; padding: 0 14px; border: 1px solid #E2E9F5; border-radius: 10px; background: #fff; font: inherit; font-size: 14.5px; color: var(--cmp-navy); transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.page-deals .df-input::placeholder { color: #627599; }
.page-deals .df-input:hover { border-color: #CFDDF3; }
.page-deals .df-input:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.14); }
.page-deals .df-input:disabled { background: #F6F8FC; color: #627599; cursor: not-allowed; }
.page-deals .df-input.is-invalid { border-color: #E11D48; box-shadow: 0 0 0 3px rgba(225,29,72,.12); }
.page-deals .df-textarea { width: 100%; height: 57px; min-height: 57px; padding: 5px 11px; border: 1px solid #E2E9F5; border-radius: 10px; background: #fff; font: inherit; font-size: 12.0px; line-height: 1.55; color: var(--cmp-navy); resize: none; }
.page-deals .df-textarea::placeholder { color: #627599; }
.page-deals .df-textarea:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.14); }
.page-deals .df-counter { align-self: flex-end; margin-top: -22px; margin-right: 13px; font-size: 12.5px; color: #627599; position: relative; }
.page-deals .df-input-group { position: relative; display: flex; align-items: center; }
.page-deals .df-prefix, .page-deals .df-suffix { position: absolute; display: inline-flex; align-items: center; justify-content: center; height: 38px; width: 40px; font-size: 14.5px; font-weight: 500; color: #46588A; pointer-events: none; }
.page-deals .df-prefix { left: 1px; border-right: 1px solid #E9EEF7; }
.page-deals .df-suffix { right: 1px; border-left: 1px solid #E9EEF7; }
.page-deals .df-input-group.has-prefix .df-input { padding-left: 54px; }
.page-deals .df-input-group.has-suffix .df-input { padding-right: 54px; }
.page-deals .df-input-icon { position: absolute; left: 13px; color: var(--cmp-blue); pointer-events: none; width: 17px; height: 17px; }
.page-deals .df-input-group.has-icon .df-input { padding-left: 40px; }
.page-deals .df-input-group.is-disabled .df-input-icon { color: #5D759F; }
.page-deals .df-input-group.is-date { position: relative; }
.page-deals .df-input.df-date { color: transparent; }
.page-deals .df-input.df-date::-webkit-calendar-picker-indicator { opacity: 0; }
.page-deals .df-input.df-date::-webkit-datetime-edit { opacity: 0; }
.page-deals .df-datelabel { position: absolute; left: 40px; top: 0; height: 40px; display: inline-flex; align-items: center; font-size: 14.5px; color: var(--cmp-navy); pointer-events: none; }
.page-deals .df-input-group:not(.is-date) .df-datelabel, .page-deals .df-datelabel:empty { display: none; }

.page-deals .df-select { position: relative; display: flex; align-items: center; width: 100%; min-height: 40px; border: 1px solid #E2E9F5; border-radius: 10px; background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.page-deals .df-select:hover { border-color: #CFDDF3; }
.page-deals .df-select:focus-within { border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.14); }
.page-deals .df-selectbox { appearance: none; -webkit-appearance: none; width: 100%; min-height: 38px; border: 0; background: none; outline: none; padding: 0 40px 0 14px; font: inherit; font-size: 14.5px; color: var(--cmp-navy); cursor: pointer; }
.page-deals .df-select-caret { position: absolute; right: 13px; color: #46588A; pointer-events: none; width: 18px; height: 18px; stroke-width: 2; }
.page-deals .df-select.is-rich { min-height: 58px; flex-wrap: wrap; align-items: center; padding-left: 10px; }
.page-deals .df-select.is-rich .df-selectbox { padding-left: 4px; padding-bottom: 14px; font-weight: 600; }
.page-deals .df-select-lead { flex: none; width: 36px; height: 36px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; color: #fff; font-size: 11px; font-weight: 700; }
.page-deals .df-select-lead img { width: 78%; height: 78%; object-fit: contain; }
.page-deals .df-select.is-rich .df-selectbox { width: calc(100% - 46px); }
.page-deals .df-select-sub { position: absolute; left: 56px; bottom: 9px; display: flex; align-items: center; gap: 6px; height: 14px; line-height: 14px; font-size: 12.5px; color: #677495; pointer-events: none; white-space: nowrap; }
.page-deals .df-select-sub > span { display: inline-flex; align-items: center; gap: 6px; }
.page-deals .df-select-sub img.flag { display: inline-block; flex: none; }
.page-deals .df-select-sub .flag { width: 18px !important; height: 12px !important; border-radius: 2px; }
.page-deals .df-select.no-lead .df-select-sub { left: 14px; }
.page-deals .df-select.has-chips { min-height: 58px; flex-wrap: wrap; gap: 6px; padding: 5px 40px 5px 9px; }
.page-deals .df-select.has-chips .df-selectbox { min-height: 24px; width: auto; min-width: 0; flex: 1 1 40px; padding: 0 2px; font-size: 13px; color: #677495; }
.page-deals .df-geochips { display: contents; }
.page-deals .df-geochip { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 6px 0 8px; border-radius: 7px; background: #E2ECFE; color: #1D4ED8; font-size: 13px; font-weight: 500; }
.page-deals .df-geochip .flag { width: 18px !important; height: 12px !important; border-radius: 2px; }
.page-deals .df-geochip-x { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border: 0; border-radius: 5px; background: none; color: #4C79D8; cursor: pointer; }
.page-deals .df-geochip-x:hover { background: #CFE0FC; }
.page-deals .df-geochip-x .icon { width: 13px; height: 13px; }

.page-deals .df-seg { display: inline-flex; align-self: flex-start; border: 1px solid #E2E9F5; border-radius: 10px; overflow: hidden; background: #fff; }
.page-deals .df-seg-item { position: relative; display: inline-flex; align-items: center; justify-content: center; height: 36px; padding: 0 34px; border-left: 1px solid #E9EEF7; font-size: 14px; font-weight: 500; color: var(--cmp-ink); cursor: pointer; transition: background var(--t-fast), color var(--t-fast); }
.page-deals .df-seg-item:first-child { border-left: 0; }
.page-deals .df-seg-item input { position: absolute; opacity: 0; width: 0; height: 0; }
.page-deals .df-seg-item:hover { background: var(--cmp-field); }
.page-deals .df-seg-item.is-on { background: var(--cmp-blue); color: #fff; font-weight: 600; }
.page-deals .df-terms { margin-top: 15px; }
.page-deals .df-info { grid-column: 2; display: flex; align-items: flex-start; gap: 11px; padding: 4px 14px 3px; border-radius: 11px; background: #EFF5FE; align-self: start; }
.page-deals .df-info-icon { flex: none; display: inline-flex; width: 30px; height: 30px; border-radius: 50%; background: #DCE9FD; color: var(--cmp-blue); align-items: center; justify-content: center; }
.page-deals .df-info-icon .icon { width: 18px; height: 18px; }
.page-deals .df-info strong { display: block; font-size: 14px; line-height: 19px; font-weight: 700; color: var(--cmp-navy); }
.page-deals .df-info p { margin: 1px 0 0; font-size: 13.5px; line-height: 17.5px; color: #46588A; }
.page-deals .df-check { display: inline-flex; align-items: center; gap: 9px; font-size: 14px; color: var(--cmp-navy); cursor: pointer; }
.page-deals .df-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.page-deals .df-check span { width: 18px; height: 18px; border: 1.5px solid #CBD8EC; border-radius: 5px; background: #fff; position: relative; transition: background var(--t-fast), border-color var(--t-fast); }
.page-deals .df-check input:checked + span { background: var(--cmp-blue); border-color: var(--cmp-blue); }
.page-deals .df-check input:checked + span::after { content: ""; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }

/* ---- preview + next steps ---- */
.page-deals .df-preview-head h2 { margin: 0; line-height: 1.2; font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--cmp-navy); }
.page-deals .df-preview-head p { margin: 3px 0 7px; line-height: 1.35; font-size: 13.5px; color: #677495; }
.page-deals .df-preview-box { border: 1px solid var(--cmp-line); border-radius: 12px; padding: 16px; }
.page-deals .df-preview-partner { display: flex; align-items: center; gap: 13px; padding-bottom: 8px; }
.page-deals .df-preview-logo { flex: none; width: 51px; height: 51px; border-radius: 50%; background: #EEF3FB; display: inline-flex; align-items: center; justify-content: center; overflow: hidden; color: #fff; font-size: 12px; font-weight: 700; } .page-deals .df-preview-id { display: flex; flex-direction: column; min-width: 0; }
.page-deals .df-preview-id strong { font-size: 17.5px; font-weight: 700; color: var(--cmp-navy); }
.page-deals .df-preview-id em { font-style: normal; font-size: 14px; color: #677495; }
.page-deals .df-preview-rows { display: flex; flex-direction: column; gap: 10px; padding: 12px 0; }
.page-deals .df-preview-rows.is-bordered { border-top: 1px solid var(--cmp-line-soft); }
.page-deals .df-prow { display: grid; grid-template-columns: 141px minmax(0, 1fr); align-items: center; gap: 12px; font-size: 14px; line-height: 18px; }
.page-deals .df-prow > span { color: #677495; }
.page-deals .df-prow > b { font-weight: 700; color: var(--cmp-navy); text-align: left; }
.page-deals .df-prow > b.is-link { color: var(--cmp-blue); }
.page-deals .df-prow > b { display: inline-flex; align-items: center; gap: 8px; justify-content: flex-start; line-height: 18px; }
.page-deals .df-prow b .flag { width: 18px !important; height: 12px !important; border-radius: 2px; display: inline-block; flex: none; }
.page-deals .df-prow-status { display: inline-flex; align-items: center; gap: 9px; color: #109A4B; font-weight: 700; }
.page-deals .df-prow-status .dv-statdot { position: relative; width: 16px; height: 16px; border-radius: 50%; background: #A1F2C3; }
.page-deals .df-prow-status .dv-statdot::after { content: ""; position: absolute; left: 4px; top: 4px; width: 8px; height: 8px; border-radius: 50%; background: #027435; }

.page-deals .df-next-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 17px; }
.page-deals .df-next-icon { flex: none; color: var(--cmp-blue); display: inline-flex; }
.page-deals .df-next-icon .icon { width: 22px; height: 22px; }
.page-deals .df-next-head h2 { margin: 0; font-size: 17px; font-weight: 800; color: var(--cmp-navy); }
.page-deals .df-next-head p { margin: 2px 0 0; font-size: 13.5px; color: #677495; }
.page-deals .df-next-list { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.page-deals .df-next-list li { display: flex; align-items: flex-start; gap: 11px; font-size: 14px; color: var(--cmp-ink); }
.page-deals .df-next-list .icon { flex: none; width: 18px; height: 18px; color: var(--cmp-blue); margin-top: 1px; }

/* ---- sticky action bar ---- */
.page-deals .df-bar { position: fixed; left: calc(var(--sidebar-w) + 0px); right: 0; bottom: 0; z-index: 40; display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 10px 24px; background: #fff; border-top: 1px solid var(--cmp-line); box-shadow: 0 -4px 16px rgba(15,32,79,.05); }
.page-deals .df-bar .cmp-btn { height: 42px; border-radius: 10px; padding: 0 24px; }
.page-deals .df-card .form-error { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: #E11D48; }


/* ---- Deals & Agreements: narrow viewports ---- */
@media (max-width: 1279px) {
  .page-deals .dv-cols { grid-template-columns: minmax(0, 1fr); }
  .page-deals .df-cols { grid-template-columns: minmax(0, 1fr); }
  .page-deals .dv-rail, .page-deals .df-rail { flex-direction: row; flex-wrap: wrap; }
  .page-deals .dv-rail > *, .page-deals .df-rail > * { flex: 1 1 320px; }
}
@media (max-width: 1023px) {
  .page-deals .dl-filters { flex-wrap: wrap; row-gap: 10px; }
  .page-deals .dl-filters .cmp-search { flex: 1 1 100%; }
  .page-deals .df-grid-3.df-partnergrid, .page-deals .df-grid-3.df-period { grid-template-columns: minmax(0, 1fr); }
  .page-deals .df-grid-2 { grid-template-columns: minmax(0, 1fr); }
  .page-deals .df-info { grid-column: 1; }
  .page-deals .df-seg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-deals .df-seg-item { padding: 0 8px; }
  .page-deals .df-seg-item:nth-child(4) { border-left: 0; }
  .page-deals .dv-kvgrid { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .page-deals .dv-kvgrid::before { display: none; }
  .page-deals .dv-kvcol:last-of-type { grid-column: 1; }
}
@media (max-width: 767px) {
  .page-deals .dv-rail > *, .page-deals .df-rail > * { flex: 1 1 100%; }
  .page-deals .dv-strip { flex-wrap: wrap; }
  .page-deals .dv-stat { flex: 1 1 calc(50% - 1px); border-left: 0; border-top: 1px solid var(--cmp-line-soft); }
  .page-deals .dv-stat:first-child, .page-deals .dv-stat:nth-child(2) { border-top: 0; }
  .page-deals .dv-tabs { overflow-x: auto; }
  .page-deals .dv-quick { flex-wrap: wrap; }
  .page-deals .dv-quick-btn { flex: 1 1 100%; justify-content: flex-start; }
  .page-deals .df-bar { left: 0; }
  .page-deals .dl-foot { flex-wrap: wrap; row-gap: 12px; justify-content: center; }
  .page-deals .dl-foot .cmp-foot-info, .page-deals .dl-foot .cmp-per { flex: 1 1 100%; justify-content: center; text-align: center; }
}
@media (max-width: 560px) {
  .page-deals .dv-head { flex-wrap: wrap; row-gap: 12px; }
  .page-deals .dv-topline { flex-wrap: wrap; row-gap: 10px; }
  .page-deals .dv-actions { flex: 1 1 100%; justify-content: flex-start; }
  .page-deals .dv-stat { flex: 1 1 100%; border-top: 1px solid var(--cmp-line-soft); }
  .page-deals .dv-stat:first-child { border-top: 0; }
  .page-deals .df-titleblock h1 { font-size: 24px; }
  .page-deals .dl-chips { flex-wrap: wrap; row-gap: 8px; }
}

/* =====================================================================
   Affiliate Accounts (design-reference-new/accounts-list.png, account-detail-*.png, account-add.png)
   ===================================================================== */
.page-accounts .page-header { display: none; }
body.page-accounts:not(.page-account-detail):not(.page-account-add) .page-content { padding: 0 13px 24px 12px; }
.page-account-detail .page-content, .page-account-add .page-content { padding: 0 24px 24px 24px; }
.aa-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 14px 14px; }
.aa-top.is-form { padding: 0 0 14px; }
.aa-title { font-size: 24px; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; color: var(--cmp-navy); }
.page-account-add .aa-title { font-size: 26px; }
.aa-sub { font-size: 13px; color: #56679A; margin-top: 5px; }
.aa-top-actions { display: flex; gap: 12px; align-items: center; margin-top: 4px; }
.aa-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 8px; font-size: 13.5px; font-weight: 600; white-space: nowrap; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast); text-decoration: none; }
.aa-btn .icon { flex: none; }
.aa-btn-ghost { background: #fff; border: 1px solid #DCE5F2; color: var(--cmp-ink); }
.aa-btn-ghost:hover { background: var(--cmp-field); }
.aa-btn-ghost.is-blue { color: var(--cmp-blue); }
.aa-btn-ghost.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: var(--cmp-blue-soft); }
.aa-btn-primary { background: var(--cmp-blue); border: 1px solid var(--cmp-blue); color: #fff; }
.aa-btn-primary:hover { background: #0F5AD8; }
.aa-btn-danger { background: #FDECEE; border: 1px solid #F8C9CF; color: #B8182B; }
.aa-btn.is-sm { height: 30px; padding: 0 10px; font-size: 12.5px; gap: 6px; border-radius: 7px; }
.aa-btn.is-lg { height: 46px; padding: 0 20px; font-size: 14px; }
.aa-btn.is-icon { width: 44px; padding: 0; }
.aa-btn[disabled], .aa-btn.is-disabled { opacity: .5; pointer-events: none; }
.aa-link { background: none; border: 0; color: var(--cmp-blue); font-size: 12.5px; font-weight: 600; cursor: pointer; }
.aa-link-blue { color: var(--cmp-blue); }

/* stat strip */
.aa-stats { display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; height: 84px; margin-bottom: 14px; }
.aa-stat { display: flex; align-items: center; gap: 20px; padding: 0 24px 0 30px; border-left: 1px solid #E6EDF7; }
.aa-stat:first-child { border-left: 0; }
.aa-stat-ic { width: 44px; height: 44px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.aa-stat-ic.tone-blue { background: #E4EEFE; color: #1668F5; } .aa-stat-ic.tone-green { background: #DFF7E9; color: #16A34A; } .aa-stat-ic.tone-amber { background: #FDEFD8; color: #F59E0B; } .aa-stat-ic.tone-purple { background: #EDE7FE; color: #7C3AED; }
.aa-stat-l { font-size: 12.5px; color: #5D6E95; line-height: 1.2; }
.aa-stat-v { display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 700; color: var(--cmp-navy); line-height: 1.15; margin-top: 2px; letter-spacing: -.01em; }
.aa-stat-s { font-size: 12.5px; color: #667499; margin-top: 3px; white-space: nowrap; }
.aa-stat-s i { font-style: normal; margin: 0 4px; color: #647599; }
.aa-chg { display: inline-flex; align-items: center; gap: 2px; height: 20px; padding: 0 7px; border-radius: 5px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.aa-chg .icon { width: 10px; height: 10px; stroke-width: 2.6; }
.aa-chg.is-up { background: #DFF7E9; color: #0E7A3C; } .aa-chg.is-down { background: #FDE3E6; color: #B8182B; }
.aa-chg.is-big { height: 22px; font-size: 12px; padding: 0 8px; }
.aa-nochange { color: #667595; font-size: 13px; }
.aa-flat { font-size: 12.5px; color: #46588A; }

/* card with tabs / filters / table */
.aa-card { background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; }
.aa-tabsrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px 0; }
.aa-tabs { display: flex; gap: 6px; }
.aa-tab { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border-radius: 8px; background: #F1F5FB; color: var(--cmp-ink); font-size: 12.5px; font-weight: 600; text-decoration: none; }
.aa-tab:hover { background: #E7EEF8; }
.aa-tab.is-active { background: var(--cmp-blue); color: #fff; }
.aa-tab-n { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 9px; background: rgba(15,23,42,.08); font-size: 11px; font-weight: 700; }
.aa-tab.is-active .aa-tab-n { background: rgba(9,40,100,.28); color: #fff; }
.aa-tab-n.tone-red { background: #E11D48; color: #fff; }
.aa-viewtoggle { display: flex; gap: 8px; }
.aa-viewbtn { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border-radius: 8px; border: 1px solid #DCE5F2; background: #fff; font-size: 12.5px; font-weight: 600; color: #46588A; text-decoration: none; }
.aa-viewbtn.is-active { background: #E8F0FE; border-color: #C6D8F9; color: var(--cmp-blue); }
.aa-filterbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 16px 10px; }
.aa-search { display: flex; align-items: center; gap: 8px; width: 425px; height: 32px; padding: 0 12px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; color: #667595; }
.aa-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font-size: 12.5px; color: var(--cmp-ink); font-family: inherit; }
.aa-search input::placeholder { color: #667595; }
.aa-select { position: relative; display: inline-flex; align-items: center; height: 32px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; }
.aa-select select { appearance: none; -webkit-appearance: none; height: 100%; padding: 0 28px 0 12px; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 500; color: var(--cmp-ink); cursor: pointer; outline: 0; max-width: 220px; }
.aa-select .aa-select-caret { position: absolute; right: 9px; pointer-events: none; color: #3B4C86; }
.aa-select.is-sm select { font-size: 12.5px; }
.aa-select.is-full { display: flex; width: 100%; height: 38px; }
.aa-select.is-full select { flex: 1; width: 100%; max-width: none; font-size: 13.5px; padding-left: 13px; }
.aa-select.is-status select { padding-left: 34px; }
.aa-status-dot { position: absolute; left: 14px; width: 10px; height: 10px; border-radius: 50%; }
.aa-more { height: 32px; padding: 0 12px; font-size: 12.5px; gap: 7px; }
.aa-sort { margin-left: auto; }
.aa-sortbtn { height: 32px; padding: 0 12px; font-size: 12.5px; gap: 7px; }
.aa-sortbtn strong { font-weight: 700; }
.aa-morebar { flex: 1 0 100%; display: flex; align-items: center; gap: 8px; padding: 8px 0 2px; }
.aa-morebar-l { font-size: 12px; color: #667499; margin-right: 4px; }
.aa-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 0 16px 12px; }
.aa-chip { display: inline-flex; align-items: center; gap: 8px; height: 24px; padding: 0 6px 0 10px; border-radius: 6px; background: #EAF0FB; color: var(--cmp-ink); font-size: 12px; font-weight: 500; }
.aa-chip-x { display: inline-flex; color: #3B4C86; }
.aa-chip-x:hover { color: #E11D48; }
.aa-clear { color: var(--cmp-blue); font-size: 12px; font-weight: 600; margin-left: 4px; }
.aa-bulkbar { display: flex; align-items: center; gap: 8px; padding: 8px 16px; background: #F3F7FE; border-top: 1px solid #DCE7F8; border-bottom: 1px solid #DCE7F8; }
.aa-bulkbar[hidden] { display: none; }
.aa-bulk-n { font-size: 12.5px; color: var(--cmp-ink); margin-right: 8px; }
/* table */
.aa-tablewrap { overflow-x: auto; }
.aa-table { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 1040px; }
.aa-table col.c-sel { width: 44px; } .aa-table col.c-acct { width: 17%; } .aa-table col.c-co { width: 14%; } .aa-table col.c-site { width: 15%; } .aa-table col.c-geo { width: 9%; } .aa-table col.c-terms { width: 20%; } .aa-table col.c-month { width: 13%; } .aa-table col.c-status { width: 10%; } .aa-table col.c-actions { width: 70px; }
.aa-table thead th { height: 34px; padding: 0 8px; background: #F7F9FC; border-top: 1px solid #EEF2F8; border-bottom: 1px solid #EEF2F8; text-align: left; }
.aa-table thead th.c-sel, .aa-table td.c-sel { padding-left: 16px; }
.aa-th { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: #5D6E95; text-decoration: none; }
.aa-th .icon { color: #667596; stroke-width: 2; }
.aa-th.is-on { color: var(--cmp-blue); } .aa-th.is-on .icon { color: var(--cmp-blue); }
.aa-th.is-right { justify-content: flex-end; width: 100%; padding-right: 6px; }
.aa-table tbody td { height: 40px; padding: 4px 8px; border-bottom: 1px solid #EEF2F8; vertical-align: middle; }
.aa-table tbody tr:last-child td { border-bottom: 0; }
.aa-row { cursor: pointer; transition: background var(--t-fast); }
.aa-row:hover { background: #F8FAFD; }
.aa-row.is-selected { background: #F3F7FE; }
.aa-check { position: relative; display: inline-flex; width: 16px; height: 16px; cursor: pointer; }
.aa-check input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.aa-check span { width: 16px; height: 16px; border: 1.5px solid #C5D1E4; border-radius: 4px; background: #fff; transition: all var(--t-fast); }
.aa-check input:checked + span { background: var(--cmp-blue); border-color: var(--cmp-blue); box-shadow: inset 0 0 0 3px #fff; }
.aa-check input:indeterminate + span { background: var(--cmp-blue); border-color: var(--cmp-blue); box-shadow: inset 0 0 0 3px #fff; }
.aa-acct { display: flex; align-items: center; gap: 10px; min-width: 0; }
.aa-acct-logo { width: 30px !important; height: 22px !important; border-radius: 50% !important; flex: none; }
.aa-acct-id { font-size: 13px; font-weight: 700; color: var(--cmp-navy); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aa-acct-id:hover { color: var(--cmp-blue); }
.aa-acct-login { font-size: 11.5px; color: #667595; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aa-co { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: 13px; font-weight: 600; color: var(--cmp-ink); }
.aa-co-logo { width: 28px !important; height: 28px !important; border-radius: 50% !important; flex: none; }
.aa-co { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: #46588A; white-space: nowrap; }
.aa-more-n { display: inline-flex; align-items: center; height: 18px; padding: 0 6px; border-radius: 5px; background: #E8F0FE; color: var(--cmp-blue); font-size: 11px; font-weight: 700; font-style: normal; }
.aa-geo { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--cmp-ink); }
.aa-geo .flag { width: 20px !important; height: 14px !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); }
.aa-geo .flag-cell { display: inline-flex; }
.aa-geo.is-lg { font-size: 13px; font-weight: 500; }
.aa-terms { display: flex; align-items: center; gap: 12px; min-width: 0; }
.aa-pill { display: inline-flex; align-items: center; justify-content: center; height: 20px; padding: 0 9px; border-radius: 5px; font-size: 11.5px; font-weight: 600; white-space: nowrap; flex: none; }
.aa-pill.tone-green { background: #DFF7E9; color: #0E7A3C; } .aa-pill.tone-blue { background: #E4EEFE; color: #1668F5; } .aa-pill.tone-purple { background: #EFE9FE; color: #7C3AED; } .aa-pill.tone-amber { background: #FDEFD8; color: #9A5205; } .aa-pill.tone-grey { background: #EEF2F8; color: #667499; }
.aa-terms-text { display: block; font-size: 13px; font-weight: 600; color: var(--cmp-navy); white-space: nowrap; line-height: 1.2; }
.aa-terms-sub { display: block; font-size: 11.5px; color: #667595; margin-top: 2px; }
.aa-month { line-height: 1.2; }
.aa-month > strong { font-size: 13.5px; font-weight: 700; color: var(--cmp-navy); margin-right: 8px; }
.aa-month-top { display: flex; align-items: center; gap: 8px; }
.aa-month-top strong { font-size: 13.5px; font-weight: 700; color: var(--cmp-navy); }
.aa-month-sub { font-size: 11.5px; color: #667595; margin-top: 2px; white-space: nowrap; }
.aa-status { display: inline-flex; align-items: center; gap: 7px; height: 22px; padding: 0 9px; border-radius: 6px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.aa-status i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.aa-status.tone-green { background: #DFF7E9; color: #0E7A3C; } .aa-status.tone-amber { background: #FDEFD8; color: #9A5205; } .aa-status.tone-grey { background: #EEF2F8; color: #667499; }
.aa-status.is-lg { height: 24px; font-size: 12.5px; padding: 0 10px; border-radius: 12px; }
.aa-att-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #E11D48; margin-left: 8px; vertical-align: middle; }
.aa-rowmenu .btn-icon { width: 28px; height: 26px; border-radius: 6px; border: 1px solid #E3EBF7; background: #fff; color: #46588A; }
.c-actions { text-align: right; }
.aa-foot { display: flex; align-items: center; gap: 16px; padding: 14px 16px 14px; border-top: 1px solid #EEF2F8; }
.aa-showing { font-size: 12.5px; color: #46588A; margin-right: auto; }
.aa-pager { display: flex; align-items: center; gap: 5px; position: absolute; left: 50%; transform: translateX(-50%); }
.aa-foot { position: relative; }
.aa-page { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #E3EBF7; border-radius: 7px; background: #fff; font-size: 12.5px; font-weight: 600; color: var(--cmp-ink); text-decoration: none; }
.aa-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
.aa-page.is-disabled { color: #627598; pointer-events: none; }
.aa-page-gap { color: #667595; padding: 0 2px; }
.aa-perpage { display: inline-flex; align-items: center; gap: 10px; font-size: 12.5px; color: #46588A; margin-left: auto; }
.aa-perpage .aa-select { width: 70px; height: 30px; }
.aa-perpage .aa-select select { width: 100%; padding-left: 10px; }
.aa-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 40px 20px; text-align: center; color: #667499; }
.aa-empty h3, .aa-empty h2 { font-size: 15px; font-weight: 700; color: var(--cmp-navy); }
.aa-empty p { font-size: 13px; }
.aa-empty.is-inline { padding: 18px; flex-direction: row; text-align: left; }
.aa-empty.is-inline .icon { color: #667596; flex: none; }
.aa-empty-page { margin: 60px auto; max-width: 420px; }
/* grid view */
.aa-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding: 6px 16px 16px; }
.aa-gcard { border: 1px solid var(--cmp-line); border-radius: 12px; padding: 14px; cursor: pointer; display: flex; flex-direction: column; gap: 10px; transition: box-shadow var(--t-fast), border-color var(--t-fast); }
.aa-gcard:hover { border-color: #D6E1F2; box-shadow: 0 6px 18px rgba(15,23,42,.06); }
.aa-gcard.is-selected { border-color: var(--cmp-blue); }
.aa-gcard-head { display: flex; align-items: center; gap: 10px; }
.aa-gcard-logo { width: 40px !important; height: 40px !important; border-radius: 9px !important; }
.aa-gcard-name { font-size: 14px; font-weight: 700; color: var(--cmp-navy); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aa-gcard-login { font-size: 12px; color: #667595; }
.aa-gcard-co { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--cmp-ink); font-weight: 600; }
.aa-gcard-dot { color: #647599; }
.aa-gcard-site { color: #46588A; font-weight: 500; }
.aa-gcard-site em { font-style: normal; color: var(--cmp-blue); font-weight: 700; margin-left: 4px; }
.aa-gcard-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 8px; border-top: 1px solid #EEF2F8; }
.aa-gcard-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.aa-gcard-att { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #B8182B; }

/* ---------- account page ---------- */
.aa-crumbs { display: flex; align-items: center; gap: 8px; font-size: 13px; padding: 16px 0 12px; }
.aa-crumbs a { display: inline-flex; align-items: center; gap: 7px; color: var(--cmp-blue); text-decoration: none; }
.aa-crumbs strong { color: var(--cmp-blue); font-weight: 700; }
.aa-crumb-sep { color: #667596; display: inline-flex; }
.aa-head { display: flex; align-items: flex-start; gap: 24px; padding: 0 0 8px; }
.aa-head-logo { width: 100px !important; height: 100px !important; border-radius: 10px !important; flex:  width: 100px !important; height: 100px !important; border-radius: 50% !important; flex: none; lign-items: center; gap: 12px; }
.aa-head-title { font-size: 26px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.02em; line-height: 1.1; }
.aa-head-kind { font-size: 13px; color: #667499; margin-top: 6px; }
.aa-head-co { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--cmp-blue); margin-top: 6px; }
.aa-head-co a { color: inherit; text-decoration: none; }
.aa-dot { color: #667596; }
.aa-head-meta { display: flex; align-items: center; gap: 14px; margin-top: 10px; font-size: 13px; color: var(--cmp-ink); }
.aa-chip-soft { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 6px; background: #E8F0FE; color: var(--cmp-blue); font-size: 12px; font-weight: 600; }
.aa-head-created { display: inline-flex; align-items: center; gap: 7px; color: #46588A; }
.aa-head-created .icon { color: #65749C; }
.aa-head-right { display: flex; flex-direction: column; align-items: flex-end; gap: 16px; }
.aa-head-actions { display: flex; gap: 10px; }
.aa-head-fields { display: flex; gap: 10px; }
.aa-field-box { width: 216px; height: 70px; padding: 12px 16px; border-radius: 10px; background: #F5F8FD; border: 1px solid #E6EDF7; display: flex; flex-direction: column; justify-content: center; gap: 6px; }
.aa-fb-l { font-size: 12.5px; color: #667499; }
.aa-fb-v { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 700; color: var(--cmp-navy); white-space: nowrap; overflow: hidden; }
.aa-ibtn { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; color: var(--cmp-blue); cursor: pointer; transition: background var(--t-fast); text-decoration: none; }
.aa-ibtn:hover { background: var(--cmp-field); }
.aa-ibtn[disabled] { opacity: .4; cursor: not-allowed; }
.aa-ibtn.is-plain { width: 22px; height: 22px; border: 0; background: none; color: var(--cmp-blue); }
.aa-dtabs { display: flex; gap: 6px; border-bottom: 1px solid var(--cmp-line); margin: 10px 0 18px; }
.aa-dtab { display: inline-flex; align-items: center; gap: 9px; height: 44px; padding: 0 20px; font-size: 14px; font-weight: 600; color: #46588A; text-decoration: none; border-radius: 10px 10px 0 0; position: relative; }
.aa-dtab .icon { color: #65749C; }
.aa-dtab.is-active { background: #fff; color: var(--cmp-blue); border: 1px solid var(--cmp-line); border-bottom-color: #fff; margin-bottom: -1px; }
.aa-dtab.is-active .icon { color: var(--cmp-blue); }
.aa-dtab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: var(--cmp-blue); border-radius: 3px 3px 0 0; }
.aa-strip { display: grid; grid-template-columns: repeat(5, 1fr); background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; height: 104px; margin-bottom: 18px; }
.aa-cell { display: flex; align-items: center; gap: 16px; padding: 0 16px 0 20px; border-left: 1px solid #E6EDF7; }
.aa-cell:first-child { border-left: 0; }
.aa-cell-ic { width: 50px; height: 50px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.aa-cell-ic.tone-green { background: #DFF7E9; color: #16A34A; } .aa-cell-ic.tone-blue { background: #E4EEFE; color: #1668F5; } .aa-cell-ic.tone-purple { background: #EDE7FE; color: #7C3AED; }
.aa-bigdot { width: 18px; height: 18px; border-radius: 50%; background: #16A34A; }
.aa-cell-l { font-size: 12.5px; color: #5D6E95; }
.aa-cell-v { display: flex; align-items: center; gap: 10px; font-size: 20px; font-weight: 700; color: var(--cmp-navy); line-height: 1.15; margin-top: 3px; letter-spacing: -.01em; }
.aa-cell-v.is-geo { font-size: 17px; } .aa-cell-v.is-geo .flag { width: 24px !important; height: 17px !important; border-radius: 3px; } .aa-cell-v.is-geo .flag-cell { display: inline-flex; }
.aa-cell-v.is-money { font-size: 22px; }
.aa-cell-s { font-size: 12.5px; color: #667499; margin-top: 4px; white-space: nowrap; }
.aa-cols { display: grid; grid-template-columns: minmax(0, 1fr) 580px; gap: 22px; align-items: start; }
.aa-col-main, .aa-col-side { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.aa-panel { background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; padding: 16px; }
.aa-panel-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.aa-panel-head > div { flex: 1; min-width: 0; }
.aa-panel-ic { width: 44px; height: 44px; flex: none; border-radius: 50%; background: #EEF3FE; color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.aa-panel-ic.tone-red { background: #FDECEE; color: #B8182B; }
.aa-panel-title { font-size: 16px; font-weight: 700; color: var(--cmp-navy); line-height: 1.2; }
.aa-panel-sub { font-size: 12.5px; color: #667499; margin-top: 4px; }
.aa-panel-head .aa-btn { height: 40px; }
.aa-access { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.aa-abox { display: flex; align-items: center; gap: 12px; height: 70px; padding: 0 14px; border-radius: 10px; background: #F5F8FD; border: 1px solid #E6EDF7; }
.aa-abox-ic { width: 44px; height: 44px; flex: none; border-radius: 50%; background: #fff; color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.aa-abox-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.aa-abox-l { font-size: 12.5px; color: #667499; }
.aa-abox-v { font-size: 15px; font-weight: 700; color: var(--cmp-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aa-abox-v a { color: var(--cmp-blue); text-decoration: none; font-size: 14px; }
.aa-secret { letter-spacing: .12em; }
.aa-muted { color: #667595; font-weight: 500; letter-spacing: 0; }
.aa-abox-act { display: flex; gap: 6px; }
.aa-geotiles { display: flex; flex-wrap: wrap; gap: 12px; }
.aa-geotile { display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 14px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; font-size: 13px; color: var(--cmp-ink); font-weight: 500; }
.aa-geotile .flag { width: 20px !important; height: 14px !important; border-radius: 2px; } .aa-geotile .flag-cell { display: inline-flex; }
.aa-geotile.is-add { color: var(--cmp-blue); font-weight: 600; cursor: pointer; }
.aa-badge-green { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 10px; background: #DFF7E9; color: #0E7A3C; font-size: 11.5px; font-weight: 600; }
.aa-snap { display: grid; grid-template-columns: repeat(4, 1fr); }
.aa-snap-m { display: flex; flex-direction: column; gap: 6px; padding: 4px 16px 6px 0; border-left: 1px solid #E6EDF7; padding-left: 16px; }
.aa-snap-m:first-child { border-left: 0; padding-left: 4px; }
.aa-snap-l { font-size: 12.5px; color: #5D6E95; }
.aa-snap-v { display: flex; align-items: center; gap: 10px; font-size: 20px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; }
.aa-snap-s { font-size: 12.5px; color: #667499; }
.aa-rows { display: flex; flex-direction: column; gap: 10px; }
.aa-lrow, .aa-drow { display: flex; align-items: center; gap: 12px; min-height: 62px; padding: 0 12px 0 12px; border: 1px solid #E6EDF7; border-radius: 10px; }
.aa-lrow-ic, .aa-drow-ic { width: 40px; height: 40px; flex: none; border-radius: 50%; background: #EEF3FE; color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.aa-drow-ic.tone-purple { background: #EDE7FE; color: #7C3AED; }
.aa-lrow-txt, .aa-drow-txt { flex: 1; min-width: 0; }
.aa-lrow-t, .aa-drow-t { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 700; color: var(--cmp-navy); }
.aa-lrow-url { display: block; font-size: 12.5px; color: var(--cmp-blue); text-decoration: none; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aa-drow-s { font-size: 12.5px; color: #667499; margin-top: 3px; }
.aa-lrow-act { display: flex; align-items: center; gap: 8px; padding-left: 12px; border-left: 1px solid #E6EDF7; }
.aa-drow-date { display: flex; flex-direction: column; gap: 2px; padding: 0 16px; border-left: 1px solid #E6EDF7; min-width: 118px; }
.aa-drow-date strong { font-size: 13px; font-weight: 700; color: var(--cmp-navy); } .aa-drow-date span { font-size: 12px; color: #667499; }
.aa-drow-status { padding: 0 16px 0 12px; border-left: 1px solid #E6EDF7; }
.aa-drow-status .aa-status { height: 26px; padding: 0 12px; border-radius: 13px; font-size: 12.5px; }
.aa-viewall { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 13.5px; font-weight: 700; color: var(--cmp-blue); text-decoration: none; }
/* performance */
.aa-ptiles { display: grid; grid-template-columns: repeat(5, 1fr); background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; height: 90px; margin-bottom: 14px; }
.aa-ptile { display: flex; align-items: center; gap: 14px; padding: 0 16px 0 20px; border-left: 1px solid #E6EDF7; }
.aa-ptile:first-child { border-left: 0; }
.aa-ptile-ic { width: 46px; height: 46px; flex: none; border-radius: 50%; background: #E4EEFE; color: var(--cmp-blue); display: inline-flex; align-items: center; justify-content: center; }
.aa-ptile-ic.tone-green { background: #DFF7E9; color: #0B7B3C; } .aa-ptile-ic.tone-purple { background: #EDE7FE; color: #6D28D9; } .aa-ptile-ic.tone-red { background: #FDE8E8; color: #B42318; } .aa-ptile-ic.tone-amber { background: #FFF3D6; color: #8F590B; }
.aa-ptile-l { font-size: 12.5px; color: #5D6E95; }
.aa-ptile-v { display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; margin-top: 2px; }
.aa-ptile-s { font-size: 12.5px; color: #667499; margin-top: 3px; }
.aa-pcols { display: grid; grid-template-columns: minmax(0, 1fr) 394px; gap: 14px; align-items: stretch; margin-bottom: 14px; }
.aa-trend { position: relative; }
.aa-legend { display: flex; align-items: center; gap: 18px; font-size: 12.5px; color: var(--cmp-ink); margin-right: 8px; align-self: center; }
.aa-legend span { display: inline-flex; align-items: center; gap: 7px; }
.aa-legend i { width: 10px; height: 10px; border-radius: 50%; }
.aa-range .aa-btn { height: 36px; font-size: 13px; }
.aa-chart { position: relative; min-height: 240px; }
.aa-svg { display: block; }
.aa-ax { font-size: 11px; fill: #667499; font-family: var(--font); }
.aa-hit { cursor: crosshair; }
.aa-tip { position: absolute; z-index: 5; min-width: 180px; padding: 10px 12px; background: #fff; border: 1px solid var(--cmp-line); border-radius: 10px; box-shadow: 0 10px 30px rgba(15,23,42,.14); font-size: 12.5px; color: var(--cmp-ink); pointer-events: none; }
.aa-tip strong { display: block; font-size: 13px; color: var(--cmp-navy); margin-bottom: 6px; }
.aa-tip span { display: flex; align-items: center; gap: 7px; padding: 2px 0; } .aa-tip span b { margin-left: auto; font-weight: 700; color: var(--cmp-navy); } .aa-tip i { width: 8px; height: 8px; border-radius: 50%; }
.aa-brows { list-style: none; margin: 0; padding: 0; }
.aa-brows li { display: flex; align-items: center; gap: 10px; height: 29px; border-bottom: 1px solid #EEF2F8; font-size: 13px; }
.aa-brows li:last-child { border-bottom: 0; }
.aa-brow-ic { color: var(--cmp-blue); display: inline-flex; width: 18px; }
.aa-brow-l { flex: 1; color: var(--cmp-ink); }
.aa-brow-v { font-weight: 700; color: var(--cmp-navy); margin-right: 8px; }
.aa-mtablewrap { overflow-x: auto; }
.aa-mtable { width: 100%; border-collapse: collapse; }
.aa-mtable th { height: 34px; padding: 0 12px; text-align: left; font-size: 12.5px; font-weight: 600; color: #5D6E95; border-bottom: 1px solid #EEF2F8; border-left: 1px solid #EEF2F8; white-space: nowrap; }
.aa-mtable th:first-child, .aa-mtable td:first-child { border-left: 0; padding-left: 16px; }
.aa-mtable td { height: 31px; padding: 0 12px; font-size: 13px; color: var(--cmp-ink); border-bottom: 1px solid #F1F4F9; border-left: 1px solid #F1F4F9; white-space: nowrap; }
.aa-mtable td.c-month { font-weight: 600; color: var(--cmp-navy); }
.aa-mtable tbody tr:last-child td { border-bottom: 0; }
.aa-cellpill { display: inline-flex; align-items: center; gap: 12px; }
/* settings */
.aa-settings .aa-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; }
.aa-f { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.aa-f.is-span { grid-column: 1 / -1; }
.aa-label { font-size: 12.5px; font-weight: 600; color: var(--cmp-ink); }
.aa-label .req { color: #E11D48; margin-left: 3px; }
.aa-input { width: 100%; height: 38px; padding: 0 13px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; font-size: 13.5px; color: var(--cmp-ink); font-family: inherit; }
.aa-input:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.15); }
.aa-input.is-invalid, .aa-cselect-btn.is-invalid, .aa-chipbox.is-invalid { border-color: #E11D48; box-shadow: 0 0 0 3px rgba(225,29,72,.12); }
.aa-input.is-sm { height: 30px; font-size: 13px; }
.aa-textarea { height: auto; padding: 10px 13px; resize: vertical; line-height: 1.45; }
.aa-form-sec { margin-top: 18px; }
.aa-form-h { font-size: 13.5px; font-weight: 700; color: var(--cmp-navy); margin-bottom: 10px; }
.aa-toggle { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid #F1F4F9; cursor: pointer; }
.aa-toggle input { position: absolute; opacity: 0; }
.aa-toggle-ui { width: 38px; height: 22px; flex: none; border-radius: 11px; background: #D5DEEC; position: relative; transition: background var(--t-fast); }
.aa-toggle-ui::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform var(--t-fast); }
.aa-toggle input:checked + .aa-toggle-ui { background: var(--cmp-blue); } .aa-toggle input:checked + .aa-toggle-ui::after { transform: translateX(16px); }
.aa-toggle-txt { display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--cmp-ink); } .aa-toggle-txt small { font-size: 12px; color: #667499; }
.aa-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin-top: 16px; }
.aa-form-msg { font-size: 12.5px; color: #0E7A3C; }
.aa-danger-rows { display: flex; flex-direction: column; }
.aa-danger-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-top: 1px solid #F1F4F9; }
.aa-danger-row > div { display: flex; flex-direction: column; gap: 3px; } .aa-danger-row strong { font-size: 13.5px; color: var(--cmp-navy); } .aa-danger-row span { font-size: 12.5px; color: #667499; }
.aa-danger-row.is-red strong { color: #B8182B; }
.aa-activity { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.aa-activity li { display: flex; gap: 12px; align-items: flex-start; }
.aa-act-dot { width: 10px; height: 10px; border-radius: 50%; background: #C5D1E4; margin-top: 5px; flex: none; }
.aa-act-dot.kind-reveal { background: #F59E0B; } .aa-act-dot.kind-create, .aa-act-dot.kind-deal { background: #16A34A; } .aa-act-dot.kind-status, .aa-act-dot.kind-archive { background: #E11D48; } .aa-act-dot.kind-link, .aa-act-dot.kind-geo, .aa-act-dot.kind-edit, .aa-act-dot.kind-settings { background: var(--cmp-blue); }
.aa-act-t { font-size: 13px; font-weight: 600; color: var(--cmp-navy); } .aa-act-b { font-size: 12.5px; color: #46588A; margin-top: 2px; } .aa-act-m { font-size: 12px; color: #667595; margin-top: 2px; }
.aa-act-empty { font-size: 13px; color: #667595; }

/* ---------- add / edit form ---------- */
.aa-formlayout { display: grid; grid-template-columns: minmax(0, 1fr) 442px; gap: 16px; align-items: start; padding-bottom: 90px; }
.aa-form { display: flex; flex-direction: column; gap: 14px; }
.aa-form .aa-panel { padding: 20px; }
.aa-form .aa-panel-head { margin-bottom: 16px; }
.aa-form .aa-panel-ic { width: 40px; height: 40px; }
.aa-form .aa-f + .aa-f, .aa-form .aa-grid2 + .aa-f, .aa-form .aa-f + .aa-grid2 { margin-top: 16px; }
.aa-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 24px; }
.aa-grid2.is-geo { grid-template-columns: 345fr 412fr; }
.aa-inline { display: flex; gap: 10px; align-items: stretch; }
.aa-inline > .aa-cselect, .aa-inline > .aa-addon, .aa-inline > .aa-chipbox { flex: 1; min-width: 0; }
.aa-inline .aa-btn { height: 46px; flex: none; }
.aa-inline .aa-addon + .aa-btn { height: 40px; }
.aa-inline .aa-chipbox + .aa-btn { height: 40px; }
.aa-cselect { position: relative; }
.aa-cselect-btn { display: flex; align-items: center; gap: 12px; width: 100%; height: 46px; padding: 0 14px 0 8px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; text-align: left; cursor: pointer; font-family: inherit; }
.aa-cselect-btn.is-sm { height: 40px; padding-left: 14px; gap: 10px; }
.aa-cselect-btn .flag { width: 20px !important; height: 14px !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); }
.aa-cselect-logo .brand-tile, .aa-cselect-logo img { width: 40px !important; height: 28px !important; border-radius: 5px !important; }
.aa-cselect-logo .brand-tile, .aa-cselect-logo img { width: 40px !important; height: 28px !important; border-radius: 50% !important; }
.aa-cselect-empty { width: 40px; height: 28px; border-radius: 50%; background: #EEF2F8; color: #667595; display: inline-flex; align-items: center; justify-content: center; }
.aa-cselect-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.aa-cselect-txt strong { font-size: 13.5px; font-weight: 700; color: var(--cmp-navy); } .aa-cselect-txt small { font-size: 12px; color: #667499; margin-top: 2px; }
.aa-caret { color: #3B4C86; flex: none; }
.aa-menu { position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + 6px); background: #fff; border: 1px solid var(--cmp-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(15,23,42,.14); padding: 6px; max-height: 320px; overflow: auto; }
.aa-menu-search { display: flex; align-items: center; gap: 8px; padding: 6px 8px 8px; border-bottom: 1px solid var(--cmp-line-soft); margin-bottom: 4px; }
.aa-menu-search input { flex: 1; border: 0; outline: 0; font-size: 13px; font-family: inherit; }
.aa-menu-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 10px; border-radius: 7px; text-align: left; cursor: pointer; background: none; border: 0; font-family: inherit; }
.aa-menu-item:hover { background: var(--cmp-field); }
.aa-menu-item .brand-tile, .aa-menu-item > img:not(.flag) { width: 32px !important; height: 24px !important; border-radius: 4px !important; }
.aa-menu-item .brand-tile, .aa-menu-item > img:not(.flag) { width: 32px !important; height: 24px !important; border-radius: 50% !important; }
.aa-menu-txt { display: flex; flex-direction: column; line-height: 1.2; } .aa-menu-txt strong { font-size: 13px; font-weight: 600; color: var(--cmp-navy); } .aa-menu-txt small { font-size: 11.5px; color: #667499; }
.aa-menu-empty { padding: 10px; font-size: 13px; color: #667595; }
.aa-inputbtn { display: flex; align-items: stretch; border: 1px solid #DCE5F2; border-radius: 8px; overflow: hidden; background: #fff; }
.aa-inputbtn .aa-input { border: 0; border-radius: 0; flex: 1; min-width: 0; }
.aa-inputbtn .aa-input:focus { box-shadow: none; }
.aa-inputbtn:focus-within { border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.15); }
.aa-inbtn { width: 42px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-left: 1px solid #DCE5F2; background: #fff; color: var(--cmp-blue); cursor: pointer; }
.aa-inbtn:hover { background: var(--cmp-field); }
.aa-addon { position: relative; display: flex; align-items: center; }
.aa-addon .aa-input { padding-left: 42px; }
.aa-addon-ic { position: absolute; left: 13px; color: var(--cmp-blue); display: inline-flex; pointer-events: none; font-size: 13px; font-weight: 600; }
.aa-addon-ic.is-right { left: auto; right: 12px; color: #5D6E95; }
.aa-addon.is-suffix .aa-input { padding-left: 13px; padding-right: 30px; }
.aa-addon.is-prefix .aa-input { padding-left: 30px; } .aa-addon.is-prefix .aa-addon-ic { color: #5D6E95; }
.aa-addon.is-date .aa-input { padding-left: 13px; padding-right: 36px; cursor: pointer; }
.aa-addon.is-date .aa-addon-ic { pointer-events: auto; cursor: pointer; color: var(--cmp-blue); }
.aa-chipbox { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 40px; padding: 5px 34px 5px 8px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; }
.aa-chipbox > .aa-caret { position: absolute; right: 12px; }
.aa-chipbox.is-sites { padding-right: 8px; }
.aa-fchip { display: inline-flex; align-items: center; gap: 8px; height: 28px; padding: 0 8px 0 10px; border-radius: 7px; background: #EAF0FB; color: var(--cmp-ink); font-size: 13px; font-weight: 500; white-space: nowrap; cursor: default; }
.aa-fchip .flag { width: 20px !important; height: 14px !important; border-radius: 2px; }
.aa-fchip-x { display: inline-flex; color: #3B4C86; background: none; border: 0; cursor: pointer; }
.aa-fchip-x:hover { color: #E11D48; }
.aa-chipsearch { display: inline-flex; align-items: center; gap: 8px; flex: 1; min-width: 140px; color: #65749C; }
.aa-chipsearch input { flex: 1; min-width: 0; border: 0; outline: 0; font-size: 13px; font-family: inherit; color: var(--cmp-ink); background: none; }
.aa-chipsearch input::placeholder { color: #667595; }
.aa-chipsearch.is-hidden { display: none; }
.aa-chipbox.is-modal { padding-right: 8px; } .aa-chipbox.is-modal .form-select.is-add { width: auto; height: 30px; font-size: 12.5px; }
.aa-links { display: flex; flex-direction: column; gap: 6px; }
.aa-lrowf { display: grid; grid-template-columns: 190px minmax(0, 1fr) 60px 60px auto; gap: 8px; align-items: center; }
.aa-lrowf-l { font-size: 13px; color: var(--cmp-ink); }
.aa-lbtn { height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #DCE5F2; border-radius: 7px; background: #fff; color: var(--cmp-blue); cursor: pointer; text-decoration: none; }
.aa-lbtn.is-del { width: 34px; color: #65749C; } .aa-lbtn.is-del:hover { color: #B8182B; border-color: #F3C5CB; }
.aa-addrow { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 34px; margin-top: 10px; border: 1px dashed #C9D6EA; border-radius: 8px; background: #F8FAFD; color: var(--cmp-blue); font-size: 13px; font-weight: 600; cursor: pointer; font-family: inherit; }
.aa-deals { display: flex; flex-direction: column; gap: 8px; }
.aa-dealhead, .aa-dealrow { display: grid; grid-template-columns: 146px 120px 130px 140px 138px 34px; gap: 10px; align-items: center; }
.aa-dealhead span { font-size: 12px; color: #667499; }
.aa-dealrow .aa-select.is-full { height: 38px; } .aa-dealrow .aa-select.is-full select { font-size: 13px; }
.aa-error { display: flex; align-items: center; gap: 5px; font-size: 12.5px; color: #E11D48; margin-top: 2px; }
.aa-error[hidden] { display: none; }
/* preview rail */
.aa-rail { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 16px; }
.aa-preview { padding: 18px 20px 6px; }
.aa-preview .aa-panel-head { align-items: flex-start; margin-bottom: 14px; }
.aa-ready { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 12px; background: #DFF7E9; color: #0E7A3C; font-size: 12px; font-weight: 600; white-space: nowrap; }
.aa-ready.is-warn { background: #FDEFD8; color: #9A5205; }
.aa-pv-head { display: flex; align-items: center; gap: 16px; padding-bottom: 16px; border-bottom: 1px solid #EEF2F8; }
.aa-pv-logo .brand-tile, .aa-pv-logo img { width: 72px !important; height: 72px !important; border-radius: 10px !important; }
.aa-pv-logo-empty { width: 72px; height: 72px; border-radius: 50%; background: #EEF2F8; display: inline-flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 700; color: var(--cmp-navy); letter-spacing: -.01em; }
.aa-pv-co { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 13px; color: var(--cmp-ink); } .aa-pv-co a { color: var(--cmp-blue); font-weight: 600; text-decoration: none; }
.aa-pv-group { padding: 8px 0; border-bottom: 1px solid #EEF2F8; }
.aa-pv-group.is-last { border-bottom: 0; }
.aa-pv-row { display: flex; align-items: center; gap: 12px; min-height: 35px; font-size: 13px; }
.aa-pv-row.is-top { align-items: center; }
.aa-pv-row > .icon { color: #65749C; flex: none; }
.aa-pv-k { flex: 0 0 118px; color: #667499; }
.aa-pv-v { flex: 1; min-width: 0; font-weight: 600; color: var(--cmp-navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: flex; align-items: center; gap: 8px; }
.aa-pv-v a { color: var(--cmp-blue); text-decoration: none; }
.aa-pv-v.is-mask { letter-spacing: .1em; }
.aa-pv-v.is-blue { color: var(--cmp-blue); font-weight: 600; }
.aa-pv-v .flag { width: 20px !important; height: 14px !important; border-radius: 2px; }
.aa-pv-open { display: inline-flex; color: var(--cmp-blue); }
.aa-pv-deals { display: flex; flex-direction: column; gap: 8px; padding: 2px 0 8px 28px; }
.aa-pv-deal { border-radius: 8px; background: #F5F8FD; border: 1px solid #E6EDF7; padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; }
.aa-pv-deal > div { display: flex; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 700; color: var(--cmp-navy); } .aa-pv-deal small { font-size: 12.5px; color: #667499; }
.aa-note { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; background: #EEF3FE; border: 1px solid #D6E3FA; border-radius: 12px; }
.aa-note-ic { width: 40px; height: 40px; flex: none; border-radius: 50%; background: #1668F5; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.aa-note strong { display: block; font-size: 14px; font-weight: 700; color: var(--cmp-navy); margin-bottom: 4px; }
.aa-note p { font-size: 12.5px; color: #46588A; line-height: 1.45; }
.aa-sticky { position: fixed; right: 24px; bottom: 18px; display: flex; gap: 14px; z-index: 20; }
.aa-sticky .aa-btn-ghost { background: #fff; }
.aa-sticky .aa-btn-primary { padding: 0 20px; box-shadow: 0 8px 20px rgba(22,104,245,.25); }
@media (max-width: 1280px) { .aa-cols { grid-template-columns: minmax(0, 1fr); } .aa-pcols { grid-template-columns: minmax(0, 1fr); } .aa-formlayout { grid-template-columns: minmax(0, 1fr); } .aa-rail { position: static; } .aa-strip, .aa-ptiles { grid-template-columns: repeat(3, 1fr); height: auto; } .aa-cell, .aa-ptile { padding: 12px 16px; } .aa-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .aa-stats { grid-template-columns: 1fr 1fr; height: auto; } .aa-stat { padding: 14px 18px; border-top: 1px solid #E6EDF7; } .aa-search { width: 100%; } .aa-head { flex-wrap: wrap; } .aa-head-right { align-items: flex-start; } .aa-access, .aa-snap, .aa-grid2, .aa-grid2.is-geo, .aa-settings .aa-form-grid { grid-template-columns: minmax(0, 1fr); } .aa-strip, .aa-ptiles { grid-template-columns: 1fr 1fr; } .aa-dealhead { display: none; } .aa-dealrow { grid-template-columns: 1fr 1fr; } .aa-lrowf { grid-template-columns: minmax(0, 1fr) 40px 40px 34px; } .aa-lrowf-l { grid-column: 1 / -1; } .aa-grid { grid-template-columns: minmax(0, 1fr); } .aa-sticky { left: 16px; right: 16px; justify-content: flex-end; } .aa-pager { position: static; transform: none; } }

.aa-filterbar select[name=company] { width: 96px; } .aa-filterbar select[name=website] { width: 92px; } .aa-filterbar select[name=geo] { width: 72px; } .aa-filterbar select[name=model] { width: 104px; } .aa-filterbar select[name=status] { width: 84px; }
.aa-filterbar .aa-select select { text-overflow: ellipsis; }
.aa-chart { min-height: 224px; }
/* pass 2 corrections — Affiliate Accounts */
.aa-stat-ic .icon { width: 20px; height: 20px; } .aa-cell-ic .icon { width: 24px; height: 24px; } .aa-panel-ic .icon { width: 22px; height: 22px; } .aa-abox-ic .icon, .aa-lrow-ic .icon, .aa-drow-ic .icon { width: 20px; height: 20px; } .aa-ptile-ic .icon { width: 22px; height: 22px; } .aa-note-ic .icon { width: 20px; height: 20px; } .aa-pv-logo-empty .icon, .aa-cselect-empty .icon { width: 18px; height: 18px; }
.aa-stat-badge { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.aa-stat-badge .icon { width: 12px; height: 12px; stroke-width: 3; }
.aa-stat-ic.tone-green .aa-stat-badge { background: #16A34A; } .aa-stat-ic.tone-amber .aa-stat-badge { background: #F59E0B; }
.aa-table thead th { height: 30px; }
.aa-table tbody td { height: 40px; padding: 0 8px; }
.aa-acct-id { font-size: 12.5px; } .aa-acct-login { font-size: 11px; } .aa-co { font-size: 12.5px; } .aa-terms-text { font-size: 12.5px; } .aa-terms-sub { font-size: 11px; } .aa-month-top strong, .aa-month > strong { font-size: 13px; } .aa-month-sub { font-size: 11px; }
.aa-tab { height: 30px; font-size: 12px; padding: 0 11px; } .aa-tab-n { height: 17px; font-size: 10.5px; }
.aa-tabsrow { padding-top: 14px; }
.aa-head { align-items: flex-start; }
.aa-head-right { display: flex !important; flex-direction: column !important; align-items: flex-end; gap: 16px; flex: none; }
.aa-head-actions, .aa-head-fields { position: static; display: flex; }
.aa-mtable th { height: 28px; }
/* add form density (account-add.png) */
.aa-form .aa-label { font-size: 12px; }
.aa-form .aa-f { gap: 4px; }
.aa-form .aa-input { height: 34px; font-size: 13px; }
.aa-form .aa-inputbtn .aa-input { height: 32px; } .aa-form .aa-inbtn { width: 40px; }
.aa-form .aa-select.is-full { height: 34px; } .aa-form .aa-select.is-full select { font-size: 13px; }
.aa-form .aa-cselect-btn { height: 40px; } .aa-form .aa-cselect-btn.is-sm { height: 34px; }
.aa-form .aa-chipbox { min-height: 34px; padding: 3px 34px 3px 6px; } .aa-form .aa-fchip { height: 26px; font-size: 12.5px; }
.aa-form .aa-inline .aa-btn { height: 40px; } .aa-form .aa-inline .aa-addon + .aa-btn, .aa-form .aa-inline .aa-chipbox + .aa-btn { height: 36px; }
.aa-form .aa-f + .aa-f, .aa-form .aa-grid2 + .aa-f, .aa-form .aa-f + .aa-grid2 { margin-top: 14px; }
.aa-form .aa-grid2 { gap: 14px 24px; }
.aa-form .aa-panel { padding: 18px 20px 20px; }
.aa-form .aa-panel-head { margin-bottom: 14px; }
.aa-form { gap: 14px; }
.aa-links { gap: 5px; } .aa-lrowf .aa-input.is-sm { height: 28px; } .aa-lbtn { height: 28px; }
.aa-dealrow .aa-input, .aa-dealrow .aa-select.is-full { height: 30px; } .aa-dealrow .aa-select.is-full select { font-size: 12.5px; } .aa-dealrow .aa-input { font-size: 12.5px; }
.aa-addrow { height: 30px; margin-top: 8px; }
.aa-preview .aa-panel-sub { max-width: 240px; }
/* pass 3 corrections — Affiliate Accounts */
.aa-top { padding-top: 10px; }
.aa-crumbs { padding: 22px 0 14px; }
.aa-head { padding-bottom: 0; }
.aa-dtabs { margin: 27px 0 12px; }
.aa-strip { margin-bottom: 17px; }
.aa-trend .aa-panel-head { margin-bottom: 6px; }
.aa-form .aa-f { gap: 2px; }
.aa-form .aa-label { line-height: 1.2; }
.aa-form .aa-input { height: 32px; }
.aa-form .aa-inputbtn .aa-input { height: 30px; }
.aa-form .aa-select.is-full { height: 32px; }
.aa-form .aa-cselect-btn { height: 38px; } .aa-form .aa-cselect-btn.is-sm { height: 32px; }
.aa-form .aa-chipbox { min-height: 32px; }
.aa-form .aa-inline .aa-btn { height: 38px; } .aa-form .aa-inline .aa-addon + .aa-btn, .aa-form .aa-inline .aa-chipbox + .aa-btn { height: 34px; }
.aa-form .aa-f + .aa-f, .aa-form .aa-grid2 + .aa-f, .aa-form .aa-f + .aa-grid2 { margin-top: 16px; }
.aa-form .aa-grid2 { gap: 16px 22px; }
.aa-form .aa-panel { padding: 16px 20px 16px; }
.aa-top { padding-top: 4px; }

/* =====================================================================
   Performance (CSV) v2  (design-reference-new/performance-list.png,
   performance-account-{report,history,comparative}.png)
   Reuses the Companies / Pipeline tokens (.cmp-*, .pl-*); everything here is .pf-*.
   ===================================================================== */
.page-perf .page-header { margin: 14px 0 14px; }
.page-perf .page-header .page-icon { width: 48px; height: 48px; border-radius: 12px; background: #E4EEFE; color: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; }
.page-perf .page-header .page-icon .icon { width: 26px; height: 26px; stroke-width: 2; }
.page-perf .page-header-main { gap: 12px; }
.page-perf .page-actions { gap: 16px; align-items: center; padding-top: 6px; flex: none; }
.pf-btn-lg { height: 44px; padding: 0 18px; font-size: 15px; border-radius: 10px; gap: 9px; }
.pf-btn-lg .icon { stroke-width: 2; }
.pf-btn-caret { margin-left: 4px; stroke-width: 2.2; }
.pf-page-menu .btn-icon { width: 44px; height: 44px; border: 1px solid var(--pl-line); border-radius: 10px; background: #fff; color: var(--pl-blue); opacity: 1; display: inline-flex; align-items: center; justify-content: center; }
.pf-page-menu .btn-icon:hover { background: #F7FAFF; }
.pf-muted { color: #677497; }
.pf-link { color: var(--pl-blue); font-weight: 600; font-size: 14px; }
.pf-pad { padding: 8px 0; }
.pf-h3 { font-size: 14px; font-weight: 700; color: var(--pl-navy); margin: 14px 0 8px; }
.page-perf .tone-green { color: #12904A; } .page-perf .tone-red { color: #E11D48; } .page-perf .tone-blue { color: var(--pl-blue); } .page-perf .tone-amber { color: #C2740A; }
#pf-root.is-loading { opacity: .6; pointer-events: none; transition: opacity .15s; }

/* ---- period strip --------------------------------------------------- */
.pf-period { display: flex; align-items: center; padding: 10px 16px 10px 18px; gap: 0; margin-bottom: 14px; min-height: 84px; }
.pf-period-nav { display: flex; align-items: center; gap: 10px; padding-right: 14px; border-right: 1px solid var(--pl-line-soft); }
.pf-navbtn { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--pl-line); border-radius: 9px; background: #fff; color: var(--pl-blue); }
.pf-navbtn:hover { background: #F5F9FF; }
.pf-navbtn.is-sm { width: 34px; height: 34px; }
.pf-navbtn .icon { stroke-width: 2.2; }
.pf-period-ic { width: 38px; height: 38px; border-radius: 9px; background: #E4EEFE; color: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; }
.pf-period-text { display: flex; flex-direction: column; min-width: 118px; }
.pf-period-pick { position: relative; display: inline-block; cursor: pointer; }
.pf-period-pick select { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.pf-period-title { font-size: 17px; font-weight: 700; color: var(--pl-navy); line-height: 1.2; }
.pf-period-sub { font-size: 13px; color: #6A7590; margin-top: 3px; }
.pf-period-cells { display: flex; align-items: center; flex: 1 1 auto; min-width: 0; }
.pf-cell { display: flex; align-items: center; gap: 12px; padding: 0 16px; }
.pf-cell > div { display: flex; flex-direction: column; line-height: 1.1; }
.pf-cell b { font-size: 20px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.01em; }
.pf-cell span { font-size: 13px; color: #6A7590; margin-top: 3px; white-space: nowrap; }
.pf-cell em { font-style: normal; font-size: 13.5px; font-weight: 700; margin-top: 4px; background: none !important; padding: 0; }
.pf-cell-chg { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; font-style: normal; white-space: nowrap; }
.pf-cell .pf-cell-chg small { display: inline; font-size: 13px; color: #6A7590; }
.pf-cell small { display: none; }
.pf-cell.has-ic .pf-cell-ic { width: 40px; height: 40px; border-radius: 10px; background: #E4EEFE; color: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pf-cell.has-dot .pf-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; margin-top: -26px; }
.pf-cell.has-dot { min-width: 124px; }
.pf-dot.tone-green { background: #22A55A; } .pf-dot.tone-red { background: #E11D48; }
.pf-cell.has-ic { border-right: 1px solid var(--pl-line-soft); padding-right: 18px; }
.pf-cell.has-dot + .pf-cell.has-dot { }
.pf-cell.has-dot + .pf-cell.is-money { border-left: 1px solid var(--pl-line-soft); }
.pf-cell.is-money { padding: 0 14px; min-width: 112px; }
.pf-cell.is-money .pf-delta.is-inline { font-size: 13.5px; font-weight: 700; }
.pf-cell.is-ring { margin-left: auto; padding-right: 0; border-left: 1px solid var(--pl-line-soft); padding-left: 16px; gap: 12px; }
.pf-cell.is-ring .pf-ring { flex: none; width: 56px; height: 56px; }
.pf-ring-text { font-size: 15px; font-weight: 700; fill: var(--pl-navy); font-family: var(--font); }
.pf-ring-text.is-sm { font-size: 11.5px; fill: #12904A; }
.pf-ring-text-wrap { display: flex; flex-direction: column; gap: 8px; width: 120px; flex: none; }
.pf-ring-text-wrap span { font-size: 13.5px; color: #46588A; line-height: 1.25; white-space: normal; }
.pf-bar { display: block; height: 6px; border-radius: 3px; background: #E3EBF7; overflow: hidden; }
.pf-bar b { display: block; height: 100%; border-radius: 3px; background: #16A34A; }
.pf-bar.is-blue b { background: #2F6BFF; } .pf-bar.is-light b { background: #7FA8FF; } .pf-bar.is-thick { height: 8px; border-radius: 4px; } .pf-bar.is-green b { background: #16A34A; }
.pf-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.pf-delta .icon { stroke-width: 2.6; width: 12px; height: 12px; }
.pf-delta.is-up { color: #12904A; } .pf-delta.is-down { color: #E11D48; } .pf-delta.is-flat { color: #677497; }
.pf-delta.is-pill { height: 22px; padding: 0 8px; border-radius: 6px; font-size: 12.5px; }
.pf-delta.is-pill.is-up { background: #E1F7EA; } .pf-delta.is-pill.is-down { background: #FDE8EA; } .pf-delta.is-pill.is-flat { background: #EEF2F8; }

/* ---- tabs + list ------------------------------------------------------ */
.pf-tabbar { display: flex; align-items: center; justify-content: space-between; margin: 0 0 8px; }
.pf-tabs { display: flex; gap: 6px; border-bottom: 1px solid var(--pl-line); flex: 1 1 auto; margin-right: 16px; }
.pf-tab { display: inline-flex; align-items: center; gap: 9px; height: 44px; padding: 0 20px 0 22px; font-size: 15px; font-weight: 600; color: #46588A; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.pf-tab.is-active { color: var(--pl-blue); border-bottom-color: var(--pl-blue); }
.pf-tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 22px; padding: 0 7px; border-radius: 11px; background: #E6EDF7; color: #46588A; font-size: 12.5px; font-weight: 700; }
.pf-tab.is-active .pf-tab-count { background: #DCE8FE; color: var(--pl-blue); }
.pf-summary-btn { height: 38px; padding: 0 14px; font-size: 14.5px; color: var(--pl-blue); }
.pf-summary-btn .icon { stroke-width: 2; }
.pf-listcard { border-radius: 14px; }
.pf-filters { display: flex; align-items: center; gap: 12px; padding: 12px 16px 0; }
.pf-filters .cmp-search { flex: 0 1 428px; height: 40px; border-color: var(--pl-line); background: #fff; }
.pf-select { height: 40px; }
.pf-select .cmp-select-ghost, .pf-select > select { font-size: 14.5px; font-weight: 500; }
.pf-select .pl-select-prefix { color: var(--pl-ink); }
/* prefixed selects ("Company  All"): the ghost shows the value, the native select is transparent on top */
.pf-select .pl-select-prefix + .cmp-select-ghost { visibility: visible; height: auto; line-height: 38px; padding-left: 20px; color: #6A7590; }
.pf-select .pl-select-prefix ~ select { color: transparent; }
.pf-select .pl-select-prefix ~ select option { color: var(--pl-ink); }
.pf-select.is-set .pl-select-prefix + .cmp-select-ghost { color: var(--pl-ink); }
.pf-select.is-block { display: flex; width: 100%; } .pf-select.is-block .cmp-select-ghost { display: none; } .pf-select.is-block > select { position: static; width: 100%; height: 100%; }
.pf-select.has-ic .pf-select-ic { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--pl-ink); pointer-events: none; z-index: 1; }
.pf-select.has-ic .cmp-select-ghost, .pf-select.has-ic > select { padding-left: 38px; }
.pf-morebtn { height: 40px; }
.pf-more-row { padding: 10px 16px 0; }
.pf-chiprow { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px 12px; }
.pf-chips { display: flex; gap: 13px; }
.pf-chip { display: inline-flex; align-items: center; gap: 9px; height: 34px; padding: 0 10px 0 12px; border-radius: 9px; border: 1px solid var(--pl-line); background: #fff; color: var(--pl-navy); font-size: 14.5px; font-weight: 600; white-space: nowrap; }
.pf-chip:hover { background: #F7FAFF; }
.pf-chip-ic { stroke-width: 2.2; }
.pf-chip-ic.tone-green { color: #12904A; } .pf-chip-ic.tone-red { color: #E11D48; } .pf-chip-ic.tone-amber { color: #F59E0B; }
.pf-chip-count { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 22px; padding: 0 6px; border-radius: 6px; background: #E6EDF7; color: #46588A; font-size: 13px; font-weight: 700; }
.pf-chip-count.tone-green { background: #E1F7EA; color: #12904A; } .pf-chip-count.tone-red { background: #FDE8EA; color: #E11D48; }
.pf-chip.is-active { background: var(--pl-blue); border-color: var(--pl-blue); color: #fff; }
.pf-chip.is-active .pf-chip-count { background: rgba(255,255,255,.22); color: #fff; }
.pf-chip.is-active .pf-chip-ic { color: #fff; }
.pf-chiprow-right { display: flex; align-items: center; gap: 18px; }
.pf-lastimport { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: #46588A; }
.pf-refresh { display: inline-flex; color: var(--pl-blue); }
.pf-export { height: 36px; padding: 0 16px; font-size: 14.5px; color: var(--pl-blue); }
.pf-table { min-width: 1240px; }
.pf-table col.w-sel { width: 46px; } .pf-table col.w-idx { width: 36px; } .pf-table col.w-acct { width: 118px; } .pf-table col.w-co { width: 108px; } .pf-table col.w-geo { width: 76px; } .pf-table col.w-deal { width: 96px; }
.pf-table col.w-num { width: 68px; } .pf-table col.w-money { width: 82px; } .pf-table col.w-status { width: 124px; } .pf-table col.w-upd { width: 122px; } .pf-table col.w-act { width: 62px; }
.pf-table-group col.w-gname { width: 220px; }
.pf-table thead tr.pf-group-row th { height: 22px; background: #fff; border: 0; }
.pf-table thead th.pf-group { background: #F3F7FD; border-radius: 8px 8px 0 0; border-bottom: 0; }
.pf-group-label { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; font-size: 13px; font-weight: 600; color: #46588A; }
.pf-table thead th { height: 40px; background: #F6FAFE; border-top: 1px solid var(--pl-line-soft); border-bottom: 1px solid var(--pl-line-soft); font-size: 13.5px; font-weight: 500; color: #46588A; padding: 0 6px; }
.pf-th { display: inline-flex; align-items: center; gap: 6px; color: inherit; }
.pf-th-icon { color: #65749C; stroke-width: 2; }
.pf-table thead th.is-sorted, .pf-table thead th.is-sorted .pf-th-icon { color: var(--pl-blue); }
.pf-table thead th.c-num, .pf-table tbody td.c-num { text-align: right; padding-right: 12px; }
.pf-table thead th.c-num .pf-th { justify-content: flex-end; }
.pf-table .c-sel { padding-left: 16px; } .pf-table thead th.c-sel { padding-left: 16px; }
.pf-table tbody td { height: 58px; padding: 6px 8px; border-bottom: 1px solid var(--pl-line-soft); font-size: 14px; color: var(--pl-ink); vertical-align: middle; }
.pf-table tbody td.c-idx { color: #46588A; font-size: 14px; }
.pf-row:hover { background: #F7FBFF; cursor: pointer; }
.pf-acct { display: flex; flex-direction: column; line-height: 1.2; }
.pf-acct-id { font-size: 14.5px; font-weight: 700; color: var(--pl-navy); }
.pf-acct-login { font-size: 13px; color: #6A7590; margin-top: 3px; }
.pf-co { display: flex; align-items: center; gap: 8px; }
.pf-logo { border-radius: 50% !important; flex: none; }
.pf-co-name { font-size: 14.5px; font-weight: 600; color: var(--pl-ink); white-space: nowrap; }
.pf-geo { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: var(--pl-ink); }
.pf-flag { width: 21px; height: 14px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); object-fit: cover; flex: none; }
.pf-flag-fallback { display: inline-flex; align-items: center; justify-content: center; width: 21px; height: 14px; border-radius: 3px; background: #E2E8F0; font-size: 9px; font-weight: 700; }
.pf-deal { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.pf-model { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 5px; font-size: 12.5px; font-weight: 600; }
.pf-model.tone-blue { background: #E4EEFE; color: #1D4ED8; } .pf-model.tone-amber { background: #FDF1DC; color: #B45309; } .pf-model.tone-purple { background: #EFEAFE; color: #6D28D9; } .pf-model.tone-slate { background: #E8EEF8; color: #3B4C86; } .pf-model.tone-green { background: #E1F7EA; color: #12904A; } .pf-model.tone-grey { background: #EEF2F8; color: #4B5A75; }
.pf-rate { font-size: 13px; color: #6A7590; }
.pf-table td.is-rev b { font-weight: 700; color: var(--pl-navy); }
.pf-pill { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 7px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.pf-pill .icon { stroke-width: 2.4; }
.pf-pill.tone-green { background: #E1F7EA; color: #12904A; } .pf-pill.tone-red { background: #FDE8EA; color: #E11D48; } .pf-pill.tone-amber { background: #FDF1DC; color: #C2740A; } .pf-pill.tone-grey { background: #EEF2F8; color: #4B5A75; }
.pf-pill.is-imported { height: 24px; font-size: 12.5px; }
.pf-upd { display: flex; flex-direction: column; line-height: 1.2; font-size: 13px; color: var(--pl-ink); }
.pf-upd span + span { color: #6A7590; margin-top: 3px; }
.pf-menu .btn-icon { width: 34px; height: 34px; border: 1px solid var(--pl-line); border-radius: 8px; background: #fff; color: var(--pl-ink); display: inline-flex; align-items: center; justify-content: center; }
.pf-menu .btn-icon:hover { background: #F7FAFF; }
.pf-menu.is-sm .btn-icon { width: 30px; height: 26px; border-radius: 6px; }
.pf-menu.is-plain .btn-icon { border: 0; width: 26px; height: 26px; color: #6A7590; }
.pf-foot { padding: 16px 18px 18px; }
.pf-foot .cmp-foot-info { font-size: 14.5px; }
.pf-pages .cmp-page { width: 34px; height: 34px; border-radius: 8px; }
.pf-pages .cmp-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
.pf-empty-cell { padding: 16px 12px !important; text-align: center; }

/* ---- account page header ---------------------------------------------- */
.pf-crumbs { display: flex; align-items: center; gap: 8px; margin: 12px 0 16px; font-size: 14.5px; }
.pf-crumbs a { display: inline-flex; align-items: center; gap: 8px; color: var(--pl-blue); font-weight: 500; }
.pf-crumbs .is-current { color: var(--pl-blue); font-weight: 700; }
.pf-crumb-sep { color: #677497; }
.pf-ahead { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 12px; }
.pf-ahead-logo { border-radius: 50% !important; flex: none; }
.pf-ahead-id { flex: 0 0 auto; min-width: 0; display: flex; align-items: center; gap: 12px; }
.pf-ahead-title { font-size: 30px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.02em; line-height: 1.1; }
.pf-pill.is-status { height: 26px; font-size: 13.5px; padding: 0 10px 0 8px; }
.pf-ahead-co { display: flex; align-items: center; gap: 8px; margin-top: 4px; font-size: 15px; color: var(--pl-ink); }
.pf-colink { display: inline-flex; align-items: center; gap: 4px; font-size: 15px; font-weight: 500; color: var(--pl-blue); }
.pf-ahead-sep { color: #677497; }
.pf-ahead-chips { display: flex; align-items: center; gap: 12px; margin-top: 9px; }
.pf-chip-soft { display: inline-flex; align-items: center; gap: 8px; height: 28px; padding: 0 10px; border-radius: 7px; background: #EEF3FB; color: var(--pl-ink); font-size: 13.5px; font-weight: 500; white-space: nowrap; }
.pf-chip-soft.is-blue { background: #E4EEFE; color: var(--pl-blue); font-weight: 600; }
.pf-chip-soft .pf-flag { width: 20px; height: 14px; }
.pf-chip-logo { border-radius: 4px !important; }
.pf-ahead-boxes { display: flex; gap: 10px; margin-top: 30px; }
.pf-idbox { display: flex; flex-direction: column; gap: 5px; padding: 10px 12px 11px; border-radius: 10px; background: #F3F7FD; border: 1px solid #E6EDF7; min-width: 132px; }
.pf-idbox span { font-size: 13px; color: #6A7590; }
.pf-idbox b { display: inline-flex; align-items: center; gap: 12px; font-size: 15.5px; font-weight: 700; color: var(--pl-navy); }
.pf-copy { display: inline-flex; color: var(--pl-blue); }
.pf-ahead-right { margin-left: auto; display: flex; align-items: flex-start; gap: 12px; flex: none; }
.pf-repbox { display: flex; flex-direction: column; gap: 6px; padding: 8px 10px 10px; border: 1px solid var(--pl-line); border-radius: 12px; background: #fff; margin-top: -14px; }
.pf-repbox > span { font-size: 13px; color: #6A7590; }
.pf-repnav { display: flex; align-items: center; gap: 6px; }
.pf-repsel { position: relative; display: inline-flex; align-items: center; gap: 9px; height: 34px; padding: 0 12px 0 11px; border: 1px solid var(--pl-line); border-radius: 8px; font-size: 15px; font-weight: 700; color: var(--pl-navy); background: #fff; cursor: pointer; }
.pf-repsel .icon { color: var(--pl-blue); stroke-width: 2; }
.pf-repsel select { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.pf-repsel-caret { display: none; }
.pf-ahead-right .pf-btn-lg { height: 42px; margin-top: -8px; }
.pf-ahead-right .pf-page-menu { margin-top: -8px; } .pf-ahead-right .pf-page-menu .btn-icon { height: 42px; width: 40px; }
.pf-atabs { display: flex; gap: 8px; border-bottom: 1px solid var(--pl-line); margin-bottom: 10px; }
.pf-atab { display: inline-flex; align-items: center; gap: 10px; height: 38px; padding: 0 16px; font-size: 15px; font-weight: 600; color: #46588A; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.pf-atab .icon { stroke-width: 2; }
.pf-atab.is-active { color: var(--pl-blue); border-bottom-color: var(--pl-blue); }

/* ---- cards ------------------------------------------------------------- */
.pf-card { border-radius: 14px; padding: 14px 18px; margin-bottom: 12px; }
.pf-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.pf-card-head > div { flex: 1 1 auto; min-width: 0; }
.pf-card-head h2 { font-size: 16.5px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.01em; line-height: 1.2; }
.pf-card-head p { font-size: 13.5px; color: #6A7590; margin-top: 3px; }
.pf-head-note { font-size: 13.5px; color: #6A7590; }
.pf-ic-tile { width: 46px; height: 46px; border-radius: 12px; background: #E4EEFE; color: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pf-ic-tile.is-lg { width: 60px; height: 60px; border-radius: 14px; } .pf-ic-tile.is-green { background: #E1F7EA; color: #12904A; }
.pf-ic-tile .icon { stroke-width: 2; }
.pf-ic-round { width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pf-ic-round.is-lg { width: 44px; height: 44px; }
.pf-ic-round.is-blue { background: #E4EEFE; color: var(--pl-blue); } .pf-ic-round.is-green { background: #E1F7EA; color: #12904A; } .pf-ic-round.is-red { background: #FDE8EA; color: #E11D48; } .pf-ic-round.is-purple { background: #EFEAFE; color: #6D28D9; } .pf-ic-round.is-amber { background: #FDF1DC; color: #C2740A; }
.pf-btn-sm { height: 36px; padding: 0 14px; font-size: 14px; gap: 8px; }
.pf-btn-sm.is-blue { color: var(--pl-blue); }
.pf-seg { display: inline-flex; gap: 6px; }
.pf-seg-btn { display: inline-flex; align-items: center; height: 34px; padding: 0 16px; border-radius: 8px; background: #F1F5FA; color: var(--pl-ink); font-size: 14px; font-weight: 600; }
.pf-seg-btn.is-active { background: var(--pl-blue); color: #fff; }
.pf-rangesel { height: 36px; margin-left: 4px; }

/* summary strip */
.pf-summary { display: flex; align-items: center; padding: 8px 18px; min-height: 84px; }
.pf-summary-lead { display: flex; align-items: center; gap: 12px; padding-right: 22px; border-right: 1px solid var(--pl-line-soft); }
.pf-summary-lead > div { display: flex; flex-direction: column; line-height: 1.2; }
.pf-summary-lead b { font-size: 16px; font-weight: 700; color: var(--pl-navy); }
.pf-summary-lead span { font-size: 14px; color: var(--pl-ink); margin-top: 3px; }
.pf-summary-lead em { font-style: normal; font-size: 13px; color: #6A7590; margin-top: 3px; }
.pf-summary-trend { color: #22B573; stroke-width: 2.2; margin-left: 2px; }
.pf-summary-cell { display: flex; align-items: center; gap: 12px; padding: 0 20px; flex: 1 1 0; }
.pf-summary-cell + .pf-summary-cell { border-left: 1px solid var(--pl-line-soft); }
.pf-summary-cell > div { display: flex; flex-direction: column; line-height: 1.1; }
.pf-summary-cell b { font-size: 18px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.01em; }
.pf-summary-cell span { font-size: 13.5px; color: #6A7590; margin-top: 3px; }
.pf-summary-cell .pf-delta { margin-top: 6px; align-self: flex-start; height: 24px; padding: 0 9px; border-radius: 7px; font-size: 13px; font-weight: 700; letter-spacing: .01em; }
.pf-summary-cell .pf-delta.is-up { background: #DCF5E6; color: #15803D; }
.pf-summary-cell .pf-delta.is-down { background: #FDE2E6; color: #DC2626; }
.pf-summary-cell .pf-delta .icon { width: 13px; height: 13px; stroke-width: 2.8; }

.pf-grid-report { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 14px; align-items: start; }
.pf-grid-2 { display: grid; grid-template-columns: 444fr 404fr; gap: 14px; }
.pf-funnel .pf-card-head p, .pf-traffic .pf-card-head p { white-space: nowrap; }
.pf-col-rail .pf-card:last-child { margin-bottom: 0; }
.pf-chart { position: relative; width: 100%; height: var(--h, 250px); }
.pf-svg { display: block; overflow: visible; }
.pf-grid { stroke: #E6EDF7; stroke-width: 1; stroke-dasharray: 3 3; }
.pf-grid.is-v { stroke-dasharray: 2 4; }
.pf-axis { font-family: var(--font); font-size: 12.5px; fill: #6A7590; }
.pf-axis.is-x { fill: #46588A; }
.pf-line { fill: none; stroke: #2F6BFF; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.pf-line.is-grey { stroke: #637596; }
.pf-dot { fill: #2F6BFF; stroke: #fff; stroke-width: 2; }
.pf-dot.is-grey { fill: #637596; }
.pf-dot.is-focus { r: 6; stroke: #fff; stroke-width: 3; filter: drop-shadow(0 0 0 2px rgba(47,107,255,.35)); }
.pf-marker { stroke: #2F6BFF; stroke-width: 1.4; stroke-dasharray: 4 3; opacity: 0; }
.pf-tip { position: absolute; display: none; min-width: 168px; padding: 10px 12px; background: #fff; border: 1px solid var(--pl-line); border-radius: 10px; box-shadow: 0 10px 28px rgba(15,23,42,.14); font-size: 13px; color: var(--pl-ink); pointer-events: none; z-index: 3; }
.pf-tip b { display: block; font-size: 14px; font-weight: 700; color: var(--pl-navy); margin-bottom: 6px; }
.pf-tip-row { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.pf-tip-row strong { margin-left: auto; font-weight: 700; color: var(--pl-navy); }
.pf-tip-row em { font-style: normal; color: #6A7590; }
.pf-tip-dot { width: 10px; height: 10px; border-radius: 50%; background: #2F6BFF; flex: none; }
.pf-tip-dot.is-grey { background: #B4BFD4; }
/* funnel */
.pf-funnel-steps { display: flex; align-items: flex-start; gap: 6px; padding: 2px 0 0; }
.pf-funnel-step { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; text-align: center; }
.pf-funnel-step b { font-size: 18px; font-weight: 700; color: var(--pl-navy); }
.pf-funnel-step span { font-size: 13.5px; color: #6A7590; margin-top: 2px; }
.pf-funnel-bar { display: block; width: 100%; max-width: 92px; height: 22px; border-radius: 6px; margin: 9px 0 8px; }
.pf-funnel-bar.tone-blue { background: #2F6BFF; } .pf-funnel-bar.tone-sky { background: #9DB8F5; } .pf-funnel-bar.tone-purple { background: #8B6CF2; } .pf-funnel-bar.tone-green { background: #22B573; }
.pf-funnel-step em { font-style: normal; font-size: 15px; font-weight: 700; color: var(--pl-navy); }
.pf-funnel-step small { font-size: 13px; color: #6A7590; }
.pf-funnel-step.is-last { border-left: 1px solid var(--pl-line-soft); padding-left: 6px; }
.pf-funnel-arrow { display: inline-flex; color: #6A7590; padding-top: 52px; }
/* donut + legend */
.pf-traffic-body { display: flex; align-items: center; gap: 22px; padding: 2px 0 0; }
.pf-donut { flex: none; }
.pf-donut-v { font-family: var(--font); font-size: 15px; font-weight: 700; fill: var(--pl-navy); }
.pf-donut-l { font-family: var(--font); font-size: 12.5px; fill: #6A7590; }
.pf-legend { list-style: none; margin: 0; padding: 0; flex: 1 1 auto; display: flex; flex-direction: column; gap: 7px; }
.pf-legend li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--pl-ink); }
.pf-legend li i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.pf-legend li b { margin-left: auto; font-weight: 700; color: var(--pl-navy); }
/* health */
.pf-health-table { width: 100%; border-collapse: collapse; }
.pf-health-table th { font-size: 13px; font-weight: 500; color: #6A7590; text-align: left; padding: 2px 4px 6px; border-bottom: 1px solid var(--pl-line-soft); }
.pf-health-table th:nth-child(2), .pf-health-table td:nth-child(2) { text-align: right; padding-right: 10px; }
.pf-health-table th:nth-child(3), .pf-health-table td:nth-child(3), .pf-health-table th:nth-child(4), .pf-health-table td:nth-child(4) { text-align: center; }
.pf-health-table td { padding: 1px 4px; height: 24px; font-size: 13.5px; line-height: 1.2; color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
.pf-health-table .pf-delta.is-pill { height: 20px; font-size: 12px; padding: 0 7px; }
.pf-health-table .pf-spark { height: 16px; }
.pf-health-table td.is-val { font-weight: 700; color: var(--pl-navy); }
.pf-spark { display: inline-block; width: 76px; height: 20px; }
.pf-spark-line { fill: none; stroke-width: 2; stroke-linejoin: round; }
.pf-spark-line.tone-green { stroke: #22B573; } .pf-spark-line.tone-red { stroke: #E11D48; } .pf-spark-line.tone-grey { stroke: #637596; }
.pf-insight-box { display: flex; align-items: flex-start; gap: 10px; margin-top: 12px; padding: 9px 12px; border-radius: 10px; background: #E7F8EE; color: var(--pl-navy); font-size: 13px; line-height: 1.35; }
.pf-insight-box .icon { color: #12904A; flex: none; margin-top: 1px; }
/* geo bars */
.pf-geobars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.pf-geobars li { display: grid; grid-template-columns: 24px 96px 60px 1fr 36px; align-items: center; gap: 10px; height: 20px; font-size: 13.5px; color: var(--pl-ink); }
.pf-geobar-flag { display: inline-flex; align-items: center; } .pf-geobar-flag .pf-flag { width: 20px; height: 13px; }
.pf-geobar-val { font-weight: 700; color: var(--pl-navy); text-align: right; }
.pf-geobar-pct { font-style: normal; color: #6A7590; text-align: right; }
/* monthly table */
.pf-mtable { width: 100%; border-collapse: collapse; }
.pf-mtable th { height: 34px; padding: 0 8px; background: #F6FAFE; font-size: 13px; font-weight: 500; color: #46588A; text-align: left; white-space: nowrap; }
.pf-mtable th.c-num, .pf-mtable td.c-num { text-align: right; }
.pf-mtable th.c-act, .pf-mtable td.c-act { text-align: right; padding-right: 10px; }
.pf-mtable td { height: 31px; padding: 0 7px; font-size: 13.5px; color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); white-space: nowrap; }
.pf-htable-t th, .pf-htable-t td { padding: 0 5px; font-size: 13px; }
.pf-htable-t th:first-child, .pf-htable-t td:first-child { width: 30px; padding-left: 4px; }
.pf-mtable td.is-month { font-weight: 600; color: var(--pl-navy); }
.pf-mtable td.is-rev b { font-weight: 700; color: var(--pl-navy); }
.pf-mtable .c-sel { width: 40px; padding-left: 10px; }
.pf-mtable th .pf-th { color: inherit; }

/* ---- history ------------------------------------------------------------ */
.pf-hhead { display: flex; align-items: center; padding: 8px 18px; gap: 0; min-height: 76px; }
.pf-hhead-lead { display: flex; align-items: center; gap: 14px; flex: 1 1 auto; }
.pf-hhead-lead h2 { font-size: 22px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.01em; }
.pf-hhead-lead p { font-size: 14px; color: #6A7590; margin-top: 4px; white-space: nowrap; }
.pf-hhead-cell { display: flex; align-items: center; gap: 12px; padding: 0 18px; border-left: 1px solid var(--pl-line-soft); }
.pf-hhead-cell > div { display: flex; flex-direction: column; line-height: 1.15; }
.pf-hhead-cell b { font-size: 20px; font-weight: 700; color: var(--pl-navy); }
.pf-hhead-cell span { font-size: 13.5px; color: #6A7590; margin-top: 3px; white-space: nowrap; }
.pf-hhead-ring { display: flex; align-items: center; gap: 10px; margin-left: 18px; padding: 8px 14px; border-radius: 10px; background: #E7F8EE; min-width: 214px; }
.pf-hhead-ring > div { display: flex; flex-direction: column; line-height: 1.2; }
.pf-hhead-ring b { font-size: 14.5px; font-weight: 700; color: #12904A; }
.pf-hhead-ring span { font-size: 13px; color: #46588A; margin-top: 2px; }
.pf-hcontrols { display: flex; align-items: flex-end; gap: 14px; padding: 12px 16px 14px; }
.pf-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: #46588A; }
.pf-field > span { font-size: 13px; color: #46588A; }
.pf-field > span b { color: #E11D48; margin-left: 2px; }
.pf-field .pf-select { height: 40px; }
.pf-hcontrols .pf-select { min-width: 96px; }
.pf-hsearch { flex: 0 1 280px; height: 40px; }
.pf-grid-history { display: grid; grid-template-columns: minmax(0, 1fr) 266px; gap: 14px; align-items: start; }
.pf-htable-t th { height: 30px; }
.pf-hfoot { padding: 14px 4px 4px; }
.pf-kv-list { list-style: none; margin: 0; padding: 0; }
.pf-kv-list li { display: flex; align-items: center; justify-content: space-between; padding: 8px 0; border-bottom: 1px solid var(--pl-line-soft); font-size: 14px; color: var(--pl-ink); }
.pf-kv-list li:last-child { border-bottom: 0; }
.pf-kv-list li b { font-weight: 700; color: var(--pl-navy); }
.pf-kv-list.is-plain li { padding: 7px 0; }
.pf-quality .pf-bar { margin-top: 8px; }
.pf-actions { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.pf-actions li { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.pf-actions li > div { flex: 1 1 auto; display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.pf-actions b { font-size: 14px; font-weight: 600; color: var(--pl-navy); }
.pf-actions span { font-size: 13px; color: #6A7590; margin-top: 2px; }
.pf-actions p { font-size: 13px; color: #3B4C86; margin-top: 4px; }
.pf-act-ic { color: #16A34A; display: inline-flex; flex: none; }
.pf-act-ic .icon { fill: #16A34A; stroke: #fff; }
.pf-actions.is-log li { padding: 10px 0; border-bottom: 1px solid var(--pl-line-soft); }

/* ---- comparative ---------------------------------------------------------- */
.pf-chead { display: flex; align-items: center; gap: 20px; padding: 8px 18px; min-height: 76px; }
.pf-chead-lead { display: flex; align-items: center; gap: 14px; flex: 1 1 auto; }
.pf-chead-lead h2 { font-size: 22px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.01em; }
.pf-chead-lead p { font-size: 14px; color: #6A7590; margin-top: 4px; }
.pf-chead-controls { display: flex; align-items: flex-end; gap: 14px; }
.pf-periods { display: flex; gap: 10px; }
.pf-swap { width: 40px; height: 40px; border: 1px solid var(--pl-line); border-radius: 10px; background: #fff; color: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; }
.pf-apply { height: 40px; padding: 0 20px; }
.pf-ctiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 14px; }
.pf-ctile { display: flex; align-items: center; gap: 12px; padding: 12px 14px; margin: 0; }
.pf-ctile > div { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.pf-ctile-l { font-size: 13.5px; color: #6A7590; }
.pf-ctile b { font-size: 20px; font-weight: 700; color: var(--pl-navy); margin-top: 3px; letter-spacing: -.01em; }
.pf-ctile-row { display: flex; align-items: center; gap: 8px; margin-top: 5px; white-space: nowrap; }
.pf-ctile-row em { font-style: normal; font-size: 13px; color: #6A7590; white-space: nowrap; }
.pf-ctile b { white-space: nowrap; }
.pf-grid-compare { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 14px; align-items: start; }
.pf-grid-compare2 { display: grid; grid-template-columns: minmax(0, 1fr) 570px; gap: 14px; align-items: start; }
.pf-ccard .pf-seg-btn { height: 30px; padding: 0 14px; font-size: 13.5px; }
.pf-clegend { display: flex; align-items: center; gap: 22px; margin: -2px 0 6px; font-size: 14px; color: var(--pl-ink); }
.pf-legend-item { display: inline-flex; align-items: center; gap: 8px; }
.pf-legend-item i { width: 10px; height: 10px; border-radius: 50%; } .pf-legend-item i.is-blue { background: #2F6BFF; } .pf-legend-item i.is-grey { background: #B4BFD4; }
.pf-gransel { margin-left: auto; height: 34px; }
.pf-insight-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.pf-insight-list li { display: flex; align-items: flex-start; gap: 12px; }
.pf-insight-list li > div { display: flex; flex-direction: column; line-height: 1.25; }
.pf-insight-list b { font-size: 14.5px; font-weight: 700; color: var(--pl-navy); }
.pf-insight-list b em { font-style: normal; margin-left: 4px; }
.pf-insight-list span { font-size: 13.5px; color: #6A7590; margin-top: 3px; }
.pf-btable { width: 100%; border-collapse: collapse; }
.pf-btable th { height: 30px; padding: 0 8px; background: #F6FAFE; font-size: 13px; font-weight: 500; color: #46588A; text-align: left; }
.pf-btable th.c-num, .pf-btable td.c-num { text-align: right; }
.pf-btable td { height: 25px; padding: 0 8px; font-size: 13.5px; color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
.pf-bmetric { display: inline-flex; align-items: center; gap: 8px; }
.pf-bmetric .icon { color: var(--pl-blue); }
.pf-gtable { width: 100%; border-collapse: collapse; }
.pf-gtable th { height: 30px; padding: 0 8px; background: #F6FAFE; font-size: 13px; font-weight: 500; color: #46588A; text-align: left; }
.pf-gtable td { height: 30px; padding: 0 8px; font-size: 13.5px; color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
.pf-gbar { display: inline-flex; align-items: center; gap: 8px; }
.pf-gbar b { font-weight: 600; color: var(--pl-navy); min-width: 48px; }
.pf-gbar .pf-bar { width: 90px; height: 8px; border-radius: 4px; }
.pf-geo-globe { color: #6A7590; }
.pf-psum { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0; }
.pf-psum > div { display: flex; flex-direction: column; gap: 4px; padding: 4px 16px; border-left: 1px solid var(--pl-line-soft); }
.pf-psum > div:first-child { border-left: 0; padding-left: 0; }
.pf-psum span { font-size: 13px; color: #6A7590; }
.pf-psum em { font-style: normal; font-size: 17px; color: #46588A; }
.pf-psum em.is-dark { color: var(--pl-navy); font-size: 15px; }
.pf-psum b { font-size: 22px; font-weight: 700; color: var(--pl-navy); }
.pf-psum b.is-sub { font-size: 15px; }

/* ---- notes / files / settings ------------------------------------------------ */
.pf-grid-notes { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 14px; align-items: start; }
.pf-noteform { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.pf-noteform-row { display: flex; justify-content: flex-end; gap: 10px; }
.pf-note-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pf-note { padding: 12px 14px; border: 1px solid var(--pl-line); border-radius: 10px; }
.pf-note.is-pinned { background: #FFFBEB; border-color: #FBE3B8; }
.pf-note-body { font-size: 14px; color: var(--pl-navy); line-height: 1.5; }
.pf-note-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; font-size: 12.5px; color: #677497; }
.pf-note-actions { display: inline-flex; gap: 6px; } .pf-note-actions button { color: #677497; display: inline-flex; padding: 2px; }
.pf-dropzone { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 20px; border: 1.5px dashed #C5D9FA; border-radius: 12px; background: #F8FAFF; text-align: center; color: #46588A; font-size: 13.5px; margin-bottom: 14px; }
.pf-dropzone.is-over { background: #E4EEFE; }
.pf-dropzone b { font-size: 14.5px; color: var(--pl-navy); }
.pf-dropzone .icon { color: var(--pl-blue); }
.pf-dropzone em { font-style: normal; color: var(--pl-blue); font-weight: 600; }
.pf-file-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pf-file-list li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--pl-line); border-radius: 10px; }
.pf-file-list li > div { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.pf-file-list a { font-size: 14px; font-weight: 600; color: var(--pl-navy); }
.pf-file-list li > div span { font-size: 12.5px; color: #677497; margin-top: 2px; }
.pf-file-ic { width: 36px; height: 36px; border-radius: 9px; background: #E4EEFE; color: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pf-file-del { color: #677497; }
.pf-form { display: flex; flex-direction: column; gap: 14px; }
.pf-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pf-form-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; }

/* ---- modals ---------------------------------------------------------------- */
.pf-modal-shell { width: 760px; }
.pf-modal-shell.is-import { width: 860px; }
.pf-modal { display: flex; flex-direction: column; min-height: 0; }
.pf-modal .pl-modal-body { gap: 12px; }
.pf-steps { display: flex; gap: 8px; list-style: none; margin: 0; padding: 0 20px 10px; }
.pf-steps li { display: flex; align-items: center; gap: 8px; flex: 1 1 0; padding: 8px 10px; border-radius: 8px; background: #F1F5FA; font-size: 13.5px; font-weight: 600; color: #6A7590; }
.pf-steps li b { width: 22px; height: 22px; border-radius: 50%; background: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; }
.pf-steps li.is-active { background: var(--pl-blue); color: #fff; } .pf-steps li.is-active b { color: var(--pl-blue); }
.pf-steps li.is-done { background: #E1F7EA; color: #12904A; }
.pf-step { display: flex; flex-direction: column; gap: 12px; }
.pf-maptable-wrap { max-height: 240px; overflow: auto; border: 1px solid var(--pl-line); border-radius: 10px; }
.pf-maptable { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.pf-maptable th { text-align: left; padding: 8px 10px; background: #F6FAFE; font-weight: 600; color: #46588A; font-size: 12.5px; position: sticky; top: 0; }
.pf-maptable td { padding: 6px 10px; border-top: 1px solid var(--pl-line-soft); }
.pf-maptable td.is-col { font-weight: 600; color: var(--pl-navy); }
.pf-maptable .pf-select { height: 34px; }
.pf-preview { width: 100%; border-collapse: collapse; font-size: 12.5px; white-space: nowrap; }
.pf-preview th, .pf-preview td { padding: 5px 8px; border-bottom: 1px solid var(--pl-line-soft); text-align: left; }
.pf-preview th { background: #F6FAFE; color: #46588A; font-weight: 600; }
.pf-issues { padding: 10px 12px; border-radius: 10px; background: #FFF8EC; border: 1px solid #FBE3B8; font-size: 13px; }
.pf-issues ul { margin: 6px 0 0; padding-left: 18px; }
.pf-sum-grid .summary-box { margin-bottom: 4px; }
.pf-sumtable { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.pf-sumtable th, .pf-sumtable td { padding: 6px 8px; text-align: left; border-bottom: 1px solid var(--pl-line-soft); }
.pf-sumtable th { color: #46588A; font-weight: 600; font-size: 12.5px; }
.pf-modal-text { font-size: 14px; color: var(--pl-ink); line-height: 1.5; }

/* ---- responsive -------------------------------------------------------------- */
@media (max-width: 1280px) { .pf-grid-report, .pf-grid-history, .pf-grid-compare, .pf-grid-compare2, .pf-grid-notes { grid-template-columns: 1fr; } .pf-ctiles { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 1100px) { .pf-period { flex-wrap: wrap; gap: 12px; } .pf-period-nav { border-right: 0; padding-right: 0; } .pf-period-cells { flex-wrap: wrap; gap: 10px 0; } .pf-cell.is-ring { margin-left: 0; border-left: 0; padding-left: 20px; } .pf-filters { flex-wrap: wrap; } .pf-filters .cmp-search { flex-basis: 100%; } .pf-chiprow { flex-wrap: wrap; } .pf-summary { flex-wrap: wrap; gap: 12px; } .pf-summary-lead { border: 0; } .pf-summary-cell { flex-basis: 30%; } .pf-ahead { flex-wrap: wrap; } .pf-ahead-right { margin-left: 0; } .pf-ahead-boxes { margin-left: 0; margin-top: 0; } .pf-hhead { flex-wrap: wrap; gap: 12px; } .pf-hcontrols, .pf-chead, .pf-chead-controls { flex-wrap: wrap; } .pf-atabs { overflow-x: auto; } }
@media (max-width: 760px) { .pf-grid-2 { grid-template-columns: 1fr; } .pf-ctiles { grid-template-columns: 1fr 1fr; } .pf-form-grid { grid-template-columns: 1fr; } .pf-chips { flex-wrap: wrap; } .pf-tab { padding: 0 12px; } .pf-psum { grid-template-columns: 1fr; } .pf-psum > div { border-left: 0; padding-left: 0; } .pf-funnel-steps { flex-wrap: wrap; } .pf-traffic-body { flex-direction: column; } }
@media (max-width: 760px) { .pf-tabbar { flex-wrap: wrap; gap: 8px; } .pf-tabs { margin-right: 0; flex-basis: 100%; overflow-x: auto; scrollbar-width: none; } .pf-atabs { max-width: 100%; overflow-x: auto; scrollbar-width: none; } .pf-atab { flex: none; } .pf-chead-controls { width: 100%; } .pf-periods { flex-wrap: wrap; } .page-perf .page-actions { flex-wrap: wrap; } }
.pf-health-table th:nth-child(3), .pf-health-table td:nth-child(3) { text-align: right; padding-right: 4px; }
.pf-health-table th:nth-child(2), .pf-health-table td:nth-child(2) { padding-right: 24px; }
/* ---- Manual Performance Entry page ---------------------------------------------- */
.pf-crumb-slash { color: #677497; }
.pf-mhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin: 2px 0 14px; }
.pf-mtitle { font-size: 30px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.02em; line-height: 1.15; }
.pf-msub { font-size: 15px; color: #56679A; margin-top: 4px; }
.pf-manual { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.pf-manual-main .pf-card { margin-bottom: 14px; padding: 16px 20px 16px; }
.pf-msec-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
.pf-msec-head > div { flex: 1 1 auto; }
.pf-msec-head h2 { font-size: 17px; font-weight: 700; color: var(--pl-navy); }
.pf-msec-head p { font-size: 13.5px; color: #6A7590; margin-top: 3px; }
.pf-mnum { width: 36px; height: 36px; border-radius: 50%; background: #E4EEFE; color: var(--pl-blue); font-size: 15px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.pf-me-req { font-size: 13px; color: #6A7590; white-space: nowrap; padding-top: 6px; }
.pf-me-req b { color: #E11D48; }
.pf-mgrid-2 { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; align-items: start; }
.pf-manual .pf-field > span { font-size: 13.5px; font-weight: 600; color: var(--pl-ink); }
.pf-manual .pf-help { font-style: normal; font-size: 12.5px; color: #6A7590; }
.pf-manual .pl-combo-input { height: 40px; }
.pf-manual .pl-dd { width: 100%; left: 0; }
.pf-me-sel { display: grid; grid-template-columns: 44px 1fr 1fr auto 20px; align-items: center; gap: 14px; margin-top: 10px; padding: 8px 12px 8px 10px; border: 1px solid var(--pl-line); border-radius: 10px; background: #F8FAFD; cursor: pointer; }
.pf-me-sel-id { display: flex; flex-direction: column; line-height: 1.2; border-right: 1px solid var(--pl-line); }
.pf-me-sel-id b { font-size: 15px; font-weight: 700; color: var(--pl-navy); }
.pf-me-sel-id span, .pf-me-sel-co span { font-size: 13px; color: #6A7590; margin-top: 2px; }
.pf-me-sel-co { display: flex; flex-direction: column; line-height: 1.2; }
.pf-me-sel-co b { font-size: 14px; font-weight: 600; color: var(--pl-navy); }
.pf-me-sel-co .pf-geo { font-size: 13px; color: #46588A; }
.pf-me-sel .pf-model { height: 26px; padding: 0 10px; font-size: 13px; }
.pf-me-sel-caret { color: var(--pl-ink); }
.pf-me-logo { border-radius: 9px !important; }
.pf-me-warn { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 10px; background: #FFF8E6; border: 1px solid #F8E3B0; }
.pf-me-warn > div { flex: 1 1 auto; display: flex; flex-direction: column; line-height: 1.3; }
.pf-me-warn b { font-size: 14px; color: #B45309; }
.pf-me-warn span { font-size: 13px; color: #6B5A3A; margin-top: 2px; }
.pf-me-warn-ic { color: #F59E0B; flex: none; }
.pf-mrow { display: grid; grid-template-columns: 150px 1fr; gap: 16px; padding: 10px 0; border-top: 1px solid var(--pl-line-soft); }
.pf-mrow-lead { display: flex; align-items: center; gap: 12px; font-size: 14.5px; font-weight: 700; color: var(--pl-navy); padding-top: 4px; }
.pf-mfields { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.pf-mfields .pl-input { height: 40px; }
.pf-money-in { position: relative; display: block; }
.pf-money-in i { position: absolute; left: 0; top: 0; bottom: 0; width: 34px; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 14px; color: #6A7590; border-right: 1px solid var(--pl-line); }
.pf-money-in .pl-input { padding-left: 46px; }
.pf-calc { display: grid; grid-template-columns: repeat(4, 1fr) 2fr; gap: 0; border: 1px solid var(--pl-line); border-radius: 10px; background: #F8FAFD; padding: 12px 0; }
.pf-calc-cell { display: flex; flex-direction: column; padding: 0 18px; border-right: 1px solid var(--pl-line); line-height: 1.2; }
.pf-calc-cell span { font-size: 13px; font-weight: 600; color: var(--pl-ink); }
.pf-calc-cell em { font-style: normal; font-size: 12.5px; color: #6A7590; margin-top: 2px; }
.pf-calc-cell b { font-size: 22px; font-weight: 700; color: var(--pl-navy); margin-top: 8px; }
.pf-calc-note { display: flex; align-items: center; gap: 10px; padding: 0 18px; font-size: 12.5px; color: #46588A; line-height: 1.35; }
.pf-calc-note .icon { color: #6A7590; flex: none; }
.pf-mfoot { display: flex; justify-content: flex-end; gap: 12px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--pl-line-soft); }
.pf-mfoot .pf-btn-lg { height: 42px; }
.pf-manual-rail .pf-card { padding: 16px 18px; margin-bottom: 16px; }
.pf-ic-tile.is-sm { width: 30px; height: 30px; border-radius: 8px; }
.pf-me-info-top { display: flex; align-items: center; gap: 14px; margin-bottom: 8px; }
.pf-me-info-row { display: flex; align-items: center; gap: 10px; }
.pf-me-info-row b { font-size: 18px; font-weight: 700; color: var(--pl-navy); }
.pf-me-info-login { font-size: 13px; color: #6A7590; }
.pf-me-kv li { padding: 9px 0; font-size: 13.5px; }
.pf-me-kv li > span { color: #46588A; }
.pf-me-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; }
.pf-me-info.is-empty .empty-state { padding: 8px 0; }
.pf-me-months { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pf-me-months li { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--pl-line-soft); font-size: 13.5px; color: var(--pl-ink); }
.pf-me-months li:last-child { border-bottom: 0; }
.pf-me-months li b { font-weight: 700; color: var(--pl-navy); min-width: 56px; text-align: right; }
.pf-me-help { display: flex; align-items: flex-start; gap: 12px; background: #F3F7FD; border-color: #E4EEFE; }
.pf-me-help b { font-size: 14.5px; font-weight: 700; color: var(--pl-navy); }
.pf-me-help p { font-size: 13px; color: #46588A; margin: 4px 0 8px; line-height: 1.4; }
.pf-me-help .pf-link { display: inline-flex; align-items: center; gap: 6px; }
@media (max-width: 1100px) { .pf-manual { grid-template-columns: 1fr; } .pf-mgrid-2, .pf-mfields, .pf-calc { grid-template-columns: 1fr; } .pf-mrow { grid-template-columns: 1fr; } .pf-calc-cell { border-right: 0; border-bottom: 1px solid var(--pl-line); padding: 10px 18px; } }
/* Companies / GEOs tabs: no idle gap after the name column */
.pf-table-group { min-width: 0; }
.pf-table-group col.w-idx { width: 44px; } .pf-table-group col.w-gname { width: 240px; } .pf-table-group col.w-num { width: 96px; } .pf-table-group col.w-money { width: 118px; } .pf-table-group col.w-upd { width: 150px; }
.pf-table-group thead th.c-num .pf-th, .pf-table-group thead th .pf-th.is-plain { justify-content: flex-end; width: 100%; }
.pf-table-group thead th:nth-child(2) .pf-th.is-plain, .pf-table-group thead th:last-child .pf-th.is-plain { justify-content: flex-start; }

/* =====================================================================
   Revenue & Profit v2  (design-reference-new/revenue-profit.png, revenue-add-expense.png)
   ===================================================================== */
.page-revenue .page-header .page-icon { background: #16A34A; color: #fff; }
.page-revenue .page-header .page-icon .icon { width: 24px; height: 24px; }
.page-revenue .page-header { margin: 6px 0 8px; }
.rv-btn { height: 40px; padding: 0 18px; font-size: 14.5px; gap: 9px; }
.rv-btn-sm { height: 36px; padding: 0 14px; font-size: 13.5px; gap: 8px; }
.rv-page-menu .btn-icon { width: 40px; height: 40px; }
.rv-link { display: inline-flex; align-items: center; gap: 5px; color: var(--pl-blue); font-weight: 600; font-size: 12.5px; white-space: nowrap; }
.rv-card { border-radius: 14px; padding: 12px 14px 10px; margin: 0; }
.rv-card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.rv-card-head > div { flex: 1 1 auto; min-width: 0; }
.rv-card-head > .rv-tabs { flex: none; }
.rv-card-head h2 { font-size: 15.5px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.01em; line-height: 1.2; }
.rv-card-head p { font-size: 12.5px; color: #6A7590; margin-top: 2px; }
.rv-tile { width: 28px; height: 28px; border-radius: 7px; flex: none; }
.rv-tile .icon { width: 16px; height: 16px; stroke-width: 2.4; }
.rv-tile.is-sm { width: 26px; height: 26px; border-radius: 6px; }
.rv-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 13.5px; font-weight: 700; white-space: nowrap; }
.rv-delta .icon { width: 13px; height: 13px; stroke-width: 2.6; }
.rv-delta.is-up { color: #34D399; } .rv-delta.is-down { color: #F87171; } .rv-delta.is-flat { color: #67768B; }
.rv-delta.is-exp.is-up { color: #F87171; } .rv-delta.is-exp.is-down { color: #34D399; }
.rv-delta.is-mom { font-size: 12.5px; } .rv-delta.is-mom.is-up { color: #12904A; } .rv-delta.is-mom.is-down { color: #E11D48; }
.rv-pill { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; border-radius: 5px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.rv-pill.tone-blue { background: #E4EEFE; color: #1D4ED8; } .rv-pill.tone-amber { background: #FDF1DC; color: #B45309; } .rv-pill.tone-orange { background: #FDE8DA; color: #C2410C; } .rv-pill.tone-purple { background: #EFEAFE; color: #6D28D9; } .rv-pill.tone-slate { background: #E8EEF8; color: #3B4C86; } .rv-pill.tone-grey { background: #EEF2F8; color: #4B5A75; } .rv-pill.tone-green { background: #DCF5E6; color: #15803D; }
.rv-pill.is-profit { height: 26px; padding: 0 12px; font-size: 13.5px; font-weight: 700; border-radius: 6px; }

/* hero */
.rv-hero { display: flex; align-items: center; padding: 12px 18px; border-radius: 14px; background: linear-gradient(90deg, #0F1E45 0%, #0B1636 100%); color: #fff; margin-bottom: 10px; min-height: 120px; overflow: hidden; }
.rv-hero-cell { display: flex; flex-direction: column; flex: 1 1 0; min-width: 0; }
.rv-hero-cell.is-margin { flex-direction: row; align-items: center; gap: 14px; }
.rv-hero-cell.is-margin > div { display: flex; flex-direction: column; min-width: 0; }
.rv-hero-top { display: flex; align-items: center; gap: 10px; }
.rv-hero-top > div { display: flex; flex-direction: column; line-height: 1.1; }
.rv-hero-ic { width: 44px; height: 44px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none; color: #fff; }
.rv-hero-ic .icon { width: 24px; height: 24px; stroke-width: 2.4; }
.rv-hero-pct { font-size: 24px; font-weight: 700; line-height: 1; }
.rv-hero-ic.is-blue { background: #2F5FD9; } .rv-hero-ic.is-red { background: #7F2D3F; } .rv-hero-ic.is-green { background: #1E8E5A; } .rv-hero-ic.is-purple { background: #4C5B93; }
.rv-hero-l { font-size: 13px; color: #B8C4E0; }
.rv-hero-v { font-size: 30px; font-weight: 700; letter-spacing: -.02em; margin-top: 2px; line-height: 1.05; }
.rv-hero-d { display: flex; align-items: center; gap: 10px; margin-top: 6px; white-space: nowrap; }
.rv-hero-vs { font-style: normal; font-size: 12.5px; color: #B8C4E0; margin-top: 3px; white-space: nowrap; }
.rv-hero-vs.is-inline { margin-top: 0; }
.rv-spark { display: inline-block; width: 66px; height: 24px; }
.rv-spark.is-wide { width: 72px; }
.rv-op { font-size: 28px; font-weight: 400; color: #E2E8F0; padding: 0 16px; line-height: 1; flex: none; }
.rv-hero-cell.is-profit { padding: 10px 14px; border: 1px solid #1F6F4E; border-radius: 12px; background: rgba(30,60,110,.35); margin-right: 22px; flex-grow: 1.25; }
.rv-ring { flex: none; }
.rv-hero-side { margin-left: 22px; padding-left: 20px; border-left: 1px solid rgba(255,255,255,.12); display: flex; flex-direction: column; gap: 10px; flex: 0 0 240px; }
.rv-hero-side > div { display: flex; align-items: center; gap: 10px; font-size: 13px; color: #B8C4E0; }
.rv-hero-side b { margin-left: auto; font-size: 15px; font-weight: 700; color: #fff; }
.rv-side-ic { width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; flex: none; }
.rv-side-ic .icon { stroke-width: 3; }
.rv-side-ic.is-teal { background: #14B8A6; } .rv-side-ic.is-amber { background: #D97706; } .rv-side-ic.is-blue { background: #2F6BFF; }

/* top grid */
.rv-grid-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .44fr) minmax(250px, .38fr); gap: 10px; margin-bottom: 10px; align-items: stretch; }
.rv-rangesel { height: 30px; }
.rv-rangesel .cmp-select-ghost, .rv-rangesel > select { font-size: 13px; padding: 0 30px 0 12px; }
.rv-legend { display: flex; gap: 10px; margin: 0 0 4px 40px; }
.rv-legend-pill { display: inline-flex; align-items: center; gap: 7px; height: 22px; padding: 0 10px; border-radius: 11px; background: #EEF3FB; color: var(--pl-ink); font-size: 12.5px; font-weight: 500; opacity: .45; }
.rv-legend-pill.is-on { opacity: 1; }
.rv-legend-pill i { width: 10px; height: 10px; border-radius: 50%; } .rv-legend-pill i.is-blue { background: #2F6BFF; } .rv-legend-pill i.is-green { background: #22C55E; } .rv-legend-pill i.is-orange { background: #F97316; }
.rv-chart { position: relative; width: 100%; --h: 182px; height: var(--h); }
.rv-svg { display: block; overflow: visible; }
.rv-grid { stroke: #E6EDF7; stroke-dasharray: 3 3; } .rv-grid.is-v { stroke-dasharray: 2 4; }
.rv-axis { font-family: var(--font); font-size: 11.5px; fill: #6A7590; } .rv-axis.is-x { fill: #46588A; }
.rv-line { fill: none; stroke-width: 2.5; stroke-linejoin: round; } .rv-line.is-green { stroke: #22C55E; } .rv-line.is-orange { stroke: #F97316; }
.rv-dot { stroke: #fff; stroke-width: 1.5; } .rv-dot.is-green { fill: #16A34A; } .rv-dot.is-orange { fill: #F97316; }
.rv-marker { stroke: #2F6BFF; stroke-width: 1.2; stroke-dasharray: 4 3; opacity: 0; }
.rv-tip { position: absolute; display: none; width: 158px; padding: 8px 12px 9px; background: #fff; border: 1px solid var(--pl-line); border-radius: 10px; box-shadow: 0 10px 28px rgba(15,23,42,.14); font-size: 12.5px; color: var(--pl-ink); pointer-events: none; z-index: 3; }
.rv-tip b { display: block; font-size: 13px; font-weight: 700; color: var(--pl-navy); margin-bottom: 4px; }
.rv-tip-row { display: flex; align-items: center; gap: 7px; margin-top: 2px; line-height: 1.35; }
.rv-tip-row i { width: 10px; height: 10px; border-radius: 50%; flex: none; } .rv-tip-row i.is-blue { background: #2F6BFF; } .rv-tip-row i.is-orange { background: #F97316; } .rv-tip-row i.is-green { background: #22C55E; } .rv-tip-row i.is-ring { background: #fff; border: 3px solid #2F6BFF; box-sizing: border-box; } .rv-tip-row i.is-sq { border-radius: 3px; }
.rv-tip-row strong { margin-left: auto; font-weight: 700; color: var(--pl-navy); }
.rv-tip .is-pos { color: #12904A; } .rv-tip .is-neg { color: #E11D48; }
.rv-tip-sub { margin: 6px 0 1px; padding-top: 5px; border-top: 1px solid var(--pl-line-soft); font-weight: 600; color: #46588A; }
.rv-donut-body { display: flex; align-items: center; gap: 6px; margin-top: 6px; }
.rv-donut-svg { flex: none; }
.rv-donut-v { font-family: var(--font); font-size: 14px; font-weight: 700; fill: var(--pl-navy); } .rv-donut-l { font-family: var(--font); font-size: 10.5px; fill: #6A7590; }
.rv-donut-legend { list-style: none; margin: 0; padding: 0; flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.rv-donut-legend li { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto auto; align-items: center; gap: 4px; font-size: 11px; color: var(--pl-ink); }
.rv-donut-legend li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rv-donut-legend li i { width: 9px; height: 9px; border-radius: 50%; }
.rv-dl-pct { color: #6A7590; } .rv-donut-legend b { font-weight: 700; color: var(--pl-navy); min-width: 40px; text-align: right; }
.rv-insight-list { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; }
.rv-insight-list li { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--pl-line-soft); }
.rv-insight-list li:last-child { border-bottom: 0; }
.rv-insight-list li > div { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.rv-insight-list b { font-size: 13px; font-weight: 700; color: var(--pl-navy); line-height: 1.2; }
.rv-insight-list b em { font-style: normal; background: none; padding: 0; } .rv-insight-list b em.tone-green { color: #0F8446; } .rv-insight-list b em.tone-amber { color: #B45309; }
.rv-insight-list span { font-size: 12px; color: #6A7590; margin-top: 3px; }
.rv-ins-ic { width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.rv-ins-ic .icon { stroke-width: 2.6; }
.rv-ins-ic.is-green { background: #DCF5E6; color: #15803D; } .rv-ins-ic.is-red { background: #FDE2E6; color: #DC2626; } .rv-ins-ic.is-blue { background: #E4EEFE; color: var(--pl-blue); } .rv-ins-ic.is-amber { background: #FDF1DC; color: #D97706; }

/* mid grid */
.rv-grid-mid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .92fr) minmax(0, 1.03fr); gap: 10px; margin-bottom: 10px; align-items: stretch; }
.rv-grid-mid .rv-card { padding: 12px 14px 8px; } .rv-grid-mid .rv-card-head { margin-bottom: 6px; }
.rv-mini td:nth-child(2) { width: 1%; white-space: nowrap; padding-right: 12px; }
.rv-tabs { display: inline-flex; gap: 4px; }
.rv-tab { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 7px; background: #F1F5FA; color: var(--pl-ink); font-size: 12px; font-weight: 600; white-space: nowrap; }
.rv-tab.is-active { background: var(--pl-blue); color: #fff; }
.rv-mini { width: 100%; border-collapse: collapse; }
.rv-mini th { height: 28px; padding: 0 10px; background: #F6FAFE; font-size: 12px; font-weight: 500; color: #46588A; text-align: left; }
.rv-mini th.c-num, .rv-mini td.c-num { text-align: right; }
.rv-mini td { height: 36px; padding: 0 10px; font-size: 13px; color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); white-space: nowrap; }
.rv-mini td:first-child { color: #46588A; width: 24px; }
.rv-mini td.c-bar { width: auto; padding-right: 16px; min-width: 50px; }
.rv-mini.is-compact td.c-bar { padding-right: 16px; }
.rv-drivers .rv-bar { max-width: 180px; } .rv-geos .rv-bar { max-width: 48px; } .rv-deals .rv-bar { max-width: 96px; }
.rv-mini td.is-profit { font-weight: 700; color: #12904A; font-size: 13.5px; }
.rv-ent { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--pl-navy); }
.rv-ent .pf-flag { width: 20px; height: 13px; }
.rv-logo { border-radius: 5px !important; flex: none; }
.rv-globe { color: #6A7590; }
.rv-bar { display: border-radius: 50% !important; flex: none; ius: 3px; background: #E3EBF7; overflow: hidden; }
.rv-bar b { display: block; height: 100%; border-radius: 3px; background: #16A34A; }
.rv-bar.is-dark b { background: #4B5A75; }

/* company performance table */
.rv-table-card { margin-bottom: 8px; padding: 12px 14px 8px; } .rv-table-card .rv-card-head { margin-bottom: 8px; }
.rv-table-head { flex-wrap: wrap; }
.rv-table-head > div { flex: 0 0 auto; }
.rv-table-head .rv-tabs { margin-left: 12px; }
.rv-search { flex: 0 1 152px; height: 30px; border-color: var(--pl-line); margin-left: auto; }
.rv-search input { font-size: 12.5px; }
.rv-table-head .rv-btn-sm { height: 30px; padding: 0 12px; font-size: 12.5px; }
.rv-table { width: 100%; border-collapse: collapse; min-width: 1000px; }
.rv-table th { height: 34px; padding: 0 12px; background: #F6FAFE; font-size: 12.5px; font-weight: 500; color: #46588A; text-align: left; white-space: nowrap; }
.rv-table th.c-num, .rv-table td.c-num { text-align: left; }
.rv-table td { height: 46px; padding: 0 12px; line-height: 1; font-size: 13.5px; color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); white-space: nowrap; }
.rv-table tr[data-href] { cursor: pointer; } .rv-table tr[data-href]:hover { background: #F7FBFF; }
.rv-table td:first-child { color: #46588A; }
.rv-ent-name { display: inline-flex; flex-direction: column; line-height: 1.15; } .rv-ent-name small { font-weight: 400; color: #6A7590; font-size: 11px; }
.rv-spark.is-table { width: 150px; height: 22px; }
.rv-menu .btn-icon { width: 30px; height: 28px; }
.rv-empty { text-align: center; color: #677497; padding: 16px !important; }

/* modal */
.rv-modal-shell { width: 778px; max-width: min(778px, calc(100vw - 32px)); flex: none; animation: none; align-self: flex-start; margin-top: clamp(0px, calc(100vh - 992px), 32px); padding: 0; border-radius: 16px; max-height: calc(100vh - 76px); display: flex; flex-direction: column; overflow: hidden; background: #fff; }
.modal-backdrop:has(.rv-modal-shell) { background: rgba(15,23,42,.55); padding-left: 0; }
.rv-modal { display: flex; flex-direction: column; min-height: 0; }
.rv-modal-head { display: flex; align-items: center; gap: 14px; padding: 13px 22px 11px; border-bottom: 1px solid var(--pl-line-soft); }
.rv-modal-head .rv-tile { width: 48px; height: 48px; border-radius: 12px; }
.rv-modal-head > div { flex: 1 1 auto; }
.rv-modal-title { font-size: 21px; font-weight: 700; color: var(--pl-navy); letter-spacing: -.01em; }
.rv-modal-sub { font-size: 13.5px; color: #6A7590; margin-top: 3px; }
.rv-modal-x { width: 34px; height: 34px; border: 1px solid var(--pl-line); border-radius: 8px; color: var(--pl-ink); }
.rv-modal-body { display: grid; grid-template-columns: minmax(0, 1fr) 226px; gap: 30px; padding: 14px 16px 10px 28px; overflow-y: auto; }
.rv-sec { padding-bottom: 6px; margin-bottom: 12px; border-bottom: 1px solid var(--pl-line-soft); }
.rv-sec:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.rv-sec h3 { font-size: 16px; font-weight: 700; color: var(--pl-navy); line-height: 1.2; } .rv-sec h3 b { font-weight: 700; margin-right: 4px; }
.rv-sec > p { font-size: 12.5px; color: #6A7590; margin: 2px 0 10px; }
.rv-field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.rv-field > span:first-child { font-size: 13px; font-weight: 700; color: var(--pl-ink); line-height: 1.2; }
.rv-field > span:first-child b { color: #E11D48; margin-left: 3px; } .rv-field > span:first-child small { font-weight: 400; color: #6A7590; }
.rv-row-3 { display: grid; grid-template-columns: 165px 125px 1fr; gap: 16px; }
.rv-in { position: relative; display: flex; align-items: center; }
.rv-input { width: 100%; height: 36px; padding: 0 12px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; font-size: 14px; color: var(--pl-ink); outline: none; }
.rv-input:focus { border-color: var(--pl-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.12); }
.rv-in.has-ic .rv-input { padding-left: 42px; }
.rv-in-ic { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; border-radius: 6px; background: #E4EEFE; color: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; pointer-events: none; }
.rv-in-ic .icon { width: 14px; height: 14px; }
.rv-in-ic.is-text { font-style: normal; font-weight: 700; font-size: 14px; background: none; width: auto; left: 14px; }
.rv-in.is-select .rv-input { appearance: none; -webkit-appearance: none; padding-right: 32px; cursor: pointer; }
.rv-in-caret { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: var(--pl-ink); pointer-events: none; stroke-width: 2; }
.rv-in.is-date .rv-date { color: transparent; cursor: pointer; }
.rv-in.is-date .rv-date::-webkit-calendar-picker-indicator { opacity: 0; }
.rv-date-text { position: absolute; left: 42px; top: 50%; transform: translateY(-50%); font-size: 14px; color: #667595; pointer-events: none; } .rv-date-text.is-set { color: var(--pl-ink); }
.rv-in.is-textarea { display: block; } .rv-in.is-textarea .rv-input { height: 60px; padding: 8px 12px; resize: vertical; line-height: 1.45; }
.rv-count { position: absolute; right: 12px; bottom: 8px; font-size: 12px; color: #6A7590; font-style: normal; }
.rv-help { font-style: normal; font-size: 11.5px; color: #6A7590; }
.rv-field.is-invalid .rv-input { border-color: #E11D48; }
.rv-scopes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 12px; }
.rv-scope { display: block; padding: 9px 10px 7px; border: 1px solid #DCE5F2; border-radius: 10px; background: #fff; cursor: pointer; min-height: 80px; }
.rv-scope input { position: absolute; opacity: 0; width: 0; height: 0; }
.rv-scope.is-selected { border-color: var(--pl-blue); box-shadow: 0 0 0 1px var(--pl-blue) inset; background: #F5F9FF; }
.rv-scope-ic { color: var(--pl-blue); display: inline-flex; float: left; margin: 1px 6px 0 0; }
.rv-scope b { display: block; font-size: 12.5px; font-weight: 700; color: var(--pl-navy); line-height: 1.15; } .rv-scope.is-selected b { color: #1D4ED8; }
.rv-scope small { display: block; clear: both; font-size: 10.5px; color: #6A7590; line-height: 1.2; margin-top: 3px; }
.rv-entity { margin-bottom: 6px; }
.rv-method { display: flex; align-items: flex-start; gap: 14px; padding: 9px 14px; border-radius: 10px; background: #F3F7FD; }
.rv-method > div { flex: 1 1 auto; display: flex; flex-direction: column; gap: 4px; }
.rv-method-ic { width: 44px; height: 44px; border-radius: 50%; background: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; margin-top: 6px; }
.rv-method-l { font-size: 13px; font-weight: 700; color: var(--pl-navy); }
.rv-method .rv-input { height: 32px; background: #fff; }
.rv-radios { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 10px; }
.rv-radio { display: grid; grid-template-columns: 20px 1fr; column-gap: 12px; align-items: center; padding: 5px 14px; border: 1px solid #DCE5F2; border-radius: 10px; cursor: pointer; min-height: 44px; }
.rv-radio input { position: absolute; opacity: 0; width: 0; height: 0; }
.rv-radio i { grid-row: 1 / 3; width: 20px; height: 20px; border-radius: 50%; border: 2px solid #C5D0E3; position: relative; }
.rv-radio.is-selected { border-color: var(--pl-blue); background: #F5F9FF; } .rv-radio.is-selected i { border-color: var(--pl-blue); } .rv-radio.is-selected i::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--pl-blue); }
.rv-radio b { font-size: 13px; font-weight: 700; color: var(--pl-navy); } .rv-radio.is-selected b { color: var(--pl-blue); }
.rv-radio small { font-size: 12px; color: #6A7590; }
.rv-recur { margin-bottom: 12px; }
.rv-toggle { display: flex; align-items: center; gap: 10px; cursor: pointer; flex-wrap: wrap; }
.rv-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.rv-toggle i { width: 40px; height: 22px; border-radius: 11px; background: #C5D0E3; position: relative; flex: none; transition: background .15s; }
.rv-toggle i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: left .15s; }
.rv-toggle input:checked + i { background: var(--pl-blue); } .rv-toggle input:checked + i::after { left: 21px; }
.rv-toggle b { font-size: 13px; font-weight: 700; color: var(--pl-navy); } .rv-toggle small { font-size: 12px; color: #6A7590; } .rv-toggle em { font-style: normal; font-size: 11.5px; color: #6A7590; margin-left: 6px; }
.rv-modal-rail { display: flex; flex-direction: column; gap: 12px; }
.rv-rail-card { border: 1px solid var(--pl-line); border-radius: 12px; padding: 12px 12px; background: #fff; }
.rv-rail-card header { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.rv-rail-card h4 { font-size: 15px; font-weight: 700; color: var(--pl-navy); }
.rv-preview-kind { text-align: center; font-size: 13px; font-weight: 600; color: var(--pl-blue); padding: 6px 0 10px; border-bottom: 1px solid var(--pl-line-soft); margin-bottom: 8px; }
.rv-preview-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.rv-preview-list li { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.rv-preview-list li .icon { color: var(--pl-blue); flex: none; }
.rv-preview-list li span { color: #6A7590; } .rv-preview-list li b { margin-left: auto; font-weight: 700; color: var(--pl-navy); text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 130px; }
.rv-alloc-ic { width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--pl-blue); color: var(--pl-blue); display: inline-flex; align-items: center; justify-content: center; }
.rv-alloc p { font-size: 12.5px; color: #46588A; line-height: 1.35; margin: 2px 0 10px; }
.rv-alloc-total { display: flex; align-items: center; gap: 8px; padding: 10px 10px; border-radius: 8px; background: #EEF3FB; font-size: 12.5px; font-weight: 700; color: var(--pl-navy); white-space: nowrap; }
.rv-alloc-total b { margin-left: auto; font-size: 14px; } .rv-alloc-total b.is-pct { color: var(--pl-blue); }
.rv-alloc-list { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; max-height: 150px; overflow: auto; }
.rv-alloc-list li { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--pl-ink); } .rv-alloc-list li em { font-style: normal; color: #6A7590; margin-left: auto; } .rv-alloc-list li b { min-width: 60px; text-align: right; }
.rv-alloc-note { display: flex; align-items: flex-start; gap: 6px; margin-top: 10px; padding: 9px 10px; border-radius: 8px; background: #F3F7FD; font-size: 11.5px; color: #46588A; line-height: 1.3; }
.rv-alloc-note .icon { color: var(--pl-blue); flex: none; margin-top: 1px; }
.rv-tips-ic { width: 32px; height: 32px; border-radius: 8px; background: #FDF1DC; color: #F59E0B; display: inline-flex; align-items: center; justify-content: center; }
.rv-tips ul { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.rv-tips li { display: flex; align-items: flex-start; gap: 7px; font-size: 11px; color: var(--pl-ink); line-height: 1.25; }
.rv-tips li .icon { color: var(--pl-blue); fill: var(--pl-blue); stroke: #fff; flex: none; margin-top: 1px; }
.rv-modal-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px 12px 28px; border-top: 1px solid var(--pl-line-soft); }
.rv-foot-note { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: #46588A; } .rv-foot-note .icon { color: var(--pl-blue); }
.rv-foot-actions { display: flex; gap: 9px; } .rv-foot-actions .rv-btn-sm { height: 38px; padding: 0 16px; font-size: 13.5px; }

@media (max-width: 1400px) { .rv-grid-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .rv-trend { grid-column: 1 / -1; } .rv-grid-mid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .rv-drivers { grid-column: 1 / -1; } .rv-hero-cell.is-profit { margin-right: 12px; } .rv-op { padding: 0 8px; } }
@media (max-width: 1360px) { .rv-hero { flex-wrap: wrap; gap: 14px 18px; } .rv-op { display: none; } .rv-hero-cell { flex: 1 1 200px; } .rv-hero-cell.is-profit { margin-right: 0; } .rv-hero-side { flex: 1 1 100%; margin-left: 0; padding-left: 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.12); padding-top: 12px; flex-direction: row; justify-content: space-between; gap: 16px; } .rv-hero-side > div { gap: 8px; } .rv-hero-side b { margin-left: 6px; } }
@media (max-width: 1100px) { .rv-modal-body { grid-template-columns: 1fr; } .rv-row-3, .rv-scopes, .rv-radios { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .rv-grid-top, .rv-grid-mid { grid-template-columns: 1fr; } .rv-row-3, .rv-scopes, .rv-radios { grid-template-columns: 1fr; } .rv-hero-side { flex-direction: column; gap: 8px; } .rv-table-head .rv-tabs { flex-wrap: wrap; } .rv-modal-foot { flex-direction: column; align-items: stretch; } }
.rv-xfilters { margin-bottom: 12px; }
.rv-xfilter-row { padding: 0; gap: 10px; }
.rv-xtotals { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 12px; font-size: 13px; color: #46588A; }
.rv-xtotal { display: inline-flex; align-items: center; gap: 7px; } .rv-xtotal b { color: var(--pl-navy); font-weight: 700; } .rv-xtotal.is-sum { margin-left: auto; font-weight: 600; }
.rv-cat-dot { width: 9px; height: 9px; border-radius: 50%; background: #94A3B8; } .rv-cat-dot.tone-blue { background: #2F6BFF; } .rv-cat-dot.tone-amber { background: #F59E0B; } .rv-cat-dot.tone-teal { background: #14B8A6; } .rv-cat-dot.tone-red { background: #EF4444; } .rv-cat-dot.tone-purple { background: #7C3AED; } .rv-cat-dot.tone-orange { background: #F97316; } .rv-cat-dot.tone-pink { background: #EC4899; } .rv-cat-dot.tone-slate { background: #64748B; }
.rv-xtable td { height: 40px; white-space: normal; }
.rv-mini th.c-num, .rv-mini td.c-num { width: 1%; white-space: nowrap; padding-left: 10px; }
.rv-mini th:last-child, .rv-mini td:last-child { padding-right: 12px; }
.rv-field:last-child { margin-bottom: 0; }

/* =====================================================================
   Payments & Finance (design-reference-new/payments-list.png, payments-detail-drawer.png, payments-add-payment.png)
   ===================================================================== */
.page-payments .page-header { display: none; }
.page-payments { --pay-ring-track: #D9F2E3; --pay-line: #E3E9F3; --pay-soft: #EEF2F8; --pay-ink: #16204F; --pay-navy: #0B1541; --pay-muted: #6A7CAB; --pay-blue: #1668F5; }
.page-payments .page-content { padding: 0 16px 24px 12px; }
.pay-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 8px 12px 12px; }
.pay-top-l { display: flex; align-items: center; gap: 16px; }
.pay-title-ic { width: 52px; height: 52px; border-radius: 12px; background: #1668F5; color: #fff; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 6px 14px rgba(22,104,245,.22); }
.pay-title { font-size: 24px; font-weight: 700; letter-spacing: -.02em; color: var(--pay-navy); line-height: 1.15; }
.pay-sub { font-size: 13.5px; color: #56679A; margin-top: 4px; }
.pay-top-actions { display: flex; align-items: center; gap: 10px; }
.pay-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 8px; font-size: 13.5px; font-weight: 600; white-space: nowrap; cursor: pointer; text-decoration: none; transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast); font-family: inherit; }
.pay-btn .icon { flex: none; }
.pay-btn-ghost { background: #fff; border: 1px solid #DCE5F2; color: var(--pay-ink); } .pay-btn-ghost:hover { background: #F5F8FD; }
.pay-btn-ghost.is-blue { color: var(--pay-blue); } .pay-btn-ghost.is-on { border-color: var(--pay-blue); color: var(--pay-blue); background: #EEF4FF; }
.pay-btn-primary { background: var(--pay-blue); border: 1px solid var(--pay-blue); color: #fff; } .pay-btn-primary:hover { background: #0F5AD8; }
.pay-btn.is-sm { height: 32px; padding: 0 12px; font-size: 12.5px; gap: 6px; } .pay-btn.is-icon { width: 40px; padding: 0; } .pay-btn.is-full { width: 100%; height: 40px; font-size: 14px; }
.pay-btn[disabled] { opacity: .5; pointer-events: none; }
.pay-link { color: var(--pay-blue); text-decoration: none; font-weight: 500; background: none; border: 0; cursor: pointer; font-size: inherit; font-family: inherit; display: inline-flex; align-items: center; gap: 5px; } .pay-link.is-bold { font-weight: 700; }
.pay-ibtn { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; color: var(--pay-ink); cursor: pointer; text-decoration: none; } .pay-ibtn:hover { background: #F5F8FD; }
.pay-ibtn.is-plain { border: 0; background: none; width: 30px; height: 30px; color: #46588A; }
/* stat strip */
.pay-stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin: 0 0 14px; }
.pay-stat { display: flex; align-items: center; gap: 14px; height: 100px; padding: 0 16px 0 18px; background: #fff; border: 1px solid var(--pay-line); border-radius: 12px; }
.pay-stat-ic { position: relative; width: 44px; height: 44px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.pay-stat-ic.tone-blue { background: #E4EEFE; color: #1668F5; } .pay-stat-ic.tone-green { background: #DFF7E9; color: #16A34A; } .pay-stat-ic.tone-amber { background: #FDEFD8; color: #F59E0B; } .pay-stat-ic.tone-red { background: #FDE3E6; color: #E11D48; }
.pay-stat-check { position: absolute; right: 6px; bottom: 6px; width: 14px; height: 14px; border-radius: 50%; background: #16A34A; color: #fff; display: inline-flex; align-items: center; justify-content: center; border: 2px solid #DFF7E9; } .pay-stat-check .icon { stroke-width: 3.5; }
.pay-ring { width: 52px; height: 52px; flex: none; display: inline-flex; }
.pay-stat-l { font-size: 12.5px; color: #5D6E95; }
.pay-stat-v { font-size: 22px; font-weight: 700; color: var(--pay-navy); letter-spacing: -.01em; line-height: 1.15; margin: 2px 0 3px; }
.pay-delta { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: #667499; } .pay-delta b { font-weight: 700; } .pay-delta .icon { stroke-width: 2.6; }
.pay-delta.is-good { --c: #12904A; } .pay-delta.is-bad { --c: #DC2637; } .pay-delta.is-good b, .pay-delta.is-good .icon { color: #12904A; } .pay-delta.is-bad b, .pay-delta.is-bad .icon { color: #DC2637; }
/* cards */
.pay-card { background: #fff; border: 1px solid var(--pay-line); border-radius: 12px; }
.pay-mid { display: grid; grid-template-columns: minmax(0, 1fr) 366px; gap: 15px; margin-bottom: 15px; }
.pay-card-head { display: flex; align-items: center; gap: 12px; padding: 16px 16px 6px; }
.pay-card-head > div { flex: 1; min-width: 0; }
.pay-card-ic { width: 40px; height: 40px; flex: none; border-radius: 10px; background: #EEF3FE; color: var(--pay-blue); display: inline-flex; align-items: center; justify-content: center; }
.pay-topco .pay-card-ic { width: 28px; height: 28px; border-radius: 7px; } .pay-topco .pay-card-ic .icon { width: 16px; height: 16px; }
.pay-card-title { font-size: 16px; font-weight: 700; color: var(--pay-navy); line-height: 1.2; }
.pay-topco .pay-card-title { font-size: 15px; flex: 1; }
.pay-card-sub { font-size: 12.5px; color: #667499; margin-top: 3px; }
.pay-legend { display: flex; align-items: center; gap: 16px; font-size: 12.5px; color: var(--pay-ink); margin-right: 6px; } .pay-legend span { display: inline-flex; align-items: center; gap: 7px; } .pay-legend i { width: 10px; height: 10px; border-radius: 50%; }
.pay-range .pay-btn { height: 34px; font-size: 13px; }
.pay-trend { position: relative; }
.pay-chart { padding: 4px 14px 8px; min-height: 236px; }
.pay-svg { display: block; } .pay-ax { font-size: 11px; fill: #667499; font-family: var(--font); } .pay-hit { cursor: crosshair; }
.pay-tip { position: absolute; z-index: 5; min-width: 150px; padding: 10px 12px 8px; background: #fff; border: 1px solid var(--pay-line); border-radius: 10px; box-shadow: 0 8px 24px rgba(15,23,42,.12); font-size: 12px; color: var(--pay-ink); pointer-events: none; }
.pay-tip strong { display: block; font-size: 13px; font-weight: 700; color: var(--pay-navy); margin-bottom: 6px; }
.pay-tip span { display: flex; align-items: center; gap: 7px; padding: 2px 0; color: #46588A; } .pay-tip span b { margin-left: auto; font-weight: 700; color: var(--pay-navy); padding-left: 14px; } .pay-tip i { width: 8px; height: 8px; border-radius: 50%; }
.pay-viewall { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; font-weight: 700; color: var(--pay-blue); text-decoration: none; }
.pay-toptable { width: 100%; border-collapse: collapse; margin-top: 4px; }
.pay-toptable th { height: 26px; padding: 0 12px; background: #F5F8FD; font-size: 11.5px; font-weight: 500; color: #667499; text-align: left; } .pay-toptable th.r, .pay-toptable td.r { text-align: right; padding-right: 16px; }
.pay-toptable td { height: 37px; padding: 0 12px; font-size: 13px; color: var(--pay-ink); border-bottom: 1px solid #F1F4F9; } .pay-toptable tr:last-child td { border-bottom: 0; }
.pay-toptable tbody tr { cursor: pointer; } .pay-toptable tbody tr:hover td { background: #F8FAFD; }
.pay-toptable td:first-child { width: 34px; padding-left: 16px; color: #46588A; }
.pay-toptable strong { font-size: 13.5px; font-weight: 700; color: var(--pay-navy); } .pay-toptable strong.is-red { color: #DC2637; }
.pay-co { display: inline-flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 600; color: var(--pay-ink); min-width: 0; } .pay-co > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pay-co-logo { width: 26px !important; height: 26px !important; border-radius: 50% !important; flex: none; }
/* company select in the payment list card */
.pay-tabs { display: flex; gap: 6px; padding: 10px 14px 0; border-bottom: 1px solid var(--pay-line); }
.pay-tab { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 10px; font-size: 13.5px; font-weight: 600; color: #46588A; text-decoration: none; }
.pay-tab.is-active { color: var(--pay-blue); } .pay-tab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--pay-blue); border-radius: 2px 2px 0 0; }
.pay-tab-n { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 18px; padding: 0 6px; border-radius: 9px; background: #EEF2F8; color: #46588A; font-size: 11px; font-weight: 700; }
.pay-tab.is-active .pay-tab-n { background: #E4EEFE; color: var(--pay-blue); } .pay-tab-n.tone-red { background: #FDE3E6; color: #DC2637; }
.pay-filterbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 14px 8px; }
.pay-search { display: flex; align-items: center; gap: 8px; width: 405px; height: 32px; padding: 0 12px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; color: #667595; }
.pay-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 12.5px; color: var(--pay-ink); } .pay-search input::placeholder { color: #667595; }
.pay-select { position: relative; display: inline-flex; align-items: center; height: 32px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; }
.pay-select select { appearance: none; -webkit-appearance: none; height: 100%; padding: 0 28px 0 12px; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 500; color: var(--pay-ink); cursor: pointer; outline: 0; max-width: 200px; text-overflow: ellipsis; }
.pay-select .pay-select-caret { position: absolute; right: 9px; pointer-events: none; color: #3B4C86; }
.pay-select.is-full { display: flex; width: 100%; height: 38px; } .pay-select.is-full select { flex: 1; width: 100%; max-width: none; font-size: 13.5px; padding-left: 13px; }
.pay-select.is-icon select { padding-left: 42px; } .pay-select-ic { position: absolute; left: 12px; color: var(--pay-blue); display: inline-flex; pointer-events: none; }
.pay-select.is-dot select { padding-left: 34px; } .pay-dot { position: absolute; left: 14px; width: 10px; height: 10px; border-radius: 50%; }
.pay-filterbar select[name=company] { width: 96px; } .pay-filterbar select[name=period] { width: 84px; } .pay-filterbar select[name=status] { width: 84px; } .pay-filterbar select[name=method] { width: 138px; } .pay-filterbar select[name=currency] { width: 96px; }
.pay-more { height: 32px; } .pay-morebar { flex: 1 0 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 6px 0 2px; font-size: 12.5px; color: #667499; }
.pay-mini { display: inline-flex; align-items: center; gap: 6px; } .pay-input.is-sm { height: 30px; width: 120px; font-size: 12.5px; }
.pay-chiprow { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 4px 14px 12px; }
.pay-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.pay-chip { display: inline-flex; align-items: center; gap: 8px; height: 24px; padding: 0 6px 0 10px; border-radius: 6px; background: #E8F0FE; color: #1E3A8A; font-size: 12px; font-weight: 600; }
.pay-chip-x { display: inline-flex; color: #3B4C86; } .pay-chip-x:hover { color: #E11D48; }
.pay-clear { color: var(--pay-blue); font-size: 12.5px; font-weight: 700; margin-left: 6px; text-decoration: none; }
.pay-chiprow-r { display: flex; align-items: center; gap: 10px; }
.pay-sortbtn strong { font-weight: 700; } .pay-sortbtn .icon:first-child { color: var(--pay-blue); }
.pay-colsmenu { min-width: 220px; padding: 8px; } .pay-colopt { display: flex; align-items: center; gap: 10px; padding: 6px 8px; font-size: 13px; color: var(--pay-ink); border-radius: 6px; cursor: pointer; } .pay-colopt:hover { background: #F5F8FD; }
.pay-bulkbar { display: flex; align-items: center; gap: 8px; padding: 8px 14px; background: #F3F7FE; border-top: 1px solid #DCE7F8; border-bottom: 1px solid #DCE7F8; } .pay-bulkbar[hidden] { display: none; } .pay-bulk-n { font-size: 12.5px; margin-right: 8px; }
.pay-tablewrap { overflow-x: auto; }
.pay-table { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 1080px; }
.pay-table th.c-sel, .pay-table td.c-sel { width: 42px; padding-left: 16px; } .pay-table th.c-n, .pay-table td.c-n { width: 40px; color: #46588A; } .pay-table .c-co { width: 15%; } .pay-table .c-acc { width: 12%; } .pay-table .c-period { width: 9%; } .pay-table .c-num { width: 9%; text-align: right; } .pay-table .c-due { width: 11%; } .pay-table .c-status { width: 12%; } .pay-table .c-method { width: 12%; } .pay-table .c-actions { width: 66px; text-align: right; padding-right: 14px; }
.pay-table th { height: 30px; padding: 0 10px; background: #F7F9FC; border-top: 1px solid #EEF2F8; border-bottom: 1px solid #EEF2F8; text-align: left; }
.pay-table th.c-num { text-align: right; }
.pay-th { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 500; color: #5D6E95; text-decoration: none; white-space: nowrap; } .pay-th .icon { color: #667596; } .pay-th.is-on, .pay-th.is-on .icon { color: var(--pay-blue); } .pay-th.is-right { width: 100%; justify-content: flex-end; }
.pay-table td { height: 32px; padding: 0 10px; border-bottom: 1px solid #EEF2F8; font-size: 12.5px; color: var(--pay-ink); vertical-align: middle; white-space: nowrap; } .pay-table tbody tr:last-child td { border-bottom: 0; }
.pay-table td strong { font-weight: 700; color: var(--pay-navy); font-size: 13px; }
.pay-row { cursor: pointer; } .pay-row:hover td { background: #F8FAFD; } .pay-row.is-selected td { background: #F3F7FE; }
.pay-check { position: relative; display: inline-flex; width: 16px; height: 16px; cursor: pointer; } .pay-check input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; } .pay-check span { width: 16px; height: 16px; border: 1.5px solid #C5D1E4; border-radius: 4px; background: #fff; } .pay-check input:checked + span, .pay-check input:indeterminate + span { background: var(--pay-blue); border-color: var(--pay-blue); box-shadow: inset 0 0 0 3px #fff; }
.pay-status { display: inline-flex; align-items: center; gap: 7px; height: 22px; padding: 0 9px; border-radius: 6px; font-size: 12px; font-weight: 600; white-space: nowrap; } .pay-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pay-status.tone-amber { background: #FDEFD8; color: #C2600A; } .pay-status.tone-blue { background: #E4EEFE; color: #1668F5; } .pay-status.tone-red { background: #FDE3E6; color: #DC2637; } .pay-status.tone-green { background: #DFF7E9; color: #12904A; } .pay-status.tone-purple { background: #EFE9FE; color: #7C3AED; } .pay-status.tone-grey { background: #EEF2F8; color: #667499; }
.pay-method { display: inline-flex; align-items: center; gap: 9px; font-size: 12.5px; color: var(--pay-ink); }
.pay-mark { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; font-size: 11px; font-weight: 800; line-height: 1; flex: none; } .pay-mark.is-square { border-radius: 5px; } .pay-mark b { font-weight: 800; font-style: normal; } .pay-mark .icon { stroke-width: 2.4; }
.pay-rowmenu .btn-icon { width: 26px; height: 26px; border: 0; background: none; color: #46588A; border-radius: 6px; } .pay-rowmenu .btn-icon:hover { background: #EEF2F8; }
.pay-foot { position: relative; display: flex; align-items: center; gap: 16px; padding: 14px 16px 16px; }
.pay-showing { font-size: 12.5px; color: #46588A; margin-right: auto; }
.pay-pager { position: absolute; left: 50%; transform: translateX(-50%); display: flex; gap: 5px; }
.pay-page { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #E3EBF7; border-radius: 7px; background: #fff; font-size: 12.5px; font-weight: 600; color: var(--pay-ink); text-decoration: none; } .pay-page.is-active { background: var(--pay-blue); border-color: var(--pay-blue); color: #fff; } .pay-page.is-disabled { color: #627598; pointer-events: none; } .pay-page-gap { color: #667595; }
.pay-perpage { display: inline-flex; align-items: center; gap: 10px; font-size: 12.5px; color: #46588A; margin-left: auto; } .pay-perpage .pay-select { width: 70px; height: 30px; } .pay-perpage .pay-select select { width: 100%; padding-left: 10px; }
.pay-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 36px 20px; text-align: center; color: #667499; } .pay-empty h3 { font-size: 15px; font-weight: 700; color: var(--pay-navy); } .pay-empty p { font-size: 13px; } .pay-empty.is-inline { flex-direction: row; padding: 16px; text-align: left; } .pay-empty .icon { color: #667596; flex: none; }
/* ---------- drawer ---------- */
.pay-drawer-back { position: fixed; inset: 0; background: rgba(15,23,42,.42); z-index: 80; animation: fade .15s ease; }
.pay-drawer { position: fixed; top: 0; right: 0; bottom: 0; width: 472px; max-width: 100%; background: #fff; z-index: 81; display: flex; flex-direction: column; box-shadow: -12px 0 40px rgba(15,23,42,.18); animation: slide-in .2s ease; }
.pay-drawer-loading { display: flex; align-items: center; justify-content: center; height: 100%; }
.pay-dr { display: flex; flex-direction: column; height: 100%; }
.pay-dr-head { display: flex; align-items: flex-start; gap: 16px; padding: 24px 18px 0 18px; }
.pay-dr-logo { width: 66px !important; height: 66px !important; border-radius: 10px !important; flex: none;  width: 66px !important; height: 66px !important; border-radius: 50% !important; flex: none; -weight: 700; color: var(--pay-navy); line-height: 1.15; }
.pay-dr-sub { display: flex; align-items: center; gap: 10px; margin-top: 6px; font-size: 13.5px; color: #46588A; }
.pay-dr-ref { font-size: 12.5px; color: #667499; margin-top: 5px; }
.pay-dr-tools { display: flex; gap: 4px; align-items: center; margin-top: -4px; }
.pay-dr-tabs { display: flex; gap: 22px; padding: 0 18px; margin-top: 14px; border-bottom: 1px solid var(--pay-line); }
.pay-dr-tab { position: relative; display: inline-flex; align-items: center; gap: 7px; height: 36px; font-size: 13.5px; font-weight: 600; color: #46588A; text-decoration: none; }
.pay-dr-tab.is-active { color: var(--pay-blue); } .pay-dr-tab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--pay-blue); }
.pay-dr-tab-n { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 18px; padding: 0 6px; border-radius: 9px; background: #EEF2F8; color: #46588A; font-size: 11px; font-weight: 700; }
.pay-dr-body { flex: 1; overflow-y: auto; padding: 12px 18px 16px; }
.pay-dr-card { border: 1px solid var(--pay-line); border-radius: 12px; padding: 12px 14px 12px; margin-bottom: 14px; }
.pay-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.pay-tile { border-radius: 8px; padding: 14px 10px 12px; display: flex; flex-direction: column; gap: 6px; min-height: 90px; }
.pay-tile.tone-blue { background: #EEF3FE; } .pay-tile.tone-green { background: #EAF9F0; } .pay-tile.tone-red { background: #FDECEE; } .pay-tile.tone-amber { background: #FEF6E4; }
.pay-tile-l { font-size: 12.5px; color: #5D6E95; } .pay-tile.tone-red .pay-tile-l { color: #DC2637; }
.pay-tile-v { font-size: 20px; font-weight: 700; color: var(--pay-navy); letter-spacing: -.01em; } .pay-tile.tone-red .pay-tile-v { color: #DC2637; } .pay-tile-v.is-date { font-size: 16px; }
.pay-tile-s { font-size: 12.5px; color: #46588A; }
.pay-progress-head { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; font-size: 13.5px; font-weight: 700; color: var(--pay-navy); }
.pay-progress { height: 8px; border-radius: 4px; background: #E7ECF4; margin: 10px 0 10px; overflow: hidden; } .pay-progress span { display: block; height: 100%; background: var(--pay-blue); border-radius: 4px; }
.pay-progress-sub { font-size: 12.5px; color: #667499; }
.pay-dr-h { font-size: 15px; font-weight: 700; color: var(--pay-navy); margin: 16px 0 10px; }
.pay-kv2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; } .pay-kv2 > div + div { border-left: 1px solid var(--pay-line); padding-left: 16px; }
.pay-kv { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 30px; font-size: 13px; } .pay-kv > span { color: #667499; font-size: 12.5px; } .pay-kv b { font-weight: 700; color: var(--pay-navy); text-align: right; }
.pay-acctable { width: 100%; border-collapse: collapse; } .pay-acctable th { height: 30px; padding: 0 10px; background: #F5F8FD; font-size: 12px; font-weight: 500; color: #667499; text-align: left; } .pay-acctable th.r, .pay-acctable td.r { text-align: right; }
.pay-acctable td { height: 32px; padding: 0 10px; border-bottom: 1px solid #F1F4F9; font-size: 13px; color: var(--pay-ink); } .pay-acctable td:first-child, .pay-acctable th:first-child { width: 30px; padding-left: 12px; color: #46588A; }
.pay-acctable td small { display: block; font-size: 11.5px; color: #667595; }
.pay-acc-id { font-weight: 600; color: var(--pay-ink); text-decoration: none; } .pay-acc-id:hover { color: var(--pay-blue); }
.pay-acc-total td { font-weight: 700; color: var(--pay-navy); border-bottom: 0; } .pay-acc-total td:first-child { color: var(--pay-navy); }
.pay-geo { display: inline-flex; align-items: center; gap: 8px; } .pay-geo .flag { width: 22px !important; height: 15px !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15,23,42,.06); } .pay-geo .flag-cell { display: inline-flex; }
.pay-actions { display: flex; flex-direction: column; gap: 10px; }
.pay-actions-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; } .pay-actions-grid .pay-btn { height: 36px; }
.pay-paidnote { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border-radius: 8px; background: #EAF9F0; color: #12904A; font-size: 13.5px; font-weight: 600; }
.pay-logform { border: 1px solid #DCE5F2; border-radius: 10px; padding: 14px; background: #F8FAFD; } .pay-logform h4 { font-size: 14px; font-weight: 700; color: var(--pay-navy); margin-bottom: 10px; }
.pay-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; } .pay-f { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: #46588A; } .pay-f.is-span { grid-column: 1 / -1; } .pay-f > span em { font-style: normal; color: #667595; }
.pay-input { width: 100%; height: 36px; padding: 0 12px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; font: inherit; font-size: 13px; color: var(--pay-ink); } .pay-input:focus { outline: 0; border-color: var(--pay-blue); box-shadow: 0 0 0 3px rgba(22,104,245,.15); } .pay-input.is-file { padding: 6px 12px; } .pay-textarea { height: auto; padding: 10px 12px; resize: vertical; }
.pay-input.is-invalid, .pay-cselect-btn.is-invalid, .pay-select.is-invalid, .pay-datefield.is-invalid { border-color: #E11D48 !important; box-shadow: 0 0 0 3px rgba(225,29,72,.12); }
.pay-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 10px; }
.pay-error { color: #E11D48; font-size: 12.5px; margin-right: auto; } .pay-error[hidden] { display: none; }
.pay-checklabel { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--pay-ink); cursor: pointer; } .pay-checklabel input { position: absolute; opacity: 0; } .pay-check-ui { width: 16px; height: 16px; border: 1.5px solid #C5D1E4; border-radius: 4px; background: #fff; display: inline-block; } .pay-checklabel input:checked + .pay-check-ui { background: var(--pay-blue); border-color: var(--pay-blue); box-shadow: inset 0 0 0 3px #fff; } .pay-checklabel.is-blue { color: var(--pay-blue); font-weight: 600; }
.pay-txlist, .pay-invlist, .pay-notes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pay-txlist li, .pay-invlist li { display: flex; align-items: center; gap: 12px; padding: 8px 12px; border: 1px solid var(--pay-line); border-radius: 10px; font-size: 13px; } .pay-txlist li div, .pay-invlist li div { flex: 1; min-width: 0; } .pay-txlist small, .pay-invlist small { display: block; font-size: 12px; color: #667499; margin-top: 2px; }
.pay-tx-ic { width: 32px; height: 32px; flex: none; border-radius: 50%; background: #EEF3FE; color: var(--pay-blue); display: inline-flex; align-items: center; justify-content: center; }
.pay-notes li { position: relative; padding: 12px 40px 12px 14px; border: 1px solid var(--pay-line); border-radius: 10px; font-size: 13px; } .pay-notes li.is-pinned { background: #FFFBEB; border-color: #FDE68A; } .pay-notes li small { display: block; font-size: 12px; color: #667499; margin-top: 6px; } .pay-notes li .pay-ibtn { position: absolute; right: 6px; top: 8px; }
.pay-note-static { font-size: 13px; color: #46588A; padding: 10px 12px; background: #F5F8FD; border-radius: 8px; }
.pay-dr-foot { display: flex; align-items: center; gap: 10px; padding: 12px 18px 16px; border-top: 1px solid var(--pay-line); }
.pay-followlabel { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border-radius: 8px; background: #EEF2F8; font-size: 13px; font-weight: 600; color: var(--pay-ink); }
.pay-followdate { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border: 1px solid #DCE5F2; border-radius: 8px; font-size: 13px; font-weight: 700; color: #D9760A; } .pay-followdate .icon { color: #F59E0B; }
.pay-dr-foot .pay-btn { margin-left: auto; height: 38px; }
/* ---------- modal ---------- */
.pay-modal-back { position: fixed; inset: 0; z-index: 90; background: rgba(15,23,42,.45); display: flex; align-items: flex-start; justify-content: center; padding: 30px 16px 14px; overflow: hidden; }
.pay-modal-back[hidden] { display: none; }
.pay-modal { width: 732px; max-width: 100%; max-height: calc(100vh - 44px); background: #fff; border-radius: 14px; box-shadow: 0 30px 80px rgba(15,23,42,.3); display: flex; flex-direction: column; overflow: hidden; animation: fade .15s ease; }
.pay-modal-form { display: flex; flex-direction: column; min-height: 0; max-height: inherit; }
.pay-modal-head { display: flex; align-items: center; gap: 14px; padding: 16px 20px 12px; border-bottom: 1px solid var(--pay-line); }
.pay-modal-head > div { flex: 1; }
.pay-modal-ic { width: 50px; height: 50px; border-radius: 12px; background: #EEF3FE; color: var(--pay-blue); display: inline-flex; align-items: center; justify-content: center; border: 1px solid #D6E3FA; }
.pay-modal-title { font-size: 20px; font-weight: 700; color: var(--pay-navy); line-height: 1.15; } .pay-modal-sub { font-size: 13px; color: #56679A; margin-top: 3px; }
.pay-steps { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 20px; border-bottom: 1px solid var(--pay-line); }
.pay-step { display: inline-flex; align-items: center; gap: 10px; background: none; border: 0; font: inherit; font-size: 13px; color: #46588A; cursor: pointer; }
.pay-step-n { width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid #C5D1E4; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: #667499; background: #fff; }
.pay-step.is-current { color: var(--pay-blue); font-weight: 600; } .pay-step.is-current .pay-step-n { background: var(--pay-blue); border-color: var(--pay-blue); color: #fff; } .pay-step.is-done .pay-step-n { background: #DFF7E9; border-color: #DFF7E9; color: #12904A; }
.pay-step-line { width: 56px; height: 1px; background: #C5D1E4; }
.pay-modal-body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 20px 8px; }
.pay-sec { padding: 6px 0 16px; border-bottom: 1px solid #EEF2F8; margin-bottom: 14px; } .pay-sec:last-child { border-bottom: 0; }
.pay-sec-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.pay-sec-title { font-size: 16px; font-weight: 700; color: var(--pay-navy); } .pay-sec-title b { margin-right: 4px; } .pay-sec-title small { font-size: 12.5px; font-weight: 400; color: #667499; }
.pay-sec-sub { font-size: 12.5px; color: #667499; margin: 3px 0 12px; }
.pay-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; } .pay-grid3 { display: grid; grid-template-columns: 226fr 210fr 224fr; gap: 14px 16px; }
.pay-label { font-size: 12.5px; font-weight: 600; color: var(--pay-ink); display: block; margin-bottom: 6px; } .pay-label i { color: #E11D48; font-style: normal; margin-left: 3px; }
.pay-cselect { position: relative; }
.pay-cselect-btn { display: flex; align-items: center; gap: 10px; width: 100%; height: 38px; padding: 0 12px 0 10px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; text-align: left; cursor: pointer; font: inherit; font-size: 13.5px; color: var(--pay-ink); }
.pay-cselect-logo .brand-tile, .pay-cselect-logo img { width: 30px !important; height: 22px !important; border-radius: 4px !important; }
.pay-cselect-txt strong { overflow: hidden; text-overflow: ellipsis; } .pay-sep { font-style: normal; color: #667595; margin: 0 8px; }
.pay-caret { color: #3B4C86; flex: none; }
.pay-menu { position: absolute; z-index: 5; left: 0; right: 0; top: calc(100% + 6px); background: #fff; border: 1px solid var(--pay-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(15,23,42,.14); padding: 6px; max-height: 260px; overflow: auto; }
.pay-menu-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 10px; border-radius: 7px; background: none; border: 0; text-align: left; cursor: pointer; font: inherit; } .pay-menu-item:hover { background: #F5F8FD; }
.pay-menu-item .brand-tile, .pay-menu-item > img { width: 30px !important; height: 22px !important; border-radius: 4px !important; }
.pay-menu-txt strong { font-size: 13px; font-weight: 600; color: var(--pay-navy); } .pay-menu-txt small { font-size: 11.5px; color: #667499; }
.pay-acc-editor { border: 1px solid var(--pay-line); border-radius: 8px; overflow: hidden; }
.pay-acc-editor-t { width: 100%; border-collapse: collapse; } .pay-acc-editor-t th { height: 30px; padding: 0 10px; background: #F5F8FD; font-size: 12px; font-weight: 500; color: #667499; text-align: left; } .pay-acc-editor-t th.r, .pay-acc-editor-t td.r { text-align: right; }
.pay-acc-editor-t td { height: 45px; padding: 0 10px; border-top: 1px solid #F1F4F9; font-size: 12.5px; color: var(--pay-ink); } .pay-acc-editor-t td b { display: block; font-size: 13px; font-weight: 700; color: var(--pay-navy); } .pay-acc-editor-t td small { display: block; font-size: 11.5px; color: #667595; }
.pay-acc-editor-t .c-chk { width: 40px; padding-left: 14px; } .pay-acc-editor-t tr.is-off td { opacity: .5; }
.pay-amt { width: 120px; height: 34px; text-align: left; font-weight: 600; margin-left: auto; }
.pay-sorticon { display: inline-flex; vertical-align: middle; color: #667596; margin-left: 3px; }
.pay-sum { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 10px; padding: 10px 16px; background: #F5F8FD; border: 1px solid var(--pay-line); border-radius: 8px; }
.pay-sum-n { font-size: 13px; font-weight: 700; color: var(--pay-navy); } .pay-sum-cells { display: flex; } .pay-sum-cells > div { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; padding: 0 20px; } .pay-sum-cells > div + div { border-left: 1px solid #DCE5F2; }
.pay-sum-cells span { font-size: 12.5px; color: #667499; } .pay-sum-cells b { font-size: 15px; font-weight: 700; color: var(--pay-navy); } .pay-sum-cells b.is-green { color: #12904A; }
.pay-datefield { position: relative; display: flex; align-items: center; height: 38px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; } .pay-datefield .pay-input { border: 0; height: 36px; padding-left: 42px; cursor: pointer; background: none; } .pay-datefield .pay-input:focus { box-shadow: none; } .pay-datefield .pay-select-ic { cursor: pointer; pointer-events: auto; }
.pay-hint { font-size: 12.5px; color: #667499; margin-top: 6px; } .pay-hint.is-red { color: #DC2637; }
.pay-sec-split { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; } .pay-sec-split .pay-sec-sub { margin-bottom: 0; }
.pay-modal-foot { display: flex; align-items: center; gap: 14px; padding: 12px 20px 14px; border-top: 1px solid var(--pay-line); } .pay-foot-spacer { flex: 1; }
.pay-review-head { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: #F5F8FD; border-radius: 10px; margin-bottom: 12px; } .pay-review-head > div { flex: 1; } .pay-review-head b { font-size: 15px; color: var(--pay-navy); } .pay-review-head small { display: block; font-size: 12.5px; color: #667499; } .pay-review-total { text-align: right; } .pay-review-total span { display: block; font-size: 12px; color: #667499; } .pay-review-total b { font-size: 18px; color: #12904A; }
.pay-review .pay-kv2 { margin-bottom: 12px; }
/* ---------- calendar ---------- */
.pay-cal { padding: 16px; }
.pay-cal-head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; } .pay-cal-title { font-size: 18px; font-weight: 700; color: var(--pay-navy); margin: 0 6px; }
.pay-cal-stats { display: flex; gap: 18px; margin-left: auto; font-size: 12.5px; color: #667499; } .pay-cal-stats b { color: var(--pay-navy); font-weight: 700; } .pay-cal-stats b.is-red { color: #DC2637; }
.pay-cal-legend { display: flex; gap: 12px; font-size: 12px; color: #46588A; flex: 1 0 100%; } .pay-cal-legend span { display: inline-flex; align-items: center; gap: 6px; } .pay-cal-legend i { width: 10px; height: 10px; border-radius: 3px; } .pay-cal-legend i.tone-amber { background: #F59E0B; } .pay-cal-legend i.tone-blue { background: #1668F5; } .pay-cal-legend i.tone-red { background: #E11D48; } .pay-cal-legend i.tone-green { background: #16A34A; } .pay-cal-legend i.tone-purple { background: #7C3AED; }
.pay-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); border-left: 1px solid var(--pay-line); border-top: 1px solid var(--pay-line); }
.pay-cal-dow { padding: 8px; font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: #667499; background: #F7F9FC; border-right: 1px solid var(--pay-line); border-bottom: 1px solid var(--pay-line); }
.pay-cal-cell { min-height: 108px; padding: 6px; border-right: 1px solid var(--pay-line); border-bottom: 1px solid var(--pay-line); display: flex; flex-direction: column; gap: 4px; } .pay-cal-cell.is-empty { background: #FAFBFD; } .pay-cal-cell.is-today { background: #F3F7FE; }
.pay-cal-day { font-size: 12.5px; font-weight: 600; color: #46588A; } .pay-cal-cell.is-today .pay-cal-day { color: var(--pay-blue); }
.pay-cal-ev { display: flex; align-items: center; gap: 6px; padding: 3px 6px; border-radius: 6px; font-size: 11.5px; color: var(--pay-ink); text-decoration: none; border-left: 3px solid; background: #F5F8FD; } .pay-cal-ev span { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pay-cal-ev b { font-weight: 700; }
.pay-cal-ev.tone-amber { border-color: #F59E0B; background: #FEF6E4; } .pay-cal-ev.tone-blue { border-color: #1668F5; background: #EEF3FE; } .pay-cal-ev.tone-red { border-color: #E11D48; background: #FDECEE; } .pay-cal-ev.tone-green { border-color: #16A34A; background: #EAF9F0; } .pay-cal-ev.tone-purple { border-color: #7C3AED; background: #F1ECFE; } .pay-cal-ev.tone-grey { border-color: #94A3B8; }
.pay-cal-more { font-size: 11.5px; color: var(--pay-blue); text-decoration: none; }
@media (max-width: 1280px) { .pay-stats { grid-template-columns: repeat(3, 1fr); } .pay-mid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 900px) { .pay-stats { grid-template-columns: 1fr 1fr; } .pay-search { width: 100%; } .pay-drawer { width: 100%; } .pay-tiles { grid-template-columns: 1fr 1fr; } .pay-kv2 { grid-template-columns: 1fr; } .pay-kv2 > div + div { border-left: 0; padding-left: 0; } .pay-grid2, .pay-grid3, .pay-sec-split { grid-template-columns: 1fr; } .pay-modal-back { padding: 0; } .pay-modal { max-height: 100vh; border-radius: 0; } .pay-pager { position: static; transform: none; } .pay-cal-grid { grid-template-columns: repeat(2, 1fr); } .pay-cal-dow { display: none; } }
/* pass 1 corrections — Payments */
.pay-title-ic .icon { width: 26px; height: 26px; } .pay-stat-ic .icon { width: 22px; height: 22px; } .pay-card-ic .icon { width: 22px; height: 22px; } .pay-modal-ic .icon { width: 24px; height: 24px; } .pay-topco .pay-card-ic .icon { width: 16px; height: 16px; }
.pay-card-head > .pay-legend, .pay-card-head > .pay-range, .pay-card-head > .pay-viewall { flex: none; } .pay-legend { flex-wrap: nowrap; }
.pay-filterbar select[name=company] { width: 88px; } .pay-filterbar select[name=period] { width: 78px; } .pay-filterbar select[name=status] { width: 82px; } .pay-filterbar select[name=method] { width: 128px; } .pay-filterbar select[name=currency] { width: 90px; }
.pay-step { flex-direction: row; white-space: nowrap; flex: none; } .pay-step-line { flex: none; }
.pay-checklabel.is-blue { white-space: nowrap; }

.pay-chart { position: relative; }
.pay-status.no-dot i { display: none; } .pay-status.no-dot { padding: 0 10px; height: 24px; font-size: 12.5px; }
.pay-tile { padding: 12px 8px 10px; } .pay-tile-v.is-date { font-size: 15px; white-space: nowrap; }
.pay-filterbar select[name=company] { width: 94px; }

.pay-chart { min-height: 200px; padding: 0 14px 6px; }
.pay-card-head { padding-bottom: 4px; }

/* =====================================================================
   Tracking Links (design-reference-new/links-list.png, link-add-step*.png) — prefix tl-
   ===================================================================== */
.page-links { --tl-line: #E3E9F3; --tl-soft: #EEF2F8; --tl-ink: #16204F; --tl-navy: #0B1541; --tl-muted: #6A7CAB; --tl-blue: #1668F5; --tl-green: #16A34A; }
.page-links { --sidebar-w: 194px; }
.page-links .app-main > main { padding: 0 21px 24px 17px; }
.page-links .topbar { padding: 0 21px 0 17px; } .page-links .topbar-search { width: 379px; }
.tl-page { display: block; }
.tl-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 5px 0 13px 8px; }
.tl-top-l { display: flex; align-items: center; gap: 15px; }
.tl-title-ic { width: 49px; height: 49px; border-radius: 12px; background: var(--tl-blue); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-title { font-size: 24px; font-weight: 700; letter-spacing: -.02em; color: var(--tl-navy); line-height: 1.15; margin: 0; }
.tl-sub { font-size: 13px; color: #5D6E95; margin: 4px 0 0; }
.tl-top-actions { display: flex; align-items: center; gap: 10px; }
.tl-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 8px; font-size: 13.5px; font-weight: 600; white-space: nowrap; cursor: pointer; text-decoration: none; font-family: inherit; line-height: 1; }
.tl-btn .icon { flex: none; }
.tl-btn-ghost { background: #fff; border: 1px solid #DCE5F2; color: var(--tl-ink); } .tl-btn-ghost:hover { background: #F5F8FD; }
.tl-btn-ghost.is-on { border-color: #BFD3F7; color: var(--tl-blue); background: #E8F0FE; }
.tl-btn-ghost.is-soft { background: #EEF4FF; border-color: #DCE7FB; color: var(--tl-ink); } .tl-btn-ghost.is-blue { color: var(--tl-blue); }
.tl-btn-primary { background: var(--tl-blue); border: 1px solid var(--tl-blue); color: #fff; } .tl-btn-primary:hover { background: #0F5AD8; }
.tl-btn-amber { background: #fff; border: 1px solid #F3D9A6; color: #B45309; height: 30px; padding: 0 10px; font-size: 12px; gap: 5px; }
.tl-btn.is-sm { height: 32px; padding: 0 12px; font-size: 12.5px; gap: 6px; } .tl-btn.is-icon { width: 40px; padding: 0; } .tl-btn.is-danger { color: #DC2637; }
.tl-btn[disabled] { opacity: .5; pointer-events: none; }
.tl-split { display: inline-flex; } .tl-split > .tl-btn { border-top-right-radius: 0; border-bottom-right-radius: 0; padding-right: 15px; }
.tl-split-caret { width: 40px; padding: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; border-left-color: rgba(255,255,255,.35) !important; }
.tl-ibtn { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 0; background: none; color: #657598; border-radius: 6px; cursor: pointer; }
.tl-ibtn:hover { background: #F1F5FB; color: var(--tl-ink); }
.tl-ibtn.is-box { width: 26px; height: 21px; border: 1px solid #E5F0FB; border-radius: 5px; background: #fff; color: #46588A; }
.tl-link { display: inline-flex; align-items: center; gap: 5px; color: var(--tl-blue); font-size: 13px; font-weight: 600; text-decoration: none; background: none; border: 0; cursor: pointer; font-family: inherit; }
.tl-link:hover { text-decoration: underline; }
.tl-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 12.5px; font-weight: 600; }
.tl-delta.is-up { color: var(--tl-green); } .tl-delta.is-down { color: #DC2637; } .tl-delta.is-flat { color: #67768B; }
.tl-delta em { font-style: normal; font-weight: 500; color: #69768B; margin-left: 3px; }
.tl-caret { pointer-events: none; color: #3B4C86; }
.tl-card { background: #fff; border: 1px solid var(--tl-line); border-radius: 12px; }
.tl-card-head { display: flex; align-items: center; gap: 12px; padding: 14px 16px 6px; }
.tl-card-head > div { flex: 1; min-width: 0; }
.tl-card-head.is-tight { padding: 10px 14px 6px; } .tl-card-head.is-tight .tl-card-title { flex: 1; font-size: 14px; white-space: nowrap; } .tl-card-head.is-tight .tl-msel { height: 30px; } .tl-card-head.is-tight .tl-msel select { font-size: 12px; padding: 0 24px 0 9px; }
.tl-card-ic { width: 40px; height: 40px; flex: none; border-radius: 10px; background: #EEF3FE; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; }
.tl-card-title { font-size: 15.5px; font-weight: 700; color: var(--tl-navy); line-height: 1.2; margin: 0; }
.tl-card-sub { font-size: 12px; color: #667499; margin: 3px 0 0; }
.tl-chartcard .tl-card-sub { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* stat tiles */
.tl-stats { display: grid; grid-template-columns: 150px 168px 158px 175px 181px 209px minmax(0, 1fr); gap: 8px; padding: 0 0 15px; }
.tl-stat { position: relative; display: flex; align-items: center; gap: 11px; height: 89px; padding: 0 12px 0 14px; background: #fff; border: 1px solid var(--tl-line); border-radius: 12px; }
.tl-stat-ic { width: 44px; height: 44px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.tl-stat-ic.tone-blue { background: #E4EEFE; color: #1668F5; } .tl-stat-ic.tone-green { background: #DFF7E9; color: #16A34A; } .tl-stat-ic.tone-amber { background: #FDEFD8; color: #F59E0B; } .tl-stat-ic.tone-purple { background: #EFE7FD; color: #7C3AED; }
.tl-stat-b { min-width: 0; }
.tl-stat-l { font-size: 12px; color: #5D6E95; white-space: nowrap; }
.tl-stat-v { font-size: 22px; font-weight: 700; color: var(--tl-navy); letter-spacing: -.01em; line-height: 1.15; margin: 2px 0 3px; }
.tl-stat-menu { position: absolute; top: 8px; right: 6px; }
.tl-stat-period { flex-direction: column; align-items: flex-start; justify-content: center; gap: 5px; padding: 0 12px; }
.tl-psel { position: relative; display: flex; align-items: center; width: 100%; height: 34px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; }
.tl-psel select { appearance: none; -webkit-appearance: none; width: 100%; height: 100%; padding: 0 26px 0 10px; border: 0; background: none; font: inherit; font-size: 13px; font-weight: 600; color: var(--tl-navy); cursor: pointer; outline: none; }
.tl-psel .tl-caret { position: absolute; right: 8px; }
.tl-stat-vs { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: #69768B; white-space: nowrap; }
/* row 2 */
.tl-row2 { display: grid; grid-template-columns: 721px 271px minmax(0, 1fr); gap: 12px; padding-bottom: 13px; }
.tl-chartcard .tl-card-head { padding: 10px 16px 0; }
.tl-seg { display: inline-flex; border: 1px solid #DCE5F2; border-radius: 9px; padding: 3px; gap: 2px; background: #fff; }
.tl-seg-b { height: 28px; padding: 0 10px; display: inline-flex; align-items: center; border-radius: 6px; font-size: 12.5px; font-weight: 600; color: #3B4C86; text-decoration: none; }
.tl-seg-b.is-on { background: var(--tl-blue); color: #fff; }
.tl-msel { position: relative; display: inline-flex; align-items: center; height: 32px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; }
.tl-msel select { appearance: none; -webkit-appearance: none; height: 100%; padding: 0 26px 0 11px; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 500; color: var(--tl-ink); cursor: pointer; outline: none; }
.tl-msel .tl-caret { position: absolute; right: 8px; }
.tl-msel.is-range { margin-left: 4px; } .tl-msel.is-per { height: 30px; margin: 0 4px; } .tl-msel.is-per select { padding: 0 24px 0 12px; font-weight: 600; }
.tl-chart { position: relative; height: 186px; padding: 0 12px 0 4px; }
.tl-chart > svg { display: block; width: 100%; height: 100%; overflow: visible; }
.tl-chart .axis text { font-size: 11px; fill: #69768B; font-family: inherit; }
.tl-chart .grid line { stroke: #EEF2F8; stroke-width: 1; }
.tl-chart .prevbar { fill: #DCE9FD; }
.tl-chart .line { fill: none; stroke: var(--tl-blue); stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.tl-chart .dot { fill: var(--tl-blue); } .tl-chart .dot.is-active { fill: #fff; stroke: var(--tl-blue); stroke-width: 2.4; r: 5; }
.tl-chart .marker { stroke: #A9C0EA; stroke-width: 1; stroke-dasharray: 3 3; }
.tl-chart .hit { fill: transparent; cursor: pointer; }
.tl-tip { position: absolute; z-index: 5; min-width: 132px; padding: 9px 12px 10px; background: #fff; border: 1px solid #E1E8F4; border-radius: 10px; box-shadow: 0 10px 28px rgba(15, 31, 77, .14); font-size: 12px; color: var(--tl-ink); pointer-events: none; transform: translate(-50%, calc(-100% - 14px)); }
.tl-tip::after { content: ""; position: absolute; left: 50%; bottom: -6px; width: 10px; height: 10px; background: #fff; border-right: 1px solid #E1E8F4; border-bottom: 1px solid #E1E8F4; transform: translateX(-50%) rotate(45deg); }
.tl-tip-d { font-weight: 700; font-size: 12.5px; color: var(--tl-navy); margin-bottom: 6px; }
.tl-tip-r { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 3px; } .tl-tip-r b { font-weight: 700; color: var(--tl-navy); }
.tl-tip-r i { width: 8px; height: 8px; border-radius: 50%; background: var(--tl-blue); display: inline-block; margin-right: 6px; }
.tl-tip-vs { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 6px; font-size: 11.5px; color: #667499; }
.tl-legend { display: flex; align-items: center; gap: 18px; padding: 0 18px 10px 20px; font-size: 12px; color: #4E5F8A; }
.tl-legend span { display: inline-flex; align-items: center; gap: 7px; }
.tl-legend i { width: 9px; height: 9px; border-radius: 50%; background: var(--tl-blue); } .tl-legend i.is-prev { background: #C9DCF9; }
.tl-types { padding: 6px 14px 6px; }
.tl-type { display: flex; align-items: center; gap: 10px; padding: 8px 0; text-decoration: none; color: inherit; }
.tl-type-ic { width: 30px; height: 30px; flex: none; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.tl-type-ic.tone-green { background: #DCFBEA; color: #067E36; } .tl-type-ic.tone-blue { background: #E3EFFF; color: #1668F5; } .tl-type-ic.tone-amber { background: #FDEFD8; color: #F59E0B; } .tl-type-ic.tone-slate { background: #EBF1F9; color: #1B2D68; } .tl-type-ic.tone-grey { background: #EEF2F8; color: #5D6E95; } .tl-type-ic.tone-purple { background: #EFE0FE; color: #6D28D9; } .tl-type-ic.tone-red { background: #FDE3E6; color: #DC2637; }
.tl-type-b { flex: 1; min-width: 0; }
.tl-type-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.tl-type-n { flex: 1; font-size: 12.5px; font-weight: 700; color: var(--tl-navy); }
.tl-type-row b { font-size: 12.5px; font-weight: 700; color: var(--tl-navy); min-width: 38px; text-align: right; }
.tl-type-row .tl-delta { min-width: 52px; justify-content: flex-end; font-size: 12px; }
.tl-bar { height: 5px; border-radius: 3px; background: #EEF2F8; overflow: hidden; }
.tl-bar i { display: block; height: 100%; border-radius: 3px; }
.tl-bar .bar-blue { background: linear-gradient(90deg, #1668F5, #4B8DFB); } .tl-bar .bar-purple { background: linear-gradient(90deg, #7C3AED, #A570F8); } .tl-bar .bar-amber { background: #F5A623; } .tl-bar .bar-slate { background: #8FA3C8; } .tl-bar .bar-grey { background: #A9B6CF; }
.tl-subtable { width: 100%; border-collapse: collapse; }
.tl-subtable th { background: #F4F7FC; font-size: 11.5px; font-weight: 500; color: #5D6E95; text-align: right; padding: 8px 14px; white-space: nowrap; }
.tl-subtable th:first-child, .tl-subtable td:first-child { text-align: left; padding-left: 14px; }
.tl-subtable td { font-size: 12.5px; color: var(--tl-ink); text-align: right; padding: 0 14px; border-bottom: 1px solid #EEF2F8; height: 34px; }
.tl-subtable td:first-child { font-weight: 700; color: var(--tl-navy); } .tl-subtable td a { color: inherit; text-decoration: none; }
.tl-subtable tr:last-child td { border-bottom: 0; }
.tl-subcard > .tl-link { padding: 8px 14px 12px; }
/* strip */
.tl-strip { display: grid; grid-template-columns: 204px 191px 194px minmax(0, 1fr) 290px; gap: 11px; padding-bottom: 17px; }
.tl-mini { display: flex; align-items: center; gap: 12px; padding: 0 14px; height: 77px; text-decoration: none; color: inherit; }
.tl-mini-ic { width: 40px; height: 40px; border-radius: 50%; background: #E4EEFE; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-mini-l { font-size: 12px; color: #5D6E95; } .tl-mini-v { font-size: 19px; font-weight: 700; color: var(--tl-navy); line-height: 1.1; margin: 1px 0 2px; } .tl-mini-s { font-size: 11.5px; color: #69768B; }
.tl-alert { display: flex; align-items: center; gap: 10px; padding: 0 12px; height: 77px; }
.tl-alert.is-amber { background: #FFF9EC; border-color: #F6E3B8; } .tl-alert.is-blue { background: #F5F9FE; border-color: #DCE7FB; }
.tl-alert-ic { width: 38px; height: 38px; border-radius: 50%; background: #FDEFD8; color: #F97316; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-alert-ic.is-solid { background: var(--tl-blue); color: #fff; }
.tl-alert-b { flex: 1; min-width: 0; }
.tl-alert-t { font-size: 12.5px; font-weight: 700; color: #B45309; white-space: nowrap; } .tl-alert.is-blue .tl-alert-t { color: var(--tl-navy); margin-bottom: 2px; }
.tl-alert-v { font-size: 13px; font-weight: 600; color: var(--tl-navy); margin: 2px 0; } .tl-alert-v b { font-size: 15px; margin-right: 4px; }
.tl-alert-s { font-size: 10.5px; color: #69768B; white-space: nowrap; } .tl-alert.is-blue .tl-alert-s { font-size: 12px; color: #4E5F8A; line-height: 1.45; }
/* list card */
.tl-tabsrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 12px 0 12px; border-bottom: 1px solid var(--tl-line); }
.tl-tabs { display: flex; align-items: center; gap: 6px; }
.tl-tab { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 12px; font-size: 13px; font-weight: 600; color: #46588A; text-decoration: none; }
.tl-tab.is-active { color: var(--tl-blue); } .tl-tab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--tl-blue); border-radius: 2px 2px 0 0; }
.tl-tab-n { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 18px; padding: 0 7px; border-radius: 9px; background: #EEF2F8; color: #46588A; font-size: 11px; font-weight: 700; }
.tl-tab.is-active .tl-tab-n { background: #E4EEFE; color: var(--tl-blue); }
.tl-tabsrow-r { display: flex; align-items: center; gap: 8px; padding: 6px 0; }
.tl-search { display: flex; align-items: center; gap: 8px; width: 310px; height: 34px; padding: 0 12px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; color: #69768B; }
.tl-search input { flex: 1; min-width: 0; border: 0; outline: none; background: none; font: inherit; font-size: 12.5px; color: var(--tl-ink); } .tl-search input::placeholder { color: #67768B; }
.tl-tabsrow-r .tl-btn { height: 34px; padding: 0 13px; font-size: 13px; }
.tl-colmenu { min-width: 220px; padding: 10px 12px; } .tl-colmenu-t { font-size: 11.5px; font-weight: 700; color: #69768B; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 6px; }
.tl-colopt { display: flex; align-items: center; gap: 8px; font-size: 13px; padding: 4px 0; cursor: pointer; } .tl-colmenu .tl-btn { margin-top: 8px; width: 100%; }
.tl-filters { display: flex; align-items: center; gap: 12px; padding: 9px 12px 2px; }
.tl-fsel { position: relative; display: flex; flex-direction: column; justify-content: center; width: 143px; height: 40px; padding: 4px 10px 0; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; }
.tl-fsel-l { position: absolute; top: 3px; left: 11px; font-size: 9.5px; color: #69768B; }
.tl-fsel select { appearance: none; -webkit-appearance: none; width: 100%; height: 22px; margin-top: 8px; padding: 0 18px 0 0; border: 0; background: none; font: inherit; font-size: 13px; font-weight: 600; color: var(--tl-navy); cursor: pointer; outline: none; }
.tl-fsel .tl-caret { position: absolute; right: 9px; top: 15px; }
.tl-clear { margin-left: 4px; font-size: 12.5px; }
.tl-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 9px 12px 6px; }
.tl-chip { display: inline-flex; align-items: center; gap: 7px; height: 24px; padding: 0 7px 0 10px; border-radius: 6px; background: #E8F0FE; color: #1E3A8A; font-size: 12px; font-weight: 500; } .tl-chip b { font-weight: 700; color: var(--tl-blue); }
.tl-chip-x { display: inline-flex; color: #3B4C86; } .tl-chip-x:hover { color: #E11D48; }
.tl-bulkbar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--tl-line); background: #F5F8FD; font-size: 13px; color: var(--tl-ink); }
.tl-bulkbar > span { margin-right: 6px; } .tl-bulkbar .tl-link { margin-left: auto; }
.tl-tablewrap { overflow-x: auto; max-width: 100%; min-width: 0; border-top: 1px solid var(--tl-line); }
.tl-tablewrap.is-flush { border-top: 0; }
.tl-table { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 1304px; }
.tl-table th { height: 26px; background: #F2F8FE; font-size: 11px; overflow: hidden; font-weight: 500; color: #5D6E95; text-align: left; padding: 0 4px 0 0; white-space: nowrap; }
.tl-table td { height: 34px; padding: 0 4px 0 0; font-size: 12.5px; color: var(--tl-ink); border-bottom: 1px solid #EEF2F8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tl-table tr:last-child td { border-bottom: 0; }
.tl-table .c-sel { width: 30px; padding-left: 7px; } .tl-table .c-n { width: 20px; color: #69768B; } .tl-table .c-name { width: 150px; } .tl-table .c-co { width: 88px; } .tl-table .c-acc { width: 87px; } .tl-table .c-aff { width: 77px; } .tl-table .c-sub { width: 81px; } .tl-table .c-geo { width: 69px; }
.tl-table .c-num { text-align: center; }
.tl-table .c-clicks { width: 58px; } .tl-table .c-apk { width: 65px; } .tl-table .c-regs { width: 99px; } .tl-table .c-ftds { width: 46px; } .tl-table .c-cr { width: 88px; } .tl-table .c-rev { width: 59px; } .tl-table .c-status { width: 128px; text-align: center; } .tl-table th.c-status .tl-th { justify-content: center; width: 100%; } .tl-table th.c-status { padding: 0; } .tl-table .c-upd { width: 100px; } .tl-table .c-act { width: 60px; text-align: right; padding-right: 14px; }
.tl-table th.c-num .tl-th { justify-content: center; width: 100%; }
.tl-table .c-sel input, .tl-table [data-tl-all] { width: 14px; height: 14px; border-radius: 3px; accent-color: var(--tl-blue); }
.tl-table th.c-num { padding: 0; }
.tl-th { display: inline-flex; align-items: center; gap: 4px; color: inherit; text-decoration: none; } .tl-th .tl-sort { color: #637596; } .tl-th.is-on { color: var(--tl-blue); } .tl-th.is-on .tl-sort { color: var(--tl-blue); }
.tl-table .c-acc, .tl-table .c-aff, .tl-table .c-sub { color: #46588A; }
.tl-table td.c-num { color: var(--tl-ink); } .tl-table td.c-rev b { font-weight: 700; color: var(--tl-navy); }
.tl-table .c-upd { color: #69768B; font-size: 12px; }
.tl-row.is-clickable { cursor: pointer; } .tl-row:hover td { background: #F8FAFE; }
.tl-name { display: flex; align-items: center; gap: 9px; } .tl-name .tl-type-ic { width: 26px; height: 26px; border-radius: 7px; } .tl-name > div { min-width: 0; }
.tl-name-t { font-size: 12.5px; font-weight: 700; color: var(--tl-navy); text-decoration: none; display: block; line-height: 1.2; }
.tl-name-s { font-size: 11px; color: #69768B; margin-top: 1px; }
.tl-co { display: flex; align-items: center; gap: 8px; font-weight: 600; color: var(--tl-navy); font-size: 12.5px; }
.tl-co .brand { border-radius: 5px; }
.tl-table .flag-cell { display: inline-flex; align-items: center; gap: 7 border-radius: 50%; ; color: var(--tl-ink); } .tl-table .flag { border-radius: 3px; }
.tl-dash { color: #637596; }
.tl-pill { display: inline-flex; align-items: center; gap: 6px; height: 21px; padding: 0 11px; border-radius: 6px; font-size: 12px; font-weight: 600; }
.tl-pill i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.tl-pill.tone-green { background: #DFF7E9; color: #15803D; } .tl-pill.tone-amber { background: #FDEFD8; color: #B45309; } .tl-pill.tone-grey { background: #EEF2F8; color: #5D6E95; }
.tl-empty { text-align: center; color: #69768B; font-size: 13px; padding: 24px 12px !important; white-space: normal !important; }
.tl-empty-box { display: flex; flex-direction: column; align-items: center; gap: 6px; color: #69768B; } .tl-empty-box h3 { margin: 4px 0 0; font-size: 14px; color: var(--tl-navy); } .tl-empty-box p { margin: 0; }
.tl-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px 12px; border-top: 1px solid var(--tl-line); font-size: 12.5px; color: #5D6E95; }
.tl-foot-r { display: inline-flex; align-items: center; }
.tl-pager { display: flex; align-items: center; gap: 6px; }
.tl-pg { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 30px; padding: 0 6px; border: 1px solid #DCE5F2; border-radius: 7px; background: #fff; color: var(--tl-ink); font-size: 12.5px; font-weight: 600; text-decoration: none; }
.tl-pg.is-on { background: var(--tl-blue); border-color: var(--tl-blue); color: #fff; } .tl-pg.is-off { opacity: .45; pointer-events: none; } .tl-pg.is-dots { border-color: transparent; }
/* wizard */
.tl-modal-back { position: fixed; inset: 0; z-index: 1200; background: rgba(9, 21, 48, .58); display: flex; align-items: flex-start; justify-content: center; padding: 64px 16px 40px; overflow-y: auto; }
.tl-modal { width: 1064px; max-width: 100%; background: #fff; border-radius: 16px; box-shadow: 0 30px 80px rgba(6, 18, 50, .35); }
.tl-wiz-head { display: flex; align-items: center; gap: 16px; padding: 18px 26px 12px; }
.tl-wiz-head > div { flex: 1; }
.tl-wiz-ic { width: 64px; height: 64px; border-radius: 14px; background: #EEF4FF; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-wiz-title { font-size: 21px; font-weight: 700; color: var(--tl-navy); margin: 0; letter-spacing: -.01em; }
.tl-wiz-sub { font-size: 13.5px; color: #5D6E95; margin: 5px 0 0; }
.tl-wiz-close { width: 36px; height: 36px; align-self: flex-start; color: var(--tl-navy); }
.tl-steps { display: flex; align-items: center; margin: 0 26px; padding: 18px 60px; border: 1px solid var(--tl-line); border-radius: 12px; }
.tl-step { display: flex; align-items: center; gap: 14px; background: none; border: 0; padding: 0; cursor: pointer; text-align: left; font-family: inherit; }
.tl-step-n { position: relative; width: 38px; height: 38px; border-radius: 50%; background: #E3E8F1; color: #667499; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; flex: none; }
.tl-step-n i { font-style: normal; } .tl-step-n .icon { display: none; }
.tl-step.is-current .tl-step-n { background: var(--tl-blue); color: #fff; }
.tl-step.is-done .tl-step-n { background: var(--tl-blue); color: #fff; } .tl-step.is-done .tl-step-n i { display: none; } .tl-step.is-done .tl-step-n .icon { display: block; }
.tl-step-t b { display: block; font-size: 14px; font-weight: 700; color: var(--tl-navy); } .tl-step.is-current .tl-step-t b { color: var(--tl-blue); }
.tl-step-t small { display: block; font-size: 12.5px; color: #667499; margin-top: 2px; } .tl-step.is-current .tl-step-t small { color: var(--tl-blue); }
.tl-step-line { flex: 1; height: 1px; background: #DCE5F2; margin: 0 24px; max-width: 120px; }
.tl-steps { justify-content: space-between; }
.tl-wiz-body { padding: 13px 26px 0; }
.tl-pane { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 22px; align-items: start; }
.tl-pane-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.tl-pane-side { display: flex; flex-direction: column; gap: 12px; padding-top: 10px; } .tl-pane-side.is-review { padding-top: 0; }
.tl-sec { border: 1px solid var(--tl-line); border-radius: 12px; padding: 18px 16px 18px; background: #fff; }
.tl-sec-head { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.tl-sec-head > div { flex: 1; min-width: 0; }
.tl-sec-head h3 { font-size: 17px; font-weight: 700; color: var(--tl-navy); margin: 0; } .tl-sec-head p { font-size: 13px; color: #5D6E95; margin: 3px 0 0; }
.tl-sec-ic { width: 46px; height: 46px; border-radius: 12px; background: #EEF4FF; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-sec-ic.is-green { background: #DFF7E9; color: #16A34A; }
.tl-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 26px; }
.tl-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 18px; }
.tl-grid-status { display: grid; grid-template-columns: 200px 1fr; gap: 14px 24px; margin-top: 14px; }
.tl-f { min-width: 0; }
.tl-label { display: block; font-size: 13px; color: #46588A; margin-bottom: 6px; } .tl-label i { font-style: normal; color: #E11D48; }
.tl-input { width: 100%; height: 40px; padding: 0 14px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; font: inherit; font-size: 14px; color: var(--tl-navy); outline: none; }
.tl-input:focus { border-color: var(--tl-blue); box-shadow: 0 0 0 3px rgba(22, 104, 245, .12); } .tl-input::placeholder { color: #66768E; }
.tl-input-ic { position: relative; } .tl-input-ic > span { position: absolute; left: 8px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 6px; background: #EEF4FF; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; } .tl-input-ic .tl-input { padding-left: 48px; }
.tl-textarea { height: 86px; padding: 12px 14px; resize: vertical; } .tl-esettings .tl-textarea { height: 96px; }
.tl-count { text-align: right; font-size: 12px; color: #69768B; margin-top: 4px; }
.tl-hint { font-size: 12.5px; color: #667499; margin-top: 6px; }
.tl-err { font-size: 12px; color: #DC2637; margin-top: 5px; }
.tl-f.is-invalid .tl-input, .tl-f.is-invalid .tl-cs-btn { border-color: #EF4444; }
.tl-cs { position: relative; }
.tl-cs-btn { display: flex; align-items: center; gap: 10px; width: 100%; height: 40px; padding: 0 14px; border: 1px solid #DCE5F2; border-radius: 8px; background: #fff; font: inherit; font-size: 14px; color: var(--tl-navy); cursor: pointer; text-align: left; }
.tl-cs-btn:focus { outline: none; border-color: var(--tl-blue); box-shadow: 0 0 0 3px rgba(22, 104, 245, .12); }
.tl-cs-ic { width: 28px; height: 28px; border-radius: 6px; background: #EEF4FF; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-cs-ic img.flag { width: 24px; height: 16px; border-radius: 3px; } .tl-cs-ic .brand { border-radius: 5px; } .tl-cs-ic.is-plain { background: none; width: auto; height: auto; }
.tl-cs-ic.is-dot { width: 10px; height: 10px; border-radius: 50%; background: #16A34A; margin: 0 4px; } .tl-cs-ic.is-dot.tone-amber { background: #F59E0B; }
.tl-cs-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tl-cs-txt.is-ph { color: #66768E; }
.tl-cs.is-status .tl-cs-btn { padding-left: 8px; } .tl-cs-pill { display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px; border-radius: 7px; background: #DFF7E9; color: #15803D; font-weight: 600; font-size: 13.5px; } .tl-cs-pill i { width: 9px; height: 9px; border-radius: 50%; background: currentColor; } .tl-cs-pill.tone-amber { background: #FDEFD8; color: #B45309; }
.tl-cs-menu { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 30; max-height: 260px; overflow-y: auto; background: #fff; border: 1px solid #DCE5F2; border-radius: 10px; box-shadow: 0 12px 32px rgba(15, 31, 77, .14); padding: 6px; }
.tl-cs-opt { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 0; background: none; border-radius: 7px; font: inherit; font-size: 13.5px; color: var(--tl-navy); cursor: pointer; text-align: left; }
.tl-cs-opt:hover, .tl-cs-opt.is-on { background: #EEF4FF; } .tl-cs-opt small { color: #69768B; margin-left: auto; font-size: 12px; }
.tl-cs-search { width: 100%; height: 34px; margin-bottom: 6px; padding: 0 10px; border: 1px solid #DCE5F2; border-radius: 7px; font: inherit; font-size: 13px; outline: none; }
.tl-cs-empty { padding: 10px; font-size: 12.5px; color: #69768B; }
.tl-deal { margin-top: 14px; padding: 12px 16px 14px; border-radius: 10px; background: #F3F7FE; }
.tl-deal-t { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; color: var(--tl-navy); margin-bottom: 12px; } .tl-deal-t .icon { color: var(--tl-blue); }
.tl-deal-grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.tl-deal-grid > div { padding: 0 16px; border-left: 1px solid #D9E3F3; } .tl-deal-grid > div:first-child { padding-left: 16px; border-left: 0; }
.tl-deal-grid span { display: block; font-size: 12.5px; color: #5D6E95; margin-bottom: 4px; } .tl-deal-grid b { font-size: 14px; font-weight: 700; color: var(--tl-navy); } .tl-deal-grid b.is-green { color: var(--tl-green); }
.tl-quicktip { padding: 14px 16px 16px; border-radius: 12px; background: #EEF4FF; border: 1px solid #DCE7FB; }
.tl-quicktip-t { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--tl-navy); margin-bottom: 8px; } .tl-quicktip-t .icon { color: var(--tl-blue); }
.tl-quicktip p { margin: 0; font-size: 13px; line-height: 1.5; color: #3B4C86; }
.tl-side { padding: 12px 16px 14px; border-radius: 12px; border: 1px solid var(--tl-line); background: #fff; }
.tl-side-t { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; color: var(--tl-navy); margin-bottom: 10px; }
.tl-side-ic { width: 26px; height: 26px; border-radius: 7px; background: #EEF4FF; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; }
.tl-side-p { margin: 0 0 12px; font-size: 13px; line-height: 1.5; color: #3B4C86; }
.tl-examples { display: flex; flex-direction: column; gap: 0; padding: 8px 14px; border-radius: 8px; background: #F3F7FE; }
.tl-examples > span { font-size: 13px; color: #46588A; padding: 3px 0; line-height: 18px; }
.tl-examples.is-kv > span { display: grid; grid-template-columns: 78px 1fr; gap: 8px; padding: 6px 0; } .tl-examples.is-kv b { color: var(--tl-navy); font-weight: 700; } .tl-examples.is-kv em { font-style: normal; color: #46588A; }
.tl-guide { display: flex; flex-direction: column; gap: 8px; }
.tl-guide-row { display: flex; align-items: center; gap: 12px; }
.tl-guide-ic { width: 34px; height: 34px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-guide-ic.tone-green { background: #DFF7E9; color: #16A34A; } .tl-guide-ic.tone-blue { background: #E4EEFE; color: #1668F5; } .tl-guide-ic.tone-red { background: #FDE3E6; color: #DC2637; } .tl-guide-ic.tone-slate { background: #E9EEF7; color: #3B4C86; }
.tl-guide-row b { display: block; font-size: 13.5px; font-weight: 700; color: var(--tl-navy); } .tl-guide-row small { display: block; font-size: 12.5px; color: #667499; }
.tl-param { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px; border-radius: 8px; background: #F3F7FE; }
.tl-param code { font-family: inherit; font-size: 15px; font-weight: 600; color: var(--tl-blue); } .tl-param .tl-ibtn { color: var(--tl-blue); }
.tl-urlbox { display: flex; align-items: center; gap: 12px; padding: 4px 4px 4px 16px; border-radius: 10px; background: #F3F7FE; }
.tl-urlbox-u { flex: 1; min-width: 0; font-size: 15.5px; font-weight: 700; color: var(--tl-blue); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tl-urlbox .tl-btn { height: 36px; padding: 0 14px; font-size: 13.5px; } .tl-urlbox.is-final .tl-urlbox-u { font-size: 14px; } .tl-urlbox.is-final .tl-btn { height: 36px; padding: 0 12px; }
.tl-validrow { display: flex; align-items: center; gap: 12px; margin-top: 10px; }
.tl-valid { flex: 1; display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 16px; border-radius: 10px; background: #E7F7EE; color: #15803D; font-size: 13.5px; font-weight: 600; }
.tl-valid.is-bad { background: #FDE8EA; color: #B91C1C; } .tl-valid.is-wait { background: #EEF4FF; color: #1E3A8A; }
.tl-testbtn { height: 44px; padding: 0 18px; color: var(--tl-blue); }
.tl-summary { margin-top: 10px; padding: 12px 16px 12px; border-radius: 10px; background: #F3F7FE; }
.tl-summary-t { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 700; color: var(--tl-navy); margin-bottom: 12px; } .tl-summary-t .icon { color: var(--tl-blue); }
.tl-summary-grid { display: grid; grid-template-columns: auto auto auto auto auto auto; justify-content: start; gap: 0 20px; }
.tl-summary-grid > div { padding: 0 20px 0 0; border-right: 1px solid #D9E3F3; margin-right: -10px; } .tl-summary-grid > div:last-child { border-right: 0; }
.tl-summary-grid span { display: block; font-size: 12.5px; color: #5D6E95; margin-bottom: 4px; } .tl-summary-grid b { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--tl-navy); }
.tl-summary-grid b img.flag { width: 24px; height: 16px; border-radius: 3px; } .tl-summary-grid b .brand { border-radius: 5px; }
.tl-kv { margin: 0; } .tl-kv > div { display: grid; grid-template-column border-radius: 50%; tems: center; min-height: 38px; padding: 6px 0; border-bottom: 1px solid #EEF2F8; }
.tl-kv > div:last-child { border-bottom: 0; } .tl-kv dt { font-size: 13.5px; color: #46588A; } .tl-kv dd { margin: 0; font-size: 14px; font-weight: 500; color: var(--tl-navy); display: flex; align-items: center; gap: 8px; }
.tl-kv dd.is-link { color: var(--tl-blue); } .tl-kv dd img.flag { width: 24px; height: 16px; border-radius: 3px; } .tl-kv dd .brand { border-radius: 5px; }
.tl-kv dd .tl-cs-ic { width: 26px; height: 26px; }
.tl-edit { font-size: 12.5px; display: inline-flex; align-items: flex-start; }
.tl-pane-main.is-review .tl-sec-head { margin-bottom: 8px; } .tl-pane-main.is-review .tl-sec-head h3 { font-size: 17px; }
.tl-pane-side.is-review { width: 100%; }
.tl-pane:has(.tl-pane-side.is-review) { grid-template-columns: 1.27fr 1fr; gap: 16px; }
.tl-final-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; } .tl-final-actions .tl-btn { height: 46px; }
.tl-qr { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; padding: 12px 14px; border-radius: 10px; background: #F3F7FE; }
.tl-qr-l { display: flex; align-items: center; gap: 14px; } .tl-qr-img { width: 58px; height: 58px; display: inline-flex; } .tl-qr-img svg, .tl-qr-img img { width: 58px; height: 58px; }
.tl-qr b { display: block; font-size: 14px; font-weight: 700; color: var(--tl-navy); } .tl-qr small { font-size: 12.5px; color: #667499; }
.tl-qr .tl-btn { height: 46px; padding: 0 18px; }
.tl-sumcard { border: 1px solid #D5EEDF; border-radius: 12px; overflow: hidden; }
.tl-sumcard-top { display: flex; align-items: center; gap: 14px; padding: 14px 16px; background: #EDF9F1; }
.tl-sumcard-top > div { flex: 1; min-width: 0; } .tl-sumcard-top > div > b { font-size: 15px; font-weight: 700; color: var(--tl-navy); }
.tl-sumcard-ic { width: 44px; height: 44px; border-radius: 10px; background: #E4EEFE; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-sumcard-meta { display: flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 13px; color: #46588A; } .tl-sumcard-meta span:nth-child(2) { color: var(--tl-blue); font-weight: 600; } .tl-sumcard-meta i { font-style: normal; color: #637596; } .tl-sumcard-meta img.flag { width: 22px; height: 15px; border-radius: 3px; }
.tl-sumcard-grid { display: grid; grid-template-columns: 1fr 1.4fr 1fr; gap: 12px 0; padding: 14px 16px; background: #fff; }
.tl-sumcard-grid > div { padding: 0 14px; border-left: 1px solid #E5ECF4; } .tl-sumcard-grid > div:nth-child(3n+1) { padding-left: 0; border-left: 0; }
.tl-sumcard-grid span { display: block; font-size: 12.5px; color: #5D6E95; margin-bottom: 4px; } .tl-sumcard-grid b { font-size: 14px; font-weight: 600; color: var(--tl-navy); }
.tl-info { display: flex; align-items: flex-start; gap: 10px; padding: 14px 16px; border-radius: 10px; background: #EEF4FF; border: 1px solid #DCE7FB; color: #3B4C86; font-size: 13px; line-height: 1.5; } .tl-info .icon { color: var(--tl-blue); flex: none; margin-top: 2px; } .tl-info p { margin: 0; }
.tl-wiz-foot { display: flex; align-items: center; gap: 12px; padding: 12px 26px 20px; }
.tl-wiz-spacer { flex: 1; } .tl-wiz-foot .tl-btn { height: 46px; padding: 0 22px; font-size: 14.5px; }
.tl-qr-modal { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 12px 8px 4px; text-align: center; } .tl-qr-modal svg { width: 200px; height: 200px; }
/* the QR itself stays dark-on-white in both themes — scanners need that contrast */
.tl-qr-modal svg, .tl-qr-img svg { border-radius: 6px; }
.tl-qr-url { margin: 0; font-size: 12px; color: #5D6E95; word-break: break-all; }
.tl-test-res { font-size: 13px; line-height: 1.5; color: var(--tl-ink); }
@media (max-width: 1439px) {
  .tl-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } .tl-row2 { grid-template-columns: minmax(0, 1fr) 270px; } .tl-subcard { grid-column: 1 / -1; }
  .tl-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); } .tl-alert { grid-column: span 2; } .tl-alert.is-blue { grid-column: span 1; }
}
@media (max-width: 1099px) {
  .tl-top { flex-wrap: wrap; } .tl-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tl-row2 { grid-template-columns: minmax(0, 1fr); } .tl-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tl-alert, .tl-alert.is-blue { grid-column: 1 / -1; }
  .tl-tabsrow { flex-wrap: wrap; } .tl-tabs { overflow-x: auto; max-width: 100%; } .tl-filters { flex-wrap: wrap; } .tl-fsel { width: calc(50% - 8px); }
  .tl-pane, .tl-pane:has(.tl-pane-side.is-review) { grid-template-columns: minmax(0, 1fr); } .tl-steps { padding: 16px; flex-wrap: wrap; gap: 12px; } .tl-step-line { display: none; }
  .tl-grid2, .tl-grid3, .tl-grid-status { grid-template-columns: minmax(0, 1fr); } .tl-deal-grid { grid-template-columns: repeat(2, 1fr); gap: 10px 0; } .tl-deal-grid > div:nth-child(odd) { border-left: 0; padding-left: 0; } .tl-summary-grid { grid-template-columns: repeat(3, auto); gap: 10px 20px; }
}
@media (max-width: 767px) {
  .tl-stats, .tl-strip { grid-template-columns: minmax(0, 1fr); } .tl-modal-back { padding: 12px 8px; } .tl-wiz-head, .tl-wiz-body, .tl-wiz-foot { padding-left: 14px; padding-right: 14px; } .tl-steps { margin: 0 14px; } .tl-final-actions { grid-template-columns: 1fr; } .tl-search { width: 100%; }
}

/* ===== Tasks & Follow-ups — ClickUp-style module (design-reference-new/tasks-list-view.png) ===== */
.page-tk .page-content { padding: 0; max-width: none; display: flex; flex-direction: column; height: calc(100vh - var(--topbar-h)); min-height: 0; overflow: hidden; }
.page-tk .app-main { height: 100vh; }
.tk-app { display: flex; align-items: stretch; flex: 1 1 auto; min-height: 0; height: 100%; overflow: hidden; }
.tk-i { flex: none; }

/* ---- module sidebar ---- */
.tk-side { width: 218px; flex: none; background: #F5F9FE; border-right: 1px solid #E7EEF7; display: flex; flex-direction: column; padding: 7px 8px 12px; overflow-y: auto; }
.tk-side-head { display: flex; align-items: center; gap: 9px; padding: 4px 4px 10px; }
.tk-mod-tile { width: 26px; height: 26px; border-radius: 7px; background: #3B6BFC; color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tk-side-title { font-size: 14.5px; font-weight: 700; color: #0F172A; letter-spacing: -.01em; flex: 1; }
.tk-head-add { width: 26px; height: 26px; border-radius: 7px; background: #E8F0FF; color: #2F6BFF; border: 0; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tk-head-add:hover { background: #D8E6FF; }
.tk-shortcuts { display: flex; flex-direction: column; gap: 1px; }
.tk-short { display: flex; align-items: center; gap: 11px; height: 33px; padding: 0 8px; border-radius: 7px; color: #1E293B; font-size: 14px; font-weight: 500; }
.tk-short:hover, .tk-short.is-active { background: #E8F0FB; }
.tk-short-i { color: #334155; }
.tk-short > span:not(.tk-badge) { flex: 1; }
.tk-badge { min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; background: #E6EBF2; color: #5A6779; font-size: 11.5px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.tk-spaces-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 6px 6px; }
.tk-spaces-head > span { font-size: 13.5px; font-weight: 700; color: #0F172A; }
.tk-round { width: 26px; height: 26px; border-radius: 50%; background: #fff; border: 1px solid #E2E8F0; color: #475569; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tk-round:hover { background: #F1F5F9; }
.tk-round-sm { width: 22px; height: 22px; }
.tk-tree { display: flex; flex-direction: column; gap: 1px; }
.tk-all { display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 8px; border-radius: 7px; font-size: 13.5px; white-space: nowrap; overflow: hidden; }
.tk-all:hover { background: #E8F0FB; }
.tk-tile { width: 22px; height: 22px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; flex: none; color: #fff; }
.tk-tile-dark { background: #2F3B4E; }
.tk-tile-grey { background: #64748B; }
.tk-all-name { font-weight: 600; color: #0F172A; }
.tk-all-sub { color: #67768B; font-weight: 400; }
.tk-space-row { display: flex; align-items: center; gap: 9px; height: 33px; padding: 0 8px; border-radius: 7px; cursor: pointer; }
.tk-space-row:hover { background: #E8F0FB; }
.tk-letter { width: 22px; height: 22px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 11.5px; font-weight: 700; flex: none; }
.tk-letter.tone-green { background: #0B7B45; } .tk-letter.tone-violet { background: #9333EA; } .tk-letter.tone-orange { background: #B45309; }
.tk-letter.tone-red { background: #CE2F2F; } .tk-letter.tone-blue { background: #2F6BFF; } .tk-letter.tone-purple { background: #7C3AED; } .tk-letter.tone-teal { background: #0D7F73; }
.tk-space-name { flex: 1; font-size: 14px; font-weight: 600; color: #0F172A; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-space-caret { color: #67768B; display: inline-flex; transition: transform var(--t-fast); }
.tk-space.is-open > .tk-space-row .tk-space-caret { transform: rotate(0deg); }
.tk-space:not(.is-open) > .tk-space-row .tk-space-caret { display: none; }
.tk-space-row:hover .tk-space-caret { display: none; }
.tk-space-body { display: none; flex-direction: column; gap: 1px; }
.tk-space.is-open > .tk-space-body { display: flex; }
.tk-row-menu { border: 0; background: none; color: #67768B; cursor: pointer; padding: 2px; border-radius: 5px; display: none; }
.tk-space-row:hover .tk-row-menu, .tk-folder-row:hover .tk-row-menu, .tk-list-row:hover .tk-row-menu { display: inline-flex; }
.tk-space-row:hover .tk-space-caret { display: none; }
.tk-folder-row { display: flex; align-items: center; gap: 7px; height: 30px; padding: 0 6px 0 30px; border-radius: 7px; cursor: pointer; }
.tk-folder-row:hover, .tk-list-row:hover { background: #E8F0FB; }
.tk-caret { color: #334155; display: none; width: 12px; margin-left: -18px; }
.tk-folder-row:hover .tk-caret, .tk-folder.is-open .tk-caret { display: inline-flex; }
.tk-folder:not(.is-open) .tk-caret { transform: rotate(-90deg); }
.tk-folder-i { color: #475569; }
.tk-node-name { font-size: 13.5px; font-weight: 500; color: #1E293B; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-node { display: inline-flex; align-items: center; gap: 6px; flex: 1; min-width: 0; }
.tk-lock { color: #67768B; flex: none; }
.tk-count { font-size: 12.5px; color: #64748B; font-weight: 500; }
.tk-folder-body { display: none; flex-direction: column; gap: 1px; }
.tk-folder.is-open > .tk-folder-body { display: flex; }
.tk-list-row { display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 6px 0 50px; border-radius: 7px; }
.tk-list-flat { padding-left: 30px; }
.tk-list-i { display: inline-flex; flex: none; }
.tk-list-i.tone-green { color: #12B76A; } .tk-list-i.tone-amber { color: #F59E0B; } .tk-list-i.tone-red { color: #EF4444; }
.tk-list-i.tone-blue { color: #2F6BFF; } .tk-list-i.tone-purple { color: #7C3AED; }
.tk-list-row .tk-node-name { font-weight: 600; }
.tk-list-row.is-active { background: #DFEBFE; }
.tk-list-row.is-active .tk-node-name, .tk-list-row.is-active .tk-count { color: #1B62E8; }
.tk-archive { margin-top: 2px; }

/* ---- main column ---- */
.tk-main { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #FCFDFE; }
.tk-crumbbar { height: 40px; flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 14px; }
.tk-crumbs { display: flex; align-items: center; gap: 8px; min-width: 0; }
.tk-crumb-tile { width: 22px; height: 22px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; color: #fff; flex: none; }
.tk-crumb-tile.tone-violet { background: #6366F1; } .tk-crumb-tile.tone-green { background: #12B76A; } .tk-crumb-tile.tone-orange { background: #F59E0B; } .tk-crumb-tile.tone-red { background: #EF4444; } .tk-crumb-tile.tone-blue { background: #2F6BFF; }
.tk-crumb { font-size: 14px; color: #475569; font-weight: 500; white-space: nowrap; }
.tk-crumb:hover { color: #1B62E8; }
.tk-crumb-sep { color: #61768F; font-size: 14px; }
.tk-crumb-list { display: inline-flex; align-items: center; gap: 7px; }
.tk-crumb-list strong { font-size: 16px; font-weight: 800; color: #0F172A; letter-spacing: -.01em; }
.tk-star { border: 0; background: none; color: #67768B; cursor: pointer; display: inline-flex; padding: 2px; }
.tk-star:hover { color: #F59E0B; }
.tk-crumb-actions { display: flex; align-items: center; gap: 6px; }
.tk-btn-ghost { height: 28px; padding: 0 12px; border-radius: 7px; border: 1px solid #E2E8F0; background: #fff; color: #334155; font-size: 13px; font-weight: 500; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.tk-btn-ghost:hover { background: #F8FAFC; }
.tk-ibtn { width: 28px; height: 28px; border-radius: 7px; border: 1px solid transparent; background: none; color: #64748B; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tk-ibtn:hover { background: #F1F5F9; color: #334155; }
.tk-viewbar { height: 51px; flex: none; display: flex; align-items: stretch; gap: 4px; padding: 0 14px; border-bottom: 1px solid #EDF1F7; }
.tk-view { display: inline-flex; align-items: center; gap: 7px; padding: 0 10px; font-size: 14px; font-weight: 500; color: #475569; border-bottom: 2px solid transparent; background: none; border-top: 0; border-left: 0; border-right: 0; cursor: pointer; }
.tk-view:hover { color: #1E293B; }
.tk-view.is-active { color: #1B62E8; border-bottom-color: #1B62E8; font-weight: 600; }
.tk-view-add { color: #475569; }
.tk-toolbar { height: 46px; flex: none; display: flex; align-items: center; gap: 4px; padding: 0 14px; border-bottom: 1px solid #EDF1F7; }
.tk-tool { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; height: 30px; padding: 0 9px; border: 0; background: none; border-radius: 7px; color: #475569; font-size: 13.5px; font-weight: 500; cursor: pointer; }
.tk-tool:hover { background: #F1F5F9; color: #1E293B; }
.tk-tool.is-on { background: #E8F0FF; color: #1B62E8; }
.tk-tool-more { padding: 0 7px; }
.tk-search { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; height: 32px; width: 268px; flex: 0 1 268px; min-width: 120px; padding: 0 12px; border: 1px solid #E5EAF2; border-radius: 8px; background: #fff; color: #67768B; }
.tk-search input { border: 0; outline: 0; background: none; font: inherit; font-size: 13.5px; color: #0F172A; width: 100%; }
.tk-search input::placeholder { color: #697689; }
.tk-newtask { display: inline-flex; align-items: stretch; flex: none; margin-left: 10px; border-radius: 8px; overflow: hidden; background: #2F6BFF; }
.tk-newtask-main { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 13px 0 11px; border: 0; background: none; color: #fff; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tk-newtask-caret { width: 30px; border: 0; border-left: 1px solid rgba(255,255,255,.28); background: none; color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tk-newtask-main:hover, .tk-newtask-caret:hover { background: rgba(0,0,0,.08); }

/* ---- groups & rows ---- */
.tk-body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 14px 40px 19px; }
.tk-group { margin-bottom: 18px; }
.tk-group-head { display: flex; align-items: center; gap: 9px; height: 32px; padding: 0 4px; }
.tk-group-caret { border: 0; background: none; color: #334155; cursor: pointer; display: inline-flex; padding: 0; }
.tk-group.is-collapsed .tk-group-caret { transform: rotate(-90deg); }
.tk-group.is-collapsed .tk-table { display: none; }
.tk-status-pill { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px 0 8px; border-radius: 6px; font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.tk-status-pill.tone-grey { background: #E4EAEF; color: #3F4A5A; --tk-pill-check: #E4EAEF; }
.tk-status-pill.tone-grey .tk-circle { color: #5B6B84; }
.tk-status-pill.tone-blue { background: #2F6BFF; color: #fff; --tk-pill-check: #2F6BFF; }
.tk-status-pill.tone-amber { background: #F5B324; color: #4A2F00; --tk-pill-check: #F5B324; }
.tk-status-pill.tone-green { background: #12B76A; color: #fff; --tk-pill-check: #12B76A; }
.tk-group-count { font-size: 13px; color: #64748B; font-weight: 500; }
.tk-group-btn { border: 0; background: none; color: #67768B; cursor: pointer; display: inline-flex; padding: 2px; border-radius: 5px; }
.tk-group-btn:hover { background: #F1F5F9; color: #475569; }
.tk-table { background: #fff; border: 1px solid #EAEFF5; border-radius: 10px; overflow: hidden; margin-left: 19px; }
.tk-thead, .tk-row, .tk-addrow { display: grid; grid-template-columns: minmax(0, 1fr) 142px 132px 90px 33px; align-items: center; }
.tk-thead { height: 31px; padding: 0 13px; font-size: 12.5px; color: #64748B; font-weight: 500; border-bottom: 1px solid #F1F5F9; }
.tk-row { height: 32px; padding: 0 13px; border-bottom: 1px solid #F4F7FA; cursor: pointer; }
.tk-row:last-of-type { border-bottom: 0; }
.tk-row:hover { background: #F8FAFF; }
.tk-row.is-open { background: #F5F9FF; box-shadow: inset 2px 0 0 #2F6BFF; }
.tk-c-name { display: flex; align-items: center; gap: 10px; min-width: 0; }
.tk-check { border: 0; background: none; padding: 0; color: #C5CEDC; display: inline-flex; cursor: pointer; }
.tk-check:hover { color: #2F6BFF; }
.tk-check.is-done { color: #12B76A; }
.tk-title { font-size: 14px; color: #0F172A; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-row.is-done .tk-title { color: #334155; }
.tk-mini { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; color: #67768B; }
.tk-c-assignee { display: flex; align-items: center; gap: 9px; }
.tk-person { font-size: 13.5px; color: #1E293B; }
.tk-empty-dot { color: #61768F; display: inline-flex; }
.tk-c-due { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: #1E293B; }
.tk-due-i { color: #67768B; }
.tk-c-prio { display: flex; align-items: center; }
.tk-prio { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; color: #1E293B; background: none; padding: 0; border: 0; }
.tk-prio.tone-red { color: #1E293B; } .tk-prio.tone-red .tk-i { color: #F5334F; }
.tk-prio.tone-amber .tk-i { color: #F5B324; }
.tk-prio.tone-blue .tk-i { color: #2F86FF; }
.tk-prio.tone-grey .tk-i { color: #67768B; }
.tk-c-menu { display: flex; justify-content: flex-end; }
.tk-c-menu .tk-row-menu, .tk-thead .tk-c-menu { display: inline-flex; color: #67768B; }
.tk-row .tk-row-menu { visibility: hidden; }
.tk-row:hover .tk-row-menu { visibility: visible; }
.tk-addrow { height: 34px; padding: 0 13px; gap: 9px; color: #67768B; font-size: 13.5px; cursor: pointer; grid-template-columns: auto 1fr; }
.tk-addrow:hover { color: #2F6BFF; }
.tk-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; height: 320px; color: #64748B; }
.tk-placeholder strong { font-size: 16px; color: #0F172A; }

/* ---- avatars ---- */
.tk-av { width: var(--s); height: var(--s); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: calc(var(--s) * .42); font-weight: 600; letter-spacing: .01em; flex: none; overflow: hidden; }
.tk-av img { width: 100%; height: 100%; object-fit: cover; }
.tk-av.tone-navy { background: #1F3E8C; } .tk-av.tone-blue { background: #2F6BFF; } .tk-av.tone-violet { background: #7C3AED; }
.tk-av.tone-purple { background: #9333EA; } .tk-av.tone-steel { background: #64748B; } .tk-av.tone-teal { background: #0D9488; }
.tk-av.tone-slate { background: #475569; } .tk-av.tone-green { background: #12B76A; } .tk-av.tone-red { background: #EF4444; }
.tk-av-empty { background: #E2E8F0; }
.tk-av-me { background: #94A3B8; }

/* ---- right panel ---- */
.tk-panel { width: 359px; min-height: 0; flex: none; background: #fff; border-left: 1px solid #EDF1F7; display: flex; flex-direction: column; padding: 29px 20px 0; overflow: hidden; }
.tk-panel-bar { display: flex; align-items: center; gap: 8px; }
.tk-pill-status { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 12px 0 9px; border: 0; border-radius: 8px; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tk-pill-status.tone-blue { background: #DDEAFE; color: #1B62E8; --tk-pill-check: #DDEAFE; }
.tk-pill-status.tone-grey { background: #EDF1F5; color: #3F4A5A; --tk-pill-check: #EDF1F5; }
.tk-pill-status.tone-amber { background: #FEF0D2; color: #B45309; --tk-pill-check: #FEF0D2; }
.tk-pill-status.tone-green { background: #D7F5E6; color: #087F52; --tk-pill-check: #D7F5E6; }
.tk-icon-group { display: inline-flex; align-items: center; gap: 4px; }
.tk-icon-group .tk-ibtn { border: 1px solid #E5EAF2; border-radius: 8px; width: 30px; height: 30px; background: #fff; }
.tk-panel-close { margin-left: auto; }
.tk-panel-title { font-size: 23.5px; font-weight: 800; letter-spacing: -.02em; color: #0F172A; margin: 23px 0 24px; outline: 0; }
.tk-fields { display: flex; flex-direction: column; gap: 20px; padding-bottom: 44px; }
.tk-field { display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: center; }
.tk-field-label { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px; color: #475569; }
.tk-field-label .tk-i { color: #64748B; }
.tk-field-value { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px; color: #0F172A; cursor: pointer; min-width: 0; }
.tk-field-value .tk-strong, .tk-field-value .tk-person, .tk-field-value .tk-prio { font-weight: 600; font-size: 13.5px; color: #0F172A; }
.tk-field-i { color: #2F6BFF; }
.tk-caret-i { color: #67768B; }
.tk-tag { height: 24px; padding: 0 11px; border-radius: 999px; background: #E3EDFD; color: #1B62E8; font-size: 12.5px; font-weight: 600; display: inline-flex; align-items: center; }
.tk-tag.tone-green { background: #D7F5E6; color: #087F52; } .tk-tag.tone-amber { background: #FEF0D2; color: #B45309; } .tk-tag.tone-purple { background: #EDE4FE; color: #6D28D9; }
.tk-link { display: inline-flex; align-items: center; gap: 7px; color: #1B62E8; font-weight: 600; font-size: 13.5px; }
.tk-link-i { color: #2F6BFF; }
.tk-link-ext { color: #2F6BFF; }
.tk-muted { color: #67768B; }
.tk-tabs { display: flex; align-items: center; gap: 18px; border-bottom: 1px solid #EDF1F7; }
.tk-tab { border: 0; background: none; padding: 0 0 9px; font-size: 13.5px; font-weight: 500; color: #475569; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; display: inline-flex; align-items: center; gap: 7px; }
.tk-tab.is-active { color: #1B62E8; font-weight: 600; border-bottom-color: #1B62E8; }
.tk-tabcount { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #EEF2F7; color: #64748B; font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.tk-panel-scroll { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 0 12px; }
.tk-desc { font-size: 14px; line-height: 1.5; color: #334155; }
.tk-desc p { margin: 0; }
.tk-sec { border-top: 1px solid #EEF2F7; margin-top: 16px; padding-top: 14px; }
.tk-sec-head { display: flex; align-items: center; gap: 9px; }
.tk-sec-title { font-size: 13.5px; font-weight: 700; color: #0F172A; }
.tk-sec-count { font-size: 13px; color: #64748B; }
.tk-sec-btn { border: 0; background: none; color: #67768B; cursor: pointer; display: inline-flex; padding: 2px; }
.tk-sec-caret { margin-left: -4px; transform: rotate(180deg); }
.tk-sec.is-collapsed .tk-sec-caret { transform: none; }
.tk-sec-more { margin-left: auto; }
.tk-sec-head .tk-sec-btn:first-of-type { margin-left: auto; }
.tk-sec-body { padding-top: 10px; display: flex; flex-direction: column; gap: 7px; }
.tk-sec.is-collapsed .tk-sec-body { display: none; }
.tk-cl-item { display: flex; align-items: center; gap: 11px; font-size: 13.5px; color: #1E293B; cursor: pointer; }
.tk-cl-item input { position: absolute; opacity: 0; pointer-events: none; }
.tk-cl-box { width: 18px; height: 18px; border-radius: 5px; border: 1.6px solid #CBD5E1; display: inline-flex; align-items: center; justify-content: center; color: transparent; flex: none; }
.tk-cl-item.is-done .tk-cl-box { background: #2F6BFF; border-color: #2F6BFF; color: #fff; }
.tk-add-item { display: inline-flex; align-items: center; gap: 9px; border: 0; background: none; color: #67768B; font-size: 13.5px; cursor: pointer; padding: 2px 0; }
.tk-add-item:hover { color: #2F6BFF; }
.tk-att-grid { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 52px; gap: 10px; align-items: stretch; }
.tk-att-grid > .tk-att:nth-of-type(1) { grid-column: 1; grid-row: 1; }
.tk-att-grid > .tk-att:nth-of-type(2) { grid-column: 1; grid-row: 2; }
.tk-att { display: flex; align-items: center; gap: 10px; padding: 0 10px; height: 52px; border: 1px solid #EAEFF5; border-radius: 10px; background: #fff; }
.tk-att:hover { border-color: #C9D9FB; background: #F8FBFF; }
.tk-att-i { display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tk-att-img { width: 30px; height: 30px; border-radius: 8px; background: #EDE4FE; color: #7C3AED; display: inline-flex; align-items: center; justify-content: center; }
.tk-att-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tk-att-name { font-size: 12.5px; font-weight: 600; color: #0F172A; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-att-size { font-size: 11.5px; color: #67768B; }
.tk-att-add { grid-column: 2; grid-row: 1 / span 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border: 1.5px dashed #D7E0EC; border-radius: 10px; background: none; color: #67768B; font-size: 12px; cursor: pointer; min-height: 72px; }
.tk-att-add:hover { border-color: #2F6BFF; color: #2F6BFF; }
.tk-sub-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid #F4F7FA; }
.tk-sub-row .tk-title { flex: 1; }
.tk-sub-due { font-size: 12.5px; color: #64748B; }
.tk-act { display: flex; gap: 10px; padding: 8px 0; }
.tk-act-body { display: flex; flex-direction: column; gap: 2px; }
.tk-act-text { font-size: 13px; color: #334155; }
.tk-act-time { font-size: 11.5px; color: #67768B; }
.tk-composer { display: flex; align-items: center; gap: 10px; padding: 13px 0 54px; border-top: 1px solid #EDF1F7; }
.tk-composer-box { flex: 1; display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border: 1px solid #E5EAF2; border-radius: 10px; }
.tk-composer-box input { flex: 1; border: 0; outline: 0; background: none; font: inherit; font-size: 13.5px; color: #0F172A; }
.tk-composer-box input::placeholder { color: #697689; }
.tk-composer-btn { border: 0; background: none; color: #67768B; cursor: pointer; display: inline-flex; }
.tk-composer-btn:hover { color: #475569; }
.tk-circle { display: inline-flex; }
.tk-status-pill.tone-grey .tk-circle { color: #6B7688; }
.tk-status-pill.tone-blue .tk-circle, .tk-status-pill.tone-amber .tk-circle, .tk-status-pill.tone-green .tk-circle { color: #fff; }
.tk-check.is-done { color: #12B76A; }
.tk-pill-status .tk-circle { color: currentColor; }

@media (max-width: 1200px) { .tk-panel { position: fixed; right: 0; top: var(--topbar-h); bottom: 0; z-index: 40; box-shadow: var(--shadow-lg); } }
@media (max-width: 900px) { .tk-side { display: none; } .tk-panel { width: 100%; } }
/* the module reuses tone-* names for colour only — the app-wide tinted backgrounds must not leak in */
.tk-list-i[class*="tone-"], .tk-prio[class*="tone-"], .tk-circle[class*="tone-"], .tk-att-i[class*="tone-"] { background: none; }

/* ---- Tracking link detail (design-reference-new/link-detail-*.png) ---------------- */
.tl-crumbs { display: flex; align-items: center; gap: 10px; padding: 6px 0 10px 4px; }
.tl-crumb { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: #46588A; }
.tl-crumb a { color: #46588A; text-decoration: none; } .tl-crumb a:hover { color: var(--tl-blue); }
.tl-crumb span { color: var(--tl-navy); font-weight: 600; } .tl-crumb .icon { color: #637596; }
.tl-crumb-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.tl-ibtn.is-plain { background: none; border: 0; } .tl-ibtn.is-box2 { width: 42px; height: 42px; border: 1px solid #DCE5F2; border-radius: 9px; background: #fff; color: var(--tl-ink); }
.tl-dhead { display: flex; align-items: flex-start; gap: 16px; padding: 4px 0 16px 4px; }
.tl-backbtn { width: 46px; height: 46px; flex: none; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #DCE5F2; border-radius: 10px; background: #fff; color: var(--tl-navy); }
.tl-dlogo .brand { border-radius: 16px; } .tl-dlogo { flex: none; }
.tl-dhead-b { flex: 1; min-width: 0; padding-top: 2px; }
.tl-dhead-t { display: flex; align-items: center; gap: 12px; }
.tl-dhead-t h1 { font-size: 26px; font-weight: 700; letter-spacing: -.02em; color: var(--tl-navy); margin: 0; line-height: 1.1; }
.tl-dhead-t .tl-pill { order: -1; height: 24px; }
.tl-dhead-s { font-size: 13.5px; color: #5D6E95; margin: 6px 0 0; }
.tl-dchips { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.tl-dchip { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 11px; border-radius: 7px; background: #EEF2F8; color: #46588A; font-size: 12.5px; }
.tl-dchip b { color: var(--tl-navy); font-weight: 700; } .tl-dchip.is-type { background: #E4EEFE; color: var(--tl-blue); font-weight: 600; padding-left: 5px; }
.tl-dchip .tl-subic { width: 20px; height: 20px; border-radius: 5px; } .tl-dchip .flag-cell { gap: 7px; } .tl-dchip .flag { border-radius: 3px; }
.tl-dhead-r { display: flex; align-items: center; gap: 10px; flex: none; padding-top: 4px; }
.tl-urlcard { display: flex; align-items: center; gap: 12px; padding: 9px 9px 9px 14px; border: 1px solid #DCE5F2; border-radius: 11px; background: #fff; }
.tl-urlcard-l { display: block; font-size: 11.5px; color: #667499; margin-bottom: 2px; }
.tl-urlcard-u { display: block; max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 600; color: var(--tl-blue); text-decoration: none; }
.tl-btn.is-tall { height: 56px; padding: 0 18px; border-radius: 11px; flex-direction: row; gap: 10px; }
.tl-range { position: relative; display: inline-flex; align-items: center; height: 44px; padding: 0 34px 0 42px; border: 1px solid #DCE5F2; border-radius: 10px; background: #fff; }
.tl-range-ic { position: absolute; left: 13px; color: var(--tl-blue); display: inline-flex; }
.tl-range select { appearance: none; -webkit-appearance: none; border: 0; background: none; font: inherit; font-size: 14px; font-weight: 700; color: var(--tl-navy); cursor: pointer; outline: none; }
.tl-range .tl-caret { position: absolute; right: 12px; }
.tl-dtabs { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; border: 1px solid var(--tl-line); border-radius: 12px; padding: 0 14px; margin-bottom: 13px; }
.tl-dtabs-n { display: flex; align-items: center; gap: 4px; overflow-x: auto; }
.tl-dtab { position: relative; display: inline-flex; align-items: center; gap: 6px; height: 50px; padding: 0 14px; font-size: 14px; font-weight: 600; color: #46588A; text-decoration: none; white-space: nowrap; }
.tl-dtab.is-active { color: var(--tl-blue); } .tl-dtab.is-active::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 3px; background: var(--tl-blue); border-radius: 3px 3px 0 0; }
.tl-dtab-n { color: #69768B; font-weight: 600; } .tl-dtab.is-active .tl-dtab-n { color: var(--tl-blue); }
.tl-dtabs-r { flex: none; padding: 5px 0; } .tl-dtabs-r .tl-range { height: 38px; font-size: 13px; padding-left: 38px; } .tl-dtabs-r .tl-range select { font-size: 13px; }
/* stat tiles */
.tl-dstats { display: grid; gap: 11px; padding-bottom: 13px; }
.tl-dstats.is-6 { grid-template-columns: repeat(4, minmax(0, 1fr)) 128px minmax(0, 1fr); }
.tl-dstats.is-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.tl-dstats.is-6eq { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.tl-dstats.is-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tl-dstats.is-sub { grid-template-columns: repeat(4, minmax(0, 1fr)) 1.32fr; }
.tl-dstat { display: flex; align-items: flex-start; gap: 12px; padding: 13px 14px 12px; background: #fff; border: 1px solid var(--tl-line); border-radius: 12px; }
.tl-dstat-ic { width: 44px; height: 44px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.tl-dstat-ic.tone-blue { background: #E4EEFE; color: #1668F5; } .tl-dstat-ic.tone-green { background: #DCFBEA; color: #16A34A; } .tl-dstat-ic.tone-amber { background: #FDEFD8; color: #F59E0B; }
.tl-dstat-ic.tone-purple { background: #EFE0FE; color: #7C3AED; } .tl-dstat-ic.tone-teal { background: #DDF5F3; color: #0F9E93; } .tl-dstat-ic.tone-red { background: #FDE3E6; color: #EF4444; }
.tl-dstat-ic.is-solid { background: #16A34A; color: #fff; }
.tl-dstat-b { min-width: 0; flex: 1; }
.tl-dstat-l { font-size: 13px; color: #5D6E95; line-height: 1.3; } .tl-dstat-l em { display: block; font-style: normal; font-size: 12.5px; color: #69768B; white-space: nowrap; }
.tl-dstat-v { font-size: 23px; font-weight: 700; color: var(--tl-navy); letter-spacing: -.02em; line-height: 1.15; margin: 2px 0 3px; }
.tl-dstat-s { font-size: 12px; color: #69768B; margin-top: 2px; }
.tl-dstat-pct { font-size: 13px; font-weight: 700; } .tl-dstat-pct.is-green { color: var(--tl-green); }
.tl-dstat.is-quick { flex-direction: row; align-items: center; justify-content: flex-start; gap: 9px; font-size: 13px; color: #5D6E95; text-decoration: none; padding: 15px 12px; }
.tl-dquick-ic { color: var(--tl-navy); display: inline-flex; }
.tl-attrcard { padding: 15px 18px 14px; }
.tl-attrcard .tl-card-title { font-size: 17px; margin-bottom: 12px; }
.tl-attrbar { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: #EEF2F8; }
.tl-attrbar i { display: block; height: 100%; }
.tl-attrlegend { display: flex; align-items: center; gap: 20px; margin-top: 11px; font-size: 12.5px; color: #5D6E95; }
.tl-attrlegend span { display: inline-flex; align-items: center; gap: 7px; } .tl-attrlegend i { width: 9px; height: 9px; border-radius: 50%; } .tl-attrlegend b { color: var(--tl-navy); }
/* rows */
.tl-drow2 { display: grid; grid-template-columns: minmax(0, 1fr) 358px 356px; gap: 12px; padding-bottom: 13px; align-items: start; }
.tl-drow2.is-pf { grid-template-columns: minmax(0, 1fr) 500px; }
.tl-drow2.is-src { grid-template-columns: minmax(0, 1fr) 524px; }
.tl-drow3 { display: grid; grid-template-columns: minmax(0, 1fr) 566px; gap: 12px; padding-bottom: 13px; align-items: start; }
.tl-drow3.is-pf { grid-template-columns: 549px minmax(0, 1fr) 295px; }
.tl-drow3.is-src { grid-template-columns: minmax(0, 1fr) 566px; }
.tl-drow4 { display: grid; grid-template-columns: 466px minmax(0, 1fr) 434px; gap: 12px; padding-bottom: 13px; align-items: start; }
.tl-drow5 { display: grid; grid-template-columns: minmax(0, 1fr) 500px; gap: 12px; padding-bottom: 13px; align-items: start; }
.tl-dcol { display: flex; flex-direction: column; gap: 12px; }
.tl-card-head.is-plain { padding: 15px 16px 10px; align-items: flex-start; }
.tl-card-head.is-plain .tl-card-title { font-size: 17px; } .tl-card-head.is-plain .tl-card-sub { font-size: 12.5px; }
.tl-card-head.is-plain > .tl-seg, .tl-card-head.is-plain > .tl-msel, .tl-card-head.is-plain > .tl-btn, .tl-card-head.is-plain > .tl-link, .tl-card-head.is-plain > .tl-foot-r { flex: none; align-self: center; }
.tl-dchart { position: relative; height: 230px; padding: 0 14px 10px 6px; --tl-track: #CBD5E1; --tl-area-op: 0.22; }
.tl-dchart.is-tall { height: 248px; }
.tl-dchart svg { display: block; width: 100%; height: 100%; overflow: visible; }
.tl-dchart .axis text { font-size: 11.5px; fill: #69768B; font-family: inherit; }
.tl-dchart .grid line { stroke: #EEF2F8; }
.tl-dchart .line { fill: none; stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; }
.tl-dchart .dot.is-active { stroke: #fff; stroke-width: 2.4; r: 5; }
.tl-dchart .marker { stroke: #A9C0EA; stroke-width: 1; stroke-dasharray: 3 3; }
.tl-dchart .hit { fill: transparent; cursor: pointer; }
.tl-dchart .tl-tip { min-width: 160px; }
.tl-trendcard .tl-legend { padding-left: 22px; }
/* GEO rows (Overview) */
.tl-georows { padding: 4px 16px 14px; }
.tl-georow { display: flex; align-items: center; gap: 12px; padding: 9px 0; }
.tl-geoflag { flex: none; display: inline-flex; } .tl-geoflag .flag { width: 33px; height: 22px; border-radius: 4px; }
.tl-geoflag .tl-type-ic { width: 30px; height: 30px; border-radius: 8px; }
.tl-georow-b { flex: 1; min-width: 0; }
.tl-georow-t { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; font-size: 13.5px; }
.tl-georow-t span { flex: 1; color: var(--tl-navy); } .tl-georow-t b { font-weight: 700; color: var(--tl-navy); } .tl-georow-t em { font-style: normal; color: #69768B; min-width: 44px; text-align: right; }
.tl-georow .tl-bar { height: 6px; }
/* key/value lists */
.tl-dkv { margin: 0; padding: 0 14px 12px; }
.tl-dkv > div { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: center; min-height: 34px; border-bottom: 1px solid #EEF2F8; gap: 8px; }
.tl-dkv > div:last-child { border-bottom: 0; }
.tl-dkv dl { display: grid; grid-template-columns: 130px minmax(0, 1fr); }
.tl-dkv dt { font-size: 12.5px; color: #5D6E95; } .tl-dkv dd { margin: 0; font-size: 13px; white-space: nowrap; font-weight: 600; color: var(--tl-navy); display: flex; align-items: center; gap: 8px; min-width: 0; }
.tl-dkv.is-info dd { justify-content: space-between; }
.tl-dkv dd .is-link, .tl-dkv dd a.is-link { color: var(--tl-blue); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tl-dkv dd .flag { border-radius: 3px; } .tl-dkv dd .brand { border-radius: 5px; } .tl-dkv .tl-subic { width: 22px; height: 22px; border-radius: 6px; }
.tl-dkv.is-info > div { display: grid; grid-template-columns: 130px minmax(0, 1fr); } .tl-dkv.is-info dd { justify-content: space-between; }
.tl-dkv.is-panel { padding: 0 18px 12px; } .tl-dkv.is-panel > div { grid-template-columns: 122px minmax(0, 1fr); }
.tl-linkic { color: var(--tl-blue); }
/* funnel */
.tl-funnel { display: flex; align-items: flex-start; padding: 6px 16px 20px; }
.tl-fnode { display: flex; flex-direction: column; gap: 3px; min-width: 96px; }
.tl-fnode-ic { width: 46px; height: 46px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 9px; }
.tl-fnode-ic.tone-blue { background: #E4EEFE; color: #1668F5; } .tl-fnode-ic.tone-green { background: #DCFBEA; color: #16A34A; } .tl-fnode-ic.tone-amber { background: #FDEFD8; color: #F59E0B; }
.tl-fnode b { font-size: 21px; font-weight: 700; color: var(--tl-navy); letter-spacing: -.01em; }
.tl-fnode span { font-size: 12.5px; color: #5D6E95; } .tl-fnode em { font-style: normal; font-size: 12.5px; font-weight: 600; color: var(--tl-navy); }
.tl-fsep { display: inline-flex; align-items: center; height: 46px; padding: 0 12px; color: #B9CBEA; }
.tl-funnel .tl-fnode:last-of-type + .tl-fsep { }
/* detail tables */
.tl-dtable { width: 100%; border-collapse: collapse; }
.tl-dtable th { height: 32px; background: #F4F7FC; font-size: 11.5px; font-weight: 500; color: #5D6E95; text-align: left; padding: 0 12px; white-space: nowrap; }
.tl-dtable td { height: 38px; padding: 0 12px; font-size: 13px; color: var(--tl-ink); border-bottom: 1px solid #EEF2F8; }
.tl-dtable tr:last-child td { border-bottom: 0; }
.tl-dtable .c-num { text-align: center; } .tl-dtable .c-right { text-align: right; }
.tl-dtable th.c-num { text-align: center; } .tl-dtable th.c-right { text-align: right; }
.tl-dtable td b { font-weight: 700; color: var(--tl-navy); }
.tl-dtable a { color: var(--tl-blue); text-decoration: none; }
.tl-dtable .tl-th { display: inline-flex; align-items: center; gap: 4px; color: inherit; text-decoration: none; }
.tl-dtable th.c-num .tl-th, .tl-dtable th.c-right .tl-th { justify-content: center; }
.tl-dtable .tl-sort { color: #637596; }
.tl-dtable tr.is-this td { background: #EAF9F0; } .tl-dtable tr.is-this td:first-child { box-shadow: inset 3px 0 0 #16A34A; }
.tl-this { color: #15803D; font-weight: 600; font-size: 12px; }
.tl-dtable.is-peers th:first-child, .tl-dtable.is-peers td:first-child { padding-left: 16px; }
.tl-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 6px; background: #EEF2F8; color: #46588A; font-size: 12px; font-weight: 500; }
.tl-geocell { display: inline-flex; align-items: center; gap: 9px; } .tl-geocell .flag { width: 27px; height: 18px; border-radius: 3px; } .tl-globe { color: #64748B; }
.tl-srccell, .tl-devcell { display: inline-flex; align-items: center; gap: 10px; }
.tl-devic { width: 28px; height: 28px; border-radius: 7px; background: #EEF3FB; color: #46588A; display: inline-flex; align-items: center; justify-content: center; }
.tl-dtable .c-pct { width: 46%; } .tl-dtable .c-pct .tl-bar { display: inline-block; width: calc(100% - 52px); vertical-align: middle; height: 8px; margin-right: 8px; }
.tl-dtable .c-pct em { font-style: normal; font-size: 12.5px; color: #69768B; }
.tl-dtable.is-src .tl-bar i { border-radius: 4px; }
.tl-geolink { padding: 10px 16px 14px; }
.tl-dot { display: inline-block; width: 11px; height: 11px; border-radius: 50%; margin-right: 10px; vertical-align: -1px; }
.tl-srcname { font-weight: 500; white-space: nowrap; }
.tl-dtable .c-share { width: 156px; white-space: nowrap; } .tl-dtable .c-share em { display: inline-block; font-style: normal; font-size: 12.5px; color: #46588A; margin-right: 10px; vertical-align: middle; }
.tl-dtable .c-share .tl-bar { display: inline-block; width: 74px; height: 8px; vertical-align: middle; }
.tl-dtable.is-attr td:first-child { padding-left: 14px; }
.tl-expand { display: inline-flex; align-items: center; gap: 9px; border: 0; background: none; font: inherit; font-size: 13px; font-weight: 500; color: var(--tl-navy); cursor: pointer; padding: 0; }
.tl-expand .icon:first-child { color: #64748B; }
.tl-srcic { width: 26px; height: 26px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--c) 18%, #fff); color: var(--c); }
.tl-attr-kid td { color: #46588A; } .tl-attr-kid td:nth-child(2) { font-weight: 600; color: var(--tl-navy); }
.tl-dtable.is-matrix th:first-child, .tl-dtable.is-matrix td:first-child { padding-left: 16px; }
.tl-dtable.is-matrix .tl-geocell { justify-content: center; } .tl-dtable.is-matrix .flag { width: 22px; height: 15px; }
/* attribution quality */
.tl-qual-ic { width: 34px; height: 34px; border-radius: 9px; background: #E4EEFE; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-qual { display: grid; grid-template-columns: auto 1fr; gap: 10px 20px; align-items: center; padding: 6px 18px 18px; }
.tl-donut { --tl-track: #CBD5E1; position: relative; width: 168px; height: 168px; display: inline-flex; align-items: center; justify-content: center; }
.tl-donut svg { width: 168px; height: 168px; }
.tl-donut-c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.tl-donut-c b { font-size: 25px; font-weight: 700; color: var(--tl-navy); letter-spacing: -.02em; } .tl-donut-c span { font-size: 12.5px; color: #5D6E95; }
.tl-qual-legend { display: flex; flex-direction: column; gap: 14px; }
.tl-qual-legend > div { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 0 8px; }
.tl-qual-l { font-size: 13.5px; color: var(--tl-navy); } .tl-qual-legend b { font-size: 13.5px; font-weight: 700; color: var(--tl-navy); }
.tl-qual-legend em { grid-column: 2 / -1; font-style: normal; font-size: 12.5px; color: #667499; margin-top: 2px; }
.tl-qual-note { grid-column: 1 / -1; display: grid; grid-template-columns: auto 1fr; gap: 10px; padding: 14px 16px; border-radius: 10px; background: #F5F9FE; border: 1px solid #DCE7FB; }
.tl-qual-note .icon { color: var(--tl-blue); } .tl-qual-note p { margin: 0; font-size: 12.5px; line-height: 1.5; color: #46588A; }
.tl-qual-note .tl-btn { grid-column: 1 / -1; margin-top: 4px; background: #fff; }
.tl-btn.is-full { width: 100%; } .tl-btn.is-wide { grid-column: 1 / -1; }
/* notes + actions */
.tl-notes { padding: 4px 16px 14px; display: flex; flex-direction: column; gap: 4px; }
.tl-note { display: flex; align-items: center; gap: 12px; padding: 9px 0; }
.tl-note-ic { width: 34px; height: 34px; flex: none; border-radius: 9px; background: #E9F1FE; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; }
.tl-note-b { flex: 1; min-width: 0; } .tl-note-b b { display: block; font-size: 13.5px; font-weight: 600; color: var(--tl-navy); }
.tl-note-b span { font-size: 12px; color: #69768B; } .tl-note-b i { font-style: normal; color: #C3CEE2; }
.tl-actgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 4px 16px 16px; }
.tl-actgrid .tl-btn { height: 46px; justify-content: flex-start; padding: 0 14px; }
.tl-btn-danger { background: #fff; border: 1px solid #F6C6CB; color: #DC2637; } .tl-btn-danger:hover { background: #FEF2F3; }
.tl-btn-danger.is-outline { border-color: #F6C6CB; }
/* sub ID tab */
.tl-subwrap { display: grid; grid-template-columns: minmax(0, 1fr) 355px; gap: 12px; padding-bottom: 13px; align-items: start; }
.tl-subwrap > .tl-subfilters { grid-column: 1 / -1; }
.tl-subwrap:not(:has(.tl-subpanel)) { grid-template-columns: minmax(0, 1fr); }
.tl-subfilters { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; row-gap: 10px; padding: 12px 14px; min-width: 0; }
.tl-search.is-wide { width: 268px; height: 44px; border-radius: 9px; flex: none; }
.tl-subfilters .tl-fsel { width: 146px; height: 44px; flex: none; }
.tl-subfilters .tl-fsel .tl-caret { top: 17px; }
.tl-subfilters .tl-link { margin-left: 2px; }
.tl-subfilters .tl-split { margin-left: auto; } .tl-subfilters .tl-split .tl-btn { height: 44px; }
.tl-dtable.is-subs { table-layout: auto; min-width: 0; font-size: 12.5px; } .tl-dtable.is-subs th, .tl-dtable.is-subs td { padding: 0 7px; font-size: 12.5px; }
.tl-dtable.is-subs .c-sel { width: 36px; padding-left: 14px; } .tl-dtable.is-subs .c-sel input { width: 14px; height: 14px; accent-color: var(--tl-blue); }
.tl-dtable.is-subs td { height: 36px; white-space: nowrap; } .tl-dtable.is-subs th { white-space: nowrap; }
.tl-dtable.is-subs .c-attr { width: 96px; } .tl-dtable.is-subs .c-act { width: 60px; text-align: right; padding-right: 14px; }
.tl-subrow { cursor: pointer; } .tl-subrow:hover td { background: #F8FAFE; } .tl-subrow.is-open td { background: #F4F8FF; }
.tl-subcell { display: inline-flex; align-items: center; gap: 10px; } .tl-subcell b { font-weight: 700; color: var(--tl-navy); }
.tl-subic { width: 24px; height: 24px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-subic.tone-green { background: #DCFBEA; color: #067E36; } .tl-subic.tone-blue { background: #E3EFFF; color: #1668F5; } .tl-subic.tone-red { background: #FDE3E6; color: #E11D48; }
.tl-subic.tone-amber { background: #FDEFD8; color: #F59E0B; } .tl-subic.tone-slate { background: #EBF1F9; color: #1B2D68; } .tl-subic.tone-purple { background: #EFE0FE; color: #6D28D9; } .tl-subic.tone-grey { background: #EEF2F8; color: #5D6E95; }
.tl-subic.is-brand { background: color-mix(in srgb, var(--b) 12%, #fff); }
.tl-dtable .c-attr em { display: block; font-style: normal; font-size: 12px; color: var(--tl-navy); font-weight: 600; margin-bottom: 3px; }
.tl-dtable .c-attr .tl-bar { height: 5px; }
.tl-subpanel { position: sticky; top: 76px; padding-bottom: 16px; }
.tl-subpanel-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px 6px; } .tl-subpanel-head .tl-card-title { font-size: 17px; }
.tl-subpanel-top { display: flex; align-items: flex-start; gap: 14px; padding: 8px 18px 14px; }
.tl-subpanel-top .tl-subic { width: 52px; height: 52px; border-radius: 13px; } .tl-subpanel-top .tl-subic .icon { width: 26px; height: 26px; }
.tl-subpanel-code { display: flex; align-items: center; gap: 10px; } .tl-subpanel-code b { font-size: 19px; font-weight: 700; color: var(--tl-navy); }
.tl-subpanel-p { font-size: 13.5px; font-weight: 600; color: var(--tl-navy); margin-top: 4px; } .tl-subpanel-d { font-size: 12.5px; color: #667499; }
.tl-submetrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 0; margin: 4px 18px 14px; padding: 14px 0; border: 1px solid var(--tl-line); border-radius: 10px; }
.tl-submetrics > div { padding: 0 14px; } .tl-submetrics b { display: block; font-size: 17px; font-weight: 700; color: var(--tl-navy); }
.tl-submetrics span { font-size: 12px; color: #667499; }
.tl-subpanel-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0 18px; } .tl-subpanel-actions .tl-btn { height: 46px; }
.tl-unmap-ic { width: 40px; height: 40px; border-radius: 50%; background: #FDE3E6; color: #EF4444; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.tl-countbadge { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 10px; background: #EF4444; color: #fff; font-size: 11.5px; font-weight: 700; margin-left: 6px; vertical-align: 2px; }
.tl-dtable.is-unmap td:first-child, .tl-dtable.is-unmap th:first-child { padding-left: 16px; } .tl-dtable.is-unmap .c-act { text-align: right; padding-right: 14px; width: 150px; }
.tl-guide.is-wide { padding: 4px 16px 16px; gap: 0; }
.tl-guide.is-wide .tl-guide-row { display: grid; grid-template-columns: 34px 180px 1fr; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid #EEF2F8; }
.tl-guide.is-wide .tl-guide-row:last-child { border-bottom: 0; }
.tl-guide.is-wide b { font-size: 13.5px; } .tl-guide.is-wide small { font-size: 12.5px; color: #667499; }
/* placements tab */
.tl-placecell b { display: block; font-size: 13px; font-weight: 600; color: var(--tl-navy); } .tl-placecell a { font-size: 12px; }
.tl-dtable.is-places th:first-child, .tl-dtable.is-places td:first-child { padding-left: 16px; } .tl-dtable.is-places .c-act { text-align: right; padding-right: 14px; width: 70px; }
.tl-dtable.is-places td { height: 48px; }
/* edit & settings tab */
.tl-esettings { display: grid; grid-template-columns: minmax(0, 1fr) 376px; gap: 12px; align-items: start; padding-bottom: 16px; }
.tl-esettings-main { display: flex; flex-direction: column; gap: 12px; }
.tl-esettings-side { display: flex; flex-direction: column; gap: 12px; }
.tl-esec { padding: 16px 18px 17px; }
.tl-esec-head h2 { font-size: 18px; font-weight: 700; color: var(--tl-navy); margin: 0; }
.tl-esec-head p { font-size: 13px; color: #5D6E95; margin: 4px 0 0; }
.tl-esec .tl-egrid { margin-top: 14px; }
.tl-egrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 22px; }
.tl-esel { position: relative; display: flex; align-items: center; height: 44px; border: 1px solid #DCE5F2; border-radius: 9px; background: #fff; }
.tl-esel select { appearance: none; -webkit-appearance: none; width: 100%; height: 100%; padding: 0 34px 0 14px; border: 0; background: none; font: inherit; font-size: 14px; font-weight: 500; color: var(--tl-navy); cursor: pointer; outline: none; }
.tl-esel select.has-lead { padding-left: 46px; }
.tl-esel-lead { position: absolute; left: 12px; display: inline-flex; align-items: center; pointer-events: none; }
.tl-esel-lead .brand { border-radius: 5px; } .tl-esel-lead .flag { width: 24px; height: 16px; border-radius: 3px; }
.tl-esel-ic { width: 26px; height: 26px; border-radius: 7px; background: #E4EEFE; color: var(--tl-blue); display: inline-flex; align-items: center; justify-content: center; }
.tl-esel .tl-caret { position: absolute; right: 12px; pointer-events: none; }
.tl-esel.is-status select { font-weight: 500; color: var(--tl-navy); }
.tl-statusdot { width: 10px; height: 10px; border-radius: 50%; background: #16A34A; display: block; margin-left: 4px; } .tl-esel.is-status.tone-amber .tl-statusdot { background: #F59E0B; }
.tl-eurl { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 8px 0 14px; border: 1px solid #DCE5F2; border-radius: 9px; background: #F7FAFE; }
.tl-eurl a { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tl-blue); font-size: 13.5px; font-weight: 600; text-decoration: none; }
.tl-eprev { display: flex; align-items: center; gap: 9px; margin-top: 16px; }
.tl-eprev a:first-child { flex: 1; min-width: 0; height: 46px; display: flex; align-items: center; padding: 0 14px; border: 1px solid #DCE7FB; border-radius: 9px; background: #F3F7FE; color: var(--tl-blue); font-size: 14px; font-weight: 600; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tl-eprev .tl-ibtn.is-box2 { width: 46px; height: 46px; }
.tl-esettings-side .tl-btn.is-full { margin-top: 10px; height: 50px; }
.tl-esettings-side .tl-dkv { padding: 14px 0 0; } .tl-esettings-side .tl-dkv dd .tl-link { font-size: 12.5px; }
.tl-esettings-side .tl-actgrid { padding: 14px 0 0; }
.tl-efoot { display: flex; align-items: center; gap: 12px; padding: 4px 2px 0; }
.tl-efoot .tl-btn { height: 48px; padding: 0 20px; font-size: 14.5px; }
.tl-mform { padding: 4px 2px 12px; } .tl-mform.is-grid, .tl-modalform.is-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.tl-modalform .is-full { grid-column: 1 / -1; }
.tl-mfoot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding-top: 6px; }
.tl-compare .tl-dtable { margin-top: 10px; }
@media (max-width: 1439px) {
  .tl-drow2, .tl-drow2.is-pf, .tl-drow2.is-src, .tl-drow3, .tl-drow3.is-pf, .tl-drow3.is-src, .tl-drow4, .tl-drow5, .tl-subwrap, .tl-esettings { grid-template-columns: minmax(0, 1fr) 380px; }
  .tl-drow3.is-pf > :nth-child(3), .tl-drow4 > :nth-child(3) { grid-column: 1 / -1; }
  .tl-dstats.is-6, .tl-dstats.is-5, .tl-dstats.is-6eq, .tl-dstats.is-sub { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tl-dstats.is-sub .tl-attrcard { grid-column: 1 / -1; }
}
@media (max-width: 1099px) {
  .tl-dhead { flex-wrap: wrap; } .tl-dhead-r { width: 100%; }
  .tl-drow2, .tl-drow2.is-pf, .tl-drow2.is-src, .tl-drow3, .tl-drow3.is-pf, .tl-drow3.is-src, .tl-drow4, .tl-drow5, .tl-subwrap, .tl-esettings { grid-template-columns: minmax(0, 1fr); }
  .tl-dstats.is-6, .tl-dstats.is-5, .tl-dstats.is-4, .tl-dstats.is-6eq, .tl-dstats.is-sub { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tl-egrid { grid-template-columns: minmax(0, 1fr); } .tl-funnel { flex-wrap: wrap; gap: 12px; } .tl-qual { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .tl-subpanel { position: static; }
  .tl-subfilters { flex-wrap: wrap; row-gap: 10px; } .tl-subfilters .tl-split { margin-left: 0; }
}
@media (max-width: 767px) {
  .tl-dstats.is-6, .tl-dstats.is-5, .tl-dstats.is-4, .tl-dstats.is-6eq, .tl-dstats.is-sub { grid-template-columns: minmax(0, 1fr); }
  .tl-actgrid, .tl-subpanel-actions, .tl-modalform.is-grid { grid-template-columns: minmax(0, 1fr); }
  .tl-dhead-t h1 { font-size: 21px; }
}

.tl-ovwrap { display: grid; grid-template-columns: minmax(0, 1fr) 294px; gap: 12px; align-items: start; padding-bottom: 13px; }
.tl-ovmain { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.tl-ovrow2 { display: grid; grid-template-columns: minmax(0, 1fr) 268px; gap: 12px; align-items: start; }
.tl-ovrow3 { display: grid; grid-template-columns: 549px minmax(0, 1fr); gap: 12px; align-items: start; }
@media (min-width: 1440px) { .tl-drow4 { grid-template-columns: 483px minmax(0, 1fr) 348px; } }
@media (max-width: 1439px) { .tl-ovwrap { grid-template-columns: minmax(0, 1fr) 294px; } .tl-ovrow3 { grid-template-columns: minmax(0, 1fr) 1fr; } }
@media (max-width: 1099px) { .tl-ovwrap, .tl-ovrow2, .tl-ovrow3 { grid-template-columns: minmax(0, 1fr); } }

/* ---- full task page (design-reference-new/tasks-task-detail.png) ---- */
.tk-task-main { background: #fff; }
.tk-task-body { flex: 1; min-height: 0; display: flex; align-items: stretch; }
.tk-task-doc { flex: 1; min-width: 0; overflow-y: auto; padding: 12px 22px 60px; }
.tk-back { margin-right: 2px; }
.tk-crumb-ico { color: #64748B; display: inline-flex; }
.tk-created { font-size: 13px; color: #64748B; margin-right: 4px; }
.tk-brain { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 8px; border: 1px solid #C9DBFB; background: #EFF5FF; color: #1B62E8; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tk-brain:hover { background: #E3EDFE; }
.tk-btn-dark { height: 30px; padding: 0 16px; border-radius: 8px; border: 0; background: #16243B; color: #fff; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tk-btn-dark:hover { background: #24344F; }
.tk-type-row { display: flex; align-items: center; gap: 10px; }
.tk-chip { display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 10px; border-radius: 7px; border: 1px solid #E5EAF2; background: #fff; color: #334155; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tk-chip .tk-dot { width: 7px; height: 7px; border-radius: 50%; background: #94A3B8; }
.tk-ref { font-size: 13px; font-weight: 600; color: #64748B; }
.tk-ref-copy { width: 24px; height: 24px; }
.tk-task-title { font-size: 26px; font-weight: 800; letter-spacing: -.02em; color: #0F172A; margin: 12px 0 14px; outline: 0; }
.tk-ai-bar { display: flex; align-items: center; gap: 10px; width: 100%; height: 36px; padding: 0 14px; border: 1px solid #E6EBF5; border-radius: 9px; background: #F7F9FF; color: #69758B; font-size: 13.5px; text-align: left; cursor: pointer; }
.tk-ai-i { color: #A855F7; }
.tk-ai-bar:hover { background: #F1F5FF; }
.tk-props { display: grid; grid-template-columns: 1fr 1fr; column-gap: 40px; row-gap: 8px; margin: 16px 0 4px; padding-bottom: 14px; border-bottom: 1px solid #EEF2F7; }
.tk-prop { display: grid; grid-template-columns: 126px minmax(0, 1fr); align-items: center; min-height: 30px; }
.tk-prop-label { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px; color: #475569; }
.tk-prop-label .tk-i { color: #64748B; }
.tk-prop-value { display: inline-flex; align-items: center; gap: 9px; font-size: 13.5px; color: #0F172A; cursor: pointer; min-width: 0; white-space: nowrap; }
.tk-prop-value .tk-strong { font-weight: 600; }
.tk-prop-value .tk-prio { font-weight: 600; }
.tk-person-lg { font-size: 13.5px; font-weight: 600; }
.tk-arrow { color: #67768B; }
.tk-start { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 13px 0 10px; border-radius: 8px; border: 1px solid #E5EAF2; background: #fff; color: #0F172A; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tk-start:hover { border-color: #C9DBFB; color: #1B62E8; }
.tk-start .tk-i { color: #12B76A; }
.tk-start.is-running .tk-i { color: #EF4444; }
.tk-tracked { font-size: 12.5px; color: #64748B; }
.tk-block { margin-top: 20px; }
.tk-block-title { display: flex; align-items: center; gap: 10px; font-size: 14.5px; font-weight: 700; color: #0F172A; margin: 0 0 10px; }
.tk-block-count { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: #EEF2F7; color: #64748B; font-size: 11.5px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.tk-block-more { margin-left: auto; }
.tk-editor { border: 1px solid #E6EBF3; border-radius: 10px; overflow: hidden; background: #fff; }
.tk-editor-bar { display: flex; align-items: center; gap: 2px; height: 36px; padding: 0 8px; border-bottom: 1px solid #EEF2F7; }
.tk-eb { width: 28px; height: 26px; border: 0; background: none; border-radius: 6px; color: #475569; font-size: 13.5px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tk-eb:hover { background: #F1F5F9; color: #0F172A; }
.tk-eb-t { font-weight: 600; }
.tk-editor-body { padding: 12px 16px 14px; font-size: 14px; line-height: 1.55; color: #334155; outline: 0; min-height: 76px; }
.tk-editor-body p { margin: 0; }
.tk-editor-body ul, .tk-editor-body ol { margin: 6px 0 6px 20px; }
.tk-editor.is-focus { border-color: #C9DBFB; box-shadow: 0 0 0 3px rgba(47,107,255,.08); }
.tk-cl-list { display: flex; flex-direction: column; gap: 8px; }
.tk-att-row { display: flex; align-items: stretch; gap: 12px; flex-wrap: wrap; }
.tk-att-lg { width: 210px; height: 58px; }
.tk-att-lg .tk-att-text { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tk-att-menu { border: 0; background: none; color: #67768B; cursor: pointer; display: inline-flex; padding: 2px; }
.tk-att-add-row { width: 200px; min-height: 58px; flex-direction: row; gap: 9px; font-size: 13.5px; }
.tk-subtable { border: 0; }
.tk-subtable .tk-thead { padding-left: 0; border-bottom: 1px solid #EEF2F7; }
.tk-subtable .tk-row { padding-left: 0; }
.tk-subtable .tk-addrow { padding-left: 0; }
.tk-subtable .tk-thead, .tk-subtable .tk-row, .tk-subtable .tk-addrow { grid-template-columns: minmax(0, 1fr) 122px 140px 125px 40px; }
.tk-subtable .tk-row { height: 34px; }
.tk-subtable .tk-check .tk-i rect { rx: 10; }
.tk-subtable .tk-row:last-of-type { border-bottom: 1px solid #F4F7FA; }
.tk-subtable .tk-title { color: #0F172A; }

/* ---- activity rail ---- */
.tk-rail { width: 413px; flex: none; border-left: 1px solid #EDF1F7; display: flex; flex-direction: column; min-height: 0; background: #fff; padding: 0 0 0 0; }
.tk-rail-tabs { padding: 16px 18px 0; gap: 20px; }
.tk-rail-tabs .tk-tab { padding-bottom: 12px; }
.tk-tab-more { margin-left: auto; color: #67768B; }
.tk-rail-scroll { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 18px 8px; }
.tk-filters { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.tk-fchip { display: inline-flex; align-items: center; gap: 5px; height: 28px; padding: 0 11px; border-radius: 8px; border: 1px solid #E5EAF2; background: #fff; color: #475569; font-size: 12.5px; font-weight: 500; cursor: pointer; }
.tk-fchip.is-active { background: #fff; border-color: #CBD8EA; color: #0F172A; font-weight: 600; }
.tk-timeline { display: flex; flex-direction: column; gap: 16px; }
.tk-tl { display: flex; gap: 11px; }
.tk-tl-body { flex: 1; min-width: 0; }
.tk-tl-text { margin: 0; font-size: 13.5px; line-height: 1.5; color: #334155; }
.tk-tl-text strong { color: #0F172A; font-weight: 600; }
.tk-tl-head { display: flex; align-items: baseline; gap: 8px; margin: 0 0 3px; }
.tk-tl-head strong { font-size: 13.5px; font-weight: 700; color: #0F172A; }
.tk-tl-time { font-size: 12px; color: #67768B; }
.tk-tl-old { color: #64748B; font-weight: 600; }
.tk-tl-new { color: #1B62E8; font-weight: 600; }
.tk-mention { color: #1B62E8; font-weight: 600; }
.tk-tl-file, .tk-tl-image { display: flex; align-items: center; gap: 11px; margin-top: 9px; padding: 12px; border: 1px solid #EAEFF5; border-radius: 10px; }
.tk-tl-image { flex-direction: column; align-items: stretch; gap: 8px; padding: 10px; }
.tk-tl-thumb { height: 108px; border-radius: 8px; background: linear-gradient(135deg, #EEF3FF, #E6EEFC); color: #69758B; display: flex; align-items: center; justify-content: center; }
.tk-tl-fname { display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; font-weight: 600; color: #0F172A; min-width: 0; }
.tk-tl-fsize { font-size: 11.5px; font-weight: 400; color: #67768B; }
.tk-tl-actions { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.tk-react { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 9px; border-radius: 999px; border: 1px solid #E5EAF2; background: #fff; color: #475569; font-size: 12.5px; cursor: pointer; }
.tk-react.is-on { background: #F1F5F9; }
.tk-react b { font-weight: 600; color: #334155; }
.tk-reply { display: inline-flex; align-items: center; gap: 6px; border: 0; background: none; color: #64748B; font-size: 12.5px; cursor: pointer; padding: 0; }
.tk-reply:hover, .tk-react:hover { color: #1B62E8; }
.tk-rail-composer { margin: 0 18px; padding: 12px 0 16px; }
.tk-composer-send { width: 30px; height: 30px; border: 0; border-radius: 8px; background: #2F6BFF; color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tk-composer-send:hover { background: #1B5AF0; }
@media (max-width: 1280px) { .tk-rail { width: 340px; } }
@media (max-width: 1024px) { .tk-task-body { flex-direction: column; } .tk-rail { width: 100%; border-left: 0; border-top: 1px solid #EDF1F7; } }

.tl-dtable.is-srcbd th, .tl-dtable.is-srcbd td { padding: 0 7px; }
.tl-dtable.is-srcbd th:first-child, .tl-dtable.is-srcbd td:first-child { padding-left: 14px; }
.tl-dtable.is-srcbd .c-share { width: 124px; padding-right: 12px; }
.tl-dtable.is-srcbd .c-share em { margin-right: 7px; }
.tl-dtable.is-srcbd .c-share .tl-bar { width: 56px; }
.tl-dstats.is-6eq .tl-dstat-l { white-space: nowrap; }

/* ---- popovers, menus, date picker (hand-written, no libraries) ---- */
.tk-pop { position: fixed; z-index: 90; min-width: 232px; max-width: 320px; background: #fff; border: 1px solid #E6EBF3; border-radius: 12px; box-shadow: 0 16px 40px rgba(15,23,42,.14); padding: 6px; }
.tk-pop-title { padding: 8px 10px 4px; font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #67768B; }
.tk-pop-search { display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px; margin: 2px 2px 6px; border: 1px solid #E5EAF2; border-radius: 8px; color: #67768B; }
.tk-pop-search input { border: 0; outline: 0; background: none; font: inherit; font-size: 13px; color: #0F172A; width: 100%; }
.tk-pop-list { max-height: min(70vh, 620px); overflow-y: auto; display: flex; flex-direction: column; gap: 1px; }
.tk-pop-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 10px; border: 0; background: none; border-radius: 8px; color: #1E293B; font-size: 13.5px; text-align: left; cursor: pointer; }
.tk-pop-item:hover { background: #F1F5F9; }
.tk-pop-item.is-danger { color: #DC2626; }
.tk-pop-item.is-active { background: #EFF5FF; color: #1B62E8; }
.tk-pop-item .tk-i, .tk-pop-item .icon { color: #64748B; flex: none; }
.tk-pop-item.is-danger .tk-i, .tk-pop-item.is-danger .icon { color: #DC2626; }
.tk-pop-label { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.tk-pop-sub { font-size: 11.5px; color: #67768B; }
.tk-pop-badge { font-size: 11.5px; color: #64748B; }
.tk-pop-ico { width: 16px; }
.tk-pop-div { height: 1px; background: #EEF2F7; margin: 5px 6px; }
.tk-pop-head { padding: 8px 10px 4px; font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #67768B; }
.tk-pop-foot { border-top: 1px solid #EEF2F7; margin-top: 5px; padding: 8px 6px 4px; }
.tk-datepick { width: 268px; padding: 10px; }
.tk-dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; font-size: 13.5px; color: #0F172A; }
.tk-dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.tk-dp-dow span { text-align: center; font-size: 11px; font-weight: 600; color: #67768B; padding-bottom: 4px; }
.tk-dp-cell { height: 32px; border: 0; background: none; border-radius: 8px; font-size: 13px; color: #1E293B; cursor: pointer; }
.tk-dp-cell:hover { background: #EFF5FF; color: #1B62E8; }
.tk-dp-cell.is-today { font-weight: 700; color: #1B62E8; }
.tk-dp-cell.is-sel { background: #2F6BFF; color: #fff; }
.tk-dp-cell.is-empty { pointer-events: none; }
.tk-dp-foot { display: flex; flex-wrap: wrap; gap: 6px; border-top: 1px solid #EEF2F7; margin-top: 8px; padding-top: 8px; }
.tk-dp-foot .tk-btn-ghost { height: 26px; padding: 0 9px; font-size: 12.5px; }
.tk-dp-clear { margin-left: auto; color: #DC2626; }

/* ---- Create Task modal (design-reference-new/tasks-create-modal.png) ---- */
.modal-backdrop .tk-create-modal { width: min(920px, 94vw); padding: 0; background: #fff; border-radius: 14px; overflow: hidden; }
.tk-create-tabs { display: flex; align-items: center; gap: 4px; height: 56px; padding: 0 16px; border-bottom: 1px solid #EDF1F7; }
.tk-ct-tab { display: inline-flex; align-items: center; gap: 8px; height: 100%; padding: 0 14px; border: 0; background: none; color: #475569; font-size: 15px; font-weight: 500; cursor: pointer; border-bottom: 2px solid transparent; }
.tk-ct-tab.is-active { color: #0F172A; font-weight: 700; border-bottom-color: #2F6BFF; }
.tk-ct-check { width: 18px; height: 18px; border-radius: 5px; background: #2F6BFF; color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.tk-ct-tab .tk-i, .tk-ct-tab .icon { color: #475569; }
.tk-ct-actions { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; }
.tk-ct-close { border: 1px solid #E5EAF2; }
.tk-create-body { padding: 18px 20px 22px; min-height: 270px; }
.tk-ct-row { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.tk-ct-chip { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border: 1px solid #E3E9F2; border-radius: 9px; background: #fff; color: #0F172A; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tk-ct-chip:hover { border-color: #C9DBFB; }
.tk-ct-chip.is-filled { background: #F1F5F9; }
.tk-ct-chip .tk-i, .tk-ct-chip .icon { color: #475569; }
.tk-ct-radio { width: 15px; height: 15px; border-radius: 50%; border: 4px solid #334155; }
.tk-ct-templates { margin-left: auto; }
.tk-ct-name { width: 100%; height: 46px; padding: 0 14px; border: 1.5px solid #9EC2FB; border-radius: 10px; background: #FBFDFF; font: inherit; font-size: 16px; color: #0F172A; outline: 0; }
.tk-ct-name::placeholder { color: #67768B; }
.tk-ct-name.is-error { border-color: #F87171; }
.tk-ct-desc { display: flex; align-items: center; gap: 7px; margin: 16px 0 18px; color: #67768B; font-size: 14px; cursor: text; }
.tk-ct-ai-label { color: #64748B; font-weight: 600; }
.tk-ct-descbox { width: 100%; min-height: 60px; padding: 10px 12px; border: 1px solid #E3E9F2; border-radius: 9px; font-size: 13.5px; color: #0F172A; outline: 0; }
.tk-ct-chips { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tk-ct-more { padding: 0 10px; }
.tk-ct-fields { margin-top: 20px; }
.tk-ct-fields-label { font-size: 13px; color: #64748B; }
.tk-ct-field-list { display: flex; flex-wrap: wrap; gap: 10px; margin: 8px 0; }
.tk-ct-field { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #64748B; }
.tk-ct-field input { height: 32px; padding: 0 10px; border: 1px solid #E3E9F2; border-radius: 8px; font: inherit; font-size: 13px; }
.tk-ct-newfield { display: inline-flex; align-items: center; gap: 10px; height: 44px; margin-top: 8px; padding: 0 14px; border: 1.5px dashed #D7E0EC; border-radius: 9px; background: none; color: #64748B; font-size: 13.5px; cursor: pointer; }
.tk-ct-newfield:hover { border-color: #2F6BFF; color: #2F6BFF; }
.tk-create-foot { display: flex; align-items: center; gap: 12px; padding: 16px 20px; border-top: 1px solid #EDF1F7; }
.tk-ct-foot-right { margin-left: auto; display: inline-flex; align-items: center; gap: 10px; }
.tk-ct-watch { width: auto; padding: 0 6px; gap: 4px; font-size: 12.5px; color: #475569; }
.tk-ct-create { display: inline-flex; align-items: stretch; border-radius: 9px; overflow: hidden; background: #2F6BFF; }
.tk-ct-create-main { border: 0; background: none; color: #fff; font-size: 15px; font-weight: 700; padding: 0 24px; height: 46px; cursor: pointer; }
.tk-ct-create-caret { width: 36px; border: 0; border-left: 1px solid rgba(255,255,255,.28); background: none; color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tk-ct-create-main:hover, .tk-ct-create-caret:hover { background: rgba(0,0,0,.09); }
.tk-ct-soon { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; height: 250px; color: #64748B; text-align: center; }
.tk-ct-soon strong { font-size: 16px; color: #0F172A; }
.tk-ct-docbody { min-height: 140px; margin-top: 14px; padding: 12px 14px; border: 1px solid #E3E9F2; border-radius: 10px; font-size: 14px; color: #334155; outline: 0; }
.tk-create-modal.is-collapsed .tk-create-body, .tk-create-modal.is-collapsed .tk-create-foot { display: none; }
.tk-ct-listdot { width: 16px; height: 16px; border-radius: 50%; background: #2F6BFF; flex: none; }
.tk-ct-listdot.tone-green { background: #12B76A; } .tk-ct-listdot.tone-amber { background: #F59E0B; } .tk-ct-listdot.tone-red { background: #EF4444; } .tk-ct-listdot.tone-purple { background: #7C3AED; }

/* ---- share modal, status editor, drag states ---- */
.tk-swatch { width: 15px; height: 15px; border-radius: 5px; display: inline-block; flex: none; }
.tk-share-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 38px; border: 0; border-radius: 9px; background: #F97316; color: #fff; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.tk-share-btn:hover { background: #EA6A0B; }
.modal-backdrop .tk-share-modal { width: min(460px, 94vw); padding: 0; }
.tk-share { padding: 20px 22px 22px; }
.tk-share-head { display: flex; align-items: center; justify-content: space-between; }
.tk-share-head h2 { font-size: 19px; font-weight: 800; letter-spacing: -.01em; margin: 0; }
.tk-share-sub { display: flex; align-items: center; gap: 8px; margin: 6px 0 16px; font-size: 13px; color: #64748B; }
.tk-share-name { display: inline-flex; align-items: center; gap: 5px; font-weight: 700; color: #0F172A; }
.tk-share-invite { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 5px 0 14px; border: 2px solid #F97316; border-radius: 10px; }
.tk-share-invite input { flex: 1; border: 0; outline: 0; font: inherit; font-size: 13.5px; color: #0F172A; background: none; }
.tk-share-invite button { height: 32px; padding: 0 18px; border: 0; border-radius: 8px; background: #F97316; color: #fff; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.tk-share-link { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 16px 0 6px; font-size: 13.5px; color: #334155; }
.tk-share-link > span { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.tk-share-info { color: #67768B; display: inline-flex; }
.tk-share-list { margin-top: 12px; }
.tk-share-label { font-size: 12.5px; color: #64748B; margin-bottom: 8px; }
.tk-share-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; font-size: 13.5px; }
.tk-share-rname { flex: 1; font-weight: 600; color: #0F172A; }
.tk-share-inherit { font-size: 11.5px; color: #67768B; }
.tk-share-caret { color: #67768B; display: inline-flex; }
.tk-share-role { height: 28px; border: 1px solid #E5EAF2; border-radius: 7px; font: inherit; font-size: 12.5px; color: #475569; padding: 0 6px; }
.tk-share-toggle { width: 38px; height: 22px; border-radius: 999px; border: 0; background: #CBD5E1; position: relative; cursor: pointer; }
.tk-share-toggle span { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: left var(--t-fast); }
.tk-share-toggle.is-on { background: #F97316; } .tk-share-toggle.is-on span { left: 19px; }
.tk-share-empty { margin: 4px 0 0; font-size: 13px; }
.tk-share-private { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 42px; margin-top: 18px; border: 1px solid #E5EAF2; border-radius: 10px; background: #F8FAFC; color: #0F172A; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.tk-share-private:hover { background: #F1F5F9; }
.tk-status-editor { display: flex; flex-direction: column; gap: 10px; }
.tk-se-row { display: flex; align-items: center; gap: 10px; }
.tk-se-row .tk-status-pill { flex: 1; }
.tk-se-color { height: 30px; border: 1px solid #E5EAF2; border-radius: 7px; font-size: 12.5px; padding: 0 6px; }
.tk-se-add { display: flex; gap: 8px; margin-top: 4px; }
body.tk-dragging { user-select: none; cursor: grabbing; }
.tk-row.is-dragging { opacity: .5; background: #EFF5FF; }
.tk-row.tk-drop-before { box-shadow: inset 0 2px 0 #2F6BFF; }
.tk-group.tk-drop-into .tk-table { box-shadow: 0 0 0 2px #C9DBFB; }

/* ---- board, calendar and the secondary screens ---- */
.tk-board { display: flex; gap: 14px; align-items: flex-start; overflow-x: auto; padding-bottom: 20px; }
.tk-col { width: 292px; flex: none; background: #F7F9FD; border: 1px solid #EAEFF6; border-radius: 12px; padding: 10px; }
.tk-col-head { display: flex; align-items: center; gap: 8px; padding: 2px 2px 10px; }
.tk-col-head .tk-group-count { margin-right: auto; }
.tk-col-body { display: flex; flex-direction: column; gap: 8px; min-height: 60px; }
.tk-card { background: #fff; border: 1px solid #EAEFF5; border-radius: 10px; padding: 10px 11px; cursor: grab; box-shadow: var(--shadow-xs); }
.tk-card:hover { border-color: #C9DBFB; }
.tk-card.is-dragging { opacity: .5; }
.tk-card-top { display: flex; align-items: flex-start; gap: 9px; }
.tk-card-title { font-size: 13.5px; color: #0F172A; line-height: 1.35; }
.tk-card-foot { display: flex; align-items: center; gap: 10px; margin-top: 9px; }
.tk-card-due, .tk-card-meta { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: #64748B; }
.tk-card-av { margin-left: auto; }
.tk-col-add { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 6px; border: 0; background: none; color: #67768B; font-size: 13px; cursor: pointer; border-radius: 8px; }
.tk-col-add:hover { background: #EEF3FB; color: #2F6BFF; }
.tk-col.tk-drop-into { box-shadow: 0 0 0 2px #C9DBFB; }
.tk-cal { background: #fff; border: 1px solid #EAEFF5; border-radius: 12px; overflow: hidden; }
.tk-cal-head { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid #EEF2F7; }
.tk-cal-head strong { font-size: 15px; }
.tk-cal-head .tk-btn-ghost { margin-left: auto; }
.tk-cal-dow { display: grid; grid-template-columns: repeat(7, 1fr); border-bottom: 1px solid #EEF2F7; }
.tk-cal-dow span { padding: 8px 10px; font-size: 11.5px; font-weight: 600; color: #67768B; }
.tk-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); }
.tk-cal-cell { min-height: 108px; border-right: 1px solid #F1F5F9; border-bottom: 1px solid #F1F5F9; padding: 6px 7px 8px; position: relative; }
.tk-cal-cell:nth-child(7n) { border-right: 0; }
.tk-cal-cell.is-muted { background: #FAFCFE; }
.tk-cal-cell.is-today { background: #F5F9FF; }
.tk-cal-cell.is-today .tk-cal-num { background: #2F6BFF; color: #fff; }
.tk-cal-num { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; border-radius: 999px; font-size: 12px; font-weight: 600; color: #475569; }
.tk-cal-task { display: block; margin-top: 4px; padding: 4px 7px; border-radius: 6px; background: #EEF2F7; color: #0F172A; font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: grab; }
.tk-cal-task.tone-blue { background: #E3EDFD; color: #1B62E8; } .tk-cal-task.tone-amber { background: #FEF3D8; color: #B45309; }
.tk-cal-task.tone-green { background: #DCF7EA; color: #087F52; } .tk-cal-task.is-done { text-decoration: line-through; opacity: .7; }
.tk-cal-add { position: absolute; right: 6px; top: 6px; width: 20px; height: 20px; border: 0; border-radius: 6px; background: none; color: #61768F; cursor: pointer; display: none; }
.tk-cal-cell:hover .tk-cal-add { display: inline-flex; align-items: center; justify-content: center; }
.tk-cal-add:hover { background: #EEF3FB; color: #2F6BFF; }
.tk-cal-cell.tk-drop-into { box-shadow: inset 0 0 0 2px #C9DBFB; }
.tk-screen-sub { font-size: 13px; color: #64748B; margin-left: 4px; }
.tk-inbox { display: flex; flex-direction: column; gap: 6px; }
.tk-inbox-row { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid #EDF1F7; border-radius: 10px; background: #fff; }
.tk-inbox-row.is-unread { background: #F7FAFF; border-color: #DCE8FC; }
.tk-inbox-row:hover { border-color: #C9DBFB; }
.tk-inbox-text { flex: 1; display: flex; flex-direction: column; gap: 2px; font-size: 12.5px; color: #64748B; min-width: 0; }
.tk-inbox-text strong { font-size: 13.5px; color: #0F172A; }
.tk-inbox-time { font-size: 11.5px; color: #67768B; }
.tk-fav-grid, .tk-more-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.tk-fav, .tk-more-card { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid #EDF1F7; border-radius: 12px; background: #fff; }
.tk-more-card { flex-direction: column; align-items: flex-start; gap: 6px; }
.tk-more-card strong { font-size: 14px; color: #0F172A; }
.tk-more-card span:last-child { font-size: 12.5px; color: #64748B; }
.tk-fav:hover, .tk-more-card:hover { border-color: #C9DBFB; box-shadow: var(--shadow-sm); }
.tk-fav-text { flex: 1; display: flex; flex-direction: column; }
.tk-fav-text strong { font-size: 13.5px; } .tk-fav-text span { font-size: 11.5px; color: #67768B; }
.tk-star.is-on { color: #F59E0B; }
.btn-xs { height: 24px; padding: 0 10px; font-size: 12px; }

/* =====================================================================
   Knowledge & Files  (design-reference-new/knowledge-*.png)
   Prefix: kf-   Two areas share the shell: .kf-area-files / .kf-area-knowledge
   ===================================================================== */
/* Neutral file-type tiles (the saturated brand colours stay put in both themes). */
:root { --kf-tile-card: #FFFFFF; --kf-tile-card-border: #E7EDF5; --kf-tile-neutral: #E2E8F0; --kf-tile-neutral-ink: #7C8FA8;
  --kf-tile-mint: #D1FAE5; --kf-tile-mint-ink: #0F9D6B; --kf-tile-steel: #E7EEF8; --kf-tile-slate: #94A3B8; --kf-folder-inner: #EFF6FF; }
.page-kf { --topbar-h: 55px; --kf-side-w: 245px; --kf-panel-w: 325px; --kf-border: #E9EFF6; --kf-line: #EFF3F8;
  --kf-txt: #0D1B2E; --kf-muted: #69768B; --kf-soft: #5F6E82; --kf-blue: #0A5CF5; --kf-blue-dk: #0B4FD4; }
.page-kf .page-content { padding: 0; max-width: none; display: flex; flex-direction: column; }
.page-kf .topbar { background: #FCFDFE; border-bottom: 1px solid var(--kf-line); }
.kf-topbar-toggle { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; color: #66768C; flex: none; margin-right: -4px; }
.kf-topbar-toggle:hover { background: #EEF3FA; color: var(--kf-txt); }
.kf-app { display: flex; align-items: stretch; flex: 1; min-height: calc(100vh - var(--topbar-h)); background: #FFF; }
.kf-i, .kf-fi, .kf-ci { display: block; flex: none; }
.kf-muted { color: var(--kf-muted); }

/* ---------- storage card (inside the dark app sidebar) ---------- */
.kf-storage { margin: 12px 14px; padding: 14px 14px 13px; background: #0C1E31; border: 1px solid rgba(255,255,255,.08); border-radius: 14px; }
.kf-storage-head { display: flex; align-items: center; gap: 9px; color: #fff; }
.kf-storage-head strong { font-size: 13.5px; font-weight: 600; letter-spacing: -.01em; }
.kf-storage-head .kf-i { color: #E2E8F0; }
.kf-storage-line { margin: 7px 0 0; font-size: 12.5px; color: #93A4BC; }
.kf-storage-bar { margin-top: 10px; height: 6px; border-radius: 99px; background: #1B3450; overflow: hidden; }
.kf-storage-bar > span { display: block; height: 100%; border-radius: 99px; background: #1F6BFF; }
.kf-storage-btn { margin-top: 12px; width: 100%; height: 32px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 9px; background: #17304C; color: #E8EFF9; font-size: 13px; font-weight: 500; }
.kf-storage-btn:hover { background: #1E3C5E; }

/* ---------- module sidebar ---------- */
.kf-side { width: var(--kf-side-w); flex: none; background: #FBFCFE; border-right: 1px solid var(--kf-line); overflow-y: auto; max-height: calc(100vh - var(--topbar-h)); position: sticky; top: var(--topbar-h); scrollbar-width: thin; }
.kf-side-inner { padding: 4px 16px 24px; display: flex; flex-direction: column; }
.kf-side-title { font-size: 20.5px; font-weight: 700; letter-spacing: -.02em; color: var(--kf-txt); line-height: 1.15; }
.kf-side-sub { margin-top: 3px; font-size: 11.7px; line-height: 1.35; color: #69768A; }
.kf-new-wrap { position: relative; margin-top: 9px; }
.kf-new { position: relative; width: 100%; height: 32px; display: flex; align-items: center; justify-content: center; gap: 7px; border-radius: 9px; background: var(--kf-blue); color: #fff; font-size: 13.2px; font-weight: 600; letter-spacing: -.01em; box-shadow: 0 1px 2px rgba(10,92,245,.25); }
.kf-new:hover { background: var(--kf-blue-dk); }
.kf-new-caret { position: absolute; right: 11px; opacity: .92; }
.kf-nav { margin-top: 17px; display: flex; flex-direction: column; }
.kf-nav-item { display: flex; align-items: center; gap: 11px; height: 29px; padding: 0 9px; border-radius: 8px; color: #33465F; font-size: 12.6px; font-weight: 500; }
.kf-nav-item:hover { background: #F0F4FA; }
.kf-nav-item.is-active { background: #E8F1FE; color: #0B2545; font-weight: 600; }
.kf-nav-item.is-active .kf-nav-ico { color: #D8365A; }
.kf-nav-ico { display: flex; color: #16283F; }
.kf-nav-label { flex: 1; min-width: 0; }
.kf-n { font-size: 11.6px; font-weight: 500; color: #5A687E; font-variant-numeric: tabular-nums; }
.kf-n.is-pill { background: #E7EDF6; color: #55637A; border-radius: 6px; padding: 2px 6px; font-size: 11.2px; font-weight: 600; }
.kf-sec { margin-top: 14px; }
.kf-sec-head { display: flex; align-items: center; justify-content: space-between; padding: 0 3px 0 6px; }
.kf-sec-head h3 { font-size: 13.4px; font-weight: 700; letter-spacing: -.01em; color: var(--kf-txt); }
.kf-sec-add { width: 25px; height: 25px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; color: #4A5D76; background: #EDF2F9; }
.kf-sec-add:hover { background: #DFE8F4; }
.kf-tree { margin-top: 4px; }
.kf-tree-group + .kf-tree-group { margin-top: 3px; }
.kf-tree-row { display: flex; align-items: center; gap: 6px; height: 30px; padding-right: 8px; border-radius: 8px; }
.kf-tree-row:hover { background: #F0F4FA; }
.kf-tree-row.is-active { background: #E8F1FE; }
.kf-tree-toggle { width: 16px; height: 16px; display: inline-flex; align-items: center; justify-content: center; color: #56698A; flex: none; }
.kf-tree-link { display: flex; align-items: center; gap: 9px; flex: 1; min-width: 0; color: inherit; }
.kf-tree-root .kf-tree-name { font-size: 12.8px; font-weight: 600; color: var(--kf-txt); letter-spacing: -.01em; }
.kf-tree-kids { display: flex; flex-direction: column; }
.kf-tree-child { height: 27px; padding-left: 26px; }
.kf-tree-child .kf-tree-ico { color: #65768A; }
.kf-tree-child .kf-tree-name { font-size: 12.3px; color: #61738C; }
.kf-tree-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-tree-group:not(.is-open) .kf-tree-kids { display: none; }
.kf-tree-group:not(.is-open) .kf-tree-toggle { transform: rotate(-90deg); }
.kf-sec-tags { margin-top: 15px; }
.kf-taglist { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; }
.kf-taglist-item { display: flex; align-items: center; gap: 10px; height: 21px; padding: 0 8px 0 6px; border-radius: 6px; color: #465A73; font-size: 12.3px; }
.kf-taglist-item:hover { background: #F0F4FA; }
.kf-tag-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-taglist-more { display: flex; cursor: pointer; align-items: center; gap: 5px; margin-top: 4px; padding: 4px 6px; border-radius: 6px; font-size: 12.3px; font-weight: 500; color: var(--kf-blue); }
.kf-taglist-more:hover { background: #F0F4FA; }
.kf-taglist-more .kf-i { transition: transform var(--t-fast); }
.kf-taglist-more.is-open .kf-i { transform: rotate(180deg); }
.kf-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: #94A3B8; }
.kf-dot.tone-blue { background: #2563EB; } .kf-dot.tone-green { background: #16A34A; } .kf-dot.tone-purple { background: #7C3AED; }
.kf-dot.tone-orange { background: #F59E0B; } .kf-dot.tone-red { background: #EF4444; } .kf-dot.tone-amber { background: #F59E0B; }
.kf-dot.tone-teal { background: #14B8A6; } .kf-dot.tone-pink { background: #EC4899; } .kf-dot.tone-slate { background: #94A3B8; }

/* ---------- main surface ---------- */
.kf-main { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #FFF; }
.kf-surface { flex: 1; display: flex; flex-direction: column; padding: 0; }
.kf-head { display: flex; align-items: center; gap: 14px; padding: 14px 17px 0; }
.kf-head-ico { width: 33px; height: 33px; flex: none; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; background: var(--kf-blue); color: #fff; box-shadow: 0 4px 11px rgba(37,99,235,.33); }
.kf-head-ico .kf-i { color: #fff; }
.kf-head-text { flex: 1; min-width: 0; }
.kf-head-text h1 { font-size: 21px; font-weight: 700; letter-spacing: -.005em; color: var(--kf-txt); line-height: 1.2; }
.kf-head-text p { margin-top: 2px; font-size: 12px; color: #6A7688; }
.kf-head-actions { display: flex; align-items: center; gap: 12px; }
.kf-viewtoggle { display: inline-flex; align-items: center; gap: 4px; padding: 3px; border: 1px solid var(--kf-border); border-radius: 10px; background: #fff; }
.kf-vt { width: 30px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; color: #67768A; }
.kf-vt:hover { background: #F1F5FA; color: var(--kf-txt); }
.kf-vt.is-active { background: var(--kf-blue); color: #fff; }
.kf-iconbtn { display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; color: #67768A; }
.kf-iconbtn:hover { background: #F1F5FA; color: var(--kf-txt); }
.kf-iconbtn-lg { width: 34px; height: 34px; border: 1px solid var(--kf-border); }
.kf-iconbtn-sq { width: 30px; height: 30px; background: #EFF3F9; color: #33465F; }
.kf-iconbtn-mini { width: 22px; height: 22px; color: var(--kf-blue); }

/* quick actions */
.kf-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 11px; margin: 8px 17px 0; }
.kf-quick-tile { display: flex; align-items: center; gap: 11px; height: 62px; padding: 0 11px; border: 1px solid var(--kf-border); border-radius: 12px; background: #fff; text-align: left; }
.kf-quick-tile:hover { border-color: #C9DBFB; box-shadow: 0 2px 8px rgba(15,23,42,.05); }
.kf-quick-ico { width: 35px; height: 35px; flex: none; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; }
.kf-quick-ico.tone-blue { background: #E4EFFE; color: #2563EB; }
.kf-quick-ico.tone-indigo { background: #E6EAFE; color: #4F46E5; }
.kf-quick-ico.tone-violet { background: #F1E9FE; color: #7C3AED; }
.kf-quick-ico.tone-teal { background: #DAF8F1; color: #0D9488; }
.kf-quick-text { display: flex; flex-direction: column; min-width: 0; gap: 1px; }
.kf-quick-text strong { font-size: 12.4px; font-weight: 600; color: var(--kf-txt); letter-spacing: -.005em; white-space: nowrap; }
.kf-quick-text span { font-size: 11.8px; color: var(--kf-soft); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* filters */
.kf-filters { display: flex; align-items: center; gap: 8px; margin: 0 17px; padding: 26px 0 0; }
.kf-search { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px; border: 1px solid var(--kf-border); border-radius: 10px; background: #fff; color: #63768D; }
.kf-search input { flex: 1; min-width: 0; border: 0; background: none; font-size: 12px; color: var(--kf-txt); outline: none; }
.kf-search input::placeholder { color: #63768D; }
.kf-search:focus-within { border-color: #B9D2FA; box-shadow: 0 0 0 3px rgba(37,99,235,.10); }
.kf-select { position: relative; display: inline-flex; align-items: center; height: 32px; border: 1px solid var(--kf-border); border-radius: 10px; background: #fff; }
.kf-select { flex: none; }
.kf-select select { appearance: none; border: 0; background: none; outline: none; width: 100%; height: 100%; padding: 0 26px 0 11px; font-size: 12px; font-weight: 500; color: #2B3D55; cursor: pointer; text-overflow: ellipsis; }
.kf-filters .kf-select[data-w="type"] { width: 87px; }
.kf-filters .kf-select[data-w="collection"] { width: 115px; }
.kf-filters .kf-select[data-w="tag"] { width: 82px; }
.kf-filters .kf-select[data-w="modified"] { width: 111px; }
.kf-filters .kf-select + .kf-pop { margin-left: 8px; }
.kf-filter-btn { flex: none; }
.kf-select .kf-i { position: absolute; right: 8px; color: #65768A; pointer-events: none; }
.kf-filter-btn { width: 37px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--kf-border); border-radius: 10px; background: #F2F6FC; color: #3E5270; }
.kf-filter-btn:hover { background: #E7EEF8; }

/* ---------- table ---------- */
.kf-tablewrap { min-height: 0; overflow: visible; margin-top: 28px; }
.kf-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.kf-table thead th { height: 35px; padding: 0 6px 0 0; text-align: left; font-size: 12px; font-weight: 500; color: #68768A; border-bottom: 1px solid var(--kf-line); white-space: nowrap; }
.kf-table thead th a { color: inherit; display: inline-flex; align-items: center; gap: 5px; }
.kf-table thead th a:hover { color: var(--kf-txt); }
.kf-sortcaret { color: #64768D; }
.kf-sortcaret.is-on { color: var(--kf-blue); }
.kf-c-check { width: 50px; padding: 0 0 0 23px !important; }
.kf-c-name  { width: auto; min-width: 139px; }
.kf-c-type  { width: 71px; }
.kf-c-coll  { width: 99px; }
.kf-c-tags  { width: 118px; }
.kf-c-owner { width: 63px; }
.kf-c-mod   { width: 93px; }
.kf-c-size  { width: 80px; }
.kf-c-act   { width: 40px; text-align: right; color: #64748B; }
.kf-row { height: 36px; border-bottom: 1px solid #F2F5F9; }
.kf-row:hover { background: #F8FBFF; }
.kf-row.is-open { background: #EBF4FE; }
.kf-row td { padding: 0 6px 0 0; font-size: 12px; color: #556880; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-c-name .kf-name { display: flex; align-items: center; gap: 9px; min-width: 0; color: var(--kf-txt); font-weight: 500; }
.kf-name-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-c-mod, .kf-c-size { color: #677689; font-variant-numeric: tabular-nums; }
.kf-c-type, .kf-c-coll { color: #64788F; }
.kf-c-act { text-align: right; padding-right: 16px !important; }
.kf-rowmenu { width: 26px; height: 26px; color: #64748B; }
.kf-check { position: relative; display: inline-flex; width: 16px; height: 16px; cursor: pointer; }
.kf-check input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.kf-check span { width: 16px; height: 16px; border: 1.5px solid #CBD7E6; border-radius: 5px; background: #fff; display: inline-flex; align-items: center; justify-content: center; transition: background .12s, border-color .12s; }
.kf-check input:checked + span { background: var(--kf-blue); border-color: var(--kf-blue); }
.kf-check input:checked + span::after { content: ""; width: 9px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) translate(1px, -1px); }
.kf-check input:focus-visible + span { box-shadow: 0 0 0 3px rgba(37,99,235,.28); }
.kf-tag { display: inline-flex; align-items: center; height: 20px; padding: 0 6px; margin-right: 4px; border-radius: 6px; background: #E6EFFD; color: #1D56EB; font-size: 11px; font-weight: 500; text-transform: lowercase; }
.kf-row-empty td { padding: 40px 0; }
.kf-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--kf-soft); }
.kf-empty strong { color: var(--kf-txt); font-size: 15px; }
.kf-empty .kf-i { color: #5E7797; }

/* ---------- footer ---------- */
.kf-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 23px 10px 24px; padding: 0 18px; height: 58px; border: 1px solid var(--kf-border); border-radius: 12px; background: #fff; }
.kf-foot-count { font-size: 12.3px; color: #47596F; }
.kf-foot-count strong { color: inherit; font-weight: 400; }
.kf-pager { display: flex; align-items: center; gap: 5px; }
.kf-pg { min-width: 30px; height: 32px; padding: 0 7px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; font-size: 12.3px; font-weight: 500; color: #4A5E79; background: #fff; border: 1px solid var(--kf-border); }
.kf-pg:hover { background: #F0F4FA; }
.kf-pg.is-active { background: #0B1A2D; color: #fff; border-color: #0B1A2D; }
.kf-pg-arrow { border-color: var(--kf-border); color: #687689; }
.kf-pg-gap { color: #64768D; pointer-events: none; }
.kf-pg.is-disabled { opacity: .45; pointer-events: none; }
.kf-perpage { display: inline-flex; align-items: center; gap: 8px; font-size: 12.3px; color: #47596F; }
.kf-select-sm { height: 30px; }
.kf-select-sm select { padding: 0 24px 0 10px; font-size: 12.3px; }

/* ---------- popovers / menus ---------- */
.kf-pop { position: relative; }
.kf-menu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 40; min-width: 196px; padding: 6px; background: #fff; border: 1px solid var(--kf-border); border-radius: 12px; box-shadow: 0 14px 38px rgba(15,23,42,.14); }
.kf-menu-right { left: auto; right: 0; }
.kf-menu-wide { min-width: 232px; }
.kf-menu-item { display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 9px; border-radius: 8px; font-size: 12.8px; color: #33465F; text-align: left; }
.kf-menu-item:hover { background: #F1F5FB; color: var(--kf-txt); }
.kf-menu-item.is-danger { color: #DC2626; }
.kf-menu-item.is-danger:hover { background: #FEF2F2; }
.kf-menu-item.is-on { color: var(--kf-blue); font-weight: 600; }
.kf-menu-sep { height: 1px; margin: 5px 4px; background: var(--kf-line); }
.kf-menu-head { padding: 6px 9px 4px; font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: #64768D; }

/* ---------- details panel ---------- */
.kf-panel { width: var(--kf-panel-w); flex: none; background: #fff; border-left: 1px solid var(--kf-line); display: flex; flex-direction: column; max-height: calc(100vh - var(--topbar-h)); position: sticky; top: var(--topbar-h); }
.kf-panel-head { display: flex; align-items: flex-start; gap: 11px; padding: 15px 16px 24px; }
.kf-panel-ico { flex: none; margin-top: 1px; }
.kf-panel-title { flex: 1; min-width: 0; }
.kf-panel-title h2 { font-size: 16.4px; font-weight: 700; letter-spacing: -.02em; color: var(--kf-txt); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-panel-title p { margin-top: 4px; font-size: 12.6px; color: var(--kf-soft); }
.kf-panel-body { flex: 1; overflow-y: auto; padding: 0 16px 24px; scrollbar-width: thin; }
.kf-preview { position: relative; border-radius: 10px; overflow: hidden; background: #0B1428; aspect-ratio: 292 / 171; }
.kf-preview img { width: 100%; height: 100%; object-fit: cover; }
.kf-preview-fallback { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: linear-gradient(140deg, #0A1832, #14306B); color: #A9BEE4; font-size: 13px; }
.kf-preview-expand { position: absolute; top: 10px; right: 10px; width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; background: rgba(255,255,255,.16); color: #fff; backdrop-filter: blur(3px); }
.kf-preview-expand:hover { background: rgba(255,255,255,.28); }
.kf-panel-actions { display: flex; align-items: center; gap: 8px; padding: 13px 0 0; }
.kf-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 36px; padding: 0 12px; border-radius: 10px; font-size: 12.8px; font-weight: 600; letter-spacing: -.01em; }
.kf-btn-primary { flex: 1; background: var(--kf-blue); color: #fff; white-space: nowrap; }
.kf-btn-primary:hover { background: var(--kf-blue-dk); }
.kf-btn-ghost { border: 1px solid var(--kf-border); background: #fff; color: #2B3D55; }
.kf-btn-ghost:hover { background: #F5F8FC; }
.kf-btn-sq { width: 38px; padding: 0; flex: none; }
.kf-btn-sm { height: 30px; padding: 0 12px; font-size: 13px; }
.kf-tabs { display: flex; align-items: center; gap: 19px; margin-top: 17px; border-bottom: 1px solid var(--kf-line); }
.kf-tab { position: relative; padding: 8px 0 9px; font-size: 12.7px; font-weight: 500; color: #687689; }
.kf-tab:hover { color: var(--kf-txt); }
.kf-tab.is-active { color: var(--kf-blue); font-weight: 600; }
.kf-tab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; border-radius: 2px; background: var(--kf-blue); }
.kf-tabpane { display: none; padding-top: 16px; }
.kf-tabpane.is-active { display: block; }
.kf-kv { display: grid; grid-template-columns: 102px 1fr; row-gap: 8px; column-gap: 0; margin: 0; align-items: center; }
.kf-kv dt { font-size: 12.2px; color: #65778B; }
.kf-kv dd { margin: 0; font-size: 12.6px; color: var(--kf-txt); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-kv-link { display: flex; align-items: center; gap: 4px; }
.kf-kv-link a { color: var(--kf-blue); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-kv-owner { display: flex; align-items: center; gap: 8px; }
.kf-av { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; font-weight: 600; overflow: hidden; flex: none; letter-spacing: .01em; }
.kf-av img { width: 100%; height: 100%; object-fit: cover; }
.kf-stack { display: inline-flex; align-items: center; }
.kf-stack > .kf-av { box-shadow: 0 0 0 2px #fff; margin-left: -7px; }
.kf-stack > .kf-av:first-child { margin-left: 0; }
.kf-stack-more { margin-left: 7px; font-size: 12.5px; font-weight: 600; color: #64748B; }
.kf-panel-sec { margin-top: 20px; }
.kf-panel-sec h3, .kf-sec-h { font-size: 13.6px; font-weight: 700; letter-spacing: -.01em; color: var(--kf-txt); }
.kf-sec-title { display: flex; align-items: baseline; justify-content: space-between; }
.kf-link-btn { font-size: 12.3px; font-weight: 500; color: var(--kf-blue); }
.kf-link-btn:hover { text-decoration: underline; }
.kf-desc { margin-top: 7px; font-size: 12.4px; line-height: 1.55; color: #5A6E88; }
.kf-tagrow { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 9px; }
.kf-tagrow .kf-tag { margin-right: 0; }
.kf-panel-tags { display: grid; grid-template-columns: 88px 1fr; align-items: center; column-gap: 8px; }
.kf-panel-tags h3 { font-size: 14px; }
.kf-panel-tags .kf-tagrow { margin-top: 0; }
.kf-tag.tone-blue { background: #E6EFFD; color: #1D56C8; } .kf-tag.tone-green { background: #DEF7E8; color: #146B34; }
.kf-tag.tone-purple { background: #EFE8FE; color: #6D28D9; } .kf-tag.tone-orange { background: #FEEEDA; color: #C2410C; }
.kf-tag.tone-red { background: #FDE6E6; color: #BE1D1D; } .kf-tag.tone-amber { background: #FEF0D4; color: #96460A; }
.kf-tag.tone-teal { background: #D6F7F1; color: #0F766E; } .kf-tag.tone-pink { background: #FCE4F0; color: #BE185D; }
.kf-tag.tone-slate { background: #EAEFF6; color: #52637A; }
.kf-tag-add { width: 22px; height: 20px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; color: #687689; }
.kf-tag-add:hover { background: #EEF3FA; color: var(--kf-txt); }
.kf-related { display: flex; flex-direction: column; gap: 2px; margin-top: 10px; }
.kf-related-item { display: flex; align-items: center; gap: 11px; padding: 6px 6px 6px 2px; border-radius: 8px; font-size: 12.7px; color: #33465F; text-align: left; width: 100%; }
.kf-related-item:hover { background: #F2F6FC; }
.kf-related-row { display: flex; align-items: center; gap: 4px; }
.kf-related-row .kf-related-item { flex: 1; min-width: 0; }
.kf-related-row .kf-related-item span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-related-kind { margin-left: auto; font-size: 11.5px; color: #6B7A8F; white-space: nowrap; }
.kf-related-x { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; color: #6B7A8F; opacity: 0; transition: opacity .15s; }
.kf-related-row:hover .kf-related-x, .kf-related-x:focus-visible { opacity: 1; }
.kf-related-x:hover { background: #FDECEC; color: #C62828; }
@media (hover: none) { .kf-related-x { opacity: 1; } }
.kf-related-item .kf-i { color: #687688; }
.kf-related-add .kf-i { color: var(--kf-blue); }
.kf-related-add span { color: var(--kf-blue); }
.kf-feed { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.kf-feed li { display: flex; gap: 10px; font-size: 12.4px; color: #55688A; }
.kf-feed li.is-reply { padding-left: 22px; }
.kf-feed li strong { color: var(--kf-txt); font-weight: 600; }
.kf-feed li span { display: block; margin-top: 2px; font-size: 12px; color: var(--kf-soft); }
.kf-feed li p { margin-top: 2px; }
.kf-commentbox { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.kf-commentbox textarea { width: 100%; border: 1px solid var(--kf-border); border-radius: 10px; padding: 9px 11px; font-size: 13.2px; resize: vertical; outline: none; }
.kf-commentbox textarea:focus { border-color: #B9D2FA; box-shadow: 0 0 0 3px rgba(37,99,235,.10); }
.kf-commentbox button { align-self: flex-end; }

/* ---------- drag & drop, bulk bar ---------- */
.kf-dropzone { position: fixed; inset: var(--topbar-h) 0 0 calc(var(--sidebar-w) + var(--kf-side-w)); z-index: 45; background: rgba(239,246,255,.92); display: flex; align-items: center; justify-content: center; }
.kf-dropzone-inner { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 34px 48px; border: 2px dashed #7EA8F5; border-radius: 18px; background: #fff; color: #2B3D55; }
.kf-dropzone-inner .kf-i { color: var(--kf-blue); }
.kf-dropzone-inner strong { font-size: 16px; }
.kf-dropzone-inner span { font-size: 13px; color: var(--kf-soft); }
.kf-row.is-dragover { box-shadow: inset 0 0 0 2px #7EA8F5; }
.kf-tree-row.is-dragover { background: #DCEAFE; box-shadow: inset 0 0 0 2px #7EA8F5; }
.kf-bulkbar { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); z-index: 46; display: flex; align-items: center; gap: 6px; padding: 8px 10px; background: #0B1A2D; color: #fff; border-radius: 14px; box-shadow: 0 18px 40px rgba(6,15,30,.32); }
.kf-bulk-count { font-size: 13px; color: #5E7797; padding: 0 8px 0 4px; }
.kf-bulk-count strong { color: #fff; }
.kf-bulk-btn { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 11px; border-radius: 9px; font-size: 13px; color: #DDE6F2; }
.kf-bulk-btn:hover { background: rgba(255,255,255,.12); color: #fff; }
.kf-bulk-btn.is-danger { color: #FCA5A5; }
.kf-bulk-btn.is-danger:hover { background: rgba(239,68,68,.18); }

/* topbar order for this module: [+ Upload] [bell] [account] */
.page-kf .topbar-right .btn-add-new { order: -1; }
.page-kf .topbar-search { max-width: 580px; }

/* the panel renders tags in the neutral pill the reference shows */
.kf-panel .kf-tag { background: #E6EFFD; color: #2563EB; }
.page-kf .btn-add-new { background: var(--kf-blue); }
.page-kf .btn-add-new:hover { background: var(--kf-blue-dk); }

/* with the details panel closed the table has 325px more room: widen the content columns
   instead of letting Name absorb everything */
.page-kf:not(.kf-has-panel) .kf-c-name { width: 320px; }
.page-kf:not(.kf-has-panel) .kf-c-coll { width: 150px; }
.page-kf:not(.kf-has-panel) .kf-c-tags { width: auto; }
.page-kf:not(.kf-has-panel) .kf-c-mod  { width: 110px; }
.page-kf:not(.kf-has-panel) .kf-c-size { width: 95px; }

/* Tracking Links glyphs — bolder and larger than the shared sprite (see includes/tl_icons.php) */
.tl-ic { display: inline-block; flex: none; fill: none; stroke: currentColor; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; vertical-align: -0.14em; }
.tl-ic.is-solid { fill: currentColor; stroke: none; }
.tl-ic circle[fill="currentColor"] { stroke: none; }
.tl-stat-ic .tl-ic, .tl-dstat-ic .tl-ic, .tl-mini-ic .tl-ic, .tl-alert-ic .tl-ic, .tl-fnode-ic .tl-ic, .tl-title-ic .tl-ic, .tl-wiz-ic .tl-ic { display: block; vertical-align: baseline; }
.tk-c-due span, .tk-c-assignee .tk-person { white-space: nowrap; }
.rv-table td .rv-pill:not(.is-profit) { height: 24px; padding: 0 10px; font-size: 12.5px; border-radius: 6px; }
.rv-table td .rv-ent { gap: 10px; font-size: 13.5px; } .rv-table td .rv-logo { width: 28px !important; height: 28px !important; }
.rv-table td .rv-delta.is-mom { font-size: 13.5px; } .rv-table td .rv-delta .icon { width: 14px; height: 14px; }
.rv-table { min-width: 900px; }

/* ---- ClickUp parity: status group, empty values, action list, date popover, rail header, composer ---- */
.tk-status-cell { gap: 6px; }
.tk-status-group { display: inline-flex; align-items: stretch; border-radius: 8px; overflow: hidden; }
.tk-status-group .tk-pill-status { border-radius: 0; height: 30px; white-space: nowrap; }
.tk-status-next { width: 22px; border: 0; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; color: inherit; }
.tk-status-group .tk-pill-status.tone-blue + .tk-status-next { background: #CFE0FE; color: #1B62E8; }
.tk-status-group .tk-pill-status.tone-grey + .tk-status-next { background: #E4EAEF; color: #3F4A5A; }
.tk-status-group .tk-pill-status.tone-amber + .tk-status-next { background: #FCE7BE; color: #B45309; }
.tk-status-group .tk-pill-status.tone-green + .tk-status-next { background: #C8EFDC; color: #087F52; }
.tk-status-next:hover { filter: brightness(.96); }
.tk-status-done { width: 30px; height: 30px; border: 1px solid #E5EAF2; border-radius: 8px; background: #fff; color: #64748B; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tk-status-done:hover { border-color: #12B76A; color: #12B76A; }
.tk-empty-val { border: 0; background: none; padding: 0; color: #67768B; font: inherit; font-size: 13.5px; cursor: pointer; }
.tk-empty-val:hover { color: #2F6BFF; }
.tk-daterange { display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 10px; border: 1px solid transparent; border-radius: 8px; background: none; font: inherit; font-size: 13.5px; color: #0F172A; cursor: pointer; }
.tk-daterange:hover { border-color: #E5EAF2; background: #F8FAFC; }
.tk-dr-part { display: inline-flex; align-items: center; gap: 6px; color: #67768B; }
.tk-dr-part.is-set { color: #0F172A; font-weight: 600; }
.tk-dr-repeat { display: inline-flex; align-items: center; gap: 4px; margin-left: 4px; padding: 2px 8px; border-radius: 999px; background: #EDE4FE; color: #6D28D9; font-size: 11.5px; font-weight: 600; }
.tk-nav-arrows { display: inline-flex; flex-direction: column; gap: 0; margin-right: 2px; }
.tk-nav-arrows .tk-ibtn { width: 22px; height: 15px; }
.tk-crumb-add { width: 24px; height: 24px; }
.tk-actions-list { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin: 14px 0 4px; }
.tk-act-link { display: inline-flex; align-items: center; gap: 10px; height: 30px; padding: 0 8px; margin-left: -8px; border: 0; background: none; border-radius: 8px; color: #475569; font: inherit; font-size: 13.5px; cursor: pointer; }
.tk-act-link:hover { background: #F1F5F9; color: #0F172A; }
.tk-act-link .tk-i { color: #64748B; }
.tk-rail-top { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px 0; }
.tk-rail-title { font-size: 15px; font-weight: 700; color: #0F172A; }
.tk-rail-tools { display: inline-flex; align-items: center; gap: 0; margin-left: auto; padding-bottom: 8px; }
.tk-rail-bell { width: auto; padding: 0 6px; gap: 3px; font-size: 12px; color: #475569; }
.tk-rail-bell b { font-weight: 600; }
.tk-rail-tabs { gap: 16px; }
.tk-composer-full { flex-direction: column; align-items: stretch; gap: 0; border: 1px solid #E5EAF2; border-radius: 12px; padding: 0; margin: 0 18px 16px; }
.tk-composer-full input[name=body] { height: 42px; padding: 0 14px; border: 0; outline: 0; font: inherit; font-size: 13.5px; color: #0F172A; background: none; border-radius: 12px 12px 0 0; }
.tk-composer-bar { display: flex; align-items: center; gap: 2px; padding: 6px 8px; border-top: 1px solid #F1F5F9; }
.tk-composer-bar .tk-composer-btn { height: 28px; padding: 0 6px; border-radius: 7px; display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: #475569; }
.tk-composer-bar .tk-composer-btn:hover { background: #F1F5F9; color: #0F172A; }
.tk-composer-sep { width: 1px; height: 18px; background: #E5EAF2; margin: 0 4px; }
.tk-composer-grow { flex: 1; }
/* date popover */
.tk-dates-pop { width: 520px; max-width: 94vw; padding: 12px; }
.tk-dates-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
.tk-dates-field { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border: 1.5px solid #E5EAF2; border-radius: 9px; color: #67768B; cursor: pointer; }
.tk-dates-field.is-active { border-color: #F97316; color: #0F172A; }
.tk-dates-field input { flex: 1; border: 0; outline: 0; background: none; font: inherit; font-size: 13.5px; color: #0F172A; cursor: pointer; }
.tk-dates-body { display: grid; grid-template-columns: 210px 1fr; gap: 12px; }
.tk-dates-presets { display: flex; flex-direction: column; gap: 1px; border-right: 1px solid #F1F5F9; padding-right: 10px; }
.tk-dates-preset { display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 32px; padding: 0 10px; border: 0; background: none; border-radius: 8px; font: inherit; font-size: 13.5px; color: #1E293B; cursor: pointer; }
.tk-dates-preset:hover { background: #F1F5F9; }
.tk-dates-preset b { font-weight: 500; font-size: 12.5px; color: #67768B; }
.tk-dates-recurring { margin-top: 6px; border-top: 1px solid #F1F5F9; border-radius: 0 0 8px 8px; padding-top: 6px; height: 38px; }
.tk-dates-calhead { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.tk-dates-calhead strong { flex: 1; font-size: 13.5px; }
.tk-dates-today { border: 0; background: none; color: #64748B; font: inherit; font-size: 12.5px; cursor: pointer; padding: 0 6px; }
.tk-dates-today:hover { color: #2F6BFF; }
.tk-dates-grid .tk-dp-cell.is-out { color: #61768F; }
.tk-dp-cell.is-start, .tk-dp-cell.is-due { background: #2F6BFF; color: #fff; font-weight: 600; }
.tk-dp-cell.is-between { background: #EAF1FF; color: #1B62E8; border-radius: 0; }
.tk-dates-foot { display: flex; align-items: center; justify-content: flex-end; gap: 8px; border-top: 1px solid #F1F5F9; margin-top: 10px; padding-top: 10px; }
.tk-btn-primary-sm { height: 30px; padding: 0 16px; border: 0; border-radius: 8px; background: #2F6BFF; color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; }
.tk-btn-primary-sm:hover { background: #1B5AF0; }

/* --- dashboard responsive ------------------------------------------------ */
@media (max-width: 1400px) {
  .dash-row-charts { grid-template-columns: minmax(0, 1fr) 340px; }
}
@media (max-width: 1180px) {
  .dash-row-charts { grid-template-columns: minmax(0, 1fr); }
  .donut-body { justify-content: flex-start; gap: 24px; }
}
@media (max-width: 1180px) {
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.page-dashboard .page-header { flex-wrap: wrap; }
  body.page-dashboard .page-subtitle { white-space: normal; }
  body.page-dashboard .page-header-main { flex: 1 1 100%; }
  body.page-dashboard .page-actions { flex: 1 1 100%; justify-content: flex-start; }
  .quote-card { flex: 1 1 auto; max-width: 340px; }
  .perf-head { align-items: flex-start; flex-wrap: wrap; }
  .perf-tabs { order: 3; width: 100%; margin-left: 0; overflow-x: auto; scrollbar-width: none; }
  .perf-tabs::-webkit-scrollbar { display: none; }
  .perf-tools { order: 2; margin-left: auto; }
}
@media (max-width: 900px) {
  body.page-dashboard { --page-pad: 14px; --gap: 12px; }
  .period-select { padding-left: 8px; }
  .period-input { max-width: 124px; }
  .topbar-user-meta { display: none; }
}
@media (max-width: 860px) {
  .dash-row-two { grid-template-columns: minmax(0, 1fr); }
  .chart-legend { margin-left: 0; gap: 16px; }
}
@media (max-width: 640px) {
  .stat-grid { grid-template-columns: minmax(0, 1fr); }
  body.page-dashboard .page-actions { width: 100%; }
  body.page-dashboard .btn-add-new { width: 100%; height: 46px; padding: 0 14px; justify-content: center; }
  body.page-dashboard .btn-add-new span { display: inline; }
  body.page-dashboard .btn-add-new .btn-caret { display: inline-block; }
  .quote-card { display: none; }
  body.page-dashboard .page-title { font-size: 24px; }
  .donut-body { flex-direction: column; align-items: stretch; gap: 14px; }
  .donut-wrap { align-self: center; }
  .perf-search { width: 100%; }
  .perf-tools { width: 100%; flex-wrap: wrap; }
  .page-footer { flex-direction: column; align-items: flex-start; gap: 8px; }
  .page-footer-links { gap: 20px; }
}

/* ==================================================================== */
/*  Reports & Analytics — design-reference-new/reports-analytics-overview.png  */
/* ==================================================================== */
.page-reports { --rp-line: #E8EDF5; --rp-ink: #0F1F3D; --rp-muted: #6B7C9B; --rp-radius: 14px; }
.page-reports .page-content { background: #F7FAFE; padding-left: 27px; padding-right: 21px; padding-top: 4px; }
.page-reports .page-header { align-items: flex-start; margin-bottom: 14px; padding-top: 6px; }
.page-reports .page-icon { width: 44px; height: 44px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(145deg, #E9EDFE 0%, #EDEDFE 55%, #FBE9FE 100%); box-shadow: 0 1px 2px rgba(15,31,61,.05); }
.page-reports .page-icon .icon { width: 24px; height: 24px; }
.page-reports .page-title { font-size: 25px; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .page-subtitle { margin-top: 3px; font-size: 13.5px; color: var(--rp-muted); }

/* ---- header controls ---- */
.page-reports .rp-controls { display: flex; align-items: center; gap: 10px; }
.page-reports .rp-range { display: inline-flex; align-items: center; gap: 9px; height: 38px; padding: 0 12px 0 13px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; font: inherit; font-size: 13.5px; font-weight: 500; color: var(--rp-ink); cursor: pointer; }
.page-reports .rp-range:hover { border-color: #CFDDF3; }
.page-reports .rp-range-cal { width: 17px; height: 17px; color: #46588A; }
.page-reports .rp-range-caret { width: 16px; height: 16px; color: #667691; margin-left: 4px; }
.page-reports .rp-range-menu { min-width: 230px; padding: 6px; }
.page-reports .rp-range-menu .dropdown-item.is-on { background: #EAF2FE; color: #1D4ED8; font-weight: 600; }
.page-reports .rp-range-custom { border-top: 1px solid var(--rp-line); margin-top: 6px; padding-top: 10px; }
.page-reports .rp-range-form { display: grid; gap: 8px; padding: 0 6px 4px; }
.page-reports .rp-range-form label { display: grid; gap: 3px; font-size: 12px; color: var(--rp-muted); }
.page-reports .rp-range-form input { height: 34px; padding: 0 9px; border: 1px solid var(--rp-line); border-radius: 8px; font: inherit; font-size: 13px; }
.page-reports .rp-compare { position: relative; display: inline-flex; align-items: center; height: 38px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; }
.page-reports .rp-compare select { appearance: none; -webkit-appearance: none; height: 36px; padding: 0 34px 0 13px; border: 0; background: none; outline: none; font: inherit; font-size: 13.5px; font-weight: 500; color: var(--rp-ink); cursor: pointer; }
.page-reports .rp-compare-caret { position: absolute; right: 11px; width: 16px; height: 16px; color: #667691; pointer-events: none; }
.page-reports .rp-custom-btn { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 17px 0 14px; border-radius: 10px; background: linear-gradient(135deg, #6D35F6 0%, #4A37FD 100%); color: #fff; font-size: 13.5px; font-weight: 600; box-shadow: 0 5px 12px rgba(78,55,253,.24); }
.page-reports .rp-custom-btn:hover { filter: brightness(1.06); }
.page-reports .rp-custom-btn .icon { width: 17px; height: 17px; }

/* ---- tab row ---- */
.page-reports .rp-tabs { display: flex; align-items: stretch; gap: 2px; border-bottom: 1px solid var(--rp-line); margin-bottom: 16px; overflow-x: auto; scrollbar-width: none; }
.page-reports .rp-tabs::-webkit-scrollbar { display: none; }
.page-reports .rp-tab { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px; border-radius: 9px 9px 0 0; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: 13.5px; font-weight: 500; color: #5B6B88; white-space: nowrap; }
.page-reports .rp-tab .icon { width: 17px; height: 17px; color: #667691; }
.page-reports .rp-tab:hover { color: var(--rp-ink); background: #F1F5FC; }
.page-reports .rp-tab.is-active { background: #EAF2FE; border-bottom-width: 2.5px; border-bottom-color: #2F7DFE; color: #1D4ED8; font-weight: 600; }
.page-reports .rp-tab.is-active .icon { color: #2F7DFE; }

/* ---- shared card ---- */
.page-reports .rp-card, .page-reports .rp-tile { border: 1px solid var(--rp-line); border-radius: var(--rp-radius); background: #fff; box-shadow: 0 1px 2px rgba(15,31,61,.04); }
.page-reports .rp-card { padding: 14px 15px 14px; display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
.page-reports .rp-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.page-reports .rp-card-head h2 { margin: 0; font-size: 15.5px; font-weight: 700; letter-spacing: -.01em; color: var(--rp-ink); }
.page-reports .rp-viewall { font-size: 12.5px; font-weight: 500; color: #2F7DFE; }
.page-reports .rp-viewall:hover { text-decoration: underline; text-underline-offset: 2px; }
.page-reports .rp-select { position: relative; display: inline-flex; align-items: center; height: 32px; border: 1px solid var(--rp-line); border-radius: 8px; background: #fff; }
.page-reports .rp-select select { appearance: none; -webkit-appearance: none; height: 30px; padding: 0 30px 0 11px; border: 0; background: none; outline: none; font: inherit; font-size: 12.5px; color: var(--rp-ink); cursor: pointer; }
.page-reports .rp-select-caret { position: absolute; right: 9px; width: 15px; height: 15px; color: #667691; pointer-events: none; }

/* ---- stat tiles ---- */
.page-reports .rp-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) 139px; grid-auto-rows: 119px; gap: 10px; margin-bottom: 16px; }
.page-reports .rp-tile { position: relative; padding: 12px 14px 11px; display: flex; gap: 12px; align-items: flex-start; overflow: hidden; }
.page-reports .rp-tile-icon { flex: none; width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.page-reports .rp-tile-icon .icon { width: 22px; height: 22px; }
.page-reports .rp-tile-icon.tone-green { background: linear-gradient(140deg, #14C079 0%, #02A365 100%); box-shadow: 0 6px 13px rgba(2,163,101,.26); }
.page-reports .rp-tile-icon.tone-blue { background: linear-gradient(140deg, #3B8BFE 0%, #1E6FFD 100%); box-shadow: 0 6px 13px rgba(30,111,253,.26); }
.page-reports .rp-tile-icon.tone-purple { background: linear-gradient(140deg, #A96CFD 0%, #8B4EFA 100%); box-shadow: 0 6px 13px rgba(139,78,250,.26); }
.page-reports .rp-tile-icon.tone-amber { background: linear-gradient(140deg, #FDA842 0%, #FB8125 100%); box-shadow: 0 6px 13px rgba(251,129,37,.26); }
.page-reports .rp-tile-icon.tone-indigo { background: linear-gradient(140deg, #5A66FE 0%, #3B44F8 100%); box-shadow: 0 6px 13px rgba(59,68,248,.26); }
.page-reports .rp-tile-text { min-width: 0; flex: 1 1 auto; position: relative; z-index: 1; }
.page-reports .rp-tile-label { font-size: 13px; font-weight: 500; color: #33445F; white-space: nowrap; }
.page-reports .rp-tile-line { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-top: 2px; padding-right: 2px; }
.page-reports .rp-tile-value { font-size: 25px; font-weight: 800; letter-spacing: -.03em; color: var(--rp-ink); }
.page-reports .rp-tile-sub { margin-top: 5px; font-size: 11.5px; color: #667691; white-space: nowrap; }
.page-reports .rp-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; font-weight: 600; }
.page-reports .rp-delta .icon { width: 15px; height: 15px; }
.page-reports .rp-delta.is-up { color: #0C8C61; }
.page-reports .rp-delta.is-down { color: #EF4444; }
.page-reports .rp-delta.is-flat { color: #667691; }

/* conversion-rate card */
.page-reports .rp-cr { flex-direction: column; align-items: center; gap: 0; padding: 8px 10px 7px; }
.page-reports .rp-cr-title { font-size: 13px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-cr-ring { position: relative; display: inline-flex; align-items: center; justify-content: center; }
.page-reports .rp-ring-label { position: absolute; font-size: 16.5px; font-weight: 800; color: var(--rp-ink); }
.page-reports .rp-cr .rp-delta { font-size: 12.5px; }

/* ---- row grids ---- */
.page-reports .rp-row { display: grid; gap: 16px; margin-bottom: 16px; align-items: stretch; }
.page-reports .rp-row-a { grid-template-columns: 554fr 313fr 404fr; grid-auto-rows: 237px; }
.page-reports .rp-row-b { grid-template-columns: 477fr 371fr 425fr; grid-auto-rows: 209px; }
.page-reports .rp-row-c { grid-template-columns: 446fr 404fr 419fr; grid-auto-rows: 213px; }

/* ---- performance overview ---- */
.page-reports .rp-metrics { display: inline-flex; gap: 2px; padding: 3px; border-radius: 9px; background: #F2F5FA; }
.page-reports .rp-metric { height: 27px; padding: 0 12px; border: 0; border-radius: 7px; background: none; font: inherit; font-size: 12.5px; font-weight: 500; color: #5B6B88; cursor: pointer; }
.page-reports .rp-metric.is-active { background: #1D4ED8; color: #fff; font-weight: 600; box-shadow: 0 1px 3px rgba(29,78,216,.3); }
.page-reports .rp-legend { display: flex; align-items: center; justify-content: flex-end; gap: 16px; margin: -2px 0 2px; }
.page-reports .rp-legend-item { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: #69758B; cursor: pointer; user-select: none; }
.page-reports .rp-legend-item.is-off { opacity: .4; }
.page-reports .rp-dot { width: 8px; height: 8px; border-radius: 50%; background: #CBD5E5; }
.page-reports .rp-dot.is-cur, .page-reports .rp-dot.is-blue { background: #2F7DFE; }
.page-reports .rp-dot.is-prev { background: #CBD5E5; }
.page-reports .rp-dot.is-green { background: #10B981; }
.page-reports .rp-chart { position: relative; flex: 1 1 auto; min-height: 150px; }
.page-reports .rp-line-svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-axis { font-size: 11px; fill: #667691; font-family: inherit; }
.page-reports .rp-nodata { margin: 40px 0; text-align: center; font-size: 13px; color: #667691; }
.page-reports .rp-tip { position: absolute; z-index: 5; transform: translate(-50%, calc(-100% - 14px)); min-width: 132px; padding: 8px 11px 9px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; box-shadow: 0 8px 20px rgba(15,31,61,.13); pointer-events: none; }
.page-reports .rp-tip.is-right { transform: translate(-100%, calc(-100% - 14px)); }
.page-reports .rp-tip-day { font-size: 12px; font-weight: 600; color: var(--rp-ink); margin-bottom: 4px; }
.page-reports .rp-tip-row { display: flex; align-items: center; gap: 7px; font-size: 12.5px; }
.page-reports .rp-tip-row b { font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-tip-row em { font-style: normal; font-size: 11.5px; font-weight: 600; color: #10B981; margin-left: auto; }
.page-reports .rp-tip-row em.is-down { color: #EF4444; }
.page-reports .rp-tip-row.is-muted { margin-top: 3px; color: #667691; font-size: 11.5px; }
/* the shared chart read-out: label on the left, value right-aligned */
.page-reports .rp-charttip { min-width: 168px; z-index: 6; }
.page-reports .rp-charttip .rp-tip-row { justify-content: flex-start; gap: 8px; font-size: 12px; line-height: 1.65; color: #46588A; }
.page-reports .rp-charttip .rp-tip-row b { margin-left: auto; padding-left: 14px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-charttip .rp-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; }
.page-reports .rp-hover { pointer-events: none; }
.page-reports .rp-donut.is-hover .rp-donut-seg { opacity: .32; }
.page-reports .rp-donut .rp-donut-seg.is-on { opacity: 1; }
.page-reports .rp-donut-seg { cursor: default; }

/* ---- funnel ---- */
.page-reports .rp-funnel { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 9px; align-items: center; flex: 1 1 auto; }
.page-reports .rp-funnel-chart { min-width: 0; }
.page-reports .rp-funnel-svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 4px 10px rgba(15,31,61,.13)); }
.page-reports .rp-funnel-step { font-size: 10.5px; font-weight: 700; fill: #fff; font-family: inherit; opacity: .92; }
.page-reports .rp-funnel-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.page-reports .rp-funnel-legend li { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; grid-template-areas: "dot num pct" "dot label pct"; align-items: center; gap: 1px 7px; }
.page-reports .rp-fdot { grid-area: dot; width: 10px; height: 10px; border-radius: 3px; align-self: start; margin-top: 4px; }
.page-reports .rp-fdot.tone-blue { background: #2079FE; }
.page-reports .rp-fdot.tone-teal { background: #14B3B0; }
.page-reports .rp-fdot.tone-green { background: #10B981; }
.page-reports .rp-fdot.tone-purple { background: #9B7BFB; }
.page-reports .rp-fnum { grid-area: num; font-size: 14.5px; line-height: 1.2; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-flabel { grid-area: label; font-size: 10.8px; line-height: 1.25; color: #68758B; white-space: nowrap; }
.page-reports .rp-fpct { grid-area: pct; align-self: center; padding: 3px 7px; border-radius: 6px; background: #EFF4FB; font-size: 11px; font-weight: 600; color: #46598A; }

/* ---- ranked partners ---- */
.page-reports .rp-rank { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; flex: 1 1 auto; justify-content: center; }
.page-reports .rp-rank-row { display: grid; grid-template-columns: 14px 26px minmax(70px, auto) minmax(0, 1fr) auto; align-items: center; gap: 9px; }
.page-reports .rp-rank-no { width: 14px; font-size: 11.5px; font-weight: 500; color: #667691; text-align: center; }
.page-reports .rp-rank-logo { flex: none; border-radius: 7px; overflow: hidden; }
.page-reports .rp-rank-name { font-size: 12 flex: none; border-radius: 50%; overflow: hidden; -space: nowrap; }
.page-reports .rp-rank-bar { height: 7px; border-radius: 4px; background: #F0F4F9; overflow: hidden; }
.page-reports .rp-rank-bar i { display: block; height: 100%; border-radius: 5px; }
.page-reports .rp-rank-bar i.tone-teal { background: #16B3A6; }
.page-reports .rp-rank-bar i.tone-blue { background: #1F79FD; }
.page-reports .rp-rank-bar i.tone-orange { background: #F98B2F; }
.page-reports .rp-rank-bar i.tone-purple { background: #9B5BFB; }
.page-reports .rp-rank-bar i.tone-pink { background: #EC4899; }
.page-reports .rp-rank-val { font-size: 13px; font-weight: 700; color: var(--rp-ink); white-space: nowrap; }
.page-reports .rp-rank-empty { font-size: 12.5px; color: #667691; }

/* ---- revenue by country ---- */
.page-reports .rp-geo-body { display: grid; grid-template-columns: minmax(0, 1fr) 196px; gap: 10px; align-items: stretch; flex: 1 1 auto; min-height: 0; }
.page-reports .rp-map { position: relative; min-width: 0; height: 100%; }
.page-reports .rp-map svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-map .wm-dots circle { r: 4.4; fill: #CBD6E6; }
.page-reports .rp-marker, .page-reports .wm-marker { cursor: pointer; transition: transform var(--t-fast); transform-box: fill-box; transform-origin: center; }
.page-reports .wm-marker:hover, .page-reports .wm-marker:focus-visible { transform: scale(1.08); outline: none; }
.page-reports .wm-marker:focus-visible circle:last-child { stroke: #2F7DFE; }
.page-reports .rp-maptip { position: absolute; z-index: 4; transform: translate(-50%, calc(-100% - 8px)); padding: 5px 9px 6px; border-radius: 8px; background: #0F1F3D; color: #fff; white-space: nowrap; pointer-events: none; }
.page-reports .rp-maptip strong { display: block; font-size: 11.5px; font-weight: 600; }
.page-reports .rp-maptip span { font-size: 11px; opacity: .8; }
.page-reports .rp-geo-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 4px; height: 100%; }
.page-reports .rp-geo-list li { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto 38px; align-items: center; gap: 8px; min-height: 0; }
.page-reports .rp-geo-flag { width: 18px !important; height: 18px !important; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,31,61,.08); }
.page-reports .rp-geo-other { display: inline-flex; align-items: center; justify-content: center; width: 18px !important; height: 18px !important; border-radius: 50%; background: #EEF2F8; color: #667691; box-shadow: none; }
.page-reports .rp-geo-name { font-size: 12.5px; color: #33445F; white-space: nowrap; }
.page-reports .rp-geo-val { font-size: 12.5px; font-weight: 600; color: var(--rp-ink); }
.page-reports .rp-geo-share { font-size: 12px; color: #667691; text-align: right; }

/* ---- commission donut ---- */
.page-reports .rp-mix-body { display: grid; grid-template-columns: minmax(0, 152px) minmax(0, 1fr); gap: 12px; align-items: center; flex: 1 1 auto; min-height: 0; }
.page-reports .rp-donut { position: relative; display: flex; align-items: center; justify-content: center; }
.page-reports .rp-donut-svg { display: block; width: 100%; height: auto; max-width: 152px; }
.page-reports .rp-donut-mid { position: absolute; text-align: center; }
.page-reports .rp-donut-mid strong { display: block; font-size: 19px; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-donut-mid span { font-size: 11.5px; color: #667691; }
.page-reports .rp-donut-seg { transition: opacity var(--t-fast); }
.page-reports .rp-donut-seg:hover { opacity: .85; }
.page-reports .rp-mix-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.page-reports .rp-mix-legend li { display: grid; grid-template-columns: 11px minmax(0, 1fr) auto; align-items: center; gap: 9px; }
.page-reports .rp-mdot { width: 11px; height: 11px; border-radius: 3px; }
.page-reports .rp-mdot.tone-blue { background: #1F79FE; }
.page-reports .rp-mdot.tone-green { background: #10B981; }
.page-reports .rp-mdot.tone-orange { background: #F98B2F; }
.page-reports .rp-mdot.tone-purple { background: #9B5BFB; }
.page-reports .rp-mdot.tone-teal { background: #14B3B0; }
.page-reports .rp-mdot.tone-grey { background: #C7D2E2; }
.page-reports .rp-mlabel { font-size: 12.5px; color: #33445F; }
.page-reports .rp-mshare { font-size: 12.5px; font-weight: 600; color: var(--rp-ink); }

/* ---- monthly bars ---- */
.page-reports .rp-legend-sm .rp-legend-item { font-size: 11px; }
.page-reports .rp-bars { flex: 1 1 auto; min-height: 138px; }
.page-reports .rp-bars-svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-bar { transition: opacity var(--t-fast); }
.page-reports .rp-bar:hover { opacity: .82; }

/* ---- tables ---- */
.page-reports .rp-table { width: 100%; border-collapse: collapse; }
.page-reports .rp-table thead th { height: 25px; padding: 0 10px 0 0; border-bottom: 1px solid var(--rp-line); background: #F7F9FD; font-size: 11.5px; font-weight: 500; color: #68758B; text-align: left; white-space: nowrap; }
.page-reports .rp-table thead th:first-child { padding-left: 10px; border-radius: 7px 0 0 0; }
.page-reports .rp-table thead th:last-child { border-radius: 0 7px 0 0; }
.page-reports .rp-table tbody td { height: 25px; padding: 0 10px 0 0; border-bottom: 1px solid #F1F4F9; font-size: 12.5px; color: #33445F; white-space: nowrap; }
.page-reports .rp-table tbody td:first-child { padding-left: 10px; }
.page-reports .rp-table tbody tr:last-child td { border-bottom: 0; }
.page-reports .rp-td-date { color: #69758B; }
.page-reports .rp-td-amt { font-weight: 600; color: #33445F; }
.page-reports .rp-td-partner { display: flex; align-items: center; gap: 8px; height: 25px; font-weight: 500; color: var(--rp-ink); }
.page-reports .rp-td-logo { flex: none; border-radius: 6px; overflow: hidden; }
.page-reports .rp-td-deal a { color: #2F7DFE; text-decoration: underline; text-underline-offset: 2px; }
.page-reports .rp-td-empty { text-align: center; color: #667691; }
.page-reports .rp-pill { display: inline-flex; align-items: center; height: 20px; padding: 0 9px; border-radius: 6px; font-size: 11px; font-weight: 600; }
.page-reports .rp-pill.is-green { background: #DEFCEF; color: #05884A; }

/* ---- insights ---- */
.page-reports .rp-ai { display: inline-flex; align-items: center; gap: 5px; height: 21px; padding: 0 9px; border-radius: 6px; background: linear-gradient(135deg, #7C4DFB 0%, #5B3BFA 100%); color: #fff; font-size: 10.5px; font-weight: 600; }
.page-reports .rp-ai .icon { width: 13px; height: 13px; }
.page-reports .rp-insight-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; justify-content: center; }
.page-reports .rp-insight-list a { display: grid; grid-template-columns: 27px minmax(0, 1fr) 16px; align-items: center; gap: 10px; padding: 3px 4px; border-radius: 9px; }
.page-reports .rp-insight-list a:hover { background: #F5F8FD; }
.page-reports .rp-insight-icon { width: 27px; height: 27px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.page-reports .rp-insight-icon .icon { width: 17px; height: 17px; }
.page-reports .rp-insight-icon.tone-green { background: #DCFCE9; color: #0E9C56; }
.page-reports .rp-insight-icon.tone-blue { background: #E2EDFE; color: #2F7DFE; }
.page-reports .rp-insight-icon.tone-purple { background: #EDE6FE; color: #7C4DFB; }
.page-reports .rp-insight-icon.tone-indigo { background: #E5E8FE; color: #4353FD; }
.page-reports .rp-insight-icon.tone-red { background: #FEE6E6; color: #E11D48; }
.page-reports .rp-insight-text { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.page-reports .rp-insight-text strong { font-size: 12.5px; line-height: 1.35; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-insight-text em { font-style: normal; font-size: 11.5px; line-height: 1.3; color: #68758B; }
.page-reports .rp-insight-go { width: 16px; height: 16px; color: #5D759F; }

.page-reports .rp-card .cmp-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; scrollbar-width: none; }
.page-reports .rp-card .cmp-scroll::-webkit-scrollbar { display: none; }
/* ---- narrow viewports ---- */
@media (max-width: 1279px) {
  .page-reports .rp-tiles, .page-reports .rp-row-a, .page-reports .rp-row-b, .page-reports .rp-row-c { grid-auto-rows: auto; }
  .page-reports .rp-card { overflow: visible; }
  .page-reports .rp-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-reports .rp-row-a, .page-reports .rp-row-b, .page-reports .rp-row-c { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .page-reports .rp-row-a > :first-child, .page-reports .rp-row-b > :first-child, .page-reports .rp-row-c > :first-child { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .page-reports .rp-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-reports .rp-row-a, .page-reports .rp-row-b, .page-reports .rp-row-c { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-row-a > :first-child, .page-reports .rp-row-b > :first-child, .page-reports .rp-row-c > :first-child { grid-column: auto; }
  .page-reports .rp-geo-body, .page-reports .rp-mix-body, .page-reports .rp-funnel { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .page-reports .rp-tiles { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-controls { flex-wrap: wrap; row-gap: 8px; }
  .page-reports .page-content { padding-left: 14px; padding-right: 14px; }
  .page-reports .rp-tabs { max-width: 100%; min-width: 0; }
  .page-reports .rp-tiles, .page-reports .rp-row, .page-reports .rp-minis { min-width: 0; }
  .page-reports .rp-tile, .page-reports .rp-card { min-width: 0; }
  .page-reports .rp-range-label { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .page-reports .rp-split li { grid-template-columns: 76px minmax(0, 1fr) 60px 44px; gap: 8px; }
}
@media print {
  .page-reports .sidebar, .page-reports .topbar, .page-reports .rp-controls, .page-reports .rp-tabs { display: none !important; }
  .page-reports .rp-card, .page-reports .rp-tile { break-inside: avoid; box-shadow: none; }
  .page-reports .page-content { background: #fff; }
}

/* ---- Reports: the seven non-Overview tabs ---- */
.page-reports .rp-minis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.page-reports .rp-mini { padding: 13px 15px 12px; display: flex; flex-direction: column; gap: 2px; }
.page-reports .rp-mini-label { font-size: 12px; color: #69758B; }
.page-reports .rp-mini-value { font-size: 21px; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-mini-sub { font-size: 11.5px; color: #667691; }
.page-reports .rp-panel { margin-bottom: 16px; overflow: visible; }
.page-reports .rp-panel-sub { margin: 2px 0 0; font-size: 12px; color: #667691; }
.page-reports .rp-row-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.page-reports .rp-row-custom { grid-template-columns: minmax(0, 1fr) minmax(0, 420px); }
.page-reports .rp-btn-soft { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; border: 1px solid var(--rp-line); border-radius: 8px; background: #fff; font-size: 12.5px; font-weight: 500; color: #33445F; }
.page-reports .rp-btn-soft:hover { border-color: #CFDDF3; color: #2F7DFE; }
.page-reports .rp-btn-soft .icon { width: 15px; height: 15px; color: #69758B; }
.page-reports .rp-table-lg tbody td { height: 38px; font-size: 13px; }
.page-reports .rp-table-lg thead th { height: 34px; font-size: 12px; }
.page-reports .rp-table-lg .rp-td-partner { height: 38px; }
.page-reports .rp-td-rank { width: 34px; color: #667691; }
.page-reports .rp-col-bar { width: 150px; }
.page-reports .rp-table-lg .rp-rank-bar { width: 140px; }
.page-reports .rp-table-lg tr.is-focus { background: #F3F8FF; }
.page-reports .rp-bars-tall { min-height: 210px; }
.page-reports .rp-map-lg { flex: none; height: 340px; }
.page-reports .rp-split { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.page-reports .rp-split li { display: grid; grid-template-columns: 96px minmax(0, 1fr) 72px 52px; align-items: center; gap: 12px; }
.page-reports .rp-split-label { font-size: 13px; color: #33445F; }
.page-reports .rp-split-val { font-size: 13px; font-weight: 600; color: var(--rp-ink); text-align: right; }
.page-reports .rp-split-pct { font-size: 12px; color: #667691; text-align: right; }

/* saved reports + builder */
.page-reports .rp-saved { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.page-reports .rp-saved li { display: flex; align-items: center; gap: 6px; border-radius: 10px; }
.page-reports .rp-saved li.is-on { background: #EFF5FE; }
.page-reports .rp-saved-main { flex: 1 1 auto; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 11px; padding: 8px 6px; border-radius: 10px; min-width: 0; }
.page-reports .rp-saved-main:hover { background: #F5F8FD; }
.page-reports .rp-saved-icon { width: 30px; height: 30px; border-radius: 9px; background: #E8F0FE; color: #2F7DFE; display: inline-flex; align-items: center; justify-content: center; }
.page-reports .rp-saved-text { min-width: 0; display: flex; flex-direction: column; }
.page-reports .rp-saved-text strong { font-size: 13px; font-weight: 600; color: var(--rp-ink); }
.page-reports .rp-saved-text em { font-style: normal; font-size: 11.5px; color: #667691; }
.page-reports .rp-saved-empty { padding: 14px 6px; font-size: 12.5px; color: #667691; }
.page-reports .rp-builder { display: flex; flex-direction: column; gap: 13px; }
.page-reports .rp-field { display: flex; flex-direction: column; gap: 5px; }
.page-reports .rp-field > span:first-child { font-size: 12.5px; font-weight: 600; color: #33445F; }
.page-reports .rp-input { height: 38px; padding: 0 13px; border: 1px solid var(--rp-line); border-radius: 9px; background: #fff; font: inherit; font-size: 13.5px; color: var(--rp-ink); }
.page-reports .rp-input:focus { outline: none; border-color: #2F7DFE; box-shadow: 0 0 0 3px rgba(47,125,254,.14); }
.page-reports .rp-select-block { width: 100%; height: 38px; }
.page-reports .rp-select-block select { width: 100%; height: 36px; font-size: 13.5px; }
.page-reports .rp-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.page-reports .rp-check { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #33445F; cursor: pointer; }
.page-reports .rp-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.page-reports .rp-check span { width: 17px; height: 17px; border: 1.5px solid #CBD8EC; border-radius: 5px; background: #fff; position: relative; }
.page-reports .rp-check input:checked + span { background: #2F7DFE; border-color: #2F7DFE; }
.page-reports .rp-check input:checked + span::after { content: ""; position: absolute; left: 5px; top: 1.5px; width: 4px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.page-reports .rp-field-note { margin: 0; font-size: 11.5px; line-height: 1.5; color: #667691; }
.page-reports .rp-builder-actions { display: flex; justify-content: flex-end; }
.page-reports .rp-builder-actions .rp-custom-btn { border: 0; cursor: pointer; font: inherit; font-size: 13.5px; font-weight: 600; }
@media (max-width: 1100px) {
  .page-reports .rp-minis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-reports .rp-row-two, .page-reports .rp-row-custom { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) { .page-reports .rp-minis { grid-template-columns: minmax(0, 1fr); } }

/* --- revenue / expenses / profit trend ----------------------------------- */
body.page-dashboard .chart-card .card-title { font-size: 17px; white-space: nowrap; }
.chart-card .card-body { padding: 8px 16px 6px; display: flex; flex-direction: column; flex: 1; }
.chart-legend { display: flex; align-items: center; gap: 22px; margin: 2px 0 6px 46px; }
.chart-legend .item { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #37507A; }
.chart-legend .key { width: 14px; height: 10px; border-radius: 5px; flex: none; }
.trend-chart-box { width: 100%; flex: 1; min-height: 200px; }
.trend-chart-box .bar { transition: opacity var(--t-fast); }
.trend-chart-box:hover .bar { opacity: .82; }
.trend-chart-box .bar:hover { opacity: 1; }
.chart-card .chart-tooltip { border-radius: 12px; box-shadow: 0 10px 30px rgba(15,23,42,.14); border: 1px solid #E8EFF9; }

/* ── My Profile (team/profile.php) ─────────────────────────────────────── */
.profile-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: var(--gap); align-items: start; margin-top: var(--gap); }
.profile-card .card-body.text-center { text-align: center; }
.profile-avatar { position: relative; display: inline-block; }
.profile-avatar .avatar { box-shadow: 0 0 0 4px var(--color-surface), 0 0 0 5px var(--color-border); }
.profile-online { position: absolute; right: 4px; bottom: 4px; width: 16px; height: 16px; border-radius: var(--r-full); background: var(--color-success); border: 3px solid var(--color-surface); }
.profile-name { font-size: var(--fs-h2); font-weight: 700; color: var(--color-text); margin: 12px 0 6px; }
.profile-role { display: flex; justify-content: center; align-items: center; gap: 6px; flex-wrap: wrap; }
.profile-photo-form { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }
.profile-photo-form .btn { cursor: pointer; }
.card-body.bordered-top { border-top: 1px solid var(--color-divider); }
.form-static { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-height: 38px; }
.form-actions { display: flex; gap: 8px; align-items: center; }
.form-actions.span-2 { grid-column: span 2; }
a.stat-line { text-decoration: none; color: inherit; border-radius: var(--r-md); transition: background var(--t-fast); }
a.stat-line:hover { background: var(--color-surface-hover); }
@media (max-width: 1023px) { .profile-layout { grid-template-columns: 1fr; } }

/* ---- Companies list: compact status cells (Relationship / GEO / Payment / Attention) re-measured against companies-list.png ---- */
.cmp-table.is-partners .cmp-pill { height: 22px; padding: 0 8px 0 6px; gap: 5px; border-radius: 6px; font-size: 12px; font-weight: 600; }
.cmp-table.is-partners .cmp-dot { width: 14px; height: 14px; }
.cmp-table.is-partners .cmp-dot .icon { width: 9px; height: 9px; stroke-width: 4; }
.cmp-table.is-partners .cmp-dot i { font-size: 9.5px; }
.cmp-table.is-partners td.c-rel .cmp-sub { display: block; font-size: 11.5px; margin: 3px 0 0 25px; color: #5C6E9C; }
.cmp-dot .icon.is-glyph { width: 10px; height: 10px; }
.cmp-table.is-partners .cmp-dot .icon.is-glyph { width: 9px; height: 9px; }
.cmp-table.is-partners .cmp-geos { gap: 7px; }
.cmp-table.is-partners .cmp-flag .flag { width: 19px !important; height: 13px !important; border-radius: 2.5px; }
.cmp-table.is-partners .cmp-geo-more { width: 24px; height: 24px; font-size: 11.5px; font-weight: 600; }
.cmp-table.is-partners .cmp-pay { padding: 4px 8px 5px; border-radius: 8px; gap: 1px; min-width: 76px; }
.cmp-table.is-partners .cmp-pay-top { font-size: 12px; gap: 5px; font-weight: 600; }
.cmp-table.is-partners .cmp-pay-sub { font-size: 11.5px; font-weight: 500; }
.cmp-table.is-partners .cmp-att { height: 24px; padding: 0 9px 0 7px; gap: 5px; border-radius: 6px; font-size: 12px; font-weight: 600; }
.cmp-table.is-partners .cmp-att .icon { width: 12px; height: 12px; }
.cmp-table.is-partners tbody td { font-size: 13.5px; }
.cmp-table.is-partners .cmp-partner-name { font-size: 14px; }
/* Affiliate Accounts — archived banner on the detail page (an archived account stays reachable so it can be restored) */
.aa-archived-bar { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; padding: 11px 16px; border: 1px solid #F0D9A8; border-radius: 10px; background: #FEF8EC; color: #7A5B0B; font-size: 13.2px; }
.aa-archived-bar .icon { color: #B27B12; flex: none; }
.aa-archived-bar span { flex: 1; min-width: 0; }
.aa-btn.is-sm { height: 32px; padding: 0 12px; font-size: 13px; }

/* ── Knowledge & Files · document page (design-reference-new/knowledge-document-view.png) ──────────
   Three columns: the collection tree with document counts + Recent Files · the document · the details rail. */
.page-kd { --kf-side-w: 240px; --kd-rail-w: 369px; --kd-ink: #0D1B2E; --kd-text: #2B3A4F; --kd-soft: #4F5E73; --kd-muted: #5E6C80; --kd-line: #E3E9F1; }
.kd-app { background: #fff; }
.kd-muted { color: var(--kd-muted); font-size: 12.6px; }
/* sidebar */
.kd-side { display: flex; flex-direction: column; gap: 10px; height: calc(100vh - var(--topbar-h)); padding: 12px 10px 14px; background: #F6F8FB; overflow: hidden; }
.kd-side-top { display: flex; align-items: center; gap: 10px; height: 34px; padding: 0 6px 0 8px; }
.kd-back { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 6px; color: var(--kd-ink); }
.kd-back:hover { background: #E9EEF5; }
.kd-side-title { flex: 1; min-width: 0; font-size: 17.4px; font-weight: 700; letter-spacing: -.02em; color: var(--kd-ink); white-space: nowrap; }
.kd-side-pin { display: inline-flex; width: 24px; height: 24px; align-items: center; justify-content: center; border-radius: 6px; color: #8A97AA; transform: rotate(-45deg); }
.kd-side-pin:hover { background: #E9EEF5; color: var(--kd-ink); }
.kd-card { background: #fff; border-radius: 12px; }
.kd-tree-card { flex: 0 1 553px; min-height: 180px; display: flex; flex-direction: column; padding: 12px 8px 10px; }
.kd-tree-card .kd-tree { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.kd-files-head { display: flex; align-items: center; justify-content: space-between; padding: 0 6px 0 8px; }
.kd-files-title { font-size: 16px; font-weight: 700; letter-spacing: -.02em; color: var(--kd-ink); }
.kd-files-title span { color: var(--kf-blue); }
.kd-files-add { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 6px; background: #EEF2F8; color: #5B6B82; }
.kd-files-add:hover { background: #E2E9F3; color: var(--kd-ink); }
.kd-search { display: flex; align-items: center; gap: 8px; height: 31px; margin: 12px 0 10px; padding: 0 11px; border: 1px solid var(--kd-line); border-radius: 9px; color: #7E8CA0; background: #fff; }
.kd-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 13px; color: var(--kd-ink); }
.kd-search input::placeholder { color: #7E8CA0; }
.kd-search:focus-within { border-color: #9DBBF5; box-shadow: 0 0 0 3px rgba(10,92,245,.1); }
.kd-tree { display: flex; flex-direction: column; }
.kd-tree-row { display: flex; align-items: center; gap: 4px; height: 30.5px; padding: 0 8px 0 0; border-radius: 8px; }
.kd-tree-child { height: 28.7px; padding-left: 18px; }
.kd-tree-row:hover { background: #F3F6FA; }
.kd-tree-row.is-active { background: #EDF3FD; }
.kd-tree-row.is-active .kd-folder { color: var(--kf-blue); }
.kd-tree-caret { flex: none; display: inline-flex; width: 18px; height: 18px; align-items: center; justify-content: center; color: #6F7C8F; border-radius: 4px; transition: transform .15s; }
.kd-tree-caret.is-empty { visibility: hidden; }
.kd-tree-caret.is-leaf { color: #9AA6B6; }
.kd-tree-group.is-open > .kd-tree-root .kd-tree-caret { transform: rotate(90deg); }
.kd-tree-link { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; color: #1E2B3C; }
.kd-folder { flex: none; color: #5B6B82; }
.kd-tree-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.3px; font-weight: 500; letter-spacing: -.01em; }
.kd-tree-child .kd-tree-name { font-size: 13px; }
.kd-tree-kids { display: none; }
.kd-tree-group.is-open > .kd-tree-kids { display: block; }
.kd-tree-empty { padding: 8px 10px; font-size: 12.5px; color: var(--kd-muted); }
.kd-recent { flex: none; padding: 7px 10px 8px 12px; }
.kd-recent-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.kd-recent-head h3 { font-size: 14.2px; font-weight: 700; color: var(--kd-ink); letter-spacing: -.01em; }
.kd-recent-head a { font-size: 12.8px; font-weight: 500; color: var(--kf-blue); }
.kd-recent-item { display: flex; align-items: flex-start; gap: 10px; padding: 5px 4px 6px 0; border-radius: 8px; }
.kd-recent-item:hover { background: #F4F7FB; }
.kd-recent-ico { flex: none; display: inline-flex; margin-top: 2px; }
.kd-recent-text { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.kd-recent-text strong { font-size: 12.9px; font-weight: 500; color: var(--kd-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kd-recent-text span { font-size: 12.2px; color: var(--kd-muted); }
/* centre */
.kd-main { flex: 1; min-width: 0; padding: 16px 21px 48px; }
.kd-crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-height: 24px; font-size: 13.3px; color: #4A5A70; }
.kd-crumbs a { color: #4A5A70; }
.kd-crumbs a:hover { color: var(--kf-blue); }
.kd-crumb-back { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; margin-right: 4px; border-radius: 6px; color: #3D4B5F; }
.kd-crumb-back:hover { background: #F1F5FA; }
.kd-crumb-sep { color: #6F7C90; }
.kd-crumbs strong { font-weight: 600; color: var(--kd-ink); }
.kd-notice { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 10px 14px; border-radius: 10px; background: #FEF3F2; color: #B42318; font-size: 13px; }
.kd-head { display: flex; align-items: flex-start; gap: 21px; margin-top: 22px; }
.kd-head-ico { flex: none; display: inline-flex; width: 44px; height: 50px; margin-top: 2px; }
.kd-head-text { min-width: 0; flex: 1; }
.kd-title-row { display: flex; align-items: center; gap: 14px; }
.kd-title { min-width: 0; font-size: 28px; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; color: var(--kd-ink); outline: 0; border-radius: 6px; overflow-wrap: anywhere; }
.kd-title[contenteditable]:hover { box-shadow: 0 0 0 4px #F3F6FA; background: #F3F6FA; }
.kd-title[contenteditable]:focus { box-shadow: 0 0 0 4px #EAF1FE; background: #EAF1FE; }
.kd-star { flex: none; display: inline-flex; color: #F5A524; }
.kd-star.is-on .kf-i { fill: #F5A524; }
.kd-lead { margin-top: 0; font-size: 14px; color: var(--kd-soft); }
.kd-tagbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 19px; }
.kd-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.kd-tag { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 8px; background: #EAF1FE; color: #1D5FD6; font-size: 13.4px; font-weight: 500; }
.kd-tag:hover { background: #DCE8FD; }
.kd-tag-add { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 12px 0 9px; border-radius: 8px; background: #F4F6F9; color: #3D4B5F; font-size: 12.9px; font-weight: 500; }
.kd-tag-add:hover { background: #E9EEF4; }
.kd-collab { display: flex; align-items: center; }
.kd-collab > .kf-av { box-shadow: 0 0 0 2px #fff; margin-left: -6px; }
.kd-collab > .kf-av:first-child { margin-left: 0; }
.kd-collab-add { display: inline-flex; width: 22px; height: 22px; margin-left: 6px; align-items: center; justify-content: center; border-radius: 50%; background: #EEF2F7; color: #3D4B5F; }
.kd-collab-add:hover { background: #E2E8F0; }
.kd-byline { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 19px; font-size: 12.6px; color: var(--kd-soft); }
.kd-byline-name { margin-left: 3px; color: #3D4B5F; font-weight: 500; }
.kd-byline-sep { width: 1px; height: 13px; margin: 0 6px; background: #D5DDE8; }
.kd-save-state { margin-left: auto; font-size: 12.2px; color: var(--kd-muted); }
.kd-save-state.is-busy { color: #6B7A8F; } .kd-save-state.is-ok { color: #12805C; } .kd-save-state.is-error { color: #C62828; }
/* toolbar */
.kd-toolbar { position: sticky; top: calc(var(--topbar-h) + 6px); z-index: 5; display: flex; align-items: center; gap: 2px; height: 42px; margin-top: 22px; padding: 0 8px 0 4px; border: 1px solid var(--kd-line); border-radius: 10px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.03); overflow-x: auto; scrollbar-width: none; }
.kd-tb-select { position: relative; display: inline-flex; align-items: center; flex: none; height: 32px; padding: 0 8px 0 10px; border-radius: 7px; color: #1E2B3C; }
.kd-tb-select select { appearance: none; border: 0; outline: 0; background: transparent; font-size: 13px; font-weight: 500; color: inherit; padding-right: 20px; cursor: pointer; }
.kd-tb-select .kf-i { position: absolute; right: 8px; pointer-events: none; color: #6B7A8F; }
.kd-tb-select:hover { background: #F3F6FA; }
.kd-tb-sep { flex: none; width: 1px; height: 22px; margin: 0 5px; background: #E6EBF2; }
.kd-tb { flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 30px; height: 32px; padding: 0 5px; border-radius: 7px; color: #2B3A4F; font-size: 15px; }
.kd-tb b, .kd-tb i, .kd-tb u { font-family: inherit; font-size: 15.5px; }
.kd-tb:hover { background: #F1F5FA; color: var(--kd-ink); }
.kd-tb.is-on { background: #E8F0FE; color: var(--kf-blue); }
.kd-tb-ai { padding: 0 10px; color: #7C3AED; font-size: 13.4px; font-weight: 600; }
.kd-tb-ai:hover { background: #F4EEFF; color: #6D28D9; }
/* the document */
.kd-body { margin-top: 16px; outline: 0; min-height: 360px; font-size: 13.7px; line-height: 1.52; color: var(--kd-text); }
.kd-body[contenteditable]:focus { outline: 0; }
.kd-body.is-blank > p:first-child:last-child::before { content: "Start writing…"; color: var(--color-text-faint); pointer-events: none; }
.kf-doc > * + * { margin-top: 10px; }
.kf-doc h1 { font-size: 23px; font-weight: 700; letter-spacing: -.02em; color: var(--kd-ink); margin-top: 26px; }
.kf-doc h2 { font-size: 21px; font-weight: 700; letter-spacing: -.015em; color: var(--kd-ink); margin-top: 22px; line-height: 1.3; }
.kf-doc h2 + p, .kf-doc h2 + table { margin-top: 5px; }
.kf-doc h3 { font-size: 15.5px; font-weight: 700; color: var(--kd-ink); margin-top: 22px; }
.kf-doc > h2:first-child, .kf-doc > h1:first-child { margin-top: 4px; }
.kf-doc a { color: var(--kf-blue); text-decoration: underline; text-underline-offset: 2px; }
.kf-doc ul, .kf-doc ol { padding-left: 22px; }
.kf-doc ul { list-style: disc; } .kf-doc ol { list-style: decimal; }
.kf-doc li + li { margin-top: 0; }
.kf-doc blockquote { padding: 8px 14px; border-left: 3px solid #BFD1F5; background: #F6F9FE; border-radius: 0 8px 8px 0; color: #3D4B5F; }
.kf-doc pre { padding: 12px 14px; border-radius: 8px; background: #0F1B2E; color: #E6EDF7; font: 12.5px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; }
.kf-doc code { padding: 1px 5px; border-radius: 5px; background: #F1F4F8; font: 12.4px ui-monospace, SFMono-Regular, Menlo, monospace; color: #B42318; }
.kf-doc hr { border: 0; border-top: 1px solid var(--kd-line); margin: 20px 0; }
.kf-doc .kd-checklist { list-style: none; padding-left: 0; }
.kf-doc .kd-checklist > li { position: relative; padding-left: 28px; cursor: text; }
.kf-doc .kd-checklist > li::before { content: ''; position: absolute; left: 2px; top: 3px; width: 15px; height: 15px; border: 1.5px solid #9AA8BB; border-radius: 4px; background: #fff; cursor: pointer; }
.kf-doc .kd-checklist > li[data-checked="1"] { color: #6B7A8F; text-decoration: line-through; }
.kf-doc .kd-checklist > li[data-checked="1"]::before { background: var(--kf-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.2 2.6 2.6L12 5.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; border-color: var(--kf-blue); }
.kf-doc-banner { display: flex; align-items: center; gap: 32px; min-height: 120px; padding: 15px 32px 15px 33px; border: 1px solid #E1E9F6; border-radius: 10px; background: linear-gradient(100deg, #EDF2FC 0%, #F3F6FD 55%, #EEF3FC 100%); }
.kf-doc-banner-art { flex: none; display: flex; }
.kf-doc-banner-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.kf-doc-banner-brand { font-size: 17.6px; font-weight: 700; color: #1D5FD6; letter-spacing: -.01em; }
.kf-doc .kf-doc-banner h2 { margin: 0; font-size: 25px; font-weight: 700; letter-spacing: -.02em; color: var(--kd-ink); }
.kf-doc-banner-sub { margin-top: 4px; font-size: 13.2px; color: var(--kd-soft); }
.kf-doc-banner-side { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 14px; }
.kf-doc-badge { display: inline-flex; align-items: center; height: 20px; padding: 0 10px; border-radius: 10px; background: #3E6FD1; color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .06em; }
.kf-doc-banner-kpi { display: inline-flex; align-items: center; gap: 7px; font-size: 13.2px; color: #62718A; }
.kf-doc-callout { display: flex; align-items: flex-start; gap: 16px; padding: 14px 20px; border: 1px solid #DCE6F5; border-radius: 8px; background: #F2F6FC; margin-top: 14px; }
.kf-doc-callout-icon { flex: none; margin-top: 1px; }
.kf-doc-callout strong { display: block; font-size: 13.4px; font-weight: 700; color: var(--kd-ink); }
.kf-doc-callout p, .kf-doc-callout span { font-size: 13.2px; color: var(--kd-text); }
.kf-doc-table, .kf-doc table { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid #E3E8EF; border-radius: 8px; overflow: hidden; font-size: 12.8px; margin-top: 12px; }
.kf-doc table th { height: 30px; padding: 0 13px; background: #F5F7FA; text-align: left; font-weight: 600; color: #1E2B3C; font-size: 12.5px; border-bottom: 1px solid #E3E8EF; }
.kf-doc table td { height: 31.5px; padding: 0 13px; border-bottom: 1px solid #EDF1F6; color: #1E2B3C; }
.kf-doc table th + th, .kf-doc table td + td { border-left: 1px solid #EDF1F6; }
.kf-doc table tr:last-child td { border-bottom: 0; }
.kf-doc .kf-up { color: #12805C; } .kf-doc .kf-down { color: #D92D20; }
.kf-doc .kf-up::before { content: '↑ '; } .kf-doc .kf-down::before { content: '↓ '; }
/* right rail */
.kd-rail { width: var(--kd-rail-w); flex: none; display: flex; flex-direction: column; border-left: 1px solid #EDF1F6; background: #fff; position: sticky; top: var(--topbar-h); max-height: calc(100vh - var(--topbar-h)); }
.kd-rail-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 14px 21px 0; }
.kd-rbtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 34px; padding: 0 13px 0 11px; border: 1px solid #E1E7EF; border-radius: 8px; background: #fff; color: #1E2B3C; font-size: 13px; font-weight: 500; white-space: nowrap; }
.kd-rbtn.is-sq { width: 34px; padding: 0; }
.kd-rbtn:hover { background: #F5F8FC; border-color: #D3DCE8; }
.kd-rail .kf-pop { position: relative; }
.kd-tabs { display: flex; align-items: center; gap: 24px; margin: 20px 21px 0; border-bottom: 1px solid #E9EEF4; }
.kd-tab { position: relative; display: inline-flex; align-items: center; gap: 8px; padding: 9px 0 11px; font-size: 13.6px; font-weight: 600; color: #3D4B5F; }
.kd-tab:hover { color: var(--kd-ink); }
.kd-tab.is-active { color: var(--kf-blue); font-weight: 600; }
.kd-tab.is-active::after { content: ''; position: absolute; left: -13px; right: -13px; bottom: -1px; height: 2px; border-radius: 2px; background: var(--kf-blue); }
.kd-tab-n { display: inline-flex; align-items: center; height: 19px; padding: 0 6px; border-radius: 6px; background: #EEF2F7; color: #3D4B5F; font-size: 12px; font-weight: 600; }
.kd-rail-body { flex: 1; overflow-y: auto; padding: 0 21px 28px; scrollbar-width: thin; }
.kd-pane { display: none; }
.kd-pane.is-active { display: block; }
.kd-kv { display: grid; grid-template-columns: 103px minmax(0, 1fr); column-gap: 0; row-gap: 7px; margin-top: 23px; font-size: 12.8px; align-items: center; }
.kd-kv dt { color: var(--kd-muted); font-size: 12.5px; align-self: start; padding-top: 1px; }
.kd-kv dd { margin: 0; color: #1E2B3C; min-width: 0; }
.kd-link { color: var(--kf-blue); line-height: 1.2; }
.kd-link:hover { text-decoration: underline; }
.kd-kv dd.kd-kv-loc { line-height: 1.2; }
.kd-kv-person { display: flex; align-items: center; gap: 9px; }
.kd-sec { margin-top: 23px; }
.kd-sec-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.kd-sec-head h3 { font-size: 14.4px; font-weight: 700; color: var(--kd-ink); letter-spacing: -.01em; }
.kd-sec-head h3.is-sm { font-size: 13.2px; }
.kd-sec-head .kf-link-btn { font-size: 13px; }
.kd-desc { font-size: 14.2px; line-height: 1.5; color: #1E2B3C; }
.kd-round { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 50%; background: #F1F4F8; color: #3D4B5F; flex: none; }
.kd-round:hover { background: #E4EAF2; }
.kd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.kd-chip { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 13px; background: #F1F4F8; color: #1E2B3C; font-size: 12.7px; font-weight: 500; }
.kd-chip.is-blue { background: #EAF1FE; color: #1D5FD6; }
.kd-chip:hover { filter: brightness(.97); }
.kd-chip-add { display: inline-flex; width: 26px; height: 26px; align-items: center; justify-content: center; border-radius: 50%; color: #3D4B5F; }
.kd-chip-add:hover { background: #F1F4F8; }
.kd-related, .kd-actions, .kd-threads, .kd-versions { list-style: none; margin: 0; padding: 0; }
.kd-related { display: flex; flex-direction: column; }
.kd-related li { display: flex; align-items: center; gap: 4px; }
.kd-related a { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; height: 30.5px; padding: 0 4px 0 6px; border-radius: 7px; color: #1E2B3C; }
.kd-related a:hover { background: #F4F7FB; }
.kd-related-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.8px; }
.kd-related-type { flex: none; font-size: 12.3px; color: #5D6B80; }
.kd-related li .kf-related-x { opacity: 0; }
.kd-related li:hover .kf-related-x, .kd-related li .kf-related-x:focus-visible { opacity: 1; }
.kd-add-related { display: inline-flex; align-items: center; gap: 12px; margin-top: 12px; padding-left: 4px; font-size: 13px; font-weight: 500; color: var(--kf-blue); }
.kd-add-related .kd-round { background: #F1F4F8; color: #3D4B5F; }
.kd-rel-ico { flex: none; display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 6px; color: #fff; }
.kd-rel-ico.tone-green { background: #16A765; } .kd-rel-ico.tone-blue { background: #1F6BF0; } .kd-rel-ico.tone-pink { background: #C63AC6; } .kd-rel-ico.tone-red { background: #EF4444; } .kd-rel-ico.tone-purple { background: #7C3AED; } .kd-rel-ico.tone-slate { background: #52627A; }
.kd-rel-ico.is-soft { background: #EAF1FE; color: #1F6BF0; }
.kd-actions { display: flex; flex-direction: column; }
.kd-actions button { display: flex; align-items: center; gap: 14px; width: 100%; height: 28px; padding: 0 4px 0 6px; border-radius: 7px; font-size: 13.2px; color: #2B3A4F; text-align: left; }
.kd-actions button:hover { background: #F4F7FB; }
.kd-actions .kf-i { color: #2B3A4F; }
.kd-actions .is-danger, .kd-actions .is-danger .kf-i { color: #E5484D; }
/* comments + versions */
.kd-comment-form { display: flex; align-items: flex-start; gap: 10px; margin-top: 20px; padding: 10px; border: 1px solid var(--kd-line); border-radius: 10px; background: #fff; }
.kd-comment-form textarea { flex: 1; min-width: 0; resize: vertical; min-height: 40px; border: 0; outline: 0; font: inherit; font-size: 13px; color: var(--kd-ink); background: transparent; }
.kd-comment-form:focus-within { border-color: #9DBBF5; box-shadow: 0 0 0 3px rgba(10,92,245,.1); }
.kd-send { flex: none; display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 8px; background: var(--kf-blue); color: #fff; }
.kd-send:hover { background: var(--kf-blue-dk); }
.kd-send:disabled { opacity: .6; }
.kd-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 30px 10px; color: var(--kd-muted); font-size: 13px; text-align: center; }
.kd-threads { display: flex; flex-direction: column; gap: 12px; margin-top: 16px; }
.kd-thread { padding: 12px; border: 1px solid #EDF1F6; border-radius: 10px; }
.kd-thread.is-resolved { opacity: .66; }
.kd-comment { display: flex; gap: 10px; }
.kd-comment.is-reply { margin-top: 12px; padding-left: 14px; border-left: 2px solid #EDF1F6; }
.kd-comment-main { min-width: 0; flex: 1; }
.kd-comment-meta { display: flex; align-items: baseline; gap: 8px; }
.kd-comment-meta strong { font-size: 12.8px; font-weight: 600; color: var(--kd-ink); }
.kd-comment-meta time { font-size: 11.6px; color: var(--kd-muted); }
.kd-comment p { margin-top: 3px; font-size: 13px; line-height: 1.5; color: #1E2B3C; overflow-wrap: anywhere; }
.kd-anchor { margin-top: 6px; padding: 4px 9px; border-left: 3px solid #F5C451; background: #FFFAEB; font-size: 12.2px; color: #7A5B0B; border-radius: 0 6px 6px 0; }
.kd-thread-foot { display: flex; gap: 14px; margin-top: 10px; padding-left: 36px; }
.kf-link-btn.is-muted { color: var(--kd-muted); }
.kd-versions { position: relative; margin-top: 20px; }
.kd-version { position: relative; display: flex; align-items: flex-start; gap: 12px; padding: 0 0 18px 2px; }
.kd-version::before { content: ''; position: absolute; left: 7px; top: 14px; bottom: 0; width: 1.5px; background: #E6EBF2; }
.kd-version:last-child::before { display: none; }
.kd-version-dot { flex: none; width: 12px; height: 12px; margin-top: 3px; border: 2px solid #B8C4D4; border-radius: 50%; background: #fff; position: relative; z-index: 1; }
.kd-version.is-current .kd-version-dot { border-color: var(--kf-blue); background: var(--kf-blue); }
.kd-version > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.kd-version strong { font-size: 13px; font-weight: 600; color: var(--kd-ink); display: flex; align-items: center; gap: 8px; }
.kd-version span { font-size: 12.2px; color: var(--kd-muted); }
.kd-pill { display: inline-flex; align-items: center; height: 18px; padding: 0 7px; border-radius: 9px; background: #EAF1FE; color: #1D5FD6; font-size: 11px; font-weight: 600; }
.kd-more-menu { position: fixed; min-width: 190px; }
/* focus mode + print */
body.kd-focus .kd-side, body.kd-focus .kd-rail { display: none; }
body.kd-focus .kd-main { max-width: 860px; margin: 0 auto; }
@media print {
  .page-kd .sidebar, .page-kd .topbar, .kd-side, .kd-rail, .kd-toolbar, .kd-crumbs, .kd-tag-add, .kd-collab, .kd-save-state { display: none !important; }
  .page-kd .kd-main { padding: 0; }
}
@media (max-width: 1439px) { .page-kd { --kd-rail-w: 330px; } }
@media (max-width: 1279px) {
  .page-kd .kd-app { flex-wrap: wrap; }
  .page-kd .kd-rail { width: 100%; position: static; max-height: none; border-left: 0; border-top: 1px solid #EDF1F6; order: 3; }
  .page-kd .kd-main { flex-basis: 0; }
}
@media (max-width: 1023px) { .page-kd .kd-main { padding: 14px 16px 40px; } }
@media (max-width: 767px) {
  .kd-head { gap: 14px; margin-top: 16px; }
  .kd-head-ico { width: 38px; height: 44px; }
  .kd-title { font-size: 21px; }
  .kd-tagbar { flex-wrap: wrap; }
  .kf-doc-banner { flex-direction: column; align-items: flex-start; gap: 12px; padding: 16px; }
  .kf-doc-banner-text { width: 100%; }
  .kf-doc .kf-doc-banner h2 { font-size: 20px; }
  .kf-doc-banner-side { align-items: center; flex-direction: row; flex-wrap: wrap; gap: 10px; }
  .kf-doc table { display: block; overflow-x: auto; white-space: nowrap; }
  .kd-rail-actions { flex-wrap: wrap; justify-content: flex-start; padding: 14px 16px 0; }
  .kd-tabs { margin: 20px 16px 0; gap: 18px; overflow-x: auto; scrollbar-width: none; }
  .kd-rail-body { padding: 0 16px 24px; }
  .kd-tb, .kd-rbtn, .kd-round, .kd-chip-add { min-width: 36px; min-height: 36px; }
}

/* ── Touch targets on phones (QA 2026-09-20) ─────────────────────────────────
   Every control a finger has to hit is at least 44px. Buttons, selects and inputs grow; small icon
   buttons, checkboxes and carets keep their drawn size and get an invisible 44px hit area instead. */
@media (max-width: 767px) and (hover: none), (max-width: 480px) {
  .btn, .cmp-btn, .pay-btn, .aa-btn, .tl-btn, .tk-btn, .kc-btn, .ka-btn, .kd-rbtn, .dl-morebtn, .aag-more, .aag-sortbtn,
  .cmp-morebtn, .ct-morebtn, .pay-sortbtn, .tk-tool, .tk-btn-ghost, .kf-btn, .kd-tag-add, .kf-badd, .soft-select,
  select, .form-select, .form-control, input[type="text"], input[type="search"], input[type="email"], input[type="url"],
  input[type="number"], input[type="date"], input[type="datetime-local"], input[type="month"], input[type="password"], textarea { min-height: 44px; }
  .cmp-select, .pay-select, .aa-select, .tl-select, .kc-select, .ka-select, .kf-select, .pl-selectwrap, .df-select, .kd-tb-select { min-height: 44px; }
  .cmp-select select, .pay-select select, .aa-select select, .tl-select select, .kc-select select, .ka-select select, .kf-select select { height: 100%; }
  /* icon-only buttons: keep the drawn box, expand what the finger hits */
  .btn-icon, .kf-iconbtn, .kf-topbar-toggle, .tl-ibtn, .tk-ibtn, .tk-row-menu, .tk-group-caret, .aa-ibtn, .kc-rowbtn, .kc-ibtn, .kc-plus, .kc-add,
  .kd-star, .kc-star, .kd-collab-add, .kd-chip-add, .kd-round, .kf-sec-add, .kf-tree-toggle, .kd-tree-caret, .ka-x, .ka-iconbtn, .ka-tbb, .kd-tb,
  .pay-ibtn, .dl-ibtn, .ctg-ibtn, .kf-related-x, .kd-send, .row-menu > button, .dropdown > [data-dropdown],
  .tk-group-btn, .tk-check, .aag-copy, .aag-copybtn, .ctg-setone, .tk-addrow, .kd-tag-add { position: relative; }
  .btn-icon::after, .kf-iconbtn::after, .kf-topbar-toggle::after, .tl-ibtn::after, .tk-ibtn::after, .tk-row-menu::after, .tk-group-caret::after,
  .aa-ibtn::after, .kc-rowbtn::after, .kc-ibtn::after, .kc-plus::after, .kc-add::after, .kd-star::after, .kc-star::after, .kd-collab-add::after,
  .kd-chip-add::after, .kd-round::after, .kf-sec-add::after, .kf-tree-toggle::after, .kd-tree-caret::after, .ka-x::after, .ka-iconbtn::after,
  .ka-tbb::after, .kd-tb::after, .pay-ibtn::after, .dl-ibtn::after, .ctg-ibtn::after, .kf-related-x::after, .kd-send::after,
  .tk-group-btn::after, .tk-check::after, .aag-copy::after, .aag-copybtn::after, .ctg-setone::after, .tk-addrow::after, .kd-tag-add::after,
  .kc-chk::after, .kf-check::after, .pay-check::after, .ka-check::after, .check::after, label.kd-fav::after {
    content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 44px; height: 44px; border-radius: 10px; }
  /* checkboxes: the visible box stays small, the label around it takes the tap */
  .kc-chk, .kf-check, .pay-check, .ka-check, .check { position: relative; }
  input[type="checkbox"], input[type="radio"] { min-width: 24px; min-height: 24px; }
  /* controls that live inside a pill grow with it instead of bursting out */
  .period-select, .topbar-search { min-height: 44px; }
  .period-select .form-select, .period-select select, .topbar-search input { min-height: 0; height: 100%; }
  .topbar-brand-mobile span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 30vw; }
  .period-select { flex: 0 0 auto; } .period-input { max-width: none; }
  .period-select .form-select, .period-select select { background: transparent; border: 0; box-shadow: none; }
  .kd-actions button, .kd-add-related, .kc-trash, .kf-link-btn, .kd-related a, .kc-rel a { min-height: 44px; }
  .kf-link-btn { position: relative; display: inline-flex; align-items: center; }
}

/* Very narrow phones: the workspace name gives way so the period pill keeps its full label,
   and the rest of the bar tightens just enough for the Add New button to fit inside 390px. */
@media (max-width: 560px) {
  .topbar { gap: 6px; padding: 0 10px; }
  .topbar-right { gap: 6px; }
  .topbar .btn-icon { width: 36px; height: 36px; }
  .period-select { padding: 0 6px 0 9px; gap: 5px; }
  .btn-add-new { width: 36px; min-height: 36px; height: 36px; position: relative; }
  .btn-add-new::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 44px; height: 44px; border-radius: 10px; }
}
@media (max-width: 430px) {
  .topbar-brand-mobile span { display: none; }
}

/* Account page header: the two halves stack and the detail tabs scroll instead of widening the page */
@media (max-width: 767px) {
  .page-account .aa-head, body.page-account .aa-head { flex-wrap: wrap; gap: 12px; }
  .aa-head-right { align-items: flex-start; width: 100%; }
  .aa-head-actions, .aa-head-fields { flex-wrap: wrap; }
  .aa-dtabs { overflow-x: auto; scrollbar-width: none; }
  .aa-dtabs::-webkit-scrollbar { display: none; }
  .aa-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); height: auto; }
  .aa-cell { min-width: 0; }
  .aa-cell, .aa-cell * { white-space: normal; overflow-wrap: anywhere; }
  .aa-cols { grid-template-columns: minmax(0, 1fr); }
  .aa-col-side, .aa-panel { min-width: 0; }
  .aa-lrow, .aa-drow { flex-wrap: wrap; min-height: 0; padding: 12px; }
  .aa-lrow-txt, .aa-drow-txt { min-width: 0; flex: 1 1 60%; }
}

/* ── Knowledge & Files · Board + Gallery views (design-reference-new/knowledge-board-view.png) ───────── */
.kf-stattiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) 1.55fr; gap: 14px; padding: 16px 17px 0; }
.kf-stat { display: flex; align-items: center; gap: 13px; min-height: 66px; padding: 12px 14px; border: 1px solid var(--kf-border); border-radius: 12px; background: #fff; text-align: left; }
.kf-stat > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.kf-stat span { font-size: 12.3px; color: var(--kf-muted); }
.kf-stat strong { font-size: 18px; font-weight: 700; letter-spacing: -.01em; color: var(--kf-txt); }
.kf-stat-ic { flex: none; display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 10px; }
.kf-stat-ic.tone-blue { background: #E9F0FD; color: #1F6BF0; } .kf-stat-ic.tone-violet { background: #F1EBFE; color: #7C3AED; }
.kf-stat-ic.tone-amber { background: #FDF1DC; color: #B27B12; } .kf-stat-ic.tone-slate { background: #EDF1F6; color: #46586F; }
.kf-stat-ai { border-color: #E4DBFB; background: linear-gradient(97deg, #F6F1FE, #FBF7FF); cursor: pointer; }
.kf-stat-ai:hover { border-color: #D6C6F8; }
.kf-stat-ai .is-strong { font-size: 13.4px; font-weight: 600; color: #4C1D95; }
.kf-stat-ai .kf-i { color: #7C3AED; margin-left: auto; }
.kf-board { display: flex; align-items: flex-start; gap: 20px; padding: 18px 17px 8px; overflow-x: auto; scrollbar-width: thin; }
.kf-bcol { flex: none; width: 202px; display: flex; flex-direction: column; gap: 10px; padding: 10px; border: 1px solid var(--kf-border); border-radius: 12px; background: #FBFCFE; }
.kf-bcol-head { display: flex; align-items: center; gap: 8px; margin: -10px -10px 0; padding: 11px 10px; border-radius: 12px 12px 0 0; }
.kf-bcol-head h3 { font-size: 13.2px; font-weight: 700; letter-spacing: -.01em; color: var(--kf-txt); }
.kf-bcol-n { font-size: 12.3px; color: #55637A; }
.kf-bcol-head .kf-pop { margin-left: auto; position: relative; }
.kf-bcol-ic { display: inline-flex; }
.kf-bcol-head.tone-blue { background: #EEF4FE; } .kf-bcol-head.tone-purple { background: #F3EDFE; } .kf-bcol-head.tone-red { background: #FDEEEE; }
.kf-bcol-head.tone-green { background: #E8F7EF; } .kf-bcol-head.tone-amber { background: #FDF4E3; } .kf-bcol-head.tone-slate { background: #EFF2F7; }
.kf-bcol-head.tone-orange { background: #FDF0E5; } .kf-bcol-head.tone-pink { background: #FCEBF4; }
.kf-badd { display: flex; align-items: center; justify-content: center; gap: 7px; height: 38px; border: 1px dashed #C9D6E8; border-radius: 9px; background: #fff; color: var(--kf-blue); font-size: 12.7px; font-weight: 500; }
.kf-badd:hover { background: #F2F7FF; border-color: #9DBBF5; }
.kf-bcol-cards { display: flex; flex-direction: column; gap: 10px; }
.kf-bcol-empty { padding: 10px 2px; font-size: 12.2px; color: var(--kf-muted); }
.kf-bcard { display: flex; flex-direction: column; gap: 7px; padding: 12px; border: 1px solid var(--kf-border); border-radius: 10px; background: #fff; cursor: pointer; }
.kf-bcard:hover { border-color: #CFE0FC; box-shadow: 0 4px 12px rgba(15,23,42,.06); }
.kf-bcard-head { display: flex; align-items: flex-start; gap: 9px; }
.kf-bcard-title { flex: 1; min-width: 0; font-size: 12.7px; font-weight: 600; color: var(--kf-txt); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.kf-bcard-title:hover { color: var(--kf-blue); }
.kf-bcard-menu { position: relative; margin-left: auto; }
.kf-bcard-url { font-size: 11.4px; color: var(--kf-blue); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-bcard-desc { font-size: 11.7px; line-height: 1.4; color: var(--kf-soft); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kf-bcard-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.kf-bcard-foot { display: flex; align-items: center; gap: 8px; margin-top: 2px; font-size: 11.4px; color: var(--kf-muted); }
.kf-bcard-foot span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kf-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(212px, 1fr)); gap: 14px; padding: 18px 17px 4px; }
.kf-bempty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 48px 16px; color: var(--kf-muted); text-align: center; }
.kf-bempty strong { font-size: 15px; color: var(--kf-txt); }
@media (max-width: 1279px) { .kf-stattiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .kf-stat-ai { grid-column: 1 / -1; } }
@media (max-width: 767px) {
  .kf-stattiles { grid-template-columns: minmax(0, 1fr); padding: 14px 16px 0; }
  .kf-board { padding: 14px 16px 8px; gap: 14px; }
  .kf-bcol { width: 84vw; max-width: 300px; }
  .kf-gallery { padding: 14px 16px 4px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

/* ── Knowledge & Files · Add Knowledge modal (knowledge-add-document-link.png / knowledge-add-note.png) ── */
.modal.ka-shell { width: 698px; max-width: calc(100vw - 24px); max-height: calc(100vh - 32px); padding: 0; border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.modal.ka-shell.is-note { width: 946px; }
.ka { --ka-line: #DCE3EC; --ka-ink: #0D1B2E; --ka-text: #1E2B3C; --ka-muted: #5E6C80; display: flex; flex-direction: column; min-height: 0; flex: 1; font-size: 13.3px; color: var(--ka-text); }
.ka-head { display: flex; align-items: center; gap: 18px; padding: 16px 20px 0; }
.ka-head-ico { flex: none; width: 54px; height: 54px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; background: #EEF4FE; color: #1F6BF0; }
.ka.is-note .ka-head-ico { width: 56px; height: 56px; }
.ka-head-text { flex: 1; min-width: 0; }
.ka-title { font-size: 21.5px; font-weight: 700; letter-spacing: -.02em; color: var(--ka-ink); line-height: 1.2; }
.ka-sub { margin-top: 5px; font-size: 13.3px; color: #4F5E73; }
.ka-x { flex: none; align-self: flex-start; display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 8px; background: #F2F5F9; color: #33465F; }
.ka-x:hover { background: #E6ECF3; color: var(--ka-ink); }
.ka-tabs { display: flex; margin: 19px 20px 0; padding: 0; border-radius: 8px; background: #F1F5FA; }
.ka-tab { position: relative; flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 37px; border-radius: 8px 8px 0 0; font-size: 13.4px; font-weight: 500; color: var(--ka-text); }
.ka-tab + .ka-tab::before { content: ''; position: absolute; left: 0; top: 11px; bottom: 11px; width: 1px; background: #D5DDE8; }
.ka-tab.is-active, .ka-tab.is-active + .ka-tab { }
.ka-tab.is-active::before, .ka-tab.is-active + .ka-tab::before { display: none; }
.ka-tab.is-active { background: #fff; color: #1F6BF0; font-weight: 600; box-shadow: inset 0 -2px 0 #1F6BF0; }
.ka-tab:not(.is-active):hover { color: var(--ka-ink); background: #E9EEF5; }
.ka-body { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 20px 16px; scrollbar-width: thin; }
.ka-h { margin: 22px 0 10px; font-size: 16.2px; font-weight: 700; letter-spacing: -.01em; color: var(--ka-ink); }
.ka-label { display: block; margin: 12px 0 6px; font-size: 12.9px; font-weight: 500; color: var(--ka-text); }
.ka-label b, .ka-label > b { color: #E5484D; font-weight: 600; }
.ka-input { display: block; width: 100%; height: 34px; padding: 0 12px; border: 1px solid var(--ka-line); border-radius: 7px; background: #fff; font: inherit; font-size: 13.2px; color: var(--ka-ink); outline: 0; }
.ka-input::placeholder, .ka-input input::placeholder { color: #8391A5; }
.ka-input:focus, .ka-input:focus-within { border-color: #8DB2F6; box-shadow: 0 0 0 3px rgba(31,107,240,.12); }
.ka-input.is-invalid { border-color: #F04438; }
.ka-textarea { height: 93px; padding: 9px 12px; resize: none; line-height: 1.45; }
.ka-textarea.is-short { height: 72px; }
.ka-input-ic { display: flex; align-items: center; gap: 9px; color: #6B7A8F; }
.ka-input-ic input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 13.2px; color: var(--ka-ink); }
.ka-meta { display: flex; justify-content: space-between; margin-top: 5px; font-size: 11.8px; color: var(--ka-muted); min-height: 14px; }
.ka-err { font-size: 12px; color: #D92D20; }
.ka-row { display: flex; align-items: center; gap: 12px; }
.ka-row > .ka-input-ic, .ka-row > .is-grow { flex: 1; }
.ka-basic { display: grid; grid-template-columns: minmax(0, 1fr) 193px; gap: 19px; align-items: stretch; }
.ka-basic .ka-label:first-child { margin-top: 2px; }
.ka-cover { display: flex; flex-direction: column; gap: 12px; height: 100%; padding: 12px; border-radius: 10px; background: #F5F8FC; }
.ka-cover-label { font-size: 12.3px; font-weight: 600; color: var(--ka-text); }
.ka-drop { position: relative; flex: 1; min-height: 100px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 10px; border: 1px solid #DCE3EC; border-radius: 8px; background: #fff; color: #33465F; cursor: pointer; text-align: center; overflow: hidden; }
.ka-drop strong { margin-top: 8px; font-size: 12.3px; font-weight: 600; color: var(--ka-ink); }
.ka-drop small { font-size: 11.3px; color: var(--ka-muted); }
.ka-drop:hover, .ka-drop.is-over { border-color: #8DB2F6; background: #F7FAFF; }
.ka-drop img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ka-sources { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ka-source { position: relative; display: flex; align-items: center; gap: 12px; min-height: 61px; padding: 8px 12px; border: 1px solid #DDE4EE; border-radius: 8px; background: #fff; cursor: pointer; }
.ka-source input { position: absolute; opacity: 0; pointer-events: none; }
.ka-source strong { display: block; font-size: 12.1px; font-weight: 600; color: var(--ka-ink); }
.ka-source small { display: block; margin-top: 3px; font-size: 11.2px; line-height: 1.3; color: var(--ka-muted); }
.ka-source-ico { flex: none; display: inline-flex; width: 34px; justify-content: center; color: #1E2B3C; }
.ka-source.is-on { border-color: #6F9EF4; background: #F2F6FE; box-shadow: 0 0 0 1px #6F9EF4; }
.ka-source:focus-within { outline: 2px solid #8DB2F6; outline-offset: 2px; }
[data-ka-src="url"] .ka-label { margin-top: 24px; }
.ka-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 36px; padding: 0 16px; border-radius: 8px; font-size: 13.6px; font-weight: 500; white-space: nowrap; }
.ka-btn-ghost { border: 1px solid #D7DFEA; background: #fff; color: var(--ka-text); }
.ka-btn-ghost:hover { background: #F5F8FC; }
.ka-btn-primary { background: #1F6BF0; color: #fff; min-width: 138px; }
.ka-btn-primary:hover { background: #185AD1; }
.ka-btn:disabled { opacity: .6; cursor: default; }
.ka-row .ka-btn { height: 34px; flex: none; min-width: 110px; }
.ka-note { display: flex; align-items: center; gap: 12px; margin-top: 12px; min-height: 38px; padding: 6px 12px; border: 1px solid #CDEBD8; border-radius: 8px; background: #EAF7EF; font-size: 12.3px; color: #1E6B43; }
.ka-note .icon, .ka-note svg { color: #0B7B3C; flex: none; }
.ka-note.is-bad { border-color: #F6CFCB; background: #FEF1F0; color: #B42318; }
.ka-note.is-bad svg { color: #D92D20; }
.ka-note:not(.is-ok):not(.is-bad) { border-color: #DCE3EC; background: #F5F8FC; color: #4F5E73; }
.ka-filedrop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; margin-top: 14px; min-height: 110px; padding: 14px; border: 1.5px dashed #C8D3E2; border-radius: 10px; background: #F8FAFD; color: #33465F; cursor: pointer; text-align: center; }
.ka-filedrop strong { font-size: 13px; font-weight: 600; color: var(--ka-ink); overflow-wrap: anywhere; }
.ka-filedrop small { font-size: 11.6px; color: var(--ka-muted); }
.ka-filedrop:hover, .ka-filedrop.is-over { border-color: #6F9EF4; background: #F2F6FE; }
.ka-grid3 { display: grid; grid-template-columns: 1.27fr 1.27fr 1fr; gap: 12px; }
.ka-grid3 .ka-label, .ka-grid2 .ka-label { margin-top: 0; }
.ka-note-pane .ka-grid3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.ka-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ka-select { position: relative; display: flex; align-items: center; gap: 9px; height: 34px; padding: 0 30px 0 12px; border: 1px solid var(--ka-line); border-radius: 7px; background: #fff; color: #33465F; }
.ka-select select { flex: 1; min-width: 0; appearance: none; border: 0; outline: 0; background: transparent; font: inherit; font-size: 13.2px; color: var(--ka-ink); cursor: pointer; }
.ka-select .ka-caret { position: absolute; right: 10px; pointer-events: none; color: #5B6B82; }
.ka-select:focus-within { border-color: #8DB2F6; box-shadow: 0 0 0 3px rgba(31,107,240,.12); }
.ka-select.is-sm { flex: none; width: 170px; }
.ka-tagbox { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 5px; min-height: 34px; padding: 3px 8px; border: 1px solid var(--ka-line); border-radius: 7px; background: #fff; }
.ka-tagbox:focus-within { border-color: #8DB2F6; box-shadow: 0 0 0 3px rgba(31,107,240,.12); }
.ka-tagchips { display: contents; }
.ka-tagsearch { flex: 1; min-width: 90px; display: flex; align-items: center; gap: 8px; color: #6B7A8F; }
.ka-tagsearch input { flex: 1; min-width: 0; height: 26px; border: 0; outline: 0; background: transparent; font: inherit; font-size: 13.2px; color: var(--ka-ink); }
.ka-tagsearch input::placeholder { color: #8391A5; }
.ka-tagmenu { position: absolute; left: -1px; right: -1px; top: calc(100% + 4px); z-index: 5; max-height: 220px; overflow-y: auto; padding: 5px; border: 1px solid #DCE3EC; border-radius: 9px; background: #fff; box-shadow: 0 12px 30px rgba(15,23,42,.14); }
.ka-tagmenu button { display: flex; align-items: center; gap: 6px; width: 100%; padding: 7px 9px; border-radius: 6px; font-size: 12.8px; color: var(--ka-text); text-align: left; }
.ka-tagmenu button:hover { background: #F2F6FC; }
.ka-chip { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 5px 0 9px; border-radius: 6px; background: #EAF1FE; color: #1D5FD6; font-size: 12.2px; font-weight: 500; }
.ka-chip button { display: inline-flex; width: 16px; height: 16px; align-items: center; justify-content: center; border-radius: 4px; color: inherit; }
.ka-chip button:hover { background: rgba(29,95,214,.12); }
.ka-chip.is-rel { background: #F1F4F8; color: var(--ka-text); }
.ka-check { display: inline-flex; align-items: center; gap: 10px; margin-top: 16px; font-size: 13.2px; color: var(--ka-text); cursor: pointer; }
.ka-check input { position: absolute; opacity: 0; }
.ka-box { width: 16px; height: 16px; border: 1.5px solid #9AA8BB; border-radius: 4px; background: #fff; }
.ka-check input:checked + .ka-box { border-color: #1F6BF0; background: #1F6BF0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.2 2.6 2.6L12 5.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.ka-check input:focus-visible + .ka-box { outline: 2px solid #8DB2F6; outline-offset: 2px; }
.ka-check svg { color: #3D4B5F; }
/* note tab */
.ka-note-pane:not([hidden]) { display: grid; grid-template-columns: minmax(0, 1fr) 249px; gap: 20px; align-items: start; }
.ka-note-main .ka-h:first-child { margin-top: 22px; }
.ka-note-main > .ka-row .ka-input { flex: 1; }
.ka-fav { flex: none; display: inline-flex; align-items: center; gap: 9px; padding: 0 6px 0 14px; font-size: 13px; color: var(--ka-text); cursor: pointer; }
.ka-fav input { position: absolute; opacity: 0; }
.ka-fav svg { color: #F5A524; }
.ka-fav input:checked + svg { fill: #F5A524; }
.ka-fav input:focus-visible + svg { outline: 2px solid #8DB2F6; outline-offset: 2px; border-radius: 4px; }
.ka-editor { margin-top: 22px; border: 1px solid var(--ka-line); border-radius: 8px; background: #fff; }
.ka-editor:focus-within { border-color: #8DB2F6; box-shadow: 0 0 0 3px rgba(31,107,240,.1); }
.ka-tb { display: flex; align-items: center; gap: 2px; height: 43px; padding: 0 8px 0 6px; border-bottom: 1px solid #E6EBF2; overflow-x: auto; scrollbar-width: none; }
.ka-tb-select { position: relative; display: inline-flex; align-items: center; flex: none; height: 30px; padding: 0 8px 0 9px; border-radius: 6px; color: var(--ka-text); }
.ka-tb-select select { appearance: none; border: 0; outline: 0; background: transparent; font: inherit; font-size: 13px; font-weight: 500; color: inherit; padding-right: 20px; cursor: pointer; }
.ka-tb-select .kf-i { position: absolute; right: 8px; pointer-events: none; color: #5B6B82; }
.ka-tb-select:hover { background: #F3F6FA; }
.ka-tb-sep { flex: none; width: 1px; height: 22px; margin: 0 6px; background: #E6EBF2; }
.ka-tb-sep.is-push { margin-left: auto; }
.ka-tbb { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 30px; border-radius: 6px; color: #1E2B3C; }
.ka-tbb b, .ka-tbb i, .ka-tbb u { font-family: inherit; font-size: 15.5px; }
.ka-tbb:hover { background: #F1F5FA; }
.ka-editable { min-height: 138px; max-height: 260px; overflow-y: auto; padding: 14px 18px 6px; outline: 0; font-size: 13.4px; line-height: 1.5; color: var(--ka-text); }
.ka-editable.is-empty:before { content: attr(data-placeholder); color: #8391A5; pointer-events: none; }
.ka-shell.is-expanded .ka-editable { min-height: 380px; max-height: 60vh; }
.ka-editor-foot { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 0 10px 8px; font-size: 11.8px; color: var(--ka-muted); }
.ka-iconbtn { display: inline-flex; width: 26px; height: 26px; align-items: center; justify-content: center; border-radius: 6px; color: #33465F; }
.ka-iconbtn:hover { background: #F1F5FA; }
.ka-tip { display: flex; align-items: flex-start; gap: 16px; margin-top: 14px; padding: 13px 18px; border: 1px solid #DCE6F5; border-radius: 8px; background: #EEF3FB; }
.ka-tip-ico { flex: none; color: #F5A524; margin-top: 2px; }
.ka-tip-ico .kf-i { fill: #FCD34D; stroke: #D97706; }
.ka-tip strong { display: block; font-size: 13px; font-weight: 700; color: var(--ka-ink); }
.ka-tip p { margin-top: 3px; font-size: 12.7px; line-height: 1.45; color: var(--ka-text); }
.ka-more { margin-top: 12px; border-radius: 8px; background: #F5F8FC; }
.ka-more summary { display: flex; align-items: center; gap: 16px; min-height: 45px; padding: 4px 16px; cursor: pointer; list-style: none; color: #1E2B3C; }
.ka-more summary::-webkit-details-marker { display: none; }
.ka-more summary > span { flex: 1; min-width: 0; }
.ka-more summary strong { display: block; font-size: 13.1px; font-weight: 500; color: var(--ka-ink); }
.ka-more summary small { display: block; margin-top: 2px; font-size: 11.6px; color: var(--ka-muted); }
.ka-more-caret { transition: transform .15s; color: #33465F; }
.ka-more[open] .ka-more-caret { transform: rotate(180deg); }
.ka-more-body { padding: 4px 16px 14px; }
.ka-results { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.ka-results button { height: 28px; padding: 0 10px; border: 1px solid #DCE3EC; border-radius: 6px; background: #fff; font-size: 12.4px; color: var(--ka-text); }
.ka-results button:hover { border-color: #8DB2F6; color: #1F6BF0; }
.ka-relchips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.ka-muted { font-size: 12.2px; color: var(--ka-muted); }
.ka-note-side { display: flex; flex-direction: column; gap: 18px; margin-top: 22px; }
.ka-card { padding: 12px; border-radius: 10px; background: #F5F8FC; }
.ka-card .ka-cover { padding: 0; background: transparent; }
.ka-card-title { font-size: 12.3px; font-weight: 600; color: var(--ka-ink); }
.ka-settings { display: flex; flex-direction: column; gap: 4px; padding-bottom: 8px; }
.ka-settings .ka-card-title { margin-bottom: 8px; }
.ka-set { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 2px; }
.ka-set-ico { flex: none; display: inline-flex; width: 24px; height: 28px; align-items: center; justify-content: center; color: #1E2B3C; }
.ka-set-text { flex: 1; min-width: 0; }
.ka-set-text strong { display: block; font-size: 12.3px; font-weight: 500; color: var(--ka-ink); }
.ka-set-text small { display: block; margin-top: 2px; font-size: 11px; color: var(--ka-muted); }
.ka-toggle { width: 34px; height: 19px; }
.ka-toggle .toggle-track::after { width: 13px; height: 13px; }
.ka-toggle input:checked + .toggle-track { background: #1F6BF0; }
.ka-toggle input:checked + .toggle-track::after { transform: translateX(15px); }
.ka-toggle input:focus-visible + .toggle-track { outline: 2px solid #8DB2F6; outline-offset: 2px; }
.ka-remind-at { height: 32px; font-size: 12.6px; }
.ka-templates { display: flex; flex-direction: column; gap: 7px; }
.ka-templates-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; padding: 0 2px; }
.ka-link { font-size: 12.6px; font-weight: 500; color: #1F6BF0; }
.ka-link:hover { text-decoration: underline; }
.ka-tpl { display: flex; align-items: center; gap: 12px; min-height: 45px; padding: 6px 10px; border-radius: 8px; background: #F5F8FC; text-align: left; color: #33465F; }
.ka-tpl:hover { background: #EDF3FC; }
.ka-tpl-ico { flex: none; display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 7px; background: #E6EEFD; color: #1F6BF0; }
.ka-tpl-ico.tone-purple { background: #F3E6FC; color: #A21CAF; }
.ka-tpl-text { flex: 1; min-width: 0; }
.ka-tpl-text strong { display: block; font-size: 12.4px; font-weight: 600; color: var(--ka-ink); }
.ka-tpl-text small { display: block; margin-top: 1px; font-size: 11.2px; color: var(--ka-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ka-tplmenu { min-width: 220px; }
/* footer */
.ka-foot { display: flex; align-items: center; gap: 12px; padding: 14px 20px 18px; border-top: 1px solid #E9EEF4; background: #fff; }
.ka-foot-sp { flex: 1; }
.ka-foot-tpl { display: inline-flex; align-items: center; gap: 12px; padding-left: 4px; font-size: 13.4px; color: var(--ka-text); }
.ka-foot-tpl svg { color: #1F6BF0; }
.ka-foot-tpl:hover { color: #1F6BF0; }
.ka:not(.is-note) .ka-another-right, .ka.is-note .ka-another-left { display: none; }
.ka.is-note .ka-foot .ka-btn { height: 38px; font-size: 14px; }
@media (max-width: 1023px) {
  .modal.ka-shell.is-note { width: 720px; }
  .ka-note-pane:not([hidden]) { grid-template-columns: minmax(0, 1fr); }
  .ka-note-side { margin-top: 0; }
}
@media (max-width: 767px) {
  .modal.ka-shell, .modal.ka-shell.is-note { width: 100%; max-width: 100%; max-height: 100dvh; height: 100dvh; border-radius: 0; }
  .ka-head { padding: 14px 16px 0; gap: 12px; }
  .ka-head-ico { width: 44px; height: 44px; }
  .ka-title { font-size: 19px; }
  .ka-tabs { margin: 14px 16px 0; }
  .ka-tab { gap: 6px; font-size: 12.6px; padding: 0 4px; }
  .ka-body { padding: 4px 16px 16px; }
  .ka-basic, .ka-grid3, .ka-note-pane .ka-grid3, .ka-grid2, .ka-sources { grid-template-columns: minmax(0, 1fr); }
  .ka-row { flex-wrap: wrap; }
  .ka-row > .ka-input, .ka-row > .ka-input-ic { flex: 1 1 100%; }
  .ka-select.is-sm { width: 100%; }
  .ka-foot { flex-wrap: wrap; padding: 12px 16px 16px; }
  .ka-foot .ka-btn { flex: 1 1 auto; min-height: 44px; }
  .ka-foot-sp { display: none; }
  .ka-x, .ka-iconbtn, .ka-tbb { min-width: 40px; min-height: 40px; }
}

/* ── Knowledge & Files · Knowledge collection page (design-reference-new/knowledge-personal-collection.png) ── */
.page-kc { --kc-ink: #0D1B2E; --kc-text: #1E2B3C; --kc-muted: #5E6C80; --kc-line: #E4EAF2; }
.page-kc .main, .page-kc .content { background: #F6F8FB; }
.kc-page { min-height: calc(100vh - var(--topbar-h)); padding: 0 13px 24px 15px; background: #F6F8FB; }
.kc-crumbs { display: flex; align-items: center; gap: 8px; padding-top: 18px; font-size: 13.2px; color: #4A5A70; }
.kc-crumbs a { display: inline-flex; align-items: center; gap: 10px; color: #4A5A70; }
.kc-crumbs a:hover { color: var(--kf-blue); }
.kc-crumbs strong { font-weight: 600; color: var(--kc-ink); }
.kc-crumbs .kf-i { color: #8A97AA; }
.kc-head { display: flex; align-items: center; gap: 17px; margin-top: 13px; }
.kc-head-ico { flex: none; width: 54px; height: 54px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; background: #E9F0FD; color: #1F6BF0; }
.kc-head-text { flex: 1; min-width: 0; }
.kc-title-row { display: flex; align-items: center; gap: 14px; }
.kc-title-row h1 { font-size: 27px; font-weight: 700; letter-spacing: -.02em; color: var(--kc-ink); line-height: 1.15; }
.kc-star { display: inline-flex; color: #F5A524; }
.kc-star[aria-pressed="true"] .kf-i { fill: #F5A524; }
.kc-head-text p { margin-top: 5px; font-size: 13.6px; color: #4F5E73; }
.kc-head-actions { display: flex; align-items: center; gap: 12px; flex: none; }
.kc-head-actions .kf-pop { position: relative; }
.kc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 36px; padding: 0 13px; border: 1px solid #DFE6EF; border-radius: 8px; background: #fff; color: var(--kc-text); font-size: 13.4px; font-weight: 500; white-space: nowrap; }
.kc-btn:hover { background: #F5F8FC; }
.kc-btn.is-sq { width: 40px; padding: 0; }
.kc-btn-ai { border-color: #EFE7FE; background: #F4EFFE; color: #6D28D9; font-weight: 600; }
.kc-btn-ai:hover { background: #EDE4FE; }
.kc-btn-primary { border-color: #1F6BF0; background: #1F6BF0; color: #fff; }
.kc-btn-primary:hover { background: #185AD1; }
.kc-dot { width: 7px; height: 7px; border-radius: 50%; background: #1F6BF0; }
.kc-cols { display: flex; align-items: flex-start; gap: 14px; margin-top: 30px; }
/* sidebar */
.kc-side.kf-side { width: 184px; flex: none; position: sticky; top: calc(var(--topbar-h) + 12px); max-height: none; overflow: visible; background: transparent; border: 0; display: flex; flex-direction: column; gap: 14px; }
.kc-card { padding: 12px 10px 10px; border-radius: 12px; background: #fff; }
.kc-sec-head { display: flex; align-items: center; justify-content: space-between; padding: 0 4px 0 6px; margin-bottom: 10px; }
.kc-sec-head h2 { font-size: 14.4px; font-weight: 700; color: var(--kc-ink); letter-spacing: -.01em; }
.kc-add { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 6px; color: #33465F; }
.kc-add:hover { background: #F1F5FA; }
.kc-nav { display: flex; flex-direction: column; }
.kc-nav-item { display: flex; align-items: center; gap: 9px; height: 33.5px; padding: 0 7px; border-radius: 8px; font-size: 12px; color: var(--kc-text); }
.kc-nav-item span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-nav-item em, .kc-tag em { font-style: normal; font-size: 12px; color: var(--kc-muted); font-variant-numeric: tabular-nums; }
.kc-nav-item .kf-i { color: #33465F; flex: none; }
.kc-nav-item:hover { background: #F4F7FB; }
.kc-nav-item.is-active { background: #EDF3FD; color: #1F6BF0; font-weight: 600; }
.kc-nav-item.is-active .kf-i, .kc-nav-item.is-active em { color: #1F6BF0; }
.kc-tags { display: flex; flex-direction: column; list-style: none; margin: 0; padding: 0; }
.kc-tag { display: flex; align-items: center; gap: 10px; height: 32px; padding: 0 8px; border-radius: 8px; font-size: 12.8px; color: var(--kc-text); }
.kc-tag span:nth-child(2) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-tag:hover { background: #F4F7FB; }
.kc-tag.is-active { background: #EDF3FD; color: #1F6BF0; }
.kc-tag-sq { flex: none; display: inline-flex; width: 16px; height: 16px; align-items: center; justify-content: center; border-radius: 4px; color: #fff; background: #52627A; }
.kc-tag-sq .kf-i { stroke-width: 2.2; }
.kc-tag-sq.tone-blue { background: #2563EB; } .kc-tag-sq.tone-green { background: #16A34A; } .kc-tag-sq.tone-purple { background: #8B3FE0; } .kc-tag-sq.tone-red { background: #EF4444; } .kc-tag-sq.tone-orange { background: #F59E0B; } .kc-tag-sq.tone-teal { background: #0D9488; } .kc-tag-sq.tone-pink { background: #DB2777; } .kc-tag-sq.tone-slate { background: #64748B; }
.kc-more { display: flex; align-items: center; gap: 5px; margin: 4px 0 0 8px; font-size: 12.3px; font-weight: 500; color: var(--kf-blue); }
.kc-more[aria-expanded="true"] .kf-i { transform: rotate(180deg); }
/* main */
.kc-main { flex: 1; min-width: 0; }
.kc-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.kc-q { display: flex; align-items: flex-start; gap: 11px; min-height: 83px; padding: 15px 10px 12px 12px; border-radius: 10px; background: #fff; text-align: left; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
.kc-q:hover { box-shadow: 0 0 0 1px #D8E3F4, 0 4px 12px rgba(15,23,42,.06); }
.kc-q-ico { flex: none; display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 8px; }
.kc-q-ico.is-drive { background: transparent; }
.kc-q-ico.tone-blue { background: #E9F0FD; color: #1F6BF0; } .kc-q-ico.tone-violet { background: #F1EBFE; color: #7C3AED; } .kc-q-ico.tone-pink { background: #FCEAF6; }
.kc-q-text { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.kc-q-text strong { font-size: 12.1px; font-weight: 600; color: var(--kc-ink); }
.kc-q-text small { font-size: 10.6px; color: var(--kc-muted); line-height: 1.35; }
.kc-pill { align-self: flex-start; margin-top: 6px; padding: 2px 8px; border-radius: 6px; background: #E3F6EA; color: #12804A; font-size: 11.4px; font-weight: 600; }
.kc-filters { display: flex; align-items: center; gap: 11px; margin-top: 18px; }
.kc-search { display: flex; align-items: center; gap: 9px; width: 297px; height: 34px; padding: 0 12px; border: 1px solid var(--kc-line); border-radius: 8px; background: #fff; color: #6B7A8F; }
.kc-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 13px; color: var(--kc-ink); }
.kc-search:focus-within, .kc-select:focus-within { border-color: #8DB2F6; box-shadow: 0 0 0 3px rgba(31,107,240,.12); }
.kc-select { position: relative; display: inline-flex; align-items: center; height: 34px; padding: 0 30px 0 11px; border: 1px solid var(--kc-line); border-radius: 8px; background: #fff; }
.kc-select select { appearance: none; border: 0; outline: 0; background: transparent; font: inherit; font-size: 13px; color: var(--kc-ink); cursor: pointer; }
.kc-select .kf-i { position: absolute; right: 9px; pointer-events: none; color: #33465F; }
.kc-filters .kc-select { width: 100px; } .kc-filters .kc-select:nth-of-type(3) { width: 87px; } .kc-filters .kc-select.is-wide { width: 116px; }
.kc-filters .kc-select select { width: 100%; }
.kc-select.is-sm { height: 32px; }
.kc-filters-sp { flex: 1; }
.kc-vt { display: flex; gap: 8px; }
.kc-vt-b { display: inline-flex; width: 40px; height: 36px; align-items: center; justify-content: center; border: 1px solid var(--kc-line); border-radius: 8px; background: #fff; color: #33465F; }
.kc-vt-b.is-active { border-color: #CFE0FC; background: #EAF1FE; color: #1F6BF0; }
.kc-tablewrap { margin-top: 18px; overflow-x: auto; }
.kc-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 12px; }
.kc-table th { height: 32px; padding: 0 8px; text-align: left; font-size: 12.2px; font-weight: 500; color: #3D4B5F; }
.kc-table th a { display: inline-flex; align-items: center; gap: 6px; color: inherit; }
.kc-table td { height: 52.5px; padding: 0 8px; border-top: 1px solid #EDF1F6; color: #4F5E73; vertical-align: middle; }
.kc-table tbody tr { background: #fff; cursor: pointer; }
.kc-table tbody tr:hover { background: #F8FAFD; }
.kc-table tbody tr.is-selected { background: #F1F6FE; }
.kc-table .c-chk { width: 40px; padding-left: 14px; } .kc-table .c-type { width: 88px; } .kc-table .c-tags { width: 160px; } .kc-table .c-mod { width: 94px; } .kc-table .c-add { width: 92px; } .kc-table .c-act { width: 58px; text-align: center; }
.kc-table .c-type, .kc-table .c-mod, .kc-table .c-add { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kc-table .c-tags .kc-tags-inline { flex-wrap: nowrap; overflow: hidden; }
.kc-chk { position: relative; display: inline-flex; }
.kc-chk input { position: absolute; opacity: 0; width: 16px; height: 16px; }
.kc-chk span { width: 16px; height: 16px; border: 1.5px solid #A7B3C4; border-radius: 4px; background: #fff; }
.kc-chk input:checked + span { border-color: #1F6BF0; background: #1F6BF0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.2 2.6 2.6L12 5.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
.kc-chk input:focus-visible + span { outline: 2px solid #8DB2F6; outline-offset: 2px; }
.kc-name { display: flex; align-items: center; gap: 10px; min-width: 0; }
.kc-name > span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.kc-name strong { font-size: 11.9px; font-weight: 600; color: var(--kc-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-name small { font-size: 10.7px; color: #4F5E73; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-ico { flex: none; }
.kc-tags-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.kc-pilltag { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; background: #F1F4F8; color: #33465F; font-size: 11.6px; font-weight: 500; white-space: nowrap; }
.kc-pilltag.tone-blue { background: #EAF1FE; color: #1D5FD6; } .kc-pilltag.tone-green { background: #E4F6EC; color: #12804A; } .kc-pilltag.tone-purple { background: #F2EAFE; color: #7C3AED; } .kc-pilltag.tone-red { background: #FDECEC; color: #D92D20; } .kc-pilltag.tone-orange { background: #FEF3E2; color: #C2410C; } .kc-pilltag.tone-teal { background: #E2F5F3; color: #0F766E; } .kc-pilltag.tone-pink { background: #FCE8F3; color: #BE185D; }
.kc-rowbtn { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 7px; color: #33465F; }
.kc-rowbtn:hover { background: #EEF3FA; }
.kc-table .kf-pop { position: relative; display: inline-flex; }
.kc-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 18px; padding: 48px 16px; border-radius: 12px; background: #fff; color: var(--kc-muted); text-align: center; }
.kc-empty strong { font-size: 15px; color: var(--kc-ink); }
.kc-empty .kc-btn { margin-top: 8px; }
.kc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; margin-top: 18px; }
.kc-gcard { display: flex; flex-direction: column; gap: 6px; padding: 14px; border-radius: 12px; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.kc-gcard:hover, .kc-gcard.is-selected { box-shadow: 0 0 0 1px #CFE0FC, 0 6px 16px rgba(15,23,42,.06); }
.kc-gcard-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.kc-gcard-type { font-size: 11.4px; color: var(--kc-muted); }
.kc-gcard strong { font-size: 13px; color: var(--kc-ink); }
.kc-gcard small { font-size: 11.6px; color: var(--kc-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kc-gcard-date { margin-top: auto; padding-top: 6px; font-size: 11.4px; color: #6B7A8F; }
.kc-foot { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 16px; padding: 14px 16px; border-radius: 12px; background: #fff; font-size: 12.8px; color: #4F5E73; }
.kc-per { display: inline-flex; align-items: center; gap: 10px; }
/* panel */
.kc-panel.kf-panel { width: 338px; flex: none; position: sticky; top: calc(var(--topbar-h) + 12px); max-height: calc(100vh - var(--topbar-h) - 24px); margin-top: -12px; border: 0; border-radius: 12px; background: #fff; overflow: hidden; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.kc-panel-head { display: flex; align-items: flex-start; gap: 12px; padding: 18px 14px 12px 16px; }
.kc-panel-title { flex: 1; min-width: 0; }
.kc-panel-title h2 { font-size: 16.4px; font-weight: 700; letter-spacing: -.02em; color: var(--kc-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-panel-title p { margin-top: 3px; font-size: 12.4px; color: #4F5E73; }
.kc-ibtn { flex: none; display: inline-flex; width: 26px; height: 26px; align-items: center; justify-content: center; border-radius: 6px; color: #5B6B82; }
.kc-ibtn:hover { background: #F1F5FA; color: var(--kc-ink); }
.kc-panel-body { overflow-y: auto; max-height: calc(100vh - var(--topbar-h) - 100px); padding: 0 16px 18px; scrollbar-width: thin; }
.kc-linkcard { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid #E4EAF2; border-radius: 10px; color: var(--kc-ink); }
.kc-linkcard > span { flex: 1; min-width: 0; }
.kc-linkcard strong { display: block; font-size: 12.6px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-linkcard small { display: block; margin-top: 2px; font-size: 11.4px; color: var(--kc-muted); }
.kc-linkcard .kf-i { color: #1F6BF0; }
.kc-linkcard:hover { border-color: #CFE0FC; }
.kc-panel-actions { display: flex; gap: 12px; margin-top: 8px; }
.kc-panel-actions .kc-btn-primary { flex: 1; }
.kc-tabs { display: flex; gap: 22px; margin-top: 22px; border-bottom: 1px solid #E9EEF4; }
.kc-tab { position: relative; padding: 8px 2px 10px; font-size: 12.8px; font-weight: 500; color: #3D4B5F; }
.kc-tab.is-active { color: #1F6BF0; font-weight: 600; }
.kc-tab.is-active::after { content: ''; position: absolute; left: -2px; right: -2px; bottom: -1px; height: 2px; border-radius: 2px; background: #1F6BF0; }
.kc-psec { margin-top: 20px; }
.kc-psec-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.kc-psec-head h3 { font-size: 13.4px; font-weight: 700; color: var(--kc-ink); }
.kc-desc { font-size: 12.8px; line-height: 1.56; color: var(--kc-text); }
.kc-kv { display: grid; grid-template-columns: 92px minmax(0, 1fr); row-gap: 14px; align-items: center; margin-top: 20px; font-size: 12.6px; }
.kc-kv dt { font-weight: 700; font-size: 13px; color: var(--kc-ink); }
.kc-kv.is-muted dt { font-weight: 400; font-size: 12.4px; color: var(--kc-muted); }
.kc-kv dd { margin: 0; min-width: 0; color: var(--kc-text); }
.kc-kv-coll, .kc-kv-person { display: flex; align-items: center; gap: 8px; }
.kc-kv-coll .kf-i { color: #1F6BF0; }
.kc-plus { display: inline-flex; width: 22px; height: 22px; align-items: center; justify-content: center; border-radius: 6px; color: #33465F; }
.kc-plus:hover { background: #F1F5FA; }
.kc-related-sec { margin-top: 24px; padding-top: 16px; border-top: 1px solid #EDF1F6; }
.kc-addrel { display: inline-flex; align-items: center; gap: 5px; }
.kc-rel { display: flex; flex-direction: column; list-style: none; margin: 0; padding: 0; }
.kc-rel li { display: flex; align-items: center; }
.kc-rel a { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; height: 33px; padding: 0 4px; border-radius: 7px; font-size: 12.6px; color: var(--kc-text); }
.kc-rel a span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-rel a em { font-style: normal; color: var(--kc-muted); }
.kc-rel a:hover { background: #F4F7FB; }
.kc-trash { display: inline-flex; align-items: center; gap: 12px; margin-top: 18px; padding: 4px; font-size: 13px; color: #E5484D; }
.kc-trash:hover { text-decoration: underline; }
.kc-list { display: flex; flex-direction: column; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; font-size: 12.6px; color: var(--kc-text); }
.kc-list li { display: flex; gap: 10px; }
.kc-list small { display: block; margin-top: 2px; font-size: 11.4px; color: var(--kc-muted); }
.kc-list p { margin-top: 4px; line-height: 1.45; }
.kc-noteform { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.kc-noteform textarea { width: 100%; padding: 9px 11px; border: 1px solid var(--kc-line); border-radius: 8px; font: inherit; font-size: 12.8px; resize: vertical; }
.kc-noteform .kc-btn { align-self: flex-end; height: 32px; }
.kc-muted { color: var(--kc-muted); font-size: 12.4px; }
@media (max-width: 1439px) { .kc-panel.kf-panel { width: 310px; } }
@media (max-width: 1279px) {
  .page-kc .kc-cols { flex-wrap: wrap; }
  .page-kc .kc-panel.kf-panel { display: flex; width: 100%; position: static; max-height: none; margin-top: 0; order: 3; }
  .kc-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1023px) {
  .page-kc .kc-side.kf-side { position: fixed; left: 0; top: var(--topbar-h); bottom: 0; z-index: var(--z-drawer); width: 262px; padding: 12px; background: #F6F8FB; overflow-y: auto; transform: translateX(-100%); transition: transform var(--t-drawer); box-shadow: var(--shadow-lg); }
  body.kf-side-open .kc-side.kf-side { transform: none; }
  .kc-head { flex-wrap: wrap; }
  .kc-head-actions { width: 100%; flex-wrap: wrap; }
  .kc-filters { flex-wrap: wrap; }
  .kc-search { width: 100%; }
  .kc-table { table-layout: auto; min-width: 700px; }
}
@media (max-width: 767px) {
  .kc-page { padding: 0 16px 24px; }
  .kc-title-row h1 { font-size: 22px; }
  .kc-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .kc-q { min-height: 0; padding: 12px 10px; }
  .kc-head-actions .kc-btn { flex: 1 1 auto; min-height: 44px; }
  .kc-foot { flex-direction: column; align-items: stretch; text-align: center; }
  .kc-rowbtn, .kc-vt-b, .kc-ibtn, .kc-plus { min-width: 44px; min-height: 44px; }
}

/* ── Knowledge & Files · responsive ────────────────────────────────────
   The module is a three-column app (tree · files · detail). Below 1280 the detail panel folds away,
   below 1024 the tree becomes a drawer over the content, and the file table scrolls inside its wrap. */
body.kf-side-hidden .kf-side { display: none; }
.kf-tablewrap { overflow-x: auto; }
@media (max-width: 1279px) {
  .page-kf .kf-panel { display: none; }
}
@media (max-width: 1100px) {
  .page-kf .kf-quick { grid-template-columns: 1fr 1fr; }   /* four tiles no longer fit beside the tree */
}
@media (max-width: 1023px) {
  .page-kf { --kf-side-w: 262px; }
  .page-kf .kf-side { position: fixed; left: 0; top: var(--topbar-h); bottom: 0; z-index: var(--z-drawer);
    box-shadow: var(--shadow-lg); transform: translateX(-100%); transition: transform var(--t-drawer); max-height: none; }
  body.kf-side-open .kf-side { transform: none; }
  body.kf-side-hidden .kf-side { display: block; }          /* the toggle opens it here instead of hiding it */
  .page-kf .kf-filters { overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
  .page-kf .kf-filters > * { flex: none; }
  .kf-table { table-layout: auto; min-width: 720px; }
}
@media (max-width: 767px) {
  .page-kf .kf-head { flex-wrap: wrap; gap: 10px; }
  .page-kf .kf-head-actions { width: 100%; justify-content: space-between; }
  .page-kf .kf-foot { flex-wrap: wrap; gap: 8px; }
}
@media (max-width: 479px) {
  .page-kf .kf-quick { grid-template-columns: 1fr; }
  .page-kf .kf-head-text h1, .page-kf .kf-head-text .kf-head-title { font-size: 19px; }
}
/* ── Website Operations · panel hero ──────────────────────────────────
   Thumbnail beside the three mini KPIs. Both columns must be allowed to shrink (minmax(0,…)),
   otherwise the thumbnail's own text sets a minimum width and the KPI column is squeezed until
   its numbers spill out of the panel. */
.wo-panel-hero { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 12px; }
.wo-panel-hero .mini-kpi { min-width: 0; }
.wo-panel-hero .mini-kpi .v, .wo-panel-hero .mini-kpi .l { overflow-wrap: anywhere; }
.wo-panel-hero .k-thumb > div { min-width: 0; padding: 0 6px; }
.wo-panel-hero .k-thumb div[style*="font-size:20px"] { font-size: clamp(13px, 1.6vw, 20px) !important; }
@media (max-width: 1279px) { .wo-panel-hero { grid-template-columns: 1fr; } }

/* ── Shared responsive corrections (audit batch 6) ────────────────────
   The page header is a flex row of icon + title block. On a phone the title block has to be told to
   take the full width, or its intrinsic width sets the page's scroll width and the whole page pans
   sideways — it was 458px wide inside a 350px header at 390px. */
@media (max-width: 767px) {
  .page-header-main { width: 100%; max-width: 100%; min-width: 0; }
  .page-header-main > div { width: 100%; min-width: 0; }
  .page-title, .page-subtitle, .eyebrow { min-width: 0; overflow-wrap: anywhere; }
  .page-actions { max-width: 100%; }
}

/* ── Module toolbars · responsive (audit batch 6) ─────────────────────
   Affiliate Accounts, Payments and Tracking Links all put a title, a button row, a stat strip and a
   tab strip on one line. Each of those sets its own minimum width, so below 1024 the page panned
   sideways. Button rows wrap, stat strips fold to two columns then one, tab strips scroll. */
@media (max-width: 1023px) {
  .aa-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); height: auto; }
  .pay-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tl-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .aa-top, .pay-top, .tl-top { flex-direction: column; align-items: stretch; gap: 10px; }
  .aa-top-actions, .pay-top-actions, .tl-top-actions { flex-wrap: wrap; margin-top: 0; }
  .aa-top-actions > *, .pay-top-actions > *, .tl-top-actions > * { flex: 1 1 auto; justify-content: center; }
  .pay-top-l, .tl-top-l { flex-wrap: wrap; gap: 8px; min-width: 0; }
  .pay-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aa-tabsrow, .tl-tabsrow { flex-direction: column; align-items: stretch; gap: 10px; }
  .aa-tabs, .pay-tabs, .tl-tabs, .tl-seg { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .aa-tabs::-webkit-scrollbar, .pay-tabs::-webkit-scrollbar, .tl-tabs::-webkit-scrollbar, .tl-seg::-webkit-scrollbar { display: none; }
  .aa-tabs > *, .pay-tabs > *, .tl-tabs > *, .tl-seg > * { flex: none; }
  .aa-chips, .pay-chips, .tl-chips { min-width: 0; }
}
@media (max-width: 479px) {
  .aa-stats, .pay-stats, .tl-stats { grid-template-columns: minmax(0, 1fr); }
}

/* ── Card heads on a phone (audit batch 6) ────────────────────────────
   Chart headers keep the title and the range select on one line on desktop (nowrap). On a phone the
   select was landing on top of the title, so these heads are allowed to wrap and the control drops
   onto its own line. */
@media (max-width: 767px) {
  .card-head, .perf-head { flex-wrap: wrap; row-gap: 10px; }
  .card-head-main { min-width: 0; flex: 1 1 100%; }
  .card-head > .flex, .card-head > .card-link, .perf-head > .flex { flex-wrap: wrap; }
  .chart-card .card-head .soft-select, .perf-head .soft-select { flex: 0 0 auto; }
  .chart-legend { flex-wrap: wrap; row-gap: 6px; }
}
/* ==================================================================== */
/*  Reports tabs — stat rows, list cards, tables and the detail panel    */
/* ==================================================================== */
.page-reports .rp-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin-bottom: 15px; }

.page-reports .rp-stat { position: relative; display: flex; align-items: flex-start; gap: 11px; padding: 17px 14px 16px; border: 1px solid var(--rp-line); border-radius: var(--rp-radius); background: #fff; overflow: hidden; }
.page-reports .rp-stat-icon { flex: none; width: 44px; height: 44px; border-radius: 13px; display: inline-flex; align-items: center; justify-content: center; }
.page-reports .rp-stat-icon .icon { width: 23px; height: 23px; stroke-width: 2.1; }
.page-reports .rp-stat-icon.tone-indigo { background: #E7EAFE; color: #4353FD; }
.page-reports .rp-stat-icon.tone-green { background: #D8F6E5; color: #17A25C; }
.page-reports .rp-stat-icon.tone-blue { background: #E1EDFD; color: #1F6FEB; }
.page-reports .rp-stat-icon.tone-red { background: #FDE3E6; color: #F0384B; }
.page-reports .rp-stat-icon.tone-amber { background: #FDF1DC; color: #C2740A; }
.page-reports .rp-stat-icon.tone-purple { background: #EDE6FE; color: #7C4DFB; }
.page-reports .rp-stat-icon.tone-teal { background: #D8F5F3; color: #0E8F8A; }
.page-reports .rp-stat-icon.tone-pink { background: #FDE4F1; color: #DB2777; }
.page-reports .rp-stat-body { min-width: 0; flex: 1 1 auto; }
.page-reports .rp-stat-label { font-size: 13px; font-weight: 500; color: #33445F; white-space: nowrap; }
.page-reports .rp-stat-line { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 4px; padding-right: 2px; }
.page-reports .rp-stat-value { font-size: 25px; font-weight: 800; letter-spacing: -.025em; color: var(--rp-ink); }
.page-reports .rp-stat-sub { min-height: 14px; font-size: 11.5px; color: var(--rp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-stat-foot { display: flex; align-items: flex-end; gap: 8px; margin-top: 6px; min-width: 0; }

/* ---- list card ---- */
.page-reports .rp-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; align-items: start; transition: grid-template-columns .28s cubic-bezier(.4, 0, .2, 1); }
.page-reports .rp-split.is-open { grid-template-columns: minmax(0, 1fr) 422px; }
.page-reports .rp-split-deals { gap: 18px; }
.page-reports .rp-split-deals.is-open { grid-template-columns: minmax(0, 1fr) 400px; }
.page-reports .rp-split-trk { gap: 23px; }
.page-reports .rp-split-trk.is-open { grid-template-columns: minmax(0, 1fr) 365px; }
.page-reports .rp-listcard { padding: 15px 0 2px; overflow: hidden; }
.page-reports .rp-listhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 0 14px 11px; }
.page-reports .rp-listtitle h2 { margin: 0; font-size: 17px; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-listtitle h2 em { font-style: normal; color: #68758B; font-weight: 700; }
.page-reports .rp-listtitle p { margin: 3px 0 0; font-size: 12.5px; color: #68758B; }
.page-reports .rp-listtools { display: flex; align-items: center; gap: 9px; }
.page-reports .rp-viewtoggle { display: inline-flex; border: 1px solid var(--rp-line); border-radius: 9px; overflow: hidden; background: #fff; }
.page-reports .rp-viewbtn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; color: #667691; }
.page-reports .rp-viewbtn + .rp-viewbtn { border-left: 1px solid var(--rp-line); }
.page-reports .rp-viewbtn.is-on { background: #EAF2FE; color: #2F7DFE; }
.page-reports .rp-btn-primary { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 15px 0 12px; border: 0; border-radius: 9px; background: #1F6FEB; color: #fff; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.page-reports .rp-btn-primary:hover { background: #1A62D4; }
.page-reports .rp-btn-wide { flex: 1 1 0; justify-content: center; }

/* ---- filter bar ---- */
.page-reports .rp-filters { display: flex; align-items: center; gap: 10px; padding: 0 14px 8px; flex-wrap: wrap; }
.page-reports .rp-search { position: relative; display: inline-flex; align-items: center; flex: 1 1 220px; max-width: 238px; height: 40px; padding: 0 12px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; color: #667691; }
.page-reports .rp-search input { flex: 1 1 auto; min-width: 0; height: 38px; margin-left: 8px; border: 0; background: none; outline: none; font: inherit; font-size: 13px; color: var(--rp-ink); }
.page-reports .rp-fsel { position: relative; display: inline-flex; flex-direction: column; justify-content: center; height: 40px; min-width: 132px; padding: 0 30px 0 12px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; }
.page-reports .rp-fsel-label { font-size: 10px; color: #667691; line-height: 1.1; }
.page-reports .rp-fsel select { appearance: none; -webkit-appearance: none; border: 0; background: none; outline: none; font: inherit; font-size: 13px; font-weight: 500; color: var(--rp-ink); cursor: pointer; padding: 0; line-height: 1.3; }
.page-reports .rp-fsel-caret { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; color: #667691; pointer-events: none; }
.page-reports .rp-perpage { min-width: 124px; height: 36px; padding: 0 28px 0 11px; justify-content: center; }

/* ---- table ---- */
.page-reports .rp-tablewrap { overflow-x: auto; }
.page-reports .rp-table-rows { width: 100%; table-layout: fixed; }
.page-reports .rp-table-rows thead th { height: 36px; padding: 0 7px; background: #F7F9FD; border-top: 1px solid var(--rp-line-soft, #EEF2F8); border-bottom: 1px solid var(--rp-line); font-size: 12px; font-weight: 600; color: var(--rp-muted); text-align: left; white-space: nowrap; }
.page-reports .rp-table-rows thead th:first-child { padding-left: 18px; }
.page-reports .rp-table-rows thead th:last-child { padding-right: 18px; }
.page-reports .rp-sortable a { display: inline-flex; align-items: center; gap: 4px; color: inherit; }
.page-reports .rp-sortable a:hover { color: var(--rp-ink); }
.page-reports .rp-sortcaret { width: 13px; height: 13px; opacity: .55; }
.page-reports .rp-sortable.is-sorted a { color: var(--rp-ink); font-weight: 600; }
.page-reports .rp-table-rows tbody td { height: 42px; padding: 0 7px; border-bottom: 1px solid var(--rp-line-soft, #EEF2F8); font-size: 13px; line-height: 1.25; color: var(--rp-ink); white-space: nowrap; vertical-align: middle; }
.page-reports .rp-trow { height: 42px; }
.page-reports .rp-table-rows tbody td > .dropdown { display: block; line-height: 0; }
.page-reports .rp-table-rows tbody td:first-child { padding-left: 18px; }
.page-reports .rp-table-rows tbody td:last-child { padding-right: 18px; }
.page-reports .rp-trow { cursor: pointer; transition: background var(--t-fast); }
.page-reports .rp-trow:hover { background: #F7FAFE; }
.page-reports .rp-trow.is-on { background: #EEF5FE; }
.page-reports .rp-trow:focus-visible { outline: 2px solid #2F7DFE; outline-offset: -2px; }
.page-reports .rp-c-sel { }
.page-reports .rp-c-num { color: #667691; }
.page-reports .rp-c-act { text-align: right; }
.page-reports .rp-rowmenu > button, .page-reports .rp-rowmenu .btn-icon { color: #111C33; }
.page-reports .rp-rowmenu > button .icon, .page-reports .rp-rowmenu .btn-icon .icon { width: 19px; height: 19px; stroke-width: 3; }
.page-reports .rp-dots { fill: currentColor; stroke: none; }
.page-reports .rp-table-rows .rp-rowmenu .btn-icon, .page-reports .rp-slist .rp-rowmenu .btn-icon { color: #111C33; }
.page-reports .rp-c-partner { font-weight: 600; color: var(--rp-ink); }
.page-reports .rp-c-partner > * { vertical-align: middle; }
.page-reports .rp-c-partner > span { margin-left: 9px; }
.page-reports .rp-c-money { font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-c-date { color: var(--rp-muted); }
.page-reports .rp-c-rating { font-weight: 600; color: var(--rp-ink); }
.page-reports .rp-c-rating > * { vertical-align: middle; }
.page-reports .rp-c-rating > span { margin-left: 5px; }
.page-reports .rp-star { color: #F5A623; fill: currentColor; stroke: none; width: 15px; height: 15px; }
.page-reports .rp-logo { flex: none; display: inline-block; border-radius: 7px; overflow: hidden; }
.page-reports .rp-logo-initials { width: 100%; height: 100%; display: inline-flex; align-items: center; justify-content: center; background: var(--tile); color: #fff; font-size: 9.5px; font-weight: 700; letter-spacing: -.02em; }
.page-reports .rp-typepill { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; background: #F1F4FA; font-size: 11.5px; font-weight: 500; color: #46588A; }
.page-reports .rp-spill { display: inline-flex; align-items: center; height: 23px; padding: 0 11px; border-radius: 6px; font-size: 11.5px; font-weight: 600; }
.page-reports .rp-spill.tone-green { background: #DEFCEF; color: #05884A; }
.page-reports .rp-spill.tone-amber { background: #FDF1DC; color: #B45309; }
.page-reports .rp-spill.tone-red { background: #FEE4E4; color: #D0161D; }
.page-reports .rp-spill.tone-grey { background: #F1F4FA; color: #64748B; }
.page-reports .rp-spill.tone-blue { background: #E4EFFE; color: #1F6FEB; }
.page-reports .rp-avatars { display: inline-flex; align-items: center; vertical-align: middle; }
.page-reports .rp-ava { border: 2px solid #fff; border-radius: 50%; width: 22px !important; height: 22px !important; font-size: 9px !important; background: #8DA2C0 !important; color: #fff !important; }
.page-reports .rp-ava-more { display: inline-flex; align-items: center; justify-content: center; height: 22px; margin-left: 4px; padding: 0 6px; border-radius: 11px; background: #EEF2F8; font-size: 10.5px; font-weight: 600; color: #69758B; }
.page-reports .rp-muted { color: #627599; }
.page-reports .rp-check { display: inline-flex; cursor: pointer; }
.page-reports .rp-check input { position: absolute; opacity: 0; width: 0; height: 0; }
.page-reports .rp-check span { width: 15px; height: 15px; border: 1.5px solid #CBD8EC; border-radius: 4px; background: #fff; display: block; position: relative; }
.page-reports .rp-check input:checked + span { background: #2F7DFE; border-color: #2F7DFE; }
.page-reports .rp-check input:checked + span::after { content: ""; position: absolute; left: 4px; top: 1px; width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.page-reports .rp-rowmenu .btn-icon { width: 26px; height: 26px; border: 0; background: none; color: #667691; }
.page-reports .rp-rowmenu .btn-icon:hover { background: #EDF3FC; color: var(--rp-ink); }

/* ---- pager ---- */
.page-reports .rp-pager { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 42px 14px 16px; }
.page-reports .rp-pager-info { font-size: 12.5px; color: #69758B; }
.page-reports .rp-pages { display: inline-flex; align-items: center; gap: 6px; margin-right: 40px; }
.page-reports .rp-page { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 30px; padding: 0 8px; border: 1px solid var(--rp-line); border-radius: 8px; background: #fff; font-size: 12.5px; font-weight: 500; color: #46588A; }
.page-reports .rp-page:hover { border-color: #CFDDF3; color: #2F7DFE; }
.page-reports .rp-page.is-on { background: #1F6FEB; border-color: #1F6FEB; color: #fff; font-weight: 600; }
.page-reports .rp-page.is-off { color: #607698; pointer-events: none; }
.page-reports .rp-page-gap { border-color: transparent; background: none; color: #667691; pointer-events: none; padding: 0 4px; min-width: 22px; }

/* ---- the right detail panel ---- */
.page-reports .rp-panel { display: none; }
.page-reports .rp-panel.is-open { display: flex; flex-direction: column; gap: 0; min-width: 0; animation: rp-panel-in .28s cubic-bezier(.4, 0, .2, 1); }
@keyframes rp-panel-in { from { opacity: 0; transform: translateX(14px); } to { opacity: 1; transform: none; } }
.page-reports .rp-panel > .rp-panel-head,
.page-reports .rp-panel > .rp-panel-actions,
.page-reports .rp-panel > .rp-panel-tabs,
.page-reports .rp-panel > .rp-panel-body { background: #fff; border-left: 1px solid var(--rp-line); border-right: 1px solid var(--rp-line); padding-left: 17px; padding-right: 17px; }
.page-reports .rp-panel > .rp-panel-head { border-top: 1px solid var(--rp-line); border-radius: var(--rp-radius) var(--rp-radius) 0 0; padding-top: 13px; padding-bottom: 7px; display: flex; align-items: flex-start; gap: 13px; }
.page-reports .rp-panel > .rp-panel-body { border-bottom: 1px solid var(--rp-line); border-radius: 0 0 var(--rp-radius) var(--rp-radius); padding-bottom: 14px; }
.page-reports .rp-panel-logo .rp-logo { border-radius: 12px; }
.page-reports .rp-verified { color: #1F6FEB; flex: none; }
.page-reports .rp-panel-id { flex: 1 1 auto; min-width: 0; }
.page-reports .rp-panel-title { display: flex; align-items: center; gap: 9px; }
.page-reports .rp-panel-title h3 { margin: 0; font-size: 21px; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-panel-id p { margin: 3px 0 0; font-size: 12.5px; color: #68758B; }
.page-reports .rp-verified { color: #2F7DFE; }
.page-reports .rp-panel-x { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 1px solid #EEF2F8; border-radius: 8px; background: #fff; color: #33445F; cursor: pointer; }
.page-reports .rp-panel-x:hover { background: #F1F4FA; color: var(--rp-ink); }
.page-reports .rp-panel-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--rp-line); overflow-x: auto; scrollbar-width: none; }
.page-reports .rp-panel-tabs::-webkit-scrollbar { display: none; }
.page-reports .rp-ptab { flex: none; height: 38px; padding: 0 11px; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; background: none; font: inherit; font-size: 12.5px; font-weight: 500; color: #69758B; cursor: pointer; white-space: nowrap; }
.page-reports .rp-ptab:hover { color: var(--rp-ink); }
.page-reports .rp-ptab.is-on { color: #1F6FEB; border-bottom-color: #1F6FEB; font-weight: 600; }
.page-reports .rp-panel-body { padding-top: 12px; }
.page-reports .rp-panel-desc { margin: 0 0 13px; font-size: 13px; line-height: 1.5; color: var(--rp-muted); }
.page-reports .rp-panel-btns { display: flex; gap: 10px; margin-bottom: 15px; }
.page-reports .rp-kvgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.page-reports .rp-kv { display: grid; grid-template-columns: 16px minmax(0, 1fr); grid-template-areas: "icon label" "icon value"; align-items: center; gap: 0 7px; min-width: 0; }
.page-reports .rp-kv-icon { grid-area: icon; align-self: start; margin-top: 2px; width: 15px; height: 15px; color: #627599; }
.page-reports .rp-kv-label { grid-area: label; font-size: 11px; line-height: 1.3; color: var(--rp-muted); }
.page-reports .rp-kv-value { grid-area: value; margin-top: 2px; font-size: 13px; line-height: 1.35; font-weight: 600; color: var(--rp-ink); display: flex; align-items: center; gap: 5px; }
.page-reports .rp-methods, .page-reports .rp-flags { display: inline-flex; align-items: center; gap: 4px; }
.page-reports .rp-mark { display: inline-flex; align-items: center; justify-content: center; background: var(--mark); color: #fff; font-weight: 700; }
.page-reports .rp-mark-disc { width: 24px; height: 24px; border-radius: 50%; font-size: 13.5px; }
.page-reports .rp-mark-chip { height: 21px; padding: 0 7px; border-radius: 5px; font-size: 9.5px; letter-spacing: .01em; }
.page-reports .rp-legend-sm .rp-dot { width: 10px; height: 10px; border-radius: 3px; }
.page-reports .rp-method-more, .page-reports .rp-flag-more { display: inline-flex; align-items: center; height: 21px; padding: 0 7px; border-radius: 6px; background: #EEF2F8; font-size: 10.5px; font-weight: 600; color: #69758B; margin-left: 2px; }
.page-reports .rp-flag-more { background: #E2EEFE; color: #2F7DFE; border-radius: 50%; width: 22px; height: 22px; padding: 0; justify-content: center; font-size: 9.5px; }
.page-reports .rp-flag { width: 22px !important; height: 22px !important; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,31,61,.08); }
.page-reports .rp-panel-card { padding: 13px 15px 12px; margin-top: 13px; }
.page-reports .rp-combo { min-height: 132px; }
.page-reports .rp-combo svg { display: block; width: 100%; height: 100%; }

/* ---- Deals tab (design-reference-new/reports-deals-tab.png) ---- */
/* the deal tiles carry a solid icon chip instead of the pale one the Partners tiles use */
.page-reports .rp-stat-icon.tone-solid-green { background: linear-gradient(145deg, #34D27B, #18A558); color: #fff; }
.page-reports .rp-stat-icon.tone-solid-sky { background: linear-gradient(145deg, #62CBF4, #2AA7E0); color: #fff; }
.page-reports .rp-stat-icon.tone-solid-purple { background: linear-gradient(145deg, #A855F7, #7A22CE); color: #fff; }
.page-reports .rp-stat-icon.tone-solid-orange { background: linear-gradient(145deg, #FBA94C, #F5811F); color: #fff; }

.page-reports .rp-filtercard { padding: 8px 14px; margin-bottom: 13px; }
.page-reports .rp-stats-lg { margin-bottom: 13px; }
.page-reports .rp-stats-lg .rp-stat { padding: 21px 14px 20px; }
.page-reports .rp-filters-lg .rp-search, .page-reports .rp-filters-lg .rp-fsel, .page-reports .rp-filters-lg .rp-morefilters { height: 38px; }
.page-reports .rp-filters-lg .rp-search input { height: 36px; }
.page-reports .rp-filters-lg { padding: 0; gap: 15px; flex-wrap: nowrap; }
.page-reports .rp-filters-lg .rp-search { flex: 0 1 272px; max-width: 272px; }
.page-reports .rp-filters-lg .rp-fsel { flex: 0 0 auto; min-width: 147px; }
.page-reports .rp-morefilters { display: inline-flex; align-items: center; gap: 9px; height: 40px; padding: 0 20px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; font: inherit; font-size: 13px; font-weight: 500; color: #33445F; cursor: pointer; white-space: nowrap; }
.page-reports .rp-morefilters:hover { border-color: #CFDDF3; color: var(--rp-ink); }
.page-reports .rp-morefilters .icon { width: 16px; height: 16px; color: #667691; }
.page-reports .rp-reset { margin-left: auto; padding-left: 8px; font-size: 13px; font-weight: 500; color: #2F7DFE; white-space: nowrap; }
.page-reports .rp-morerow { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--rp-line); gap: 12px; }
.page-reports .rp-morefilters.is-on { border-color: #2F7DFE; color: #2F7DFE; }
.page-reports .rp-morefilters.is-on .icon { color: #2F7DFE; }
.page-reports .rp-reset:hover { text-decoration: underline; }

.page-reports .rp-listcard-strip { padding-top: 0; }
.page-reports .rp-listcard-strip .rp-table-rows thead th { height: 37px; }
.page-reports .rp-listcard-strip .rp-pager { padding: 28px 14px 28px; }
.page-reports .rp-strip { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; padding: 0 14px; border-bottom: 1px solid var(--rp-line); }
.page-reports .rp-dtabs { display: flex; align-items: stretch; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.page-reports .rp-dtabs::-webkit-scrollbar { display: none; }
.page-reports .rp-dtab { display: inline-flex; align-items: center; gap: 8px; height: 61px; padding: 0 18px; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: 13.5px; font-weight: 500; color: #46588A; white-space: nowrap; }
.page-reports .rp-dtab + .rp-dtab { border-left: 1px solid var(--rp-line-soft, #EEF2F8); }
.page-reports .rp-dtab:hover { color: var(--rp-ink); }
.page-reports .rp-dtab.is-on { color: #1F6FEB; border-bottom-color: #1F6FEB; font-weight: 700; }
.page-reports .rp-dtab em { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 21px; padding: 0 6px; border-radius: 6px; background: #EEF2F8; font-style: normal; font-size: 11.5px; font-weight: 600; color: #69758B; }
.page-reports .rp-dtab.is-on em { background: #EEF2F8; color: #69758B; }
/* the deals table sets its type a notch smaller than the partners one, as the reference does */
.page-reports .rp-listcard-strip .rp-table-rows tbody td { font-size: 12.5px; }
.page-reports .rp-listcard-strip .rp-namepill { height: 23px; padding: 0 8px; font-size: 11px; }
.page-reports .rp-listcard-strip .rp-typepill { height: 22px; padding: 0 7px; font-size: 11px; }
.page-reports .rp-listcard-strip .rp-spill { height: 22px; padding: 0 9px; font-size: 11px; }
.page-reports .rp-listcard-strip .rp-geostack .rp-flag { width: 19px !important; height: 19px !important; }
.page-reports .rp-listcard-strip .rp-geo-more { height: 20px; padding: 0 6px; font-size: 10.5px; }
.page-reports .rp-listcard-strip .rp-c-partner > span { margin-left: 8px; }
.page-reports .rp-strip .rp-listtools { padding-bottom: 8px; }
.page-reports .rp-btn-primary.rp-btn-tall { height: 40px; border-radius: 10px; font-size: 13.5px; }

.page-reports .rp-namepill { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 7px; background: #E8F1FE; font-size: 12px; font-weight: 600; color: #2563EB; }
.page-reports .rp-typepill.tone-purple { background: #EFE9FE; color: #7C3AED; }
.page-reports .rp-typepill.tone-amber { background: #FDF1DC; color: #B45309; }
.page-reports .rp-typepill.tone-teal { background: #D8F5F3; color: #0E8F8A; }
.page-reports .rp-c-comm { font-weight: 600; color: var(--rp-ink); }
.page-reports .rp-geostack { display: inline-flex; align-items: center; vertical-align: middle; }
.page-reports .rp-geostack .rp-flag { width: 22px !important; height: 22px !important; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1.5px #fff; }
.page-reports .rp-geostack .rp-flag + .rp-flag { margin-left: -6px; }
.page-reports .rp-geo-more { display: inline-flex; align-items: center; height: 22px; margin-left: 5px; padding: 0 7px; border-radius: 7px; background: #E6F0FE; font-size: 11px; font-weight: 600; color: #2563EB; }
.page-reports .rp-noresults { height: 120px; text-align: center; color: #667691; }

/* the deal panel: three-line head, a bordered term grid, contacts, then the trend card */
.page-reports .rp-panel-deal .rp-panel-head { align-items: flex-start; gap: 11px; padding: 6px 15px 2px; }
.page-reports .rp-panel-deal .rp-panel-logo .rp-logo { border-radius: 11px; }
.page-reports .rp-panel-deal .rp-panel-id { min-width: 0; flex: 1 1 auto; } .page-reports .rp-panel-deal .rp-panel-title { gap: 7px; }
.page-reports .rp-panel-deal .rp-panel-title h3 { font-size: 16.5px; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-panel-deal .rp-panel-title .rp-spill { flex: none; height: 21px; padding: 0 9px; font-size: 11px; }
.page-reports .rp-panel-deal .rp-panel-id p { margin: 0; font-size: 12.5px; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-panel-deal .rp-panel-partner { margin: 0; font-size: 13.5px; line-height: 1.3; }
.page-reports .rp-panel-deal .rp-panel-body { padding-top: 8px; }
.page-reports .rp-panel-partner { margin: 2px 0 0; font-size: 14.5px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-panel-acts { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.page-reports .rp-panel-acts .rp-panel-x { width: 26px; height: 26px; border-color: transparent; }
.page-reports .rp-btn-edit { height: 30px; padding: 0 9px; border-radius: 8px; font-size: 12px; font-weight: 600; gap: 5px; }
.page-reports .rp-btn-edit .icon { width: 14px; height: 14px; }
.page-reports .rp-panelmenu .btn-icon { width: 28px; height: 28px; border: 1px solid var(--rp-line); border-radius: 8px; background: #fff; color: #33445F; }
.page-reports .rp-panelmenu .btn-icon:hover { border-color: #CFDDF3; }
.page-reports .rp-termgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--rp-line); border-radius: 10px; overflow: hidden; margin-bottom: 13px; }
.page-reports .rp-term { display: flex; flex-direction: column; gap: 2px; padding: 6px 9px 7px; min-width: 0; border-right: 1px solid var(--rp-line); border-bottom: 1px solid var(--rp-line); }
.page-reports .rp-termgrid .rp-flag { width: 17px !important; height: 17px !important; }
.page-reports .rp-termgrid .rp-geostack .rp-flag + .rp-flag { margin-left: -5px; }
.page-reports .rp-termgrid .rp-geo-more { height: 18px; margin-left: 3px; padding: 0 4px; font-size: 10px; }
.page-reports .rp-term:nth-child(4n) { border-right: 0; }
.page-reports .rp-term:nth-last-child(-n+4) { border-bottom: 0; }
.page-reports .rp-term-l { font-size: 11px; line-height: 1.2; color: #667691; white-space: nowrap; }
.page-reports .rp-term-v { font-size: 13.5px; line-height: 1.35; font-weight: 700; color: var(--rp-ink); white-space: nowrap; }
.page-reports .rp-term-v.is-yes { color: #0E9C56; }
.page-reports .rp-sect { margin: 0 0 4px; font-size: 12.5px; font-weight: 500; color: #667691; }
.page-reports .rp-sect-top { margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--rp-line); font-size: 14px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-panel-deal .rp-panel-desc { margin: 0 0 2px; color: #33445F; }
.page-reports .rp-people { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.page-reports .rp-people .rp-person { display: flex; align-items: center; gap: 11px; grid-template-columns: none; }
.page-reports .rp-personava { width: 34px !important; height: 34px !important; border-radius: 50%; font-size: 12px !important; flex: none; }
.page-reports .rp-people .rp-person-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1 1 auto; }
.page-reports .rp-people .rp-person-t strong { font-size: 13.5px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-people .rp-person-t em { font-style: normal; font-size: 12.5px; color: #68758B; }
.page-reports .rp-tg { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border: 1px solid var(--rp-line); border-radius: 9px; background: #fff; font-size: 13px; font-weight: 600; color: #2F7DFE; }
.page-reports .rp-tg:hover { border-color: #CFDDF3; }
.page-reports .rp-trendsel { height: 32px; min-width: 132px; padding: 0 28px 0 11px; justify-content: center; }
.page-reports .rp-trendsel select { font-size: 12.5px; font-weight: 500; }
.page-reports .rp-vbars { min-height: 90px; }
.page-reports .rp-panel-card .rp-card-head { margin-bottom: 6px; }
.page-reports .rp-panel-deal .rp-panel-body { padding-bottom: 10px; }
.page-reports .rp-vbars svg { display: block; width: 100%; height: 100%; }

/* ---- Tracking tab (design-reference-new/reports-tracking-tab.png) ---- */
.page-reports .rp-stat-icon.tone-solid-blue { background: linear-gradient(145deg, #3F7BFF, #1F5BE0); color: #fff; }
/* the tracking tiles carry no sub-line: the sparkline takes the width under the value */
.page-reports .rp-stats-trk .rp-stat { padding: 17px 14px 15px; }
.page-reports .rp-stats-trk .rp-stat-sub { display: none; }


.page-reports .rp-trkgrid { display: grid; grid-template-columns: minmax(0, 1fr) 500px; gap: 16px; margin-bottom: 15px; align-items: start; }
.page-reports .rp-trkchart { padding: 13px 15px 9px; }
.page-reports .rp-toplinks { padding: 13px 15px 11px; }
.page-reports .rp-track { position: relative; height: 133px; }
.page-reports .rp-track svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-tracktip { position: absolute; transform: translate(-50%, -100%); min-width: 132px; padding: 8px 11px 9px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; box-shadow: 0 8px 22px rgba(15, 31, 61, .12); pointer-events: none; }
.page-reports .rp-tracktip b { display: block; font-size: 12px; font-weight: 700; color: var(--rp-ink); margin-bottom: 4px; }
.page-reports .rp-tracktip span { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #46588A; line-height: 1.5; }
.page-reports .rp-tracktip em { font-style: normal; font-weight: 700; color: var(--rp-ink); }

.page-reports .rp-seg { display: inline-flex; padding: 3px; border-radius: 9px; background: #F1F4FA; }
.page-reports .rp-segbtn { display: inline-flex; align-items: center; height: 27px; padding: 0 13px; border-radius: 7px; font-size: 12.5px; font-weight: 500; color: #46588A; }
.page-reports .rp-segbtn.is-on { background: #2F7DFE; color: #fff; font-weight: 600; }
.page-reports .rp-viewall { font-size: 12.5px; font-weight: 500; color: #2F7DFE; }
.page-reports .rp-viewall:hover { text-decoration: underline; }

.page-reports .rp-tlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.page-reports .rp-tlist .rp-titem { display: grid; grid-template-columns: 16px 26px minmax(0, 1fr) 218px 36px; align-items: center; gap: 10px; height: 26px; }
.page-reports .rp-trank { font-size: 12px; font-weight: 600; color: #667691; text-align: center; }
.page-reports .rp-ttext { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.page-reports .rp-ttext strong { font-size: 12.5px; line-height: 1.15; font-weight: 700; color: var(--rp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-ttext em { font-style: normal; font-size: 11px; line-height: 1.15; color: #667691; white-space: nowrap; }
.page-reports .rp-tbar { height: 9px; border-radius: 5px; background: #E9EFF7; overflow: hidden; }
.page-reports .rp-tbar i { display: block; height: 100%; border-radius: 5px; background: #22C55E; }
.page-reports .rp-tpct { font-size: 12px; font-weight: 600; color: #33445F; text-align: right; }

.page-reports .rp-filters-trk { padding: 0; gap: 12px; flex-wrap: nowrap; }
.page-reports .rp-filtercard-trk { padding: 7px 14px; margin-bottom: 14px; }
.page-reports .rp-filters-trk .rp-search { flex: 1 1 auto; max-width: none; }
.page-reports .rp-filters-trk .rp-fsel { flex: 0 0 auto; min-width: 136px; }
.page-reports .rp-listcard-trk { padding-top: 0; }
.page-reports .rp-listcard-trk .rp-table-rows thead th { height: 30px; }
.page-reports .rp-listcard-trk .rp-table-rows tbody td { height: 36px; font-size: 12.5px; }
.page-reports .rp-listcard-trk .rp-trow { height: 36px; }
.page-reports .rp-listcard-trk .rp-spill { height: 20px; padding: 0 8px; font-size: 10.5px; }
.page-reports .rp-listcard-trk .rp-logo { border-radius: 6px; }
.page-reports .rp-listcard-trk .rp-pager { padding: 22px 14px 20px; }
.page-reports .rp-viewseg { display: inline-flex; margin-left: auto; padding: 3px; border-radius: 9px; background: #F1F4FA; }
.page-reports .rp-viewsegbtn { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border-radius: 7px; font-size: 12.5px; font-weight: 500; color: #46588A; white-space: nowrap; }
.page-reports .rp-viewsegbtn.is-on { background: #2F7DFE; color: #fff; font-weight: 600; }
.page-reports .rp-c-url a { color: #2F7DFE; }
.page-reports .rp-c-url a:hover { text-decoration: underline; }

/* the tracking panel: a copyable URL row, a plain two-column grid, then the full-details button */
.page-reports .rp-panel-link .rp-panel-head { align-items: flex-start; gap: 10px; padding: 10px 13px 6px; }
.page-reports .rp-panel-link .rp-panel-acts { gap: 5px; }
.page-reports .rp-panel-link .rp-panel-acts .rp-btn-edit { height: 28px; padding: 0 7px; font-size: 11.5px; gap: 4px; }
.page-reports .rp-panel-link .rp-panelmenu .btn-icon { width: 26px; height: 26px; }
.page-reports .rp-panel-link .rp-panel-x { width: 24px; height: 24px; }
.page-reports .rp-panel-link .rp-panel-title .rp-spill { padding: 0 7px; }
.page-reports .rp-panel-link .rp-panel-body { padding-left: 13px; padding-right: 13px; }
.page-reports .rp-panel-link .rp-panel-id { min-width: 0; flex: 1 1 auto; }
.page-reports .rp-panel-link .rp-panel-title h3 { font-size: 14px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-panel-link .rp-panel-title .rp-spill { flex: none; height: 21px; padding: 0 9px; font-size: 11px; }
.page-reports .rp-panel-link .rp-panel-id p { margin: 2px 0 0; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-urlrow { display: flex; align-items: center; gap: 9px; margin-bottom: 13px; }
.page-reports .rp-urlbox { position: relative; display: flex; align-items: center; flex: 1 1 auto; min-width: 0; height: 36px; padding: 0 58px 0 11px; border: 1px solid var(--rp-line); border-radius: 9px; background: #fff; }
.page-reports .rp-urlbox input { width: 100%; min-width: 0; border: 0; background: none; outline: none; font: inherit; font-size: 12.5px; color: #33445F; text-overflow: ellipsis; }
.page-reports .rp-urlcaret { position: absolute; right: 32px; display: inline-flex; color: #667691; pointer-events: none; }
.page-reports .rp-urlcopy { position: absolute; right: 4px; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 0; border-radius: 7px; background: none; color: #2F7DFE; cursor: pointer; }
.page-reports .rp-urlcopy:hover { background: #EEF4FE; }
.page-reports .rp-openbtn { flex: none; display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 14px; border-radius: 9px; background: #EAF2FE; font-size: 12.5px; font-weight: 600; color: #2F7DFE; }
.page-reports .rp-openbtn:hover { background: #DDEAFD; }
.page-reports .rp-kvgrid-link { gap: 6px 16px; margin-bottom: 12px; }
.page-reports .rp-kv2 { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.page-reports .rp-kv2-l { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: #667691; }
.page-reports .rp-kv2-i { width: 12px; height: 12px; }
.page-reports .rp-kv2-v { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--rp-ink); min-width: 0; }
.page-reports .rp-kv2-v > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.page-reports .rp-tag { display: inline-flex; align-items: center; height: 21px; padding: 0 8px; border-radius: 6px; background: #EEF2F8; font-size: 11px; font-weight: 600; color: #46588A; }
.page-reports .rp-tag + .rp-tag { margin-left: 5px; }
.page-reports .rp-fulldetails { display: flex; align-items: center; justify-content: center; gap: 9px; height: 42px; border-radius: 10px; background: #EEF4FE; font-size: 13px; font-weight: 600; color: #2F7DFE; }
.page-reports .rp-fulldetails:hover { background: #E1EBFD; }
.page-reports .rp-fulldetails .icon:last-child { margin-left: 2px; }

/* ---- Payments tab (design-reference-new/reports-payments-tab.png) ---- */
.page-reports .rp-stats-pay { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 14px; }
.page-reports .rp-stats-pay .rp-stat { padding: 15px 14px 13px; }


.page-reports .rp-paygrid { display: grid; grid-template-columns: minmax(0, 1fr) 313px; gap: 15px; align-items: start; }
.page-reports .rp-paymain { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.page-reports .rp-paytop { display: grid; grid-template-columns: minmax(0, 1fr) 345px; gap: 15px; align-items: start; }
.page-reports .rp-payside { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.page-reports .rp-paybars, .page-reports .rp-paydonut { padding: 13px 15px 10px; }
.page-reports .rp-headtools { display: inline-flex; align-items: center; gap: 12px; }
.page-reports .rp-paybar { height: 165px; }
.page-reports .rp-paybar svg { display: block; width: 100%; height: 100%; }

.page-reports .rp-donutrow { display: grid; grid-template-columns: 175px minmax(0, 1fr); gap: 6px; align-items: center; }
.page-reports .rp-paydonut .rp-donut { position: relative; width: 175px; height: 175px; }
.page-reports .rp-paydonut .rp-donut-svg { max-width: 175px; }
.page-reports .rp-paydonut .rp-donut-mid strong { font-size: 21px; }
.page-reports .rp-paydonut .rp-donut svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-donutlegend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.page-reports .rp-donutlegend li { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto; align-items: center; gap: 8px; font-size: 12.5px; color: #33445F; }
.page-reports .rp-ldot { width: 9px; height: 9px; border-radius: 50%; background: var(--c); }
.page-reports .rp-donutlegend em { font-style: normal; font-weight: 600; color: var(--rp-ink); }

.page-reports .rp-methodcard, .page-reports .rp-recentcard, .page-reports .rp-insightcard { padding: 13px 15px 12px; }
.page-reports .rp-mlist, .page-reports .rp-rlist, .page-reports .rp-ilist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.page-reports .rp-mlist { gap: 5px; }
.page-reports .rp-mlist .rp-mitem { display: grid; grid-template-columns: 24px minmax(0, 1fr) 106px 40px; align-items: center; gap: 9px; height: 26px; }
.page-reports .rp-mdisc { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: var(--mark); color: #fff; font-size: 13px; font-weight: 700; }
.page-reports .rp-mdisc .icon { width: 14px; height: 14px; }
.page-reports .rp-mname { font-size: 12.5px; color: #33445F; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-mbar { height: 8px; border-radius: 4px; background: #EDF1F8; overflow: hidden; }
.page-reports .rp-mbar i { display: block; height: 100%; border-radius: 4px; background: var(--c); }
.page-reports .rp-mpct { font-size: 12px; font-weight: 600; color: #33445F; text-align: right; }

.page-reports .rp-rlist { gap: 5px; }
.page-reports .rp-rlist .rp-ritem { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; height: 34px; }
.page-reports .rp-rtext { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.page-reports .rp-rtext strong { font-size: 12.5px; font-weight: 700; color: var(--rp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-rtext em { font-style: normal; font-size: 11.5px; color: #667691; white-space: nowrap; }
.page-reports .rp-ramt { font-size: 13px; font-weight: 700; color: var(--rp-ink); white-space: nowrap; }

.page-reports .rp-ilist { gap: 12px; }
.page-reports .rp-ilist .rp-iitem { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: start; gap: 11px; }
.page-reports .rp-ilist .rp-stat-icon { width: 38px; height: 38px; border-radius: 11px; align-self: flex-start; margin-top: 2px; }
.page-reports .rp-ilist .rp-stat-icon .icon { width: 19px; height: 19px; }
.page-reports .rp-itext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.page-reports .rp-iline { display: flex; align-items: baseline; gap: 9px; min-width: 0; flex-wrap: wrap; }
.page-reports .rp-itext em { font-style: normal; font-size: 11.5px; line-height: 1.2; color: #667691; }
.page-reports .rp-itext strong { font-size: 15.5px; line-height: 1.25; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-inote { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; line-height: 1.2; color: #667691; }
.page-reports .rp-iarrow { width: 12px; height: 12px; color: #0E9C56; }
.page-reports .rp-icheck { color: #0E9C56; }
.page-reports .rp-filters-pay { padding: 13px 14px 12px; gap: 11px; flex-wrap: nowrap; }
.page-reports .rp-filters-pay .rp-search { flex: 1 1 auto; max-width: none; }
.page-reports .rp-filters-pay .rp-fsel { flex: 0 0 auto; min-width: 132px; }
.page-reports .rp-listcard-pay { padding-top: 0; }
.page-reports .rp-listcard-pay .rp-table-rows thead th { height: 31px; }
.page-reports .rp-listcard-pay .rp-table-rows tbody td { height: 36px; font-size: 12.5px; }
.page-reports .rp-listcard-pay .rp-trow { height: 36px; }
.page-reports .rp-listcard-pay .rp-spill { height: 20px; padding: 0 8px; font-size: 10.5px; }
.page-reports .rp-listcard-pay .rp-pager { padding: 20px 14px 18px; }
.page-reports .rp-c-ref { color: var(--rp-muted); }

/* ---- Trends tab (design-reference-new/reports-trends-tab.png) ---- */
/* the brief drops the mini trend graphs from the tiles and the three list cards */
.page-reports .rp-stats-trend { margin-bottom: 11px; }
.page-reports .rp-stats-trend .rp-stat { padding: 14px 14px 12px; }
.page-reports .rp-stat-icon.tone-solid-purple { background: linear-gradient(145deg, #A855F7, #7A22CE); color: #fff; }

.page-reports .rp-trendtop { display: grid; grid-template-columns: minmax(0, 1fr) 473px; gap: 11px; align-items: start; margin-bottom: 11px; }
.page-reports .rp-trendmid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; align-items: start; margin-bottom: 11px; }
.page-reports .rp-trendbot { display: grid; grid-template-columns: minmax(0, 1fr) 387px; gap: 11px; align-items: start; }
.page-reports .rp-perfcard, .page-reports .rp-dealcard { padding: 13px 15px 10px; }
.page-reports .rp-perf { position: relative; height: 171px; }
.page-reports .rp-perf svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-perftip b { margin-bottom: 5px; }
.page-reports .rp-stack { height: 147px; }
.page-reports .rp-stack svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-stacklegend { justify-content: center; gap: 18px; margin-top: 6px; }
.page-reports .rp-dot.is-amber { background: #F59E0B; }
.page-reports .rp-dot.is-purple { background: #8B5CF6; }
.page-reports .rp-seg-4 .rp-segbtn { padding: 0 12px; }

.page-reports .rp-growthcard, .page-reports .rp-ptrendcard, .page-reports .rp-geotrendcard { padding: 13px 15px 12px; }
.page-reports .rp-headicon { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-right: 8px; border-radius: 7px; vertical-align: -6px; }
.page-reports .rp-headicon.tone-green { background: #D8F6E5; color: #17A25C; }
.page-reports .rp-headicon.tone-amber { background: #FDF1DC; color: #C2740A; }
.page-reports .rp-glist, .page-reports .rp-plist, .page-reports .rp-clist, .page-reports .rp-klist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.page-reports .rp-glist { gap: 0; }
.page-reports .rp-glist .rp-gitem { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 10px; height: 31px; }
.page-reports .rp-glist .rp-stat-icon { width: 28px; height: 28px; border-radius: 9px; }
.page-reports .rp-glist .rp-stat-icon .icon { width: 15px; height: 15px; }
.page-reports .rp-gname { font-size: 12.5px; color: #33445F; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-plist { gap: 0; }
.page-reports .rp-plist .rp-pitem { display: grid; grid-template-columns: 14px 28px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; height: 31px; }
.page-reports .rp-pname { font-size: 12.5px; font-weight: 600; color: var(--rp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-pval { font-size: 12.5px; font-weight: 700; color: var(--rp-ink); white-space: nowrap; }
.page-reports .rp-clist { gap: 0; }
.page-reports .rp-clist .rp-citem { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; height: 31px; }
.page-reports .rp-clist .rp-flag { width: 20px !important; height: 20px !important; border-radius: 50%; object-fit: cover; }
.page-reports .rp-cname { font-size: 12.5px; color: #33445F; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-cval { font-size: 12.5px; font-weight: 700; color: var(--rp-ink); white-space: nowrap; }

.page-reports .rp-breakcard { padding: 13px 0 6px; }
.page-reports .rp-breakcard .rp-card-head { padding: 0 15px; }
.page-reports .rp-breaktable thead th { height: 34px; font-size: 12px; }
.page-reports .rp-breaktable tbody td { height: 34px; font-size: 12.5px; }
.page-reports .rp-breaktable .rp-trow { height: 34px; }
.page-reports .rp-breaktable tbody tr:last-child td { border-bottom: 0; }
.page-reports .rp-breaktable .rp-trow.is-static { cursor: default; }
.page-reports .rp-breaktable .rp-trow.is-static:hover { background: none; }
.page-reports .rp-breaktable .rp-c-month { font-weight: 600; color: #2F7DFE; }
.page-reports .rp-chip { display: inline-flex; align-items: center; gap: 3px; height: 21px; padding: 0 7px; border-radius: 6px; font-size: 11px; font-weight: 600; }
.page-reports .rp-chip.is-up { background: #DEFCEF; color: #05884A; }
.page-reports .rp-chip.is-down { background: #FEE4E4; color: #D0161D; }
.page-reports .rp-chip .icon { width: 11px; height: 11px; }

.page-reports .rp-keycard { padding: 13px 15px 12px; }
.page-reports .rp-klist { gap: 3px; }
.page-reports .rp-klist .rp-kitem { display: grid; grid-template-columns: 34px minmax(0, 1fr) 18px; align-items: center; gap: 11px; }
.page-reports .rp-klist .rp-stat-icon { width: 32px; height: 32px; border-radius: 10px; }
.page-reports .rp-ktext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.page-reports .rp-ktext strong { font-size: 13px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-ktext em { font-style: normal; font-size: 12px; color: #69758B; }
.page-reports .rp-kchev { color: #607698; }

/* ---- Custom Reports tab (design-reference-new/reports-custom-reports-tab.png) ---- */
.page-reports .rp-builder3 { display: grid; grid-template-columns: minmax(0, 1fr) 341px 284px; gap: 10px; align-items: start; margin-bottom: 12px; }
.page-reports .rp-stepcard { padding: 14px 11px 14px; }
.page-reports .rp-stephead { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 13px; padding: 0 5px; }
.page-reports .rp-stepno { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: #1F6FEB; color: #fff; font-size: 12px; font-weight: 700; }
.page-reports .rp-steptext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.page-reports .rp-steptext strong { font-size: 15px; font-weight: 800; letter-spacing: -.01em; color: var(--rp-ink); }
.page-reports .rp-steptext em { font-style: normal; font-size: 12.5px; color: #68758B; }

.page-reports .rp-mgrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.page-reports .rp-mtile { position: relative; display: grid; grid-template-columns: 28px minmax(0, 1fr) 15px; align-items: center; gap: 6px; padding: 7px; border: 1px solid var(--rp-line); border-radius: 11px; background: #fff; cursor: pointer; }
.page-reports .rp-mtile.is-on { border-color: #BCD5FB; background: #F6FAFF; }
.page-reports .rp-mtile .rp-stat-icon { width: 28px; height: 28px; border-radius: 8px; }
.page-reports .rp-mtile .rp-stat-icon .icon { width: 15px; height: 15px; }
.page-reports .rp-mtile-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.page-reports .rp-mtile-t strong { font-size: 10.5px; font-weight: 700; letter-spacing: -.01em; color: var(--rp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-mtile-t em { font-style: normal; font-size: 9px; color: #667691; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-mtile input { position: absolute; opacity: 0; pointer-events: none; }
.page-reports .rp-mbox { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; border: 1.5px solid #CBD6E6; border-radius: 4px; background: #fff; color: transparent; }
.page-reports .rp-mtile.is-on .rp-mbox { border-color: #1F6FEB; background: #1F6FEB; color: #fff; }
.page-reports .rp-stat-icon.tone-slate { background: #EDF1F8; color: #64748B; }

.page-reports .rp-fgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.page-reports .rp-fgrid .rp-fsel { min-width: 0; }
.page-reports .rp-seg-range { display: flex; width: 100%; margin-bottom: 11px; }
.page-reports .rp-seg-range .rp-segbtn { flex: 1 1 0; justify-content: center; padding: 0 6px; font-size: 12px; }
.page-reports .rp-daterow { display: flex; align-items: center; gap: 9px; height: 40px; padding: 0 12px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; font-size: 12.5px; color: #33445F; margin-bottom: 11px; }
.page-reports .rp-daterow .icon { color: #667691; }
.page-reports .rp-switchrow { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; margin-bottom: 13px; cursor: pointer; }
.page-reports .rp-switchrow input { position: absolute; opacity: 0; pointer-events: none; }
.page-reports .rp-switch { position: relative; width: 38px; height: 21px; border-radius: 11px; background: #CBD6E6; transition: background var(--t-fast); }
.page-reports .rp-switch::after { content: ""; position: absolute; top: 2px; left: 2px; width: 17px; height: 17px; border-radius: 50%; background: #fff; transition: transform var(--t-fast); }
.page-reports .rp-switchrow input:checked + .rp-switch { background: #1F6FEB; }
.page-reports .rp-switchrow input:checked + .rp-switch::after { transform: translateX(17px); }
.page-reports .rp-switch-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.page-reports .rp-switch-t strong { font-size: 12.5px; font-weight: 500; color: #33445F; }
.page-reports .rp-switch-t em { font-style: normal; font-size: 11.5px; color: #667691; }
.page-reports .rp-generate { display: flex; align-items: center; justify-content: center; gap: 8px; height: 42px; border-radius: 10px; background: #1F6FEB; color: #fff; font-size: 13.5px; font-weight: 600; }
.page-reports .rp-generate:hover { background: #1A62D4; }

.page-reports .rp-resultgrid { display: grid; grid-template-columns: minmax(0, 1fr) 284px; gap: 12px; align-items: start; }
.page-reports .rp-resultcard { padding: 14px 16px 10px; }
.page-reports .rp-resulthead { align-items: flex-start; }
.page-reports .rp-resulttitle { display: flex; flex-direction: column; gap: 2px; }
.page-reports .rp-resulttitle h2 { margin: 0; font-size: 17px; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-resulttitle em { font-style: normal; font-size: 12px; color: #667691; }
.page-reports .rp-exportbtn { height: 36px; padding: 0 13px; border-radius: 9px; font-size: 13px; font-weight: 600; gap: 7px; }
.page-reports .rp-rtiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.page-reports .rp-rtile { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--rp-line); border-radius: 11px; background: #fff; }
.page-reports .rp-rtile .rp-stat-icon { width: 38px; height: 38px; border-radius: 11px; }
.page-reports .rp-rtile-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.page-reports .rp-rtile-t em { font-style: normal; font-size: 11.5px; color: #68758B; white-space: nowrap; }
.page-reports .rp-rtile-line { display: flex; align-items: baseline; gap: 8px; }
.page-reports .rp-rtile-line strong { font-size: 18px; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-rtile-sub { font-size: 11px; color: #667691; }
.page-reports .rp-customtable .rp-c-date { color: #2F7DFE; font-weight: 500; }
.page-reports .rp-exportwrap { position: relative; }
.page-reports .rp-exportcaret { margin-left: 2px; }
.page-reports .rp-cmplegend { justify-content: center; gap: 20px; margin-bottom: 4px; }
.page-reports .rp-dot.is-dash { background: none; box-shadow: inset 0 0 0 2px currentColor; }
.page-reports .rp-dot.is-blue.is-dash { color: #1F79FE; }
.page-reports .rp-dot.is-green.is-dash { color: #10B981; }
.page-reports .rp-cmpchart { position: relative; height: 196px; }
.page-reports .rp-cmpchart svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-cmptip span { justify-content: space-between; gap: 14px; }
.page-reports .rp-cmptip em { margin-left: auto; }
.page-reports .rp-rtabs { display: flex; align-items: stretch; gap: 4px; border-bottom: 1px solid var(--rp-line); margin: 8px -16px 0; padding: 0 16px; }
.page-reports .rp-rtab { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 12px; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: 13px; font-weight: 500; color: #69758B; }
.page-reports .rp-rtab.is-on { color: #1F6FEB; border-bottom-color: #1F6FEB; font-weight: 600; }
.page-reports .rp-customtable { margin: 0 -16px; width: calc(100% + 32px); }
.page-reports .rp-customtable thead th { height: 34px; }
.page-reports .rp-customtable tbody td { height: 34px; font-size: 12.5px; }
.page-reports .rp-customtable .rp-trow { height: 34px; cursor: default; }
.page-reports .rp-customtable .rp-trow:hover { background: none; }
.page-reports .rp-summary { list-style: none; margin: 10px 0 8px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.page-reports .rp-summary li { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; color: #46588A; }
.page-reports .rp-summary strong { font-weight: 700; color: var(--rp-ink); }

.page-reports .rp-resultside { display: flex; flex-direction: column; gap: 13px; min-width: 0; }
.page-reports .rp-savedcard, .page-reports .rp-templatecard { padding: 13px 14px 12px; }
.page-reports .rp-slist, .page-reports .rp-tmplist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.page-reports .rp-sitem { display: grid; grid-template-columns: 34px minmax(0, 1fr) 24px; align-items: center; gap: 10px; }
.page-reports .rp-sitem .rp-stat-icon { width: 34px; height: 34px; border-radius: 10px; }
.page-reports .rp-stext { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.page-reports .rp-stext strong { font-size: 12.5px; font-weight: 700; color: var(--rp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-stext em { font-style: normal; font-size: 11px; color: #68758B; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-slast { font-size: 10.5px; color: #627599; }
.page-reports .rp-tsub { margin: -4px 0 10px; font-size: 12px; color: #667691; }
.page-reports .rp-tmpitem { display: grid; grid-template-columns: 34px minmax(0, 1fr) 16px; align-items: center; gap: 10px; }
.page-reports .rp-tmpitem .rp-stat-icon { width: 34px; height: 34px; border-radius: 10px; }
.page-reports .rp-tmptext { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.page-reports .rp-tmptext strong { font-size: 12.5px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-tmptext em { font-style: normal; font-size: 11.5px; color: #68758B; }

/* ==== Reports Overview v2 (design-reference-new/reports-overview-v2.png) ==================== */
.page-reports.is-ov .eyebrow { font-size: 11px; font-weight: 800; letter-spacing: .1em; color: #2563EB; margin-bottom: 2px; }
.page-reports.is-ov .page-icon { width: 52px; height: 52px; border-radius: 15px; background: #E3EBFD; color: #2563EB; }
.page-reports.is-ov .page-title { font-size: 26px; font-weight: 800; letter-spacing: -.025em; }
.page-reports.is-ov .page-subtitle { margin-top: 3px; font-size: 13.5px; color: #55688C; }
.page-reports .rp-btn-export { display: inline-flex; align-items: center; gap: 9px; height: 40px; padding: 0 16px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; font-size: 13.5px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-btn-export:hover { border-color: #CFDDF3; }
.page-reports .rp-btn-export .icon { width: 17px; height: 17px; }

/* the tab strip shares its row with the insights banner */
.page-reports .rp-tabwrap { position: relative; margin-bottom: 13px; }
.page-reports .rp-tabwrap .rp-tabs { margin-bottom: 0; padding-right: 342px; }
.page-reports .rp-insightbar { position: absolute; right: 0; bottom: 5px; display: flex; align-items: center; gap: 13px; width: 326px; padding: 13px 14px; border-radius: 12px; background: #E8F1FE; color: var(--rp-ink); }
.page-reports .rp-insightbar:hover { background: #DFEBFE; }
.page-reports .rp-insightbar-ic { flex: none; display: inline-flex; color: #2563EB; }
.page-reports .rp-insightbar-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1 1 auto; }
.page-reports .rp-insightbar-t strong { font-size: 13.5px; font-weight: 700; letter-spacing: -.01em; }
.page-reports .rp-insightbar-t em { font-style: normal; font-size: 12px; color: #55688C; }
.page-reports .rp-insightbar-go { flex: none; color: #55688C; }

/* ---- the five tiles ---- */
.page-reports .rp-ovtiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 11px; margin-bottom: 10px; }
.page-reports .rp-ovtile { display: flex; align-items: flex-start; gap: 11px; padding: 11px 13px 10px; border: 1px solid var(--rp-line); border-radius: 14px; background: #fff; }
.page-reports .rp-ovtile-ic { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 13px; color: #fff; }
.page-reports .rp-ovtile-ic.tone-green { background: linear-gradient(145deg, #2ED08A, #12A45F); }
.page-reports .rp-ovtile-ic.tone-blue { background: linear-gradient(145deg, #4C8DFF, #1F5FE0); }
.page-reports .rp-ovtile-ic.tone-purple { background: linear-gradient(145deg, #A970F7, #7A3BE0); }
.page-reports .rp-ovtile-ic.tone-orange { background: linear-gradient(145deg, #FBA94C, #F0821C); }
.page-reports .rp-ovtile-ic.tone-indigo { background: linear-gradient(145deg, #4A86FF, #2455D8); color: #fff; }
.page-reports .rp-ovtile-body { min-width: 0; flex: 1 1 auto; }
.page-reports .rp-ovtile-label { font-size: 13px; font-weight: 600; color: var(--rp-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-ovtile-line { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 2px; }
.page-reports .rp-ovtile-value { font-size: 24px; line-height: 1.2; font-weight: 800; letter-spacing: -.03em; color: var(--rp-ink); }
.page-reports .rp-ovtile-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: 1px; min-width: 0; }
.page-reports .rp-ovtile-sub { font-size: 11.5px; color: var(--rp-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-reports .rp-ovspark { flex: none; width: 52px; height: 24px; }
.page-reports .rp-ovspark svg { display: block; width: 100%; height: 100%; }

/* ---- the two card rows ---- */
.page-reports .rp-ovrow { display: grid; gap: 11px; align-items: stretch; margin-bottom: 11px; }
.page-reports .rp-ovrow-a { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.page-reports .rp-ovrow-b { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.page-reports .rp-ovrow-c { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
/* the Geography map inside the Reports overview */
.page-reports .rp-geomap { margin-top: 10px; --geo-b0: #045C41; --geo-b1: #06B779; --geo-b2: #87D6B7; --geo-b3: #B8E6D3; --geo-b4: #DCE5F0; }
.page-reports .rp-geomap .geo-map-svg { aspect-ratio: 2.2; }
.page-reports .rp-geomap .geo-legend { justify-content: center; gap: 18px; padding-top: 10px; }
.page-reports .rp-ovmix .rp-mixbody { flex: 1; grid-template-columns: 200px minmax(0, 1fr); gap: 16px; }
.page-reports .rp-ovmix .rp-ovdonut { width: 200px; height: 200px; }
.page-reports .rp-ovmix .rp-ovdonut .rp-donut-svg { max-width: 200px; }
.page-reports .rp-ovmix { display: flex; flex-direction: column; }
.page-reports .rp-ovrow-c .rp-mchart { height: 210px; }
.page-reports .rp-ovchart { height: 230px; }
.page-reports .rp-ovrow .rp-card { padding: 13px 15px 11px; border-radius: 14px; }
.page-reports .rp-ovhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.page-reports .rp-ovtitle h2 { margin: 0; font-size: 16.5px; line-height: 1.25; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-ovtitle p { margin: 2px 0 0; font-size: 12.5px; color: var(--rp-muted); }
.page-reports .rp-ovsel { position: relative; display: inline-flex; align-items: center; flex: none; height: 36px; min-width: 112px; padding: 0 34px 0 14px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; }
.page-reports .rp-ovsel select { appearance: none; border: 0; background: none; outline: none; font: inherit; font-size: 13.5px; font-weight: 500; color: var(--rp-ink); width: 100%; cursor: pointer; }
.page-reports .rp-ovsel-caret { position: absolute; right: 11px; color: #55688C; pointer-events: none; }

/* Performance Overview */
.page-reports .rp-ovmetrics { display: flex; gap: 9px; margin: 11px 0 4px; }
.page-reports .rp-ovmetric { height: 32px; padding: 0 15px; border: 0; border-radius: 9px; background: #EEF3FA; font: inherit; font-size: 13px; font-weight: 600; color: #3B4D72; cursor: pointer; }
.page-reports .rp-ovmetric:hover { background: #E5ECF7; }
.page-reports .rp-ovmetric.is-on { background: #2563EB; color: #fff; }
.page-reports .rp-ovchart { position: relative; }
.page-reports .rp-ovchart svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-ovlegend { display: flex; align-items: center; justify-content: center; gap: 24px; margin-top: 4px; }
.page-reports .rp-ovleg { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #3B4D72; cursor: pointer; }
.page-reports .rp-ovleg i { width: 11px; height: 11px; border-radius: 50%; background: var(--c); }
.page-reports .rp-ovleg.is-off { opacity: .4; }

/* Conversion Funnel */
.page-reports .rp-ovfunnel, .page-reports .rp-ovperf, .page-reports .rp-ovmap { display: flex; flex-direction: column; }
.page-reports .rp-fbody { display: grid; grid-template-columns: 146px minmax(0, 1fr); gap: 13px; align-items: start; margin-top: 10px; }
.page-reports .rp-fchart { height: 218px; }
.page-reports .rp-fchart svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-fband { transition: opacity var(--t-fast); }
.page-reports .rp-fband-v { fill: #fff; font-size: 15.5px; font-weight: 800; letter-spacing: -.02em; }
.page-reports .rp-fband-p { fill: rgba(255,255,255,.88); font-size: 12.5px; font-weight: 600; }
.page-reports .rp-fsteps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; justify-content: space-between; height: 218px; }
.page-reports .rp-fsteps li { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 11px; }
.page-reports .rp-fic { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 11px; color: #fff; }
.page-reports .rp-fic.tone-blue { background: #2563EB; color: #fff; }
.page-reports .rp-fic.tone-purple { background: #8B5CF6; color: #fff; }
.page-reports .rp-fic.tone-pink { background: #EC4899; color: #fff; }
.page-reports .rp-fic.tone-green { background: #12A45F; color: #fff; }
.page-reports .rp-ftext { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.page-reports .rp-ftext strong { font-size: 13px; font-weight: 700; line-height: 1.25; color: var(--rp-ink); }
.page-reports .rp-ftext em { font-style: normal; font-size: 12px; line-height: 1.3; color: var(--rp-muted); }
.page-reports .rp-fnote { display: flex; align-items: center; gap: 11px; margin-top: auto; padding: 9px 12px; border-radius: 11px; background: #EEF4FE; }
.page-reports .rp-fnote-ic { flex: none; display: inline-flex; color: #12A45F; }
.page-reports .rp-fnote-t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.page-reports .rp-fnote-t strong { font-size: 13.5px; font-weight: 600; color: var(--rp-ink); }
.page-reports .rp-fnote-t strong b { font-weight: 800; color: #2563EB; }
.page-reports .rp-fnote-t em { font-style: normal; font-size: 12.5px; color: var(--rp-muted); }

/* Revenue by Country */
.page-reports .rp-worldwrap { position: relative; margin-top: 8px; }
.page-reports .rp-world { position: relative; height: 232px; }
.page-reports .rp-world-svg { display: block; width: 100%; height: 100%; }
.page-reports .rp-world-svg.is-dragging { cursor: grabbing; }
.page-reports .rp-country { stroke: #fff; stroke-width: .5; transition: opacity var(--t-fast); }
.page-reports .rp-country.has-data { cursor: pointer; }
.page-reports .rp-country.is-on { opacity: .82; }
.page-reports .rp-worldtip { position: absolute; z-index: 4; min-width: 184px; padding: 10px 12px 11px; border: 1px solid var(--rp-line); border-radius: 12px; background: #fff; box-shadow: 0 10px 26px rgba(15,31,61,.14); pointer-events: none; }
.page-reports .rp-worldtip-h { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; font-size: 13.5px; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-worldtip-flag { width: 20px; height: 14px; border-radius: 3px; object-fit: cover; box-shadow: 0 0 0 1px rgba(15,31,61,.08); }
.page-reports .rp-worldtip-r { display: flex; align-items: center; gap: 8px; font-size: 12.5px; line-height: 1.75; color: #55688C; }
.page-reports .rp-worldtip-r i { flex: none; width: 9px; height: 9px; border-radius: 50%; }
.page-reports .rp-worldtip-r b { margin-left: auto; font-weight: 700; color: var(--rp-ink); }
.page-reports .rp-worldtip-r b.is-up { color: #12A45F; }
.page-reports .rp-worldtip-r b.is-down { color: #E11D48; }
.page-reports .rp-worldzoom { position: absolute; right: 8px; bottom: 8px; display: flex; flex-direction: column; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; overflow: hidden; box-shadow: 0 2px 6px rgba(15,31,61,.06); }
.page-reports .rp-zbtn { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 0; background: #fff; color: var(--rp-ink); cursor: pointer; }
.page-reports .rp-zbtn + .rp-zbtn { border-top: 1px solid var(--rp-line); }
.page-reports .rp-zbtn:hover { background: #F4F8FD; }
.page-reports .rp-worldlegend { list-style: none; margin: 7px 0 0; padding: 0; display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.page-reports .rp-worldlegend li { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; color: #3B4D72; white-space: nowrap; }
.page-reports .rp-worldlegend i { width: 11px; height: 11px; border-radius: 50%; background: var(--c); }
.page-reports .rp-world-fail { margin: 0; padding: 40px 0; text-align: center; font-size: 13px; color: var(--rp-muted); }

/* Commission by Model */
.page-reports .rp-mixbody { display: grid; grid-template-columns: 158px minmax(0, 1fr); gap: 10px; align-items: center; margin-top: 8px; }
.page-reports .rp-ovdonut { position: relative; width: 158px; height: 158px; }
.page-reports .rp-ovdonut .rp-donut-svg { max-width: 158px; }
.page-reports .rp-ovdonut .rp-donut-mid strong { font-size: 21px; }
.page-reports .rp-mixlegend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.page-reports .rp-mixlegend li { display: grid; grid-template-columns: 11px minmax(0, 1fr) auto; align-items: center; gap: 10px; height: 27px; font-size: 13px; color: #3B4D72; }
.page-reports .rp-mixlegend i { width: 11px; height: 11px; border-radius: 50%; background: var(--c); }
.page-reports .rp-mixlegend em { font-style: normal; font-size: 13px; font-weight: 700; color: var(--rp-ink); }

/* Monthly Performance */
.page-reports .rp-mlegend { display: flex; align-items: center; justify-content: center; gap: 22px; margin: 6px 0 0; }
.page-reports .rp-mleg { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: #3B4D72; }
.page-reports .rp-mleg i.is-bar { width: 11px; height: 11px; border-radius: 50%; background: var(--c); }
.page-reports .rp-mleg i.is-line { position: relative; width: 20px; height: 3px; border-radius: 2px; background: var(--c); }
.page-reports .rp-mleg i.is-line::after { content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px; border-radius: 50%; background: var(--c); }
.page-reports .rp-mchart { position: relative; height: 124px; }
.page-reports .rp-mchart svg { display: block; width: 100%; height: 100%; }

/* Top Partners table */
.page-reports .rp-ptwrap { margin: 9px -15px 0; }
.page-reports .rp-pttable { width: 100%; border-collapse: collapse; }
.page-reports .rp-pttable thead th { height: 28px; padding: 0 8px; background: #F7F9FD; border-top: 1px solid var(--rp-line-soft, #EEF2F8); border-bottom: 1px solid var(--rp-line); font-size: 12px; font-weight: 600; color: var(--rp-muted); text-align: left; white-space: nowrap; }
.page-reports .rp-pttable thead th:first-child { padding-left: 16px; width: 34px; }
.page-reports .rp-pttable thead th:last-child { padding-right: 16px; }
.page-reports .rp-pttable tbody td { height: 27px; padding: 0 8px; border-bottom: 1px solid var(--rp-line-soft, #EEF2F8); font-size: 13px; color: var(--rp-ink); white-space: nowrap; vertical-align: middle; }
.page-reports .rp-pttable tbody tr:last-child td { border-bottom: 0; }
.page-reports .rp-pttable tbody td:first-child { padding-left: 16px; }
.page-reports .rp-pttable tbody td:last-child { padding-right: 16px; }
.page-reports .rp-pt-no { color: var(--rp-muted); }
.page-reports .rp-pt-partner > * { vertical-align: middle; }
.page-reports .rp-pt-partner > span { margin-left: 10px; font-weight: 600; }
.page-reports .rp-pt-logo { border-radius: 7px; }
.page-reports .rp-pt-rev { font-weight: 700; }
.page-reports .rp-pt-growth .rp-delta { font-size: 13px; }

/* the closing call to action */
.page-reports .rp-ovcta { position: relative; display: flex; align-items: center; gap: 20px; padding: 15px 20px; border-radius: 14px; background: #E8F1FE; overflow: hidden; }
.page-reports .rp-ovcta:hover { background: #E0EBFE; }
.page-reports .rp-ovcta::after { content: ""; position: absolute; left: 50%; top: 0; right: 210px; bottom: 0; background-image: radial-gradient(circle, #B9D2FA 1.2px, transparent 1.3px); background-size: 9px 9px; opacity: .85; pointer-events: none; }
.page-reports .rp-ovcta-ic { flex: none; display: inline-flex; color: #2563EB; }
.page-reports .rp-ovcta-t { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; flex: 1 1 auto; }
.page-reports .rp-ovcta-t strong { font-size: 16.5px; font-weight: 800; letter-spacing: -.02em; color: var(--rp-ink); }
.page-reports .rp-ovcta-t em { font-style: normal; font-size: 12.5px; color: #55688C; }
.page-reports .rp-ovcta-btn { position: relative; z-index: 1; flex: none; display: inline-flex; align-items: center; gap: 9px; height: 42px; padding: 0 18px; border-radius: 10px; background: #2563EB; color: #fff; font-size: 13.5px; font-weight: 700; }
.page-reports .rp-ovcta:hover .rp-ovcta-btn { background: #1D4ED8; }

@media (max-width: 1279px) {
  .page-reports .rp-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* the deals filter bar is a single row only at the reference width */
  .page-reports .rp-filters-lg { flex-wrap: wrap; row-gap: 10px; }
  .page-reports .rp-filters-lg .rp-search { flex: 1 1 200px; max-width: none; }
  .page-reports .rp-filters-lg .rp-fsel { flex: 1 1 140px; min-width: 132px; }
  .page-reports .rp-split-deals.is-open { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-split-trk.is-open { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-paygrid, .page-reports .rp-paytop { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-trendtop, .page-reports .rp-trendbot { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-ovrow-a, .page-reports .rp-ovrow-b, .page-reports .rp-ovrow-c { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-ovtiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-reports .rp-tabwrap { flex-direction: column; align-items: stretch; }
  .page-reports .rp-insightbar { width: auto; margin-bottom: 0; }
  .page-reports .rp-builder3, .page-reports .rp-resultgrid { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-rtiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-reports .rp-mgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-reports .rp-trendmid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-reports .rp-stats-pay { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-reports .rp-filters-pay { flex-wrap: wrap; row-gap: 10px; }
  .page-reports .rp-trkgrid { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-filters-trk { flex-wrap: wrap; row-gap: 10px; }
  .page-reports .rp-split.is-open { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-panel.is-open { position: fixed; inset: 0; z-index: 60; overflow-y: auto; gap: 0; padding: 0 0 20px; background: #fff; border-radius: 0; animation: none; }
  .page-reports .rp-panel.is-open > * { border-radius: 0 !important; border-left: 0 !important; border-right: 0 !important; }
}
@media (max-width: 900px) { .page-reports .rp-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-reports .rp-ovtiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-reports .rp-fbody { grid-template-columns: 104px minmax(0, 1fr); }
  .page-reports .rp-trendmid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) {
  .page-reports .rp-stats { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-rtiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-reports .rp-mgrid { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-fgrid { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-customtable { margin: 0; width: 100%; }
  .page-reports .rp-ovtiles { grid-template-columns: minmax(0, 1fr); }
  .page-reports .rp-mixbody { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .page-reports .rp-worldlegend { flex-wrap: wrap; row-gap: 6px; justify-content: flex-start; }
  .page-reports .rp-ovcta { flex-wrap: wrap; row-gap: 12px; }
  .page-reports .rp-rtabs { margin-left: 0; margin-right: 0; padding: 0; }
  .page-reports .rp-headtools { flex-wrap: wrap; row-gap: 8px; }
  .page-reports .rp-resulthead { flex-direction: column; align-items: stretch; }
}

/* Knowledge & Files replaces the sidebar promo with its storage card, so it has to follow the same
   rail rules — otherwise it stays in the 64px icon rail as a column of broken words. */
body.sidebar-collapsed .kf-storage { display: none; }
@media (max-width: 1023px) { body:not(.sidebar-expanded) .kf-storage { display: none; } }
@media (max-width: 767px) { body .sidebar .kf-storage { display: block; } }
.page-reports .rp-export-btn { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px 0 13px; border-radius: 10px; background: #111C33; color: #fff; font-size: 13.5px; font-weight: 600; }
.page-reports .rp-export-btn:hover { background: #1C2A48; }
.page-reports .rp-export-btn .icon { width: 16px; height: 16px; }
.page-reports .rp-headmenu .btn-icon { width: 38px; height: 38px; border: 1px solid var(--rp-line); border-radius: 10px; background: #fff; color: #46588A; }
.page-reports .rp-headmenu .btn-icon:hover { border-color: #CFDDF3; color: var(--rp-ink); }
.page-reports .rp-btn-tall { height: 38px; border-radius: 10px; font-size: 13.5px; }


/* ---- Tracking Links: narrow-viewport guards (verified with tools-dev/measure.sh … OVERFLOW <w>) ---- */
@media (max-width: 1099px) {
  /* stat labels may wrap once the tiles are narrow — nowrap is only for the reference width */
  .tl-dstats.is-6eq .tl-dstat-l, .tl-dstat-l, .tl-alert-t, .tl-alert-s, .tl-srcname { white-space: normal; }
  .tl-crumbs { flex-wrap: wrap; row-gap: 8px; }
  .tl-crumb-actions { flex-wrap: wrap; row-gap: 8px; margin-left: 0; min-width: 0; }
  .tl-dhead-r { flex-wrap: wrap; row-gap: 10px; min-width: 0; }
  .tl-actgrid, .tl-final-actions, .tl-subpanel-actions { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .tl-actgrid .tl-btn { min-width: 0; } .tl-actgrid .tl-btn span { overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 767px) {
  .tl-dstat, .tl-dstat-b, .tl-subpanel-top > div, .tl-subcell { min-width: 0; }
  .tl-dstat-v, .tl-subpanel-code b { overflow-wrap: anywhere; }
  .tl-dkv dd, .tl-dtable.is-subs td, .tl-dtable.is-subs th { white-space: normal; }
  .tl-dkv > div { grid-template-columns: minmax(0, 1fr); row-gap: 2px; padding: 8px 0; }
  .tl-actgrid, .tl-final-actions, .tl-subpanel-actions, .tl-egrid { grid-template-columns: minmax(0, 1fr); }
  .tl-dchips { row-gap: 6px; } .tl-dchip { max-width: 100%; }
  .tl-attrlegend { flex-wrap: wrap; gap: 6px 14px; } .tl-attrlegend span { min-width: 0; }
  .tl-top-actions, .tl-tabsrow-r { flex-wrap: wrap; row-gap: 8px; min-width: 0; }
  .tl-search, .tl-search.is-wide, .tl-subfilters .tl-fsel { width: 100%; }
  .tl-funnel { flex-direction: column; align-items: stretch; } .tl-fsep { display: none; }
  .tl-qual { grid-template-columns: minmax(0, 1fr); } .tl-submetrics { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .tl-efoot { flex-wrap: wrap; row-gap: 10px; } .tl-efoot .tl-btn { flex: 1 1 auto; }
  .tl-wiz-foot { flex-wrap: wrap; row-gap: 10px; } .tl-wiz-spacer { display: none; }
}

/* ====================================================================
   Geography — six tabs (design-reference-new/geography-*.png)
   Prefix: geo-*  ·  the module's own tokens sit on .page-geography
   ==================================================================== */
.page-geography {
  --geo-card-bd: #EBF1F9; --geo-card-r: 14px; --geo-gap: 14px;
  --geo-b0: #045C41; --geo-b1: #06B779; --geo-b2: #87D6B7; --geo-b3: #97DAC3; --geo-b4: #D5E0ED;
  --geo-track: #EDF1F8; --geo-row-bd: #EEF2F9; --geo-th-bg: #EEF2F8;
  --geo-label: #6B7C99; --geo-value: #0F172A; --geo-sub: #7B8CA6; --geo-body: #3E5878;
  --geo-mint-a: #057A77; --geo-mint-b: #06BA74;
  --geo-seg-green: #09BA78; --geo-seg-blue: #146BFD; --geo-seg-purple: #A858FC;
  --geo-seg-orange: #FEA639; --geo-seg-slate: #7E95B8; --geo-seg-teal: #14B8A6; --geo-seg-pink: #EC4899;
  --geo-red: #EF4444; --geo-amber: #F59E0B;
}
.page-geography .page-content { padding-top: 9px; }
.page-geography .page-header { margin: 0 0 17px; align-items: flex-start; }
.page-geography .page-header-main { gap: 15px; align-items: center; }
.page-geography .page-title { font-size: 27px; font-weight: 700; letter-spacing: -.022em; line-height: 1.2; }
.page-geography .page-subtitle { margin-top: 4px; font-size: 13.3px; line-height: 1.35; color: #5D719A; }
.page-geography .eyebrow { display: inline-block; margin: 0 0 5px; padding: 1px 6px; background: #E9EFF9;
  color: #667593; border-radius: 5px; font-size: 9px; line-height: 10px; font-weight: 600; letter-spacing: .09em; }
.geo-page-icon { width: 52px; height: 52px; border-radius: 15px; display: inline-flex; align-items: center;
  justify-content: center; flex: none; }
.geo-page-icon.tone-green  { background: linear-gradient(155deg, #DFFAEE, #F1FCF8); color: #06BF6E; }
.geo-page-icon.tone-blue   { background: linear-gradient(155deg, #DCEBFE, #EFF6FF); color: #1D74FB; }
.geo-page-icon.tone-indigo { background: linear-gradient(155deg, #E2E4FE, #EEF0FF); color: #5B5BF0; }
.geo-page-icon.tone-orange { background: linear-gradient(155deg, #FFE8D2, #FFF4EA); color: #F97316; }
.geo-page-icon.tone-red    { background: linear-gradient(155deg, #FEE0E2, #FFF1F2); color: #F43F5E; }
.geo-page-icon.tone-teal   { background: linear-gradient(155deg, #D6F7EE, #EEFCF8); color: #0FB397; }
.page-geography .page-icon { width: auto; height: auto; background: none; border-radius: 0; }

/* ---------- date range ---------- */
.geo-rangewrap { position: relative; }
.geo-range { display: inline-flex; align-items: center; gap: 9px; height: 34px; padding: 0 11px 0 12px;
  background: #fff; border: 1px solid #E7EDF6; border-radius: 10px; font-size: 13.5px; font-weight: 500;
  color: #26344B; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
.geo-range:hover { border-color: #D6E0EE; }
.geo-range-cal { color: #5B6B85; flex: none; }
.geo-range-caret { color: #68768D; flex: none; }
.geo-range-menu { min-width: 232px; padding: 6px; }
.geo-range-custom { border-top: 1px solid var(--geo-card-bd); margin-top: 6px; padding: 10px 8px 4px; }
.geo-range-form { display: grid; gap: 8px; }
.geo-range-form label { display: grid; gap: 3px; font-size: 12px; color: var(--geo-sub); }
.geo-range-form input { height: 32px; border: 1px solid #E3EAF4; border-radius: 8px; padding: 0 8px; font-size: 13px; }

/* ---------- tab row ---------- */
.geo-tabs { display: flex; align-items: flex-end; gap: 12px; border-bottom: 1px solid #E7EDF6;
  margin: 0 0 11px; overflow-x: auto; scrollbar-width: none; }
.geo-tabs::-webkit-scrollbar { display: none; }
.geo-tab { display: inline-flex; align-items: center; gap: 8px; padding: 0 0 11px 8px; font-size: 14px;
  font-weight: 500; color: #4E6081; border-bottom: 2.5px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.geo-tab:hover { color: #223452; }
.geo-tab.is-active { color: #2563EB; font-weight: 600; border-bottom-color: #2563EB; }
.geo-tab-icon { display: inline-flex; color: #69758D; }
.geo-tab.is-active .geo-tab-icon { color: #2563EB; }

/* ---------- layout ---------- */
.geo-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.geo-stats.cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.geo-stats.cols-5 .geo-stat { gap: 15px; padding: 13px 12px 12px 13px; }
.geo-stats.cols-5 .geo-stat-sub { font-size: 11px; }
.geo-layout { display: grid; grid-template-columns: minmax(0, 1fr) 293px; gap: var(--geo-gap); align-items: start; }
/* Overview stacks full-width rows; the region donut rides beside the markets table, not beside the map */
.geo-stack { display: flex; flex-direction: column; gap: var(--geo-gap); min-width: 0; }
.geo-row-table { display: grid; grid-template-columns: minmax(0, 1fr) 293px; gap: var(--geo-gap); align-items: start; }
.geo-rail-table { min-width: 0; }
.geo-main, .geo-rail { display: flex; flex-direction: column; gap: var(--geo-gap); min-width: 0; }
.geo-row-map { display: grid; grid-template-columns: minmax(0, 1fr) 372px; gap: var(--geo-gap); }
/* the map card owns a full-width row now, so the world is drawn large and fills the card */
.geo-row-map > .geo-card-map { display: flex; flex-direction: column; }
.geo-row-map > .geo-card-map .geo-map-body { flex: 1; display: flex; flex-direction: column; }
.geo-row-map .geo-mapwrap { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.geo-row-map .geo-map-svg { aspect-ratio: 2.34; }
/* the ranking beside it fills the same height instead of leaving a gap under the last country */
.geo-row-map > .geo-card-rank { display: flex; flex-direction: column; }
.geo-row-map > .geo-card-rank .geo-card-body { flex: 1; }
.geo-row-map > .geo-card-rank .geo-rank-list { height: 100%; justify-content: space-evenly; }

/* ---------- card ---------- */
.geo-card { background: #fff; border: 1px solid var(--geo-card-bd); border-radius: var(--geo-card-r);
  box-shadow: 0 1px 2px rgba(15,23,42,.028); min-width: 0; }
.geo-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px 17px 0; }
.geo-card-titles { min-width: 0; }
.geo-card-title { font-size: 16px; font-weight: 700; letter-spacing: -.012em; color: #101B33;
  line-height: 19px; display: flex; align-items: center; gap: 9px; }
.geo-card-sub { margin-top: 3px; font-size: 13px; color: #68768D; }
.geo-card-tools { display: flex; align-items: center; gap: 8px; flex: none; }
.geo-card-body { padding: 14px 17px 16px; }
.geo-viewall { font-size: 12.5px; font-weight: 500; color: #2C7BF7; white-space: nowrap; }
.geo-viewall:hover { text-decoration: underline; }

/* ---------- KPI tile ---------- */
.geo-stat { background: #fff; border: 1px solid var(--geo-card-bd); border-radius: var(--geo-card-r);
  box-shadow: 0 1px 2px rgba(15,23,42,.028); display: flex; gap: 21px; padding: 13px 15px 12px 15px; min-width: 0; }
.geo-stat-icon { width: 48px; height: 48px; border-radius: 13px; flex: none; margin-top: -2px;
  display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.geo-stat-icon.tone-green  { background: linear-gradient(158deg, #14CE8C 6%, #04B272 96%); }
.geo-stat-icon.tone-blue   { background: linear-gradient(158deg, #52A2FE 6%, #1670F9 96%); }
.geo-stat-icon.tone-purple { background: linear-gradient(158deg, #C182FE 6%, #9645F7 96%); }
.geo-stat-icon.tone-orange { background: linear-gradient(158deg, #FEA950 6%, #F97B14 96%); }
.geo-stat-icon.tone-red    { background: linear-gradient(158deg, #FB6A72 6%, #EF3F4F 96%); }
.geo-stat-icon.tone-teal   { background: linear-gradient(158deg, #2AD4BA 6%, #0BAD93 96%); }
.geo-stat-icon.tone-amber  { background: linear-gradient(158deg, #FBC93F 6%, #F0A208 96%); }
.geo-stat-icon.tone-grey   { background: linear-gradient(158deg, #A9B6CC 6%, #8794AC 96%); }
.geo-stat-icon.tone-indigo { background: linear-gradient(158deg, #8189FF 6%, #4F46E5 96%); }
.geo-stat-main { min-width: 0; flex: 1; }
.geo-stat-label { font-size: 12.5px; color: #54658A; line-height: 15px; }
.geo-stat-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-top: 3px; }
.geo-stat-value { font-size: 23px; font-weight: 700; letter-spacing: -.026em; color: var(--geo-value);
  line-height: 26px; font-variant-numeric: tabular-nums; }
.geo-stat-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: 2px; height: 24px; }
.geo-stat-sub { font-size: 11.5px; color: var(--geo-sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.geo-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 12.5px; font-weight: 500;
  white-space: nowrap; font-variant-numeric: tabular-nums; }
.geo-delta.is-up { color: #16A34A; } .geo-delta.is-down { color: #E0384C; } .geo-delta.is-flat { color: #69768B; }
.geo-delta svg { flex: none; }

/* ---------- sparklines ---------- */
.geo-spark, .geo-spark-bars, .geo-donut svg { flex: none; background: none; }
.geo-spark-line { stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; }
.geo-spark.tone-green  .geo-spark-line { stroke: #16C47F; } .geo-spark.tone-green  .geo-spark-top { stop-color: #16C47F; stop-opacity: .22; }
.geo-spark.tone-blue   .geo-spark-line { stroke: #2E86F8; } .geo-spark.tone-blue   .geo-spark-top { stop-color: #2E86F8; stop-opacity: .22; }
.geo-spark.tone-purple .geo-spark-line { stroke: #A45BF6; } .geo-spark.tone-purple .geo-spark-top { stop-color: #A45BF6; stop-opacity: .22; }
.geo-spark.tone-orange .geo-spark-line { stroke: #F98A2B; } .geo-spark.tone-orange .geo-spark-top { stop-color: #F98A2B; stop-opacity: .22; }
.geo-spark.tone-red    .geo-spark-line { stroke: #EF4B5B; } .geo-spark.tone-red    .geo-spark-top { stop-color: #EF4B5B; stop-opacity: .22; }
.geo-spark.tone-grey   .geo-spark-line { stroke: #627596; } .geo-spark.tone-grey   .geo-spark-top { stop-color: #A8B6CE; stop-opacity: .2; }
.geo-spark .geo-spark-bottom { stop-color: #fff; stop-opacity: 0; }
.geo-spark-bars rect { fill: #16C47F; }
.geo-spark-bars rect.is-faded { opacity: .42; }
.geo-spark-bars.tone-blue rect { fill: #2E86F8; } .geo-spark-bars.tone-orange rect { fill: #F98A2B; }
.geo-spark-bars.tone-purple rect { fill: #A45BF6; } .geo-spark-bars.tone-grey rect { fill: #627696; }
.geo-spark-bars.tone-green rect { fill: #16C47F; }

/* ---------- flags ---------- */
.geo-flag { width: var(--fs, 22px); height: var(--fs, 22px); border-radius: 50%; overflow: hidden; flex: none;
  display: inline-block; background: #EEF2F8; box-shadow: inset 0 0 0 1px rgba(15,23,42,.06); }
.geo-flag img { width: 100%; height: 100%; object-fit: cover; display: block; }
.geo-flag-none { display: inline-flex; align-items: center; justify-content: center; font-size: 9px;
  font-weight: 700; color: #69758B; }

/* ---------- selects ---------- */
.geo-select { position: relative; display: inline-flex; align-items: center; }
.geo-select select { appearance: none; -webkit-appearance: none; height: 33px; padding: 0 28px 0 11px;
  background: #fff; border: 1px solid #E9EFF8; border-radius: 9px; font-size: 12.5px; font-weight: 500;
  color: #26344B; cursor: pointer; width: 100%; }
.geo-select.geo-select-md select { min-width: 104px; }
.geo-select.geo-select-sm select { height: 32px; font-size: 13px; min-width: 108px; }
.geo-select-caret { position: absolute; right: 9px; color: #66768F; pointer-events: none; }
.geo-select select:hover { border-color: #DBE4F0; }

.geo-field { position: relative; display: inline-flex; flex-direction: column; justify-content: center;
  height: 33px; padding: 0 30px 0 11px; border: 1px solid #EAF0F8; border-radius: 9px; background: #fff;
  min-width: 132px; cursor: pointer; }
.geo-field-label { font-size: 9.5px; line-height: 11px; color: #687590; }
.geo-field select { appearance: none; -webkit-appearance: none; border: 0; background: none; padding: 0;
  font-size: 12.5px; line-height: 15px; font-weight: 600; color: #1B2A4A; cursor: pointer; width: 100%; }
.geo-field-caret { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); color: #2242C6; pointer-events: none; }

/* ---------- the map ---------- */
.geo-card-map .geo-card-body { padding: 6px 17px 12px; }
.geo-mapwrap { position: relative; }
.geo-map { min-height: 60px; }
.geo-map-svg { width: 100%; height: auto; aspect-ratio: 2.58; display: block; touch-action: none; }
.geo-map-svg.is-dragging { cursor: grabbing; }
.geo-c { stroke: #FFFFFF; stroke-width: .55; fill: var(--geo-b4); }
.geo-c.has-data { cursor: pointer; }
.geo-c.b0 { fill: var(--geo-b0); } .geo-c.b1 { fill: var(--geo-b1); } .geo-c.b2 { fill: var(--geo-b2); }
.geo-c.b3 { fill: var(--geo-b3); } .geo-c.b4 { fill: var(--geo-b4); }
.geo-c.has-data:hover, .geo-c.is-hover { stroke: #0F172A; stroke-width: .9; }
.geo-c:focus-visible { outline: none; stroke: #0F172A; stroke-width: 1.1; }
.geo-map-pin .geo-pin-body { fill: #10B981; }
.geo-map-pin .geo-pin-dot { fill: #fff; }
.geo-zoom { position: absolute; left: 10px; top: 10px; z-index: 3; display: flex; flex-direction: column; gap: 7px; }
.geo-zoom-btn { width: 31px; height: 31px; border-radius: 9px; background: #fff; border: 1px solid #E7EDF6;
  color: #33445F; display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 3px rgba(15,23,42,.08); }
.geo-zoom-btn:hover { background: #F6F9FE; }
.geo-legend { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; padding: 6px 2px 0; font-size: 12px; color: #4E6081; }
.geo-legend-item { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.geo-swatch { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.geo-swatch.b0 { background: var(--geo-b0); } .geo-swatch.b1 { background: var(--geo-b1); }
.geo-swatch.b2 { background: var(--geo-b2); } .geo-swatch.b3 { background: var(--geo-b3); }
.geo-swatch.b4 { background: var(--geo-b4); }
/* the coverage scale ends in a pale wheat for the single-partner markets */
.geo-mapwrap.mode-coverage { --geo-b3: #E3E9A4; }
.geo-swatch.r0 { background: #EF4444; } .geo-swatch.r1 { background: #F5A524; }
.geo-swatch.r2 { background: #22C55E; } .geo-swatch.r3 { background: #CBD5E1; }

/* map tooltip */
.geo-tip { position: absolute; z-index: 5; background: #fff; border: 1px solid #EEF2F8; border-radius: 11px;
  box-shadow: 0 10px 28px rgba(15,23,42,.13); padding: 8px 11px 9px; min-width: 128px; pointer-events: auto; }
.geo-tip-head { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 700; color: #0F172A; margin-bottom: 3px; }
.geo-tip-flag { width: 15px; height: 15px; border-radius: 50%; object-fit: cover; flex: none; box-shadow: inset 0 0 0 1px rgba(15,23,42,.08); }
.geo-tip-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; font-size: 11px;
  color: #5A6B85; line-height: 15px; white-space: nowrap; }
.geo-tip-row > span:first-child { display: inline-flex; align-items: center; }
.geo-tip-row b { color: #17233C; font-weight: 600; font-variant-numeric: tabular-nums; }
.geo-tip-line { display: flex; align-items: center; gap: 7px; font-size: 11px; line-height: 15px; }
.geo-tip-dot { width: 6px; height: 6px; border-radius: 50%; margin-right: 7px; flex: none; display: inline-block; }
.geo-tip-dot.d0 { background: #1D6BFB; } .geo-tip-dot.d1 { background: #7ED3B0; }
.geo-tip-dot.d2 { background: #7ED3B0; } .geo-tip-dot.d3 { background: #0A5B41; }
.geo-tip-dot.b1 { background: #16C47F; } .geo-tip-dot.b2 { background: #6FD3AC; }
.geo-tip-dot.r0 { background: #EF4444; } .geo-tip-dot.r1 { background: #F5A524; } .geo-tip-dot.r2 { background: #22C55E; }
.geo-tip-dot.r4 { background: #CBD5E1; }
.geo-tip-link { display: inline-block; margin-top: 5px; font-size: 11px; font-weight: 500; color: #2C7BF7; }
.geo-tip-status { display: inline-flex; align-items: center; font-weight: 600; color: #B45309; }
.geo-tip.is-dark { background: #0F1E33; border-color: #1B3049; box-shadow: 0 12px 30px rgba(8,18,32,.32); }
.geo-tip.is-dark .geo-tip-head, .geo-tip.is-dark .geo-tip-line { color: #fff; }
.geo-tip.is-dark .geo-tip-row { color: #5B769A; } .geo-tip.is-dark .geo-tip-row b { color: #fff; }
.geo-tip.is-dark .geo-tip-link { color: #6BA8FF; }

/* ---------- ranked list ---------- */
.geo-card-rank .geo-card-body { padding: 8px 22px 9px 20px; }
.geo-rank-list { display: flex; flex-direction: column; }
.geo-rank { display: grid; grid-template-columns: 26px 25px minmax(0, 1fr) 106px 53px; align-items: center;
  gap: 5px; height: 27px; color: inherit; }
.geo-rank .geo-rank-name { margin-left: 3px; }
.geo-rank:hover .geo-rank-name { color: #2563EB; }
.geo-rank-no { width: 26px; height: 21px; border-radius: 7px; background: #EDF2F9; color: #3D4E6E;
  font-size: 11.5px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.geo-rank-name { font-size: 11.5px; color: #2B3A58; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.geo-rank-track { height: 9px; border-radius: 6px; background: var(--geo-track); overflow: hidden; }
.geo-rank-bar { display: block; height: 100%; border-radius: 6px;
  background: linear-gradient(90deg, var(--geo-mint-a), var(--geo-mint-b)); }
.geo-rank-bar.tone-blue   { background: linear-gradient(90deg, #1A56C8, #3B8AFB); }
.geo-rank-bar.tone-purple { background: linear-gradient(90deg, #6D28D9, #A855F7); }
.geo-rank-bar.tone-orange { background: linear-gradient(90deg, #EA700C, #FBA94C); }
.geo-rank-bar.tone-pink   { background: linear-gradient(90deg, #DB2777, #F472B6); }
.geo-rank-value { font-size: 11.5px; font-weight: 700; color: #16233D; text-align: right;
  font-variant-numeric: tabular-nums; }

/* ---------- donut ---------- */
.geo-card-donut .geo-card-body { padding: 2px 17px 6px; }
.geo-donut-body { display: flex; flex-direction: column; align-items: center; }
.geo-donut { position: relative; width: var(--dsize); height: var(--dsize); }
.geo-donut svg { display: block; }
.geo-arc { transition: none; }
.geo-arc.tone-green  { stroke: var(--geo-seg-green); }  .geo-arc.tone-blue   { stroke: var(--geo-seg-blue); }
.geo-arc.tone-purple { stroke: var(--geo-seg-purple); } .geo-arc.tone-orange { stroke: var(--geo-seg-orange); }
.geo-arc.tone-slate  { stroke: var(--geo-seg-slate); }  .geo-arc.tone-teal   { stroke: var(--geo-seg-teal); }
.geo-arc.tone-pink   { stroke: var(--geo-seg-pink); }   .geo-arc.tone-red    { stroke: var(--geo-red); }
.geo-arc.tone-amber  { stroke: var(--geo-amber); }
.geo-donut-centre { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center;
  justify-content: center; gap: 1px; }
.geo-donut-value { font-size: 19px; font-weight: 700; letter-spacing: -.02em; color: #0F172A; font-variant-numeric: tabular-nums; }
.geo-donut-caption { font-size: 12px; color: #5D719A; }
.geo-donut-legend { width: 100%; margin-top: 4px; display: flex; flex-direction: column; }
.geo-dl-row { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 11px;
  height: 19px; font-size: 12px; }
.geo-dl-name { color: #3E5878; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.geo-dl-pct { color: #2B3A58; font-weight: 500; font-variant-numeric: tabular-nums; }
.geo-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.geo-dot.tone-green { background: var(--geo-seg-green); } .geo-dot.tone-blue { background: var(--geo-seg-blue); }
.geo-dot.tone-purple { background: var(--geo-seg-purple); } .geo-dot.tone-orange { background: var(--geo-seg-orange); }
.geo-dot.tone-slate { background: var(--geo-seg-slate); } .geo-dot.tone-teal { background: var(--geo-seg-teal); }
.geo-dot.tone-pink { background: var(--geo-seg-pink); } .geo-dot.tone-red { background: var(--geo-red); }
.geo-dot.tone-amber { background: var(--geo-amber); }

/* ---------- insight / recommendation rows ---------- */
.geo-ins-list { display: flex; flex-direction: column; padding: 0 14px 2px; }
.geo-ins { display: grid; grid-template-columns: 36px minmax(0, 1fr) 16px; align-items: center; gap: 13px;
  padding: 2px 0; height: 41px; border-top: 1px solid #F1F4FA; color: inherit; }
.geo-ins-list .geo-ins:first-child { border-top: 0; }
.geo-ins-icon { width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center;
  justify-content: center; flex: none; }
.geo-ins-icon.tone-red { background: #FEE7EA; color: #F0334A; } .geo-ins-icon.tone-blue { background: #E3EDFE; color: #0862FE; }
.geo-ins-icon.tone-green { background: #DDFBEC; color: #14B871; } .geo-ins-icon.tone-orange { background: #FEEFD5; color: #F59E0B; }
.geo-ins-icon.tone-purple { background: #EFE6FE; color: #8B5CF6; } .geo-ins-icon.tone-teal { background: #D8F7F1; color: #0FB397; }
.geo-ins-icon.tone-slate { background: #EAEFF7; color: #64748B; } .geo-ins-icon.tone-amber { background: #FEF3C7; color: #D97706; }
.geo-ins-text { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.geo-ins-title { font-size: 12.5px; font-weight: 600; color: #16233D; }
.geo-ins-sub { font-size: 12px; color: #68768D; }
.geo-ins-chev { color: #2A3C5C; flex: none; }
.geo-ins:hover .geo-ins-title { color: #2563EB; }

/* ---------- quick insights ---------- */
.geo-quick-head { padding: 15px 17px 0; }
.geo-quick-mark { color: #1D63F5; display: inline-flex; }
.geo-quick-list { display: flex; flex-direction: column; gap: 11px; padding: 11px 15px 14px; }
.geo-quick { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 11px; align-items: start;
  font-size: 12.5px; color: #47597C; line-height: 1.4; }
.geo-quick b { color: #16233D; font-weight: 600; }
.geo-quick-icon { width: 26px; height: 26px; border-radius: 50%; background: #E6EEFE; color: #1D63F5;
  display: inline-flex; align-items: center; justify-content: center; flex: none; margin-top: -1px; }

/* ---------- filter bar ---------- */
.geo-filters { display: flex; align-items: center; gap: 13px; padding: 10px 12px; flex-wrap: wrap; }
.geo-search { position: relative; display: flex; align-items: center; gap: 9px; height: 33px; width: 221px;
  border: 1px solid #EAF0F8; border-radius: 9px; padding: 0 11px; background: #fff; }
.geo-search-icon { color: #55698C; flex: none; }
.geo-search input { border: 0; background: none; font-size: 12.5px; width: 100%; padding: 0; color: #1B2A4A; }
.geo-search input::placeholder { color: #67768E; }
.geo-search input:focus { outline: none; }
.geo-more, .geo-export { display: inline-flex; align-items: center; gap: 9px; height: 33px; padding: 0 13px;
  background: #fff; border: 1px solid #EAF0F8; border-radius: 9px; font-size: 12.5px; font-weight: 500; color: #23324C; }
.geo-more:hover, .geo-export:hover { border-color: #DBE4F0; }
.geo-more svg, .geo-export svg { color: #2C3E5C; flex: none; }
.geo-table-head .geo-card-tools { display: inline-flex; align-items: center; gap: 9px; }
.geo-card-table .geo-filters { padding-top: 2px; }
.geo-reset { display: inline-flex; align-items: center; gap: 7px; height: 33px; padding: 0 12px; border-radius: 9px; border: 1px solid transparent; font-size: 12.5px; font-weight: 500; color: #55698C; }
.geo-reset:hover { color: #1B2A4A; background: #F3F6FB; }
.geo-export { background: #2C7BF7; border-color: #2C7BF7; color: #fff; }
.geo-export:hover { background: #1F6AE0; border-color: #1F6AE0; }
.geo-export svg { color: #fff; }
.geo-table td.geo-col-money, .geo-table th.geo-col-money { text-align: right; padding-right: 12px; }
.geo-table td.geo-col-money.is-strong { font-weight: 700; color: #16233D; }
.geo-table td.is-neg { color: #DC2626; }
.geo-morewrap { position: relative; }
.geo-more-menu { min-width: 216px; padding: 10px 12px 12px; }
.geo-more-title { font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  color: #67768E; margin: 6px 0 6px; }
.geo-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: #33445F; height: 26px; }
.geo-more-input { width: 100%; height: 32px; border: 1px solid #E3EAF4; border-radius: 8px; padding: 0 9px; font-size: 13px; }
.geo-more-apply { width: 100%; margin-top: 10px; }

/* ---------- table ---------- */
.geo-tablewrap { overflow-x: auto; }
.geo-table { width: 100%; border-collapse: collapse; font-size: 11.5px; line-height: 1.15; }
.geo-table thead th { background: var(--geo-th-bg); font-size: 11px; font-weight: 500; color: #4E6081;
  text-align: center; padding: 0 6px; height: 30px; white-space: nowrap; }
.geo-table thead th a { color: inherit; display: inline-block; }
.geo-table thead th.is-sorted a, .geo-table thead th.is-sorted { color: #2C7BF7; }
.geo-table thead th:first-child { padding-left: 12px; }
.geo-table thead th:last-child { padding-right: 12px; }
.geo-table tbody td { height: 27.5px; line-height: 1; padding: 0 6px; vertical-align: middle; border-bottom: 1px solid var(--geo-row-bd);
  text-align: center; color: #26344B; white-space: nowrap; font-variant-numeric: tabular-nums; }
.geo-table tbody tr:last-child td { border-bottom: 0; }
.geo-table tbody tr:hover td { background: #F9FBFE; }
.geo-table td.geo-col-sel, .geo-table th.geo-col-sel { width: 23px; padding-left: 12px; text-align: left; }
.geo-table td.geo-col-no, .geo-table th.geo-col-no { width: 26px; color: #46597C; }
.geo-table td.geo-col-country, .geo-table th.geo-col-country { text-align: left; min-width: 103px; }
.geo-table td.geo-col-region, .geo-table th:nth-child(4) { width: 57px; text-align: left; }
.geo-table td.geo-col-region { color: #55698C; }
.geo-table td.geo-col-trend, .geo-table th.geo-col-trend { width: 108px; }
.geo-table td.geo-col-status, .geo-table th.geo-col-status { width: 66px; }
.geo-table td.geo-col-opp, .geo-table th.geo-col-opp { width: 110px; }
.geo-table td.geo-col-act, .geo-table th.geo-col-act { width: 87px; padding-right: 12px; }
.geo-table td.is-sorted { color: #16233D; }
.geo-country { display: inline-flex; align-items: center; gap: 9px; line-height: 1; color: #17233C; font-weight: 500; }
.geo-country:hover span { color: #2563EB; }
.geo-num-link { color: #2C7BF7; font-weight: 500; }
.geo-num-link:hover { text-decoration: underline; }
.geo-col-trend .geo-spark { margin: 0 auto; display: block; }
.geo-cb { display: inline-flex; align-items: center; cursor: pointer; }
.geo-cb input { position: absolute; opacity: 0; width: 0; height: 0; }
.geo-cb span { width: 14px; height: 14px; border: 1.4px solid #C6D1E2; border-radius: 4px; display: block; background: #fff; }
.geo-cb input:checked + span { background: #2563EB; border-color: #2563EB;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.2 4.6 8.4 9.4 3.6' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 12px 12px; background-position: center; background-repeat: no-repeat; }
.geo-rowmenu { display: inline-flex; }
.geo-rowmenu > button { color: #3C4E6E; width: 20px; height: 20px; min-height: 0; border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.geo-rowmenu > button:hover { background: #EEF2F8; }
.geo-rowmenu > button .icon { width: 15px; height: 15px; }
.geo-empty { padding: 20px 0; }

/* ---------- pills ---------- */
.geo-pill { display: inline-flex; align-items: center; justify-content: center; height: 19px; padding: 0 11px;
  border-radius: 7px; font-size: 11.5px; font-weight: 500; white-space: nowrap; }
.geo-pill.tone-green { background: #D3FAE7; color: #12864F; }
.geo-pill.tone-amber { background: #FDEBC8; color: #96620B; }
.geo-pill.tone-red   { background: #FDE4E9; color: #C32F4A; }
.geo-pill.tone-grey  { background: #EBEFF6; color: #5A6B85; }
.geo-pill.tone-blue  { background: #E1EDFE; color: #1C5FD0; }

/* ---------- table footer ---------- */
.geo-tfoot { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 12px 12px; flex-wrap: wrap; }
.geo-showing { font-size: 12.5px; color: #5A6B85; }
.geo-pager { display: flex; align-items: center; gap: 6px; }
.geo-page { min-width: 28px; height: 28px; padding: 0 7px; border-radius: 8px; border: 1px solid #E9EFF8;
  background: #fff; color: #33445F; font-size: 12.5px; display: inline-flex; align-items: center; justify-content: center; }
.geo-page:hover { border-color: #D6E0EE; }
.geo-page.is-on { background: #2563EB; border-color: #2563EB; color: #fff; font-weight: 600; }
.geo-page.is-off { color: #617695; pointer-events: none; }
.geo-page-gap { color: #67768E; padding: 0 2px; }

/* ---------- bars & regions ---------- */
.geo-bar { display: block; height: 8px; border-radius: 5px; background: var(--geo-track); overflow: hidden; width: 100%; }
.geo-bar-fill { display: block; height: 100%; border-radius: 5px; background: #16C47F; }
.geo-bar-fill.tone-blue { background: #3B8AFB; } .geo-bar-fill.tone-purple { background: #A855F7; }
.geo-bar-fill.tone-orange { background: #FB923C; } .geo-bar-fill.tone-pink { background: #F472B6; }
.geo-bar-fill.tone-red { background: #EF4444; } .geo-bar-fill.tone-amber { background: #F59E0B; }
.geo-bar-fill.tone-teal { background: #14B8A6; } .geo-bar-fill.tone-grey { background: #B9C5D8; }
.geo-region-icon { width: 22px; height: 22px; border-radius: 7px; display: inline-flex; align-items: center;
  justify-content: center; flex: none; }
.geo-region-icon.tone-green { background: #DDFBEC; color: #14B871; } .geo-region-icon.tone-teal { background: #D8F7F1; color: #0FB397; }
.geo-region-icon.tone-purple { background: #EFE6FE; color: #8B5CF6; } .geo-region-icon.tone-orange { background: #FEEFD5; color: #F59E0B; }
.geo-region-icon.tone-pink { background: #FDE6F1; color: #EC4899; } .geo-region-icon.tone-red { background: #FEE7EA; color: #F0334A; }
.geo-region-icon.tone-slate { background: #EAEFF7; color: #64748B; } .geo-region-icon.tone-blue { background: #E3EDFE; color: #0862FE; }

/* ---------- responsive ---------- */
@media (max-width: 1400px) {
  .geo-layout, .geo-row-table { grid-template-columns: minmax(0, 1fr) 280px; }
  .geo-row-map { grid-template-columns: minmax(0, 1fr) 330px; }
}
@media (max-width: 1180px) {
  .geo-layout, .geo-row-map, .geo-row-table { grid-template-columns: minmax(0, 1fr); }
  .geo-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .geo-stats.cols-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .geo-stats, .geo-stats.cols-5 { grid-template-columns: minmax(0, 1fr); }
  .geo-filters { gap: 9px; }
  .geo-search { width: 100%; }
  .geo-table-head { flex-wrap: wrap; gap: 8px; }
  .geo-tfoot { justify-content: center; }
}


/* ---------- Country Performance ---------- */
.geo-filters-bare { padding: 0 0 12px; gap: 13px; }
.geo-filters-right { display: flex; align-items: center; gap: 13px; margin-left: auto; }
.geo-filters-sep { width: 1px; height: 22px; background: #E4EBF5; }
.geo-saveview { font-weight: 600; }
.geo-stat-country { font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.geo-stat-top .geo-stat-value { font-size: 20px; }
.geo-stat-icon.tone-amber.is-soft { background: linear-gradient(155deg, #FEEBCF, #FFF7EC); color: #EA8016; }
.geo-cp-row1 { display: grid; grid-template-columns: minmax(0, 1fr) 490px; gap: var(--geo-gap); margin-bottom: var(--geo-gap); align-items: start; }
.geo-cp-row2 { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: var(--geo-gap); align-items: start; }
.geo-rail-cp { min-width: 0; }

/* the spotlight */
.geo-spot { overflow: hidden; }
.geo-spot-head { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: 6px 13px 6px; background: linear-gradient(90deg, #F8FBFE 0%, #F1F6FC 55%, #E9F0F7 100%); overflow: hidden; }
.geo-skyline { position: absolute; right: 0; bottom: 0; height: 86%; width: 52%; opacity: .2; }
.geo-skyline-far rect { fill: #597895; }
.geo-spot-id { position: relative; display: flex; align-items: center; gap: 11px; min-width: 0; }
.geo-spot-flag { box-shadow: 0 0 0 2.5px #fff, 0 2px 6px rgba(15,23,42,.14); }
.geo-spot-titles { min-width: 0; }
.geo-spot-name { display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 700;
  letter-spacing: -.02em; color: #101B33; }
.geo-spot-badge { height: 19px; padding: 0 9px; font-size: 10.5px; font-weight: 600; }
.geo-spot-meta { display: flex; align-items: center; gap: 6px; margin-top: 2px; font-size: 11.5px; color: #43587C; }
.geo-spot-dot { width: 6px; height: 6px; border-radius: 50%; background: #16C47F; }
.geo-spot-status { font-weight: 600; color: #22314E; }
.geo-spot-sep { color: #647591; font-style: normal; }
.geo-spot-nav { position: relative; display: flex; gap: 8px; flex: none; }
.geo-spot-arrow { width: 27px; height: 27px; border-radius: 8px; background: #fff; border: 1px solid #E7EDF6;
  color: #1E2B45; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 1px 3px rgba(15,23,42,.08); }
.geo-spot-arrow:hover { background: #F6F9FE; }
.geo-spot-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; padding: 7px; background: #F7FAFD; }
.geo-spot-metric { background: #fff; border: 1px solid #EEF3F9; border-radius: 9px; padding: 5px 9px 5px; }
.geo-spot-value { font-size: 15px; font-weight: 700; letter-spacing: -.02em; color: #101B33; font-variant-numeric: tabular-nums; }
.geo-spot-label { font-size: 11px; color: #5D719A; margin-top: 1px; }
.geo-spot-metric .geo-delta { margin-top: 3px; font-size: 11px; }
.geo-spot-partners { border-top: 1px solid var(--geo-card-bd); }
.geo-spot-partners .geo-card-head { padding: 10px 16px 0; }
.geo-prank { padding: 2px 16px 7px 15px; }
.geo-prank-row { grid-template-columns: 22px 22px minmax(0, 1fr) 1fr 48px 40px; gap: 9px; height: 26px; }
.geo-rank-share { font-size: 11.5px; color: #68768D; text-align: right; font-variant-numeric: tabular-nums; }
.geo-plogo { width: var(--plogo, 26px); height: var(--plogo, 26px); border-radius: 7px; background: var(--plogo-bg, #0F172A);
  display: inline-flex; align-items: center; justify-content: center; overflow: hidden; flex: none; }
.geo-plogo img { width: 100%; height: 100%; object-fit: contain; padding: 2px; }
.geo-plogo.is-text { color: var(--plogo-fg, #fff); font-size: 10px; font-weight: 700; }
.geo-empty-line { font-size: 12px; color: var(--geo-sub); padding: 8px 0; }

/* table head with a Show control */
.geo-card-head-tight { padding-bottom: 12px; }
.geo-show { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: #5D719A; }
.geo-show .geo-select select { min-width: 62px; }

/* regional performance */
.geo-region-list { display: flex; flex-direction: column; gap: 0; padding: 6px 17px 12px; }
.geo-region-row { display: grid; grid-template-columns: 22px 62px minmax(0, 1fr) 62px 44px; align-items: center;
  gap: 11px; height: 28px; }
.geo-region-name { font-size: 12.5px; color: #26344B; }
.geo-region-value { font-size: 12.5px; font-weight: 700; color: #16233D; text-align: right; font-variant-numeric: tabular-nums; }
.geo-region-pct { font-size: 12px; color: #68768D; text-align: right; font-variant-numeric: tabular-nums; }
.geo-rank-bar.is-flat { background: #3B8AFB; }
.geo-rank-bar.tone-blue.is-flat { background: #2B7BF6; } .geo-rank-bar.tone-green.is-flat { background: #17C07C; }
.geo-rank-bar.tone-purple.is-flat { background: #A855F7; } .geo-rank-bar.tone-orange.is-flat { background: #F2701A; }
.geo-rank-bar.tone-slate.is-flat { background: #7E95B8; }
.geo-rank-bar.tone-pink.is-flat { background: #F4529A; }
.geo-rank-bar.tone-red.is-flat { background: #EF4444; }
.geo-rank-bar.tone-amber.is-flat { background: #F59E0B; }
.geo-rank-bar.tone-teal.is-flat { background: #14B8A6; }

/* insights (two-line rows) */
.geo-ins-mark { width: 26px; height: 26px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.geo-ins-mark.tone-orange { background: #FEEFD5; color: #F5891B; }
.geo-ins2-list { display: flex; flex-direction: column; gap: 12px; padding: 8px 17px 15px; }
.geo-ins2 { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 13px; align-items: start; }
.geo-ins2-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.geo-ins2-title { font-size: 12.5px; color: #26344B; }
.geo-ins2-title b { font-weight: 700; color: #101B33; }
.geo-ins2-sub { font-size: 12px; color: #657690; }
.geo-table tbody tr.is-on td { background: #F4F8FE; }

@media (max-width: 1400px) {
  .geo-cp-row1 { grid-template-columns: minmax(0, 1fr) 430px; }
  .geo-cp-row2 { grid-template-columns: minmax(0, 1fr) 380px; }
}
@media (max-width: 1180px) {
  .geo-cp-row1, .geo-cp-row2 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .geo-spot-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .geo-filters-right { margin-left: 0; }
}


/* ---------- Partner Coverage ---------- */
.geo-stat2 { padding: 12px 14px 11px 13px; gap: 14px; }
.geo-stat2 .geo-stat-icon { width: 44px; height: 44px; border-radius: 12px; margin-top: 0; }
.geo-stat2-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.geo-stat2-value { font-size: 20px; font-weight: 700; letter-spacing: -.026em; color: var(--geo-value);
  line-height: 22px; font-variant-numeric: tabular-nums; }
.geo-stat2-right { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.geo-stat2-sub { font-size: 10.5px; color: var(--geo-sub); }
.geo-stat2-label { display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  font-size: 12px; color: #54658A; margin-top: 2px; }
.geo-stat2-pct { font-size: 12.5px; font-weight: 700; color: #2C7BF7; }
.geo-stat2-bar { margin-top: 9px; }
.geo-stat2-bar .geo-bar { height: 7px; }
.geo-stat2-note { margin-top: 6px; font-size: 11px; font-weight: 500; color: #2C7BF7; }
.geo-stat2-note.is-muted { color: var(--geo-sub); font-weight: 400; margin-top: 2px; }
.geo-stat2-top.is-label { align-items: flex-start; }
.geo-stat2.is-labelfirst .geo-stat2-value { font-size: 21px; line-height: 24px; margin-top: 1px; }
.geo-stat2.is-labelfirst .geo-stat2-label { font-size: 12.5px; color: #54658A; }
.geo-stat2.is-labelfirst .geo-stat2-spark { margin-top: 2px; }
.geo-stat2-spark { display: flex; justify-content: flex-end; margin-top: 4px; }

.geo-pc-row1 { display: grid; grid-template-columns: minmax(0, 1fr) 624px; gap: var(--geo-gap);
  margin-bottom: var(--geo-gap); align-items: stretch; }
.geo-pc-rail { display: flex; flex-direction: column; gap: var(--geo-gap); min-width: 0; }
.geo-pc-sub { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--geo-gap); align-items: start; }
.geo-pc-row1 > .geo-card-map { display: flex; flex-direction: column; }
.geo-pc-row1 > .geo-card-map .geo-map-body { flex: 1; display: flex; flex-direction: column; justify-content: flex-start; }
.geo-pc-row1 .geo-map-svg { aspect-ratio: 2.03; }
.geo-pc-row1 .geo-mapwrap { flex: 1; display: flex; flex-direction: column; }
.geo-infodot { display: inline-flex; color: #647592; vertical-align: -2px; }
.geo-infodot:hover { color: #5B6B85; }

/* coverage by region */
.geo-covreg { padding: 4px 17px 12px; }
.geo-covreg-head, .geo-covreg-row { display: grid; grid-template-columns: 112px 74px 62px 66px minmax(0, 1fr);
  align-items: center; gap: 10px; }
.geo-covreg-head { font-size: 11.5px; color: #657690; height: 28px; }
.geo-covreg-row { height: 33px; border-top: 1px solid #F2F5FA; font-size: 12.5px; color: #26344B; }
.geo-covreg-head + .geo-covreg-row { border-top: 1px solid #E9EEF6; }
.geo-covreg-name { display: inline-flex; align-items: center; gap: 10px; font-size: 12.5px; color: #1E2B45; }
.geo-covreg-count { font-variant-numeric: tabular-nums; }
.geo-covreg-pct { font-weight: 700; color: #16233D; font-variant-numeric: tabular-nums; }
.geo-covreg-pct.is-best { background: #D9F8E7; color: #12864F; border-radius: 6px; padding: 2px 7px; }
.geo-covreg-row .geo-delta { font-size: 12px; }
.geo-cont { width: 21px; height: 21px; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.geo-cont.tone-green { color: #17C07C; } .geo-cont.tone-slate { color: #C3D0E0; } .geo-cont.tone-orange { color: #FB923C; }
.geo-cont.tone-pink { color: #F4529A; } .geo-cont.tone-red { color: #EF4444; } .geo-cont.tone-blue { color: #3B8AFB; }

/* top partners by coverage */
.geo-topp { padding: 6px 17px 12px 16px; }
.geo-topp-row { grid-template-columns: 22px 22px minmax(0, 1fr) 62px 1fr 46px; gap: 9px; height: 30px; }
.geo-topp-count { font-size: 12px; color: #26344B; font-variant-numeric: tabular-nums; }

/* partner type donut */
.geo-typemix { display: flex; flex-direction: column; align-items: center; padding: 6px 17px 14px; }
.geo-typemix-legend { margin-top: 12px; }
.geo-tm-row { grid-template-columns: 10px minmax(0, 1fr) 30px 46px; height: 22px; font-size: 12.5px; }
.geo-tm-count { font-weight: 700; color: #16233D; text-align: right; font-variant-numeric: tabular-nums; }

/* the matrix */
.geo-matrix-tools { display: flex; align-items: center; gap: 9px; }
.geo-search-sm { height: 31px; width: 168px; }
.geo-matrix thead th { height: 40px; }
.geo-mx-head { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; font-size: 10.5px; color: #4E6081; }
.geo-mx-flag { box-shadow: inset 0 0 0 1px rgba(15,23,42,.08); }
.geo-matrix td, .geo-matrix th { text-align: center; }
.geo-matrix { table-layout: fixed; }
.geo-matrix .geo-col-no { width: 34px; }
.geo-mx-partner { text-align: left !important; width: 165px; }
.geo-mx-type { width: 120px; color: #5C7099; text-align: left !important; }
.geo-mx-total { width: 118px; font-weight: 700; color: #16233D; }
.geo-mx-cc { width: 47px; }
.geo-mx-cov { width: 160px; }
.geo-mx-covwrap { display: inline-flex; align-items: center; gap: 10px; }
.geo-mx-covwrap b { font-weight: 700; color: #16233D; min-width: 38px; text-align: right; }
.geo-mx-covwrap .geo-rank-track { width: 78px; }
.geo-mx-view { width: 54px; }
.geo-mx-view a { color: #2C7BF7; font-weight: 500; }
.geo-mx-view a:hover { text-decoration: underline; }
.geo-matrix tbody td { height: 29px; }
.geo-cell { width: 19px; height: 19px; border-radius: 50%; display: inline-flex; align-items: center;
  justify-content: center; background: #B9C6D8; cursor: pointer; }
.geo-cell.st-available { background: #16C47F; }
.geo-cell.st-restricted { background: #F4515F; }
.geo-cell:hover { filter: brightness(1.06); box-shadow: 0 0 0 3px rgba(37,99,235,.14); }

@media (max-width: 1400px) {
  .geo-pc-row1 { grid-template-columns: minmax(0, 1fr) 540px; }
}
@media (max-width: 900px) {
  .geo-card-matrix .geo-card-head { flex-wrap: wrap; }
  .geo-card-tools { min-width: 0; max-width: 100%; flex-wrap: wrap; }
  .geo-matrix-tools { flex-wrap: wrap; width: 100%; }
  .geo-search-sm { width: 100%; }
  .geo-matrix-tools .geo-select { flex: 1 1 44%; min-width: 0; }
  .geo-matrix-tools .geo-select select { min-width: 0; width: 100%; }
}
@media (max-width: 620px) {
  .geo-matrix-tools .geo-select { flex: 1 1 100%; }
}
@media (max-width: 1180px) {
  .geo-pc-row1 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
  .geo-pc-sub { grid-template-columns: minmax(0, 1fr); }
}


/* ---------- Opportunities ---------- */
.geo-stat-op .geo-stat-value { font-size: 22px; }
.geo-stat-ring .geo-stat-foot { align-items: center; }
.geo-ring { display: inline-flex; margin-left: auto; }
.geo-ring-track { stroke: #E9EEF6; }
.geo-ring-bar { stroke: #17C07C; }
.geo-op-row1 { display: grid; grid-template-columns: minmax(0, 1fr) 320px 326px; gap: var(--geo-gap);
  margin-bottom: var(--geo-gap); align-items: start; }
.geo-op-row2 { display: grid; grid-template-columns: minmax(0, 1fr) 326px; gap: var(--geo-gap); align-items: start; }
.geo-rail-op { min-width: 0; }

/* the scatter */
.geo-scatter-body { display: grid; grid-template-columns: minmax(0, 1fr) 176px; gap: 14px; padding: 4px 17px 12px; }
.geo-scatter { min-width: 0; }
.geo-sc-svg { width: 100%; height: auto; display: block; overflow: visible; }
.geo-sc-frame { fill: #FCFDFE; stroke: #E9EEF6; stroke-width: 1; }
.geo-sc-ylab { font-size: 10.5px; fill: #657690; text-anchor: end; font-family: var(--font); }
.geo-sc-xlab { font-size: 10.5px; fill: #657690; text-anchor: middle; font-family: var(--font); }
.geo-sc-axis { font-size: 11px; fill: #5D719A; text-anchor: middle; font-family: var(--font); }
.geo-sc-ytitle { text-anchor: start; }
.geo-sc-dot circle { opacity: .85; }
.geo-sc-dot text { font-size: 11px; fill: #26344B; font-family: var(--font); }
.geo-sc-dot.tone-high circle { fill: #4CC79A; }
.geo-sc-dot.tone-medium circle { fill: #FBD07A; }
.geo-sc-dot.tone-low circle { fill: #F58182; }
.geo-scatter-side { display: flex; flex-direction: column; gap: 12px; }
.geo-scatter-legend { border: 1px solid #ECF1F8; border-radius: 11px; padding: 11px 13px; display: flex;
  flex-direction: column; gap: 10px; font-size: 12.5px; color: #26344B; }
.geo-scatter-legend span { display: inline-flex; align-items: center; gap: 10px; }
.geo-scatter-note { background: #F4F8FD; border-radius: 11px; padding: 11px 13px; font-size: 12px;
  line-height: 1.5; color: #3E5878; }

/* opportunity by region */
.geo-opreg { padding: 4px 16px 12px; }
.geo-opreg-head, .geo-opreg-row { display: grid; grid-template-columns: 96px minmax(0, 1fr) 108px; align-items: center; gap: 10px; }
.geo-opreg-head { font-size: 11.5px; color: #657690; height: 26px; }
.geo-opreg-row { height: 33px; border-top: 1px solid #F2F5FA; }
.geo-opreg-score { display: inline-flex; align-items: center; gap: 10px; }
.geo-opreg-score b { min-width: 26px; height: 20px; border-radius: 6px; background: #EDF2F9; color: #26344B;
  font-size: 11.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.geo-opreg-score .geo-rank-track { flex: 1; }
.geo-opreg-top { display: inline-flex; align-items: center; gap: 9px; font-size: 12.5px; color: #1E2B45; }
.geo-opreg-top:hover span { color: #2563EB; }

/* key insights */
.geo-keyins .geo-ins, .geo-card-actions .geo-ins { height: auto; min-height: 44px; align-items: start; padding: 9px 0; }
.geo-card-actions .geo-ins-sub, .geo-card-actions .geo-ins-title { white-space: normal; }
.geo-keyins .geo-ins-icon { margin-top: 1px; }
.geo-keyins .geo-ins-sub { white-space: normal; }

/* the opportunity table */
.geo-optable thead th { height: 46px; vertical-align: middle; }
.geo-th-sub { font-size: 10px; color: #657591; }
.geo-optable tbody td { height: 27px; }
.geo-op-cov { display: inline-flex; align-items: center; gap: 9px; }
.geo-op-cov .geo-rank-track { width: 66px; }
.geo-op-covcol { width: 140px; }
.geo-score-pill { min-width: 34px; height: 20px; font-weight: 700; }
.geo-op-act { width: 88px; }
.geo-viewbtn { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px;
  border: 1px solid #E4EBF5; border-radius: 7px; font-size: 11.5px; font-weight: 500; color: #26344B; background: #fff; }
.geo-viewbtn:hover { border-color: #C9D7EA; color: #1D4ED8; }

/* the CTA card */
.geo-cta { background: linear-gradient(120deg, #EAFBF2 0%, #F4FDF8 60%, #EFFAF4 100%); border-color: #C9EFDC; }
.geo-cta-body { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 13px; padding: 15px 16px 16px; }
.geo-cta-icon { width: 42px; height: 42px; border-radius: 11px; background: #17C07C; color: #fff;
  display: inline-flex; align-items: center; justify-content: center; }
.geo-cta-text { display: flex; flex-direction: column; gap: 3px; }
.geo-cta-title { font-size: 13.5px; font-weight: 700; color: #0F2E22; }
.geo-cta-sub { font-size: 12px; line-height: 1.45; color: #3D6B57; }
.geo-cta-btn { grid-column: 1 / -1; margin-top: 12px; height: 38px; border-radius: 10px; background: #17C07C;
  color: #fff; font-size: 13px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; gap: 9px; }
.geo-cta-btn:hover { background: #12A96C; }

@media (max-width: 1400px) {
  .geo-op-row1 { grid-template-columns: minmax(0, 1fr) 300px; }
  .geo-op-row1 > .geo-card-keyins { grid-column: 1 / -1; }
}
@media (max-width: 1180px) {
  .geo-op-row1, .geo-op-row2 { grid-template-columns: minmax(0, 1fr); }
  .geo-op-row1 > .geo-card-keyins { grid-column: auto; }
}
@media (max-width: 760px) {
  .geo-scatter-body { grid-template-columns: minmax(0, 1fr); }
}


/* ---------- Restrictions ---------- */
.geo-rs-row1 { display: grid; grid-template-columns: minmax(0, 1fr) 452px 259px; gap: var(--geo-gap);
  margin-bottom: var(--geo-gap); align-items: start; }
.geo-mapwrap.mode-restrictions { --geo-b0: #EF4444; --geo-b1: #F5A524; --geo-b2: #22C55E; --geo-b3: #CBD5E1; --geo-b4: #E4E9F1; }
.geo-rs-row1 .geo-map-svg { aspect-ratio: 2.32; }

/* the segmented By Region / By Vertical / By Partner toggle */
.geo-seg { display: inline-flex; align-items: center; gap: 2px; background: #F2F6FC; border-radius: 9px; padding: 3px; }
.geo-seg-btn { height: 26px; padding: 0 11px; border-radius: 7px; font-size: 12px; font-weight: 500;
  color: #55698C; display: inline-flex; align-items: center; }
.geo-seg-btn.is-on { background: #E2ECFD; color: #1D63F5; font-weight: 600; }
.geo-seg-btn:hover { color: #1D3050; }

/* the stacked breakdown bars */
.geo-break { padding: 6px 17px 14px; display: flex; flex-direction: column; }
.geo-break-row { display: grid; grid-template-columns: 96px minmax(0, 1fr) 56px; align-items: center; gap: 12px; height: 38px; }
.geo-break-name { font-size: 12.5px; color: #26344B; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.geo-break-bar { display: flex; height: 11px; border-radius: 6px; background: #EDF1F8; overflow: hidden; }
.geo-break-bar i { display: block; height: 100%; }
.geo-break-bar .seg-r { background: #F4515F; }
.geo-break-bar .seg-p { background: #F9C23C; }
.geo-break-bar .seg-a { background: #22C55E; }
.geo-break-count { font-size: 12.5px; color: #3E5878; text-align: right; font-variant-numeric: tabular-nums; }

/* the register */
.geo-filters-rs { padding: 11px 12px; }
.geo-select.geo-select-lg select { min-width: 152px; height: 34px; }
.geo-more-caret { color: #66768F; }
.geo-rstable tbody td { height: 30px; }
.geo-rstable .geo-rs-status { width: 88px; }
.geo-rstable .geo-rs-notes { max-width: 210px; overflow: hidden; text-overflow: ellipsis; text-align: left !important; color: #45597C; }
.geo-rstable .geo-rs-upd { width: 92px; color: #45597C; }
.geo-rstable .geo-rs-act { width: 116px; }
.geo-rstable .geo-rs-act .geo-viewbtn { background: #EEF4FE; border-color: #DCE8FD; color: #1D63F5; }
.geo-rstable .geo-rs-act .geo-rowmenu { margin-left: 6px; }
.geo-dash { color: #647592; }
.geo-addrestr { height: 33px; }

/* the restriction editor drawer */
.geo-rs-form { display: flex; flex-direction: column; gap: 14px; }
.geo-rs-form label { display: grid; gap: 5px; font-size: 12.5px; color: #45597C; }
.geo-rs-form select, .geo-rs-form input[type="text"], .geo-rs-form input[type="number"], .geo-rs-form textarea {
  height: 36px; border: 1px solid #E3EAF4; border-radius: 9px; padding: 0 10px; font-size: 13px; background: #fff; }
.geo-rs-form textarea { height: 68px; padding: 8px 10px; resize: vertical; }
.geo-rs-vert { display: grid; grid-template-columns: minmax(0, 1fr) 210px; align-items: center; gap: 10px;
  padding: 7px 0; border-top: 1px solid #F1F4FA; font-size: 12.5px; color: #26344B; }
.geo-rs-vert:first-of-type { border-top: 0; }
.geo-rs-vert .geo-seg { width: 100%; }
.geo-rs-vert .geo-seg-btn { flex: 1; justify-content: center; cursor: pointer; }
.geo-rs-srcs { display: flex; flex-wrap: wrap; gap: 8px; }
.geo-rs-src { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 11px;
  border: 1px solid #E3EAF4; border-radius: 8px; font-size: 12.5px; color: #26344B; cursor: pointer; }
.geo-rs-src.is-on { border-color: #B9D2FD; background: #EFF6FF; color: #1D4ED8; font-weight: 600; }

@media (max-width: 1400px) {
  .geo-rs-row1 { grid-template-columns: minmax(0, 1fr) 380px; }
  .geo-rs-row1 > .geo-card-insight { grid-column: 1 / -1; }
}
@media (max-width: 1180px) {
  .geo-rs-row1 { grid-template-columns: minmax(0, 1fr); }
  .geo-rs-row1 > .geo-card-insight { grid-column: auto; }
}


/* restriction editor + cell editor bits */
.geo-rs-lbl { display: block; font-size: 12.5px; color: #45597C; margin-bottom: 5px; }
.geo-cellform-lead { font-size: 13px; color: #45597C; margin-bottom: 12px; }
.geo-cellform-seg { width: 100%; }
.geo-cellform-seg .geo-seg-btn { flex: 1; justify-content: center; cursor: pointer; }
.geo-cellform-note { display: grid; gap: 5px; margin-top: 14px; font-size: 12.5px; color: #45597C; }
.geo-cellform-note input { height: 36px; border: 1px solid #E3EAF4; border-radius: 9px; padding: 0 10px; font-size: 13px; }
.geo-viewname input { height: 36px; border: 1px solid #E3EAF4; border-radius: 9px; padding: 0 10px; font-size: 13px; width: 100%; }


/* ---------- Compare Countries ---------- */
.geo-cmp-pick { margin-bottom: var(--geo-gap); }
.geo-cmp-pick .geo-card-head { padding-bottom: 0; }
.geo-cmp-pickbody { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 17px 16px; }
.geo-cmp-search { width: 442px; max-width: 100%; height: 38px; }
.geo-cmp-chips { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.geo-cmp-chip { display: inline-flex; align-items: center; gap: 9px; height: 38px; padding: 0 11px 0 9px;
  border: 1px solid #E7EDF6; border-radius: 10px; background: #fff; font-size: 13px; font-weight: 500; color: #1E2B45; }
.geo-cmp-x { display: inline-flex; color: #667590; margin-left: 2px; }
.geo-cmp-x:hover { color: #E0384C; }
.geo-cmp-add { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 15px;
  border-radius: 10px; background: #1D63F5; color: #fff; font-size: 13px; font-weight: 600; margin-left: auto; }
.geo-cmp-add:hover { background: #1550D8; }
.geo-cmp-add[disabled] { opacity: .5; pointer-events: none; }
.geo-cmp-clear { font-size: 13px; font-weight: 600; color: #1D63F5; }
.geo-cmp-clear:hover { text-decoration: underline; }

.geo-cmp-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px;
  margin-bottom: var(--geo-gap); flex-wrap: wrap; }
.geo-cmp-tabs { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.geo-cmp-tab { height: 38px; padding: 0 17px; white-space: nowrap; border-radius: 10px; background: #F1F5FB; color: #45597C;
  font-size: 13px; font-weight: 500; display: inline-flex; align-items: center; }
.geo-cmp-tab:hover { background: #E8EEF8; color: #1E2B45; }
.geo-cmp-tab.is-on { background: #1D63F5; color: #fff; font-weight: 600; }
.geo-cmp-period { background: #F1F5FB; }
.geo-cmp-period .geo-seg-btn { height: 30px; padding: 0 13px; font-size: 12.5px; }
.geo-cmp-period .geo-seg-btn.is-on { background: #0F1E33; color: #fff; }

.geo-cmp-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--geo-gap);
  margin-bottom: var(--geo-gap); }
.geo-cmp-cardhead { padding: 14px 17px 0; }
.geo-cmp-card .geo-card-title { font-size: 14.5px; gap: 11px; }
.geo-cmp-icon { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center;
  justify-content: center; color: #fff; flex: none; }
.geo-cmp-icon.tone-green { background: linear-gradient(158deg, #14CE8C, #04B272); }
.geo-cmp-icon.tone-blue { background: linear-gradient(158deg, #52A2FE, #1670F9); }
.geo-cmp-icon.tone-purple { background: linear-gradient(158deg, #C182FE, #9645F7); }
.geo-cmp-icon.tone-orange { background: linear-gradient(158deg, #FEA950, #F97B14); }
.geo-cmp-icon.tone-red { background: linear-gradient(158deg, #FB6A72, #EF3F4F); }
.geo-cmp-icon.tone-teal { background: linear-gradient(158deg, #2AD4BA, #0BAD93); }
.geo-cmp-bars { display: flex; align-items: flex-end; justify-content: space-around; gap: 6px;
  padding: 8px 12px 13px; }
.geo-cmp-col { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 0; flex: 1; }
.geo-cmp-val { font-size: 12px; font-weight: 700; color: #16233D; font-variant-numeric: tabular-nums;
  white-space: nowrap; margin-bottom: 5px; }
.geo-cmp-bartrack { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 96px; }
.geo-cmp-bar { display: block; width: 26px; border-radius: 7px; background: #17C07C; }
.geo-cmp-bar.tone-green { background: #43CE99; } .geo-cmp-bar.tone-amber { background: #FBC85F; }
.geo-cmp-bar.tone-red { background: #F8757C; } .geo-cmp-bar.tone-blue { background: #56A0F8; }
.geo-cmp-bar.tone-purple { background: #B07CF7; } .geo-cmp-bar.tone-teal { background: #35C9B4; }
.geo-cmp-flag { box-shadow: inset 0 0 0 1px rgba(15,23,42,.08); }
.geo-cmp-cname { font-size: 11px; color: #5D719A; text-align: center; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }

.geo-cmp-row2 { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: var(--geo-gap);
  margin-bottom: var(--geo-gap); align-items: start; }
.geo-cmptable { table-layout: fixed; }
.geo-cmptable thead th { height: 38px; }
.geo-cmptable tbody td { height: 33px; }
.geo-cmp-metric { width: 190px; text-align: left !important; padding-left: 14px !important; }
.geo-cmp-mlabel { display: inline-flex; align-items: center; gap: 10px; font-size: 12.5px; color: #26344B; }
.geo-cmp-micon { width: 20px; height: 20px; border-radius: 6px; display: inline-flex; align-items: center;
  justify-content: center; flex: none; }
.geo-cmp-micon.tone-green { background: #DDFBEC; color: #14B871; } .geo-cmp-micon.tone-blue { background: #E3EDFE; color: #0862FE; }
.geo-cmp-micon.tone-purple { background: #EFE6FE; color: #8B5CF6; } .geo-cmp-micon.tone-orange { background: #FEEFD5; color: #F59E0B; }
.geo-cmp-micon.tone-red { background: #FEE7EA; color: #F0334A; } .geo-cmp-micon.tone-teal { background: #D8F7F1; color: #0FB397; }
.geo-cmp-micon.tone-amber { background: #FEF3C7; color: #D97706; }
.geo-cmp-th { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: #1E2B45; }
.geo-cmp-pill { min-width: 68px; height: 22px; }
.geo-card-takeaway .geo-ins { grid-template-columns: 36px minmax(0, 1fr); }

.geo-cmp-cta { background: linear-gradient(120deg, #EDF4FE 0%, #F5F9FE 60%, #EFF5FE 100%); border-color: #D6E4FA; }
.geo-cmp-ctabody { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center;
  gap: 14px; padding: 15px 17px; }
.geo-cmp-ctaicon { width: 44px; height: 44px; border-radius: 12px; background: #E1ECFE; color: #1D63F5;
  display: inline-flex; align-items: center; justify-content: center; }
.geo-cmp-ctatext { display: flex; flex-direction: column; gap: 2px; }
.geo-cmp-ctatitle { font-size: 14.5px; font-weight: 700; color: #101B33; }
.geo-cmp-ctasub { font-size: 12.5px; color: #4B618A; }
.geo-cmp-ctabtn { display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 18px;
  border-radius: 10px; background: #1D63F5; color: #fff; font-size: 13.5px; font-weight: 600; }
.geo-cmp-ctabtn:hover { background: #1550D8; }

@media (max-width: 1400px) {
  .geo-cmp-row2 { grid-template-columns: minmax(0, 1fr) 360px; }
}
@media (max-width: 1180px) {
  .geo-cmp-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .geo-cmp-row2 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .geo-cmp-cards { grid-template-columns: minmax(0, 1fr); }
  .geo-cmp-add { margin-left: 0; }
  .geo-cmp-ctabody { grid-template-columns: 44px minmax(0, 1fr); }
  .geo-cmp-ctabtn { grid-column: 1 / -1; }
}
/* ── Country flags ────────────────────────────────────────────────────
   A flag is either a shipped SVG (3:2) or the country's emoji flag, so no country is ever blank.
   .flag-circle crops either of them into a circle for map bubbles, row avatars and GEO chips. */
.flag-emoji { display: inline-flex; align-items: center; justify-content: center; }
.flag-circle { width: var(--fc-size, 22px); height: var(--fc-size, 22px); border-radius: 50%; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; flex: none; background: var(--color-surface-muted);
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.10); }
.flag-circle .flag-circle-img { width: 100%; height: 100%; object-fit: cover; }
.flag-circle .flag-emoji { font-size: calc(var(--fc-size, 22px) * .78); }
.flag-stack { display: inline-flex; align-items: center; }
.flag-stack .flag-circle + .flag-circle { margin-left: -6px; box-shadow: inset 0 0 0 1px rgba(15,23,42,.10), 0 0 0 2px var(--color-surface); }
/* Map tooltip flag: the emoji fallback sits in the same round 15px box as the SVG version. */
.geo-tip-flag.is-emoji { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px;
  border-radius: 50%; font-size: 13px; line-height: 1; flex: none; }


/* ---- Contacts → Grid view cards (design-reference-new/contacts-grid-view.png) ------------------ */
/* one palette for the card zones, so light and dark stay in step */
.page-contacts { --ctg-rule: #E7EEF8; --ctg-panel: #F4F7FC; --ctg-foot-bg: #F8FAFD; --ctg-label: #64768E; --ctg-faint: #7A869A; }
.ctg-chiprow { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 10px 0 0; }
.ctg-chip { display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 9px 0 11px; border-radius: 6px; background: #E7F0FF; color: #1359C8; font-size: 12.5px; font-weight: 600; text-decoration: none; }
.ctg-chip:hover { background: #D8E7FF; }
.ctg-chip .ctg-ic { color: #6E92D6; }
.ctg-chip:hover .ctg-ic { color: #1359C8; }
.ctg-clear { font-size: 12.5px; font-weight: 600; color: #1668F5; text-decoration: none; margin-left: 2px; }
.ctg-clear:hover { text-decoration: underline; }
.ctg-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 12px 0 4px; }
.ctg-card { position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid #E3EAF5; border-radius: 12px; transition: border-color .14s, box-shadow .14s; }
.ctg-card:hover { border-color: #BBD2F6; box-shadow: 0 6px 18px rgba(26, 61, 122, .09); }
.ctg-card:focus-within { border-color: #7FAAF0; }
.ctg-hit { position: absolute; inset: 0; border-radius: 12px; z-index: 1; }
.ctg-hit:focus-visible { outline: 2px solid var(--color-primary, #1668F5); outline-offset: 2px; }
.ctg-card a:not(.ctg-hit), .ctg-card button { position: relative; z-index: 2; }
/* top half: identity | company + stats, split by a full-height rule */
.ctg-main { display: grid; grid-template-columns: 44% minmax(0, 1fr); }
.ctg-l { display: flex; flex-direction: column; gap: 12px; padding: 13px 15px 13px; border-right: 1px solid var(--ctg-rule); min-width: 0; }
.ctg-r { display: flex; flex-direction: column; gap: 12px; padding: 13px 15px 13px; min-width: 0; }
.ctg-person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ctg-av { flex: none; border-radius: 50%; }
.ctg-person-b { min-width: 0; }
.ctg-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ctg-name b { font-size: 15px; font-weight: 700; color: var(--color-navy, #0D1B3E); letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ctg-primary { flex: none; display: inline-flex; align-items: center; height: 19px; padding: 0 7px; border-radius: 5px; background: #E7F0FF; color: #1668F5; font-size: 11px; font-weight: 600; }
.ctg-role { font-size: 12.5px; color: #5D6E95; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ctg-markets { display: flex; align-items: center; gap: 10px; min-width: 0; margin-top: auto; }
.ctg-mk-label { flex: none; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ctg-label); }
.ctg-mk-chips { display: flex; align-items: center; flex-wrap: nowrap; gap: 5px; min-width: 0; overflow: hidden; }
.ctg-mk { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 20px; border-radius: 4px; background: var(--ctg-panel); flex: none; }
.ctg-mk .flag { border-radius: 2px; flex: none; width: 18px; height: 13px; }
.ctg-mk span { white-space: nowrap; }
.ctg-mk.is-empty { width: auto; padding: 0 8px; font-size: 11.5px; color: var(--ctg-faint); }
.ctg-mk-more { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 20px; padding: 0 5px; border: 0; border-radius: 4px; background: #E7F0FF; color: #1359C8; font: inherit; font-weight: 700; cursor: pointer; }
.ctg-mk-more:hover { background: #D8E7FF; }
.ctg-mk-more { font-size: 10.5px; }
.ctg-mk-rest { display: contents; }
.ctg-mk-chips.is-open { flex-wrap: wrap; overflow: visible; }
/* company row */
.ctg-co { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ctg-co-tile { flex: none; display: inline-flex; }
.ctg-logo { border-radius: 50%; }
.ctg-co-tile.is-none { width: 40px; height: 40px; border-radius: 50%; background: #F1F5FB; color: #8C9CBC; align-items: center; justify-content: center; }
.ctg-co-b { min-width: 0; flex: 1; }
.ctg-co-name { display: block; font-size: 14.5px; font-weight: 700; color: var(--color-navy, #0D1B3E); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ctg-co-name:hover { color: #1668F5; }
.ctg-co-name.is-none { color: #8C9CBC; font-weight: 600; }
.ctg-co-cat { font-size: 12.5px; color: #5D6E95; margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ctg-pill { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px 0 8px; border-radius: 12px; font-size: 12px; font-weight: 600; }
.ctg-dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.ctg-pill.tone-green { background: #E2F7EA; color: #157F3C; }
.ctg-pill.tone-blue { background: #E4EEFE; color: #1359C8; }
.ctg-pill.tone-amber { background: #FDF0DA; color: #A96608; }
.ctg-pill.tone-grey { background: #EEF2F8; color: #55658A; }
.ctg-pill.tone-purple { background: #EFE6FD; color: #6B2FD0; }
.ctg-pill.tone-red { background: #FDE5E8; color: #C42A38; }
.ctg-card .ct-menu > button { width: 30px; height: 26px; border: 1px solid #E3EAF5; border-radius: 7px; background: #fff; color: #46588A; }
.ctg-card .ct-menu > button:hover { background: #F4F7FC; }
/* four-cell stats strip */
.ctg-stats { display: grid; grid-template-columns: .97fr .87fr 1.07fr 1.11fr; margin-top: auto; padding: 9px 2px; border-radius: 9px; background: var(--ctg-panel); }
.ctg-stat { display: flex; flex-direction: column; gap: 2px; padding: 0 10px; border-left: 1px solid var(--ctg-rule); min-width: 0; }
.ctg-stat:first-child { border-left: 0; }
.ctg-stat-v { display: flex; align-items: center; gap: 6px; color: var(--color-navy, #0D1B3E); }
.ctg-stat-v .ctg-ic { color: #46588A; flex: none; }
.ctg-stat-v b { font-size: 15px; font-weight: 700; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ctg-stat-l { font-size: 10.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--ctg-label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* bottom band */
.ctg-foot { display: grid; grid-template-columns: minmax(0, 1fr) 45%; border-top: 1px solid var(--ctg-rule); background: var(--ctg-foot-bg); border-radius: 0 0 11px 11px; }
.ctg-ch { display: flex; align-items: center; gap: 14px; padding: 9px 15px; min-width: 0; }
.ctg-ch-item { display: inline-flex; align-items: center; gap: 4px; min-width: 0; }
.ctg-ch-item.is-mail { min-width: 0; flex: 1; }
.ctg-ch-link { display: inline-flex; align-items: center; gap: 7px; min-width: 0; font-size: 12.5px; color: #33456E; text-decoration: none; }
.ctg-ch-link span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ctg-ch-link:hover { color: #1668F5; }
.ctg-ch-link .ctg-ic { color: #2C8FE0; flex: none; }
.ctg-ch-none { font-size: 12.5px; color: #8C9CBC; }
.ctg-copy { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 5px; background: none; color: #8C9CBC; cursor: pointer; opacity: 0; transition: opacity .12s, background .12s; }
.ctg-ch-item:hover .ctg-copy, .ctg-copy:focus-visible { opacity: 1; }
.ctg-copy:hover { background: #EEF3FA; color: #1668F5; }
.ctg-when { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 15px; border-left: 1px solid var(--ctg-rule); min-width: 0; }
.ctg-when-item { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.ctg-when-item .ctg-ic { color: #2C8FE0; flex: none; }
.ctg-when-b { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.ctg-when-b b { font-size: 12.5px; font-weight: 600; color: var(--color-navy, #0D1B3E); white-space: nowrap; }
.ctg-when-b em { font-style: normal; font-size: 11.5px; color: #6A7CAB; white-space: nowrap; }
.ctg-when-item.is-follow.tone-today .ctg-ic, .ctg-when-item.is-follow.tone-overdue .ctg-ic { color: #E5202E; }
.ctg-when-item.is-follow.tone-today b, .ctg-when-item.is-follow.tone-overdue b { color: #E5202E; }
.ctg-when-item.is-follow.tone-tomorrow .ctg-ic { color: #16A34A; }
.ctg-when-item.is-follow.tone-tomorrow b { color: #157F3C; }
.ctg-when-item.is-follow.tone-later .ctg-ic { color: #1668F5; }
.ctg-when-item.is-follow.tone-none .ctg-ic { color: #9AA8C4; }
.ctg-setone { align-self: flex-start; padding: 0; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 600; color: #1668F5; cursor: pointer; }
.ctg-setone:hover { text-decoration: underline; }
.ctg-empty { grid-column: 1 / -1; }
@media (max-width: 1099px) { .ctg-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
  .ctg-main { grid-template-columns: minmax(0, 1fr); }
  .ctg-l { border-right: 0; border-bottom: 1px solid var(--ctg-rule); }
  .ctg-foot { grid-template-columns: minmax(0, 1fr); }
  .ctg-when { border-left: 0; border-top: 1px solid var(--ctg-rule); }
  .ctg-ch { flex-wrap: wrap; row-gap: 6px; }
  .ctg-copy { opacity: 1; }
  .ctg-hit, .ctg-card a:not(.ctg-hit), .ctg-card button { min-height: 0; }
  .ctg-mk-more, .ctg-copy, .ctg-setone, .ctg-card .ct-menu > button { min-height: 44px; min-width: 44px; }
  .ctg-mk-more { height: 44px; } .ctg-copy { width: 44px; height: 44px; }
}

/* =====================================================================
   Affiliate Accounts → Grid view (design-reference-new/accounts-grid-view.png)
   Header, six-cell stat strip, tabs, filter bar, cards and footer — only when
   the Grid toggle is active. Prefix aag-; dark values in dark-overrides.css.
   ===================================================================== */
.page-accounts .aag { --aag-line: #E3EAF4; --aag-div: #EBF0F7; --aag-ink: #0B1541; --aag-label: #5D6E95; --aag-mono: #16204F; --aag-strip: #F6F9FE; --aag-strip-line: #E6EDF8; --aag-blue: #1A5FE0; --aag-field: #FFFFFF; --aag-card: #FFFFFF; --aag-reset: #C81E3A; }
.page-accounts .aag-top { display: flex; align-items: flex-start; gap: 14px; margin: 2px 0 13px; }
.page-accounts .aag-top-ic { flex: none; width: 40px; height: 40px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: #DDF4E8; color: #12824A; margin-top: 3px; }
.page-accounts .aag-top-t { flex: 1 1 auto; min-width: 0; }
.page-accounts .aag-title { margin: 0; font-size: 27px; font-weight: 700; letter-spacing: -.02em; line-height: 1.15; color: var(--aag-ink); }
.page-accounts .aag-sub { margin: 2px 0 0; font-size: 12.8px; color: var(--aag-label); }
.page-accounts .aag-top-actions { flex: none; display: flex; align-items: center; gap: 12px; padding-top: 4px; }
.page-accounts .aag-btn { display: inline-flex; align-items: center; gap: 9px; height: 37px; padding: 0 16px; border-radius: 9px; border: 1px solid transparent; font-size: 13.5px; font-weight: 600; white-space: nowrap; text-decoration: none; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast); }
.page-accounts .aag-btn-ghost { background: #fff; border-color: var(--aag-line); color: var(--aag-ink); }
.page-accounts .aag-btn-ghost:hover { background: #F4F8FF; border-color: #C9DAF4; }
.page-accounts .aag-btn-primary { background: #1668F5; color: #fff; box-shadow: 0 1px 2px rgba(22,104,245,.25); }
.page-accounts .aag-btn-primary:hover { background: #0F5BDD; }
.page-accounts .aag-headmenu > .btn-icon { width: 33px; height: 33px; border: 1px solid var(--aag-line); border-radius: 9px; background: #fff; color: var(--aag-ink); }


.page-accounts .aag-strip { display: grid; grid-template-columns: 1fr 1fr 1fr 1.08fr 1.2fr 1.95fr; align-items: center; height: 62px; margin-bottom: 20px; padding: 0 6px; border: 1px solid var(--aag-line); border-radius: 12px; background: #fff; }
.page-accounts .aag-s { display: flex; align-items: center; gap: 14px; min-width: 0; padding: 0 16px 0 14px; border-left: 1px solid var(--aag-div); height: 40px; }
.page-accounts .aag-s:first-child { border-left: 0; }
.page-accounts .aag-s > div { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.page-accounts .aag-s b { font-size: 17px; font-weight: 700; color: var(--aag-ink); letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.page-accounts .aag-s span:not(.aag-s-ic):not(.aag-s-chg):not(.aag-spark) { font-size: 12.5px; color: var(--aag-label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.page-accounts .aag-s-ic { flex: none; width: 34px; height: 34px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; }
.page-accounts .aag-s-ic.tone-blue { background: #E4EEFE; color: #1A5FE0; }
.page-accounts .aag-s-ic.tone-green { background: #DDF6E7; color: #0F9A4E; }
.page-accounts .aag-s-ic.tone-amber { background: #FDF0DA; color: #F59E0B; }
.page-accounts .aag-s-ic.tone-red { background: #FDE3E7; color: #E11D2E; }
.page-accounts .aag-s-ic.tone-purple { background: #ECE6FD; color: #6D3AE8; }
.page-accounts .aag-s-rev { gap: 12px; }
.page-accounts .aag-s-chg { flex: none; display: inline-flex; align-items: center; gap: 3px; height: 21px; padding: 0 7px; border-radius: 6px; font-size: 11.5px; font-weight: 700; align-self: flex-end; margin-bottom: 1px; }
.page-accounts .aag-s-chg.is-up { background: #DDF6E7; color: #11703A; }
.page-accounts .aag-s-chg.is-down { background: #FDE3E7; color: #B8182B; }
.page-accounts .aag-spark { flex: none; display: flex; align-items: flex-end; gap: 4px; height: 26px; margin-left: auto; }
.page-accounts .aag-spark i { width: 5px; height: var(--h); border-radius: 1.5px; background: #7BD9A3; }
.page-accounts .aag-spark i.is-now { background: #16A34A; }

.page-accounts .aag-tabs { display: flex; align-items: flex-end; gap: 6px; margin: 0 0 8px; border-bottom: 1px solid var(--aag-div); overflow-x: auto; scrollbar-width: none; }
.page-accounts .aag-tabs::-webkit-scrollbar { display: none; }
.page-accounts .aag-tab { position: relative; display: inline-flex; align-items: center; gap: 9px; height: 31px; padding: 0 14px; border-radius: 8px 8px 0 0; font-size: 12.8px; font-weight: 600; color: var(--aag-ink); white-space: nowrap; text-decoration: none; }
.page-accounts .aag-tab:hover { background: #F2F6FC; }
.page-accounts .aag-tab.is-active { background: #E7F0FD; color: #1A5FE0; }
.page-accounts .aag-tab.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: #1A6BF2; }
.page-accounts .aag-tab-n { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 19px; padding: 0 6px; border-radius: 6px; background: #E8EDF5; color: #34457C; font-size: 11.5px; font-weight: 700; }
.page-accounts .aag-tab.is-active .aag-tab-n { background: #D3E2FB; color: #1450C8; }
.page-accounts .aag-tab-n.tone-red { background: #FDE3E7; color: #B8182B; }

.page-accounts .aag-bar { position: relative; display: flex; align-items: center; gap: 11px; flex-wrap: nowrap; margin-bottom: 10px; }
.page-accounts .aag-bar > * { flex-shrink: 0; }
.page-accounts .aag-search { display: flex; align-items: center; gap: 10px; flex: 0 1 381px; min-width: 190px; height: 33px; padding: 0 12px; border: 1px solid var(--aag-line); border-radius: 8px; background: var(--aag-field); color: #46588A; flex-shrink: 1; }
.page-accounts .aag-search input { flex: 1 1 auto; min-width: 0; border: 0; background: none; outline: none; font: inherit; font-size: 12.5px; color: var(--aag-ink); }
.page-accounts .aag-search input::placeholder { color: #6A7897; }
.page-accounts .aag-search:focus-within { border-color: #9DBDF3; box-shadow: 0 0 0 3px rgba(26,107,242,.12); }
.page-accounts .aag-sel { position: relative; display: inline-flex; align-items: center; height: 33px; border: 1px solid var(--aag-line); border-radius: 8px; background: var(--aag-field); }
.page-accounts .aag-sel select { appearance: none; -webkit-appearance: none; height: 100%; padding: 0 34px 0 12px; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--aag-ink); cursor: pointer; outline: none; }
.page-accounts .aag-sel .aa-select-caret { position: absolute; right: 11px; pointer-events: none; color: #34457C; }
/* the reference sizes each filter to its placeholder, not to its longest option */
.page-accounts .aag-sel select { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.page-accounts .aag-sel select[name=company] { width: 89px; } .page-accounts .aag-sel select[name=geo] { width: 80px; }
.page-accounts .aag-sel select[name=model] { width: 105px; } .page-accounts .aag-sel select[name=status] { width: 88px; }
.page-accounts .aag-sel:focus-within { border-color: #9DBDF3; }
.page-accounts .aag-more { display: inline-flex; align-items: center; gap: 8px; height: 33px; padding: 0 14px; border: 1px solid var(--aag-line); border-radius: 8px; background: var(--aag-field); color: var(--aag-ink); font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.page-accounts .aag-more:hover, .page-accounts .aag-more.is-on { border-color: #A9C4F3; background: #F4F8FF; }
.page-accounts .aag-reset { display: inline-flex; align-items: center; gap: 6px; height: 33px; padding: 0 9px; border: 1px solid transparent; border-radius: 8px; color: var(--aag-reset); font-size: 12.5px; font-weight: 600; white-space: nowrap; text-decoration: none; transition: background var(--t-fast), border-color var(--t-fast); }
.page-accounts .aag-reset .icon { stroke-width: 2.2; }
.page-accounts .aag-reset:hover { background: #FDECEF; border-color: #F9CDD5; }
.page-accounts .aag-reset:focus-visible { outline: 2px solid var(--aag-reset); outline-offset: 2px; }
.page-accounts .aag-gap { flex: 1 1 auto; }
.page-accounts .aag-toggle { display: inline-flex; gap: 8px; }
.page-accounts .aag-viewbtn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 33px; border: 1px solid var(--aag-line); border-radius: 8px; background: var(--aag-field); color: #34457C; }
.page-accounts .aag-viewbtn:hover { background: #F2F6FC; }
.page-accounts .aag-viewbtn.is-active { background: #1A6BF2; border-color: #1A6BF2; color: #fff; }
.page-accounts .aag-sortbtn { display: inline-flex; align-items: center; gap: 6px; height: 33px; padding: 0 12px; border: 1px solid var(--aag-line); border-radius: 8px; background: var(--aag-field); color: var(--aag-ink); font: inherit; font-size: 12.5px; cursor: pointer; }
.page-accounts .aag-sortbtn strong { font-weight: 600; }
.page-accounts .aag-sortbtn .icon { margin-left: 6px; color: #34457C; }
.page-accounts .aag-morebar { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--aag-line); border-radius: 10px; background: #fff; box-shadow: var(--shadow-md); }
.page-accounts .aag-morebar[hidden] { display: none; }
.page-accounts .aag-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: -3px 0 12px; }
.page-accounts .aag-chip { display: inline-flex; align-items: center; gap: 7px; height: 23px; padding: 0 8px 0 10px; border-radius: 6px; background: #E7EFFD; color: #1A56DB; font-size: 11.5px; font-weight: 600; text-decoration: none; }
.page-accounts .aag-chip:hover { background: #D8E5FC; }
.page-accounts .aag-clear { font-size: 11.5px; font-weight: 700; color: #1A56DB; text-decoration: none; }
.page-accounts .aag-clear:hover { text-decoration: underline; }

.page-accounts .aag-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 13px; }
.page-accounts .aag-card { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 8px 15px 10px 16px; border: 1px solid var(--aag-line); border-radius: 12px; background: var(--aag-card); cursor: pointer; transition: border-color .14s, box-shadow .14s; }
.page-accounts .aag-card:hover { border-color: #A3C1F4; box-shadow: 0 4px 16px rgba(26,86,219,.10); }
.page-accounts .aag-card:focus-within { border-color: #A3C1F4; }
.page-accounts .aag-head { display: flex; align-items: flex-start; gap: 16px; min-width: 0; }
.page-accounts .aag-logo { flex: none; display: inline-flex; border-radius: 50%; }
.page-accounts .aag-logo-tile { border-radius: 50% !important; box-shadow: 0 0 0 1px rgba(15,23,42,.06); }
.page-accounts .aag-id { flex: 1 1 auto; min-width: 0; padding-top: 7px; }
.page-accounts .aag-name-row { display: flex; align-items: center; gap: 9px; min-width: 0; }
.page-accounts .aag-name { font-size: 16px; font-weight: 700; letter-spacing: -.01em; color: var(--aag-ink); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-accounts .aag-name:hover { color: #1A5FE0; }
.page-accounts .aag-verified { flex: none; display: inline-flex; color: #16A34A; }
.page-accounts .aag-cat { margin-top: 3px; font-size: 12.5px; color: var(--aag-label); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-accounts .aag-head-r { flex: none; display: flex; align-items: center; gap: 11px; padding-top: 5px; }
.page-accounts .aag-status { display: inline-flex; align-items: center; gap: 7px; height: 25px; padding: 0 11px 0 10px; border-radius: 7px; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.page-accounts .aag-status i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.page-accounts .aag-status.tone-green { background: #DDF6E7; color: #0E7A3C; }
.page-accounts .aag-status.tone-grey { background: #EDF1F7; color: #4B5873; }
.page-accounts .aag-status.tone-amber { background: #FDF0DA; color: #9A5205; }
.page-accounts .aag-card .aa-rowmenu > .btn-icon { width: 32px; height: 27px; border: 1px solid var(--aag-line); border-radius: 7px; background: #fff; color: var(--aag-ink); }
.page-accounts .aag-card .aa-rowmenu > .btn-icon .icon, .page-accounts .aag-headmenu > .btn-icon .icon { transform: scale(1.55); stroke-width: 2.6; }
.page-accounts .aag-card .aa-rowmenu > .btn-icon:hover, .page-accounts .aag-card .aa-rowmenu.is-open > .btn-icon { background: #EFF5FF; border-color: #BCD4F7; color: #1A5FE0; }

.page-accounts .aag-body { display: grid; grid-template-columns: minmax(0, 52%) minmax(0, 1fr); margin-top: 1px; padding-bottom: 6px; border-bottom: 1px solid var(--aag-div); }
.page-accounts .aag-cred { display: grid; grid-template-columns: 74px minmax(0, 1fr); row-gap: 7px; margin: 0; padding: 5px 10px 0 0; border-right: 1px solid var(--aag-div); align-items: center; }
.page-accounts .aag-cred dt { font-size: 12px; color: var(--aag-label); white-space: nowrap; }
.page-accounts .aag-cred dd { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; height: 18px; }
.page-accounts .aag-mono { flex: 1 1 auto; min-width: 0; font-size: 11.5px; font-weight: 500; letter-spacing: -.01em; color: var(--aag-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.page-accounts .aag-secret[data-masked="1"] { font-family: inherit; font-size: 14px; letter-spacing: .08em; color: var(--aag-ink); }
.page-accounts .aag-acts { flex: none; display: inline-flex; align-items: center; gap: 8px; }
.page-accounts .aag-copy { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 5px; background: none; color: #34457C; cursor: pointer; }
.page-accounts .aag-copy:hover { background: #EFF5FF; color: #1A5FE0; }
.page-accounts .aag-copy:focus-visible { outline: 2px solid #1A6BF2; outline-offset: 1px; }
.page-accounts .aag-copy:disabled { opacity: .5; cursor: progress; }
.page-accounts .aag-none { font-size: 11.5px; color: var(--aag-label); }
.page-accounts .aag-deal { display: flex; flex-direction: column; min-width: 0; padding: 2px 0 0 16px; }
.page-accounts .aag-lbl { font-size: 11.2px; color: var(--aag-label); line-height: 1.3; }
.page-accounts .aag-lbl-geo { margin-top: 5px; }
.page-accounts .aag-terms { display: flex; align-items: center; gap: 12px; margin-top: 1px; min-width: 0; }
.page-accounts .aag-terms b { font-size: 13.5px; font-weight: 700; color: var(--aag-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.page-accounts .aag-pill { flex: none; display: inline-flex; align-items: center; height: 21px; padding: 0 10px; border-radius: 6px; font-size: 12px; font-weight: 600; white-space: nowrap; margin-left: auto; }
.page-accounts .aag-pill.tone-amber { background: #FEF3E0; color: #B2560A; }
.page-accounts .aag-pill.tone-blue { background: #E6EFFE; color: #1A56DB; }
.page-accounts .aag-pill.tone-red { background: #FDE6E8; color: #C81E2E; }
.page-accounts .aag-pill.tone-purple { background: #F0E9FE; color: #6424CC; }
.page-accounts .aag-pill.tone-teal { background: #DFF5F3; color: #0F6B64; }
.page-accounts .aag-geo { display: flex; align-items: center; gap: 12px; margin-top: 3px; min-width: 0; font-size: 12.5px; color: var(--aag-ink); }
.page-accounts .aag-geo .flag { width: 21px !important; height: 14px !important; border-radius: 2px; box-shadow: 0 0 0 1px rgba(15,23,42,.07); flex: none; }
.page-accounts .aag-geo span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-accounts .aag-geo em { flex: none; font-style: normal; font-size: 11px; font-weight: 700; color: #1A56DB; background: #E7EFFD; border-radius: 5px; padding: 1px 5px; }

.page-accounts .aag-links { display: grid; grid-template-columns: 1fr 1fr; margin: 6px 0 0; border-radius: 9px; background: var(--aag-strip); }
.page-accounts .aag-link { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 7px 10px 7px 10px; }
.page-accounts .aag-link + .aag-link { border-left: 1px solid var(--aag-strip-line); }
.page-accounts .aag-link-t { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; line-height: 1.35; }
.page-accounts .aag-link-t span { font-size: 11.5px; color: var(--aag-ink); }
.page-accounts .aag-link-t a { font-size: 12px; color: #1A5FE0; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-accounts .aag-link-t a:hover { text-decoration: underline; }
.page-accounts .aag-link-t em { font-style: normal; font-size: 12px; color: var(--aag-label); }
.page-accounts .aag-copybtn { flex: none; height: 25px; padding: 0 12px; border: 0; border-radius: 6px; background: #E3EDFE; color: #1A5FE0; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.page-accounts .aag-copybtn:hover { background: #D3E3FD; }
.page-accounts .aag-copybtn:focus-visible { outline: 2px solid #1A6BF2; outline-offset: 1px; }

.page-accounts .aag-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 6px; padding: 6px 0 5px; border-top: 1px solid var(--aag-div); border-bottom: 1px solid var(--aag-div); }
.page-accounts .aag-m { display: flex; flex-direction: column; min-width: 0; padding: 0 12px; border-left: 1px solid var(--aag-div); }
.page-accounts .aag-m:first-child { padding-left: 0; border-left: 0; }
.page-accounts .aag-m-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.page-accounts .aag-m-top b { font-size: 14px; font-weight: 700; color: var(--aag-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.page-accounts .aag-m-l { font-size: 11.5px; color: var(--aag-label); margin-top: 1px; }
.page-accounts .aag-trend { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.page-accounts .aag-trend.is-up { color: #15803D; }
.page-accounts .aag-trend.is-down { color: #DC2626; }

.page-accounts .aag-mgr { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; padding: 6px 0 3px; }
.page-accounts .aag-mgr-p { display: flex; align-items: center; gap: 12px; min-width: 0; }
.page-accounts .aag-av { flex: none; }
.page-accounts .aag-mgr-t { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.page-accounts .aag-mgr-t b { font-size: 12px; font-weight: 700; color: var(--aag-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-accounts .aag-mgr-t span { font-size: 11px; color: var(--aag-label); white-space: nowrap; }
.page-accounts .aag-tg { flex: 0 1 auto; min-width: 0; display: inline-flex; align-items: center; gap: 8px; height: 27px; padding: 0 9px 0 4px; border: 1px solid var(--aag-line); border-radius: 8px; background: #fff; margin-right: auto; margin-left: 22px; }
.page-accounts .aag-tg-link { display: inline-flex; align-items: center; gap: 8px; min-width: 0; font-size: 12px; color: var(--aag-ink); text-decoration: none; }
.page-accounts .aag-tg-link span:last-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-accounts .aag-tg-link:hover { color: #1A5FE0; }
.page-accounts .aag-tg-ic { flex: none; width: 20px; height: 20px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #229ED9; }
.page-accounts .aag-tg .aag-copy { color: #1A5FE0; }

.page-accounts .aag-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; margin-top: auto; padding-top: 2px; }
.page-accounts .aag-last { font-size: 11.5px; color: var(--aag-label); white-space: nowrap; }
.page-accounts .aag-data { display: inline-flex; align-items: center; gap: 7px; height: 22px; padding: 0 10px 0 9px; border-radius: 6px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.page-accounts .aag-data i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 2px rgba(22,163,74,.18); }
.page-accounts .aag-data .icon { width: 12px; height: 12px; stroke-width: 2.3; }
.page-accounts .aag-data.tone-green { background: #DDF6E7; color: #11703A; }
.page-accounts .aag-data.tone-amber { background: #FDF0DA; color: #9A5205; }
.page-accounts .aag-data.tone-red { background: #FDE3E7; color: #B8182B; }
.page-accounts .aag-view { display: inline-flex; align-items: center; gap: 9px; font-size: 12.5px; font-weight: 700; color: #1A5FE0; text-decoration: none; white-space: nowrap; }
.page-accounts .aag-view .icon { stroke-width: 2.3; }
.page-accounts .aag-view:hover { text-decoration: underline; }
.page-accounts .aag-empty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 48px 0; text-align: center; color: var(--aag-label); }
.page-accounts .aag-empty h2 { margin: 0; font-size: 16px; color: var(--aag-ink); }

.page-accounts .aag-foot-bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; padding: 16px 2px 4px; }
.page-accounts .aag-showing { font-size: 12.5px; color: var(--aag-label); }
.page-accounts .aag-pager { display: flex; align-items: center; gap: 8px; }
.page-accounts .aag-page { display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 27px; padding: 0 6px; border: 1px solid var(--aag-line); border-radius: 7px; background: #fff; color: var(--aag-ink); font-size: 12.5px; font-weight: 600; text-decoration: none; }
.page-accounts .aag-page:hover { background: #F2F6FC; }
.page-accounts .aag-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
.page-accounts .aag-page.is-disabled { opacity: .45; pointer-events: none; }
.page-accounts .aag-page-gap { color: var(--aag-label); }
.page-accounts .aag-per { justify-self: end; display: inline-flex; align-items: center; gap: 12px; font-size: 12.5px; color: var(--aag-label); }
.page-accounts .aag-per-sel { position: relative; display: inline-flex; align-items: center; height: 31px; border: 1px solid var(--aag-line); border-radius: 8px; background: #fff; }
.page-accounts .aag-per-sel select { appearance: none; -webkit-appearance: none; height: 100%; padding: 0 30px 0 13px; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 700; color: var(--aag-ink); cursor: pointer; }
.page-accounts .aag-per-sel .aa-select-caret { position: absolute; right: 9px; pointer-events: none; }

/* 3 → 2 → 1 */
@media (max-width: 1439px) { .page-accounts .aag-bar { flex-wrap: wrap; } .page-accounts .aag-search { flex: 1 1 280px; } .page-accounts .aag-gap { display: none; } .page-accounts .aag-toggle { margin-left: auto; } }
@media (max-width: 1365px) {
  .page-accounts .aag-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-accounts .aag-strip { grid-template-columns: repeat(3, 1fr); height: auto; padding: 8px 6px; row-gap: 10px; }
  .page-accounts .aag-s:nth-child(4) { border-left: 0; }
}
@media (max-width: 899px) {
  .page-accounts .aag-grid { grid-template-columns: minmax(0, 1fr); }
  .page-accounts .aag-top { flex-wrap: wrap; }
  .page-accounts .aag-top-actions { width: 100%; }
  .page-accounts .aag-foot-bar { grid-template-columns: 1fr; justify-items: center; }
  .page-accounts .aag-per { justify-self: center; }
}
@media (max-width: 560px) {
  .page-accounts .aag-strip { grid-template-columns: repeat(2, 1fr); }
  .page-accounts .aag-s:nth-child(odd) { border-left: 0; } .page-accounts .aag-s:nth-child(even) { border-left: 1px solid var(--aag-div); }
  .page-accounts .aag-s-rev { grid-column: 1 / -1; border-left: 0 !important; }
  .page-accounts .aag-body { grid-template-columns: minmax(0, 1fr); }
  .page-accounts .aag-cred { padding-right: 0; border-right: 0; padding-bottom: 8px; border-bottom: 1px solid var(--aag-div); }
  .page-accounts .aag-deal { padding: 8px 0 0; }
  .page-accounts .aag-links { grid-template-columns: minmax(0, 1fr); }
  .page-accounts .aag-link + .aag-link { border-left: 0; border-top: 1px solid var(--aag-strip-line); }
  .page-accounts .aag-mgr { flex-wrap: wrap; }
  .page-accounts .aag-tg { margin-left: 0; }
  .page-accounts .aag-foot { flex-wrap: wrap; }
  .page-accounts .aag-top-actions { flex-wrap: wrap; }
}
@media (hover: none) {
  .page-accounts .aag-copy { width: 32px; height: 32px; }
  .page-accounts .aag-cred dd { height: 32px; }
  .page-accounts .aag-card .aa-rowmenu > .btn-icon { width: 40px; height: 36px; }
}


/* ── Affiliate account · payout, promo codes, e-mail and the Players tab (player reports) ───────────── */
.aa-fb-v.is-email { font-size: 13.5px; }
.aa-chip-pay { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 999px; background: #EAF3FF; color: #1554C0; font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.aa-chip-pay.is-lg { height: 28px; font-size: 13px; }
.aa-chip-pay em { font-style: normal; font-weight: 500; color: #4A6A9A; }
.aa-pay-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.aa-pay-grid .aa-f { display: flex; flex-direction: column; gap: 6px; }
.aa-hint { font-size: 12px; color: #667499; }
.aa-pay-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--cmp-line); flex-wrap: wrap; }
.aa-pay-life { display: flex; align-items: center; gap: 12px; flex: 1 1 320px; min-width: 0; }
.aa-pay-life-ic { width: 40px; height: 40px; flex: none; border-radius: 50%; background: #ECFDF5; color: #0B7B3C; display: inline-flex; align-items: center; justify-content: center; }
.aa-pay-life > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.aa-pay-life-l { font-size: 12.5px; color: #667499; }
.aa-pay-life-v { font-size: 18px; font-weight: 700; color: var(--cmp-navy); line-height: 1.15; }
.aa-pay-life-s { font-size: 12px; color: #667499; }
.aa-viewall.is-tight { margin-top: 0; }
.aa-form-actions.is-inline { margin-top: 0; }
.aa-promo-code { font-family: inherit; font-size: 13.5px; font-weight: 700; letter-spacing: .04em; color: var(--cmp-navy); background: #F1F5FB; border: 1px solid #E1EAF7; border-radius: 6px; padding: 2px 8px; }
.aa-promo.is-off { opacity: .62; }
.aa-promo-seen { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 4px; padding: 10px 12px; border-radius: 10px; background: #FFF8E8; color: #8F590B; font-size: 12.5px; }
.aa-promo-seen-btn { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 9px; border-radius: 999px; border: 1px solid #F1D9A6; background: #fff; color: #8F590B; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.aa-promo-seen-btn:hover { background: #FDF0D5; }
.plr-bar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.plr-bar-l, .plr-bar-r { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.plr-meta { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--cmp-navy); min-width: 0; }
.plr-meta em { font-style: normal; color: #667499; }
.plr-tiles { grid-template-columns: repeat(5, 1fr); }
.plr-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 14px; margin-bottom: 14px; background: #fff; border: 1px solid var(--cmp-line); border-radius: 12px; }
.plr-sel { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 10px; border: 1px solid var(--cmp-line); border-radius: 9px; background: #F8FAFD; color: var(--cmp-navy); font-size: 13px; }
.plr-sel select { appearance: none; -webkit-appearance: none; border: 0; background: transparent; font: inherit; color: inherit; padding-right: 4px; max-width: 200px; }
.plr-check { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--cmp-navy); cursor: pointer; }
.plr-check.is-modal { margin-top: 10px; }
.plr-check.is-hot span { color: #B42318; font-weight: 700; }
.plr-search { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 10px; border: 1px solid var(--cmp-line); border-radius: 9px; background: #fff; color: #667499; flex: 1 1 220px; min-width: 180px; }
.plr-search input { border: 0; background: transparent; font: inherit; color: var(--cmp-navy); width: 100%; outline: 0; }
.plr-cols { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); margin-bottom: 14px; align-items: start; }
.plr-cols.is-even { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.plr-chart { min-height: 220px; }
.plr-mini { width: 100%; border-collapse: collapse; font-size: 13px; }
.plr-mini th { text-align: left; font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #667499; padding: 6px 8px; border-bottom: 1px solid var(--cmp-line); }
.plr-mini td { padding: 8px; border-bottom: 1px solid #EEF2F8; color: var(--cmp-navy); vertical-align: middle; }
.plr-mini tr:last-child td { border-bottom: 0; }
.plr-mini .is-num, .plr-table .is-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.plr-mini tr.is-on td { background: #F3F7FE; }
.plr-mini td small, .plr-table small.plr-sub { display: block; font-size: 11.5px; color: #667499; margin-top: 1px; }
.plr-mini code, .plr-table code { font-family: inherit; font-weight: 700; color: var(--cmp-navy); }
.plr-link { color: inherit; text-decoration: none; }
.plr-link:hover code, .plr-link:hover span { color: var(--cmp-blue); }
.plr-geo { display: inline-flex; align-items: center; gap: 7px; }
.plr-none { color: #667499; text-align: center; padding: 18px 8px !important; }
.plr-total td { border-top: 2px solid var(--cmp-line); background: #F8FAFD; }
.is-neg { color: #B42318 !important; }
.plr-table-panel { margin-bottom: 14px; }
.plr-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 980px; }
.plr-table th { text-align: left; font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #667499; padding: 8px 10px; border-bottom: 1px solid var(--cmp-line); white-space: nowrap; }
.plr-table th.is-sorted .plr-th { color: var(--cmp-blue); }
.plr-th { display: inline-flex; align-items: center; gap: 4px; color: inherit; text-decoration: none; }
.plr-table td { padding: 9px 10px; border-bottom: 1px solid #EEF2F8; color: var(--cmp-navy); vertical-align: top; }
.plr-table tr.is-blocked td { opacity: .6; }
.plr-pid { display: inline-flex; align-items: center; gap: 6px; }
.plr-history { display: flex; flex-wrap: wrap; gap: 10px; }
.plr-hist { display: flex; flex-direction: column; gap: 3px; padding: 10px 14px; border: 1px solid var(--cmp-line); border-radius: 10px; background: #F8FAFD; color: var(--cmp-navy); text-decoration: none; min-width: 200px; }
.plr-hist span { font-size: 12.5px; color: #667499; }
.plr-hist.is-on { border-color: var(--cmp-blue); background: #F3F7FE; }
.dropdown-item.is-muted { color: #667499; cursor: default; }
.cmp-kv-sub { font-size: 12px; color: #667499; font-weight: 500; }
.aa-status-cell { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.aa-chip-pay.is-sm { height: 20px; padding: 0 7px; font-size: 11px; }
.rp-plr-list { display: flex; flex-direction: column; gap: 10px; }
@media (max-width: 1279px) { .plr-tiles { grid-template-columns: repeat(3, 1fr); } .plr-cols, .plr-cols.is-even { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) { .plr-tiles { grid-template-columns: repeat(2, 1fr); } .aa-pay-grid { grid-template-columns: 1fr; } .plr-search { flex-basis: 100%; } }

/* Reports → Players tab */
.rp-plr-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.rp-btn-soft.is-on { background: #EAF3FF; color: #1554C0; border-color: #BFD6F7; }
.rp-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.page-reports .rp-block { margin-bottom: 16px; overflow: visible; }
.rp-two .rp-block { margin-bottom: 0; }
.rp-brandcell { display: flex; align-items: center; gap: 10px; }
.rp-brandcell small { display: block; font-size: 11.5px; color: #667499; }
.rp-link { color: inherit; text-decoration: none; }
.rp-link:hover { color: var(--cmp-blue); }
.rp-table .is-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 1023px) { .rp-two { grid-template-columns: minmax(0, 1fr); } }

/* Demo site strip (above the topbar while browsing /demo/) */
.demo-bar { display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 6px 16px; background: #FFF4D6; color: #7A4B00; border-bottom: 1px solid #F1D9A6; font-size: 13px; }
.demo-bar strong { font-weight: 700; }
.demo-bar span { flex: 1; min-width: 0; }
.demo-bar a { display: inline-flex; align-items: center; gap: 5px; color: #1554C0; font-weight: 600; text-decoration: none; white-space: nowrap; }
.demo-card-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.demo-step { padding: 14px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); }
.demo-step strong { display: block; margin-bottom: 4px; }
.demo-step span { font-size: 13px; color: var(--color-text-muted); }
.demo-status { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 12px 0; font-size: 13.5px; }
@media (max-width: 767px) { .demo-card-steps { grid-template-columns: 1fr; } .demo-bar span { display: none; } }

/* Dashboard · Payments Received (weekly) */
.dash-pay { margin-bottom: 20px; }
.dash-pay-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; padding: 4px 0 14px; }
.dash-pay-tile { padding: 12px 14px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface-2, #F8FAFD); display: flex; flex-direction: column; gap: 2px; }
.dash-pay-tile span { font-size: 12px; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-pay-tile strong { font-size: 20px; font-weight: 700; color: var(--color-text); line-height: 1.15; }
.dash-pay-tile small { font-size: 11.5px; color: var(--color-text-faint); }
.dash-pay-tile.is-co { background: #EEF5FF; border-color: #D5E4FA; }
.dash-pay-table tr.dash-pay-week td { background: #F3F7FE; font-weight: 600; color: var(--color-text); padding-top: 9px; padding-bottom: 9px; }
.dash-pay-table tr.dash-pay-week td .icon { vertical-align: -2px; margin-right: 4px; color: var(--color-primary); }
.dash-pay-co { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
/* all-time total under an account's Monthly Performance table */
.aa-mtable tfoot td { border-top: 1px solid var(--color-border); background: var(--color-surface-2, #F7FAFF); font-weight: 700; color: var(--color-text); padding-top: 10px; padding-bottom: 10px; }
.aa-mtable tfoot .c-month { display: flex; flex-direction: column; gap: 1px; }
.aa-mtable tfoot .c-month small { font-size: 11px; font-weight: 500; color: var(--color-text-faint); }
.page-company-profile .data-table tfoot td { border-top: 1px solid var(--color-border); background: var(--color-surface-2, #F7FAFF); }
.page-company-profile .data-table tfoot tr.is-paid td { border-top: 0; color: var(--color-text-muted); font-weight: 600; }
.empty-state.is-compact { padding: 22px; }

/* ==== DARK THEME · generated by tools-dev/build-dark.php — do not edit by hand ==== */
:root[data-theme="dark"] { --color-bg: #0D1218; --color-surface: #181F28; --color-surface-muted: #0D1218; --color-surface-hover: #0D1218; --color-border: #12181E; --color-border-strong: #3C5067; --color-divider: #12181E; --color-text: #E2E4E9; --color-text-secondary: #6A82A3; --color-text-muted: #75849B; --color-text-faint: #8A94A6; --color-sidebar: #E2E5E9; --color-sidebar-text: #A9B5C6; --color-sidebar-active: #3E89F1; --color-sidebar-promo: #E2E5E9; --color-primary: #5484EF; --color-primary-hover: #426DE6; --color-primary-active: #2650DA; --color-primary-soft: #0D1218; --color-primary-soft-2: #12171E; --color-primary-text: #426DE6; --color-navy: #E2E4E9; --color-navy-hover: #E2E5E9; --color-success: #1CD05E; --color-success-hover: #78E9A2; --color-success-soft: #121E16; --color-success-text: #78E9A2; --color-warning: #F1B042; --color-warning-soft: #564D29; --color-warning-text: #DF6A11; --color-danger: #F37373; --color-danger-hover: #E35252; --color-danger-soft: #1E1212; --color-danger-text: #DF2929; --color-info: #3AB8F0; --color-info-soft: #12191E; --color-info-text: #74CCFC; --color-purple: #9B69F1; --color-purple-soft: #0F0D18; --color-purple-text: #8A53E1; --color-orange: #F29250; --color-orange-soft: #1E1912; --color-orange-text: #ED5314; --color-pink: #F176B3; --color-pink-soft: #1E1219; --color-pink-text: #E42574; --color-teal: #19E6CF; --color-teal-soft: #29564D; --color-teal-text: #66EBE1; --color-slate: #7F8EA3; --color-slate-soft: #12171E; --color-slate-text: #E2E5E9; --color-auth-primary: #6DFACE; --color-auth-primary-hover: #4FF9C9; --shadow-xs: 0 1px 2px rgba(0,0,0,0.28); --shadow-sm: 0 1px 3px rgba(0,0,0,0.28), 0 1px 2px rgba(0,0,0,0.28); --shadow-md: 0 4px 12px rgba(0,0,0,0.28); --shadow-lg: 0 12px 32px rgba(0,0,0,0.364); --shadow-xl: 0 24px 64px rgba(0,0,0,0.624); --focus-ring: 0 0 0 3px rgba(84,132,239,0.35); --chart-grid: #0D1118; --chart-grid-zero: #12171E; --chart-grid-v: #0D1118; --chart-grid-strong: #12171E; --chart-geo-4: #2650DA; --chart-geo-3: #5484EF; --chart-geo-2: #7AB1F5; --chart-geo-1: #293D56; --chart-geo-0: #12171E; --chart-track: #12171E; --chart-ring-track: #12171E; --chart-crosshair: #3C5067; --chart-prev-line: #2A3B55; --chart-prev-dot: #354B6E; --chart-grey: #384D6C; --chart-bar-soft: #293956; --chart-bar-soft-2: #332956; --chart-dot-ring: #181F28; --chart-axis: #7F8EA3; --archive-hl: #F1B042; --archive-hl-bg: rgba(241,176,66,0.14); --kf-tile-card: #181F28; --kf-tile-card-border: #12171E; --kf-tile-neutral: #12171E; --kf-tile-neutral-ink: #9BA9BC; --kf-tile-mint: #29563F; --kf-tile-mint-ink: #85F3CC; --kf-tile-steel: #12171E; --kf-tile-slate: #A9B5C6; --kf-folder-inner: #0D1218; }
[data-theme="dark"] body { color: var(--color-text); background: var(--color-bg); }
[data-theme="dark"] a { color: var(--color-primary-text); }
[data-theme="dark"] button { color: inherit; background: none; border: 0; }
[data-theme="dark"] input, [data-theme="dark"] select, [data-theme="dark"] textarea { color: inherit; }
[data-theme="dark"] .icon { fill: none; stroke: currentColor; }
[data-theme="dark"] .icon.brand-icon { stroke: none; fill: currentColor; }
[data-theme="dark"] img.icon { fill: none; stroke: none; }
[data-theme="dark"] .skip-link { background: var(--color-navy); color: #fff; }
[data-theme="dark"] :focus-visible { outline: none; box-shadow: var(--focus-ring); }
[data-theme="dark"] ::selection { background: var(--color-primary-soft-2); }
[data-theme="dark"] .text-muted { color: var(--color-text-muted); }
[data-theme="dark"] .text-secondary { color: var(--color-text-secondary); }
[data-theme="dark"] .text-faint { color: var(--color-text-faint); }
[data-theme="dark"] .text-primary { color: var(--color-primary-text); }
[data-theme="dark"] .text-green, [data-theme="dark"] .text-success { color: var(--color-success-text); }
[data-theme="dark"] .text-red, [data-theme="dark"] .text-danger { color: var(--color-danger-text); }
[data-theme="dark"] .text-amber, [data-theme="dark"] .text-warning { color: var(--color-warning-text); }
[data-theme="dark"] .text-purple { color: var(--color-purple-text); }
[data-theme="dark"] .text-blue { color: var(--color-primary-text); }
[data-theme="dark"] .page-content:focus { box-shadow: none; }
[data-theme="dark"] .sidebar { background: var(--color-sidebar); color: #fff; }
[data-theme="dark"] .brand-link { color: #fff; }
[data-theme="dark"] .brand-tag { color: var(--color-sidebar-text); }
[data-theme="dark"] .sidebar-close { color: var(--color-sidebar-text); }
[data-theme="dark"] .nav-item { color: var(--color-sidebar-text); color: #D2DCE8; }
[data-theme="dark"] .nav-item:hover { background: var(--color-sidebar-hover); color: #fff; }
[data-theme="dark"] .nav-item.is-active { background: var(--color-sidebar-active); color: #fff; box-shadow: 0 6px 14px rgba(0,105,252,.32); }
[data-theme="dark"] .nav-badge { background: var(--color-danger); color: #fff; }
[data-theme="dark"] .sidebar-promo { background: var(--color-sidebar-promo); border: 1px solid var(--color-sidebar-border); border: 1px solid rgba(255,255,255,.09); }
[data-theme="dark"] .promo-text { color: #fff; }
[data-theme="dark"] .promo-text span:last-child { color: var(--color-sidebar-text); color: #fff; }
[data-theme="dark"] .promo-lines { color: var(--color-sidebar-text); color: #C8D4E2; }
[data-theme="dark"] .promo-lines li::before { background: var(--color-primary); }
[data-theme="dark"] .sidebar-user { border-top: 1px solid var(--color-sidebar-border); border-top: 0; }
[data-theme="dark"] .user-row { color: #fff; }
[data-theme="dark"] .user-row:hover { background: var(--color-sidebar-hover); }
[data-theme="dark"] .user-role { color: var(--color-sidebar-text); }
[data-theme="dark"] .user-chevron { color: var(--color-sidebar-text); color: #527398; }
[data-theme="dark"] .sidebar-collapse { background: #fff; color: var(--color-text-secondary); border: 1px solid var(--color-border); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .sidebar-backdrop { background: rgba(15,23,42,.5); }
[data-theme="dark"] body.sidebar-collapsed .nav-item:hover::after { background: var(--color-navy); color: #fff; box-shadow: var(--shadow-md); }
[data-theme="dark"] .topbar { background: var(--color-surface); border-bottom: 1px solid var(--color-border); background: #0D1218; border-bottom: 1px solid #32455D; }
[data-theme="dark"] .topbar.is-scrolled { background: rgba(13,18,24,0.92); border-bottom-color: var(--color-border); }
[data-theme="dark"] .topbar-search { background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text-faint); background: #0D1218; border-color: #32435D; }
[data-theme="dark"] .topbar-search:hover { border-color: var(--color-border-strong); }
[data-theme="dark"] .topbar-search .icon { color: var(--color-text-muted); color: #A2AFC3; }
[data-theme="dark"] .topbar-search-text { color: var(--color-text-secondary); color: #A4AFC1; }
[data-theme="dark"] kbd { color: var(--color-text-secondary); background: var(--color-surface-muted); border: 1px solid var(--color-border); }
[data-theme="dark"] .period-select { background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text); background: #181F28; border: 1px solid #32445D; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .period-select .icon { color: var(--color-text-secondary); color: #7394DE; }
[data-theme="dark"] .period-input { border: 0; background: transparent; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); color: #E2E5E9; }
[data-theme="dark"] .period-input:focus { box-shadow: none; }
[data-theme="dark"] .topbar-bell.has-unread:not(.has-count)::after { background: var(--color-danger); border: 2px solid var(--color-surface); border-color: #2B3D50; }
[data-theme="dark"] .topbar-bell .bell-count { background: var(--color-danger); color: #fff; border: 2px solid var(--color-bg); }
[data-theme="dark"] .topbar-bell.has-count .icon { color: var(--color-primary); }
[data-theme="dark"] .topbar-user-meta .user-name { color: var(--color-text); color: #E2E4E9; }
[data-theme="dark"] .topbar-user-meta .user-role { color: var(--color-text-secondary); color: #A6B0BF; }
[data-theme="dark"] .page-icon { background: var(--color-primary-soft-2); color: var(--color-primary); }
[data-theme="dark"] .page-icon.tone-green { background: var(--color-success-soft); color: var(--color-success); }
[data-theme="dark"] .eyebrow { color: var(--color-text-muted); }
[data-theme="dark"] .page-title { color: var(--color-text); }
[data-theme="dark"] .page-title .wave { color: var(--color-warning); }
[data-theme="dark"] .page-subtitle { color: var(--color-text-secondary); }
[data-theme="dark"] .page-meta { color: var(--color-text-muted); }
[data-theme="dark"] .top-tabs { border-bottom: 1px solid var(--color-border); }
[data-theme="dark"] .top-tabs a { color: var(--color-text-secondary); border-bottom: 2px solid transparent; }
[data-theme="dark"] .top-tabs a:hover { color: var(--color-text); }
[data-theme="dark"] .top-tabs a.is-active { color: var(--color-primary-text); border-bottom-color: var(--color-primary); }
[data-theme="dark"] .card { background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow-xs); }
[data-theme="dark"] .card-head.bordered { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .card-title .muted { color: var(--color-text-muted); }
[data-theme="dark"] .card-sub { color: var(--color-text-muted); color: #A2B0C3; }
[data-theme="dark"] .card-link { color: var(--color-primary-text); }
[data-theme="dark"] .card-foot { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .card.tinted-blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .card.tinted-green { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .card.tinted-red { background: #180D0D; border-color: #5D3232; }
[data-theme="dark"] .chip-stat.tinted-green { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .chip-stat.tinted-red { background: #180D0D; border-color: #5D3232; }
[data-theme="dark"] .chip-stat.tinted-amber { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .chip-stat.tinted-blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .card.tinted-amber { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .kpi { background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow-xs); }
[data-theme="dark"] .kpi-label { color: var(--color-text-secondary); }
[data-theme="dark"] .kpi-value { color: var(--color-text); }
[data-theme="dark"] .kpi-sub { color: var(--color-text-muted); }
[data-theme="dark"] .kpi.kpi-tinted { border-color: transparent; }
[data-theme="dark"] .kpi.kpi-tinted.tone-green { background: linear-gradient(180deg, #0D1810, #181F28); border-color: #325D41; }
[data-theme="dark"] .kpi.kpi-tinted.tone-blue { background: linear-gradient(180deg, #0D1218, #181F28); border-color: #32445D; }
[data-theme="dark"] .kpi.kpi-tinted.tone-purple { background: linear-gradient(180deg, #0F0D18, #181F28); border-color: #322B50; }
[data-theme="dark"] .kpi.kpi-tinted.tone-amber { background: linear-gradient(180deg, #18150D, #181F28); border-color: #5D5432; }
[data-theme="dark"] .kpi.kpi-tinted.tone-red { background: linear-gradient(180deg, #180D0D, #181F28); border-color: #5D3232; }
[data-theme="dark"] .tone-blue { background: var(--color-primary-soft-2); color: var(--color-primary); }
[data-theme="dark"] .tone-green { background: var(--color-success-soft); color: var(--color-success); }
[data-theme="dark"] .tone-amber { background: var(--color-warning-soft); color: var(--color-warning-text); }
[data-theme="dark"] .tone-red { background: var(--color-danger-soft); color: var(--color-danger); }
[data-theme="dark"] .tone-purple { background: var(--color-purple-soft); color: var(--color-purple); }
[data-theme="dark"] .tone-info, [data-theme="dark"] .tone-sky { background: var(--color-info-soft); color: var(--color-info); }
[data-theme="dark"] .tone-orange { background: var(--color-orange-soft); color: var(--color-orange); }
[data-theme="dark"] .tone-pink { background: var(--color-pink-soft); color: var(--color-pink); }
[data-theme="dark"] .tone-teal { background: var(--color-teal-soft); color: var(--color-teal-text); }
[data-theme="dark"] .tone-grey, [data-theme="dark"] .tone-slate { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .tone-navy { background: var(--color-navy); color: #fff; }
[data-theme="dark"] .dot { background: var(--color-text-faint); }
[data-theme="dark"] .dot-green { background: var(--color-success); }
[data-theme="dark"] .dot-red { background: var(--color-danger); }
[data-theme="dark"] .dot-amber { background: var(--color-warning); }
[data-theme="dark"] .dot-blue { background: var(--color-primary); }
[data-theme="dark"] .dot-purple { background: var(--color-purple); }
[data-theme="dark"] .dot-grey { background: var(--color-border-strong); }
[data-theme="dark"] .dot-teal { background: var(--color-teal); }
[data-theme="dark"] .dot-orange { background: var(--color-orange); }
[data-theme="dark"] .dot-pink { background: var(--color-pink); }
[data-theme="dark"] .dot-sky { background: var(--color-info); }
[data-theme="dark"] .btn { border: 1px solid transparent; }
[data-theme="dark"] .btn-primary { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .btn-primary:hover { background: var(--color-primary-hover); }
[data-theme="dark"] .btn-primary:active { background: var(--color-primary-active); }
[data-theme="dark"] .btn-dark, [data-theme="dark"] .btn-navy { background: var(--color-navy); color: #fff; }
[data-theme="dark"] .btn-dark:hover, [data-theme="dark"] .btn-navy:hover { background: var(--color-navy-hover); }
[data-theme="dark"] .btn-secondary { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
[data-theme="dark"] .btn-secondary:hover { background: var(--color-surface-hover); border-color: var(--color-border-strong); }
[data-theme="dark"] .btn-success { background: #0E7A37; color: #fff; }
[data-theme="dark"] .btn-success:hover { background: var(--color-success-hover); }
[data-theme="dark"] .btn-danger { background: var(--color-danger); color: #fff; }
[data-theme="dark"] .btn-danger:hover { background: var(--color-danger-hover); }
[data-theme="dark"] .btn-danger-outline { background: var(--color-surface); color: var(--color-danger-text); border-color: #5D3232; }
[data-theme="dark"] .btn-danger-outline:hover { background: var(--color-danger-soft); }
[data-theme="dark"] .btn-ghost { background: transparent; color: var(--color-primary-text); }
[data-theme="dark"] .btn-ghost:hover { background: var(--color-primary-soft); }
[data-theme="dark"] .btn-soft { background: var(--color-primary-soft); color: var(--color-primary-text); }
[data-theme="dark"] .btn-soft:hover { background: var(--color-primary-soft-2); }
[data-theme="dark"] .btn-purple { background: var(--color-purple); color: #fff; }
[data-theme="dark"] .btn-purple:hover { background: var(--color-purple-text); }
[data-theme="dark"] .btn-warning { background: var(--color-warning); color: #fff; }
[data-theme="dark"] .btn-warning:hover { background: #D97706; }
[data-theme="dark"] .btn-auth { background: var(--color-auth-primary); color: #fff; }
[data-theme="dark"] .btn-auth:hover { background: var(--color-auth-primary-hover); }
[data-theme="dark"] .btn-link { background: none; color: var(--color-primary-text); }
[data-theme="dark"] .btn-icon { color: var(--color-text-secondary); border: 1px solid transparent; }
[data-theme="dark"] .btn-icon:hover { background: var(--color-surface-muted); color: var(--color-text); }
[data-theme="dark"] .btn-icon.bordered { border-color: var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .btn-icon.bordered:hover { border-color: var(--color-border-strong); }
[data-theme="dark"] .btn-icon.is-active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
[data-theme="dark"] .btn-group { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .btn-group .btn-icon + .btn-icon { border-left: 1px solid var(--color-border); }
[data-theme="dark"] .btn-group .btn-icon.is-active { background: var(--color-primary-soft-2); color: var(--color-primary); }
[data-theme="dark"] .btn-spinner { border: 2px solid rgba(255,255,255,.4); border-top-color: #333D47; }
[data-theme="dark"] .btn-secondary .btn-spinner { border-color: var(--color-border); border-top-color: var(--color-text-secondary); }
[data-theme="dark"] .form-label { color: var(--color-text); }
[data-theme="dark"] .form-label .req { color: var(--color-danger); }
[data-theme="dark"] .form-hint { color: var(--color-text-muted); }
[data-theme="dark"] .form-control, [data-theme="dark"] .form-select, [data-theme="dark"] .form-textarea { background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text); }
[data-theme="dark"] .form-control::placeholder, [data-theme="dark"] .form-textarea::placeholder { color: var(--color-text-faint); }
[data-theme="dark"] .form-control:hover, [data-theme="dark"] .form-select:hover, [data-theme="dark"] .form-textarea:hover { border-color: var(--color-border-strong); }
[data-theme="dark"] .form-control:focus, [data-theme="dark"] .form-select:focus, [data-theme="dark"] .form-textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(0,0,0,0.39); }
[data-theme="dark"] .form-control:disabled, [data-theme="dark"] .form-select:disabled { background: var(--color-surface-muted); color: var(--color-text-muted); }
[data-theme="dark"] .form-control.is-invalid, [data-theme="dark"] .form-select.is-invalid { border-color: var(--color-danger); box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .form-control.is-valid { border-color: var(--color-success); }
[data-theme="dark"] .form-error { color: var(--color-danger-text); }
[data-theme="dark"] .form-success { color: var(--color-success-text); }
[data-theme="dark"] .form-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
[data-theme="dark"] .input-group > .icon { color: var(--color-text-muted); }
[data-theme="dark"] .input-group .input-prefix { color: var(--color-text-muted); }
[data-theme="dark"] .check-box { border: 1.5px solid var(--color-border-strong); background: var(--color-surface); }
[data-theme="dark"] .check-box .icon { color: #fff; }
[data-theme="dark"] .check input:checked + .check-box { background: var(--color-primary); border-color: var(--color-primary); }
[data-theme="dark"] .check input:focus-visible + .check-box { box-shadow: var(--focus-ring); }
[data-theme="dark"] .check input:indeterminate + .check-box { background: var(--color-primary); border-color: var(--color-primary); }
[data-theme="dark"] .check input:indeterminate + .check-box::after { background: #181F28; }
[data-theme="dark"] .check-text small { color: var(--color-text-muted); }
[data-theme="dark"] .radio-dot { border: 1.5px solid var(--color-border-strong); background: var(--color-surface); }
[data-theme="dark"] .radio input:checked + .radio-dot { border-color: var(--color-primary); }
[data-theme="dark"] .toggle-track { background: var(--color-border-strong); }
[data-theme="dark"] .toggle-track::after { background: #181F28; box-shadow: var(--shadow-sm); }
[data-theme="dark"] .toggle input:checked + .toggle-track { background: var(--color-success); }
[data-theme="dark"] .toggle input:focus-visible + .toggle-track { box-shadow: var(--focus-ring); }
[data-theme="dark"] .toggle-row { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .toggle-row-text span { color: var(--color-text-muted); }
[data-theme="dark"] .tag-input { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .tag-input input { border: 0; outline: none; }
[data-theme="dark"] .tag-input input:focus { box-shadow: none; }
[data-theme="dark"] .otp-input { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .otp-input:focus { border-color: var(--color-auth-primary); box-shadow: 0 0 0 3px rgba(0,0,0,0.39); outline: none; }
[data-theme="dark"] .dropzone { border: 1.5px dashed var(--color-border-strong); background: var(--color-surface); }
[data-theme="dark"] .dropzone:hover, [data-theme="dark"] .dropzone.is-dragover { border-color: var(--color-primary); background: var(--color-primary-soft); }
[data-theme="dark"] .dropzone > .icon { color: var(--color-primary); }
[data-theme="dark"] .dropzone span { color: var(--color-text-muted); }
[data-theme="dark"] .file-chip { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .file-chip-meta span { color: var(--color-text-muted); }
[data-theme="dark"] .strength i { background: var(--color-border); }
[data-theme="dark"] .strength[data-level="1"] i:nth-child(1) { background: var(--color-danger); }
[data-theme="dark"] .strength[data-level="2"] i:nth-child(-n+2) { background: var(--color-warning); }
[data-theme="dark"] .strength[data-level="3"] i:nth-child(-n+3) { background: var(--color-success); }
[data-theme="dark"] .strength[data-level="4"] i:nth-child(-n+4) { background: var(--color-success); }
[data-theme="dark"] .badge { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .badge-green { background: var(--color-success-soft); color: var(--color-success-text); }
[data-theme="dark"] .badge-red { background: var(--color-danger-soft); color: var(--color-danger-text); }
[data-theme="dark"] .badge-amber { background: var(--color-warning-soft); color: var(--color-warning-text); }
[data-theme="dark"] .badge-blue { background: var(--color-primary-soft-2); color: var(--color-primary-text); }
[data-theme="dark"] .badge-purple { background: var(--color-purple-soft); color: var(--color-purple-text); }
[data-theme="dark"] .badge-grey { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .badge-orange { background: var(--color-orange-soft); color: var(--color-orange-text); }
[data-theme="dark"] .badge-pink { background: var(--color-pink-soft); color: var(--color-pink-text); }
[data-theme="dark"] .badge-teal { background: var(--color-teal-soft); color: var(--color-teal-text); }
[data-theme="dark"] .badge-slate { background: var(--color-slate-soft); color: var(--color-slate-text); }
[data-theme="dark"] .badge-sky, [data-theme="dark"] .badge-info { background: var(--color-info-soft); color: var(--color-info-text); }
[data-theme="dark"] .badge-navy { background: var(--color-navy); color: #fff; }
[data-theme="dark"] .badge-dot::before { background: currentColor; }
[data-theme="dark"] .count-badge { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .tag { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .tag-blue { background: var(--color-primary-soft-2); color: var(--color-primary-text); }
[data-theme="dark"] .tag-green { background: var(--color-success-soft); color: var(--color-success-text); }
[data-theme="dark"] .tag-red { background: var(--color-danger-soft); color: var(--color-danger-text); }
[data-theme="dark"] .tag-amber { background: var(--color-warning-soft); color: var(--color-warning-text); }
[data-theme="dark"] .tag-purple { background: var(--color-purple-soft); color: var(--color-purple-text); }
[data-theme="dark"] .tag-teal { background: var(--color-teal-soft); color: var(--color-teal-text); }
[data-theme="dark"] .tag-grey { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .tag-remove { color: inherit; }
[data-theme="dark"] .tag-add { border: 1px dashed var(--color-border-strong); color: var(--color-text-muted); }
[data-theme="dark"] .tag-add:hover { border-color: var(--color-primary); color: var(--color-primary); }
[data-theme="dark"] .trend-up { color: var(--color-success-text); }
[data-theme="dark"] .trend-down { color: var(--color-danger-text); }
[data-theme="dark"] .trend-flat { color: var(--color-text-muted); }
[data-theme="dark"] .trend-suffix { color: var(--color-text-muted); }
[data-theme="dark"] .avatar { background: #12151E; color: #8E89DC; }
[data-theme="dark"] .avatar.has-photo { background: transparent; }
[data-theme="dark"] .sidebar .avatar.has-photo, [data-theme="dark"] .topbar .avatar.has-photo { background: transparent; }
[data-theme="dark"] .avatar-blue { background: #12171E; color: #738FDE; }
[data-theme="dark"] .avatar-green { background: #121E16; color: #78E9A2; }
[data-theme="dark"] .avatar-purple { background: #0F0D18; color: #9C73DE; }
[data-theme="dark"] .avatar-amber { background: #564D29; color: #DEA173; }
[data-theme="dark"] .avatar-pink { background: #1E1219; color: #DE739F; }
[data-theme="dark"] .avatar-teal { background: #29564D; color: #66EBE1; }
[data-theme="dark"] .avatar-navy { background: var(--color-navy); color: #fff; }
[data-theme="dark"] .avatar-slate { background: #12171E; color: #E2E5E9; }
[data-theme="dark"] .avatar-violet { background: #120D18; color: #DA8EE4; }
[data-theme="dark"] .avatar-steel { background: #15121E; color: #9075DB; }
[data-theme="dark"] .sidebar .avatar, [data-theme="dark"] .topbar .avatar { background: #334155; color: #fff; }
[data-theme="dark"] .topbar .avatar { background: #7F8EA3; }
[data-theme="dark"] .avatar-stack > * { border: 2px solid var(--color-surface); }
[data-theme="dark"] .avatar-stack .stack-more { background: var(--color-primary-soft-2); color: var(--color-primary-text); border: 0; }
[data-theme="dark"] .brand { background: var(--brand-bg, #0F172A); color: var(--brand-fg, #fff); }
[data-theme="dark"] .site-icon { background: var(--brand-bg, #1E293B); color: var(--brand-fg, #fff); border: 1px solid rgba(15,23,42,.06); }
[data-theme="dark"] .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .flag-fallback { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .health-good { background: var(--color-success-soft); color: var(--color-success-text); }
[data-theme="dark"] .health-warn { background: var(--color-warning-soft); color: var(--color-warning-text); }
[data-theme="dark"] .health-bad { background: var(--color-danger-soft); color: var(--color-danger-text); }
[data-theme="dark"] .entity-title { color: var(--color-text); }
[data-theme="dark"] .entity-title a { color: inherit; }
[data-theme="dark"] .entity-title a:hover { color: var(--color-primary-text); }
[data-theme="dark"] .entity-sub { color: var(--color-text-muted); }
[data-theme="dark"] .link-url { color: var(--color-primary-text); }
[data-theme="dark"] .link-url .btn-icon { color: var(--color-text-muted); }
[data-theme="dark"] .pill-count { background: var(--color-primary-soft); color: var(--color-primary-text); }
[data-theme="dark"] .pill-count.grey { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .data-table .col-sel .idx { color: var(--color-text-muted); }
[data-theme="dark"] .data-table thead th { color: var(--color-text-muted); background: var(--color-bg); border-bottom: 1px solid var(--color-border); }
[data-theme="dark"] .data-table tbody td { border-bottom: 1px solid var(--color-divider); color: var(--color-text); }
[data-theme="dark"] .data-table thead th .th-sub { color: var(--color-text-faint); }
[data-theme="dark"] .data-table tbody tr:hover { background: var(--color-surface-hover); }
[data-theme="dark"] .data-table tbody tr.is-selected, [data-theme="dark"] .data-table tbody tr.is-active { background: var(--color-primary-soft); }
[data-theme="dark"] .data-table .col-idx { color: var(--color-text-muted); }
[data-theme="dark"] .data-table tfoot td { background: var(--color-bg); border-top: 1px solid var(--color-border); }
[data-theme="dark"] .data-table.mini thead th { background: transparent; }
[data-theme="dark"] .th-sort { color: inherit; }
[data-theme="dark"] .th-sort:hover { color: var(--color-text); }
[data-theme="dark"] .is-sorted .th-sort { color: var(--color-text); }
[data-theme="dark"] .cell-2 span { color: var(--color-text-muted); }
[data-theme="dark"] .cell-2 .text-red { color: var(--color-danger-text); }
[data-theme="dark"] .table-toolbar { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .seg-tabs { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .seg-tabs.plain { background: transparent; border: 0; }
[data-theme="dark"] .seg-tab { color: var(--color-text-secondary); }
[data-theme="dark"] .seg-tab:hover { background: var(--color-surface-muted); color: var(--color-text); }
[data-theme="dark"] .seg-tab.is-active { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .seg-tabs.plain .seg-tab { background: var(--color-surface-muted); }
[data-theme="dark"] .seg-tabs.plain .seg-tab.is-active { background: var(--color-primary); }
[data-theme="dark"] .seg-count { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .seg-tab.is-active .seg-count { background: rgba(255,255,255,.22); color: #fff; }
[data-theme="dark"] .seg-tabs.soft .seg-tab.is-active { background: var(--color-primary-soft-2); color: var(--color-primary-text); }
[data-theme="dark"] .tabs { border-bottom: 1px solid var(--color-border); }
[data-theme="dark"] .tab { color: var(--color-text-secondary); border-bottom: 2px solid transparent; }
[data-theme="dark"] .tab:hover { color: var(--color-text); }
[data-theme="dark"] .tab.is-active { color: var(--color-primary-text); border-bottom-color: var(--color-primary); }
[data-theme="dark"] .pagination-bar { border-top: 1px solid var(--color-divider); color: var(--color-text-secondary); }
[data-theme="dark"] .page-btn { border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text); }
[data-theme="dark"] .page-btn:hover { border-color: var(--color-border-strong); background: var(--color-surface-hover); }
[data-theme="dark"] .page-btn.is-active { background: var(--color-navy); color: #fff; border-color: var(--color-navy); }
[data-theme="dark"] .page-ellipsis { color: var(--color-text-muted); }
[data-theme="dark"] .bulk-bar { background: var(--color-navy); color: #fff; box-shadow: var(--shadow-lg); }
[data-theme="dark"] .bulk-count { border-right: 1px solid rgba(255,255,255,.15); }
[data-theme="dark"] .bulk-bar .btn { color: #fff; background: transparent; }
[data-theme="dark"] .bulk-bar .btn:hover { background: rgba(255,255,255,.1); }
[data-theme="dark"] .bulk-bar .btn-icon { color: #fff; }
[data-theme="dark"] .bulk-bar .btn-icon:hover { background: rgba(255,255,255,.1); color: #fff; }
[data-theme="dark"] .panel { background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow-xs); }
[data-theme="dark"] .panel-head .panel-sub { color: var(--color-text-muted); }
[data-theme="dark"] .mini-kpi { background: var(--color-bg); border: 1px solid var(--color-border); }
[data-theme="dark"] .mini-kpi .l { color: var(--color-text-muted); }
[data-theme="dark"] .mini-kpi.tinted-green { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .mini-kpi.tinted-blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .mini-kpi.tinted-amber { background: #18150D; border-color: #5D5432; }
[data-theme="dark"] .mini-kpi.tinted-red { background: #180D0D; border-color: #5D3232; }
[data-theme="dark"] .mini-kpi.tinted-purple { background: #0F0D18; border-color: #322B50; }
[data-theme="dark"] .kv-row { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .kv-label { color: var(--color-text-muted); }
[data-theme="dark"] .feed-item { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .feed-text strong { color: var(--color-text); }
[data-theme="dark"] .feed-text span { color: var(--color-text-muted); }
[data-theme="dark"] .feed-time { color: var(--color-text-faint); }
[data-theme="dark"] .timeline-item::before { background: var(--color-border); }
[data-theme="dark"] .timeline-dot { background: var(--color-border-strong); color: #fff; }
[data-theme="dark"] .timeline-dot.blue { background: var(--color-primary); }
[data-theme="dark"] .timeline-dot.green { background: var(--color-success); }
[data-theme="dark"] .timeline-dot.amber { background: var(--color-warning); }
[data-theme="dark"] .timeline-dot.red { background: var(--color-danger); }
[data-theme="dark"] .timeline-dot.grey { background: var(--color-text-faint); }
[data-theme="dark"] .timeline-text span { color: var(--color-text-muted); }
[data-theme="dark"] .bar-row .bar-idx { color: var(--color-text-muted); }
[data-theme="dark"] .bar-row .bar-pct { color: var(--color-text-muted); }
[data-theme="dark"] .bar-track { background: var(--color-surface-muted); }
[data-theme="dark"] .bar-fill { background: var(--color-primary); }
[data-theme="dark"] .bar-fill.green { background: var(--color-success); }
[data-theme="dark"] .bar-fill.amber { background: var(--color-warning); }
[data-theme="dark"] .bar-fill.red { background: var(--color-danger); }
[data-theme="dark"] .bar-fill.purple { background: var(--color-purple); }
[data-theme="dark"] .bar-fill.orange { background: var(--color-orange); }
[data-theme="dark"] .bar-fill.teal { background: var(--color-teal); }
[data-theme="dark"] .bar-fill.sky { background: var(--color-info); }
[data-theme="dark"] .bar-fill.pink { background: var(--color-pink); }
[data-theme="dark"] .bar-fill.grey { background: var(--color-border-strong); }
[data-theme="dark"] .bar-fill.blue { background: var(--color-primary); }
[data-theme="dark"] .bar-fill.navy { background: var(--color-navy); }
[data-theme="dark"] .bar-fill.gradient { background: linear-gradient(90deg, #6366F1, #A855F7); }
[data-theme="dark"] .progress { background: var(--color-surface-muted); }
[data-theme="dark"] .progress-bar { background: var(--color-primary); }
[data-theme="dark"] .progress-bar.tone-green { background: var(--color-success); }
[data-theme="dark"] .progress-bar.tone-amber { background: var(--color-warning); }
[data-theme="dark"] .progress-bar.tone-red { background: var(--color-danger); }
[data-theme="dark"] .progress-bar.tone-blue { background: var(--color-primary); }
[data-theme="dark"] .progress-bar.tone-purple { background: var(--color-purple); }
[data-theme="dark"] .stacked-bar { background: var(--color-surface-muted); }
[data-theme="dark"] .legend-row .legend-pct { color: var(--color-text-secondary); }
[data-theme="dark"] .insight { background: var(--color-bg); border: 1px solid var(--color-divider); }
[data-theme="dark"] .insight-text span { color: var(--color-text-muted); }
[data-theme="dark"] .quick-action { color: var(--color-text); }
[data-theme="dark"] .quick-action:hover { background: var(--color-surface-muted); }
[data-theme="dark"] .quick-action-text span { color: var(--color-text-muted); }
[data-theme="dark"] .promo-dark { background: linear-gradient(135deg, #0F172A, #1E3A8A); color: #fff; }
[data-theme="dark"] .chip-stat { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .chip-stat .l { color: var(--color-text-muted); }
[data-theme="dark"] .alert-success { background: #0D1810; border-color: #325D41; color: var(--color-success-text); }
[data-theme="dark"] .alert-info { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); color: var(--color-primary-text); }
[data-theme="dark"] .alert-warning { background: #18150D; border-color: #76682D; color: var(--color-warning-text); }
[data-theme="dark"] .alert-danger { background: #180D0D; border-color: #5D3232; color: var(--color-danger-text); }
[data-theme="dark"] .alert .alert-body { color: var(--color-text); }
[data-theme="dark"] .alert .alert-body p { color: var(--color-text-secondary); }
[data-theme="dark"] .alert-close { color: inherit; }
[data-theme="dark"] .callout-amber { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .callout-red { background: #180D0D; border-color: #5D3232; }
[data-theme="dark"] .callout-blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .callout-green { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .callout-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .danger-zone { background: #180D0D; border: 1px solid #5D3232; border: 1px solid var(--color-danger-soft); background: var(--color-danger-soft); color: var(--color-danger-text); }
[data-theme="dark"] .danger-zone .callout-text strong { color: var(--color-danger-text); }
[data-theme="dark"] .dropdown-menu { background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow-lg); }
[data-theme="dark"] .dropdown-item:focus-visible { outline: 2px solid var(--color-primary); background: var(--color-surface-muted); }
[data-theme="dark"] .dropdown-item { color: var(--color-text); }
[data-theme="dark"] .dropdown-item .icon { color: var(--color-text-muted); }
[data-theme="dark"] .dropdown-item:hover { background: var(--color-surface-muted); }
[data-theme="dark"] .dropdown-item.is-danger { color: var(--color-danger-text); }
[data-theme="dark"] .dropdown-item.is-danger .icon { color: var(--color-danger); }
[data-theme="dark"] .dropdown-item.is-danger:hover { background: var(--color-danger-soft); }
[data-theme="dark"] .dropdown-divider { background: var(--color-divider); }
[data-theme="dark"] .dropdown-header { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .dropdown-header span { color: var(--color-text-muted); }
[data-theme="dark"] .modal-backdrop { background: rgba(226,228,233,0.55); }
[data-theme="dark"] .modal { background: var(--color-surface); box-shadow: var(--shadow-xl); }
[data-theme="dark"] .modal-head p { color: var(--color-text-secondary); }
[data-theme="dark"] .modal-foot { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .modal-close { color: var(--color-text-muted); }
[data-theme="dark"] .confirm p { color: var(--color-text-secondary); }
[data-theme="dark"] .impact-list { background: #180D0D; border: 1px solid #5D3232; }
[data-theme="dark"] .impact-list strong { color: var(--color-danger-text); }
[data-theme="dark"] .impact-list .impact-row { color: var(--color-text); }
[data-theme="dark"] .impact-list .impact-row .icon { color: var(--color-danger); }
[data-theme="dark"] .impact-list.neutral { background: var(--color-bg); border-color: var(--color-border); }
[data-theme="dark"] .impact-list.neutral .impact-row .icon { color: var(--color-text-muted); }
[data-theme="dark"] .impact-list.neutral strong { color: var(--color-text); }
[data-theme="dark"] .summary-box { background: var(--color-bg); border: 1px solid var(--color-border); }
[data-theme="dark"] .record-pill { border: 1px solid var(--color-border); background: var(--color-bg); }
[data-theme="dark"] .record-pill span { color: var(--color-text-muted); }
[data-theme="dark"] .link-replace .url-box { border: 1px solid var(--color-border); background: var(--color-bg); }
[data-theme="dark"] .link-replace .url-box .lbl { color: var(--color-text-muted); }
[data-theme="dark"] .link-replace .url-box .url { color: var(--color-primary-text); }
[data-theme="dark"] .link-replace .arrow { color: var(--color-text-faint); }
[data-theme="dark"] .drawer-backdrop { background: rgba(226,228,233,0.45); }
[data-theme="dark"] .drawer { background: var(--color-surface); box-shadow: var(--shadow-xl); }
[data-theme="dark"] .drawer-head { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .drawer-foot { border-top: 1px solid var(--color-divider); background: var(--color-surface); }
[data-theme="dark"] .drawer .panel { border: 0; box-shadow: none; }
[data-theme="dark"] .toast { border: 1px solid; box-shadow: var(--shadow-md); background: var(--color-surface); }
[data-theme="dark"] .toast span { color: var(--color-text-secondary); }
[data-theme="dark"] .toast .toast-close { color: var(--color-text-muted); }
[data-theme="dark"] .toast-success { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .toast-success .icon:first-child { color: var(--color-success); }
[data-theme="dark"] .toast-info { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .toast-info .icon:first-child { color: var(--color-primary); }
[data-theme="dark"] .toast-warning { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .toast-warning .icon:first-child { color: var(--color-warning); }
[data-theme="dark"] .toast-error { background: #180D0D; border-color: #5D3232; }
[data-theme="dark"] .toast-error .icon:first-child { color: var(--color-danger); }
[data-theme="dark"] .sheet { background: var(--color-surface); box-shadow: var(--shadow-xl); }
[data-theme="dark"] .sheet-handle { background: var(--color-border-strong); }
[data-theme="dark"] .notif-head p { color: var(--color-text-muted); }
[data-theme="dark"] .notif-item { border-bottom: 1px solid var(--color-divider); color: var(--color-text); }
[data-theme="dark"] .notif-item:hover { background: var(--color-surface-hover); }
[data-theme="dark"] .notif-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .notif-meta { color: var(--color-text-muted); }
[data-theme="dark"] .notif-item.is-unread .notif-meta::after { background: var(--color-danger); }
[data-theme="dark"] .notif-item.is-unread.sev-upcoming .notif-meta::after { background: var(--color-warning); }
[data-theme="dark"] .notif-item.is-unread.sev-info .notif-meta::after, [data-theme="dark"] .notif-item.is-unread.sev-success .notif-meta::after { background: var(--color-primary); }
[data-theme="dark"] .notif-footer { background: var(--color-primary-soft); color: var(--color-primary-text); }
[data-theme="dark"] .notif-footer:hover { background: var(--color-primary-soft-2); }
[data-theme="dark"] .notif-empty { color: var(--color-text-muted); }
[data-theme="dark"] .palette-backdrop { background: rgba(226,228,233,0.5); }
[data-theme="dark"] .palette { background: var(--color-surface); box-shadow: var(--shadow-xl); }
[data-theme="dark"] .palette-input { border: 1px solid var(--color-border); background: var(--color-bg); }
[data-theme="dark"] .palette-input .icon { color: var(--color-text-muted); }
[data-theme="dark"] .palette-input input { border: 0; background: transparent; outline: none; }
[data-theme="dark"] .palette-input input:focus { box-shadow: none; }
[data-theme="dark"] .palette-input input::placeholder { color: var(--color-text-faint); }
[data-theme="dark"] .palette-chip { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .palette-chip.is-active { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .palette-body { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .palette-side { border-right: 1px solid var(--color-divider); }
[data-theme="dark"] .palette-section { color: var(--color-text-secondary); }
[data-theme="dark"] .palette-section .icon { color: var(--color-text-muted); }
[data-theme="dark"] .palette-item { color: var(--color-text); }
[data-theme="dark"] .palette-item:hover, [data-theme="dark"] .palette-item.is-active { background: var(--color-primary-soft); }
[data-theme="dark"] .palette-item .kbd-hint .icon { color: var(--color-text-faint); }
[data-theme="dark"] .palette-result { color: var(--color-text); }
[data-theme="dark"] .palette-result:hover, [data-theme="dark"] .palette-result.is-active { background: var(--color-primary-soft); }
[data-theme="dark"] .palette-result-text span { color: var(--color-text-muted); }
[data-theme="dark"] .palette-recent { color: var(--color-text); }
[data-theme="dark"] .palette-recent:hover { background: var(--color-surface-muted); }
[data-theme="dark"] .palette-recent .icon { color: var(--color-text-faint); }
[data-theme="dark"] .palette-recent .time { color: var(--color-text-muted); }
[data-theme="dark"] .palette-foot { border-top: 1px solid var(--color-divider); color: var(--color-text-muted); background: var(--color-bg); }
[data-theme="dark"] .palette-empty { color: var(--color-text-muted); }
[data-theme="dark"] .addnew-head .icon-tile { background: var(--color-success-soft); color: var(--color-success); }
[data-theme="dark"] .addnew-head p { color: var(--color-text-secondary); }
[data-theme="dark"] .addnew-card { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .addnew-card:hover { border-color: var(--color-primary); box-shadow: var(--shadow-md); }
[data-theme="dark"] .addnew-card .chev { color: var(--color-text-faint); }
[data-theme="dark"] .addnew-card p { color: var(--color-text-secondary); }
[data-theme="dark"] .addnew-foot { border-top: 1px solid var(--color-divider); background: var(--color-bg); }
[data-theme="dark"] .addnew-foot .icon-tile { background: var(--color-warning-soft); color: var(--color-warning); }
[data-theme="dark"] .addnew-foot-text span { color: var(--color-text-muted); }
[data-theme="dark"] .template-btn { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .template-btn:hover { border-color: var(--color-border-strong); }
[data-theme="dark"] .template-btn .icon { color: var(--color-primary); }
[data-theme="dark"] .template-btn .icon.green { color: var(--color-success); }
[data-theme="dark"] .kanban-col { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .kanban-col-head .kanban-total { color: var(--color-text-secondary); }
[data-theme="dark"] .kanban-col.stage-research .kanban-col-head { background: #0D1218; }
[data-theme="dark"] .kanban-col.stage-contact_found .kanban-col-head { background: #0F0D18; }
[data-theme="dark"] .kanban-col.stage-contacted .kanban-col-head { background: #12171E; }
[data-theme="dark"] .kanban-col.stage-replied .kanban-col-head { background: #121E16; }
[data-theme="dark"] .kanban-col.stage-negotiating .kanban-col-head { background: #564D29; }
[data-theme="dark"] .kanban-col.stage-deal_agreed .kanban-col-head { background: #29564D; }
[data-theme="dark"] .kanban-col.stage-research .kanban-title { color: #E2E5E9; }
[data-theme="dark"] .kanban-col.stage-contact_found .kanban-title { color: #9C73DE; }
[data-theme="dark"] .kanban-col.stage-contacted .kanban-title { color: #738FDE; }
[data-theme="dark"] .kanban-col.stage-replied .kanban-title { color: #78E9A2; }
[data-theme="dark"] .kanban-col.stage-negotiating .kanban-title { color: #DEA173; }
[data-theme="dark"] .kanban-col.stage-deal_agreed .kanban-title { color: #66EBE1; }
[data-theme="dark"] .kanban-cards.is-over { background: var(--color-primary-soft); }
[data-theme="dark"] .kanban-card { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .kanban-card:hover { border-color: var(--color-border-strong); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .kanban-card.is-selected { border-color: var(--color-primary); box-shadow: 0 0 0 2px var(--color-primary-soft-2); }
[data-theme="dark"] .kanban-card-foot .age { color: var(--color-text-muted); }
[data-theme="dark"] .kanban-add { color: var(--color-primary-text); }
[data-theme="dark"] .stage-tile.blue { background: #0D1218; }
[data-theme="dark"] .stage-tile.blue .l { color: #738FDE; }
[data-theme="dark"] .stage-tile.amber { background: #18150D; }
[data-theme="dark"] .stage-tile.amber .l { color: #DEA173; }
[data-theme="dark"] .stage-tile.green { background: #0D1813; }
[data-theme="dark"] .stage-tile.green .l { color: #78E9A2; }
[data-theme="dark"] .stage-tile.purple { background: #0F0D18; }
[data-theme="dark"] .stage-tile.purple .l { color: #9C73DE; }
[data-theme="dark"] .stage-tile.grey { background: #0D1218; }
[data-theme="dark"] .stage-tile.grey .l { color: #A4B0C1; }
[data-theme="dark"] .k-card { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .k-card:hover { border-color: var(--color-border-strong); box-shadow: var(--shadow-sm); }
[data-theme="dark"] .k-card.is-selected { border-color: var(--color-primary); box-shadow: 0 0 0 2px var(--color-primary-soft-2); }
[data-theme="dark"] .k-card-top .k-flags .btn-icon { color: var(--color-text-faint); }
[data-theme="dark"] .k-card-top .k-flags .btn-icon.is-on { color: var(--color-warning); }
[data-theme="dark"] .k-card .k-thumb { background: linear-gradient(135deg, #E2E4E9, #8EA5E6); color: #527398; }
[data-theme="dark"] .k-card p { color: var(--color-text-secondary); }
[data-theme="dark"] .k-card-meta { color: var(--color-text-muted); }
[data-theme="dark"] .k-hero { background: linear-gradient(135deg, #0F172A, #1E40AF); color: #fff; }
[data-theme="dark"] .k-hero span { color: #93C5FD; }
[data-theme="dark"] .tree-group { color: var(--color-text); }
[data-theme="dark"] .tree-group .count-badge { background: transparent; color: var(--color-text-muted); }
[data-theme="dark"] .tree-item { color: var(--color-text-secondary); }
[data-theme="dark"] .tree-item .icon { color: var(--color-text-faint); }
[data-theme="dark"] .tree-item:hover { background: var(--color-surface-muted); color: var(--color-text); }
[data-theme="dark"] .tree-item.is-active { background: var(--color-primary-soft); color: var(--color-primary-text); }
[data-theme="dark"] .tree-item.is-active .icon { color: var(--color-primary); }
[data-theme="dark"] .tree-item.top { color: var(--color-text); }
[data-theme="dark"] .tag-list a { color: var(--color-text-secondary); }
[data-theme="dark"] .tag-list a:hover { background: var(--color-surface-muted); }
[data-theme="dark"] .tag-list a .count-badge { background: transparent; color: var(--color-text-muted); }
[data-theme="dark"] .inbox-item { border-bottom: 1px solid var(--color-divider); border-left: 3px solid transparent; color: var(--color-text); }
[data-theme="dark"] .inbox-item:hover { background: var(--color-surface-hover); }
[data-theme="dark"] .inbox-item.is-active { background: #180D0D; border-left-color: var(--color-danger); }
[data-theme="dark"] .inbox-item.is-active.sev-attention { background: #18150D; border-left-color: var(--color-warning); }
[data-theme="dark"] .inbox-item.is-active.sev-upcoming { background: var(--color-primary-soft); border-left-color: var(--color-primary); }
[data-theme="dark"] .inbox-item-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .inbox-item-meta { color: var(--color-text-muted); }
[data-theme="dark"] .summary-grid { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .summary-grid .cell .l { color: var(--color-text-muted); }
[data-theme="dark"] .summary-kv { border: 1px solid var(--color-border); border-top: 0; background: var(--color-surface); }
[data-theme="dark"] .step { color: var(--color-text-muted); }
[data-theme="dark"] .step-num { background: var(--color-surface-muted); color: var(--color-text-muted); border: 2px solid var(--color-border); }
[data-theme="dark"] .step:not(:last-child)::after { background: var(--color-border); }
[data-theme="dark"] .step.is-active .step-num { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
[data-theme="dark"] .step.is-active { color: var(--color-primary-text); }
[data-theme="dark"] .step.is-done .step-num { background: var(--color-success); color: #fff; border-color: var(--color-success); }
[data-theme="dark"] .step.is-done::after { background: var(--color-success); }
[data-theme="dark"] .wizard-sub { color: var(--color-text-secondary); }
[data-theme="dark"] .count-tile .s { color: var(--color-text-muted); }
[data-theme="dark"] .count-tile.green { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .count-tile.amber { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .count-tile.red { background: #180D0D; border-color: #5D3232; }
[data-theme="dark"] .count-tile.blue { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .count-tile.purple { background: #0F0D18; border-color: #322B50; }
[data-theme="dark"] .count-tile.grey { background: var(--color-bg); border-color: var(--color-border); }
[data-theme="dark"] .map-row .arrow { color: var(--color-text-faint); }
[data-theme="dark"] .map-head { color: var(--color-text-muted); }
[data-theme="dark"] .success-splash .big-check { background: var(--color-success); color: #fff; box-shadow: 0 0 0 10px #000000; }
[data-theme="dark"] .success-splash p { color: var(--color-text-secondary); }
[data-theme="dark"] .funnel-step { background: var(--color-bg); border: 1px solid var(--color-border); }
[data-theme="dark"] .funnel-step .l { color: var(--color-text-muted); }
[data-theme="dark"] .funnel-step:not(:last-child)::after { color: var(--color-text-faint); }
[data-theme="dark"] .aging-tile .l { color: var(--color-text-secondary); }
[data-theme="dark"] .aging-tile.ok { background: var(--color-bg); border-color: var(--color-border); }
[data-theme="dark"] .aging-tile.warn { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .aging-tile.bad { background: #180D0D; border-color: #5D3232; }
[data-theme="dark"] .highlight-card { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .highlight-card .hl-text .l { color: var(--color-text-muted); }
[data-theme="dark"] .report-item { border: 1px solid var(--color-border); color: var(--color-text); }
[data-theme="dark"] .report-item:hover { border-color: var(--color-border-strong); background: var(--color-surface-hover); }
[data-theme="dark"] .report-item-text span { color: var(--color-text-muted); }
[data-theme="dark"] .integration-row { border: 1px solid var(--color-border); }
[data-theme="dark"] .integration-logo-brand { background: var(--color-surface-muted); }
[data-theme="dark"] .integration-logo-brand.brand-github { background: #0D1218; }
[data-theme="dark"] .integration-logo-brand.brand-cloudflare { background: #1E1912; }
[data-theme="dark"] .integration-logo-brand.brand-drive { background: #121E16; }
[data-theme="dark"] .integration-text span { color: var(--color-text-muted); }
[data-theme="dark"] .integration-text .sub { color: var(--color-text-faint); }
[data-theme="dark"] .integration-actions .sub { color: var(--color-text-faint); }
[data-theme="dark"] .integ-tile { border: 1px solid var(--color-border); }
[data-theme="dark"] .integ-tile .status { color: var(--color-text-muted); }
[data-theme="dark"] .settings-list { border: 1px solid var(--color-border); }
[data-theme="dark"] .settings-item { border-bottom: 1px solid var(--color-divider); color: var(--color-text); }
[data-theme="dark"] .settings-item:hover { background: var(--color-surface-hover); }
[data-theme="dark"] .settings-item-text span { color: var(--color-text-muted); }
[data-theme="dark"] .settings-item .chev { color: var(--color-text-faint); }
[data-theme="dark"] .settings-nav-group h4 { color: var(--color-text); }
[data-theme="dark"] .settings-nav a { color: var(--color-text-secondary); }
[data-theme="dark"] .settings-nav a .icon { color: var(--color-text-faint); }
[data-theme="dark"] .settings-nav a:hover { background: var(--color-surface-muted); color: var(--color-text); }
[data-theme="dark"] .settings-nav a.is-active { background: var(--color-primary-soft); color: var(--color-primary-text); }
[data-theme="dark"] .settings-nav a.is-active .icon { color: var(--color-primary); }
[data-theme="dark"] .storage-rows .row { color: var(--color-text-secondary); }
[data-theme="dark"] .storage-rows .row strong { color: var(--color-text); }
[data-theme="dark"] .channel-icons .btn-icon { background: var(--color-primary-soft); color: var(--color-primary); }
[data-theme="dark"] .channel-icons .btn-icon.tg { background: #12191E; color: #73B9DE; }
[data-theme="dark"] .channel-icons .btn-icon.wa { background: #121E16; color: #73DE9A; }
[data-theme="dark"] .channel-icons .btn-icon.li { background: #12171E; color: #738FDE; }
[data-theme="dark"] .channel-icons .btn-icon.sk { background: #12191E; color: #73BDDE; }
[data-theme="dark"] .channel-icons .btn-icon.em { background: #0F0D18; color: #9C73DE; }
[data-theme="dark"] .task-row { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .task-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .task-text .text-red { color: var(--color-danger-text); }
[data-theme="dark"] .task-row.is-done .task-text strong { color: var(--color-text-muted); }
[data-theme="dark"] .due-chip { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .due-chip.red { background: var(--color-danger-soft); color: var(--color-danger-text); }
[data-theme="dark"] .due-chip.amber { background: var(--color-warning-soft); color: var(--color-warning-text); }
[data-theme="dark"] .due-chip.blue { background: var(--color-primary-soft-2); color: var(--color-primary-text); }
[data-theme="dark"] .due-chip.grey { background: var(--color-surface-muted); }
[data-theme="dark"] .calendar { border-top: 1px solid var(--color-border); border-left: 1px solid var(--color-border); }
[data-theme="dark"] .calendar .cal-head { color: var(--color-text-muted); border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); background: var(--color-bg); }
[data-theme="dark"] .calendar .cal-day { border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
[data-theme="dark"] .calendar .cal-day.is-other { background: var(--color-bg); color: var(--color-text-faint); }
[data-theme="dark"] .calendar .cal-day.is-today .cal-num { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .cal-event { background: var(--color-primary-soft-2); color: var(--color-primary-text); }
[data-theme="dark"] .cal-event.red { background: var(--color-danger-soft); color: var(--color-danger-text); }
[data-theme="dark"] .cal-event.green { background: var(--color-success-soft); color: var(--color-success-text); }
[data-theme="dark"] .cal-event.amber { background: var(--color-warning-soft); color: var(--color-warning-text); }
[data-theme="dark"] .cal-event.purple { background: var(--color-purple-soft); color: var(--color-purple-text); }
[data-theme="dark"] .url-bar .url-box { border: 1px solid var(--color-border); background: var(--color-bg); }
[data-theme="dark"] .url-bar .url-box span { color: var(--color-text); }
[data-theme="dark"] .ring-card .ring-text .l { color: var(--color-text-muted); }
[data-theme="dark"] .chart .axis text { fill: var(--color-text-muted); }
[data-theme="dark"] .chart .grid line { stroke: var(--color-divider); }
[data-theme="dark"] .chart-tooltip { background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow-lg); }
[data-theme="dark"] .chart-tooltip .row .lbl { color: var(--color-text-secondary); }
[data-theme="dark"] .chart-tooltip.dark { background: var(--color-navy); border-color: var(--color-navy); color: #fff; }
[data-theme="dark"] .chart-tooltip.dark .row .lbl { color: #A4B1C1; }
[data-theme="dark"] .donut-center .l { color: var(--color-text-muted); color: #A5B0C0; }
[data-theme="dark"] .skeleton { background: linear-gradient(90deg, var(--color-surface-muted) 25%, #12171E 37%, var(--color-surface-muted) 63%); }
[data-theme="dark"] .empty-state .empty-icon { background: var(--color-surface-muted); color: var(--color-text-muted); }
[data-theme="dark"] .empty-state p { color: var(--color-text-secondary); }
[data-theme="dark"] .empty-state.error .empty-icon { background: var(--color-danger-soft); color: var(--color-danger); }
[data-theme="dark"] .empty-state.warning .empty-icon { background: var(--color-warning-soft); color: var(--color-warning); }
[data-theme="dark"] .empty-state.success .empty-icon { background: var(--color-success-soft); color: var(--color-success); }
[data-theme="dark"] .empty-state.denied .empty-icon { background: var(--color-danger-soft); color: var(--color-danger); }
[data-theme="dark"] .empty-state.offline .empty-icon { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .state-card.success { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .state-card.warning { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .state-card.danger { background: #180D0D; border-color: #5D3232; }
[data-theme="dark"] .state-card.neutral { background: var(--color-bg); border-color: var(--color-border); }
[data-theme="dark"] .state-card p { color: var(--color-text-secondary); }
[data-theme="dark"] .error-rows .row { border-bottom: 1px solid #5D3232; }
[data-theme="dark"] .error-rows .row .r { color: var(--color-danger-text); }
[data-theme="dark"] .maintenance-banner { background: var(--color-primary-soft); border: 1px solid var(--color-primary-soft-2); }
[data-theme="dark"] .maintenance-banner strong { color: var(--color-primary-text); }
[data-theme="dark"] .offline-banner { background: var(--color-navy); color: #fff; box-shadow: var(--shadow-lg); }
[data-theme="dark"] .auth-page { background: var(--color-bg); }
[data-theme="dark"] .auth-card { background: var(--color-surface); box-shadow: var(--shadow-xl); }
[data-theme="dark"] .auth-card.dark { background: linear-gradient(160deg, #0B1F2A 0%, #062834 55%, #041F2B 100%); color: #fff; }
[data-theme="dark"] .auth-card.dark::after { background: radial-gradient(ellipse at 50% 100%, rgba(5,150,105,.35), transparent 70%); }
[data-theme="dark"] .auth-card.dark .auth-brand span, [data-theme="dark"] .auth-card.dark .auth-title, [data-theme="dark"] .auth-card.dark .form-label { color: #fff; }
[data-theme="dark"] .auth-card.dark .auth-sub, [data-theme="dark"] .auth-card.dark .auth-foot { color: #CBD5E1; }
[data-theme="dark"] .auth-card.dark .form-control { background: #fff; color: var(--color-text); border-color: transparent; }
[data-theme="dark"] .auth-card.dark .check-text, [data-theme="dark"] .auth-card.dark .auth-links a { color: #fff; }
[data-theme="dark"] .auth-card.dark .auth-links a.muted { color: #A7F3D0; }
[data-theme="dark"] .auth-card.dark .auth-divider { color: #94A3B8; }
[data-theme="dark"] .auth-card.dark .auth-divider::before, [data-theme="dark"] .auth-card.dark .auth-divider::after { background: rgba(255,255,255,.15); }
[data-theme="dark"] .auth-card.dark .btn-secondary { background: #fff; color: var(--color-text); border-color: #fff; }
[data-theme="dark"] .auth-brand small { color: var(--color-text-muted); }
[data-theme="dark"] .auth-card.dark .auth-brand small { color: #A7F3D0; }
[data-theme="dark"] .auth-sub { color: var(--color-text-secondary); }
[data-theme="dark"] .auth-links a { color: var(--color-auth-primary); }
[data-theme="dark"] .auth-divider { color: var(--color-text-muted); }
[data-theme="dark"] .auth-divider::before, [data-theme="dark"] .auth-divider::after { background: var(--color-border); }
[data-theme="dark"] .auth-trust { color: var(--color-text-muted); }
[data-theme="dark"] .auth-trust .icon { color: var(--color-auth-primary); }
[data-theme="dark"] .auth-foot { color: var(--color-text-muted); }
[data-theme="dark"] .auth-icon.blue { background: var(--color-primary-soft-2); color: var(--color-primary); }
[data-theme="dark"] .auth-icon.red { background: var(--color-danger-soft); color: var(--color-danger); }
[data-theme="dark"] .auth-icon.green { background: var(--color-success-soft); color: var(--color-success); }
[data-theme="dark"] .auth-icon.amber { background: var(--color-warning-soft); color: var(--color-warning); }
[data-theme="dark"] .auth-back { color: var(--color-auth-primary); }
[data-theme="dark"] .auth-tabs { background: var(--color-surface-muted); }
[data-theme="dark"] .auth-tabs button { color: var(--color-text-secondary); }
[data-theme="dark"] .auth-tabs button.is-active { background: var(--color-surface); color: var(--color-primary-text); box-shadow: var(--shadow-xs); }
[data-theme="dark"] .device-box { border: 1px solid var(--color-border); }
[data-theme="dark"] .device-box .row .t span { color: var(--color-text-muted); }
[data-theme="dark"] .cred-box { border: 1px solid var(--color-border); }
[data-theme="dark"] .cred-row { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .cred-row .t span { color: var(--color-text-muted); }
[data-theme="dark"] .cred-row .btn-icon { color: var(--color-primary); }
[data-theme="dark"] .countdown-banner { background: #18150D; border: 1px solid #76682D; color: var(--color-warning-text); }
[data-theme="dark"] .audit-line { color: var(--color-text-muted); }
[data-theme="dark"] .audit-line .icon { color: var(--color-success); }
[data-theme="dark"] .setup-step .t span { color: var(--color-text-muted); }
[data-theme="dark"] .divider { background: var(--color-divider); }
[data-theme="dark"] .view-switch { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .view-switch a, [data-theme="dark"] .view-switch button { color: var(--color-text-secondary); }
[data-theme="dark"] .view-switch .is-active { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .two-line-title span { color: var(--color-text-muted); }
[data-theme="dark"] .stat-line { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .stat-line .lbl { color: var(--color-text-secondary); }
[data-theme="dark"] .record-card { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .record-card-grid .l { color: var(--color-text-muted); }
[data-theme="dark"] .role-item { color: inherit; border: 1px solid transparent; }
[data-theme="dark"] .role-item:hover { background: var(--color-surface-hover); }
[data-theme="dark"] .role-item.is-active { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .form-select.ov-allow { border-color: var(--color-success); color: var(--color-success-text); background-color: var(--color-success-soft); }
[data-theme="dark"] .form-select.ov-deny { border-color: var(--color-danger); color: var(--color-danger-text); background-color: var(--color-danger-soft); }
[data-theme="dark"] .form-select.ov-role-on { color: var(--color-success-text); }
[data-theme="dark"] .form-select.ov-role-off { color: var(--text-muted); }
[data-theme="dark"] .sens-perm { border: 1px solid var(--color-border); background: var(--color-surface-muted); }
[data-theme="dark"] .scope-box { border: 1px solid var(--color-border); }
[data-theme="dark"] .scope-list { border-top: 1px solid var(--color-border); }
[data-theme="dark"] .subnav-title { color: var(--color-text-secondary); }
[data-theme="dark"] .subnav-item { color: var(--color-text-secondary); }
[data-theme="dark"] .subnav-item:hover { background: var(--color-surface-hover); color: var(--color-text); }
[data-theme="dark"] .subnav-item.is-active { background: var(--color-primary-soft); color: var(--color-primary); }
[data-theme="dark"] .setting-row { border: 1px solid var(--color-border); background: var(--color-surface-muted); }
[data-theme="dark"] .setting-row.plain { border: 0; background: transparent; }
[data-theme="dark"] .setting-text { color: var(--color-text-secondary); }
[data-theme="dark"] .setting-text strong { color: var(--color-text); }
[data-theme="dark"] .setting-link { border: 1px solid var(--color-border); background: var(--color-surface); color: inherit; }
[data-theme="dark"] .setting-link:hover { border-color: var(--color-primary-soft-2); background: var(--color-primary-soft); }
[data-theme="dark"] .owner-box { border: 1px solid var(--color-border); background: var(--color-surface-muted); }
[data-theme="dark"] .ws-logo { border: 1px solid var(--color-border); background: #181F28; }
[data-theme="dark"] .int-meta { color: var(--color-text-muted); }
[data-theme="dark"] .integration-tile { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .qr-box { border: 1px solid var(--color-border); background: #181F28; }
[data-theme="dark"] .secret-key { background: var(--color-surface-muted); border: 1px dashed var(--color-border); }
[data-theme="dark"] .backup-codes code { background: var(--color-surface-muted); border: 1px solid var(--color-border); }
[data-theme="dark"] .page-dashboard .page-title .wave { color: inherit; }
[data-theme="dark"] .page-dashboard .page-subtitle { color: var(--color-text-secondary); }
[data-theme="dark"] .dash-kpis .kpi { box-shadow: 0 1px 2px rgba(0,0,0,0.28), 0 4px 12px rgba(0,0,0,0.28); }
[data-theme="dark"] .dash-kpis .kpi-label { color: var(--color-text-secondary); }
[data-theme="dark"] .dash-kpis .kpi-with-spark .kpi-spark rect, [data-theme="dark"] .dash-kpis .kpi-with-spark .kpi-spark path { fill: #73DEB7; stroke: none; }
[data-theme="dark"] .page-dashboard .card { box-shadow: 0 1px 2px rgba(0,0,0,0.28), 0 4px 12px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-dashboard .card-select { color: var(--color-text); }
[data-theme="dark"] .dash-donut .legend-row .legend-pct { color: var(--color-text-secondary); }
[data-theme="dark"] .dash-table thead th { color: var(--color-text-muted); background: #0D1218; border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .trend-pill.up { background: #121E19; color: #85F4CF; }
[data-theme="dark"] .trend-pill.down { background: #180D0E; color: #EB7578; }
[data-theme="dark"] .trend-pill.flat { background: var(--color-surface-muted); color: var(--color-text-muted); }
[data-theme="dark"] .page-dashboard .stage-tile.grey .l { color: #A0B0C5; }
[data-theme="dark"] .dash-promo { background: linear-gradient(120deg, #E2E4E9 0%, #E2E4E9 55%, #7D9FE3 100%); }
[data-theme="dark"] .partner-tile { border: 1px solid var(--color-border); color: inherit; }
[data-theme="dark"] .partner-tile:hover { background: var(--color-surface-hover); }
[data-theme="dark"] .website-kpis .kpi { box-shadow: 0 1px 2px rgba(0,0,0,0.28), 0 4px 12px rgba(0,0,0,0.28); }
[data-theme="dark"] .website-page .data-table thead th { background: #0D1218; }
[data-theme="dark"] .website-page .avatar-stack .brand { border: 2px solid var(--color-surface); }
[data-theme="dark"] .website-panel-title .ext-link { color: var(--color-primary); }
[data-theme="dark"] .website-stat { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .website-stat .l { color: var(--color-text-muted); }
[data-theme="dark"] .partner-tile .entity-sub strong { color: var(--color-text); }
[data-theme="dark"] .ww-overlay { background: rgba(226,228,233,0.42); }
[data-theme="dark"] .ww-panel { background: var(--color-surface); box-shadow: var(--shadow-xl); }
[data-theme="dark"] .ww-head { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .ww-head-icon { background: var(--color-primary-soft-2); color: var(--color-primary); }
[data-theme="dark"] .ww-head-text h1 { color: var(--color-text); }
[data-theme="dark"] .ww-head-text p { color: var(--color-text-secondary); }
[data-theme="dark"] .ww-draft-bar { background: var(--color-warning-soft); color: var(--color-warning-text); }
[data-theme="dark"] .ww-draft-bar .link { color: inherit; }
[data-theme="dark"] .ww-content-business { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .ww-rail { border-right: 1px solid var(--color-divider); background: #0D1118; }
[data-theme="dark"] .ww-rail-item { color: var(--color-text-secondary); }
[data-theme="dark"] .ww-rail-item:hover { background: var(--color-surface-muted); }
[data-theme="dark"] .ww-rail-item:not(:last-child)::after { background: var(--color-border); }
[data-theme="dark"] .ww-rail-num { border: 1.5px solid var(--color-border-strong); background: var(--color-surface); color: var(--color-text-muted); }
[data-theme="dark"] .ww-rail-item.is-active .ww-rail-num { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
[data-theme="dark"] .ww-rail-item.is-active { color: var(--color-primary-text); background: var(--color-primary-soft); }
[data-theme="dark"] .ww-rail-item.is-done .ww-rail-num { background: var(--color-success); border-color: var(--color-success); color: #fff; }
[data-theme="dark"] .ww-rail-text strong { color: var(--color-text); }
[data-theme="dark"] .ww-rail-item.is-active .ww-rail-text strong { color: var(--color-primary-text); }
[data-theme="dark"] .ww-rail-text span { color: var(--color-text-muted); }
[data-theme="dark"] .ww-banner { background: var(--color-primary-soft); border: 1px solid var(--color-primary-soft-2); color: var(--color-primary); }
[data-theme="dark"] .ww-banner strong { color: var(--color-primary-text); }
[data-theme="dark"] .ww-banner span { color: var(--color-text-secondary); }
[data-theme="dark"] .ww-h2 { color: var(--color-text); }
[data-theme="dark"] .ww-h2.with-check .icon { color: var(--color-primary); }
[data-theme="dark"] .is-workspace .ww-h2 { color: var(--color-primary-text); }
[data-theme="dark"] .ww-sub { color: var(--color-text-secondary); }
[data-theme="dark"] .ww-label { color: var(--color-text); }
[data-theme="dark"] .ww-label .req { color: var(--color-danger); }
[data-theme="dark"] .ww-label-opt { color: var(--color-text-muted); }
[data-theme="dark"] .ww-hint { color: var(--color-text-muted); }
[data-theme="dark"] .ww-error { color: var(--color-danger-text); }
[data-theme="dark"] .ww-icon, [data-theme="dark"] .ww-prefix, [data-theme="dark"] .ww-suffix { color: var(--color-text-muted); }
[data-theme="dark"] .ww-icon { color: var(--color-primary); }
[data-theme="dark"] .ww-prefix { color: var(--color-primary); }
[data-theme="dark"] .ww-addon { color: var(--color-text-muted); }
[data-theme="dark"] .ww-addon:hover { background: var(--color-surface-muted); color: var(--color-text); }
[data-theme="dark"] .ww-domain-state { color: var(--color-success); }
[data-theme="dark"] .ww-domain-state.is-bad { color: var(--color-danger); }
[data-theme="dark"] .ww-avatar { background: var(--color-primary-soft-2); color: var(--color-primary-text); }
[data-theme="dark"] .ww-brand { background: #0B1220; color: #fff; }
[data-theme="dark"] .ww-logo-tile { background: #0B1220; color: #fff; }
[data-theme="dark"] .ww-remove { background: var(--color-danger-soft); color: var(--color-danger-text); }
[data-theme="dark"] .ww-chips.is-invalid { outline: 1px solid var(--color-danger); }
[data-theme="dark"] .ww-chip { background: var(--color-primary-soft); color: var(--color-primary-text); }
[data-theme="dark"] .ww-chip-x { color: inherit; }
[data-theme="dark"] .ww-chip-x:hover { background: rgba(84,132,239,0.12); }
[data-theme="dark"] .ww-chip-btn { border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-primary-text); }
[data-theme="dark"] .ww-chip-btn:hover { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .ww-chip-select, [data-theme="dark"] .ww-chip-input { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .ww-radio { color: var(--color-text-secondary); border: 1px solid transparent; }
[data-theme="dark"] .ww-radio-dot { border: 1.5px solid var(--color-border-strong); background: #181F28; }
[data-theme="dark"] .ww-radio.is-on { background: var(--color-success-soft); color: var(--color-success-text); }
[data-theme="dark"] .ww-radio.is-on .ww-radio-dot { border: 5px solid var(--color-primary); }
[data-theme="dark"] .ww-toggle-state { color: var(--color-text); }
[data-theme="dark"] .ww-note { background: var(--color-primary-soft); color: var(--color-text-secondary); }
[data-theme="dark"] .ww-note .icon { color: var(--color-primary); }
[data-theme="dark"] .ww-foot { border-top: 1px solid var(--color-divider); background: var(--color-surface); }
[data-theme="dark"] .ww-stepper { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .ww-step-num { background: var(--color-surface-muted); color: var(--color-text-muted); }
[data-theme="dark"] .ww-step.is-active .ww-step-num { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .ww-step.is-done .ww-step-num { background: var(--color-success); color: #fff; }
[data-theme="dark"] .ww-step-text strong { color: var(--color-text); }
[data-theme="dark"] .ww-step.is-active .ww-step-text strong, [data-theme="dark"] .ww-step.is-done .ww-step-text strong { color: var(--color-primary-text); }
[data-theme="dark"] .ww-step-text span { color: var(--color-text-muted); }
[data-theme="dark"] .ww-step.is-done .ww-step-text span { color: var(--color-success-text); }
[data-theme="dark"] .ww-step-line { background: var(--color-border); }
[data-theme="dark"] .ww-workspace-body { background: var(--color-bg); }
[data-theme="dark"] .ww-card { background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .ww-card-head h3 { color: var(--color-text); }
[data-theme="dark"] .ww-card-head p { color: var(--color-text-secondary); }
[data-theme="dark"] .ww-model { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .ww-model:hover { border-color: var(--color-border-strong); }
[data-theme="dark"] .ww-model.is-on { border-color: var(--color-primary); background: var(--color-primary-soft); box-shadow: 0 0 0 1px var(--color-primary) inset; }
[data-theme="dark"] .ww-model-icon { color: var(--color-primary); background: var(--color-primary-soft-2); }
[data-theme="dark"] .ww-model:nth-child(2) .ww-model-icon { color: var(--color-purple); background: var(--color-purple-soft); }
[data-theme="dark"] .ww-model:nth-child(3) .ww-model-icon { color: var(--color-success); background: var(--color-success-soft); }
[data-theme="dark"] .ww-model:nth-child(4) .ww-model-icon { color: var(--color-text-secondary); background: var(--color-surface-muted); }
[data-theme="dark"] .ww-model:nth-child(5) .ww-model-icon { color: var(--color-text-secondary); background: var(--color-surface-muted); }
[data-theme="dark"] .ww-model strong { color: var(--color-text); }
[data-theme="dark"] .ww-model.is-on strong { color: var(--color-primary-text); }
[data-theme="dark"] .ww-model span { color: var(--color-text-muted); }
[data-theme="dark"] .ww-models.is-invalid { outline: 1px solid var(--color-danger); }
[data-theme="dark"] .ww-progress { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .ww-progress strong { color: var(--color-text); }
[data-theme="dark"] .ww-progress span { color: var(--color-text-secondary); }
[data-theme="dark"] .ww-ring > span { color: var(--color-primary-text); }
[data-theme="dark"] .ww-progress-list { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .ww-progress-list li { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .ww-pl-dot { border: 1.5px solid var(--color-border-strong); color: #fff; }
[data-theme="dark"] .ww-progress-list li.is-done .ww-pl-dot { background: var(--color-success); border-color: var(--color-success); }
[data-theme="dark"] .ww-progress-list li.is-active .ww-pl-dot { border: 5px solid var(--color-primary); }
[data-theme="dark"] .ww-pl-text strong { color: var(--color-text); }
[data-theme="dark"] .ww-pl-text span { color: var(--color-text-muted); }
[data-theme="dark"] .ww-progress-list li.is-active .ww-pl-text strong { color: var(--color-primary-text); }
[data-theme="dark"] .ww-pl-state { color: var(--color-success-text); }
[data-theme="dark"] .ww-tip { background: var(--color-primary-soft); border: 1px solid var(--color-primary-soft-2); }
[data-theme="dark"] .ww-tip > .icon { color: var(--color-primary); }
[data-theme="dark"] .ww-tip strong { color: var(--color-text); }
[data-theme="dark"] .ww-tip span { color: var(--color-text-secondary); }
[data-theme="dark"] .company-kpis .kpi { box-shadow: 0 1px 2px rgba(0,0,0,0.28), 0 4px 12px rgba(0,0,0,0.28); }
[data-theme="dark"] .company-kpis .kpi-label { color: var(--color-text-secondary); }
[data-theme="dark"] .kpi-up { color: var(--color-success-text); }
[data-theme="dark"] .company-table thead th { color: var(--color-text-muted); background: #0D1218; }
[data-theme="dark"] .company-table .manager-name { color: var(--color-text); }
[data-theme="dark"] .company-table .row-actions .btn-icon { border: 1px solid var(--color-border); }
[data-theme="dark"] .cp-title { color: var(--color-text); }
[data-theme="dark"] .cp-sub { color: var(--color-text-secondary); }
[data-theme="dark"] .cp-since { color: var(--color-text-secondary); }
[data-theme="dark"] .cp-head .bordered-menu .btn-icon { border: 1px solid var(--color-border); }
[data-theme="dark"] .cp-tabs .tab .count-badge { background: var(--color-surface-muted); color: var(--color-text-secondary); }
[data-theme="dark"] .cp-tile { border: 1px solid transparent; }
[data-theme="dark"] .cp-tile.tone-green { background: #0D1810; border-color: #325D41; color: inherit; }
[data-theme="dark"] .cp-tile.tone-blue { background: #0D1218; border-color: #32445D; color: inherit; }
[data-theme="dark"] .cp-tile.tone-red { background: #180D0D; border-color: #5D3232; color: inherit; }
[data-theme="dark"] .cp-tile.tone-amber { background: #18150D; border-color: #5D5432; color: inherit; }
[data-theme="dark"] .cp-tile .v { color: var(--color-text); }
[data-theme="dark"] .cp-tile.tone-green .v { color: #78E9A2; }
[data-theme="dark"] .cp-tile.tone-blue .v { color: #738FDE; }
[data-theme="dark"] .cp-tile.tone-red .v { color: #DE7373; }
[data-theme="dark"] .cp-tile .l { color: var(--color-text-secondary); }
[data-theme="dark"] .cp-trend.up { color: #78E9A2; }
[data-theme="dark"] .cp-trend.down { color: #DE7373; }
[data-theme="dark"] .cp-trend.flat, [data-theme="dark"] .cp-trend.muted { color: var(--color-text-muted); }
[data-theme="dark"] .cp-card { background: var(--color-surface); border: 1px solid var(--color-border); }
[data-theme="dark"] .cp-card-head h4 { color: var(--color-text); }
[data-theme="dark"] .cp-card-head h4 .muted { color: var(--color-text-muted); }
[data-theme="dark"] .cp-traffic-tile { background: #0D1218; border: 1px solid #32465D; }
[data-theme="dark"] .cp-traffic-tile .v { color: var(--color-text); }
[data-theme="dark"] .cp-traffic-tile .l { color: var(--color-text-secondary); }
[data-theme="dark"] .cp-rate { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .cp-rate span { color: var(--color-text-secondary); }
[data-theme="dark"] .cp-rate strong { color: var(--color-text); }
[data-theme="dark"] .cp-sites li { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .cp-rank { color: var(--color-text-muted); }
[data-theme="dark"] .cp-site-name { color: var(--color-text); }
[data-theme="dark"] .cp-site-name:hover { color: var(--color-primary-text); }
[data-theme="dark"] .cp-mini th { color: var(--color-text-muted); background: #0D1218; }
[data-theme="dark"] .cp-mini td { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .cp-mini td:first-child { color: var(--color-text-secondary); }
[data-theme="dark"] .cp-contact-name { color: var(--color-text); }
[data-theme="dark"] .cp-contact-name a { color: inherit; }
[data-theme="dark"] .cp-contact-role { color: var(--color-text-secondary); }
[data-theme="dark"] .cp-chan { background: #0D1218; border: 1px solid #32465D; color: var(--color-text-secondary); }
[data-theme="dark"] .cp-chan:hover { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .cp-chan-mail { color: #7394DE; }
[data-theme="dark"] .cp-contact-meta { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .cp-contact-meta .l { color: var(--color-text-muted); }
[data-theme="dark"] .cp-contact-meta strong { color: var(--color-text); }
[data-theme="dark"] .cp-feed-text { color: var(--color-text); }
[data-theme="dark"] .cp-feed-time { color: var(--color-text-muted); }
[data-theme="dark"] .cp-empty { color: var(--color-text-muted); }
[data-theme="dark"] .cp-contact-row { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .cw-rail { border-right: 1px solid var(--color-divider); background: #0D1118; }
[data-theme="dark"] .cw-rail .ww-rail-item.is-done .ww-rail-text span { color: var(--color-success-text); }
[data-theme="dark"] .cw-content .ww-icon { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-content .ww-prefix { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-content .ww-icon-dyn .ww-avatar { color: var(--color-primary-text); }
[data-theme="dark"] .cw-content .ww-banner-icon { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .cw-content .ww-banner span.only { color: var(--color-primary-text); }
[data-theme="dark"] .cw-section-title { color: var(--color-text); }
[data-theme="dark"] .cw-section-title .opt { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-divider { background: var(--color-divider); }
[data-theme="dark"] .cw-h3 { color: var(--color-text); }
[data-theme="dark"] .cw-quick-card { border: 1px solid var(--color-border); }
[data-theme="dark"] .ww-icon-dyn .ww-bars i { background: currentColor; }
[data-theme="dark"] .ww-bars.low { color: #A7B1BE; }
[data-theme="dark"] .ww-bars.medium { color: #DEB673; }
[data-theme="dark"] .ww-bars.high { color: #DE7373; }
[data-theme="dark"] .cw-logo-tile { background: #0B1220; color: width: 60px; color: #fff; }
[data-theme="dark"] .cw-logo-actions .btn.is-remove { color: var(--color-danger-text); border-color: transparent; }
[data-theme="dark"] .ww-counter { color: var(--color-text-muted); }
[data-theme="dark"] .ww-chip .ww-globe { color: var(--color-primary); }
[data-theme="dark"] .ww-stars { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .ww-star { color: #587093; }
[data-theme="dark"] .ww-star .icon { fill: #fff; stroke: currentColor; }
[data-theme="dark"] .ww-star.is-on .icon { fill: currentColor; }
[data-theme="dark"] .ww-star.is-on { color: #DEB673; }
[data-theme="dark"] .ww-star:hover { background: var(--color-surface-muted); }
[data-theme="dark"] .ww-upload-btn { border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-primary-text); }
[data-theme="dark"] .ww-upload-btn:hover { background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .ww-upload-btn .icon { color: var(--color-primary); }
[data-theme="dark"] .ww-upload-btn.has-file { color: var(--color-text); }
[data-theme="dark"] .ww-upload-btn .ww-file-x { color: var(--color-text-muted); }
[data-theme="dark"] .cw-check-text strong { color: var(--color-text); }
[data-theme="dark"] .cw-check-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-add-contact { border: 1.5px dashed var(--color-border-strong); background: var(--color-surface); }
[data-theme="dark"] .cw-add-contact:hover { border-color: var(--color-primary); background: var(--color-primary-soft); }
[data-theme="dark"] .cw-add-contact .plus { background: var(--color-primary-soft); color: var(--color-primary); }
[data-theme="dark"] .cw-add-contact strong { color: var(--color-primary-text); }
[data-theme="dark"] .cw-add-contact span { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-extra-contact { border: 1px solid var(--color-border); }
[data-theme="dark"] .cw-notes-card { background: #0D1218; border: 1px solid #32465D; }
[data-theme="dark"] .cw-notes-card .cw-notes-head .icon { color: var(--color-primary); }
[data-theme="dark"] .cw-notes-card .cw-notes-head .opt { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-notes-card .form-textarea { background: var(--color-surface); }
[data-theme="dark"] .cw-review-card { border: 1px solid var(--color-border); }
[data-theme="dark"] .cw-review-card h5 { color: var(--color-text-muted); }
[data-theme="dark"] .cw-review-card h5 button { color: var(--color-primary-text); }
[data-theme="dark"] .contact-kpis .kpi { box-shadow: 0 1px 2px rgba(0,0,0,0.28), 0 4px 12px rgba(0,0,0,0.28); }
[data-theme="dark"] .contact-kpis .kpi-label { color: var(--color-text-secondary); }
[data-theme="dark"] .kpi-down { color: var(--color-danger-text); }
[data-theme="dark"] .contact-page .table-wrap { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .contact-table thead th { color: var(--color-text-secondary); background: #0D1218; }
[data-theme="dark"] .ct-manager .entity-title a { color: var(--color-text); }
[data-theme="dark"] .ct-chan.tg { color: #73BBDE; }
[data-theme="dark"] .ct-chan.sk { color: #73C1DE; }
[data-theme="dark"] .ct-chan.em { color: #7394DE; background: var(--color-primary-soft); }
[data-theme="dark"] .ct-chan.wa { color: #73DE9B; }
[data-theme="dark"] .ct-chan.li { color: #73A8DE; }
[data-theme="dark"] .ct-company-name { color: var(--color-text); }
[data-theme="dark"] .flag-more { color: var(--color-primary-text); background: var(--color-primary-soft); }
[data-theme="dark"] .contact-table .badge-purple { background: var(--color-purple-soft); color: var(--color-purple-text); }
[data-theme="dark"] .ct-fu-red { color: #DE7373; }
[data-theme="dark"] .ct-fu-dark { color: var(--color-text); }
[data-theme="dark"] .ct-fu-muted { color: var(--color-text-muted); }
[data-theme="dark"] .ct-name { color: var(--color-text); }
[data-theme="dark"] .ct-role { color: var(--color-text-secondary); }
[data-theme="dark"] .ct-company-link { color: var(--color-text); }
[data-theme="dark"] .ct-ext { color: var(--color-primary); }
[data-theme="dark"] .ct-score { border: 1px solid var(--color-border); }
[data-theme="dark"] .ct-score-label { color: var(--color-text-secondary); }
[data-theme="dark"] .ct-score-value { color: var(--color-text-secondary); }
[data-theme="dark"] .ct-score-value strong { color: var(--color-text); }
[data-theme="dark"] .ct-score-sub { color: var(--color-text-muted); }
[data-theme="dark"] .ct-tile { color: var(--color-text-secondary); }
[data-theme="dark"] .ct-tile-icon { background: #0D1218; border: 1px solid #32465D; color: var(--color-text-secondary); }
[data-theme="dark"] .ct-tile.tg .ct-tile-icon { background: #12191E; }
[data-theme="dark"] .ct-tile.sk .ct-tile-icon { background: #121A1E; }
[data-theme="dark"] .ct-tile.em .ct-tile-icon { background: #0D1018; color: #7394DE; }
[data-theme="dark"] .ct-tile.wa .ct-tile-icon { background: #121E17; }
[data-theme="dark"] .ct-tile.li .ct-tile-icon { background: #12181E; }
[data-theme="dark"] .ct-tile:hover .ct-tile-icon { border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .ct-fact { border: 1px solid var(--color-border); }
[data-theme="dark"] .ct-fact .l { color: var(--color-text-secondary); }
[data-theme="dark"] .ct-fact .v { color: var(--color-text); }
[data-theme="dark"] .ct-actions .ct-more .btn-icon { border: 1px solid var(--color-border); }
[data-theme="dark"] .ct-metric { border: 1px solid var(--color-border); }
[data-theme="dark"] .ct-metric .l { color: var(--color-text-secondary); }
[data-theme="dark"] .ct-metric strong { color: var(--color-text); }
[data-theme="dark"] .ct-metric .s.green { color: #78E9A2; }
[data-theme="dark"] .ct-metric .s.green .icon { fill: #73DE9A; stroke: #73DE9A; }
[data-theme="dark"] .ct-metric .s.red { color: #DE7373; }
[data-theme="dark"] .ct-metric .s.muted { color: var(--color-text-muted); }
[data-theme="dark"] .ct-card { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .ct-card-title { color: var(--color-text); }
[data-theme="dark"] .ct-edit-notes { color: var(--color-primary); }
[data-theme="dark"] .ct-fu-text strong { color: var(--color-text); }
[data-theme="dark"] .ct-fu-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .ct-quote-text p { color: var(--color-text); }
[data-theme="dark"] .ct-quote-text span { color: var(--color-text-muted); }
[data-theme="dark"] .ct-notes { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-title strong { color: var(--color-text); }
[data-theme="dark"] .cw-title span { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-section-card { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .cw-sec-head h3 { color: var(--color-text); }
[data-theme="dark"] .cw-sec-head p { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-photo-tile { background: #12171E; color: #A7B1BE; }
[data-theme="dark"] .cw-photo-text small { color: var(--color-text-muted); }
[data-theme="dark"] .ww-field-inline .ww-addon-btn { border: 1px solid var(--color-border); color: var(--color-primary); background: var(--color-surface); }
[data-theme="dark"] .cw-upload-box { border: 1.5px dashed var(--color-border-strong); }
[data-theme="dark"] .cw-upload-box:hover { border-color: var(--color-primary); background: var(--color-primary-soft); }
[data-theme="dark"] .cw-upload-box strong { color: var(--color-primary-text); }
[data-theme="dark"] .cw-upload-box span { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-file-text span { color: var(--color-text-muted); }
[data-theme="dark"] .cw-review-id { border: 1px solid var(--color-border); }
[data-theme="dark"] .cw-review-id .cw-rv-role { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-review-block { border: 1px solid var(--color-border); }
[data-theme="dark"] .cw-review-block h5 { color: var(--color-text); }
[data-theme="dark"] .cw-rv .k { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-rv .v { color: var(--color-text); }
[data-theme="dark"] .cw-followup { background: var(--color-success-soft); border: 1px solid #325D41; }
[data-theme="dark"] .cw-followup span { color: var(--color-text-secondary); }
[data-theme="dark"] .cw-split .cw-split-caret { background: var(--color-primary); color: #fff; border-left: 1px solid rgba(255,255,255,.25); }
[data-theme="dark"] .cw-split .cw-split-caret:hover { background: var(--color-primary-hover); }
[data-theme="dark"] .cw-split-menu { background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow-lg); }
[data-theme="dark"] .cw-split-menu button { color: var(--color-text); }
[data-theme="dark"] .cw-split-menu button:hover { background: var(--color-surface-muted); }
[data-theme="dark"] .cw-split-menu button .icon { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-kpis .kpi { box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .aa-kpis .kpi-label { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-tabs { background: var(--color-surface-muted); border-color: var(--color-surface-muted); }
[data-theme="dark"] .aa-filters .aa-filter-btn { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-cpa { color: var(--color-primary-text); }
[data-theme="dark"] .aa-table .col-actions .btn-icon { border: 1px solid var(--color-border); }
[data-theme="dark"] .aa-sub { color: var(--color-text-secondary); color: #9DA8C8; }
[data-theme="dark"] .aa-ids { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-ids strong { color: var(--color-text); }
[data-theme="dark"] .aa-copy { color: var(--color-primary); }
[data-theme="dark"] .aa-head-actions .aa-more .btn-icon { border: 1px solid var(--color-border); }
[data-theme="dark"] .aa-tile { background: #0D1218; border: 1px solid #32475D; }
[data-theme="dark"] .aa-tile.green { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .aa-tile .l { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-box { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .aa-box-head h4 { color: var(--color-text); }
[data-theme="dark"] .aa-box-head h4 span { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-bar-val { color: var(--color-text); }
[data-theme="dark"] .aa-bar-fill { background: linear-gradient(180deg, #60A5FA, #2D5076); }
[data-theme="dark"] .aa-bar-fill.is-cur { background: linear-gradient(180deg, #2563EB, #3B82F6); }
[data-theme="dark"] .aa-bar-lbl { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-metric { background: #0D1218; border: 1px solid #32475D; }
[data-theme="dark"] .aa-metric .l { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-recent tbody td:first-child { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-kv .kv-label { color: var(--color-text-secondary); }
[data-theme="dark"] .aa-kv-co { color: var(--color-text); }
[data-theme="dark"] .aa-kv-site a { color: var(--color-text); }
[data-theme="dark"] .aa-kv-site .aa-ext { color: var(--color-primary); }
[data-theme="dark"] .aa-kv-mgr a { color: var(--color-text); }
[data-theme="dark"] .aa-actions .aa-more-actions .btn-icon { border: 1px solid var(--color-border); color: var(--color-text); }
[data-theme="dark"] .aa-site a { color: var(--color-text); }
[data-theme="dark"] .aa-site-x { color: var(--color-text-muted); }
[data-theme="dark"] .aa-add-site { color: var(--color-primary-text); }
[data-theme="dark"] .aa-add-site .icon { color: var(--color-primary); }
[data-theme="dark"] .aa-tags .tag-amber { background: #564D29; color: #DEA173; }
[data-theme="dark"] .aa-tags .tag-grey { background: #0D1218; color: #A4B0C1; }
[data-theme="dark"] .aa-tags .tag-red { background: #1E1212; color: #DE7373; }
[data-theme="dark"] .is-acw .ww-close { border: 1px solid var(--color-border); }
[data-theme="dark"] .acw-tip.green { background: #0D1810; border-color: #325D41; }
[data-theme="dark"] .acw-tip.blue { background: #0D1218; border-color: #32445D; }
[data-theme="dark"] .acw-tip.purple { background: #0F0D18; border-color: #322B50; }
[data-theme="dark"] .acw-tip.amber { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .acw-tip.amber-soft { background: #18150D; border-color: #5D5432; }
[data-theme="dark"] .acw-tip.amber .ow-tip-head strong { color: #DEA173; }
[data-theme="dark"] .acw-tip.amber .icon-tile { background: #564D29; color: #DEAC73; }
[data-theme="dark"] .acw-tip.purple .ow-tip-head strong { color: #9C73DE; }
[data-theme="dark"] .acw-tip.purple .icon-tile { background: #0F0D18; color: #9B69F1; }
[data-theme="dark"] .acw-tip.amber-soft .icon-tile { background: #564D29; color: #DEAC73; }
[data-theme="dark"] .acw-tip-inline strong { color: var(--color-text); }
[data-theme="dark"] .acw-ticks.blue li .icon { color: var(--color-primary); }
[data-theme="dark"] .acw-ticks.purple li .icon { color: #9B69F1; }
[data-theme="dark"] .acw-links li a { color: #9C73DE; }
[data-theme="dark"] .acw-links li > .icon { color: #9B69F1; }
[data-theme="dark"] .acw-link-dot { background: #0F0D18; color: #9B69F1; }
[data-theme="dark"] .acw-sum li { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-sum li strong { color: var(--color-text); }
[data-theme="dark"] .acw-sum-ic { background: var(--color-primary-soft-2); color: var(--color-primary); }
[data-theme="dark"] .acw-card .ww-card-head .acw-head-btn { color: var(--color-primary-text); }
[data-theme="dark"] .acw-card .ww-card-head .acw-head-btn .icon { color: var(--color-primary); }
[data-theme="dark"] .acw-card-title p { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-card-title .acw-head-btn { color: var(--color-primary-text); }
[data-theme="dark"] .acw-company-row { background: #0D1218; border: 1px solid #32475D; }
[data-theme="dark"] .acw-newco { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-newco .link-btn { color: var(--color-primary-text); }
[data-theme="dark"] .acw-upload { border: 1.5px dashed var(--color-border-strong); background: #0D1218; }
[data-theme="dark"] .acw-upload:hover { border-color: var(--color-primary); }
[data-theme="dark"] .acw-upload strong { color: var(--color-primary-text); }
[data-theme="dark"] .acw-upload small { color: var(--color-text-muted); }
[data-theme="dark"] .acw-logo-preview { border: 1px solid var(--color-border); background: var(--color-surface); color: #9C73DE; }
[data-theme="dark"] .acw-eye { border: 1px solid var(--color-border); color: var(--color-text-secondary); background: var(--color-surface); }
[data-theme="dark"] .acw-generate { color: var(--color-primary-text); background: var(--color-primary-soft); border-color: var(--color-primary-soft-2); }
[data-theme="dark"] .acw-toggle-state { color: var(--color-text); }
[data-theme="dark"] .acw-member-box { border: 1px solid var(--color-border); }
[data-theme="dark"] .acw-member { background: var(--color-primary-soft); color: var(--color-primary-text); }
[data-theme="dark"] .acw-member-caret { color: var(--color-text-muted); }
[data-theme="dark"] .acw-member-add .ww-chip-btn { color: var(--color-primary-text); background: var(--color-primary-soft); border-color: transparent; }
[data-theme="dark"] .acw-verified-ok { color: #78E9A2; }
[data-theme="dark"] .acw-verified .link-btn { color: var(--color-primary-text); }
[data-theme="dark"] .acw-site-list { border: 1px solid var(--color-border); }
[data-theme="dark"] .acw-site-list.is-invalid { border-color: var(--color-danger); }
[data-theme="dark"] .acw-site-row { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .acw-site-row.is-on { background: #0D1018; }
[data-theme="dark"] .acw-site-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-site-meta span { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-site-menu .btn-icon { border: 1px solid var(--color-border); }
[data-theme="dark"] .acw-geotab { color: var(--color-text-secondary); background: var(--color-surface); }
[data-theme="dark"] .acw-geotab:hover { background: var(--color-surface-muted); }
[data-theme="dark"] .acw-geotab.is-active { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .acw-show { border: 1px solid var(--color-border); color: var(--color-text-secondary); }
[data-theme="dark"] .acw-show strong { color: var(--color-text); }
[data-theme="dark"] .acw-geo-grid.is-invalid { outline: 2px solid var(--color-danger-soft); }
[data-theme="dark"] .acw-geo { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .acw-geo.is-on { background: #0D1218; border-color: #32455D; }
[data-theme="dark"] .acw-geo-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-sel-box { background: #0D1218; border: 1px solid #32475D; }
[data-theme="dark"] .acw-deal-row { background: #0D1218; border: 1px solid #32475D; }
[data-theme="dark"] .acw-deal-text span { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-deal-text small { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-mini-check { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-content .form-control:disabled, [data-theme="dark"] .acw-content .form-select:disabled { background: #0D1218; color: var(--color-text); }
[data-theme="dark"] .acw-cb { color: var(--color-text); }
[data-theme="dark"] .acw-link-chip { border: 1px solid var(--color-border); color: var(--color-text); }
[data-theme="dark"] .acw-link-chip.is-on { border-color: #32455D; background: #0D1018; }
[data-theme="dark"] .acw-link-chip > .icon { color: var(--color-primary); }
[data-theme="dark"] .acw-link-row .btn { color: var(--color-primary-text); }
[data-theme="dark"] .acw-link-row .btn .icon { color: var(--color-primary); }
[data-theme="dark"] .acw-url { background: #0D1218; border: 1px solid #32445D; color: var(--color-primary-text); }
[data-theme="dark"] .acw-url .btn-icon { color: var(--color-primary); }
[data-theme="dark"] .acw-preview { background: #0D1218; border: 1px solid #32475D; }
[data-theme="dark"] .acw-preview code { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-check-data { background: #0D1218; border: 1px solid #32475D; }
[data-theme="dark"] .acw-check-data span:not(.badge) { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-check-data .btn-sm { color: var(--color-primary-text); }
[data-theme="dark"] .acw-method { border: 1.5px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .acw-method strong { color: var(--color-text); }
[data-theme="dark"] .acw-method.is-on { border-color: var(--color-primary); background: var(--color-primary-soft); }
[data-theme="dark"] .acw-method.is-on strong { color: var(--color-primary-text); }
[data-theme="dark"] .acw-method-check { background: var(--color-primary); color: #fff; }
[data-theme="dark"] .acw-dashed { border: 1.5px dashed var(--color-border-strong); background: var(--color-surface); }
[data-theme="dark"] .acw-dashed:hover { border-color: var(--color-primary); background: var(--color-primary-soft); }
[data-theme="dark"] .acw-dashed strong { color: var(--color-primary-text); }
[data-theme="dark"] .acw-dashed span { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-dashed > .icon { color: var(--color-primary); }
[data-theme="dark"] .acw-upload-box { background: #0D1218; }
[data-theme="dark"] .acw-payrec { border: 1px solid var(--color-border); }
[data-theme="dark"] .acw-doc { border-bottom: 1px solid var(--color-divider); }
[data-theme="dark"] .acw-doc .btn-icon { border: 1px solid var(--color-border); }
[data-theme="dark"] .acw-identity { border: 1px solid var(--color-border); background: #0D1218; }
[data-theme="dark"] .acw-id-edit { color: var(--color-primary); }
[data-theme="dark"] .acw-id-meta { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-id-meta .sep { color: var(--color-text-muted); }
[data-theme="dark"] .acw-review-block { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .acw-rv .k { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-rv .v { color: var(--color-text); }
[data-theme="dark"] .acw-rv.full .v { color: var(--color-text-secondary); }
[data-theme="dark"] ol.acw-list li::before { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-eye-sm { color: var(--color-primary); }
[data-theme="dark"] .acw-secure-note { background: #0D1810; border: 1px solid #325D41; color: #78E9A2; }
[data-theme="dark"] .acw-link { color: var(--color-primary-text); }
[data-theme="dark"] .acw-dates span { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-dates strong small { color: var(--color-text-secondary); }
[data-theme="dark"] .acw-next { background: #0D1218; border-color: #32445D; }
[data-theme="dark"] .archive-stat { border: 1px solid var(--color-border); background: var(--color-bg); }
[data-theme="dark"] .archive-stat .l { color: var(--color-text-muted); }
[data-theme="dark"] .count-chip { background: var(--color-surface-muted); border: 1px solid var(--color-border); color: var(--color-text-secondary); }
[data-theme="dark"] .archive-row { background: var(--color-surface); }
[data-theme="dark"] .archive-row.is-archived { background: var(--color-surface-muted); }
[data-theme="dark"] .archive-look .l { color: var(--color-text-faint); }
[data-theme="dark"] .archive-bulk { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] .archive-preview-bar { border: 1px solid var(--archive-hl); background: var(--color-warning-soft); }
[data-theme="dark"] .archive-preview-bar.is-active-item { border-color: var(--color-border-strong); background: var(--color-surface-muted); }
[data-theme="dark"] .archive-preview-bar .setting-text strong { color: var(--color-text); }
[data-theme="dark"] body.page-dashboard { background: #0D1218; }
[data-theme="dark"] .promo-dot { background: #0069FC; color: #fff; }
[data-theme="dark"] .sidebar-user .avatar { background: #5D7392; color: #fff; }
[data-theme="dark"] .topbar-search kbd { background: #181F28; border-color: #32435D; color: #A7B0BE; }
[data-theme="dark"] .topbar-bell { color: #E2E4E9; }
[data-theme="dark"] .topbar-bell .icon { color: #E2E4E9; }
[data-theme="dark"] .topbar-user .topbar-avatar > .avatar { background: #798DA9; color: #fff; }
[data-theme="dark"] body.page-dashboard .page-title { color: #E2E5E9; }
[data-theme="dark"] body.page-dashboard .page-subtitle { color: #A0AFC5; }
[data-theme="dark"] .quote-card { background: #0D1218; border: 1px solid #32445D; }
[data-theme="dark"] .quote-card p { color: #E2E5E9; }
[data-theme="dark"] .quote-card .quote-art { color: #7394DE; }
[data-theme="dark"] .btn-add-new { background: #0B1A2F; color: #fff; box-shadow: 0 6px 16px rgba(11,26,47,.22); }
[data-theme="dark"] .btn-add-new:hover { background: #E2E5E9; }
[data-theme="dark"] .btn-add-new .btn-sep { background: rgba(255,255,255,.18); }
[data-theme="dark"] .stat-card { background: #181F28; border: 1px solid #32465D; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .stat-card::before { background: var(--stat-accent, #5484EF); }
[data-theme="dark"] .stat-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,0.28); }
[data-theme="dark"] .stat-icon { background: var(--stat-soft, #0D1218); color: var(--stat-accent, #7394DE); }
[data-theme="dark"] .stat-label { color: #A5B1C0; }
[data-theme="dark"] .stat-value { color: #E2E5E9; }
[data-theme="dark"] .stat-note { color: #A4B0C1; }
[data-theme="dark"] .stat-card.tone-green { --stat-accent: #17E585; --stat-soft: #121E17; }
[data-theme="dark"] .stat-card.tone-purple { --stat-accent: #A66FF4; --stat-soft: #16121E; }
[data-theme="dark"] .stat-card.tone-blue { --stat-accent: #4A91F1; --stat-soft: #12181E; }
[data-theme="dark"] .stat-card.tone-amber { --stat-accent: #F1AE43; --stat-soft: #1E1912; }
[data-theme="dark"] .delta { color: #61F1A0; }
[data-theme="dark"] .delta.down { color: #F37373; }
[data-theme="dark"] .delta.flat { color: #A7B1BE; }
[data-theme="dark"] .delta-chip { background: #121E17; }
[data-theme="dark"] .delta-chip.down { background: #1E1212; }
[data-theme="dark"] .delta-chip.flat { background: #0D1118; }
[data-theme="dark"] body.page-dashboard .card { border-color: #32465D; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .card-icon { background: #12191E; color: #73A1DE; }
[data-theme="dark"] .mini-icon { color: #73A1DE; }
[data-theme="dark"] body.page-dashboard .card-title { color: #E2E5E9; }
[data-theme="dark"] .soft-select { border: 1px solid #32445D; background: #181F28; color: #E2E5E9; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23334E75' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
[data-theme="dark"] .btn-line { border: 1px solid #32445D; background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .btn-line:hover { background: #0D1218; }
[data-theme="dark"] .btn-line .icon { color: #93ACD2; }
[data-theme="dark"] .card-menu > button { border: 1px solid #32445D; background: #181F28; color: #93ACD2; }
[data-theme="dark"] .view-all { color: #739FDE; }
[data-theme="dark"] .donut-center .v { color: #E2E5E9; }
[data-theme="dark"] .donut-legend .lg-name { color: #E2E5E9; }
[data-theme="dark"] .donut-legend .lg-pct { color: #A4B0C1; }
[data-theme="dark"] .donut-legend .lg-val { color: #E2E5E9; }
[data-theme="dark"] .mini-table th { background: #0D1218; color: #97AECE; }
[data-theme="dark"] .mini-table td { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .mini-table tbody tr[data-href]:hover { background: #0D1218; }
[data-theme="dark"] .mini-table td.c-rank { color: #E2E5E9; }
[data-theme="dark"] .mini-table td.c-num { color: #E2E5E9; }
[data-theme="dark"] .mini-table td.c-pct { color: #A5AFC0; }
[data-theme="dark"] .mini-table .entity-name { color: #E2E5E9; }
[data-theme="dark"] .mini-empty { color: #A4B0C1; }
[data-theme="dark"] .site-icon.is-other, [data-theme="dark"] .flag-badge.is-other { background: #12171E; color: #739FDE; }
[data-theme="dark"] .flag-badge { background: #0D1118; }
[data-theme="dark"] .deal-pill.tone-blue { background: #12171E; color: #739FDE; }
[data-theme="dark"] .deal-pill.tone-green { background: #121E18; color: #62F0AC; }
[data-theme="dark"] .deal-pill.tone-amber { background: #1E1A12; color: #F4BF72; }
[data-theme="dark"] .deal-pill.tone-orange { background: #1E1912; color: #DEAD73; }
[data-theme="dark"] .deal-pill.tone-purple { background: #110D18; color: #9A69ED; }
[data-theme="dark"] .deal-pill.tone-slate { background: #1E1217; color: #DE73A1; }
[data-theme="dark"] .deal-pill.tone-teal { background: #121E1B; color: #66EBE1; }
[data-theme="dark"] .deal-pill.tone-pink { background: #1E1217; color: #DE73A1; }
[data-theme="dark"] .deal-pill.tone-grey { background: #0D1118; color: #A2AEC3; }
[data-theme="dark"] .perf-tab { color: #9DAEC8; background: #0D1118; }
[data-theme="dark"] .perf-tab:hover { background: #12171E; }
[data-theme="dark"] .perf-tab.is-active { background: #1079FD; color: #fff; box-shadow: 0 4px 10px rgba(0,0,0,0.676); }
[data-theme="dark"] .perf-search { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .perf-search .icon { color: #A3AFC2; }
[data-theme="dark"] .perf-search input { border: 0; outline: 0; background: transparent; color: #E2E5E9; }
[data-theme="dark"] .perf-search input::placeholder { color: #A3B0C2; }
[data-theme="dark"] .perf-table th { background: #0D1218; color: #97AECE; }
[data-theme="dark"] .perf-table td { border-bottom: 1px solid #2B3850; }
[data-theme="dark"] .perf-table tbody tr:hover { background: #0D1118; }
[data-theme="dark"] .perf-table td.c-rank { color: #E2E5E9; }
[data-theme="dark"] .perf-table td.c-mid { color: #8CA8D9; }
[data-theme="dark"] .perf-table td.c-money.strong { color: #E2E5E9; }
[data-theme="dark"] .perf-table td.c-money.muted { color: #A5B0C0; }
[data-theme="dark"] .perf-table .entity-name { color: #E2E5E9; }
[data-theme="dark"] .row-logo.is-other, [data-theme="dark"] .row-logo.is-deal { background: #0D1118; color: #739FDE; }
[data-theme="dark"] .model-pill { background: #0D1118; color: #94ACD1; }
[data-theme="dark"] .profit-pill { background: #121E17; color: #61F1A0; }
[data-theme="dark"] .row-menu > button { border: 1px solid #32445D; background: #181F28; color: #9DAEC8; }
[data-theme="dark"] .row-menu > button:hover { background: #0D1118; }
[data-theme="dark"] .perf-table tfoot td { background: #0D1218; border-bottom: 0; color: #6F9FEC; }
[data-theme="dark"] .perf-table tfoot td.c-name { color: #E2E5E9; }
[data-theme="dark"] .perf-table tfoot td.c-mid { color: #739EDE; }
[data-theme="dark"] .page-footer { color: #A6B0BF; }
[data-theme="dark"] .page-footer-links a { color: #A6B0BF; }
[data-theme="dark"] .page-footer-links a:hover { color: #739FDE; }
[data-theme="dark"] .modal.addnew { background: #0D1118; }
[data-theme="dark"] .addnew .addnew-head h2 { color: #E2E5E9; }
[data-theme="dark"] .addnew .addnew-head p { color: #9EACC7; }
[data-theme="dark"] .addnew-close { background: #0D1118; color: #93ACD2; }
[data-theme="dark"] .addnew-close:hover { background: #12171E; }
[data-theme="dark"] .addnew .addnew-card { background: #181F28; border: 1px solid #32445D; }
[data-theme="dark"] .addnew .addnew-card:hover { border-color: #32445D; box-shadow: 0 6px 18px rgba(0,0,0,0.312); }
[data-theme="dark"] .addnew-icon.tone-blue { background: #12171E; color: #739FDE; }
[data-theme="dark"] .addnew-icon.tone-purple { background: #17121E; color: #AB78F5; }
[data-theme="dark"] .addnew-icon.tone-green { background: #121E18; color: #73DEAC; }
[data-theme="dark"] .addnew-icon.tone-orange { background: #1E1912; color: #DEB573; }
[data-theme="dark"] .addnew-icon.tone-red { background: #1E1215; color: #F47290; }
[data-theme="dark"] .addnew-icon.tone-slate { background: #12171E; color: #E2E4E9; }
[data-theme="dark"] .addnew-icon.tone-pink { background: #1E1215; color: #F47290; }
[data-theme="dark"] .addnew-text strong { color: #E2E5E9; }
[data-theme="dark"] .addnew-text span { color: #A0AEC5; }
[data-theme="dark"] .addnew-chev { color: #A0B0C5; }
[data-theme="dark"] .addnew-tip { background: #0D1118; border: 1px solid #32445D; }
[data-theme="dark"] .addnew-tip-icon { color: #F4C46C; }
[data-theme="dark"] .addnew-tip-text strong { color: #73A0DE; }
[data-theme="dark"] .addnew-tip-text span { color: #97AECE; }
[data-theme="dark"] .addnew .addnew-card:focus { outline: none; box-shadow: none; }
[data-theme="dark"] .addnew .addnew-card:focus-visible { box-shadow: var(--focus-ring); border-color: #32445D; }
[data-theme="dark"] .page-companies, [data-theme="dark"] .page-accounts { --cmp-navy: #E2E4E9; --cmp-ink: #E2E4E9; --cmp-label: #5C6E87; --cmp-muted: #7F8EA3; --cmp-faint: #8290A3; --cmp-since: #8290AB; --cmp-line: #12171E; --cmp-line-soft: #0D1218; --cmp-head-bg: #0D1118; --cmp-field: #0D1118; --cmp-blue: #4C89F2; --cmp-blue-soft: #0D1118; --cmp-green: #70EFAC; --cmp-green-soft: #121E17; --cmp-amber: #FBC37E; --cmp-amber-soft: #1E1912; --cmp-red: #E8496C; --cmp-red-soft: #1E1214; --cmp-purple-soft: #100D18; --cmp-slate-soft: #12171E; --cmp-orange: #DC6511; --cmp-orange-soft: #1E1812; }
[data-theme="dark"] .page-companies .page-title { color: var(--cmp-navy); }
[data-theme="dark"] .page-companies .page-subtitle { color: #9DA8C8; }
[data-theme="dark"] .cmp-btn { border: 1px solid transparent; }
[data-theme="dark"] .cmp-btn-primary { background: var(--cmp-blue); color: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.65); }
[data-theme="dark"] .cmp-btn-primary:hover { background: #0F5BDD; }
[data-theme="dark"] .cmp-btn-ghost { background: #181F28; color: var(--cmp-ink); border-color: var(--cmp-line); }
[data-theme="dark"] .cmp-btn-ghost:hover { background: var(--cmp-field); border-color: #32435D; }
[data-theme="dark"] .cmp-btn-soft { background: #181F28; border-color: #32435D; color: var(--cmp-blue); }
[data-theme="dark"] .cmp-btn-soft:hover { background: var(--cmp-blue-soft); }
[data-theme="dark"] .cmp-dot { color: #fff; }
[data-theme="dark"] .cmp-dot.tone-green { background: #16A34A; }
[data-theme="dark"] .cmp-dot.tone-amber { background: #F59E0B; }
[data-theme="dark"] .cmp-dot.tone-orange { background: #F97316; }
[data-theme="dark"] .cmp-dot.tone-red { background: #E11D48; }
[data-theme="dark"] .cmp-dot.tone-grey { background: #A9B5C6; }
[data-theme="dark"] .cmp-dot.tone-blue { background: #2563EB; }
[data-theme="dark"] .cmp-tile { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .cmp-tile-icon.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .cmp-tile-icon.tone-green { background: #121E17; color: #73DE9A; }
[data-theme="dark"] .cmp-tile-icon.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .cmp-tile-icon.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .cmp-tile-icon.tone-red { background: #1E1214; color: #F47288; }
[data-theme="dark"] .cmp-tile-icon.tone-slate { background: #12171E; color: #A8AFBD; }
[data-theme="dark"] .cmp-tile-dot { background: #16A34A; color: #fff; }
[data-theme="dark"] .cmp-tile-value { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-tile-label { color: var(--cmp-label); }
[data-theme="dark"] .cmp-tile-sub { color: var(--cmp-muted); }
[data-theme="dark"] .cmp-tile-sub.is-up { color: var(--cmp-green); }
[data-theme="dark"] .cmp-card { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .cmp-search { border: 1px solid #32425D; background: var(--cmp-field); }
[data-theme="dark"] .cmp-search .icon { color: #A1ACC4; }
[data-theme="dark"] .cmp-search input { border: 0; background: none; outline: none; color: var(--cmp-ink); }
[data-theme="dark"] .cmp-search input::placeholder { color: #A4ADC1; }
[data-theme="dark"] .cmp-select { border: 1px solid #32435D; background: #181F28; }
[data-theme="dark"] .cmp-select:hover { border-color: #32435D; }
[data-theme="dark"] .cmp-select.is-set { border-color: #32425D; background: #0D1118; }
[data-theme="dark"] .cmp-select > select { border: 0; background: none; outline: none; color: var(--cmp-ink); }
[data-theme="dark"] .cmp-select-caret { color: #95A2D0; }
[data-theme="dark"] .cmp-sort .cmp-sort-label { color: var(--cmp-ink); }
[data-theme="dark"] .cmp-filter-btn { border: 1px solid #32435D; background: #181F28; color: #E2E4E9; }
[data-theme="dark"] .cmp-filter-btn:hover { background: var(--cmp-field); }
[data-theme="dark"] .cmp-filter-btn.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: var(--cmp-blue-soft); }
[data-theme="dark"] .cmp-table thead th { background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); border-bottom: 1px solid var(--cmp-line-soft); color: #95A2D0; }
[data-theme="dark"] .cmp-th { color: inherit; }
[data-theme="dark"] .cmp-th em { color: #A3ACC2; }
[data-theme="dark"] .cmp-th-icon { color: #A2ABC3; }
[data-theme="dark"] .cmp-table thead th.is-sorted, [data-theme="dark"] .cmp-table thead th.is-sorted .cmp-th-icon { color: var(--cmp-blue); }
[data-theme="dark"] .cmp-table tbody td { border-bottom: 1px solid var(--cmp-line-soft); color: var(--cmp-ink); }
[data-theme="dark"] .cmp-table tbody tr.cmp-row:hover { background: #0D1218; }
[data-theme="dark"] .cmp-table tbody tr.is-selected { background: #0D1118; }
[data-theme="dark"] .cmp-check span { border: 1.5px solid #32435D; background: #181F28; }
[data-theme="dark"] .cmp-check input:checked + span { background: var(--cmp-blue); border-color: var(--cmp-blue); }
[data-theme="dark"] .cmp-check input:checked + span::after { border: solid #333D47; }
[data-theme="dark"] .cmp-check input:focus-visible + span { box-shadow: var(--focus-ring); }
[data-theme="dark"] .cmp-logo { border: 1px solid rgba(226,228,233,0.05); }
[data-theme="dark"] .cmp-partner-name { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-partner-cat { color: #A1ACC4; }
[data-theme="dark"] .cmp-partner-since { color: var(--cmp-since); }
[data-theme="dark"] .cmp-pill.tone-green { background: var(--cmp-green-soft); color: var(--cmp-green); }
[data-theme="dark"] .cmp-pill.tone-amber { background: var(--cmp-amber-soft); color: var(--cmp-amber); }
[data-theme="dark"] .cmp-pill.tone-blue { background: #12171E; color: #738FDE; }
[data-theme="dark"] .cmp-pill.tone-red { background: var(--cmp-red-soft); color: var(--cmp-red); }
[data-theme="dark"] .cmp-pill.tone-grey { background: var(--cmp-slate-soft); color: #A7AFBE; }
[data-theme="dark"] .cmp-sub { color: var(--cmp-muted); }
[data-theme="dark"] .cmp-strong { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-muted { color: var(--cmp-faint); }
[data-theme="dark"] .cmp-flag .flag, [data-theme="dark"] .cmp-country .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .cmp-geo-more { background: #12171E; color: #E2E4E9; }
[data-theme="dark"] .cmp-country > span, [data-theme="dark"] .cmp-country .flag-cell + span { color: var(--cmp-ink); }
[data-theme="dark"] .cmp-money { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-money.is-empty { color: var(--cmp-faint); }
[data-theme="dark"] .cmp-delta.is-up { color: var(--cmp-green); }
[data-theme="dark"] .cmp-delta.is-down { color: var(--cmp-red); }
[data-theme="dark"] .cmp-delta.is-flat { color: var(--cmp-faint); }
[data-theme="dark"] .cmp-pay.tone-green { background: var(--cmp-green-soft); }
[data-theme="dark"] .cmp-pay.tone-green .cmp-pay-top { color: var(--cmp-green); }
[data-theme="dark"] .cmp-pay.tone-green .cmp-pay-sub { color: #9FAAC6; }
[data-theme="dark"] .cmp-pay.tone-amber { background: var(--cmp-amber-soft); }
[data-theme="dark"] .cmp-pay.tone-amber .cmp-pay-top, [data-theme="dark"] .cmp-pay.tone-amber .cmp-pay-sub { color: var(--cmp-orange); }
[data-theme="dark"] .cmp-pay.tone-blue { background: #1E1912; }
[data-theme="dark"] .cmp-pay.tone-blue .cmp-pay-top, [data-theme="dark"] .cmp-pay.tone-blue .cmp-pay-sub { color: var(--cmp-orange); }
[data-theme="dark"] .cmp-pay.tone-red { background: var(--cmp-red-soft); }
[data-theme="dark"] .cmp-pay.tone-red .cmp-pay-top, [data-theme="dark"] .cmp-pay.tone-red .cmp-pay-sub { color: var(--cmp-red); }
[data-theme="dark"] .cmp-pay.tone-grey { background: #0D1118; }
[data-theme="dark"] .cmp-pay.tone-grey .cmp-pay-top { color: #AFB5C0; }
[data-theme="dark"] .cmp-pay.tone-grey .cmp-pay-sub { color: #A8B0BD; }
[data-theme="dark"] .cmp-att.tone-green { background: #121E17; color: var(--cmp-green); }
[data-theme="dark"] .cmp-att.tone-amber, [data-theme="dark"] .cmp-att.tone-orange { background: var(--cmp-orange-soft); color: var(--cmp-orange); }
[data-theme="dark"] .cmp-att.tone-red { background: #1E1214; color: var(--cmp-red); }
[data-theme="dark"] .cmp-menu .btn-icon, [data-theme="dark"] .cmp-ct-menu .btn-icon, [data-theme="dark"] .cmp-panel-menu .btn-icon, [data-theme="dark"] .cmp-quick-more .btn-icon { border: 1px solid #32435D; background: #181F28; color: #96A3CF; }
[data-theme="dark"] .cmp-menu .btn-icon:hover, [data-theme="dark"] .cmp-ct-menu .btn-icon:hover, [data-theme="dark"] .cmp-panel-menu .btn-icon:hover, [data-theme="dark"] .cmp-quick-more .btn-icon:hover { background: var(--cmp-field); border-color: #32425D; }
[data-theme="dark"] .cmp-foot { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-foot-info { color: #A1ACC4; }
[data-theme="dark"] .cmp-page { border: 1px solid #32435D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .cmp-page:hover { background: var(--cmp-field); }
[data-theme="dark"] .cmp-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
[data-theme="dark"] .cmp-page.is-disabled { color: #A2AEC3; }
[data-theme="dark"] .cmp-page-gap { color: var(--cmp-faint); }
[data-theme="dark"] .cmp-per { color: #A1ACC4; }
[data-theme="dark"] .cmp-tab { background: #0D1218; color: #93A2D2; }
[data-theme="dark"] .cmp-tab:hover { background: #12171E; }
[data-theme="dark"] .cmp-tab-count { background: #181F28; color: #93A2D2; }
[data-theme="dark"] .cmp-tab.is-active { background: var(--cmp-blue); color: #fff; }
[data-theme="dark"] .cmp-tab.is-active .cmp-tab-count { background: rgba(255,255,255,.24); color: #fff; }
[data-theme="dark"] .cmp-table.is-compact .c-idx { color: #A1ACC4; }
[data-theme="dark"] .cmp-table.is-compact .c-cat { color: #A1ACC4; }
[data-theme="dark"] .cmp-table.is-compact tbody tr.is-selected { box-shadow: inset 3px 0 0 var(--cmp-blue); }
[data-theme="dark"] .cmp-panel { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .cmp-panel-title h2 { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-verified { background: var(--cmp-green-soft); color: var(--cmp-green); }
[data-theme="dark"] .cmp-panel-tagline { color: #A1ACC4; }
[data-theme="dark"] .cmp-chip { background: #0D1118; color: #95A2D0; }
[data-theme="dark"] .cmp-chip.is-tier { background: var(--cmp-purple-soft); color: #9C73DE; }
[data-theme="dark"] .cmp-chip.is-value.tone-high { background: #180D0E; color: #DE738A; }
[data-theme="dark"] .cmp-chip.is-value.tone-medium { background: #1E1912; color: #DEAD73; }
[data-theme="dark"] .cmp-chip.is-value.tone-low { background: var(--cmp-slate-soft); color: #A6AEBF; }
[data-theme="dark"] .cmp-panel-link { color: var(--cmp-blue); }
[data-theme="dark"] .cmp-panel-link .icon:first-child { color: #649BF3; }
[data-theme="dark"] .cmp-panel-close { border: 1px solid #32435D; background: #181F28; color: #E2E4E9; }
[data-theme="dark"] .cmp-panel-close:hover { background: var(--cmp-field); }
[data-theme="dark"] .cmp-panel-tabs { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-panel-tab { color: #99A7CC; }
[data-theme="dark"] .cmp-panel-tab .cmp-tab-num { background: #0D1118; color: #95A2D0; }
[data-theme="dark"] .cmp-panel-tab:hover, [data-theme="dark"] .cmp-panel-tab.is-active { color: var(--cmp-blue); }
[data-theme="dark"] .cmp-panel-tab.is-active::after { background: var(--cmp-blue); }
[data-theme="dark"] .cmp-panel-body { background: #0D1218; }
[data-theme="dark"] .cmp-box { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .cmp-box-title { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-box-title em { color: #A5ACC0; }
[data-theme="dark"] .cmp-box-icon { color: var(--cmp-blue); }
[data-theme="dark"] .cmp-box-empty { color: var(--cmp-muted); }
[data-theme="dark"] .cmp-metrics { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-metric { border-right: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-metric-icon { color: #E2E4E9; }
[data-theme="dark"] .cmp-metric-value { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-metric-label { color: #A1ACC4; }
[data-theme="dark"] .cmp-rel-head.tone-green { background: #121E17; }
[data-theme="dark"] .cmp-rel-head.tone-amber { background: #1E1A12; }
[data-theme="dark"] .cmp-rel-head.tone-blue { background: #0D1118; }
[data-theme="dark"] .cmp-rel-head.tone-grey { background: #0D1118; }
[data-theme="dark"] .cmp-rel-icon { background: #16A34A; color: #fff; }
[data-theme="dark"] .cmp-rel-head.tone-amber .cmp-rel-icon { background: #F59E0B; }
[data-theme="dark"] .cmp-rel-head.tone-blue .cmp-rel-icon { background: #2563EB; }
[data-theme="dark"] .cmp-rel-head.tone-grey .cmp-rel-icon { background: #9CA7BA; }
[data-theme="dark"] .cmp-rel-title { color: #73EBA4; }
[data-theme="dark"] .cmp-rel-head.tone-amber .cmp-rel-title { color: #DEAD73; }
[data-theme="dark"] .cmp-rel-head.tone-blue .cmp-rel-title { color: #738FDE; }
[data-theme="dark"] .cmp-rel-head.tone-grey .cmp-rel-title { color: #A3ADC2; }
[data-theme="dark"] .cmp-rel-sub { color: #9EAFC7; }
[data-theme="dark"] .cmp-rel-cell { border-right: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-rel-cell .icon { color: #E2E4E9; }
[data-theme="dark"] .cmp-rel-cell span { color: #A3ACC2; }
[data-theme="dark"] .cmp-rel-cell strong { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-contact { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-ct-avatar { background: #12161E; color: #95A2D0; }
[data-theme="dark"] .cmp-ct-name { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-badge-primary { background: var(--cmp-green-soft); color: var(--cmp-green); }
[data-theme="dark"] .cmp-ct-role { color: #A3ACC2; }
[data-theme="dark"] .cmp-ct-link { color: #9CA9C9; }
[data-theme="dark"] .cmp-ct-link .icon { color: #649BF3; }
[data-theme="dark"] .cmp-ct-btn, [data-theme="dark"] .cmp-ct-menu .btn-icon { border: 1px solid #32435D; background: #181F28; color: #96A3CF; }
[data-theme="dark"] .cmp-ct-btn:hover { background: var(--cmp-field); }
[data-theme="dark"] .cmp-ct-btn.is-tg { border-color: #32435D; color: #649BF3; }
[data-theme="dark"] .cmp-ct-btn.is-mail { border-color: #5D3236; color: #DE737E; }
[data-theme="dark"] .cmp-ct-btn.is-li { border-color: #1668F5; background: #1668F5; }
[data-theme="dark"] .cmp-mini thead th { background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); border-bottom: 1px solid var(--cmp-line-soft); color: #95A2D0; }
[data-theme="dark"] .cmp-mini tbody td { border-bottom: 1px solid var(--cmp-line-soft); color: var(--cmp-ink); }
[data-theme="dark"] .cmp-mini .c-n { color: #A3ACC2; }
[data-theme="dark"] .cmp-kvs { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-kv { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-kv-k { color: #A3ACC2; }
[data-theme="dark"] .cmp-kv-v { color: var(--cmp-ink); }
[data-theme="dark"] .cmp-kv-link { color: var(--cmp-blue); }
[data-theme="dark"] .cmp-quick h3 { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-quick-btn { border: 1px solid #32435D; background: #181F28; color: var(--cmp-blue); }
[data-theme="dark"] .cmp-quick-btn:hover { background: var(--cmp-blue-soft); border-color: #32435D; }
[data-theme="dark"] .cmp-quick-more .btn-icon { color: #96A3CF; }
[data-theme="dark"] .cmp-note { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-note-avatar { background: #12161E; color: #95A2D0; }
[data-theme="dark"] .cmp-note-head strong { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-note-head span { color: var(--cmp-muted); }
[data-theme="dark"] .cmp-note-body { color: #9AA8CB; }
[data-theme="dark"] .cmp-doc { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-doc-icon { background: var(--cmp-blue-soft); color: var(--cmp-blue); }
[data-theme="dark"] .cmp-doc-title { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-doc-meta { color: var(--cmp-muted); }
[data-theme="dark"] .page-contacts { --cmp-navy: #E2E3E9; --cmp-ink: #E2E3E9; --cmp-label: #586EAB; --cmp-muted: #858FAA; --cmp-faint: #8490AA; --cmp-line: #12171E; --cmp-line-soft: #0D1118; --cmp-head-bg: #0D1218; --cmp-field: #0D1118; --cmp-blue: #4C89F2; --cmp-blue-soft: #12181E; --cmp-green: #70EFAC; --cmp-green-soft: #121E19; --cmp-amber: #FBC37E; --cmp-amber-soft: #1E1A12; --cmp-red: #E15866; --cmp-red-soft: #180D0F; --cmp-purple: #8A53E1; --cmp-purple-soft: #100D18; --cmp-slate: #7F8EA3; --cmp-slate-soft: #12171E; --cmp-orange: #DC6511; --cmp-orange-soft: #1E1912; --ct-pink-soft: #180D12; --ctg-rule: #12171E; --ctg-panel: #0D1118; --ctg-foot-bg: #0D1118; --ctg-label: #8090A5; --ctg-faint: #97A0B0; }
[data-theme="dark"] .page-contacts .page-title { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .page-subtitle { color: #9DA8C8; }
[data-theme="dark"] .page-contacts .ct-tab { border: 1px solid var(--cmp-line); background: #181F28; color: #E2E3E9; }
[data-theme="dark"] .page-contacts .ct-tab:hover { border-color: #32435D; background: #0D1118; }
[data-theme="dark"] .page-contacts .ct-tab-count { background: #0D1118; color: #95A2D0; }
[data-theme="dark"] .page-contacts .ct-tab.is-active { color: var(--cmp-blue); border-color: #32435D; box-shadow: inset 0 -2px 0 0 var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-tab.is-active .ct-tab-count { background: #12171E; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-tab:focus-visible { outline: none; box-shadow: var(--focus-ring); }
[data-theme="dark"] .page-contacts .ct-tab-more .btn-icon { border: 1px solid var(--cmp-line); background: #181F28; color: #95A2D0; }
[data-theme="dark"] .page-contacts .ct-tab-more .btn-icon:hover { background: #0D1118; border-color: #32435D; }
[data-theme="dark"] .page-contacts .ct-tab-more.is-active .btn-icon { color: var(--cmp-blue); border-color: #32435D; background: #0D1118; }
[data-theme="dark"] .page-contacts .ct-viewtoggle { border: 1px solid var(--cmp-line); background: #181F28; }
[data-theme="dark"] .page-contacts .ct-viewbtn { color: #99A7CC; }
[data-theme="dark"] .page-contacts .ct-viewbtn:hover { background: var(--cmp-field); }
[data-theme="dark"] .page-contacts .ct-viewbtn.is-active { background: #12181E; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-morebtn { border: 1px solid #32435D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ct-morebtn:hover { background: var(--cmp-field); border-color: #32435D; }
[data-theme="dark"] .page-contacts .ct-morebtn.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: #0D1118; }
[data-theme="dark"] .page-contacts .ct-morebtn .icon { color: #95A2D0; }
[data-theme="dark"] .page-contacts .ct-morebtn.is-on .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-reset { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-reset:hover { color: #7399DE; }
[data-theme="dark"] .page-contacts .ct-reset.is-idle { color: #9DACC8; }
[data-theme="dark"] .page-contacts .ct-check-inline { border: 1px solid #32435D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ct-check-inline span { border: 1.5px solid #32435D; background: #181F28; }
[data-theme="dark"] .page-contacts .ct-check-inline input:checked + span { background: var(--cmp-blue); border-color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-check-inline input:checked + span::after { border: solid #333D47; }
[data-theme="dark"] .page-contacts .ct-check-inline input:focus-visible + span { box-shadow: var(--focus-ring); }
[data-theme="dark"] .page-contacts .ct-table thead th { background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); color: #95A7D0; }
[data-theme="dark"] .page-contacts .ct-person-name { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ct-primary { background: #12191E; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-logo { border: 1px solid rgba(226,228,233,0.05); }
[data-theme="dark"] .page-contacts .ct-co-name { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-co-role { color: #A1ACC4; }
[data-theme="dark"] .page-contacts .ct-flag .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-contacts .ct-geo-more { background: #0D1018; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-ch-icon { color: #99A7CC; }
[data-theme="dark"] .page-contacts .ct-ch-icon:not(.is-brand):hover { background: var(--cmp-field); }
[data-theme="dark"] .page-contacts .ct-ch-value { color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ct-copy { border: 0; background: none; color: #A0ADC5; }
[data-theme="dark"] .page-contacts .ct-copy:hover { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ct-copy:focus-visible { box-shadow: var(--focus-ring); }
[data-theme="dark"] .page-contacts .ct-dot { background: currentColor; }
[data-theme="dark"] .page-contacts .ct-pill.tone-green { background: var(--cmp-green-soft); color: var(--cmp-green); }
[data-theme="dark"] .page-contacts .ct-pill.tone-blue { background: var(--cmp-blue-soft); color: #738FDE; }
[data-theme="dark"] .page-contacts .ct-pill.tone-amber { background: var(--cmp-amber-soft); color: var(--cmp-amber); }
[data-theme="dark"] .page-contacts .ct-pill.tone-grey { background: var(--cmp-slate-soft); color: #A6AEBF; }
[data-theme="dark"] .page-contacts .ct-pill.tone-red { background: var(--cmp-red-soft); color: var(--cmp-red); }
[data-theme="dark"] .page-contacts .ct-pill.tone-purple { background: var(--cmp-purple-soft); color: var(--cmp-purple); }
[data-theme="dark"] .page-contacts .ct-last-main { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ct-last-main.is-never { color: var(--cmp-faint); }
[data-theme="dark"] .page-contacts .ct-last-sub { color: #A4AEC1; }
[data-theme="dark"] .page-contacts .ct-next.is-none { color: var(--cmp-faint); }
[data-theme="dark"] .page-contacts .ct-next-icon { color: #E2E4E9; }
[data-theme="dark"] .page-contacts .ct-next-main { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ct-next-time { color: #A4AEC1; }
[data-theme="dark"] .page-contacts .ct-next.is-tomorrow .ct-next-icon { color: #67EEA0; }
[data-theme="dark"] .page-contacts .ct-next.is-tomorrow .ct-next-main { color: #67EEA0; }
[data-theme="dark"] .page-contacts .ct-next.is-today .ct-next-icon, [data-theme="dark"] .page-contacts .ct-next.is-overdue .ct-next-icon { color: #F37373; }
[data-theme="dark"] .page-contacts .ct-next.is-today .ct-next-main, [data-theme="dark"] .page-contacts .ct-next.is-overdue .ct-next-main { color: #DE738A; }
[data-theme="dark"] .page-contacts .ct-next.is-today .ct-next-time, [data-theme="dark"] .page-contacts .ct-next.is-overdue .ct-next-time { background: var(--ct-pink-soft); color: #DE738E; }
[data-theme="dark"] .page-contacts .ct-card-item { border: 1px solid var(--cmp-line); background: #181F28; }
[data-theme="dark"] .page-contacts .ct-card-item:hover { border-color: #32435D; box-shadow: 0 6px 18px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-contacts .ct-card-name b { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ct-card-role { color: #A1ACC4; }
[data-theme="dark"] .page-contacts .ct-card-co { color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ct-card-foot { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-contacts .ct-card-meta { color: #A1ACC4; }
[data-theme="dark"] .page-contacts .ct-card-meta .icon { color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ct-card-meta.is-today, [data-theme="dark"] .page-contacts .ct-card-meta.is-overdue { color: #DE738A; }
[data-theme="dark"] .page-contacts .ct-card-meta.is-today .icon, [data-theme="dark"] .page-contacts .ct-card-meta.is-overdue .icon { color: #F37373; }
[data-theme="dark"] .page-contacts .ct-card-meta.is-tomorrow { color: #67EEA0; }
[data-theme="dark"] .page-contacts .ct-card-meta.is-tomorrow .icon { color: #67EEA0; }
[data-theme="dark"] .page-contacts .ct-headmenu .btn-icon { border: 0; background: none; color: #95A7D0; }
[data-theme="dark"] .page-contacts .ct-headmenu .btn-icon:hover { background: #12171E; }
[data-theme="dark"] .page-contacts .ctd-crumb { color: #A1ACC4; }
[data-theme="dark"] .page-contacts .ctd-crumb a { color: #A1ACC4; }
[data-theme="dark"] .page-contacts .ctd-crumb a:hover { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-crumb-sep { color: #9FACC6; }
[data-theme="dark"] .page-contacts .ctd-crumb span[aria-current] { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-photo .avatar { border: 4px solid #333D47; box-shadow: 0 0 0 1px #000000, 0 4px 14px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-contacts .ctd-photo.is-online::after { background: #16A34A; border: 3px solid #333D47; }
[data-theme="dark"] .page-contacts .ctd-name { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-primary { background: #12191E; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-job { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-co-logo { border: 1px solid rgba(226,228,233,0.05); }
[data-theme="dark"] .page-contacts .ctd-co-name { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-co:hover .ctd-co-name { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-co-cat { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-reach-icon { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-reach-icon.is-brand { background: none; }
[data-theme="dark"] .page-contacts .ctd-reach-label { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-reach-value { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-reach-value a { color: inherit; }
[data-theme="dark"] .page-contacts .ctd-reach-value a:hover { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-reach-sep { background: var(--cmp-line); }
[data-theme="dark"] .page-contacts .ctd-menu .btn-icon { border: 1px solid var(--cmp-line); background: #181F28; color: #96A3CF; }
[data-theme="dark"] .page-contacts .ctd-menu .btn-icon:hover { background: var(--cmp-field); border-color: #32425D; }
[data-theme="dark"] .page-contacts .ctd-strip { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .page-contacts .ctd-stat { border-left: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-contacts .ctd-stat-icon { color: #E2E4E9; }
[data-theme="dark"] .page-contacts .ct-dot.tone-green { background: #16A34A; }
[data-theme="dark"] .page-contacts .ct-dot.tone-blue { background: #2563EB; }
[data-theme="dark"] .page-contacts .ct-dot.tone-amber { background: #F59E0B; }
[data-theme="dark"] .page-contacts .ct-dot.tone-grey { background: #A9B5C6; }
[data-theme="dark"] .page-contacts .ct-dot.tone-red { background: #EF4444; }
[data-theme="dark"] .page-contacts .ct-dot.tone-purple { background: #7C3AED; }
[data-theme="dark"] .page-contacts .ctd-stat-label { color: #A4AEC1; }
[data-theme="dark"] .page-contacts .ctd-stat-value { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-stat-sub { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-tabs { border-bottom: 1px solid var(--cmp-line); }
[data-theme="dark"] .page-contacts .ctd-tab { border-bottom: 2px solid transparent; color: #99A7CC; }
[data-theme="dark"] .page-contacts .ctd-tab .icon { color: #A2ABC3; }
[data-theme="dark"] .page-contacts .ctd-tab:hover { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-tab.is-active { color: var(--cmp-blue); border-bottom-color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-tab.is-active .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-tab-count { background: #0D1118; color: #95A2D0; }
[data-theme="dark"] .page-contacts .ctd-tab.is-active .ctd-tab-count { background: #12171E; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-card-icon { background: #0D1118; color: var(--cmp-blue); background: none !important; color: var(--cmp-blue) !important; }
[data-theme="dark"] .page-contacts .ctd-card-icon.is-plain { background: none; }
[data-theme="dark"] .page-contacts .ctd-card-icon.tone-purple { background: #100D18; color: #9B69F1; color: #9B69F1 !important; }
[data-theme="dark"] .page-contacts .ctd-card-icon.tone-green { background: #121E18; color: #7FEFB1; color: #7FEFB1 !important; }
[data-theme="dark"] .page-contacts .ctd-card-icon.tone-amber { background: #1E1A12; color: #DEB073; color: #DEB073 !important; }
[data-theme="dark"] .page-contacts .ctd-card-title h2 { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-card-title p { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-btn-ghost { border: 1px solid var(--cmp-line); background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ctd-btn-ghost:hover { background: var(--cmp-field); border-color: #32435D; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-btn-ghost .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-kvgrid::before { background: var(--cmp-line-soft); }
[data-theme="dark"] .page-contacts .ctd-kv { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-contacts .ctd-kv-label { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-kv-value { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-kv-value a { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-kv-co { color: var(--cmp-navy) !important; }
[data-theme="dark"] .page-contacts .ctd-kv .ct-flag.has-code span { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-chanpill { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-chanpill:hover { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-link-tile { border: 1px solid var(--cmp-line); background: #181F28; }
[data-theme="dark"] .page-contacts .ctd-link-tile:hover { border-color: #32435D; box-shadow: 0 6px 18px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-contacts .ctd-link-icon.tone-green { background: #121E18; color: #7FEFB1; }
[data-theme="dark"] .page-contacts .ctd-link-icon.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .page-contacts .ctd-link-label { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-link-value { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-link-sub { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-link-caret { color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctd-fu-box { background: #0D1118; }
[data-theme="dark"] .page-contacts .ctd-fu-icon { background: #12171E; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-fu-date { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-fu-date span { color: #99A7CC; }
[data-theme="dark"] .page-contacts .ctd-fu-note { border-top: 1px solid #32415D; }
[data-theme="dark"] .page-contacts .ctd-fu-note-label { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-fu-note p { color: #99A7CC; }
[data-theme="dark"] .page-contacts .ctd-fu-actions .cmp-btn-ghost { color: var(--cmp-blue); border-color: #32425D; }
[data-theme="dark"] .page-contacts .ctd-fu-actions .cmp-btn-ghost .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-fu-empty { background: #0D1118; color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-note { border: 1px solid var(--cmp-line-soft); background: #0D1118; }
[data-theme="dark"] .page-contacts .ctd-note.is-empty { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-note-meta { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-note-meta i { color: #A0ADC5; }
[data-theme="dark"] .page-contacts .ctd-note-menu .btn-icon { border: 0; background: none; color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctd-note-menu .btn-icon:hover { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-note-body { color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ctd-msg { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-contacts .ctd-msg-icon { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .page-contacts .ctd-msg.is-in .ctd-msg-icon { background: #121E18; }
[data-theme="dark"] .page-contacts .ctd-msg.is-note .ctd-msg-icon { background: #1E1A12; }
[data-theme="dark"] .page-contacts .ctd-msg-dir { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctd-msg-chan { color: #99A7CC; background: #0D1118; }
[data-theme="dark"] .page-contacts .ctd-msg-time { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctd-msg-body p { color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ctd-table thead th { background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); color: #95A7D0; }
[data-theme="dark"] .page-contacts .ctd-td-reason { color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ctd-td-reason a { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctd-chan-more { background: #0D1018; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-back { color: #A1ACC4; }
[data-theme="dark"] .page-contacts .ctf-back:hover { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-topbar-text h1 { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctf-topbar-text p { color: #9DA8C8; }
[data-theme="dark"] .page-contacts .ctf-head-icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-head h2 { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctf-head p { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctf-split::before { background: var(--cmp-line-soft); }
[data-theme="dark"] .page-contacts .ctf-label { color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ctf-req { color: #DE738A; }
[data-theme="dark"] .page-contacts .ctf-hint { color: #A0ADC5; }
[data-theme="dark"] .page-contacts .ctf-photo { border: 2px dashed #32425D; background: #0D1218; }
[data-theme="dark"] .page-contacts .ctf-photo:hover { border-color: var(--cmp-blue); background: #0D1218; }
[data-theme="dark"] .page-contacts .ctf-photo-inner { color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-photo.has-photo .ctf-photo-inner { background: rgba(226,227,233,0.55); color: #fff; }
[data-theme="dark"] .page-contacts .ctf-photo-clear { border: 0; background: none; color: #DE738A; }
[data-theme="dark"] .page-contacts .ctf-avpick { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-contacts .ctf-av { border: 2px solid transparent; background: none; }
[data-theme="dark"] .page-contacts .ctf-av:hover { border-color: #32425D; }
[data-theme="dark"] .page-contacts .ctf-av:focus-visible { outline: 2px solid var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-av.is-on { border-color: var(--cmp-blue); box-shadow: 0 0 0 2px rgba(0,0,0,0.468); }
[data-theme="dark"] .page-contacts .ctf-input { border: 1px solid #32425D; background: #181F28; color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctf-input::placeholder { color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctf-input:hover { border-color: #32435D; }
[data-theme="dark"] .page-contacts .ctf-input:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-contacts .ctf-input:disabled { background: #0D1118; color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctf-input.is-invalid { border-color: #E8496C; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .page-contacts .ctf-textarea { border: 1px solid #32425D; background: #181F28; color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctf-textarea::placeholder { color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctf-textarea:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-contacts .ctf-counter { color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctf-prefix { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctf-input-icon { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctf-select { border: 1px solid #32425D; background: #181F28; }
[data-theme="dark"] .page-contacts .ctf-select:hover { border-color: #32435D; }
[data-theme="dark"] .page-contacts .ctf-select:focus-within { border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-contacts .ctf-selectbox { border: 0; background: none; outline: none; color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctf-selectbox:invalid, [data-theme="dark"] .page-contacts .ctf-selectbox option[value=""] { color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctf-select-caret { color: #99A7CC; }
[data-theme="dark"] .page-contacts .ctf-select-lead { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctf-select.has-dot .ct-dot { background: #16A34A; }
[data-theme="dark"] .page-contacts .ctf-select.has-dot[data-tone="partnered"] .ct-dot { background: #2563EB; }
[data-theme="dark"] .page-contacts .ctf-select.has-dot[data-tone="negotiating"] .ct-dot { background: #F59E0B; }
[data-theme="dark"] .page-contacts .ctf-select.has-dot[data-tone="paused"] .ct-dot { background: #A9B5C6; }
[data-theme="dark"] .page-contacts .ctf-select.has-dot[data-tone="prospect"] .ct-dot { background: #7C3AED; }
[data-theme="dark"] .page-contacts .ctf-select.is-invalid { border-color: #E8496C; }
[data-theme="dark"] .page-contacts .ctf-switch-track { background: #293A56; }
[data-theme="dark"] .page-contacts .ctf-switch-track::after { background: #181F28; box-shadow: 0 1px 3px rgba(0,0,0,0.65); }
[data-theme="dark"] .page-contacts .ctf-switch input:checked + .ctf-switch-track { background: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-switch input:focus-visible + .ctf-switch-track { box-shadow: var(--focus-ring); }
[data-theme="dark"] .page-contacts .ctf-toggle-text strong { color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctf-toggle-text em { color: #A5ACC0; }
[data-theme="dark"] .page-contacts .ctf-split.is-disabled .ctf-label { color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctf-split.is-disabled .ctf-input-icon { color: #9EADC7; }
[data-theme="dark"] .page-contacts .ctf-method-icon.tone-telegram { background: #0D1218; }
[data-theme="dark"] .page-contacts .ctf-method-icon.tone-mail { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-extra-del { border: 1px solid #32425D; background: #181F28; color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctf-extra-del:hover { background: #180D10; border-color: #5D323D; color: #DE738A; }
[data-theme="dark"] .page-contacts .ctf-addmethod-btn { border: 0; background: #0D1218; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-addmethod-btn:hover { background: #12171E; }
[data-theme="dark"] .page-contacts .ctf-addmethod-menu { border: 1px solid var(--cmp-line); background: #181F28; box-shadow: 0 12px 32px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-contacts .ctf-addmethod-item { border: 0; background: none; color: var(--cmp-ink); }
[data-theme="dark"] .page-contacts .ctf-addmethod-item:hover { background: var(--cmp-field); color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-chip { border: 1px solid #32425D; background: #181F28; color: var(--cmp-navy); }
[data-theme="dark"] .page-contacts .ctf-chip .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-contacts .ctf-chip-x { border: 0; background: none; color: #A2ADC3; }
[data-theme="dark"] .page-contacts .ctf-chip-x:hover { background: #180D10; color: #DE738A; }
[data-theme="dark"] .page-contacts .ctf-chip-add { border: 0; background: #0D1218; color: var(--cmp-blue); }
[data-theme="dark"] .page-contacts .ctf-chip-add:hover { background: #12171E; }
[data-theme="dark"] .page-contacts .ctf-card .form-error { color: #DE738A; }
[data-theme="dark"] .cmp-viewbtn { border: 1px solid var(--cmp-line); background: #181F28; color: #99A7CC; }
[data-theme="dark"] .cmp-viewbtn:hover { color: var(--cmp-ink); background: var(--cmp-field); }
[data-theme="dark"] .cmp-viewbtn.is-active { background: #0D1118; border-color: #32415D; color: var(--cmp-blue); }
[data-theme="dark"] .cmp-btn-tool.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: var(--cmp-blue-soft); }
[data-theme="dark"] .cmp-sortmenu .btn-icon { color: var(--cmp-ink); }
[data-theme="dark"] .cmp-gtile { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .cmp-gtile-label { color: #A3ACC2; }
[data-theme="dark"] .cmp-gtile-value { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-filters.is-floating { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .cmp-gcard { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .cmp-gcard:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.28); border-color: #32435D; }
[data-theme="dark"] .cmp-gcard:focus-within { box-shadow: var(--focus-ring); }
[data-theme="dark"] .cmp-gcard-logo { border: 1px solid rgba(226,228,233,0.05); }
[data-theme="dark"] .cmp-gcard-name { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-verified-dot { background: #16A34A; color: #fff; }
[data-theme="dark"] .cmp-gcard-cat { color: #A1ACC4; }
[data-theme="dark"] .cmp-gcard-geo { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-gcard-geo-label { color: #A4ADC1; }
[data-theme="dark"] .cmp-gflag { color: #95A2D0; }
[data-theme="dark"] .cmp-gflag .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .cmp-gflag-more { background: #0D1118; color: #95A2D0; }
[data-theme="dark"] .cmp-gstat + .cmp-gstat { border-left: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .cmp-gstat-l { color: #A4ADC1; }
[data-theme="dark"] .cmp-gstat-v { color: var(--cmp-navy); }
[data-theme="dark"] .cmp-gstat-v.is-empty { color: #A4ADC1; }
[data-theme="dark"] .cmp-gstat-s { color: #A3ACC2; }
[data-theme="dark"] .cmp-gstat-s.is-up { color: var(--cmp-green); }
[data-theme="dark"] .cmp-gstat-s.is-down { color: var(--cmp-red); }
[data-theme="dark"] .cmp-gcard-arrow { color: #A2ABC3; }
[data-theme="dark"] .cmp-gcard-foot.tone-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .cmp-gcard-foot.tone-amber { background: #1E1A12; color: #DEA373; }
[data-theme="dark"] .cmp-gcard-foot.tone-red { background: #180D0E; color: #DE737D; }
[data-theme="dark"] .cmp-gcard-foot.tone-purple { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .cmp-gcard-foot.tone-grey { background: #0D1118; color: #A4AEC1; }
[data-theme="dark"] .cmp-dot.tone-purple { background: #7C3AED; }
[data-theme="dark"] .cmp-grid-empty { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .cmp-foot.is-grid .cmp-page.is-disabled { color: var(--cmp-ink); }
[data-theme="dark"] .cmp-back { color: #A1ACC4; }
[data-theme="dark"] .cmp-back:hover { color: var(--cmp-blue); }
[data-theme="dark"] .aw-back { color: #9CA8C9; }
[data-theme="dark"] .aw-back:hover { color: var(--cmp-blue); }
[data-theme="dark"] .aw-title { color: var(--cmp-navy); }
[data-theme="dark"] .aw-sub { color: #9DA8C8; }
[data-theme="dark"] .aw-steps { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aw-step + .aw-step::before { background: linear-gradient(to bottom, transparent, #12171E 30%, #12171E 70%, transparent); }
[data-theme="dark"] .aw-step-num { background: #0D1118; color: #A3ACC2; }
[data-theme="dark"] .aw-step.is-current .aw-step-num { background: var(--cmp-blue); color: #fff; }
[data-theme="dark"] .aw-step.is-done .aw-step-num { background: #16A34A; color: #fff; }
[data-theme="dark"] .aw-step-t { color: #99A7CC; }
[data-theme="dark"] .aw-step-d { color: #A4ADC1; }
[data-theme="dark"] .aw-step.is-current .aw-step-t { color: var(--cmp-blue); }
[data-theme="dark"] .aw-step.is-current::after { background: var(--cmp-blue); }
[data-theme="dark"] .aw-step.is-done .aw-step-t { color: var(--cmp-ink); }
[data-theme="dark"] .aw-steps.is-final .aw-step-idx { color: #99A7CC; }
[data-theme="dark"] .aw-steps.is-final .aw-arrow { color: #73DE9A; }
[data-theme="dark"] .aw-steps.is-final .aw-step.is-current { background: #0D1118; }
[data-theme="dark"] .aw-card { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aw-card-icon { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .aw-card-title { color: var(--cmp-navy); }
[data-theme="dark"] .aw-card-sub { color: #A3ACC2; }
[data-theme="dark"] .aw-label { color: var(--cmp-ink); }
[data-theme="dark"] .aw-label .req { color: #DE738A; }
[data-theme="dark"] .aw-label .opt { color: #A4ADC1; }
[data-theme="dark"] .aw-hint { color: #A4ADC1; }
[data-theme="dark"] .aw-help { color: #A3ACC2; }
[data-theme="dark"] .aw-input, [data-theme="dark"] .aw-textarea, [data-theme="dark"] .aw-selectbtn { background: #181F28; border: 1px solid #32445D; color: var(--cmp-ink); }
[data-theme="dark"] .aw-input::placeholder, [data-theme="dark"] .aw-textarea::placeholder { color: #A4ADC1; }
[data-theme="dark"] .aw-input:hover, [data-theme="dark"] .aw-textarea:hover, [data-theme="dark"] .aw-selectbtn:hover { border-color: #32435D; }
[data-theme="dark"] .aw-input:focus, [data-theme="dark"] .aw-textarea:focus, [data-theme="dark"] .aw-selectbtn:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.39); }
[data-theme="dark"] .aw-input.is-invalid, [data-theme="dark"] .aw-textarea.is-invalid, [data-theme="dark"] .aw-selectbtn.is-invalid, [data-theme="dark"] .aw-chips.is-invalid, [data-theme="dark"] .aw-seg.is-invalid, [data-theme="dark"] .aw-tiles.is-invalid { border-color: #E8496C; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .aw-input.is-link { color: #738FDE; }
[data-theme="dark"] .aw-error { color: #DE738A; }
[data-theme="dark"] .aw-count { color: #A4ADC1; }
[data-theme="dark"] .aw-addon-ic { color: #A1ACC4; }
[data-theme="dark"] .aw-addon.is-sep .aw-addon-ic { border-right: 1px solid #32445D; }
[data-theme="dark"] .aw-prefix .aw-addon-ic { color: #A1ACC4; }
[data-theme="dark"] .aw-selectbtn .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .aw-selectbtn .aw-sel-caret { color: #95A2D0; }
[data-theme="dark"] .aw-selectbtn .is-placeholder { color: #A4ADC1; }
[data-theme="dark"] .aw-selectbtn .aw-status-dot { background: #16A34A; }
[data-theme="dark"] .aw-menu { background: #181F28; border: 1px solid var(--cmp-line); box-shadow: 0 12px 32px rgba(0,0,0,0.364); }
[data-theme="dark"] .aw-menu-search { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .aw-menu-search input { border: 0; outline: none; background: none; }
[data-theme="dark"] .aw-menu-item { color: var(--cmp-ink); }
[data-theme="dark"] .aw-menu-item:hover, [data-theme="dark"] .aw-menu-item.is-hl { background: var(--cmp-field); }
[data-theme="dark"] .aw-menu-item.is-selected { color: var(--cmp-blue); }
[data-theme="dark"] .aw-menu-empty { color: #A4ADC1; }
[data-theme="dark"] .aw-chip { background: #0D1118; color: #E2E4E9; }
[data-theme="dark"] .aw-chip .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .aw-chip-x { color: #95A2D0; }
[data-theme="dark"] .aw-chip-x:hover { color: #DE738A; }
[data-theme="dark"] .aw-chip-add { border: 1px solid #32445D; background: #181F28; color: var(--cmp-blue); }
[data-theme="dark"] .aw-chip-add:hover { background: var(--cmp-blue-soft); border-color: #32435D; }
[data-theme="dark"] .aw-chip-input { border: 1px solid var(--cmp-blue); outline: none; }
[data-theme="dark"] .aw-geo-search .aw-addon-ic { color: #A2ABC3; }
[data-theme="dark"] .aw-suggest { color: #A3ACC2; }
[data-theme="dark"] .aw-suggest-chip { background: #0D1118; color: #95A2D0; }
[data-theme="dark"] .aw-suggest-chip:hover { background: #12171E; }
[data-theme="dark"] .aw-seg { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .aw-seg-btn { color: #A1ACC4; border-right: 1px solid #32445D; }
[data-theme="dark"] .aw-seg-btn:hover { background: var(--cmp-field); }
[data-theme="dark"] .aw-seg-btn.is-active { background: #121E17; color: #7FEFB1; box-shadow: inset 0 0 0 1px #000000; }
[data-theme="dark"] .aw-seg-btn.is-active .aw-seg-dot { background: #16A34A; color: #fff; }
[data-theme="dark"] .aw-seg-dot { background: #12171E; color: #A3ACC2; }
[data-theme="dark"] .aw-seg.is-tabs .aw-seg-btn.is-active { background: #0D1118; color: var(--cmp-blue); box-shadow: none; }
[data-theme="dark"] .aw-logo-box { background: #E2E4E9; border: 1px solid rgba(226,228,233,0.06); }
[data-theme="dark"] .aw-logo-box.is-empty { background: #0D1118; border: 1px dashed #32435D; color: #A4ADC1; }
[data-theme="dark"] .aw-btn-soft { border: 1px solid #32445D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .aw-btn-soft:hover { background: var(--cmp-field); }
[data-theme="dark"] .aw-btn-soft.is-blue { background: #0D1118; border-color: #2B3850; color: var(--cmp-blue); }
[data-theme="dark"] .aw-btn-soft.is-red { background: #180D0E; border-color: #502B2F; color: #DE737D; }
[data-theme="dark"] .aw-info { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .aw-info .icon { color: var(--cmp-blue); }
[data-theme="dark"] .aw-info strong { color: var(--cmp-ink); }
[data-theme="dark"] .aw-collapse { background: #0D1118; }
[data-theme="dark"] .aw-collapse-head .aw-card-icon { background: transparent; color: var(--cmp-blue); }
[data-theme="dark"] .aw-collapse-t { color: var(--cmp-ink); }
[data-theme="dark"] .aw-collapse-d { color: #A3ACC2; }
[data-theme="dark"] .aw-collapse-caret { color: #95A2D0; }
[data-theme="dark"] .aw-collapse-body { border-top: 1px solid #32445D; }
[data-theme="dark"] .aw-deal { background: #0D1118; }
[data-theme="dark"] .aw-deal-head { color: var(--cmp-ink); }
[data-theme="dark"] .aw-deal-head .icon { color: var(--cmp-blue); }
[data-theme="dark"] .aw-deal-big { color: var(--cmp-navy); }
[data-theme="dark"] .aw-deal-big small { color: var(--cmp-ink); }
[data-theme="dark"] .aw-deal-plus { color: var(--cmp-navy); }
[data-theme="dark"] .aw-deal-plus small { color: #99A7CC; }
[data-theme="dark"] .aw-deal-list li { color: #99A7CC; }
[data-theme="dark"] .aw-deal-list .icon { color: #7C9DEE; }
[data-theme="dark"] .aw-tile { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .aw-tile:hover { border-color: #32435D; background: var(--cmp-field); }
[data-theme="dark"] .aw-tile.is-active { border-color: var(--cmp-blue); background: #0D1118; box-shadow: inset 0 0 0 1px var(--cmp-blue); }
[data-theme="dark"] .aw-tile-check { background: var(--cmp-blue); color: #fff; }
[data-theme="dark"] .aw-tile-ic { color: #fff; }
[data-theme="dark"] .aw-tile-ic.is-line { background: none; color: var(--cmp-blue); }
[data-theme="dark"] .aw-tile-t { color: var(--cmp-ink); }
[data-theme="dark"] .aw-tile-t small { color: #A3ACC2; }
[data-theme="dark"] .aw-rail-card { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aw-rail-head .icon { color: var(--cmp-blue); }
[data-theme="dark"] .aw-rail-title { color: var(--cmp-navy); }
[data-theme="dark"] .aw-rail-sub { color: #A3ACC2; }
[data-theme="dark"] .aw-preview { background: #0D1118; }
[data-theme="dark"] .aw-preview-logo { background: #E2E4E9; }
[data-theme="dark"] .aw-preview-logo.is-empty { background: #12171E; color: #A4ADC1; }
[data-theme="dark"] .aw-preview-name { color: var(--cmp-navy); }
[data-theme="dark"] .aw-preview-cat { color: #A1ACC4; }
[data-theme="dark"] .aw-tag { background: #0D1118; color: #95A2D0; }
[data-theme="dark"] .aw-tag.is-tier { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .aw-tag.is-value { background: #180D0E; color: #DE738A; }
[data-theme="dark"] .aw-kv { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .aw-kv .icon { color: #A4ADC1; }
[data-theme="dark"] .aw-kv-k { color: #A3ACC2; }
[data-theme="dark"] .aw-kv-v { color: var(--cmp-navy); }
[data-theme="dark"] .aw-kv-v a { color: #738FDE; }
[data-theme="dark"] .aw-kv-v a .icon { color: #738FDE; }
[data-theme="dark"] .aw-check-count { color: #A3ACC2; }
[data-theme="dark"] .aw-progress { background: #12171E; }
[data-theme="dark"] .aw-progress > span { background: linear-gradient(90deg, #1668F5, #4C8DF8); }
[data-theme="dark"] .aw-progress.is-done > span { background: #16A34A; }
[data-theme="dark"] .aw-check-ic { border: 1.5px solid #32425D; }
[data-theme="dark"] .aw-check.is-current .aw-check-ic { border: 0; background: var(--cmp-blue); }
[data-theme="dark"] .aw-check.is-done .aw-check-ic { border: 0; background: #16A34A; color: #fff; }
[data-theme="dark"] .aw-check-t { color: var(--cmp-ink); }
[data-theme="dark"] .aw-check.is-pending .aw-check-t { color: #99A7CC; }
[data-theme="dark"] .aw-check-d { color: #A4ADC1; }
[data-theme="dark"] .aw-check-badge.is-progress { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .aw-check-badge.is-complete { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .aw-checklist.is-final .aw-check { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .aw-tip { background: #0D1118; border: 1px solid #32445D; color: #99A7CC; }
[data-theme="dark"] .aw-tip .icon { color: var(--cmp-blue); }
[data-theme="dark"] .aw-tip strong { color: var(--cmp-ink); }
[data-theme="dark"] .aw-tip.is-green { background: #121E17; border-color: #325D43; color: #E2E9E5; }
[data-theme="dark"] .aw-tip.is-green .aw-tip-ic { background: #16A34A; color: #fff; }
[data-theme="dark"] .aw-tip.is-green .aw-tip-ic .icon { color: #fff; }
[data-theme="dark"] .aw-tip.is-green strong { color: #E2E4E9; }
[data-theme="dark"] .aw-key li.is-current { background: #0D1118; }
[data-theme="dark"] .aw-key-ic { background: #16A34A; color: #fff; }
[data-theme="dark"] .aw-key-ic.is-num { background: #0D1118; color: #A3ACC2; }
[data-theme="dark"] .aw-key-ic.is-current { background: var(--cmp-blue); color: #fff; }
[data-theme="dark"] .aw-key-t { color: var(--cmp-ink); }
[data-theme="dark"] .aw-key-d { color: #A3ACC2; }
[data-theme="dark"] .aw-review-sec { border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aw-review-head .aw-card-icon { background: none; }
[data-theme="dark"] .aw-review-title { color: var(--cmp-navy); }
[data-theme="dark"] .aw-edit { color: var(--cmp-blue); }
[data-theme="dark"] .aw-edit.is-btn { border: 1px solid #32445D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .aw-review-grid > div + div { border-left: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .aw-review-brand h4, [data-theme="dark"] .aw-review-brand h3, [data-theme="dark"] .aw-review-brand h2 { color: var(--cmp-navy); }
[data-theme="dark"] .aw-review-brand p { color: #A1ACC4; }
[data-theme="dark"] .aw-rv { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .aw-rv-k { color: #A3ACC2; }
[data-theme="dark"] .aw-rv-v { color: var(--cmp-navy); }
[data-theme="dark"] .aw-rv-v a { color: #738FDE; }
[data-theme="dark"] .aw-dash { color: #A4ADC1; }
[data-theme="dark"] .aw-pay-ic span { color: #fff; }
[data-theme="dark"] .page-pipeline { --pl-ink: #E2E3E9; --pl-navy: #E2E3E9; --pl-muted: #808DA6; --pl-faint: #8D97AC; --pl-line: #12171E; --pl-line-soft: #0D1218; --pl-blue: #4C89F2; --pl-blue-soft: #0D1118; --pl-chip: #0D1118; }
[data-theme="dark"] .pl-btn-white { background: #181F28; color: var(--pl-ink); border-color: var(--pl-line); }
[data-theme="dark"] .pl-btn-white:hover { background: #0D1118; border-color: #32425D; }
[data-theme="dark"] .pl-btn-white.is-danger { color: var(--cmp-red); }
[data-theme="dark"] .pl-page-menu .btn-icon { border: 1px solid var(--pl-line); background: #181F28; color: var(--pl-ink); }
[data-theme="dark"] .pl-page-menu .btn-icon:hover { background: #0D1118; }
[data-theme="dark"] .pl-seg { background: #181F28; border: 1px solid var(--pl-line); }
[data-theme="dark"] .pl-seg-btn { color: var(--pl-ink); }
[data-theme="dark"] .pl-seg-btn:hover { background: #0D1118; }
[data-theme="dark"] .pl-seg-btn.is-active { background: var(--pl-blue); color: #fff; }
[data-theme="dark"] .pl-tab { background: #181F28; border: 1px solid var(--pl-line); color: var(--pl-ink); }
[data-theme="dark"] .pl-tab:hover { background: #0D1118; border-color: #32425D; }
[data-theme="dark"] .pl-tab-count { background: var(--pl-blue-soft); color: var(--pl-blue); }
[data-theme="dark"] .pl-tab.is-active { background: var(--pl-blue); border-color: var(--pl-blue); color: #fff; }
[data-theme="dark"] .pl-tab.is-active .pl-tab-count { background: rgba(255,255,255,.22); color: #fff; }
[data-theme="dark"] .pl-tab-more .btn-icon { color: transparent; }
[data-theme="dark"] .pl-tab-more .btn-icon .icon { color: var(--pl-ink); }
[data-theme="dark"] .pl-filters .cmp-search { background: #181F28; border-color: var(--pl-line); }
[data-theme="dark"] .pl-filters .cmp-search .icon { color: #A1ACC4; }
[data-theme="dark"] .pl-filters .cmp-search input::placeholder { color: #A4ACC1; }
[data-theme="dark"] .pl-select { border-color: var(--pl-line); }
[data-theme="dark"] .pl-select .cmp-select-ghost, [data-theme="dark"] .pl-select > select { color: var(--pl-ink); }
[data-theme="dark"] .pl-select .cmp-select-caret { color: var(--pl-ink); }
[data-theme="dark"] .pl-select-prefix { color: var(--pl-ink); }
[data-theme="dark"] .pl-morebtn { border: 1px solid var(--pl-line); background: #181F28; color: var(--pl-ink); }
[data-theme="dark"] .pl-morebtn:hover { background: #0D1118; }
[data-theme="dark"] .pl-morebtn.is-on { border-color: var(--pl-blue); color: var(--pl-blue); background: var(--pl-blue-soft); }
[data-theme="dark"] .pl-viewtoggle { background: #181F28; border: 1px solid var(--pl-line); }
[data-theme="dark"] .pl-viewbtn { color: var(--pl-ink); }
[data-theme="dark"] .pl-viewbtn:hover { background: #0D1118; }
[data-theme="dark"] .pl-viewbtn.is-accent { background: var(--pl-blue-soft); color: var(--pl-blue); }
[data-theme="dark"] .pl-check-inline { color: var(--pl-ink); }
[data-theme="dark"] .pl-check-inline span:first-of-type { border: 1.5px solid #32435D; background: #181F28; }
[data-theme="dark"] .pl-check-inline input:checked + span { background: var(--pl-blue); border-color: var(--pl-blue); }
[data-theme="dark"] .pl-check-inline input:checked + span::after { border: solid #333D47; }
[data-theme="dark"] .pl-check-inline input:focus-visible + span { box-shadow: var(--focus-ring); }
[data-theme="dark"] .pl-chip { background: var(--pl-chip); color: var(--pl-ink); }
[data-theme="dark"] .pl-chip:hover { background: #12171E; }
[data-theme="dark"] .pl-chip-key { color: #A1ACC4; }
[data-theme="dark"] .pl-chip-x { color: var(--pl-ink); }
[data-theme="dark"] .pl-clear { color: var(--pl-blue); }
[data-theme="dark"] .pl-table thead th { background: #0D1218; border-top: 1px solid var(--pl-line-soft); border-bottom: 1px solid var(--pl-line-soft); color: #99A7CC; }
[data-theme="dark"] .pl-th { color: inherit; }
[data-theme="dark"] .pl-th-icon { color: #A2ABC3; }
[data-theme="dark"] .pl-table thead th.is-sorted, [data-theme="dark"] .pl-table thead th.is-sorted .pl-th-icon { color: var(--pl-blue); }
[data-theme="dark"] .pl-table thead th.c-menu .pl-th { color: #99A7CC; }
[data-theme="dark"] .pl-table tbody td { border-bottom: 1px solid var(--pl-line-soft); color: var(--pl-ink); }
[data-theme="dark"] .pl-table tbody tr:last-child td { border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pl-row:focus-visible { box-shadow: inset 0 0 0 2px rgba(0,0,0,0.91); }
[data-theme="dark"] .pl-logo { border: 1px solid rgba(226,228,233,0.06); }
[data-theme="dark"] .pl-co-name { color: var(--cmp-navy); }
[data-theme="dark"] .pl-ct-name { color: var(--pl-navy); }
[data-theme="dark"] .pl-ct-role { color: #A1ACC4; }
[data-theme="dark"] .pl-avatar.has-photo { background: transparent; }
[data-theme="dark"] .pl-avatar.tone-blue { background: #12171E; color: #7397DE; }
[data-theme="dark"] .pl-avatar.tone-amber { background: #1E1A12; color: #DEB273; }
[data-theme="dark"] .pl-avatar.tone-purple { background: #100D18; color: #8F68ED; }
[data-theme="dark"] .pl-avatar.tone-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pl-pill .pl-dot { background: currentColor; }
[data-theme="dark"] .pl-pill.tone-amber { background: #1E1A12; color: #FBC37E; }
[data-theme="dark"] .pl-pill.tone-amber .pl-dot { background: #F59E0B; }
[data-theme="dark"] .pl-pill.tone-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pl-pill.tone-green .pl-dot { background: #22C55E; }
[data-theme="dark"] .pl-pill.tone-blue { background: #12171E; color: #738FDE; }
[data-theme="dark"] .pl-pill.tone-blue .pl-dot { background: #2563EB; }
[data-theme="dark"] .pl-pill.tone-grey { background: #0D1118; color: #A2AEC3; }
[data-theme="dark"] .pl-pill.tone-grey .pl-dot { background: #7F8EA3; }
[data-theme="dark"] .pl-pill.tone-purple { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .pl-pill.tone-purple .pl-dot { background: #7C3AED; }
[data-theme="dark"] .pl-pill.tone-red { background: #180D0E; color: #DE738A; }
[data-theme="dark"] .pl-pill.tone-red .pl-dot { background: #EF4444; }
[data-theme="dark"] .pl-pill.tone-teal { background: #121E1C; color: #66EBE1; }
[data-theme="dark"] .pl-pill.tone-teal .pl-dot { background: #14B8A6; }
[data-theme="dark"] .pl-prio.tone-grey { background: #0D1118; color: #A2AEC3; }
[data-theme="dark"] .pl-flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .pl-flag-fallback { background: #12171E; }
[data-theme="dark"] .pl-geo-more { background: #0D1118; color: #7397DE; }
[data-theme="dark"] .pl-deal-type { color: var(--pl-navy); }
[data-theme="dark"] .pl-deal-offer { color: #A1ACC4; }
[data-theme="dark"] .pl-activity { color: var(--pl-ink); }
[data-theme="dark"] .pl-next.is-none { color: #A4ACC1; }
[data-theme="dark"] .pl-next-icon { color: var(--pl-navy); }
[data-theme="dark"] .pl-next-main { color: var(--pl-navy); }
[data-theme="dark"] .pl-next-time { color: #A1ACC4; }
[data-theme="dark"] .pl-next.is-past .pl-next-main { color: var(--pl-navy); }
[data-theme="dark"] .pl-menu .btn-icon { border: 1px solid var(--pl-line); background: #181F28; color: #A1ACC4; box-shadow: 0 1px 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .pl-menu .btn-icon:hover { background: #0D1118; border-color: #32435D; color: var(--cmp-blue); box-shadow: 0 2px 6px rgba(0,0,0,0.364); }
[data-theme="dark"] .pl-menu .btn-icon:active { box-shadow: none; }
[data-theme="dark"] .pl-menu .btn-icon:focus-visible { outline: 2px solid var(--cmp-blue); }
[data-theme="dark"] .pl-menu.is-open .btn-icon, [data-theme="dark"] .pl-menu .btn-icon[aria-expanded="true"] { background: var(--cmp-blue); border-color: var(--cmp-blue); color: #fff; box-shadow: 0 2px 8px rgba(0,0,0,0.728); }
[data-theme="dark"] .pl-row:hover .pl-menu .btn-icon { border-color: #32435D; }
[data-theme="dark"] .pl-foot .cmp-foot-info { color: #A1ACC4; }
[data-theme="dark"] .pl-pages .cmp-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
[data-theme="dark"] .pl-per { color: #A1ACC4; }
[data-theme="dark"] .pl-bulkbar { background: var(--pl-blue-soft); border: 1px solid #32425D; color: var(--pl-ink); }
[data-theme="dark"] .pl-bulk-clear { color: var(--pl-blue); }
[data-theme="dark"] .pl-col { background: #0D1218; }
[data-theme="dark"] .pl-col-dot { background: var(--stage-color, #A9B5C6); }
[data-theme="dark"] .pl-col-name { color: var(--pl-navy); }
[data-theme="dark"] .pl-col-count { background: #12171E; color: #7397DE; }
[data-theme="dark"] .pl-col-count.tone-blue { background: #12171E; color: #7397DE; }
[data-theme="dark"] .pl-col-count.tone-green { background: #121E1B; color: #73DEC0; }
[data-theme="dark"] .pl-col-count.tone-amber { background: #12161E; color: #7393DE; }
[data-theme="dark"] .pl-col-count.tone-purple { background: #15121E; color: #8F68ED; }
[data-theme="dark"] .pl-col-count.tone-grey { background: #12171E; color: #7397DE; }
[data-theme="dark"] .pl-col-count.tone-red { background: #1E1214; color: #DE738A; }
[data-theme="dark"] .pl-col[data-key="ready"] .pl-col-count { background: #12171E; color: #7397DE; }
[data-theme="dark"] .pl-col[data-stage="7"] .pl-col-count, [data-theme="dark"] .pl-col[data-kind="won"] .pl-col-count { background: #121E17; color: #73DE9B; }
[data-theme="dark"] .pl-col-menu .btn-icon { color: #A1ACC4; }
[data-theme="dark"] .pl-col-menu .btn-icon:hover { background: rgba(226,228,233,0.06); }
[data-theme="dark"] .pl-col-sub { color: var(--pl-muted); }
[data-theme="dark"] .pl-col-wip.is-over { color: var(--cmp-red); }
[data-theme="dark"] .pl-col-add { background: #181F28; border: 1px solid var(--pl-line); color: var(--pl-blue); }
[data-theme="dark"] .pl-col-add:hover { background: #0D1118; }
[data-theme="dark"] .pl-card { background: #181F28; border: 1px solid var(--pl-line); box-shadow: 0 1px 2px rgba(0,0,0,0.28); outline: none; }
[data-theme="dark"] .pl-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.28); border-color: #32435D; }
[data-theme="dark"] .pl-card:focus-visible { box-shadow: 0 0 0 3px rgba(0,0,0,0.91); }
[data-theme="dark"] .pl-card-logo { border: 1px solid rgba(226,228,233,0.06); }
[data-theme="dark"] .pl-card-name { color: var(--pl-navy); }
[data-theme="dark"] .pl-card-status { color: #A1ACC4; }
[data-theme="dark"] .pl-card-menu .btn-icon { color: #A1ACC4; }
[data-theme="dark"] .pl-card-menu .btn-icon:hover { background: #0D1218; }
[data-theme="dark"] .pl-geo-chip { background: #0D1218; color: var(--pl-ink); }
[data-theme="dark"] .pl-card-deal { color: var(--pl-navy); }
[data-theme="dark"] .pl-card-deal-sub { color: var(--pl-muted); }
[data-theme="dark"] .pl-card-contact-line { color: var(--pl-muted); }
[data-theme="dark"] .pl-card-contact-line.is-none { color: var(--pl-muted); }
[data-theme="dark"] .pl-card-contact-line.is-none .icon { color: var(--pl-navy); }
[data-theme="dark"] .pl-ch-email, [data-theme="dark"] .pl-ch-call, [data-theme="dark"] .pl-ch-meeting, [data-theme="dark"] .pl-ch-message { color: var(--pl-blue); }
[data-theme="dark"] .pl-ch-telegram { color: #73B2DE; }
[data-theme="dark"] .pl-sep { color: #A5AEC0; }
[data-theme="dark"] .pl-card-next { color: var(--pl-navy); }
[data-theme="dark"] .pl-card-next.is-none { color: #A4ACC1; }
[data-theme="dark"] .pl-card-next.is-none .icon { color: var(--pl-navy); }
[data-theme="dark"] .pl-card-next.is-today { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .pl-card-next.is-today .icon { color: #DEA173; }
[data-theme="dark"] .pl-card-next.is-past { color: var(--pl-navy); }
[data-theme="dark"] .pl-card.is-kb { box-shadow: 0 0 0 3px #000000, 0 12px 28px rgba(0,0,0,0.416); }
[data-theme="dark"] .pl-placeholder { border: 2px dashed #32415D; background: rgba(76,137,242,0.05); }
[data-theme="dark"] .pl-col.is-target { background: #12171E; box-shadow: inset 0 0 0 2px #000000; }
[data-theme="dark"] .pl-drag-ghost { box-shadow: 0 18px 40px rgba(0,0,0,0.572) !important; border-color: #32425D !important; }
[data-theme="dark"] .pl-board-scroll { background: #12171E; }
[data-theme="dark"] .pl-board-thumb { background: #3C4D68; }
[data-theme="dark"] .pl-board-thumb:hover { background: #3D4D66; }
[data-theme="dark"] .pl-stage-opt { color: var(--color-text); }
[data-theme="dark"] .pl-stage-opt:hover:not(:disabled) { background: var(--color-surface-muted); }
[data-theme="dark"] .pl-stage-opt em { color: var(--color-text-muted); }
[data-theme="dark"] .modal-backdrop:has(.pl-modal-shell) { background: rgba(226,228,233,0.46); }
[data-theme="dark"] .pl-modal-shell { background: #181F28; }
[data-theme="dark"] .pl-modal-title { color: var(--pl-navy); }
[data-theme="dark"] .pl-modal-sub { color: #A1ACC4; }
[data-theme="dark"] .pl-modal-x { color: var(--pl-ink); }
[data-theme="dark"] .pl-modal-x:hover { background: #0D1218; }
[data-theme="dark"] .pl-sec { border: 1px solid var(--pl-line); background: #181F28; }
[data-theme="dark"] .pl-sec-num { background: var(--pl-blue); color: #fff; }
[data-theme="dark"] .pl-sec-head h3 { color: var(--pl-navy); }
[data-theme="dark"] .pl-sec-head p { color: #A7AEBE; }
[data-theme="dark"] .pl-label { color: var(--pl-ink); }
[data-theme="dark"] .pl-label b { color: #DE738A; }
[data-theme="dark"] .pl-input { border: 1px solid #32445D; background: #181F28; color: var(--pl-ink); outline: none; }
[data-theme="dark"] .pl-input::placeholder { color: #A4ADC1; }
[data-theme="dark"] .pl-input:focus { border-color: var(--pl-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .pl-help { color: #A7AEBE; }
[data-theme="dark"] .pl-err { color: #DE738A; }
[data-theme="dark"] .pl-field.is-invalid .pl-input, [data-theme="dark"] .pl-field.is-invalid .pl-combo-input { border-color: #E8496C; }
[data-theme="dark"] .pl-selectwrap .pl-caret { color: var(--pl-ink); }
[data-theme="dark"] .pl-dotselect .pl-dot { background: var(--dot, #A9B5C6); }
[data-theme="dark"] .pl-datewrap .pl-date-icon { color: var(--pl-ink); }
[data-theme="dark"] .pl-datewrap .pl-date { color: var(--pl-ink); }
[data-theme="dark"] .pl-datewrap:not(.has-value):not(:focus-within) .pl-date { color: transparent; }
[data-theme="dark"] .pl-date-ph { color: #A4ADC1; }
[data-theme="dark"] .pl-combo-input { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .pl-combo.is-open .pl-combo-input, [data-theme="dark"] .pl-combo-input:focus-within { border-color: var(--pl-blue); box-shadow: 0 0 0 1px var(--pl-blue) inset; }
[data-theme="dark"] .pl-combo-icon { color: var(--pl-ink); }
[data-theme="dark"] .pl-combo-input input { border: 0; background: none; outline: none; color: var(--pl-ink); }
[data-theme="dark"] .pl-combo-input input::placeholder { color: #A4ADC1; }
[data-theme="dark"] .pl-combo-caret { color: var(--pl-ink); }
[data-theme="dark"] .pl-dd { background: #181F28; border: 1px solid #32445D; box-shadow: 0 12px 32px rgba(0,0,0,0.364); }
[data-theme="dark"] .pl-dd-item:hover, [data-theme="dark"] .pl-dd-item.is-active { background: #0D1118; }
[data-theme="dark"] .pl-dd-name { color: var(--pl-navy); }
[data-theme="dark"] .pl-dd-sub { color: #A1ACC4; }
[data-theme="dark"] .pl-dd-empty { color: #A7AEBE; }
[data-theme="dark"] .pl-dd-foot { border-top: 1px solid var(--pl-line); color: var(--pl-blue); }
[data-theme="dark"] .pl-dd-foot:hover { background: #0D1118; }
[data-theme="dark"] .pl-tag { background: #0D1118; color: var(--pl-ink); }
[data-theme="dark"] .pl-tag button { color: #A1ACC4; }
[data-theme="dark"] .pl-btn-soft { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pl-btn-soft:hover { background: #12171E; }
[data-theme="dark"] .pl-inline-form { border: 1px dashed #32425D; background: #0D1018; }
[data-theme="dark"] .pl-extra-toggle { color: var(--pl-blue); }
[data-theme="dark"] .pl-bs-head { color: #A7AEBE; }
[data-theme="dark"] .pl-bs-row { border: 1px solid var(--pl-line); background: #181F28; }
[data-theme="dark"] .pl-bs-row.is-focus { border-color: var(--pl-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .pl-bs-grip { color: #A4ADC1; }
[data-theme="dark"] .pl-bs-color { border: 1px solid var(--pl-line); }
[data-theme="dark"] .pl-bs-kind { color: #A7AEBE; }
[data-theme="dark"] .pl-panel-head { border-bottom: 1px solid var(--pl-line); }
[data-theme="dark"] .pl-panel-title h2 { color: var(--pl-navy); }
[data-theme="dark"] .pl-panel-title p { color: #A1ACC4; }
[data-theme="dark"] .pl-panel-btn { border: 1px solid var(--pl-line); color: var(--pl-ink); }
[data-theme="dark"] .pl-panel-btn:hover { background: #0D1118; }
[data-theme="dark"] .pl-star.is-on { color: #DEB673; fill: #DEB673; }
[data-theme="dark"] .pl-panel-tabs { border-bottom: 1px solid var(--pl-line); }
[data-theme="dark"] .pl-ptab { color: #A1ACC4; border-bottom: 2px solid transparent; }
[data-theme="dark"] .pl-ptab span { background: #0D1118; }
[data-theme="dark"] .pl-ptab.is-active { color: var(--pl-blue); border-bottom-color: var(--pl-blue); }
[data-theme="dark"] .pl-kv-row { border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pl-kv-row > span { color: #A7AEBE; }
[data-theme="dark"] .pl-kv-row > b { color: var(--pl-navy); }
[data-theme="dark"] .pl-kv-row em { color: #A7AEBE; }
[data-theme="dark"] .pl-tl-icon { background: #0D1118; color: var(--pl-ink); }
[data-theme="dark"] .pl-tl-item.is-stage_move .pl-tl-icon { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .pl-tl-item.is-contact .pl-tl-icon { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pl-tl-item.is-follow_up .pl-tl-icon { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .pl-tl-item.is-deal .pl-tl-icon { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pl-tl-title { color: var(--pl-navy); }
[data-theme="dark"] .pl-tl-title em { color: #A7AEBE; }
[data-theme="dark"] .pl-tl-text { color: #95A2D0; }
[data-theme="dark"] .pl-tl-meta { color: #A4ACC1; }
[data-theme="dark"] .pl-tl-empty { color: #A4ACC1; }
[data-theme="dark"] .pl-fu { border: 1px solid var(--pl-line); }
[data-theme="dark"] .pl-fu.tone-today { background: #18140D; border-color: #5D4D32; }
[data-theme="dark"] .pl-fu.tone-past:not(.is-done) { border-color: #5D323A; }
[data-theme="dark"] .pl-fu-check { border: 1.5px solid #32435D; color: transparent; }
[data-theme="dark"] .pl-fu-check.is-done { background: var(--pl-blue); border-color: var(--pl-blue); color: #fff; }
[data-theme="dark"] .pl-fu-when { color: var(--pl-navy); }
[data-theme="dark"] .pl-fu-when em { color: #A7AEBE; }
[data-theme="dark"] .pl-fu-note { color: #95A2D0; }
[data-theme="dark"] .pl-fu-del { color: #A4ACC1; }
[data-theme="dark"] .pl-note { border: 1px solid var(--pl-line); background: #181F28; }
[data-theme="dark"] .pl-note.is-pinned { background: #18150D; border-color: #5D4D32; }
[data-theme="dark"] .pl-note-body { color: var(--pl-navy); }
[data-theme="dark"] .pl-note-meta { color: #A4ACC1; }
[data-theme="dark"] .pl-note-actions button { color: #A4ACC1; }
[data-theme="dark"] .pl-note-actions button:hover { color: var(--pl-ink); }
[data-theme="dark"] .page-deals { --cmp-navy: #E2E3E9; --cmp-ink: #E2E3E9; --cmp-label: #586EAB; --cmp-muted: #858FAA; --cmp-faint: #8490AA; --cmp-line: #12171E; --cmp-line-soft: #0D1118; --cmp-head-bg: #0D1218; --cmp-field: #0D1118; --cmp-blue: #4C89F2; --cmp-blue-soft: #0D1118; --cmp-green: #70EFAC; --cmp-green-soft: #121E19; --cmp-amber: #FBC37E; --cmp-amber-soft: #1E1B12; --cmp-red: #E15866; --cmp-red-soft: #180D0D; --cmp-purple: #8A53E1; --cmp-purple-soft: #120D18; --cmp-slate: #7F8EA3; --cmp-slate-soft: #0D1118; --cmp-orange: #DC6511; --cmp-orange-soft: #1E1B12; --dlg-line: #12171E; --dlg-div: #0D1218; --dlg-label: #7989AC; --dlg-ink: #E2E3E9; --dlg-field: #181F28; --dlg-chip: #12171E; --dlg-chip-ink: #4074E8; }
[data-theme="dark"] .page-deals .page-title { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .page-subtitle { color: #9DA8C8; }
[data-theme="dark"] .page-deals .dl-headmenu .btn-icon { border: 1px solid var(--cmp-line); background: #181F28; color: #96A3CF; }
[data-theme="dark"] .page-deals .dl-headmenu .btn-icon:hover { background: var(--cmp-field); border-color: #32425D; }
[data-theme="dark"] .page-deals .dl-summary { color: #A4AEC1; }
[data-theme="dark"] .page-deals .dl-summary i { color: #A0ADC5; }
[data-theme="dark"] .page-deals .dl-tabs { border-bottom: 1px solid var(--cmp-line); }
[data-theme="dark"] .page-deals .dl-tab { border-bottom: 2px solid transparent; color: #99A7CC; }
[data-theme="dark"] .page-deals .dl-tab:hover { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dl-tab.is-active { color: var(--cmp-blue); border-bottom-color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dl-tab-count { background: #0D1118; color: #95A2D0; }
[data-theme="dark"] .page-deals .dl-tab.is-active .dl-tab-count { background: #12171E; color: #7396DE; }
[data-theme="dark"] .page-deals .cmp-card { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .page-deals .dl-morebtn { border: 1px solid #32435D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .dl-morebtn:hover { background: var(--cmp-field); border-color: #32435D; }
[data-theme="dark"] .page-deals .dl-morebtn.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: #0D1118; }
[data-theme="dark"] .page-deals .dl-morebtn .icon { color: #95A2D0; }
[data-theme="dark"] .page-deals .dl-morebtn.is-on .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dl-viewtoggle { border: 1px solid var(--cmp-line); background: #181F28; }
[data-theme="dark"] .page-deals .dl-viewbtn { color: #99A7CC; }
[data-theme="dark"] .page-deals .dl-viewbtn:hover { background: var(--cmp-field); }
[data-theme="dark"] .page-deals .dl-viewbtn.is-active { background: #12181E; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dl-chips-label { color: #99A7CC; }
[data-theme="dark"] .page-deals .dl-chip { background: #12171E; color: #738FDE; }
[data-theme="dark"] .page-deals .dl-chip:hover { background: #12171E; }
[data-theme="dark"] .page-deals .dl-chip .icon { color: #7698E1; }
[data-theme="dark"] .page-deals .dl-chip-clear { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dl-table thead th { background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); border-bottom: 1px solid var(--cmp-line-soft); color: #95A7D0; }
[data-theme="dark"] .page-deals .dl-table tbody td { border-bottom: 1px solid var(--cmp-line-soft); color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .dl-table tbody tr.dl-row:hover { background: #0D1218; }
[data-theme="dark"] .page-deals .dl-menu .btn-icon { border: 1px solid #32435D; background: #181F28; color: #96A3CF; }
[data-theme="dark"] .page-deals .dl-menu .btn-icon:hover { background: var(--cmp-field); border-color: #32425D; }
[data-theme="dark"] .page-deals .dl-logo { border: 1px solid rgba(226,228,233,0.05); }
[data-theme="dark"] .page-deals .dl-partner-name { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dl-partner-cat { color: #A1ACC4; }
[data-theme="dark"] .page-deals .dl-rate { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dl-model.tone-blue { background: #0D1118; color: #738FDE; }
[data-theme="dark"] .page-deals .dl-model.tone-amber { background: #1E1B12; color: #DE9673; }
[data-theme="dark"] .page-deals .dl-model.tone-red { background: #180D0D; color: #DE7377; }
[data-theme="dark"] .page-deals .dl-model.tone-purple { background: #120D18; color: #9C73DE; }
[data-theme="dark"] .page-deals .dl-model.tone-teal { background: #121E1D; color: #66EBE1; }
[data-theme="dark"] .page-deals .dl-model.tone-grey { background: #12171E; color: #A6AEBF; }
[data-theme="dark"] .page-deals .dl-flag .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-deals .dl-geo-more { background: #0D1018; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dl-acct { color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .dl-period-from, [data-theme="dark"] .page-deals .dl-period-to { color: #99A7CC; }
[data-theme="dark"] .page-deals .dl-period-arrow { color: #A4ADC1; }
[data-theme="dark"] .page-deals .dl-period-to.is-open { color: #A3AEC2; }
[data-theme="dark"] .page-deals .dl-dot { background: currentColor; }
[data-theme="dark"] .page-deals .dl-status.tone-green { background: #121E19; color: #73DEA7; }
[data-theme="dark"] .page-deals .dl-status.tone-grey { background: #0D1118; color: #A4ADC1; }
[data-theme="dark"] .page-deals .dl-status.tone-amber { background: #1E1B12; color: #FAB871; }
[data-theme="dark"] .page-deals .dl-status.tone-orange { background: #1E1912; color: #DEA573; }
[data-theme="dark"] .page-deals .dl-status.tone-red { background: #180D0D; color: #DE737C; }
[data-theme="dark"] .page-deals .dl-upd-main { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dl-upd-sub { color: #A2ADC3; }
[data-theme="dark"] .page-deals .dl-reset { border: 1px solid transparent; background: none; color: var(--dl-reset, #DE7384); }
[data-theme="dark"] .page-deals .dl-reset:hover { background: #180D0F; border-color: #5D323A; }
[data-theme="dark"] .page-deals .dl-reset:focus-visible { outline: 2px solid #E13854; }
[data-theme="dark"] .page-deals .dlg-tabs { border-bottom: 1px solid var(--dlg-div); }
[data-theme="dark"] .page-deals .dlg-tab { border: 0; color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-tab:hover { background: #0D1118; color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-tab.is-active { background: #12171E; color: #7394DE; }
[data-theme="dark"] .page-deals .dlg-tab.is-active::after { background: #1A6BF2; }
[data-theme="dark"] .page-deals .dlg-tab-count { background: #12171E; color: #93A2D2; }
[data-theme="dark"] .page-deals .dlg-tab.is-active .dlg-tab-count { background: #12171E; color: #7394DE; }
[data-theme="dark"] .page-deals .dlg-search { border: 1px solid var(--dlg-line); background: var(--dlg-field); color: #A5ACC0; }
[data-theme="dark"] .page-deals .dlg-search input { border: 0; background: none; outline: none; color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-search input::placeholder { color: #A5ADC0; }
[data-theme="dark"] .page-deals .dlg-search:focus-within { border-color: #2D4876; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .page-deals .dlg-sel { border: 1px solid var(--dlg-line); background: var(--dlg-field); }
[data-theme="dark"] .page-deals .dlg-sel .cmp-select-ghost, [data-theme="dark"] .page-deals .dlg-sel > select { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-sel .cmp-select-caret { color: #93A2D2; }
[data-theme="dark"] .page-deals .dlg-sel.is-set { border-color: #32425D; background: #0D1118; }
[data-theme="dark"] .page-deals .dlg-more { border: 1px solid var(--dlg-line); background: var(--dlg-field); color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-more:hover, [data-theme="dark"] .page-deals .dlg-more.is-on { border-color: #32425D; background: #0D1118; }
[data-theme="dark"] .page-deals .dlg-toggle { border: 1px solid var(--dlg-line); background: var(--dlg-field); }
[data-theme="dark"] .page-deals .dlg-viewbtn { color: #93A2D2; }
[data-theme="dark"] .page-deals .dlg-viewbtn:hover { background: #0D1118; }
[data-theme="dark"] .page-deals .dlg-viewbtn.is-active { background: #1A6BF2; color: #fff; }
[data-theme="dark"] .page-deals .dlg-sort { border: 1px solid var(--dlg-line); background: var(--dlg-field); }
[data-theme="dark"] .page-deals .dlg-sort .cmp-sort-label { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-sort .cmp-select-ghost { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-sort > select { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-chip { border: 0; background: var(--dlg-chip); color: var(--dlg-chip-ink); }
[data-theme="dark"] .page-deals .dlg-chip .icon { color: currentColor; }
[data-theme="dark"] .page-deals .dlg-chip:hover { background: #12171E; }
[data-theme="dark"] .page-deals .dlg-clear { color: var(--dlg-chip-ink); }
[data-theme="dark"] .page-deals .dlg-card { border: 1px solid var(--dlg-line); background: #181F28; }
[data-theme="dark"] .page-deals .dlg-card:hover { border-color: #2D4876; box-shadow: 0 4px 16px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-deals .dlg-card:focus-within { border-color: #2D4876; }
[data-theme="dark"] .page-deals .dlg-logo-tile { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-deals .dlg-name { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-name:hover { color: #7394DE; }
[data-theme="dark"] .page-deals .dlg-verified-wrap { color: #73DE9A; }
[data-theme="dark"] .page-deals .dlg-cat { color: var(--dlg-label); }
[data-theme="dark"] .page-deals .dlg-card .dl-menu .btn-icon { border: 1px solid var(--dlg-line); background: #181F28; color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-card .dl-menu .btn-icon:hover, [data-theme="dark"] .page-deals .dlg-card .dl-menu.is-open .btn-icon { background: #0D1118; border-color: #32435D; color: #7394DE; }
[data-theme="dark"] .page-deals .dlg-col-r { border-left: 1px solid var(--dlg-div); }
[data-theme="dark"] .page-deals .dlg-lbl { color: var(--dlg-label); }
[data-theme="dark"] .page-deals .dlg-terms b { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-flag .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-deals .dlg-geo-more { background: #12171E; color: #7394DE; }
[data-theme="dark"] .page-deals .dlg-none { color: var(--dlg-label); }
[data-theme="dark"] .page-deals .dlg-aid b { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-copy { border: 0; background: none; color: #99A7CC; }
[data-theme="dark"] .page-deals .dlg-copy:hover { background: #0D1118; color: #7394DE; }
[data-theme="dark"] .page-deals .dlg-copy:focus-visible { outline: 2px solid #4D8BF2; }
[data-theme="dark"] .page-deals .dlg-rev b { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-trend.is-up { color: #78E9A2; }
[data-theme="dark"] .page-deals .dlg-trend.is-down { color: #DE7373; }
[data-theme="dark"] .page-deals .dlg-period { border-top: 1px solid var(--dlg-div); }
[data-theme="dark"] .page-deals .dlg-dates { color: #93A2D2; }
[data-theme="dark"] .page-deals .dlg-cal { color: #93A2D2; }
[data-theme="dark"] .page-deals .dlg-arrow { color: #93A2D2; }
[data-theme="dark"] .page-deals .dlg-dates .is-open { color: #93A2D2; }
[data-theme="dark"] .page-deals .dlg-days.tone-green { background: #121E17; color: #73DEA1; }
[data-theme="dark"] .page-deals .dlg-days.tone-grey { background: #12171E; color: #A2ADC3; }
[data-theme="dark"] .page-deals .dlg-days.tone-red { background: #1E1214; color: #DE7384; }
[data-theme="dark"] .page-deals .dlg-days.tone-amber { background: #1E1A12; color: #FAB871; }
[data-theme="dark"] .page-deals .dlg-foot { border-top: 1px solid var(--dlg-div); }
[data-theme="dark"] .page-deals .dlg-mgr-t b { color: var(--dlg-ink); }
[data-theme="dark"] .page-deals .dlg-mgr-t span { color: var(--dlg-label); }
[data-theme="dark"] .page-deals .dlg-mgr.is-none .dlg-mgr-t b { color: var(--dlg-label); }
[data-theme="dark"] .page-deals .dlg-view { border: 1px solid #32435D; background: #181F28; color: #7394DE; }
[data-theme="dark"] .page-deals .dlg-view:hover { background: #0D1118; border-color: #32425D; }
[data-theme="dark"] .page-deals .dl-foot { border-top: 0; background: none; }
[data-theme="dark"] .page-deals .dl-foot .cmp-select-sm .cmp-select-ghost, [data-theme="dark"] .page-deals .dl-foot .cmp-select-sm > select { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-crumb { color: #A1ACC4; }
[data-theme="dark"] .page-deals .dv-crumb-back { color: #99A7CC; }
[data-theme="dark"] .page-deals .dv-crumb-back:hover { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-crumb-sep { color: #9FACC6; }
[data-theme="dark"] .page-deals .dv-crumb span[aria-current] { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-menu .btn-icon { border: 1px solid var(--cmp-line); background: #181F28; color: #96A3CF; }
[data-theme="dark"] .page-deals .dv-menu .btn-icon:hover { background: var(--cmp-field); border-color: #32425D; }
[data-theme="dark"] .page-deals .dv-logo { border: 1px solid rgba(226,228,233,0.06); }
[data-theme="dark"] .page-deals .dv-head-text h1 { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-headline { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-headline-flag .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-deals .dv-account { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-account a { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-copy { border: 0; background: none; color: #A0ADC5; }
[data-theme="dark"] .page-deals .dv-copy:hover { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-chip { border: 1px solid var(--cmp-line); background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .dv-chip .icon { color: #A5ACC0; }
[data-theme="dark"] a.dv-chip:hover { border-color: #32435D; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-strip { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .page-deals .dv-stat { border-left: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-deals .dv-stat-icon.tone-green { background: #121E19; color: #7FEFB1; }
[data-theme="dark"] .page-deals .dv-stat-icon.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .page-deals .dv-stat-icon.tone-blue { background: #12171E; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-statdot { background: #16A34A; }
[data-theme="dark"] .page-deals .dv-statdot.tone-grey { background: #A9B5C6; }
[data-theme="dark"] .page-deals .dv-statdot.tone-amber { background: #F59E0B; }
[data-theme="dark"] .page-deals .dv-statdot.tone-red { background: #EF4444; }
[data-theme="dark"] .page-deals .dv-statdot.tone-orange { background: #F97316; }
[data-theme="dark"] .page-deals .dv-stat-label { color: #A2ADC3; }
[data-theme="dark"] .page-deals .dv-stat-value { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-stat-sub { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-tabs { border-bottom: 1px solid var(--cmp-line); }
[data-theme="dark"] .page-deals .dv-tab { border-bottom: 2px solid transparent; color: #99A7CC; }
[data-theme="dark"] .page-deals .dv-tab .icon { color: #A2ABC3; }
[data-theme="dark"] .page-deals .dv-tab:hover { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-tab.is-active { color: var(--cmp-blue); border-bottom-color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-tab.is-active .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-card-icon { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-card-icon.is-plain { background: none; }
[data-theme="dark"] .page-deals .dv-card-icon.tone-amber { background: #1E1A12; color: #DEB073; }
[data-theme="dark"] .page-deals .dv-card-title h2 { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-card-title p { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-rail-card .dv-btn-ghost { color: var(--cmp-blue); border-color: #32425D; }
[data-theme="dark"] .page-deals .dv-btn-ghost { border: 1px solid var(--cmp-line); background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .dv-btn-ghost:hover { background: var(--cmp-field); border-color: #32435D; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-btn-ghost .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-kvgrid::before { background: var(--cmp-line-soft); }
[data-theme="dark"] .page-deals .dv-kv { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-deals .dv-kv-label { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-kv-value { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-kv-value a { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-geoscope .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-deals .dv-geo-name { color: var(--cmp-navy) !important; }
[data-theme="dark"] .page-deals .dv-geo-ext { color: #A2ADC3; }
[data-theme="dark"] .page-deals .dv-geo-more { background: #0D1018; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-terms-box { background: #0D1118; }
[data-theme="dark"] .page-deals .dv-terms-icon { background: #12171E; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-terms-box strong { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-terms-box p { color: #99A7CC; }
[data-theme="dark"] .page-deals .dv-geotile { border: 1px solid var(--cmp-line); background: #181F28; color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-geotile .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-deals .dv-geotile em { background: #121E19; color: #60F1A3; }
[data-theme="dark"] .page-deals .dv-geotile.is-add { border-color: #32435D; background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-geotile.is-add:hover { background: #12171E; border-color: #32435D; }
[data-theme="dark"] .page-deals .dv-version { border: 1px solid var(--cmp-line-soft); background: #0D1118; }
[data-theme="dark"] .page-deals .dv-version.is-current { border-color: #32435D; background: #0D1218; }
[data-theme="dark"] .page-deals .dv-version.is-empty { border: 0; background: none; }
[data-theme="dark"] .page-deals .dv-version-tag { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-version-tag em { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-version-top strong { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-version-when { color: #99A7CC; }
[data-theme="dark"] .page-deals .dv-version-by { color: #A2ADC3; }
[data-theme="dark"] .page-deals .dv-version-reason { color: #A1ACC4; }
[data-theme="dark"] .page-deals .dv-diff-label { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-diff-old { color: #D2939D; }
[data-theme="dark"] .page-deals .dv-diff-new { color: #7FEFB1; }
[data-theme="dark"] .page-deals .dv-diff-row .icon { color: #A4ADC1; }
[data-theme="dark"] .page-deals .dv-feed-item { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-deals .dv-feed-icon.tone-green { background: #121E19; color: #7FEFB1; }
[data-theme="dark"] .page-deals .dv-feed-icon.tone-blue { background: #12171E; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-feed-icon.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .page-deals .dv-feed-icon.tone-amber { background: #1E1A12; color: #DEB073; }
[data-theme="dark"] .page-deals .dv-feed-body strong { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-feed-body span { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-feed-time { color: #A2ADC3; }
[data-theme="dark"] .page-deals .dv-note { border: 1px solid var(--cmp-line-soft); background: #0D1118; }
[data-theme="dark"] .page-deals .dv-note.is-empty { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-note-meta { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-note-meta i { color: #A0ADC5; }
[data-theme="dark"] .page-deals .dv-note-menu .btn-icon { border: 0; background: none; color: #A2ADC3; }
[data-theme="dark"] .page-deals .dv-contact-menu .btn-icon { border: 1px solid var(--cmp-line); background: #181F28; color: #A2ADC3; }
[data-theme="dark"] .page-deals .dv-note-menu .btn-icon:hover, [data-theme="dark"] .page-deals .dv-contact-menu .btn-icon:hover { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-note-body { color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .dv-contact-name { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-contact-name:hover { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-contact-role { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-contact-btn.is-tg { background: #1D9BF0; color: #fff; }
[data-theme="dark"] .page-deals .dv-contact-btn.is-tg svg, [data-theme="dark"] .page-deals .dv-contact-btn.is-tg svg * { fill: #fff !important; color: #fff; }
[data-theme="dark"] .page-deals .dv-contact-btn.is-tg svg circle, [data-theme="dark"] .page-deals .dv-contact-btn.is-tg svg rect { fill: none !important; }
[data-theme="dark"] .page-deals .dv-contact-btn.is-mail { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-quick-btn { border: 1px solid var(--cmp-line); background: #181F28; color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-quick-btn:hover { background: var(--cmp-field); border-color: #32435D; }
[data-theme="dark"] .page-deals .dv-quick-btn .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-reminder { background: #0D1118; color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .dv-reminder em { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-reminder .icon { color: #DEB073; }
[data-theme="dark"] .page-deals .dv-table thead th { background: var(--cmp-head-bg); border-top: 1px solid var(--cmp-line-soft); color: #95A7D0; }
[data-theme="dark"] .page-deals .dv-table tbody td { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-deals .dv-doc-name { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-doc-name .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-sub { color: #A2ADC3; }
[data-theme="dark"] .page-deals .dv-linked-row { border: 1px solid var(--cmp-line-soft); color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .dv-linked-row:hover { border-color: #32435D; background: #0D1118; }
[data-theme="dark"] .page-deals .dv-linked-row .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .dv-linked-row em { color: #A5ACC0; }
[data-theme="dark"] .page-deals .dv-empty-line { color: #A2ADC3; }
[data-theme="dark"] .page-deals .df-titleblock h1 { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-titleblock p { color: #9DA8C8; }
[data-theme="dark"] .page-deals .df-num { background: var(--cmp-blue); color: #fff; }
[data-theme="dark"] .page-deals .df-head h2 { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-head p { color: #A5ACC0; }
[data-theme="dark"] .page-deals .df-label { color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .df-req { color: #DE738A; }
[data-theme="dark"] .page-deals .df-input { border: 1px solid #32425D; background: #181F28; color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-input::placeholder { color: #A2ADC3; }
[data-theme="dark"] .page-deals .df-input:hover { border-color: #32435D; }
[data-theme="dark"] .page-deals .df-input:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-deals .df-input:disabled { background: #0D1118; color: #A2ADC3; }
[data-theme="dark"] .page-deals .df-input.is-invalid { border-color: #E8496C; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .page-deals .df-textarea { border: 1px solid #32425D; background: #181F28; color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-textarea::placeholder { color: #A2ADC3; }
[data-theme="dark"] .page-deals .df-textarea:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-deals .df-counter { color: #A2ADC3; }
[data-theme="dark"] .page-deals .df-prefix, [data-theme="dark"] .page-deals .df-suffix { color: #99A7CC; }
[data-theme="dark"] .page-deals .df-prefix { border-right: 1px solid #32415D; }
[data-theme="dark"] .page-deals .df-suffix { border-left: 1px solid #32415D; }
[data-theme="dark"] .page-deals .df-input-icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .df-input-group.is-disabled .df-input-icon { color: #9EADC7; }
[data-theme="dark"] .page-deals .df-input.df-date { color: transparent; }
[data-theme="dark"] .page-deals .df-datelabel { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-select { border: 1px solid #32425D; background: #181F28; }
[data-theme="dark"] .page-deals .df-select:hover { border-color: #32435D; }
[data-theme="dark"] .page-deals .df-select:focus-within { border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-deals .df-selectbox { border: 0; background: none; outline: none; color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-select-caret { color: #99A7CC; }
[data-theme="dark"] .page-deals .df-select-lead { color: #fff; }
[data-theme="dark"] .page-deals .df-select-sub { color: #A5ACC0; }
[data-theme="dark"] .page-deals .df-select.has-chips .df-selectbox { color: #A5ACC0; }
[data-theme="dark"] .page-deals .df-geochip { background: #12171E; color: #738FDE; }
[data-theme="dark"] .page-deals .df-geochip-x { border: 0; background: none; color: #7698E1; }
[data-theme="dark"] .page-deals .df-geochip-x:hover { background: #12171E; }
[data-theme="dark"] .page-deals .df-seg { border: 1px solid #32425D; background: #181F28; }
[data-theme="dark"] .page-deals .df-seg-item { border-left: 1px solid #32415D; color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .df-seg-item:hover { background: var(--cmp-field); }
[data-theme="dark"] .page-deals .df-seg-item.is-on { background: var(--cmp-blue); color: #fff; }
[data-theme="dark"] .page-deals .df-info { background: #0D1118; }
[data-theme="dark"] .page-deals .df-info-icon { background: #12171E; color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .df-info strong { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-info p { color: #99A7CC; }
[data-theme="dark"] .page-deals .df-check { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-check span { border: 1.5px solid #32435D; background: #181F28; }
[data-theme="dark"] .page-deals .df-check input:checked + span { background: var(--cmp-blue); border-color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .df-check input:checked + span::after { border: solid #333D47; }
[data-theme="dark"] .page-deals .df-preview-head h2 { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-preview-head p { color: #A5ACC0; }
[data-theme="dark"] .page-deals .df-preview-box { border: 1px solid var(--cmp-line); }
[data-theme="dark"] .page-deals .df-preview-logo { background: #0D1118; color: #fff; }
[data-theme="dark"] .page-deals .df-preview-id strong { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-preview-id em { color: #A5ACC0; }
[data-theme="dark"] .page-deals .df-preview-rows.is-bordered { border-top: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .page-deals .df-prow > span { color: #A5ACC0; }
[data-theme="dark"] .page-deals .df-prow > b { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-prow > b.is-link { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .df-prow-status { color: #84F2B3; }
[data-theme="dark"] .page-deals .df-prow-status .dv-statdot { background: #2D764C; }
[data-theme="dark"] .page-deals .df-prow-status .dv-statdot::after { background: #027435; }
[data-theme="dark"] .page-deals .df-next-icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .df-next-head h2 { color: var(--cmp-navy); }
[data-theme="dark"] .page-deals .df-next-head p { color: #A5ACC0; }
[data-theme="dark"] .page-deals .df-next-list li { color: var(--cmp-ink); }
[data-theme="dark"] .page-deals .df-next-list .icon { color: var(--cmp-blue); }
[data-theme="dark"] .page-deals .df-bar { background: #181F28; border-top: 1px solid var(--cmp-line); box-shadow: 0 -4px 16px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-deals .df-card .form-error { color: #DE738A; }
[data-theme="dark"] .aa-title { color: var(--cmp-navy); }
[data-theme="dark"] .aa-btn-ghost { background: #181F28; border: 1px solid #32445D; color: var(--cmp-ink); }
[data-theme="dark"] .aa-btn-ghost:hover { background: var(--cmp-field); }
[data-theme="dark"] .aa-btn-ghost.is-blue { color: var(--cmp-blue); }
[data-theme="dark"] .aa-btn-ghost.is-on { border-color: var(--cmp-blue); color: var(--cmp-blue); background: var(--cmp-blue-soft); }
[data-theme="dark"] .aa-btn-primary { background: var(--cmp-blue); border: 1px solid var(--cmp-blue); color: #fff; }
[data-theme="dark"] .aa-btn-primary:hover { background: #0F5AD8; }
[data-theme="dark"] .aa-btn-danger { background: #180D0E; border: 1px solid #5D3237; color: #DE737F; }
[data-theme="dark"] .aa-link { background: none; border: 0; color: var(--cmp-blue); }
[data-theme="dark"] .aa-link-blue { color: var(--cmp-blue); }
[data-theme="dark"] .aa-stats { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aa-stat { border-left: 1px solid #32445D; }
[data-theme="dark"] .aa-stat-ic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .aa-stat-ic.tone-green { background: #121E17; color: #73DE9A; }
[data-theme="dark"] .aa-stat-ic.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .aa-stat-ic.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .aa-stat-l { color: #A1ACC4; }
[data-theme="dark"] .aa-stat-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-stat-s { color: #A3ACC2; }
[data-theme="dark"] .aa-stat-s i { color: #A2ADC3; }
[data-theme="dark"] .aa-chg.is-up { background: #121E17; color: #67EEA0; }
[data-theme="dark"] .aa-chg.is-down { background: #1E1214; color: #DE737F; }
[data-theme="dark"] .aa-nochange { color: #A4ADC1; }
[data-theme="dark"] .aa-flat { color: #99A7CC; }
[data-theme="dark"] .aa-card { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aa-tab { background: #0D1118; color: var(--cmp-ink); }
[data-theme="dark"] .aa-tab:hover { background: #12171E; }
[data-theme="dark"] .aa-tab.is-active { background: var(--cmp-blue); color: #fff; }
[data-theme="dark"] .aa-tab-n { background: rgba(226,228,233,0.08); }
[data-theme="dark"] .aa-tab.is-active .aa-tab-n { background: rgba(226,228,233,0.28); color: #fff; }
[data-theme="dark"] .aa-tab-n.tone-red { background: #E11D48; color: #fff; }
[data-theme="dark"] .aa-viewbtn { border: 1px solid #32445D; background: #181F28; color: #99A7CC; }
[data-theme="dark"] .aa-viewbtn.is-active { background: #0D1118; border-color: #32415D; color: var(--cmp-blue); }
[data-theme="dark"] .aa-search { border: 1px solid #32445D; background: #181F28; color: #A4ADC1; }
[data-theme="dark"] .aa-search input { border: 0; outline: 0; background: none; color: var(--cmp-ink); }
[data-theme="dark"] .aa-search input::placeholder { color: #A4ADC1; }
[data-theme="dark"] .aa-select { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .aa-select select { border: 0; background: none; color: var(--cmp-ink); outline: 0; }
[data-theme="dark"] .aa-select .aa-select-caret { color: #95A2D0; }
[data-theme="dark"] .aa-morebar-l { color: #A3ACC2; }
[data-theme="dark"] .aa-chip { background: #0D1118; color: var(--cmp-ink); }
[data-theme="dark"] .aa-chip-x { color: #95A2D0; }
[data-theme="dark"] .aa-chip-x:hover { color: #DE738A; }
[data-theme="dark"] .aa-clear { color: var(--cmp-blue); }
[data-theme="dark"] .aa-bulkbar { background: #0D1118; border-top: 1px solid #32435D; border-bottom: 1px solid #32435D; }
[data-theme="dark"] .aa-bulk-n { color: var(--cmp-ink); }
[data-theme="dark"] .aa-table thead th { background: #0D1118; border-top: 1px solid #2B3A50; border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .aa-th { color: #A1ACC4; }
[data-theme="dark"] .aa-th .icon { color: #A4ADC1; }
[data-theme="dark"] .aa-th.is-on { color: var(--cmp-blue); }
[data-theme="dark"] .aa-th.is-on .icon { color: var(--cmp-blue); }
[data-theme="dark"] .aa-table tbody td { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .aa-row:hover { background: #0D1118; }
[data-theme="dark"] .aa-row.is-selected { background: #0D1118; }
[data-theme="dark"] .aa-check span { border: 1.5px solid #32435D; background: #181F28; }
[data-theme="dark"] .aa-check input:checked + span { background: var(--cmp-blue); border-color: var(--cmp-blue); box-shadow: inset 0 0 0 3px #000000; }
[data-theme="dark"] .aa-check input:indeterminate + span { background: var(--cmp-blue); border-color: var(--cmp-blue); box-shadow: inset 0 0 0 3px #000000; }
[data-theme="dark"] .aa-acct-id { color: var(--cmp-navy); }
[data-theme="dark"] .aa-acct-id:hover { color: var(--cmp-blue); }
[data-theme="dark"] .aa-acct-login { color: #A4ADC1; }
[data-theme="dark"] .aa-co { color: var(--cmp-ink); color: #99A7CC; }
[data-theme="dark"] .aa-more-n { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .aa-geo { color: var(--cmp-ink); }
[data-theme="dark"] .aa-geo .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .aa-pill.tone-green { background: #121E17; color: #67EEA0; }
[data-theme="dark"] .aa-pill.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .aa-pill.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .aa-pill.tone-amber { background: #1E1A12; color: #FAB871; }
[data-theme="dark"] .aa-pill.tone-grey { background: #0D1118; color: #A3ACC2; }
[data-theme="dark"] .aa-terms-text { color: var(--cmp-navy); }
[data-theme="dark"] .aa-terms-sub { color: #A4ADC1; }
[data-theme="dark"] .aa-month > strong { color: var(--cmp-navy); }
[data-theme="dark"] .aa-month-top strong { color: var(--cmp-navy); }
[data-theme="dark"] .aa-month-sub { color: #A4ADC1; }
[data-theme="dark"] .aa-status i { background: currentColor; }
[data-theme="dark"] .aa-status.tone-green { background: #121E17; color: #67EEA0; }
[data-theme="dark"] .aa-status.tone-amber { background: #1E1A12; color: #FAB871; }
[data-theme="dark"] .aa-status.tone-grey { background: #0D1118; color: #A3ACC2; }
[data-theme="dark"] .aa-att-dot { background: #E11D48; }
[data-theme="dark"] .aa-rowmenu .btn-icon { border: 1px solid #32435D; background: #181F28; color: #99A7CC; }
[data-theme="dark"] .aa-foot { border-top: 1px solid #2B3A50; }
[data-theme="dark"] .aa-showing { color: #99A7CC; }
[data-theme="dark"] .aa-page { border: 1px solid #32435D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .aa-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
[data-theme="dark"] .aa-page.is-disabled { color: #A2AEC3; }
[data-theme="dark"] .aa-page-gap { color: #A4ADC1; }
[data-theme="dark"] .aa-perpage { color: #99A7CC; }
[data-theme="dark"] .aa-empty { color: #A3ACC2; }
[data-theme="dark"] .aa-empty h3, [data-theme="dark"] .aa-empty h2 { color: var(--cmp-navy); }
[data-theme="dark"] .aa-empty.is-inline .icon { color: #A4ADC1; }
[data-theme="dark"] .aa-gcard { border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aa-gcard:hover { border-color: #32435D; box-shadow: 0 6px 18px rgba(0,0,0,0.28); }
[data-theme="dark"] .aa-gcard.is-selected { border-color: var(--cmp-blue); }
[data-theme="dark"] .aa-gcard-name { color: var(--cmp-navy); }
[data-theme="dark"] .aa-gcard-login { color: #A4ADC1; }
[data-theme="dark"] .aa-gcard-co { color: var(--cmp-ink); }
[data-theme="dark"] .aa-gcard-dot { color: #A2ADC3; }
[data-theme="dark"] .aa-gcard-site { color: #99A7CC; }
[data-theme="dark"] .aa-gcard-site em { color: var(--cmp-blue); }
[data-theme="dark"] .aa-gcard-row { border-top: 1px solid #2B3A50; }
[data-theme="dark"] .aa-gcard-att { color: #DE737F; }
[data-theme="dark"] .aa-crumbs a { color: var(--cmp-blue); }
[data-theme="dark"] .aa-crumbs strong { color: var(--cmp-blue); }
[data-theme="dark"] .aa-crumb-sep { color: #A4ADC1; }
[data-theme="dark"] .aa-head-title { color: var(--cmp-navy); }
[data-theme="dark"] .aa-head-kind { color: #A3ACC2; }
[data-theme="dark"] .aa-head-co { color: var(--cmp-blue); }
[data-theme="dark"] .aa-head-co a { color: inherit; }
[data-theme="dark"] .aa-dot { color: #A4ADC1; }
[data-theme="dark"] .aa-head-meta { color: var(--cmp-ink); }
[data-theme="dark"] .aa-chip-soft { background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .aa-head-created { color: #99A7CC; }
[data-theme="dark"] .aa-head-created .icon { color: #A2ABC3; }
[data-theme="dark"] .aa-field-box { background: #0D1118; border: 1px solid #32445D; }
[data-theme="dark"] .aa-fb-l { color: #A3ACC2; }
[data-theme="dark"] .aa-fb-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-ibtn { border: 1px solid #32445D; background: #181F28; color: var(--cmp-blue); }
[data-theme="dark"] .aa-ibtn:hover { background: var(--cmp-field); }
[data-theme="dark"] .aa-ibtn.is-plain { border: 0; background: none; color: var(--cmp-blue); }
[data-theme="dark"] .aa-dtabs { border-bottom: 1px solid var(--cmp-line); }
[data-theme="dark"] .aa-dtab { color: #99A7CC; }
[data-theme="dark"] .aa-dtab .icon { color: #A2ABC3; }
[data-theme="dark"] .aa-dtab.is-active { background: #181F28; color: var(--cmp-blue); border: 1px solid var(--cmp-line); border-bottom-color: #333D47; }
[data-theme="dark"] .aa-dtab.is-active .icon { color: var(--cmp-blue); }
[data-theme="dark"] .aa-dtab.is-active::after { background: var(--cmp-blue); }
[data-theme="dark"] .aa-strip { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aa-cell { border-left: 1px solid #32445D; }
[data-theme="dark"] .aa-cell-ic.tone-green { background: #121E17; color: #73DE9A; }
[data-theme="dark"] .aa-cell-ic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .aa-cell-ic.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .aa-bigdot { background: #16A34A; }
[data-theme="dark"] .aa-cell-l { color: #A1ACC4; }
[data-theme="dark"] .aa-cell-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-cell-s { color: #A3ACC2; }
[data-theme="dark"] .aa-panel { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aa-panel-ic { background: #0D1018; color: var(--cmp-blue); }
[data-theme="dark"] .aa-panel-ic.tone-red { background: #180D0E; color: #DE737F; }
[data-theme="dark"] .aa-panel-title { color: var(--cmp-navy); }
[data-theme="dark"] .aa-panel-sub { color: #A3ACC2; }
[data-theme="dark"] .aa-abox { background: #0D1118; border: 1px solid #32445D; }
[data-theme="dark"] .aa-abox-ic { background: #181F28; color: var(--cmp-blue); }
[data-theme="dark"] .aa-abox-l { color: #A3ACC2; }
[data-theme="dark"] .aa-abox-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-abox-v a { color: var(--cmp-blue); }
[data-theme="dark"] .aa-muted { color: #A4ADC1; }
[data-theme="dark"] .aa-geotile { border: 1px solid #32445D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .aa-geotile.is-add { color: var(--cmp-blue); }
[data-theme="dark"] .aa-badge-green { background: #121E17; color: #67EEA0; }
[data-theme="dark"] .aa-snap-m { border-left: 1px solid #32445D; }
[data-theme="dark"] .aa-snap-l { color: #A1ACC4; }
[data-theme="dark"] .aa-snap-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-snap-s { color: #A3ACC2; }
[data-theme="dark"] .aa-lrow, [data-theme="dark"] .aa-drow { border: 1px solid #32445D; }
[data-theme="dark"] .aa-lrow-ic, [data-theme="dark"] .aa-drow-ic { background: #0D1018; color: var(--cmp-blue); }
[data-theme="dark"] .aa-drow-ic.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .aa-lrow-t, [data-theme="dark"] .aa-drow-t { color: var(--cmp-navy); }
[data-theme="dark"] .aa-lrow-url { color: var(--cmp-blue); }
[data-theme="dark"] .aa-drow-s { color: #A3ACC2; }
[data-theme="dark"] .aa-lrow-act { border-left: 1px solid #32445D; }
[data-theme="dark"] .aa-drow-date { border-left: 1px solid #32445D; }
[data-theme="dark"] .aa-drow-date strong { color: var(--cmp-navy); }
[data-theme="dark"] .aa-drow-date span { color: #A3ACC2; }
[data-theme="dark"] .aa-drow-status { border-left: 1px solid #32445D; }
[data-theme="dark"] .aa-viewall { color: var(--cmp-blue); }
[data-theme="dark"] .aa-ptiles { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .aa-ptile { border-left: 1px solid #32445D; }
[data-theme="dark"] .aa-ptile-ic { background: #12171E; color: var(--cmp-blue); }
[data-theme="dark"] .aa-ptile-ic.tone-green { background: #121E17; color: #61F1A0; }
[data-theme="dark"] .aa-ptile-ic.tone-purple { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .aa-ptile-ic.tone-red { background: #180D0D; color: #DE7A73; }
[data-theme="dark"] .aa-ptile-ic.tone-amber { background: #1E1B12; color: #F4BF72; }
[data-theme="dark"] .aa-ptile-l { color: #A1ACC4; }
[data-theme="dark"] .aa-ptile-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-ptile-s { color: #A3ACC2; }
[data-theme="dark"] .aa-legend { color: var(--cmp-ink); }
[data-theme="dark"] .aa-ax { fill: #A3ACC2; }
[data-theme="dark"] .aa-tip { background: #181F28; border: 1px solid var(--cmp-line); box-shadow: 0 10px 30px rgba(0,0,0,0.364); color: var(--cmp-ink); }
[data-theme="dark"] .aa-tip strong { color: var(--cmp-navy); }
[data-theme="dark"] .aa-tip span b { color: var(--cmp-navy); }
[data-theme="dark"] .aa-brows li { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .aa-brow-ic { color: var(--cmp-blue); }
[data-theme="dark"] .aa-brow-l { color: var(--cmp-ink); }
[data-theme="dark"] .aa-brow-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-mtable th { color: #A1ACC4; border-bottom: 1px solid #2B3A50; border-left: 1px solid #2B3A50; }
[data-theme="dark"] .aa-mtable td { color: var(--cmp-ink); border-bottom: 1px solid #2B3950; border-left: 1px solid #2B3950; }
[data-theme="dark"] .aa-mtable td.c-month { color: var(--cmp-navy); }
[data-theme="dark"] .aa-label { color: var(--cmp-ink); }
[data-theme="dark"] .aa-label .req { color: #DE738A; }
[data-theme="dark"] .aa-input { border: 1px solid #32445D; background: #181F28; color: var(--cmp-ink); }
[data-theme="dark"] .aa-input:focus { outline: none; border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.39); }
[data-theme="dark"] .aa-input.is-invalid, [data-theme="dark"] .aa-cselect-btn.is-invalid, [data-theme="dark"] .aa-chipbox.is-invalid { border-color: #E8496C; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .aa-form-h { color: var(--cmp-navy); }
[data-theme="dark"] .aa-toggle { border-top: 1px solid #2B3950; }
[data-theme="dark"] .aa-toggle-ui { background: #293B56; }
[data-theme="dark"] .aa-toggle-ui::after { background: #181F28; }
[data-theme="dark"] .aa-toggle input:checked + .aa-toggle-ui { background: var(--cmp-blue); }
[data-theme="dark"] .aa-toggle-txt { color: var(--cmp-ink); }
[data-theme="dark"] .aa-toggle-txt small { color: #A3ACC2; }
[data-theme="dark"] .aa-form-msg { color: #67EEA0; }
[data-theme="dark"] .aa-danger-row { border-top: 1px solid #2B3950; }
[data-theme="dark"] .aa-danger-row strong { color: var(--cmp-navy); }
[data-theme="dark"] .aa-danger-row span { color: #A3ACC2; }
[data-theme="dark"] .aa-danger-row.is-red strong { color: #DE737F; }
[data-theme="dark"] .aa-act-dot { background: #344B6F; }
[data-theme="dark"] .aa-act-dot.kind-reveal { background: #F59E0B; }
[data-theme="dark"] .aa-act-dot.kind-create, [data-theme="dark"] .aa-act-dot.kind-deal { background: #16A34A; }
[data-theme="dark"] .aa-act-dot.kind-status, [data-theme="dark"] .aa-act-dot.kind-archive { background: #E11D48; }
[data-theme="dark"] .aa-act-dot.kind-link, [data-theme="dark"] .aa-act-dot.kind-geo, [data-theme="dark"] .aa-act-dot.kind-edit, [data-theme="dark"] .aa-act-dot.kind-settings { background: var(--cmp-blue); }
[data-theme="dark"] .aa-act-t { color: var(--cmp-navy); }
[data-theme="dark"] .aa-act-b { color: #99A7CC; }
[data-theme="dark"] .aa-act-m { color: #A4ADC1; }
[data-theme="dark"] .aa-act-empty { color: #A4ADC1; }
[data-theme="dark"] .aa-cselect-btn { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .aa-cselect-btn .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .aa-cselect-empty { background: #0D1118; color: #A4ADC1; }
[data-theme="dark"] .aa-cselect-txt strong { color: var(--cmp-navy); }
[data-theme="dark"] .aa-cselect-txt small { color: #A3ACC2; }
[data-theme="dark"] .aa-caret { color: #95A2D0; }
[data-theme="dark"] .aa-menu { background: #181F28; border: 1px solid var(--cmp-line); box-shadow: 0 12px 32px rgba(0,0,0,0.364); }
[data-theme="dark"] .aa-menu-search { border-bottom: 1px solid var(--cmp-line-soft); }
[data-theme="dark"] .aa-menu-item { background: none; border: 0; }
[data-theme="dark"] .aa-menu-item:hover { background: var(--cmp-field); }
[data-theme="dark"] .aa-menu-txt strong { color: var(--cmp-navy); }
[data-theme="dark"] .aa-menu-txt small { color: #A3ACC2; }
[data-theme="dark"] .aa-menu-empty { color: #A4ADC1; }
[data-theme="dark"] .aa-inputbtn { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .aa-inputbtn .aa-input:focus { box-shadow: none; }
[data-theme="dark"] .aa-inputbtn:focus-within { border-color: var(--cmp-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.39); }
[data-theme="dark"] .aa-inbtn { border: 0; border-left: 1px solid #32445D; background: #181F28; color: var(--cmp-blue); }
[data-theme="dark"] .aa-inbtn:hover { background: var(--cmp-field); }
[data-theme="dark"] .aa-addon-ic { color: var(--cmp-blue); }
[data-theme="dark"] .aa-addon-ic.is-right { color: #A1ACC4; }
[data-theme="dark"] .aa-addon.is-prefix .aa-addon-ic { color: #A1ACC4; }
[data-theme="dark"] .aa-addon.is-date .aa-addon-ic { color: var(--cmp-blue); }
[data-theme="dark"] .aa-chipbox { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .aa-fchip { background: #0D1118; color: var(--cmp-ink); }
[data-theme="dark"] .aa-fchip-x { color: #95A2D0; background: none; border: 0; }
[data-theme="dark"] .aa-fchip-x:hover { color: #DE738A; }
[data-theme="dark"] .aa-chipsearch { color: #A2ABC3; }
[data-theme="dark"] .aa-chipsearch input { border: 0; outline: 0; color: var(--cmp-ink); background: none; }
[data-theme="dark"] .aa-chipsearch input::placeholder { color: #A4ADC1; }
[data-theme="dark"] .aa-lrowf-l { color: var(--cmp-ink); }
[data-theme="dark"] .aa-lbtn { border: 1px solid #32445D; background: #181F28; color: var(--cmp-blue); }
[data-theme="dark"] .aa-lbtn.is-del { color: #A2ABC3; }
[data-theme="dark"] .aa-lbtn.is-del:hover { color: #DE737F; border-color: #5D3238; }
[data-theme="dark"] .aa-addrow { border: 1px dashed #32435D; background: #0D1118; color: var(--cmp-blue); }
[data-theme="dark"] .aa-dealhead span { color: #A3ACC2; }
[data-theme="dark"] .aa-error { color: #DE738A; }
[data-theme="dark"] .aa-ready { background: #121E17; color: #67EEA0; }
[data-theme="dark"] .aa-ready.is-warn { background: #1E1A12; color: #FAB871; }
[data-theme="dark"] .aa-pv-head { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .aa-pv-logo-empty { background: #0D1118; color: var(--cmp-navy); }
[data-theme="dark"] .aa-pv-co { color: var(--cmp-ink); }
[data-theme="dark"] .aa-pv-co a { color: var(--cmp-blue); }
[data-theme="dark"] .aa-pv-group { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .aa-pv-row > .icon { color: #A2ABC3; }
[data-theme="dark"] .aa-pv-k { color: #A3ACC2; }
[data-theme="dark"] .aa-pv-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-pv-v a { color: var(--cmp-blue); }
[data-theme="dark"] .aa-pv-v.is-blue { color: var(--cmp-blue); }
[data-theme="dark"] .aa-pv-open { color: var(--cmp-blue); }
[data-theme="dark"] .aa-pv-deal { background: #0D1118; border: 1px solid #32445D; }
[data-theme="dark"] .aa-pv-deal > div { color: var(--cmp-navy); }
[data-theme="dark"] .aa-pv-deal small { color: #A3ACC2; }
[data-theme="dark"] .aa-note { background: #0D1018; border: 1px solid #32415D; }
[data-theme="dark"] .aa-note-ic { background: #1668F5; color: #fff; }
[data-theme="dark"] .aa-note strong { color: var(--cmp-navy); }
[data-theme="dark"] .aa-note p { color: #99A7CC; }
[data-theme="dark"] .aa-sticky .aa-btn-ghost { background: #181F28; }
[data-theme="dark"] .aa-sticky .aa-btn-primary { box-shadow: 0 8px 20px rgba(0,0,0,0.65); }
[data-theme="dark"] .aa-stat-badge { color: #fff; }
[data-theme="dark"] .aa-stat-ic.tone-green .aa-stat-badge { background: #16A34A; }
[data-theme="dark"] .aa-stat-ic.tone-amber .aa-stat-badge { background: #F59E0B; }
[data-theme="dark"] .page-perf .page-header .page-icon { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-page-menu .btn-icon { border: 1px solid var(--pl-line); background: #181F28; color: var(--pl-blue); }
[data-theme="dark"] .pf-page-menu .btn-icon:hover { background: #0D1118; }
[data-theme="dark"] .pf-muted { color: #A4ACC1; }
[data-theme="dark"] .pf-link { color: var(--pl-blue); }
[data-theme="dark"] .pf-h3 { color: var(--pl-navy); }
[data-theme="dark"] .page-perf .tone-green { color: #7FEFB1; }
[data-theme="dark"] .page-perf .tone-red { color: #DE738A; }
[data-theme="dark"] .page-perf .tone-blue { color: var(--pl-blue); }
[data-theme="dark"] .page-perf .tone-amber { color: #DEB073; }
[data-theme="dark"] .pf-period-nav { border-right: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-navbtn { border: 1px solid var(--pl-line); background: #181F28; color: var(--pl-blue); }
[data-theme="dark"] .pf-navbtn:hover { background: #0D1118; }
[data-theme="dark"] .pf-period-ic { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-period-title { color: var(--pl-navy); }
[data-theme="dark"] .pf-period-sub { color: #A7AEBE; }
[data-theme="dark"] .pf-cell b { color: var(--pl-navy); }
[data-theme="dark"] .pf-cell span { color: #A7AEBE; }
[data-theme="dark"] .pf-cell em { background: none !important; }
[data-theme="dark"] .pf-cell .pf-cell-chg small { color: #A7AEBE; }
[data-theme="dark"] .pf-cell.has-ic .pf-cell-ic { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-dot.tone-green { background: #22A55A; }
[data-theme="dark"] .pf-dot.tone-red { background: #E11D48; }
[data-theme="dark"] .pf-cell.has-ic { border-right: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-cell.has-dot + .pf-cell.is-money { border-left: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-cell.is-ring { border-left: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-ring-text { fill: var(--pl-navy); }
[data-theme="dark"] .pf-ring-text.is-sm { fill: #7FEFB1; }
[data-theme="dark"] .pf-ring-text-wrap span { color: #99A7CC; }
[data-theme="dark"] .pf-bar { background: #12171E; }
[data-theme="dark"] .pf-bar b { background: #16A34A; }
[data-theme="dark"] .pf-bar.is-blue b { background: #2F6BFF; }
[data-theme="dark"] .pf-bar.is-light b { background: #2D4476; }
[data-theme="dark"] .pf-bar.is-green b { background: #16A34A; }
[data-theme="dark"] .pf-delta.is-up { color: #7FEFB1; }
[data-theme="dark"] .pf-delta.is-down { color: #DE738A; }
[data-theme="dark"] .pf-delta.is-flat { color: #A4ACC1; }
[data-theme="dark"] .pf-delta.is-pill.is-up { background: #121E17; }
[data-theme="dark"] .pf-delta.is-pill.is-down { background: #180D0E; }
[data-theme="dark"] .pf-delta.is-pill.is-flat { background: #0D1118; }
[data-theme="dark"] .pf-tabs { border-bottom: 1px solid var(--pl-line); }
[data-theme="dark"] .pf-tab { color: #99A7CC; border-bottom: 2px solid transparent; }
[data-theme="dark"] .pf-tab.is-active { color: var(--pl-blue); border-bottom-color: var(--pl-blue); }
[data-theme="dark"] .pf-tab-count { background: #12171E; color: #99A7CC; }
[data-theme="dark"] .pf-tab.is-active .pf-tab-count { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-summary-btn { color: var(--pl-blue); }
[data-theme="dark"] .pf-filters .cmp-search { border-color: var(--pl-line); background: #181F28; }
[data-theme="dark"] .pf-select .pl-select-prefix { color: var(--pl-ink); }
[data-theme="dark"] .pf-select .pl-select-prefix + .cmp-select-ghost { color: #A7AEBE; }
[data-theme="dark"] .pf-select .pl-select-prefix ~ select { color: transparent; }
[data-theme="dark"] .pf-select .pl-select-prefix ~ select option { color: var(--pl-ink); }
[data-theme="dark"] .pf-select.is-set .pl-select-prefix + .cmp-select-ghost { color: var(--pl-ink); }
[data-theme="dark"] .pf-select.has-ic .pf-select-ic { color: var(--pl-ink); }
[data-theme="dark"] .pf-chip { border: 1px solid var(--pl-line); background: #181F28; color: var(--pl-navy); }
[data-theme="dark"] .pf-chip:hover { background: #0D1118; }
[data-theme="dark"] .pf-chip-ic.tone-green { color: #7FEFB1; }
[data-theme="dark"] .pf-chip-ic.tone-red { color: #DE738A; }
[data-theme="dark"] .pf-chip-ic.tone-amber { color: #DEB673; }
[data-theme="dark"] .pf-chip-count { background: #12171E; color: #99A7CC; }
[data-theme="dark"] .pf-chip-count.tone-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pf-chip-count.tone-red { background: #180D0E; color: #DE738A; }
[data-theme="dark"] .pf-chip.is-active { background: var(--pl-blue); border-color: var(--pl-blue); color: #fff; }
[data-theme="dark"] .pf-chip.is-active .pf-chip-count { background: rgba(255,255,255,.22); color: #fff; }
[data-theme="dark"] .pf-chip.is-active .pf-chip-ic { color: #fff; }
[data-theme="dark"] .pf-lastimport { color: #99A7CC; }
[data-theme="dark"] .pf-refresh { color: var(--pl-blue); }
[data-theme="dark"] .pf-export { color: var(--pl-blue); }
[data-theme="dark"] .pf-table thead tr.pf-group-row th { background: #181F28; border: 0; }
[data-theme="dark"] .pf-table thead th.pf-group { background: #0D1118; border-bottom: 0; }
[data-theme="dark"] .pf-group-label { color: #99A7CC; }
[data-theme="dark"] .pf-table thead th { background: #0D1218; border-top: 1px solid var(--pl-line-soft); border-bottom: 1px solid var(--pl-line-soft); color: #99A7CC; }
[data-theme="dark"] .pf-th { color: inherit; }
[data-theme="dark"] .pf-th-icon { color: #A2ABC3; }
[data-theme="dark"] .pf-table thead th.is-sorted, [data-theme="dark"] .pf-table thead th.is-sorted .pf-th-icon { color: var(--pl-blue); }
[data-theme="dark"] .pf-table tbody td { border-bottom: 1px solid var(--pl-line-soft); color: var(--pl-ink); }
[data-theme="dark"] .pf-table tbody td.c-idx { color: #99A7CC; }
[data-theme="dark"] .pf-row:hover { background: #0D1218; }
[data-theme="dark"] .pf-acct-id { color: var(--pl-navy); }
[data-theme="dark"] .pf-acct-login { color: #A7AEBE; }
[data-theme="dark"] .pf-co-name { color: var(--pl-ink); }
[data-theme="dark"] .pf-geo { color: var(--pl-ink); }
[data-theme="dark"] .pf-flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .pf-flag-fallback { background: #12171E; }
[data-theme="dark"] .pf-model.tone-blue { background: #12171E; color: #738FDE; }
[data-theme="dark"] .pf-model.tone-amber { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .pf-model.tone-purple { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .pf-model.tone-slate { background: #12171E; color: #95A2D0; }
[data-theme="dark"] .pf-model.tone-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pf-model.tone-grey { background: #0D1118; color: #A2AEC3; }
[data-theme="dark"] .pf-rate { color: #A7AEBE; }
[data-theme="dark"] .pf-table td.is-rev b { color: var(--pl-navy); }
[data-theme="dark"] .pf-pill.tone-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pf-pill.tone-red { background: #180D0E; color: #DE738A; }
[data-theme="dark"] .pf-pill.tone-amber { background: #1E1A12; color: #DEB073; }
[data-theme="dark"] .pf-pill.tone-grey { background: #0D1118; color: #A2AEC3; }
[data-theme="dark"] .pf-upd { color: var(--pl-ink); }
[data-theme="dark"] .pf-upd span + span { color: #A7AEBE; }
[data-theme="dark"] .pf-menu .btn-icon { border: 1px solid var(--pl-line); background: #181F28; color: var(--pl-ink); }
[data-theme="dark"] .pf-menu .btn-icon:hover { background: #0D1118; }
[data-theme="dark"] .pf-menu.is-plain .btn-icon { border: 0; color: #A7AEBE; }
[data-theme="dark"] .pf-pages .cmp-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
[data-theme="dark"] .pf-crumbs a { color: var(--pl-blue); }
[data-theme="dark"] .pf-crumbs .is-current { color: var(--pl-blue); }
[data-theme="dark"] .pf-crumb-sep { color: #A4ACC1; }
[data-theme="dark"] .pf-ahead-title { color: var(--pl-navy); }
[data-theme="dark"] .pf-ahead-co { color: var(--pl-ink); }
[data-theme="dark"] .pf-colink { color: var(--pl-blue); }
[data-theme="dark"] .pf-ahead-sep { color: #A4ACC1; }
[data-theme="dark"] .pf-chip-soft { background: #0D1118; color: var(--pl-ink); }
[data-theme="dark"] .pf-chip-soft.is-blue { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-idbox { background: #0D1118; border: 1px solid #32445D; }
[data-theme="dark"] .pf-idbox span { color: #A7AEBE; }
[data-theme="dark"] .pf-idbox b { color: var(--pl-navy); }
[data-theme="dark"] .pf-copy { color: var(--pl-blue); }
[data-theme="dark"] .pf-repbox { border: 1px solid var(--pl-line); background: #181F28; }
[data-theme="dark"] .pf-repbox > span { color: #A7AEBE; }
[data-theme="dark"] .pf-repsel { border: 1px solid var(--pl-line); color: var(--pl-navy); background: #181F28; }
[data-theme="dark"] .pf-repsel .icon { color: var(--pl-blue); }
[data-theme="dark"] .pf-atabs { border-bottom: 1px solid var(--pl-line); }
[data-theme="dark"] .pf-atab { color: #99A7CC; border-bottom: 2px solid transparent; }
[data-theme="dark"] .pf-atab.is-active { color: var(--pl-blue); border-bottom-color: var(--pl-blue); }
[data-theme="dark"] .pf-card-head h2 { color: var(--pl-navy); }
[data-theme="dark"] .pf-card-head p { color: #A7AEBE; }
[data-theme="dark"] .pf-head-note { color: #A7AEBE; }
[data-theme="dark"] .pf-ic-tile { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-ic-tile.is-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pf-ic-round.is-blue { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-ic-round.is-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pf-ic-round.is-red { background: #180D0E; color: #DE738A; }
[data-theme="dark"] .pf-ic-round.is-purple { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .pf-ic-round.is-amber { background: #1E1A12; color: #DEB073; }
[data-theme="dark"] .pf-btn-sm.is-blue { color: var(--pl-blue); }
[data-theme="dark"] .pf-seg-btn { background: #0D1218; color: var(--pl-ink); }
[data-theme="dark"] .pf-seg-btn.is-active { background: var(--pl-blue); color: #fff; }
[data-theme="dark"] .pf-summary-lead { border-right: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-summary-lead b { color: var(--pl-navy); }
[data-theme="dark"] .pf-summary-lead span { color: var(--pl-ink); }
[data-theme="dark"] .pf-summary-lead em { color: #A7AEBE; }
[data-theme="dark"] .pf-summary-trend { color: #73DEAE; }
[data-theme="dark"] .pf-summary-cell + .pf-summary-cell { border-left: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-summary-cell b { color: var(--pl-navy); }
[data-theme="dark"] .pf-summary-cell span { color: #A7AEBE; }
[data-theme="dark"] .pf-summary-cell .pf-delta.is-up { background: #121E17; color: #78E9A2; }
[data-theme="dark"] .pf-summary-cell .pf-delta.is-down { background: #1E1214; color: #DE7373; }
[data-theme="dark"] .pf-grid { stroke: #597091; }
[data-theme="dark"] .pf-axis { fill: #A7AEBE; }
[data-theme="dark"] .pf-axis.is-x { fill: #99A7CC; }
[data-theme="dark"] .pf-line { fill: none; stroke: #6D94F4; }
[data-theme="dark"] .pf-line.is-grey { stroke: #A3AEC2; }
[data-theme="dark"] .pf-dot { fill: #6D94F4; stroke: #fff; }
[data-theme="dark"] .pf-dot.is-grey { fill: #A3AEC2; }
[data-theme="dark"] .pf-dot.is-focus { stroke: #fff; }
[data-theme="dark"] .pf-marker { stroke: #6D94F4; }
[data-theme="dark"] .pf-tip { background: #181F28; border: 1px solid var(--pl-line); box-shadow: 0 10px 28px rgba(0,0,0,0.364); color: var(--pl-ink); }
[data-theme="dark"] .pf-tip b { color: var(--pl-navy); }
[data-theme="dark"] .pf-tip-row strong { color: var(--pl-navy); }
[data-theme="dark"] .pf-tip-row em { color: #A7AEBE; }
[data-theme="dark"] .pf-tip-dot { background: #2F6BFF; }
[data-theme="dark"] .pf-tip-dot.is-grey { background: #3B4B68; }
[data-theme="dark"] .pf-funnel-step b { color: var(--pl-navy); }
[data-theme="dark"] .pf-funnel-step span { color: #A7AEBE; }
[data-theme="dark"] .pf-funnel-bar.tone-blue { background: #2F6BFF; }
[data-theme="dark"] .pf-funnel-bar.tone-sky { background: #2D4376; }
[data-theme="dark"] .pf-funnel-bar.tone-purple { background: #8B6CF2; }
[data-theme="dark"] .pf-funnel-bar.tone-green { background: #22B573; }
[data-theme="dark"] .pf-funnel-step em { color: var(--pl-navy); }
[data-theme="dark"] .pf-funnel-step small { color: #A7AEBE; }
[data-theme="dark"] .pf-funnel-step.is-last { border-left: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-funnel-arrow { color: #A7AEBE; }
[data-theme="dark"] .pf-donut-v { fill: var(--pl-navy); }
[data-theme="dark"] .pf-donut-l { fill: #A7AEBE; }
[data-theme="dark"] .pf-legend li { color: var(--pl-ink); }
[data-theme="dark"] .pf-legend li b { color: var(--pl-navy); }
[data-theme="dark"] .pf-health-table th { color: #A7AEBE; border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-health-table td { color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-health-table td.is-val { color: var(--pl-navy); }
[data-theme="dark"] .pf-spark-line { fill: none; }
[data-theme="dark"] .pf-spark-line.tone-green { stroke: #73DEAE; }
[data-theme="dark"] .pf-spark-line.tone-red { stroke: #DE738A; }
[data-theme="dark"] .pf-spark-line.tone-grey { stroke: #A3AEC2; }
[data-theme="dark"] .pf-insight-box { background: #121E17; color: var(--pl-navy); }
[data-theme="dark"] .pf-insight-box .icon { color: #7FEFB1; }
[data-theme="dark"] .pf-geobars li { color: var(--pl-ink); }
[data-theme="dark"] .pf-geobar-val { color: var(--pl-navy); }
[data-theme="dark"] .pf-geobar-pct { color: #A7AEBE; }
[data-theme="dark"] .pf-mtable th { background: #0D1218; color: #99A7CC; }
[data-theme="dark"] .pf-mtable td { color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-mtable td.is-month { color: var(--pl-navy); }
[data-theme="dark"] .pf-mtable td.is-rev b { color: var(--pl-navy); }
[data-theme="dark"] .pf-mtable th .pf-th { color: inherit; }
[data-theme="dark"] .pf-hhead-lead h2 { color: var(--pl-navy); }
[data-theme="dark"] .pf-hhead-lead p { color: #A7AEBE; }
[data-theme="dark"] .pf-hhead-cell { border-left: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-hhead-cell b { color: var(--pl-navy); }
[data-theme="dark"] .pf-hhead-cell span { color: #A7AEBE; }
[data-theme="dark"] .pf-hhead-ring { background: #121E17; }
[data-theme="dark"] .pf-hhead-ring b { color: #7FEFB1; }
[data-theme="dark"] .pf-hhead-ring span { color: #99A7CC; }
[data-theme="dark"] .pf-field { color: #99A7CC; }
[data-theme="dark"] .pf-field > span { color: #99A7CC; }
[data-theme="dark"] .pf-field > span b { color: #DE738A; }
[data-theme="dark"] .pf-kv-list li { border-bottom: 1px solid var(--pl-line-soft); color: var(--pl-ink); }
[data-theme="dark"] .pf-kv-list li b { color: var(--pl-navy); }
[data-theme="dark"] .pf-actions b { color: var(--pl-navy); }
[data-theme="dark"] .pf-actions span { color: #A7AEBE; }
[data-theme="dark"] .pf-actions p { color: #95A2D0; }
[data-theme="dark"] .pf-act-ic { color: #73DE9A; }
[data-theme="dark"] .pf-act-ic .icon { fill: #73DE9A; stroke: #fff; }
[data-theme="dark"] .pf-actions.is-log li { border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-chead-lead h2 { color: var(--pl-navy); }
[data-theme="dark"] .pf-chead-lead p { color: #A7AEBE; }
[data-theme="dark"] .pf-swap { border: 1px solid var(--pl-line); background: #181F28; color: var(--pl-blue); }
[data-theme="dark"] .pf-ctile-l { color: #A7AEBE; }
[data-theme="dark"] .pf-ctile b { color: var(--pl-navy); }
[data-theme="dark"] .pf-ctile-row em { color: #A7AEBE; }
[data-theme="dark"] .pf-clegend { color: var(--pl-ink); }
[data-theme="dark"] .pf-legend-item i.is-blue { background: #2F6BFF; }
[data-theme="dark"] .pf-legend-item i.is-grey { background: #3B4B68; }
[data-theme="dark"] .pf-insight-list b { color: var(--pl-navy); }
[data-theme="dark"] .pf-insight-list span { color: #A7AEBE; }
[data-theme="dark"] .pf-btable th { background: #0D1218; color: #99A7CC; }
[data-theme="dark"] .pf-btable td { color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-bmetric .icon { color: var(--pl-blue); }
[data-theme="dark"] .pf-gtable th { background: #0D1218; color: #99A7CC; }
[data-theme="dark"] .pf-gtable td { color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-gbar b { color: var(--pl-navy); }
[data-theme="dark"] .pf-geo-globe { color: #A7AEBE; }
[data-theme="dark"] .pf-psum > div { border-left: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-psum span { color: #A7AEBE; }
[data-theme="dark"] .pf-psum em { color: #99A7CC; }
[data-theme="dark"] .pf-psum em.is-dark { color: var(--pl-navy); }
[data-theme="dark"] .pf-psum b { color: var(--pl-navy); }
[data-theme="dark"] .pf-note { border: 1px solid var(--pl-line); }
[data-theme="dark"] .pf-note.is-pinned { background: #18150D; border-color: #5D4D32; }
[data-theme="dark"] .pf-note-body { color: var(--pl-navy); }
[data-theme="dark"] .pf-note-meta { color: #A4ACC1; }
[data-theme="dark"] .pf-note-actions button { color: #A4ACC1; }
[data-theme="dark"] .pf-dropzone { border: 1.5px dashed #32425D; background: #0D1018; color: #99A7CC; }
[data-theme="dark"] .pf-dropzone.is-over { background: #12171E; }
[data-theme="dark"] .pf-dropzone b { color: var(--pl-navy); }
[data-theme="dark"] .pf-dropzone .icon { color: var(--pl-blue); }
[data-theme="dark"] .pf-dropzone em { color: var(--pl-blue); }
[data-theme="dark"] .pf-file-list li { border: 1px solid var(--pl-line); }
[data-theme="dark"] .pf-file-list a { color: var(--pl-navy); }
[data-theme="dark"] .pf-file-list li > div span { color: #A4ACC1; }
[data-theme="dark"] .pf-file-ic { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-file-del { color: #A4ACC1; }
[data-theme="dark"] .pf-steps li { background: #0D1218; color: #A7AEBE; }
[data-theme="dark"] .pf-steps li b { background: #181F28; }
[data-theme="dark"] .pf-steps li.is-active { background: var(--pl-blue); color: #fff; }
[data-theme="dark"] .pf-steps li.is-active b { color: var(--pl-blue); }
[data-theme="dark"] .pf-steps li.is-done { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pf-maptable-wrap { border: 1px solid var(--pl-line); }
[data-theme="dark"] .pf-maptable th { background: #0D1218; color: #99A7CC; }
[data-theme="dark"] .pf-maptable td { border-top: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-maptable td.is-col { color: var(--pl-navy); }
[data-theme="dark"] .pf-preview th, [data-theme="dark"] .pf-preview td { border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-preview th { background: #0D1218; color: #99A7CC; }
[data-theme="dark"] .pf-issues { background: #18140D; border: 1px solid #5D4D32; }
[data-theme="dark"] .pf-sumtable th, [data-theme="dark"] .pf-sumtable td { border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-sumtable th { color: #99A7CC; }
[data-theme="dark"] .pf-modal-text { color: var(--pl-ink); }
[data-theme="dark"] .pf-crumb-slash { color: #A4ACC1; }
[data-theme="dark"] .pf-mtitle { color: var(--pl-navy); }
[data-theme="dark"] .pf-msub { color: #9DA8C8; }
[data-theme="dark"] .pf-msec-head h2 { color: var(--pl-navy); }
[data-theme="dark"] .pf-msec-head p { color: #A7AEBE; }
[data-theme="dark"] .pf-mnum { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .pf-me-req { color: #A7AEBE; }
[data-theme="dark"] .pf-me-req b { color: #DE738A; }
[data-theme="dark"] .pf-manual .pf-field > span { color: var(--pl-ink); }
[data-theme="dark"] .pf-manual .pf-help { color: #A7AEBE; }
[data-theme="dark"] .pf-me-sel { border: 1px solid var(--pl-line); background: #0D1118; }
[data-theme="dark"] .pf-me-sel-id { border-right: 1px solid var(--pl-line); }
[data-theme="dark"] .pf-me-sel-id b { color: var(--pl-navy); }
[data-theme="dark"] .pf-me-sel-id span, [data-theme="dark"] .pf-me-sel-co span { color: #A7AEBE; }
[data-theme="dark"] .pf-me-sel-co b { color: var(--pl-navy); }
[data-theme="dark"] .pf-me-sel-co .pf-geo { color: #99A7CC; }
[data-theme="dark"] .pf-me-sel-caret { color: var(--pl-ink); }
[data-theme="dark"] .pf-me-warn { background: #18150D; border: 1px solid #5D5032; }
[data-theme="dark"] .pf-me-warn b { color: #DEA173; }
[data-theme="dark"] .pf-me-warn span { color: #E9E7E2; }
[data-theme="dark"] .pf-me-warn-ic { color: #DEB673; }
[data-theme="dark"] .pf-mrow { border-top: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-mrow-lead { color: var(--pl-navy); }
[data-theme="dark"] .pf-money-in i { color: #A7AEBE; border-right: 1px solid var(--pl-line); }
[data-theme="dark"] .pf-calc { border: 1px solid var(--pl-line); background: #0D1118; }
[data-theme="dark"] .pf-calc-cell { border-right: 1px solid var(--pl-line); }
[data-theme="dark"] .pf-calc-cell span { color: var(--pl-ink); }
[data-theme="dark"] .pf-calc-cell em { color: #A7AEBE; }
[data-theme="dark"] .pf-calc-cell b { color: var(--pl-navy); }
[data-theme="dark"] .pf-calc-note { color: #99A7CC; }
[data-theme="dark"] .pf-calc-note .icon { color: #A7AEBE; }
[data-theme="dark"] .pf-mfoot { border-top: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .pf-me-info-row b { color: var(--pl-navy); }
[data-theme="dark"] .pf-me-info-login { color: #A7AEBE; }
[data-theme="dark"] .pf-me-kv li > span { color: #99A7CC; }
[data-theme="dark"] .pf-me-months li { border-bottom: 1px solid var(--pl-line-soft); color: var(--pl-ink); }
[data-theme="dark"] .pf-me-months li b { color: var(--pl-navy); }
[data-theme="dark"] .pf-me-help { background: #0D1118; border-color: #32425D; }
[data-theme="dark"] .pf-me-help b { color: var(--pl-navy); }
[data-theme="dark"] .pf-me-help p { color: #99A7CC; }
[data-theme="dark"] .page-revenue .page-header .page-icon { background: #16A34A; color: #fff; }
[data-theme="dark"] .rv-link { color: var(--pl-blue); }
[data-theme="dark"] .rv-card-head h2 { color: var(--pl-navy); }
[data-theme="dark"] .rv-card-head p { color: #A7AEBE; }
[data-theme="dark"] .rv-delta.is-up { color: #73DEB7; }
[data-theme="dark"] .rv-delta.is-down { color: #985252; }
[data-theme="dark"] .rv-delta.is-flat { color: #A7B1BE; }
[data-theme="dark"] .rv-delta.is-exp.is-up { color: #985252; }
[data-theme="dark"] .rv-delta.is-exp.is-down { color: #73DEB7; }
[data-theme="dark"] .rv-delta.is-mom.is-up { color: #7FEFB1; }
[data-theme="dark"] .rv-delta.is-mom.is-down { color: #DE738A; }
[data-theme="dark"] .rv-pill.tone-blue { background: #12171E; color: #738FDE; }
[data-theme="dark"] .rv-pill.tone-amber { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .rv-pill.tone-orange { background: #1E1712; color: #DE9273; }
[data-theme="dark"] .rv-pill.tone-purple { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .rv-pill.tone-slate { background: #12171E; color: #95A2D0; }
[data-theme="dark"] .rv-pill.tone-grey { background: #0D1118; color: #A2AEC3; }
[data-theme="dark"] .rv-pill.tone-green { background: #121E17; color: #78E9A2; }
[data-theme="dark"] .rv-hero { background: linear-gradient(90deg, #0F1E45 0%, #0B1636 100%); color: #fff; }
[data-theme="dark"] .rv-hero-ic { color: #fff; }
[data-theme="dark"] .rv-hero-ic.is-blue { background: #2F5FD9; }
[data-theme="dark"] .rv-hero-ic.is-red { background: #7F2D3F; }
[data-theme="dark"] .rv-hero-ic.is-green { background: #1E8E5A; }
[data-theme="dark"] .rv-hero-ic.is-purple { background: #4C5B93; }
[data-theme="dark"] .rv-hero-l { color: #B8C4E0; }
[data-theme="dark"] .rv-hero-vs { color: #B8C4E0; }
[data-theme="dark"] .rv-op { color: #597191; }
[data-theme="dark"] .rv-hero-cell.is-profit { border: 1px solid #1F6F4E; background: rgba(30,60,110,.35); }
[data-theme="dark"] .rv-hero-side { border-left: 1px solid rgba(255,255,255,.12); }
[data-theme="dark"] .rv-hero-side > div { color: #B8C4E0; }
[data-theme="dark"] .rv-hero-side b { color: #fff; }
[data-theme="dark"] .rv-side-ic { color: #fff; }
[data-theme="dark"] .rv-side-ic.is-teal { background: #14B8A6; }
[data-theme="dark"] .rv-side-ic.is-amber { background: #D97706; }
[data-theme="dark"] .rv-side-ic.is-blue { background: #2F6BFF; }
[data-theme="dark"] .rv-legend-pill { background: #0D1118; color: var(--pl-ink); }
[data-theme="dark"] .rv-legend-pill i.is-blue { background: #2F6BFF; }
[data-theme="dark"] .rv-legend-pill i.is-green { background: #22C55E; }
[data-theme="dark"] .rv-legend-pill i.is-orange { background: #F97316; }
[data-theme="dark"] .rv-grid { stroke: #597091; }
[data-theme="dark"] .rv-axis { fill: #A7AEBE; }
[data-theme="dark"] .rv-axis.is-x { fill: #99A7CC; }
[data-theme="dark"] .rv-line { fill: none; }
[data-theme="dark"] .rv-line.is-green { stroke: #73DE9A; }
[data-theme="dark"] .rv-line.is-orange { stroke: #DE9F73; }
[data-theme="dark"] .rv-dot { stroke: #fff; }
[data-theme="dark"] .rv-dot.is-green { fill: #73DE9A; }
[data-theme="dark"] .rv-dot.is-orange { fill: #DE9F73; }
[data-theme="dark"] .rv-marker { stroke: #6D94F4; }
[data-theme="dark"] .rv-tip { background: #181F28; border: 1px solid var(--pl-line); box-shadow: 0 10px 28px rgba(0,0,0,0.364); color: var(--pl-ink); }
[data-theme="dark"] .rv-tip b { color: var(--pl-navy); }
[data-theme="dark"] .rv-tip-row i.is-blue { background: #2F6BFF; }
[data-theme="dark"] .rv-tip-row i.is-orange { background: #F97316; }
[data-theme="dark"] .rv-tip-row i.is-green { background: #22C55E; }
[data-theme="dark"] .rv-tip-row i.is-ring { background: #181F28; border: 3px solid #6D94F4; }
[data-theme="dark"] .rv-tip-row strong { color: var(--pl-navy); }
[data-theme="dark"] .rv-tip .is-pos { color: #7FEFB1; }
[data-theme="dark"] .rv-tip .is-neg { color: #DE738A; }
[data-theme="dark"] .rv-tip-sub { border-top: 1px solid var(--pl-line-soft); color: #99A7CC; }
[data-theme="dark"] .rv-donut-v { fill: var(--pl-navy); }
[data-theme="dark"] .rv-donut-l { fill: #A7AEBE; }
[data-theme="dark"] .rv-donut-legend li { color: var(--pl-ink); }
[data-theme="dark"] .rv-dl-pct { color: #A7AEBE; }
[data-theme="dark"] .rv-donut-legend b { color: var(--pl-navy); }
[data-theme="dark"] .rv-insight-list li { border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .rv-insight-list b { color: var(--pl-navy); }
[data-theme="dark"] .rv-insight-list b em { background: none; }
[data-theme="dark"] .rv-insight-list b em.tone-green { color: #70EFAC; }
[data-theme="dark"] .rv-insight-list b em.tone-amber { color: #DEA173; }
[data-theme="dark"] .rv-insight-list span { color: #A7AEBE; }
[data-theme="dark"] .rv-ins-ic.is-green { background: #121E17; color: #78E9A2; }
[data-theme="dark"] .rv-ins-ic.is-red { background: #1E1214; color: #DE7373; }
[data-theme="dark"] .rv-ins-ic.is-blue { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .rv-ins-ic.is-amber { background: #1E1A12; color: #DEAC73; }
[data-theme="dark"] .rv-tab { background: #0D1218; color: var(--pl-ink); }
[data-theme="dark"] .rv-tab.is-active { background: var(--pl-blue); color: #fff; }
[data-theme="dark"] .rv-mini th { background: #0D1218; color: #99A7CC; }
[data-theme="dark"] .rv-mini td { color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .rv-mini td:first-child { color: #99A7CC; }
[data-theme="dark"] .rv-mini td.is-profit { color: #7FEFB1; }
[data-theme="dark"] .rv-ent { color: var(--pl-navy); }
[data-theme="dark"] .rv-globe { color: #A7AEBE; }
[data-theme="dark"] .rv-bar { background: #12171E; }
[data-theme="dark"] .rv-bar b { background: #16A34A; }
[data-theme="dark"] .rv-bar.is-dark b { background: #5F7294; }
[data-theme="dark"] .rv-search { border-color: var(--pl-line); }
[data-theme="dark"] .rv-table th { background: #0D1218; color: #99A7CC; }
[data-theme="dark"] .rv-table td { color: var(--pl-ink); border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .rv-table tr[data-href]:hover { background: #0D1218; }
[data-theme="dark"] .rv-table td:first-child { color: #99A7CC; }
[data-theme="dark"] .rv-ent-name small { color: #A7AEBE; }
[data-theme="dark"] .rv-empty { color: #A4ACC1; }
[data-theme="dark"] .rv-modal-shell { background: #181F28; }
[data-theme="dark"] .modal-backdrop:has(.rv-modal-shell) { background: rgba(226,228,233,0.55); }
[data-theme="dark"] .rv-modal-head { border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .rv-modal-title { color: var(--pl-navy); }
[data-theme="dark"] .rv-modal-sub { color: #A7AEBE; }
[data-theme="dark"] .rv-modal-x { border: 1px solid var(--pl-line); color: var(--pl-ink); }
[data-theme="dark"] .rv-sec { border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .rv-sec h3 { color: var(--pl-navy); }
[data-theme="dark"] .rv-sec > p { color: #A7AEBE; }
[data-theme="dark"] .rv-field > span:first-child { color: var(--pl-ink); }
[data-theme="dark"] .rv-field > span:first-child b { color: #DE738A; }
[data-theme="dark"] .rv-field > span:first-child small { color: #A7AEBE; }
[data-theme="dark"] .rv-input { border: 1px solid #32445D; background: #181F28; color: var(--pl-ink); outline: none; }
[data-theme="dark"] .rv-input:focus { border-color: var(--pl-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .rv-in-ic { background: #12171E; color: var(--pl-blue); }
[data-theme="dark"] .rv-in-ic.is-text { background: none; }
[data-theme="dark"] .rv-in-caret { color: var(--pl-ink); }
[data-theme="dark"] .rv-in.is-date .rv-date { color: transparent; }
[data-theme="dark"] .rv-date-text { color: #A4ADC1; }
[data-theme="dark"] .rv-date-text.is-set { color: var(--pl-ink); }
[data-theme="dark"] .rv-count { color: #A7AEBE; }
[data-theme="dark"] .rv-help { color: #A7AEBE; }
[data-theme="dark"] .rv-field.is-invalid .rv-input { border-color: #E8496C; }
[data-theme="dark"] .rv-scope { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .rv-scope.is-selected { border-color: var(--pl-blue); box-shadow: 0 0 0 1px var(--pl-blue) inset; background: #0D1118; }
[data-theme="dark"] .rv-scope-ic { color: var(--pl-blue); }
[data-theme="dark"] .rv-scope b { color: var(--pl-navy); }
[data-theme="dark"] .rv-scope.is-selected b { color: #738FDE; }
[data-theme="dark"] .rv-scope small { color: #A7AEBE; }
[data-theme="dark"] .rv-method { background: #0D1118; }
[data-theme="dark"] .rv-method-ic { background: var(--pl-blue); }
[data-theme="dark"] .rv-method-l { color: var(--pl-navy); }
[data-theme="dark"] .rv-method .rv-input { background: #181F28; }
[data-theme="dark"] .rv-radio { border: 1px solid #32445D; }
[data-theme="dark"] .rv-radio i { border: 2px solid #32425D; }
[data-theme="dark"] .rv-radio.is-selected { border-color: var(--pl-blue); background: #0D1118; }
[data-theme="dark"] .rv-radio.is-selected i { border-color: var(--pl-blue); }
[data-theme="dark"] .rv-radio.is-selected i::after { background: var(--pl-blue); }
[data-theme="dark"] .rv-radio b { color: var(--pl-navy); }
[data-theme="dark"] .rv-radio.is-selected b { color: var(--pl-blue); }
[data-theme="dark"] .rv-radio small { color: #A7AEBE; }
[data-theme="dark"] .rv-toggle i { background: #354A6E; }
[data-theme="dark"] .rv-toggle i::after { background: #181F28; }
[data-theme="dark"] .rv-toggle input:checked + i { background: var(--pl-blue); }
[data-theme="dark"] .rv-toggle b { color: var(--pl-navy); }
[data-theme="dark"] .rv-toggle small { color: #A7AEBE; }
[data-theme="dark"] .rv-toggle em { color: #A7AEBE; }
[data-theme="dark"] .rv-rail-card { border: 1px solid var(--pl-line); background: #181F28; }
[data-theme="dark"] .rv-rail-card h4 { color: var(--pl-navy); }
[data-theme="dark"] .rv-preview-kind { color: var(--pl-blue); border-bottom: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .rv-preview-list li .icon { color: var(--pl-blue); }
[data-theme="dark"] .rv-preview-list li span { color: #A7AEBE; }
[data-theme="dark"] .rv-preview-list li b { color: var(--pl-navy); }
[data-theme="dark"] .rv-alloc-ic { border: 2px solid var(--pl-blue); color: var(--pl-blue); }
[data-theme="dark"] .rv-alloc p { color: #99A7CC; }
[data-theme="dark"] .rv-alloc-total { background: #0D1118; color: var(--pl-navy); }
[data-theme="dark"] .rv-alloc-total b.is-pct { color: var(--pl-blue); }
[data-theme="dark"] .rv-alloc-list li { color: var(--pl-ink); }
[data-theme="dark"] .rv-alloc-list li em { color: #A7AEBE; }
[data-theme="dark"] .rv-alloc-note { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .rv-alloc-note .icon { color: var(--pl-blue); }
[data-theme="dark"] .rv-tips-ic { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .rv-tips li { color: var(--pl-ink); }
[data-theme="dark"] .rv-tips li .icon { color: var(--pl-blue); fill: var(--pl-blue); stroke: #fff; }
[data-theme="dark"] .rv-modal-foot { border-top: 1px solid var(--pl-line-soft); }
[data-theme="dark"] .rv-foot-note { color: #99A7CC; }
[data-theme="dark"] .rv-foot-note .icon { color: var(--pl-blue); }
[data-theme="dark"] .rv-xtotals { color: #99A7CC; }
[data-theme="dark"] .rv-xtotal b { color: var(--pl-navy); }
[data-theme="dark"] .rv-cat-dot { background: #A9B5C6; }
[data-theme="dark"] .rv-cat-dot.tone-blue { background: #2F6BFF; }
[data-theme="dark"] .rv-cat-dot.tone-amber { background: #F59E0B; }
[data-theme="dark"] .rv-cat-dot.tone-teal { background: #14B8A6; }
[data-theme="dark"] .rv-cat-dot.tone-red { background: #EF4444; }
[data-theme="dark"] .rv-cat-dot.tone-purple { background: #7C3AED; }
[data-theme="dark"] .rv-cat-dot.tone-orange { background: #F97316; }
[data-theme="dark"] .rv-cat-dot.tone-pink { background: #EC4899; }
[data-theme="dark"] .rv-cat-dot.tone-slate { background: #7F8EA3; }
[data-theme="dark"] .page-payments { --pay-ring-track: #29563B; --pay-line: #12171E; --pay-soft: #0D1118; --pay-ink: #E2E3E9; --pay-navy: #E2E3E9; --pay-muted: #8B99BD; --pay-blue: #4C89F2; }
[data-theme="dark"] .pay-title-ic { background: #1668F5; color: #fff; box-shadow: 0 6px 14px rgba(0,0,0,0.572); }
[data-theme="dark"] .pay-title { color: var(--pay-navy); }
[data-theme="dark"] .pay-sub { color: #9DA8C8; }
[data-theme="dark"] .pay-btn-ghost { background: #181F28; border: 1px solid #32445D; color: var(--pay-ink); }
[data-theme="dark"] .pay-btn-ghost:hover { background: #0D1118; }
[data-theme="dark"] .pay-btn-ghost.is-blue { color: var(--pay-blue); }
[data-theme="dark"] .pay-btn-ghost.is-on { border-color: var(--pay-blue); color: var(--pay-blue); background: #0D1118; }
[data-theme="dark"] .pay-btn-primary { background: var(--pay-blue); border: 1px solid var(--pay-blue); color: #fff; }
[data-theme="dark"] .pay-btn-primary:hover { background: #0F5AD8; }
[data-theme="dark"] .pay-link { color: var(--pay-blue); background: none; border: 0; }
[data-theme="dark"] .pay-ibtn { border: 1px solid #32445D; background: #181F28; color: var(--pay-ink); }
[data-theme="dark"] .pay-ibtn:hover { background: #0D1118; }
[data-theme="dark"] .pay-ibtn.is-plain { border: 0; background: none; color: #99A7CC; }
[data-theme="dark"] .pay-stat { background: #181F28; border: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-stat-ic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .pay-stat-ic.tone-green { background: #121E17; color: #73DE9A; }
[data-theme="dark"] .pay-stat-ic.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .pay-stat-ic.tone-red { background: #1E1214; color: #DE738A; }
[data-theme="dark"] .pay-stat-check { background: #16A34A; color: #fff; border: 2px solid #325D44; }
[data-theme="dark"] .pay-stat-l { color: #A1ACC4; }
[data-theme="dark"] .pay-stat-v { color: var(--pay-navy); }
[data-theme="dark"] .pay-delta { color: #A3ACC2; }
[data-theme="dark"] .pay-delta.is-good { --c: #7FEFB1; }
[data-theme="dark"] .pay-delta.is-bad { --c: #E3525F; }
[data-theme="dark"] .pay-delta.is-good b, [data-theme="dark"] .pay-delta.is-good .icon { color: #7FEFB1; }
[data-theme="dark"] .pay-delta.is-bad b, [data-theme="dark"] .pay-delta.is-bad .icon { color: #DE737D; }
[data-theme="dark"] .pay-card { background: #181F28; border: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-card-ic { background: #0D1018; color: var(--pay-blue); }
[data-theme="dark"] .pay-card-title { color: var(--pay-navy); }
[data-theme="dark"] .pay-card-sub { color: #A3ACC2; }
[data-theme="dark"] .pay-legend { color: var(--pay-ink); }
[data-theme="dark"] .pay-ax { fill: #A3ACC2; }
[data-theme="dark"] .pay-tip { background: #181F28; border: 1px solid var(--pay-line); box-shadow: 0 8px 24px rgba(0,0,0,0.312); color: var(--pay-ink); }
[data-theme="dark"] .pay-tip strong { color: var(--pay-navy); }
[data-theme="dark"] .pay-tip span { color: #99A7CC; }
[data-theme="dark"] .pay-tip span b { color: var(--pay-navy); }
[data-theme="dark"] .pay-viewall { color: var(--pay-blue); }
[data-theme="dark"] .pay-toptable th { background: #0D1118; color: #A3ACC2; }
[data-theme="dark"] .pay-toptable td { color: var(--pay-ink); border-bottom: 1px solid #2B3950; }
[data-theme="dark"] .pay-toptable tbody tr:hover td { background: #0D1118; }
[data-theme="dark"] .pay-toptable td:first-child { color: #99A7CC; }
[data-theme="dark"] .pay-toptable strong { color: var(--pay-navy); }
[data-theme="dark"] .pay-toptable strong.is-red { color: #DE737D; }
[data-theme="dark"] .pay-co { color: var(--pay-ink); }
[data-theme="dark"] .pay-tabs { border-bottom: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-tab { color: #99A7CC; }
[data-theme="dark"] .pay-tab.is-active { color: var(--pay-blue); }
[data-theme="dark"] .pay-tab.is-active::after { background: var(--pay-blue); }
[data-theme="dark"] .pay-tab-n { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .pay-tab.is-active .pay-tab-n { background: #12171E; color: var(--pay-blue); }
[data-theme="dark"] .pay-tab-n.tone-red { background: #1E1214; color: #DE737D; }
[data-theme="dark"] .pay-search { border: 1px solid #32445D; background: #181F28; color: #A4ADC1; }
[data-theme="dark"] .pay-search input { border: 0; outline: 0; background: none; color: var(--pay-ink); }
[data-theme="dark"] .pay-search input::placeholder { color: #A4ADC1; }
[data-theme="dark"] .pay-select { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .pay-select select { border: 0; background: none; color: var(--pay-ink); outline: 0; }
[data-theme="dark"] .pay-select .pay-select-caret { color: #95A2D0; }
[data-theme="dark"] .pay-select-ic { color: var(--pay-blue); }
[data-theme="dark"] .pay-morebar { color: #A3ACC2; }
[data-theme="dark"] .pay-chip { background: #0D1118; color: #8EA5E6; }
[data-theme="dark"] .pay-chip-x { color: #95A2D0; }
[data-theme="dark"] .pay-chip-x:hover { color: #DE738A; }
[data-theme="dark"] .pay-clear { color: var(--pay-blue); }
[data-theme="dark"] .pay-sortbtn .icon:first-child { color: var(--pay-blue); }
[data-theme="dark"] .pay-colopt { color: var(--pay-ink); }
[data-theme="dark"] .pay-colopt:hover { background: #0D1118; }
[data-theme="dark"] .pay-bulkbar { background: #0D1118; border-top: 1px solid #32435D; border-bottom: 1px solid #32435D; }
[data-theme="dark"] .pay-table th.c-n, [data-theme="dark"] .pay-table td.c-n { color: #99A7CC; }
[data-theme="dark"] .pay-table th { background: #0D1118; border-top: 1px solid #2B3A50; border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .pay-th { color: #A1ACC4; }
[data-theme="dark"] .pay-th .icon { color: #A4ADC1; }
[data-theme="dark"] .pay-th.is-on, [data-theme="dark"] .pay-th.is-on .icon { color: var(--pay-blue); }
[data-theme="dark"] .pay-table td { border-bottom: 1px solid #2B3A50; color: var(--pay-ink); }
[data-theme="dark"] .pay-table td strong { color: var(--pay-navy); }
[data-theme="dark"] .pay-row:hover td { background: #0D1118; }
[data-theme="dark"] .pay-row.is-selected td { background: #0D1118; }
[data-theme="dark"] .pay-check span { border: 1.5px solid #32435D; background: #181F28; }
[data-theme="dark"] .pay-check input:checked + span, [data-theme="dark"] .pay-check input:indeterminate + span { background: var(--pay-blue); border-color: var(--pay-blue); box-shadow: inset 0 0 0 3px #000000; }
[data-theme="dark"] .pay-status i { background: currentColor; }
[data-theme="dark"] .pay-status.tone-amber { background: #1E1A12; color: #DEA573; }
[data-theme="dark"] .pay-status.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .pay-status.tone-red { background: #1E1214; color: #DE737D; }
[data-theme="dark"] .pay-status.tone-green { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pay-status.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .pay-status.tone-grey { background: #0D1118; color: #A3ACC2; }
[data-theme="dark"] .pay-method { color: var(--pay-ink); }
[data-theme="dark"] .pay-mark { color: #fff; }
[data-theme="dark"] .pay-rowmenu .btn-icon { border: 0; background: none; color: #99A7CC; }
[data-theme="dark"] .pay-rowmenu .btn-icon:hover { background: #0D1118; }
[data-theme="dark"] .pay-showing { color: #99A7CC; }
[data-theme="dark"] .pay-page { border: 1px solid #32435D; background: #181F28; color: var(--pay-ink); }
[data-theme="dark"] .pay-page.is-active { background: var(--pay-blue); border-color: var(--pay-blue); color: #fff; }
[data-theme="dark"] .pay-page.is-disabled { color: #A2AEC3; }
[data-theme="dark"] .pay-page-gap { color: #A4ADC1; }
[data-theme="dark"] .pay-perpage { color: #99A7CC; }
[data-theme="dark"] .pay-empty { color: #A3ACC2; }
[data-theme="dark"] .pay-empty h3 { color: var(--pay-navy); }
[data-theme="dark"] .pay-empty .icon { color: #A4ADC1; }
[data-theme="dark"] .pay-drawer-back { background: rgba(226,228,233,0.42); }
[data-theme="dark"] .pay-drawer { background: #181F28; box-shadow: -12px 0 40px rgba(0,0,0,0.468); }
[data-theme="dark"] .pay-dr-logo { color: var(--pay-navy); }
[data-theme="dark"] .pay-dr-sub { color: #99A7CC; }
[data-theme="dark"] .pay-dr-ref { color: #A3ACC2; }
[data-theme="dark"] .pay-dr-tabs { border-bottom: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-dr-tab { color: #99A7CC; }
[data-theme="dark"] .pay-dr-tab.is-active { color: var(--pay-blue); }
[data-theme="dark"] .pay-dr-tab.is-active::after { background: var(--pay-blue); }
[data-theme="dark"] .pay-dr-tab-n { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .pay-dr-card { border: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-tile.tone-blue { background: #0D1018; }
[data-theme="dark"] .pay-tile.tone-green { background: #121E17; }
[data-theme="dark"] .pay-tile.tone-red { background: #180D0E; }
[data-theme="dark"] .pay-tile.tone-amber { background: #1E1A12; }
[data-theme="dark"] .pay-tile-l { color: #A1ACC4; }
[data-theme="dark"] .pay-tile.tone-red .pay-tile-l { color: #DE737D; }
[data-theme="dark"] .pay-tile-v { color: var(--pay-navy); }
[data-theme="dark"] .pay-tile.tone-red .pay-tile-v { color: #DE737D; }
[data-theme="dark"] .pay-tile-s { color: #99A7CC; }
[data-theme="dark"] .pay-progress-head { color: var(--pay-navy); }
[data-theme="dark"] .pay-progress { background: #12171E; }
[data-theme="dark"] .pay-progress span { background: var(--pay-blue); }
[data-theme="dark"] .pay-progress-sub { color: #A3ACC2; }
[data-theme="dark"] .pay-dr-h { color: var(--pay-navy); }
[data-theme="dark"] .pay-kv2 > div + div { border-left: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-kv > span { color: #A3ACC2; }
[data-theme="dark"] .pay-kv b { color: var(--pay-navy); }
[data-theme="dark"] .pay-acctable th { background: #0D1118; color: #A3ACC2; }
[data-theme="dark"] .pay-acctable td { border-bottom: 1px solid #2B3950; color: var(--pay-ink); }
[data-theme="dark"] .pay-acctable td:first-child, [data-theme="dark"] .pay-acctable th:first-child { color: #99A7CC; }
[data-theme="dark"] .pay-acctable td small { color: #A4ADC1; }
[data-theme="dark"] .pay-acc-id { color: var(--pay-ink); }
[data-theme="dark"] .pay-acc-id:hover { color: var(--pay-blue); }
[data-theme="dark"] .pay-acc-total td { color: var(--pay-navy); border-bottom: 0; }
[data-theme="dark"] .pay-acc-total td:first-child { color: var(--pay-navy); }
[data-theme="dark"] .pay-geo .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .pay-paidnote { background: #121E17; color: #7FEFB1; }
[data-theme="dark"] .pay-logform { border: 1px solid #32445D; background: #0D1118; }
[data-theme="dark"] .pay-logform h4 { color: var(--pay-navy); }
[data-theme="dark"] .pay-f { color: #99A7CC; }
[data-theme="dark"] .pay-f > span em { color: #A4ADC1; }
[data-theme="dark"] .pay-input { border: 1px solid #32445D; background: #181F28; color: var(--pay-ink); }
[data-theme="dark"] .pay-input:focus { outline: 0; border-color: var(--pay-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.39); }
[data-theme="dark"] .pay-input.is-invalid, [data-theme="dark"] .pay-cselect-btn.is-invalid, [data-theme="dark"] .pay-select.is-invalid, [data-theme="dark"] .pay-datefield.is-invalid { border-color: #E8496C !important; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .pay-error { color: #DE738A; }
[data-theme="dark"] .pay-checklabel { color: var(--pay-ink); }
[data-theme="dark"] .pay-check-ui { border: 1.5px solid #32435D; background: #181F28; }
[data-theme="dark"] .pay-checklabel input:checked + .pay-check-ui { background: var(--pay-blue); border-color: var(--pay-blue); box-shadow: inset 0 0 0 3px #000000; }
[data-theme="dark"] .pay-checklabel.is-blue { color: var(--pay-blue); }
[data-theme="dark"] .pay-txlist li, [data-theme="dark"] .pay-invlist li { border: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-txlist small, [data-theme="dark"] .pay-invlist small { color: #A3ACC2; }
[data-theme="dark"] .pay-tx-ic { background: #0D1018; color: var(--pay-blue); }
[data-theme="dark"] .pay-notes li { border: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-notes li.is-pinned { background: #18150D; border-color: #76682D; }
[data-theme="dark"] .pay-notes li small { color: #A3ACC2; }
[data-theme="dark"] .pay-note-static { color: #99A7CC; background: #0D1118; }
[data-theme="dark"] .pay-dr-foot { border-top: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-followlabel { background: #0D1118; color: var(--pay-ink); }
[data-theme="dark"] .pay-followdate { border: 1px solid #32445D; color: #DEAB73; }
[data-theme="dark"] .pay-followdate .icon { color: #DEB673; }
[data-theme="dark"] .pay-modal-back { background: rgba(226,228,233,0.45); }
[data-theme="dark"] .pay-modal { background: #181F28; box-shadow: 0 30px 80px rgba(0,0,0,0.78); }
[data-theme="dark"] .pay-modal-head { border-bottom: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-modal-ic { background: #0D1018; color: var(--pay-blue); border: 1px solid #32415D; }
[data-theme="dark"] .pay-modal-title { color: var(--pay-navy); }
[data-theme="dark"] .pay-modal-sub { color: #9DA8C8; }
[data-theme="dark"] .pay-steps { border-bottom: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-step { background: none; border: 0; color: #99A7CC; }
[data-theme="dark"] .pay-step-n { border: 1.5px solid #32435D; color: #A3ACC2; background: #181F28; }
[data-theme="dark"] .pay-step.is-current { color: var(--pay-blue); }
[data-theme="dark"] .pay-step.is-current .pay-step-n { background: var(--pay-blue); border-color: var(--pay-blue); color: #fff; }
[data-theme="dark"] .pay-step.is-done .pay-step-n { background: #121E17; border-color: #325D44; color: #7FEFB1; }
[data-theme="dark"] .pay-step-line { background: #344B6F; }
[data-theme="dark"] .pay-sec { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .pay-sec-title { color: var(--pay-navy); }
[data-theme="dark"] .pay-sec-title small { color: #A3ACC2; }
[data-theme="dark"] .pay-sec-sub { color: #A3ACC2; }
[data-theme="dark"] .pay-label { color: var(--pay-ink); }
[data-theme="dark"] .pay-label i { color: #DE738A; }
[data-theme="dark"] .pay-cselect-btn { border: 1px solid #32445D; background: #181F28; color: var(--pay-ink); }
[data-theme="dark"] .pay-sep { color: #A4ADC1; }
[data-theme="dark"] .pay-caret { color: #95A2D0; }
[data-theme="dark"] .pay-menu { background: #181F28; border: 1px solid var(--pay-line); box-shadow: 0 12px 32px rgba(0,0,0,0.364); }
[data-theme="dark"] .pay-menu-item { background: none; border: 0; }
[data-theme="dark"] .pay-menu-item:hover { background: #0D1118; }
[data-theme="dark"] .pay-menu-txt strong { color: var(--pay-navy); }
[data-theme="dark"] .pay-menu-txt small { color: #A3ACC2; }
[data-theme="dark"] .pay-acc-editor { border: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-acc-editor-t th { background: #0D1118; color: #A3ACC2; }
[data-theme="dark"] .pay-acc-editor-t td { border-top: 1px solid #2B3950; color: var(--pay-ink); }
[data-theme="dark"] .pay-acc-editor-t td b { color: var(--pay-navy); }
[data-theme="dark"] .pay-acc-editor-t td small { color: #A4ADC1; }
[data-theme="dark"] .pay-sorticon { color: #A4ADC1; }
[data-theme="dark"] .pay-sum { background: #0D1118; border: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-sum-n { color: var(--pay-navy); }
[data-theme="dark"] .pay-sum-cells > div + div { border-left: 1px solid #32445D; }
[data-theme="dark"] .pay-sum-cells span { color: #A3ACC2; }
[data-theme="dark"] .pay-sum-cells b { color: var(--pay-navy); }
[data-theme="dark"] .pay-sum-cells b.is-green { color: #7FEFB1; }
[data-theme="dark"] .pay-datefield { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .pay-datefield .pay-input { border: 0; background: none; }
[data-theme="dark"] .pay-datefield .pay-input:focus { box-shadow: none; }
[data-theme="dark"] .pay-hint { color: #A3ACC2; }
[data-theme="dark"] .pay-hint.is-red { color: #DE737D; }
[data-theme="dark"] .pay-modal-foot { border-top: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-review-head { background: #0D1118; }
[data-theme="dark"] .pay-review-head b { color: var(--pay-navy); }
[data-theme="dark"] .pay-review-head small { color: #A3ACC2; }
[data-theme="dark"] .pay-review-total span { color: #A3ACC2; }
[data-theme="dark"] .pay-review-total b { color: #7FEFB1; }
[data-theme="dark"] .pay-cal-title { color: var(--pay-navy); }
[data-theme="dark"] .pay-cal-stats { color: #A3ACC2; }
[data-theme="dark"] .pay-cal-stats b { color: var(--pay-navy); }
[data-theme="dark"] .pay-cal-stats b.is-red { color: #DE737D; }
[data-theme="dark"] .pay-cal-legend { color: #99A7CC; }
[data-theme="dark"] .pay-cal-legend i.tone-amber { background: #F59E0B; }
[data-theme="dark"] .pay-cal-legend i.tone-blue { background: #1668F5; }
[data-theme="dark"] .pay-cal-legend i.tone-red { background: #E11D48; }
[data-theme="dark"] .pay-cal-legend i.tone-green { background: #16A34A; }
[data-theme="dark"] .pay-cal-legend i.tone-purple { background: #7C3AED; }
[data-theme="dark"] .pay-cal-grid { border-left: 1px solid var(--pay-line); border-top: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-cal-dow { color: #A3ACC2; background: #0D1118; border-right: 1px solid var(--pay-line); border-bottom: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-cal-cell { border-right: 1px solid var(--pay-line); border-bottom: 1px solid var(--pay-line); }
[data-theme="dark"] .pay-cal-cell.is-empty { background: #0D1118; }
[data-theme="dark"] .pay-cal-cell.is-today { background: #0D1118; }
[data-theme="dark"] .pay-cal-day { color: #99A7CC; }
[data-theme="dark"] .pay-cal-cell.is-today .pay-cal-day { color: var(--pay-blue); }
[data-theme="dark"] .pay-cal-ev { color: var(--pay-ink); border-left: 3px solid; background: #0D1118; }
[data-theme="dark"] .pay-cal-ev.tone-amber { border-color: #F1B042; background: #1E1A12; }
[data-theme="dark"] .pay-cal-ev.tone-blue { border-color: #4C89F2; background: #0D1018; }
[data-theme="dark"] .pay-cal-ev.tone-red { border-color: #E8496C; background: #180D0E; }
[data-theme="dark"] .pay-cal-ev.tone-green { border-color: #1CD05E; background: #121E17; }
[data-theme="dark"] .pay-cal-ev.tone-purple { border-color: #9B69F1; background: #100D18; }
[data-theme="dark"] .pay-cal-ev.tone-grey { border-color: #A9B5C6; }
[data-theme="dark"] .pay-cal-more { color: var(--pay-blue); }
[data-theme="dark"] .page-links { --tl-line: #12171E; --tl-soft: #0D1118; --tl-ink: #E2E3E9; --tl-navy: #E2E3E9; --tl-muted: #8B99BD; --tl-blue: #4C89F2; --tl-green: #1CD05E; }
[data-theme="dark"] .tl-title-ic { background: var(--tl-blue); color: #fff; }
[data-theme="dark"] .tl-title { color: var(--tl-navy); }
[data-theme="dark"] .tl-sub { color: #A1ACC4; }
[data-theme="dark"] .tl-btn-ghost { background: #181F28; border: 1px solid #32445D; color: var(--tl-ink); }
[data-theme="dark"] .tl-btn-ghost:hover { background: #0D1118; }
[data-theme="dark"] .tl-btn-ghost.is-on { border-color: #32415D; color: var(--tl-blue); background: #0D1118; }
[data-theme="dark"] .tl-btn-ghost.is-soft { background: #0D1118; border-color: #32415D; color: var(--tl-ink); }
[data-theme="dark"] .tl-btn-ghost.is-blue { color: var(--tl-blue); }
[data-theme="dark"] .tl-btn-primary { background: var(--tl-blue); border: 1px solid var(--tl-blue); color: #fff; }
[data-theme="dark"] .tl-btn-primary:hover { background: #0F5AD8; }
[data-theme="dark"] .tl-btn-amber { background: #181F28; border: 1px solid #5D4E32; color: #DEA173; }
[data-theme="dark"] .tl-btn.is-danger { color: #DE737D; }
[data-theme="dark"] .tl-split-caret { border-left-color: rgba(255,255,255,.35) !important; }
[data-theme="dark"] .tl-ibtn { border: 0; background: none; color: #A3ADC2; }
[data-theme="dark"] .tl-ibtn:hover { background: #0D1118; color: var(--tl-ink); }
[data-theme="dark"] .tl-ibtn.is-box { border: 1px solid #32475D; background: #181F28; color: #99A7CC; }
[data-theme="dark"] .tl-link { color: var(--tl-blue); background: none; border: 0; }
[data-theme="dark"] .tl-delta.is-up { color: var(--tl-green); }
[data-theme="dark"] .tl-delta.is-down { color: #DE737D; }
[data-theme="dark"] .tl-delta.is-flat { color: #A7B1BE; }
[data-theme="dark"] .tl-delta em { color: #A8B0BD; }
[data-theme="dark"] .tl-caret { color: #95A2D0; }
[data-theme="dark"] .tl-card { background: #181F28; border: 1px solid var(--tl-line); }
[data-theme="dark"] .tl-card-ic { background: #0D1018; color: var(--tl-blue); }
[data-theme="dark"] .tl-card-title { color: var(--tl-navy); }
[data-theme="dark"] .tl-card-sub { color: #A3ACC2; }
[data-theme="dark"] .tl-stat { background: #181F28; border: 1px solid var(--tl-line); }
[data-theme="dark"] .tl-stat-ic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .tl-stat-ic.tone-green { background: #121E17; color: #73DE9A; }
[data-theme="dark"] .tl-stat-ic.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .tl-stat-ic.tone-purple { background: #17121E; color: #9B69F1; }
[data-theme="dark"] .tl-stat-l { color: #A1ACC4; }
[data-theme="dark"] .tl-stat-v { color: var(--tl-navy); }
[data-theme="dark"] .tl-psel { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .tl-psel select { border: 0; background: none; color: var(--tl-navy); outline: none; }
[data-theme="dark"] .tl-stat-vs { color: #A8B0BD; }
[data-theme="dark"] .tl-seg { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .tl-seg-b { color: #95A2D0; }
[data-theme="dark"] .tl-seg-b.is-on { background: var(--tl-blue); color: #fff; }
[data-theme="dark"] .tl-msel { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .tl-msel select { border: 0; background: none; color: var(--tl-ink); outline: none; }
[data-theme="dark"] .tl-chart .axis text { fill: #A8B0BD; }
[data-theme="dark"] .tl-chart .grid line { stroke: #546F96; }
[data-theme="dark"] .tl-chart .prevbar { fill: #596F91; }
[data-theme="dark"] .tl-chart .line { fill: none; stroke: var(--tl-blue); }
[data-theme="dark"] .tl-chart .dot { fill: var(--tl-blue); }
[data-theme="dark"] .tl-chart .dot.is-active { fill: #fff; stroke: var(--tl-blue); }
[data-theme="dark"] .tl-chart .marker { stroke: #526B98; }
[data-theme="dark"] .tl-chart .hit { fill: transparent; }
[data-theme="dark"] .tl-tip { background: #181F28; border: 1px solid #32425D; box-shadow: 0 10px 28px rgba(0,0,0,0.364); color: var(--tl-ink); }
[data-theme="dark"] .tl-tip::after { background: #181F28; border-right: 1px solid #32425D; border-bottom: 1px solid #32425D; }
[data-theme="dark"] .tl-tip-d { color: var(--tl-navy); }
[data-theme="dark"] .tl-tip-r b { color: var(--tl-navy); }
[data-theme="dark"] .tl-tip-r i { background: var(--tl-blue); }
[data-theme="dark"] .tl-tip-vs { color: #A3ACC2; }
[data-theme="dark"] .tl-legend { color: #9DA9C8; }
[data-theme="dark"] .tl-legend i { background: var(--tl-blue); }
[data-theme="dark"] .tl-legend i.is-prev { background: #293B56; }
[data-theme="dark"] .tl-type { color: inherit; }
[data-theme="dark"] .tl-type-ic.tone-green { background: #121E18; color: #73DE9E; }
[data-theme="dark"] .tl-type-ic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .tl-type-ic.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .tl-type-ic.tone-slate { background: #12171E; color: #758DDB; }
[data-theme="dark"] .tl-type-ic.tone-grey { background: #0D1118; color: #A1ACC4; }
[data-theme="dark"] .tl-type-ic.tone-purple { background: #18121E; color: #9C73DE; }
[data-theme="dark"] .tl-type-ic.tone-red { background: #1E1214; color: #DE737D; }
[data-theme="dark"] .tl-type-n { color: var(--tl-navy); }
[data-theme="dark"] .tl-type-row b { color: var(--tl-navy); }
[data-theme="dark"] .tl-bar { background: #0D1118; }
[data-theme="dark"] .tl-bar .bar-blue { background: linear-gradient(90deg, #1668F5, #4B8DFB); }
[data-theme="dark"] .tl-bar .bar-purple { background: linear-gradient(90deg, #7C3AED, #A570F8); }
[data-theme="dark"] .tl-bar .bar-amber { background: #F5A623; }
[data-theme="dark"] .tl-bar .bar-slate { background: #8FA3C8; }
[data-theme="dark"] .tl-bar .bar-grey { background: #3A4A69; }
[data-theme="dark"] .tl-subtable th { background: #0D1118; color: #A1ACC4; }
[data-theme="dark"] .tl-subtable td { color: var(--tl-ink); border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .tl-subtable td:first-child { color: var(--tl-navy); }
[data-theme="dark"] .tl-subtable td a { color: inherit; }
[data-theme="dark"] .tl-mini { color: inherit; }
[data-theme="dark"] .tl-mini-ic { background: #12171E; color: var(--tl-blue); }
[data-theme="dark"] .tl-mini-l { color: #A1ACC4; }
[data-theme="dark"] .tl-mini-v { color: var(--tl-navy); }
[data-theme="dark"] .tl-mini-s { color: #A8B0BD; }
[data-theme="dark"] .tl-alert.is-amber { background: #18140D; border-color: #5D5032; }
[data-theme="dark"] .tl-alert.is-blue { background: #0D1218; border-color: #32415D; }
[data-theme="dark"] .tl-alert-ic { background: #1E1A12; color: #DE9F73; }
[data-theme="dark"] .tl-alert-ic.is-solid { background: var(--tl-blue); color: #fff; }
[data-theme="dark"] .tl-alert-t { color: #DEA173; }
[data-theme="dark"] .tl-alert.is-blue .tl-alert-t { color: var(--tl-navy); }
[data-theme="dark"] .tl-alert-v { color: var(--tl-navy); }
[data-theme="dark"] .tl-alert-s { color: #A8B0BD; }
[data-theme="dark"] .tl-alert.is-blue .tl-alert-s { color: #9DA9C8; }
[data-theme="dark"] .tl-tabsrow { border-bottom: 1px solid var(--tl-line); }
[data-theme="dark"] .tl-tab { color: #99A7CC; }
[data-theme="dark"] .tl-tab.is-active { color: var(--tl-blue); }
[data-theme="dark"] .tl-tab.is-active::after { background: var(--tl-blue); }
[data-theme="dark"] .tl-tab-n { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .tl-tab.is-active .tl-tab-n { background: #12171E; color: var(--tl-blue); }
[data-theme="dark"] .tl-search { border: 1px solid #32445D; background: #181F28; color: #A8B0BD; }
[data-theme="dark"] .tl-search input { border: 0; outline: none; background: none; color: var(--tl-ink); }
[data-theme="dark"] .tl-search input::placeholder { color: #A7B1BE; }
[data-theme="dark"] .tl-colmenu-t { color: #A8B0BD; }
[data-theme="dark"] .tl-fsel { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .tl-fsel-l { color: #A8B0BD; }
[data-theme="dark"] .tl-fsel select { border: 0; background: none; color: var(--tl-navy); outline: none; }
[data-theme="dark"] .tl-chip { background: #0D1118; color: #8EA5E6; }
[data-theme="dark"] .tl-chip b { color: var(--tl-blue); }
[data-theme="dark"] .tl-chip-x { color: #95A2D0; }
[data-theme="dark"] .tl-chip-x:hover { color: #DE738A; }
[data-theme="dark"] .tl-bulkbar { border-top: 1px solid var(--tl-line); background: #0D1118; color: var(--tl-ink); }
[data-theme="dark"] .tl-tablewrap { border-top: 1px solid var(--tl-line); }
[data-theme="dark"] .tl-table th { background: #0D1218; color: #A1ACC4; }
[data-theme="dark"] .tl-table td { color: var(--tl-ink); border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .tl-table .c-n { color: #A8B0BD; }
[data-theme="dark"] .tl-table .c-sel input, [data-theme="dark"] .tl-table [data-tl-all] { accent-color: var(--tl-blue); }
[data-theme="dark"] .tl-th { color: inherit; }
[data-theme="dark"] .tl-th .tl-sort { color: #A3AEC2; }
[data-theme="dark"] .tl-th.is-on { color: var(--tl-blue); }
[data-theme="dark"] .tl-th.is-on .tl-sort { color: var(--tl-blue); }
[data-theme="dark"] .tl-table .c-acc, [data-theme="dark"] .tl-table .c-aff, [data-theme="dark"] .tl-table .c-sub { color: #99A7CC; }
[data-theme="dark"] .tl-table td.c-num { color: var(--tl-ink); }
[data-theme="dark"] .tl-table td.c-rev b { color: var(--tl-navy); }
[data-theme="dark"] .tl-table .c-upd { color: #A8B0BD; }
[data-theme="dark"] .tl-row:hover td { background: #0D1118; }
[data-theme="dark"] .tl-name-t { color: var(--tl-navy); }
[data-theme="dark"] .tl-name-s { color: #A8B0BD; }
[data-theme="dark"] .tl-co { color: var(--tl-navy); }
[data-theme="dark"] .tl-table .flag-cell { color: var(--tl-ink); }
[data-theme="dark"] .tl-dash { color: #A3AEC2; }
[data-theme="dark"] .tl-pill i { background: currentColor; }
[data-theme="dark"] .tl-pill.tone-green { background: #121E17; color: #78E9A2; }
[data-theme="dark"] .tl-pill.tone-amber { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .tl-pill.tone-grey { background: #0D1118; color: #A1ACC4; }
[data-theme="dark"] .tl-empty { color: #A8B0BD; }
[data-theme="dark"] .tl-empty-box { color: #A8B0BD; }
[data-theme="dark"] .tl-empty-box h3 { color: var(--tl-navy); }
[data-theme="dark"] .tl-foot { border-top: 1px solid var(--tl-line); color: #A1ACC4; }
[data-theme="dark"] .tl-pg { border: 1px solid #32445D; background: #181F28; color: var(--tl-ink); }
[data-theme="dark"] .tl-pg.is-on { background: var(--tl-blue); border-color: var(--tl-blue); color: #fff; }
[data-theme="dark"] .tl-pg.is-dots { border-color: transparent; }
[data-theme="dark"] .tl-modal-back { background: rgba(226,228,233,0.58); }
[data-theme="dark"] .tl-modal { background: #181F28; box-shadow: 0 30px 80px rgba(0,0,0,0.91); }
[data-theme="dark"] .tl-wiz-ic { background: #0D1118; color: var(--tl-blue); }
[data-theme="dark"] .tl-wiz-title { color: var(--tl-navy); }
[data-theme="dark"] .tl-wiz-sub { color: #A1ACC4; }
[data-theme="dark"] .tl-wiz-close { color: var(--tl-navy); }
[data-theme="dark"] .tl-steps { border: 1px solid var(--tl-line); }
[data-theme="dark"] .tl-step { background: none; border: 0; }
[data-theme="dark"] .tl-step-n { background: #12171E; color: #A3ACC2; }
[data-theme="dark"] .tl-step.is-current .tl-step-n { background: var(--tl-blue); color: #fff; }
[data-theme="dark"] .tl-step.is-done .tl-step-n { background: var(--tl-blue); color: #fff; }
[data-theme="dark"] .tl-step-t b { color: var(--tl-navy); }
[data-theme="dark"] .tl-step.is-current .tl-step-t b { color: var(--tl-blue); }
[data-theme="dark"] .tl-step-t small { color: #A3ACC2; }
[data-theme="dark"] .tl-step.is-current .tl-step-t small { color: var(--tl-blue); }
[data-theme="dark"] .tl-step-line { background: #12171E; }
[data-theme="dark"] .tl-sec { border: 1px solid var(--tl-line); background: #181F28; }
[data-theme="dark"] .tl-sec-head h3 { color: var(--tl-navy); }
[data-theme="dark"] .tl-sec-head p { color: #A1ACC4; }
[data-theme="dark"] .tl-sec-ic { background: #0D1118; color: var(--tl-blue); }
[data-theme="dark"] .tl-sec-ic.is-green { background: #121E17; color: #73DE9A; }
[data-theme="dark"] .tl-label { color: #99A7CC; }
[data-theme="dark"] .tl-label i { color: #DE738A; }
[data-theme="dark"] .tl-input { border: 1px solid #32445D; background: #181F28; color: var(--tl-navy); outline: none; }
[data-theme="dark"] .tl-input:focus { border-color: var(--tl-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .tl-input::placeholder { color: #A6B0BF; }
[data-theme="dark"] .tl-input-ic > span { background: #0D1118; color: var(--tl-blue); }
[data-theme="dark"] .tl-count { color: #A8B0BD; }
[data-theme="dark"] .tl-hint { color: #A3ACC2; }
[data-theme="dark"] .tl-err { color: #DE737D; }
[data-theme="dark"] .tl-f.is-invalid .tl-input, [data-theme="dark"] .tl-f.is-invalid .tl-cs-btn { border-color: #F37373; }
[data-theme="dark"] .tl-cs-btn { border: 1px solid #32445D; background: #181F28; color: var(--tl-navy); }
[data-theme="dark"] .tl-cs-btn:focus { outline: none; border-color: var(--tl-blue); box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .tl-cs-ic { background: #0D1118; color: var(--tl-blue); }
[data-theme="dark"] .tl-cs-ic.is-plain { background: none; }
[data-theme="dark"] .tl-cs-ic.is-dot { background: #16A34A; }
[data-theme="dark"] .tl-cs-ic.is-dot.tone-amber { background: #F59E0B; }
[data-theme="dark"] .tl-cs-txt.is-ph { color: #A6B0BF; }
[data-theme="dark"] .tl-cs-pill { background: #121E17; color: #78E9A2; }
[data-theme="dark"] .tl-cs-pill i { background: currentColor; }
[data-theme="dark"] .tl-cs-pill.tone-amber { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .tl-cs-menu { background: #181F28; border: 1px solid #32445D; box-shadow: 0 12px 32px rgba(0,0,0,0.364); }
[data-theme="dark"] .tl-cs-opt { border: 0; background: none; color: var(--tl-navy); }
[data-theme="dark"] .tl-cs-opt:hover, [data-theme="dark"] .tl-cs-opt.is-on { background: #0D1118; }
[data-theme="dark"] .tl-cs-opt small { color: #A8B0BD; }
[data-theme="dark"] .tl-cs-search { border: 1px solid #32445D; outline: none; }
[data-theme="dark"] .tl-cs-empty { color: #A8B0BD; }
[data-theme="dark"] .tl-deal { background: #0D1118; }
[data-theme="dark"] .tl-deal-t { color: var(--tl-navy); }
[data-theme="dark"] .tl-deal-t .icon { color: var(--tl-blue); }
[data-theme="dark"] .tl-deal-grid > div { border-left: 1px solid #32425D; }
[data-theme="dark"] .tl-deal-grid span { color: #A1ACC4; }
[data-theme="dark"] .tl-deal-grid b { color: var(--tl-navy); }
[data-theme="dark"] .tl-deal-grid b.is-green { color: var(--tl-green); }
[data-theme="dark"] .tl-quicktip { background: #0D1118; border: 1px solid #32415D; }
[data-theme="dark"] .tl-quicktip-t { color: var(--tl-navy); }
[data-theme="dark"] .tl-quicktip-t .icon { color: var(--tl-blue); }
[data-theme="dark"] .tl-quicktip p { color: #95A2D0; }
[data-theme="dark"] .tl-side { border: 1px solid var(--tl-line); background: #181F28; }
[data-theme="dark"] .tl-side-t { color: var(--tl-navy); }
[data-theme="dark"] .tl-side-ic { background: #0D1118; color: var(--tl-blue); }
[data-theme="dark"] .tl-side-p { color: #95A2D0; }
[data-theme="dark"] .tl-examples { background: #0D1118; }
[data-theme="dark"] .tl-examples > span { color: #99A7CC; }
[data-theme="dark"] .tl-examples.is-kv b { color: var(--tl-navy); }
[data-theme="dark"] .tl-examples.is-kv em { color: #99A7CC; }
[data-theme="dark"] .tl-guide-ic.tone-green { background: #121E17; color: #73DE9A; }
[data-theme="dark"] .tl-guide-ic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .tl-guide-ic.tone-red { background: #1E1214; color: #DE737D; }
[data-theme="dark"] .tl-guide-ic.tone-slate { background: #12171E; color: #95A2D0; }
[data-theme="dark"] .tl-guide-row b { color: var(--tl-navy); }
[data-theme="dark"] .tl-guide-row small { color: #A3ACC2; }
[data-theme="dark"] .tl-param { background: #0D1118; }
[data-theme="dark"] .tl-param code { color: var(--tl-blue); }
[data-theme="dark"] .tl-param .tl-ibtn { color: var(--tl-blue); }
[data-theme="dark"] .tl-urlbox { background: #0D1118; }
[data-theme="dark"] .tl-urlbox-u { color: var(--tl-blue); }
[data-theme="dark"] .tl-valid { background: #121E17; color: #78E9A2; }
[data-theme="dark"] .tl-valid.is-bad { background: #180D0E; color: #DE7373; }
[data-theme="dark"] .tl-valid.is-wait { background: #0D1118; color: #8EA5E6; }
[data-theme="dark"] .tl-testbtn { color: var(--tl-blue); }
[data-theme="dark"] .tl-summary { background: #0D1118; }
[data-theme="dark"] .tl-summary-t { color: var(--tl-navy); }
[data-theme="dark"] .tl-summary-t .icon { color: var(--tl-blue); }
[data-theme="dark"] .tl-summary-grid > div { border-right: 1px solid #32425D; }
[data-theme="dark"] .tl-summary-grid span { color: #A1ACC4; }
[data-theme="dark"] .tl-summary-grid b { color: var(--tl-navy); }
[data-theme="dark"] .tl-kv > div { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .tl-kv dt { color: #99A7CC; }
[data-theme="dark"] .tl-kv dd { color: var(--tl-navy); }
[data-theme="dark"] .tl-kv dd.is-link { color: var(--tl-blue); }
[data-theme="dark"] .tl-qr { background: #0D1118; }
[data-theme="dark"] .tl-qr b { color: var(--tl-navy); }
[data-theme="dark"] .tl-qr small { color: #A3ACC2; }
[data-theme="dark"] .tl-sumcard { border: 1px solid #325D43; }
[data-theme="dark"] .tl-sumcard-top { background: #0D1811; }
[data-theme="dark"] .tl-sumcard-top > div > b { color: var(--tl-navy); }
[data-theme="dark"] .tl-sumcard-ic { background: #12171E; color: var(--tl-blue); }
[data-theme="dark"] .tl-sumcard-meta { color: #99A7CC; }
[data-theme="dark"] .tl-sumcard-meta span:nth-child(2) { color: var(--tl-blue); }
[data-theme="dark"] .tl-sumcard-meta i { color: #A3AEC2; }
[data-theme="dark"] .tl-sumcard-grid { background: #181F28; }
[data-theme="dark"] .tl-sumcard-grid > div { border-left: 1px solid #32465D; }
[data-theme="dark"] .tl-sumcard-grid span { color: #A1ACC4; }
[data-theme="dark"] .tl-sumcard-grid b { color: var(--tl-navy); }
[data-theme="dark"] .tl-info { background: #0D1118; border: 1px solid #32415D; color: #95A2D0; }
[data-theme="dark"] .tl-info .icon { color: var(--tl-blue); }
[data-theme="dark"] .tl-qr-url { color: #A1ACC4; }
[data-theme="dark"] .tl-test-res { color: var(--tl-ink); }
[data-theme="dark"] .tk-side { background: #0D1218; border-right: 1px solid #32455D; }
[data-theme="dark"] .tk-mod-tile { background: #3B6BFC; color: #fff; }
[data-theme="dark"] .tk-side-title { color: #E2E4E9; }
[data-theme="dark"] .tk-head-add { background: #0D1118; color: #6D94F4; border: 0; }
[data-theme="dark"] .tk-head-add:hover { background: #12171E; }
[data-theme="dark"] .tk-short { color: #E2E5E9; }
[data-theme="dark"] .tk-short:hover, [data-theme="dark"] .tk-short.is-active { background: #12171E; }
[data-theme="dark"] .tk-short-i { color: #E2E5E9; }
[data-theme="dark"] .tk-badge { background: #12171E; color: #A7B1BE; }
[data-theme="dark"] .tk-spaces-head > span { color: #E2E4E9; }
[data-theme="dark"] .tk-round { background: #181F28; border: 1px solid #32445D; color: #A4B0C1; }
[data-theme="dark"] .tk-round:hover { background: #0D1218; }
[data-theme="dark"] .tk-all:hover { background: #12171E; }
[data-theme="dark"] .tk-tile { color: #fff; }
[data-theme="dark"] .tk-tile-dark { background: #E2E5E9; }
[data-theme="dark"] .tk-tile-grey { background: #7F8EA3; }
[data-theme="dark"] .tk-all-name { color: #E2E4E9; }
[data-theme="dark"] .tk-all-sub { color: #A7B1BE; }
[data-theme="dark"] .tk-space-row:hover { background: #12171E; }
[data-theme="dark"] .tk-letter { color: #fff; }
[data-theme="dark"] .tk-letter.tone-green { background: #0B7B45; }
[data-theme="dark"] .tk-letter.tone-violet { background: #9333EA; }
[data-theme="dark"] .tk-letter.tone-orange { background: #B45309; }
[data-theme="dark"] .tk-letter.tone-red { background: #CE2F2F; }
[data-theme="dark"] .tk-letter.tone-blue { background: #2F6BFF; }
[data-theme="dark"] .tk-letter.tone-purple { background: #7C3AED; }
[data-theme="dark"] .tk-letter.tone-teal { background: #0D7F73; }
[data-theme="dark"] .tk-space-name { color: #E2E4E9; }
[data-theme="dark"] .tk-space-caret { color: #A7B1BE; }
[data-theme="dark"] .tk-row-menu { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-folder-row:hover, [data-theme="dark"] .tk-list-row:hover { background: #12171E; }
[data-theme="dark"] .tk-caret { color: #E2E5E9; }
[data-theme="dark"] .tk-folder-i { color: #A4B0C1; }
[data-theme="dark"] .tk-node-name { color: #E2E5E9; }
[data-theme="dark"] .tk-lock { color: #A7B1BE; }
[data-theme="dark"] .tk-count { color: #A6B0BF; }
[data-theme="dark"] .tk-list-i.tone-green { color: #73DEAC; }
[data-theme="dark"] .tk-list-i.tone-amber { color: #DEB673; }
[data-theme="dark"] .tk-list-i.tone-red { color: #F37373; }
[data-theme="dark"] .tk-list-i.tone-blue { color: #6D94F4; }
[data-theme="dark"] .tk-list-i.tone-purple { color: #9B69F1; }
[data-theme="dark"] .tk-list-row.is-active { background: #12171E; }
[data-theme="dark"] .tk-list-row.is-active .tk-node-name, [data-theme="dark"] .tk-list-row.is-active .tk-count { color: #7398DE; }
[data-theme="dark"] .tk-main { background: #0D1218; }
[data-theme="dark"] .tk-crumb-tile { color: #fff; }
[data-theme="dark"] .tk-crumb-tile.tone-violet { background: #6366F1; }
[data-theme="dark"] .tk-crumb-tile.tone-green { background: #12B76A; }
[data-theme="dark"] .tk-crumb-tile.tone-orange { background: #F59E0B; }
[data-theme="dark"] .tk-crumb-tile.tone-red { background: #EF4444; }
[data-theme="dark"] .tk-crumb-tile.tone-blue { background: #2F6BFF; }
[data-theme="dark"] .tk-crumb { color: #A4B0C1; }
[data-theme="dark"] .tk-crumb:hover { color: #7398DE; }
[data-theme="dark"] .tk-crumb-sep { color: #A4B1C1; }
[data-theme="dark"] .tk-crumb-list strong { color: #E2E4E9; }
[data-theme="dark"] .tk-star { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-star:hover { color: #DEB673; }
[data-theme="dark"] .tk-btn-ghost { border: 1px solid #32445D; background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .tk-btn-ghost:hover { background: #0D1218; }
[data-theme="dark"] .tk-ibtn { border: 1px solid transparent; background: none; color: #A6B0BF; }
[data-theme="dark"] .tk-ibtn:hover { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .tk-viewbar { border-bottom: 1px solid #32435D; }
[data-theme="dark"] .tk-view { color: #A4B0C1; border-bottom: 2px solid transparent; background: none; border-top: 0; border-left: 0; border-right: 0; }
[data-theme="dark"] .tk-view:hover { color: #E2E5E9; }
[data-theme="dark"] .tk-view.is-active { color: #7398DE; border-bottom-color: #4982ED; }
[data-theme="dark"] .tk-view-add { color: #A4B0C1; }
[data-theme="dark"] .tk-toolbar { border-bottom: 1px solid #32435D; }
[data-theme="dark"] .tk-tool { border: 0; background: none; color: #A4B0C1; }
[data-theme="dark"] .tk-tool:hover { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .tk-tool.is-on { background: #0D1118; color: #7398DE; }
[data-theme="dark"] .tk-search { border: 1px solid #32425D; background: #181F28; color: #A7B1BE; }
[data-theme="dark"] .tk-search input { border: 0; outline: 0; background: none; color: #E2E4E9; }
[data-theme="dark"] .tk-search input::placeholder { color: #A8B1BD; }
[data-theme="dark"] .tk-newtask { background: #2F6BFF; }
[data-theme="dark"] .tk-newtask-main { border: 0; background: none; color: #fff; }
[data-theme="dark"] .tk-newtask-caret { border: 0; border-left: 1px solid rgba(255,255,255,.28); background: none; color: #fff; }
[data-theme="dark"] .tk-newtask-main:hover, [data-theme="dark"] .tk-newtask-caret:hover { background: rgba(0,0,0,.08); }
[data-theme="dark"] .tk-group-caret { border: 0; background: none; color: #E2E5E9; }
[data-theme="dark"] .tk-status-pill.tone-grey { background: #12191E; color: #E2E5E9; --tk-pill-check: #12191E; }
[data-theme="dark"] .tk-status-pill.tone-grey .tk-circle { color: #A4AFC1; color: #AFB6C0; }
[data-theme="dark"] .tk-status-pill.tone-blue { background: #2F6BFF; color: #fff; }
[data-theme="dark"] .tk-status-pill.tone-amber { background: #F5B324; color: #E9E6E2; }
[data-theme="dark"] .tk-status-pill.tone-green { background: #12B76A; color: #fff; }
[data-theme="dark"] .tk-group-count { color: #A6B0BF; }
[data-theme="dark"] .tk-group-btn { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-group-btn:hover { background: #0D1218; color: #A4B0C1; }
[data-theme="dark"] .tk-table { background: #181F28; border: 1px solid #32455D; }
[data-theme="dark"] .tk-thead { color: #A6B0BF; border-bottom: 1px solid #2B3D50; }
[data-theme="dark"] .tk-row { border-bottom: 1px solid #2B3D50; }
[data-theme="dark"] .tk-row:hover { background: #0D1018; }
[data-theme="dark"] .tk-row.is-open { background: #0D1118; box-shadow: inset 2px 0 0 #000000; }
[data-theme="dark"] .tk-check { border: 0; background: none; color: #586F92; }
[data-theme="dark"] .tk-check:hover { color: #6D94F4; }
[data-theme="dark"] .tk-check.is-done { color: #73DEAC; }
[data-theme="dark"] .tk-title { color: #E2E4E9; }
[data-theme="dark"] .tk-row.is-done .tk-title { color: #E2E5E9; }
[data-theme="dark"] .tk-mini { color: #A7B1BE; }
[data-theme="dark"] .tk-person { color: #E2E5E9; }
[data-theme="dark"] .tk-empty-dot { color: #A4B1C1; }
[data-theme="dark"] .tk-c-due { color: #E2E5E9; }
[data-theme="dark"] .tk-due-i { color: #A7B1BE; }
[data-theme="dark"] .tk-prio { color: #E2E5E9; background: none; border: 0; }
[data-theme="dark"] .tk-prio.tone-red { color: #E2E5E9; }
[data-theme="dark"] .tk-prio.tone-red .tk-i { color: #F4677C; }
[data-theme="dark"] .tk-prio.tone-amber .tk-i { color: #DEBC73; }
[data-theme="dark"] .tk-prio.tone-blue .tk-i { color: #6DA5F4; }
[data-theme="dark"] .tk-prio.tone-grey .tk-i { color: #A7B1BE; }
[data-theme="dark"] .tk-c-menu .tk-row-menu, [data-theme="dark"] .tk-thead .tk-c-menu { color: #A7B1BE; }
[data-theme="dark"] .tk-addrow { color: #A7B1BE; }
[data-theme="dark"] .tk-addrow:hover { color: #6D94F4; }
[data-theme="dark"] .tk-placeholder { color: #A6B0BF; }
[data-theme="dark"] .tk-placeholder strong { color: #E2E4E9; }
[data-theme="dark"] .tk-av { color: #fff; }
[data-theme="dark"] .tk-av.tone-navy { background: #1F3E8C; }
[data-theme="dark"] .tk-av.tone-blue { background: #2F6BFF; }
[data-theme="dark"] .tk-av.tone-violet { background: #7C3AED; }
[data-theme="dark"] .tk-av.tone-purple { background: #9333EA; }
[data-theme="dark"] .tk-av.tone-steel { background: #7F8EA3; }
[data-theme="dark"] .tk-av.tone-teal { background: #0D9488; }
[data-theme="dark"] .tk-av.tone-slate { background: #5C6E87; }
[data-theme="dark"] .tk-av.tone-green { background: #12B76A; }
[data-theme="dark"] .tk-av.tone-red { background: #EF4444; }
[data-theme="dark"] .tk-av-empty { background: #12171E; }
[data-theme="dark"] .tk-av-me { background: #A9B5C6; }
[data-theme="dark"] .tk-panel { background: #181F28; border-left: 1px solid #32435D; }
[data-theme="dark"] .tk-pill-status.tone-blue { background: #12171E; color: #7398DE; --tk-pill-check: #12171E; }
[data-theme="dark"] .tk-pill-status.tone-grey { background: #12181E; color: #E2E5E9; --tk-pill-check: #12181E; }
[data-theme="dark"] .tk-pill-status.tone-amber { background: #1E1A12; color: #DEA173; --tk-pill-check: #1E1A12; }
[data-theme="dark"] .tk-pill-status.tone-green { background: #121E18; color: #5EF5BC; --tk-pill-check: #121E18; }
[data-theme="dark"] .tk-icon-group .tk-ibtn { border: 1px solid #32425D; background: #181F28; }
[data-theme="dark"] .tk-panel-title { color: #E2E4E9; outline: 0; }
[data-theme="dark"] .tk-field-label { color: #A4B0C1; }
[data-theme="dark"] .tk-field-label .tk-i { color: #A6B0BF; }
[data-theme="dark"] .tk-field-value { color: #E2E4E9; }
[data-theme="dark"] .tk-field-value .tk-strong, [data-theme="dark"] .tk-field-value .tk-person, [data-theme="dark"] .tk-field-value .tk-prio { color: #E2E4E9; }
[data-theme="dark"] .tk-field-i { color: #6D94F4; }
[data-theme="dark"] .tk-caret-i { color: #A7B1BE; }
[data-theme="dark"] .tk-tag { background: #12171E; color: #7398DE; }
[data-theme="dark"] .tk-tag.tone-green { background: #121E18; color: #5EF5BC; }
[data-theme="dark"] .tk-tag.tone-amber { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .tk-tag.tone-purple { background: #16121E; color: #9C73DE; }
[data-theme="dark"] .tk-link { color: #7398DE; }
[data-theme="dark"] .tk-link-i { color: #6D94F4; }
[data-theme="dark"] .tk-link-ext { color: #6D94F4; }
[data-theme="dark"] .tk-muted { color: #A7B1BE; }
[data-theme="dark"] .tk-tabs { border-bottom: 1px solid #32435D; }
[data-theme="dark"] .tk-tab { border: 0; background: none; color: #A4B0C1; border-bottom: 2px solid transparent; }
[data-theme="dark"] .tk-tab.is-active { color: #7398DE; border-bottom-color: #4982ED; }
[data-theme="dark"] .tk-tabcount { background: #0D1218; color: #A6B0BF; }
[data-theme="dark"] .tk-desc { color: #E2E5E9; }
[data-theme="dark"] .tk-sec { border-top: 1px solid #2B3B50; }
[data-theme="dark"] .tk-sec-title { color: #E2E4E9; }
[data-theme="dark"] .tk-sec-count { color: #A6B0BF; }
[data-theme="dark"] .tk-sec-btn { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-cl-item { color: #E2E5E9; }
[data-theme="dark"] .tk-cl-box { border: 1.6px solid #34465B; color: transparent; }
[data-theme="dark"] .tk-cl-item.is-done .tk-cl-box { background: #2F6BFF; border-color: #2F6BFF; color: #fff; }
[data-theme="dark"] .tk-add-item { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-add-item:hover { color: #6D94F4; }
[data-theme="dark"] .tk-att { border: 1px solid #32455D; background: #181F28; }
[data-theme="dark"] .tk-att:hover { border-color: #32405D; background: #0D1218; }
[data-theme="dark"] .tk-att-img { background: #16121E; color: #9B69F1; }
[data-theme="dark"] .tk-att-name { color: #E2E4E9; }
[data-theme="dark"] .tk-att-size { color: #A7B1BE; }
[data-theme="dark"] .tk-att-add { border: 1.5px dashed #32445D; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-att-add:hover { border-color: #6D94F4; color: #6D94F4; }
[data-theme="dark"] .tk-sub-row { border-bottom: 1px solid #2B3D50; }
[data-theme="dark"] .tk-sub-due { color: #A6B0BF; }
[data-theme="dark"] .tk-act-text { color: #E2E5E9; }
[data-theme="dark"] .tk-act-time { color: #A7B1BE; }
[data-theme="dark"] .tk-composer { border-top: 1px solid #32435D; }
[data-theme="dark"] .tk-composer-box { border: 1px solid #32425D; }
[data-theme="dark"] .tk-composer-box input { border: 0; outline: 0; background: none; color: #E2E4E9; }
[data-theme="dark"] .tk-composer-box input::placeholder { color: #A8B1BD; }
[data-theme="dark"] .tk-composer-btn { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-composer-btn:hover { color: #A4B0C1; }
[data-theme="dark"] .tk-status-pill.tone-blue .tk-circle, [data-theme="dark"] .tk-status-pill.tone-amber .tk-circle, [data-theme="dark"] .tk-status-pill.tone-green .tk-circle { color: #fff; }
[data-theme="dark"] .tk-pill-status .tk-circle { color: currentColor; }
[data-theme="dark"] .tk-list-i[class*="tone-"], [data-theme="dark"] .tk-prio[class*="tone-"], [data-theme="dark"] .tk-circle[class*="tone-"], [data-theme="dark"] .tk-att-i[class*="tone-"] { background: none; }
[data-theme="dark"] .tl-crumb { color: #99A7CC; }
[data-theme="dark"] .tl-crumb a { color: #99A7CC; }
[data-theme="dark"] .tl-crumb a:hover { color: var(--tl-blue); }
[data-theme="dark"] .tl-crumb span { color: var(--tl-navy); }
[data-theme="dark"] .tl-crumb .icon { color: #A3AEC2; }
[data-theme="dark"] .tl-ibtn.is-plain { background: none; border: 0; }
[data-theme="dark"] .tl-ibtn.is-box2 { border: 1px solid #32445D; background: #181F28; color: var(--tl-ink); }
[data-theme="dark"] .tl-backbtn { border: 1px solid #32445D; background: #181F28; color: var(--tl-navy); }
[data-theme="dark"] .tl-dhead-t h1 { color: var(--tl-navy); }
[data-theme="dark"] .tl-dhead-s { color: #A1ACC4; }
[data-theme="dark"] .tl-dchip { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .tl-dchip b { color: var(--tl-navy); }
[data-theme="dark"] .tl-dchip.is-type { background: #12171E; color: var(--tl-blue); }
[data-theme="dark"] .tl-urlcard { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .tl-urlcard-l { color: #A3ACC2; }
[data-theme="dark"] .tl-urlcard-u { color: var(--tl-blue); }
[data-theme="dark"] .tl-range { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .tl-range-ic { color: var(--tl-blue); }
[data-theme="dark"] .tl-range select { border: 0; background: none; color: var(--tl-navy); outline: none; }
[data-theme="dark"] .tl-dtabs { background: #181F28; border: 1px solid var(--tl-line); }
[data-theme="dark"] .tl-dtab { color: #99A7CC; }
[data-theme="dark"] .tl-dtab.is-active { color: var(--tl-blue); }
[data-theme="dark"] .tl-dtab.is-active::after { background: var(--tl-blue); }
[data-theme="dark"] .tl-dtab-n { color: #A8B0BD; }
[data-theme="dark"] .tl-dtab.is-active .tl-dtab-n { color: var(--tl-blue); }
[data-theme="dark"] .tl-dstat { background: #181F28; border: 1px solid var(--tl-line); }
[data-theme="dark"] .tl-dstat-ic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .tl-dstat-ic.tone-green { background: #121E18; color: #73DE9A; }
[data-theme="dark"] .tl-dstat-ic.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .tl-dstat-ic.tone-purple { background: #18121E; color: #9B69F1; }
[data-theme="dark"] .tl-dstat-ic.tone-teal { background: #121E1D; color: #86F3EB; }
[data-theme="dark"] .tl-dstat-ic.tone-red { background: #1E1214; color: #F37373; }
[data-theme="dark"] .tl-dstat-ic.is-solid { background: #16A34A; color: #fff; }
[data-theme="dark"] .tl-dstat-l { color: #A1ACC4; }
[data-theme="dark"] .tl-dstat-l em { color: #A8B0BD; }
[data-theme="dark"] .tl-dstat-v { color: var(--tl-navy); }
[data-theme="dark"] .tl-dstat-s { color: #A8B0BD; }
[data-theme="dark"] .tl-dstat-pct.is-green { color: var(--tl-green); }
[data-theme="dark"] .tl-dstat.is-quick { color: #A1ACC4; }
[data-theme="dark"] .tl-dquick-ic { color: var(--tl-navy); }
[data-theme="dark"] .tl-attrbar { background: #0D1118; }
[data-theme="dark"] .tl-attrlegend { color: #A1ACC4; }
[data-theme="dark"] .tl-attrlegend b { color: var(--tl-navy); }
[data-theme="dark"] .tl-dchart { --tl-track: #3C5067; }
[data-theme="dark"] .tl-dchart .axis text { fill: #A8B0BD; }
[data-theme="dark"] .tl-dchart .grid line { stroke: #546F96; }
[data-theme="dark"] .tl-dchart .line { fill: none; }
[data-theme="dark"] .tl-dchart .dot.is-active { stroke: #fff; }
[data-theme="dark"] .tl-dchart .marker { stroke: #526B98; }
[data-theme="dark"] .tl-dchart .hit { fill: transparent; }
[data-theme="dark"] .tl-georow-t span { color: var(--tl-navy); }
[data-theme="dark"] .tl-georow-t b { color: var(--tl-navy); }
[data-theme="dark"] .tl-georow-t em { color: #A8B0BD; }
[data-theme="dark"] .tl-dkv > div { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .tl-dkv dt { color: #A1ACC4; }
[data-theme="dark"] .tl-dkv dd { color: var(--tl-navy); }
[data-theme="dark"] .tl-dkv dd .is-link, [data-theme="dark"] .tl-dkv dd a.is-link { color: var(--tl-blue); }
[data-theme="dark"] .tl-linkic { color: var(--tl-blue); }
[data-theme="dark"] .tl-fnode-ic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .tl-fnode-ic.tone-green { background: #121E18; color: #73DE9A; }
[data-theme="dark"] .tl-fnode-ic.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .tl-fnode b { color: var(--tl-navy); }
[data-theme="dark"] .tl-fnode span { color: #A1ACC4; }
[data-theme="dark"] .tl-fnode em { color: var(--tl-navy); }
[data-theme="dark"] .tl-fsep { color: #526C98; }
[data-theme="dark"] .tl-dtable th { background: #0D1118; color: #A1ACC4; }
[data-theme="dark"] .tl-dtable td { color: var(--tl-ink); border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .tl-dtable td b { color: var(--tl-navy); }
[data-theme="dark"] .tl-dtable a { color: var(--tl-blue); }
[data-theme="dark"] .tl-dtable .tl-th { color: inherit; }
[data-theme="dark"] .tl-dtable .tl-sort { color: #A3AEC2; }
[data-theme="dark"] .tl-dtable tr.is-this td { background: #121E17; }
[data-theme="dark"] .tl-dtable tr.is-this td:first-child { box-shadow: inset 3px 0 0 #000000; }
[data-theme="dark"] .tl-this { color: #78E9A2; }
[data-theme="dark"] .tl-tag { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .tl-globe { color: #A6B0BF; }
[data-theme="dark"] .tl-devic { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .tl-dtable .c-pct em { color: #A8B0BD; }
[data-theme="dark"] .tl-dtable .c-share em { color: #99A7CC; }
[data-theme="dark"] .tl-expand { border: 0; background: none; color: var(--tl-navy); }
[data-theme="dark"] .tl-expand .icon:first-child { color: #A6B0BF; }
[data-theme="dark"] .tl-srcic { background: color-mix(in srgb, var(--c) 18%, #181F28); color: var(--c); }
[data-theme="dark"] .tl-attr-kid td { color: #99A7CC; }
[data-theme="dark"] .tl-attr-kid td:nth-child(2) { color: var(--tl-navy); }
[data-theme="dark"] .tl-qual-ic { background: #12171E; color: var(--tl-blue); }
[data-theme="dark"] .tl-donut { --tl-track: #3C5067; }
[data-theme="dark"] .tl-donut-c b { color: var(--tl-navy); }
[data-theme="dark"] .tl-donut-c span { color: #A1ACC4; }
[data-theme="dark"] .tl-qual-l { color: var(--tl-navy); }
[data-theme="dark"] .tl-qual-legend b { color: var(--tl-navy); }
[data-theme="dark"] .tl-qual-legend em { color: #A3ACC2; }
[data-theme="dark"] .tl-qual-note { background: #0D1218; border: 1px solid #32415D; }
[data-theme="dark"] .tl-qual-note .icon { color: var(--tl-blue); }
[data-theme="dark"] .tl-qual-note p { color: #99A7CC; }
[data-theme="dark"] .tl-qual-note .tl-btn { background: #181F28; }
[data-theme="dark"] .tl-note-ic { background: #0D1118; color: var(--tl-blue); }
[data-theme="dark"] .tl-note-b b { color: var(--tl-navy); }
[data-theme="dark"] .tl-note-b span { color: #A8B0BD; }
[data-theme="dark"] .tl-note-b i { color: #526B98; }
[data-theme="dark"] .tl-btn-danger { background: #181F28; border: 1px solid #5D3236; color: #DE737D; }
[data-theme="dark"] .tl-btn-danger:hover { background: #180D0E; }
[data-theme="dark"] .tl-btn-danger.is-outline { border-color: #5D3236; }
[data-theme="dark"] .tl-dtable.is-subs .c-sel input { accent-color: var(--tl-blue); }
[data-theme="dark"] .tl-subrow:hover td { background: #0D1118; }
[data-theme="dark"] .tl-subrow.is-open td { background: #0D1118; }
[data-theme="dark"] .tl-subcell b { color: var(--tl-navy); }
[data-theme="dark"] .tl-subic.tone-green { background: #121E18; color: #73DE9E; }
[data-theme="dark"] .tl-subic.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .tl-subic.tone-red { background: #1E1214; color: #DE738A; }
[data-theme="dark"] .tl-subic.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .tl-subic.tone-slate { background: #12171E; color: #758DDB; }
[data-theme="dark"] .tl-subic.tone-purple { background: #18121E; color: #9C73DE; }
[data-theme="dark"] .tl-subic.tone-grey { background: #0D1118; color: #A1ACC4; }
[data-theme="dark"] .tl-subic.is-brand { background: color-mix(in srgb, var(--b) 12%, #181F28); }
[data-theme="dark"] .tl-dtable .c-attr em { color: var(--tl-navy); }
[data-theme="dark"] .tl-subpanel-code b { color: var(--tl-navy); }
[data-theme="dark"] .tl-subpanel-p { color: var(--tl-navy); }
[data-theme="dark"] .tl-subpanel-d { color: #A3ACC2; }
[data-theme="dark"] .tl-submetrics { border: 1px solid var(--tl-line); }
[data-theme="dark"] .tl-submetrics b { color: var(--tl-navy); }
[data-theme="dark"] .tl-submetrics span { color: #A3ACC2; }
[data-theme="dark"] .tl-unmap-ic { background: #1E1214; color: #F37373; }
[data-theme="dark"] .tl-countbadge { background: #EF4444; color: #fff; }
[data-theme="dark"] .tl-guide.is-wide .tl-guide-row { border-bottom: 1px solid #2B3A50; }
[data-theme="dark"] .tl-guide.is-wide small { color: #A3ACC2; }
[data-theme="dark"] .tl-placecell b { color: var(--tl-navy); }
[data-theme="dark"] .tl-esec-head h2 { color: var(--tl-navy); }
[data-theme="dark"] .tl-esec-head p { color: #A1ACC4; }
[data-theme="dark"] .tl-esel { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .tl-esel select { border: 0; background: none; color: var(--tl-navy); outline: none; }
[data-theme="dark"] .tl-esel-ic { background: #12171E; color: var(--tl-blue); }
[data-theme="dark"] .tl-esel.is-status select { color: var(--tl-navy); }
[data-theme="dark"] .tl-statusdot { background: #16A34A; }
[data-theme="dark"] .tl-esel.is-status.tone-amber .tl-statusdot { background: #F59E0B; }
[data-theme="dark"] .tl-eurl { border: 1px solid #32445D; background: #0D1218; }
[data-theme="dark"] .tl-eurl a { color: var(--tl-blue); }
[data-theme="dark"] .tl-eprev a:first-child { border: 1px solid #32415D; background: #0D1118; color: var(--tl-blue); }
[data-theme="dark"] .tk-task-main { background: #181F28; }
[data-theme="dark"] .tk-crumb-ico { color: #A6B0BF; }
[data-theme="dark"] .tk-created { color: #A6B0BF; }
[data-theme="dark"] .tk-brain { border: 1px solid #32415D; background: #0D1118; color: #7398DE; }
[data-theme="dark"] .tk-brain:hover { background: #12171E; }
[data-theme="dark"] .tk-btn-dark { border: 0; background: #16243B; color: #fff; }
[data-theme="dark"] .tk-btn-dark:hover { background: #24344F; }
[data-theme="dark"] .tk-chip { border: 1px solid #32425D; background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .tk-chip .tk-dot { background: #A9B5C6; }
[data-theme="dark"] .tk-ref { color: #A6B0BF; }
[data-theme="dark"] .tk-task-title { color: #E2E4E9; outline: 0; }
[data-theme="dark"] .tk-ai-bar { border: 1px solid #32405D; background: #0D1018; color: #A8AFBD; }
[data-theme="dark"] .tk-ai-i { color: #B97AF5; }
[data-theme="dark"] .tk-ai-bar:hover { background: #0D1018; }
[data-theme="dark"] .tk-props { border-bottom: 1px solid #2B3B50; }
[data-theme="dark"] .tk-prop-label { color: #A4B0C1; }
[data-theme="dark"] .tk-prop-label .tk-i { color: #A6B0BF; }
[data-theme="dark"] .tk-prop-value { color: #E2E4E9; }
[data-theme="dark"] .tk-arrow { color: #A7B1BE; }
[data-theme="dark"] .tk-start { border: 1px solid #32425D; background: #181F28; color: #E2E4E9; }
[data-theme="dark"] .tk-start:hover { border-color: #32415D; color: #7398DE; }
[data-theme="dark"] .tk-start .tk-i { color: #73DEAC; }
[data-theme="dark"] .tk-start.is-running .tk-i { color: #F37373; }
[data-theme="dark"] .tk-tracked { color: #A6B0BF; }
[data-theme="dark"] .tk-block-title { color: #E2E4E9; }
[data-theme="dark"] .tk-block-count { background: #0D1218; color: #A6B0BF; }
[data-theme="dark"] .tk-editor { border: 1px solid #32425D; background: #181F28; }
[data-theme="dark"] .tk-editor-bar { border-bottom: 1px solid #2B3B50; }
[data-theme="dark"] .tk-eb { border: 0; background: none; color: #A4B0C1; }
[data-theme="dark"] .tk-eb:hover { background: #0D1218; color: #E2E4E9; }
[data-theme="dark"] .tk-editor-body { color: #E2E5E9; outline: 0; }
[data-theme="dark"] .tk-editor.is-focus { border-color: #32415D; box-shadow: 0 0 0 3px rgba(0,0,0,0.28); }
[data-theme="dark"] .tk-att-menu { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-subtable .tk-thead { border-bottom: 1px solid #2B3B50; }
[data-theme="dark"] .tk-subtable .tk-row:last-of-type { border-bottom: 1px solid #2B3D50; }
[data-theme="dark"] .tk-subtable .tk-title { color: #E2E4E9; }
[data-theme="dark"] .tk-rail { border-left: 1px solid #32435D; background: #181F28; }
[data-theme="dark"] .tk-tab-more { color: #A7B1BE; }
[data-theme="dark"] .tk-fchip { border: 1px solid #32425D; background: #181F28; color: #A4B0C1; }
[data-theme="dark"] .tk-fchip.is-active { background: #181F28; border-color: #32445D; color: #E2E4E9; }
[data-theme="dark"] .tk-tl-text { color: #E2E5E9; }
[data-theme="dark"] .tk-tl-text strong { color: #E2E4E9; }
[data-theme="dark"] .tk-tl-head strong { color: #E2E4E9; }
[data-theme="dark"] .tk-tl-time { color: #A7B1BE; }
[data-theme="dark"] .tk-tl-old { color: #A6B0BF; }
[data-theme="dark"] .tk-tl-new { color: #7398DE; }
[data-theme="dark"] .tk-mention { color: #7398DE; }
[data-theme="dark"] .tk-tl-file, [data-theme="dark"] .tk-tl-image { border: 1px solid #32455D; }
[data-theme="dark"] .tk-tl-thumb { background: linear-gradient(135deg, #0D1018, #12171E); color: #A8AFBD; }
[data-theme="dark"] .tk-tl-fname { color: #E2E4E9; }
[data-theme="dark"] .tk-tl-fsize { color: #A7B1BE; }
[data-theme="dark"] .tk-react { border: 1px solid #32425D; background: #181F28; color: #A4B0C1; }
[data-theme="dark"] .tk-react.is-on { background: #0D1218; }
[data-theme="dark"] .tk-react b { color: #E2E5E9; }
[data-theme="dark"] .tk-reply { border: 0; background: none; color: #A6B0BF; }
[data-theme="dark"] .tk-reply:hover, [data-theme="dark"] .tk-react:hover { color: #7398DE; }
[data-theme="dark"] .tk-composer-send { border: 0; background: #2F6BFF; color: #fff; }
[data-theme="dark"] .tk-composer-send:hover { background: #1B5AF0; }
[data-theme="dark"] .tk-pop { background: #181F28; border: 1px solid #32425D; box-shadow: 0 16px 40px rgba(0,0,0,0.364); }
[data-theme="dark"] .tk-pop-title { color: #A7B1BE; }
[data-theme="dark"] .tk-pop-search { border: 1px solid #32425D; color: #A7B1BE; }
[data-theme="dark"] .tk-pop-search input { border: 0; outline: 0; background: none; color: #E2E4E9; }
[data-theme="dark"] .tk-pop-item { border: 0; background: none; color: #E2E5E9; }
[data-theme="dark"] .tk-pop-item:hover { background: #0D1218; }
[data-theme="dark"] .tk-pop-item.is-danger { color: #DE7373; }
[data-theme="dark"] .tk-pop-item.is-active { background: #0D1118; color: #7398DE; }
[data-theme="dark"] .tk-pop-item .tk-i, [data-theme="dark"] .tk-pop-item .icon { color: #A6B0BF; }
[data-theme="dark"] .tk-pop-item.is-danger .tk-i, [data-theme="dark"] .tk-pop-item.is-danger .icon { color: #DE7373; }
[data-theme="dark"] .tk-pop-sub { color: #A7B1BE; }
[data-theme="dark"] .tk-pop-badge { color: #A6B0BF; }
[data-theme="dark"] .tk-pop-div { background: #0D1218; }
[data-theme="dark"] .tk-pop-head { color: #A7B1BE; }
[data-theme="dark"] .tk-pop-foot { border-top: 1px solid #2B3B50; }
[data-theme="dark"] .tk-dp-head { color: #E2E4E9; }
[data-theme="dark"] .tk-dp-dow span { color: #A7B1BE; }
[data-theme="dark"] .tk-dp-cell { border: 0; background: none; color: #E2E5E9; }
[data-theme="dark"] .tk-dp-cell:hover { background: #0D1118; color: #7398DE; }
[data-theme="dark"] .tk-dp-cell.is-today { color: #7398DE; }
[data-theme="dark"] .tk-dp-cell.is-sel { background: #2F6BFF; color: #fff; }
[data-theme="dark"] .tk-dp-foot { border-top: 1px solid #2B3B50; }
[data-theme="dark"] .tk-dp-clear { color: #DE7373; }
[data-theme="dark"] .modal-backdrop .tk-create-modal { background: #181F28; }
[data-theme="dark"] .tk-create-tabs { border-bottom: 1px solid #32435D; }
[data-theme="dark"] .tk-ct-tab { border: 0; background: none; color: #A4B0C1; border-bottom: 2px solid transparent; }
[data-theme="dark"] .tk-ct-tab.is-active { color: #E2E4E9; border-bottom-color: #6D94F4; }
[data-theme="dark"] .tk-ct-check { background: #2F6BFF; color: #fff; }
[data-theme="dark"] .tk-ct-tab .tk-i, [data-theme="dark"] .tk-ct-tab .icon { color: #A4B0C1; }
[data-theme="dark"] .tk-ct-close { border: 1px solid #32425D; }
[data-theme="dark"] .tk-ct-chip { border: 1px solid #32435D; background: #181F28; color: #E2E4E9; }
[data-theme="dark"] .tk-ct-chip:hover { border-color: #32415D; }
[data-theme="dark"] .tk-ct-chip.is-filled { background: #0D1218; }
[data-theme="dark"] .tk-ct-chip .tk-i, [data-theme="dark"] .tk-ct-chip .icon { color: #A4B0C1; }
[data-theme="dark"] .tk-ct-radio { border: 4px solid #E2E5E9; }
[data-theme="dark"] .tk-ct-name { border: 1.5px solid #32435D; background: #0D1218; color: #E2E4E9; outline: 0; }
[data-theme="dark"] .tk-ct-name::placeholder { color: #A7B1BE; }
[data-theme="dark"] .tk-ct-name.is-error { border-color: #762D2D; }
[data-theme="dark"] .tk-ct-desc { color: #A7B1BE; }
[data-theme="dark"] .tk-ct-ai-label { color: #A6B0BF; }
[data-theme="dark"] .tk-ct-descbox { border: 1px solid #32435D; color: #E2E4E9; outline: 0; }
[data-theme="dark"] .tk-ct-fields-label { color: #A6B0BF; }
[data-theme="dark"] .tk-ct-field { color: #A6B0BF; }
[data-theme="dark"] .tk-ct-field input { border: 1px solid #32435D; }
[data-theme="dark"] .tk-ct-newfield { border: 1.5px dashed #32445D; background: none; color: #A6B0BF; }
[data-theme="dark"] .tk-ct-newfield:hover { border-color: #6D94F4; color: #6D94F4; }
[data-theme="dark"] .tk-create-foot { border-top: 1px solid #32435D; }
[data-theme="dark"] .tk-ct-watch { color: #A4B0C1; }
[data-theme="dark"] .tk-ct-create { background: #2F6BFF; }
[data-theme="dark"] .tk-ct-create-main { border: 0; background: none; color: #fff; }
[data-theme="dark"] .tk-ct-create-caret { border: 0; border-left: 1px solid rgba(255,255,255,.28); background: none; color: #fff; }
[data-theme="dark"] .tk-ct-create-main:hover, [data-theme="dark"] .tk-ct-create-caret:hover { background: rgba(0,0,0,.09); }
[data-theme="dark"] .tk-ct-soon { color: #A6B0BF; }
[data-theme="dark"] .tk-ct-soon strong { color: #E2E4E9; }
[data-theme="dark"] .tk-ct-docbody { border: 1px solid #32435D; color: #E2E5E9; outline: 0; }
[data-theme="dark"] .tk-ct-listdot { background: #2F6BFF; }
[data-theme="dark"] .tk-ct-listdot.tone-green { background: #12B76A; }
[data-theme="dark"] .tk-ct-listdot.tone-amber { background: #F59E0B; }
[data-theme="dark"] .tk-ct-listdot.tone-red { background: #EF4444; }
[data-theme="dark"] .tk-ct-listdot.tone-purple { background: #7C3AED; }
[data-theme="dark"] .tk-share-btn { border: 0; background: #F97316; color: #fff; }
[data-theme="dark"] .tk-share-btn:hover { background: #EA6A0B; }
[data-theme="dark"] .tk-share-sub { color: #A6B0BF; }
[data-theme="dark"] .tk-share-name { color: #E2E4E9; }
[data-theme="dark"] .tk-share-invite { border: 2px solid #F29250; }
[data-theme="dark"] .tk-share-invite input { border: 0; outline: 0; color: #E2E4E9; background: none; }
[data-theme="dark"] .tk-share-invite button { border: 0; background: #F97316; color: #fff; }
[data-theme="dark"] .tk-share-link { color: #E2E5E9; }
[data-theme="dark"] .tk-share-info { color: #A7B1BE; }
[data-theme="dark"] .tk-share-label { color: #A6B0BF; }
[data-theme="dark"] .tk-share-rname { color: #E2E4E9; }
[data-theme="dark"] .tk-share-inherit { color: #A7B1BE; }
[data-theme="dark"] .tk-share-caret { color: #A7B1BE; }
[data-theme="dark"] .tk-share-role { border: 1px solid #32425D; color: #A4B0C1; }
[data-theme="dark"] .tk-share-toggle { border: 0; background: #3C5067; }
[data-theme="dark"] .tk-share-toggle span { background: #181F28; }
[data-theme="dark"] .tk-share-toggle.is-on { background: #F97316; }
[data-theme="dark"] .tk-share-private { border: 1px solid #32425D; background: #0D1218; color: #E2E4E9; }
[data-theme="dark"] .tk-share-private:hover { background: #0D1218; }
[data-theme="dark"] .tk-se-color { border: 1px solid #32425D; }
[data-theme="dark"] .tk-row.is-dragging { background: #0D1118; }
[data-theme="dark"] .tk-row.tk-drop-before { box-shadow: inset 0 2px 0 #000000; }
[data-theme="dark"] .tk-group.tk-drop-into .tk-table { box-shadow: 0 0 0 2px #000000; }
[data-theme="dark"] .tk-col { background: #0D1118; border: 1px solid #32445D; }
[data-theme="dark"] .tk-card { background: #181F28; border: 1px solid #32455D; box-shadow: var(--shadow-xs); }
[data-theme="dark"] .tk-card:hover { border-color: #32415D; }
[data-theme="dark"] .tk-card-title { color: #E2E4E9; }
[data-theme="dark"] .tk-card-due, [data-theme="dark"] .tk-card-meta { color: #A6B0BF; }
[data-theme="dark"] .tk-col-add { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-col-add:hover { background: #0D1118; color: #6D94F4; }
[data-theme="dark"] .tk-col.tk-drop-into { box-shadow: 0 0 0 2px #000000; }
[data-theme="dark"] .tk-cal { background: #181F28; border: 1px solid #32455D; }
[data-theme="dark"] .tk-cal-head { border-bottom: 1px solid #2B3B50; }
[data-theme="dark"] .tk-cal-dow { border-bottom: 1px solid #2B3B50; }
[data-theme="dark"] .tk-cal-dow span { color: #A7B1BE; }
[data-theme="dark"] .tk-cal-cell { border-right: 1px solid #2B3D50; border-bottom: 1px solid #2B3D50; }
[data-theme="dark"] .tk-cal-cell.is-muted { background: #0D1218; }
[data-theme="dark"] .tk-cal-cell.is-today { background: #0D1118; }
[data-theme="dark"] .tk-cal-cell.is-today .tk-cal-num { background: #2F6BFF; color: #fff; }
[data-theme="dark"] .tk-cal-num { color: #A4B0C1; }
[data-theme="dark"] .tk-cal-task { background: #0D1218; color: #E2E4E9; }
[data-theme="dark"] .tk-cal-task.tone-blue { background: #12171E; color: #7398DE; }
[data-theme="dark"] .tk-cal-task.tone-amber { background: #1E1B12; color: #DEA173; }
[data-theme="dark"] .tk-cal-task.tone-green { background: #121E18; color: #5EF5BC; }
[data-theme="dark"] .tk-cal-add { border: 0; background: none; color: #A4B1C1; }
[data-theme="dark"] .tk-cal-add:hover { background: #0D1118; color: #6D94F4; }
[data-theme="dark"] .tk-cal-cell.tk-drop-into { box-shadow: inset 0 0 0 2px #000000; }
[data-theme="dark"] .tk-screen-sub { color: #A6B0BF; }
[data-theme="dark"] .tk-inbox-row { border: 1px solid #32435D; background: #181F28; }
[data-theme="dark"] .tk-inbox-row.is-unread { background: #0D1118; border-color: #32425D; }
[data-theme="dark"] .tk-inbox-row:hover { border-color: #32415D; }
[data-theme="dark"] .tk-inbox-text { color: #A6B0BF; }
[data-theme="dark"] .tk-inbox-text strong { color: #E2E4E9; }
[data-theme="dark"] .tk-inbox-time { color: #A7B1BE; }
[data-theme="dark"] .tk-fav, [data-theme="dark"] .tk-more-card { border: 1px solid #32435D; background: #181F28; }
[data-theme="dark"] .tk-more-card strong { color: #E2E4E9; }
[data-theme="dark"] .tk-more-card span:last-child { color: #A6B0BF; }
[data-theme="dark"] .tk-fav:hover, [data-theme="dark"] .tk-more-card:hover { border-color: #32415D; box-shadow: var(--shadow-sm); }
[data-theme="dark"] .tk-fav-text span { color: #A7B1BE; }
[data-theme="dark"] .tk-star.is-on { color: #DEB673; }
[data-theme="dark"] .page-kf { --kf-border: #12181E; --kf-line: #0D1218; --kf-txt: #E2E5E9; --kf-muted: #8590A2; --kf-soft: #78879C; --kf-blue: #417EF1; --kf-blue-dk: #2468EE; }
[data-theme="dark"] .page-kf .topbar { background: #0D1218; border-bottom: 1px solid var(--kf-line); }
[data-theme="dark"] .kf-topbar-toggle { color: #A6B1BF; }
[data-theme="dark"] .kf-topbar-toggle:hover { background: #0D1218; color: var(--kf-txt); }
[data-theme="dark"] .kf-app { background: #181F28; }
[data-theme="dark"] .kf-muted { color: var(--kf-muted); }
[data-theme="dark"] .kf-storage { background: #0C1E31; border: 1px solid rgba(255,255,255,.08); }
[data-theme="dark"] .kf-storage-head { color: #fff; }
[data-theme="dark"] .kf-storage-head .kf-i { color: #E2E8F0; }
[data-theme="dark"] .kf-storage-line { color: #93A4BC; }
[data-theme="dark"] .kf-storage-bar { background: #1B3450; }
[data-theme="dark"] .kf-storage-bar > span { background: #1F6BFF; }
[data-theme="dark"] .kf-storage-btn { background: #17304C; color: #E8EFF9; }
[data-theme="dark"] .kf-storage-btn:hover { background: #1E3C5E; }
[data-theme="dark"] .kf-side { background: #0D1118; border-right: 1px solid var(--kf-line); }
[data-theme="dark"] .kf-side-title { color: var(--kf-txt); }
[data-theme="dark"] .kf-side-sub { color: #A8B0BD; }
[data-theme="dark"] .kf-new { background: var(--kf-blue); color: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.65); }
[data-theme="dark"] .kf-new:hover { background: var(--kf-blue-dk); }
[data-theme="dark"] .kf-nav-item { color: #E2E5E9; }
[data-theme="dark"] .kf-nav-item:hover { background: #0D1118; }
[data-theme="dark"] .kf-nav-item.is-active { background: #0D1118; color: #E2E5E9; }
[data-theme="dark"] .kf-nav-item.is-active .kf-nav-ico { color: #DE738A; }
[data-theme="dark"] .kf-nav-ico { color: #E2E5E9; }
[data-theme="dark"] .kf-n { color: #A6B0BF; }
[data-theme="dark"] .kf-n.is-pill { background: #12171E; color: #A5AFC0; }
[data-theme="dark"] .kf-sec-head h3 { color: var(--kf-txt); }
[data-theme="dark"] .kf-sec-add { color: #A1B0C4; background: #0D1218; }
[data-theme="dark"] .kf-sec-add:hover { background: #12171E; }
[data-theme="dark"] .kf-tree-row:hover { background: #0D1118; }
[data-theme="dark"] .kf-tree-row.is-active { background: #0D1118; }
[data-theme="dark"] .kf-tree-toggle { color: #A1AEC4; }
[data-theme="dark"] .kf-tree-link { color: inherit; }
[data-theme="dark"] .kf-tree-root .kf-tree-name { color: var(--kf-txt); }
[data-theme="dark"] .kf-tree-child .kf-tree-ico { color: #A7B2BE; }
[data-theme="dark"] .kf-tree-child .kf-tree-name { color: #A5B0C0; }
[data-theme="dark"] .kf-taglist-item { color: #A0B0C5; }
[data-theme="dark"] .kf-taglist-item:hover { background: #0D1118; }
[data-theme="dark"] .kf-taglist-more { color: var(--kf-blue); }
[data-theme="dark"] .kf-taglist-more:hover { background: #0D1118; }
[data-theme="dark"] .kf-dot { background: #A9B5C6; }
[data-theme="dark"] .kf-dot.tone-blue { background: #2563EB; }
[data-theme="dark"] .kf-dot.tone-green { background: #16A34A; }
[data-theme="dark"] .kf-dot.tone-purple { background: #7C3AED; }
[data-theme="dark"] .kf-dot.tone-orange { background: #F59E0B; }
[data-theme="dark"] .kf-dot.tone-red { background: #EF4444; }
[data-theme="dark"] .kf-dot.tone-amber { background: #F59E0B; }
[data-theme="dark"] .kf-dot.tone-teal { background: #14B8A6; }
[data-theme="dark"] .kf-dot.tone-pink { background: #EC4899; }
[data-theme="dark"] .kf-dot.tone-slate { background: #A9B5C6; }
[data-theme="dark"] .kf-main { background: #181F28; }
[data-theme="dark"] .kf-head-ico { background: var(--kf-blue); color: #fff; box-shadow: 0 4px 11px rgba(0,0,0,0.858); }
[data-theme="dark"] .kf-head-ico .kf-i { color: #fff; }
[data-theme="dark"] .kf-head-text h1 { color: var(--kf-txt); }
[data-theme="dark"] .kf-head-text p { color: #A9B1BC; }
[data-theme="dark"] .kf-viewtoggle { border: 1px solid var(--kf-border); background: #181F28; }
[data-theme="dark"] .kf-vt { color: #A7B1BE; }
[data-theme="dark"] .kf-vt:hover { background: #0D1218; color: var(--kf-txt); }
[data-theme="dark"] .kf-vt.is-active { background: var(--kf-blue); color: #fff; }
[data-theme="dark"] .kf-iconbtn { color: #A7B1BE; }
[data-theme="dark"] .kf-iconbtn:hover { background: #0D1218; color: var(--kf-txt); }
[data-theme="dark"] .kf-iconbtn-lg { border: 1px solid var(--kf-border); }
[data-theme="dark"] .kf-iconbtn-sq { background: #0D1118; color: #E2E5E9; }
[data-theme="dark"] .kf-iconbtn-mini { color: var(--kf-blue); }
[data-theme="dark"] .kf-quick-tile { border: 1px solid var(--kf-border); background: #181F28; }
[data-theme="dark"] .kf-quick-tile:hover { border-color: #32415D; box-shadow: 0 2px 8px rgba(0,0,0,0.28); }
[data-theme="dark"] .kf-quick-ico.tone-blue { background: #12171E; color: #7394DE; }
[data-theme="dark"] .kf-quick-ico.tone-indigo { background: #12141E; color: #7A73EB; }
[data-theme="dark"] .kf-quick-ico.tone-violet { background: #110D18; color: #9B69F1; }
[data-theme="dark"] .kf-quick-ico.tone-teal { background: #121E1B; color: #7AF3E8; }
[data-theme="dark"] .kf-quick-text strong { color: var(--kf-txt); }
[data-theme="dark"] .kf-quick-text span { color: var(--kf-soft); }
[data-theme="dark"] .kf-search { border: 1px solid var(--kf-border); background: #181F28; color: #A5B1C0; }
[data-theme="dark"] .kf-search input { border: 0; background: none; color: var(--kf-txt); outline: none; }
[data-theme="dark"] .kf-search input::placeholder { color: #A5B1C0; }
[data-theme="dark"] .kf-search:focus-within { border-color: #32425D; box-shadow: 0 0 0 3px rgba(0,0,0,0.28); }
[data-theme="dark"] .kf-select { border: 1px solid var(--kf-border); background: #181F28; }
[data-theme="dark"] .kf-select select { border: 0; background: none; outline: none; color: #E2E5E9; }
[data-theme="dark"] .kf-select .kf-i { color: #A7B2BE; }
[data-theme="dark"] .kf-filter-btn { border: 1px solid var(--kf-border); background: #0D1118; color: #9DAEC8; }
[data-theme="dark"] .kf-filter-btn:hover { background: #12171E; }
[data-theme="dark"] .kf-table thead th { color: #A8B1BD; border-bottom: 1px solid var(--kf-line); }
[data-theme="dark"] .kf-table thead th a { color: inherit; }
[data-theme="dark"] .kf-table thead th a:hover { color: var(--kf-txt); }
[data-theme="dark"] .kf-sortcaret { color: #A5B1C0; }
[data-theme="dark"] .kf-sortcaret.is-on { color: var(--kf-blue); }
[data-theme="dark"] .kf-c-act { color: #A6B0BF; }
[data-theme="dark"] .kf-row { border-bottom: 1px solid #2B3B50; }
[data-theme="dark"] .kf-row:hover { background: #0D1218; }
[data-theme="dark"] .kf-row.is-open { background: #0D1218; }
[data-theme="dark"] .kf-row td { color: #A3B1C2; }
[data-theme="dark"] .kf-c-name .kf-name { color: var(--kf-txt); }
[data-theme="dark"] .kf-c-mod, [data-theme="dark"] .kf-c-size { color: #A8B1BD; }
[data-theme="dark"] .kf-c-type, [data-theme="dark"] .kf-c-coll { color: #A5B2C0; }
[data-theme="dark"] .kf-rowmenu { color: #A6B0BF; }
[data-theme="dark"] .kf-check span { border: 1.5px solid #32455D; background: #181F28; }
[data-theme="dark"] .kf-check input:checked + span { background: var(--kf-blue); border-color: var(--kf-blue); }
[data-theme="dark"] .kf-check input:checked + span::after { border-left: 2px solid #333D47; border-bottom: 2px solid #333D47; }
[data-theme="dark"] .kf-check input:focus-visible + span { box-shadow: 0 0 0 3px rgba(0,0,0,0.728); }
[data-theme="dark"] .kf-tag { background: #12171E; color: #7390DE; }
[data-theme="dark"] .kf-empty { color: var(--kf-soft); }
[data-theme="dark"] .kf-empty strong { color: var(--kf-txt); }
[data-theme="dark"] .kf-empty .kf-i { color: #A1B0C4; }
[data-theme="dark"] .kf-foot { border: 1px solid var(--kf-border); background: #181F28; }
[data-theme="dark"] .kf-foot-count { color: #A2B1C3; }
[data-theme="dark"] .kf-foot-count strong { color: inherit; }
[data-theme="dark"] .kf-pg { color: #A0B0C5; background: #181F28; border: 1px solid var(--kf-border); }
[data-theme="dark"] .kf-pg:hover { background: #0D1118; }
[data-theme="dark"] .kf-pg.is-active { background: #0B1A2D; color: #fff; border-color: #0B1A2D; }
[data-theme="dark"] .kf-pg-arrow { border-color: var(--kf-border); color: #A8B1BD; }
[data-theme="dark"] .kf-pg-gap { color: #A5B1C0; }
[data-theme="dark"] .kf-perpage { color: #A2B1C3; }
[data-theme="dark"] .kf-menu { background: #181F28; border: 1px solid var(--kf-border); box-shadow: 0 14px 38px rgba(0,0,0,0.364); }
[data-theme="dark"] .kf-menu-item { color: #E2E5E9; }
[data-theme="dark"] .kf-menu-item:hover { background: #0D1118; color: var(--kf-txt); }
[data-theme="dark"] .kf-menu-item.is-danger { color: #DE7373; }
[data-theme="dark"] .kf-menu-item.is-danger:hover { background: #180D0D; }
[data-theme="dark"] .kf-menu-item.is-on { color: var(--kf-blue); }
[data-theme="dark"] .kf-menu-sep { background: var(--kf-line); }
[data-theme="dark"] .kf-menu-head { color: #A5B1C0; }
[data-theme="dark"] .kf-panel { background: #181F28; border-left: 1px solid var(--kf-line); }
[data-theme="dark"] .kf-panel-title h2 { color: var(--kf-txt); }
[data-theme="dark"] .kf-panel-title p { color: var(--kf-soft); }
[data-theme="dark"] .kf-preview { background: #E2E4E9; }
[data-theme="dark"] .kf-preview-fallback { background: linear-gradient(140deg, #E2E4E9, #6890E3); color: #526B98; }
[data-theme="dark"] .kf-preview-expand { background: rgba(255,255,255,.16); color: #fff; }
[data-theme="dark"] .kf-preview-expand:hover { background: rgba(255,255,255,.28); }
[data-theme="dark"] .kf-btn-primary { background: var(--kf-blue); color: #fff; }
[data-theme="dark"] .kf-btn-primary:hover { background: var(--kf-blue-dk); }
[data-theme="dark"] .kf-btn-ghost { border: 1px solid var(--kf-border); background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .kf-btn-ghost:hover { background: #0D1218; }
[data-theme="dark"] .kf-tabs { border-bottom: 1px solid var(--kf-line); }
[data-theme="dark"] .kf-tab { color: #A8B1BD; }
[data-theme="dark"] .kf-tab:hover { color: var(--kf-txt); }
[data-theme="dark"] .kf-tab.is-active { color: var(--kf-blue); }
[data-theme="dark"] .kf-tab.is-active::after { background: var(--kf-blue); }
[data-theme="dark"] .kf-kv dt { color: #A6B2BF; }
[data-theme="dark"] .kf-kv dd { color: var(--kf-txt); }
[data-theme="dark"] .kf-kv-link a { color: var(--kf-blue); }
[data-theme="dark"] .kf-av { color: #fff; }
[data-theme="dark"] .kf-stack > .kf-av { box-shadow: 0 0 0 2px #000000; }
[data-theme="dark"] .kf-stack-more { color: #A6B0BF; }
[data-theme="dark"] .kf-panel-sec h3, [data-theme="dark"] .kf-sec-h { color: var(--kf-txt); }
[data-theme="dark"] .kf-link-btn { color: var(--kf-blue); }
[data-theme="dark"] .kf-desc { color: #A3B0C2; }
[data-theme="dark"] .kf-tag.tone-blue { background: #12171E; color: #7396DE; }
[data-theme="dark"] .kf-tag.tone-green { background: #121E17; color: #73DE9A; }
[data-theme="dark"] .kf-tag.tone-purple { background: #100D18; color: #9C73DE; }
[data-theme="dark"] .kf-tag.tone-orange { background: #1E1912; color: #DE9273; }
[data-theme="dark"] .kf-tag.tone-red { background: #1E1212; color: #DE7373; }
[data-theme="dark"] .kf-tag.tone-amber { background: #1E1A12; color: #F6AD76; }
[data-theme="dark"] .kf-tag.tone-teal { background: #121E1C; color: #66EBE1; }
[data-theme="dark"] .kf-tag.tone-pink { background: #1E1218; color: #DE739F; }
[data-theme="dark"] .kf-tag.tone-slate { background: #12171E; color: #A3B0C2; }
[data-theme="dark"] .kf-tag-add { color: #A8B1BD; }
[data-theme="dark"] .kf-tag-add:hover { background: #0D1218; color: var(--kf-txt); }
[data-theme="dark"] .kf-related-item { color: #E2E5E9; }
[data-theme="dark"] .kf-related-item:hover { background: #0D1118; }
[data-theme="dark"] .kf-related-kind { color: #A7B1BE; }
[data-theme="dark"] .kf-related-x { color: #A7B1BE; }
[data-theme="dark"] .kf-related-x:hover { background: #180D0D; color: #DE7373; }
[data-theme="dark"] .kf-related-item .kf-i { color: #A8B1BD; }
[data-theme="dark"] .kf-related-add .kf-i { color: var(--kf-blue); }
[data-theme="dark"] .kf-related-add span { color: var(--kf-blue); }
[data-theme="dark"] .kf-feed li { color: #A0ADC5; }
[data-theme="dark"] .kf-feed li strong { color: var(--kf-txt); }
[data-theme="dark"] .kf-feed li span { color: var(--kf-soft); }
[data-theme="dark"] .kf-commentbox textarea { border: 1px solid var(--kf-border); outline: none; }
[data-theme="dark"] .kf-commentbox textarea:focus { border-color: #32425D; box-shadow: 0 0 0 3px rgba(0,0,0,0.28); }
[data-theme="dark"] .kf-dropzone { background: rgba(13,18,24,0.92); }
[data-theme="dark"] .kf-dropzone-inner { border: 2px dashed #2D4776; background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .kf-dropzone-inner .kf-i { color: var(--kf-blue); }
[data-theme="dark"] .kf-dropzone-inner span { color: var(--kf-soft); }
[data-theme="dark"] .kf-row.is-dragover { box-shadow: inset 0 0 0 2px #000000; }
[data-theme="dark"] .kf-tree-row.is-dragover { background: #12171E; box-shadow: inset 0 0 0 2px #000000; }
[data-theme="dark"] .kf-bulkbar { background: #0B1A2D; color: #fff; box-shadow: 0 18px 40px rgba(6,15,30,.32); }
[data-theme="dark"] .kf-bulk-count { color: #A1B0C4; }
[data-theme="dark"] .kf-bulk-count strong { color: #fff; }
[data-theme="dark"] .kf-bulk-btn { color: #597191; }
[data-theme="dark"] .kf-bulk-btn:hover { background: rgba(255,255,255,.12); color: #fff; }
[data-theme="dark"] .kf-bulk-btn.is-danger { color: #985252; }
[data-theme="dark"] .kf-bulk-btn.is-danger:hover { background: rgba(243,115,115,0.18); }
[data-theme="dark"] .kf-panel .kf-tag { background: #12171E; color: #7394DE; }
[data-theme="dark"] .page-kf .btn-add-new { background: var(--kf-blue); }
[data-theme="dark"] .page-kf .btn-add-new:hover { background: var(--kf-blue-dk); }
[data-theme="dark"] .tl-ic { fill: none; stroke: currentColor; }
[data-theme="dark"] .tl-ic.is-solid { fill: currentColor; stroke: none; }
[data-theme="dark"] .tl-ic circle[fill="currentColor"] { stroke: none; }
[data-theme="dark"] .tk-status-next { border: 0; color: inherit; }
[data-theme="dark"] .tk-status-group .tk-pill-status.tone-blue + .tk-status-next { background: #12171E; color: #7398DE; }
[data-theme="dark"] .tk-status-group .tk-pill-status.tone-grey + .tk-status-next { background: #12191E; color: #E2E5E9; }
[data-theme="dark"] .tk-status-group .tk-pill-status.tone-amber + .tk-status-next { background: #564729; color: #DEA173; }
[data-theme="dark"] .tk-status-group .tk-pill-status.tone-green + .tk-status-next { background: #295640; color: #5EF5BC; }
[data-theme="dark"] .tk-status-done { border: 1px solid #32425D; background: #181F28; color: #A6B0BF; }
[data-theme="dark"] .tk-status-done:hover { border-color: #17E585; color: #73DEAC; }
[data-theme="dark"] .tk-empty-val { border: 0; background: none; color: #A7B1BE; }
[data-theme="dark"] .tk-empty-val:hover { color: #6D94F4; }
[data-theme="dark"] .tk-daterange { border: 1px solid transparent; background: none; color: #E2E4E9; }
[data-theme="dark"] .tk-daterange:hover { border-color: #32425D; background: #0D1218; }
[data-theme="dark"] .tk-dr-part { color: #A7B1BE; }
[data-theme="dark"] .tk-dr-part.is-set { color: #E2E4E9; }
[data-theme="dark"] .tk-dr-repeat { background: #16121E; color: #9C73DE; }
[data-theme="dark"] .tk-act-link { border: 0; background: none; color: #A4B0C1; }
[data-theme="dark"] .tk-act-link:hover { background: #0D1218; color: #E2E4E9; }
[data-theme="dark"] .tk-act-link .tk-i { color: #A6B0BF; }
[data-theme="dark"] .tk-rail-title { color: #E2E4E9; }
[data-theme="dark"] .tk-rail-bell { color: #A4B0C1; }
[data-theme="dark"] .tk-composer-full { border: 1px solid #32425D; }
[data-theme="dark"] .tk-composer-full input[name=body] { border: 0; outline: 0; color: #E2E4E9; background: none; }
[data-theme="dark"] .tk-composer-bar { border-top: 1px solid #2B3D50; }
[data-theme="dark"] .tk-composer-bar .tk-composer-btn { color: #A4B0C1; }
[data-theme="dark"] .tk-composer-bar .tk-composer-btn:hover { background: #0D1218; color: #E2E4E9; }
[data-theme="dark"] .tk-composer-sep { background: #12171E; }
[data-theme="dark"] .tk-dates-field { border: 1.5px solid #32425D; color: #A7B1BE; }
[data-theme="dark"] .tk-dates-field.is-active { border-color: #F29250; color: #E2E4E9; }
[data-theme="dark"] .tk-dates-field input { border: 0; outline: 0; background: none; color: #E2E4E9; }
[data-theme="dark"] .tk-dates-presets { border-right: 1px solid #2B3D50; }
[data-theme="dark"] .tk-dates-preset { border: 0; background: none; color: #E2E5E9; }
[data-theme="dark"] .tk-dates-preset:hover { background: #0D1218; }
[data-theme="dark"] .tk-dates-preset b { color: #A7B1BE; }
[data-theme="dark"] .tk-dates-recurring { border-top: 1px solid #2B3D50; }
[data-theme="dark"] .tk-dates-today { border: 0; background: none; color: #A6B0BF; }
[data-theme="dark"] .tk-dates-today:hover { color: #6D94F4; }
[data-theme="dark"] .tk-dates-grid .tk-dp-cell.is-out { color: #A4B1C1; }
[data-theme="dark"] .tk-dp-cell.is-start, [data-theme="dark"] .tk-dp-cell.is-due { background: #2F6BFF; color: #fff; }
[data-theme="dark"] .tk-dp-cell.is-between { background: #0D1118; color: #7398DE; }
[data-theme="dark"] .tk-dates-foot { border-top: 1px solid #2B3D50; }
[data-theme="dark"] .tk-btn-primary-sm { border: 0; background: #2F6BFF; color: #fff; }
[data-theme="dark"] .tk-btn-primary-sm:hover { background: #1B5AF0; }
[data-theme="dark"] .page-reports { --rp-line: #12171E; --rp-ink: #E2E4E9; --rp-muted: #8997B0; }
[data-theme="dark"] .page-reports .page-content { background: #0D1218; }
[data-theme="dark"] .page-reports .page-icon { background: linear-gradient(145deg, #0D0F18 0%, #0D0D18 55%, #160D18 100%); box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-reports .page-title { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .page-subtitle { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-range { border: 1px solid var(--rp-line); background: #181F28; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-range:hover { border-color: #32435D; }
[data-theme="dark"] .page-reports .rp-range-cal { color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-range-caret { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-range-menu .dropdown-item.is-on { background: #0D1118; color: #738FDE; }
[data-theme="dark"] .page-reports .rp-range-custom { border-top: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-range-form label { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-range-form input { border: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-compare { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-compare select { border: 0; background: none; outline: none; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-compare-caret { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-custom-btn { background: linear-gradient(135deg, #6D35F6 0%, #4A37FD 100%); color: #fff; box-shadow: 0 5px 12px rgba(0,0,0,0.624); }
[data-theme="dark"] .page-reports .rp-tabs { border-bottom: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-tab { border-bottom: 2px solid transparent; color: #A3AEC2; }
[data-theme="dark"] .page-reports .rp-tab .icon { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-tab:hover { color: var(--rp-ink); background: #0D1118; }
[data-theme="dark"] .page-reports .rp-tab.is-active { background: #0D1118; border-bottom-color: #6C9FF4; color: #738FDE; }
[data-theme="dark"] .page-reports .rp-tab.is-active .icon { color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-card, [data-theme="dark"] .page-reports .rp-tile { border: 1px solid var(--rp-line); background: #181F28; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-reports .rp-card-head h2 { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-viewall { color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-select { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-select select { border: 0; background: none; outline: none; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-select-caret { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-tile-icon { color: #fff; }
[data-theme="dark"] .page-reports .rp-tile-icon.tone-green { background: linear-gradient(140deg, #14C079 0%, #02A365 100%); box-shadow: 0 6px 13px rgba(0,0,0,0.676); }
[data-theme="dark"] .page-reports .rp-tile-icon.tone-blue { background: linear-gradient(140deg, #3B8BFE 0%, #1E6FFD 100%); box-shadow: 0 6px 13px rgba(0,0,0,0.676); }
[data-theme="dark"] .page-reports .rp-tile-icon.tone-purple { background: linear-gradient(140deg, #A96CFD 0%, #8B4EFA 100%); box-shadow: 0 6px 13px rgba(0,0,0,0.676); }
[data-theme="dark"] .page-reports .rp-tile-icon.tone-amber { background: linear-gradient(140deg, #FDA842 0%, #FB8125 100%); box-shadow: 0 6px 13px rgba(0,0,0,0.676); }
[data-theme="dark"] .page-reports .rp-tile-icon.tone-indigo { background: linear-gradient(140deg, #5A66FE 0%, #3B44F8 100%); box-shadow: 0 6px 13px rgba(0,0,0,0.676); }
[data-theme="dark"] .page-reports .rp-tile-label { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-tile-value { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-tile-sub { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-delta.is-up { color: #71F3C7; }
[data-theme="dark"] .page-reports .rp-delta.is-down { color: #F37373; }
[data-theme="dark"] .page-reports .rp-delta.is-flat { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-cr-title { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ring-label { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-metrics { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-metric { border: 0; background: none; color: #A3AEC2; }
[data-theme="dark"] .page-reports .rp-metric.is-active { background: #1D4ED8; color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.78); }
[data-theme="dark"] .page-reports .rp-legend-item { color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-dot { background: #2A3B55; }
[data-theme="dark"] .page-reports .rp-dot.is-cur, [data-theme="dark"] .page-reports .rp-dot.is-blue { background: #2F7DFE; }
[data-theme="dark"] .page-reports .rp-dot.is-prev { background: #2A3B55; }
[data-theme="dark"] .page-reports .rp-dot.is-green { background: #10B981; }
[data-theme="dark"] .page-reports .rp-axis { fill: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-nodata { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-tip { border: 1px solid var(--rp-line); background: #181F28; box-shadow: 0 8px 20px rgba(0,0,0,0.338); }
[data-theme="dark"] .page-reports .rp-tip-day { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-tip-row b { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-tip-row em { color: #73DEBA; }
[data-theme="dark"] .page-reports .rp-tip-row em.is-down { color: #F37373; }
[data-theme="dark"] .page-reports .rp-tip-row.is-muted { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-charttip .rp-tip-row { color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-charttip .rp-tip-row b { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-funnel-step { fill: #fff; }
[data-theme="dark"] .page-reports .rp-fdot.tone-blue { background: #2079FE; }
[data-theme="dark"] .page-reports .rp-fdot.tone-teal { background: #14B3B0; }
[data-theme="dark"] .page-reports .rp-fdot.tone-green { background: #10B981; }
[data-theme="dark"] .page-reports .rp-fdot.tone-purple { background: #3F2D76; }
[data-theme="dark"] .page-reports .rp-fnum { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-flabel { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-fpct { background: #0D1218; color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-rank-no { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-rank-bar { background: #0D1218; }
[data-theme="dark"] .page-reports .rp-rank-bar i.tone-teal { background: #16B3A6; }
[data-theme="dark"] .page-reports .rp-rank-bar i.tone-blue { background: #1F79FD; }
[data-theme="dark"] .page-reports .rp-rank-bar i.tone-orange { background: #F98B2F; }
[data-theme="dark"] .page-reports .rp-rank-bar i.tone-purple { background: #9B5BFB; }
[data-theme="dark"] .page-reports .rp-rank-bar i.tone-pink { background: #EC4899; }
[data-theme="dark"] .page-reports .rp-rank-val { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-rank-empty { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-map .wm-dots circle { fill: #526F98; }
[data-theme="dark"] .page-reports .wm-marker:hover, [data-theme="dark"] .page-reports .wm-marker:focus-visible { outline: none; }
[data-theme="dark"] .page-reports .wm-marker:focus-visible circle:last-child { stroke: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-maptip { background: #0F1F3D; color: #fff; }
[data-theme="dark"] .page-reports .rp-geo-flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-reports .rp-geo-other { background: #0D1118; color: #A5AFC0; box-shadow: none; }
[data-theme="dark"] .page-reports .rp-geo-name { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-geo-val { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-geo-share { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-donut-mid strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-donut-mid span { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-mdot.tone-blue { background: #1F79FE; }
[data-theme="dark"] .page-reports .rp-mdot.tone-green { background: #10B981; }
[data-theme="dark"] .page-reports .rp-mdot.tone-orange { background: #F98B2F; }
[data-theme="dark"] .page-reports .rp-mdot.tone-purple { background: #9B5BFB; }
[data-theme="dark"] .page-reports .rp-mdot.tone-teal { background: #14B3B0; }
[data-theme="dark"] .page-reports .rp-mdot.tone-grey { background: #384D6C; }
[data-theme="dark"] .page-reports .rp-mlabel { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-mshare { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-table thead th { border-bottom: 1px solid var(--rp-line); background: #0D1118; color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-table tbody td { border-bottom: 1px solid #2B3950; color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-td-date { color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-td-amt { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-td-partner { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-td-deal a { color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-td-empty { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-pill.is-green { background: #121E19; color: #60F9B1; }
[data-theme="dark"] .page-reports .rp-ai { background: linear-gradient(135deg, #7C4DFB 0%, #5B3BFA 100%); color: #fff; }
[data-theme="dark"] .page-reports .rp-insight-list a:hover { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-insight-icon.tone-green { background: #121E17; color: #82F4BC; }
[data-theme="dark"] .page-reports .rp-insight-icon.tone-blue { background: #12171E; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-insight-icon.tone-purple { background: #16121E; color: #9B7AF5; }
[data-theme="dark"] .page-reports .rp-insight-icon.tone-indigo { background: #12141E; color: #7A85F5; }
[data-theme="dark"] .page-reports .rp-insight-icon.tone-red { background: #1E1212; color: #DE738A; }
[data-theme="dark"] .page-reports .rp-insight-text strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-insight-text em { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-insight-go { color: #9EADC7; }
[data-theme="dark"] .page-reports .rp-mini-label { color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-mini-value { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-mini-sub { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-panel-sub { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-btn-soft { border: 1px solid var(--rp-line); background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-btn-soft:hover { border-color: #32435D; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-btn-soft .icon { color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-td-rank { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-table-lg tr.is-focus { background: #0D1218; }
[data-theme="dark"] .page-reports .rp-split-label { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-split-val { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-split-pct { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-saved li.is-on { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-saved-main:hover { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-saved-icon { background: #0D1118; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-saved-text strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-saved-text em { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-saved-empty { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-field > span:first-child { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-input { border: 1px solid var(--rp-line); background: #181F28; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-input:focus { outline: none; border-color: #6C9FF4; box-shadow: 0 0 0 3px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-reports .rp-check { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-check span { border: 1.5px solid #32435D; background: #181F28; }
[data-theme="dark"] .page-reports .rp-check input:checked + span { background: #2F7DFE; border-color: #2F7DFE; }
[data-theme="dark"] .page-reports .rp-check input:checked + span::after { border: solid #333D47; }
[data-theme="dark"] .page-reports .rp-field-note { color: #A5AFC0; }
[data-theme="dark"] .chart-legend .item { color: #96ABCF; }
[data-theme="dark"] .chart-card .chart-tooltip { box-shadow: 0 10px 30px rgba(0,0,0,0.364); border: 1px solid #32445D; }
[data-theme="dark"] .profile-avatar .avatar { box-shadow: 0 0 0 4px var(--color-surface), 0 0 0 5px var(--color-border); }
[data-theme="dark"] .profile-online { background: var(--color-success); border: 3px solid var(--color-surface); }
[data-theme="dark"] .profile-name { color: var(--color-text); }
[data-theme="dark"] .card-body.bordered-top { border-top: 1px solid var(--color-divider); }
[data-theme="dark"] a.stat-line { color: inherit; }
[data-theme="dark"] a.stat-line:hover { background: var(--color-surface-hover); }
[data-theme="dark"] .cmp-table.is-partners td.c-rel .cmp-sub { color: #9FAAC6; }
[data-theme="dark"] .aa-archived-bar { border: 1px solid #5D4F32; background: #18140D; color: #F1C860; }
[data-theme="dark"] .aa-archived-bar .icon { color: #DEB973; }
[data-theme="dark"] .page-kd { --kd-ink: #E2E5E9; --kd-text: #E2E5E9; --kd-soft: #647791; --kd-muted: #76859B; --kd-line: #12171E; }
[data-theme="dark"] .kd-app { background: #181F28; }
[data-theme="dark"] .kd-muted { color: var(--kd-muted); }
[data-theme="dark"] .kd-side { background: #0D1118; }
[data-theme="dark"] .kd-back { color: var(--kd-ink); }
[data-theme="dark"] .kd-back:hover { background: #12171E; }
[data-theme="dark"] .kd-side-title { color: var(--kd-ink); }
[data-theme="dark"] .kd-side-pin { color: #A8B1BF; }
[data-theme="dark"] .kd-side-pin:hover { background: #12171E; color: var(--kd-ink); }
[data-theme="dark"] .kd-card { background: #181F28; }
[data-theme="dark"] .kd-files-title { color: var(--kd-ink); }
[data-theme="dark"] .kd-files-title span { color: var(--kf-blue); }
[data-theme="dark"] .kd-files-add { background: #0D1118; color: #A5B0C0; }
[data-theme="dark"] .kd-files-add:hover { background: #12171E; color: var(--kd-ink); }
[data-theme="dark"] .kd-search { border: 1px solid var(--kd-line); color: #A7B0BE; background: #181F28; }
[data-theme="dark"] .kd-search input { border: 0; outline: 0; background: transparent; color: var(--kd-ink); }
[data-theme="dark"] .kd-search input::placeholder { color: #A7B0BE; }
[data-theme="dark"] .kd-search:focus-within { border-color: #2D4676; box-shadow: 0 0 0 3px rgba(0,0,0,0.28); }
[data-theme="dark"] .kd-tree-row:hover { background: #0D1218; }
[data-theme="dark"] .kd-tree-row.is-active { background: #0D1118; }
[data-theme="dark"] .kd-tree-row.is-active .kd-folder { color: var(--kf-blue); }
[data-theme="dark"] .kd-tree-caret { color: #A9B1BC; }
[data-theme="dark"] .kd-tree-caret.is-leaf { color: #ACB6C3; }
[data-theme="dark"] .kd-tree-link { color: #E2E5E9; }
[data-theme="dark"] .kd-folder { color: #A5B0C0; }
[data-theme="dark"] .kd-tree-empty { color: var(--kd-muted); }
[data-theme="dark"] .kd-recent-head h3 { color: var(--kd-ink); }
[data-theme="dark"] .kd-recent-head a { color: var(--kf-blue); }
[data-theme="dark"] .kd-recent-item:hover { background: #0D1218; }
[data-theme="dark"] .kd-recent-text strong { color: var(--kd-ink); }
[data-theme="dark"] .kd-recent-text span { color: var(--kd-muted); }
[data-theme="dark"] .kd-crumbs { color: #A3B0C2; }
[data-theme="dark"] .kd-crumbs a { color: #A3B0C2; }
[data-theme="dark"] .kd-crumbs a:hover { color: var(--kf-blue); }
[data-theme="dark"] .kd-crumb-back { color: #E2E5E9; }
[data-theme="dark"] .kd-crumb-back:hover { background: #0D1218; }
[data-theme="dark"] .kd-crumb-sep { color: #A9B0BC; }
[data-theme="dark"] .kd-crumbs strong { color: var(--kd-ink); }
[data-theme="dark"] .kd-notice { background: #180E0D; color: #DE7A73; }
[data-theme="dark"] .kd-title { color: var(--kd-ink); outline: 0; }
[data-theme="dark"] .kd-title[contenteditable]:hover { box-shadow: 0 0 0 4px #000000; background: #0D1218; }
[data-theme="dark"] .kd-title[contenteditable]:focus { box-shadow: 0 0 0 4px #000000; background: #0D1118; }
[data-theme="dark"] .kd-star { color: #DEB573; }
[data-theme="dark"] .kd-star.is-on .kf-i { fill: #DEB573; }
[data-theme="dark"] .kd-lead { color: var(--kd-soft); }
[data-theme="dark"] .kd-tag { background: #0D1118; color: #7399DE; }
[data-theme="dark"] .kd-tag:hover { background: #12171E; }
[data-theme="dark"] .kd-tag-add { background: #0D1118; color: #E2E5E9; }
[data-theme="dark"] .kd-tag-add:hover { background: #12181E; }
[data-theme="dark"] .kd-collab > .kf-av { box-shadow: 0 0 0 2px #000000; }
[data-theme="dark"] .kd-collab-add { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .kd-collab-add:hover { background: #12171E; }
[data-theme="dark"] .kd-byline { color: var(--kd-soft); }
[data-theme="dark"] .kd-byline-name { color: #E2E5E9; }
[data-theme="dark"] .kd-byline-sep { background: #2D3D52; }
[data-theme="dark"] .kd-save-state { color: var(--kd-muted); }
[data-theme="dark"] .kd-save-state.is-busy { color: #A7B1BE; }
[data-theme="dark"] .kd-save-state.is-ok { color: #73EBC4; }
[data-theme="dark"] .kd-save-state.is-error { color: #DE7373; }
[data-theme="dark"] .kd-toolbar { border: 1px solid var(--kd-line); background: #181F28; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .kd-tb-select { color: #E2E5E9; }
[data-theme="dark"] .kd-tb-select select { border: 0; outline: 0; background: transparent; color: inherit; }
[data-theme="dark"] .kd-tb-select .kf-i { color: #A7B1BE; }
[data-theme="dark"] .kd-tb-select:hover { background: #0D1218; }
[data-theme="dark"] .kd-tb-sep { background: #12171E; }
[data-theme="dark"] .kd-tb { color: #E2E5E9; }
[data-theme="dark"] .kd-tb:hover { background: #0D1218; color: var(--kd-ink); }
[data-theme="dark"] .kd-tb.is-on { background: #0D1118; color: var(--kf-blue); }
[data-theme="dark"] .kd-tb-ai { color: #9B69F1; }
[data-theme="dark"] .kd-tb-ai:hover { background: #110D18; color: #9C73DE; }
[data-theme="dark"] .kd-body { outline: 0; color: var(--kd-text); }
[data-theme="dark"] .kd-body.is-blank > p:first-child:last-child::before { color: var(--color-text-faint); }
[data-theme="dark"] .kf-doc h1 { color: var(--kd-ink); }
[data-theme="dark"] .kf-doc h2 { color: var(--kd-ink); }
[data-theme="dark"] .kf-doc h3 { color: var(--kd-ink); }
[data-theme="dark"] .kf-doc a { color: var(--kf-blue); }
[data-theme="dark"] .kf-doc blockquote { border-left: 3px solid #32405D; background: #0D1118; color: #E2E5E9; }
[data-theme="dark"] .kf-doc pre { background: #E2E5E9; color: #597091; }
[data-theme="dark"] .kf-doc code { background: #0D1218; color: #DE7A73; }
[data-theme="dark"] .kf-doc hr { border: 0; border-top: 1px solid var(--kd-line); }
[data-theme="dark"] .kf-doc .kd-checklist > li::before { border: 1.5px solid #AAB5C6; background: #181F28; }
[data-theme="dark"] .kf-doc .kd-checklist > li[data-checked="1"] { color: #A7B1BE; }
[data-theme="dark"] .kf-doc .kd-checklist > li[data-checked="1"]::before { background: var(--kf-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.2 2.6 2.6L12 5.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; border-color: var(--kf-blue); }
[data-theme="dark"] .kf-doc-banner { border: 1px solid #32425D; background: linear-gradient(100deg, #0D1118 0%, #0D1018 55%, #0D1118 100%); }
[data-theme="dark"] .kf-doc-banner-brand { color: #7399DE; }
[data-theme="dark"] .kf-doc .kf-doc-banner h2 { color: var(--kd-ink); }
[data-theme="dark"] .kf-doc-banner-sub { color: var(--kd-soft); }
[data-theme="dark"] .kf-doc-badge { background: #3E6FD1; color: #fff; }
[data-theme="dark"] .kf-doc-banner-kpi { color: #A6AFBF; }
[data-theme="dark"] .kf-doc-callout { border: 1px solid #32435D; background: #0D1118; }
[data-theme="dark"] .kf-doc-callout strong { color: var(--kd-ink); }
[data-theme="dark"] .kf-doc-callout p, [data-theme="dark"] .kf-doc-callout span { color: var(--kd-text); }
[data-theme="dark"] .kf-doc-table, [data-theme="dark"] .kf-doc table { border: 1px solid #34445B; }
[data-theme="dark"] .kf-doc table th { background: #0D1118; color: #E2E5E9; border-bottom: 1px solid #34445B; }
[data-theme="dark"] .kf-doc table td { border-bottom: 1px solid #32455D; color: #E2E5E9; }
[data-theme="dark"] .kf-doc table th + th, [data-theme="dark"] .kf-doc table td + td { border-left: 1px solid #32455D; }
[data-theme="dark"] .kf-doc .kf-up { color: #73EBC4; }
[data-theme="dark"] .kf-doc .kf-down { color: #DE7A73; }
[data-theme="dark"] .kd-rail { border-left: 1px solid #32455D; background: #181F28; }
[data-theme="dark"] .kd-rbtn { border: 1px solid #32445D; background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .kd-rbtn:hover { background: #0D1218; border-color: #32445D; }
[data-theme="dark"] .kd-tabs { border-bottom: 1px solid #32455D; }
[data-theme="dark"] .kd-tab { color: #E2E5E9; }
[data-theme="dark"] .kd-tab:hover { color: var(--kd-ink); }
[data-theme="dark"] .kd-tab.is-active { color: var(--kf-blue); }
[data-theme="dark"] .kd-tab.is-active::after { background: var(--kf-blue); }
[data-theme="dark"] .kd-tab-n { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .kd-kv dt { color: var(--kd-muted); }
[data-theme="dark"] .kd-kv dd { color: #E2E5E9; }
[data-theme="dark"] .kd-link { color: var(--kf-blue); }
[data-theme="dark"] .kd-sec-head h3 { color: var(--kd-ink); }
[data-theme="dark"] .kd-desc { color: #E2E5E9; }
[data-theme="dark"] .kd-round { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .kd-round:hover { background: #12171E; }
[data-theme="dark"] .kd-chip { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .kd-chip.is-blue { background: #0D1118; color: #7399DE; }
[data-theme="dark"] .kd-chip-add { color: #E2E5E9; }
[data-theme="dark"] .kd-chip-add:hover { background: #0D1218; }
[data-theme="dark"] .kd-related a { color: #E2E5E9; }
[data-theme="dark"] .kd-related a:hover { background: #0D1218; }
[data-theme="dark"] .kd-related-type { color: #A6B0BF; }
[data-theme="dark"] .kd-add-related { color: var(--kf-blue); }
[data-theme="dark"] .kd-add-related .kd-round { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .kd-rel-ico { color: #fff; }
[data-theme="dark"] .kd-rel-ico.tone-green { background: #16A765; }
[data-theme="dark"] .kd-rel-ico.tone-blue { background: #1F6BF0; }
[data-theme="dark"] .kd-rel-ico.tone-pink { background: #C63AC6; }
[data-theme="dark"] .kd-rel-ico.tone-red { background: #EF4444; }
[data-theme="dark"] .kd-rel-ico.tone-purple { background: #7C3AED; }
[data-theme="dark"] .kd-rel-ico.tone-slate { background: #677A99; }
[data-theme="dark"] .kd-rel-ico.is-soft { background: #0D1118; color: #739ADE; }
[data-theme="dark"] .kd-actions button { color: #E2E5E9; }
[data-theme="dark"] .kd-actions button:hover { background: #0D1218; }
[data-theme="dark"] .kd-actions .kf-i { color: #E2E5E9; }
[data-theme="dark"] .kd-actions .is-danger, [data-theme="dark"] .kd-actions .is-danger .kf-i { color: #EB7578; }
[data-theme="dark"] .kd-comment-form { border: 1px solid var(--kd-line); background: #181F28; }
[data-theme="dark"] .kd-comment-form textarea { border: 0; outline: 0; color: var(--kd-ink); background: transparent; }
[data-theme="dark"] .kd-comment-form:focus-within { border-color: #2D4676; box-shadow: 0 0 0 3px rgba(0,0,0,0.28); }
[data-theme="dark"] .kd-send { background: var(--kf-blue); color: #fff; }
[data-theme="dark"] .kd-send:hover { background: var(--kf-blue-dk); }
[data-theme="dark"] .kd-empty { color: var(--kd-muted); }
[data-theme="dark"] .kd-thread { border: 1px solid #32455D; }
[data-theme="dark"] .kd-comment.is-reply { border-left: 2px solid #32455D; }
[data-theme="dark"] .kd-comment-meta strong { color: var(--kd-ink); }
[data-theme="dark"] .kd-comment-meta time { color: var(--kd-muted); }
[data-theme="dark"] .kd-comment p { color: #E2E5E9; }
[data-theme="dark"] .kd-anchor { border-left: 3px solid #F5D07A; background: #18150D; color: #F1C860; }
[data-theme="dark"] .kf-link-btn.is-muted { color: var(--kd-muted); }
[data-theme="dark"] .kd-version::before { background: #12171E; }
[data-theme="dark"] .kd-version-dot { border: 2px solid #3E4F66; background: #181F28; }
[data-theme="dark"] .kd-version.is-current .kd-version-dot { border-color: var(--kf-blue); background: var(--kf-blue); }
[data-theme="dark"] .kd-version strong { color: var(--kd-ink); }
[data-theme="dark"] .kd-version span { color: var(--kd-muted); }
[data-theme="dark"] .kd-pill { background: #0D1118; color: #7399DE; }
[data-theme="dark"] .kf-stat { border: 1px solid var(--kf-border); background: #181F28; }
[data-theme="dark"] .kf-stat span { color: var(--kf-muted); }
[data-theme="dark"] .kf-stat strong { color: var(--kf-txt); }
[data-theme="dark"] .kf-stat-ic.tone-blue { background: #0D1118; color: #739ADE; }
[data-theme="dark"] .kf-stat-ic.tone-violet { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .kf-stat-ic.tone-amber { background: #1E1A12; color: #DEB973; }
[data-theme="dark"] .kf-stat-ic.tone-slate { background: #12181E; color: #A1B0C4; }
[data-theme="dark"] .kf-stat-ai { border-color: #3E325D; background: linear-gradient(97deg, #110D18, #120D18); }
[data-theme="dark"] .kf-stat-ai:hover { border-color: #40325D; }
[data-theme="dark"] .kf-stat-ai .is-strong { color: #9D73DE; }
[data-theme="dark"] .kf-stat-ai .kf-i { color: #9B69F1; }
[data-theme="dark"] .kf-bcol { border: 1px solid var(--kf-border); background: #0D1118; }
[data-theme="dark"] .kf-bcol-head h3 { color: var(--kf-txt); }
[data-theme="dark"] .kf-bcol-n { color: #A5AFC0; }
[data-theme="dark"] .kf-bcol-head.tone-blue { background: #0D1118; }
[data-theme="dark"] .kf-bcol-head.tone-purple { background: #110D18; }
[data-theme="dark"] .kf-bcol-head.tone-red { background: #180D0D; }
[data-theme="dark"] .kf-bcol-head.tone-green { background: #121E18; }
[data-theme="dark"] .kf-bcol-head.tone-amber { background: #1E1A12; }
[data-theme="dark"] .kf-bcol-head.tone-slate { background: #0D1118; }
[data-theme="dark"] .kf-bcol-head.tone-orange { background: #1E1812; }
[data-theme="dark"] .kf-bcol-head.tone-pink { background: #180D13; }
[data-theme="dark"] .kf-badd { border: 1px dashed #32445D; background: #181F28; color: var(--kf-blue); }
[data-theme="dark"] .kf-badd:hover { background: #0D1118; border-color: #2D4676; }
[data-theme="dark"] .kf-bcol-empty { color: var(--kf-muted); }
[data-theme="dark"] .kf-bcard { border: 1px solid var(--kf-border); background: #181F28; }
[data-theme="dark"] .kf-bcard:hover { border-color: #32425D; box-shadow: 0 4px 12px rgba(0,0,0,0.28); }
[data-theme="dark"] .kf-bcard-title { color: var(--kf-txt); }
[data-theme="dark"] .kf-bcard-title:hover { color: var(--kf-blue); }
[data-theme="dark"] .kf-bcard-url { color: var(--kf-blue); }
[data-theme="dark"] .kf-bcard-desc { color: var(--kf-soft); }
[data-theme="dark"] .kf-bcard-foot { color: var(--kf-muted); }
[data-theme="dark"] .kf-bempty { color: var(--kf-muted); }
[data-theme="dark"] .kf-bempty strong { color: var(--kf-txt); }
[data-theme="dark"] .ka { --ka-line: #2D3D53; --ka-ink: #E2E5E9; --ka-text: #E2E5E9; --ka-muted: #76859B; color: var(--ka-text); }
[data-theme="dark"] .ka-head-ico { background: #0D1118; color: #739ADE; }
[data-theme="dark"] .ka-title { color: var(--ka-ink); }
[data-theme="dark"] .ka-sub { color: #A4B0C1; }
[data-theme="dark"] .ka-x { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .ka-x:hover { background: #12181E; color: var(--ka-ink); }
[data-theme="dark"] .ka-tabs { background: #0D1218; }
[data-theme="dark"] .ka-tab { color: var(--ka-text); }
[data-theme="dark"] .ka-tab + .ka-tab::before { background: #2D3D52; }
[data-theme="dark"] .ka-tab.is-active { background: #181F28; color: #739ADE; box-shadow: inset 0 -2px 0 #000000; }
[data-theme="dark"] .ka-tab:not(.is-active):hover { color: var(--ka-ink); background: #12171E; }
[data-theme="dark"] .ka-h { color: var(--ka-ink); }
[data-theme="dark"] .ka-label { color: var(--ka-text); }
[data-theme="dark"] .ka-label b, [data-theme="dark"] .ka-label > b { color: #EB7578; }
[data-theme="dark"] .ka-input { border: 1px solid var(--ka-line); background: #181F28; color: var(--ka-ink); outline: 0; }
[data-theme="dark"] .ka-input::placeholder, [data-theme="dark"] .ka-input input::placeholder { color: #A6B0BF; }
[data-theme="dark"] .ka-input:focus, [data-theme="dark"] .ka-input:focus-within { border-color: #2D4776; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .ka-input.is-invalid { border-color: #F47167; }
[data-theme="dark"] .ka-input-ic { color: #A7B1BE; }
[data-theme="dark"] .ka-input-ic input { border: 0; outline: 0; background: transparent; color: var(--ka-ink); }
[data-theme="dark"] .ka-meta { color: var(--ka-muted); }
[data-theme="dark"] .ka-err { color: #DE7A73; }
[data-theme="dark"] .ka-cover { background: #0D1218; }
[data-theme="dark"] .ka-cover-label { color: var(--ka-text); }
[data-theme="dark"] .ka-drop { border: 1px solid #32455D; background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .ka-drop strong { color: var(--ka-ink); }
[data-theme="dark"] .ka-drop small { color: var(--ka-muted); }
[data-theme="dark"] .ka-drop:hover, [data-theme="dark"] .ka-drop.is-over { border-color: #2D4776; background: #0D1118; }
[data-theme="dark"] .ka-source { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .ka-source strong { color: var(--ka-ink); }
[data-theme="dark"] .ka-source small { color: var(--ka-muted); }
[data-theme="dark"] .ka-source-ico { color: #E2E5E9; }
[data-theme="dark"] .ka-source.is-on { border-color: #7AA6F5; background: #0D1118; box-shadow: 0 0 0 1px #000000; }
[data-theme="dark"] .ka-source:focus-within { outline: 2px solid #2D4776; }
[data-theme="dark"] .ka-btn-ghost { border: 1px solid #32445D; background: #181F28; color: var(--ka-text); }
[data-theme="dark"] .ka-btn-ghost:hover { background: #0D1218; }
[data-theme="dark"] .ka-btn-primary { background: #1F6BF0; color: #fff; }
[data-theme="dark"] .ka-btn-primary:hover { background: #185AD1; }
[data-theme="dark"] .ka-note { border: 1px solid #325D42; background: #121E17; color: #E2E9E5; }
[data-theme="dark"] .ka-note .icon, [data-theme="dark"] .ka-note svg { color: #61F1A0; }
[data-theme="dark"] .ka-note.is-bad { border-color: #5D3632; background: #180E0D; color: #DE7A73; }
[data-theme="dark"] .ka-note.is-bad svg { color: #DE7A73; }
[data-theme="dark"] .ka-note:not(.is-ok):not(.is-bad) { border-color: #32455D; background: #0D1218; color: #A4B0C1; }
[data-theme="dark"] .ka-filedrop { border: 1.5px dashed #32445D; background: #0D1118; color: #E2E5E9; }
[data-theme="dark"] .ka-filedrop strong { color: var(--ka-ink); }
[data-theme="dark"] .ka-filedrop small { color: var(--ka-muted); }
[data-theme="dark"] .ka-filedrop:hover, [data-theme="dark"] .ka-filedrop.is-over { border-color: #7AA6F5; background: #0D1118; }
[data-theme="dark"] .ka-select { border: 1px solid var(--ka-line); background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .ka-select select { border: 0; outline: 0; background: transparent; color: var(--ka-ink); }
[data-theme="dark"] .ka-select .ka-caret { color: #A5B0C0; }
[data-theme="dark"] .ka-select:focus-within { border-color: #2D4776; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .ka-tagbox { border: 1px solid var(--ka-line); background: #181F28; }
[data-theme="dark"] .ka-tagbox:focus-within { border-color: #2D4776; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .ka-tagsearch { color: #A7B1BE; }
[data-theme="dark"] .ka-tagsearch input { border: 0; outline: 0; background: transparent; color: var(--ka-ink); }
[data-theme="dark"] .ka-tagsearch input::placeholder { color: #A6B0BF; }
[data-theme="dark"] .ka-tagmenu { border: 1px solid #32455D; background: #181F28; box-shadow: 0 12px 30px rgba(0,0,0,0.364); }
[data-theme="dark"] .ka-tagmenu button { color: var(--ka-text); }
[data-theme="dark"] .ka-tagmenu button:hover { background: #0D1118; }
[data-theme="dark"] .ka-chip { background: #0D1118; color: #7399DE; }
[data-theme="dark"] .ka-chip button { color: inherit; }
[data-theme="dark"] .ka-chip button:hover { background: rgba(65,123,229,0.12); }
[data-theme="dark"] .ka-chip.is-rel { background: #0D1218; color: var(--ka-text); }
[data-theme="dark"] .ka-check { color: var(--ka-text); }
[data-theme="dark"] .ka-box { border: 1.5px solid #AAB5C6; background: #181F28; }
[data-theme="dark"] .ka-check input:checked + .ka-box { border-color: #1F6BF0; background: #1F6BF0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.2 2.6 2.6L12 5.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
[data-theme="dark"] .ka-check input:focus-visible + .ka-box { outline: 2px solid #2D4776; }
[data-theme="dark"] .ka-check svg { color: #E2E5E9; }
[data-theme="dark"] .ka-fav { color: var(--ka-text); }
[data-theme="dark"] .ka-fav svg { color: #DEB573; }
[data-theme="dark"] .ka-fav input:checked + svg { fill: #DEB573; }
[data-theme="dark"] .ka-fav input:focus-visible + svg { outline: 2px solid #2D4776; }
[data-theme="dark"] .ka-editor { border: 1px solid var(--ka-line); background: #181F28; }
[data-theme="dark"] .ka-editor:focus-within { border-color: #2D4776; box-shadow: 0 0 0 3px rgba(0,0,0,0.28); }
[data-theme="dark"] .ka-tb { border-bottom: 1px solid #32445D; }
[data-theme="dark"] .ka-tb-select { color: var(--ka-text); }
[data-theme="dark"] .ka-tb-select select { border: 0; outline: 0; background: transparent; color: inherit; }
[data-theme="dark"] .ka-tb-select .kf-i { color: #A5B0C0; }
[data-theme="dark"] .ka-tb-select:hover { background: #0D1218; }
[data-theme="dark"] .ka-tb-sep { background: #12171E; }
[data-theme="dark"] .ka-tbb { color: #E2E5E9; }
[data-theme="dark"] .ka-tbb:hover { background: #0D1218; }
[data-theme="dark"] .ka-editable { outline: 0; color: var(--ka-text); }
[data-theme="dark"] .ka-editable.is-empty:before { color: #A6B0BF; }
[data-theme="dark"] .ka-editor-foot { color: var(--ka-muted); }
[data-theme="dark"] .ka-iconbtn { color: #E2E5E9; }
[data-theme="dark"] .ka-iconbtn:hover { background: #0D1218; }
[data-theme="dark"] .ka-tip { border: 1px solid #32435D; background: #0D1118; }
[data-theme="dark"] .ka-tip-ico { color: #DEB573; }
[data-theme="dark"] .ka-tip-ico .kf-i { fill: #F5D87A; stroke: #DEAC73; }
[data-theme="dark"] .ka-tip strong { color: var(--ka-ink); }
[data-theme="dark"] .ka-tip p { color: var(--ka-text); }
[data-theme="dark"] .ka-more { background: #0D1218; }
[data-theme="dark"] .ka-more summary { color: #E2E5E9; }
[data-theme="dark"] .ka-more summary strong { color: var(--ka-ink); }
[data-theme="dark"] .ka-more summary small { color: var(--ka-muted); }
[data-theme="dark"] .ka-more-caret { color: #E2E5E9; }
[data-theme="dark"] .ka-results button { border: 1px solid #32455D; background: #181F28; color: var(--ka-text); }
[data-theme="dark"] .ka-results button:hover { border-color: #2D4776; color: #739ADE; }
[data-theme="dark"] .ka-muted { color: var(--ka-muted); }
[data-theme="dark"] .ka-card { background: #0D1218; }
[data-theme="dark"] .ka-card .ka-cover { background: transparent; }
[data-theme="dark"] .ka-card-title { color: var(--ka-ink); }
[data-theme="dark"] .ka-set-ico { color: #E2E5E9; }
[data-theme="dark"] .ka-set-text strong { color: var(--ka-ink); }
[data-theme="dark"] .ka-set-text small { color: var(--ka-muted); }
[data-theme="dark"] .ka-toggle input:checked + .toggle-track { background: #1F6BF0; }
[data-theme="dark"] .ka-toggle input:focus-visible + .toggle-track { outline: 2px solid #2D4776; }
[data-theme="dark"] .ka-link { color: #739ADE; }
[data-theme="dark"] .ka-tpl { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .ka-tpl:hover { background: #0D1118; }
[data-theme="dark"] .ka-tpl-ico { background: #12161E; color: #739ADE; }
[data-theme="dark"] .ka-tpl-ico.tone-purple { background: #19121E; color: #D573DE; }
[data-theme="dark"] .ka-tpl-text strong { color: var(--ka-ink); }
[data-theme="dark"] .ka-tpl-text small { color: var(--ka-muted); }
[data-theme="dark"] .ka-foot { border-top: 1px solid #32455D; background: #181F28; }
[data-theme="dark"] .ka-foot-tpl { color: var(--ka-text); }
[data-theme="dark"] .ka-foot-tpl svg { color: #739ADE; }
[data-theme="dark"] .ka-foot-tpl:hover { color: #739ADE; }
[data-theme="dark"] .page-kc { --kc-ink: #E2E5E9; --kc-text: #E2E5E9; --kc-muted: #76859B; --kc-line: #12171E; }
[data-theme="dark"] .page-kc .main, [data-theme="dark"] .page-kc .content { background: #0D1118; }
[data-theme="dark"] .kc-page { background: #0D1118; }
[data-theme="dark"] .kc-crumbs { color: #A3B0C2; }
[data-theme="dark"] .kc-crumbs a { color: #A3B0C2; }
[data-theme="dark"] .kc-crumbs a:hover { color: var(--kf-blue); }
[data-theme="dark"] .kc-crumbs strong { color: var(--kc-ink); }
[data-theme="dark"] .kc-crumbs .kf-i { color: #A8B1BF; }
[data-theme="dark"] .kc-head-ico { background: #0D1118; color: #739ADE; }
[data-theme="dark"] .kc-title-row h1 { color: var(--kc-ink); }
[data-theme="dark"] .kc-star { color: #DEB573; }
[data-theme="dark"] .kc-star[aria-pressed="true"] .kf-i { fill: #DEB573; }
[data-theme="dark"] .kc-head-text p { color: #A4B0C1; }
[data-theme="dark"] .kc-btn { border: 1px solid #32455D; background: #181F28; color: var(--kc-text); }
[data-theme="dark"] .kc-btn:hover { background: #0D1218; }
[data-theme="dark"] .kc-btn-ai { border-color: #382B50; background: #110D18; color: #9C73DE; }
[data-theme="dark"] .kc-btn-ai:hover { background: #16121E; }
[data-theme="dark"] .kc-btn-primary { border-color: #1F6BF0; background: #1F6BF0; color: #fff; }
[data-theme="dark"] .kc-btn-primary:hover { background: #185AD1; }
[data-theme="dark"] .kc-dot { background: #1F6BF0; }
[data-theme="dark"] .kc-side.kf-side { background: transparent; border: 0; }
[data-theme="dark"] .kc-card { background: #181F28; }
[data-theme="dark"] .kc-sec-head h2 { color: var(--kc-ink); }
[data-theme="dark"] .kc-add { color: #E2E5E9; }
[data-theme="dark"] .kc-add:hover { background: #0D1218; }
[data-theme="dark"] .kc-nav-item { color: var(--kc-text); }
[data-theme="dark"] .kc-nav-item em, [data-theme="dark"] .kc-tag em { color: var(--kc-muted); }
[data-theme="dark"] .kc-nav-item .kf-i { color: #E2E5E9; }
[data-theme="dark"] .kc-nav-item:hover { background: #0D1218; }
[data-theme="dark"] .kc-nav-item.is-active { background: #0D1118; color: #739ADE; }
[data-theme="dark"] .kc-nav-item.is-active .kf-i, [data-theme="dark"] .kc-nav-item.is-active em { color: #739ADE; }
[data-theme="dark"] .kc-tag { color: var(--kc-text); }
[data-theme="dark"] .kc-tag:hover { background: #0D1218; }
[data-theme="dark"] .kc-tag.is-active { background: #0D1118; color: #739ADE; }
[data-theme="dark"] .kc-tag-sq { color: #fff; background: #677A99; }
[data-theme="dark"] .kc-tag-sq.tone-blue { background: #2563EB; }
[data-theme="dark"] .kc-tag-sq.tone-green { background: #16A34A; }
[data-theme="dark"] .kc-tag-sq.tone-purple { background: #8B3FE0; }
[data-theme="dark"] .kc-tag-sq.tone-red { background: #EF4444; }
[data-theme="dark"] .kc-tag-sq.tone-orange { background: #F59E0B; }
[data-theme="dark"] .kc-tag-sq.tone-teal { background: #0D9488; }
[data-theme="dark"] .kc-tag-sq.tone-pink { background: #DB2777; }
[data-theme="dark"] .kc-tag-sq.tone-slate { background: #7F8EA3; }
[data-theme="dark"] .kc-more { color: var(--kf-blue); }
[data-theme="dark"] .kc-q { background: #181F28; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .kc-q:hover { box-shadow: 0 0 0 1px #000000, 0 4px 12px rgba(0,0,0,0.28); }
[data-theme="dark"] .kc-q-ico.is-drive { background: transparent; }
[data-theme="dark"] .kc-q-ico.tone-blue { background: #0D1118; color: #739ADE; }
[data-theme="dark"] .kc-q-ico.tone-violet { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .kc-q-ico.tone-pink { background: #180D14; }
[data-theme="dark"] .kc-q-text strong { color: var(--kc-ink); }
[data-theme="dark"] .kc-q-text small { color: var(--kc-muted); }
[data-theme="dark"] .kc-pill { background: #121E17; color: #73EBB0; }
[data-theme="dark"] .kc-search { border: 1px solid var(--kc-line); background: #181F28; color: #A7B1BE; }
[data-theme="dark"] .kc-search input { border: 0; outline: 0; background: transparent; color: var(--kc-ink); }
[data-theme="dark"] .kc-search:focus-within, [data-theme="dark"] .kc-select:focus-within { border-color: #2D4776; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .kc-select { border: 1px solid var(--kc-line); background: #181F28; }
[data-theme="dark"] .kc-select select { border: 0; outline: 0; background: transparent; color: var(--kc-ink); }
[data-theme="dark"] .kc-select .kf-i { color: #E2E5E9; }
[data-theme="dark"] .kc-vt-b { border: 1px solid var(--kc-line); background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .kc-vt-b.is-active { border-color: #32425D; background: #0D1118; color: #739ADE; }
[data-theme="dark"] .kc-table th { color: #E2E5E9; }
[data-theme="dark"] .kc-table th a { color: inherit; }
[data-theme="dark"] .kc-table td { border-top: 1px solid #32455D; color: #A4B0C1; }
[data-theme="dark"] .kc-table tbody tr { background: #181F28; }
[data-theme="dark"] .kc-table tbody tr:hover { background: #0D1118; }
[data-theme="dark"] .kc-table tbody tr.is-selected { background: #0D1118; }
[data-theme="dark"] .kc-chk span { border: 1.5px solid #424F62; background: #181F28; }
[data-theme="dark"] .kc-chk input:checked + span { border-color: #1F6BF0; background: #1F6BF0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 8.2 2.6 2.6L12 5.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }
[data-theme="dark"] .kc-chk input:focus-visible + span { outline: 2px solid #2D4776; }
[data-theme="dark"] .kc-name strong { color: var(--kc-ink); }
[data-theme="dark"] .kc-name small { color: #A4B0C1; }
[data-theme="dark"] .kc-pilltag { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .kc-pilltag.tone-blue { background: #0D1118; color: #7399DE; }
[data-theme="dark"] .kc-pilltag.tone-green { background: #121E18; color: #73EBB0; }
[data-theme="dark"] .kc-pilltag.tone-purple { background: #110D18; color: #9B69F1; }
[data-theme="dark"] .kc-pilltag.tone-red { background: #180D0D; color: #DE7A73; }
[data-theme="dark"] .kc-pilltag.tone-orange { background: #1E1912; color: #DE9273; }
[data-theme="dark"] .kc-pilltag.tone-teal { background: #121E1D; color: #66EBE1; }
[data-theme="dark"] .kc-pilltag.tone-pink { background: #1E1219; color: #DE739F; }
[data-theme="dark"] .kc-rowbtn { color: #E2E5E9; }
[data-theme="dark"] .kc-rowbtn:hover { background: #0D1218; }
[data-theme="dark"] .kc-empty { background: #181F28; color: var(--kc-muted); }
[data-theme="dark"] .kc-empty strong { color: var(--kc-ink); }
[data-theme="dark"] .kc-gcard { background: #181F28; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .kc-gcard:hover, [data-theme="dark"] .kc-gcard.is-selected { box-shadow: 0 0 0 1px #000000, 0 6px 16px rgba(0,0,0,0.28); }
[data-theme="dark"] .kc-gcard-type { color: var(--kc-muted); }
[data-theme="dark"] .kc-gcard strong { color: var(--kc-ink); }
[data-theme="dark"] .kc-gcard small { color: var(--kc-muted); }
[data-theme="dark"] .kc-gcard-date { color: #A7B1BE; }
[data-theme="dark"] .kc-foot { background: #181F28; color: #A4B0C1; }
[data-theme="dark"] .kc-panel.kf-panel { border: 0; background: #181F28; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .kc-panel-title h2 { color: var(--kc-ink); }
[data-theme="dark"] .kc-panel-title p { color: #A4B0C1; }
[data-theme="dark"] .kc-ibtn { color: #A5B0C0; }
[data-theme="dark"] .kc-ibtn:hover { background: #0D1218; color: var(--kc-ink); }
[data-theme="dark"] .kc-linkcard { border: 1px solid #32445D; color: var(--kc-ink); }
[data-theme="dark"] .kc-linkcard small { color: var(--kc-muted); }
[data-theme="dark"] .kc-linkcard .kf-i { color: #739ADE; }
[data-theme="dark"] .kc-linkcard:hover { border-color: #32425D; }
[data-theme="dark"] .kc-tabs { border-bottom: 1px solid #32455D; }
[data-theme="dark"] .kc-tab { color: #E2E5E9; }
[data-theme="dark"] .kc-tab.is-active { color: #739ADE; }
[data-theme="dark"] .kc-tab.is-active::after { background: #1F6BF0; }
[data-theme="dark"] .kc-psec-head h3 { color: var(--kc-ink); }
[data-theme="dark"] .kc-desc { color: var(--kc-text); }
[data-theme="dark"] .kc-kv dt { color: var(--kc-ink); }
[data-theme="dark"] .kc-kv.is-muted dt { color: var(--kc-muted); }
[data-theme="dark"] .kc-kv dd { color: var(--kc-text); }
[data-theme="dark"] .kc-kv-coll .kf-i { color: #739ADE; }
[data-theme="dark"] .kc-plus { color: #E2E5E9; }
[data-theme="dark"] .kc-plus:hover { background: #0D1218; }
[data-theme="dark"] .kc-related-sec { border-top: 1px solid #32455D; }
[data-theme="dark"] .kc-rel a { color: var(--kc-text); }
[data-theme="dark"] .kc-rel a em { color: var(--kc-muted); }
[data-theme="dark"] .kc-rel a:hover { background: #0D1218; }
[data-theme="dark"] .kc-trash { color: #EB7578; }
[data-theme="dark"] .kc-list { color: var(--kc-text); }
[data-theme="dark"] .kc-list small { color: var(--kc-muted); }
[data-theme="dark"] .kc-noteform textarea { border: 1px solid var(--kc-line); }
[data-theme="dark"] .kc-muted { color: var(--kc-muted); }
[data-theme="dark"] .page-reports .rp-stat { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-indigo { background: #0D0F18; color: #7A85F5; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-green { background: #121E17; color: #73DEA8; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-blue { background: #12171E; color: #739DDE; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-red { background: #1E1214; color: #F46776; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-amber { background: #1E1A12; color: #DEB073; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-purple { background: #16121E; color: #9B7AF5; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-teal { background: #121E1D; color: #77F2ED; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-pink { background: #1E1218; color: #DE73A2; }
[data-theme="dark"] .page-reports .rp-stat-label { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-stat-value { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-stat-sub { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-listtitle h2 { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-listtitle h2 em { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-listtitle p { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-viewtoggle { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-viewbtn { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-viewbtn + .rp-viewbtn { border-left: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-viewbtn.is-on { background: #0D1118; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-btn-primary { border: 0; background: #1F6FEB; color: #fff; }
[data-theme="dark"] .page-reports .rp-btn-primary:hover { background: #1A62D4; }
[data-theme="dark"] .page-reports .rp-search { border: 1px solid var(--rp-line); background: #181F28; color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-search input { border: 0; background: none; outline: none; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-fsel { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-fsel-label { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-fsel select { border: 0; background: none; outline: none; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-fsel-caret { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-table-rows thead th { background: #0D1118; border-top: 1px solid var(--rp-line-soft, #2B3A50); border-bottom: 1px solid var(--rp-line); color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-sortable a { color: inherit; }
[data-theme="dark"] .page-reports .rp-sortable a:hover { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-sortable.is-sorted a { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-table-rows tbody td { border-bottom: 1px solid var(--rp-line-soft, #2B3A50); color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-trow:hover { background: #0D1218; }
[data-theme="dark"] .page-reports .rp-trow.is-on { background: #0D1218; }
[data-theme="dark"] .page-reports .rp-trow:focus-visible { outline: 2px solid #6C9FF4; }
[data-theme="dark"] .page-reports .rp-c-num { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-rowmenu > button, [data-theme="dark"] .page-reports .rp-rowmenu .btn-icon { color: #E2E4E9; }
[data-theme="dark"] .page-reports .rp-dots { fill: currentColor; stroke: none; }
[data-theme="dark"] .page-reports .rp-table-rows .rp-rowmenu .btn-icon, [data-theme="dark"] .page-reports .rp-slist .rp-rowmenu .btn-icon { color: #E2E4E9; }
[data-theme="dark"] .page-reports .rp-c-partner { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-c-money { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-c-date { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-c-rating { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-star { color: #DEB673; fill: currentColor; stroke: none; }
[data-theme="dark"] .page-reports .rp-logo-initials { background: var(--tile); color: #fff; }
[data-theme="dark"] .page-reports .rp-typepill { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-spill.tone-green { background: #121E19; color: #60F9B1; }
[data-theme="dark"] .page-reports .rp-spill.tone-amber { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .page-reports .rp-spill.tone-red { background: #1E1212; color: #DE7377; }
[data-theme="dark"] .page-reports .rp-spill.tone-grey { background: #0D1118; color: #A6B0BF; }
[data-theme="dark"] .page-reports .rp-spill.tone-blue { background: #12171E; color: #739DDE; }
[data-theme="dark"] .page-reports .rp-ava { border: 2px solid #333D47; background: #A3B4CC !important; color: #fff !important; }
[data-theme="dark"] .page-reports .rp-ava-more { background: #0D1118; color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-muted { color: #A2ADC3; }
[data-theme="dark"] .page-reports .rp-rowmenu .btn-icon { border: 0; background: none; color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-rowmenu .btn-icon:hover { background: #0D1118; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-pager-info { color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-page { border: 1px solid var(--rp-line); background: #181F28; color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-page:hover { border-color: #32435D; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-page.is-on { background: #1F6FEB; border-color: #1F6FEB; color: #fff; }
[data-theme="dark"] .page-reports .rp-page.is-off { color: #A1AFC4; }
[data-theme="dark"] .page-reports .rp-page-gap { border-color: transparent; background: none; color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-panel > .rp-panel-head, [data-theme="dark"] .page-reports .rp-panel > .rp-panel-actions, [data-theme="dark"] .page-reports .rp-panel > .rp-panel-tabs, [data-theme="dark"] .page-reports .rp-panel > .rp-panel-body { background: #181F28; border-left: 1px solid var(--rp-line); border-right: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-panel > .rp-panel-head { border-top: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-panel > .rp-panel-body { border-bottom: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-verified { color: #739DDE; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-panel-title h3 { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-panel-id p { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-panel-x { border: 1px solid #2B3A50; background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-panel-x:hover { background: #0D1118; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-panel-tabs { border-bottom: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-ptab { border: 0; border-bottom: 2px solid transparent; background: none; color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-ptab:hover { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ptab.is-on { color: #739DDE; border-bottom-color: #4E8DEF; }
[data-theme="dark"] .page-reports .rp-panel-desc { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-kv-icon { color: #A2ADC3; }
[data-theme="dark"] .page-reports .rp-kv-label { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-kv-value { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-mark { background: var(--mark); color: #fff; }
[data-theme="dark"] .page-reports .rp-method-more, [data-theme="dark"] .page-reports .rp-flag-more { background: #0D1118; color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-flag-more { background: #12171E; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-solid-green { background: linear-gradient(145deg, #34D27B, #18A558); color: #fff; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-solid-sky { background: linear-gradient(145deg, #62CBF4, #2AA7E0); color: #fff; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-solid-purple { background: linear-gradient(145deg, #A855F7, #7A22CE); color: #fff; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-solid-orange { background: linear-gradient(145deg, #FBA94C, #F5811F); color: #fff; }
[data-theme="dark"] .page-reports .rp-morefilters { border: 1px solid var(--rp-line); background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-morefilters:hover { border-color: #32435D; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-morefilters .icon { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-reset { color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-morerow { border-top: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-morefilters.is-on { border-color: #6C9FF4; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-morefilters.is-on .icon { color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-strip { border-bottom: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-dtab { border-bottom: 2px solid transparent; color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-dtab + .rp-dtab { border-left: 1px solid var(--rp-line-soft, #2B3A50); }
[data-theme="dark"] .page-reports .rp-dtab:hover { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-dtab.is-on { color: #739DDE; border-bottom-color: #4E8DEF; }
[data-theme="dark"] .page-reports .rp-dtab em { background: #0D1118; color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-dtab.is-on em { background: #0D1118; color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-namepill { background: #0D1118; color: #7394DE; }
[data-theme="dark"] .page-reports .rp-typepill.tone-purple { background: #100D18; color: #9B69F1; }
[data-theme="dark"] .page-reports .rp-typepill.tone-amber { background: #1E1A12; color: #DEA173; }
[data-theme="dark"] .page-reports .rp-typepill.tone-teal { background: #121E1D; color: #77F2ED; }
[data-theme="dark"] .page-reports .rp-c-comm { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-geostack .rp-flag { box-shadow: 0 0 0 1.5px #000000; }
[data-theme="dark"] .page-reports .rp-geo-more { background: #12171E; color: #7394DE; }
[data-theme="dark"] .page-reports .rp-noresults { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-panel-partner { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-panel-acts .rp-panel-x { border-color: transparent; }
[data-theme="dark"] .page-reports .rp-panelmenu .btn-icon { border: 1px solid var(--rp-line); background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-panelmenu .btn-icon:hover { border-color: #32435D; }
[data-theme="dark"] .page-reports .rp-termgrid { border: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-term { border-right: 1px solid var(--rp-line); border-bottom: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-term-l { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-term-v { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-term-v.is-yes { color: #82F4BC; }
[data-theme="dark"] .page-reports .rp-sect { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-sect-top { border-top: 1px solid var(--rp-line); color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-panel-deal .rp-panel-desc { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-people .rp-person-t strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-people .rp-person-t em { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-tg { border: 1px solid var(--rp-line); background: #181F28; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-tg:hover { border-color: #32435D; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-solid-blue { background: linear-gradient(145deg, #3F7BFF, #1F5BE0); color: #fff; }
[data-theme="dark"] .page-reports .rp-tracktip { border: 1px solid var(--rp-line); background: #181F28; box-shadow: 0 8px 22px rgba(0,0,0,0.312); }
[data-theme="dark"] .page-reports .rp-tracktip b { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-tracktip span { color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-tracktip em { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-seg { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-segbtn { color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-segbtn.is-on { background: #2F7DFE; color: #fff; }
[data-theme="dark"] .page-reports .rp-trank { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-ttext strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ttext em { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-tbar { background: #12171E; }
[data-theme="dark"] .page-reports .rp-tbar i { background: #22C55E; }
[data-theme="dark"] .page-reports .rp-tpct { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-viewseg { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-viewsegbtn { color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-viewsegbtn.is-on { background: #2F7DFE; color: #fff; }
[data-theme="dark"] .page-reports .rp-c-url a { color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-urlbox { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-urlbox input { border: 0; background: none; outline: none; color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-urlcaret { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-urlcopy { border: 0; background: none; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-urlcopy:hover { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-openbtn { background: #0D1118; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-openbtn:hover { background: #12171E; }
[data-theme="dark"] .page-reports .rp-kv2-l { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-kv2-v { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-tag { background: #0D1118; color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-fulldetails { background: #0D1118; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-fulldetails:hover { background: #12171E; }
[data-theme="dark"] .page-reports .rp-donutlegend li { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-ldot { background: var(--c); }
[data-theme="dark"] .page-reports .rp-donutlegend em { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-mdisc { background: var(--mark); color: #fff; }
[data-theme="dark"] .page-reports .rp-mname { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-mbar { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-mbar i { background: var(--c); }
[data-theme="dark"] .page-reports .rp-mpct { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-rtext strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-rtext em { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-ramt { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-itext em { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-itext strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-inote { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-iarrow { color: #82F4BC; }
[data-theme="dark"] .page-reports .rp-icheck { color: #82F4BC; }
[data-theme="dark"] .page-reports .rp-c-ref { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-dot.is-amber { background: #F59E0B; }
[data-theme="dark"] .page-reports .rp-dot.is-purple { background: #8B5CF6; }
[data-theme="dark"] .page-reports .rp-headicon.tone-green { background: #121E17; color: #73DEA8; }
[data-theme="dark"] .page-reports .rp-headicon.tone-amber { background: #1E1A12; color: #DEB073; }
[data-theme="dark"] .page-reports .rp-gname { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-pname { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-pval { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-cname { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-cval { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-breaktable .rp-trow.is-static:hover { background: none; }
[data-theme="dark"] .page-reports .rp-breaktable .rp-c-month { color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-chip.is-up { background: #121E19; color: #60F9B1; }
[data-theme="dark"] .page-reports .rp-chip.is-down { background: #1E1212; color: #DE7377; }
[data-theme="dark"] .page-reports .rp-ktext strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ktext em { color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-kchev { color: #A1AFC4; }
[data-theme="dark"] .page-reports .rp-stepno { background: #1F6FEB; color: #fff; }
[data-theme="dark"] .page-reports .rp-steptext strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-steptext em { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-mtile { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-mtile.is-on { border-color: #32435D; background: #0D1218; }
[data-theme="dark"] .page-reports .rp-mtile-t strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-mtile-t em { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-mbox { border: 1.5px solid #32435D; background: #181F28; color: transparent; }
[data-theme="dark"] .page-reports .rp-mtile.is-on .rp-mbox { border-color: #1F6FEB; background: #1F6FEB; color: #fff; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-slate { background: #0D1118; color: #A6B0BF; }
[data-theme="dark"] .page-reports .rp-daterow { border: 1px solid var(--rp-line); background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-daterow .icon { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-switch { background: #293C56; }
[data-theme="dark"] .page-reports .rp-switch::after { background: #181F28; }
[data-theme="dark"] .page-reports .rp-switchrow input:checked + .rp-switch { background: #1F6FEB; }
[data-theme="dark"] .page-reports .rp-switch-t strong { color: #E2E5E9; }
[data-theme="dark"] .page-reports .rp-switch-t em { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-generate { background: #1F6FEB; color: #fff; }
[data-theme="dark"] .page-reports .rp-generate:hover { background: #1A62D4; }
[data-theme="dark"] .page-reports .rp-resulttitle h2 { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-resulttitle em { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-rtile { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-rtile-t em { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-rtile-line strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-rtile-sub { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-customtable .rp-c-date { color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-dot.is-dash { background: none; box-shadow: inset 0 0 0 2px currentColor; }
[data-theme="dark"] .page-reports .rp-dot.is-blue.is-dash { color: #739EDE; }
[data-theme="dark"] .page-reports .rp-dot.is-green.is-dash { color: #73DEBA; }
[data-theme="dark"] .page-reports .rp-rtabs { border-bottom: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-rtab { border-bottom: 2px solid transparent; color: #A8AFBD; }
[data-theme="dark"] .page-reports .rp-rtab.is-on { color: #739DDE; border-bottom-color: #4E8DEF; }
[data-theme="dark"] .page-reports .rp-customtable .rp-trow:hover { background: none; }
[data-theme="dark"] .page-reports .rp-summary li { color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-summary strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-stext strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-stext em { color: #A7B0BE; }
[data-theme="dark"] .page-reports .rp-slast { color: #A2ADC3; }
[data-theme="dark"] .page-reports .rp-tsub { color: #A5AFC0; }
[data-theme="dark"] .page-reports .rp-tmptext strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-tmptext em { color: #A7B0BE; }
[data-theme="dark"] .page-reports.is-ov .eyebrow { color: #7394DE; }
[data-theme="dark"] .page-reports.is-ov .page-icon { background: #12161E; color: #7394DE; }
[data-theme="dark"] .page-reports.is-ov .page-subtitle { color: #A0ADC5; }
[data-theme="dark"] .page-reports .rp-btn-export { border: 1px solid var(--rp-line); background: #181F28; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-btn-export:hover { border-color: #32435D; }
[data-theme="dark"] .page-reports .rp-insightbar { background: #0D1118; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-insightbar:hover { background: #12171E; }
[data-theme="dark"] .page-reports .rp-insightbar-ic { color: #7394DE; }
[data-theme="dark"] .page-reports .rp-insightbar-t em { color: #A0ADC5; }
[data-theme="dark"] .page-reports .rp-insightbar-go { color: #A0ADC5; }
[data-theme="dark"] .page-reports .rp-ovtile { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-ovtile-ic { color: #fff; }
[data-theme="dark"] .page-reports .rp-ovtile-ic.tone-green { background: linear-gradient(145deg, #2ED08A, #12A45F); }
[data-theme="dark"] .page-reports .rp-ovtile-ic.tone-blue { background: linear-gradient(145deg, #4C8DFF, #1F5FE0); }
[data-theme="dark"] .page-reports .rp-ovtile-ic.tone-purple { background: linear-gradient(145deg, #A970F7, #7A3BE0); }
[data-theme="dark"] .page-reports .rp-ovtile-ic.tone-orange { background: linear-gradient(145deg, #FBA94C, #F0821C); }
[data-theme="dark"] .page-reports .rp-ovtile-ic.tone-indigo { background: linear-gradient(145deg, #4A86FF, #2455D8); color: #fff; }
[data-theme="dark"] .page-reports .rp-ovtile-label { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ovtile-value { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ovtile-sub { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-geomap { --geo-b0: #E2E9E7; --geo-b1: #11DF97; --geo-b2: #95DBBF; --geo-b3: #2D7658; --geo-b4: #12181E; }
[data-theme="dark"] .page-reports .rp-ovtitle h2 { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ovtitle p { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-ovsel { border: 1px solid var(--rp-line); background: #181F28; }
[data-theme="dark"] .page-reports .rp-ovsel select { border: 0; background: none; outline: none; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ovsel-caret { color: #A0ADC5; }
[data-theme="dark"] .page-reports .rp-ovmetric { border: 0; background: #0D1218; color: #E2E4E9; }
[data-theme="dark"] .page-reports .rp-ovmetric:hover { background: #12171E; }
[data-theme="dark"] .page-reports .rp-ovmetric.is-on { background: #2563EB; color: #fff; }
[data-theme="dark"] .page-reports .rp-ovleg { color: #E2E4E9; }
[data-theme="dark"] .page-reports .rp-ovleg i { background: var(--c); }
[data-theme="dark"] .page-reports .rp-fband-v { fill: #fff; }
[data-theme="dark"] .page-reports .rp-fband-p { fill: rgba(255,255,255,.88); }
[data-theme="dark"] .page-reports .rp-fic { color: #fff; }
[data-theme="dark"] .page-reports .rp-fic.tone-blue { background: #2563EB; color: #fff; }
[data-theme="dark"] .page-reports .rp-fic.tone-purple { background: #8B5CF6; color: #fff; }
[data-theme="dark"] .page-reports .rp-fic.tone-pink { background: #EC4899; color: #fff; }
[data-theme="dark"] .page-reports .rp-fic.tone-green { background: #12A45F; color: #fff; }
[data-theme="dark"] .page-reports .rp-ftext strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ftext em { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-fnote { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-fnote-ic { color: #73DEAB; }
[data-theme="dark"] .page-reports .rp-fnote-t strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-fnote-t strong b { color: #7394DE; }
[data-theme="dark"] .page-reports .rp-fnote-t em { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-country { stroke: #fff; }
[data-theme="dark"] .page-reports .rp-worldtip { border: 1px solid var(--rp-line); background: #181F28; box-shadow: 0 10px 26px rgba(0,0,0,0.364); }
[data-theme="dark"] .page-reports .rp-worldtip-h { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-worldtip-flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-reports .rp-worldtip-r { color: #A0ADC5; }
[data-theme="dark"] .page-reports .rp-worldtip-r b { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-worldtip-r b.is-up { color: #73DEAB; }
[data-theme="dark"] .page-reports .rp-worldtip-r b.is-down { color: #DE738A; }
[data-theme="dark"] .page-reports .rp-worldzoom { border: 1px solid var(--rp-line); background: #181F28; box-shadow: 0 2px 6px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-reports .rp-zbtn { border: 0; background: #181F28; color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-zbtn + .rp-zbtn { border-top: 1px solid var(--rp-line); }
[data-theme="dark"] .page-reports .rp-zbtn:hover { background: #0D1218; }
[data-theme="dark"] .page-reports .rp-worldlegend li { color: #E2E4E9; }
[data-theme="dark"] .page-reports .rp-worldlegend i { background: var(--c); }
[data-theme="dark"] .page-reports .rp-world-fail { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-mixlegend li { color: #E2E4E9; }
[data-theme="dark"] .page-reports .rp-mixlegend i { background: var(--c); }
[data-theme="dark"] .page-reports .rp-mixlegend em { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-mleg { color: #E2E4E9; }
[data-theme="dark"] .page-reports .rp-mleg i.is-bar { background: var(--c); }
[data-theme="dark"] .page-reports .rp-mleg i.is-line { background: var(--c); }
[data-theme="dark"] .page-reports .rp-mleg i.is-line::after { background: var(--c); }
[data-theme="dark"] .page-reports .rp-pttable thead th { background: #0D1118; border-top: 1px solid var(--rp-line-soft, #2B3A50); border-bottom: 1px solid var(--rp-line); color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-pttable tbody td { border-bottom: 1px solid var(--rp-line-soft, #2B3A50); color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-pt-no { color: var(--rp-muted); }
[data-theme="dark"] .page-reports .rp-ovcta { background: #0D1118; }
[data-theme="dark"] .page-reports .rp-ovcta:hover { background: #12171E; }
[data-theme="dark"] .page-reports .rp-ovcta::after { background-image: radial-gradient(circle, #293B56 1.2px, transparent 1.3px); }
[data-theme="dark"] .page-reports .rp-ovcta-ic { color: #7394DE; }
[data-theme="dark"] .page-reports .rp-ovcta-t strong { color: var(--rp-ink); }
[data-theme="dark"] .page-reports .rp-ovcta-t em { color: #A0ADC5; }
[data-theme="dark"] .page-reports .rp-ovcta-btn { background: #2563EB; color: #fff; }
[data-theme="dark"] .page-reports .rp-ovcta:hover .rp-ovcta-btn { background: #1D4ED8; }
[data-theme="dark"] .page-reports .rp-export-btn { background: #111C33; color: #fff; }
[data-theme="dark"] .page-reports .rp-export-btn:hover { background: #E2E4E9; }
[data-theme="dark"] .page-reports .rp-headmenu .btn-icon { border: 1px solid var(--rp-line); background: #181F28; color: #99A7CC; }
[data-theme="dark"] .page-reports .rp-headmenu .btn-icon:hover { border-color: #32435D; color: var(--rp-ink); }
[data-theme="dark"] .page-geography { --geo-card-bd: #12171E; --geo-b0: #E2E9E7; --geo-b1: #11DF97; --geo-b2: #95DBBF; --geo-b3: #2D765D; --geo-b4: #293E56; --geo-track: #0D1118; --geo-row-bd: #0D1118; --geo-th-bg: #0D1118; --geo-label: #8997AE; --geo-value: #E2E4E9; --geo-sub: #99A7BB; --geo-body: #4F719A; --geo-mint-a: #53F8F4; --geo-mint-b: #11E291; --geo-seg-green: #11E596; --geo-seg-blue: #528EF2; --geo-seg-purple: #B67AF5; --geo-seg-orange: #F5BC75; --geo-seg-slate: #9FB0CA; --geo-seg-teal: #19E6CF; --geo-seg-pink: #F176B3; --geo-red: #F37373; --geo-amber: #F1B042; }
[data-theme="dark"] .page-geography .page-subtitle { color: #A0ACC5; }
[data-theme="dark"] .page-geography .eyebrow { background: #12171E; color: #A5AEC0; }
[data-theme="dark"] .geo-page-icon.tone-green { background: linear-gradient(155deg, #121E19, #0D1814); color: #73DEAF; }
[data-theme="dark"] .geo-page-icon.tone-blue { background: linear-gradient(155deg, #12181E, #0D1218); color: #739DDE; }
[data-theme="dark"] .geo-page-icon.tone-indigo { background: linear-gradient(155deg, #12131E, #0D0E18); color: #7C7CF3; }
[data-theme="dark"] .geo-page-icon.tone-orange { background: linear-gradient(155deg, #1E1812, #18120D); color: #DE9F73; }
[data-theme="dark"] .geo-page-icon.tone-red { background: linear-gradient(155deg, #1E1213, #180D0E); color: #F47288; }
[data-theme="dark"] .geo-page-icon.tone-teal { background: linear-gradient(155deg, #121E1B, #0D1815); color: #73DECC; }
[data-theme="dark"] .page-geography .page-icon { background: none; }
[data-theme="dark"] .geo-range { background: #181F28; border: 1px solid #32435D; color: #E2E5E9; box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-range:hover { border-color: #32445D; }
[data-theme="dark"] .geo-range-cal { color: #A4AFC1; }
[data-theme="dark"] .geo-range-caret { color: #A7B0BE; }
[data-theme="dark"] .geo-range-custom { border-top: 1px solid var(--geo-card-bd); }
[data-theme="dark"] .geo-range-form label { color: var(--geo-sub); }
[data-theme="dark"] .geo-range-form input { border: 1px solid #32445D; }
[data-theme="dark"] .geo-tabs { border-bottom: 1px solid #32435D; }
[data-theme="dark"] .geo-tab { color: #A0ADC5; border-bottom: 2.5px solid transparent; }
[data-theme="dark"] .geo-tab:hover { color: #E2E5E9; }
[data-theme="dark"] .geo-tab.is-active { color: #7394DE; border-bottom-color: #5484EF; }
[data-theme="dark"] .geo-tab-icon { color: #A7AFBE; }
[data-theme="dark"] .geo-tab.is-active .geo-tab-icon { color: #7394DE; }
[data-theme="dark"] .geo-card { background: #181F28; border: 1px solid var(--geo-card-bd); box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-card-title { color: #E2E4E9; }
[data-theme="dark"] .geo-card-sub { color: #A7B0BE; }
[data-theme="dark"] .geo-viewall { color: #639BF3; }
[data-theme="dark"] .geo-stat { background: #181F28; border: 1px solid var(--geo-card-bd); box-shadow: 0 1px 2px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-stat-icon { color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-green { background: linear-gradient(158deg, #14CE8C 6%, #04B272 96%); }
[data-theme="dark"] .geo-stat-icon.tone-blue { background: linear-gradient(158deg, #52A2FE 6%, #1670F9 96%); }
[data-theme="dark"] .geo-stat-icon.tone-purple { background: linear-gradient(158deg, #522D76 6%, #9645F7 96%); }
[data-theme="dark"] .geo-stat-icon.tone-orange { background: linear-gradient(158deg, #FEA950 6%, #F97B14 96%); }
[data-theme="dark"] .geo-stat-icon.tone-red { background: linear-gradient(158deg, #FB6A72 6%, #EF3F4F 96%); }
[data-theme="dark"] .geo-stat-icon.tone-teal { background: linear-gradient(158deg, #2AD4BA 6%, #0BAD93 96%); }
[data-theme="dark"] .geo-stat-icon.tone-amber { background: linear-gradient(158deg, #FBC93F 6%, #F0A208 96%); }
[data-theme="dark"] .geo-stat-icon.tone-grey { background: linear-gradient(158deg, #3D4C66 6%, #A5AFC1 96%); }
[data-theme="dark"] .geo-stat-icon.tone-indigo { background: linear-gradient(158deg, #2D3276 6%, #4F46E5 96%); }
[data-theme="dark"] .geo-stat-label { color: #A0ACC5; }
[data-theme="dark"] .geo-stat-value { color: var(--geo-value); }
[data-theme="dark"] .geo-stat-sub { color: var(--geo-sub); }
[data-theme="dark"] .geo-delta.is-up { color: #73DE9A; }
[data-theme="dark"] .geo-delta.is-down { color: #DE737F; }
[data-theme="dark"] .geo-delta.is-flat { color: #A8B0BD; }
[data-theme="dark"] .geo-spark, [data-theme="dark"] .geo-spark-bars, [data-theme="dark"] .geo-donut svg { background: none; }
[data-theme="dark"] .geo-spark.tone-green .geo-spark-line { stroke: #73DEB3; }
[data-theme="dark"] .geo-spark.tone-blue .geo-spark-line { stroke: #66A3F3; }
[data-theme="dark"] .geo-spark.tone-purple .geo-spark-line { stroke: #B6A2CD; }
[data-theme="dark"] .geo-spark.tone-orange .geo-spark-line { stroke: #F3A664; }
[data-theme="dark"] .geo-spark.tone-red .geo-spark-line { stroke: #F37A86; }
[data-theme="dark"] .geo-spark.tone-grey .geo-spark-line { stroke: #A2AEC3; }
[data-theme="dark"] .geo-spark-bars rect { fill: #73DEB3; }
[data-theme="dark"] .geo-spark-bars.tone-blue rect { fill: #66A3F3; }
[data-theme="dark"] .geo-spark-bars.tone-orange rect { fill: #F3A664; }
[data-theme="dark"] .geo-spark-bars.tone-purple rect { fill: #B6A2CD; }
[data-theme="dark"] .geo-spark-bars.tone-grey rect { fill: #A2AFC3; }
[data-theme="dark"] .geo-spark-bars.tone-green rect { fill: #73DEB3; }
[data-theme="dark"] .geo-flag { background: #0D1118; box-shadow: inset 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-flag-none { color: #A8AFBD; }
[data-theme="dark"] .geo-select select { background: #181F28; border: 1px solid #32435D; color: #E2E5E9; }
[data-theme="dark"] .geo-select-caret { color: #A6B0BF; }
[data-theme="dark"] .geo-select select:hover { border-color: #32445D; }
[data-theme="dark"] .geo-field { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .geo-field-label { color: #A6AEBF; }
[data-theme="dark"] .geo-field select { border: 0; background: none; color: #E2E4E9; }
[data-theme="dark"] .geo-field-caret { color: #7388DE; }
[data-theme="dark"] .geo-c { stroke: #FFFFFF; fill: var(--geo-b4); }
[data-theme="dark"] .geo-c.b0 { fill: var(--geo-b0); }
[data-theme="dark"] .geo-c.b1 { fill: var(--geo-b1); }
[data-theme="dark"] .geo-c.b2 { fill: var(--geo-b2); }
[data-theme="dark"] .geo-c.b3 { fill: var(--geo-b3); }
[data-theme="dark"] .geo-c.b4 { fill: var(--geo-b4); }
[data-theme="dark"] .geo-c.has-data:hover, [data-theme="dark"] .geo-c.is-hover { stroke: #E2E4E9; }
[data-theme="dark"] .geo-c:focus-visible { outline: none; stroke: #E2E4E9; }
[data-theme="dark"] .geo-map-pin .geo-pin-body { fill: #73DEBA; }
[data-theme="dark"] .geo-map-pin .geo-pin-dot { fill: #fff; }
[data-theme="dark"] .geo-zoom-btn { background: #181F28; border: 1px solid #32435D; color: #E2E5E9; box-shadow: 0 1px 3px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-zoom-btn:hover { background: #0D1118; }
[data-theme="dark"] .geo-legend { color: #A0ADC5; }
[data-theme="dark"] .geo-swatch.b0 { background: var(--geo-b0); }
[data-theme="dark"] .geo-swatch.b1 { background: var(--geo-b1); }
[data-theme="dark"] .geo-swatch.b2 { background: var(--geo-b2); }
[data-theme="dark"] .geo-swatch.b3 { background: var(--geo-b3); }
[data-theme="dark"] .geo-swatch.b4 { background: var(--geo-b4); }
[data-theme="dark"] .geo-mapwrap.mode-coverage { --geo-b3: #70762D; }
[data-theme="dark"] .geo-swatch.r0 { background: #EF4444; }
[data-theme="dark"] .geo-swatch.r1 { background: #F5A524; }
[data-theme="dark"] .geo-swatch.r2 { background: #22C55E; }
[data-theme="dark"] .geo-swatch.r3 { background: #3C5067; }
[data-theme="dark"] .geo-tip { background: #181F28; border: 1px solid #2B3A50; box-shadow: 0 10px 28px rgba(0,0,0,0.338); }
[data-theme="dark"] .geo-tip-head { color: #E2E4E9; }
[data-theme="dark"] .geo-tip-flag { box-shadow: inset 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-tip-row { color: #A4AFC1; }
[data-theme="dark"] .geo-tip-row b { color: #E2E4E9; }
[data-theme="dark"] .geo-tip-dot.d0 { background: #1D6BFB; }
[data-theme="dark"] .geo-tip-dot.d1 { background: #7ED3B0; }
[data-theme="dark"] .geo-tip-dot.d2 { background: #7ED3B0; }
[data-theme="dark"] .geo-tip-dot.d3 { background: #E2E9E7; }
[data-theme="dark"] .geo-tip-dot.b1 { background: #16C47F; }
[data-theme="dark"] .geo-tip-dot.b2 { background: #6FD3AC; }
[data-theme="dark"] .geo-tip-dot.r0 { background: #EF4444; }
[data-theme="dark"] .geo-tip-dot.r1 { background: #F5A524; }
[data-theme="dark"] .geo-tip-dot.r2 { background: #22C55E; }
[data-theme="dark"] .geo-tip-dot.r4 { background: #3C5067; }
[data-theme="dark"] .geo-tip-link { color: #639BF3; }
[data-theme="dark"] .geo-tip-status { color: #DEA173; }
[data-theme="dark"] .geo-tip.is-dark { background: #E2E5E9; border-color: #E2E5E9; box-shadow: 0 12px 30px rgba(0,0,0,0.832); }
[data-theme="dark"] .geo-tip.is-dark .geo-tip-head, [data-theme="dark"] .geo-tip.is-dark .geo-tip-line { color: #fff; }
[data-theme="dark"] .geo-tip.is-dark .geo-tip-row { color: #9FB0C6; }
[data-theme="dark"] .geo-tip.is-dark .geo-tip-row b { color: #fff; }
[data-theme="dark"] .geo-tip.is-dark .geo-tip-link { color: #526F98; }
[data-theme="dark"] .geo-rank { color: inherit; }
[data-theme="dark"] .geo-rank:hover .geo-rank-name { color: #7394DE; }
[data-theme="dark"] .geo-rank-no { background: #0D1218; color: #E2E4E9; }
[data-theme="dark"] .geo-rank-name { color: #E2E4E9; }
[data-theme="dark"] .geo-rank-track { background: var(--geo-track); }
[data-theme="dark"] .geo-rank-bar { background: linear-gradient(90deg, var(--geo-mint-a), var(--geo-mint-b)); }
[data-theme="dark"] .geo-rank-bar.tone-blue { background: linear-gradient(90deg, #1A56C8, #3B8AFB); }
[data-theme="dark"] .geo-rank-bar.tone-purple { background: linear-gradient(90deg, #6D28D9, #A855F7); }
[data-theme="dark"] .geo-rank-bar.tone-orange { background: linear-gradient(90deg, #EA700C, #FBA94C); }
[data-theme="dark"] .geo-rank-bar.tone-pink { background: linear-gradient(90deg, #DB2777, #F472B6); }
[data-theme="dark"] .geo-rank-value { color: #E2E4E9; }
[data-theme="dark"] .geo-arc.tone-green { stroke: var(--geo-seg-green); }
[data-theme="dark"] .geo-arc.tone-blue { stroke: var(--geo-seg-blue); }
[data-theme="dark"] .geo-arc.tone-purple { stroke: var(--geo-seg-purple); }
[data-theme="dark"] .geo-arc.tone-orange { stroke: var(--geo-seg-orange); }
[data-theme="dark"] .geo-arc.tone-slate { stroke: var(--geo-seg-slate); }
[data-theme="dark"] .geo-arc.tone-teal { stroke: var(--geo-seg-teal); }
[data-theme="dark"] .geo-arc.tone-pink { stroke: var(--geo-seg-pink); }
[data-theme="dark"] .geo-arc.tone-red { stroke: var(--geo-red); }
[data-theme="dark"] .geo-arc.tone-amber { stroke: var(--geo-amber); }
[data-theme="dark"] .geo-donut-value { color: #E2E4E9; }
[data-theme="dark"] .geo-donut-caption { color: #A0ACC5; }
[data-theme="dark"] .geo-dl-name { color: #9AB0CB; }
[data-theme="dark"] .geo-dl-pct { color: #E2E4E9; }
[data-theme="dark"] .geo-dot.tone-green { background: var(--geo-seg-green); }
[data-theme="dark"] .geo-dot.tone-blue { background: var(--geo-seg-blue); }
[data-theme="dark"] .geo-dot.tone-purple { background: var(--geo-seg-purple); }
[data-theme="dark"] .geo-dot.tone-orange { background: var(--geo-seg-orange); }
[data-theme="dark"] .geo-dot.tone-slate { background: var(--geo-seg-slate); }
[data-theme="dark"] .geo-dot.tone-teal { background: var(--geo-seg-teal); }
[data-theme="dark"] .geo-dot.tone-pink { background: var(--geo-seg-pink); }
[data-theme="dark"] .geo-dot.tone-red { background: var(--geo-red); }
[data-theme="dark"] .geo-dot.tone-amber { background: var(--geo-amber); }
[data-theme="dark"] .geo-ins { border-top: 1px solid #2B3750; color: inherit; }
[data-theme="dark"] .geo-ins-icon.tone-red { background: #180D0F; color: #F36374; }
[data-theme="dark"] .geo-ins-icon.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .geo-ins-icon.tone-green { background: #121E18; color: #73DEB0; }
[data-theme="dark"] .geo-ins-icon.tone-orange { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .geo-ins-icon.tone-purple { background: #17121E; color: #AFA2CD; }
[data-theme="dark"] .geo-ins-icon.tone-teal { background: #121E1C; color: #73DECC; }
[data-theme="dark"] .geo-ins-icon.tone-slate { background: #12171E; color: #A6B0BF; }
[data-theme="dark"] .geo-ins-icon.tone-amber { background: #564D29; color: #DEAC73; }
[data-theme="dark"] .geo-ins-title { color: #E2E4E9; }
[data-theme="dark"] .geo-ins-sub { color: #A7B0BE; }
[data-theme="dark"] .geo-ins-chev { color: #E2E5E9; }
[data-theme="dark"] .geo-ins:hover .geo-ins-title { color: #7394DE; }
[data-theme="dark"] .geo-quick-mark { color: #7395DE; }
[data-theme="dark"] .geo-quick { color: #9EACC7; }
[data-theme="dark"] .geo-quick b { color: #E2E4E9; }
[data-theme="dark"] .geo-quick-icon { background: #12161E; color: #7395DE; }
[data-theme="dark"] .geo-search { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .geo-search-icon { color: #A0ADC5; }
[data-theme="dark"] .geo-search input { border: 0; background: none; color: #E2E4E9; }
[data-theme="dark"] .geo-search input::placeholder { color: #A6B0BF; }
[data-theme="dark"] .geo-search input:focus { outline: none; }
[data-theme="dark"] .geo-more, [data-theme="dark"] .geo-export { background: #181F28; border: 1px solid #32445D; color: #E2E5E9; }
[data-theme="dark"] .geo-more:hover, [data-theme="dark"] .geo-export:hover { border-color: #32445D; }
[data-theme="dark"] .geo-more svg, [data-theme="dark"] .geo-export svg { color: #E2E5E9; }
[data-theme="dark"] .geo-reset { border: 1px solid transparent; color: #A0ADC5; }
[data-theme="dark"] .geo-reset:hover { color: #E2E4E9; background: #0D1118; }
[data-theme="dark"] .geo-export { background: #2C7BF7; border-color: #2C7BF7; color: #fff; }
[data-theme="dark"] .geo-export:hover { background: #1F6AE0; border-color: #1F6AE0; }
[data-theme="dark"] .geo-export svg { color: #fff; }
[data-theme="dark"] .geo-table td.geo-col-money.is-strong { color: #E2E4E9; }
[data-theme="dark"] .geo-table td.is-neg { color: #DE7373; }
[data-theme="dark"] .geo-more-title { color: #A6B0BF; }
[data-theme="dark"] .geo-check { color: #E2E5E9; }
[data-theme="dark"] .geo-more-input { border: 1px solid #32445D; }
[data-theme="dark"] .geo-table thead th { background: var(--geo-th-bg); color: #A0ADC5; }
[data-theme="dark"] .geo-table thead th a { color: inherit; }
[data-theme="dark"] .geo-table thead th.is-sorted a, [data-theme="dark"] .geo-table thead th.is-sorted { color: #639BF3; }
[data-theme="dark"] .geo-table tbody td { border-bottom: 1px solid var(--geo-row-bd); color: #E2E5E9; }
[data-theme="dark"] .geo-table tbody tr:hover td { background: #0D1118; }
[data-theme="dark"] .geo-table td.geo-col-no, [data-theme="dark"] .geo-table th.geo-col-no { color: #9DACC8; }
[data-theme="dark"] .geo-table td.geo-col-region { color: #A0ADC5; }
[data-theme="dark"] .geo-table td.is-sorted { color: #E2E4E9; }
[data-theme="dark"] .geo-country { color: #E2E4E9; }
[data-theme="dark"] .geo-country:hover span { color: #7394DE; }
[data-theme="dark"] .geo-num-link { color: #639BF3; }
[data-theme="dark"] .geo-cb span { border: 1.4px solid #32435D; background: #181F28; }
[data-theme="dark"] .geo-cb input:checked + span { background: #2563EB; border-color: #2563EB; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.2 4.6 8.4 9.4 3.6' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
[data-theme="dark"] .geo-rowmenu > button { color: #E2E5E9; }
[data-theme="dark"] .geo-rowmenu > button:hover { background: #0D1118; }
[data-theme="dark"] .geo-pill.tone-green { background: #121E18; color: #77EDB5; }
[data-theme="dark"] .geo-pill.tone-amber { background: #564729; color: #F5C678; }
[data-theme="dark"] .geo-pill.tone-red { background: #1E1215; color: #DD7387; }
[data-theme="dark"] .geo-pill.tone-grey { background: #12171E; color: #A4AFC1; }
[data-theme="dark"] .geo-pill.tone-blue { background: #12171E; color: #739BDE; }
[data-theme="dark"] .geo-showing { color: #A4AFC1; }
[data-theme="dark"] .geo-page { border: 1px solid #32435D; background: #181F28; color: #E2E5E9; }
[data-theme="dark"] .geo-page:hover { border-color: #32445D; }
[data-theme="dark"] .geo-page.is-on { background: #2563EB; border-color: #2563EB; color: #fff; }
[data-theme="dark"] .geo-page.is-off { color: #A2AFC3; }
[data-theme="dark"] .geo-page-gap { color: #A6B0BF; }
[data-theme="dark"] .geo-bar { background: var(--geo-track); }
[data-theme="dark"] .geo-bar-fill { background: #16C47F; }
[data-theme="dark"] .geo-bar-fill.tone-blue { background: #3B8AFB; }
[data-theme="dark"] .geo-bar-fill.tone-purple { background: #A855F7; }
[data-theme="dark"] .geo-bar-fill.tone-orange { background: #FB923C; }
[data-theme="dark"] .geo-bar-fill.tone-pink { background: #F472B6; }
[data-theme="dark"] .geo-bar-fill.tone-red { background: #EF4444; }
[data-theme="dark"] .geo-bar-fill.tone-amber { background: #F59E0B; }
[data-theme="dark"] .geo-bar-fill.tone-teal { background: #14B8A6; }
[data-theme="dark"] .geo-bar-fill.tone-grey { background: #3A4C69; }
[data-theme="dark"] .geo-region-icon.tone-green { background: #121E18; color: #73DEB0; }
[data-theme="dark"] .geo-region-icon.tone-teal { background: #121E1C; color: #73DECC; }
[data-theme="dark"] .geo-region-icon.tone-purple { background: #17121E; color: #AFA2CD; }
[data-theme="dark"] .geo-region-icon.tone-orange { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .geo-region-icon.tone-pink { background: #1E1218; color: #F176B3; }
[data-theme="dark"] .geo-region-icon.tone-red { background: #180D0F; color: #F36374; }
[data-theme="dark"] .geo-region-icon.tone-slate { background: #12171E; color: #A6B0BF; }
[data-theme="dark"] .geo-region-icon.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .geo-filters-sep { background: #12171E; }
[data-theme="dark"] .geo-stat-icon.tone-amber.is-soft { background: linear-gradient(155deg, #1E1912, #18130D); color: #DEA873; }
[data-theme="dark"] .geo-spot-head { background: linear-gradient(90deg, #0D1218 0%, #0D1218 55%, #12181E 100%); }
[data-theme="dark"] .geo-skyline-far rect { fill: #9FB3C6; }
[data-theme="dark"] .geo-spot-flag { box-shadow: 0 0 0 2.5px #000000, 0 2px 6px rgba(0,0,0,0.364); }
[data-theme="dark"] .geo-spot-name { color: #E2E4E9; }
[data-theme="dark"] .geo-spot-meta { color: #9CACC9; }
[data-theme="dark"] .geo-spot-dot { background: #16C47F; }
[data-theme="dark"] .geo-spot-status { color: #E2E4E9; }
[data-theme="dark"] .geo-spot-sep { color: #A4AFC1; }
[data-theme="dark"] .geo-spot-arrow { background: #181F28; border: 1px solid #32435D; color: #E2E4E9; box-shadow: 0 1px 3px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-spot-arrow:hover { background: #0D1118; }
[data-theme="dark"] .geo-spot-metrics { background: #0D1218; }
[data-theme="dark"] .geo-spot-metric { background: #181F28; border: 1px solid #2B3C50; }
[data-theme="dark"] .geo-spot-value { color: #E2E4E9; }
[data-theme="dark"] .geo-spot-label { color: #A0ACC5; }
[data-theme="dark"] .geo-spot-partners { border-top: 1px solid var(--geo-card-bd); }
[data-theme="dark"] .geo-rank-share { color: #A7B0BE; }
[data-theme="dark"] .geo-plogo { background: var(--plogo-bg, #E2E4E9); }
[data-theme="dark"] .geo-plogo.is-text { color: var(--plogo-fg, #fff); }
[data-theme="dark"] .geo-empty-line { color: var(--geo-sub); }
[data-theme="dark"] .geo-show { color: #A0ACC5; }
[data-theme="dark"] .geo-region-name { color: #E2E5E9; }
[data-theme="dark"] .geo-region-value { color: #E2E4E9; }
[data-theme="dark"] .geo-region-pct { color: #A7B0BE; }
[data-theme="dark"] .geo-rank-bar.is-flat { background: #3B8AFB; }
[data-theme="dark"] .geo-rank-bar.tone-blue.is-flat { background: #2B7BF6; }
[data-theme="dark"] .geo-rank-bar.tone-green.is-flat { background: #17C07C; }
[data-theme="dark"] .geo-rank-bar.tone-purple.is-flat { background: #A855F7; }
[data-theme="dark"] .geo-rank-bar.tone-orange.is-flat { background: #F2701A; }
[data-theme="dark"] .geo-rank-bar.tone-slate.is-flat { background: #9FB0CA; }
[data-theme="dark"] .geo-rank-bar.tone-pink.is-flat { background: #F4529A; }
[data-theme="dark"] .geo-rank-bar.tone-red.is-flat { background: #EF4444; }
[data-theme="dark"] .geo-rank-bar.tone-amber.is-flat { background: #F59E0B; }
[data-theme="dark"] .geo-rank-bar.tone-teal.is-flat { background: #14B8A6; }
[data-theme="dark"] .geo-ins-mark.tone-orange { background: #1E1A12; color: #DEA973; }
[data-theme="dark"] .geo-ins2-title { color: #E2E5E9; }
[data-theme="dark"] .geo-ins2-title b { color: #E2E4E9; }
[data-theme="dark"] .geo-ins2-sub { color: #A5B0C0; }
[data-theme="dark"] .geo-table tbody tr.is-on td { background: #0D1118; }
[data-theme="dark"] .geo-stat2-value { color: var(--geo-value); }
[data-theme="dark"] .geo-stat2-sub { color: var(--geo-sub); }
[data-theme="dark"] .geo-stat2-label { color: #A0ACC5; }
[data-theme="dark"] .geo-stat2-pct { color: #639BF3; }
[data-theme="dark"] .geo-stat2-note { color: #639BF3; }
[data-theme="dark"] .geo-stat2-note.is-muted { color: var(--geo-sub); }
[data-theme="dark"] .geo-stat2.is-labelfirst .geo-stat2-label { color: #A0ACC5; }
[data-theme="dark"] .geo-infodot { color: #A4AFC1; }
[data-theme="dark"] .geo-infodot:hover { color: #A4AFC1; }
[data-theme="dark"] .geo-covreg-head { color: #A5B0C0; }
[data-theme="dark"] .geo-covreg-row { border-top: 1px solid #2B3950; color: #E2E5E9; }
[data-theme="dark"] .geo-covreg-head + .geo-covreg-row { border-top: 1px solid #32425D; }
[data-theme="dark"] .geo-covreg-name { color: #E2E4E9; }
[data-theme="dark"] .geo-covreg-pct { color: #E2E4E9; }
[data-theme="dark"] .geo-covreg-pct.is-best { background: #121E18; color: #77EDB5; }
[data-theme="dark"] .geo-cont.tone-green { color: #73DEB3; }
[data-theme="dark"] .geo-cont.tone-slate { color: #527298; }
[data-theme="dark"] .geo-cont.tone-orange { color: #F5AF75; }
[data-theme="dark"] .geo-cont.tone-pink { color: #F57AB1; }
[data-theme="dark"] .geo-cont.tone-red { color: #F37373; }
[data-theme="dark"] .geo-cont.tone-blue { color: #74A9F5; }
[data-theme="dark"] .geo-topp-count { color: #E2E5E9; }
[data-theme="dark"] .geo-tm-count { color: #E2E4E9; }
[data-theme="dark"] .geo-mx-head { color: #A0ADC5; }
[data-theme="dark"] .geo-mx-flag { box-shadow: inset 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-mx-type { color: #9FACC6; }
[data-theme="dark"] .geo-mx-total { color: #E2E4E9; }
[data-theme="dark"] .geo-mx-covwrap b { color: #E2E4E9; }
[data-theme="dark"] .geo-mx-view a { color: #639BF3; }
[data-theme="dark"] .geo-cell { background: #3A4E69; }
[data-theme="dark"] .geo-cell.st-available { background: #16C47F; }
[data-theme="dark"] .geo-cell.st-restricted { background: #F4515F; }
[data-theme="dark"] .geo-cell:hover { box-shadow: 0 0 0 3px rgba(0,0,0,0.364); }
[data-theme="dark"] .geo-ring-track { stroke: #596F91; }
[data-theme="dark"] .geo-ring-bar { stroke: #73DEB3; }
[data-theme="dark"] .geo-sc-frame { fill: #547596; stroke: #596F91; }
[data-theme="dark"] .geo-sc-ylab { fill: #A5B0C0; }
[data-theme="dark"] .geo-sc-xlab { fill: #A5B0C0; }
[data-theme="dark"] .geo-sc-axis { fill: #A0ACC5; }
[data-theme="dark"] .geo-sc-dot text { fill: #E2E5E9; }
[data-theme="dark"] .geo-sc-dot.tone-high circle { fill: #8ADBBD; }
[data-theme="dark"] .geo-sc-dot.tone-medium circle { fill: #988152; }
[data-theme="dark"] .geo-sc-dot.tone-low circle { fill: #985253; }
[data-theme="dark"] .geo-scatter-legend { border: 1px solid #32445D; color: #E2E5E9; }
[data-theme="dark"] .geo-scatter-note { background: #0D1218; color: #9AB0CB; }
[data-theme="dark"] .geo-opreg-head { color: #A5B0C0; }
[data-theme="dark"] .geo-opreg-row { border-top: 1px solid #2B3950; }
[data-theme="dark"] .geo-opreg-score b { background: #0D1218; color: #E2E5E9; }
[data-theme="dark"] .geo-opreg-top { color: #E2E4E9; }
[data-theme="dark"] .geo-opreg-top:hover span { color: #7394DE; }
[data-theme="dark"] .geo-th-sub { color: #A5AFC0; }
[data-theme="dark"] .geo-viewbtn { border: 1px solid #32445D; color: #E2E5E9; background: #181F28; }
[data-theme="dark"] .geo-viewbtn:hover { border-color: #32445D; color: #738FDE; }
[data-theme="dark"] .geo-cta { background: linear-gradient(120deg, #0D1812 0%, #0D1812 60%, #0D1812 100%); border-color: #325D47; }
[data-theme="dark"] .geo-cta-icon { background: #17C07C; color: #fff; }
[data-theme="dark"] .geo-cta-title { color: #E2E9E6; }
[data-theme="dark"] .geo-cta-sub { color: #E2E9E6; }
[data-theme="dark"] .geo-cta-btn { background: #17C07C; color: #fff; }
[data-theme="dark"] .geo-cta-btn:hover { background: #12A96C; }
[data-theme="dark"] .geo-mapwrap.mode-restrictions { --geo-b0: #F37373; --geo-b1: #F3B859; --geo-b2: #3DDD78; --geo-b3: #3C5067; --geo-b4: #12171E; }
[data-theme="dark"] .geo-seg { background: #0D1118; }
[data-theme="dark"] .geo-seg-btn { color: #A0ADC5; }
[data-theme="dark"] .geo-seg-btn.is-on { background: #12171E; color: #7395DE; }
[data-theme="dark"] .geo-seg-btn:hover { color: #E2E5E9; }
[data-theme="dark"] .geo-break-name { color: #E2E5E9; }
[data-theme="dark"] .geo-break-bar { background: #0D1118; }
[data-theme="dark"] .geo-break-bar .seg-r { background: #F4515F; }
[data-theme="dark"] .geo-break-bar .seg-p { background: #F9C23C; }
[data-theme="dark"] .geo-break-bar .seg-a { background: #22C55E; }
[data-theme="dark"] .geo-break-count { color: #9AB0CB; }
[data-theme="dark"] .geo-more-caret { color: #A6B0BF; }
[data-theme="dark"] .geo-rstable .geo-rs-notes { color: #9DADC8; }
[data-theme="dark"] .geo-rstable .geo-rs-upd { color: #9DADC8; }
[data-theme="dark"] .geo-rstable .geo-rs-act .geo-viewbtn { background: #0D1118; border-color: #32425D; color: #7395DE; }
[data-theme="dark"] .geo-dash { color: #A4AFC1; }
[data-theme="dark"] .geo-rs-form label { color: #9DADC8; }
[data-theme="dark"] .geo-rs-form select, [data-theme="dark"] .geo-rs-form input[type="text"], [data-theme="dark"] .geo-rs-form input[type="number"], [data-theme="dark"] .geo-rs-form textarea { border: 1px solid #32445D; background: #181F28; }
[data-theme="dark"] .geo-rs-vert { border-top: 1px solid #2B3750; color: #E2E5E9; }
[data-theme="dark"] .geo-rs-src { border: 1px solid #32445D; color: #E2E5E9; }
[data-theme="dark"] .geo-rs-src.is-on { border-color: #32425D; background: #0D1218; color: #738FDE; }
[data-theme="dark"] .geo-rs-lbl { color: #9DADC8; }
[data-theme="dark"] .geo-cellform-lead { color: #9DADC8; }
[data-theme="dark"] .geo-cellform-note { color: #9DADC8; }
[data-theme="dark"] .geo-cellform-note input { border: 1px solid #32445D; }
[data-theme="dark"] .geo-viewname input { border: 1px solid #32445D; }
[data-theme="dark"] .geo-cmp-chip { border: 1px solid #32435D; background: #181F28; color: #E2E4E9; }
[data-theme="dark"] .geo-cmp-x { color: #A5AFC0; }
[data-theme="dark"] .geo-cmp-x:hover { color: #DE737F; }
[data-theme="dark"] .geo-cmp-add { background: #1D63F5; color: #fff; }
[data-theme="dark"] .geo-cmp-add:hover { background: #1550D8; }
[data-theme="dark"] .geo-cmp-clear { color: #7395DE; }
[data-theme="dark"] .geo-cmp-tab { background: #0D1118; color: #9DADC8; }
[data-theme="dark"] .geo-cmp-tab:hover { background: #12171E; color: #E2E4E9; }
[data-theme="dark"] .geo-cmp-tab.is-on { background: #1D63F5; color: #fff; }
[data-theme="dark"] .geo-cmp-period { background: #F1F5FB; }
[data-theme="dark"] .geo-cmp-period .geo-seg-btn.is-on { background: #0F1E33; color: #fff; }
[data-theme="dark"] .geo-cmp-icon { color: #fff; }
[data-theme="dark"] .geo-cmp-icon.tone-green { background: linear-gradient(158deg, #14CE8C, #04B272); }
[data-theme="dark"] .geo-cmp-icon.tone-blue { background: linear-gradient(158deg, #52A2FE, #1670F9); }
[data-theme="dark"] .geo-cmp-icon.tone-purple { background: linear-gradient(158deg, #522D76, #9645F7); }
[data-theme="dark"] .geo-cmp-icon.tone-orange { background: linear-gradient(158deg, #FEA950, #F97B14); }
[data-theme="dark"] .geo-cmp-icon.tone-red { background: linear-gradient(158deg, #FB6A72, #EF3F4F); }
[data-theme="dark"] .geo-cmp-icon.tone-teal { background: linear-gradient(158deg, #2AD4BA, #0BAD93); }
[data-theme="dark"] .geo-cmp-val { color: #E2E4E9; }
[data-theme="dark"] .geo-cmp-bar { background: #17C07C; }
[data-theme="dark"] .geo-cmp-bar.tone-green { background: #43CE99; }
[data-theme="dark"] .geo-cmp-bar.tone-amber { background: #FBC85F; }
[data-theme="dark"] .geo-cmp-bar.tone-red { background: #F8757C; }
[data-theme="dark"] .geo-cmp-bar.tone-blue { background: #56A0F8; }
[data-theme="dark"] .geo-cmp-bar.tone-purple { background: #4C2D76; }
[data-theme="dark"] .geo-cmp-bar.tone-teal { background: #35C9B4; }
[data-theme="dark"] .geo-cmp-flag { box-shadow: inset 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .geo-cmp-cname { color: #A0ACC5; }
[data-theme="dark"] .geo-cmp-mlabel { color: #E2E5E9; }
[data-theme="dark"] .geo-cmp-micon.tone-green { background: #121E18; color: #73DEB0; }
[data-theme="dark"] .geo-cmp-micon.tone-blue { background: #12171E; color: #739ADE; }
[data-theme="dark"] .geo-cmp-micon.tone-purple { background: #17121E; color: #AFA2CD; }
[data-theme="dark"] .geo-cmp-micon.tone-orange { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .geo-cmp-micon.tone-red { background: #180D0F; color: #F36374; }
[data-theme="dark"] .geo-cmp-micon.tone-teal { background: #121E1C; color: #73DECC; }
[data-theme="dark"] .geo-cmp-micon.tone-amber { background: #564D29; color: #DEAC73; }
[data-theme="dark"] .geo-cmp-th { color: #E2E4E9; }
[data-theme="dark"] .geo-cmp-cta { background: linear-gradient(120deg, #0D1118 0%, #0D1218 60%, #0D1118 100%); border-color: #32435D; }
[data-theme="dark"] .geo-cmp-ctaicon { background: #12171E; color: #7395DE; }
[data-theme="dark"] .geo-cmp-ctatitle { color: #E2E4E9; }
[data-theme="dark"] .geo-cmp-ctasub { color: #9CACC9; }
[data-theme="dark"] .geo-cmp-ctabtn { background: #1D63F5; color: #fff; }
[data-theme="dark"] .geo-cmp-ctabtn:hover { background: #1550D8; }
[data-theme="dark"] .flag-circle { background: var(--color-surface-muted); box-shadow: inset 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .flag-stack .flag-circle + .flag-circle { box-shadow: inset 0 0 0 1px rgba(0,0,0,0.28), 0 0 0 2px var(--color-surface); }
[data-theme="dark"] .ctg-chip { background: #0D1118; color: #739CDE; }
[data-theme="dark"] .ctg-chip:hover { background: #12171E; }
[data-theme="dark"] .ctg-chip .ctg-ic { color: #90ABE0; }
[data-theme="dark"] .ctg-chip:hover .ctg-ic { color: #739CDE; }
[data-theme="dark"] .ctg-clear { color: #739ADE; }
[data-theme="dark"] .ctg-card { background: #181F28; border: 1px solid #32435D; }
[data-theme="dark"] .ctg-card:hover { border-color: #32435D; box-shadow: 0 6px 18px rgba(0,0,0,0.28); }
[data-theme="dark"] .ctg-card:focus-within { border-color: #2D4976; }
[data-theme="dark"] .ctg-hit:focus-visible { outline: 2px solid var(--color-primary, #4C89F2); }
[data-theme="dark"] .ctg-l { border-right: 1px solid var(--ctg-rule); }
[data-theme="dark"] .ctg-name b { color: var(--color-navy, #E2E4E9); }
[data-theme="dark"] .ctg-primary { background: #0D1118; color: #739ADE; }
[data-theme="dark"] .ctg-role { color: #A1ACC4; }
[data-theme="dark"] .ctg-mk-label { color: var(--ctg-label); }
[data-theme="dark"] .ctg-mk { background: var(--ctg-panel); }
[data-theme="dark"] .ctg-mk.is-empty { color: var(--ctg-faint); }
[data-theme="dark"] .ctg-mk-more { border: 0; background: #0D1118; color: #739CDE; }
[data-theme="dark"] .ctg-mk-more:hover { background: #12171E; }
[data-theme="dark"] .ctg-co-tile.is-none { background: #0D1118; color: #A5B1CA; }
[data-theme="dark"] .ctg-co-name { color: var(--color-navy, #E2E4E9); }
[data-theme="dark"] .ctg-co-name:hover { color: #739ADE; }
[data-theme="dark"] .ctg-co-name.is-none { color: #A5B1CA; }
[data-theme="dark"] .ctg-co-cat { color: #A1ACC4; }
[data-theme="dark"] .ctg-dot { background: currentColor; }
[data-theme="dark"] .ctg-pill.tone-green { background: #121E17; color: #77E9A1; }
[data-theme="dark"] .ctg-pill.tone-blue { background: #12171E; color: #739CDE; }
[data-theme="dark"] .ctg-pill.tone-amber { background: #1E1A12; color: #DEB173; }
[data-theme="dark"] .ctg-pill.tone-grey { background: #0D1118; color: #A0ABC5; }
[data-theme="dark"] .ctg-pill.tone-purple { background: #17121E; color: #9B73DE; }
[data-theme="dark"] .ctg-pill.tone-red { background: #1E1214; color: #DE737C; }
[data-theme="dark"] .ctg-card .ct-menu > button { border: 1px solid #32435D; background: #181F28; color: #99A7CC; }
[data-theme="dark"] .ctg-card .ct-menu > button:hover { background: #0D1118; }
[data-theme="dark"] .ctg-stats { background: var(--ctg-panel); }
[data-theme="dark"] .ctg-stat { border-left: 1px solid var(--ctg-rule); }
[data-theme="dark"] .ctg-stat-v { color: var(--color-navy, #E2E4E9); }
[data-theme="dark"] .ctg-stat-v .ctg-ic { color: #99A7CC; }
[data-theme="dark"] .ctg-stat-l { color: var(--ctg-label); }
[data-theme="dark"] .ctg-foot { border-top: 1px solid var(--ctg-rule); background: var(--ctg-foot-bg); }
[data-theme="dark"] .ctg-ch-link { color: #E2E4E9; }
[data-theme="dark"] .ctg-ch-link:hover { color: #739ADE; }
[data-theme="dark"] .ctg-ch-link .ctg-ic { color: #73AEDE; }
[data-theme="dark"] .ctg-ch-none { color: #A5B1CA; }
[data-theme="dark"] .ctg-copy { border: 0; background: none; color: #A5B1CA; }
[data-theme="dark"] .ctg-copy:hover { background: #0D1218; color: #739ADE; }
[data-theme="dark"] .ctg-when { border-left: 1px solid var(--ctg-rule); }
[data-theme="dark"] .ctg-when-item .ctg-ic { color: #73AEDE; }
[data-theme="dark"] .ctg-when-b b { color: var(--color-navy, #E2E4E9); }
[data-theme="dark"] .ctg-when-b em { color: #9DA9C8; }
[data-theme="dark"] .ctg-when-item.is-follow.tone-today .ctg-ic, [data-theme="dark"] .ctg-when-item.is-follow.tone-overdue .ctg-ic { color: #DE737A; }
[data-theme="dark"] .ctg-when-item.is-follow.tone-today b, [data-theme="dark"] .ctg-when-item.is-follow.tone-overdue b { color: #DE737A; }
[data-theme="dark"] .ctg-when-item.is-follow.tone-tomorrow .ctg-ic { color: #73DE9A; }
[data-theme="dark"] .ctg-when-item.is-follow.tone-tomorrow b { color: #77E9A1; }
[data-theme="dark"] .ctg-when-item.is-follow.tone-later .ctg-ic { color: #739ADE; }
[data-theme="dark"] .ctg-when-item.is-follow.tone-none .ctg-ic { color: #A5B1CA; }
[data-theme="dark"] .ctg-setone { border: 0; background: none; color: #739ADE; }
[data-theme="dark"] .page-accounts .aag { --aag-line: #12171E; --aag-div: #12171E; --aag-ink: #E2E3E9; --aag-label: #7989AC; --aag-mono: #E2E3E9; --aag-strip: #0D1118; --aag-strip-line: #12171E; --aag-blue: #447DE9; --aag-field: #181F28; --aag-card: #181F28; --aag-reset: #E13854; }
[data-theme="dark"] .page-accounts .aag-top-ic { background: #121E18; color: #74ECB0; }
[data-theme="dark"] .page-accounts .aag-title { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-sub { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-btn { border: 1px solid transparent; }
[data-theme="dark"] .page-accounts .aag-btn-ghost { background: #181F28; border-color: var(--aag-line); color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-btn-ghost:hover { background: #0D1118; border-color: #32435D; }
[data-theme="dark"] .page-accounts .aag-btn-primary { background: #1668F5; color: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.65); }
[data-theme="dark"] .page-accounts .aag-btn-primary:hover { background: #0F5BDD; }
[data-theme="dark"] .page-accounts .aag-headmenu > .btn-icon { border: 1px solid var(--aag-line); background: #181F28; color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-strip { border: 1px solid var(--aag-line); background: #181F28; }
[data-theme="dark"] .page-accounts .aag-s { border-left: 1px solid var(--aag-div); }
[data-theme="dark"] .page-accounts .aag-s b { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-s span:not(.aag-s-ic):not(.aag-s-chg):not(.aag-spark) { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-blue { background: #12171E; color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-green { background: #121E17; color: #82F3B5; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-amber { background: #1E1A12; color: #DEB673; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-red { background: #1E1214; color: #DE737C; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-purple { background: #15121E; color: #8F68ED; }
[data-theme="dark"] .page-accounts .aag-s-chg.is-up { background: #121E17; color: #73DEA1; }
[data-theme="dark"] .page-accounts .aag-s-chg.is-down { background: #1E1214; color: #DE737F; }
[data-theme="dark"] .page-accounts .aag-spark i { background: #7BD9A3; }
[data-theme="dark"] .page-accounts .aag-spark i.is-now { background: #16A34A; }
[data-theme="dark"] .page-accounts .aag-tabs { border-bottom: 1px solid var(--aag-div); }
[data-theme="dark"] .page-accounts .aag-tab { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-tab:hover { background: #0D1118; }
[data-theme="dark"] .page-accounts .aag-tab.is-active { background: #12171E; color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-tab.is-active::after { background: #1A6BF2; }
[data-theme="dark"] .page-accounts .aag-tab-n { background: #12171E; color: #93A2D2; }
[data-theme="dark"] .page-accounts .aag-tab.is-active .aag-tab-n { background: #12171E; color: #7396DE; }
[data-theme="dark"] .page-accounts .aag-tab-n.tone-red { background: #1E1214; color: #DE737F; }
[data-theme="dark"] .page-accounts .aag-search { border: 1px solid var(--aag-line); background: var(--aag-field); color: #99A7CC; }
[data-theme="dark"] .page-accounts .aag-search input { border: 0; background: none; outline: none; color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-search input::placeholder { color: #A5ADC0; }
[data-theme="dark"] .page-accounts .aag-search:focus-within { border-color: #2D4876; box-shadow: 0 0 0 3px rgba(0,0,0,0.312); }
[data-theme="dark"] .page-accounts .aag-sel { border: 1px solid var(--aag-line); background: var(--aag-field); }
[data-theme="dark"] .page-accounts .aag-sel select { border: 0; background: none; color: var(--aag-ink); outline: none; }
[data-theme="dark"] .page-accounts .aag-sel .aa-select-caret { color: #93A2D2; }
[data-theme="dark"] .page-accounts .aag-sel:focus-within { border-color: #2D4876; }
[data-theme="dark"] .page-accounts .aag-more { border: 1px solid var(--aag-line); background: var(--aag-field); color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-more:hover, [data-theme="dark"] .page-accounts .aag-more.is-on { border-color: #32425D; background: #0D1118; }
[data-theme="dark"] .page-accounts .aag-reset { border: 1px solid transparent; color: var(--aag-reset); }
[data-theme="dark"] .page-accounts .aag-reset:hover { background: #180D0F; border-color: #5D323A; }
[data-theme="dark"] .page-accounts .aag-reset:focus-visible { outline: 2px solid var(--aag-reset); }
[data-theme="dark"] .page-accounts .aag-viewbtn { border: 1px solid var(--aag-line); background: var(--aag-field); color: #93A2D2; }
[data-theme="dark"] .page-accounts .aag-viewbtn:hover { background: #0D1118; }
[data-theme="dark"] .page-accounts .aag-viewbtn.is-active { background: #1A6BF2; border-color: #1A6BF2; color: #fff; }
[data-theme="dark"] .page-accounts .aag-sortbtn { border: 1px solid var(--aag-line); background: var(--aag-field); color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-sortbtn .icon { color: #93A2D2; }
[data-theme="dark"] .page-accounts .aag-morebar { border: 1px solid var(--aag-line); background: #181F28; box-shadow: var(--shadow-md); }
[data-theme="dark"] .page-accounts .aag-chip { background: #12171E; color: #7394DE; }
[data-theme="dark"] .page-accounts .aag-chip:hover { background: #12171E; }
[data-theme="dark"] .page-accounts .aag-clear { color: #7394DE; }
[data-theme="dark"] .page-accounts .aag-card { border: 1px solid var(--aag-line); background: var(--aag-card); }
[data-theme="dark"] .page-accounts .aag-card:hover { border-color: #2D4876; box-shadow: 0 4px 16px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-accounts .aag-card:focus-within { border-color: #2D4876; }
[data-theme="dark"] .page-accounts .aag-logo-tile { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-accounts .aag-name { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-name:hover { color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-verified { color: #73DE9A; }
[data-theme="dark"] .page-accounts .aag-cat { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-status i { background: currentColor; }
[data-theme="dark"] .page-accounts .aag-status.tone-green { background: #121E17; color: #67EEA0; }
[data-theme="dark"] .page-accounts .aag-status.tone-grey { background: #12171E; color: #A2ADC3; }
[data-theme="dark"] .page-accounts .aag-status.tone-amber { background: #1E1A12; color: #FAB871; }
[data-theme="dark"] .page-accounts .aag-card .aa-rowmenu > .btn-icon { border: 1px solid var(--aag-line); background: #181F28; color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-card .aa-rowmenu > .btn-icon:hover, [data-theme="dark"] .page-accounts .aag-card .aa-rowmenu.is-open > .btn-icon { background: #0D1118; border-color: #32435D; color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-body { border-bottom: 1px solid var(--aag-div); }
[data-theme="dark"] .page-accounts .aag-cred { border-right: 1px solid var(--aag-div); }
[data-theme="dark"] .page-accounts .aag-cred dt { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-mono { color: var(--aag-mono); }
[data-theme="dark"] .page-accounts .aag-secret[data-masked="1"] { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-copy { border: 0; background: none; color: #93A2D2; }
[data-theme="dark"] .page-accounts .aag-copy:hover { background: #0D1118; color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-copy:focus-visible { outline: 2px solid #4D8BF2; }
[data-theme="dark"] .page-accounts .aag-none { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-lbl { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-terms b { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-pill.tone-amber { background: #1E1A12; color: #DEA373; }
[data-theme="dark"] .page-accounts .aag-pill.tone-blue { background: #12171E; color: #7394DE; }
[data-theme="dark"] .page-accounts .aag-pill.tone-red { background: #1E1213; color: #DE737D; }
[data-theme="dark"] .page-accounts .aag-pill.tone-purple { background: #110D18; color: #9C73DE; }
[data-theme="dark"] .page-accounts .aag-pill.tone-teal { background: #121E1D; color: #73DED6; }
[data-theme="dark"] .page-accounts .aag-geo { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-geo .flag { box-shadow: 0 0 0 1px rgba(0,0,0,0.28); }
[data-theme="dark"] .page-accounts .aag-geo em { color: #7394DE; background: #12171E; }
[data-theme="dark"] .page-accounts .aag-links { background: var(--aag-strip); }
[data-theme="dark"] .page-accounts .aag-link + .aag-link { border-left: 1px solid var(--aag-strip-line); }
[data-theme="dark"] .page-accounts .aag-link-t span { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-link-t a { color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-link-t em { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-copybtn { border: 0; background: #12171E; color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-copybtn:hover { background: #12171E; }
[data-theme="dark"] .page-accounts .aag-copybtn:focus-visible { outline: 2px solid #4D8BF2; }
[data-theme="dark"] .page-accounts .aag-metrics { border-top: 1px solid var(--aag-div); border-bottom: 1px solid var(--aag-div); }
[data-theme="dark"] .page-accounts .aag-m { border-left: 1px solid var(--aag-div); }
[data-theme="dark"] .page-accounts .aag-m-top b { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-m-l { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-trend.is-up { color: #78E9A2; }
[data-theme="dark"] .page-accounts .aag-trend.is-down { color: #DE7373; }
[data-theme="dark"] .page-accounts .aag-mgr-t b { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-mgr-t span { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-tg { border: 1px solid var(--aag-line); background: #181F28; }
[data-theme="dark"] .page-accounts .aag-tg-link { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-tg-link:hover { color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-tg-ic { background: #229ED9; }
[data-theme="dark"] .page-accounts .aag-tg .aag-copy { color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-last { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-data i { background: currentColor; box-shadow: 0 0 0 2px rgba(0,0,0,0.468); }
[data-theme="dark"] .page-accounts .aag-data.tone-green { background: #121E17; color: #73DEA1; }
[data-theme="dark"] .page-accounts .aag-data.tone-amber { background: #1E1A12; color: #FAB871; }
[data-theme="dark"] .page-accounts .aag-data.tone-red { background: #1E1214; color: #DE737F; }
[data-theme="dark"] .page-accounts .aag-view { color: #7398DE; }
[data-theme="dark"] .page-accounts .aag-empty { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-empty h2 { color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-showing { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-page { border: 1px solid var(--aag-line); background: #181F28; color: var(--aag-ink); }
[data-theme="dark"] .page-accounts .aag-page:hover { background: #0D1118; }
[data-theme="dark"] .page-accounts .aag-page.is-active { background: #101A3F; border-color: #101A3F; color: #fff; }
[data-theme="dark"] .page-accounts .aag-page-gap { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-per { color: var(--aag-label); }
[data-theme="dark"] .page-accounts .aag-per-sel { border: 1px solid var(--aag-line); background: #181F28; }
[data-theme="dark"] .page-accounts .aag-per-sel select { border: 0; background: none; color: var(--aag-ink); }
[data-theme="dark"] .aa-chip-pay { background: #0D1218; color: #739ADE; }
[data-theme="dark"] .aa-chip-pay em { color: #98ADCD; }
[data-theme="dark"] .aa-hint { color: #A3ACC2; }
[data-theme="dark"] .aa-pay-foot { border-top: 1px solid var(--cmp-line); }
[data-theme="dark"] .aa-pay-life-ic { background: #0D1813; color: #61F1A0; }
[data-theme="dark"] .aa-pay-life-l { color: #A3ACC2; }
[data-theme="dark"] .aa-pay-life-v { color: var(--cmp-navy); }
[data-theme="dark"] .aa-pay-life-s { color: #A3ACC2; }
[data-theme="dark"] .aa-promo-code { color: var(--cmp-navy); background: #0D1118; border: 1px solid #32445D; }
[data-theme="dark"] .aa-promo-seen { background: #18140D; color: #F4BF72; }
[data-theme="dark"] .aa-promo-seen-btn { border: 1px solid #765F2D; background: #181F28; color: #F4BF72; }
[data-theme="dark"] .aa-promo-seen-btn:hover { background: #1E1A12; }
[data-theme="dark"] .plr-meta { color: var(--cmp-navy); }
[data-theme="dark"] .plr-meta em { color: #A3ACC2; }
[data-theme="dark"] .plr-filters { background: #181F28; border: 1px solid var(--cmp-line); }
[data-theme="dark"] .plr-sel { border: 1px solid var(--cmp-line); background: #0D1118; color: var(--cmp-navy); }
[data-theme="dark"] .plr-sel select { border: 0; background: transparent; color: inherit; }
[data-theme="dark"] .plr-check { color: var(--cmp-navy); }
[data-theme="dark"] .plr-check.is-hot span { color: #DE7A73; }
[data-theme="dark"] .plr-search { border: 1px solid var(--cmp-line); background: #181F28; color: #A3ACC2; }
[data-theme="dark"] .plr-search input { border: 0; background: transparent; color: var(--cmp-navy); outline: 0; }
[data-theme="dark"] .plr-mini th { color: #A3ACC2; border-bottom: 1px solid var(--cmp-line); }
[data-theme="dark"] .plr-mini td { border-bottom: 1px solid #2B3A50; color: var(--cmp-navy); }
[data-theme="dark"] .plr-mini tr.is-on td { background: #0D1118; }
[data-theme="dark"] .plr-mini td small, [data-theme="dark"] .plr-table small.plr-sub { color: #A3ACC2; }
[data-theme="dark"] .plr-mini code, [data-theme="dark"] .plr-table code { color: var(--cmp-navy); }
[data-theme="dark"] .plr-link { color: inherit; }
[data-theme="dark"] .plr-link:hover code, [data-theme="dark"] .plr-link:hover span { color: var(--cmp-blue); }
[data-theme="dark"] .plr-none { color: #A3ACC2; }
[data-theme="dark"] .plr-total td { border-top: 2px solid var(--cmp-line); background: #0D1118; }
[data-theme="dark"] .is-neg { color: #DE7A73 !important; }
[data-theme="dark"] .plr-table th { color: #A3ACC2; border-bottom: 1px solid var(--cmp-line); }
[data-theme="dark"] .plr-table th.is-sorted .plr-th { color: var(--cmp-blue); }
[data-theme="dark"] .plr-th { color: inherit; }
[data-theme="dark"] .plr-table td { border-bottom: 1px solid #2B3A50; color: var(--cmp-navy); }
[data-theme="dark"] .plr-hist { border: 1px solid var(--cmp-line); background: #0D1118; color: var(--cmp-navy); }
[data-theme="dark"] .plr-hist span { color: #A3ACC2; }
[data-theme="dark"] .plr-hist.is-on { border-color: var(--cmp-blue); background: #0D1118; }
[data-theme="dark"] .dropdown-item.is-muted { color: #A3ACC2; }
[data-theme="dark"] .cmp-kv-sub { color: #A3ACC2; }
[data-theme="dark"] .rp-btn-soft.is-on { background: #0D1218; color: #739ADE; border-color: #32445D; }
[data-theme="dark"] .rp-brandcell small { color: #A3ACC2; }
[data-theme="dark"] .rp-link { color: inherit; }
[data-theme="dark"] .rp-link:hover { color: var(--cmp-blue); }
[data-theme="dark"] .demo-bar { background: #1E1B12; color: #DEB573; border-bottom: 1px solid #765F2D; }
[data-theme="dark"] .demo-bar a { color: #739ADE; }
[data-theme="dark"] .demo-step { border: 1px solid var(--color-border); background: var(--color-surface); }
[data-theme="dark"] .demo-step span { color: var(--color-text-muted); }
[data-theme="dark"] .dash-pay-tile { border: 1px solid var(--color-border); background: var(--color-surface-2, #0D1118); }
[data-theme="dark"] .dash-pay-tile span { color: var(--color-text-muted); }
[data-theme="dark"] .dash-pay-tile strong { color: var(--color-text); }
[data-theme="dark"] .dash-pay-tile small { color: var(--color-text-faint); }
[data-theme="dark"] .dash-pay-tile.is-co { background: #0D1118; border-color: #32435D; }
[data-theme="dark"] .dash-pay-table tr.dash-pay-week td { background: #0D1118; color: var(--color-text); }
[data-theme="dark"] .dash-pay-table tr.dash-pay-week td .icon { color: var(--color-primary); }
[data-theme="dark"] .aa-mtable tfoot td { border-top: 1px solid var(--color-border); background: var(--color-surface-2, #0D1118); color: var(--color-text); }
[data-theme="dark"] .aa-mtable tfoot .c-month small { color: var(--color-text-faint); }
[data-theme="dark"] .page-company-profile .data-table tfoot td { border-top: 1px solid var(--color-border); background: var(--color-surface-2, #0D1118); }
[data-theme="dark"] .page-company-profile .data-table tfoot tr.is-paid td { border-top: 0; color: var(--color-text-muted); }
@media (max-width: 1023px) {
  [data-theme="dark"] .page-kc .kc-side.kf-side { background: #0D1118; box-shadow: var(--shadow-lg); }
  [data-theme="dark"] .page-kf .kf-side { box-shadow: var(--shadow-lg); }
}
@media (max-width: 1024px) {
  [data-theme="dark"] .tk-rail { border-left: 0; border-top: 1px solid #32435D; }
}
@media (max-width: 1099px) {
  [data-theme="dark"] body:not(.sidebar-expanded) .nav-item:hover::after { background: var(--color-navy); color: #fff; box-shadow: var(--shadow-md); }
}
@media (max-width: 1100px) {
  [data-theme="dark"] .pf-calc-cell { border-right: 0; border-bottom: 1px solid var(--pl-line); }
}
@media (max-width: 1200px) {
  [data-theme="dark"] .tk-panel { box-shadow: var(--shadow-lg); }
}
@media (max-width: 1279px) {
  [data-theme="dark"] .page-contacts .ctd-stat { border-left: 1px solid var(--cmp-line-soft); border-top: 1px solid var(--cmp-line-soft); }
  [data-theme="dark"] .page-kd .kd-rail { border-left: 0; border-top: 1px solid #32455D; }
  [data-theme="dark"] .page-reports .rp-panel.is-open { background: #181F28; }
}
@media (max-width: 1280px) {
  [data-theme="dark"] .cmp-panel { border: 0; box-shadow: var(--shadow-xl); }
}
@media (max-width: 1360px) {
  [data-theme="dark"] .rv-hero-side { border-left: 0; border-top: 1px solid rgba(255,255,255,.12); }
}
@media (max-width: 420px) {
  [data-theme="dark"] .page-deals .dlg-col-r { border-left: 0; border-top: 1px solid var(--dlg-div); }
}
@media (max-width: 560px) {
  [data-theme="dark"] .page-deals .dv-stat { border-top: 1px solid var(--cmp-line-soft); }
  [data-theme="dark"] .page-accounts .aag-s:nth-child(even) { border-left: 1px solid var(--aag-div); }
  [data-theme="dark"] .page-accounts .aag-cred { border-right: 0; border-bottom: 1px solid var(--aag-div); }
  [data-theme="dark"] .page-accounts .aag-link + .aag-link { border-left: 0; border-top: 1px solid var(--aag-strip-line); }
}
@media (max-width: 640px) {
  [data-theme="dark"] .cmp-metric, [data-theme="dark"] .cmp-rel-cell { border-right: 0; border-bottom: 1px solid var(--cmp-line-soft); }
}
@media (max-width: 767px) {
  [data-theme="dark"] .topbar .topbar-brand-mobile { color: var(--color-text); }
  [data-theme="dark"] .mobile-nav { background: var(--color-surface); border-top: 1px solid var(--color-border); }
  [data-theme="dark"] .mobile-nav-item { color: var(--color-text-muted); }
  [data-theme="dark"] .mobile-nav-item.is-active { color: var(--color-primary); }
  [data-theme="dark"] .sticky-actions { background: var(--color-surface); border-top: 1px solid var(--color-border); }
  [data-theme="dark"] .ww-rail { border-right: 0; border-bottom: 1px solid var(--color-divider); }
  [data-theme="dark"] .cw-rail { border-right: 0; border-bottom: 1px solid var(--color-divider); }
  [data-theme="dark"] .acw-rail { border-right: 0; border-bottom: 1px solid var(--color-divider); }
  [data-theme="dark"] .page-contacts .ctd-stat { border-left: 0 !important; border-top: 1px solid var(--cmp-line-soft); }
  [data-theme="dark"] .page-deals .dv-stat { border-left: 0; border-top: 1px solid var(--cmp-line-soft); }
  [data-theme="dark"] .ctg-l { border-right: 0; border-bottom: 1px solid var(--ctg-rule); }
  [data-theme="dark"] .ctg-when { border-left: 0; border-top: 1px solid var(--ctg-rule); }
}
@media (max-width: 767px) and (hover: none), (max-width: 480px) {
  [data-theme="dark"] .period-select .form-select, [data-theme="dark"] .period-select select { background: transparent; border: 0; box-shadow: none; }
}
@media (max-width: 900px) {
  [data-theme="dark"] .page-contacts .ctd-stat:nth-child(3n+1) { border-left: 1px solid var(--cmp-line-soft); }
  [data-theme="dark"] .page-contacts .ctd-stat:nth-child(-n+3) { border-top: 1px solid var(--cmp-line-soft); }
  [data-theme="dark"] .aa-stat { border-top: 1px solid #32445D; }
}

/* hand-written corrections (tools-dev/dark-overrides.css) */
/* Hand-written dark-theme corrections. Appended after the generated block, so these always win.
   Regenerate the whole layer with: tools/php/php tools-dev/build-dark.php */

/* The sidebar is dark by design in both themes — keep its own palette instead of inverting it. */
:root[data-theme="dark"] {
  --color-sidebar: #06111F; --color-sidebar-text: #93A2B8; --color-sidebar-hover: rgba(255,255,255,.06);
  --color-sidebar-active: #2F6BFF; --color-sidebar-promo: #0B1826; --color-sidebar-border: rgba(255,255,255,.08);
  /* the same three tiers the generator uses: ground < well < card, with borders that actually show */
  --color-bg: #0C1117; --color-surface: #181F28; --color-surface-muted: #10161D; --color-surface-hover: #1F2833;
  --color-border: #2B3644; --color-border-strong: #3B4A5E; --color-divider: #263140;
  --color-text: #E6EDF6; --color-text-secondary: #A9B8CC; --color-text-muted: #8494A8; --color-text-faint: #6B7A8D;
  color-scheme: dark;
}
[data-theme="dark"] body { background: var(--color-bg); color: var(--color-text); }

/* Sign-in, 2FA and the other pre-session screens keep their own art direction. */
[data-theme="dark"] body.auth-page {
  --color-bg: #F3F8FD; --color-surface: #FFFFFF; --color-surface-muted: #F1F5F9; --color-surface-hover: #F8FAFC;
  --color-border: #E5ECF4; --color-border-strong: #CBD5E1; --color-divider: #EDF2F7;
  --color-text: #0F172A; --color-text-secondary: #536987; --color-text-muted: #7B8CA6; --color-text-faint: #A0AEC2;
  --color-auth-primary: #059669; --color-auth-primary-hover: #047857;
  color-scheme: light;
}

/* Inputs, tables and menus: the generated pass colours them, these settle the details. */
[data-theme="dark"] .form-control, :root[data-theme="dark"] .form-select, :root[data-theme="dark"] select.form-control,
[data-theme="dark"] textarea.form-control, :root[data-theme="dark"] .input-group .form-control {
  background: var(--color-surface-muted); border-color: var(--color-border); color: var(--color-text);
}
[data-theme="dark"] .form-control::placeholder { color: var(--color-text-faint); }
[data-theme="dark"] img.brand-icon, :root[data-theme="dark"] .brand-tile img, :root[data-theme="dark"] .site-icon img { background: #FFFFFF12; }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #33404F; }
[data-theme="dark"] ::-webkit-scrollbar-track { background: transparent; }

/* The theme switch itself. */
.theme-toggle .icon-moon { display: none; }
[data-theme="dark"] .theme-toggle .icon-sun { display: none; }
[data-theme="dark"] .theme-toggle .icon-moon { display: block; }

/* ---- Reports & Analytics ----
   The dot-matrix world map is a field of small dots on the card, so the generated dark value
   sits too close to the card and the map disappears. Lift it to a readable slate, and warm the
   map tooltip which is a dark chip on a light card by design. */
[data-theme="dark"] .page-reports .rp-map .wm-dots circle { fill: #33415A; }
[data-theme="dark"] .page-reports .rp-maptip { background: #F1F5FB; color: #0F1F3D; }
[data-theme="dark"] .page-reports .rp-maptip span { opacity: .72; }
/* the funnel's carry-over labels sit on saturated bands in both themes */
[data-theme="dark"] .page-reports .rp-funnel-step { fill: #fff; }

/* Knowledge & Files — the neutral file-type tiles (Text, CSV, Link, Figma, folder inner) are drawn
   as inline SVG, so they follow the theme through these variables instead of the generated layer. */
:root[data-theme="dark"] {
  --kf-tile-card: #1B2129; --kf-tile-card-border: #2A323C; --kf-tile-neutral: #2B333D; --kf-tile-neutral-ink: #9BADC3;
  --kf-tile-mint: #10321F; --kf-tile-mint-ink: #3FD39A; --kf-tile-steel: #232B36; --kf-tile-slate: #55616F;
  --kf-folder-inner: #121A24;
}

/* Revenue / Performance (revenue session): the prefix-style filter selects keep their native text invisible — the ghost span shows the value. */
[data-theme="dark"] .pf-select .pl-select-prefix ~ select { color: transparent; }
[data-theme="dark"] .pf-select .pl-select-prefix ~ select option { color: var(--pl-ink); background: var(--color-surface); }
/* Key Insights highlights are plain coloured text, never a pill. */
[data-theme="dark"] .rv-insight-list b em { background: none; padding: 0; }

/* Tracking Links charts: the gradient under each line needs less opacity on a dark ground. */
[data-theme="dark"] .tl-dchart { --tl-area-op: 0.12; }

/* Dashboard: the select chevron is an inline SVG data URI, so the generator cannot recolour it, and the
   generated dark rule re-declares `background`, which resets repeat/position — restate all three here. */
[data-theme="dark"] .soft-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23A9B8CC' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
}
[data-theme="dark"] .period-input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23A9B8CC' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 2px center;
}

/* Chart colours drawn by JavaScript (assets/js/charts.js, payments-chart.js, account-chart.js, reports.js,
   link-detail.js). The generated pass flips these tokens, but a few need a hand: a pale bar fill mapped
   straight down turns almost black, and a grid line has to stay a hint rather than disappear. */
:root[data-theme="dark"] {
  --chart-grid: #212A34; --chart-grid-zero: #2B3644; --chart-grid-v: #1D242C; --chart-grid-strong: #2A3442;
  --chart-track: #2A3442; --chart-ring-track: #262F3B; --chart-crosshair: #55657A;
  --chart-prev-line: #4B5C72; --chart-prev-dot: #64748B; --chart-grey: #55636F;
  --chart-bar-soft: #2E4A7A; --chart-bar-soft-2: #4B3F86; --chart-dot-ring: #141A21;
}
:root[data-theme="dark"] .page-payments { --pay-ring-track: #1C3326; }

/* Reports — Partners tab: tinted tiles and pills that the generator flattens into the card */
[data-theme="dark"] .page-reports .rp-stat-icon.tone-blue { background: #14263F; color: #5C9BFF; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-green { background: #10301F; color: #34D07F; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-red { background: #351A1E; color: #FF6B7C; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-indigo { background: #1D1F3C; color: #8B93FF; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-amber { background: #332612; color: #F0A93C; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-purple { background: #241D3C; color: #A98BFF; }
[data-theme="dark"] .page-reports .rp-typepill { background: #232833; color: #9FB2D4; }
[data-theme="dark"] .page-reports .rp-mark { color: #fff; }
[data-theme="dark"] .page-reports .rp-method-more,
[data-theme="dark"] .page-reports .rp-ava-more { background: #262C39; color: #9FB2D4; }
[data-theme="dark"] .page-reports .rp-panel-desc { color: #93A4C6; }
[data-theme="dark"] .page-reports .rp-flag-more { background: #1D2B42; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-panel-x { border: 1px solid #262C39; background: #1B1B1B; color: #C7D2E4; }

/* Reports — Deals tab: pills the generator flattens into the card colour */
[data-theme="dark"] .page-reports .rp-namepill { background: #17273F; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-geo-more { background: #17273F; color: #6C9FF4; }
[data-theme="dark"] .page-reports .rp-dtab em { background: #262C39; color: #9FB2D4; }
[data-theme="dark"] .page-reports .rp-dtab.is-on em { background: #262C39; color: #9FB2D4; }
[data-theme="dark"] .page-reports .rp-typepill.tone-purple { background: #241D3C; color: #A98BFF; }
[data-theme="dark"] .page-reports .rp-typepill.tone-amber { background: #332612; color: #F0A93C; }

/* Reports — Tracking tab */
[data-theme="dark"] .page-reports .rp-tag { background: #262C39; color: #9FB2D4; }
[data-theme="dark"] .page-reports .rp-tbar { background: #262C39; }
[data-theme="dark"] .page-reports .rp-seg, [data-theme="dark"] .page-reports .rp-viewseg { background: #22262F; }
[data-theme="dark"] .page-reports .rp-openbtn, [data-theme="dark"] .page-reports .rp-fulldetails { background: #17273F; color: #6C9FF4; }

/* Tinted status surfaces (alert chips, callout cards, mini KPIs). The generated pass only converts the
   .card-scoped rules, so the same class on a .chip-stat or a bare div kept its light tint and ended up
   as light-on-light. Declared here without a scope so every element carrying the class is covered. */
[data-theme="dark"] .tinted-red { background: #221618; border-color: #43212A; }
[data-theme="dark"] .tinted-green { background: #10231A; border-color: #1E4433; }
[data-theme="dark"] .tinted-amber { background: #241D10; border-color: #4A3A16; }
[data-theme="dark"] .tinted-blue { background: #141D2E; border-color: #26364F; }
[data-theme="dark"] .tinted-purple { background: #1D172E; border-color: #342A4F; }
[data-theme="dark"] .tinted-red .l, [data-theme="dark"] .tinted-green .l,
[data-theme="dark"] .tinted-amber .l, [data-theme="dark"] .tinted-blue .l { color: var(--color-text-secondary); }

/* Reports — Trends tab */
[data-theme="dark"] .page-reports .rp-chip.is-up { background: #12301F; color: #34D07F; }
[data-theme="dark"] .page-reports .rp-chip.is-down { background: #351A1E; color: #FF6B7C; }
[data-theme="dark"] .page-reports .rp-headicon.tone-green { background: #10301F; color: #34D07F; }
[data-theme="dark"] .page-reports .rp-headicon.tone-amber { background: #332612; color: #F0A93C; }
[data-theme="dark"] .page-reports .rp-breaktable .rp-c-month { color: #6C9FF4; }

/* The active page button is navy-on-white in light mode. Inverting it literally gives a white blob on a
   dark page, so in dark it becomes the accent instead — same emphasis, right weight. */
[data-theme="dark"] .page-btn.is-active, [data-theme="dark"] .cmp-page.is-active,
[data-theme="dark"] .pl-pages .cmp-page.is-active, [data-theme="dark"] .pf-pages .cmp-page.is-active,
[data-theme="dark"] .aa-page.is-active, [data-theme="dark"] .pay-page.is-active,
[data-theme="dark"] .tl-page.is-active, [data-theme="dark"] .kf-page.is-active {
  background: var(--color-primary); border-color: var(--color-primary); color: #fff;
}
[data-theme="dark"] .page-btn.is-active:hover, [data-theme="dark"] .cmp-page.is-active:hover {
  background: var(--color-primary-hover); border-color: var(--color-primary-hover);
}
/* Same treatment for the other "dark pill" emphases that invert into white blocks. */
[data-theme="dark"] .btn-dark { background: var(--color-surface-muted); border-color: var(--color-border-strong); color: var(--color-text); }
[data-theme="dark"] .btn-dark:hover { background: var(--color-surface-hover); }

/* Reports — Custom Reports tab */
[data-theme="dark"] .page-reports .rp-segbtn.is-on { background: #1F6FEB; color: #fff; }
[data-theme="dark"] .page-reports .rp-mtile.is-on { border-color: #2A4A7A; background: #16202F; }
[data-theme="dark"] .page-reports .rp-mbox { border-color: #3A4459; background: #1B1B1B; }
[data-theme="dark"] .page-reports .rp-mtile.is-on .rp-mbox { border-color: #1F6FEB; background: #1F6FEB; }
[data-theme="dark"] .page-reports .rp-switch { background: #3A4459; }
[data-theme="dark"] .page-reports .rp-switchrow input:checked + .rp-switch { background: #1F6FEB; }
[data-theme="dark"] .page-reports .rp-stepno { background: #1F6FEB; color: #fff; }
[data-theme="dark"] .page-reports .rp-generate { background: #1F6FEB; color: #fff; }
[data-theme="dark"] .page-reports .rp-stat-icon.tone-slate { background: #262C39; color: #9FB2D4; }
[data-theme="dark"] .page-reports .rp-customtable .rp-c-date { color: #6C9FF4; }

/* ------------------------------------------------------------------------------------------------
   Dark-mode text-contrast pass (2026-09-18, from tools-dev/contrast-audit.js over all 80 pages).
   Three things the generator cannot see, fixed here:
     1. tokens whose dark value landed just under WCAG AA for body text;
     2. accent tokens used as button/pill fills — white text needs them to keep their light lightness;
     3. components whose background comes from an inline style (brand tiles, avatars, letter tiles),
        so the generator darkens their white ink into the background.
   ------------------------------------------------------------------------------------------------ */

/* 1 + 2. tokens */
:root[data-theme="dark"] {
  --color-text-faint: #8A99AD;              /* timestamps and hints: 3.4 → 5.0 on the card surface */
  --color-primary-text: #7FA9FF;            /* links, active tabs, card actions: 4.3 → 7.2 */
  --color-success-text: #4ADE80; --color-danger-text: #FCA5A5; --color-warning-text: #FCD34D;
  --color-info-text: #7DD3FC; --color-purple-text: #C4B5FD; --color-orange-text: #FDBA74;
  --color-pink-text: #F9A8D4; --color-teal-text: #5EEAD4; --color-slate-text: #CBD5E1;
  /* fills that carry white text keep their light-theme lightness */
  --color-primary: #2563EB; --color-primary-hover: #1D4ED8; --color-primary-active: #1E40AF;
  --color-success: #16A34A; --color-success-hover: #15803D;
  --color-danger: #DC2626; --color-danger-hover: #B91C1C;
  --color-warning: #D97706; --color-info: #0284C7; --color-purple: #7C3AED;
  --color-orange: #EA580C; --color-pink: #DB2777; --color-teal: #0D9488;
  --color-sidebar-active: #2563EB;          /* white nav label: 4.49 → 5.17 */
}

/* 3. white ink on a background that is painted inline or by a sibling rule */
[data-theme="dark"] .skip-link { background: #0F172A; color: #fff; }
[data-theme="dark"] .sidebar .avatar, [data-theme="dark"] .topbar .avatar { background: #334155; color: #fff; }
[data-theme="dark"] .topbar .avatar { background: #3E4C60; }
[data-theme="dark"] .avatar { background: #2A3444; color: #C7D6EC; }
[data-theme="dark"] .avatar img { opacity: 1; }
[data-theme="dark"] .tk-letter, [data-theme="dark"] .kf-av, [data-theme="dark"] .rp-mdisc, [data-theme="dark"] .cmp-gcard-logo { color: #fff; }
/* brand tiles keep the ink PHP picked for their colour (readable_ink), so light brand colours stay legible */
[data-theme="dark"] .site-icon, [data-theme="dark"] .brand { color: var(--brand-fg, #fff); }
[data-theme="dark"] .brand { color: var(--brand-fg, #fff); }
/* the module sidebar's storage card is dark by design in both themes */
[data-theme="dark"] .kf-storage { background: #0C1E31; border-color: rgba(255,255,255,.08); }
[data-theme="dark"] .kf-storage-head strong { color: #fff; }
[data-theme="dark"] .kf-storage-head .kf-i { color: #E2E8F0; }
[data-theme="dark"] .kf-storage-line { color: #93A4BC; }
[data-theme="dark"] .kf-storage-bar { background: #1B3450; }
[data-theme="dark"] .kf-storage-bar > span { background: #1F6BFF; }
[data-theme="dark"] .kf-storage-btn { background: #17304C; color: #E8EFF9; }
[data-theme="dark"] .kf-storage-btn:hover { background: #1E3C5E; }
/* the PSD tile is nearly black: lift it so the "Ps" mark stays visible on a dark row */
:root[data-theme="dark"] { --kf-tile-navy: #2C4767; }

/* Geography — the coloured tiles and the map scale stay vivid in the dark theme */
[data-theme="dark"] .geo-stat-icon.tone-green  { background: linear-gradient(158deg, #0FA870 6%, #077F55 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-blue   { background: linear-gradient(158deg, #3C82E8 6%, #1D5BC4 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-purple { background: linear-gradient(158deg, #9A63E0 6%, #7134D4 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-orange { background: linear-gradient(158deg, #E08B3E 6%, #C96510 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-red    { background: linear-gradient(158deg, #D4545C 6%, #B4323F 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-teal   { background: linear-gradient(158deg, #22AE9A 6%, #0A8C77 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-amber  { background: linear-gradient(158deg, #D8A72F 6%, #B2810A 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-grey   { background: linear-gradient(158deg, #6C7A90 6%, #4E5A6D 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-indigo { background: linear-gradient(158deg, #6A72E0 6%, #4038C0 96%); color: #fff; }
[data-theme="dark"] .geo-stat-icon.tone-amber.is-soft { background: linear-gradient(155deg, #3A2E18, #241D10); color: #E9A33C; }
[data-theme="dark"] .geo-cmp-icon.tone-green  { background: linear-gradient(158deg, #0FA870, #077F55); color: #fff; }
[data-theme="dark"] .geo-cmp-icon.tone-blue   { background: linear-gradient(158deg, #3C82E8, #1D5BC4); color: #fff; }
[data-theme="dark"] .geo-cmp-icon.tone-purple { background: linear-gradient(158deg, #9A63E0, #7134D4); color: #fff; }
[data-theme="dark"] .geo-cmp-icon.tone-orange { background: linear-gradient(158deg, #E08B3E, #C96510); color: #fff; }
[data-theme="dark"] .geo-cmp-icon.tone-red    { background: linear-gradient(158deg, #D4545C, #B4323F); color: #fff; }
[data-theme="dark"] .geo-cmp-icon.tone-teal   { background: linear-gradient(158deg, #22AE9A, #0A8C77); color: #fff; }
[data-theme="dark"] .geo-page-icon.tone-green  { background: linear-gradient(155deg, #14301F, #0E2118); color: #2FCE8C; }
[data-theme="dark"] .geo-page-icon.tone-blue   { background: linear-gradient(155deg, #16263F, #101B2C); color: #68A6F8; }
[data-theme="dark"] .geo-page-icon.tone-indigo { background: linear-gradient(155deg, #1D1F3C, #14162B); color: #8B8FF5; }
[data-theme="dark"] .geo-page-icon.tone-orange { background: linear-gradient(155deg, #33240F, #22180B); color: #F0964A; }
[data-theme="dark"] .geo-page-icon.tone-red    { background: linear-gradient(155deg, #331A1D, #221114); color: #F4737F; }
[data-theme="dark"] .geo-page-icon.tone-teal   { background: linear-gradient(155deg, #10302B, #0B211D); color: #2FD0B6; }
/* the choropleth scale: the light theme's darkest green reads as white after the flip */
[data-theme="dark"] .page-geography { --geo-b0: #0B6E4E; --geo-b1: #12A56C; --geo-b2: #2C7D62; --geo-b3: #26604F; --geo-b4: #1B2433; }
[data-theme="dark"] .geo-mapwrap.mode-coverage { --geo-b3: #4A5233; }
[data-theme="dark"] .geo-mapwrap.mode-restrictions { --geo-b0: #C0394A; --geo-b1: #B9832A; --geo-b2: #13924F; --geo-b3: #4A5568; --geo-b4: #1B2433; }
[data-theme="dark"] .geo-c { stroke: #131A26; }
[data-theme="dark"] .geo-tip.is-dark { background: #0A1220; border-color: #223349; }
[data-theme="dark"] .geo-cmp-tab.is-on, [data-theme="dark"] .geo-cmp-add, [data-theme="dark"] .geo-cmp-ctabtn { background: #1F6FEB; color: #fff; }
[data-theme="dark"] .geo-cmp-period .geo-seg-btn.is-on { background: #0A1220; color: #fff; }
[data-theme="dark"] .geo-seg-btn.is-on { background: #1B3358; color: #7FB0FA; }
[data-theme="dark"] .geo-cta-btn { background: #0FA870; color: #fff; }
[data-theme="dark"] .geo-cell.st-available { background: #12A56C; }
[data-theme="dark"] .geo-cell.st-restricted { background: #C0394A; }
[data-theme="dark"] .geo-cell { background: #3A4459; }
[data-theme="dark"] .geo-break-bar .seg-r { background: #C0394A; }
[data-theme="dark"] .geo-break-bar .seg-p { background: #B9832A; }
[data-theme="dark"] .geo-break-bar .seg-a { background: #13924F; }
[data-theme="dark"] .geo-page.is-on { background: #1F6FEB; border-color: #1F6FEB; color: #fff; }

/* The module palettes use ONE token for both the fill and the ink (--pl-blue paints the active tab and
   also writes the count next to it), so the token itself has to stay light enough to read on a dark
   card. The handful of fills that carry white text are darkened here instead. */
[data-theme="dark"] .pl-tab.is-active, [data-theme="dark"] .pl-seg-btn.is-active,
[data-theme="dark"] .pf-chip.is-active, [data-theme="dark"] .rv-tab.is-active,
[data-theme="dark"] .aa-tab.is-active, [data-theme="dark"] .tl-seg-b.is-on,
[data-theme="dark"] .kf-new, [data-theme="dark"] .kf-btn-primary, [data-theme="dark"] .kf-vt.is-active,
[data-theme="dark"] .tk-cal-cell.is-today .tk-cal-num, [data-theme="dark"] .seg-tab.is-active,
[data-theme="dark"] .rp-viewsegbtn.is-on, [data-theme="dark"] .page-reports .rp-viewsegbtn.is-on {
  background: #1B5CEA; border-color: #1B5CEA; color: #fff;
}
[data-theme="dark"] .pl-tab.is-active .pl-tab-count, [data-theme="dark"] .aa-tab.is-active .aa-tab-n,
[data-theme="dark"] .pf-chip.is-active .pf-chip-count, [data-theme="dark"] .seg-tab.is-active .seg-count {
  background: rgba(0,0,0,.26); color: #fff;
}
[data-theme="dark"] .kf-new:hover, [data-theme="dark"] .kf-btn-primary:hover { background: #164FCD; }
/* soft status pills read their ink from the -text token, not the fill token */
[data-theme="dark"] .tk-status-pill.tone-purple { color: var(--color-purple-text); }

/* The shell avatars are a pale grey-blue with white text in the light sheet (2.6–3.1 there too).
   On a dark topbar/sidebar they also looked like a light hole, so they go dark-slate here. */
[data-theme="dark"] .sidebar-user .avatar { background: #2F3B4D; color: #fff; }
[data-theme="dark"] .topbar-user .topbar-avatar > .avatar { background: #3A4759; color: #fff; }
/* module primary buttons: same treatment as the other accent fills that carry white text */
[data-theme="dark"] .cmp-btn-primary, [data-theme="dark"] .pl-btn-primary, [data-theme="dark"] .aa-btn-primary,
[data-theme="dark"] .tl-btn-primary, [data-theme="dark"] .pf-btn-primary, [data-theme="dark"] .rv-btn-primary,
[data-theme="dark"] .dl-btn-primary, [data-theme="dark"] .pay-btn-primary, [data-theme="dark"] .ct-btn-primary,
[data-theme="dark"] .tk-newtask-main, [data-theme="dark"] .rp-btn-primary {
  background: #1B5CEA; border-color: #1B5CEA; color: #fff;
}

/* Reports — Overview v2: the choropleth scale, bright-for-more on a dark ground */
:root[data-theme="dark"] {
  --chart-geo-4: #7CB0FF; --chart-geo-3: #4A8BF5; --chart-geo-2: #2A61D4;
  --chart-geo-1: #1E3E86; --chart-geo-0: #222A36;
}
[data-theme="dark"] .page-reports .rp-country { stroke: #151A22; }
[data-theme="dark"] .page-reports .rp-insightbar { background: #17273F; }
[data-theme="dark"] .page-reports .rp-insightbar:hover { background: #1B2E4A; }
[data-theme="dark"] .page-reports .rp-ovcta { background: #17273F; }
[data-theme="dark"] .page-reports .rp-ovcta:hover { background: #1B2E4A; }
[data-theme="dark"] .page-reports .rp-fnote { background: #17273F; }
[data-theme="dark"] .page-reports .rp-ovmetric { background: #22262F; color: #9FB2D4; }
[data-theme="dark"] .page-reports .rp-ovmetric.is-on { background: #2563EB; color: #fff; }

/* Companies / Affiliate Accounts — text ramp.
   The generated pass flips each token on its own, so --cmp-label (the darker, more prominent
   tone in the light sheet) came out darker than --cmp-muted here too, which inverts the
   hierarchy and drops the tile labels to 3.3:1. Restate the ramp so prominence = lightness. */
[data-theme="dark"] .page-companies, [data-theme="dark"] .page-accounts {
  --cmp-navy: #E8EDF6; --cmp-ink: #D2DAE7; --cmp-label: #A8B4C8; --cmp-muted: #8E9BB0;
  --cmp-faint: #78859A; --cmp-since: #93A7CE;
}
[data-theme="dark"] .cmp-table thead th { color: #A2AEC3; }
[data-theme="dark"] .cmp-tab { background: #1A222E; color: #AFBED6; }
[data-theme="dark"] .cmp-tab:hover { background: #1F2937; }
[data-theme="dark"] .cmp-tab-count { background: #0F151D; color: #C6D2E6; }
[data-theme="dark"] .cmp-tab.is-active { background: #1B5CEA; color: #fff; }
[data-theme="dark"] .cmp-tab.is-active .cmp-tab-count { background: rgba(255,255,255,.22); color: #fff; }

/* Contacts → Grid card zones. The light tints (#F4F7FC / #F8FAFD) are both near-white, so the
   generator collapses them onto the card surface and the card loses its three zones in dark. */
[data-theme="dark"] .page-contacts { --ctg-rule: #232C38; --ctg-panel: #1A212A; --ctg-foot-bg: #171D25; --ctg-label: #93A0B4; --ctg-faint: #7E8A9C; }
/* the amber "WAITING" pill keeps its light-theme dark ink — the generator flips it to near-white */
[data-theme="dark"] .tk-status-pill.tone-amber { background: #F5B324; color: #4A2F00; }
[data-theme="dark"] .tk-status-pill.tone-amber .tk-circle { color: #4A2F00; }

/* Deals → Grid view and the reset control */
[data-theme="dark"] .page-deals { --dlg-line: #263142; --dlg-div: #212B38; --dlg-label: #97A3B8; --dlg-ink: #E6EBF3; --dlg-field: #141A21; --dlg-chip: #1A2A45; --dlg-chip-ink: #8DB6FF; --dl-reset: #FF8A9B; }
[data-theme="dark"] .page-deals .dlg-card { background: #141A21; }
[data-theme="dark"] .page-deals .dlg-card:hover { border-color: #3B5A8C; box-shadow: 0 6px 20px rgba(0,0,0,.35); }
[data-theme="dark"] .page-deals .dlg-logo-tile { box-shadow: 0 0 0 1px rgba(255,255,255,.10); }
[data-theme="dark"] .page-deals .dlg-tab:hover { background: #1A212A; }
[data-theme="dark"] .page-deals .dlg-tab.is-active { background: #17294A; color: #8DB6FF; }
[data-theme="dark"] .page-deals .dlg-tab-count { background: #222B38; color: #B7C3D6; }
[data-theme="dark"] .page-deals .dlg-tab.is-active .dlg-tab-count { background: #1F3A66; color: #CFE0FF; }
[data-theme="dark"] .page-deals .dlg-sel.is-set, [data-theme="dark"] .page-deals .dlg-more:hover, [data-theme="dark"] .page-deals .dlg-more.is-on { background: #172233; border-color: #35527E; }
[data-theme="dark"] .page-deals .dlg-viewbtn { color: #B7C3D6; }
[data-theme="dark"] .page-deals .dlg-viewbtn:hover { background: #1A212A; }
[data-theme="dark"] .page-deals .dlg-viewbtn.is-active { background: #1B5CEA; color: #fff; }
[data-theme="dark"] .page-deals .dlg-chip:hover { background: #22375A; }
[data-theme="dark"] .page-deals .dlg-card .dl-menu .btn-icon { background: #1A212A; color: #D5DDEA; }
[data-theme="dark"] .page-deals .dlg-card .dl-menu .btn-icon:hover, [data-theme="dark"] .page-deals .dlg-card .dl-menu.is-open .btn-icon { background: #1F3A66; border-color: #35527E; color: #fff; }
[data-theme="dark"] .page-deals .dlg-copy { color: #A9B6CA; }
[data-theme="dark"] .page-deals .dlg-copy:hover { background: #1F2A3A; color: #8DB6FF; }
[data-theme="dark"] .page-deals .dlg-geo-more { background: #1A2A45; color: #8DB6FF; }
[data-theme="dark"] .page-deals .dlg-trend.is-up { color: #4ADE80; }
[data-theme="dark"] .page-deals .dlg-trend.is-down { color: #F87171; }
[data-theme="dark"] .page-deals .dlg-dates, [data-theme="dark"] .page-deals .dlg-cal, [data-theme="dark"] .page-deals .dlg-arrow, [data-theme="dark"] .page-deals .dlg-dates .is-open { color: #B7C3D6; }
[data-theme="dark"] .page-deals .dlg-days.tone-green { background: #12301F; color: #6EE7A0; }
[data-theme="dark"] .page-deals .dlg-days.tone-grey { background: #222B38; color: #B7C3D6; }
[data-theme="dark"] .page-deals .dlg-days.tone-red { background: #3A1820; color: #FF9AAA; }
[data-theme="dark"] .page-deals .dlg-days.tone-amber { background: #35260F; color: #FBBF5B; }
[data-theme="dark"] .page-deals .dlg-view { background: #141A21; border-color: #2C4166; color: #8DB6FF; }
[data-theme="dark"] .page-deals .dlg-view:hover { background: #17294A; border-color: #3B5A8C; }
[data-theme="dark"] .page-deals .dl-reset:hover { background: #3A1820; border-color: #5A2530; }
[data-theme="dark"] .page-deals .dl-reset:focus-visible { outline-color: #FF8A9B; }
[data-theme="dark"] .page-deals .dlg-search input::placeholder { color: #8390A6; }
/* New Agreement form: white numerals / segment text on a lightened blue were 3.4:1 */
[data-theme="dark"] .page-deals .df-num, [data-theme="dark"] .page-deals .df-seg-item.is-on { background: #1B5CEA; border-color: #1B5CEA; color: #fff; }

/* Affiliate Accounts → Grid view */
[data-theme="dark"] .page-accounts .aag { --aag-line: #263142; --aag-div: #212B38; --aag-ink: #E6EBF3; --aag-label: #97A3B8; --aag-mono: #D5DDEA; --aag-strip: #18202B; --aag-strip-line: #263142; --aag-blue: #8DB6FF; --aag-field: #141A21; --aag-card: #141A21; --aag-reset: #FF8A9B; }
[data-theme="dark"] .page-accounts .aag-top-ic { background: #12301F; color: #6EE7A0; }
[data-theme="dark"] .page-accounts .aag-btn-ghost, [data-theme="dark"] .page-accounts .aag-headmenu > .btn-icon { background: #141A21; border-color: #263142; color: #E6EBF3; }
[data-theme="dark"] .page-accounts .aag-btn-ghost:hover { background: #1A212A; border-color: #35527E; }
[data-theme="dark"] .page-accounts .aag-btn-primary { background: #1B5CEA; color: #fff; }
[data-theme="dark"] .page-accounts .aag-strip { background: #141A21; border-color: #263142; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-blue { background: #17294A; color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-green { background: #12301F; color: #4ADE80; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-amber { background: #35260F; color: #FBBF5B; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-red { background: #3A1820; color: #FF7A8C; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-purple { background: #261D45; color: #B79CFF; }
[data-theme="dark"] .page-accounts .aag-s-chg.is-up { background: #12301F; color: #6EE7A0; }
[data-theme="dark"] .page-accounts .aag-s-chg.is-down { background: #3A1820; color: #FF9AAA; }
[data-theme="dark"] .page-accounts .aag-spark i { background: #2F7A52; } [data-theme="dark"] .page-accounts .aag-spark i.is-now { background: #4ADE80; }
[data-theme="dark"] .page-accounts .aag-tab:hover { background: #1A212A; }
[data-theme="dark"] .page-accounts .aag-tab.is-active { background: #17294A; color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-tab-n { background: #222B38; color: #B7C3D6; }
[data-theme="dark"] .page-accounts .aag-tab.is-active .aag-tab-n { background: #1F3A66; color: #CFE0FF; }
[data-theme="dark"] .page-accounts .aag-tab-n.tone-red { background: #3A1820; color: #FF9AAA; }
[data-theme="dark"] .page-accounts .aag-search input::placeholder { color: #8390A6; }
[data-theme="dark"] .page-accounts .aag-search, [data-theme="dark"] .page-accounts .aag-sel .aa-select-caret, [data-theme="dark"] .page-accounts .aag-sortbtn .icon { color: #B7C3D6; }
[data-theme="dark"] .page-accounts .aag-sel select option { background: #141A21; color: #E6EBF3; }
[data-theme="dark"] .page-accounts .aag-more:hover, [data-theme="dark"] .page-accounts .aag-more.is-on { background: #172233; border-color: #35527E; }
[data-theme="dark"] .page-accounts .aag-reset:hover { background: #3A1820; border-color: #5A2530; }
[data-theme="dark"] .page-accounts .aag-viewbtn { color: #B7C3D6; }
[data-theme="dark"] .page-accounts .aag-viewbtn:hover { background: #1A212A; }
[data-theme="dark"] .page-accounts .aag-viewbtn.is-active { background: #1B5CEA; border-color: #1B5CEA; color: #fff; }
[data-theme="dark"] .page-accounts .aag-morebar { background: #141A21; border-color: #263142; }
[data-theme="dark"] .page-accounts .aag-chip { background: #1A2A45; color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-chip:hover { background: #22375A; }
[data-theme="dark"] .page-accounts .aag-clear { color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-card:hover { border-color: #3B5A8C; box-shadow: 0 6px 20px rgba(0,0,0,.35); }
[data-theme="dark"] .page-accounts .aag-logo-tile { box-shadow: 0 0 0 1px rgba(255,255,255,.10); }
[data-theme="dark"] .page-accounts .aag-name:hover { color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-status.tone-green { background: #12301F; color: #6EE7A0; }
[data-theme="dark"] .page-accounts .aag-status.tone-grey { background: #222B38; color: #B7C3D6; }
[data-theme="dark"] .page-accounts .aag-card .aa-rowmenu > .btn-icon { background: #1A212A; border-color: #263142; color: #D5DDEA; }
[data-theme="dark"] .page-accounts .aag-card .aa-rowmenu > .btn-icon:hover, [data-theme="dark"] .page-accounts .aag-card .aa-rowmenu.is-open > .btn-icon { background: #1F3A66; border-color: #35527E; color: #fff; }
[data-theme="dark"] .page-accounts .aag-copy { color: #B7C3D6; }
[data-theme="dark"] .page-accounts .aag-copy:hover { background: #1F2A3A; color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-pill.tone-amber { background: #35260F; color: #FBBF5B; }
[data-theme="dark"] .page-accounts .aag-pill.tone-blue { background: #1A2A45; color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-pill.tone-red { background: #3A1820; color: #FF9AAA; }
[data-theme="dark"] .page-accounts .aag-pill.tone-purple { background: #261D45; color: #C4ADFF; }
[data-theme="dark"] .page-accounts .aag-pill.tone-teal { background: #0F2E2B; color: #5EE0D2; }
[data-theme="dark"] .page-accounts .aag-geo em { background: #1A2A45; color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-link-t a { color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-copybtn { background: #1A2A45; color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-copybtn:hover { background: #22375A; }
[data-theme="dark"] .page-accounts .aag-trend.is-up { color: #4ADE80; }
[data-theme="dark"] .page-accounts .aag-trend.is-down { color: #F87171; }
[data-theme="dark"] .page-accounts .aag-tg { background: #141A21; border-color: #263142; }
[data-theme="dark"] .page-accounts .aag-tg-link:hover { color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-tg .aag-copy { color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-data.tone-green { background: #12301F; color: #6EE7A0; }
[data-theme="dark"] .page-accounts .aag-data.tone-amber { background: #35260F; color: #FBBF5B; }
[data-theme="dark"] .page-accounts .aag-data.tone-red { background: #3A1820; color: #FF9AAA; }
[data-theme="dark"] .page-accounts .aag-view { color: #8DB6FF; }
[data-theme="dark"] .page-accounts .aag-page { background: #141A21; border-color: #263142; color: #E6EBF3; }
[data-theme="dark"] .page-accounts .aag-page:hover { background: #1A212A; }
[data-theme="dark"] .page-accounts .aag-page.is-active { background: #1B5CEA; border-color: #1B5CEA; color: #fff; }
[data-theme="dark"] .page-accounts .aag-per-sel { background: #141A21; border-color: #263142; }

/* Knowledge · document page — chip and round-button fills the generator flattens into the surface */
[data-theme="dark"] .kd-tag, [data-theme="dark"] .kd-chip.is-blue, [data-theme="dark"] .kd-pill { background: #17305C; color: #9CC0FF; }
[data-theme="dark"] .kd-tag:hover { background: #1D3A6E; }
[data-theme="dark"] .kd-tag-add, [data-theme="dark"] .kd-chip { background: #1D2530; color: #D5DDE8; }
[data-theme="dark"] .kd-tab-n, [data-theme="dark"] .kd-round, [data-theme="dark"] .kd-collab-add, [data-theme="dark"] .kd-files-add { background: #222B37; color: #C9D3E0; }
[data-theme="dark"] .kd-rel-ico.is-soft { background: #17305C; color: #9CC0FF; }
[data-theme="dark"] .kd-tree-row.is-active { background: #16263F; }
[data-theme="dark"] .kd-title[contenteditable]:hover { background: #1A212A; box-shadow: 0 0 0 4px #1A212A; }
[data-theme="dark"] .kd-title[contenteditable]:focus { background: #16263F; box-shadow: 0 0 0 4px #16263F; }
[data-theme="dark"] .kf-doc code { background: #1D2530; color: #FF9B8F; }
[data-theme="dark"] .kd-anchor { background: #2A2412; color: #F2D48A; }

/* Knowledge · collection page + Add Knowledge modal — tinted fills the generator flattens */
[data-theme="dark"] .kc-pilltag { background: #1D2530; color: #D5DDE8; }
[data-theme="dark"] .kc-pilltag.tone-blue { background: #17305C; color: #9CC0FF; }
[data-theme="dark"] .kc-pilltag.tone-green { background: #12321F; color: #7FD8A4; }
[data-theme="dark"] .kc-pilltag.tone-purple { background: #2A1F4A; color: #C4A8FF; }
[data-theme="dark"] .kc-pilltag.tone-red { background: #3A1A1C; color: #FF9B94; }
[data-theme="dark"] .kc-pilltag.tone-orange { background: #3A2A12; color: #FDBA74; }
[data-theme="dark"] .kc-pilltag.tone-teal { background: #0F302D; color: #6EE7D8; }
[data-theme="dark"] .kc-pilltag.tone-pink { background: #3A1830; color: #F9A8D4; }
[data-theme="dark"] .kc-head-ico, [data-theme="dark"] .kc-q-ico.tone-blue, [data-theme="dark"] .ka-head-ico, [data-theme="dark"] .ka-tpl-ico { background: #17305C; color: #9CC0FF; }
[data-theme="dark"] .kc-q-ico.tone-violet, [data-theme="dark"] .ka-tpl-ico.tone-purple { background: #2A1F4A; color: #C4A8FF; }
[data-theme="dark"] .kc-q-ico.tone-pink { background: #3A1830; }
[data-theme="dark"] .kc-pill { background: #12321F; color: #7FD8A4; }
[data-theme="dark"] .kc-btn-ai { background: #2A1F4A; border-color: #3A2C63; color: #C4A8FF; }
[data-theme="dark"] .kc-vt-b.is-active, [data-theme="dark"] .kc-nav-item.is-active, [data-theme="dark"] .kc-tag.is-active { background: #16263F; }
[data-theme="dark"] .kc-table tbody tr.is-selected { background: #16263F; }
[data-theme="dark"] .ka-chip { background: #17305C; color: #9CC0FF; }
[data-theme="dark"] .ka-note { background: #12321F; border-color: #1E4A30; color: #9FE2BA; }
[data-theme="dark"] .ka-note.is-bad { background: #3A1A1C; border-color: #5A2528; color: #FFB4AE; }
[data-theme="dark"] .ka-tip { background: #16263F; border-color: #22385C; }
[data-theme="dark"] .ka-source.is-on { background: #16263F; border-color: #3D74E0; box-shadow: 0 0 0 1px #3D74E0; }

/* Contrast pass (QA 2026-09-20): AA for text on tinted / solid fills in dark */
[data-theme="dark"] .kd-lead, [data-theme="dark"] .kd-byline, [data-theme="dark"] .kd-byline span, [data-theme="dark"] .kf-doc-banner-sub { color: #93A3BA; }
[data-theme="dark"] .btn-add-new { background: #1B4FC2; color: #FFFFFF; }
[data-theme="dark"] .btn-add-new:hover { background: #1745AC; }
[data-theme="dark"] .btn-success { background: #0E7A37; color: #fff; }
[data-theme="dark"] .tl-pg.is-on { background: #1B4FC2; color: #fff; }
[data-theme="dark"] .perf-tab.is-active { background: #1B4FC2; color: #fff; }
[data-theme="dark"] .tk-status-pill.tone-green { background: #0B7B45; }
[data-theme="dark"] .tk-status-pill.tone-blue { background: #1B4FC2; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-blue { background: #16263F; color: #8FB8FF; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-green { background: #12321F; color: #6FD79B; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-amber { background: #3A2A12; color: #F1B963; }
[data-theme="dark"] .page-accounts .aag-s-ic.tone-red { background: #3A1A1C; color: #FF9B94; }

/* Cards and panels: a slightly stronger edge and lift than the generated pass gives, so sections read as
   separate objects on the dark ground (the user's complaint: "everything looks stuck together"). */
[data-theme="dark"] .card, [data-theme="dark"] .kpi, [data-theme="dark"] .stat-card, [data-theme="dark"] .chart-card,
[data-theme="dark"] .panel, [data-theme="dark"] .cmp-card, [data-theme="dark"] .ct-gcard, [data-theme="dark"] .pay-card,
[data-theme="dark"] .tl-card, [data-theme="dark"] .rp-card, [data-theme="dark"] .aa-card, [data-theme="dark"] .pf-card,
[data-theme="dark"] .rv-card, [data-theme="dark"] .geo-card, [data-theme="dark"] .kf-card, [data-theme="dark"] .tk-card {
  border-color: var(--color-border); box-shadow: 0 1px 2px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.025) inset;
}

/* Follow-ups after the surface remap (2026-09-21) — the page ground got darker, so a few inks that
   read as "accent on a card" now sit on near-black and need the -text token instead of the fill token. */
[data-theme="dark"] .subnav-item.is-active { color: var(--color-primary-text); }
[data-theme="dark"] .cmp-gstat-s.is-down { color: #FB7185; }
[data-theme="dark"] .cmp-gstat-s.is-up { color: #4ADE80; }
/* the module's primary button is a fill, so it keeps the darker blue while --kf-blue stays ink-friendly */
[data-theme="dark"] .page-kf .btn-add-new { background: #1B5CEA; }
[data-theme="dark"] .page-kf .btn-add-new:hover { background: #164FCD; }

/* --kf-blue is read as ink on the panel card as well as painted as a fill, so the token stays light
   enough to read and the fills are pinned separately above. */
:root[data-theme="dark"], [data-theme="dark"] .page-kf { --kf-blue: #5B93F8; }
/* more accent fills that carry white text */
[data-theme="dark"] .aw-step.is-current .aw-step-num, [data-theme="dark"] .pf-seg-btn.is-active,
[data-theme="dark"] .cw-step.is-current .cw-step-num, [data-theme="dark"] .ww-step.is-current .ww-step-num {
  background: #1B5CEA; border-color: #1B5CEA; color: #fff;
}
/* soft status pills and deltas: ink from the -text family, not the saturated fill colour */
[data-theme="dark"] .tk-status-pill.tone-red { color: #FCA5A5; }
[data-theme="dark"] .cmp-delta.is-down { color: #FB7185; }
[data-theme="dark"] .cmp-delta.is-up { color: #4ADE80; }
/* the revenue hero is frozen (dark by design), so its delta chips need their dark ink named here */
[data-theme="dark"] .rv-hero .rv-delta.is-exp span, [data-theme="dark"] .rv-hero .rv-delta.is-exp { color: #FCA5A5; }

/* Reports overview: the Geography map keeps the Geography page's dark palette (no-data markets stay visible) */
[data-theme="dark"] .page-reports .rp-geomap { --geo-b0: #E2E9E7; --geo-b1: #11DF97; --geo-b2: #95DBBF; --geo-b3: #2D765D; --geo-b4: #293E56; }

/* layout guards (tools-dev/late-overrides.css) */
/* Layout guards — appended last by tools-dev/build-dark.php so they outrank every other rule in the
   sheet. These are not styling choices: each one stops a page from panning sideways at a viewport
   width the original rule did not anticipate. Verified with tools-dev/measure.sh "<page>" OVERFLOW <w>
   at 1920 / 1536 / 1280 / 1024 / 820 / 768 / 480 / 390. */

/* 1. Tab strips scroll instead of widening the page. */
@media (max-width: 1100px) {
  .seg-tabs, .tabs, .aa-tabs, .pay-tabs, .tl-tabs, .tl-seg, .rp-tabs, .perf-tabs, .ct-tabs, .cmp-tabs,
  .settings-tabs, .kf-tabs, .dl-tabs, .rv-tabs, .pl-tabs, .wo-tabs {
    overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; min-width: 0; max-width: 100%;
  }
  .seg-tabs::-webkit-scrollbar, .tabs::-webkit-scrollbar, .aa-tabs::-webkit-scrollbar, .pay-tabs::-webkit-scrollbar,
  .tl-tabs::-webkit-scrollbar, .tl-seg::-webkit-scrollbar, .rp-tabs::-webkit-scrollbar, .perf-tabs::-webkit-scrollbar,
  .ct-tabs::-webkit-scrollbar, .cmp-tabs::-webkit-scrollbar, .settings-tabs::-webkit-scrollbar,
  .kf-tabs::-webkit-scrollbar, .dl-tabs::-webkit-scrollbar, .rv-tabs::-webkit-scrollbar,
  .pl-tabs::-webkit-scrollbar, .wo-tabs::-webkit-scrollbar { display: none; }
  .seg-tabs > *, .tabs > *, .aa-tabs > *, .pay-tabs > *, .tl-tabs > *, .tl-seg > *, .rp-tabs > *,
  .perf-tabs > *, .ct-tabs > *, .cmp-tabs > *, .settings-tabs > *, .kf-tabs > * { flex: none; }
}

/* 1b. A strip can only scroll if it is allowed to be narrower than its contents: `flex: none` on the
   strip itself makes the box as wide as the tabs, which then pushes the page out. */
@media (max-width: 1100px) {
  .seg-tabs, .tabs, .aa-tabs, .pay-tabs, .tl-tabs, .tl-seg, .rp-tabs, .perf-tabs, .ct-tabs, .cmp-tabs,
  .settings-tabs, .kf-tabs, .dl-tabs, .rv-tabs, .pl-tabs, .wo-tabs { flex: 1 1 auto; }
}

/* 2. Stat strips wrap, and grids with fixed pixel columns fold, once they no longer fit side by side. */
.cmp-stats.is-grid, .cmp-gstats { flex-wrap: wrap; }
@media (max-width: 1279px) {
  .grid[style*="px"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
  .cmp-stats.is-grid, .cmp-gstats { flex-wrap: wrap; }
  .cmp-gtile { flex: 1 1 165px; }
}
@media (max-width: 1023px) {
  .grid[style*="px"], .grid.cols-3, .grid.cols-4 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
  .layout-split, .layout-split.panel-wide, .layout-split.panel-narrow { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 767px) {
  .grid[style*="px"], .grid.cols-2, .grid.cols-3, .grid.cols-4 { grid-template-columns: minmax(0, 1fr) !important; }
}

/* 3. Wide tables always scroll inside their own wrapper, never the page. Matched by name pattern rather
   than an enumerated list, so a module that invents its own prefix (tl-tablewrap, aa-mtablewrap,
   pf-maptable-wrap, dash-table-wrap …) is covered without anyone having to remember to add it here. */
[class*="table-wrap"], [class*="tablewrap"], [class*="table_wrap"] { overflow-x: auto; max-width: 100%; min-width: 0; }

/* 4. Nothing in a card may be wider than the card. */
.card, .panel, .kpi { min-width: 0; }
.card > *, .card-body > * { min-width: 0; }

/* 5. Table footers ("Showing 1–10 of 38" + per-page select + pager) and button groups wrap instead of
   pushing the page out. These sit at the bottom of every list view. */
@media (max-width: 1100px) {
  .aa-foot, .pay-foot, .tl-foot, .kf-foot, .cmp-foot, .ct-foot, .dl-foot, .table-foot, .pager-row {
    flex-wrap: wrap; row-gap: 10px; min-width: 0;
  }
  .aa-foot-r, .pay-foot-r, .tl-foot-r, .kf-foot-r, .table-foot-r { flex-wrap: wrap; row-gap: 8px; min-width: 0; }
  .aa-perpage, .pay-perpage, .tl-perpage, .kf-perpage { flex-wrap: wrap; min-width: 0; }
  .rp-metrics, .rp-controls, .dash-metrics { flex-wrap: wrap; row-gap: 8px; min-width: 0; }
}
/* 6. Tracking Links puts the tab strip and five controls on one row; below 1366 the controls drop. */
@media (max-width: 1366px) {
  .tl-tabsrow { flex-wrap: wrap; row-gap: 10px; }
  .tl-tabsrow-r { flex-wrap: wrap; row-gap: 8px; min-width: 0; max-width: 100%; }
}

/* 7. Two-column form layouts fold to one on a phone, and a chip row with a wide range button wraps. */
@media (max-width: 1023px) {
  .pf-manual { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
  .pay-chiprow, .pay-chips, .aa-chips, .tl-chips, .cmp-chips { flex-wrap: wrap; row-gap: 8px; min-width: 0; }
  .pay-range, .pay-range > .pay-btn { max-width: 100%; }
}

/* 8. Card heads that carry a legend and a range control (Payments trend) wrap on a phone. */
@media (max-width: 767px) {
  .pay-card-head, .rv-card-head, .tl-card-head, .aa-card-head { flex-wrap: wrap; row-gap: 10px; }
  .pay-legend, .rv-legend, .tl-legend { flex-wrap: wrap; row-gap: 6px; min-width: 0; }
}
/* ==== END DARK THEME ==== */