:root {
  /* Modal layering scale. Higher-priority overlays must always use the next token up, never a
     one-off large number on an inner child - that's how the property-detail-vs-PDF-modal stacking
     bug happened (mobile gave the detail modal z-index:300000 !important with nothing above it).
     - z-page: normal in-flow page content
     - z-detail-modal: the large Property/Lead detail drawer (matches its existing mobile value)
     - z-action-modal: secondary modals opened FROM a detail modal (PDF Studio, publish results) -
       must always outrank z-detail-modal so they're usable while it stays open underneath
     - z-critical: toasts / confirmation dialogs, above everything */
  --z-page: 1;
  --z-detail-modal: 300000;
  --z-action-modal: 400000;
  --z-critical: 500000;

  --neutral-accent:#9CA3AF;
  --neutral-accent-strong:#6B7280;
  --neutral-accent-soft:#EDEEF6;
  --neutral-border:#D5D6E0;
  --neutral-contrast:#FFFFFF;

  /* Brand accent: graphite, not green. --primary-rgb carries the same colour as bare
     channels so translucent tints can be written rgba(var(--primary-rgb),alpha) and follow
     the theme automatically instead of hard-coding the hue in 150 places.
     --primary-on-dark is the accent for surfaces that are dark in BOTH themes (the sidebar);
     a mid graphite would disappear against them. */
  --primary: #4F5358;
  --primary-rgb: 79,83,88;
  --primary-dark: #3B3F43;
  --primary-on-dark: #A7B0B8;
  --avatar-on-dark: #5D646B;
  --primary-light: rgba(79,83,88,.10);
  --primary-glass: rgba(79,83,88,.08);
  --success: #059669;
  --success-light: #ECFDF5;
  --warning: #D97706;
  --warning-light: #FFFBEB;
  --danger: #DC2626;
  --danger-light: #FFF1F2;
  --info: #0891B2;
  --purple: var(--accent);
  --orange: var(--warning);
  /* Day mode reads on warm bone rather than cool grey; cards stay pure white so they
     lift off the ground, and the neutrals are warmed to match instead of going muddy. */
  --bg: #F7F4EE;
  --card: #FFFFFF;
  --surface-muted: #E1E2ED;
  --border: #C9C9D6;
  --border-light: #E4E5EF;
  --text: #1D1E24;
  --text-light: #54555C;
  --text-muted: #666670;
  --sidebar-bg: #2A2E33;
  --sidebar-w: 256px;
  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;
  --shadow: 0 1px 2px rgba(0,0,0,.04), 0 1px 3px rgba(0,0,0,.03);
  --shadow-md: 0 2px 10px rgba(0,0,0,.06), 0 1px 3px rgba(0,0,0,.03);
  --shadow-lg: 0 16px 40px rgba(0,0,0,.09), 0 2px 10px rgba(0,0,0,.05);
  --shadow-colored: 0 4px 16px rgba(79,83,88,.18);
}

body.light{
  --neutral-accent:#9CA3AF;
  --neutral-accent-strong:#6B7280;
  --neutral-accent-soft:#EDEEF6;
  --neutral-border:#D5D6E0;
  --neutral-contrast:#FFFFFF;

  /* body.light is the explicit day theme and must carry the same bone/graphite set as
     :root, or toggling to day would fall back to the old cool-grey + green palette. */
  --bg:#F7F4EE;
  --card:#FFFFFF;
  --surface-muted:#E1E2ED;
  --border:#C9C9D6;
  --border-light:#E4E5EF;
  --text:#1D1E24;
  --text-light:#54555C;
  --text-muted:#666670;
  --sidebar-bg:#2A2E33;
  --primary:#4F5358;
  --primary-rgb:79,83,88;
  --primary-dark:#3B3F43;
  --primary-on-dark:#A7B0B8;
  --avatar-on-dark:#5D646B;
  --primary-light:rgba(79,83,88,.10);
  --primary-glass:rgba(79,83,88,.07);
  --success-light:rgba(5,150,105,.09);
  --warning-light:rgba(217,119,6,.09);
  --danger-light:rgba(220,38,38,.08);
  --shadow:0 1px 2px rgba(0,0,0,.04),0 1px 3px rgba(0,0,0,.03);
  --shadow-md:0 2px 10px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.03);
  --shadow-lg:0 16px 40px rgba(0,0,0,.09),0 2px 10px rgba(0,0,0,.05);
}
body.light #topbar{background:rgba(230, 231, 241,.95) !important;border-color:var(--border) !important;box-shadow:none !important}
body.light #content{background:var(--bg)}
body.light .card{background:var(--card) !important;border-color:var(--border) !important}
body.light input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=color]):not(.form-control),body.light select:not(.form-control),body.light textarea:not(.form-control){background:#FFFFFF !important;border-color:#E5E5E7 !important;color:var(--text) !important}
body.light input::placeholder,body.light textarea::placeholder{color:var(--text-muted) !important}

body.light [style*="background:#fff"],body.light [style*="background:#FFF"],body.light [style*="background: #fff"],body.light [style*="background:#FFFFFF"],body.light [style*="background: #FFFFFF"],body.light [style*="background:white"]{background:var(--card) !important}
body.light [style*="background:#F1F5F9"],body.light [style*="background:#F8FAFC"],body.light [style*="background:#F9FAFB"]{background:var(--card2) !important}
body.light [style*="background:#EFF6FF"]{background:var(--accent-soft) !important}
body.light [style*="background:#FFF5F5"]{background:var(--danger-light) !important}
body.light [style*="background:#FEE2E2"]{background:var(--danger-light) !important}

body.light [style*="solid #E2E8F0"]{border-color:var(--border) !important}
body.light [style*="solid #F1F5F9"]{border-color:var(--border) !important}
body.light [style*="solid #E0E7FF"]{border-color:var(--accent) !important}
body.light [style*="solid #D1FAE5"]{border-color:var(--accent) !important}
body.light [style*="solid #FECACA"]{border-color:var(--danger) !important}
body.light [style*="solid #FDE68A"]{border-color:var(--warning) !important}

body.light [style*="color:#0F172A"],body.light [style*="color:#1E293B"]{color:var(--text) !important}
body.light [style*="color:#64748B"],body.light [style*="color:#94A3B8"]{color:#8E8E93 !important}
body.light [style*="color:#334155"],body.light [style*="color:#475569"]{color:#6B6B70 !important}
body.light .tab-btn{color:#8E8E93 !important}
body.light .tab-btn.active{background:rgba(var(--primary-rgb),.1) !important;color:var(--primary) !important}
body.light .modal-content,body.light #small-modal-body{background:#FFFFFF !important;border-color:#E5E5E7 !important}
body.light table thead tr{background:#E1E2ED !important}
body.light th{color:#666670 !important;border-color:var(--border-strong) !important}
body.light td{border-color:var(--border) !important}
body.light ::-webkit-scrollbar-thumb{background:rgba(0,0,0,.16)}
body.light ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.26)}


body.dark{
  --neutral-accent:#D5D6E0;
  --neutral-accent-strong:var(--border-strong);
  --neutral-accent-soft:#303236;
  --neutral-border:#4B5563;
  --neutral-contrast:#202123;

  --bg:#1F1F1F;
  --card:#262626;
  --card-secondary:#2F2F2F;
  --surface-muted:#2F2F2F;
  --border:#3A3A3A;
  --border-light:rgba(255,255,255,.06);
  --text:#F2F2F2;
  --text-light:#B4B4B4;
  --text-muted:#8A8A8A;
  --success:#22C55E;
  --warning:#F59E0B;
  --danger:#EF4444;
  --sidebar-bg:#191C1F;
  /* Night mode lifts the same graphite so it still reads against #1F1F1F; --primary-dark is
     the hover step, which on a dark ground means brighter, not darker. */
  --primary:#7E8790;
  --primary-rgb:126,135,144;
  --primary-dark:#97A0A9;
  --primary-on-dark:#AEB6BE;
  --avatar-on-dark:#5D646B;
  --primary-light:rgba(126,135,144,.16);
  --primary-glass:rgba(126,135,144,.10);
  --success-light:rgba(34,197,94,.12);
  --warning-light:rgba(245,158,11,.12);
  --danger-light:rgba(239,68,68,.12);
  --shadow:0 1px 2px rgba(0,0,0,.3),0 1px 3px rgba(0,0,0,.18);
  --shadow-md:0 2px 10px rgba(0,0,0,.35),0 1px 3px rgba(0,0,0,.2);
  --shadow-lg:0 16px 40px rgba(0,0,0,.5),0 2px 10px rgba(0,0,0,.28);
}

body.dark #topbar{background:#262626 !important;border-color:#3A3A3A !important;box-shadow:none !important}
body.dark #content{background:var(--bg)}
body.dark .card{background:var(--card) !important;border-color:var(--border) !important}
body.dark .modal-content{background:#262626 !important;border:1px solid #3A3A3A !important}
body.dark #small-modal-body,body.dark #modal-body{background:#262626 !important}
body.dark .tab-btn{color:rgba(255,255,255,.48) !important}
body.dark .tab-btn.active{background:rgba(var(--primary-rgb),.18) !important;color:#F2F2F2 !important}
body.dark .kanban-col{background:rgba(255,255,255,.03) !important;border-color:rgba(255,255,255,.07) !important}
body.dark .ins-card{background:rgba(255,255,255,.04) !important;border-color:rgba(255,255,255,.07) !important}
body.dark .empty-state{background:transparent !important}
body.dark table thead tr{background:rgba(255,255,255,.04) !important}
body.dark th{background:rgba(255,255,255,.04) !important;color:rgba(255,255,255,.55) !important;border-color:rgba(255,255,255,.07) !important}
body.dark td{border-color:rgba(255,255,255,.06) !important}
body.dark tr:hover td{background:rgba(255,255,255,.07) !important}

body.dark input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=color]):not(.form-control),body.dark select:not(.form-control),body.dark textarea:not(.form-control){background:rgba(255,255,255,.05) !important;color:var(--text) !important;border-color:rgba(255,255,255,.12) !important}
body.dark input::placeholder,body.dark textarea::placeholder{color:rgba(255,255,255,.22) !important}
select option,
select optgroup{background:#FFFFFF;color:#202123}
body.dark select option,
body.dark select optgroup{background:#262626;color:var(--text)}

body.dark [style*="background:#fff"]:not(#login-screen):not(#login-screen *),body.dark [style*="background: #fff"]:not(#login-screen):not(#login-screen *),body.dark [style*="background:#FFF"]:not(#login-screen):not(#login-screen *),body.dark [style*="background: #FFF"]:not(#login-screen):not(#login-screen *){background:#262626 !important}
body.dark [style*="background:#ffffff"]:not(#login-screen):not(#login-screen *),body.dark [style*="background:#FFFFFF"]:not(#login-screen):not(#login-screen *),body.dark [style*="background: #ffffff"]:not(#login-screen):not(#login-screen *),body.dark [style*="background: #FFFFFF"]:not(#login-screen):not(#login-screen *){background:#262626 !important}
body.dark [style*="background:white"]:not(#login-screen):not(#login-screen *),body.dark [style*="background: white"]:not(#login-screen):not(#login-screen *){background:#262626 !important}
body.dark [style*="background: rgb(255, 255, 255)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(255, 255, 255)"]:not(#login-screen):not(#login-screen *){background:#262626 !important}
body.dark [style*="background:#F1F5F9"]:not(#login-screen):not(#login-screen *),body.dark [style*="background: #F1F5F9"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.04) !important}
body.dark [style*="background:#F8FAFC"]:not(#login-screen):not(#login-screen *),body.dark [style*="background: #F8FAFC"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.03) !important}
body.dark [style*="background:#F9FAFB"]:not(#login-screen):not(#login-screen *),body.dark [style*="background: #F9FAFB"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.03) !important}
body.dark [style*="background:#F0F4FF"]:not(#login-screen):not(#login-screen *){background:rgba(var(--primary-rgb),.1) !important}
body.dark [style*="background: rgb(241, 245, 249)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(241, 245, 249)"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.04) !important}
body.dark [style*="background: rgb(248, 250, 252)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(248, 250, 252)"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.03) !important}
body.dark [style*="background: rgb(249, 250, 251)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(249, 250, 251)"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.03) !important}
body.dark [style*="background: rgb(239, 246, 255)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(239, 246, 255)"]:not(#login-screen):not(#login-screen *){background:rgba(var(--primary-rgb),.12) !important}

body.dark [style*="background:#FFF1F2"]:not(#login-screen):not(#login-screen *){background:rgba(239,68,68,.16) !important}
body.dark [style*="background:#FFF5F5"]:not(#login-screen):not(#login-screen *){background:rgba(220,38,38,.08) !important}
body.dark [style*="background:#FEE2E2"]:not(#login-screen):not(#login-screen *){background:rgba(220,38,38,.14) !important}
body.dark [style*="background:#DCFCE7"]:not(#login-screen):not(#login-screen *){background:rgba(22,163,74,.14) !important}
body.dark [style*="background:#FEF2F2"]:not(#login-screen):not(#login-screen *){background:rgba(220,38,38,.08) !important}
body.dark [style*="background:#FEF3C7"]:not(#login-screen):not(#login-screen *){background:rgba(217,119,6,.08) !important}
body.dark [style*="background:#FFFBEB"]:not(#login-screen):not(#login-screen *){background:rgba(245,158,11,.14) !important}
body.dark [style*="background:#EFF6FF"]:not(#login-screen):not(#login-screen *){background:rgba(var(--primary-rgb),.12) !important}
body.dark [style*="background:#DBEAFE"]:not(#login-screen):not(#login-screen *){background:rgba(var(--primary-rgb),.13) !important}
body.dark [style*="background:#EDE9FE"]:not(#login-screen):not(#login-screen *){background:rgba(124,58,237,.12) !important}
body.dark [style*="background:#F3E8FF"]:not(#login-screen):not(#login-screen *){background:rgba(124,58,237,.11) !important}
body.dark [style*="background:#F5F3FF"]:not(#login-screen):not(#login-screen *){background:rgba(124,58,237,.11) !important}
body.dark [style*="background:#D1FAE5"]:not(#login-screen):not(#login-screen *){background:rgba(5,150,105,.12) !important}
body.dark [style*="background:#ECFDF5"]:not(#login-screen):not(#login-screen *){background:rgba(5,150,105,.1) !important}
body.dark [style*="background:#F0FDF4"]:not(#login-screen):not(#login-screen *){background:rgba(16,185,129,.14) !important}
body.dark [style*="background: rgb(255, 241, 242)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(255, 241, 242)"]:not(#login-screen):not(#login-screen *){background:rgba(239,68,68,.16) !important}
body.dark [style*="background: rgb(255, 245, 245)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(255, 245, 245)"]:not(#login-screen):not(#login-screen *){background:rgba(220,38,38,.08) !important}
body.dark [style*="background: rgb(254, 226, 226)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(254, 226, 226)"]:not(#login-screen):not(#login-screen *){background:rgba(220,38,38,.14) !important}
body.dark [style*="background: rgb(255, 247, 237)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(255, 247, 237)"]:not(#login-screen):not(#login-screen *){background:rgba(249,115,22,.12) !important}
body.dark [style*="background: rgb(255, 251, 235)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(255, 251, 235)"]:not(#login-screen):not(#login-screen *){background:rgba(245,158,11,.14) !important}
body.dark [style*="background: rgb(219, 234, 254)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(219, 234, 254)"]:not(#login-screen):not(#login-screen *){background:rgba(var(--primary-rgb),.13) !important}
body.dark [style*="background: rgb(220, 252, 231)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(220, 252, 231)"]:not(#login-screen):not(#login-screen *){background:rgba(22,163,74,.14) !important}
body.dark [style*="background: rgb(240, 253, 244)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(240, 253, 244)"]:not(#login-screen):not(#login-screen *){background:rgba(16,185,129,.14) !important}
body.dark [style*="background: rgb(245, 243, 255)"]:not(#login-screen):not(#login-screen *),body.dark [style*="background-color: rgb(245, 243, 255)"]:not(#login-screen):not(#login-screen *){background:rgba(124,58,237,.11) !important}

body.dark [style*="background:#FFF7ED"]:not(#login-screen):not(#login-screen *){background:rgba(245,158,11,.1) !important}
body.dark [style*="background:#FAFBFC"]:not(#login-screen):not(#login-screen *){background:var(--card-secondary) !important}
body.dark [style*="background:#F0F9FF"]:not(#login-screen):not(#login-screen *){background:rgba(var(--primary-rgb),.12) !important}
body.dark [style*="background:#FAFAFA"]:not(#login-screen):not(#login-screen *){background:var(--card-secondary) !important}
body.dark [style*="background:#e2e8f0"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.05) !important}
body.dark [style*="background:#f8fafc"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.03) !important}
body.dark [style*="background:#E2E8F0"]:not(#login-screen):not(#login-screen *){background:rgba(255,255,255,.05) !important}

body.dark [style*="linear-gradient(135deg,#FFF5F5"]:not(#login-screen):not(#login-screen *){background:rgba(220,38,38,.07) !important}
body.dark [style*="linear-gradient(135deg,#fff"]:not(#login-screen):not(#login-screen *){background:#262626 !important}

body.dark [style*="linear-gradient(135deg,#F8FAFC"]:not(#login-screen):not(#login-screen *){background:#07111F !important}
body.dark [style*="linear-gradient(180deg,#F8FAFC"]:not(#login-screen):not(#login-screen *){background:#07111F !important}
body.dark #chat-window{background:#0D1016 !important}

body.dark [style*="color:#0F172A"]:not(#login-screen):not(#login-screen *){color:#F4F7FB !important}
body.dark [style*="color:#1E293B"]:not(#login-screen):not(#login-screen *){color:#F4F7FB !important}
body.dark [style*="color:#0F172"]:not(#login-screen):not(#login-screen *){color:#F4F7FB !important}
body.dark [style*="color:#334155"]:not(#login-screen):not(#login-screen *){color:#CBD5E1 !important}
body.dark [style*="color:#475569"]:not(#login-screen):not(#login-screen *){color:var(--text-secondary) !important}
body.dark [style*="color:#64748B"]:not(#login-screen):not(#login-screen *){color:var(--text-secondary) !important}
body.dark [style*="color:#94A3B8"]:not(#login-screen):not(#login-screen *){color:var(--text-secondary) !important}
body.dark [style*="color:#B91C1C"]:not(#login-screen):not(#login-screen *){color:#FCA5A5 !important}
body.dark [style*="color: rgb(15, 23, 42)"]:not(#login-screen):not(#login-screen *){color:#F4F7FB !important}
body.dark [style*="color: rgb(30, 41, 59)"]:not(#login-screen):not(#login-screen *){color:#F4F7FB !important}
body.dark [style*="color: rgb(51, 65, 85)"]:not(#login-screen):not(#login-screen *){color:#CBD5E1 !important}
body.dark [style*="color: rgb(71, 85, 105)"]:not(#login-screen):not(#login-screen *){color:var(--text-secondary) !important}
body.dark [style*="color: rgb(100, 116, 139)"]:not(#login-screen):not(#login-screen *){color:var(--text-secondary) !important}
body.dark [style*="color: rgb(148, 163, 184)"]:not(#login-screen):not(#login-screen *){color:var(--text-secondary) !important}

body.dark [style*="border-color:#E2E8F0"]:not(#login-screen):not(#login-screen *){border-color:rgba(255,255,255,.07) !important}
body.dark [style*="solid #E2E8F0"]:not(#login-screen):not(#login-screen *){border-color:rgba(255,255,255,.07) !important}
body.dark [style*="solid #F1F5F9"]:not(#login-screen):not(#login-screen *){border-color:rgba(255,255,255,.05) !important}
body.dark [style*="solid #E0E7FF"]:not(#login-screen):not(#login-screen *){border-color:rgba(99,102,241,.3) !important}
body.dark [style*="solid #D1FAE5"]:not(#login-screen):not(#login-screen *){border-color:rgba(5,150,105,.28) !important}
body.dark [style*="solid #FECACA"]:not(#login-screen):not(#login-screen *){border-color:rgba(239,68,68,.32) !important}
body.dark [style*="solid #FDE68A"]:not(#login-screen):not(#login-screen *){border-color:rgba(217,119,6,.32) !important}
body.dark [style*="solid #DDD6FE"]:not(#login-screen):not(#login-screen *){border-color:rgba(124,58,237,.3) !important}
body.dark [style*="solid #BFDBFE"]:not(#login-screen):not(#login-screen *){border-color:rgba(var(--primary-rgb),.3) !important}
body.dark [style*="solid #A7F3D0"]:not(#login-screen):not(#login-screen *){border-color:rgba(5,150,105,.3) !important}
body.dark [style*="solid #FED7AA"]:not(#login-screen):not(#login-screen *){border-color:rgba(245,158,11,.3) !important}
body.dark [style*="solid #BBF7D0"]:not(#login-screen):not(#login-screen *){border-color:rgba(34,197,94,.3) !important}
body.dark [style*="solid #CBD5E1"]:not(#login-screen):not(#login-screen *){border-color:rgba(255,255,255,.1) !important}
body.dark [style*="solid #FCD34D"]:not(#login-screen):not(#login-screen *){border-color:rgba(245,158,11,.32) !important}
body.dark [style*="solid #C7D2FE"]:not(#login-screen):not(#login-screen *){border-color:rgba(99,102,241,.3) !important}
body.dark [style*="solid #E5E7EB"]:not(#login-screen):not(#login-screen *){border-color:rgba(255,255,255,.07) !important}
body.dark [style*="solid #6EE7B7"]:not(#login-screen):not(#login-screen *){border-color:rgba(34,197,94,.3) !important}

body.dark [style*="color:#374151"]:not(#login-screen):not(#login-screen *){color:#CBD5E1 !important}
body.dark [style*="color:#6B7280"]:not(#login-screen):not(#login-screen *){color:var(--text-secondary) !important}
body.dark [style*="color:var(--primary-dark)"]:not(#login-screen):not(#login-screen *){color:#34D399 !important}
body.dark [style*="color:#16A34A"]:not(#login-screen):not(#login-screen *){color:var(--accent-text) !important}
body.dark [style*="color:#16a34a"]:not(#login-screen):not(#login-screen *){color:var(--accent-text) !important}
body.dark [style*="color:#10A37F"]:not(#login-screen):not(#login-screen *){color:#34D399 !important}
body.dark [style*="color:#dc2626"]:not(#login-screen):not(#login-screen *){color:#F87171 !important}
body.dark [style*="color:#059669"]:not(#login-screen):not(#login-screen *){color:var(--accent-text) !important}
body.dark [style*="color:#C2410C"]:not(#login-screen):not(#login-screen *){color:#FB923C !important}
body.dark [style*="color:#EA580C"]:not(#login-screen):not(#login-screen *){color:#FB923C !important}
body.dark [style*="color:#92400E"]:not(#login-screen):not(#login-screen *){color:var(--warning) !important}
body.dark [style*="color:#15803D"]:not(#login-screen):not(#login-screen *){color:var(--accent-text) !important}
body.dark [style*="color:#047857"]:not(#login-screen):not(#login-screen *){color:var(--accent-text) !important}
body.dark [style*="color:#065F46"]:not(#login-screen):not(#login-screen *){color:var(--accent-text) !important}
body.dark [style*="color:#4338CA"]:not(#login-screen):not(#login-screen *){color:#A5B4FC !important}

body.dark ::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15)}
body.dark ::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.25)}

*{box-sizing:border-box;margin:0;padding:0}
/* #topbar's real rendered height, single source of truth for anything that needs "the rest of the
   viewport" (currently #page-team-chat). Redeclared at each breakpoint where #topbar's own height
   rule changes below, and zeroed while body.tc-thread-open hides the topbar - so a consumer never
   has to guess a pixel number that can silently drift out of sync with the element it describes. */
:root{--sat:env(safe-area-inset-top, 0px);--topbar-h:64px}   /* #topbar declares height:60px but its rendered box measures 64px (border/line-height rounding) - measured with getBoundingClientRect, not read off the declaration, since that is exactly the kind of drift this token exists to stop. */
body.tc-thread-open{--topbar-h:0px}
/* ==========================================================================
   DIRECTION — single source of truth
   --------------------------------------------------------------------------
   This app began life Persian-first, so the base rules used to be physically
   RTL (#sidebar{right:0}, #main{margin-right}) with a stack of html[dir="ltr"]
   patches bolted on to drag everything back for English. Three of those patches
   matched INLINE STYLE SUBSTRINGS ([style*="margin-right:auto"],
   [style*="text-align:right"], [style*="border-right:"]) and flipped them with
   !important — they fired on whatever markup happened to contain that text and
   were impossible to reason about.

   Everything below is written in LOGICAL properties instead, so one rule set
   serves en (ltr), fa (rtl) and ar (rtl) with no per-direction duplication.
   `direction` is inherited from <html dir> — set once by locale-contract.js —
   and is never declared per component or per page.

   The only direction-scoped rules that remain are the two mobile drawer
   transforms, because translateX has no logical equivalent in CSS.
   ========================================================================== */
body{font-family:Tahoma,Arial,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}
button{cursor:pointer;font-family:inherit}
input,select,textarea{font-family:inherit;text-align:start}

/* Values that are read, copied and pasted across portals, PDFs and messages stay
   left-to-right in every language — an RTL page must not reorder a phone number,
   an IBAN, a price or a URL. This is content direction, not layout direction. */
input[type="tel"],input[type="email"],input[type="url"],input[type="number"],
input[inputmode="numeric"],input[inputmode="decimal"],input[inputmode="tel"],
.ltr-value,[data-ltr]{direction:ltr;text-align:start}

.nav-item{text-align:start}
.form-label{text-align:start}

@media(max-width:768px){
  /* Drawer slides in from the inline-start edge: left for en, right for fa/ar. */
  /* The open rule must carry the SAME specificity as the closed rules: a bare
     #sidebar.open (1,1,0) loses to html[dir="ltr"] #sidebar (1,1,1), which silently
     pinned the drawer shut. Both states are direction-scoped so they rank equally. */
  html[dir="ltr"] #sidebar{transform:translateX(-100%)}
  html[dir="rtl"] #sidebar{transform:translateX(100%)}
  html[dir="ltr"] #sidebar.open,
  html[dir="rtl"] #sidebar.open{transform:translateX(0)}
  html[dir="ltr"] #sidebar.open{box-shadow:8px 0 32px rgba(0,0,0,.18)}
  html[dir="rtl"] #sidebar.open{box-shadow:-8px 0 32px rgba(0,0,0,.18)}
  #main{margin-inline:0!important}
}


::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#D5D6E0;border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:#9CA3AF}


img.twemoji{height:1.15em;width:1.15em;vertical-align:-0.2em;margin:0 .04em;display:inline-block}




#app{display:flex;min-height:100vh}

#sidebar{width:var(--sidebar-w);background:var(--sidebar-bg);color:#ECECEC;display:flex;flex-direction:column;position:fixed;top:0;inset-inline-start:0;inset-inline-end:auto;bottom:0;z-index:100;transition:.3s;border-inline-end:1px solid rgba(255,255,255,.06)}
#main{margin-inline-start:var(--sidebar-w);margin-inline-end:0;flex:1;display:flex;flex-direction:column;min-height:100vh}
#topbar{background:var(--card);border-bottom:1px solid var(--border);padding:0 24px;height:60px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50}

#content{padding:24px;padding-bottom:104px;flex:1;scrollbar-gutter:stable}


.sidebar-logo{padding:18px 16px 14px;border-bottom:1px solid rgba(255,255,255,.06);display:flex;align-items:center;gap:10px}
.sidebar-logo svg{color:var(--primary-on-dark);flex-shrink:0}
.sidebar-logo-img{width:32px;height:32px;border-radius:8px;object-fit:contain;padding:2px;flex-shrink:0}
.sidebar-logo span{font-size:13px;font-weight:600;color:#ECECEC;line-height:1.4}
.sidebar-logo .sub{font-size:10.5px;font-weight:400;color:#8A8A8A;display:block;margin-top:1px}
.sidebar-nav{flex:1;overflow-y:auto;padding:8px 8px}
.nav-section{padding:14px 10px 5px;font-size:10px;color:#7A7A7A;text-transform:uppercase;letter-spacing:.07em;font-weight:600}
.nav-section:first-child{padding-top:6px}
/* text-align:right was Persian-era residue. It sits AFTER the logical `.nav-item{text-align:start}`
   in the direction block, so it won the cascade and right-aligned every sidebar label in English —
   the inconsistent mobile drawer alignment came from here, not from the individual items. The
   label now follows the reading direction, and `justify-content:flex-start` pins the icon/label/
   badge row to the inline-start edge in all three languages instead of relying on text-align. */
.nav-item{display:flex;align-items:center;justify-content:flex-start;gap:9px;padding:7px 10px;color:#B0B0B0;cursor:pointer;transition:background .15s,color .15s;border-radius:8px;font-size:13px;border:none;background:none;width:100%;text-align:start;margin-bottom:1px;position:relative}
.nav-item:hover{background:rgba(255,255,255,.06);color:#ECECEC}

.nav-item.active{background:rgba(var(--primary-rgb),.14);color:#ECECEC;font-weight:600}
.nav-item svg{flex-shrink:0;width:16px;height:16px}
.nav-item.active svg{color:var(--primary-on-dark)}
.sidebar-footer{padding:12px 14px;border-top:1px solid rgba(255,255,255,.06);font-size:12px;color:#8A8A8A}
.sidebar-footer .user-info{display:flex;align-items:center;gap:10px}
.sidebar-footer .user-avatar{width:30px;height:30px;border-radius:50%;background:var(--avatar-on-dark);display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;color:#fff;flex-shrink:0}


.topbar-utility-btn{
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0 11px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--card);
  color:var(--text-light);
  font:600 12px/1 inherit;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:none;
  transition:background .16s,border-color .16s,color .16s;
}
.topbar-utility-btn:hover{
  background:var(--neutral-accent-soft);
  border-color:var(--neutral-border);
  color:var(--text);
}
.topbar-utility-btn svg{flex-shrink:0}
.topbar-utility-label{display:inline}
.topbar-logout-btn:hover{
  background:var(--danger-light);
  border-color:color-mix(in srgb,var(--danger) 35%,transparent);
  color:var(--danger);
}
#assistant-fab{
  position:static;
  inset:auto;
  width:auto;
  height:36px;
  margin:0;
  z-index:auto;
  transform:none;
  border-radius:10px;
}
#assistant-fab:hover{transform:none}
#assistant-fab.open{
  display:inline-flex;
  background:var(--neutral-accent-soft);
  border-color:var(--neutral-border);
  color:var(--text);
}
.assistant-fab-icon{width:17px;height:17px}
.assistant-fab-label{display:inline;color:inherit}
.assistant-fab-dot{
  position:static;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--success);
  border:1px solid var(--card);
}
.topbar-title{font-size:14.5px;font-weight:600;color:var(--text)}
.topbar-actions{display:flex;align-items:center;gap:8px}
.topbar-leading{display:flex;align-items:center;gap:12px;min-width:0}
.topbar-brand{display:flex;align-items:center;gap:10px;min-width:0}
.topbar-logo{width:32px;height:32px;border-radius:8px;object-fit:contain;flex-shrink:0}
.topbar-title-wrap{display:flex;flex-direction:column;min-width:0}




.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:10px;font-size:13px;font-weight:600;border:none;transition:.15s;white-space:nowrap;letter-spacing:0}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-dark)}
.btn-success{background:var(--accent-soft);color:#fff}
.btn-success:hover{background:#047857}
.btn-danger{background:var(--danger-light);color:#fff}
.btn-danger:hover{background:#B91C1C}
.btn-warning{background:#D97706;color:#fff}
.btn-warning:hover{background:#B45309}
.btn-ghost{background:transparent;color:var(--text-light);border:1px solid var(--border)}
.btn-ghost:hover{background:var(--surface-muted);border-color:var(--text-muted);color:var(--text)}
.btn-sm{padding:5px 12px;font-size:12px;border-radius:8px}
.btn-xs{padding:3px 8px;font-size:11px;border-radius:6px;font-weight:500}
.btn-icon{padding:8px;border-radius:10px}
.btn:active{opacity:.9}


.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border)}
.card-header{padding:16px 22px;border-bottom:1px solid var(--border-light);display:flex;align-items:center;justify-content:space-between}
.card-title{font-size:14px;font-weight:700;color:var(--text)}
.card-body{padding:20px}


.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;margin-bottom:26px}
.stat-card{background:var(--card);border-radius:var(--radius);padding:18px 18px 16px;box-shadow:var(--shadow);border:1px solid var(--border);transition:.15s;position:relative;overflow:hidden}
.stat-card:hover{border-color:var(--text-muted)}
.stat-label{font-size:11.5px;color:var(--text-light);margin-bottom:8px;font-weight:500}
.stat-value{font-size:24px;font-weight:700;color:var(--text);letter-spacing:-.02em}
.stat-sub{font-size:11px;color:var(--text-muted);margin-top:4px}
.stat-icon{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;font-size:18px;background:var(--surface-muted)}




.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;letter-spacing:.01em}
.badge-green{background:#DCFCE7;color:#15803D}
.badge-yellow{background:var(--warning-light);color:var(--warning)}
.badge-red{background:#FEE2E2;color:#B91C1C}
.badge-blue{background:#DBEAFE;color:var(--primary-dark)}
.badge-gray{background:var(--card2);color:var(--text-secondary)}
.badge-purple{background:var(--card2);color:#6D28D9}
.badge-orange{background:#FFF7ED;color:#C2410C}


.alert-card{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:12px;margin-bottom:8px;font-size:13px;border:1px solid transparent;transition:transform .15s,box-shadow .15s}
.alert-card.clickable{cursor:pointer}
.alert-card.clickable:hover{transform:translateX(-2px);box-shadow:0 4px 16px rgba(0,0,0,.12)!important}
.alert-red{background:#FEE2E2;color:#991B1B;border-color:#FECACA;box-shadow:inset 4px 0 0 var(--danger-light)}
.alert-yellow{background:#FEF9C3;color:#713F12;border-color:#FEF08A;box-shadow:inset 4px 0 0 #EAB308}
.alert-orange{background:#FFEDD5;color:#9A3412;border-color:#FED7AA;box-shadow:inset 4px 0 0 #F97316}
.alert-icon{font-size:20px;flex-shrink:0;display:flex;align-items:center}
.alert-body{flex:1;min-width:0}
.alert-body strong{display:block;font-size:13px;font-weight:700;margin-bottom:2px}
.alert-body span{font-size:12px;opacity:.85;display:block}
.alert-arrow{font-size:14px;opacity:.5;flex-shrink:0}


body.dark .badge-green{background:rgba(16,185,129,.16)!important;color:#6EE7B7!important}
body.dark .badge-red{background:rgba(220,38,38,.16)!important;color:#FCA5A5!important}
body.dark .badge-yellow{background:rgba(234,179,8,.14)!important;color:#FCD34D!important}
body.dark .badge-blue{background:rgba(59,130,246,.16)!important;color:#93C5FD!important}
body.dark .badge-gray{background:rgba(148,163,184,.14)!important;color:var(--text-secondary)!important}
body.dark .badge-purple{background:rgba(139,92,246,.16)!important;color:#C4B5FD!important}
body.dark .badge-orange{background:rgba(249,115,22,.15)!important;color:#FDBA74!important}
body.dark .alert-red{background:rgba(220,38,38,.13)!important;color:#FCA5A5!important;border-color:rgba(220,38,38,.28)!important;box-shadow:inset 4px 0 0 #EF4444!important}
body.dark .alert-yellow{background:rgba(234,179,8,.12)!important;color:#FCD34D!important;border-color:rgba(234,179,8,.25)!important;box-shadow:inset 4px 0 0 #EAB308!important}
body.dark .alert-orange{background:rgba(249,115,22,.12)!important;color:#FDB57A!important;border-color:rgba(249,115,22,.25)!important;box-shadow:inset 4px 0 0 #F97316!important}

body.light .badge-green{background:rgba(16,185,129,.12)!important;color:#4D525A!important}
body.light .badge-red{background:rgba(220,38,38,.1)!important;color:#991B1B!important}
body.light .badge-yellow{background:rgba(161,98,7,.1)!important;color:#78350F!important}
body.light .badge-blue{background:rgba(var(--primary-rgb),.1)!important;color:#1E40AF!important}
body.light .badge-gray{background:rgba(100,116,139,.1)!important;color:var(--text-secondary)!important}
body.light .badge-purple{background:rgba(109,40,217,.1)!important;color:#5B21B6!important}
body.light .badge-orange{background:rgba(194,65,12,.09)!important;color:#9A3412!important}





body.dark .detail-tabs{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.07)!important}
body.dark .detail-tab:hover:not(.active){background:rgba(255,255,255,.08)!important;color:#D4D5DF!important}

body.dark .info-item{background:rgba(255,255,255,.04)!important;border-color:rgba(255,255,255,.08)!important}

body.dark .prop-card-footer{background:rgba(255,255,255,.03)!important;border-color:rgba(255,255,255,.06)!important}

body.dark .modal{background:#262626!important;border-color:rgba(255,255,255,.1)!important}
body.dark .modal-footer{background:rgba(9, 12, 18,.8)!important;border-color:rgba(255,255,255,.07)!important}

body.dark .chat-messages{background:rgba(255,255,255,.015)!important}
body.dark .chat-bubble.other{background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.1)!important;color:var(--text)!important}

body.dark .kanban-col{background:rgba(255,255,255,.03)!important;border-color:rgba(255,255,255,.07)!important}

body.dark .msgboard-compose{background:rgba(255,255,255,.02)!important;border-bottom-color:rgba(255,255,255,.06)!important}
body.dark .msgboard-compose textarea{background:rgba(255,255,255,.05)!important;border-color:rgba(255,255,255,.1)!important;color:var(--text)!important}
body.dark .msg-post:hover{background:rgba(255,255,255,.03)!important}
body.dark .msg-post.pinned{background:rgba(217,119,6,.1)!important;border-right-color:#F59E0B!important}
body.dark .msg-post.chat-msg-post{background:var(--accent-soft)!important;border-right-color:var(--accent)!important}

body.dark .notif-item:hover{background:rgba(255,255,255,.03)!important}
body.dark .notif-item.unread{background:rgba(30,95,191,.14)!important;border-right-color:var(--primary)!important}

body.dark .util-row:hover{background:rgba(255,255,255,.04)!important}
body.dark .util-row{border-bottom-color:rgba(255,255,255,.06)!important}

body.dark .ins-card.expiring{background:rgba(245,158,11,.1)!important;border-color:rgba(245,158,11,.28)!important}
body.dark .ins-card.expired{background:rgba(220,38,38,.08)!important;border-color:rgba(220,38,38,.28)!important;opacity:.88}

body.dark .step-item.done{background:rgba(5,150,105,.2)!important;color:#6EE7B7!important}

body.dark .fdp-popup{background:#262626!important;border-color:rgba(255,255,255,.1)!important}
body.dark .fdp-days-header{background:rgba(255,255,255,.025)!important}
body.dark .fdp-days{background:rgba(255,255,255,.025)!important}
body.dark .fdp-ym-grid{background:rgba(255,255,255,.025)!important}
body.dark .fdp-footer{background:#1F1F1F!important;border-color:rgba(255,255,255,.07)!important}
body.dark .fdp-ym-item{background:rgba(255,255,255,.06)!important;color:var(--text)!important;border-color:rgba(255,255,255,.09)!important;box-shadow:none!important}
body.dark .fdp-ym-item:hover{border-color:var(--primary)!important;color:#34D399!important;background:rgba(var(--primary-rgb),.15)!important}
body.dark .fdp-day{color:var(--text)!important}
body.dark .fdp-day:hover:not(:disabled):not(.fdp-selected){background:rgba(var(--primary-rgb),.18)!important;color:#34D399!important}

body.dark .tag-input-wrap{background:rgba(255,255,255,.03)!important;border-color:rgba(255,255,255,.06)!important}

body.dark .acc-linked{background:rgba(5,150,105,.14)!important;border-color:rgba(5,150,105,.25)!important;color:#6EE7B7!important}




body.light .detail-tabs{background:rgba(32,33,35,.05)!important;border-color:#E5E5E7!important}
body.light .detail-tab:hover:not(.active){background:rgba(32,33,35,.06)!important;color:#202123!important}
body.light .info-item{background:rgba(32,33,35,.04)!important;border-color:#E5E5E7!important}
body.light .prop-card-footer{background:rgba(32,33,35,.035)!important;border-color:#E5E5E7!important}
body.light tr:hover td{background:rgba(32,33,35,.04)!important}
body.light th{background:rgba(32,33,35,.05)!important}
body.light .modal{background:#FFFFFF!important;border-color:#E5E5E7!important}
body.light .modal-footer{background:rgba(32,33,35,.03)!important;border-color:#E5E5E7!important}
body.light .chat-messages{background:rgba(32,33,35,.02)!important}
body.light .chat-bubble.other{background:#FFFFFF!important;border-color:#E5E5E7!important;color:#202123!important}
body.light .kanban-col{background:rgba(32,33,35,.04)!important;border-color:#E5E5E7!important}
body.light .msgboard-compose{background:rgba(32,33,35,.02)!important;border-bottom-color:#E5E5E7!important}
body.light .msgboard-compose textarea{background:#FFFFFF!important;border-color:#E5E5E7!important;color:#202123!important}
body.light .msg-post:hover{background:rgba(32,33,35,.04)!important}
body.light .msg-post.pinned{background:linear-gradient(135deg,rgba(180,83,9,.07),rgba(161,98,7,.1))!important;border-right-color:#D97706!important}
body.light .msg-post.chat-msg-post{background:var(--accent-soft)!important;border-right-color:var(--accent)!important}
body.light .notif-item:hover{background:rgba(32,33,35,.04)!important}
body.light .notif-item.unread{background:rgba(var(--primary-rgb),.07)!important;border-right-color:var(--primary)!important}
body.light .util-row:hover{background:rgba(32,33,35,.04)!important}
body.light .util-row{border-bottom-color:#F2F2F3!important}
body.light .ins-card.expiring{border-color:rgba(217,119,6,.4)!important}
body.light .ins-card.expired{border-color:rgba(220,38,38,.4)!important}
body.light .step-item.done{background:rgba(5,150,105,.12)!important;color:#4D525A!important}
body.light .fdp-popup{background:#FFFFFF!important;border-color:#E5E5E7!important}
body.light .fdp-days-header{background:rgba(32,33,35,.03)!important}
body.light .fdp-days{background:rgba(32,33,35,.02)!important}
body.light .fdp-ym-grid{background:rgba(32,33,35,.02)!important}
body.light .fdp-footer{background:rgba(32,33,35,.03)!important;border-color:#E5E5E7!important}
body.light .fdp-ym-item{background:#FFFFFF!important;border-color:#E5E5E7!important;color:#202123!important}
body.light .fdp-ym-item:hover{border-color:var(--primary)!important;color:var(--primary)!important}
body.light .tag-input-wrap{background:rgba(32,33,35,.03)!important;border-color:#E5E5E7!important}
body.light .kanban-card{background:var(--card)!important;border-color:#E5E5E7!important}
body.light .task-item{border-color:#E5E5E7!important;background:var(--card)!important}
body.light .tl-file-chip{background:#F7F7F8!important;border-color:#E5E5E7!important;color:#6B6B70!important}
body.light .chat-input{border-color:#E5E5E7!important;background:#FFFFFF!important;color:#202123!important}
body.light .chat-input:focus{border-color:var(--primary)!important}
body.light .note-composer{border-color:#E5E5E7!important;background:var(--card)!important}
body.light .note-composer-toolbar{background:rgba(32,33,35,.03)!important;border-color:#E5E5E7!important}
body.light .card-header{border-color:#E5E5E7!important}
body.light .modal-header{border-color:#E5E5E7!important}
body.light .msgboard-wrap{border-color:#E5E5E7!important}



body.light .prop-card{box-shadow:0 2px 12px rgba(0,0,0,.1),0 1px 3px rgba(0,0,0,.06)!important}
body.light .prop-card:hover{box-shadow:0 12px 40px rgba(0,0,0,.15),0 2px 8px rgba(0,0,0,.08)!important;border-color:rgba(0,0,0,.15)!important}

body.dark .alert-card.clickable:hover{box-shadow:0 4px 16px rgba(0,0,0,.3)!important}
body.light .alert-card.clickable:hover{box-shadow:0 4px 16px rgba(0,0,0,.12)!important}

body.dark .task-item{border-color:rgba(255,255,255,.07)!important;background:rgba(255,255,255,.03)!important}
body.dark .task-item:hover{box-shadow:0 4px 16px rgba(0,0,0,.28)!important;border-color:rgba(255,255,255,.1)!important}
body.dark .task-priority-high{border-right-color:var(--danger)!important}
body.dark .task-priority-medium{border-right-color:var(--warning)!important}
body.dark .task-priority-low{border-right-color:var(--success)!important}
body.light .task-item{border-color:#E5E5E7!important;background:var(--card)!important}

body.dark #topbar{border-bottom-color:rgba(255,255,255,.08)!important}

body.dark .search-bar{border-color:rgba(255,255,255,.08)!important}
body.light .search-bar{border-color:#E5E5E7!important}

body.light .detail-section{border-color:#E5E5E7!important}
body.light .detail-header{border-color:#E5E5E7!important}

body.light .card{border-color:#E5E5E7!important;box-shadow:0 2px 8px rgba(0,0,0,.08)!important}

body.light .gnote-item{border-color:#E5E5E7!important}

body.dark .mention-dropdown{border-color:rgba(255,255,255,.1)!important}
body.light .mention-dropdown{border-color:#E5E5E7!important;background:#FFFFFF!important}




.modal-overlay{position:fixed;inset:0;background:rgba(19, 22, 28,.5);backdrop-filter:blur(8px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;animation:modalOverlayIn .15s ease-out}
.modal{background:var(--card);border-radius:var(--radius-lg);width:100%;max-width:760px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(0,0,0,.18);border:1px solid var(--border);animation:modalIn .2s cubic-bezier(.16,1,.3,1)}
@keyframes modalOverlayIn{from{opacity:0}to{opacity:1}}
@keyframes modalIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media (prefers-reduced-motion: reduce){.modal-overlay,.modal{animation:none}}
.modal-lg{max-width:920px}
.modal-header{padding:18px 24px;border-bottom:1px solid var(--border-light);display:flex;align-items:center;justify-content:space-between}
.modal-title{font-size:16px;font-weight:800}
.modal-body{padding:22px 24px;overflow-y:auto;flex:1}
.modal-footer{padding:16px 24px;border-top:1px solid var(--border-light);display:flex;gap:8px;justify-content:flex-end;background:var(--surface-muted);border-radius:0 0 var(--radius-lg) var(--radius-lg)}
.modal-close{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:6px;border-radius:8px;line-height:1;transition:.15s;display:flex;align-items:center;justify-content:center}
.modal-close:hover{background:var(--surface-muted);color:var(--text)}


.step-bar{display:flex;gap:0;margin-bottom:24px;background:var(--surface-muted);border-radius:12px;overflow:hidden;padding:4px;gap:3px}
.step-item{flex:1;padding:8px 4px;text-align:center;font-size:11px;background:transparent;color:var(--text-muted);border-radius:9px;cursor:pointer;transition:.18s;border:none}
.step-item.active{background:var(--card);color:var(--primary);font-weight:700;box-shadow:var(--shadow)}
.step-item.done{background:var(--success-light);color:var(--success);font-weight:600}
.step-num{font-size:14px;font-weight:800;display:block}


.timeline{list-style:none}
.tl-item{display:flex;gap:14px;padding:12px 0;border-bottom:1px solid var(--border-light);position:relative}
.tl-item:last-child{border-bottom:none}
.tl-dot{width:10px;height:10px;border-radius:50%;background:var(--primary);flex-shrink:0;margin-top:5px;box-shadow:0 0 0 3px var(--primary-glass)}
.tl-body{flex:1;min-width:0}
.tl-text{font-size:13px;color:var(--text);line-height:1.6}
.tl-date{font-size:11px;color:var(--text-muted);white-space:nowrap;margin-top:2px}
.tl-author{font-size:11px;color:var(--text-muted);margin-bottom:3px;font-weight:600}
.tl-attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.tl-img-thumb{width:80px;height:80px;object-fit:cover;border-radius:8px;cursor:pointer;border:1.5px solid var(--border);transition:.18s}
.tl-img-thumb:hover{transform:scale(1.05);box-shadow:var(--shadow)}
.tl-file-chip{display:inline-flex;align-items:center;gap:6px;background:var(--bg);border:1.5px solid var(--border);border-radius:20px;padding:5px 12px 5px 8px;font-size:12px;color:var(--text);text-decoration:none;transition:.15s;max-width:220px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.tl-file-chip:hover{border-color:var(--primary);color:var(--primary)}
.mention-chip{display:inline-block;background:var(--primary-glass);color:var(--primary);border-radius:20px;padding:1px 8px;font-size:12px;font-weight:700;cursor:default}



.note-composer{border:1.5px solid var(--border);border-radius:14px;background:var(--card);overflow:hidden;transition:.18s;margin-top:14px}
.note-composer:focus-within{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-glass)}
.note-composer-textarea{width:100%;border:none;outline:none;padding:12px 14px 8px;font-size:13px;font-family:inherit;resize:none;min-height:64px;background:transparent;color:var(--text);line-height:1.6}
.note-composer-textarea::placeholder{color:var(--text-muted)}
.note-composer-attachments{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 8px}
.nc-att-preview{position:relative;display:inline-block}
.nc-att-img{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1.5px solid var(--border)}
.nc-att-file{display:inline-flex;align-items:center;gap:5px;background:var(--bg);border:1.5px solid var(--border);border-radius:20px;padding:4px 10px;font-size:11px;color:var(--text)}
.nc-att-del{position:absolute;top:-5px;right:-5px;width:16px;height:16px;background:var(--danger-light);color:#fff;border-radius:50%;font-size:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;line-height:1}
.note-composer-toolbar{display:flex;align-items:center;gap:4px;padding:6px 10px;border-top:1px solid var(--border-light);background:var(--bg)}
.nc-tool-btn{width:32px;height:32px;border:none;background:transparent;cursor:pointer;border-radius:8px;color:var(--text-muted);font-size:16px;display:flex;align-items:center;justify-content:center;transition:.15s}
.nc-tool-btn:hover{background:var(--border-light);color:var(--primary)}
.nc-submit-btn{margin-right:auto;padding:6px 18px;font-size:12px;font-weight:700}

.mention-dropdown{position:absolute;background:var(--card);border:1.5px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg,0 8px 30px rgba(0,0,0,.12));z-index:9999;min-width:180px;overflow:hidden;display:none}
.mention-dropdown.open{display:block}
.mention-item{display:flex;align-items:center;gap:8px;padding:9px 14px;cursor:pointer;font-size:13px;transition:.12s}
.mention-item:hover,.mention-item.active{background:var(--primary-glass);color:var(--primary)}
.mention-avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;flex-shrink:0}

.img-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:99999;display:flex;align-items:center;justify-content:center;cursor:zoom-out}
.img-lightbox img{max-width:90vw;max-height:90vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.img-lightbox-close{position:fixed;z-index:2;top:22px;right:22px;display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.28);border-radius:13px;background:rgba(10,10,10,.55);color:#fff;font:300 28px/1 inherit;cursor:pointer;backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.img-lightbox-close:hover{background:rgba(255,255,255,.14)}


.gnote-tag{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;cursor:pointer;border:1.5px solid transparent;transition:.15s;white-space:nowrap}
.gnote-tag:hover{filter:brightness(.92)}
.gnote-tag.active{box-shadow:0 0 0 2px var(--primary)}
.gnote-tag-cloud{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;align-items:center}
.gnote-tag-cloud-label{font-size:12px;color:var(--text-muted);margin-left:4px}
.gnote-item{background:var(--card);border:1.5px solid var(--border);border-radius:12px;padding:14px 16px;margin-bottom:10px;transition:.18s}
.gnote-item:hover{box-shadow:var(--shadow)}
.gnote-item-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.gnote-item-author{font-size:12px;font-weight:700;color:var(--text)}
.gnote-item-role{font-size:11px;color:var(--text-muted)}
.gnote-item-date{font-size:11px;color:var(--text-muted);margin-right:auto}
.gnote-item-text{font-size:13px;color:var(--text);line-height:1.7;margin-bottom:8px;white-space:pre-wrap;word-break:break-word}
.gnote-item-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.gnote-item-del{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:16px;padding:0 2px;opacity:.5;transition:.1s}
.gnote-item-del:hover{color:var(--danger,var(--danger));opacity:1}
.gnote-empty{text-align:center;padding:30px;color:var(--text-muted);font-size:13px}
.tag-input-wrap{display:flex;flex-wrap:wrap;gap:5px;align-items:center;padding:6px 10px;border-top:1px solid var(--border-light);background:var(--bg-subtle,var(--card));border-radius:0 0 8px 8px}
.tag-input-wrap input{border:none;outline:none;font-size:12px;background:transparent;font-family:inherit;flex:1;min-width:80px;color:var(--text)}
.pending-tag{display:inline-flex;align-items:center;gap:4px;background:var(--primary-glass);color:var(--primary);border-radius:20px;padding:2px 8px;font-size:11px;font-weight:700}
.pending-tag button{background:none;border:none;cursor:pointer;color:inherit;font-size:12px;padding:0;line-height:1}



.task-item{display:flex;align-items:flex-start;flex-wrap:wrap;gap:10px;padding:12px 14px;border:1px solid var(--border);border-radius:10px;margin-bottom:8px;background:var(--card);transition:.18s}
.task-item:hover{box-shadow:var(--shadow)}
.task-item.done{opacity:.55}
.task-item.done .task-title{text-decoration:line-through}
.task-title{font-size:13px;font-weight:600;flex:1}
.task-meta{font-size:11px;color:var(--text-light);margin-top:3px}
.task-priority-high{border-right:3px solid var(--danger)}
.task-priority-medium{border-right:3px solid var(--warning)}
.task-priority-low{border-right:3px solid var(--success)}


.search-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:var(--card);padding:14px 18px;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border);margin-bottom:18px}
.search-bar input{flex:1;min-width:180px}
.search-bar select{min-width:130px}


.empty-state{text-align:center;padding:60px 20px;color:var(--text-muted)}
.empty-state svg{width:64px;height:64px;margin:0 auto 16px;opacity:.25}
.empty-state h3{font-size:16px;font-weight:700;margin-bottom:6px;color:var(--text-light)}
.empty-state p{font-size:13px}




#auth-boot-screen{position:fixed;inset:0;width:100vw;height:100dvh;display:flex;align-items:center;justify-content:center;background:#0b0f14;z-index:2147483647;color:var(--text);font-family:Inter,Arial,Tahoma,sans-serif;padding:24px;box-sizing:border-box}.auth-boot-card{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;font-size:14px;font-weight:650}.auth-boot-card img{width:82px;height:auto}.auth-boot-spinner{width:30px;height:30px;border:3px solid rgba(255,255,255,.16);border-top-color:var(--primary);border-radius:50%;animation:authBootSpin .8s linear infinite}@keyframes authBootSpin{to{transform:rotate(360deg)}}
#login-screen{position:fixed;inset:0;width:100vw;height:100dvh;background:radial-gradient(circle at 50% 10%,#1E2127 0,#0b0f14 42%,#080b0f 100%);display:none;align-items:center;justify-content:center;z-index:2147483646;overflow:auto;padding:32px;box-sizing:border-box;isolation:isolate}body.auth-booting #auth-boot-screen{display:flex!important}body.auth-login #auth-boot-screen,body.auth-app #auth-boot-screen{display:none!important}body.auth-login #login-screen{display:flex!important}body.auth-booting #login-screen,body.auth-app #login-screen{display:none!important}body.auth-booting #app,body.auth-login #app{display:none!important}body.auth-app #app{display:flex!important}body.auth-booting,body.auth-login{overflow:hidden!important}body.auth-app{overflow-x:hidden}
.login-box{background:#fff;border-radius:24px;padding:30px 38px 36px;width:min(100%,480px);box-shadow:0 28px 80px rgba(0,0,0,.46);border:1px solid rgba(255,255,255,.12);position:relative;z-index:1;color:#1C1F25!important;animation:loginBoxIn .28s ease-out}.login-box *{box-sizing:border-box}.login-box h1,.login-box label,.login-box p,.login-box span,.login-box div{color:inherit}@keyframes loginBoxIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.login-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-height:42px}.login-toolbar>label{font-size:12px;font-weight:700;color:var(--text-secondary)!important}.login-language-wrap{height:42px;min-width:142px;border:1px solid #E1E2EC;border-radius:12px;display:flex;align-items:center;gap:8px;padding:0 11px;color:var(--text-secondary);background:var(--card)}.login-language-wrap select{border:0;background:transparent;outline:0;width:100%;height:100%;font:700 13px/1 Inter,Arial,Tahoma,sans-serif;color:#1C1F25;cursor:pointer}
.login-brand{text-align:center;margin:8px 0 28px}.login-brand img{width:88px;height:auto;display:block;margin:0 auto 12px}.login-brand h1{font-size:25px;line-height:1.2;font-weight:850;color:var(--text)!important;margin:0;letter-spacing:-.035em}.login-brand p{font-size:13.5px;line-height:1.6;color:var(--text-secondary)!important;margin:8px auto 0;max-width:340px}.login-form-stack{display:grid;gap:18px}.login-form-group{margin:0!important}.login-label-row{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:8px}#login-screen .form-label{display:block;color:var(--text)!important;font-size:13.5px!important;line-height:1.2;font-weight:750!important;margin:0 0 8px}.login-label-row .form-label{margin:0!important}.login-link-btn,.login-otp-btn{border:0;background:transparent;color:#6A6F77!important;font-family:inherit;font-weight:750;cursor:pointer}.login-link-btn{font-size:12.5px;padding:3px 0}.login-link-btn:hover,.login-otp-btn:hover{text-decoration:underline}
.login-input-wrap{position:relative;display:flex;align-items:center}.login-input-wrap>svg{position:absolute;inset-inline-start:16px;color:var(--text-secondary);pointer-events:none;z-index:2}#login-screen .form-control{width:100%!important;height:54px!important;min-height:54px!important;background:#fff!important;border:1.5px solid #E1E2EC!important;color:#1C1F25!important;border-radius:13px!important;padding:0 16px 0 48px!important;font-size:15px!important;font-family:Inter,Arial,Tahoma,sans-serif!important;line-height:1!important;outline:none!important;box-shadow:none!important}html[dir="rtl"] #login-screen .form-control{padding:0 48px 0 16px!important}#login-screen .form-control::placeholder{color:#9aa7b7!important}#login-screen .form-control:focus{border-color:var(--primary)!important;box-shadow:0 0 0 4px rgba(var(--primary-rgb),.12)!important}
.captcha-block{border:1.5px solid #E1E2EC;border-radius:14px;background:var(--card);padding:12px 14px}.captcha-header{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;font-weight:750;color:var(--text-secondary)!important;margin-bottom:9px}.captcha-refresh{width:32px;height:32px;border:0;border-radius:9px;background:#fff;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 3px rgba(19, 22, 28,.08)}.captcha-refresh:hover{color:#6A6F77;background:#ecfdf5}.captcha-row{display:flex;align-items:center;gap:12px}.captcha-q{flex:1;height:46px;border-radius:11px;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:850;direction:ltr;color:#1C1F25!important}.captcha-ans{width:100px!important;height:46px!important;border-radius:11px!important;border:1.5px solid #E1E2EC!important;background:#fff!important;color:#1C1F25!important;text-align:center!important;font-size:17px!important;font-weight:800!important;outline:none}.captcha-ans:focus{border-color:var(--primary)!important;box-shadow:0 0 0 4px rgba(var(--primary-rgb),.12)!important}.login-error{border-radius:11px;background:#fef2f2;border:1px solid #fecaca;color:#b91c1c!important;padding:10px 12px;font-size:12.5px;line-height:1.5}.login-submit-btn{width:100%;height:54px;border:0;border-radius:13px;background:var(--primary);color:#fff!important;font-family:inherit;font-size:15px;font-weight:850;cursor:pointer;box-shadow:0 8px 20px rgba(var(--primary-rgb),.24);transition:.16s}.login-submit-btn:hover{background:#767B83;transform:translateY(-1px)}.login-submit-btn:disabled{opacity:.62;cursor:wait;transform:none}.login-otp-btn{justify-self:center;font-size:13px;padding:2px 8px}#login-screen .text-danger{color:#b91c1c!important}.otp-alt-link{display:none!important}
@media(max-width:560px){#login-screen{padding:14px;align-items:flex-start}.login-box{width:100%;border-radius:20px;padding:20px 20px 28px;margin:auto 0}.login-toolbar{justify-content:space-between}.login-brand{margin:8px 0 22px}.login-brand h1{font-size:22px}.login-language-wrap{min-width:136px}#login-screen .form-control,.login-submit-btn{height:52px!important;min-height:52px!important}}



.report-section{margin-bottom:24px}
.report-section h3{font-size:15px;font-weight:700;margin-bottom:14px;color:var(--text)}


.kanban-board{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:start}
.kanban-col{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:.18s}
.kanban-col-header{padding:12px 16px;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-light);letter-spacing:.02em}
.kanban-col-body{padding:10px;min-height:140px;display:flex;flex-direction:column;gap:8px;transition:.18s;border-radius:0 0 var(--radius) var(--radius)}
.kanban-col-body.drag-over{background:rgba(var(--primary-rgb),.07);outline:2px dashed var(--primary);outline-offset:-4px}
.kanban-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:10px 14px;box-shadow:var(--shadow);cursor:grab;transition:.18s;user-select:none}
.kanban-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}
.kanban-card.dragging{opacity:.35;transform:scale(.96) rotate(-1deg);box-shadow:none;cursor:grabbing}
.kanban-card-title{font-size:13px;font-weight:700;margin-bottom:4px}
.kanban-card-meta{font-size:11px;color:var(--text-muted);display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.kanban-card-actions{display:flex;gap:4px;margin-top:8px}
.kanban-empty{text-align:center;padding:28px 12px;color:var(--text-muted);font-size:12px;pointer-events:none}


.chat-wrap{display:flex;flex-direction:column;height:540px;background:var(--card);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow);overflow:hidden}
.chat-header{padding:14px 18px;background:linear-gradient(135deg,#0D1117,#25282E);color:var(--text);font-weight:700;font-size:14px;display:flex;align-items:center;gap:10px}
.chat-messages{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;background:var(--card)}
.chat-msg{display:flex;gap:8px;align-items:flex-end}
.chat-msg.mine{flex-direction:row-reverse}
.chat-avatar{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex-shrink:0;color:#fff}
.chat-bubble-wrap{max-width:68%;display:flex;flex-direction:column;gap:2px}
.chat-msg.mine .chat-bubble-wrap{align-items:flex-end}
.chat-bubble{padding:10px 14px;border-radius:14px;font-size:13px;line-height:1.55;word-break:break-word}
.chat-bubble.other{background:#fff;border:1px solid var(--border);border-radius:16px 16px 16px 3px;color:var(--text);box-shadow:var(--shadow)}
.chat-bubble.mine{background:linear-gradient(135deg,var(--primary),#3B82F6);color:#fff;border-radius:16px 16px 3px 16px;box-shadow:0 4px 12px rgba(var(--primary-rgb),.3)}
.chat-meta{font-size:10px;color:var(--text-muted);padding:0 4px}
.chat-footer{padding:8px 12px;background:var(--card);border-top:1px solid var(--border-light);position:relative}
.chat-footer-atts{display:flex;flex-wrap:wrap;gap:6px;padding:4px 2px 6px;empty-cells:hide}
.chat-footer-atts:empty{display:none}
.chat-footer-row{display:flex;gap:8px;align-items:flex-end}
.chat-input{flex:1;resize:none;border:1.5px solid var(--border);border-radius:12px;padding:9px 14px;font-size:13px;outline:none;max-height:100px;font-family:inherit;transition:.15s}
.chat-input:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-glass)}
.chat-send-btn{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--primary),#3B82F6);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.18s;box-shadow:0 4px 12px rgba(var(--primary-rgb),.3)}
.chat-send-btn:hover{transform:scale(1.07)}
.chat-tool-btn{width:32px;height:32px;border:none;background:transparent;cursor:pointer;border-radius:8px;color:var(--text-muted);font-size:16px;display:flex;align-items:center;justify-content:center;transition:.15s;flex-shrink:0}
.chat-tool-btn:hover{background:var(--border-light);color:var(--primary)}
.chat-att-img{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1.5px solid var(--border)}
.chat-att-file-chip{display:inline-flex;align-items:center;gap:5px;background:var(--bg);border:1.5px solid var(--border);border-radius:20px;padding:4px 10px;font-size:11px;color:var(--text)}
.chat-mention-dd{position:absolute;background:var(--card);border:1.5px solid var(--border);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.12);z-index:9999;min-width:180px;overflow:hidden;display:none;bottom:100%;right:14px;margin-bottom:4px}
.chat-mention-dd.open{display:block}
.chat-msg-img{width:180px;max-width:100%;border-radius:10px;margin-top:6px;cursor:pointer;display:block}
.chat-msg-file{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.15);border-radius:20px;padding:5px 12px;font-size:12px;color:inherit;text-decoration:none;margin-top:5px;border:1px solid rgba(255,255,255,.2)}
.chat-msg-file.other{background:var(--bg);color:var(--text);border-color:var(--border)}
.chat-day-divider{text-align:center;font-size:11px;color:var(--text-muted);margin:4px 0;position:relative}
.chat-day-divider::before,.chat-day-divider::after{content:'';position:absolute;top:50%;width:30%;height:1px;background:var(--border)}
.chat-day-divider::before{right:0}.chat-day-divider::after{left:0}




.member-avatar-row{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.member-av{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;cursor:default;flex-shrink:0;border:2px solid var(--card)}
.member-av:hover::after{content:attr(title);position:absolute;background:#262626;color:#fff;padding:3px 8px;border-radius:6px;font-size:11px;white-space:nowrap;z-index:9999;margin-top:30px}
.notif-item{display:flex;gap:10px;align-items:flex-start;padding:11px 16px;border-bottom:1px solid var(--border-light);cursor:pointer;transition:.12s}
.notif-item:hover{background:var(--bg-subtle,var(--card))}
.notif-item.unread{background:#F5F6FF;border-right:3px solid var(--primary)}
.notif-dot{width:8px;height:8px;border-radius:50%;background:var(--primary);flex-shrink:0;margin-top:5px}
.notif-dot.read{background:transparent;border:1.5px solid var(--border)}
.notif-body{flex:1;min-width:0}
.notif-prop{font-size:11px;font-weight:700;color:var(--primary);margin-bottom:2px}
.notif-text{font-size:12px;color:var(--text);line-height:1.5}
.notif-time{font-size:10px;color:var(--text-muted);margin-top:2px}
.notif-badge{background:var(--danger-light);color:#fff;border-radius:20px;font-size:10px;font-weight:800;padding:2px 6px;min-width:18px;text-align:center;display:inline-block;animation:badgePulse 1.8s ease-in-out infinite}
.msg-compose-footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:8px}
.msg-compose-tools{display:flex;align-items:center;gap:4px}
.msg-att-preview{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;empty-cells:hide}
.msg-att-preview:empty{display:none}
.msgboard-mention-dd{position:absolute;background:var(--card);border:1.5px solid var(--border);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.12);z-index:9999;min-width:180px;overflow:hidden;display:none;bottom:calc(100% + 4px);right:0}
.msgboard-mention-dd.open{display:block}


/* z-index 9999 put toasts BELOW the app's full-screen overlays (modals 100000-300000, the
   property gallery album 1000000, gallery progress 1000005, draft lightbox 1000010), so any
   error raised while one of those was open rendered behind it and was invisible. Lifted above
   all of them, but still below the auth/boot screens (2147483646/47) which must always win. */
.toast-container{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:2147483000;display:flex;flex-direction:column;gap:10px;align-items:center;pointer-events:none}
.toast{background:#262626;color:#fff;padding:12px 20px;border-radius:40px;font-size:13px;font-weight:600;box-shadow:0 8px 24px rgba(0,0,0,.22);display:flex;align-items:center;gap:8px;animation:toastIn .28s cubic-bezier(.34,1.56,.64,1);pointer-events:all}
.toast-close{background:none;border:0;color:inherit;font-size:18px;line-height:1;cursor:pointer;opacity:.85;padding:0 2px;margin-inline-start:6px;flex-shrink:0}
.toast-close:hover{opacity:1}
.toast.success{background:linear-gradient(135deg,var(--accent-soft),#10B981)}
.toast.info{background:linear-gradient(135deg,var(--primary),#3B82F6)}
.toast.warning{background:linear-gradient(135deg,#D97706,#F59E0B)}
.toast.error{background:linear-gradient(135deg,var(--danger-light),#EF4444)}
@keyframes toastIn{from{opacity:0;transform:translateY(20px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes toastOut{to{opacity:0;transform:translateY(10px) scale(.9)}}

@keyframes svgFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes svgFadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes svgPop{0%{transform:scale(0)}70%{transform:scale(1.1)}100%{transform:scale(1)}}
@keyframes svgSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes svgPulseRing{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.6);opacity:0}}
@keyframes svgDash{to{stroke-dashoffset:0}}
@keyframes svgWave{0%,100%{d:path("M0,20 Q25,10 50,20 Q75,30 100,20 L100,40 L0,40 Z")}50%{d:path("M0,20 Q25,30 50,20 Q75,10 100,20 L100,40 L0,40 Z")}}
@keyframes badgePulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.5)}50%{box-shadow:0 0 0 6px rgba(239,68,68,0)}}
@keyframes overdueShake{0%,100%{transform:translateX(0) rotate(0)}10%{transform:translateX(-4px) rotate(-1.5deg)}20%{transform:translateX(4px) rotate(1.5deg)}30%{transform:translateX(-3px) rotate(-1deg)}40%{transform:translateX(3px) rotate(1deg)}50%{transform:translateX(-2px)}60%{transform:translateX(2px)}70%,90%{transform:translateX(0)}}
@keyframes overduePulseGlow{0%,100%{box-shadow:0 2px 8px rgba(239,68,68,.08),inset -4px 0 0 var(--danger-light)}50%{box-shadow:0 2px 24px rgba(239,68,68,.35),inset -4px 0 0 #EF4444}}
@keyframes overdueIconPop{0%,80%,100%{transform:scale(1)}40%{transform:scale(1.15)}}
.overdue-card-active{animation:overduePulseGlow 2s ease-in-out infinite}
.overdue-icon-active{animation:overdueIconPop 2s ease-in-out infinite}
@keyframes counterUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
.svg-float{animation:svgFloat 3s ease-in-out infinite}
.svg-fade-up{animation:svgFadeUp .5s cubic-bezier(.34,1.2,.64,1) both}
.svg-pop{animation:svgPop .4s cubic-bezier(.34,1.56,.64,1) both}
.badge-pulse{animation:badgePulse 1.8s ease-in-out infinite}


.acc-linked{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;color:var(--accent-text);background:#DCFCE7;padding:2px 7px;border-radius:20px;border:1px solid #BBF7D0}


.divider{border:none;border-top:1px solid var(--border-light);margin:16px 0}
.text-sm{font-size:12px}
.text-muted{color:var(--text-light)}
.text-success{color:var(--success)}
.text-danger{color:var(--danger)}
.text-warning{color:var(--warning)}
.text-primary{color:var(--primary)}
.fw-bold{font-weight:800}
.fw-600{font-weight:700}
.mt-8{margin-top:8px}
.mt-12{margin-top:12px}
.mt-16{margin-top:16px}
.gap-8{gap:8px}
.flex{display:flex}
.flex-center{display:flex;align-items:center}
.flex-between{display:flex;align-items:center;justify-content:space-between}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
.hidden{display:none!important}
.page{display:none}

.page.active{display:block;animation:pageFadeIn .28s cubic-bezier(.16,1,.3,1)}
@keyframes pageFadeIn{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}
@media (prefers-reduced-motion:reduce){
  .page.active{animation:none}
}
.num{font-variant-numeric:tabular-nums}





.ztodo-shell{display:grid;grid-template-columns:250px minmax(0,1fr);gap:0;min-height:calc(100vh - 94px);background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.ztodo-sidebar{background:rgba(19, 22, 28,.03);border-left:1px solid var(--border);padding:14px 12px;display:flex;flex-direction:column;gap:12px;min-width:0}
.ztodo-new{height:42px;border:none;border-radius:12px;background:linear-gradient(135deg,var(--primary),#3B82F6);color:#fff;font-family:inherit;font-size:14px;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 10px 22px rgba(var(--primary-rgb),.24)}
.ztodo-section-title{font-size:10px;font-weight:900;color:var(--primary);letter-spacing:.4px;margin:8px 6px 2px}
.ztodo-nav{display:flex;flex-direction:column;gap:4px}
.ztodo-nav-btn{border:none;background:transparent;color:var(--text);border-radius:10px;padding:9px 10px;font-family:inherit;font-size:12px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px;transition:.15s;text-align:end}
.ztodo-nav-btn:hover{background:rgba(var(--primary-rgb),.08);color:var(--primary)}
.ztodo-nav-btn.active{background:rgba(var(--primary-rgb),.14);color:var(--primary)}
.ztodo-nav-left{display:flex;align-items:center;gap:8px;min-width:0}
.ztodo-count{min-width:22px;height:22px;border-radius:8px;background:rgba(148,163,184,.16);color:var(--text-muted);font-size:10px;font-weight:900;display:flex;align-items:center;justify-content:center;padding:0 6px}
.ztodo-main{min-width:0;display:flex;flex-direction:column;background:var(--bg)}
.ztodo-top{height:62px;background:var(--card);border-bottom:1px solid var(--border);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.ztodo-brand{display:flex;align-items:center;gap:10px;min-width:0}
.ztodo-brand-icon{width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,#10B981,#34D399);color:#fff;font-size:16px;display:flex;align-items:center;justify-content:center;font-weight:900}
.ztodo-title{font-size:16px;font-weight:950;color:var(--text);line-height:1.2}
.ztodo-subtitle{font-size:10px;font-weight:800;color:var(--text-muted);margin-top:2px}
.ztodo-search{min-width:260px;max-width:360px;flex:1;background:var(--bg);border:1.5px solid var(--border);border-radius:12px;color:var(--text);font-family:inherit;font-size:12px;font-weight:700;padding:10px 12px;outline:none}
.ztodo-search:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}
.ztodo-tabs{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--card);border-bottom:1px solid var(--border);padding:0 14px}
.ztodo-tab-row{display:flex;align-items:center;gap:4px}
.ztodo-tab{height:42px;border:none;border-bottom:3px solid transparent;background:transparent;color:var(--text-muted);font-family:inherit;font-size:13px;font-weight:900;cursor:pointer;padding:0 12px;display:flex;align-items:center;gap:6px}
.ztodo-tab.active{color:var(--primary);border-bottom-color:var(--primary)}
.ztodo-tool{border:1.5px solid var(--border);background:var(--card);color:var(--text);border-radius:10px;padding:7px 10px;font-size:11px;font-weight:900;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;transition:.15s}
.ztodo-tool:hover{background:var(--bg);border-color:#93C5FD;color:var(--primary)}
.ztodo-content{padding:14px;overflow:auto;min-height:0}
.ztodo-board{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:12px;align-items:start}
.ztodo-col{background:var(--card);border:1px solid var(--border);border-top:4px solid var(--col-color,var(--primary));border-radius:14px;min-height:180px;box-shadow:var(--shadow);overflow:hidden}
.ztodo-col-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 12px 10px;border-bottom:1px solid var(--border-light)}
.ztodo-col-title{font-size:13px;font-weight:950;color:var(--text);display:flex;align-items:center;gap:7px}
.ztodo-col-count{min-width:24px;height:24px;border-radius:8px;background:var(--bg);border:1px solid var(--border-light);font-size:11px;font-weight:950;color:var(--text-muted);display:flex;align-items:center;justify-content:center}
.ztodo-col-body{padding:10px;display:flex;flex-direction:column;gap:9px}
.ztodo-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:11px;cursor:pointer;transition:.15s;box-shadow:0 1px 0 rgba(19, 22, 28,.04)}
.ztodo-card:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(19, 22, 28,.10);border-color:#93C5FD}
.ztodo-card-title{font-size:13px;font-weight:900;color:var(--text);line-height:1.55;margin-bottom:8px}
.ztodo-card-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:10px;font-weight:800;color:var(--text-muted)}
.ztodo-pill{border-radius:999px;padding:2px 8px;font-size:10px;font-weight:900;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.ztodo-avatars{display:flex;align-items:center;flex-direction:row-reverse}
.ztodo-avatar{width:24px;height:24px;border-radius:7px;border:2px solid var(--card);margin-right:-6px;background:var(--primary);color:#fff;font-size:9px;font-weight:900;display:flex;align-items:center;justify-content:center;overflow:hidden}
.ztodo-list{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.ztodo-list-head,.ztodo-list-row{display:grid;grid-template-columns:minmax(260px,1fr) 190px 120px 120px;gap:0;align-items:center}
.ztodo-list-head{background:rgba(148,163,184,.08);border-bottom:1px solid var(--border);min-height:40px;color:var(--text-muted);font-size:11px;font-weight:950}
.ztodo-list-head>div,.ztodo-list-row>div{padding:10px 12px;border-left:1px solid var(--border-light);min-width:0}
.ztodo-list-row{min-height:52px;border-bottom:1px solid var(--border-light);background:var(--card);cursor:pointer;transition:.15s}
.ztodo-list-row:hover{background:rgba(var(--primary-rgb),.06)}
.ztodo-group{background:rgba(148,163,184,.08);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:10px 12px;font-size:13px;font-weight:950;color:var(--text);display:flex;align-items:center;gap:10px}
.ztodo-group-dot{width:12px;height:12px;border-radius:4px;background:var(--group-color,var(--primary))}
.ztodo-check{width:18px;height:18px;border-radius:50%;border:2px solid var(--border);background:transparent;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:10px;margin-left:8px;vertical-align:middle}
.ztodo-check.done{background:var(--accent-soft);border-color:var(--accent)}
.ztodo-empty{text-align:center;padding:38px 16px;color:var(--text-muted);font-size:13px;font-weight:800}
body.dark .ztodo-sidebar{background:rgba(255,255,255,.025)}
body.dark .ztodo-card:hover{box-shadow:0 10px 24px rgba(0,0,0,.26)}
body.light .ztodo-sidebar{background:rgba(23, 24, 34,.025)}




#calendar-content{direction:ltr}
.zcal-wrap{display:flex;flex-direction:column;gap:12px}
/* Month view: grid + selected-day panel side-by-side on desktop (reference layout). Single column
   for day/agenda/list (day panel is empty then) and on mobile. min-width:0 lets the grid shrink. */
.zcal-main{display:grid;grid-template-columns:1fr;gap:12px;min-width:0}
.zcal-main>#cal-view{min-width:0}
@media(min-width:981px){.zcal-main.is-month{grid-template-columns:minmax(0,1fr) 340px;align-items:start}}
/* Inside #page-calendar.cal-gold-v2, --shadow is redefined as a bare COLOR (rgba(...)) for glows, so
   `box-shadow:var(--shadow)` is an invalid color-only value and the browser drops it → the calendar
   cards had NO elevation. Use --enterprise-shadow (a real box-shadow token, global) so the header
   and the other calendar cards read as separate elevated cards in every theme (reference layout). */
.zcal-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:12px;box-shadow:var(--enterprise-shadow, 0 1px 2px rgba(17,24,32,.06))}
.zcal-titlebar{display:flex;align-items:center;gap:10px;min-width:0}
.zcal-title{font-size:18px;font-weight:900;color:var(--text);line-height:1.2;min-width:130px;text-align:center}
.zcal-subtitle{font-size:11px;font-weight:700;color:var(--text-muted);margin-top:3px;text-align:center}
.zcal-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.zcal-icon-btn,.zcal-action{border:1.5px solid var(--border);background:var(--card);color:var(--text);border-radius:12px;min-height:38px;padding:8px 12px;font-size:12px;font-weight:800;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:.15s;white-space:nowrap}
.zcal-icon-btn{width:38px;padding:0;font-size:18px}
.zcal-action:hover,.zcal-icon-btn:hover,.zcal-segment:hover{background:var(--bg);border-color:#93C5FD;color:var(--primary)}
.zcal-primary{background:linear-gradient(135deg,var(--primary),#3B82F6);border-color:transparent;color:#fff;box-shadow:0 8px 18px rgba(var(--primary-rgb),.22)}
.zcal-success{background:linear-gradient(135deg,var(--accent-soft),#10B981);border-color:transparent;color:#fff;box-shadow:0 8px 18px rgba(16,185,129,.18)}
.zcal-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.zcal-segments{display:flex;gap:6px;padding:4px;background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow)}
.zcal-segment{border:none;background:transparent;color:var(--text-muted);border-radius:10px;padding:8px 12px;font-size:12px;font-weight:800;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:6px;transition:.15s;white-space:nowrap}
.zcal-segment.active{background:var(--primary);color:#fff;box-shadow:0 6px 14px rgba(var(--primary-rgb),.24)}
.zcal-search{min-width:220px;flex:1;max-width:360px;background:var(--card);color:var(--text);border:1.5px solid var(--border);border-radius:14px;padding:10px 13px;font-size:12px;font-weight:700;font-family:inherit;outline:none}
.zcal-search:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}
.zcal-filterbar{display:flex;gap:7px;flex-wrap:wrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px}
.zcal-filterbar::-webkit-scrollbar,.zcal-week-strip::-webkit-scrollbar{height:0}
.zcal-chip{font-size:11px;padding:6px 12px;border-radius:999px;border:1.5px solid;cursor:pointer;font-family:inherit;font-weight:800;transition:.15s;white-space:nowrap;display:flex;align-items:center;gap:4px}
.zcal-week-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:8px;box-shadow:var(--enterprise-shadow, 0 1px 2px rgba(17,24,32,.06))}
.zcal-week-day{border:1.5px solid var(--border-light);background:var(--bg);color:var(--text);border-radius:12px;min-height:54px;padding:7px 4px;cursor:pointer;font-family:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;transition:.15s;position:relative}
.zcal-week-day:hover{border-color:#34D399;background:rgba(var(--primary-rgb),.08)}
.zcal-week-day.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 8px 18px rgba(var(--primary-rgb),.22)}
.zcal-week-day .day-name{font-size:10px;font-weight:800;color:inherit;opacity:.72}
.zcal-week-day .day-num{font-size:16px;font-weight:900;color:inherit}
.zcal-week-dot{position:absolute;top:6px;left:7px;min-width:18px;height:18px;border-radius:999px;background:#EF4444;color:#fff;font-size:9px;font-weight:900;display:flex;align-items:center;justify-content:center;padding:0 5px}
.zcal-shell{background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:var(--enterprise-shadow, 0 1px 2px rgba(17,24,32,.06))}
.zcal-month-head,.zcal-month-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr)) 42px;direction:ltr}
.zcal-month-head{background:rgba(148,163,184,.10);border-bottom:1px solid var(--border)}
.zcal-head-cell,.zcal-week-head{text-align:center;padding:10px 4px;font-size:12px;font-weight:900;color:var(--text-muted)}
.zcal-week-head,.zcal-week-no{background:rgba(148,163,184,.08);color:var(--text-muted)}
.zcal-day-cell{direction:ltr;min-height:100px;border:0;border-right:1px solid var(--border-light);border-bottom:1px solid var(--border-light);background:var(--card);padding:7px;cursor:pointer;transition:.15s;text-align:left;overflow:hidden;font-family:inherit}
.zcal-day-cell:hover{background:rgba(var(--primary-rgb),.06)}
.zcal-day-cell.other-month{background:rgba(148,163,184,.05);color:var(--text-light)}
.zcal-day-cell.active{outline:2px solid var(--primary);outline-offset:-2px;background:rgba(var(--primary-rgb),.10)}
.zcal-day-cell.today .zcal-date-num{background:var(--primary);color:#fff;border-radius:999px;width:26px;height:26px;display:flex;align-items:center;justify-content:center}
.zcal-date-num{font-size:13px;font-weight:900;color:var(--text);margin-bottom:5px}
.zcal-event-pill{font-size:10px;font-weight:800;border-left:3px solid currentColor;padding:3px 5px;border-radius:6px;margin-bottom:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:rgba(var(--primary-rgb),.08)}
.zcal-more{font-size:10px;font-weight:800;color:var(--text-muted);padding-top:2px}
.zcal-week-no{direction:ltr;border-bottom:1px solid var(--border-light);display:flex;align-items:flex-start;justify-content:center;padding-top:10px;font-size:11px;font-weight:900}
.zcal-day-pane{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:14px;box-shadow:var(--shadow)}
.zcal-pane-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.zcal-pane-title{font-size:14px;font-weight:900;color:var(--text)}
.zcal-event-card{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid;border-radius:12px;margin-bottom:8px;cursor:default;transition:.15s}
.zcal-event-card.clickable{cursor:pointer}
.zcal-event-card.clickable:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
/* Momentary ring when a calendar notification click lands on this exact event card. */
.zcal-event-card.zcal-highlight{box-shadow:0 0 0 2px var(--primary),var(--shadow);animation:zcalHighlightFade 2s ease-out}
@media(prefers-reduced-motion:reduce){.zcal-event-card.zcal-highlight{animation:none}}
@keyframes zcalHighlightFade{0%{box-shadow:0 0 0 2px var(--primary),var(--shadow)}80%{box-shadow:0 0 0 2px var(--primary),var(--shadow)}100%{box-shadow:var(--shadow)}}
.zcal-event-icon{min-width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;background:rgba(255,255,255,.5)}
.zcal-event-title{font-size:13px;font-weight:900;line-height:1.5}
.zcal-event-meta{font-size:11px;color:var(--text-muted);margin-top:2px;line-height:1.6}
.zcal-empty{text-align:center;color:var(--text-muted);font-size:13px;font-weight:700;padding:22px 10px}
.zcal-timeline{background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.zcal-hour-row{display:grid;grid-template-columns:76px 1fr;min-height:64px;border-bottom:1px solid var(--border-light);direction:ltr}
.zcal-hour-row:last-child{border-bottom:none}
.zcal-hour-label{direction:ltr;text-align:center;padding-top:12px;font-size:12px;font-weight:800;color:var(--text-muted);border-right:1px solid var(--border-light)}
.zcal-hour-body{direction:ltr;padding:8px;min-width:0}
.zcal-list{display:flex;flex-direction:column;gap:8px}
.zcal-list-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:12px;display:flex;gap:10px;align-items:flex-start;box-shadow:var(--enterprise-shadow, 0 1px 2px rgba(17,24,32,.06))}
.zcal-list-time{min-width:62px;text-align:center;border-radius:12px;padding:7px;background:var(--bg);font-size:11px;font-weight:900;color:var(--primary)}
/* Agenda view (r222+): chronological upcoming items grouped by day. */
.zcal-agenda-day{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--border-light)}
.zcal-agenda-day:first-of-type{border-top:none}
.zcal-agenda-date{flex:0 0 116px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;background:transparent;border:none;cursor:pointer;font-family:inherit;text-align:start;padding:6px 4px;border-radius:10px;transition:.15s}
.zcal-agenda-date:hover{background:var(--card2)}
.zcal-agenda-date.is-today{color:var(--primary)}
.zcal-agenda-dow{font-size:11px;font-weight:800;color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em}
.zcal-agenda-date.is-today .zcal-agenda-dow{color:var(--primary)}
.zcal-agenda-num{font-size:13px;font-weight:800;color:var(--text)}
.zcal-agenda-date.is-today .zcal-agenda-num{color:var(--primary)}
.zcal-agenda-today{font-size:9.5px;font-weight:800;background:var(--primary);color:#fff;border-radius:999px;padding:1px 7px;margin-top:2px}
.zcal-agenda-items{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.zcal-agenda-range{display:inline-block;margin-top:4px;font-size:10.5px;font-weight:700;color:var(--text-muted);background:var(--bg);border:1px solid var(--border-light);border-radius:999px;padding:1px 8px}
.zcal-event-pill.is-span{border-inline-start-style:dashed}
.zcal-span-mark{font-weight:900;margin-inline-end:2px;opacity:.75}
@media(max-width:640px){.zcal-agenda-date{flex-basis:92px}}
.zcal-support-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.zcal-support-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px;box-shadow:var(--shadow);min-height:118px;display:flex;flex-direction:column;gap:8px}
.zcal-support-title{font-size:13px;font-weight:900;color:var(--text)}
.zcal-support-value{font-size:24px;font-weight:950;color:var(--primary)}
.zcal-support-text{font-size:12px;font-weight:700;color:var(--text-muted);line-height:1.8}
body.dark .zcal-primary,body.dark .zcal-success{color:#fff}
body.dark .zcal-event-icon{background:rgba(255,255,255,.08)}
body.dark .zcal-day-cell:hover{background:rgba(var(--primary-rgb),.14)}
body.light .zcal-event-icon{background:rgba(23, 24, 34,.06)}



@media(max-width:768px){
  /* Transform/offset for this drawer is owned by the direction block near the top of the
     file; these RTL-era duplicates only set z-index and the content reset now. */
  #sidebar{z-index:100}
  #main{margin-inline:0!important}
  #content{padding:14px!important}
  #mobile-bottom-nav{display:flex!important}
  #content{padding-bottom:72px!important}
  #menu-toggle{display:flex!important}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .props-grid{grid-template-columns:1fr}
  .form-row.cols-2,.form-row.cols-3{grid-template-columns:1fr}
  .info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kanban-board{grid-template-columns:repeat(2,minmax(0,1fr))}
  
  #tc-sidebar-wrap{width:100%!important;display:none}
  #tc-sidebar-wrap.tc-show{display:flex!important}
  #tc-chat-wrap{display:none}
  #tc-chat-wrap.tc-show{display:flex!important}
}



.fdp-popup{position:fixed;z-index:9999;background:#fff;border-radius:18px;box-shadow:0 24px 64px rgba(0,0,0,.16),0 4px 16px rgba(0,0,0,.08);border:1px solid var(--border);width:308px;user-select:none;font-family:inherit;overflow:hidden;animation:fdpIn .18s cubic-bezier(.34,1.56,.64,1)}
@keyframes fdpIn{from{opacity:0;transform:scale(.92) translateY(-10px)}to{opacity:1;transform:scale(1) translateY(0)}}
.fdp-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:linear-gradient(135deg,var(--primary-dark),var(--primary),#3B82F6);color:#fff}
.fdp-nav{background:rgba(255,255,255,.15);border:none;color:#fff;cursor:pointer;width:30px;height:30px;border-radius:8px;font-size:17px;line-height:1;transition:.15s;font-family:inherit;display:flex;align-items:center;justify-content:center}
.fdp-nav:hover{background:rgba(255,255,255,.28)}
.fdp-month-year{font-size:14px;font-weight:800;cursor:pointer;padding:4px 10px;border-radius:8px;transition:.15s}
.fdp-month-year:hover{background:rgba(255,255,255,.18)}
.fdp-days-header{display:grid;grid-template-columns:repeat(7,1fr);padding:10px 10px 4px;background:#FBFCFF}
.fdp-days-header span{text-align:center;font-size:11px;font-weight:800;color:var(--text-muted)}
.fdp-days{display:grid;grid-template-columns:repeat(7,1fr);padding:4px 8px 8px;gap:1px;background:#FBFCFF}
.fdp-day{text-align:center;padding:7px 2px;font-size:12.5px;border-radius:9px;cursor:pointer;transition:.15s;border:none;background:none;font-family:inherit;color:var(--text);min-width:0}
.fdp-day:hover:not(:disabled):not(.fdp-selected){background:var(--primary-light);color:var(--primary)}
.fdp-day.fdp-today{font-weight:800;color:var(--primary);position:relative}
.fdp-day.fdp-today::after{content:'';position:absolute;bottom:3px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--primary)}
.fdp-day.fdp-selected{background:linear-gradient(135deg,var(--primary),#3B82F6);color:#fff;font-weight:800;box-shadow:0 4px 12px rgba(var(--primary-rgb),.35)}
.fdp-day.fdp-today.fdp-selected::after{background:#fff}
.fdp-day:disabled{cursor:default;opacity:0}
.fdp-footer{padding:10px 14px;border-top:1px solid var(--border-light);display:flex;gap:8px;justify-content:flex-end;background:#fff}
.fdp-ym-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:12px;background:#FBFCFF}
.fdp-ym-item{padding:9px 4px;text-align:center;font-size:12.5px;border-radius:10px;cursor:pointer;border:1.5px solid transparent;background:#fff;font-family:inherit;color:var(--text);transition:.18s;font-weight:500;box-shadow:var(--shadow)}
.fdp-ym-item:hover{border-color:var(--primary);color:var(--primary)}
.fdp-ym-item.active{background:linear-gradient(135deg,var(--primary),#3B82F6);color:#fff;font-weight:800;border-color:transparent;box-shadow:0 4px 12px rgba(var(--primary-rgb),.3)}


@media(max-width:640px){
  
  nav#sidebar{width:270px!important}
  #main{padding:0!important}
  #content{padding:10px 10px 72px!important}
  #topbar{height:52px!important;padding:0 10px!important;position:sticky;top:0;z-index:50}
  #page-title{font-size:14px!important}
  #topbar-date{display:none!important}
  #app{padding-top:env(safe-area-inset-top,0px)}
  nav#sidebar{padding-top:calc(env(safe-area-inset-top,0px) + 8px)}

  
  #topbar-add-lead-btn span{display:none!important}
  #topbar-add-lead-btn{padding:8px 10px!important;min-width:36px}

  
  .dash-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dash-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dash-occ-row{flex-direction:column!important;gap:14px!important}
  .dash-occ-row .occ-divider{display:none!important}
  .dash-occ-row .occ-quick{flex-direction:row!important;flex-wrap:wrap!important;gap:10px!important;width:100%!important;min-width:0!important}
  #dashboard-lists{grid-template-columns:1fr!important}

  
  .modal-overlay{align-items:center!important;justify-content:center!important;padding:14px!important}
  .modal{border-radius:20px!important;max-height:88vh!important;width:min(100%,560px)!important;max-width:100%!important;margin:auto!important}
  .modal-body{padding:14px!important}
  .modal-header{padding:14px 16px!important}
  .modal-lg{max-width:100%!important}

  
  .form-grid-2,.form-grid-3{grid-template-columns:1fr!important}
  .form-row.cols-2,.form-row.cols-3{grid-template-columns:1fr!important}
  .form-step-content{padding:14px!important}

}


@media(max-width:640px){
  
  #reports-content .rpt-hero{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #reports-content [style*="display:grid"]{grid-template-columns:1fr!important}

  
  #team-chat-content>div{flex-direction:column!important}
  /* max-height:50vh cut the conversation list in half: the last rows were unreachable and a
     dead band sat between the card and the bottom nav. On a phone the list is the whole
     screen, so it fills the column and scrolls internally instead. */
  #tc-sidebar-wrap{width:100%!important;min-width:0!important;flex:1 1 auto;min-height:0}
  #tc-chat-wrap{width:100%!important;min-width:0!important}

  
  #todos-content [style*="display:flex"][style*="gap:8px"]{flex-wrap:wrap!important}
  #todos-content [style*="min-width:100px"]{min-width:80px!important}

  
  #customers-content [style*="grid-template-columns"]{grid-template-columns:1fr!important}

}


@media(max-width:640px){
  
  #calendar-content table{font-size:11px}
  .zcal-wrap{gap:8px;margin:-10px -10px 0}
  .zcal-top{position:sticky;top:52px;z-index:25;border-radius:0;border-right:0;border-left:0;padding:10px;background:var(--card)}
  .zcal-titlebar{width:100%;justify-content:space-between}
  .zcal-title{font-size:18px;min-width:0}
  .zcal-subtitle{font-size:10px}
  .zcal-actions{width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
  .zcal-action,.zcal-icon-btn{min-height:38px;border-radius:11px;font-size:11px;padding:7px 8px}
  .zcal-icon-btn{width:auto}
  .zcal-toolbar{padding:0 10px}
  .zcal-segments{width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
  .zcal-segment{justify-content:center;font-size:10px;padding:8px 5px}
  .zcal-search{max-width:none;min-width:0;width:100%;font-size:12px}
  .zcal-filterbar{padding:0 10px;flex-wrap:nowrap;overflow-x:auto}
  .zcal-chip{font-size:10px;padding:6px 10px}
  .zcal-week-strip{position:sticky;top:154px;z-index:20;border-radius:0;border-right:0;border-left:0;border-top:0;grid-template-columns:repeat(7,minmax(42px,1fr));gap:4px;padding:7px 10px;overflow-x:auto}
  .zcal-week-day{min-height:48px;border-radius:11px;padding:5px 2px}
  .zcal-week-day .day-num{font-size:15px}
  .zcal-week-day .day-name{font-size:9px}
  .zcal-shell{border-radius:0;border-right:0;border-left:0}
  .zcal-month-head,.zcal-month-row{grid-template-columns:repeat(7,minmax(41px,1fr)) 30px}
  .zcal-head-cell,.zcal-week-head{font-size:10px;padding:8px 2px}
  .zcal-day-cell{min-height:88px;padding:5px 4px}
  .zcal-date-num{font-size:12px;margin-bottom:4px}
  .zcal-day-cell.today .zcal-date-num{width:23px;height:23px}
  .zcal-event-pill{font-size:9px;padding:2px 4px;margin-bottom:2px}
  .zcal-week-no{font-size:10px;padding-top:8px}
  .zcal-day-pane{border-radius:0;border-right:0;border-left:0;margin-bottom:8px}
  .zcal-pane-title{font-size:13px}
  .zcal-event-card{padding:9px 10px}
  .zcal-event-title{font-size:12px}
  .zcal-event-meta{font-size:10px}
  .zcal-hour-row{grid-template-columns:60px 1fr;min-height:58px}
  .zcal-hour-label{font-size:11px}
  .zcal-timeline,.zcal-list,.zcal-support-grid{margin:0 10px}
  .zcal-support-grid{grid-template-columns:1fr}

}


@media(max-width:640px){
  
  .search-bar{flex-wrap:wrap}
  .search-bar input{min-width:120px!important;font-size:12px!important}
  .search-bar select{min-width:100px!important;font-size:12px!important}

  
  .info-grid{grid-template-columns:1fr 1fr!important}

  
  .kanban-board{grid-template-columns:1fr!important;overflow-x:auto}

}


@media(max-width:640px){
  

  
  
  #detail-content>div:first-child{flex-wrap:wrap!important;gap:8px!important;align-items:center!important}
  #detail-content>div:first-child h2{font-size:15px!important;line-height:1.3}
  #detail-content>div:first-child>div[style]{flex-wrap:wrap!important;gap:8px!important;width:100%!important}
  #detail-content .btn.btn-sm{font-size:12px!important;padding:8px 11px!important;min-height:38px!important}
  .detail-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;width:100%!important}
  .detail-actions .btn{justify-content:center!important;text-align:center!important;white-space:normal!important;line-height:1.35!important}

  
  .detail-header{padding:14px!important}
  .detail-header>div[style]{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  
  .detail-tabs{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;padding:5px!important;gap:6px!important;margin-bottom:10px!important;overflow:visible!important}
  .detail-tab{width:100%!important;min-width:0!important;min-height:44px!important;padding:8px 6px!important;font-size:12.5px!important;border-radius:9px!important;white-space:nowrap!important}
  .detail-subtabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;margin-bottom:14px!important;overflow:visible!important}
  .detail-subtab{min-width:0!important;padding:8px 8px!important;font-size:12px!important;min-height:40px!important;white-space:normal!important;line-height:1.35!important}

  
  .detail-section{padding:12px!important;margin-bottom:10px!important}
  .detail-section h3{font-size:12px!important;margin-bottom:10px!important}

  
  .detail-section .flex-between{flex-wrap:wrap!important;gap:6px!important}
  .detail-section [style*="display:flex"][style*="justify-content:space-between"]{flex-wrap:wrap!important;gap:6px!important}
  .detail-section [style*="display:flex"][style*="justify-content:flex-end"]{flex-wrap:wrap!important;justify-content:flex-start!important}

  
  .info-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .info-item{padding:8px 10px!important}
  .info-item .info-val{font-size:12px!important}
  .info-item .info-key{font-size:10px!important}

  
  .detail-section table{display:block!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;max-width:100%;min-width:480px;font-size:11px!important}
  .detail-section th,.detail-section td{padding:6px 8px!important;white-space:nowrap}
  
  .detail-section>div{overflow-x:auto!important;-webkit-overflow-scrolling:touch}

  
  .detail-section [style*="display:grid"][style*="template-columns"]{grid-template-columns:1fr!important}

  
  .detail-section [style*="display:grid"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  
  [style*="grid-template-columns:1fr 1fr 1fr"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="grid-template-columns:repeat(3"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="grid-template-columns:repeat(4"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}

}


@media(max-width:640px){
  
  .dash-kpi-grid>div{padding:10px!important}
  .dash-kpi-grid .stat-val{font-size:16px!important}

  
  #reports-content>div[style]{padding:10px!important}

  
  .prop-card-body{padding:10px!important}
  .prop-card-footer{padding:8px 10px!important}
}



html,body{max-width:100%;overflow-x:hidden}
#app,#main,#content,.page{min-width:0;max-width:100%}

@media(max-width:768px){
  html,body{width:100%;overflow-x:hidden;overscroll-behavior-x:none}
  #app{display:block;min-height:100dvh;width:100%;max-width:100vw;overflow-x:hidden}
  #main{margin-right:0!important;margin-left:0!important;width:100%!important;max-width:100vw!important;min-width:0!important;overflow-x:hidden}
  #content{width:100%!important;max-width:100vw!important;min-width:0!important;box-sizing:border-box;overflow-x:hidden;padding:10px 10px calc(86px + env(safe-area-inset-bottom,0px))!important}
  .page{width:100%;max-width:100%;min-width:0;overflow-x:hidden}
  #page-properties,
  #page-todos{
    padding-top:10px!important;
    scroll-margin-top:calc(76px + env(safe-area-inset-top,0px))!important;
  }
  #topbar{height:auto!important;min-height:64px!important;padding:8px 10px!important;gap:8px!important;flex-wrap:nowrap!important;max-width:100vw;overflow:hidden}
  :root{--topbar-h:64px}
  #topbar>div:first-child{min-width:0;flex:0 0 auto;gap:9px!important}
  .topbar-title,#page-title{font-size:15px!important;max-width:25vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topbar-actions{
    flex:1 1 auto;
    min-width:0;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:7px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  
  .topbar-actions::-webkit-scrollbar{display:none}
  .topbar-utility-btn,
  #assistant-fab,
  .pwa-install-chip{
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    min-height:42px!important;
    padding:0!important;
    flex:0 0 42px!important;
    border-radius:12px!important;
  }
  .topbar-utility-label,
  .assistant-fab-label,
  .pwa-install-chip span{
    display:none!important;
  }
  

  .topbar-actions::-webkit-scrollbar{display:none}
  .topbar-actions .btn{padding:9px 11px!important;font-size:12px!important;white-space:nowrap}
  #workspace-switcher{min-width:116px!important;width:116px!important;max-width:116px!important}
  #topbar-theme-btn{width:44px!important;min-width:44px!important;height:44px!important;flex:0 0 44px;border-radius:13px!important;font-size:18px!important}
  #menu-toggle{width:46px!important;min-width:46px!important;height:46px!important;flex:0 0 46px;border-radius:14px!important;font-size:21px!important;align-items:center!important;justify-content:center!important}
  #topbar-add-lead-btn{min-width:44px!important;width:44px!important;height:44px!important;padding:0!important;justify-content:center!important;flex:0 0 44px;border-radius:13px!important}
  #topbar-add-lead-btn span{display:none!important}
  .stats-grid,.props-grid,.dash-kpi-grid,.dash-status-grid,.dash-mobile-activity,#dashboard-lists{max-width:100%;min-width:0}
  .dash-mobile-activity{grid-template-columns:repeat(4,minmax(70px,1fr))!important;gap:7px!important;margin-bottom:10px!important;overflow-x:auto!important;padding-bottom:2px!important}
  .dash-mobile-activity>div{min-height:56px!important;padding:8px 9px!important;border-radius:13px!important;gap:7px!important}
  .dash-mobile-activity>div>div:first-child{width:30px!important;height:30px!important;border-radius:9px!important;font-size:14px!important}
  .dash-mobile-activity [style*="font-size:20px"],.dash-mobile-activity [style*="font-size:26px"],.dash-mobile-activity [style*="font-size:30px"]{font-size:16px!important}
  .dash-mobile-activity [style*="font-size:9px"],.dash-mobile-activity [style*="font-size:11px"]{font-size:8.5px!important;line-height:1.3!important}
  .dash-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin-bottom:10px!important}
  .dash-kpi-grid>div{min-height:106px!important;padding:12px!important;border-radius:15px!important}
  .dash-kpi-grid [style*="font-size:15px"],.dash-kpi-grid [style*="font-size:22px"]{font-size:16px!important}
  .dash-kpi-grid [style*="font-size:10.5px"]{font-size:9.5px!important;margin-bottom:6px!important}
  .dash-kpi-grid [style*="width:70px"]{width:48px!important;height:48px!important}
  .dash-status-grid{display:flex!important;grid-template-columns:none!important;gap:8px!important;margin-bottom:10px!important;overflow-x:auto!important;padding:0 0 4px!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .dash-status-grid::-webkit-scrollbar{display:none}
  .dash-status-grid>div{flex:0 0 118px!important;min-height:68px!important;padding:9px 8px!important;border-radius:13px!important}
  .dash-status-grid [style*="font-size:18px"],.dash-status-grid [style*="font-size:22px"]{font-size:16px!important}
  .dash-status-grid [style*="font-size:9px"],.dash-status-grid [style*="font-size:10.5px"]{font-size:8.5px!important}
  .dash-occupancy-panel{margin-left:0!important;margin-right:0!important;margin-bottom:10px!important;border-radius:16px!important;box-shadow:0 8px 24px rgba(0,0,0,.35)!important}
  .dash-occupancy-layout{grid-template-columns:76px minmax(0,1fr)!important;gap:10px!important;padding:10px 12px!important;align-items:center!important}
  .dash-occupancy-divider{display:none!important}
  .dash-occupancy-ring{width:76px!important;height:76px!important;margin:0!important}
  .dash-occupancy-ring svg{width:76px!important;height:76px!important}
  .dash-occupancy-ring [style*="font-size:32px"]{font-size:18px!important}
  .dash-occupancy-ring [style*="font-size:10px"]{font-size:8px!important}
  .dash-occupancy-bars,.dash-occupancy-kpis{min-width:0!important;width:100%!important}
  .dash-occupancy-kpis{display:none!important}
  .dash-occupancy-bars{gap:6px!important}
  .dash-occupancy-bars>div:first-child{display:none!important}
  .dash-occupancy-bars [style*="margin-bottom:5px"]{margin-bottom:3px!important}
  .dash-occupancy-bars [style*="font-size:12px"]{font-size:10px!important}
  .dash-occupancy-bars [style*="font-size:10px"]{font-size:8.5px!important}
  .dash-occupancy-bars [style*="height:7px"]{height:5px!important}
  .card,.stat-card,.property-card,.prop-card{max-width:100%;min-width:0}
  /* position:fixed is resolved against the LAYOUT viewport, so a bottom-anchored toast sits
     underneath the on-screen keyboard whenever one is open. --toast-kb-offset is set from
     window.visualViewport (see showToast in app.js) and is 0 when no keyboard is shown, so
     normal placement is unchanged. */
  .toast-container{left:0!important;right:0!important;bottom:calc(76px + env(safe-area-inset-bottom,0px) + var(--toast-kb-offset,0px))!important;transform:none!important;padding:0 14px!important;align-items:center;pointer-events:none;max-height:100dvh}
  .toast{max-width:calc(100vw - 28px)!important;width:auto!important;border-radius:20px!important;font-size:12.5px!important;line-height:1.6!important;text-align:center;justify-content:center;padding:10px 16px!important}
}


@media(max-width:400px){
  
  #topbar{
    min-height:56px!important;
    height:56px!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    overflow:hidden!important;
    padding-inline:10px!important;
  }
  #topbar>div:first-child{
    order:initial;
    width:auto!important;
    flex:0 1 auto!important;
    min-width:0!important;
    justify-content:flex-start!important;
  }
  .topbar-title,#page-title{
    max-width:34vw!important;
    font-size:14px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .topbar-actions{
    order:initial;
    width:auto!important;
    flex:1 1 auto!important;
    min-width:0!important;
    display:flex!important;
    justify-content:flex-end!important;
    gap:6px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
  }
  #workspace-switcher{min-width:112px!important;width:100%!important;max-width:none!important}
  .dash-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dash-mobile-activity{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dash-kpi-grid [style*="padding:20px"]{padding:10px 8px!important}
  .dash-kpi-grid [style*="font-size:22px"]{font-size:15px!important}
  .dash-status-grid [style*="font-size:22px"]{font-size:16px!important}
  
  .detail-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .detail-tab{padding:9px 8px!important;font-size:13px!important;min-height:44px!important}
  .detail-subtabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .detail-subtab{padding:8px 8px!important;font-size:12px!important;min-height:40px!important}
  .detail-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .detail-section{padding:10px!important}
  .info-grid{grid-template-columns:1fr!important}
  .info-item .info-val{font-size:11.5px!important}
  #detail-content>div:first-child h2{font-size:13px!important}
  #detail-content .btn.btn-sm{font-size:11.5px!important;padding:7px 9px!important;min-height:36px!important}

  
  #props-grid{grid-template-columns:1fr!important}
}


@media(max-width:768px){
  .btn,.btn-sm,.btn-xs,button{touch-action:manipulation}
  .btn,.zcal-action,.zcal-icon-btn,.ztodo-tool,.todo-filter-btn{min-height:40px!important}
  input,select,textarea{font-size:14px!important;min-height:42px}
  .card{border-radius:16px!important}
  .card-header{gap:8px!important;flex-wrap:wrap!important}
  .card-title{font-size:14px!important}

  
  .search-bar{
    position:static!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    padding:10px!important;
    border-radius:16px!important;
    margin:4px 0 12px!important;
  }
  .search-bar input{grid-column:1/-1!important;width:100%!important;min-width:0!important}
  .search-bar select,.search-bar button{width:100%!important;min-width:0!important}

}


@media(max-width:768px){
  
  #todos-content{margin:0!important;padding-top:8px!important}
  #todos-content>div:first-child{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    border-bottom:0!important;
    margin-bottom:10px!important;
    padding-bottom:0!important;
  }
  #todos-content>div:first-child button{min-height:42px!important;font-size:12px!important;padding:8px 10px!important}
  #todos-content>div:nth-child(2){
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-bottom:10px!important;
  }
  #todos-content>div:nth-child(2)>div{
    min-width:0!important;
    padding:10px 8px!important;
    border-radius:14px!important;
  }
  #todos-content>div:nth-child(2) [style*="font-size:22px"]{font-size:18px!important}
  #todos-content>div:nth-child(3){
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin-bottom:10px!important;
  }
  #todos-content>div:nth-child(3)>div{
    display:flex!important;
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    gap:7px!important;
    padding-bottom:2px!important;
  }
  .todo-filter-btn{flex:0 0 auto!important;padding:8px 12px!important;font-size:11px!important}
  #todos-content>div:nth-child(3)>button{
    width:100%!important;
    justify-content:center!important;
    min-height:44px!important;
    font-size:13px!important;
  }
  #todo-list-wrap>div[onclick]{
    padding:12px!important;
    border-radius:14px!important;
    margin-bottom:9px!important;
  }
  #todo-list-wrap>div[onclick]>div{gap:9px!important}
  #todo-list-wrap [style*="flex-shrink:0"]{gap:4px!important}
  #todo-list-wrap button{width:34px!important;height:34px!important}

}


@media(max-width:768px){
  
  .zcal-top{box-shadow:0 8px 22px rgba(0,0,0,.22)!important}
  .zcal-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .zcal-toolbar{gap:8px!important}
  .zcal-segments{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .zcal-filterbar{background:var(--bg);border-radius:14px;padding:8px 10px!important}
  .zcal-day-cell{min-height:76px!important}
  .zcal-event-pill{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .zcal-support-card{min-height:auto!important;padding:12px!important}

}


@media(max-width:768px){
  
  #reports-content .card svg{max-height:210px!important}
  #reports-content .table-wrap{border-radius:14px!important}

  #reports-content .rpt-hero{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  #reports-content .rpt-hero>div{
    padding:12px!important;
    min-height:78px!important;
    border-radius:15px!important;
  }
  #reports-content .rpt-hero [style*="font-size:26px"]{font-size:18px!important}
  #reports-content .rpt-hero [style*="font-size:12px"]{font-size:10px!important}

}


@media(max-width:768px){
  
  #users-content [style*="grid-template-columns"],
  #customers-content [style*="grid-template-columns"],
  #help-content [style*="grid-template-columns"]{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  #users-content button,
  #customers-content button,
  #help-content button{min-height:42px!important}

}


@media(max-width:768px){
  
  #team-chat-content .card{min-height:0!important}
  #tc-sidebar-wrap,#tc-chat-wrap{border-radius:16px!important}
  #tc-chat-wrap input,#tc-chat-wrap textarea{font-size:14px!important}
}


@media(max-width:400px){
  #page-properties,
  #page-todos{padding-top:12px!important}
  #todos-content{padding-top:10px!important}
  #reports-content .rpt-hero,
  #accounting-content .stat-grid,
  #personal-finance-content .stat-grid{grid-template-columns:1fr!important}
  #todos-content>div:nth-child(2){grid-template-columns:1fr 1fr!important}
  .zcal-actions{grid-template-columns:1fr 1fr!important}
}






.assistant-typing-cursor{
  display:inline-block;
  margin-inline-start:1px;
  animation:assistantCursorBlink .9s step-start infinite;
}
@keyframes assistantCursorBlink{ 50%{ opacity:0; } }



/* ─── AI Assistant: full-workspace mode ──────────────────────────────────────
   States: open (the assistant OCCUPIES the entire CRM workspace: from the
   sidebar's content edge to the opposite viewport edge, below the sticky
   topbar — the sidebar and topbar stay visible and fully usable), minimized
   (#assistant-minichip pill in the corner OPPOSITE the sidebar), closed.
   The inline edge rides the shell's own --sidebar-w variable, so a collapsed/
   resized sidebar reflows the assistant automatically — nothing is hardcoded
   and there is no stale offset. RTL mirrors via the same html[dir] convention
   the shell itself uses. --asst-top is measured from the real topbar at open. */
#assistant-panel{
  position:fixed;
  top:var(--asst-top, 60px);
  bottom:0;
  /* Sits between the sidebar edge and the far edge of the viewport, in both directions. */
  inset-inline-start:var(--sidebar-w, 256px);
  inset-inline-end:0;
  width:auto;
  max-width:none;
  height:auto;
  background:var(--card,#fff);
  border:none;
  border-inline-start:1px solid var(--border,var(--border));
  border-radius:0;
  box-shadow:none;
  display:none;
  flex-direction:column;
  overflow:hidden;
  z-index:90; /* above the page workspace, below the sidebar (100) and modals */
}

#assistant-panel.open{ display:flex; animation:assistantPanelIn .2s ease-out; }
@keyframes assistantPanelIn{
  from{ opacity:0; transform:translateY(10px); }
  to{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion: reduce){
  #assistant-panel.open{ animation:none; }
  #assistant-panel{ transition:none; }
}

/* minimized launcher pill — same corner as the panel */
#assistant-minichip{
  position:fixed;
  right:24px;
  left:auto;
  bottom:24px;
  z-index:9400;
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 16px 10px 12px;
  border-radius:999px;
  border:1px solid var(--border,var(--border));
  background:var(--card,#fff);
  color:var(--text,var(--text));
  font:700 13px/1 inherit;
  font-family:inherit;
  cursor:pointer;
  box-shadow:0 10px 34px rgba(4, 7, 13,.3), 0 2px 8px rgba(4, 7, 13,.16);
  transition:transform .15s ease, box-shadow .15s ease;
  animation:assistantPanelIn .18s ease-out;
}
#assistant-minichip[hidden]{ display:none; }
#assistant-minichip:hover{ transform:translateY(-2px); box-shadow:0 14px 40px rgba(4, 7, 13,.36); }
#assistant-minichip.assistant-corner-left{ right:auto; left:24px; }
.assistant-minichip-label{ font-weight:700; font-size:13px; }

/* the AI identity mark: tinted rounded square + four-point spark */
.assistant-ai-mark{
  width:32px; height:32px; flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:9px;
  background:linear-gradient(135deg, rgba(var(--primary-rgb),.16), rgba(var(--primary-rgb),.05));
  border:1px solid rgba(var(--primary-rgb),.35);
  color:var(--primary);
}
.assistant-ai-mark svg{ width:18px; height:18px; }
#assistant-minichip .assistant-ai-mark{ width:28px; height:28px; border-radius:8px; }
#assistant-minichip .assistant-ai-mark svg{ width:16px; height:16px; }

.assistant-head-id{ display:flex; align-items:center; gap:10px; min-width:0; }
.assistant-head-titles{ display:flex; flex-direction:column; min-width:0; }
.assistant-head-titles b{
  font-weight:800; font-size:14px; color:var(--text,var(--text));
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.assistant-head-titles small{
  font-weight:500; font-size:10.5px; color:var(--text-muted,var(--text-secondary));
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
/* deliberately NOT named "*-actions": the generic mobile rule
   [class$="-actions"]{width:100%;flex:1 1 100%} would stretch it and crush the title */
.assistant-head-ctl{ display:flex; align-items:center; gap:2px; flex-shrink:0; }
.assistant-head-btn{
  background:none; border:none; cursor:pointer;
  color:var(--text-muted,var(--text-secondary));
  width:32px; height:32px; border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; transition:.15s;
}
.assistant-head-btn:hover{ background:rgba(148,163,184,.15); color:var(--text,var(--text)); }
#assistant-panel.drag-over{ outline:3px dashed var(--primary); outline-offset:-3px; background:rgba(var(--primary-rgb),.06); }
#assistant-drop-hint{
  display:none;
  position:absolute; inset:0; z-index:20;
  align-items:center; justify-content:center;
  background:rgba(var(--primary-rgb),.12);
  color:var(--primary); font-weight:800; font-size:15px;
  border-radius:20px;
  pointer-events:none; 
}
#assistant-panel.drag-over #assistant-drop-hint{ display:flex; }

#assistant-panel-header{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:12px 16px;
  border-bottom:1px solid var(--border,var(--border));
  background:var(--card,#fff);
  color:var(--text,var(--text));
  flex-shrink:0;
}
body.light .assistant-panel-header-icon{ color:var(--neutral-accent); }
body.dark .assistant-panel-header-icon{ color:var(--neutral-accent); }
#assistant-panel-close{
  background:none;border:none;cursor:pointer;
  font-size:16px;color:var(--text-muted,var(--text-secondary));
  width:30px;height:30px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:.15s;
}
#assistant-panel-close:hover{ background:rgba(148,163,184,.15); }
#assistant-voice-toggle-btn{
  background:none;border:none;cursor:pointer;
  font-size:15px;color:var(--text-muted,var(--text-secondary));
  width:30px;height:30px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:.15s;
}
#assistant-voice-toggle-btn:hover{ background:rgba(148,163,184,.15); }
#assistant-voice-toggle-btn.active{ background:rgba(var(--primary-rgb),.14); color:var(--primary); }

#assistant-mic-btn,.dash-mic-btn{
  flex-shrink:0;width:38px;height:42px;border-radius:13px;
  border:1px solid var(--border,var(--border));background:var(--bg,var(--card2));
  color:var(--text-muted,var(--text-secondary));font-size:15px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:.15s;
}
#assistant-mic-btn:hover,.dash-mic-btn:hover{ background:var(--border,var(--card2)); }
#assistant-mic-btn.listening,.dash-mic-btn.listening{
  background:#EF4444; border-color:#EF4444; color:#fff;
  animation:assistantMicPulse 1.2s ease-in-out infinite;
}
@keyframes assistantMicPulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(239,68,68,.45); }
  50%{ box-shadow:0 0 0 8px rgba(239,68,68,0); }
}

#assistant-messages{
  flex:1;overflow-y:auto;
  /* the shell fills the whole workspace; the conversation itself stays a
     readable centered column (~920px) instead of phone-chat-in-a-void */
  padding:28px max(28px, calc((100% - 920px) / 2)) 24px;
  display:flex;flex-direction:column;gap:14px;
  background:var(--bg,#F8F9FF);
}
#assistant-attachments{
  background:var(--bg,#F8F9FF);
  padding-left:max(28px, calc((100% - 920px) / 2));
  padding-right:max(28px, calc((100% - 920px) / 2));
}

/* ─── Centered PDF generation overlay (Sales Offer PDF + WhatsApp share) ────── */
.pdf-progress-overlay{
  position:fixed; inset:0; z-index:10050;
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  background:rgba(8,12,20,.62);
  backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
  animation:pdfProgressIn .16s ease-out;
}
@keyframes pdfProgressIn{ from{opacity:0} to{opacity:1} }
.pdf-progress-card{
  width:min(380px, 100%);
  display:flex; flex-direction:column; align-items:center; gap:12px;
  padding:30px 28px;
  border-radius:16px;
  border:1px solid var(--border,var(--border));
  background:var(--card,#fff); color:var(--text,var(--text));
  box-shadow:0 24px 70px rgba(4, 7, 13,.42);
  text-align:center;
}
.pdf-progress-spinner{
  width:38px; height:38px; border-radius:50%;
  border:3px solid var(--border,var(--border)); border-top-color:var(--primary);
  animation:pdfProgressSpin .8s linear infinite;
}
@keyframes pdfProgressSpin{ to{transform:rotate(360deg)} }
.pdf-progress-icon{ color:var(--danger,#ef4444); }
.pdf-progress-title{ font-weight:750; font-size:15px; }
.pdf-progress-detail{ font-size:12.5px; line-height:1.7; color:var(--text-muted,var(--text-secondary)); }
.pdf-progress-close{ margin-top:6px; min-width:120px; }
@media (prefers-reduced-motion: reduce){
  .pdf-progress-overlay{ animation:none }
  .pdf-progress-spinner{ animation-duration:2s }
}
@media (max-width:640px){
  .pdf-progress-card{ width:100%; padding:26px 20px; }
}

/* "New messages ↓" pill — shown only while the user has scrolled up to read history
   (see _assistantShowNewMessagePill). Positioned against the panel, above the composer. */
.assistant-newmsg-pill{
  position:absolute; left:50%; transform:translateX(-50%);
  bottom:96px;
  display:inline-flex; align-items:center; gap:6px;
  padding:7px 14px; border-radius:999px;
  border:1px solid var(--border,var(--border)); background:var(--card,#fff); color:var(--text,var(--text));
  font:650 12px/1 inherit; cursor:pointer; z-index:5;
  box-shadow:0 6px 20px rgba(4, 7, 13,.22);
}
.assistant-newmsg-pill[hidden]{ display:none; }

#assistant-attachments{
  display:flex;flex-wrap:wrap;gap:6px;
  padding:0 14px;
}
#assistant-attachments:empty{ display:none; }
.assistant-attachment-chip{
  display:flex;align-items:center;gap:6px;
  background:var(--bg,var(--card2));border:1px solid var(--border,var(--border));
  border-radius:10px;padding:4px 6px 4px 8px;font-size:11px;color:var(--text,var(--text));
  max-width:100%;
}
.assistant-attachment-chip img{ width:22px;height:22px;border-radius:5px;object-fit:cover;flex-shrink:0 }
.assistant-attachment-chip span{ overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:150px }
.assistant-attachment-chip button{
  background:none;border:none;cursor:pointer;color:var(--text-muted,var(--text-secondary));
  font-size:13px;line-height:1;padding:2px;flex-shrink:0;
}

#assistant-input-row{
  border-top:1px solid var(--border,var(--border));
  padding:14px max(28px, calc((100% - 920px) / 2)) 16px;
  display:flex;gap:10px;align-items:flex-end;
  background:var(--card,#fff);
  flex-shrink:0;
}
#assistant-attach-btn{
  flex-shrink:0;width:38px;height:42px;border-radius:13px;
  border:1px solid var(--border,var(--border));background:var(--bg,var(--card2));
  color:var(--text-muted,var(--text-secondary));font-size:16px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:.15s;
}
#assistant-attach-btn:hover{ background:var(--border,var(--card2)); }
#assistant-input{
  flex:1;resize:none;max-height:120px;
  padding:10px 14px;border-radius:14px;
  border:1px solid var(--border,var(--border));
  font-family:inherit;font-size:14px;line-height:1.6;
  background:var(--bg,var(--card2));color:var(--text,var(--text));
}
#assistant-input::placeholder{ color:var(--text-muted,var(--text-secondary)); }
#assistant-send-btn{
  flex-shrink:0;width:42px;height:42px;border-radius:13px;
  border:none;background:var(--primary);color:#fff;font-size:17px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:.15s;
}
#assistant-send-btn:hover{ background:var(--primary-dark); }

#assistant-image-lightbox{
  position:fixed; inset:0; z-index:10000;
  background:rgba(0,0,0,.85);
  display:none; align-items:center; justify-content:center;
  padding:24px; cursor:zoom-out;
}
#assistant-image-lightbox.open{ display:flex; }
#assistant-image-lightbox img{
  max-width:100%; max-height:100%;
  border-radius:10px;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
  cursor:default;
}
#assistant-image-lightbox iframe{
  width:90vw; height:90vh; max-width:900px;
  border:none; border-radius:10px; background:#fff;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
  cursor:default;
}
.assistant-file-preview{
  background:var(--card,#fff); color:var(--text,var(--text));
  border-radius:14px; padding:28px 32px; text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
  max-width:320px; cursor:default;
}
.assistant-file-preview-icon{ font-size:40px; margin-bottom:10px; }
.assistant-file-preview-name{ font-weight:800; font-size:14px; margin-bottom:6px; word-break:break-word; }
.assistant-file-preview-note{ font-size:12px; color:var(--text-muted,var(--text-secondary)); margin-bottom:16px; }
.assistant-file-preview-download{
  display:inline-block; background:var(--primary); color:#fff; text-decoration:none;
  padding:8px 18px; border-radius:10px; font-size:13px; font-weight:700;
}

@media (max-width:640px){
  #assistant-input-row{
    padding-bottom:calc(12px + env(safe-area-inset-bottom, 0px));
  }
  #assistant-minichip,
  #assistant-minichip.assistant-corner-left{
    right:14px; left:auto;
    bottom:calc(76px + env(safe-area-inset-bottom, 0px));
    padding:9px 14px 9px 10px;
  }
  #assistant-minichip.assistant-corner-left{ right:auto; left:14px; }
}


#dash-greeting{ margin-bottom:14px; }
#dash-greeting:empty{ display:none; }
.dash-greeting-text{
  font-size:26px;font-weight:700;letter-spacing:-.01em;
  color:var(--text,var(--text));
}
.dash-greeting-text span{ color:var(--primary,var(--primary)); }
@media (max-width:640px){ .dash-greeting-text{ font-size:20px; } }


#dash-assistant-card{
  background:var(--card,#fff);
  border:1px solid var(--border,var(--border));
  border-radius:24px;
  padding:22px 24px 18px;
  margin-bottom:20px;
  box-shadow:0 1px 2px rgba(19, 22, 28,.04), 0 8px 24px -12px rgba(19, 22, 28,.08);
}

#dash-assistant-messages{
  display:flex;
  flex-direction:column;gap:10px;
  max-height:0;opacity:0;overflow-y:hidden;
  padding:0 2px;
  transition:max-height .4s cubic-bezier(.4,0,.2,1), opacity .3s ease .05s, padding .4s cubic-bezier(.4,0,.2,1);
}
#dash-assistant-messages.dash-assistant-open{
  max-height:280px;opacity:1;overflow-y:auto;
  padding:4px 2px 14px;
}
#dash-assistant-recent{
  display:none;
  align-items:center;gap:8px;
  margin-bottom:10px;
  font-size:12px;color:var(--text-muted,var(--text-secondary));
  opacity:0;transition:opacity .3s ease;
}
#dash-assistant-recent.dash-assistant-open{ opacity:1; }
#dash-assistant-recent [data-recent-label]{
  color:var(--text,var(--text));font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:320px;
}
#dash-assistant-attachments{
  display:flex;flex-wrap:wrap;gap:6px;
  margin-bottom:8px;
}
#dash-assistant-attachments:empty{ display:none; }


#dash-assistant-compose{
  background:var(--bg,var(--card));
  border:1px solid var(--border,var(--border));
  border-radius:18px;
  padding:14px 16px 10px;
  transition:.15s;
}
#dash-assistant-compose:focus-within{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(var(--primary-rgb),.14);
}
#dash-assistant-input{
  display:block;width:100%;
  border:none;background:transparent;outline:none;resize:none;
  font-family:inherit;font-size:16px;line-height:1.6;color:var(--text,var(--text));
  min-height:30px;max-height:120px;
  padding:0 0 12px;
}
#dash-assistant-input::placeholder{ color:var(--text-muted,var(--text-secondary)); }
#dash-assistant-toolbar{
  display:flex;align-items:center;gap:10px;
  padding-top:8px;border-top:1px solid var(--border,var(--border));
}
#dash-assistant-toolbar-right{ display:flex;align-items:center;gap:8px;margin-inline-start:auto; }
#dash-assistant-attach-btn{
  flex-shrink:0;width:30px;height:30px;border-radius:10px;
  border:none;background:transparent;color:var(--text-muted,var(--text-secondary));
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:.15s;
}
#dash-assistant-attach-btn:hover{ background:var(--border,var(--card2));color:var(--text,var(--text)); }
#dash-assistant-label{
  font-size:12px;font-weight:600;color:var(--text-muted,var(--text-secondary));
}
#dash-assistant-toolbar .dash-mic-btn{ width:30px;height:30px;border-radius:10px;font-size:13px; }
#dash-assistant-send-btn{
  flex-shrink:0;width:32px;height:32px;border-radius:11px;
  border:none;background:var(--primary);color:#fff;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:.15s;
}
#dash-assistant-send-btn:hover{ background:var(--primary-dark); }
#dash-assistant-suggestions{
  display:flex;flex-wrap:wrap;gap:8px;
  margin-top:14px;
}
.dash-assistant-chip{
  border:1px solid var(--border,var(--border));
  background:var(--bg,var(--card));
  color:var(--text-light,var(--text,var(--text)));
  font-size:12.5px;font-weight:600;
  padding:7px 13px;border-radius:999px;
  cursor:pointer;transition:.15s;
}
.dash-assistant-chip:hover{ background:rgba(var(--primary-rgb),.1);border-color:var(--primary);color:var(--primary); }
@media (max-width:640px){
  #dash-assistant-card{ padding:16px 16px 14px;border-radius:20px; }
  #dash-assistant-recent [data-recent-label]{ max-width:180px; }
  #dash-assistant-input{ font-size:14.5px; }
  
  #dash-assistant-suggestions{
    flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
    margin-inline:-16px;padding-inline:16px;
  }
  #dash-assistant-suggestions::-webkit-scrollbar{ display:none; }
  .dash-assistant-chip{ flex-shrink:0;white-space:nowrap; }
}







@import url('https://fonts.googleapis.com/css2?family=Marcellus&family=Noto+Nastaliq+Urdu:wght@400;700&display=swap');

#page-dashboard.dash-gold-v2{
  
  --bg:#f6f4ef; --surface:#F7F7F8; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --card-hover:var(--card2); --nav-hover:var(--accent-soft);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --muted:#6B7280; --text-muted:#7d7565; --faint:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --logo-grad:linear-gradient(135deg,#f6ead0,#ecd9a6); --active-pill:#E6E7F1;
  --track:var(--card2); --seg:var(--card2); --btn-border:var(--border-strong);
  --danger-bg:#fbe3e3; --danger-text:#b02a2a; --warn-text:#a05f14;
  --ok: var(--accent); --ok-text: var(--accent-text); --avatar-bg:#E2E3ED;
  --badge-bg:#fbdddd; --badge-text:#a02525;
  --glow:rgba(107,114,128,.09); --shadow:rgba(90,75,40,.12);
}
body.dark #page-dashboard.dash-gold-v2{
  --bg:#0f0e0c; --surface:#131110; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --card-hover:#1e1b17; --nav-hover:#1a1714;
  --border:#262626; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --muted:#B4B4B4; --text-muted:#948d7a; --faint:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --logo-grad:linear-gradient(135deg,#2a2210,#171717); --active-pill:#282112;
  --track:#221f1a; --seg:#2F303A; --btn-border:#2F303A;
  --danger-bg:#3a1717; --danger-text:#ff9d9d; --warn-text: var(--warning);
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --avatar-bg:#3a2f16;
  --badge-bg:#7a2e2e; --badge-text:#ffb4b4;
  --glow:rgba(156,163,175,.07); --shadow:rgba(0,0,0,.5);
}


#page-dashboard.dash-gold-v2 a{ color:var(--ok-text); }
#page-dashboard.dash-gold-v2 a:hover{ color:var(--text); }


#page-dashboard.dash-gold-v2 .dgl-caption{
  display:flex;align-items:center;gap:8px;
  font-size:11.5px;font-weight:600;color:var(--faint);letter-spacing:.14em;
  margin-bottom:10px;
}

#page-dashboard.dash-gold-v2 .dgl-caption-fill{ flex:1;height:1px;background:var(--hairline,var(--border)); }
#page-dashboard.dash-gold-v2 .dgl-caption:not(:has(.dgl-caption-fill))::after{
  content:'';flex:1;height:1px;background:var(--hairline,var(--border));
}
#page-dashboard.dash-gold-v2 .dgl-caption .dgl-seed-glyph{ flex-shrink:0;opacity:.85; }
#page-dashboard.dash-gold-v2 .dgl-caption-link{
  font-size:12px;font-weight:600;letter-spacing:0;color:var(--ok-text)!important;flex-shrink:0;
}
#page-dashboard.dash-gold-v2 .dgl-caption-link:hover{ color:var(--text)!important; }


#dash-greeting-sub{
  font-size:12.5px;color:var(--text-light,var(--text-secondary));margin:2px 0 16px;
}
#page-dashboard.dash-gold-v2 #dash-greeting-sub{ color:var(--faint); }
#page-dashboard.dash-gold-v2 #dash-greeting-sub a{ color:var(--danger-text)!important;font-weight:700; }
#page-dashboard.dash-gold-v2 #dash-greeting-sub a:hover{ text-decoration:underline; }


#page-dashboard.dash-gold-v2 .dash-greeting-text{
  font-size:32px;font-weight:300;color:var(--muted);letter-spacing:0;
}
#page-dashboard.dash-gold-v2 .dash-greeting-text span{ color:inherit;font-weight:700; }


#page-dashboard.dash-gold-v2 #dash-assistant-card{
  position:relative;overflow:hidden;
  background:var(--card2);
  border:1px solid var(--border);
  border-radius:18px;
  padding:16px 20px 14px;
  box-shadow:none;
}
#page-dashboard.dash-gold-v2 #dash-assistant-compose{
  background:var(--bg);border:1px solid var(--border);border-radius:14px;
}
#page-dashboard.dash-gold-v2 #dash-assistant-compose:focus-within{
  border-color:var(--gold)!important;
  box-shadow:none!important;
}
#page-dashboard.dash-gold-v2 #dash-assistant-input{ font-size:14.5px;background:transparent!important;color:var(--text)!important; }
#page-dashboard.dash-gold-v2 #dash-assistant-toolbar{ border-top:none;padding-top:0; }
#page-dashboard.dash-gold-v2 #dash-assistant-label{ color:var(--faint); }
#page-dashboard.dash-gold-v2 #dash-assistant-label::before{
  content:'';display:inline-block;width:6px;height:6px;border-radius:50%;
  background:var(--ok);margin-left:6px;
  vertical-align:1px;
}

#page-dashboard.dash-gold-v2 #dash-assistant-send-btn{
  background:var(--active-pill)!important;color:var(--gold-light)!important;
  border:1px solid var(--border-gold)!important;
  width:38px;height:38px;border-radius:99px;
}
#page-dashboard.dash-gold-v2 #dash-assistant-send-btn:hover{ filter:brightness(1.05); }
#page-dashboard.dash-gold-v2 #dash-assistant-attach-btn{
  background:transparent!important;border:1px solid var(--btn-border)!important;color:var(--muted)!important;
  width:34px;height:34px;border-radius:99px;
}
#page-dashboard.dash-gold-v2 #dash-assistant-attach-btn:hover{ border-color:var(--gold)!important;color:var(--text)!important; }
#page-dashboard.dash-gold-v2 #dash-assistant-toolbar .dash-mic-btn{
  width:34px;height:34px;border-radius:99px;background:transparent;border:1px solid var(--btn-border);color:var(--muted);
}
#page-dashboard.dash-gold-v2 #dash-assistant-toolbar .dash-mic-btn:hover{ border-color:var(--gold);color:var(--text); }
#page-dashboard.dash-gold-v2 .dash-assistant-chip{
  border-radius:999px;padding:6px 14px;font-size:11px;
}
#page-dashboard.dash-gold-v2 #dash-assistant-suggestions{ gap:6px; }
#page-dashboard.dash-gold-v2 .dash-assistant-chip:hover{
  background:transparent!important;border-color:var(--gold)!important;color:var(--text)!important;
}
#page-dashboard.dash-gold-v2 #dash-assistant-recent [data-recent-label]{ color:var(--text); }


.dgl-dandelion-art{
  position:absolute;top:-4px;inset-inline-end:-4px;
  width:120px;height:120px;opacity:.18;pointer-events:none;z-index:0;
}
.dgl-dandelion-art svg{ width:100%;height:100%;transform-origin:36px 130px; }
.dgl-dandelion-sway{ animation:dgl-sway 7s ease-in-out infinite; }
.dgl-floater{ animation:dgl-drift 6s ease-in-out infinite; }
@keyframes dgl-sway{ 0%,100%{ transform:rotate(-2.5deg); } 50%{ transform:rotate(2.5deg); } }
@keyframes dgl-drift{
  0%,100%{ transform:translate(0,0) rotate(0deg); }
  50%{ transform:translate(4px,-5px) rotate(6deg); }
}
@media (prefers-reduced-motion:reduce){
  .dgl-dandelion-sway,.dgl-floater{ animation:none!important; }
}
#page-dashboard.dash-gold-v2 #dash-assistant-card > *:not(.dgl-dandelion-art){ position:relative;z-index:1; }




.dgl-status-bar{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  background:var(--card);border:1px solid var(--border);border-radius:16px;
  margin-bottom:16px;overflow:hidden;
}
.dgl-status-item{
  padding:14px 12px;text-align:center;border-inline-start:1px solid var(--border-light);
  cursor:pointer;transition:.15s;
}
.dgl-status-item:first-child{ border-inline-start:none; }
.dgl-status-item:hover{ background:var(--active-pill); }
.dgl-status-num{ font-size:21px;font-weight:800;color:var(--text);letter-spacing:-.02em;line-height:1.1; }
.dgl-status-lbl{ font-size:10.5px;color:var(--text-light);margin-top:4px;font-weight:500; }
.dgl-status-empty{
  display:flex;align-items:center;gap:8px;
  padding:14px 18px;color:var(--muted);font-size:12.5px;font-weight:500;
  background:var(--card2);border:1px solid var(--border);border-radius:14px;margin-bottom:16px;
}
.dgl-status-empty svg{ color:var(--ok); }
.dgl-status-empty-link{
  margin-inline-start:auto;font-size:11.5px;color:var(--ok-text)!important;flex-shrink:0;white-space:nowrap;
}
.dgl-status-empty-link:hover{ color:var(--text)!important; }


.dgl-status-line{
  display:flex;align-items:center;gap:8px;
  padding:14px 18px;color:var(--muted);font-size:12.5px;font-weight:500;
  background:var(--card2);border:1px solid var(--border);border-radius:14px;margin-bottom:16px;
}
.dgl-status-dot{ width:7px;height:7px;border-radius:50%;background:var(--ok);flex-shrink:0; }
.dgl-status-line.dgl-status-warn .dgl-status-dot{ background:#e05252; }
.dgl-status-line.dgl-status-warn > span:nth-child(2){ color:var(--text); }
.dgl-status-line .dgl-status-empty-link{ margin-inline-start:auto; }


#page-dashboard.dash-gold-v2 #dash-greeting-sub a.dgl-sub-warn{
  color:#e05252!important;display:inline-flex;align-items:center;gap:3px;
}


.dgl-attn-crit-badge{
  background:rgba(224,82,82,.14);color:#e05252;font-size:10px;font-weight:700;
  padding:2px 8px;border-radius:99px;white-space:nowrap;
}
.dgl-attn-card{
  display:flex;align-items:center;gap:12px;
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  border-inline-end:3px solid var(--seg);
  padding:12px 16px;margin-bottom:8px;
}
.dgl-attn-card.dgl-attn-red{ border-inline-end-color:#e05252; }
.dgl-attn-card.dgl-attn-orange{ border-inline-end-color:#d8842e; }
.dgl-attn-main{ flex:1;min-width:0; }
.dgl-attn-title{
  display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--text);
}
.dgl-attn-card.dgl-attn-red .dgl-attn-title{ color:#e05252; }
.dgl-attn-title > span:first-of-type{ overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.dgl-attn-badge{
  font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:99px;flex-shrink:0;
  background:rgba(216,132,46,.14);color:#d8842e;
}
.dgl-attn-card.dgl-attn-red .dgl-attn-badge{ background:rgba(224,82,82,.14);color:#e05252; }
.dgl-attn-msg{ font-size:11.5px;color:var(--text-muted);margin-top:3px; }
.dgl-attn-btn{
  flex-shrink:0;font-size:11.5px;font-weight:600;color:var(--text-light);
  background:var(--card2);border:1px solid var(--border);border-radius:9px;
  padding:6px 14px;cursor:pointer;transition:.15s;font-family:inherit;
}
.dgl-attn-btn:hover{ border-color:var(--border-gold);color:var(--text); }
.dgl-attn-empty{
  display:flex;align-items:center;justify-content:center;gap:6px;
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  padding:26px;color:var(--text-muted);font-size:12.5px;margin-bottom:8px;
}
.dgl-attn-empty svg{ color:var(--ok); }
#page-dashboard.dash-gold-v2 #dash-alerts-col{ margin-bottom:16px; }


.dgl-panel{
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  padding:14px 16px;height:100%;
}
.dgl-panel-count{ font-size:11px;color:var(--text-muted);white-space:nowrap;margin-inline-end:10px; }
.dgl-task-row{
  display:flex;align-items:center;gap:10px;
  padding:11px 2px;border-bottom:1px solid var(--border-light);cursor:pointer;transition:.15s;
}
.dgl-task-row:last-child{ border-bottom:none; }
.dgl-task-row:hover{ background:var(--active-pill); }
.dgl-task-dot{ width:7px;height:7px;border-radius:50%;flex-shrink:0; }
.dgl-task-body{ flex:1;min-width:0; }
.dgl-task-title{ font-size:13px;font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.dgl-task-meta{ font-size:11px;color:var(--text-muted);margin-top:2px; }
.dgl-task-meta.dgl-warn{ color:#e05252; }
.dgl-task-status{ font-size:10.5px;color:var(--text-muted);flex-shrink:0;white-space:nowrap; }


.dgl-kpi-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px;
}
.dgl-kpi-card{
  background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;
  cursor:pointer;transition:.15s;
}
.dgl-kpi-card:hover{ border-color:var(--border-gold); }

.dgl-kpi-card.dgl-kpi-primary{ border:1px solid var(--border);background:var(--card); }
.dgl-kpi-lbl{ font-size:10.5px;font-weight:600;color:var(--text-light);letter-spacing:.03em;margin-bottom:8px; }
.dgl-kpi-val{ font-size:22px;font-weight:800;color:var(--text);letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.dgl-kpi-val.dgl-kpi-val-muted{ color:var(--muted); }
.dgl-kpi-val.dgl-ok{ color:var(--ok-text); }
.dgl-kpi-val.dgl-warn{ color:var(--warn-text); }
.dgl-kpi-sub{ font-size:10.5px;color:var(--dim);margin-top:4px;font-weight:500; }
.dgl-kpi-sub.dgl-ok{ color:var(--ok-text); }
.dgl-kpi-sub.dgl-warn{ color:var(--warn-text); }


.dgl-chan-grid{ display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px; }
.dgl-chan-card{
  background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px 16px;min-width:0;
}
.dgl-chan-head{ display:flex;align-items:center;gap:10px;margin-bottom:10px; }
.dgl-chan-title{ font-size:12.5px;font-weight:700;color:var(--text);white-space:nowrap; }
.dgl-chan-range{ margin-inline-start:auto;font-size:11px;color:var(--text-muted);white-space:nowrap; }
.dgl-chan-toggle{
  margin-inline-start:auto;display:flex;gap:2px;padding:2px;
  background:var(--track);border-radius:99px;flex-shrink:0;
}
.dgl-chan-toggle button{
  padding:4px 11px;border:none;border-radius:99px;cursor:pointer;font-family:inherit;
  background:none;color:var(--text-muted);font-size:11px;font-weight:700;transition:.15s;
}
.dgl-chan-toggle button:hover{ color:var(--text); }
.dgl-chan-toggle button.on{ background:var(--card);color:var(--gold-light,var(--gold)); }

.dgl-chan-total{ display:flex;align-items:baseline;gap:7px;margin-bottom:12px; }
.dgl-chan-total b{ font-size:24px;font-weight:800;color:var(--text);line-height:1; }
.dgl-chan-total span{ font-size:11.5px;color:var(--text-muted); }
.dgl-chan-delta{
  margin-inline-start:auto;padding:2px 8px;border-radius:99px;
  font-size:11px;font-weight:700;white-space:nowrap;
}
.dgl-chan-delta.up{ color:var(--ok,var(--accent-text));background:color-mix(in srgb,var(--ok,var(--accent-soft)) 14%,transparent); }
.dgl-chan-delta.down{ color:var(--danger-text,var(--danger));background:color-mix(in srgb,var(--danger-text,var(--danger-light)) 12%,transparent); }

.dgl-chan-rows{ display:flex;flex-direction:column;gap:7px; }
.dgl-chan-row{
  display:flex;align-items:center;gap:9px;width:100%;
  background:none;border:none;padding:2px 0;cursor:pointer;font-family:inherit;text-align:start;
}
.dgl-chan-name{
  flex:0 0 122px;min-width:0;font-size:11.5px;color:var(--text-light);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:.15s;
}

.dgl-chan-bar{ flex:1;height:7px;border-radius:99px;background:var(--track);overflow:hidden;min-width:0; }
.dgl-chan-bar i{
  display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,#8fa35c,#6f8442);
}
body.dark .dgl-chan-bar i{ background:linear-gradient(90deg,var(--neutral-accent),var(--neutral-accent)); }
.dgl-chan-row:hover .dgl-chan-name{ color:#6f8442; }
body.dark .dgl-chan-row:hover .dgl-chan-name{ color:var(--neutral-accent); }
.dgl-chan-n{ flex:0 0 auto;font-size:12px;font-weight:700;color:var(--text);min-width:20px;text-align:end; }
.dgl-chan-empty{ padding:14px 0;font-size:12px;color:var(--text-muted);text-align:center; }

@media (max-width:900px){
  .dgl-chan-grid{ grid-template-columns:1fr; }
}


.dgl-two-col{ display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-bottom:16px; }
.dgl-two-col > div{ min-width:0; }
.dgl-view-all{
  font-size:11.5px;font-weight:600;color:var(--ok-text);background:none;border:none;cursor:pointer;
}
.dgl-view-all:hover{ text-decoration:underline; }


#page-dashboard.dash-gold-v2 #dash-notes-col .card{ border-radius:14px;height:100%; }
#page-dashboard.dash-gold-v2 #dash-notes-col .note-composer-textarea{ min-height:38px!important; }
#page-dashboard.dash-gold-v2 #dash-notes-col .nc-submit-btn{
  background:var(--active-pill)!important;color:var(--gold-light)!important;border:1px solid var(--border-gold)!important;
}


/* These used a cream/gold pill with grey text (~1.9:1, effectively unreadable) and clashed
   with the graphite sidebar. A white wash on the sidebar's own ground keeps the active row
   legible in both themes without introducing a third accent colour. */
body.light .nav-item.active{ background:rgba(255,255,255,.10)!important;color:#EEEFF9!important; }
body.light .nav-item.active svg{ color:var(--primary-on-dark)!important; }
body.dark .nav-item.active{ background:rgba(255,255,255,.08)!important;color:#E9EAF4!important; }
body.dark .nav-item.active svg{ color:var(--primary-on-dark)!important; }


body.light .mbn-btn.active{ color:var(--neutral-accent)!important; }
body.light .mbn-btn.active svg{ stroke:var(--neutral-accent)!important; }
body.dark .mbn-btn.active{ color:var(--neutral-accent)!important; }
body.dark .mbn-btn.active svg{ stroke:var(--neutral-accent)!important; }


.sidebar-logo-img{
  width:38px!important;height:38px!important;border-radius:99px!important;
  object-fit:contain!important;padding:6px!important;box-sizing:border-box!important;
  border:1.5px solid var(--neutral-border);background:linear-gradient(135deg,#2a2210,#171717);
  box-shadow:0 0 0 3px rgba(156,163,175,.10);
}
body.light .sidebar-logo-img{
  border-color:var(--neutral-border);background:linear-gradient(135deg,#f6ead0,#ecd9a6);
  box-shadow:0 0 0 3px rgba(107,114,128,.12);
}
body.dark .sidebar-logo-img{
  border-color:var(--neutral-border);background:linear-gradient(135deg,#2a2210,#171717);
  box-shadow:0 0 0 3px rgba(156,163,175,.10);
}


.sidebar-logo-brand{
  display:block;font-family:'Marcellus',serif;font-size:12.5px;font-weight:400;
  letter-spacing:.07em;color:#ECECEC;margin-bottom:2px;
}


@media (min-width:769px){
  .topbar-logo{ display:none; }
}


#topbar-theme-btn{border-radius:99px!important;transition:.2s}
body.light #topbar-theme-btn{border-color:var(--border-strong)!important;color:#6B7280!important}
body.dark #topbar-theme-btn{border-color:#2F303A!important;color:#B4B4B4!important}
body.light #topbar-theme-btn:hover{border-color:var(--neutral-accent)!important;color:#202123!important}
body.dark #topbar-theme-btn:hover{border-color:var(--neutral-accent)!important;color:#F2F2F2!important}


@media (max-width:768px){
  .dgl-status-bar{ grid-template-columns:repeat(2,1fr); }
  .dgl-status-item:nth-child(2){ border-inline-start:1px solid var(--border-light); }
  .dgl-status-item:nth-child(3){ border-inline-start:none;border-top:1px solid var(--border-light); }
  .dgl-status-item:nth-child(4){ border-top:1px solid var(--border-light); }
  .dgl-kpi-grid{ grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
  .dgl-kpi-val{ font-size:16px; }
  .dgl-two-col{ grid-template-columns:1fr; }
  #page-dashboard.dash-gold-v2 #dash-assistant-suggestions{
    flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
    padding-bottom:2px;
  }
  #page-dashboard.dash-gold-v2 #dash-assistant-suggestions::-webkit-scrollbar{ display:none; }
  #page-dashboard.dash-gold-v2 .dash-assistant-chip{ flex-shrink:0;white-space:nowrap; }
  .dgl-dandelion-art{ width:100px;height:100px;opacity:.4; }
  
  .dgl-attn-card{ padding:12px 14px;gap:8px; }
  .dgl-attn-title{ font-size:12.5px;flex-wrap:wrap; }
  .dgl-attn-msg{ font-size:11px; }
  .dgl-attn-btn{ padding:6px 10px;font-size:11px; }
  .dgl-dist-counts{ gap:10px; }
  .dgl-dist-title{ width:100%; }
  .dgl-status-line{ padding:12px 14px;font-size:12px; }
  .dgl-panel-count{ margin-inline-end:8px; }
}





#page-properties.prp-gold-v2{
  --bg:#faf8f3; --card:#fffdf8; --card2:#fdfbf5; --head-bg:#EBECF6;
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent); --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --row-hover:#F6F7FF;
  
  --pdeal-sell:#4f6b28; --pdeal-rent:#8a5f14;
  --pstat-available:#5a7d33; --pstat-ready:#6B7280; --pstat-offplan:#2c6a92;
}
body.dark #page-properties.prp-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:#1b1815; --head-bg:#141210;
  --border:#262626; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent); --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#1B1C26; --track:#221f1a; --row-hover:#1b1815;
  --pdeal-sell:#a7cf87; --pdeal-rent:#e6c07a;
  --pstat-available:var(--neutral-accent); --pstat-ready:#B4B4B4; --pstat-offplan:#8ab6d6;
}


#page-properties.prp-gold-v2 .prp-head{
  display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap;
}
#page-properties.prp-gold-v2 .prp-title{ display:flex;align-items:baseline;gap:9px;flex:1;min-width:0; }
#page-properties.prp-gold-v2 .prp-title h2{
  margin:0;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.01em;
}
#page-properties.prp-gold-v2 .prp-count{ font-size:11.5px;color:var(--text-muted);white-space:nowrap; }


#page-properties.prp-gold-v2 .prp-filters{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;
}

#page-properties.prp-gold-v2 .prp-search{ position:relative;flex:1;min-width:240px; }
#page-properties.prp-gold-v2 .prp-search-ic{
  position:absolute;top:50%;transform:translateY(-50%);inset-inline-start:12px;
  color:var(--text-muted);pointer-events:none;display:flex;
}
#page-properties.prp-gold-v2 .prp-search input{
  width:100%;box-sizing:border-box;height:36px;
  padding-inline-start:34px;padding-inline-end:12px;
  background:var(--card);border:1px solid var(--border);border-radius:99px;
  color:var(--text);font-size:12.5px;font-family:inherit;outline:none;transition:.15s;
}
#page-properties.prp-gold-v2 .prp-search input:focus{ border-color:var(--border-gold); }
#page-properties.prp-gold-v2 .prp-filters .prp-select{
  height:38px;border-radius:99px;padding:0 16px;
  background:transparent;border:1px solid var(--btn-border,var(--border));
  color:var(--text-muted);font-size:12.5px;
}
#page-properties.prp-gold-v2 .prp-filters .prp-select:hover{ border-color:var(--gold);color:var(--text); }
#page-properties.prp-gold-v2 .prp-select{
  height:36px;background:var(--card);border:1px solid var(--border);border-radius:9px;
  color:var(--text-light);font-size:11.5px;font-family:inherit;padding:0 10px;cursor:pointer;outline:none;
}
#page-properties.prp-gold-v2 .prp-select:focus{ border-color:var(--border-gold); }

#page-properties.prp-gold-v2 .prp-clear{
  background:none;border:none;cursor:pointer;font-family:inherit;
  font-size:12.5px;color:var(--text-muted);padding:0 6px;
}
#page-properties.prp-gold-v2 .prp-clear:hover{ color:var(--danger,#EF4444); }


#page-properties.prp-gold-v2 .prp-toolbar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;
}
#page-properties.prp-gold-v2 .prp-chips{ display:flex;align-items:center;gap:7px;flex:1;flex-wrap:wrap; }
#page-properties.prp-gold-v2 .prp-chip{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--card);border:1px solid var(--border);border-radius:99px;
  padding:6px 13px;font-size:11.5px;font-weight:600;color:var(--text-light);white-space:nowrap;
}
#page-properties.prp-gold-v2 .prp-chip-n{
  font-weight:800;color:var(--gold-light);
  background:var(--active-pill);border-radius:99px;padding:1px 7px;font-size:10.5px;
}


#page-properties.prp-gold-v2 .prp-wrap{
  background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;
}
#page-properties.prp-gold-v2 .prp-table{ width:100%;border-collapse:collapse; }
#page-properties.prp-gold-v2 .prp-table thead th{
  position:sticky;top:0;z-index:2;
  background:var(--head-bg);border-bottom:1px solid var(--border-gold);
  padding:12px 14px;text-align:start;
  font-size:11px;font-weight:700;color:var(--text-muted);white-space:nowrap;
}
#page-properties.prp-gold-v2 .prp-table td{
  padding:12px 14px;border-bottom:1px solid var(--border-light);vertical-align:middle;
}
#page-properties.prp-gold-v2 .prp-row{ transition:background .15s; }
#page-properties.prp-gold-v2 .prp-row:hover td{ background:var(--row-hover); }
#page-properties.prp-gold-v2 .prp-row.is-sel td{ background:var(--active-pill); }
#page-properties.prp-gold-v2 .prp-table input[type=checkbox]{ accent-color:var(--gold);width:14px;height:14px;cursor:pointer; }


#page-properties.prp-gold-v2 .prp-namecell{ display:flex;align-items:center;gap:12px;min-width:0; }
#page-properties.prp-gold-v2 .prp-thumb{
  width:42px;height:42px;flex-shrink:0;overflow:hidden;
  display:grid;place-items:center;
  border-radius:11px;background:var(--track);border:1px solid var(--border);color:var(--gold);
}
#page-properties.prp-gold-v2 .prp-thumb img{ width:100%;height:100%;object-fit:cover;display:block; }
#page-properties.prp-gold-v2 .prp-namecol{ display:flex;flex-direction:column;gap:2px;min-width:0; }
#page-properties.prp-gold-v2 .prp-name{
  font-size:13px;font-weight:700;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:280px;
}
#page-properties.prp-gold-v2 .prp-owner{
  font-size:11px;color:var(--text-muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:280px;
}
#page-properties.prp-gold-v2 .prp-deal{
  display:inline-block;padding:4px 12px;border-radius:99px;white-space:nowrap;
  font-size:11px;font-weight:700;color:var(--deal-c);
  background:color-mix(in srgb, var(--deal-c) 15%, transparent);
}
#page-properties.prp-gold-v2 .prp-status{ font-size:12px;font-weight:600;white-space:nowrap; }
#page-properties.prp-gold-v2 .prp-cell-dim{ font-size:12px;color:var(--text-muted);white-space:nowrap; }
#page-properties.prp-gold-v2 .prp-cell-ltr{ font-size:12px;color:var(--text-light);white-space:nowrap;direction:ltr;display:inline-block; }
#page-properties.prp-gold-v2 .prp-price{
  font-size:13px;font-weight:700;color:var(--gold-light);white-space:nowrap;direction:ltr;display:inline-block;
}
#page-properties.prp-gold-v2 .prp-price.is-empty{ color:var(--text-muted);font-weight:500; }

#page-properties.prp-gold-v2 .prp-foot{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 16px;border-top:1px solid var(--hairline);
  font-size:11.5px;color:var(--text-muted);
}
#page-properties.prp-gold-v2 .prp-foot b{ color:var(--text);font-weight:700; }
#page-properties.prp-gold-v2 .prp-foot-page{ margin-inline-start:auto; }


.lead-modal .prp-deal{
  display:inline-block;padding:5px 12px;border-radius:99px;white-space:nowrap;flex-shrink:0;
  font-size:11px;font-weight:700;color:var(--deal-c);
  background:color-mix(in srgb, var(--deal-c) 15%, transparent);
}
#prop-modal-overlay{
  --pdeal-sell:#4f6b28; --pdeal-rent:#8a5f14;
  --pstat-available:#5a7d33; --pstat-ready:#6B7280; --pstat-offplan:#2c6a92;
  animation:none!important;
  transition:none!important;
  perspective:none!important;
}
#prop-detail-modal,
#prop-detail-modal.closing{
  animation:none!important;
  transition:none!important;
  transform:none!important;
  transform-origin:center!important;
}
#prop-detail-modal .lm-header,
#prop-detail-modal .lm-body,
#prop-detail-modal .lm-col{
  direction:ltr;
}
.prp-zoho-sync{
  display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;
  border:1px solid var(--hairline);color:var(--text-muted);font-size:10.5px;font-weight:700;
}
.prp-zoho-sync::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--card2)}
.prp-zoho-sync.is-linked{color:#6A6F77;background:#e8f7f2;border-color:#b8e6d8}
.prp-zoho-sync.is-linked::before{background:#878C94}
.prp-blueprint-loading{font-size:12px;color:var(--lm-muted)}
.prp-blueprint-current{
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;
  border:1px solid var(--lm-border);border-radius:10px;background:var(--lm-card);
}
.prp-blueprint-current span{font-size:11px;color:var(--lm-faint)}
.prp-blueprint-current b{font-size:12px;color:var(--lm-text)}
.prp-blueprint-actions{display:flex;flex-wrap:wrap;gap:8px}
.prp-blueprint-error{font-size:11px;color:var(--lm-danger);line-height:1.5}
.prp-blueprint-error button{border:0;background:none;color:inherit;text-decoration:underline;cursor:pointer}
.prp-widget-link{display:inline-flex;align-items:center;text-decoration:none}
body.dark .prp-zoho-sync.is-linked{color:#C2C7CF;background:#21262E;border-color:#4B5058}
body.dark #prop-modal-overlay{
  --pdeal-sell:#a7cf87; --pdeal-rent:#e6c07a;
  --pstat-available:var(--neutral-accent); --pstat-ready:#B4B4B4; --pstat-offplan:#8ab6d6;
}

@media(max-width:900px){
  
  #page-properties.prp-gold-v2 .prp-wrap{ overflow-x:auto; }
  #page-properties.prp-gold-v2 .prp-table{ min-width:820px; }
  #page-properties.prp-gold-v2 .prp-search{ max-width:none; }
  #page-properties.prp-gold-v2 .prp-select{ flex:1;min-width:110px; }
}




#page-alerts.agl-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12);
  --warn-bg:#f7ecd2;
  --danger-bg:rgba(220,38,38,.08); --danger-text:#DC2626; --danger-icon-bg:rgba(220,38,38,.12);
  --warn-text:#a05f14; --warn-icon-bg:rgba(216,132,46,.14);
}
body.dark #page-alerts.agl-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#262626; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5);
  --warn-bg:#2e2410;
  --danger-bg:rgba(239,68,68,.14); --danger-text:#F87171; --danger-icon-bg:rgba(239,68,68,.18);
  --warn-text: var(--warning); --warn-icon-bg:rgba(156,163,175,.16);
}

#page-alerts.agl-gold-v2 .agl-title{ font-size:20px;font-weight:800;color:var(--text); }
.agl-summary-line{ font-size:12.5px;color:var(--text-light,#6B7280);margin:2px 0 12px; }
#page-alerts.agl-gold-v2 .agl-summary-line{ color:var(--text-light); }


.agl-chips{ display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px; }
#page-alerts.agl-gold-v2 .agl-chip{
  border:1px solid var(--btn-border);background:transparent;color:var(--text-light);
  font-size:12px;font-weight:600;padding:6px 14px;border-radius:999px;cursor:pointer;font-family:inherit;
}
#page-alerts.agl-gold-v2 .agl-chip.active{
  background:var(--active-pill);border-color:var(--border-gold);color:var(--gold-light);
}


#page-alerts.agl-gold-v2 .agl-caption{
  display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;letter-spacing:.18em;
  margin:18px 0 10px;
}
#page-alerts.agl-gold-v2 .agl-caption:first-of-type{ margin-top:4px; }
#page-alerts.agl-gold-v2 .agl-caption::after{ content:'';flex:1;height:1px;background:var(--hairline); }
#page-alerts.agl-gold-v2 .agl-caption.agl-critical{ color:var(--danger-text); }
#page-alerts.agl-gold-v2 .agl-caption.agl-warning{ color:var(--warn-text); }
#page-alerts.agl-gold-v2 .agl-caption-badge{
  min-width:19px;height:19px;border-radius:999px;font-size:10.5px;font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;padding:0 5px;
}
#page-alerts.agl-gold-v2 .agl-caption.agl-critical .agl-caption-badge{ background:var(--danger-bg);color:var(--danger-text); }
#page-alerts.agl-gold-v2 .agl-caption.agl-warning .agl-caption-badge{ background:var(--warn-bg);color:var(--warn-text); }

.agl-group{ margin-bottom:6px; }


#page-alerts.agl-gold-v2 .agl-card{
  display:flex;align-items:center;gap:12px;background:var(--card2);border:1px solid var(--border);
  border-radius:14px;padding:12px 14px;margin-bottom:8px;cursor:pointer;transition:.15s;
}
#page-alerts.agl-gold-v2 .agl-card:hover{ background:var(--active-pill);border-color:var(--border-gold); }
#page-alerts.agl-gold-v2 .agl-card.agl-critical{ border-inline-end:3px solid #e05252; }
#page-alerts.agl-gold-v2 .agl-card.agl-warning{ border-inline-end:3px solid #d8842e; }
#page-alerts.agl-gold-v2 .agl-icon-circle{
  width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
#page-alerts.agl-gold-v2 .agl-icon-circle.agl-critical{ background:var(--danger-icon-bg); }
#page-alerts.agl-gold-v2 .agl-icon-circle.agl-warning{ background:var(--warn-icon-bg); }
#page-alerts.agl-gold-v2 .agl-body{ flex:1;min-width:0; }
#page-alerts.agl-gold-v2 .agl-body-title{ font-size:13.5px;font-weight:800;margin-bottom:2px; }
#page-alerts.agl-gold-v2 .agl-card.agl-critical .agl-body-title{ color:var(--danger-text); }
#page-alerts.agl-gold-v2 .agl-card.agl-warning .agl-body-title{ color:var(--warn-text); }
#page-alerts.agl-gold-v2 .agl-body-text{ font-size:12px;color:var(--text-muted);line-height:1.6; }
#page-alerts.agl-gold-v2 .agl-prop-chip{
  display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-size:11px;font-weight:700;color:var(--gold-light);
  background:var(--active-pill);border:1px solid var(--border-gold);padding:2px 10px;border-radius:999px;
}
#page-alerts.agl-gold-v2 .agl-arrow{ color:var(--dim);font-size:15px;flex-shrink:0; }


#page-alerts.agl-gold-v2 .agl-empty{ text-align:center;padding:48px 20px; }
#page-alerts.agl-gold-v2 .glux-empty-dandelion{ width:110px;height:auto;margin:0 auto 14px;display:block; }
#page-alerts.agl-gold-v2 .agl-empty-text{ font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px; }
#page-alerts.agl-gold-v2 .agl-empty-sub{ font-size:12px;color:var(--text-muted); }

@media (max-width:768px){
  #page-alerts.agl-gold-v2 .agl-chips{ flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none; }
  #page-alerts.agl-gold-v2 .agl-chips::-webkit-scrollbar{ display:none; }
  #page-alerts.agl-gold-v2 .agl-chip{ flex-shrink:0;white-space:nowrap; }
  #page-alerts.agl-gold-v2 .agl-icon-circle{ width:34px;height:34px; }
  #page-alerts.agl-gold-v2 .agl-prop-chip{ display:none; }
}


#page-alerts.agl-gold-v2 .agl-group{ margin-bottom:22px; }
#page-alerts.agl-gold-v2 .agl-caption{
  display:flex;align-items:center;gap:8px;margin-bottom:10px;
  font-size:11.5px;font-weight:700;letter-spacing:.12em;color:var(--faint,var(--text-muted));
}
#page-alerts.agl-gold-v2 .agl-caption::after{ content:'';flex:1;height:1px;background:var(--hairline,var(--border)); }
#page-alerts.agl-gold-v2 .agl-caption-n{
  padding:1px 8px;border-radius:99px;font-size:10.5px;font-weight:800;letter-spacing:0;
  background:var(--track,rgba(0,0,0,.06));color:var(--text-muted);
}
#page-alerts.agl-gold-v2 .agl-caption.agl-critical{ color:#e05252; }
#page-alerts.agl-gold-v2 .agl-caption.agl-critical .agl-caption-n{ background:rgba(224,82,82,.14);color:#e05252; }
#page-alerts.agl-gold-v2 .agl-caption.agl-warning{ color:#d8842e; }
#page-alerts.agl-gold-v2 .agl-caption.agl-warning .agl-caption-n{ background:rgba(216,132,46,.14);color:#d8842e; }

#page-alerts.agl-gold-v2 .agl-card{
  display:flex;align-items:center;gap:12px;
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  border-inline-end:3px solid var(--seg,var(--border));
  padding:14px 18px;margin-bottom:9px;cursor:pointer;transition:.15s;
}
#page-alerts.agl-gold-v2 .agl-card:hover{ border-color:var(--border-gold);transform:translateX(-2px); }
#page-alerts.agl-gold-v2 .agl-card.agl-red{ border-inline-end-color:#e05252; }
#page-alerts.agl-gold-v2 .agl-card.agl-orange{ border-inline-end-color:#d8842e; }
#page-alerts.agl-gold-v2 .agl-card-ic{ display:flex;flex-shrink:0;color:var(--text-muted); }
#page-alerts.agl-gold-v2 .agl-card.agl-red .agl-card-ic{ color:#e05252; }
#page-alerts.agl-gold-v2 .agl-card.agl-orange .agl-card-ic{ color:#d8842e; }
#page-alerts.agl-gold-v2 .agl-card-body{ flex:1;min-width:0;display:flex;flex-direction:column;gap:3px; }
#page-alerts.agl-gold-v2 .agl-card-body b{
  font-size:13.5px;font-weight:700;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
#page-alerts.agl-gold-v2 .agl-card.agl-red .agl-card-body b{ color:#e05252; }
#page-alerts.agl-gold-v2 .agl-card-body span{ font-size:12px;color:var(--text-muted);line-height:1.6; }
#page-alerts.agl-gold-v2 .agl-card-tag{
  flex-shrink:0;font-size:9.5px;font-weight:700;padding:3px 9px;border-radius:99px;
  background:rgba(216,132,46,.14);color:#d8842e;
}
#page-alerts.agl-gold-v2 .agl-card.agl-red .agl-card-tag{ background:rgba(224,82,82,.14);color:#e05252; }
#page-alerts.agl-gold-v2 .agl-card-arrow{ flex-shrink:0;color:var(--text-muted);font-size:14px; }
#page-alerts.agl-gold-v2 .agl-card-time{ flex-shrink:0;font-size:10.5px;color:var(--text-muted);white-space:nowrap; }


#page-alerts.agl-gold-v2 .agl-card.agl-notif{ border-inline-end-color:transparent; }
#page-alerts.agl-gold-v2 .agl-card.agl-notif.is-unread{ border-inline-end-color:var(--ok,var(--accent)); }
#page-alerts.agl-gold-v2 .agl-card-dot{
  width:7px;height:7px;border-radius:50%;background:var(--ok,var(--accent-soft));flex-shrink:0;
}




#page-calendar.cal-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12);
  --danger:#DC2626; --warn:#d8842e;
  --ok: var(--accent); --ok-text: var(--accent-text); --nav-hover:#E7E8F2; --warn-text: var(--warning);
}
body.dark #page-calendar.cal-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#262626; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5);
  --danger:#F87171; --warn:#eab776;
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --nav-hover:#221f1a; --warn-text: var(--warning);
}


#page-calendar.cal-gold-v2 .zcal-icon-btn,
#page-calendar.cal-gold-v2 .zcal-action{
  background:var(--card);border-color:var(--btn-border);color:var(--text-light);
}
#page-calendar.cal-gold-v2 .zcal-action:hover,
#page-calendar.cal-gold-v2 .zcal-icon-btn:hover,
#page-calendar.cal-gold-v2 .zcal-segment:hover{
  background:var(--nav-hover);border-color:var(--ok);color:var(--ok-text);
}

#page-calendar.cal-gold-v2 .zcal-primary{
  background:transparent;border:1.5px solid var(--btn-border);color:var(--text-light);box-shadow:none;
}
#page-calendar.cal-gold-v2 .zcal-primary:hover{ background:var(--nav-hover);border-color:var(--ok);color:var(--ok-text); }

#page-calendar.cal-gold-v2 .zcal-success{
  background:var(--active-pill);border:1px solid var(--border-gold);color:var(--gold-light);box-shadow:none;
}
#page-calendar.cal-gold-v2 .zcal-title{ font-size:22px;font-weight:800; }
#page-calendar.cal-gold-v2 .zcal-subtitle{ color:var(--text-light); }


#page-calendar.cal-gold-v2 .zcal-segments{ background:var(--card);border-color:var(--border); }
#page-calendar.cal-gold-v2 .zcal-segment{ color:var(--text-light); }
#page-calendar.cal-gold-v2 .zcal-segment.active{
  background:var(--active-pill);border:1px solid var(--border-gold);color:var(--gold-light);font-weight:800;box-shadow:none;
}
#page-calendar.cal-gold-v2 .zcal-search{ background:var(--card);border-color:var(--border);color:var(--text); }
#page-calendar.cal-gold-v2 .zcal-search:focus{ border-color:var(--border-gold);box-shadow:0 0 0 3px rgba(107,114,128,.12); }


#page-calendar.cal-gold-v2 .zcal-chip{ border-width:1.5px; }
#page-calendar.cal-gold-v2 .zcal-chip-neutral{ border-color:var(--btn-border);background:transparent;color:var(--text-light); }
#page-calendar.cal-gold-v2 .zcal-chip-neutral.active{ border-color:var(--border-gold);background:var(--active-pill);color:var(--gold-light); }
#page-calendar.cal-gold-v2 .zcal-chip-danger{ border-color:rgba(220,38,38,.35);background:transparent;color:var(--danger); }
#page-calendar.cal-gold-v2 .zcal-chip-danger.active{ border-color:transparent;background:var(--danger);color:#fff; }
#page-calendar.cal-gold-v2 .zcal-chip-warn{ border-color:rgba(216,132,46,.4);background:transparent;color:var(--warn); }
#page-calendar.cal-gold-v2 .zcal-chip-warn.active{ border-color:transparent;background:var(--warn);color:#fff; }


#page-calendar.cal-gold-v2 .zcal-week-strip{ background:var(--card);border-color:var(--border); }
#page-calendar.cal-gold-v2 .zcal-week-day{ background:var(--bg);border-color:var(--border-light);color:var(--text); }
#page-calendar.cal-gold-v2 .zcal-week-day:hover{ border-color:var(--ok);background:var(--nav-hover); }
#page-calendar.cal-gold-v2 .zcal-week-day.active{ background:var(--active-pill);color:var(--gold-light);border-color:var(--border-gold);box-shadow:none; }
#page-calendar.cal-gold-v2 .zcal-week-dot{ background:var(--danger); }


#page-calendar.cal-gold-v2 .zcal-shell{ background:var(--card);border-color:var(--border); }
#page-calendar.cal-gold-v2 .zcal-month-head{ background:var(--track);border-color:var(--border); }
#page-calendar.cal-gold-v2 .zcal-head-cell,
#page-calendar.cal-gold-v2 .zcal-week-head,
#page-calendar.cal-gold-v2 .zcal-week-no{ color:var(--text-muted); }
#page-calendar.cal-gold-v2 .zcal-head-cell:last-child{ color:var(--danger); } 
#page-calendar.cal-gold-v2 .zcal-week-head,
#page-calendar.cal-gold-v2 .zcal-week-no{ background:var(--track); }
#page-calendar.cal-gold-v2 .zcal-day-cell{ background:var(--card);border-color:var(--border-light);color:var(--text); }
#page-calendar.cal-gold-v2 .zcal-day-cell:hover{ background:var(--nav-hover); }
#page-calendar.cal-gold-v2 .zcal-day-cell.other-month{ background:var(--track);color:var(--dim); }

#page-calendar.cal-gold-v2 .zcal-day-cell.active{ outline:none;background:var(--nav-hover); }
#page-calendar.cal-gold-v2 .zcal-date-num{
  color:var(--text);display:inline-flex;align-items:center;justify-content:center;
}
#page-calendar.cal-gold-v2 .zcal-day-cell.today .zcal-date-num{
  background:transparent;color:var(--gold-light);border:1.5px solid var(--border-gold);border-radius:50%;width:24px;height:24px;
}
#page-calendar.cal-gold-v2 .zcal-day-cell.active .zcal-date-num{
  background:var(--gold);color:#1a1204;border:1.5px solid var(--gold);border-radius:50%;width:24px;height:24px;font-weight:800;
}

#page-calendar.cal-gold-v2 .zcal-event-pill{
  background:var(--track)!important;color:var(--text-light)!important;
  border-inline-end:none;border-radius:5px;
}
#page-calendar.cal-gold-v2 .zcal-event-pill.zcal-evt-ok{ color:var(--ok-text)!important; }
#page-calendar.cal-gold-v2 .zcal-event-pill.zcal-evt-warn{ color:var(--warn-text)!important; }
#page-calendar.cal-gold-v2 .zcal-event-pill.zcal-evt-danger{ color:var(--danger)!important; }
#page-calendar.cal-gold-v2 .zcal-more{ color:var(--text-muted); }


#page-calendar.cal-gold-v2 .zcal-day-pane,
#page-calendar.cal-gold-v2 .zcal-timeline,
#page-calendar.cal-gold-v2 .zcal-list-card,
#page-calendar.cal-gold-v2 .zcal-support-card{ background:var(--card);border-color:var(--border); }
#page-calendar.cal-gold-v2 .zcal-pane-title,
#page-calendar.cal-gold-v2 .zcal-support-title{ color:var(--text); }
#page-calendar.cal-gold-v2 .zcal-event-meta,
#page-calendar.cal-gold-v2 .zcal-support-text,
#page-calendar.cal-gold-v2 .zcal-empty{ color:var(--text-muted); }
#page-calendar.cal-gold-v2 .zcal-event-icon{ background:var(--active-pill); }
#page-calendar.cal-gold-v2 .zcal-hour-label{ color:var(--text-muted);border-color:var(--border-light); }
#page-calendar.cal-gold-v2 .zcal-hour-row{ border-color:var(--border-light); }
#page-calendar.cal-gold-v2 .zcal-list-time{ background:var(--track);color:var(--text); }
#page-calendar.cal-gold-v2 .zcal-support-value{ color:var(--text); }


#page-calendar.cal-gold-v2 .zcal-empty-day{ display:flex;flex-direction:column;align-items:center;gap:10px; }
#page-calendar.cal-gold-v2 .zcal-empty-day .glux-empty-dandelion{ width:100px;height:auto; }
#page-calendar.cal-gold-v2 .zcal-empty-day .zcal-empty-text{ padding:0; }


#page-calendar.cal-gold-v2 #gcal-integration-card .card{
  background:var(--card2)!important;border:1px solid var(--border-gold)!important;border-radius:16px!important;
}
#page-calendar.cal-gold-v2 #gcal-integration-card .btn-primary{
  background:transparent!important;border:1.5px solid var(--btn-border)!important;color:var(--text-light)!important;
  box-shadow:none!important;
}
#page-calendar.cal-gold-v2 #gcal-integration-card .btn-primary:hover{
  border-color:var(--ok)!important;color:var(--ok-text)!important;
}


.zcal-upcoming{ display:none; }
#page-calendar.cal-gold-v2 .zcal-upcoming-caption{
  display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--text-muted);
  letter-spacing:.14em;margin:4px 0 8px;
}
#page-calendar.cal-gold-v2 .zcal-upcoming-caption::after{ content:'';flex:1;height:1px;background:var(--hairline); }
#page-calendar.cal-gold-v2 .zcal-upcoming-card{
  display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--border);
  border-inline-end:3px solid var(--ok);border-radius:12px;padding:10px 12px;margin-bottom:8px;cursor:default;
}
#page-calendar.cal-gold-v2 .zcal-upcoming-card[onclick]{ cursor:pointer; }
#page-calendar.cal-gold-v2 .zcal-upcoming-title{ font-size:12.5px;font-weight:700;color:var(--text); }
#page-calendar.cal-gold-v2 .zcal-upcoming-meta{ font-size:11px;color:var(--text-muted);margin-top:2px; }
#page-calendar.cal-gold-v2 .zcal-upcoming-date{ font-size:11px;font-weight:700;color:var(--ok-text);flex-shrink:0; }


#page-calendar.cal-gold-v2 .gcal-card{
  background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:none;
}
#page-calendar.cal-gold-v2 .gcal-icon{
  display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;
  background:var(--track);color:var(--text-light);flex-shrink:0;
}
#page-calendar.cal-gold-v2 .gcal-icon-ok{ background:var(--active-pill);color:var(--gold-light); }
#page-calendar.cal-gold-v2 .gcal-connect-btn{
  display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:12px;font-weight:800;cursor:pointer;
  padding:8px 14px;border-radius:10px;background:var(--active-pill);border:1px solid var(--border-gold);color:var(--gold-light);
}
#page-calendar.cal-gold-v2 .gcal-ghost-btn{
  display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:12px;font-weight:700;cursor:pointer;
  padding:8px 12px;border-radius:10px;background:transparent;border:1px solid var(--btn-border);color:var(--text-light);
}
#page-calendar.cal-gold-v2 .gcal-ghost-btn:hover{ background:var(--nav-hover); }
#page-calendar.cal-gold-v2 .gcal-ghost-danger{ border-color:rgba(220,38,38,.35);color:var(--danger); }


@media (max-width:768px){
  #page-calendar.cal-gold-v2 .zcal-search{ display:none; }
  #page-calendar.cal-gold-v2 .zcal-segments{ width:100%; }
  #page-calendar.cal-gold-v2 .zcal-segment{ flex:1;justify-content:center; }
  #page-calendar.cal-gold-v2 .zcal-filterbar{
    flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
  }
  #page-calendar.cal-gold-v2 .zcal-filterbar::-webkit-scrollbar{ display:none; }
  
  #page-calendar.cal-gold-v2 .zcal-month-head,
  #page-calendar.cal-gold-v2 .zcal-month-row{ grid-template-columns:repeat(7,minmax(0,1fr)); }
  #page-calendar.cal-gold-v2 .zcal-week-head,
  #page-calendar.cal-gold-v2 .zcal-week-no{ display:none; }
  #page-calendar.cal-gold-v2 .zcal-day-cell{
    min-height:52px;display:flex;flex-direction:column;align-items:center;padding:5px 2px;
  }
  #page-calendar.cal-gold-v2 .zcal-date-num{
    width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:2px;
  }
  
  #page-calendar.cal-gold-v2 .zcal-event-pill{
    width:5px;height:5px;padding:0;margin:1px;border-radius:50%;overflow:hidden;
    font-size:0;line-height:0;border-inline-end:none!important;background:var(--dim)!important;
  }
  #page-calendar.cal-gold-v2 .zcal-event-pill.zcal-evt-ok{ background:var(--ok)!important; }
  #page-calendar.cal-gold-v2 .zcal-event-pill.zcal-evt-warn{ background:var(--warn-text)!important; }
  #page-calendar.cal-gold-v2 .zcal-event-pill.zcal-evt-danger{ background:var(--danger)!important; }
  #page-calendar.cal-gold-v2 .zcal-more{ display:none; }
  .zcal-upcoming{ display:block; }
}


@media (min-width:901px){
  #page-calendar.cal-gold-v2 .zcal-shell{ max-width:940px; margin-inline:auto; }
  #page-calendar.cal-gold-v2 .zcal-day-cell{ min-height:74px; padding:6px 7px; }
  #page-calendar.cal-gold-v2 .zcal-date-num{ font-size:12.5px; }
  #page-calendar.cal-gold-v2 .zcal-day-cell.today .zcal-date-num{ width:23px; height:23px; }
  #page-calendar.cal-gold-v2 .zcal-event-pill{ font-size:10.5px; padding:1px 6px; margin-top:2px; }
  #page-calendar.cal-gold-v2 .zcal-month-head{ font-size:11px; }
}




#page-todos.tgl-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --seg:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12);
  --acc-success-bg:rgba(5,150,105,.09); --acc-success-text:#047857;
  --acc-warning-bg:rgba(217,119,6,.09); --acc-warning-text:#B45309;
  --acc-danger-bg:rgba(220,38,38,.08); --acc-danger-text:#DC2626;
  --acc-purple-bg:rgba(124,58,237,.09); --acc-purple-text:#7C3AED;
  --acc-cyan-bg:rgba(8,145,178,.09); --acc-cyan-text:#0E7490;
  --acc-neutral-bg:var(--track); --acc-neutral-text:var(--text-light);
  --ok: var(--accent); --ok-text: var(--accent-text);
}


#page-todos.ztask-page #todos-content{margin:0}
.ztask-shell{--zt-green:#797E86;--zt-green-soft:#e9f7f3;--zt-ink:#1C1F25;--zt-muted:#718096;--zt-line:#E4E5EF;display:flex;flex-direction:column;gap:18px;color:var(--zt-ink)}
.ztask-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:24px 26px;border:1px solid var(--zt-line);border-radius:18px;background:linear-gradient(135deg,#fff 0%,#fff 70%,#f0faf7 100%);box-shadow:0 12px 34px rgba(28, 31, 37,.05)}
.ztask-kicker{display:block;margin-bottom:6px;color:var(--zt-green);font-size:10px;font-weight:900;letter-spacing:.14em}
.ztask-hero h1{margin:0 0 5px;font-size:27px;line-height:1.15}
.ztask-hero p{max-width:680px;margin:0;color:var(--zt-muted);font-size:12px;line-height:1.65}
.ztask-primary{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:0 18px;border:0;border-radius:11px;background:var(--zt-green);color:#fff;font:800 12px/1 inherit;cursor:pointer;box-shadow:0 8px 20px rgba(121, 126, 134,.2)}
.ztask-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ztask-stats button{display:flex;align-items:center;justify-content:space-between;min-height:72px;padding:14px 18px;border:1px solid var(--zt-line);border-radius:14px;background:#fff;color:var(--zt-muted);font-family:inherit;cursor:pointer}
.ztask-stats button b{color:var(--zt-ink);font-size:24px}.ztask-stats button span{font-size:11px;font-weight:750}.ztask-stats button.danger{border-color:#fecaca;background:#fff8f8}.ztask-stats button.danger b{color:#c24141}
.ztask-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid var(--zt-line);border-radius:14px;background:#fff}
.ztask-tabs{display:flex;gap:4px;padding:3px;border-radius:10px;background:#F5F6FF}.ztask-tabs button{padding:8px 14px;border:0;border-radius:8px;background:transparent;color:var(--zt-muted);font:750 11px/1 inherit;cursor:pointer}.ztask-tabs button.active{background:#fff;color:var(--zt-green);box-shadow:0 2px 8px rgba(19, 22, 28,.07)}
.ztask-filters{display:flex;align-items:center;gap:8px}.ztask-filters select,.ztask-search{height:38px;border:1px solid var(--zt-line);border-radius:10px;background:#fff;color:var(--zt-ink);font:600 11px/1 inherit}.ztask-filters select{min-width:135px;padding:0 10px}.ztask-search{display:flex;align-items:center;gap:7px;min-width:245px;padding:0 11px;color:var(--zt-muted)}.ztask-search input{width:100%;border:0;outline:0;background:transparent;color:var(--zt-ink);font:inherit}
.ztask-table{overflow:hidden;border:1px solid var(--zt-line);border-radius:15px;background:#fff;box-shadow:0 8px 24px rgba(28, 31, 37,.04)}
.ztask-table-head,.ztask-row{display:grid;grid-template-columns:minmax(270px,1.5fr) minmax(140px,.8fr) minmax(160px,.85fr) 135px 115px 80px;align-items:center}
.ztask-table-head{min-height:43px;padding:0 14px;border-bottom:1px solid var(--zt-line);background:#F8F9FF;color:#7b8799;font-size:9.5px;font-weight:850;letter-spacing:.04em;text-transform:uppercase}
.ztask-row{min-height:68px;padding:0 14px;border-bottom:1px solid #F0F1FB;cursor:pointer;transition:.14s}.ztask-row:last-child{border-bottom:0}.ztask-row:hover{background:#fbfdfc}.ztask-row.done{opacity:.66}
.ztask-row>div,.ztask-table-head>span{min-width:0;padding:10px 9px}.ztask-title-cell,.ztask-owner{display:flex;align-items:center;gap:10px;min-width:0}.ztask-title-cell>span{display:flex;flex-direction:column;min-width:0}.ztask-title-cell b{overflow:hidden;color:var(--zt-ink);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.ztask-title-cell small{margin-top:4px;color:#98a2b3;font-size:9px}.ztask-row.done .ztask-title-cell b{text-decoration:line-through}
.ztask-check{flex:0 0 19px;width:19px;height:19px;padding:0;border:1.5px solid #a9b3c1;border-radius:50%;background:#fff;color:#fff;font-size:11px;cursor:pointer}.ztask-check.checked{border-color:var(--zt-green);background:var(--zt-green)}
.ztask-related{max-width:100%;padding:0;border:0;background:transparent;color:#2563a7;font:650 10.5px/1.3 inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.ztask-owner span:last-child{overflow:hidden;color:#42526a;font-size:10.5px;text-overflow:ellipsis;white-space:nowrap}.ztask-avatar{display:inline-flex;align-items:center;justify-content:center;flex:0 0 28px;width:28px;height:28px;overflow:hidden;border-radius:9px;background:#e4f4ef;color:var(--zt-green);font-size:9px;font-weight:900}.ztask-avatar img{width:100%;height:100%;object-fit:cover}
.ztask-muted{color:#a0a8b4;font-size:10.5px}.ztask-due{color:#5f6b7a;font-size:10.5px}.ztask-due.today{color:#9a6700;font-weight:750}.ztask-due.overdue{color:#c24141;font-weight:800}
.ztask-status,.ztask-sync{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:800;white-space:nowrap}.ztask-status.not-started{background:var(--card2);color:#5f6b7a}.ztask-status.in-progress{background:#fff5db;color:#8a6200}.ztask-status.completed{background:#e8f7ef;color:#087443}.ztask-status.deferred{background:#EEEFF9;color:#745096}
.ztask-sync{padding:0;background:transparent;color:#748094}.ztask-sync i{width:7px;height:7px;border-radius:50%;background:#e2a119}.ztask-sync.synced i{background:#18a06f}.ztask-sync.failed{color:#bf4545}.ztask-sync.failed i{background:#d84b4b}
.ztask-actions{display:flex;justify-content:flex-end;gap:5px}.ztask-actions button{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border:1px solid var(--zt-line);border-radius:9px;background:#fff;color:#667085;cursor:pointer}.ztask-actions button.danger:hover{border-color:#f1b5b5;color:#c24141;background:#fff5f5}
.ztask-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:270px;color:var(--zt-muted);text-align:center}
.ztask-stats button.on{border-color:var(--zt-green);background:var(--zt-green-soft);color:var(--zt-ink)}
.ztask-check[disabled]{opacity:.35;cursor:not-allowed}
.ztask-start{margin-left:6px;padding:0;border:0;background:transparent;color:var(--zt-green);font:800 10px/1 inherit;cursor:pointer}
.ztask-report{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:10px}
.ztask-person{display:flex;flex-direction:column;gap:10px;min-height:92px;padding:12px 14px;border:1px solid var(--zt-line);border-radius:14px;background:#fff;color:inherit;font-family:inherit;text-align:start;cursor:pointer}
.ztask-person:hover{border-color:#c5d0d8}
.ztask-person.active{border-color:var(--zt-green);background:var(--zt-green-soft)}
.ztask-person.warn:not(.active){border-color:#fecaca}
.ztask-person-top{display:flex;align-items:center;gap:8px;min-width:0}
.ztask-person-top b{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.ztask-meters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.ztask-meters span{display:flex;flex-direction:column;gap:2px}
.ztask-meters strong{color:var(--zt-ink);font-size:16px;line-height:1}
.ztask-meters strong.overdue{color:#c24141}
.ztask-meters em{color:var(--zt-muted);font-size:9px;font-style:normal;font-weight:750;letter-spacing:.04em;text-transform:uppercase}
.dark .ztask-person{background:#171a1f;border-color:#2b3038}
.dark .ztask-person.active{background:#102720;border-color:#797E86}
.dark .ztask-meters strong{color:var(--text)}
@media(max-width:768px){
  .ztask-report{display:flex;overflow-x:auto;gap:8px;padding-bottom:4px}
  .ztask-person{min-width:156px;flex:0 0 auto}
}
html.crm-mobile-lock .ztask-report{display:flex !important;overflow-x:auto;gap:8px;padding-bottom:2px}
html.crm-mobile-lock .ztask-person{min-width:150px;flex:0 0 auto;min-height:84px;padding:10px 12px}
.ztask-empty b{color:var(--zt-ink);font-size:14px}.ztask-empty span{margin:5px 0 14px;font-size:11px}.ztask-empty button{padding:9px 14px;border:1px solid var(--zt-green);border-radius:9px;background:#fff;color:var(--zt-green);font:800 11px/1 inherit;cursor:pointer}
.ztask-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:20px 22px;border-bottom:1px solid #EAEBF5;background:#fbfcfd}.ztask-detail-head span{color:var(--zt-green);font-size:9px;font-weight:900;letter-spacing:.12em}.ztask-detail-head h2{margin:5px 0 0;color:var(--zt-ink);font-size:18px}.ztask-detail-head>div:last-child{display:flex;gap:7px}.ztask-detail-head button{display:inline-flex;align-items:center;gap:5px;padding:8px 11px;border:1px solid #E1E2EC;border-radius:9px;background:#fff;color:#526174;font:750 10px/1 inherit;cursor:pointer}.ztask-detail-head button.close{justify-content:center;width:32px;padding:0;font-size:18px}
.ztask-detail-body{padding:22px;color:var(--zt-ink)}.ztask-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:20px}.ztask-detail-grid>div{display:flex;flex-direction:column;gap:5px;padding:12px;border:1px solid #E9EAF4;border-radius:11px}.ztask-detail-grid span,.ztask-detail-body h3{color:#7c8798;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.ztask-detail-grid b{font-size:11px}.ztask-detail-body section{padding:14px 0;border-top:1px solid var(--border)}.ztask-detail-body section h3{margin:0 0 9px}.ztask-detail-body section p{margin:0;color:#536174;font-size:11.5px;line-height:1.7;white-space:pre-wrap}.ztask-detail-owner{display:flex;align-items:center;gap:9px;font-size:11px}.ztask-sync-error{padding:10px 12px;border-radius:9px;background:#fff1f1;color:#b63c3c;font-size:10px}
.ztask-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:18px}.ztask-form .wide{grid-column:1/-1}.ztask-form label{display:flex;flex-direction:column;gap:6px}.ztask-form label>span{color:#657184;font-size:10px;font-weight:750}.ztask-form input,.ztask-form textarea,.ztask-form select{width:100%;box-sizing:border-box;min-height:41px;padding:9px 11px;border:1px solid #E1E2EC;border-radius:10px;outline:0;background:#fff;color:#24272D;font:600 11px/1.4 inherit}.ztask-form textarea{resize:vertical}.ztask-form input:focus,.ztask-form textarea:focus,.ztask-form select:focus{border-color:var(--zt-green);box-shadow:0 0 0 3px rgba(121, 126, 134,.1)}.ztask-form-note{display:flex;align-items:center;gap:7px;padding:10px 12px;border-radius:10px;background:#eef8f5;color:#527168;font-size:10px}.ztask-form-note i{width:7px;height:7px;border-radius:50%;background:var(--zt-green)}.ztask-form footer{display:flex;justify-content:flex-end;gap:8px;padding-top:4px}.ztask-form footer button{min-height:40px;padding:0 17px;border-radius:10px;font:800 11px/1 inherit;cursor:pointer}.ztask-form footer .secondary{border:1px solid #E0E1EB;background:#fff;color:#5f6d7e}.ztask-form footer .primary{border:1px solid var(--zt-green);background:var(--zt-green);color:#fff}.ztask-form footer .primary:disabled{opacity:.6;cursor:wait}

body.dark .ztask-shell{--zt-ink:#EDEEF6;--zt-muted:#98a2b3;--zt-line:#33363C}.dark .ztask-hero,.dark .ztask-stats button,.dark .ztask-toolbar,.dark .ztask-table,.dark .ztask-actions button,.dark .ztask-search,.dark .ztask-filters select{background:#171a1f}.dark .ztask-hero{background:linear-gradient(135deg,#171a1f,#171a1f 70%,#102720)}.dark .ztask-table-head{background:#20242b}.dark .ztask-row{border-color:#2b3038}.dark .ztask-row:hover{background:#1b211f}.dark .ztask-title-cell b{color:var(--text)}.dark .ztask-owner span:last-child,.dark .ztask-due{color:#c2c8d0}

@media(max-width:1100px){.ztask-table-head,.ztask-row{grid-template-columns:minmax(230px,1.4fr) minmax(140px,.8fr) 120px 105px 80px}.ztask-table-head>span:nth-child(2),.ztask-row>div:nth-child(2){display:none}}
@media(max-width:768px){
  .ztask-hero{padding:18px;flex-direction:column}.ztask-primary{width:100%}.ztask-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.ztask-toolbar{align-items:stretch;flex-direction:column}.ztask-filters{align-items:stretch;flex-direction:column}.ztask-search{min-width:0}.ztask-table-head{display:none}.ztask-row{grid-template-columns:1fr auto;gap:8px;padding:13px;min-height:0}.ztask-row>div{padding:3px}.ztask-row>div:nth-child(2),.ztask-row>div:nth-child(3),.ztask-row>div:nth-child(6){grid-column:1}.ztask-row>div:nth-child(4),.ztask-row>div:nth-child(5){grid-column:1;display:inline-flex}.ztask-row>div:nth-child(7){grid-column:2;grid-row:1/4}.ztask-form{grid-template-columns:1fr}.ztask-form .wide{grid-column:1}.ztask-detail-grid{grid-template-columns:1fr}
}
body.dark #page-todos.tgl-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --seg:#2F303A; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5);
  --acc-success-bg:rgba(34,197,94,.14); --acc-success-text:#4ADE80;
  --acc-warning-bg:rgba(245,158,11,.14); --acc-warning-text:#FBBF24;
  --acc-danger-bg:rgba(239,68,68,.14); --acc-danger-text:#F87171;
  --acc-purple-bg:rgba(167,139,250,.16); --acc-purple-text:#C4B5FD;
  --acc-cyan-bg:rgba(34,211,238,.14); --acc-cyan-text:#67E8F9;
  --acc-neutral-bg:rgba(255,255,255,.06); --acc-neutral-text:var(--text-light);
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent);
}


.tgl-summary-line{ font-size:12.5px;color:var(--text-light,#6B7280);margin:2px 0 12px; }
#page-todos.tgl-gold-v2 .tgl-summary-line{ color:var(--text-light); }


#page-todos.tgl-gold-v2 .tgl-controlbar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px;
  padding-bottom:12px;border-bottom:1px solid var(--hairline);
}
#page-todos.tgl-gold-v2 .tgl-seg-tabs{ display:flex;gap:4px;background:var(--card);border:1px solid var(--border);border-radius:11px;padding:3px; }
#page-todos.tgl-gold-v2 .tgl-tab{
  border:none;background:transparent;color:var(--text-light);font-size:12.5px;font-weight:700;
  padding:7px 14px;border-radius:9px;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:5px;
}
#page-todos.tgl-gold-v2 .tgl-tab.active{ background:var(--active-pill);color:var(--gold-light); }
#page-todos.tgl-gold-v2 .tgl-tab-badge{
  background:var(--track);color:var(--text-muted);font-size:9.5px;font-weight:800;padding:1px 6px;border-radius:99px;
}
#page-todos.tgl-gold-v2 .tgl-vsep{ width:1px;align-self:stretch;background:var(--hairline);margin:0 2px; }
#page-todos.tgl-gold-v2 .tgl-chip-row{ display:flex;gap:6px;flex-wrap:wrap; }
#page-todos.tgl-gold-v2 .tgl-chip{
  border:1px solid var(--btn-border);background:transparent;color:var(--text-light);
  font-size:11.5px;font-weight:700;padding:6px 13px;border-radius:999px;cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;gap:4px;
}
#page-todos.tgl-gold-v2 .tgl-chip.active{ background:var(--active-pill);border-color:var(--border-gold);color:var(--gold-light); }
#page-todos.tgl-gold-v2 .tgl-chip-danger{ border-color:var(--acc-danger-text);color:var(--acc-danger-text); }
#page-todos.tgl-gold-v2 .tgl-chip-warn{ border-color:var(--acc-warning-text);color:var(--acc-warning-text); }
#page-todos.tgl-gold-v2 .tgl-add-btn{
  margin-inline-start:auto;background:var(--active-pill);color:var(--gold-light);border:1px solid var(--border-gold);border-radius:10px;
  padding:9px 16px;font-size:12.5px;font-weight:800;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;gap:6px;white-space:nowrap;
}


#page-todos.tgl-gold-v2 .tgl-stats-grid{ display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:18px; }
#page-todos.tgl-gold-v2 .tgl-stat-card{
  background:var(--card2);border:1px solid var(--border);border-radius:14px;padding:14px 16px;text-align:center;
}
#page-todos.tgl-gold-v2 .tgl-clickable{ cursor:pointer;transition:.15s; }
#page-todos.tgl-gold-v2 .tgl-clickable:hover{ border-color:var(--border-gold); }
#page-todos.tgl-gold-v2 .tgl-stat-num{ font-size:22px;font-weight:900;color:var(--text); }
#page-todos.tgl-gold-v2 .tgl-gold-text{ color:var(--acc-warning-text); }
#page-todos.tgl-gold-v2 .tgl-accent-warning{ color:var(--acc-warning-text); }
#page-todos.tgl-gold-v2 .tgl-accent-success{ color:var(--acc-success-text); }
#page-todos.tgl-gold-v2 .tgl-accent-danger{ color:var(--acc-danger-text); }
#page-todos.tgl-gold-v2 .tgl-stat-lbl{ font-size:11px;color:var(--text-muted);font-weight:700;margin-top:2px; }


#page-todos.tgl-gold-v2 .tgl-card{
  display:flex;align-items:flex-start;gap:12px;background:var(--card2);border:1px solid var(--border);
  border-radius:15px;padding:13px 15px;margin-bottom:9px;cursor:pointer;transition:.15s;
  box-shadow:0 3px 10px var(--shadow);
}
#page-todos.tgl-gold-v2 .tgl-card:hover{ border-color:var(--border-gold);box-shadow:0 5px 16px var(--shadow); }
#page-todos.tgl-gold-v2 .tgl-card.tgl-card-overdue{ border-inline-start:3px solid var(--acc-danger-text); }
#page-todos.tgl-gold-v2 .tgl-card.tgl-card-today{ border-inline-start:3px solid var(--ok); }
#page-todos.tgl-gold-v2 .tgl-checkbox{
  appearance:none;-webkit-appearance:none;width:21px;height:21px;margin-top:1px;flex-shrink:0;cursor:pointer;
  border:1.5px solid var(--btn-border);border-radius:6px;background:var(--card);position:relative;transition:.15s;
}
#page-todos.tgl-gold-v2 .tgl-checkbox:checked{
  background:var(--ok);border-color:var(--ok);
}
#page-todos.tgl-gold-v2 .tgl-checkbox:checked::after{
  content:'';position:absolute;inset:3px;background:var(--bg);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;
  -webkit-mask-size:13px 13px;mask-size:13px 13px;
}
#page-todos.tgl-gold-v2 .tgl-body{ flex:1;min-width:0; }
#page-todos.tgl-gold-v2 .tgl-row-top{ display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:4px; }
#page-todos.tgl-gold-v2 .tgl-title{ font-size:13.5px;font-weight:700;color:var(--text); }
#page-todos.tgl-gold-v2 .tgl-title-done{ color:var(--dim);text-decoration:line-through; }
#page-todos.tgl-gold-v2 .tgl-pill{
  font-size:10px;font-weight:700;padding:2px 8px;border-radius:99px;display:inline-flex;align-items:center;gap:3px;
}
#page-todos.tgl-gold-v2 .tgl-prio-urgent{ color:var(--acc-danger-text);background:transparent;border:1px solid var(--acc-danger-text); }
#page-todos.tgl-gold-v2 .tgl-prio-important{ color:var(--acc-warning-text);background:transparent;border:1px solid transparent; }
#page-todos.tgl-gold-v2 .tgl-prio-normal{ color:var(--text-muted);background:var(--track); }
#page-todos.tgl-gold-v2 .tgl-status-todo{ color:var(--text-muted);background:var(--track); }
#page-todos.tgl-gold-v2 .tgl-status-progress{ color:var(--text-muted);background:var(--track); }
#page-todos.tgl-gold-v2 .tgl-status-done{ color:var(--ok-text);background:color-mix(in srgb, var(--ok) 14%, transparent); }
#page-todos.tgl-gold-v2 .tgl-pill-recur{ color:var(--acc-purple-text);background:var(--acc-purple-bg); }
#page-todos.tgl-gold-v2 .tgl-pill-reminder{ color:var(--acc-cyan-text);background:var(--acc-cyan-bg); }
#page-todos.tgl-gold-v2 .tgl-pill-amount{ color:var(--acc-success-text);background:var(--acc-success-bg); }
#page-todos.tgl-gold-v2 .tgl-pill-comment{ color:var(--text-muted);background:var(--track); }
#page-todos.tgl-gold-v2 .tgl-desc{ font-size:12px;color:var(--text-muted);margin-bottom:7px;line-height:1.6; }
#page-todos.tgl-gold-v2 .tgl-progress-row{ display:flex;align-items:center;gap:8px;margin-bottom:6px; }
#page-todos.tgl-gold-v2 .tgl-progress-track{ flex:1;background:var(--track);border-radius:99px;height:4px;max-width:120px; }
#page-todos.tgl-gold-v2 .tgl-progress-fill{ background:var(--ok);height:4px;border-radius:99px; }
#page-todos.tgl-gold-v2 .tgl-progress-lbl{ font-size:10px;color:var(--text-muted);display:inline-flex;align-items:center;gap:3px; }
#page-todos.tgl-gold-v2 .tgl-row-bottom{ display:flex;align-items:center;gap:11px;flex-wrap:wrap; }
#page-todos.tgl-gold-v2 .tgl-prop-chip{
  font-size:11px;color:var(--ok-text);background:transparent;border:none;font-weight:600;
  padding:0;cursor:pointer;display:inline-flex;align-items:center;gap:4px;
}
#page-todos.tgl-gold-v2 .tgl-prop-chip:hover{ text-decoration:underline; }
#page-todos.tgl-gold-v2 .tgl-due{ font-size:11px;color:var(--text-muted);display:inline-flex;align-items:center;gap:4px; }
#page-todos.tgl-gold-v2 .tgl-due-overdue{ color:var(--acc-danger-text);font-weight:700; }
#page-todos.tgl-gold-v2 .tgl-due-today{ color:var(--acc-warning-text);font-weight:700; }
#page-todos.tgl-gold-v2 .tgl-creator{ font-size:11px;color:var(--dim); }
#page-todos.tgl-gold-v2 .tgl-actions{ display:flex;align-items:center;gap:6px;flex-shrink:0; }
#page-todos.tgl-gold-v2 .tgl-avatars{ display:flex; }
#page-todos.tgl-gold-v2 .tgl-avatar{
  width:26px;height:26px;border-radius:7px;font-size:10px;font-weight:800;display:flex;align-items:center;
  justify-content:center;margin-inline-start:-6px;border:2px solid var(--card);overflow:hidden;
}
#page-todos.tgl-gold-v2 .tgl-icon-btn{
  border:1px solid var(--btn-border);background:transparent;color:var(--text-light);border-radius:50%;width:32px;height:32px;
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;opacity:.55;transition:.15s;
}
#page-todos.tgl-gold-v2 .tgl-card:hover .tgl-icon-btn{ opacity:1; }
#page-todos.tgl-gold-v2 .tgl-icon-btn-danger:hover{ background:var(--acc-danger-bg);color:var(--acc-danger-text); }


#page-todos.tgl-gold-v2 .tgl-empty{ text-align:center;padding:48px 20px; }
#page-todos.tgl-gold-v2 .glux-empty-dandelion{ width:110px;height:auto;margin:0 auto 14px;display:block; }
#page-todos.tgl-gold-v2 .tgl-empty-text{ font-size:14px;font-weight:700;color:var(--text);margin-bottom:4px; }
#page-todos.tgl-gold-v2 .tgl-empty-sub{ font-size:12px;color:var(--text-muted); }

@media (max-width:768px){
  #page-todos.tgl-gold-v2 .tgl-stats-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #page-todos.tgl-gold-v2 .tgl-controlbar{ gap:8px; }
  #page-todos.tgl-gold-v2 .tgl-chip-row{ flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;max-width:100%; }
  #page-todos.tgl-gold-v2 .tgl-chip-row::-webkit-scrollbar{ display:none; }
  #page-todos.tgl-gold-v2 .tgl-chip{ flex-shrink:0;white-space:nowrap; }
  #page-todos.tgl-gold-v2 .tgl-add-btn{ margin-inline-start:0;width:100%;justify-content:center; }
  #page-todos.tgl-gold-v2 .tgl-vsep{ display:none; }
  #page-todos.tgl-gold-v2 .tgl-card{ flex-wrap:wrap; }
  #page-todos.tgl-gold-v2 .tgl-actions{ margin-inline-start:31px;margin-top:8px; }
}




#page-help.hlp-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  --hero-grad:linear-gradient(135deg,var(--active-pill),var(--card));
  --kbd-bg:#24252F;
}
body.dark #page-help.hlp-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  --hero-grad:linear-gradient(135deg,var(--active-pill),var(--card));
  --kbd-bg:#221d10;
}

#page-help.hlp-gold-v2 .hlp-summary-line{ font-size:12.5px;color:var(--text-light);margin:2px 0 14px; }


#page-help.hlp-gold-v2 .hlp-hero{
  position:relative;overflow:hidden;border-radius:20px;padding:30px 32px;margin-bottom:26px;
  background:var(--hero-grad);border:1px solid var(--border-gold);box-shadow:0 0 0 3px var(--glow);
}
#page-help.hlp-gold-v2 .hlp-hero-dandelion{ position:absolute;inset-inline-start:-10px;bottom:-16px;width:150px;height:auto;opacity:.5;pointer-events:none; }
#page-help.hlp-gold-v2 .hlp-hero-icon{ margin-bottom:8px;color:var(--gold-light); }
#page-help.hlp-gold-v2 .hlp-hero h1{ position:relative;margin:0 0 8px;font-size:26px;font-weight:700;color:var(--text); }
#page-help.hlp-gold-v2 .hlp-hero h1 b{ font-weight:300; }
#page-help.hlp-gold-v2 .hlp-hero p{ position:relative;margin:0 0 20px;font-size:13px;color:var(--text-light);line-height:1.8;max-width:560px; }
#page-help.hlp-gold-v2 .hlp-tour-btn{
  position:relative;background:var(--active-pill);color:var(--gold-light);border:1px solid var(--border-gold);border-radius:12px;
  padding:11px 24px;font-size:14px;font-weight:800;cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;gap:8px;min-height:44px;
}


#page-help.hlp-gold-v2 .hlp-section-title{
  font-size:12px;font-weight:800;color:var(--gold-light);letter-spacing:.6px;text-transform:uppercase;
  display:flex;align-items:center;gap:8px;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--hairline);
}


#page-help.hlp-gold-v2 .hlp-quick-grid{ display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:28px; }
#page-help.hlp-gold-v2 .hlp-quick-card{
  background:var(--card);border:1.5px solid var(--border);border-radius:14px;padding:14px 10px;cursor:pointer;
  font-family:inherit;text-align:center;transition:.2s;display:flex;flex-direction:column;align-items:center;gap:8px;
}
#page-help.hlp-gold-v2 .hlp-quick-card:hover{ border-color:var(--border-gold);box-shadow:0 0 0 3px var(--glow); }

#page-help.hlp-gold-v2 .hlp-quick-icon{
  width:40px;height:40px;border-radius:50%;background:var(--track);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;color:var(--text-light);transition:.2s;
}
#page-help.hlp-gold-v2 .hlp-quick-card:hover .hlp-quick-icon{
  background:var(--active-pill);border-color:var(--border-gold);color:var(--gold-light);
}
#page-help.hlp-gold-v2 .hlp-quick-label{ font-size:11px;font-weight:700;color:var(--text); }


#page-help.hlp-gold-v2 .hlp-accordion-list{ display:flex;flex-direction:column;gap:8px;margin-bottom:28px; }
#page-help.hlp-gold-v2 .hlp-accordion-card{
  background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;cursor:pointer;transition:.2s;
}
#page-help.hlp-gold-v2 .hlp-accordion-card:hover{ border-color:var(--border-gold); }
#page-help.hlp-gold-v2 .hlp-accordion-head{ padding:15px 18px;display:flex;align-items:center;gap:12px; }
#page-help.hlp-gold-v2 .hlp-accordion-icon{
  width:42px;height:42px;border-radius:12px;background:var(--track);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--text-light);transition:.2s;
}
#page-help.hlp-gold-v2 .hlp-accordion-card:hover .hlp-accordion-icon,
#page-help.hlp-gold-v2 .hlp-accordion-card.open .hlp-accordion-icon{
  background:var(--active-pill);border-color:var(--border-gold);color:var(--gold-light);
}
#page-help.hlp-gold-v2 .hlp-accordion-title{ flex:1;font-size:14px;font-weight:700;color:var(--text); }
#page-help.hlp-gold-v2 .hlp-accordion-pill{ font-size:11px;color:var(--text-muted);background:var(--track);padding:3px 10px;border-radius:99px;white-space:nowrap; }
#page-help.hlp-gold-v2 .hlp-accordion-arrow{ width:18px;height:18px;flex-shrink:0;color:var(--dim);transition:.25s; }
#page-help.hlp-gold-v2 .hlp-accordion-body{ display:none;border-top:1px solid var(--hairline);padding:6px 18px 14px; }
#page-help.hlp-gold-v2 .hlp-step-row{ display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid var(--hairline); }
#page-help.hlp-gold-v2 .hlp-step-row:last-child{ border-bottom:none; }
#page-help.hlp-gold-v2 .hlp-step-num{
  width:26px;height:26px;border-radius:50%;background:var(--active-pill);color:var(--gold-light);border:1px solid var(--border-gold);display:flex;align-items:center;
  justify-content:center;font-size:11px;font-weight:800;flex-shrink:0;margin-top:1px;
}
#page-help.hlp-gold-v2 .hlp-step-text{ font-size:13px;color:var(--text);line-height:1.7;padding-top:3px; }


#page-help.hlp-gold-v2 .hlp-faq-card{ background:var(--card);border:1px solid var(--border);border-radius:16px;padding:20px;margin-bottom:24px; }
#page-help.hlp-gold-v2 .hlp-faq-row{ border-bottom:1px solid var(--hairline); }
#page-help.hlp-gold-v2 .hlp-faq-row:last-child{ border-bottom:none; }
#page-help.hlp-gold-v2 .hlp-faq-q{
  width:100%;background:none;border:none;padding:14px 0;display:flex;align-items:center;justify-content:space-between;
  cursor:pointer;font-family:inherit;text-align:end;min-height:44px;
}
#page-help.hlp-gold-v2 .hlp-faq-q:hover{ background:var(--active-pill); }
#page-help.hlp-gold-v2 .hlp-faq-q span{ font-size:13px;font-weight:700;color:var(--text); }
#page-help.hlp-gold-v2 .hlp-faq-arrow{ width:16px;height:16px;flex-shrink:0;color:var(--text-muted);transition:.25s; }
#page-help.hlp-gold-v2 .hlp-faq-a{ display:none;padding-bottom:14px;font-size:13px;color:var(--text-muted);line-height:1.8; }


#page-help.hlp-gold-v2 .hlp-kbd-card{ background:var(--card2);border:1px solid var(--border-gold);border-radius:16px;padding:20px;margin-bottom:20px; }
#page-help.hlp-gold-v2 .hlp-kbd-grid{ display:grid;grid-template-columns:1fr 1fr;gap:8px; }
#page-help.hlp-gold-v2 .hlp-kbd-row{ display:flex;align-items:center;gap:10px;padding:8px;background:var(--track);border-radius:8px; }
#page-help.hlp-gold-v2 .hlp-kbd-row kbd{
  background:var(--kbd-bg);color:var(--gold-light);border-radius:6px;padding:3px 8px;font-size:11px;
  font-family:monospace;white-space:nowrap;
}
#page-help.hlp-gold-v2 .hlp-kbd-row span{ font-size:12px;color:var(--text-muted); }

@media (max-width:768px){
  #page-help.hlp-gold-v2 .hlp-hero{ padding:22px 20px; }
  #page-help.hlp-gold-v2 .hlp-hero h1{ font-size:20px; }
  #page-help.hlp-gold-v2 .hlp-tour-btn{ width:100%;justify-content:center; }
  #page-help.hlp-gold-v2 .hlp-quick-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  #page-help.hlp-gold-v2 .hlp-kbd-grid{ grid-template-columns:1fr; }
}




#page-users.usr-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong); --nav-hover:#E7E8F2;
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  --avatar-bg:linear-gradient(135deg,#e8d6a0,#c3a75e);
  --acc-danger-text:#DC2626; --acc-danger-bg:rgba(220,38,38,.08);
  --ok: var(--accent); --ok-text: var(--accent-text); --ok-bg: var(--accent-soft);
}
body.dark #page-users.usr-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A; --nav-hover:#221f1a;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  --avatar-bg:linear-gradient(135deg,#4a3f22,#7a6534);
  --acc-danger-text:#F87171; --acc-danger-bg:rgba(239,68,68,.14);
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --ok-bg: var(--accent-soft);
}

#page-users.usr-gold-v2 .usr-summary-line{ font-size:12.5px;color:var(--text-light);margin:2px 0 14px; }


#page-users.usr-gold-v2 .usr-headbar{ display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:18px; }
#page-users.usr-gold-v2 .usr-headbar h2{ margin:0;font-size:22px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px; }
#page-users.usr-gold-v2 .usr-headbar h2 b{ font-weight:300; }
#page-users.usr-gold-v2 .usr-headbar-sub{ font-size:12px;color:var(--text-muted);margin-top:4px; }
#page-users.usr-gold-v2 .usr-head-actions{ display:flex;gap:8px;flex-wrap:wrap; }
#page-users.usr-gold-v2 .usr-ghost-btn{
  padding:9px 15px;background:var(--card);color:var(--text-light);border:1.5px solid var(--btn-border);
  border-radius:10px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;gap:6px;min-height:40px;
}
#page-users.usr-gold-v2 .usr-add-btn{
  padding:9px 16px;background:var(--nav-hover);color:var(--ok-text);border:1px solid var(--ok);border-radius:10px;
  font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;min-height:40px;
}


#page-users.usr-gold-v2 .usr-lang-card{
  background:var(--card2);border:1px solid var(--border);border-radius:16px;padding:16px 18px;margin-bottom:18px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
#page-users.usr-gold-v2 .usr-lang-title{ font-size:14px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:6px; }
#page-users.usr-gold-v2 .usr-lang-desc{ font-size:11px;color:var(--text-muted);margin-top:3px; }
#page-users.usr-gold-v2 .usr-lang-select{
  border:1px solid var(--btn-border);background:var(--card);color:var(--text);border-radius:10px;
  padding:8px 12px;font-size:12px;font-family:inherit;width:170px;
}


#page-users.usr-gold-v2 .usr-role-filter{ display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px; }
#page-users.usr-gold-v2 .usr-role-pill{
  background:var(--card);border:1.5px solid var(--btn-border);border-radius:999px;padding:8px 14px;
  font-size:12px;font-weight:700;color:var(--text-light);cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;gap:6px;
}
#page-users.usr-gold-v2 .usr-role-pill.active{ background:var(--nav-hover);border-color:var(--ok);color:var(--ok-text); }
#page-users.usr-gold-v2 .usr-role-pill .usr-role-count{ opacity:.75;font-weight:600; }


#page-users.usr-gold-v2 .usr-grid{ display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }
#page-users.usr-gold-v2 .usr-card{
  background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden;
  box-shadow:0 3px 10px var(--shadow);display:flex;flex-direction:column;transition:.15s;
}
#page-users.usr-gold-v2 .usr-card:hover{ border-color:var(--ok);box-shadow:0 5px 16px var(--shadow); }
#page-users.usr-gold-v2 .usr-card.is-inactive{ opacity:.7;box-shadow:none;border-color:var(--border); }


#page-users.usr-gold-v2 .usr-card-head{ background:var(--card2);padding:16px 16px 14px;border-bottom:1px solid var(--hairline);position:relative;display:flex;align-items:flex-start;gap:12px; }
#page-users.usr-gold-v2 .usr-avatar-wrap{ position:relative;flex-shrink:0; }
#page-users.usr-gold-v2 .usr-avatar{
  width:52px;height:52px;border-radius:50%;background:var(--avatar-bg);border:2px solid var(--border-gold);
  display:flex;align-items:center;justify-content:center;color:var(--gold-light);font-size:20px;font-weight:900;overflow:hidden;
}
#page-users.usr-gold-v2 .usr-avatar img{ width:100%;height:100%;object-fit:cover; }
#page-users.usr-gold-v2 .usr-avatar-cam{
  position:absolute;bottom:-2px;left:-2px;width:20px;height:20px;border-radius:50%;background:var(--card);
  display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--gold-light);
  box-shadow:0 2px 6px rgba(0,0,0,.2);border:1px solid var(--border-gold);
}
#page-users.usr-gold-v2 .usr-card-name-wrap{ flex:1;min-width:0; }
#page-users.usr-gold-v2 .usr-card-name{ font-size:15px;font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right; }
#page-users.usr-gold-v2 .usr-card-email{ font-size:11px;color:var(--ok-text);font-weight:600;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:right; }
#page-users.usr-gold-v2 .usr-card-position{ font-size:10px;color:var(--dim);margin-top:1px; }
#page-users.usr-gold-v2 .usr-role-badge{ font-size:11px;font-weight:800;padding:4px 10px;border-radius:10px;white-space:nowrap;flex-shrink:0; }
#page-users.usr-gold-v2 .usr-role-badge.is-admin{ background:var(--active-pill);color:var(--gold-light);border:1px solid var(--border-gold); }
#page-users.usr-gold-v2 .usr-role-badge:not(.is-admin){ background:var(--track);color:var(--text-muted); }

#page-users.usr-gold-v2 .usr-card-head:has(.usr-tag-self),
#page-users.usr-gold-v2 .usr-card-head:has(.usr-tag-inactive){ padding-top:30px; }
#page-users.usr-gold-v2 .usr-tag-self{ position:absolute;top:8px;left:10px;background:var(--track);color:var(--text-muted);border-radius:8px;padding:2px 8px;font-size:10px;font-weight:700;line-height:1.5;z-index:1; }
#page-users.usr-gold-v2 .usr-tag-inactive{ position:absolute;top:8px;left:10px;background:var(--acc-danger-bg);color:var(--acc-danger-text);border-radius:8px;padding:2px 8px;font-size:10px;font-weight:700;line-height:1.5;z-index:1; }


#page-users.usr-gold-v2 .usr-stats{ display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--hairline); }
#page-users.usr-gold-v2 .usr-stat{ padding:10px 14px;text-align:center; }
#page-users.usr-gold-v2 .usr-stat:first-child{ border-inline-end:1px solid var(--hairline); }
#page-users.usr-gold-v2 .usr-stat-value{ font-size:18px;font-weight:800;color:var(--text); }
#page-users.usr-gold-v2 .usr-stat-value .usr-stat-all{ color:var(--ok-text); }
#page-users.usr-gold-v2 .usr-stat-label{ font-size:10px;color:var(--text-muted);margin-top:1px; }


#page-users.usr-gold-v2 .usr-perms{ padding:10px 14px;flex:1;min-height:42px;border-bottom:1px solid var(--hairline); }
#page-users.usr-gold-v2 .usr-perm-chip{
  background:transparent;color:var(--ok-text);border:1px solid var(--ok);border-radius:8px;padding:4px 9px;font-size:11px;font-weight:600;
  display:inline-flex;align-items:center;gap:5px;
}
#page-users.usr-gold-v2 .usr-perms-empty{ font-size:11px;color:var(--dim); }


#page-users.usr-gold-v2 .usr-actions{ padding:10px 14px;display:flex;gap:5px;justify-content:flex-end;flex-wrap:wrap; }
#page-users.usr-gold-v2 .usr-action-btn{
  background:none;border:1px solid var(--btn-border);color:var(--text-light);border-radius:8px;padding:6px 11px;
  font-size:11.5px;font-weight:700;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:5px;
}
#page-users.usr-gold-v2 .usr-action-btn:hover{ border-color:var(--ok);color:var(--ok-text); }
#page-users.usr-gold-v2 .usr-action-btn.usr-delete:hover{ border-color:var(--acc-danger-text);color:var(--acc-danger-text);background:var(--acc-danger-bg); }

@media (max-width:768px){
  #page-users.usr-gold-v2 .usr-grid{ grid-template-columns:1fr; }
  #page-users.usr-gold-v2 .usr-role-filter{ flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px; }
  #page-users.usr-gold-v2 .usr-role-filter::-webkit-scrollbar{ display:none; }
  #page-users.usr-gold-v2 .usr-ghost-btn, #page-users.usr-gold-v2 .usr-add-btn{ min-height:42px; }
  #page-users.usr-gold-v2 .usr-add-btn{ width:100%;justify-content:center; }
}




#page-team-chat.tch-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong); --nav-hover:#E7E8F2;
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  --avatar-bg:linear-gradient(135deg,#e8d6a0,#c3a75e);
  --bubble-me:#E7E8F2; --bubble-other:#ffffff;
  --ok: var(--accent); --ok-text: var(--accent-text); --ok-bg: var(--accent-soft); --surface:#F7F8FF;
}
body.dark #page-team-chat.tch-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A; --nav-hover:#221f1a;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  --avatar-bg:linear-gradient(135deg,#4a3f22,#7a6534);
  --bubble-me:#221f1a; --bubble-other:#1b1815;
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --ok-bg: var(--accent-soft); --surface:#161411;
}

#page-team-chat.tch-gold-v2 .tch-wrap{ background:var(--bg); }


#page-team-chat.tch-gold-v2 .tch-sidebar{ background:var(--surface);border-inline-end:1px solid var(--hairline); }
#page-team-chat.tch-gold-v2 .tch-sidebar-head{ padding:14px 12px 10px;border-bottom:1px solid var(--hairline); }
#page-team-chat.tch-gold-v2 .tch-sidebar-title{ font-size:15px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:6px; }
#page-team-chat.tch-gold-v2 .tch-theme-btn{
  width:28px;height:28px;border-radius:8px;border:1px solid var(--btn-border);background:var(--card);
  color:var(--text-light);display:flex;align-items:center;justify-content:center;cursor:pointer;
}
#page-team-chat.tch-gold-v2 .tch-new-btn{
  width:30px;height:30px;border-radius:50%;border:1px solid var(--btn-border);background:transparent;color:var(--text-light);
  font-size:18px;font-weight:300;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;transition:.15s;
}
#page-team-chat.tch-gold-v2 .tch-new-btn:hover{ border-color:var(--ok);color:var(--ok-text); }
#page-team-chat.tch-gold-v2 .tch-search-wrap{ position:relative; }
#page-team-chat.tch-gold-v2 .tch-search-input{
  width:100%;padding:8px 34px 8px 12px;border:1.5px solid var(--btn-border);border-radius:999px;font-size:12px;
  font-family:inherit;outline:none;box-sizing:border-box;background:var(--card);color:var(--text);transition:.15s;
}
#page-team-chat.tch-gold-v2 .tch-search-input:focus{ border-color:var(--ok); }
#page-team-chat.tch-gold-v2 .tch-search-icon{ position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--text-muted);display:flex; }

#page-team-chat.tch-gold-v2 .tch-conv-item{
  display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:12px;cursor:pointer;
  background:transparent;border-inline-end:2px solid transparent;transition:.15s;margin-bottom:1px;
}
#page-team-chat.tch-gold-v2 .tch-conv-item:hover{ background:var(--nav-hover); }
#page-team-chat.tch-gold-v2 .tch-conv-item.active{ background:var(--nav-hover);border-inline-end-color:var(--text);font-weight:800; }
#page-team-chat.tch-gold-v2 .tch-conv-avatar-wrap{ position:relative;flex-shrink:0; }
#page-team-chat.tch-gold-v2 .tch-conv-avatar{
  width:44px;height:44px;border-radius:50%;background:var(--avatar-bg);color:var(--gold-light);
  font-size:16px;font-weight:800;display:flex;align-items:center;justify-content:center;overflow:hidden;
}
#page-team-chat.tch-gold-v2 .tch-conv-avatar img{ width:100%;height:100%;object-fit:cover; }
#page-team-chat.tch-gold-v2 .tch-online-dot{ position:absolute;bottom:1px;right:1px;width:11px;height:11px;background:var(--ok);border-radius:50%;border:2px solid var(--surface);display:block; }
#page-team-chat.tch-gold-v2 .tch-conv-name{ font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:140px;direction:ltr;text-align:right; }
#page-team-chat.tch-gold-v2 .tch-conv-time{ font-size:10px;color:var(--text-muted);flex-shrink:0; }
#page-team-chat.tch-gold-v2 .tch-conv-sub{ font-size:11.5px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px; }
#page-team-chat.tch-gold-v2 .tch-unread-badge{
  background:var(--ok-bg);color:var(--ok-text);font-size:9px;font-weight:900;min-width:18px;height:18px;padding:0 4px;
  border-radius:99px;display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
#page-team-chat.tch-gold-v2 .tch-sidebar-me{ padding:10px 12px;border-top:1px solid var(--hairline);background:var(--card); }
#page-team-chat.tch-gold-v2 .tch-sidebar-empty{ text-align:center;padding:40px 16px;color:var(--text-muted); }


#page-team-chat.tch-gold-v2 .tch-chat-empty{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--bg);gap:10px;color:var(--text-muted);position:relative;
}
#page-team-chat.tch-gold-v2 .tch-chat-empty .glux-empty-dandelion{ width:110px;height:auto; }
#page-team-chat.tch-gold-v2 .tch-back-btn{
  position:absolute;top:10px;right:10px;background:var(--card);border:1px solid var(--btn-border);border-radius:8px;
  padding:6px 10px;cursor:pointer;font-family:inherit;font-size:12px;font-weight:700;color:var(--text-light);
}
#page-team-chat.tch-gold-v2 .tch-chat-head{
  padding:12px 14px;border-bottom:1px solid var(--hairline);background:var(--surface);display:flex;align-items:center;gap:10px;flex-shrink:0;
}
#page-team-chat.tch-gold-v2 .tch-chat-head-name{ font-size:14px;font-weight:800;color:var(--text); }
#page-team-chat.tch-gold-v2 .tch-chat-head-status{ font-size:11px;color:var(--ok-text);font-weight:600;display:flex;align-items:center;gap:3px; }
#page-team-chat.tch-gold-v2 .tch-search-in-chat{
  margin-inline-start:auto;background:none;border:1px solid var(--btn-border);color:var(--text-light);
  border-radius:8px;padding:6px 12px;font-size:11.5px;font-weight:700;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;gap:5px;
}
#page-team-chat.tch-gold-v2 .tch-messages{ flex:1;overflow-y:auto;overflow-x:hidden;padding:18px 18px 10px;display:flex;flex-direction:column;gap:6px;min-height:0;background:var(--bg); }
#page-team-chat.tch-gold-v2 .tch-date-divider{ text-align:center;margin:8px 0; }
#page-team-chat.tch-gold-v2 .tch-date-divider span{ background:var(--track);color:var(--text-muted);font-size:10.5px;font-weight:700;padding:3px 12px;border-radius:999px; }


#page-team-chat.tch-gold-v2 .tch-bubble-row{ display:flex;flex-direction:column;gap:2px;margin-bottom:8px;min-width:0;max-width:100%; }
#page-team-chat.tch-gold-v2 .tch-bubble-row.is-me{ align-items:flex-start; }
#page-team-chat.tch-gold-v2 .tch-bubble-row.is-other{ align-items:flex-end; }
#page-team-chat.tch-gold-v2 .tch-bubble-sender{ font-size:10px;font-weight:700;color:var(--text-muted);margin-bottom:3px; }
/* max-width lives here, on the flex ROW itself (a direct child of .tch-bubble-row, which has a
   well-defined width) - not on .tch-bubble, which sits inside an unclassed wrapper <div> whose
   own width is flex-computed and not a reliable percentage base. */
#page-team-chat.tch-gold-v2 .tch-bubble-inner{ display:flex;align-items:flex-end;gap:7px;max-width:60%; }
#page-team-chat.tch-gold-v2 .tch-bubble-inner.is-me{ flex-direction:row; }
#page-team-chat.tch-gold-v2 .tch-bubble-inner.is-other{ flex-direction:row-reverse; }
/* The bubble text + meta live in an unclassed <div> that is itself a flex item here - flex items
   default to min-width:auto, so without this they refuse to shrink below their content's
   unwrapped width (one long word/URL), and no max-width upstream can prevent the overflow this
   causes. This is the actual fix for text escaping the bubble background. */
#page-team-chat.tch-gold-v2 .tch-bubble-inner > div{ min-width:0;max-width:100%; }
#page-team-chat.tch-gold-v2 .tch-bubble{
  max-width:100%;padding:10px 14px;font-size:13px;line-height:1.6;box-shadow:0 1px 4px rgba(0,0,0,.06);
  white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;box-sizing:border-box;
}
#page-team-chat.tch-gold-v2 .tch-bubble.is-me{ background:var(--nav-hover);color:var(--text);border:1px solid var(--btn-border);border-radius:4px 16px 16px 16px; }
#page-team-chat.tch-gold-v2 .tch-bubble.is-other{ background:var(--bubble-other);color:var(--text);border:1px solid var(--border);border-radius:16px 4px 16px 16px; }
#page-team-chat.tch-gold-v2 .tch-bubble-meta{ font-size:9.5px;color:var(--text-muted);margin-top:3px;display:flex;align-items:center;gap:4px; }
#page-team-chat.tch-gold-v2 .tch-bubble-meta.is-me{ justify-content:flex-start; }
#page-team-chat.tch-gold-v2 .tch-bubble-meta.is-other{ justify-content:flex-end; }
#page-team-chat.tch-gold-v2 .tch-seen-check{ color:var(--ok-text); }


#page-team-chat.tch-gold-v2 .tch-input-bar{ padding:14px 16px;border-top:1px solid var(--hairline);background:var(--card); }
#page-team-chat.tch-gold-v2 .tch-input-row{ display:flex;align-items:flex-end;gap:10px; }
#page-team-chat.tch-gold-v2 .tch-attach-btn{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--btn-border);background:var(--card);
  color:var(--text-light);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
}
#page-team-chat.tch-gold-v2 .tch-input-box{
  flex:1;background:var(--bg);border:1.5px solid var(--btn-border);border-radius:20px;padding:9px 16px;transition:.15s;
}
#page-team-chat.tch-gold-v2 .tch-input-box textarea{
  width:100%;background:none;border:none;outline:none;font-family:inherit;font-size:13px;color:var(--text);resize:none;line-height:1.5;
}
#page-team-chat.tch-gold-v2 .tch-send-btn{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--ok);background:var(--nav-hover);color:var(--ok-text);
  display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
}

@media (max-width:768px){
  #page-team-chat.tch-gold-v2 .tch-sidebar{ width:100% !important; }
  #page-team-chat.tch-gold-v2 .tch-conv-avatar{ width:48px;height:48px; }
  #page-team-chat.tch-gold-v2 .tch-conv-item{ min-height:64px; }
  #page-team-chat.tch-gold-v2 .tch-bubble-inner{ max-width:80%; }
}




#page-customers.crm-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --col-bg:#efe9da; --btn-border:var(--border-strong); --nav-hover:#E7E8F2;
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  --acc-danger-text:#DC2626; --acc-danger-bg:rgba(220,38,38,.08);
  --ok: var(--accent); --ok-text: var(--accent-text); --warn-text: var(--warning);
  
  --stage-qual:#5a7d33; --stage-contacted:#6B7280; --stage-visit:#2f6f9f;
  --stage-negotiate:#c2740f; --stage-won:#3f8f5f; --stage-lost:#8a8370;
}
body.dark #page-customers.crm-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --col-bg:#181923; --btn-border:#2F303A; --nav-hover:#221f1a;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  --acc-danger-text:#F87171; --acc-danger-bg:rgba(239,68,68,.14);
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --warn-text: var(--warning);
  --stage-qual:var(--neutral-accent); --stage-contacted:#B4B4B4; --stage-visit:#6ba7d8;
  --stage-negotiate:#e0a758; --stage-won:#8fd0a4; --stage-lost:#948d7a;
}

#page-customers.crm-gold-v2 .crm-summary-line{ font-size:12.5px;color:var(--text-light);margin:2px 0 14px; }


#page-customers.crm-gold-v2 .crm-headbar{ display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px; }
#page-customers.crm-gold-v2 .crm-headbar h2{ margin:0;font-size:20px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px; }
#page-customers.crm-gold-v2 .crm-headbar h2 b{ font-weight:300; }
#page-customers.crm-gold-v2 .crm-headbar-sub{ font-size:12px;color:var(--text-muted);margin-top:3px; }
#page-customers.crm-gold-v2 .crm-head-actions{ display:flex;gap:8px;align-items:center;flex-wrap:wrap; }
#page-customers.crm-gold-v2 .crm-theme-btn{
  width:36px;height:36px;border-radius:10px;border:1.5px solid var(--btn-border);background:var(--card);
  color:var(--text-light);display:flex;align-items:center;justify-content:center;cursor:pointer;
}
#page-customers.crm-gold-v2 .crm-view-switch{ display:flex;border:1.5px solid var(--btn-border);border-radius:10px;overflow:hidden;background:var(--card); }
#page-customers.crm-gold-v2 .crm-view-btn{
  padding:8px 14px;font-size:12px;font-weight:700;border:none;background:transparent;color:var(--text-muted);
  cursor:pointer;font-family:inherit;transition:.15s;display:flex;align-items:center;gap:6px;
}
#page-customers.crm-gold-v2 .crm-view-btn.active{ background:var(--nav-hover);color:var(--text);font-weight:800; }

#page-customers.crm-gold-v2 .crm-add-btn,
#page-deals.crm-gold-v2 .crm-add-btn{
  padding:9px 16px;background:var(--nav-hover);color:var(--ok-text);border:1px solid var(--ok);border-radius:10px;
  font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;
}


#page-customers.crm-gold-v2 .crm-funnel-card{ background:var(--card2);border:1px solid var(--border);border-radius:14px;padding:14px 16px;margin-bottom:14px; }
#page-customers.crm-gold-v2 .crm-funnel-bar{ display:flex;gap:0;overflow:hidden;border-radius:6px;margin-bottom:10px; }
#page-customers.crm-gold-v2 .crm-legend-row{ display:flex;flex-wrap:wrap;gap:6px;align-items:center; }
#page-customers.crm-gold-v2 .crm-legend-pill{
  display:flex;align-items:center;gap:5px;padding:4px 10px;background:var(--track);border:1.5px solid var(--border);
  border-radius:20px;cursor:pointer;font-family:inherit;
}
#page-customers.crm-gold-v2 .crm-legend-pill.active{ background:var(--nav-hover);border-color:var(--btn-border); }
#page-customers.crm-gold-v2 .crm-legend-dot{ width:7px;height:7px;border-radius:50%;flex-shrink:0; }
#page-customers.crm-gold-v2 .crm-legend-lost{
  padding:4px 10px;background:var(--acc-danger-bg);border:1.5px solid var(--acc-danger-text);border-radius:20px;
  cursor:pointer;font-size:11px;font-weight:700;color:var(--acc-danger-text);display:flex;align-items:center;gap:4px;
}


#page-customers.crm-gold-v2 .crm-filter-bar{
  background:var(--card);border:1px solid var(--border);border-radius:12px;padding:10px 14px;margin-bottom:12px;
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
}
#page-customers.crm-gold-v2 .crm-filter-bar input,
#page-customers.crm-gold-v2 .crm-filter-bar select{
  border:1px solid var(--btn-border);background:var(--card);color:var(--text);border-radius:8px;
  padding:8px 12px;font-size:12px;font-family:inherit;
}
#page-customers.crm-gold-v2 .crm-filter-bar input{ padding-inline-end:32px; }
#page-customers.crm-gold-v2 .crm-reset-btn{
  padding:7px 12px;background:var(--acc-danger-bg);color:var(--acc-danger-text);border:1.5px solid var(--acc-danger-text);
  border-radius:8px;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap;
  display:flex;align-items:center;gap:4px;
}


#page-customers.crm-gold-v2 .crm-kanban-grid{ display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px; }
#page-customers.crm-gold-v2 .crm-kcol{ display:flex;flex-direction:column;min-width:0; }
#page-customers.crm-gold-v2 .crm-kcol-head{
  border-radius:12px 12px 0 0;padding:10px 12px;display:flex;align-items:center;gap:7px;
  background:var(--track);border:1.5px solid var(--border);border-bottom:2px solid var(--stage-c,var(--btn-border));
}
#page-customers.crm-gold-v2 .crm-kcol-dot{ width:8px;height:8px;border-radius:50%;background:var(--stage-c);flex-shrink:0; }
#page-customers.crm-gold-v2 .crm-kcol-name{ flex:1;font-size:11.5px;font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
#page-customers.crm-gold-v2 .crm-kcol-count{ background:var(--stage-c);color:#fff;border-radius:20px;padding:1px 8px;font-size:10.5px;font-weight:700; }
#page-customers.crm-gold-v2 .crm-kcol-budget{
  background:var(--col-bg);border:1.5px solid var(--border);border-top:none;padding:4px 12px;font-size:10px;
  color:var(--text-muted);font-weight:600;display:flex;align-items:center;gap:4px;
}
#page-customers.crm-gold-v2 .crm-kcol-drop{
  flex:1;background:var(--col-bg);border:1.5px solid var(--border);border-top:none;border-radius:0 0 12px 12px;
  padding:8px;min-height:120px;max-height:560px;overflow-y:auto;transition:background .15s,border-color .15s;
}
#page-customers.crm-gold-v2 .crm-kcol-drop.drag-over{ background:var(--nav-hover);border-color:var(--ok); }
#page-customers.crm-gold-v2 .crm-kcol-empty{
  border:1.5px dashed var(--btn-border);border-radius:10px;padding:22px 10px;text-align:center;color:var(--text-muted);
}
#page-customers.crm-gold-v2 .crm-kcol-empty .glux-empty-dandelion{ width:56px;height:auto;margin:0 auto 6px;display:block; }
#page-customers.crm-gold-v2 .crm-kcol-empty-text{ font-size:11px; }
#page-customers.crm-gold-v2 .crm-add-lead-ghost{
  width:100%;background:none;border:1.5px dashed var(--btn-border);border-radius:8px;padding:8px;font-size:11px;
  font-weight:700;color:var(--text-muted);cursor:pointer;font-family:inherit;margin-top:6px;transition:.15s;
}
#page-customers.crm-gold-v2 .crm-add-lead-ghost:hover{ border-color:var(--ok);color:var(--ok-text); }


#page-customers.crm-gold-v2 .crm-lead-card{
  background:var(--card);border:1px solid var(--border);border-radius:12px;padding:11px 12px;margin-bottom:8px;
  cursor:grab;user-select:none;transition:box-shadow .15s,border-color .15s;box-shadow:0 1px 3px rgba(0,0,0,.04);
}
#page-customers.crm-gold-v2 .crm-lead-card:hover{ border-color:var(--ok); }
#page-customers.crm-gold-v2 .crm-lead-card.is-stale{ border-color:var(--acc-danger-text); }
#page-customers.crm-gold-v2 .crm-lead-avatar{
  width:28px;height:28px;border-radius:50%;background:var(--stage-c);display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:12px;font-weight:800;flex-shrink:0;
}
#page-customers.crm-gold-v2 .crm-lead-name{ font-size:12px;font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:4px; }
#page-customers.crm-gold-v2 .crm-lead-phone{ font-size:10px;color:var(--text-muted);direction:ltr;text-align:right; }
#page-customers.crm-gold-v2 .crm-chip{
  font-size:10px;background:var(--track);color:var(--text-muted);padding:1px 6px;border-radius:5px;
  display:inline-flex;align-items:center;gap:3px;
}
#page-customers.crm-gold-v2 .crm-chip-budget{ background:var(--nav-hover);color:var(--ok-text);font-weight:700; }
#page-customers.crm-gold-v2 .crm-lead-prop-link{ font-size:10px;color:var(--ok-text);font-weight:600;margin-bottom:4px;display:flex;align-items:center;gap:4px; }
#page-customers.crm-gold-v2 .crm-lead-followup{ font-size:10px;margin-bottom:4px;display:flex;align-items:center;gap:4px; }
#page-customers.crm-gold-v2 .crm-lead-followup.past{ color:var(--acc-danger-text); }
#page-customers.crm-gold-v2 .crm-lead-followup.upcoming{ color:var(--warn-text); }
#page-customers.crm-gold-v2 .crm-lead-foot{ border-top:1px solid var(--hairline);margin-top:7px;padding-top:6px;display:flex;align-items:center;justify-content:space-between; }
#page-customers.crm-gold-v2 .crm-lead-stale{ font-size:10px;display:inline-flex;align-items:center;gap:4px; }
#page-customers.crm-gold-v2 .crm-lead-stale.is-stale{ color:var(--acc-danger-text); }
#page-customers.crm-gold-v2 .crm-lead-stale:not(.is-stale){ color:var(--text-muted); }
#page-customers.crm-gold-v2 .crm-lead-actions{ display:flex;gap:3px; }
#page-customers.crm-gold-v2 .crm-icon-btn{
  width:24px;height:24px;border-radius:50%;border:1px solid var(--btn-border);background:transparent;
  cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-muted);transition:.15s;
}
#page-customers.crm-gold-v2 .crm-icon-btn:hover{ border-color:var(--ok);color:var(--ok-text); }


#page-customers.crm-gold-v2 .crm-table-wrap{ background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden; }
#page-customers.crm-gold-v2 table{ width:100%;border-collapse:collapse; }
#page-customers.crm-gold-v2 th{ padding:10px 12px;font-size:11px;font-weight:700;color:var(--text-muted);text-align:end;background:var(--track);border-bottom:1.5px solid var(--hairline); }
#page-customers.crm-gold-v2 td{ padding:10px 12px;border-bottom:1px solid var(--hairline);font-size:12px;color:var(--text); }
#page-customers.crm-gold-v2 tr.crm-row:hover td{ background:var(--active-pill); }
#page-customers.crm-gold-v2 .crm-status-pill{ border-radius:20px;padding:2px 10px;font-size:11px;font-weight:700;white-space:nowrap;background:color-mix(in srgb, var(--stage-c) 16%, transparent);color:var(--stage-c);border:1px solid color-mix(in srgb, var(--stage-c) 32%, transparent); }
#page-customers.crm-gold-v2 .crm-showmore-btn{
  background:var(--track);border:1.5px solid var(--btn-border);border-radius:10px;padding:8px 24px;font-size:12px;
  font-weight:700;color:var(--text-light);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;
}
#page-customers.crm-gold-v2 .crm-showmore-btn:hover{ border-color:var(--ok);color:var(--ok-text); }


#page-customers.crm-gold-v2 .crm-mobile-chiprow{ display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;margin-bottom:12px; }
#page-customers.crm-gold-v2 .crm-mobile-chiprow::-webkit-scrollbar{ display:none; }
#page-customers.crm-gold-v2 .crm-mobile-chip{
  flex-shrink:0;display:flex;align-items:center;gap:5px;padding:7px 12px;border-radius:999px;
  background:var(--track);border:1.5px solid var(--border);color:var(--text-light);font-size:11.5px;font-weight:700;
  cursor:pointer;font-family:inherit;white-space:nowrap;
}
#page-customers.crm-gold-v2 .crm-mobile-chip.active{ background:var(--nav-hover);border-color:var(--btn-border);color:var(--text);font-weight:800; }
#page-customers.crm-gold-v2 .crm-mobile-card{
  background:var(--card);border:1px solid var(--border);border-inline-end:2px solid var(--stage-c);border-radius:12px;
  padding:12px 14px;margin-bottom:10px;
}
#page-customers.crm-gold-v2 .crm-mobile-card-top{ display:flex;align-items:center;gap:10px;margin-bottom:6px; }
#page-customers.crm-gold-v2 .crm-mobile-actions{ display:flex;gap:6px;margin-top:8px; }
#page-customers.crm-gold-v2 .crm-mobile-act-btn{
  flex:1;min-height:34px;border-radius:8px;border:1px solid var(--btn-border);background:var(--card);
  color:var(--text-light);display:flex;align-items:center;justify-content:center;gap:5px;font-size:11.5px;font-weight:700;
  cursor:pointer;font-family:inherit;
}

@media (max-width:900px){
  #page-customers.crm-gold-v2 .crm-kanban-grid{ display:none; }
}
@media (max-width:768px){
  #page-customers.crm-gold-v2 .crm-add-btn{ width:100%;justify-content:center; }
  #page-customers.crm-gold-v2 .crm-filter-bar{ flex-direction:column;align-items:stretch; }
  #page-customers.crm-gold-v2 .crm-filter-bar input, #page-customers.crm-gold-v2 .crm-filter-bar select{ width:100%; }
}





#page-customers.crm-gold-v2 .crm-quick-add-btn{
  padding:9px 16px;background:var(--card);color:var(--gold);border:1px solid var(--border-gold);border-radius:10px;
  font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:6px;
  transition:.15s;
}
#page-customers.crm-gold-v2 .crm-quick-add-btn:hover{ background:var(--active-pill); }


.ql-searchbox{ position:relative; display:flex; align-items:center; margin-top:2px; }
.ql-searchbox-icon{ position:absolute; right:14px; color:var(--text-muted); pointer-events:none; transition:color .15s ease; }
.ql-searchbox-input{
  width:100%; height:42px; border:1.5px solid var(--border); border-radius:999px;
  padding:0 42px 0 14px; font-size:13px; background:var(--surface-muted); color:var(--text);
  outline:none; transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;
}
.ql-searchbox-input::placeholder{ color:var(--text-muted); }
.ql-searchbox-input:hover{ border-color:var(--primary); }
.ql-searchbox-input:focus{
  background:var(--card); border-color:var(--primary);
  box-shadow:0 0 0 4px var(--primary-light), 0 0 12px var(--primary-glass);
}
.ql-searchbox:focus-within .ql-searchbox-icon{ color:var(--primary); }

#ql-results{ margin-top:6px; }
#ql-results.has-results{
  border:1px solid var(--border); border-radius:10px; overflow-y:auto; max-height:180px;
}
.ql-result-item{ padding:9px 12px; cursor:pointer; border-bottom:1px solid var(--border-light); transition:background .12s; }
.ql-result-item:last-child{ border-bottom:none; }
.ql-result-item:hover{ background:var(--surface-muted); }
.ql-result-name{ font-size:13px; font-weight:700; color:var(--text); }
.ql-result-meta{ font-size:11.5px; color:var(--text-muted); margin-top:2px; }
.ql-empty{ padding:10px 12px; font-size:12px; color:var(--text-muted); }

.ql-divider{ display:flex; align-items:center; gap:10px; margin:16px 0 12px; color:var(--text-muted); font-size:11.5px; font-weight:700; }
.ql-divider::before,.ql-divider::after{ content:''; flex:1; height:1px; background:var(--border); }

@media(max-width:640px){
  .ql-searchbox-input{ font-size:12.5px; }
}




#small-modal.adv-modal-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  --danger-text:#DC2626;
  --ok: var(--accent); --ok-text: var(--accent-text); --ok-glow: var(--accent-soft); --nav-hover:#E7E8F2;
  background:rgba(41,34,20,.45);
}
body.dark #small-modal.adv-modal-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  --danger-text:#F87171;
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --ok-glow: var(--accent-soft); --nav-hover:#221f1a;
  background:rgba(0,0,0,.6);
}

#small-modal.adv-modal-gold-v2 .modal{
  background:var(--card2);border:1px solid var(--border);box-shadow:0 24px 60px var(--shadow);
}
#small-modal.adv-modal-gold-v2 .modal-header{ border-bottom:1px solid var(--hairline); }
#small-modal.adv-modal-gold-v2 .modal-title{ color:var(--text);display:flex;align-items:center;gap:8px; }
#small-modal.adv-modal-gold-v2 .modal-close{
  color:var(--text-light);border:1px solid var(--btn-border);border-radius:50%;width:30px;height:30px;
}
#small-modal.adv-modal-gold-v2 .modal-close:hover{ background:var(--track);color:var(--text); }
#small-modal.adv-modal-gold-v2 .modal-footer{ background:var(--card2);border-top:1px solid var(--hairline); }

#small-modal.adv-modal-gold-v2 .form-label{ color:var(--text-light);font-weight:700;font-size:12px;margin-bottom:6px;display:block; }
#small-modal.adv-modal-gold-v2 .form-control{
  background:var(--card);color:var(--text);border:1.5px solid var(--btn-border);border-radius:10px;
  padding:9px 12px;font-size:13px;font-family:inherit;width:100%;min-height:40px;transition:.15s;
}
#small-modal.adv-modal-gold-v2 .form-control:focus{ outline:none;border-color:var(--ok);box-shadow:0 0 0 3px var(--ok-glow); }
#small-modal.adv-modal-gold-v2 textarea.form-control{ min-height:unset;resize:vertical; }
#small-modal.adv-modal-gold-v2 #ag-phone,
#small-modal.adv-modal-gold-v2 #ag-phone2,
#small-modal.adv-modal-gold-v2 #ag-email{ direction:ltr;text-align:right; }

#small-modal.adv-modal-gold-v2 .btn-ghost{
  background:var(--card);color:var(--text-light);border:1.5px solid var(--btn-border);border-radius:10px;
  font-weight:700;min-height:40px;
}
#small-modal.adv-modal-gold-v2 .btn-primary{
  background:var(--nav-hover);color:var(--ok-text);border:1px solid var(--ok);border-radius:10px;font-weight:800;min-height:40px;
}

@media (max-width:768px){
  #small-modal.adv-modal-gold-v2 .modal{ max-width:100%;width:100%;height:100%;max-height:100%;border-radius:0; }
  #small-modal.adv-modal-gold-v2 .modal-footer{
    position:sticky;bottom:0;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));
  }
  #small-modal.adv-modal-gold-v2 .form-control,
  #small-modal.adv-modal-gold-v2 .btn-ghost,
  #small-modal.adv-modal-gold-v2 .btn-primary{ min-height:44px; }
}




#page-customers.crm-gold-v2 .crm-mode-chips{ display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px; }
#page-customers.crm-gold-v2 .crm-mode-chip,
#page-deals.crm-gold-v2 .crm-mode-chip{
  display:inline-flex;align-items:center;gap:6px;background:var(--card);border:1.5px solid var(--btn-border);
  color:var(--text-muted);border-radius:20px;padding:6px 13px;font-size:12px;font-weight:700;cursor:pointer;
  font-family:inherit;transition:.15s;
}
#page-customers.crm-gold-v2 .crm-mode-chip span,
#page-deals.crm-gold-v2 .crm-mode-chip span{
  background:var(--track);color:var(--text-muted);border-radius:20px;padding:0 7px;font-size:10.5px;font-weight:800;
}
#page-customers.crm-gold-v2 .crm-mode-chip:hover{ border-color:var(--gold); color:var(--text); }
#page-customers.crm-gold-v2 .crm-mode-chip.active,
#page-deals.crm-gold-v2 .crm-mode-chip.active{
  background:var(--active-pill);border-color:var(--border-gold);color:var(--gold-light);
}
#page-customers.crm-gold-v2 .crm-mode-chip.active span{ background:var(--card);color:var(--gold-light); }

#page-customers.crm-gold-v2 .crm-ll-bulkbar,
#page-deals.crm-gold-v2 .crm-ll-bulkbar{
  display:flex;align-items:center;gap:10px;background:var(--active-pill);border:1px solid var(--border-gold);
  border-radius:12px;padding:9px 14px;margin-bottom:10px;font-size:12.5px;font-weight:700;color:var(--gold-light);
}
#page-customers.crm-gold-v2 .crm-ll-bulk-clear,
#page-customers.crm-gold-v2 .crm-ll-bulk-del,
#page-deals.crm-gold-v2 .crm-ll-bulk-del{
  display:inline-flex;align-items:center;gap:5px;border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;
  cursor:pointer;font-family:inherit;border:1.5px solid var(--btn-border);background:var(--card);color:var(--text-muted);
}
#page-customers.crm-gold-v2 .crm-ll-bulk-clear{ margin-right:auto; }
#page-customers.crm-gold-v2 .crm-ll-bulk-del{ border-color:var(--acc-danger-text);color:var(--acc-danger-text); }
#page-customers.crm-gold-v2 .crm-ll-bulk-del:hover{ background:var(--acc-danger-bg); }

#page-customers.crm-gold-v2 .crm-ll-wrap,
#page-deals.crm-gold-v2 .crm-ll-wrap{ background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:auto; }
#page-customers.crm-gold-v2 .crm-ll-table,
#page-deals.crm-gold-v2 .crm-ll-table{ width:100%;border-collapse:collapse; }
#page-customers.crm-gold-v2 .crm-ll-table thead th,
#page-deals.crm-gold-v2 .crm-ll-table thead th{
  position:sticky;top:0;background:var(--track);border-bottom:1.5px solid var(--border-gold);
  font-size:10.5px;font-weight:800;color:var(--text-muted);letter-spacing:.03em;text-align:end;
  padding:11px 12px;z-index:2;white-space:nowrap;
}
#page-customers.crm-gold-v2 .crm-ll-table td,
#page-deals.crm-gold-v2 .crm-ll-table td{ padding:10px 12px;border-bottom:1px solid var(--hairline);font-size:12.5px;vertical-align:middle; }
#page-customers.crm-gold-v2 .crm-ll-row:hover td,
#page-deals.crm-gold-v2 .crm-ll-row:hover td{ background:var(--active-pill); }
#page-customers.crm-gold-v2 .crm-ll-row.is-sel td,
#page-deals.crm-gold-v2 .crm-ll-row.is-sel td{ background:color-mix(in srgb, var(--gold) 8%, transparent); }
#page-customers.crm-gold-v2 .crm-ll-table input[type=checkbox],
#page-deals.crm-gold-v2 .crm-ll-table input[type=checkbox]{ accent-color:var(--gold);width:14px;height:14px;cursor:pointer; }

#page-customers.crm-gold-v2 .crm-ll-pill,
#page-deals.crm-gold-v2 .crm-ll-pill{
  display:inline-block;background:var(--card);border:1px solid var(--border);color:var(--text-muted);
  border-radius:20px;padding:3px 11px;font-size:11px;white-space:nowrap;
}
#page-customers.crm-gold-v2 .crm-ll-pill-dim{ color:var(--dim); }

#page-customers.crm-gold-v2 .crm-ll-phone-cell{ display:flex;align-items:center;gap:8px;direction:ltr;justify-content:flex-end;font-size:12px;color:var(--text-muted); }
#page-customers.crm-gold-v2 .crm-ll-wa-btn,
#page-deals.crm-gold-v2 .crm-ll-wa-btn{
  background:rgba(90,125,51,.1);border:1px solid var(--ok);color:var(--ok-text);border-radius:20px;
  padding:3px 11px;font-family:inherit;font-size:10.5px;font-weight:700;cursor:pointer;flex-shrink:0;
}
#page-customers.crm-gold-v2 .crm-ll-wa-btn:hover{ background:var(--ok);color:#fff; }
#page-customers.crm-gold-v2 .crm-ll-call-ic{ color:var(--gold);display:flex;align-items:center; }

#page-customers.crm-gold-v2 .crm-ll-avatar,
#page-deals.crm-gold-v2 .crm-ll-avatar{
  width:24px;height:24px;border-radius:50%;background:var(--gold-grad);color:var(--text);display:flex;align-items:center;
  justify-content:center;font-size:9.5px;font-weight:800;flex-shrink:0;
}
#page-customers.crm-gold-v2 .crm-ll-resp{ display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;white-space:nowrap; }
#page-customers.crm-gold-v2 .crm-ll-dot{ width:6px;height:6px;border-radius:50%;flex-shrink:0; }

#page-customers.crm-gold-v2 .crm-ll-foot,
#page-deals.crm-gold-v2 .crm-ll-foot{
  display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--border);
  font-size:11.5px;color:var(--text-muted);
}
#page-customers.crm-gold-v2 .crm-ll-foot b{ color:var(--text); }

@media(max-width:900px){
  #page-customers.crm-gold-v2 .crm-ll-table,
  #page-deals.crm-gold-v2 .crm-ll-table{ min-width:820px; }
}




#page-customers.crm-gold-v2 .crm-dl-head,
#page-deals.crm-gold-v2 .crm-dl-head{
  display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap;
}
#page-customers.crm-gold-v2 .crm-dl-title{ display:flex;align-items:baseline;gap:9px;flex-shrink:0; }
#page-customers.crm-gold-v2 .crm-dl-title h2,
#page-deals.crm-gold-v2 .crm-dl-title h2{
  margin:0;font-size:19px;font-weight:800;color:var(--text);letter-spacing:-.01em;
}
#page-customers.crm-gold-v2 .crm-dl-count{ font-size:11.5px;color:var(--text-muted);white-space:nowrap; }
#page-customers.crm-gold-v2 .crm-dl-search{ position:relative;flex:1;min-width:180px;max-width:420px; }
#page-customers.crm-gold-v2 .crm-dl-search-ic,
#page-deals.crm-gold-v2 .crm-dl-search-ic{
  position:absolute;top:50%;transform:translateY(-50%);inset-inline-start:12px;
  color:var(--text-muted);pointer-events:none;display:flex;
}
#page-customers.crm-gold-v2 .crm-dl-search input,
#page-deals.crm-gold-v2 .crm-dl-search input{
  width:100%;box-sizing:border-box;height:38px;padding-inline-start:34px;padding-inline-end:12px;
  background:var(--card);border:1px solid var(--border);border-radius:99px;
  color:var(--text);font-size:12.5px;font-family:inherit;outline:none;transition:.15s;
}
#page-customers.crm-gold-v2 .crm-dl-search input:focus{ border-color:var(--border-gold); }


#page-customers.crm-gold-v2 .crm-dl-bar,
#page-deals.crm-gold-v2 .crm-dl-bar{
  display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap;
}
#page-customers.crm-gold-v2 .crm-dl-chips{ display:flex;align-items:center;gap:7px;flex-wrap:wrap;flex:1;min-width:0; }
#page-customers.crm-gold-v2 .crm-dl-controls{ display:flex;align-items:center;gap:7px;flex-wrap:wrap; }
#page-customers.crm-gold-v2 .crm-dl-chip,
#page-deals.crm-gold-v2 .crm-dl-chip{
  display:inline-flex;align-items:center;gap:6px;
  background:var(--card);border:1px solid var(--border);border-radius:99px;
  padding:6px 13px;font-size:11.5px;font-weight:600;color:var(--text-light);
  cursor:pointer;font-family:inherit;transition:.15s;white-space:nowrap;
}
#page-customers.crm-gold-v2 .crm-dl-chip:hover{ border-color:var(--stage-c,var(--border-gold)); }
#page-customers.crm-gold-v2 .crm-dl-chip.active,
#page-deals.crm-gold-v2 .crm-dl-chip.active{
  border-color:var(--stage-c);color:var(--stage-c);
  background:color-mix(in srgb, var(--stage-c) 12%, transparent);
}
#page-customers.crm-gold-v2 .crm-dl-chip-n{ font-weight:800;color:var(--stage-c); }

#page-customers.crm-gold-v2 .crm-dl-chip.is-mode,
#page-deals.crm-gold-v2 .crm-dl-chip.is-mode{
  border-color:var(--border-gold);color:var(--gold-light);
  background:color-mix(in srgb, var(--gold) 12%, transparent);
}
#page-customers.crm-gold-v2 .crm-dl-select,
#page-deals.crm-gold-v2 .crm-dl-select{
  height:34px;background:var(--card);border:1px solid var(--border);border-radius:9px;
  color:var(--text-light);font-size:11.5px;font-family:inherit;padding:0 10px;cursor:pointer;outline:none;
}
#page-customers.crm-gold-v2 .crm-dl-select:focus{ border-color:var(--border-gold); }


#page-customers.crm-gold-v2 .crm-dl-table td{ padding:12px 14px; }
#page-customers.crm-gold-v2 .crm-dl-name,
#page-deals.crm-gold-v2 .crm-dl-name{
  display:flex;align-items:center;gap:5px;
  font-size:13px;font-weight:700;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#page-customers.crm-gold-v2 .crm-dl-owner{ display:flex;align-items:center;gap:7px;min-width:0; }
#page-customers.crm-gold-v2 .crm-dl-owner span:last-child,
#page-deals.crm-gold-v2 .crm-dl-owner span:last-child{
  font-size:12px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#page-customers.crm-gold-v2 .crm-dl-contact{ display:flex;align-items:center;gap:8px;min-width:0; }
#page-customers.crm-gold-v2 .crm-dl-contact-name,
#page-deals.crm-gold-v2 .crm-dl-contact-name{
  font-size:12.5px;color:var(--text);cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

#page-customers.crm-gold-v2 .crm-dl-contact-acts,
#page-deals.crm-gold-v2 .crm-dl-contact-acts{
  display:inline-flex;align-items:center;gap:5px;flex-shrink:0;opacity:0;transition:opacity .15s;
}
#page-customers.crm-gold-v2 .crm-ll-row:hover .crm-dl-contact-acts,
#page-customers.crm-gold-v2 .crm-dl-contact-acts:focus-within{ opacity:1; }
#page-customers.crm-gold-v2 .crm-dl-budget,
#page-deals.crm-gold-v2 .crm-dl-budget{
  font-size:13px;font-weight:700;color:var(--gold-light);white-space:nowrap;letter-spacing:.01em;
}
#page-customers.crm-gold-v2 .crm-dl-budget.is-empty{ color:var(--text-muted);font-weight:500; }
#page-customers.crm-gold-v2 .crm-dl-stage,
#page-deals.crm-gold-v2 .crm-dl-stage{
  display:inline-block;padding:4px 11px;border-radius:7px;white-space:nowrap;
  font-size:11px;font-weight:700;color:var(--stage-c);
  background:color-mix(in srgb, var(--stage-c) 14%, transparent);
}


#page-customers.crm-gold-v2 .crm-dl-card,
#page-deals.crm-gold-v2 .crm-dl-card{
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  padding:13px 15px;margin-bottom:9px;cursor:pointer;transition:.15s;
}
#page-customers.crm-gold-v2 .crm-dl-card:hover{ border-color:var(--border-gold); }
#page-customers.crm-gold-v2 .crm-dl-card-top,
#page-deals.crm-gold-v2 .crm-dl-card-top{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;
}
#page-customers.crm-gold-v2 .crm-dl-card-name,
#page-deals.crm-gold-v2 .crm-dl-card-name{
  display:flex;align-items:center;gap:5px;
  font-size:14px;font-weight:800;color:var(--text);
  min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
#page-customers.crm-gold-v2 .crm-dl-card-mid,
#page-deals.crm-gold-v2 .crm-dl-card-mid{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:10px;
}
#page-customers.crm-gold-v2 .crm-dl-card-mid .crm-dl-budget{ margin-inline-start:auto; }
#page-customers.crm-gold-v2 .crm-dl-card-foot,
#page-deals.crm-gold-v2 .crm-dl-card-foot{
  display:flex;align-items:center;gap:8px;
  padding-top:9px;border-top:1px solid var(--border-light);
}
#page-customers.crm-gold-v2 .crm-dl-card-contact,
#page-deals.crm-gold-v2 .crm-dl-card-contact{
  font-size:12px;color:var(--text-muted);flex:1;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
/* r227: the owner block must SHRINK (it had flex-shrink:0), otherwise a long owner name + avatar +
   the 24px reassign button overflow the card row and the button is clipped at <=390px. Same
   containment pattern .crm-dl-card-contact already uses: shrinkable, min-width:0, name ellipsises,
   avatar + button keep their size. */
#page-customers.crm-gold-v2 .crm-dl-card-owner{ display:flex;align-items:center;gap:6px;flex:0 1 auto;min-width:0; }
#page-customers.crm-gold-v2 .crm-dl-card-owner span:first-child,
#page-deals.crm-gold-v2 .crm-dl-card-owner span:first-child{
  font-size:11px;color:var(--text-muted);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis;
}

@media(max-width:900px){
  #page-customers.crm-gold-v2 .crm-dl-head{ gap:9px; }
  #page-customers.crm-gold-v2 .crm-dl-title{ width:100%;justify-content:space-between; }
  #page-customers.crm-gold-v2 .crm-dl-search{ max-width:none; }
  #page-customers.crm-gold-v2 .crm-dl-chips,
#page-deals.crm-gold-v2 .crm-dl-chips{
    flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:2px;
  }
  #page-customers.crm-gold-v2 .crm-dl-chips::-webkit-scrollbar{ display:none; }
  #page-customers.crm-gold-v2 .crm-dl-chip{ flex-shrink:0; }
  #page-customers.crm-gold-v2 .crm-dl-controls{ width:100%; }
  #page-customers.crm-gold-v2 .crm-dl-select{ flex:1;min-width:0; }
}


#page-customers.crm-gold-v2 .glux-empty-dandelion,
#page-deals.crm-gold-v2 .glux-empty-dandelion{
  width:110px;height:auto;margin:0 auto 14px;display:block;
}


#page-customers.crm-gold-v2 .crm-dl-tabs,
#page-deals.crm-gold-v2 .crm-dl-tabs{
  display:flex;align-items:stretch;gap:2px;margin-bottom:14px;
  border-bottom:1px solid var(--border);
  overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
}
#page-customers.crm-gold-v2 .crm-dl-tabs::-webkit-scrollbar,
#page-deals.crm-gold-v2 .crm-dl-tabs::-webkit-scrollbar{ display:none; }
#page-customers.crm-gold-v2 .crm-dl-tab,
#page-deals.crm-gold-v2 .crm-dl-tab{
  display:inline-flex;align-items:center;gap:6px;flex-shrink:0;
  padding:10px 15px;background:none;border:none;cursor:pointer;font-family:inherit;
  font-size:12.5px;font-weight:600;color:var(--text-muted);white-space:nowrap;
  border-bottom:2px solid transparent;margin-bottom:-1px;transition:.15s;
}
#page-customers.crm-gold-v2 .crm-dl-tab:hover,
#page-deals.crm-gold-v2 .crm-dl-tab:hover{ color:var(--text); }
#page-customers.crm-gold-v2 .crm-dl-tab.active,
#page-deals.crm-gold-v2 .crm-dl-tab.active{
  color:var(--stage-c,var(--gold-light));
  border-bottom-color:var(--stage-c,var(--gold));
  font-weight:700;
}

#page-customers.crm-gold-v2 .crm-dl-tab-dot,
#page-deals.crm-gold-v2 .crm-dl-tab-dot{
  width:7px;height:7px;border-radius:99px;flex-shrink:0;
  background:var(--stage-c,var(--gold));opacity:.55;transition:.15s;
}
#page-customers.crm-gold-v2 .crm-dl-tab.active .crm-dl-tab-dot,
#page-deals.crm-gold-v2 .crm-dl-tab.active .crm-dl-tab-dot{
  opacity:1;box-shadow:0 0 0 3px color-mix(in srgb, var(--stage-c,var(--gold)) 18%, transparent);
}
#page-customers.crm-gold-v2 .crm-dl-tab-n,
#page-deals.crm-gold-v2 .crm-dl-tab-n{
  min-width:18px;padding:1px 6px;border-radius:99px;
  background:var(--track);color:var(--text-muted);
  font-size:10.5px;font-weight:700;line-height:1.5;
}
#page-customers.crm-gold-v2 .crm-dl-tab.active .crm-dl-tab-n,
#page-deals.crm-gold-v2 .crm-dl-tab.active .crm-dl-tab-n{
  background:color-mix(in srgb, var(--stage-c,var(--gold)) 14%, transparent);
  color:var(--stage-c,var(--gold-light));
}

#page-customers.crm-gold-v2 .crm-dl-tab.is-zero:not(.active),
#page-deals.crm-gold-v2 .crm-dl-tab.is-zero:not(.active){ opacity:.45; }





#page-deals.crm-gold-v2{
  --bg:#faf8f3; --card:#fffdf8; --card2:#fdfbf5;
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --ok: var(--accent); --ok-text: var(--accent-text); --warn-text: var(--warning);
  --stage-qual:#5a7d33; --stage-contacted:#6B7280; --stage-visit:#2f6f9f;
  --stage-negotiate:#c2740f; --stage-won:#3f8f5f; --stage-lost:#8a8370;
  --state-contacted:#2f6f9f; --state-bad:#c0484a;
}
body.dark #page-deals.crm-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:#1b1815;
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --primary:var(--neutral-accent); --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --warn-text: var(--warning);
  --stage-qual:var(--neutral-accent); --stage-contacted:#B4B4B4; --stage-visit:#6ba7d8;
  --stage-negotiate:#e0a758; --stage-won:#8fd0a4; --stage-lost:#948d7a;
  --state-contacted:#6ba7d8; --state-bad:#e28689;
}

#page-customers.crm-gold-v2{ --state-contacted:#2f6f9f; --state-bad:#c0484a; }
body.dark #page-customers.crm-gold-v2{ --state-contacted:#6ba7d8; --state-bad:#e28689; }


#page-customers.crm-gold-v2 .crm-ld-topbar,
#page-deals.crm-gold-v2 .crm-ld-topbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:16px;flex-wrap:wrap;
}
.crm-ld-crumb{ display:flex;align-items:center;gap:7px;font-size:13px;color:var(--text-muted);min-width:0; }
.crm-ld-crumb a{ color:var(--text-muted)!important;text-decoration:none; }
.crm-ld-crumb a:hover{ color:var(--gold-light)!important; }
.crm-ld-crumb b{ color:var(--text);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.crm-ld-topacts{ display:flex;align-items:center;gap:7px;flex-wrap:wrap; }
.crm-ld-btn{
  display:inline-flex;align-items:center;gap:5px;
  height:34px;padding:0 14px;border-radius:9px;
  background:var(--card);border:1px solid var(--border);color:var(--text-light);
  font-size:12px;font-weight:600;font-family:inherit;cursor:pointer;transition:.15s;white-space:nowrap;
}
.crm-ld-btn:hover{ border-color:var(--border-gold);color:var(--text); }
.crm-ld-btn.crm-ld-btn-gold{
  background:var(--active-pill);border-color:var(--border-gold);color:var(--gold-light);font-weight:700;
}
.crm-ld-btn.crm-ld-btn-gold:hover{ background:var(--gold-grad);color:var(--text); }
.crm-ld-btn.crm-ld-btn-danger:hover{ border-color:var(--state-bad);color:var(--state-bad); }
.crm-ld-nav{
  width:34px;height:34px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--card);border:1px solid var(--border);color:var(--text-light);cursor:pointer;transition:.15s;
}
.crm-ld-nav:hover:not(:disabled){ border-color:var(--border-gold);color:var(--text); }
.crm-ld-nav:disabled{ opacity:.35;cursor:default; }


.crm-ld-grid{ display:grid;grid-template-columns:1.55fr 1fr;gap:16px;align-items:start; }
.crm-ld-main,.crm-ld-side{ display:flex;flex-direction:column;gap:14px;min-width:0; }


.crm-ld-hero{
  display:flex;align-items:center;gap:16px;
  background:var(--card);border:1px solid var(--border);border-radius:16px;padding:20px 22px;
}
.crm-ld-avatar{
  width:64px;height:64px;border-radius:50%;flex-shrink:0;
  background:var(--gold-grad);color:var(--text);
  display:flex;align-items:center;justify-content:center;
  font-size:20px;font-weight:800;letter-spacing:.02em;
}
.crm-ld-hero-body{ min-width:0;flex:1; }
.crm-ld-hero-body h2{
  margin:0 0 7px;font-size:22px;font-weight:800;color:var(--text);
  display:flex;align-items:center;gap:6px;
}
.crm-ld-hero-meta{ display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--text-muted); }
.crm-ld-hero-meta b{ color:var(--text);font-weight:700; }
.crm-ld-hero-state{ margin-top:7px;font-size:12px;color:var(--text-muted); }


.crm-ld-card{
  background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px 16px;
}
.crm-ld-card-head{
  display:flex;align-items:center;gap:8px;
  padding-bottom:10px;margin-bottom:4px;border-bottom:1px solid var(--border-light);
}
.crm-ld-card-head > span:first-child{ font-size:13px;font-weight:700;color:var(--text); }
.crm-ld-card-sub{ font-size:11px;color:var(--text-muted); }
.crm-ld-card-head > *:last-child{ margin-inline-start:auto; }
.crm-ld-add{
  width:26px;height:26px;border-radius:8px;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--card2);border:1px solid var(--border);color:var(--text-light);cursor:pointer;transition:.15s;
}
.crm-ld-add:hover{ border-color:var(--border-gold);color:var(--gold-light); }
.crm-ld-empty{
  display:flex;align-items:center;justify-content:center;gap:6px;
  padding:18px 6px;color:var(--text-muted);font-size:12px;
}


.crm-ld-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:9px 0;border-bottom:1px solid var(--border-light);
}
.crm-ld-row:last-child{ border-bottom:none; }
.crm-ld-row-lbl{ font-size:12px;color:var(--text-muted);flex-shrink:0; }
.crm-ld-row-val{
  font-size:12.5px;color:var(--text);text-align:end;min-width:0;
  display:inline-flex;align-items:center;gap:6px;
  overflow:hidden;text-overflow:ellipsis;
}
.crm-ld-row-val.is-dim{ color:var(--text-muted); }


.crm-ld-bp{ display:flex;flex-direction:column;gap:12px;padding-top:8px; }
.crm-ld-bp-current,.crm-ld-bp-trans{ display:flex;align-items:center;gap:12px;flex-wrap:wrap; }
.crm-ld-bp-current > span:first-child,
.crm-ld-bp-trans > span:first-child{ font-size:12px;color:var(--text-muted);min-width:64px; }
.crm-ld-bp-trans > div{ display:flex;gap:8px;flex-wrap:wrap; }
.crm-ld-bp-pill{
  padding:5px 13px;border-radius:8px;font-size:11.5px;font-weight:700;
  color:var(--state-c);background:color-mix(in srgb, var(--state-c) 14%, transparent);
}
.crm-ld-bp-btn{
  padding:8px 18px;border-radius:9px;font-size:12px;font-weight:700;
  font-family:inherit;cursor:pointer;transition:.15s;border:1px solid;
}
.crm-ld-bp-btn.is-blue{
  color:var(--state-contacted);border-color:var(--state-contacted);
  background:color-mix(in srgb, var(--state-contacted) 12%, transparent);
}
.crm-ld-bp-btn.is-red{
  color:var(--state-bad);border-color:var(--state-bad);
  background:color-mix(in srgb, var(--state-bad) 12%, transparent);
}
.crm-ld-bp-btn.is-gold{
  color:var(--gold-light);border-color:var(--border-gold);background:var(--active-pill);
}
.crm-ld-bp-btn:hover{ filter:brightness(1.12); }


.crm-ld-transitions{ display:flex;gap:7px;flex-wrap:wrap;padding-top:10px; }
.crm-ld-trans{
  padding:7px 14px;border-radius:9px;font-size:11.5px;font-weight:600;font-family:inherit;cursor:pointer;
  background:var(--card2);border:1px solid var(--border);color:var(--text-light);transition:.15s;
}
.crm-ld-trans:hover{ border-color:var(--stage-c);color:var(--stage-c); }
.crm-ld-trans.is-current{
  border-color:var(--stage-c);color:var(--stage-c);font-weight:700;
  background:color-mix(in srgb, var(--stage-c) 14%, transparent);
  cursor:default;
}


.crm-ld-tags{ display:flex;gap:6px;flex-wrap:wrap;padding:10px 0; }
.crm-ld-tag{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px;border-radius:99px;font-size:11px;font-weight:600;
  background:var(--active-pill);border:1px solid var(--border-gold);color:var(--gold-light);
}
.crm-ld-tag button{
  background:none;border:none;padding:0;cursor:pointer;color:inherit;opacity:.6;display:flex;
}
.crm-ld-tag button:hover{ opacity:1; }


.crm-ld-note-composer{ display:flex;gap:7px;padding:10px 0; }
.crm-ld-note-composer input{
  flex:1;min-width:0;height:34px;padding:0 11px;
  background:var(--card2);border:1px solid var(--border);border-radius:9px;
  color:var(--text);font-size:12px;font-family:inherit;outline:none;
}
.crm-ld-note-composer input:focus{ border-color:var(--border-gold); }
.crm-ld-note-composer button{
  height:34px;padding:0 15px;border-radius:9px;flex-shrink:0;
  background:var(--active-pill);border:1px solid var(--border-gold);color:var(--gold-light);
  font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:.15s;
}
.crm-ld-note-composer button:hover{ background:var(--gold-grad);color:var(--text); }
.crm-ld-note{ padding:9px 0;border-top:1px solid var(--border-light); }
.crm-ld-note-text{ font-size:12.5px;color:var(--text);line-height:1.6; }
.crm-ld-note-meta{
  display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:4px;
  font-size:10.5px;color:var(--text-muted);
}
.crm-ld-note-meta button{ background:none;border:none;color:var(--text-muted);cursor:pointer;display:flex;padding:0; }
.crm-ld-note-meta button:hover{ color:var(--state-bad); }


.crm-ld-mini{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 0;border-bottom:1px solid var(--border-light);
}
.crm-ld-mini:last-child{ border-bottom:none; }
.crm-ld-mini-t{ font-size:12.5px;font-weight:600;color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.crm-ld-mini-s{ font-size:10.5px;color:var(--text-muted);flex-shrink:0;white-space:nowrap; }


.crm-ld-timeline{ padding-top:10px; }
.crm-ld-tl-day{
  display:inline-block;margin:10px 0 8px;
  padding:3px 11px;border-radius:99px;
  background:var(--card2);border:1px solid var(--border);
  font-size:10.5px;font-weight:700;color:var(--text-muted);
}
.crm-ld-tl-item{
  display:flex;align-items:flex-start;gap:10px;
  padding:7px 0 7px 0;
  border-inline-start:1px solid var(--border-light);
  margin-inline-start:5px;padding-inline-start:14px;position:relative;
}
.crm-ld-tl-dot{
  position:absolute;inset-inline-start:-4px;top:12px;
  width:7px;height:7px;border-radius:50%;background:var(--gold);flex-shrink:0;
}
.crm-ld-tl-time{ font-size:10.5px;color:var(--text-muted);flex-shrink:0;min-width:48px;font-variant-numeric:tabular-nums; }
.crm-ld-tl-body{ display:flex;flex-direction:column;gap:2px;min-width:0;flex:1; }
.crm-ld-tl-body b{ font-size:12px;font-weight:700;color:var(--text); }
.crm-ld-tl-body span{ font-size:11.5px;color:var(--text-light);line-height:1.55; }
.crm-ld-tl-body em{ font-size:10px;color:var(--text-muted);font-style:normal; }


@media(max-width:900px){
  .crm-ld-grid{ grid-template-columns:1fr; }
  .crm-ld-topbar{ gap:8px; }
  .crm-ld-crumb{ width:100%; }
  .crm-ld-topacts{ width:100%; }
  .crm-ld-btn{ flex:1;justify-content:center; }
  .crm-ld-hero{ flex-direction:column;text-align:center;gap:12px;padding:18px 16px; }
  .crm-ld-hero-body h2{ justify-content:center; }
  .crm-ld-hero-meta{ justify-content:center; }
  .crm-ld-bp-trans > div{ width:100%; }
  .crm-ld-bp-btn{ flex:1; }
}





.ptag-filter-bar {
  padding: 6px 16px 8px;
  background: var(--surface, #fff);
  border-bottom: 1px solid var(--border, #f0f0f0);
}
.ptag-filter-inner {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.ptag-label {
  font-size: 0.72rem;
  color: var(--text-muted, #999);
  font-weight: 600;
  flex-shrink: 0;
}
.ptag-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  flex: 1;
}


.ptag-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px 3px 8px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 20px;
  font-size: 0.75rem;
  cursor: pointer;
  background: var(--surface, #fff);
  color: var(--text-secondary, #555);
  transition: all .15s;
  line-height: 1.4;
}
.ptag-filter-chip:hover {
  border-color: var(--tag-c, #6c63ff);
  color: var(--tag-c, #6c63ff);
}
.ptag-filter-chip-active {
  background: var(--tag-c, #6c63ff);
  border-color: var(--tag-c, #6c63ff);
  color: #fff !important;
}
.ptag-chip-n {
  font-size: 0.68rem;
  opacity: .75;
  margin-right: 1px;
}
.ptag-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

.ptag-clear-btn {
  font-size: 0.72rem;
  padding: 3px 10px;
  border: 1.5px solid var(--border, #ddd);
  border-radius: 20px;
  cursor: pointer;
  background: none;
  color: var(--text-muted, #888);
  transition: all .15s;
}
.ptag-clear-btn:hover { border-color: #ef4444; color: #ef4444; }

.ptag-manage-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border: 1.5px dashed var(--border, #ddd);
  border-radius: 20px;
  font-size: 0.72rem;
  cursor: pointer;
  background: none;
  color: var(--text-muted, #999);
  transition: all .15s;
  margin-right: auto;
}
.ptag-manage-btn:hover { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }


.ptag-card-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 4px 10px 0;
}
.ptag-chip-sm {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 7px;
  border-radius: 20px;
  font-size: 0.65rem;
  font-weight: 500;
  background: color-mix(in srgb, var(--tag-c, #6c63ff) 12%, transparent);
  color: var(--tag-c, #6c63ff);
  border: 1px solid color-mix(in srgb, var(--tag-c, #6c63ff) 25%, transparent);
  white-space: nowrap;
}
.ptag-dot-sm {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}


.ptag-modal-block .lm-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.ptag-modal-edit-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border: 1.5px solid var(--border, #ddd);
  border-radius: 6px;
  font-size: 0.7rem;
  cursor: pointer;
  background: none;
  color: var(--text-muted, #888);
  transition: all .15s;
}
.ptag-modal-edit-btn:hover { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }
.ptag-modal-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 6px;
}
.ptag-chip-md {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 500;
  background: color-mix(in srgb, var(--tag-c, #6c63ff) 12%, transparent);
  color: var(--tag-c, #6c63ff);
  border: 1.5px solid color-mix(in srgb, var(--tag-c, #6c63ff) 28%, transparent);
}
.ptag-modal-empty {
  font-size: 0.78rem;
  color: var(--text-muted, #bbb);
}


.ptag-assign-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0);
  z-index: 1300;
  display: flex;
  justify-content: flex-end;
  pointer-events: none;
  transition: background .25s;
}
.ptag-assign-overlay.ptag-assign-open {
  background: rgba(0,0,0,.35);
  pointer-events: all;
}
.ptag-assign-panel {
  width: min(360px, 100vw);
  height: 100%;
  background: var(--surface, #fff);
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform .28s cubic-bezier(.4,0,.2,1);
  box-shadow: -4px 0 20px rgba(0,0,0,.1);
}
.ptag-assign-overlay.ptag-assign-open .ptag-assign-panel { transform: translateX(0); }
.ptag-assign-hdr {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 18px;
  border-bottom: 1.5px solid var(--border, #e8e8e8);
  flex-shrink: 0;
}
.ptag-assign-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text-primary, #181B21);
  flex: 1;
}
.ptag-assign-body {
  flex: 1;
  overflow-y: auto;
  padding: 8px 0;
  }
.ptag-assign-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  cursor: pointer;
  transition: background .1s;
  border-bottom: 1px solid var(--border, #f5f5f5);
}
.ptag-assign-row:hover { background: var(--bg, #F8F9FF); }
.ptag-assign-sel { background: var(--accent-light, #ECEDF7); }
.ptag-assign-chk { accent-color: var(--accent, #6c63ff); flex-shrink: 0; }
.ptag-assign-name { flex: 1; font-size: 0.85rem; color: var(--text-primary, #181B21); font-weight: 500; }
.ptag-assign-count { font-size: 0.72rem; color: var(--text-muted, #aaa); }
.ptag-assign-empty, .ptag-assign-err {
  padding: 32px 18px;
  font-size: 0.85rem;
  color: var(--text-muted, #aaa);
  text-align: center;
  line-height: 1.8;
}
.ptag-assign-err { color: var(--red, var(--danger)); }


.ptag-mgr-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 1400;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity .2s;
}
.ptag-mgr-overlay.ptag-mgr-open {
  pointer-events: all;
  opacity: 1;
}
.ptag-mgr-modal {
  width: min(420px, 94vw);
  max-height: 80vh;
  background: var(--surface, #fff);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 8px 40px rgba(0,0,0,.18);
  overflow: hidden;
  transform: scale(.95);
  transition: transform .2s;
}
.ptag-mgr-overlay.ptag-mgr-open .ptag-mgr-modal { transform: scale(1); }
.ptag-mgr-hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1.5px solid var(--border, #e8e8e8);
}
.ptag-mgr-title { font-size: 1rem; font-weight: 700; color: var(--text-primary, #181B21); margin: 0; }
.ptag-close-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  color: var(--text-muted, #999);
  padding: 4px 6px;
  border-radius: 6px;
  transition: all .15s;
}
.ptag-close-btn:hover { background: var(--bg, #f0f0f0); color: var(--text-primary, #333); }
.ptag-mgr-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px;
}


.ptag-new-row {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 16px;
}
.ptag-new-input {
  flex: 1;
  padding: 8px 12px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 8px;
  font-size: 0.85rem;
  outline: none;
  background: var(--surface, #fff);
  color: var(--text-primary, #181B21);
  transition: border-color .2s;
}
.ptag-new-input:focus { border-color: var(--accent, #6c63ff); }
.ptag-color-picker {
  width: 36px;
  height: 34px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 8px;
  cursor: pointer;
  padding: 2px;
  background: none;
  flex-shrink: 0;
}
.ptag-create-btn {
  padding: 8px 14px;
  background: var(--accent, #6c63ff);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 0.82rem;
  cursor: pointer;
  white-space: nowrap;
  transition: opacity .2s;
  flex-shrink: 0;
}
.ptag-create-btn:hover { opacity: .85; }


.ptag-mgr-list { display: flex; flex-direction: column; gap: 2px; }
.ptag-mgr-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 4px;
  border-bottom: 1px solid var(--border, #f0f0f0);
}
.ptag-mgr-name { flex: 1; font-size: 0.85rem; font-weight: 500; color: var(--text-primary, #181B21); }
.ptag-mgr-count { font-size: 0.72rem; color: var(--text-muted, #aaa); margin-left: 4px; }
.ptag-mgr-acts { display: flex; align-items: center; gap: 6px; }
.ptag-mgr-del {
  padding: 3px 7px;
  background: none;
  border: 1.5px solid var(--border, #ddd);
  border-radius: 6px;
  font-size: 0.72rem;
  cursor: pointer;
  color: var(--text-muted, #999);
  transition: all .15s;
}
.ptag-mgr-del:hover { border-color: #ef4444; color: #ef4444; }
.ptag-mgr-empty {
  text-align: center;
  padding: 32px 0;
  font-size: 0.85rem;
  color: var(--text-muted, #bbb);
}


.ptag-spinner {
  width: 28px;
  height: 28px;
  border: 3px solid var(--border, #e0e0e0);
  border-top-color: var(--accent, #6c63ff);
  border-radius: 50%;
  animation: ptag-spin .7s linear infinite;
  margin: 40px auto;
}
@keyframes ptag-spin { to { transform: rotate(360deg); } }


@supports not (background: color-mix(in srgb, red 10%, transparent)) {
  .ptag-chip-sm { background: rgba(108,99,255,.1); }
  .ptag-chip-md { background: rgba(108,99,255,.1); }
}




#small-modal.rent-modal-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  --danger-text:#DC2626;
  --ok: var(--accent); --ok-text: var(--accent-text); --ok-glow: var(--accent-soft); --nav-hover:#E7E8F2;
  background:rgba(41,34,20,.45);
}
body.dark #small-modal.rent-modal-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  --danger-text:#F87171;
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --ok-glow: var(--accent-soft); --nav-hover:#221f1a;
  background:rgba(0,0,0,.6);
}

#small-modal.rent-modal-gold-v2 .modal{
  background:var(--card2);border:1px solid var(--border);box-shadow:0 24px 60px var(--shadow);
}
#small-modal.rent-modal-gold-v2 .modal-header{ border-bottom:1px solid var(--hairline); }
#small-modal.rent-modal-gold-v2 .modal-title{ color:var(--text); }
#small-modal.rent-modal-gold-v2 .modal-close{ color:var(--text-light);border:1px solid var(--btn-border);border-radius:50%;width:30px;height:30px; }
#small-modal.rent-modal-gold-v2 .modal-close:hover{ background:var(--track);color:var(--text); }
#small-modal.rent-modal-gold-v2 .modal-footer{ background:var(--card2);border-top:1px solid var(--hairline); }


#small-modal.rent-modal-gold-v2 .rcm-prop-card{
  background:var(--nav-hover);border:1px solid var(--ok);border-radius:12px;padding:12px 16px;
  margin-bottom:14px;display:flex;align-items:center;gap:12px;
}
#small-modal.rent-modal-gold-v2 .rcm-prop-icon{
  width:36px;height:36px;border-radius:10px;background:var(--card);color:var(--ok-text);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
#small-modal.rent-modal-gold-v2 .rcm-prop-name{ font-weight:800;color:var(--ok-text);font-size:14px; }
#small-modal.rent-modal-gold-v2 .rcm-prop-meta{ font-size:12px;color:var(--text-muted);margin-top:2px; }

#small-modal.rent-modal-gold-v2 .form-label{ color:var(--text-light);font-weight:700;font-size:12px;margin-bottom:6px;display:block; }
#small-modal.rent-modal-gold-v2 .form-control{
  background:var(--card);color:var(--text);border:1.5px solid var(--btn-border);border-radius:10px;
  padding:9px 12px;font-size:13px;font-family:inherit;width:100%;min-height:40px;transition:.15s;
}
#small-modal.rent-modal-gold-v2 .form-control:focus{ outline:none;border-color:var(--ok);box-shadow:0 0 0 3px var(--ok-glow); }
#small-modal.rent-modal-gold-v2 #pf-rcv-amount{ direction:ltr;text-align:right;font-weight:800;color:var(--ok-text); }

#small-modal.rent-modal-gold-v2 .btn-ghost{
  background:var(--card);color:var(--text-light);border:1.5px solid var(--btn-border);border-radius:10px;font-weight:700;min-height:40px;
}
#small-modal.rent-modal-gold-v2 .btn-success{
  background:var(--ok);color:#0f2410;border:none;border-radius:10px;font-weight:800;min-height:40px;
}

@media (max-width:768px){
  #small-modal.rent-modal-gold-v2 .modal{ max-width:100%;width:100%;height:100%;max-height:100%;border-radius:0; }
  #small-modal.rent-modal-gold-v2 .modal-footer{
    position:sticky;bottom:0;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));
  }
  #small-modal.rent-modal-gold-v2 .form-control,
  #small-modal.rent-modal-gold-v2 .btn-ghost,
  #small-modal.rent-modal-gold-v2 .btn-success{ min-height:44px; }
}





.prp-map-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 7px;
  background: var(--surface, #fff);
  color: var(--text-secondary, #666);
  font-size: 0.78rem;
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
}
.prp-map-toggle:hover { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }
.prp-map-toggle.on {
  background: var(--accent, #6c63ff);
  border-color: var(--accent, #6c63ff);
  color: #fff;
}


.prp-loc-ic {
  display: inline-flex;
  align-items: center;
  color: var(--accent, #6c63ff);
  margin-left: 3px;
  flex-shrink: 0;
  vertical-align: middle;
}


#prp-map-container {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 190px);
  min-height: 480px;
  border-top: 1.5px solid var(--border, #e8e8e8);
}


.prp-map-topbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  background: var(--surface, #fff);
  border-bottom: 1px solid var(--border, #f0f0f0);
  flex-shrink: 0;
  flex-wrap: wrap;
  }
.prp-map-count {
  font-size: 0.78rem;
  color: var(--text-muted, #888);
  font-weight: 500;
}
.prp-map-filters-row {
  flex: 1;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.prp-map-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 7px;
  background: var(--surface, #fff);
  color: var(--text-secondary, #555);
  font-size: 0.78rem;
  cursor: pointer;
  white-space: nowrap;
  transition: all .15s;
}
.prp-map-back-btn:hover { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }


.prp-map-canvas {
  flex: 1;
  z-index: 0;
}


.prp-cluster-wrap {
  background: none !important;
  border: none !important;
}
.prp-cluster-circle {
  border-radius: 50%;
  background: var(--accent-soft);
  color: #fff;
  font-size: 0.82rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 10px rgba(34,197,94,.4);
  border: 3px solid rgba(255,255,255,.8);
  cursor: pointer;
  transition: transform .15s;
  font-family: inherit;
}
.prp-cluster-circle:hover { transform: scale(1.1); }


.prp-pin-wrap {
  background: none !important;
  border: none !important;
}
.prp-pin-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 8px;
  background: var(--pc, var(--accent-soft));
  color: #fff;
  border-radius: 5px;
  font-size: 0.7rem;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0,0,0,.2);
  cursor: pointer;
  position: relative;
  font-family: inherit;
  transition: transform .12s;
}
.prp-pin-pill:hover { transform: scale(1.08); }
.prp-pin-pill::after {
  content: '';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: var(--pc, var(--accent));
  border-bottom: 0;
}


.prp-map-popup {
  font-family: inherit;
  min-width: 190px;
}
.prp-pop-img {
  width: 100%;
  height: 95px;
  object-fit: cover;
  border-radius: 5px;
  display: block;
  margin-bottom: 8px;
}
.prp-pop-body { padding: 2px 0; }
.prp-pop-name {
  font-size: 0.88rem;
  font-weight: 700;
  color: #181B21;
  margin-bottom: 4px;
  line-height: 1.3;
}
.prp-pop-loc {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.73rem;
  color: #888;
  margin-bottom: 3px;
}
.prp-pop-price {
  font-size: 0.82rem;
  font-weight: 700;
  margin-bottom: 4px;
}
.prp-pop-rooms {
  font-size: 0.72rem;
  color: #888;
  margin-bottom: 8px;
}
.prp-pop-btn {
  display: block;
  width: 100%;
  padding: 7px 0;
  background: var(--accent-soft);
  color: #fff;
  border: none;
  border-radius: 7px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  text-align: center;
  transition: opacity .2s;
  font-family: inherit;
}
.prp-pop-btn:hover { opacity: .85; }


.leaflet-popup-content-wrapper {
  border-radius: 10px !important;
  padding: 0 !important;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,.14) !important;
}
.leaflet-popup-content {
  margin: 10px 12px !important;
}


@media (max-width: 600px) {
  #prp-map-container { height: calc(100vh - 160px); }
}




#small-modal.usr-modal-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  --danger-text:#DC2626;
  --olive:var(--neutral-accent); --olive-bg:rgba(159,178,106,.16); --olive-check:var(--neutral-accent);
  --ok: var(--accent); --ok-text: var(--accent-text); --ok-glow: var(--accent-soft); --nav-hover:#E7E8F2;
  background:rgba(41,34,20,.45);
}
body.dark #small-modal.usr-modal-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  --danger-text:#F87171;
  --olive:var(--neutral-accent); --olive-bg:rgba(168,189,124,.16); --olive-check:var(--neutral-accent);
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --ok-glow: var(--accent-soft); --nav-hover:#221f1a;
  background:rgba(0,0,0,.6);
}

#small-modal.usr-modal-gold-v2 .modal{
  background:var(--card2);border:1px solid var(--border);box-shadow:0 24px 60px var(--shadow);
}
#small-modal.usr-modal-gold-v2 .modal-header{ border-bottom:1px solid var(--hairline); }
#small-modal.usr-modal-gold-v2 .modal-title{ color:var(--text); }
#small-modal.usr-modal-gold-v2 .modal-close{ color:var(--text-light);border:1px solid var(--btn-border);border-radius:50%;width:30px;height:30px; }
#small-modal.usr-modal-gold-v2 .modal-close:hover{ background:var(--track);color:var(--text); }
#small-modal.usr-modal-gold-v2 .modal-footer{ background:var(--card2);border-top:1px solid var(--hairline); }

#small-modal.usr-modal-gold-v2 .form-label{ color:var(--text-light);font-weight:700;font-size:12px;margin-bottom:6px;display:block; }
#small-modal.usr-modal-gold-v2 .form-control{
  background:var(--card);color:var(--text);border:1.5px solid var(--btn-border);border-radius:10px;
  padding:9px 12px;font-size:13px;font-family:inherit;width:100%;min-height:40px;transition:.15s;
}
#small-modal.usr-modal-gold-v2 .form-control:focus{ outline:none;border-color:var(--ok);box-shadow:0 0 0 3px var(--ok-glow); }
#small-modal.usr-modal-gold-v2 #u-email,
#small-modal.usr-modal-gold-v2 #eu-email{ direction:ltr;text-align:right; }


#small-modal.usr-modal-gold-v2 .um-box{ border:1px solid var(--border);border-radius:12px;padding:14px;background:var(--card); }
#small-modal.usr-modal-gold-v2 .um-box-head{ font-size:13px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:6px; }
#small-modal.usr-modal-gold-v2 .btn-xs{
  background:var(--card);color:var(--text-light);border:1.5px solid var(--btn-border);border-radius:8px;
  font-size:11px;font-weight:700;padding:5px 10px;
}
#small-modal.usr-modal-gold-v2 .btn-xs:hover{ border-color:var(--ok);color:var(--ok-text); }


#small-modal.usr-modal-gold-v2 .perm-row{
  border:1px solid transparent!important;border-radius:8px;transition:.15s;
}
#small-modal.usr-modal-gold-v2 .perm-row:hover{ background:var(--track)!important; }
#small-modal.usr-modal-gold-v2 .perm-row:has(input:checked){
  background:var(--olive-bg)!important;border-color:var(--olive)!important;
}
#small-modal.usr-modal-gold-v2 .perm-row input[type=checkbox]{ accent-color:var(--olive); }
#small-modal.usr-modal-gold-v2 .perm-row .perm-default-lbl{ color:var(--olive)!important; }
#small-modal.usr-modal-gold-v2 .perm-row .perm-name-lbl{ color:var(--text); }


#small-modal.usr-modal-gold-v2 .um-allprops{
  background:var(--track)!important;border:1px solid var(--border)!important;
}
#small-modal.usr-modal-gold-v2 .um-allprops input[type=checkbox]{ accent-color:var(--olive); }
#small-modal.usr-modal-gold-v2 .um-allprops-title{ color:var(--ok-text)!important; }
#small-modal.usr-modal-gold-v2 .um-allprops-sub{ color:var(--text-muted)!important; }


#small-modal.usr-modal-gold-v2 .eu-prop-cb{ accent-color:var(--olive); }
#small-modal.usr-modal-gold-v2 #eu-prop-list label:hover{ background:var(--track)!important;border-color:var(--border)!important; }

#small-modal.usr-modal-gold-v2 .btn-ghost{
  background:var(--card);color:var(--text-light);border:1.5px solid var(--btn-border);border-radius:10px;font-weight:700;min-height:40px;
}
#small-modal.usr-modal-gold-v2 .btn-primary{
  background:var(--nav-hover);color:var(--ok-text);border:1px solid var(--ok);border-radius:10px;font-weight:800;min-height:40px;
}

@media (max-width:768px){
  #small-modal.usr-modal-gold-v2 .modal{ max-width:100%;width:100%;height:100%;max-height:100%;border-radius:0; }
  #small-modal.usr-modal-gold-v2 .modal-footer{
    position:sticky;bottom:0;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));
  }
  #small-modal.usr-modal-gold-v2 #perm-grid,
  #small-modal.usr-modal-gold-v2 #eu-perm-grid{ grid-template-columns:1fr!important; }
  #small-modal.usr-modal-gold-v2 .perm-row{ min-height:44px; }
  #small-modal.usr-modal-gold-v2 .form-control,
  #small-modal.usr-modal-gold-v2 .btn-ghost,
  #small-modal.usr-modal-gold-v2 .btn-primary{ min-height:44px; }
}




#small-modal.task-modal-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565; --dim:#98917f;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  --danger-text:#DC2626; --warn-text: var(--warning);
  --ok: var(--accent); --ok-text: var(--accent-text); --ok-glow: var(--accent-soft); --nav-hover:#E7E8F2;
  background:rgba(41,34,20,.45);
}
body.dark #small-modal.task-modal-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a; --dim:#7a7363;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  --danger-text:#F87171; --warn-text: var(--warning);
  --ok:var(--neutral-accent); --ok-text:var(--neutral-accent); --ok-glow: var(--accent-soft); --nav-hover:#221f1a;
  background:rgba(0,0,0,.6);
}

#small-modal.task-modal-gold-v2 .modal{
  background:var(--card2);border:1px solid var(--border);box-shadow:0 24px 60px var(--shadow);
  max-height:92vh;
}
#small-modal.task-modal-gold-v2 .modal-header{ border-bottom:1px solid var(--hairline); }
#small-modal.task-modal-gold-v2 .modal-title{ color:var(--text); }
#small-modal.task-modal-gold-v2 .modal-close{ color:var(--text-light);border:1px solid var(--btn-border);border-radius:50%;width:30px;height:30px; }
#small-modal.task-modal-gold-v2 .modal-close:hover{ background:var(--track);color:var(--text); }
#small-modal.task-modal-gold-v2 .modal-body{ background:var(--card2); }

#small-modal.task-modal-gold-v2 .tdm-field{ margin-bottom:14px; }
#small-modal.task-modal-gold-v2 .tdm-label{ font-size:12px;font-weight:700;color:var(--text-light);display:block;margin-bottom:6px; }
#small-modal.task-modal-gold-v2 .tdm-grid-2{ display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px; }
#small-modal.task-modal-gold-v2 .tdm-grid-3{ display:grid;grid-template-columns:1.2fr 1fr .8fr;gap:10px;margin-bottom:12px; }

#small-modal.task-modal-gold-v2 .tdm-input,
#small-modal.task-modal-gold-v2 .tdm-select,
#small-modal.task-modal-gold-v2 .tdm-textarea{
  width:100%;background:var(--card);color:var(--text);border:1.5px solid var(--btn-border);border-radius:10px;
  padding:9px 12px;font-size:13px;font-family:inherit;outline:none;transition:.15s;min-height:40px;box-sizing:border-box;
}
#small-modal.task-modal-gold-v2 .tdm-textarea{ min-height:unset;resize:vertical; }
#small-modal.task-modal-gold-v2 .tdm-input:focus,
#small-modal.task-modal-gold-v2 .tdm-select:focus,
#small-modal.task-modal-gold-v2 .tdm-textarea:focus{ border-color:var(--ok)!important;box-shadow:0 0 0 3px var(--ok-glow); }
#small-modal.task-modal-gold-v2 #todo-time,
#small-modal.task-modal-gold-v2 #todo-amount{ direction:ltr; }


#small-modal.task-modal-gold-v2 #todo-due,
#small-modal.task-modal-gold-v2 #todo-reminder{
  background:var(--card)!important;color:var(--text)!important;border-color:var(--btn-border)!important;border-radius:10px!important;
}
#small-modal.task-modal-gold-v2 #todo-due:focus,
#small-modal.task-modal-gold-v2 #todo-reminder:focus{ border-color:var(--ok)!important; }
#small-modal.task-modal-gold-v2 #todo-due-g,
#small-modal.task-modal-gold-v2 #todo-reminder-g{ color:var(--ok,var(--accent-text))!important; }

#small-modal.task-modal-gold-v2 .tdm-cost-hint{ color:var(--text-muted); }


#small-modal.task-modal-gold-v2 .tdm-chip{
  padding:5px 13px;border-radius:99px;border:1.5px solid var(--btn-border);background:var(--card);color:var(--text-light);
  font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;transition:.15s;
}
#small-modal.task-modal-gold-v2 .tdm-chip.active{ background:var(--nav-hover);border-color:var(--ok);color:var(--ok-text); }


#small-modal.task-modal-gold-v2 .tdm-cl-empty{ font-size:11px;color:var(--dim);padding:4px 0; }
#small-modal.task-modal-gold-v2 .tdm-cl-row{ display:flex;align-items:center;gap:8px;padding:7px 9px;background:var(--track);border-radius:8px;margin-bottom:4px; }
#small-modal.task-modal-gold-v2 .tdm-cl-row input[type=checkbox]{ accent-color:var(--ok);width:15px;height:15px;flex-shrink:0;cursor:pointer; }
#small-modal.task-modal-gold-v2 .tdm-cl-text{ flex:1;font-size:12px;color:var(--text); }
#small-modal.task-modal-gold-v2 .tdm-cl-text.done{ text-decoration:line-through;color:var(--dim); }
#small-modal.task-modal-gold-v2 .tdm-cl-del{ border:none;background:none;color:var(--dim);cursor:pointer;font-size:14px;padding:0 4px; }
#small-modal.task-modal-gold-v2 .tdm-cl-del:hover{ color:var(--danger-text); }
#small-modal.task-modal-gold-v2 .tdm-cl-add-btn{
  padding:8px 15px;background:transparent;color:var(--ok-text);border:1.5px solid var(--ok);border-radius:10px;
  font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;
}


#small-modal.task-modal-gold-v2 .tdm-asn-chip{
  display:flex;align-items:center;gap:6px;padding:6px 10px;border:1.5px solid var(--btn-border);border-radius:8px;
  cursor:pointer;font-size:12px;font-weight:600;color:var(--text-light);transition:.15s;
}
#small-modal.task-modal-gold-v2 .tdm-asn-chip.active{ background:var(--track);border-color:var(--border);color:var(--text); }
#small-modal.task-modal-gold-v2 .tdm-asn-avatar{
  width:22px;height:22px;border-radius:6px;background:var(--gold-grad);color:var(--text);font-size:9px;font-weight:800;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
#small-modal.task-modal-gold-v2 .tdm-asn-name{ direction:ltr; }


#small-modal.task-modal-gold-v2 .tdm-footer{ display:flex;gap:10px;justify-content:flex-end; }
#small-modal.task-modal-gold-v2 .tdm-btn-ghost{
  padding:10px 20px;border:1.5px solid var(--btn-border);border-radius:10px;background:var(--card);color:var(--text-light);
  font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;
}
#small-modal.task-modal-gold-v2 .tdm-btn-primary{
  padding:10px 22px;background:var(--nav-hover);color:var(--ok-text);border:1px solid var(--ok);border-radius:10px;
  font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;
}

@media (max-width:768px){
  #small-modal.task-modal-gold-v2 .modal{ max-width:100%;width:100%;height:100%;max-height:100%;border-radius:0; }
  #small-modal.task-modal-gold-v2 .modal-body{
    padding-bottom:calc(88px + env(safe-area-inset-bottom,0px));
  }
  #small-modal.task-modal-gold-v2 .tdm-footer{
    position:fixed;bottom:0;left:0;right:0;background:var(--card2);border-top:1px solid var(--hairline);
    padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));z-index:5;
  }
  #small-modal.task-modal-gold-v2 .tdm-footer .tdm-btn-ghost,
  #small-modal.task-modal-gold-v2 .tdm-footer .tdm-btn-primary{ flex:1;min-height:44px; }
  #small-modal.task-modal-gold-v2 .tdm-grid-3{ grid-template-columns:1fr; }
  #small-modal.task-modal-gold-v2 .tdm-input,
  #small-modal.task-modal-gold-v2 .tdm-select,
  #small-modal.task-modal-gold-v2 #todo-due,
  #small-modal.task-modal-gold-v2 #todo-reminder{ min-height:44px; }
}


.agent-identity {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  vertical-align: middle;
}
.agent-identity-avatar,
.agent-inline-avatar {
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid rgba(120, 125, 133, .18);
  border-radius: 50%;
  background: #e5f5f1;
  color: var(--text-secondary);
  font-size: 9px;
  font-weight: 850;
  line-height: 1;
}
.agent-identity-avatar img,
.agent-inline-avatar img,
.crm-ll-avatar img,
.an-agent-avatar img,
.chat-avatar img,
.kpi-agent-avatar img,
.notes-avatar img,
.member-av img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.agent-identity-xs .agent-identity-avatar { width: 22px; height: 22px; }
.agent-inline-avatar {
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  flex: 0 0 22px !important;
  padding: 0 !important;
  border-radius: 50% !important;
}
.agent-identity-sm .agent-identity-avatar { width: 28px; height: 28px; }
.agent-identity-md .agent-identity-avatar { width: 36px; height: 36px; }
.agent-identity-lg .agent-identity-avatar { width: 46px; height: 46px; }
.agent-identity-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  text-align: start;
}
.agent-identity-copy strong {
  overflow: hidden;
  color: inherit;
  font: inherit;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.agent-identity-copy small {
  overflow: hidden;
  margin-top: 2px;
  color: var(--text-muted, var(--text-secondary));
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.has-agent-avatar {
  display: inline-flex !important;
  align-items: center;
  flex-direction: row !important;
  gap: 6px;
}
body.dark .agent-identity-avatar,
body.dark .agent-inline-avatar {
  border-color: rgba(211, 212, 222, .2);
  background: rgba(99, 104, 112, .22);
  color: var(--text);
}
@media (max-width: 720px) {
  .agent-identity { gap: 6px; }
  .agent-identity-sm .agent-identity-avatar { width: 26px; height: 26px; }
}




#topbar-alert-btn{
  position:relative;
  width:34px;height:34px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--border);color:var(--text-light);
  cursor:pointer;transition:.2s;flex-shrink:0;
}
body.light #topbar-alert-btn{ border-color:#e0dac9;color:#6B7280; }
body.dark  #topbar-alert-btn{ border-color:#3A3A3A;color:#B4B4B4; }
body.light #topbar-alert-btn:hover{ border-color:var(--neutral-border);color:#202123; }
body.dark  #topbar-alert-btn:hover{ border-color:var(--neutral-accent);color:#F2F2F2; }


#topbar-alert-btn #alert-badge{
  position:absolute;top:-5px;inset-inline-end:-5px;
  min-width:16px;height:16px;padding:0 4px;border-radius:99px;
  display:flex;align-items:center;justify-content:center;
  background:#e05252;color:#fff;
  font-size:9.5px;font-weight:800;line-height:1;
  border:1.5px solid var(--card,#fff);
  margin:0;
}
body.dark #topbar-alert-btn #alert-badge{ border-color:#171717; }


#alert-bell-panel{
  position:absolute;top:calc(100% + 8px);inset-inline-end:0;
  width:340px;max-height:min(460px,70vh);overflow-y:auto;z-index:400;
  border-radius:14px;padding:6px;
  background:var(--card,#fff);border:1px solid var(--border,var(--border));
  box-shadow:0 12px 32px rgba(0,0,0,.18);
}
body.light #alert-bell-panel{ background:#fffdf8;border-color:var(--border);box-shadow:0 12px 32px rgba(90,75,40,.14); }
body.dark  #alert-bell-panel{ background:#171717;border-color:#3A3A3A;box-shadow:0 12px 32px rgba(0,0,0,.55); }

.abell-head{
  display:flex;align-items:center;gap:7px;
  padding:9px 10px 10px;border-bottom:1px solid var(--border-light,var(--border));
  font-size:13px;font-weight:800;color:var(--text,#25282E);
}
body.dark .abell-head{ border-bottom-color:rgba(255,255,255,.06);color:#F2F2F2; }
.abell-fill{ flex:1; }
.abell-link{
  background:none;border:none;padding:0;cursor:pointer;font-family:inherit;
  font-size:11px;font-weight:600;color:var(--accent-text);
}
body.dark .abell-link{ color:var(--neutral-accent); }
.abell-link:hover{ text-decoration:underline; }

.abell-cap{
  padding:9px 10px 5px;
  font-size:10px;font-weight:700;letter-spacing:.1em;
  color:var(--text-muted,var(--text-secondary));
}

.abell-row{
  display:flex;align-items:flex-start;gap:8px;
  padding:9px 10px;border-radius:10px;cursor:pointer;transition:.15s;
  border-inline-end:2px solid transparent;
}
.abell-row:hover{ background:var(--active-pill,var(--bg)); }
body.dark .abell-row:hover{ background:#282112; }
.abell-row.abell-red{ border-inline-end-color:#e05252; }
.abell-row.abell-orange{ border-inline-end-color:#d8842e; }

.abell-ic{ display:flex;flex-shrink:0;margin-top:1px;color:var(--text-muted,var(--text-secondary)); }
.abell-row.abell-red .abell-ic{ color:#e05252; }
.abell-row.abell-orange .abell-ic{ color:#d8842e; }

.abell-body{ flex:1;min-width:0;display:flex;flex-direction:column;gap:2px; }
.abell-body b{
  font-size:12.5px;font-weight:700;color:var(--text,#25282E);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
body.dark .abell-body b{ color:#F2F2F2; }
.abell-body span{ font-size:11px;color:var(--text-muted,var(--text-secondary));line-height:1.5; }

.abell-tag{
  flex-shrink:0;font-size:9px;font-weight:700;padding:2px 7px;border-radius:99px;
  background:rgba(216,132,46,.14);color:#d8842e;
}
.abell-row.abell-red .abell-tag{ background:rgba(224,82,82,.14);color:#e05252; }


.abell-notif.is-unread .abell-body b{ color:var(--accent-text); }
body.dark .abell-notif.is-unread .abell-body b{ color:var(--neutral-accent); }
.abell-dot{
  width:6px;height:6px;border-radius:50%;background:var(--accent-soft);flex-shrink:0;margin-top:6px;
}
body.dark .abell-dot{ background:var(--neutral-accent); }

.abell-empty{
  display:flex;align-items:center;justify-content:center;gap:7px;
  padding:30px 10px;color:var(--text-muted,var(--text-secondary));font-size:12.5px;
}
.abell-empty svg{ color:var(--accent-text); }
body.dark .abell-empty svg{ color:var(--neutral-accent); }

.abell-foot{
  padding:8px 6px 4px;margin-top:4px;
  border-top:1px solid var(--border-light,var(--border));text-align:center;
}
body.dark .abell-foot{ border-top-color:rgba(255,255,255,.06); }
.abell-foot button{
  background:none;border:none;cursor:pointer;font-family:inherit;
  font-size:11.5px;font-weight:600;color:var(--text-muted,var(--text-secondary));padding:6px;
}
.abell-foot button:hover{ color:var(--accent-text); }
body.dark .abell-foot button:hover{ color:var(--neutral-accent); }


@media(max-width:640px){
  #alert-bell-panel{
    position:fixed;top:60px;inset-inline:10px;width:auto;max-height:70vh;
  }
}
.abell-avatar {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 9px;
  object-fit: cover;
}
.abell-avatar-fallback {
  display: grid;
  place-items: center;
  background: color-mix(in srgb,var(--primary) 12%,var(--card));
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
}




.lead-modal-overlay{
  position:fixed;inset:0;z-index:120;
  background:rgba(0,0,0,.6);
  display:flex;align-items:stretch;
  animation:none;
  perspective:2200px;
  direction:ltr;                 
  justify-content:flex-end;      
}
html[dir="rtl"] .lead-modal-overlay{ justify-content:flex-start; }  
@keyframes lmFade{ from{opacity:0} to{opacity:1} }

.lead-modal{
  width:min(66vw,1120px);height:100vh;
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--lm-bg);
  animation:none;
  
  transform-origin:right center;
  border-left:1px solid var(--lm-border-gold);
  box-shadow:-40px 0 90px rgba(0,0,0,.55);
}
html[dir="rtl"] .lead-modal{
  transform-origin:left center;
  border-left:none;border-right:1px solid var(--lm-border-gold);
  box-shadow:40px 0 90px rgba(0,0,0,.55);
  animation:none;
}
.lead-modal.closing{ animation:lmDoorClose .4s cubic-bezier(.5,0,.75,.4) both; }
html[dir="rtl"] .lead-modal.closing{ animation-name:lmDoorCloseRtl; }


@keyframes lmDoorOpen    { 0%{transform:rotateY(105deg);opacity:.4}  100%{transform:rotateY(0);opacity:1} }
@keyframes lmDoorClose   { 0%{transform:rotateY(0);opacity:1}        100%{transform:rotateY(105deg);opacity:0} }
@keyframes lmDoorOpenRtl { 0%{transform:rotateY(-105deg);opacity:.4} 100%{transform:rotateY(0);opacity:1} }
@keyframes lmDoorCloseRtl{ 0%{transform:rotateY(0);opacity:1}        100%{transform:rotateY(-105deg);opacity:0} }

@media (prefers-reduced-motion:reduce){
  .lead-modal,.lead-modal.closing{ animation:lmFade .2s ease both!important; }
}


.lead-modal-overlay{
  --lm-bg:#fffdf8; --lm-surface:#faf8f3; --lm-card:#fffdf8;
  --lm-border:#E7E8F2; --lm-border-gold:var(--neutral-border); --lm-track:#E7E8F2;
  --lm-text:#202123; --lm-muted:#6B7280; --lm-faint:#98917f;
  --lm-gold:var(--neutral-accent); --lm-gold-light:var(--neutral-accent); --lm-pill:#E6E7F1;
  --lm-ok:#5a7d33; --lm-warn-text:#c2740f; --lm-warn-bg:#f7efdc;
  --lm-blue:#2f6f9f; --lm-blue-bg:#EEEFF9;
  --lm-danger:#c0484a; --lm-danger-bg:#f7e7e7;
  --lm-wa:#1f7a52; --lm-wa-bg:#e4f2ea; --lm-wa-text:#1f7a52;
}
body.dark .lead-modal-overlay{
  --lm-bg:#0f0e0c; --lm-surface:#131110; --lm-card:#171717;
  --lm-border:#262626; --lm-border-gold:var(--neutral-border); --lm-track:#221f1a;
  --lm-text:#F2F2F2; --lm-muted:#B4B4B4; --lm-faint:#948d7a;
  --lm-gold:var(--neutral-accent); --lm-gold-light:var(--neutral-accent); --lm-pill:#1B1C26;
  --lm-ok:var(--neutral-accent); --lm-warn-text:#d3a86a; --lm-warn-bg:#2c2110;
  --lm-blue:#8ab6d6; --lm-blue-bg:#1E2127;
  --lm-danger:#e05252; --lm-danger-bg:#3a1717;
  --lm-wa:#1f7a52; --lm-wa-bg:#12241c; --lm-wa-text:#7fd6a8;
}


.lm-header{
  display:flex;align-items:center;gap:12px;flex-shrink:0;
  padding:16px 24px;background:var(--lm-surface);border-bottom:1px solid var(--lm-border);
}
.lm-nav{ display:flex;gap:6px;flex-shrink:0; }
.lm-iconbtn{
  width:34px;height:34px;border-radius:99px;font-size:15px;cursor:pointer;
  background:transparent;border:1px solid var(--lm-border);color:var(--lm-muted);
  transition:border-color .2s,color .2s;font-family:inherit;
}
.lm-iconbtn:hover:not(:disabled){ border-color:var(--lm-gold);color:var(--lm-text); }
.lm-iconbtn:disabled{ opacity:.35;cursor:default; }
.lm-avatar{
  width:46px;height:46px;border-radius:99px;flex-shrink:0;
  display:grid;place-items:center;font-size:15px;font-weight:700;
  background:var(--lm-pill);border:1px solid var(--lm-border-gold);color:var(--lm-gold-light);
}
.lm-title{ flex:1;min-width:0;display:flex;flex-direction:column;gap:3px; }
.lm-title h2{ margin:0;font-size:18px;font-weight:700;color:var(--lm-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.lm-sub{ font-size:11.5px;color:var(--lm-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.lm-stage{
  flex-shrink:0;padding:5px 12px;border-radius:8px;white-space:nowrap;
  font-size:11px;font-weight:700;color:var(--stage-c);
  background:color-mix(in srgb, var(--stage-c) 14%, transparent);
}
.lm-wa,.lm-convert,.lm-edit,.lm-close{ flex-shrink:0;cursor:pointer;font-family:inherit; }
.lm-wa{
  background:var(--lm-wa-bg);border:1px solid var(--lm-wa);color:var(--lm-wa-text);
  border-radius:99px;padding:8px 18px;font-size:12px;font-weight:700;
}
.lm-edit{
  background:transparent;border:1px solid var(--lm-border);color:var(--lm-muted);
  border-radius:99px;padding:8px 16px;font-size:12px;font-weight:600;transition:.2s;
}
.lm-edit:hover{ border-color:var(--lm-gold);color:var(--lm-text); }
.lm-convert{
  background:linear-gradient(135deg,var(--lm-gold),var(--lm-gold-light));
  color:var(--text);border:none;border-radius:99px;padding:8px 18px;font-size:12px;font-weight:800;
}
.lm-close{
  width:36px;height:36px;border-radius:99px;font-size:16px;
  background:transparent;border:1px solid var(--lm-border);color:var(--lm-muted);transition:.2s;
}
.lm-close:hover{ border-color:var(--lm-gold);color:var(--lm-text); }


.lm-stats{
  display:grid;grid-template-columns:repeat(4,1fr);flex-shrink:0;
  background:var(--lm-surface);border-bottom:1px solid var(--lm-border);
}
.lm-stat{
  display:flex;flex-direction:column;gap:5px;
  padding:14px 20px;border-inline-start:1px solid var(--lm-border);
}
.lm-stat:first-child{ border-inline-start:none; }
.lm-stat .l{ font-size:10.5px;color:var(--lm-faint); }
.lm-stat .v{ font-size:13.5px;font-weight:700;color:var(--lm-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.lm-stat .v.ok{ color:var(--lm-ok); }
.lm-stat .v.gold{ color:var(--lm-gold-light); }
.lm-stat .v.ltr{ direction:ltr; }


.lm-body{ flex:1;overflow:auto;display:grid;grid-template-columns:1.35fr 1fr; }
.lm-col{ padding:22px 26px;display:flex;flex-direction:column;gap:22px;min-width:0; }
.lm-main{ border-inline-end:1px solid var(--lm-border); }
.lm-side{ background:var(--lm-surface); }

.lm-fields{ display:flex;flex-direction:column;gap:2px; }
.lm-field{
  display:flex;align-items:center;gap:12px;
  padding:9px 0;border-bottom:1px solid var(--lm-track);
}
.lm-field .k{ width:118px;flex-shrink:0;font-size:12px;color:var(--lm-faint); }
.lm-field .v{ flex:1;min-width:0;font-size:12.5px;color:var(--lm-text);overflow:hidden;text-overflow:ellipsis; }
.lm-field .v.muted{ color:var(--lm-muted); }
.lm-field .v.ok{ color:var(--lm-ok); }
.lm-field .v.gold{ color:var(--lm-gold-light);font-weight:700; }
.lm-field .v.ltr{ direction:ltr; }

.lm-block{ display:flex;flex-direction:column;gap:10px; }
.lm-section-title{ font-size:12.5px;font-weight:700;color:var(--lm-text); }
.lm-empty{ font-size:11.5px;color:var(--lm-faint); }
.lm-badge{
  align-self:flex-start;border-radius:99px;padding:5px 14px;font-size:12px;font-weight:600;
  background:var(--lm-warn-bg);color:var(--lm-warn-text);
}
.lm-btnrow{ display:flex;gap:8px;flex-wrap:wrap; }
.lm-trans{
  border-radius:10px;padding:8px 16px;font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;
  border:1px solid;transition:filter .15s;
}
.lm-trans:hover{ filter:brightness(1.12); }
.lm-trans.is-blue{ background:var(--lm-blue-bg);color:var(--lm-blue);border-color:var(--lm-blue); }
.lm-trans.is-red { background:var(--lm-danger-bg);color:var(--lm-danger);border-color:var(--lm-danger); }
.lm-trans.is-gold{ background:var(--lm-pill);color:var(--lm-gold-light);border-color:var(--lm-border-gold); }
.lm-trans.is-green{ background:var(--lm-wa-bg);color:var(--lm-wa-text);border-color:var(--lm-wa); }
.lm-ghost{
  border-radius:10px;padding:7px 14px;font-size:11.5px;font-weight:600;cursor:pointer;font-family:inherit;
  background:transparent;border:1px solid var(--lm-border);color:var(--lm-muted);transition:.15s;
}
.lm-ghost:hover{ border-color:var(--lm-gold);color:var(--lm-text); }
.lm-widget-actions{display:flex;flex-wrap:wrap;gap:8px}
.lm-bp-status{font-size:11.5px;line-height:1.55;color:var(--lm-muted);padding:10px 12px;border:1px solid var(--lm-border);border-radius:10px;background:var(--lm-card)}
.lm-bp-status.is-error{color:var(--lm-danger);border-color:var(--lm-danger)}
.lm-bp-status button{border:0;background:none;color:inherit;text-decoration:underline;cursor:pointer}
.lm-bp-process{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-radius:10px;background:var(--lm-card);border:1px solid var(--lm-border)}
.lm-bp-process span{font-size:11px;color:var(--lm-muted)}
.lm-bp-process b{font-size:12px;color:var(--lm-text)}
.lm-bp-message{margin-bottom:12px;padding:10px 12px;border-radius:9px;background:#fff7df;color:#7a5714;font-size:12px;line-height:1.55}
.lm-bp-confirm{font-size:13px;line-height:1.6;color:var(--text)}
.lm-bp-check{display:flex;align-items:center;gap:8px;margin:12px 0;font-size:12px}


#small-modal.blueprint-modal-v1{
  --bp-accent:#747981;
  --bp-accent-soft:#EDEEF6;
  --bp-border:#E2E3ED;
  --bp-muted:#68778a;
}
#small-modal.blueprint-modal-v1 .modal{
  width:min(760px,calc(100vw - 32px));
  max-width:760px !important;
  max-height:min(860px,calc(100vh - 32px));
  overflow:hidden;
  animation:none !important;
}
#small-modal.blueprint-modal-v1 .modal-header{
  flex:0 0 auto;
  padding:18px 22px;
  border-bottom:1px solid var(--bp-border);
}
#small-modal.blueprint-modal-v1 .modal-title{
  font-size:16px;
  font-weight:750;
  letter-spacing:-.01em;
}
#small-modal.blueprint-modal-v1 .modal-body{
  overflow:auto;
  padding:22px;
  scrollbar-gutter:stable;
}
#small-modal.blueprint-modal-v1 .modal-footer{
  flex:0 0 auto;
  padding:14px 22px;
  border-top:1px solid var(--bp-border);
  background:var(--card,#fff);
}
#small-modal.blueprint-modal-v1 .lm-bp-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px 16px;
}
#small-modal.blueprint-modal-v1 .lm-bp-field{
  min-width:0;
}
#small-modal.blueprint-modal-v1 .lm-bp-field.is-wide{
  grid-column:1/-1;
}
#small-modal.blueprint-modal-v1 .lm-bp-label{
  display:flex;
  align-items:center;
  gap:4px;
  margin:0 0 7px;
  color:var(--text);
  font-size:12px;
  font-weight:700;
  line-height:1.35;
}
#small-modal.blueprint-modal-v1 .lm-bp-label span{
  color:var(--danger);
}
#small-modal.blueprint-modal-v1 .lm-bp-control{
  box-sizing:border-box;
  display:block;
  width:100%;
  height:44px;
  min-width:0;
  padding:0 12px;
  border:1px solid var(--bp-border);
  border-radius:10px;
  outline:none;
  background:var(--card,#fff);
  color:var(--text);
  font:inherit;
  font-size:13px;
  transition:border-color .12s ease,box-shadow .12s ease;
}
#small-modal.blueprint-modal-v1 .lm-bp-control:focus{
  border-color:var(--bp-accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--bp-accent) 13%,transparent);
}
#small-modal.blueprint-modal-v1 .lm-bp-control:disabled{
  cursor:not-allowed;
  opacity:.64;
  background:var(--bg);
}
#small-modal.blueprint-modal-v1 .lm-bp-help{
  display:block;
  margin-top:6px;
  color:var(--bp-muted);
  font-size:10.5px;
  line-height:1.4;
}
#small-modal.blueprint-modal-v1 .lm-bp-multi{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  min-height:44px;
  padding:7px;
  border:1px solid var(--bp-border);
  border-radius:10px;
  background:var(--card,#fff);
}
#small-modal.blueprint-modal-v1 .lm-bp-option{
  position:relative;
  cursor:pointer;
}
#small-modal.blueprint-modal-v1 .lm-bp-option input{
  position:absolute;
  inline-size:1px;
  block-size:1px;
  opacity:0;
  pointer-events:none;
}
#small-modal.blueprint-modal-v1 .lm-bp-option span{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:4px 10px;
  border:1px solid var(--bp-border);
  border-radius:999px;
  color:var(--bp-muted);
  background:var(--bg,#F8F9FF);
  font-size:11.5px;
  font-weight:650;
  transition:border-color .12s ease,background .12s ease,color .12s ease;
}
#small-modal.blueprint-modal-v1 .lm-bp-option input:focus-visible+span{
  outline:2px solid var(--bp-accent);
  outline-offset:2px;
}
#small-modal.blueprint-modal-v1 .lm-bp-option input:checked+span{
  border-color:color-mix(in srgb,var(--bp-accent) 45%,transparent);
  background:var(--bp-accent-soft);
  color:#5E636B;
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-picker{
  position:relative;
  border:1px solid var(--bp-border);
  border-radius:10px;
  background:var(--card,#fff);
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-picker>summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:44px;
  padding:0 12px;
  cursor:pointer;
  list-style:none;
  color:var(--text);
  font-size:13px;
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-picker>summary::-webkit-details-marker{
  display:none;
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-picker>summary>span:last-child{
  color:var(--bp-muted);
  font-size:17px;
  transition:transform .12s ease;
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-picker[open]>summary>span:last-child{
  transform:rotate(180deg);
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-picker[open]{
  border-color:var(--bp-accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--bp-accent) 10%,transparent);
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-panel{
  padding:10px;
  border-top:1px solid var(--bp-border);
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-search{
  box-sizing:border-box;
  width:100%;
  height:38px;
  margin-bottom:9px;
  padding:0 10px;
  border:1px solid var(--bp-border);
  border-radius:8px;
  outline:none;
  background:var(--card,#fff);
  color:var(--text);
  font:inherit;
  font-size:12px;
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-search:focus{
  border-color:var(--bp-accent);
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  max-height:240px;
  overflow:auto;
  padding:2px;
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-list .lm-bp-option span{
  box-sizing:border-box;
  width:100%;
  justify-content:flex-start;
  border-radius:8px;
}
#small-modal.blueprint-modal-v1 .lm-bp-multi-list .lm-bp-option[hidden]{
  display:none;
}
#small-modal.blueprint-modal-v1 .lm-bp-field-check{
  display:flex;
  align-items:flex-end;
}
#small-modal.blueprint-modal-v1 .lm-bp-check{
  display:flex;
  align-items:center;
  gap:9px;
  min-height:44px;
  margin:0;
  font-size:12px;
  font-weight:650;
}
#small-modal.blueprint-modal-v1 .lm-bp-check input{
  width:17px;
  height:17px;
  accent-color:var(--bp-accent);
}
#small-modal.blueprint-modal-v1 .lm-bp-field.is-invalid .lm-bp-control,
#small-modal.blueprint-modal-v1 .lm-bp-field.is-invalid .lm-bp-multi{
  border-color:var(--danger);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--danger-light) 10%,transparent);
}
#small-modal.blueprint-modal-v1 .lm-bp-message{
  margin:0 0 18px;
}

@media(max-width:640px){
  #small-modal.blueprint-modal-v1{
    align-items:flex-end;
    padding:0;
  }
  #small-modal.blueprint-modal-v1 .modal{
    width:100%;
    max-width:none !important;
    max-height:92dvh;
    border-radius:18px 18px 0 0;
  }
  #small-modal.blueprint-modal-v1 .modal-header,
  #small-modal.blueprint-modal-v1 .modal-body,
  #small-modal.blueprint-modal-v1 .modal-footer{
    padding-inline:16px;
  }
  #small-modal.blueprint-modal-v1 .lm-bp-form-grid{
    grid-template-columns:minmax(0,1fr);
    gap:15px;
  }
  #small-modal.blueprint-modal-v1 .lm-bp-field.is-wide{
    grid-column:auto;
  }
  #small-modal.blueprint-modal-v1 .lm-bp-multi-list{
    grid-template-columns:minmax(0,1fr);
  }
  #small-modal.blueprint-modal-v1 .modal-footer .btn{
    flex:1 1 0;
    justify-content:center;
  }
}

.lm-tags{ display:flex;gap:6px;flex-wrap:wrap;align-items:center; }
.lm-tag{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px;border-radius:99px;font-size:11px;font-weight:600;
  background:var(--lm-pill);border:1px solid var(--lm-border-gold);color:var(--lm-gold-light);
}
.lm-tag button{ background:none;border:none;padding:0;cursor:pointer;color:inherit;opacity:.6;font-size:10px; }
.lm-tag button:hover{ opacity:1; }
.lm-tag-add{
  width:24px;height:24px;border-radius:99px;cursor:pointer;font-family:inherit;font-size:13px;
  background:transparent;border:1px dashed var(--lm-border-gold);color:var(--lm-gold-light);
}

.lm-mini{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 0;border-bottom:1px solid var(--lm-track);
}
.lm-mini b{ font-size:12.5px;font-weight:600;color:var(--lm-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.lm-mini span{ font-size:10.5px;color:var(--lm-faint);flex-shrink:0;white-space:nowrap; }

.lm-note{
  background:var(--lm-card);border:1px solid var(--lm-border);border-radius:99px;
  padding:10px 15px;color:var(--lm-text);font-family:inherit;font-size:12px;outline:none;
}
.lm-note:focus{ border-color:var(--lm-gold); }
.lm-note-item{ display:flex;flex-direction:column;gap:2px;padding:7px 0;border-bottom:1px solid var(--lm-track); }
.lm-note-item .t{ font-size:12px;color:var(--lm-text);line-height:1.6; }
.lm-note-item .m{ font-size:10px;color:var(--lm-faint); }


.lm-tl{ display:flex;gap:11px; }
.lm-tl .rail{ display:flex;flex-direction:column;align-items:center;flex-shrink:0; }
.lm-tl .dot{ width:8px;height:8px;border-radius:99px;margin-top:5px; }
.lm-tl .line{ flex:1;width:1px;background:var(--lm-track);margin-top:4px; }
.lm-tl .body{ flex:1;min-width:0;padding-bottom:12px;display:flex;flex-direction:column;gap:3px; }
.lm-tl .time{ font-size:10.5px;color:var(--lm-faint); }
.lm-tl .text{ font-size:12px;color:var(--lm-muted);line-height:1.7; }


@media(max-width:900px){
  .lead-modal{
    width:100vw;animation:lmFade .25s ease both!important;
    border:none;box-shadow:none;
  }
  .lm-body{ grid-template-columns:1fr; }
  .lm-main{ border-inline-end:none;border-bottom:1px solid var(--lm-border); }
  .lm-stats{ grid-template-columns:repeat(2,1fr); }
  .lm-stat:nth-child(3){ border-inline-start:none; }
  .lm-stat:nth-child(n+3){ border-top:1px solid var(--lm-border); }
  .lm-header{ padding:12px 14px;gap:8px;flex-wrap:wrap; }
  .lm-title h2{ font-size:16px; }
  .lm-col{ padding:18px 16px; }
}










#page-learn .card, #page-course .card, #page-quiz .card, #page-kb .card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
}

#page-learn .btn, #page-course .btn, #page-quiz .btn, #page-kb .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  height: 2.5rem;
  padding: 0 1rem;
  border: 1px solid transparent;
  border-radius: var(--r-md);
  font: inherit;
  font-size: .875rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--dur) var(--ease);
}
#page-learn .btn.sm, #page-course .btn.sm, #page-quiz .btn.sm, #page-kb .btn.sm { height: 2rem; padding: 0 .7rem; font-size: .8rem; }

#page-learn .btn-gold, #page-course .btn-gold, #page-quiz .btn-gold, #page-kb .btn-gold {
  background: var(--gold-grad);
  color: #171717;
  border-color: var(--border-gold);
}
#page-learn .btn-gold:hover, #page-course .btn-gold:hover, #page-quiz .btn-gold:hover, #page-kb .btn-gold:hover { filter: brightness(1.08); }
#page-learn .btn-ghost, #page-course .btn-ghost, #page-quiz .btn-ghost, #page-kb .btn-ghost { background: var(--card2); color: var(--text); border-color: var(--border); }
#page-learn .btn-ghost:hover, #page-course .btn-ghost:hover, #page-quiz .btn-ghost:hover, #page-kb .btn-ghost:hover { border-color: var(--text3); }
#page-learn .btn-quiet, #page-course .btn-quiet, #page-quiz .btn-quiet, #page-kb .btn-quiet { background: transparent; color: var(--text2); }
#page-learn .btn-quiet:hover, #page-course .btn-quiet:hover, #page-quiz .btn-quiet:hover, #page-kb .btn-quiet:hover { background: var(--card2); color: var(--text); }
#page-learn .btn-danger, #page-course .btn-danger, #page-quiz .btn-danger, #page-kb .btn-danger { background: var(--acc-danger-bg); color: var(--acc-danger-text); border-color: transparent; }
#page-learn .btn:disabled, #page-course .btn:disabled, #page-quiz .btn:disabled, #page-kb .btn:disabled { opacity: .4; cursor: not-allowed; }

#page-learn .pill, #page-course .pill, #page-quiz .pill, #page-kb .pill {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .12rem .55rem;
  border-radius: var(--r-full);
  font-size: .72rem;
  font-weight: 600;
  line-height: 1.6;
  white-space: nowrap;
}
#page-learn .pill-gold, #page-course .pill-gold, #page-quiz .pill-gold, #page-kb .pill-gold { background: var(--active-pill); color: var(--gold-light); border: 1px solid var(--border-gold); }
#page-learn .pill-ok, #page-course .pill-ok, #page-quiz .pill-ok, #page-kb .pill-ok { background: var(--ok);           color: var(--ok-text); }
#page-learn .pill-warn, #page-course .pill-warn, #page-quiz .pill-warn, #page-kb .pill-warn { background: var(--acc-warning-bg); color: var(--acc-warning-text); }
#page-learn .pill-danger, #page-course .pill-danger, #page-quiz .pill-danger, #page-kb .pill-danger { background: var(--acc-danger-bg);  color: var(--acc-danger-text); }
#page-learn .pill-muted, #page-course .pill-muted, #page-quiz .pill-muted, #page-kb .pill-muted { background: var(--card2);       color: var(--text3); }


#page-learn .prog, #page-course .prog, #page-quiz .prog, #page-kb .prog { height: .375rem; background: var(--track); border-radius: var(--r-full); overflow: hidden; }
#page-learn .prog > span, #page-course .prog > span, #page-quiz .prog > span, #page-kb .prog > span {
  display: block;
  height: 100%;
  border-radius: var(--r-full);
  background: var(--gold-grad);
  transition: width 500ms var(--ease);
}
#page-learn .prog.ok   > span, #page-course .prog.ok   > span, #page-quiz .prog.ok   > span, #page-kb .prog.ok   > span { background: var(--ok-text); }
#page-learn .prog.late > span, #page-course .prog.late > span, #page-quiz .prog.late > span, #page-kb .prog.late > span { background: var(--acc-danger-text); }
#page-learn .prog.thin, #page-course .prog.thin, #page-quiz .prog.thin, #page-kb .prog.thin { height: .175rem; border-radius: 0; }

#page-learn .sec-title, #page-course .sec-title, #page-quiz .sec-title, #page-kb .sec-title {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--text3);
  margin: 0 0 .8rem;
}
#page-learn .page-title, #page-course .page-title, #page-quiz .page-title, #page-kb .page-title { font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em; margin: 0 0 .2rem; }
#page-learn .page-sub, #page-course .page-sub, #page-quiz .page-sub, #page-kb .page-sub { color: var(--text2); font-size: .9rem; margin: 0 0 1.5rem; }
#page-learn .muted, #page-course .muted, #page-quiz .muted, #page-kb .muted { color: var(--text2); }
#page-learn .dim, #page-course .dim, #page-quiz .dim, #page-kb .dim { color: var(--text3); }
#page-learn .small, #page-course .small, #page-quiz .small, #page-kb .small { font-size: .82rem; }
#page-learn .xs, #page-course .xs, #page-quiz .xs, #page-kb .xs { font-size: .72rem; }
#page-learn .row, #page-course .row, #page-quiz .row, #page-kb .row { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
#page-learn .between, #page-course .between, #page-quiz .between, #page-kb .between { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }

#page-learn .avatar, #page-course .avatar, #page-quiz .avatar, #page-kb .avatar {
  width: 1.75rem; height: 1.75rem; flex: none;
  border-radius: var(--r-full);
  display: grid; place-items: center;
  background: var(--card2);
  color: var(--text2);
  font-size: .68rem; font-weight: 700;
  border: 1px solid var(--border);
}

#page-learn table, #page-course table, #page-quiz table, #page-kb table { width: 100%; border-collapse: collapse; font-size: .85rem; }
#page-learn thead th, #page-course thead th, #page-quiz thead th, #page-kb thead th {
  text-align: start;
  padding: .55rem .9rem;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--text3);
  background: var(--card2);
  border-bottom: 1px solid var(--border);
}
#page-learn tbody td, #page-course tbody td, #page-quiz tbody td, #page-kb tbody td { padding: .55rem .9rem; border-bottom: 1px solid var(--border); }
#page-learn tbody tr:last-child td, #page-course tbody tr:last-child td, #page-quiz tbody tr:last-child td, #page-kb tbody tr:last-child td { border-bottom: 0; }
#page-learn tbody tr:hover, #page-course tbody tr:hover, #page-quiz tbody tr:hover, #page-kb tbody tr:hover { background: var(--card2); }

#page-learn .empty, #page-course .empty, #page-quiz .empty, #page-kb .empty {
  padding: 3rem 1rem;
  text-align: center;
  color: var(--text3);
}
#page-learn .empty svg, #page-course .empty svg, #page-quiz .empty svg, #page-kb .empty svg { opacity: .4; margin-bottom: .75rem; }





/* --bg/--card/--border/--text used to be redeclared here with the module's own near-white-on-white
   (light) / close-value (dark) values, independent of the rest of the app's canvas-vs-card system.
   That is why cards blended into the page: --bg #FAFAF9 next to --card #FFFFFF is a ~2% luminance
   step, versus the app-wide --enterprise-canvas (#E6E7F1) against --enterprise-surface (#FFFFFF)
   everywhere else. Removing them lets #content .page's shared enterprise tokens apply instead —
   same background, same card surface, same border as every other page. --text2 has no same-named
   equivalent in that shared system, so it is remapped rather than dropped. */
body.dark #page-learn,
body.dark #page-course,
body.dark #page-quiz,
body.dark #page-kb {
  --bg2:           #141414;
  --text2:         var(--text-light);
  --border-strong: #3A3A3A;
  --text3:         #6E6E6E;
}
body.light #page-learn,
body.light #page-course,
body.light #page-quiz,
body.light #page-kb {
  --bg2:           #FFFFFF;
  --text2:         var(--text-light);
  --border-strong: #D6D3D1;
  --text3:         #A8A29E;
}

body:not(.light):not(.dark) #page-learn,
body:not(.light):not(.dark) #page-course,
body:not(.light):not(.dark) #page-quiz,
body:not(.light):not(.dark) #page-kb {
  --bg:            #0F0F0F;
  --bg2:           #141414;
  --card:          #1A1A1A;
  --card2:         #202020;
  --border:        #2A2A2A;
  --border-strong: #3A3A3A;
  --text:          #EDEDED;
  --text2:         #A1A1A1;
  --text3:         #6E6E6E;
  --track:         #262626;
  --gold:          var(--neutral-accent);
  --gold-light:    var(--neutral-accent);
  --gold-grad:     linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:   rgba(201,164,76,.12);
  --border-gold:   rgba(201,164,76,.28);
  --ok: var(--accent-soft);
  --ok-text:       #4ADE80;
  --acc-warning-bg:   rgba(245,158,11,.13);
  --acc-warning-text: #FBBF24;
  --acc-danger-bg:    rgba(239,68,68,.12);
  --acc-danger-text:  #F87171;
}

#page-learn,
#page-course,
#page-quiz,
#page-kb {
  /* Was a hardcoded Vazirmatn stack regardless of interface language. --font now follows the same
     per-language cascade as <body> (see the html[lang] rules just below) instead of a page-private
     choice; the two SVG quiz-ring labels that read this variable directly (font: … var(--font))
     pick it up automatically. */
  --font:    Inter, "Segoe UI", Tahoma, Arial, sans-serif;
  --mono:    ui-monospace, 'SF Mono', Menlo, monospace;
  --r-sm:    6px;
  --r-md:    10px;
  --r-lg:    14px;
  --r-full:  999px;
  --measure: 70ch;
  --ease:    cubic-bezier(.16,1,.3,1);
  --dur:     200ms;
  --topbar-h: 3.5rem;

  font-family: var(--font);
  color: var(--text);
}
html[lang="fa"] #page-learn, html[lang="fa"] #page-course, html[lang="fa"] #page-quiz, html[lang="fa"] #page-kb { --font: IRANYekan, sans-serif; }
html[lang="ar"] #page-learn, html[lang="ar"] #page-course, html[lang="ar"] #page-quiz, html[lang="ar"] #page-kb { --font: "Noto Naskh Arabic", "Segoe UI", Tahoma, Arial, sans-serif; }






body.dark #page-learn.learn-gold-v2 {
  --gold:              var(--neutral-accent);
  --gold-light:        var(--neutral-accent);
  --gold-grad:         linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:       rgba(201,164,76,.12);
  --border-gold:       rgba(201,164,76,.28);
  --card2:             #202020;
  --track:             #262626;
  --ok: var(--accent-soft);
  --ok-text:           #4ADE80;
  --acc-warning-bg:    rgba(245,158,11,.13);
  --acc-warning-text:  #FBBF24;
  --acc-danger-bg:     rgba(239,68,68,.12);
  --acc-danger-text:   #F87171;
}

body.light #page-learn.learn-gold-v2 {
  --gold:              var(--neutral-accent);   
  --gold-light:        var(--neutral-accent);
  --gold-grad:         linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:       rgba(138,109,31,.10);
  --border-gold:       rgba(138,109,31,.25);
  --card2:             #F5F5F4;
  --track:             #E7E5E4;
  --ok: var(--accent-soft);
  --ok-text:           #15803D;
  --acc-warning-bg:    rgba(217,119,6,.10);
  --acc-warning-text:  #B45309;
  --acc-danger-bg:     rgba(220,38,38,.09);
  --acc-danger-text:   #B91C1C;
}

#page-learn .stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: .75rem;
  margin-bottom: 1.75rem;
}
#page-learn .stat {
  padding: .9rem 1rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  /* Every other card in the app (.card, .stat-card, …) carries this same elevation via the shared
     rule in the global page-shell block; .stat never picked it up because it uses its own class
     name. Without it, a border alone on a page-canvas that used to nearly match --card read as no
     separation at all. */
  box-shadow: var(--enterprise-shadow, 0 1px 2px rgba(19,22,28,.06));
}
#page-learn .stat .lab { font-size: .75rem; color: var(--text2); }
#page-learn .stat .num {
  font-size: 1.6rem; font-weight: 800; line-height: 1.4;
  letter-spacing: -.02em;
}

#page-learn .stat.hero .num { color: var(--gold-light); }

#page-learn .filters { display: flex; gap: .35rem; margin-bottom: 1rem; flex-wrap: wrap; }
#page-learn .filter {
  padding: .35rem .8rem;
  border: 1px solid var(--border);
  border-radius: var(--r-full);
  background: transparent;
  color: var(--text2);
  font: inherit; font-size: .8rem; font-weight: 500;
  cursor: pointer;
  transition: all var(--dur) var(--ease);
}
#page-learn .filter:hover { color: var(--text); border-color: var(--text3); }

#page-learn .filter.active {
  background: var(--active-pill);
  border-color: var(--border-gold);
  color: var(--gold-light);
  font-weight: 600;
}

#page-learn .courses {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}
@media (min-width: 700px)  { #page-learn .courses { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { #page-learn .courses { grid-template-columns: repeat(3, 1fr); } }
#page-learn .course {
  display: flex;
  flex-direction: column;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--enterprise-shadow, 0 1px 2px rgba(19,22,28,.06));
  overflow: hidden;
  cursor: pointer;
  transition: border-color var(--dur) var(--ease), transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
#page-learn .course:hover { border-color: var(--border-gold); transform: translateY(-2px); }

#page-learn .course .cover {
  height: 5.5rem;
  background: var(--card2);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: .3rem;
  position: relative;
}
#page-learn .course .cover .idx {
  font-size: 2.1rem; font-weight: 800; line-height: 1;
  color: var(--gold-light);
  align-self: center;
}
#page-learn .course .cover .idx-lab {
  font-size: .78rem; color: var(--text3);
  align-self: center;
}
#page-learn .course .cover .tag {
  position: absolute;
  inset-block-start: .6rem;
  inset-inline-end: .6rem;
}
#page-learn .course .body { padding: .9rem 1rem 1rem; display: flex; flex-direction: column; gap: .55rem; flex: 1; }
#page-learn .course h3 { margin: 0; font-size: .95rem; font-weight: 700; line-height: 1.6; }
#page-learn .course p { margin: 0; font-size: .8rem; color: var(--text2); line-height: 1.75; }

#page-learn .course .peek {
  list-style: none;
  margin: .15rem 0 0;
  padding: 0;
  flex: 1;
}
#page-learn .course .peek li {
  position: relative;
  padding-inline-start: .85rem;
  font-size: .76rem;
  line-height: 1.9;
  color: var(--text3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#page-learn .course .peek li::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: .72em;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--border-strong);
}
#page-learn .course .peek li.more { color: var(--text3); opacity: .75; font-style: italic; }
#page-learn .course .peek li.more::before { display: none; }
#page-learn .course .meta {
  display: flex; gap: .75rem;
  font-size: .72rem; color: var(--text3);
  padding-top: .5rem;
  border-top: 1px solid var(--border);
}
#page-learn .course .foot { margin-top: .1rem; }
#page-learn .course .foot .lbl {
  display: flex; justify-content: space-between;
  font-size: .72rem; color: var(--text3); margin-bottom: .3rem;
}

#page-learn .stat .num .of { font-size: .9rem; font-weight: 500; color: var(--text3); }





body.dark #page-course.course-gold-v2 {
  --gold:             var(--neutral-accent);
  --gold-light:       var(--neutral-accent);
  --gold-grad:        linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:      rgba(201,164,76,.12);
  --border-gold:      rgba(201,164,76,.28);
  --card2:            #202020;
  --track:            #262626;
  --ok: var(--accent-soft);
  --ok-text:          #4ADE80;
  --acc-warning-bg:   rgba(245,158,11,.13);
  --acc-warning-text: #FBBF24;
  --acc-danger-bg:    rgba(239,68,68,.12);
  --acc-danger-text:  #F87171;
}
body.light #page-course.course-gold-v2 {
  --gold:             var(--neutral-accent);
  --gold-light:       var(--neutral-accent);
  --gold-grad:        linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:      rgba(138,109,31,.10);
  --border-gold:      rgba(138,109,31,.25);
  --card2:            #F5F5F4;
  --track:            #E7E5E4;
  --ok: var(--accent-soft);
  --ok-text:          #15803D;
  --acc-warning-bg:   rgba(217,119,6,.10);
  --acc-warning-text: #B45309;
  --acc-danger-bg:    rgba(220,38,38,.09);
  --acc-danger-text:  #B91C1C;
}
#page-course .wrap {
  display: grid;
  grid-template-columns: 19rem 1fr;
  gap: 1.25rem;
  align-items: start;
}

#page-course .toc {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  overflow: hidden;
  position: sticky;
  top: calc(var(--topbar-h) + 1.5rem);
}
#page-course .toc .head { padding: 1rem; border-bottom: 1px solid var(--border); }
#page-course .toc .head .t { font-weight: 700; font-size: .9rem; margin-bottom: .75rem; line-height: 1.6; }
#page-course .toc .head .lbl {
  display: flex; justify-content: space-between;
  font-size: .75rem; color: var(--text2); margin-bottom: .35rem;
}
#page-course .toc .list { padding: .5rem; max-height: 26rem; overflow: auto; }
#page-course .lesson {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  width: 100%;
  padding: .55rem .6rem;
  border: 0;
  border-radius: var(--r-md);
  background: transparent;
  color: var(--text);
  font: inherit;
  text-align: start;
  cursor: pointer;
  transition: background var(--dur) var(--ease);
}
#page-course .lesson:hover { background: var(--card2); }

#page-course .lesson.current { background: var(--active-pill); }
#page-course .lesson.current .t { color: var(--gold-light); font-weight: 700; }
#page-course .lesson.locked { opacity: .45; pointer-events: none; }
#page-course .lesson .t { display: block; font-size: .85rem; line-height: 1.6; }
#page-course .lesson .m { display: block; font-size: .7rem; color: var(--text3); }
#page-course .tick {
  width: 1.1rem; height: 1.1rem; flex: none; margin-top: .3rem;
  border-radius: var(--r-full);
  border: 1.5px solid var(--border);
  display: grid; place-items: center;
  color: transparent;
}
#page-course .tick.done { background: var(--ok-text); border-color: var(--ok-text); color: var(--bg); }
#page-course .tick.current { border-color: var(--gold); border-width: 2px; }

#page-course .stage { display: flex; flex-direction: column; gap: 1.25rem; }
#page-course .video {
  aspect-ratio: 16 / 9;
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  background: radial-gradient(120% 120% at 70% 15%, #232323, #101010);
  display: grid; place-items: center;
  position: relative;
  overflow: hidden;
}
#page-course .play {
  width: 3.75rem; height: 3.75rem;
  border-radius: var(--r-full);
  border: 1px solid var(--border-gold);
  background: rgba(201,164,76,.14);
  backdrop-filter: blur(6px);
  color: var(--neutral-accent);
  display: grid; place-items: center;
  cursor: pointer;
  transition: transform var(--dur) var(--ease);
}
#page-course .play:hover { transform: scale(1.06); }
#page-course .video .dur {
  position: absolute;
  inset-block-end: .75rem; inset-inline-end: .75rem;
  padding: .1rem .45rem;
  border-radius: 5px;
  background: rgba(0,0,0,.6);
  color: #EDEDED;
  font-size: .7rem;
}

#page-course .chapter {
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .07em;
  color: var(--text3);
  padding: .9rem .6rem .35rem;
}
#page-course .list > .chapter:first-child { padding-top: .3rem; }

#page-course .lesson-body { max-width: var(--measure); }
#page-course .lesson-body .eyebrow {
  font-size: .7rem; font-weight: 700; letter-spacing: .06em;
  color: var(--gold); margin-bottom: .4rem;
}
#page-course .lesson-body h2 {
  font-size: 1.5rem; font-weight: 800; line-height: 1.6;
  margin: 0 0 .5rem; letter-spacing: -.02em;
}
#page-course .lesson-body .meta-row {
  display: flex; gap: .45rem;
  font-size: .75rem; color: var(--text3);
  padding-bottom: 1.25rem; margin-bottom: 1.25rem;
  border-bottom: 1px solid var(--border);
}

#page-course .lesson-body h2[id] {
  font-size: 1.1rem; font-weight: 700;
  margin: 1.9rem 0 .5rem;
  letter-spacing: 0;
  scroll-margin-top: 5rem;
}
#page-course .lesson-body p { color: var(--text2); margin: .7rem 0; line-height: 2; }
#page-course .lesson-body ul { margin: .7rem 0; padding-inline-start: 1.2rem; color: var(--text2); }
#page-course .lesson-body li { margin: .35rem 0; line-height: 1.9; }
#page-course .lesson-body li::marker { color: var(--gold); }

#page-course .quiz-gate {
  padding: 2.75rem 2rem;
  text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: .6rem;
}
#page-course .quiz-gate h2 { margin: .5rem 0 0; font-size: 1.3rem; font-weight: 700; }
#page-course .quiz-gate p { margin: 0; max-width: 28rem; }
#page-course .quiz-gate .btn { margin-top: 1rem; }
#page-course .navbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; padding-top: 1rem;
  border-top: 1px solid var(--border);
}
@media (max-width: 1000px) {
#page-course .wrap { grid-template-columns: 1fr; }
#page-course .toc { position: static; }
}





body.dark #page-quiz.quiz-gold-v2 {
  --gold:             var(--neutral-accent);
  --gold-light:       var(--neutral-accent);
  --gold-grad:        linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:      rgba(201,164,76,.12);
  --border-gold:      rgba(201,164,76,.28);
  --card2:            #202020;
  --track:            #262626;
  --ok: var(--accent-soft);
  --ok-text:          #4ADE80;
  --acc-warning-bg:   rgba(245,158,11,.13);
  --acc-warning-text: #FBBF24;
  --acc-danger-bg:    rgba(239,68,68,.12);
  --acc-danger-text:  #F87171;
}
body.light #page-quiz.quiz-gold-v2 {
  --gold:             var(--neutral-accent);
  --gold-light:       var(--neutral-accent);
  --gold-grad:        linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:      rgba(138,109,31,.10);
  --border-gold:      rgba(138,109,31,.25);
  --card2:            #F5F5F4;
  --track:            #E7E5E4;
  --ok: var(--accent-soft);
  --ok-text:          #15803D;
  --acc-warning-bg:   rgba(217,119,6,.10);
  --acc-warning-text: #B45309;
  --acc-danger-bg:    rgba(220,38,38,.09);
  --acc-danger-text:  #B91C1C;
}
#page-quiz .wrap { max-width: 42rem; margin: 0 auto; }
#page-quiz .head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; }
#page-quiz .head .n { font-weight: 700; font-size: .95rem; }
#page-quiz .head .sub { font-size: .72rem; color: var(--text3); }

#page-quiz .timer {
  display: flex; align-items: center; gap: .4rem;
  padding: .25rem .7rem;
  border-radius: var(--r-full);
  background: var(--card2);
  color: var(--text2);
  font-size: .82rem; font-weight: 600;
}
#page-quiz .timer.urgent { background: var(--acc-danger-bg); color: var(--acc-danger-text); }
#page-quiz .q { font-size: 1.15rem; font-weight: 700; line-height: 1.9; margin: 0 0 .3rem; }
#page-quiz .hint { font-size: .8rem; color: var(--text3); margin: 0 0 1.25rem; }

#page-quiz .opt {
  display: flex;
  align-items: center;
  gap: .75rem;
  width: 100%;
  padding: .8rem 1rem;
  margin-bottom: .55rem;
  border: 1.5px solid var(--border);
  border-radius: var(--r-md);
  background: var(--card);
  color: var(--text);
  font: inherit;
  font-size: .9rem;
  text-align: start;
  cursor: pointer;
  transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease);
}
#page-quiz .opt:hover { border-color: var(--text3); }

#page-quiz .opt.sel { border-color: var(--border-gold); background: var(--active-pill); }
#page-quiz .opt.correct { border-color: var(--ok-text);         background: var(--ok); }
#page-quiz .opt.wrong { border-color: var(--acc-danger-text); background: var(--acc-danger-bg); }
#page-quiz .opt .k {
  width: 1.6rem; height: 1.6rem; flex: none;
  border-radius: var(--r-full);
  border: 1.5px solid var(--border);
  display: grid; place-items: center;
  font-size: .72rem; font-weight: 700;
  color: var(--text3);
}
#page-quiz .opt.sel     .k { background: var(--gold); border-color: var(--gold); color: #171717; }
#page-quiz .opt.correct .k { background: var(--ok-text);         border-color: var(--ok-text);         color: var(--bg); }
#page-quiz .opt.wrong   .k { background: var(--acc-danger-text); border-color: var(--acc-danger-text); color: var(--bg); }

#page-quiz .opt .verdict { margin-inline-start: auto; font-size: .72rem; font-weight: 700; }
#page-quiz .opt.correct .verdict { color: var(--ok-text); }
#page-quiz .opt.wrong   .verdict { color: var(--acc-danger-text); }
#page-quiz .navbar {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 1.5rem; padding-top: 1rem;
  border-top: 1px solid var(--border);
}

#page-quiz .result { text-align: center; padding: 1rem 0; }
#page-quiz .ring { width: 7.5rem; height: 7.5rem; margin: 0 auto 1rem; }
#page-quiz .ring .track { stroke: var(--track); }
#page-quiz .ring .val { stroke: var(--ok-text); }
#page-quiz .ring.failed .val { stroke: var(--acc-danger-text); }
#page-quiz .ring .pct { fill: var(--text);  font: 800 26px var(--font); }
#page-quiz .ring .cap { fill: var(--text3); font: 500 11px var(--font); }
#page-quiz .review { text-align: start; margin-top: 1.75rem; }
#page-quiz .cert-code { font-size: .72rem; color: var(--text3); margin-top: 1rem; }





body.dark #page-kb.kb-gold-v2 {
  --gold:             var(--neutral-accent);
  --gold-light:       var(--neutral-accent);
  --gold-grad:        linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:      rgba(201,164,76,.12);
  --border-gold:      rgba(201,164,76,.28);
  --card2:            #202020;
  --track:            #262626;
  --ok: var(--accent-soft);
  --ok-text:          #4ADE80;
  --acc-warning-bg:   rgba(245,158,11,.13);
  --acc-warning-text: #FBBF24;
  --acc-danger-bg:    rgba(239,68,68,.12);
  --acc-danger-text:  #F87171;
}
body.light #page-kb.kb-gold-v2 {
  --gold:             var(--neutral-accent);
  --gold-light:       var(--neutral-accent);
  --gold-grad:        linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  --active-pill:      rgba(138,109,31,.10);
  --border-gold:      rgba(138,109,31,.25);
  --card2:            #F5F5F4;
  --track:            #E7E5E4;
  --ok: var(--accent-soft);
  --ok-text:          #15803D;
  --acc-warning-bg:   rgba(217,119,6,.10);
  --acc-warning-text: #B45309;
  --acc-danger-bg:    rgba(220,38,38,.09);
  --acc-danger-text:  #B91C1C;
}
#page-kb .wrap {
  display: grid;
  grid-template-columns: 15rem 1fr 13rem;
  gap: 1.5rem;
  align-items: start;
}

#page-kb .tree { position: sticky; top: calc(var(--topbar-h) + 1.5rem); }
#page-kb .tree .grp {
  font-size: .68rem; font-weight: 700; letter-spacing: .07em;
  color: var(--text3);
  padding: .9rem .5rem .3rem;
}
#page-kb .tree a {
  display: flex; align-items: center; gap: .45rem;
  padding: .35rem .55rem;
  border-radius: var(--r-md);
  color: var(--text2);
  font-size: .84rem;
  text-decoration: none;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
#page-kb .tree a:hover { background: var(--card2); color: var(--text); }

#page-kb .tree a.active {
  background: var(--active-pill);
  color: var(--gold-light);
  font-weight: 600;
}
#page-kb .tree .kid { padding-inline-start: .9rem; }
#page-kb .tree .subgrp {
  font-size: .7rem;
  font-weight: 600;
  color: var(--text2);
  padding: .6rem .55rem .2rem;
}

#page-kb .tree {
  max-height: calc(100vh - var(--topbar-h) - 4rem);
  overflow-y: auto;
  padding-inline-end: .35rem;
}

#page-kb .doc { max-width: var(--measure); }
#page-kb .doc h1 { font-size: 1.85rem; font-weight: 800; line-height: 1.6; margin: 0 0 .5rem; letter-spacing: -.02em; }
#page-kb .doc h2 { font-size: 1.15rem; font-weight: 700; margin: 2rem 0 .5rem; scroll-margin-top: 5rem; }
#page-kb .doc p { color: var(--text2); margin: .7rem 0; line-height: 2; }
#page-kb .doc ul { margin: .7rem 0; padding-inline-start: 1.2rem; color: var(--text2); }
#page-kb .doc li { margin: .35rem 0; line-height: 1.9; }
#page-kb .doc li::marker { color: var(--gold); }
#page-kb .doc pre {
  padding: .8rem 1rem;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--card2);
  overflow: auto;
  direction: ltr; text-align: left;
  font-size: .8rem; line-height: 1.7;
}
#page-kb .doc blockquote {
  margin: 1rem 0;
  padding: .7rem 1rem;
  border-inline-start: 3px solid var(--gold);
  border-radius: 0 var(--r-md) var(--r-md) 0;
  background: var(--active-pill);
  color: var(--text);
  font-size: .88rem;
}
#page-kb .byline {
  display: flex; align-items: center; gap: .55rem;
  color: var(--text3); font-size: .78rem;
  margin-bottom: 1.5rem;
}
#page-kb .draft-banner {
  display: flex; align-items: center; gap: .55rem;
  padding: .55rem .85rem;
  margin-bottom: 1.25rem;
  border-radius: var(--r-md);
  background: var(--acc-warning-bg);
  color: var(--acc-warning-text);
  font-size: .82rem; font-weight: 500;
}

#page-kb .toc { position: sticky; top: calc(var(--topbar-h) + 1.5rem); }
#page-kb .toc a {
  display: block;
  padding: .28rem .6rem;
  border-inline-start: 2px solid var(--border);
  color: var(--text3);
  font-size: .78rem;
  text-decoration: none;
}
#page-kb .toc a:hover { color: var(--text); }
#page-kb .toc a.on { border-inline-start-color: var(--gold); color: var(--gold-light); font-weight: 600; }
@media (max-width: 1100px) {
#page-kb .wrap { grid-template-columns: 1fr; }
#page-kb .toc { display: none; }
}



#page-learn, #page-course, #page-quiz, #page-kb { display: none; }
#page-learn.on, #page-course.on, #page-quiz.on, #page-kb.on {
  display: block;
  animation: pageFadeIn .28s cubic-bezier(.16, 1, .3, 1);
}
@media (prefers-reduced-motion: reduce) {
  #page-learn.on, #page-course.on, #page-quiz.on, #page-kb.on { animation: none; }
}



#page-search.srch-v1{
  --pf-line: var(--border);
  --pf-surface: var(--card);
  --pf-canvas: var(--bg);
  --pf-ink: var(--text);
  --pf-muted: var(--text-muted);
  --pf-gold: var(--gold);
  --pf-gold-soft: color-mix(in srgb, var(--gold) 14%, transparent);
  --filters-width: 300px;
  --assistant-width: 340px;
  --pf-radius: 14px;
  padding: 0;
}


#page-search .pf-shell{
  display: grid;
  grid-template-columns: var(--filters-width) var(--assistant-width) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}


#page-search .pf-sidebar{
  background: var(--pf-surface);
  border: 1px solid var(--pf-line);
  border-radius: var(--pf-radius);
  padding: 14px;
  position: sticky; top: 12px;
  max-height: calc(100vh - 90px);
  overflow-y: auto;
}
#page-search .filter-title,
.srch-drawer-filterset .filter-title{
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 11px; margin-bottom: 6px;
  border-bottom: 1px solid var(--pf-line);
}
#page-search .filter-title > b,
.srch-drawer-filterset .filter-title > b{ font-size: 13.5px; color: var(--pf-ink); }
#page-search .linkBtn,
.srch-drawer-filterset .linkBtn{
  background: none; border: none; cursor: pointer; font-family: inherit;
  font-size: 11.5px; font-weight: 600; color: var(--pf-gold);
}
#page-search .linkBtn:hover,
.srch-drawer-filterset .linkBtn:hover{ text-decoration: underline; }


#page-search .filter-section,
.srch-drawer-filterset .filter-section{ border-bottom: 1px solid var(--pf-line); }
#page-search .filter-section:last-of-type,
.srch-drawer-filterset .filter-section:last-of-type{ border-bottom: none; }
#page-search .filterToggle,
.srch-drawer-filterset .filterToggle{
  display: flex; align-items: center; gap: 8px;
  width: 100%; padding: 11px 2px; cursor: pointer;
  font-size: 12.5px; font-weight: 600; color: var(--pf-ink);
  list-style: none; user-select: none;
}
#page-search .filterToggle::-webkit-details-marker,
.srch-drawer-filterset .filterToggle::-webkit-details-marker{ display: none; }
#page-search .filterToggle:hover,
.srch-drawer-filterset .filterToggle:hover{ color: var(--pf-gold); }
#page-search .filterToggle .filterCaret,
.srch-drawer-filterset .filterToggle .filterCaret{
  margin-inline-start: auto; transition: transform .18s; color: var(--pf-muted); flex-shrink: 0;
}
#page-search details[open] > .filterToggle .filterCaret,
.srch-drawer-filterset details[open] > .filterToggle .filterCaret{ transform: rotate(180deg); }
#page-search .filterToggle .fn,
.srch-drawer-filterset .filterToggle .fn{
  min-width: 17px; padding: 0 5px; border-radius: 99px;
  background: var(--pf-gold-soft); color: var(--pf-gold);
  font-size: 10px; font-weight: 800; text-align: center;
}
#page-search .filterBody,
.srch-drawer-filterset .filterBody{ padding: 2px 2px 12px; }

#page-search .pf-check,
.srch-drawer-filterset .pf-check{
  display: flex; align-items: center; gap: 7px;
  padding: 5px 4px; border-radius: 8px; cursor: pointer;
  font-size: 12px; color: var(--pf-muted);
}
#page-search .pf-check:hover,
.srch-drawer-filterset .pf-check:hover{ background: var(--track); color: var(--pf-ink); }
#page-search .pf-check input,
.srch-drawer-filterset .pf-check input{ accent-color: var(--pf-gold); flex-shrink: 0; }
#page-search .pf-scroll,
.srch-drawer-filterset .pf-scroll{ max-height: 190px; overflow-y: auto; }

#page-search .pf-input,
.srch-drawer-filterset .pf-input{
  width: 100%; padding: 8px 10px;
  background: var(--pf-canvas); color: var(--pf-ink);
  border: 1px solid var(--pf-line); border-radius: 9px;
  font-family: inherit; font-size: 12px;
}
#page-search .pf-input:focus,
.srch-drawer-filterset .pf-input:focus{ outline: none; border-color: var(--pf-gold); }
#page-search .pf-range,
.srch-drawer-filterset .pf-range{ display: flex; align-items: center; gap: 6px; }
#page-search .pf-range span,
.srch-drawer-filterset .pf-range span{ color: var(--pf-muted); font-size: 11px; }

#page-search .showResultsBtn{
  width: 100%; margin-top: 14px;
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 11px; border: none; border-radius: 11px; cursor: pointer;
  background: var(--pf-gold); color: #1a1a1a;
  font-family: inherit; font-size: 13px; font-weight: 800;
}
#page-search .showResultsBtn:hover{ filter: brightness(1.08); }


#page-search .pf-assistant{
  display: flex; flex-direction: column;
  background: var(--pf-surface);
  border: 1px solid var(--pf-line);
  border-radius: var(--pf-radius);
  position: sticky; top: 12px;
  height: calc(100vh - 90px);
  overflow: hidden;
}
#page-search .asst-head{
  display: flex; align-items: center; gap: 10px;
  padding: 13px 14px; border-bottom: 1px solid var(--pf-line);
  background: var(--pf-gold-soft);
}
#page-search .asst-avatar{
  width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--pf-gold); color: #1a1a1a; font-size: 12px; font-weight: 800;
}
#page-search .asst-copy{ display: flex; flex-direction: column; min-width: 0; }
#page-search .asst-copy b{ font-size: 13px; color: var(--pf-ink); }
#page-search .asst-copy span{ font-size: 11px; color: var(--pf-muted); }
#page-search .asst-body{ flex: 1; overflow-y: auto; padding: 12px; }
#page-search .asst-msg{
  padding: 9px 11px; border-radius: 11px; margin-bottom: 8px;
  font-size: 12.5px; line-height: 1.75;
}
#page-search .asst-msg.me{ background: var(--pf-gold-soft); color: var(--pf-ink); margin-inline-start: 28px; }
#page-search .asst-msg.bot{ background: var(--track); color: var(--pf-ink); margin-inline-end: 28px; }
#page-search .asst-msg .k{ color: var(--pf-gold); font-weight: 700; }
#page-search .asst-hint{ font-size: 11.5px; color: var(--pf-muted); line-height: 2; }
#page-search .asst-input{
  display: flex; gap: 7px; padding: 11px; border-top: 1px solid var(--pf-line);
}
#page-search .asst-input input{
  flex: 1; min-width: 0; padding: 9px 11px;
  background: var(--pf-canvas); color: var(--pf-ink);
  border: 1px solid var(--pf-line); border-radius: 10px;
  font-family: inherit; font-size: 12.5px;
}
#page-search .asst-input input:focus{ outline: none; border-color: var(--pf-gold); }
#page-search .asst-send{
  width: 38px; flex-shrink: 0; border: none; border-radius: 10px; cursor: pointer;
  background: var(--pf-gold); color: #1a1a1a;
  display: flex; align-items: center; justify-content: center;
}
#page-search .asst-send:hover{ filter: brightness(1.08); }


#page-search .pf-mainhead{
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px;
}
#page-search .pf-mainhead-t{ display: flex; align-items: baseline; gap: 9px; }
#page-search .pf-mainhead-t h2{ font-size: 17px; font-weight: 800; color: var(--pf-ink); margin: 0; }
#page-search .pf-mainhead-t span{ font-size: 11.5px; color: var(--pf-muted); }
#page-search .pf-searchbox{
  position: relative; flex: 1; min-width: 200px; margin-inline-start: auto;
}
#page-search .pf-searchbox svg{
  position: absolute; inset-inline-start: 11px; top: 50%; transform: translateY(-50%);
  color: var(--pf-muted); pointer-events: none;
}
#page-search .pf-searchbox input{
  width: 100%; padding: 9px 12px; padding-inline-start: 32px;
  background: var(--pf-surface); color: var(--pf-ink);
  border: 1px solid var(--pf-line); border-radius: 10px;
  font-family: inherit; font-size: 12.5px;
}
#page-search .pf-searchbox input:focus{ outline: none; border-color: var(--pf-gold); }
#page-search .topChipBtn{
  display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0;
  padding: 9px 12px; border-radius: 10px; cursor: pointer; font-family: inherit;
  background: var(--pf-surface); border: 1px solid var(--pf-line);
  color: var(--pf-ink); font-size: 12px; font-weight: 700;
}
#page-search .topChipBtn:hover{ border-color: var(--pf-gold); color: var(--pf-gold); }
#page-search .topChipBtn .badge{
  min-width: 17px; padding: 1px 5px; border-radius: 99px;
  background: var(--pf-gold); color: #1a1a1a; font-size: 10px; font-weight: 800;
}

#page-search .activeFilterChips{ display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
#page-search .activeFilterChips:empty{ display: none; }
#page-search .afc{
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 9px; border-radius: 99px;
  background: var(--pf-gold-soft); border: 1px solid color-mix(in srgb, var(--gold) 30%, transparent);
  color: var(--pf-gold); font-size: 11px; font-weight: 700;
}
#page-search .afc button{
  background: none; border: none; cursor: pointer; color: inherit; padding: 0;
  display: flex; opacity: .7;
}
#page-search .afc button:hover{ opacity: 1; }

#page-search .pf-results{
  display: block;
}
.srch-table-wrap{
  overflow:auto;
  border:1px solid var(--pf-line, var(--border));
  border-radius:12px;
  background:var(--pf-surface, #fff);
  max-height:calc(100vh - 210px);
}
.srch-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.srch-table th{
  position:sticky;top:0;z-index:1;
  background:var(--head-bg, #f6f4ef);
  text-align:start;
  padding:10px 12px;
  font-size:11px;font-weight:700;color:var(--text-muted, #6b7280);
  white-space:nowrap;
  border-bottom:1px solid var(--pf-line, var(--border));
}
.srch-table td{
  padding:9px 12px;
  border-bottom:1px solid var(--pf-line, #F0F1FB);
  vertical-align:middle;
}
.srch-table tr:hover td{background:var(--row-hover, #faf8f3);cursor:pointer}
.srch-table tr.is-picked td{background:rgba(196,165,116,.12)}
.srch-check{width:36px;text-align:center}
.srch-namecell{display:flex;align-items:center;gap:10px;min-width:180px}
.srch-thumb,.srch-thumb img,.srch-thumb-empty{
  width:42px;height:42px;border-radius:8px;object-fit:cover;display:block;background:#EDEEF8;flex-shrink:0;
}
.srch-namecol{display:flex;flex-direction:column;gap:2px;min-width:0}
.srch-name{font-weight:700;color:var(--text,#111);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
.srch-sub{font-size:11px;color:var(--text-muted,#6b7280);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
.srch-price{font-weight:800;white-space:nowrap}
.srch-stat{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700}
.srch-actions{white-space:nowrap}
.srch-actions .pf-btn{margin-inline-end:6px}
.pwa-help-overlay{
  position:fixed;inset:0;z-index:120000;display:flex;align-items:center;justify-content:center;
  padding:20px;background:rgba(15,14,12,.45);
}
.pwa-help-overlay[hidden]{display:none!important}
.pwa-help-dialog{
  width:min(520px,100%);
  background:#fff;color:#111;border:1px solid var(--border);border-radius:16px;padding:18px 18px 16px;
}
.pwa-help-dialog header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.pwa-help-dialog h3{margin:0;font-size:16px;font-weight:800}
.pwa-help-close{border:0;background:transparent;font-size:18px;cursor:pointer;line-height:1}
#page-search .pf-card{
  display: flex; flex-direction: column;
  background: var(--pf-surface); border: 1px solid var(--pf-line);
  border-radius: var(--pf-radius); overflow: hidden;
  transition: .16s;
}
#page-search .pf-card:hover{ border-color: var(--pf-gold); transform: translateY(-2px); }
#page-search .pf-card.picked{ border-color: var(--pf-gold); box-shadow: 0 0 0 1px var(--pf-gold) inset; }
#page-search .pf-card-top{
  position: relative; height: 168px;
  display: flex; align-items: center; justify-content: center;
  background: repeating-linear-gradient(135deg, var(--track) 0 9px, transparent 9px 18px);
  color: var(--pf-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .08em;
}
#page-search .pf-card-top > img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  z-index:1;cursor:pointer;transition:transform .28s ease;
}
#page-search .pf-card:hover .pf-card-top > img{transform:scale(1.025)}
#page-search .pf-card-no-image{
  position:absolute;inset:0;z-index:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  color:var(--pf-muted);letter-spacing:.02em;
}
#page-search .pf-card-no-image svg{opacity:.5}
#page-search .pf-stat{
  position: absolute; z-index:2; top: 9px; inset-inline-start: 9px;
  padding: 3px 9px; border-radius: 99px;
  background: var(--stat-c, var(--pf-gold)); color: #1a1a1a;
  font-size: 10px; font-weight: 800;
}
#page-search .pf-photo-count{
  position:absolute;z-index:2;right:9px;bottom:9px;
  display:inline-flex;align-items:center;gap:5px;padding:6px 9px;
  border:1px solid rgba(255,255,255,.48);border-radius:999px;
  background:rgba(10,16,26,.74);color:#fff;font:700 11px/1 inherit;
  backdrop-filter:blur(8px);cursor:pointer;
}
#page-search .pf-photo-count:hover{background:rgba(10,16,26,.9)}
#page-search .pf-card-body{ padding: 12px 13px 0; flex: 1; }
#page-search .pf-price{ font-size: 17px; font-weight: 800; color: var(--pf-ink); }
#page-search .pf-name{ font-size: 13px; font-weight: 700; color: var(--pf-ink); margin: 3px 0 8px; line-height: 1.6; }
#page-search .pf-facts{
  display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 11.5px; color: var(--pf-muted);
}
#page-search .pf-facts .f{ display: inline-flex; align-items: center; gap: 4px; }
#page-search .pf-geo{ margin-top: 7px; font-size: 11.5px; color: var(--pf-muted); }
#page-search .pf-context{
  margin-top:6px;font-size:11px;line-height:1.45;color:var(--pf-muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#page-search .pf-owner{
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: 9px; padding-top: 9px; border-top: 1px solid var(--pf-line);
  font-size: 11px; color: var(--pf-muted);
}
#page-search .pf-card-actions{ display: flex; gap: 7px; padding: 11px 13px 13px; }
#page-search .pf-btn{
  flex: 1; padding: 8px; border-radius: 9px; cursor: pointer; font-family: inherit;
  font-size: 11.5px; font-weight: 700;
  background: none; border: 1px dashed var(--pf-line); color: var(--pf-muted);
}
#page-search .pf-btn:hover{ border-color: var(--pf-gold); color: var(--pf-gold); }
#page-search .pf-btn.on{
  background: var(--pf-gold-soft); border: 1px solid var(--pf-gold); color: var(--pf-gold);
}
#page-search .pf-btn.ghost{
  flex:0 0 auto;padding:8px 11px;border-style:solid;
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
}
#page-search .pf-btn.zoho{border-style:solid;border-color:#747981;color:#747981}
#page-search .pf-btn.zoho:hover,#page-search .pf-btn.zoho.on{background:#e7f5f1;border-color:#747981;color:#5E636B}
#page-search .pf-deal-context{
  grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:13px 15px;border:1px solid #D6D7E1;border-radius:12px;background:#eff9f6;
}
#page-search .pf-deal-context div{display:flex;flex-direction:column;gap:3px}
#page-search .pf-deal-context span{font-size:9px;letter-spacing:.14em;color:#747981;font-weight:800}
/* --pf-text is not defined anywhere, so this resolved to an inherited colour and the deal
   name was almost invisible on the banner's fixed light background - on the one element
   whose whole job is to say WHICH deal you are filling. A concrete ink is supplied. */
#page-search .pf-deal-context b{font-size:13px;color:var(--pf-text,#12241f)}

#page-search .pf-empty{
  grid-column: 1 / -1; text-align: center; padding: 44px 20px;
  color: var(--pf-muted); font-size: 13px;
}


.pf-amen-grid{
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 2px;
  max-height: 132px; overflow-y: auto;
  padding: 7px; border: 1px solid var(--border); border-radius: 9px;
}
.pf-amen-chk{
  display: flex; align-items: center; gap: 6px; padding: 3px 4px;
  font-size: 11.5px; color: var(--text-muted); cursor: pointer;
}
.pf-amen-chk input{ accent-color: var(--gold); }


@media (max-width: 1180px){
  #page-search .pf-shell{ grid-template-columns: var(--filters-width) minmax(0, 1fr); }
  #page-search .pf-assistant{ grid-column: 1 / -1; height: auto; max-height: 340px; position: static; }
}
@media (max-width: 900px){
  #page-search .pf-shell{ grid-template-columns: minmax(0, 1fr); }
  #page-search .pf-sidebar{ position: static; max-height: none; }
  #page-search .pf-results{ grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
}
@media (max-width: 520px){
  #page-search .pf-card-top{height:150px}
  #page-search .pf-btn.ghost span{display:none}
}


body.srch-pdf-open{overflow:hidden}
.srch-pdf-modal[hidden]{display:none}
.srch-pdf-modal{
  position:fixed;inset:0;z-index:var(--z-action-modal,400000);display:grid;place-items:center;padding:22px;
  background:rgba(4,8,12,.62);backdrop-filter:blur(5px);
  opacity:0;transition:opacity .2s ease;
}
.srch-pdf-modal.open{opacity:1}
.srch-pdf-dialog{
  position:relative;
  width:min(920px,100%);max-height:min(820px,calc(100vh - 44px));display:flex;flex-direction:column;
  overflow:hidden;background:var(--surface,#fff);color:var(--text,#17191c);
  border:1px solid var(--border,var(--border));border-radius:20px;
  box-shadow:0 28px 80px rgba(0,0,0,.28);
  transform:translateY(18px) scale(.985);transition:transform .24s cubic-bezier(.2,.8,.2,1);
}
.srch-pdf-modal.open .srch-pdf-dialog{transform:none}
.srch-pdf-status{
  position:absolute;z-index:5;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:14px;padding:32px;text-align:center;
  background:color-mix(in srgb,var(--surface,#fff) 92%,transparent);backdrop-filter:blur(3px);
  border-radius:20px;
}
.srch-pdf-status[hidden]{display:none}
.srch-pdf-status-spinner{
  width:34px;height:34px;border-radius:50%;
  border:3px solid color-mix(in srgb,var(--brand,#787D85) 22%,transparent);border-top-color:var(--brand,#787D85);
  animation:srch-pdf-spin .8s linear infinite;
}
@keyframes srch-pdf-spin{to{transform:rotate(360deg)}}
.srch-pdf-status-text{margin:0;font-size:13.5px;font-weight:700;color:var(--text,#17191c)}
.srch-pdf-status.is-error .srch-pdf-status-spinner{display:none}
.srch-pdf-status.is-error .srch-pdf-status-text{display:none}
.srch-pdf-status-error[hidden]{display:none}
.srch-pdf-status-error p{margin:0 0 14px;font-size:13px;line-height:1.5;color:var(--text-muted,#6b7280);max-width:360px}
.srch-pdf-status-actions{display:flex;gap:9px;justify-content:center}
.srch-pdf-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-shrink:0;
  padding:24px 26px 20px;border-bottom:1px solid var(--border,var(--border));
}
.srch-pdf-head h3{margin:3px 0 4px;font-size:24px;line-height:1.2}
.srch-pdf-head p{margin:0;color:var(--text-muted,#6b7280);font-size:13px}
.srch-pdf-kicker{font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--brand,#787D85)}
.srch-pdf-close{
  width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;
  border:1px solid var(--border,var(--border));border-radius:12px;background:transparent;color:inherit;cursor:pointer;
}
.srch-pdf-close:hover{background:var(--track,#f4f5f5)}
.srch-pdf-body{padding:22px 26px;overflow:auto;flex:1 1 auto;min-height:0;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:26px}
.srch-pdf-section-title{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}
.srch-pdf-section-title>div{display:flex;flex-direction:column;gap:3px}
.srch-pdf-section-title b{font-size:14px}
.srch-pdf-section-title span{font-size:11.5px;color:var(--text-muted,#6b7280)}
.srch-pdf-section-title button{
  border:0;background:transparent;color:var(--brand,#787D85);font:700 11.5px inherit;cursor:pointer;
}
.srch-pdf-items{display:flex;flex-direction:column;gap:8px;max-height:410px;overflow:auto;padding-inline-end:3px}
.srch-pdf-item{
  display:grid;grid-template-columns:auto 48px minmax(0,1fr) auto;align-items:center;gap:10px;
  padding:9px;border:1px solid var(--border,var(--border));border-radius:13px;cursor:pointer;
  transition:border-color .15s,background .15s;
}
.srch-pdf-item:hover{border-color:var(--brand,#787D85);background:color-mix(in srgb,var(--brand,#787D85) 4%,transparent)}
.srch-pdf-item input,.srch-pdf-grid input{accent-color:var(--brand,#787D85)}
.srch-pdf-thumb{
  width:48px;height:42px;display:grid;place-items:center;overflow:hidden;border-radius:9px;
  background:var(--track,var(--card2));color:var(--brand,#787D85);font-size:11px;font-weight:800;
}
.srch-pdf-thumb img{width:100%;height:100%;object-fit:cover}
.srch-pdf-item-copy{min-width:0;display:flex;flex-direction:column;gap:2px}
.srch-pdf-item-copy b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px}
.srch-pdf-item-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-muted,#6b7280);font-size:10.5px}
.srch-pdf-item>strong{font-size:11px;white-space:nowrap}
.srch-pdf-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.srch-pdf-grid label{
  display:flex;align-items:flex-start;gap:9px;min-height:64px;padding:11px;
  border:1px solid var(--border,var(--border));border-radius:12px;cursor:pointer;
}
.srch-pdf-grid label:hover{border-color:var(--brand,#787D85)}
.srch-pdf-grid input{margin-top:2px}
.srch-pdf-grid span{display:flex;flex-direction:column;gap:3px}
.srch-pdf-grid b{font-size:12px}
.srch-pdf-grid small{color:var(--text-muted,#6b7280);font-size:10.5px;line-height:1.35}
.srch-pdf-foot{
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-shrink:0;
  padding:16px 26px;border-top:1px solid var(--border,var(--border));background:var(--surface,#fff);
}
.srch-pdf-foot>div{display:flex;gap:9px}
.srch-pdf-note{font-size:11px;color:var(--text-muted,#6b7280)}
.srch-pdf-primary,.srch-pdf-secondary{
  min-height:40px;padding:0 15px;border-radius:11px;font:700 12px inherit;cursor:pointer;
}
.srch-pdf-primary{
  display:inline-flex;align-items:center;gap:7px;border:1px solid var(--brand,#787D85);
  background:var(--brand,#787D85);color:#fff;
}
.srch-pdf-primary:hover{filter:brightness(.94)}
.srch-pdf-secondary{border:1px solid var(--border,var(--border));background:transparent;color:inherit}
.srch-pdf-secondary:hover{border-color:var(--brand,#787D85);color:var(--brand,#787D85)}
@media(max-width:760px){
  .srch-pdf-modal{place-items:end center;padding:0}
  .srch-pdf-dialog{
    width:100%;
    max-height:calc(100dvh - env(safe-area-inset-top,0px));
    height:calc(100dvh - env(safe-area-inset-top,0px));
    border-radius:22px 22px 0 0;transform:translateY(100%);
  }
  .srch-pdf-head{padding:calc(16px + env(safe-area-inset-top,0px)) 18px 16px}
  .srch-pdf-head h3{font-size:20px}
  .srch-pdf-body{grid-template-columns:1fr;padding:18px;gap:22px;-webkit-overflow-scrolling:touch}
  .srch-pdf-items{max-height:230px}
  .srch-pdf-item{grid-template-columns:auto 42px minmax(0,1fr)}
  .srch-pdf-item>strong{grid-column:3;font-size:10.5px}
  .srch-pdf-thumb{width:42px;height:40px}
  .srch-pdf-grid{grid-template-columns:1fr 1fr}
  .srch-pdf-grid label{min-height:58px;padding:9px}
  .srch-pdf-foot{
    padding:13px 18px calc(13px + env(safe-area-inset-bottom,0px));
    align-items:stretch;flex-direction:column;gap:10px;
  }
  .srch-pdf-note{display:none}
  .srch-pdf-foot>div{width:100%;display:flex;flex-direction:column;gap:9px}
  .srch-pdf-primary,.srch-pdf-secondary{width:100%;min-height:46px}
  .srch-pdf-status{padding:24px}
}
@media(max-width:390px){
  .srch-pdf-grid{grid-template-columns:1fr}
}





#page-properties .prp-viewtog{
  display: flex; gap: 3px; padding: 3px;
  background: var(--card); border: 1px solid var(--border); border-radius: 99px;
  flex-shrink: 0;
}
#page-properties .prp-viewtog button{
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 13px; border: none; border-radius: 99px; cursor: pointer;
  background: none; color: var(--text-muted);
  font-family: inherit; font-size: 12px; font-weight: 700;
  transition: .15s;
}
#page-properties .prp-viewtog button:hover{ color: var(--text); }
#page-properties .prp-viewtog button.on{
  background: var(--active-pill, var(--track)); color: var(--gold-light, var(--gold));
}


#page-properties .prp-title h2{ font-weight: 300; }
#page-properties .prp-title h2 b{ font-weight: 800; }


#page-properties .prp-grid{
  display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 14px;
}
#page-properties .prp-card{
  display: flex; flex-direction: column; overflow: hidden; cursor: pointer;
  background: var(--card); border: 1px solid var(--border); border-radius: 18px;
  transition: border-color .15s, transform .15s;
}
#page-properties .prp-card:hover{
  border-color: var(--gold); transform: translateY(-2px);
}


#page-properties .prp-card-img{
  position: relative; height: 132px; background: var(--track);
  display: flex; align-items: center; justify-content: center;
}
#page-properties .prp-card-img img{
  width: 100%; height: 100%; object-fit: cover; display: block;
}

#page-properties .prp-img-add{
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  width: 100%; height: 100%; border: none; cursor: pointer; background: transparent;
  color: var(--text-muted); font-family: inherit; font-size: 12px; font-weight: 600;
}
#page-properties .prp-img-add em{
  font-style: normal; font-size: 11px; font-weight: 500;
  color: var(--text-muted); opacity: .75; text-decoration: underline; text-underline-offset: 2px;
}
#page-properties .prp-img-add:hover{ color: var(--gold); }
#page-properties .prp-img-add:hover em{ color: var(--gold); opacity: 1; }
#page-properties .prp-card-img.drop{
  outline: 2px dashed var(--gold); outline-offset: -6px;
  background: color-mix(in srgb, var(--gold) 10%, var(--track));
}

#page-properties .prp-seed-wm{
  position: absolute; bottom: 4px; inset-inline-start: 8px;
  opacity: .25; transform: scale(.75); transform-origin: bottom left;
  pointer-events: none; display: flex;
}
#page-properties .prp-card-stat{
  position: absolute; top: 10px; inset-inline-end: 12px;
  padding: 3px 11px; border-radius: 99px;
  background: color-mix(in srgb, var(--card) 78%, transparent);
  border: 1px solid currentColor;
  font-size: 10.5px; font-weight: 700; backdrop-filter: blur(4px);
}
#page-properties .prp-card-shared{
  position: absolute; top: 10px; inset-inline-start: 12px;
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: 99px;
  background: color-mix(in srgb, var(--gold, #c9a227) 88%, var(--card) 12%);
  color: #1a1a1a;
  font-size: 10px; font-weight: 700; backdrop-filter: blur(4px);
}
#page-properties .prp-img-x{
  position: absolute; top: 10px; inset-inline-start: 12px;
  width: 22px; height: 22px; display: none; align-items: center; justify-content: center;
  border: none; border-radius: 99px; cursor: pointer;
  background: rgba(0,0,0,.55); color: #fff;
}
#page-properties .prp-card:hover .prp-img-x{ display: flex; }


#page-properties .prp-card-body{
  display: flex; flex-direction: column; gap: 10px; flex: 1;
  padding: 14px 16px 12px;
}
#page-properties .prp-card-t{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
#page-properties .prp-card-name{
  font-size: 14px; font-weight: 700; line-height: 1.6; color: var(--text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#page-properties .prp-card-meta{
  font-size: 11.5px; color: var(--text-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}


#page-properties .prp-card-cells{ display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
#page-properties .prp-cell{
  display: flex; flex-direction: column; gap: 1px;
  padding: 8px 11px; border-radius: 10px; background: var(--track);
}
#page-properties .prp-cell.gold{ background: var(--active-pill, var(--track)); }
#page-properties .prp-cell span{ font-size: 10px; color: var(--text-muted); }
#page-properties .prp-cell b{ font-size: 13px; font-weight: 700; color: var(--text); }
#page-properties .prp-cell.gold b{ color: var(--gold-light, var(--gold)); }

#page-properties .prp-card-foot{
  margin-top: auto; padding-top: 10px; border-top: 1px solid var(--track);
  display: flex; align-items: center; gap: 8px;
  font-size: 11.5px; color: var(--text-muted);
}
#page-properties .prp-card-foot > span:first-child{
  display: inline-flex; align-items: center; gap: 5px; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#page-properties .prp-card-deal{
  margin-inline-start: auto; flex-shrink: 0;
  padding: 2px 9px; border-radius: 99px;
  background: color-mix(in srgb, var(--deal-c) 14%, transparent);
  color: var(--deal-c); font-size: 10.5px; font-weight: 700;
}

#page-properties .prp-grid-more{ grid-column: 1 / -1; justify-self: center; }


#prop-detail-modal .prp-modal-img{
  position: relative; height: 190px; border-radius: 12px; overflow: hidden;
  background: var(--track); display: flex; align-items: center; justify-content: center;
}
#prop-detail-modal .prp-modal-img img{ width: 100%; height: 100%; object-fit: cover; display: block; }
#prop-detail-modal .prp-modal-img > img,
#page-properties .prp-card-img > img{ cursor: zoom-in; }
#prop-detail-modal .prp-img-add{
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px;
  width: 100%; height: 100%; border: none; cursor: pointer;
  background: repeating-linear-gradient(135deg, transparent 0 10px, rgba(156,163,175,.05) 10px 20px);
  color: var(--text-muted); font-family: inherit; font-size: 12.5px; font-weight: 600;
}
#prop-detail-modal .prp-img-add:hover{ color: var(--gold); }
#prop-detail-modal .prp-modal-img-acts{
  position: absolute; inset-inline-end: 10px; bottom: 10px; display: flex; gap: 6px;
}
#prop-detail-modal .prp-modal-img-acts button{
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 10px; border-radius: 8px; cursor: pointer; font-family: inherit;
  background: rgba(0,0,0,.6); border: 1px solid rgba(255,255,255,.18); color: #fff;
  font-size: 11px; font-weight: 600;
}
#prop-detail-modal .prp-modal-img-acts button:hover{ background: rgba(0,0,0,.8); }

.prp-gallery-trigger{
  position:absolute;inset-inline-start:10px;bottom:10px;z-index:2;
  display:inline-flex;align-items:center;gap:6px;
  min-height:30px;padding:5px 10px;border-radius:9px;cursor:pointer;
  border:1px solid rgba(255,255,255,.22);background:rgba(11, 14, 20,.72);color:#fff;
  font:600 11px/1.2 inherit;backdrop-filter:blur(7px);
}
.prp-gallery-trigger:hover{background:rgba(11, 14, 20,.92)}
#page-properties .prp-card-img .prp-gallery-trigger{opacity:0;transform:translateY(3px);transition:.18s}
#page-properties .prp-card:hover .prp-gallery-trigger{opacity:1;transform:none}

body.prp-album-open{overflow:hidden}
.prp-album-overlay{
  position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;
  padding:24px;background:rgba(3,8,16,.86);backdrop-filter:blur(12px);
}
.prp-album-overlay.open{display:flex;animation:prpAlbumFade .18s ease-out}
.prp-album-dialog{
  width:min(1180px,100%);height:min(860px,calc(100vh - 48px));min-height:420px;
  display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;overflow:hidden;
  border:1px solid rgba(255,255,255,.16);border-radius:20px;
  background:#0b111c;color:#fff;box-shadow:0 28px 90px rgba(0,0,0,.5);
  animation:prpAlbumIn .24s cubic-bezier(.2,.8,.2,1);
}
.prp-album-head{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  min-height:68px;padding:12px 18px;border-bottom:1px solid rgba(255,255,255,.1);
}
.prp-album-head>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.prp-album-head strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prp-album-head span,.prp-album-caption{font-size:12px;color:rgba(255,255,255,.62)}
.prp-album-close{
  width:40px;height:40px;flex:none;border-radius:50%;border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);color:#fff;font:300 27px/1 sans-serif;cursor:pointer;
}
.prp-album-close:hover{background:rgba(255,255,255,.14)}
.prp-album-stage{
  position:relative;min-height:0;display:flex;align-items:center;justify-content:center;
  overflow:hidden;background:#05080e;
}
.prp-album-stage>img{width:100%;height:100%;object-fit:contain;display:block}
.prp-album-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.2);
  background:rgba(0,0,0,.5);color:#fff;font:300 34px/1 sans-serif;cursor:pointer;
  backdrop-filter:blur(5px);
}
.prp-album-nav:hover{background:rgba(0,0,0,.76)}
.prp-album-nav.prev{left:18px}.prp-album-nav.next{right:18px}
.prp-album-counter{
  position:absolute;right:18px;bottom:14px;padding:5px 10px;border-radius:99px;
  background:rgba(0,0,0,.62);font:600 12px/1.2 sans-serif;
}
.prp-album-caption{min-height:34px;padding:9px 18px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prp-album-thumbs{
  display:flex;gap:8px;overflow-x:auto;padding:8px 18px 16px;scrollbar-width:thin;
}
.prp-album-thumbs button{
  width:88px;height:62px;padding:0;flex:none;overflow:hidden;border-radius:9px;cursor:pointer;
  border:2px solid transparent;background:#191C22;opacity:.58;transition:.16s;
}
.prp-album-thumbs button:hover{opacity:.86}
.prp-album-thumbs button.active{border-color:#d9c17b;opacity:1;box-shadow:0 0 0 2px rgba(217,193,123,.16)}
.prp-album-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.prp-album-loading,.prp-album-empty{
  grid-row:2/5;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:11px;text-align:center;color:rgba(255,255,255,.72);
}
.prp-album-loading span{
  width:34px;height:34px;border:3px solid rgba(255,255,255,.18);border-top-color:#d9c17b;
  border-radius:50%;animation:prpAlbumSpin .8s linear infinite;
}
.prp-album-empty b{font-size:16px;color:#fff}.prp-album-empty span{font-size:12px}
.prp-album-empty button{
  padding:8px 14px;border:0;border-radius:9px;background:#797E86;color:#fff;font:600 12px inherit;cursor:pointer;
}
@keyframes prpAlbumFade{from{opacity:0}to{opacity:1}}
@keyframes prpAlbumIn{from{opacity:0;transform:scale(.975) translateY(8px)}to{opacity:1;transform:none}}
@keyframes prpAlbumSpin{to{transform:rotate(360deg)}}

@media (max-width: 640px){
  #page-properties .prp-grid{ grid-template-columns: 1fr; }
  #page-properties .prp-card-img .prp-gallery-trigger{opacity:1;transform:none}
  .prp-album-overlay{padding:0}
  .prp-album-dialog{width:100%;height:100%;min-height:0;border:0;border-radius:0}
  .prp-album-head{min-height:60px;padding:10px 14px}
  .prp-album-nav{width:40px;height:40px}
  .prp-album-nav.prev{left:10px}.prp-album-nav.next{right:10px}
  .prp-album-counter{right:10px;bottom:10px}
  .prp-album-thumbs{padding:7px 12px 12px}
  .prp-album-thumbs button{width:72px;height:52px}
}




#small-modal.crm-form-gold-v2{
  --bg:#f6f4ef; --card:#ffffff; --card2:linear-gradient(180deg,#ffffff,#F7F8FF);
  --border:var(--enterprise-line); --border-light:var(--enterprise-line); --border-gold:var(--neutral-border); --hairline:var(--enterprise-line);
  --text:#202123; --text-light:#6B7280; --text-muted:#7d7565;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#E6E7F1; --track:var(--card2); --btn-border:var(--border-strong);
  --shadow:rgba(90,75,40,.12); --glow:rgba(107,114,128,.16);
  background:rgba(41,34,20,.45);
}
body.dark #small-modal.crm-form-gold-v2{
  --bg:#0f0e0c; --card:#171717; --card2:linear-gradient(180deg,#1b1815,#161411);
  --border:#3A3A3A; --border-light:rgba(255,255,255,.05); --border-gold:var(--neutral-border); --hairline:#3A3A3A;
  --text:#F2F2F2; --text-light:#B4B4B4; --text-muted:#948d7a;
  --gold:var(--neutral-accent); --gold-light:var(--neutral-accent);
  --gold-grad:linear-gradient(135deg,var(--neutral-accent),var(--neutral-accent));
  --active-pill:#282112; --track:#221f1a; --btn-border:#2F303A;
  --shadow:rgba(0,0,0,.5); --glow:rgba(156,163,175,.18);
  background:rgba(0,0,0,.6);
}

#small-modal.crm-form-gold-v2 .modal{
  background:var(--card2); border:1px solid var(--border); box-shadow:0 24px 60px var(--shadow);
  max-width:640px;
}
#small-modal.crm-form-gold-v2 .modal-header{ border-bottom:1px solid var(--hairline); }
#small-modal.crm-form-gold-v2 .modal-title{ color:var(--text); }
#small-modal.crm-form-gold-v2 .modal-close{
  color:var(--text-light); border:1px solid var(--btn-border); border-radius:50%; width:30px; height:30px;
}
#small-modal.crm-form-gold-v2 .modal-close:hover{ background:var(--track); color:var(--text); }
#small-modal.crm-form-gold-v2 .modal-footer{ background:var(--card2); border-top:1px solid var(--hairline); }


#small-modal.crm-form-gold-v2 .form-group{ display:block; margin-bottom:14px; }
#small-modal.crm-form-gold-v2 .form-label{
  display:block; margin-bottom:6px;
  font-size:12px; font-weight:700; color:var(--text-light);
}
#small-modal.crm-form-gold-v2 .form-control{
  width:100%; box-sizing:border-box; min-height:40px; padding:9px 12px;
  background:var(--card); color:var(--text);
  border:1.5px solid var(--btn-border); border-radius:10px;
  font-size:13px; font-family:inherit; transition:.15s;
}
#small-modal.crm-form-gold-v2 select.form-control{ cursor:pointer; }
#small-modal.crm-form-gold-v2 textarea.form-control{ min-height:unset; resize:vertical; }
#small-modal.crm-form-gold-v2 .form-control:focus{
  outline:none; border-color:var(--gold); box-shadow:0 0 0 3px var(--glow);
}

#small-modal.crm-form-gold-v2 #pf-price,
#small-modal.crm-form-gold-v2 #pf-sqft,
#small-modal.crm-form-gold-v2 #pf-developer,
#small-modal.crm-form-gold-v2 #pf-building{ direction:ltr; text-align:right; }

#small-modal.crm-form-gold-v2 .form-row{ display:grid; gap:12px; }
#small-modal.crm-form-gold-v2 .form-row.cols-2{ grid-template-columns:1fr 1fr; }
#small-modal.crm-form-gold-v2 .form-row .form-group{ margin-bottom:14px; }


#small-modal.crm-form-gold-v2 .pf-amen-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(150px,1fr)); gap:2px;
  max-height:150px; overflow-y:auto;
  padding:8px; border:1.5px solid var(--btn-border); border-radius:10px; background:var(--card);
}
#small-modal.crm-form-gold-v2 .pf-amen-chk{
  display:flex; align-items:center; gap:7px; padding:5px 6px; border-radius:7px;
  font-size:11.5px; color:var(--text-light); cursor:pointer;
}
#small-modal.crm-form-gold-v2 .pf-amen-chk:hover{ background:var(--track); color:var(--text); }
#small-modal.crm-form-gold-v2 .pf-amen-chk input{ accent-color:var(--gold); flex-shrink:0; }


#small-modal.crm-form-gold-v2 .btn-ghost{
  background:var(--card); color:var(--text-light);
  border:1.5px solid var(--btn-border); border-radius:10px; font-weight:700; min-height:40px;
}
#small-modal.crm-form-gold-v2 .btn-ghost:hover{ background:var(--track); color:var(--text); }
#small-modal.crm-form-gold-v2 .btn-primary{
  background:var(--gold-grad); color:var(--text); border:none; border-radius:10px;
  font-weight:800; min-height:40px; box-shadow:0 4px 16px var(--glow);
}
#small-modal.crm-form-gold-v2 .btn-primary:hover{ filter:brightness(1.06); }

@media (max-width:768px){
  #small-modal.crm-form-gold-v2 .form-row.cols-2{ grid-template-columns:1fr; }
  #small-modal.crm-form-gold-v2 .btn-ghost,
  #small-modal.crm-form-gold-v2 .btn-primary{ min-height:44px; }
}


.glux-brand-logo{
  display:block; margin:0 auto 16px;
  width:110px; max-width:100%; height:auto;
  opacity:.16;
  filter:grayscale(.15);
  pointer-events:none; user-select:none;
}

.pf-empty .glux-brand-logo{ width:96px; margin-bottom:12px; }

body.dark .glux-brand-logo{
  opacity:.22;
  content:url('images/dandelion-dn-logo-dark.png');
}

body.dark .sidebar-logo-img,
body.dark .topbar-logo{ content:url('images/dandelion-dn-logo-dark.png'); }


#page-customers, #page-deals, #page-properties, #page-search, #page-todos, #page-calendar{
  position:relative;
}
#page-customers::before, #page-deals::before, #page-properties::before,
#page-search::before, #page-todos::before, #page-calendar::before{
  content:''; position:absolute; inset-inline-start:0; bottom:0;
  width:min(420px, 45%); height:min(480px, 55%);
  background:url('images/dandelion-dn-logo.png') left bottom / contain no-repeat;
  opacity:.035; pointer-events:none; z-index:0;
}
body.dark #page-customers::before, body.dark #page-deals::before, body.dark #page-properties::before,
body.dark #page-search::before, body.dark #page-todos::before, body.dark #page-calendar::before{
  background-image:url('images/dandelion-dn-logo-dark.png');   
  opacity:.05;
}

#page-customers > *, #page-deals > *, #page-properties > *,
#page-search > *, #page-todos > *, #page-calendar > *{ position:relative; z-index:1; }


#page-properties.prp-gold-v2 .crm-add-btn{
  display:inline-flex; align-items:center; gap:6px; flex-shrink:0;
  height:40px; padding:0 22px; border:none; border-radius:99px; cursor:pointer;
  background:var(--gold-grad, var(--gold)); color:var(--text);
  font-family:inherit; font-size:13px; font-weight:800;
  box-shadow:0 4px 16px var(--glow, rgba(156,163,175,.18));
}
#page-properties.prp-gold-v2 .crm-add-btn:hover{ filter:brightness(1.06); }



#page-tools .tls-head{ margin-bottom:16px; }
#page-tools .tls-title h2{ margin:0 0 4px; font-size:26px; font-weight:300; color:var(--text); }
#page-tools .tls-sub{ font-size:12.5px; color:var(--text-muted); }

#page-tools .tls-search{ position:relative; margin-bottom:18px; }
#page-tools .tls-search input{
  width:100%; box-sizing:border-box; height:46px; padding:0 18px;
  background:var(--card); color:var(--text);
  border:1px solid var(--border); border-radius:14px;
  font-family:inherit; font-size:13px; outline:none; transition:.15s;
}
#page-tools .tls-search input:focus{ border-color:var(--gold); }

#page-tools .tls-grid{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(290px,1fr)); gap:14px;
}
#page-tools .tls-card{
  display:flex; flex-direction:column; cursor:pointer;
  padding:16px 18px 14px;
  background:var(--card); border:1px solid var(--border); border-radius:16px;
  transition:border-color .15s, transform .15s;
}
#page-tools .tls-card:hover{ border-color:var(--gold); transform:translateY(-2px); }

#page-tools .tls-card-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
#page-tools .tls-badge{
  padding:3px 10px; border-radius:99px;
  background:var(--track); color:var(--text-muted);
  font-size:10.5px; font-weight:700;
}
#page-tools .tls-badge.hot{
  background:var(--active-pill, color-mix(in srgb, var(--gold) 16%, transparent));
  color:var(--gold-light, var(--gold));
}
#page-tools .tls-ic{
  display:flex; align-items:center; justify-content:center; width:38px; height:38px;
  border-radius:11px; background:var(--track); color:var(--gold);
  border:1px solid var(--border);
}
#page-tools .tls-card-t{ margin:0; font-size:14.5px; font-weight:700; color:var(--text); line-height:1.7; }
#page-tools .tls-card-en{ margin-top:2px; font-size:11.5px; font-weight:600; color:var(--gold); direction:ltr; text-align:start; }
#page-tools .tls-card-d{ margin:9px 0 0; font-size:12px; line-height:1.9; color:var(--text-muted); }
#page-tools .tls-card-foot{
  display:flex; align-items:center; justify-content:space-between;
  margin-top:14px; padding-top:11px; border-top:1px solid var(--track);
}
#page-tools .tls-open{ font-size:12px; font-weight:700; color:var(--gold-light, var(--gold)); }
#page-tools .tls-cat{ font-size:11px; color:var(--text-muted); }
#page-tools .tls-empty{ grid-column:1/-1; text-align:center; padding:40px 20px; color:var(--text-muted); font-size:13px; }


#small-modal.tls-modal .modal{ max-width:560px; }
#small-modal.tls-modal .tls-modal-en{
  margin-bottom:14px; font-size:12px; font-weight:600; color:var(--gold); direction:ltr; text-align:start;
}
#small-modal.tls-modal .tls-input{ position:relative; display:flex; align-items:center; }
#small-modal.tls-modal .tls-input input{ padding-inline-end:52px; direction:ltr; text-align:right; }
#small-modal.tls-modal .tls-suffix{
  position:absolute; inset-inline-end:12px;
  font-size:11px; font-weight:700; color:var(--text-muted); pointer-events:none;
}

#small-modal.tls-modal .tls-out{
  margin-top:6px; padding:14px 16px;
  background:var(--card); border:1px solid var(--border-gold, var(--border)); border-radius:12px;
}
#small-modal.tls-modal .tls-line{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:7px 0; border-bottom:1px solid var(--track);
  font-size:12.5px; color:var(--text-light);
}
#small-modal.tls-modal .tls-line:last-of-type{ border-bottom:none; }
#small-modal.tls-modal .tls-line b{ font-size:13px; font-weight:700; color:var(--text); white-space:nowrap; }
#small-modal.tls-modal .tls-line.big{ padding:10px 0; }
#small-modal.tls-modal .tls-line.big b{ font-size:17px; color:var(--gold-light, var(--gold)); }
#small-modal.tls-modal .tls-line.warn b{ color:var(--danger-text, var(--danger)); }
#small-modal.tls-modal .tls-note{
  margin-top:10px; padding-top:9px; border-top:1px dashed var(--border);
  font-size:11px; line-height:1.9; color:var(--text-muted);
}

@media (max-width:640px){
  #page-tools .tls-grid{ grid-template-columns:1fr; }
}



#small-modal.tls-modal-wide .modal{ max-width:1240px !important; width:min(1240px, 97vw) !important; }
#small-modal.tls-modal-wide .modal-body{ padding:0; }
#small-modal.tls-modal-wide .tls-embed{
  height:min(86vh, 1040px); border-radius:12px; overflow:hidden; background:#fff;
}
#small-modal.tls-modal-wide .tls-embed iframe{
  width:100%; height:100%; border:0; display:block;
}


#small-modal.tls-modal-wide .modal-footer{ display:none; }





.captcha-row {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--card);
  border: 1.5px solid var(--border);
  border-radius: 10px;
  padding: 10px 12px;
  margin-bottom: 10px;
}
.captcha-row .captcha-label {
  font-size: 12px;
  color: var(--text-secondary);
  white-space: nowrap;
  flex-shrink: 0;
}
.captcha-row .captcha-q {
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  margin-left: 2px;
}
.captcha-row .captcha-ans {
  width: 64px;
  border: 1.5px solid #D4D5DF;
  border-radius: 8px;
  padding: 6px 8px;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  font-family: inherit;
  outline: none;
  background: #fff;
  color: var(--text);
  transition: border-color .2s;
  direction: ltr;
}
.captcha-row .captcha-ans:focus {
  border-color: var(--primary);
}
.captcha-row .captcha-refresh {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-secondary);
  padding: 2px;
  display: flex;
  align-items: center;
  flex-shrink: 0;
  transition: color .15s;
  margin-right: auto;
}
.captcha-row .captcha-refresh:hover { color: var(--primary); }


.otp-ch-row {
  display: flex;
  gap: 6px;
  margin-bottom: 14px;
}
.otp-ch-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 9px 10px;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  background: var(--card);
  color: var(--text-secondary);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: .15s;
}
.otp-ch-btn:hover { border-color: var(--primary); color: var(--primary); background: #F0FDF4; }
.otp-ch-btn.active {
  border-color: var(--primary);
  background: #ECFDF5;
  color: #4D525A;
}


.otp-sent-banner {
  background: #ECFDF5;
  border: 1px solid #6EE7B7;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 12px;
  color: #4D525A;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}


.otp-code-input {
  text-align: center;
  letter-spacing: 6px;
  font-size: 22px;
  font-weight: 700;
  direction: ltr;
  color: var(--text);
}


.otp-alt-link {
  text-align: center;
  margin-top: 10px;
}
.otp-alt-link button {
  background: none;
  border: none;
  color: var(--primary);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.otp-alt-link button:hover { color: #4D525A; }


.otp-reset-divider {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 0;
  color: #D4D5DF;
  font-size: 11px;
}
.otp-reset-divider::before,
.otp-reset-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--card2);
}
.otp-reset-btn {
  width: 100%;
  background: none;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  padding: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-secondary);
  cursor: pointer;
  font-family: inherit;
  transition: .15s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.otp-reset-btn:hover {
  border-color: var(--primary);
  color: #4D525A;
  background: #F0FDF4;
}



.setup-wrap { max-width: 980px; margin: 0 auto; padding: 24px 20px 60px; }
.setup-header { margin-bottom: 24px; }
.setup-title { font-size: 22px; font-weight: 700; color: var(--text); margin: 0 0 4px; display: flex; align-items: center; gap: 8px; }
.setup-subtitle { font-size: 13px; color: var(--text-muted); margin: 0; }

.setup-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.setup-card {
  background: var(--card); border: 1px solid var(--border);
  border-radius: 14px; padding: 18px 18px 8px;
  transition: border-color .15s;
}
.setup-card:hover { border-color: rgba(156,163,175,.3); }

.setup-card-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 14px;
}
.setup-card-emoji { font-size: 20px; line-height: 1; }
.setup-card-title { font-size: 14px; font-weight: 700; color: var(--text); }

.setup-card-list { list-style: none; margin: 0; padding: 0; }
.setup-card-list li {
  padding: 10px 0;
  border-top: 1px solid var(--border);
  cursor: pointer;
  display: flex; flex-direction: column; gap: 3px;
  transition: .12s;
}
.setup-card-list li:hover .setup-item-label { color: var(--gold, var(--neutral-accent)); }
.setup-item-label { font-size: 13px; font-weight: 500; color: var(--text); transition: color .12s; }
.setup-item-desc  { font-size: 11.5px; color: var(--text-muted); line-height: 1.45; }


.setup-section-nav {
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 18px;
}
.setup-back-btn {
  display: inline-flex; align-items: center; gap: 5px;
  background: none; border: 1px solid var(--border);
  color: var(--text-muted); border-radius: 7px;
  padding: 5px 12px; font-size: 12px; font-weight: 500;
  cursor: pointer; transition: .15s; font-family: inherit;
}
.setup-back-btn:hover { color: var(--text); border-color: var(--gold, var(--neutral-accent)); }
.setup-crumb-sep   { color: var(--text-muted); font-size: 14px; }
.setup-crumb-label { font-size: 13px; color: var(--text-muted); }


.setup-coming-soon {
  text-align: center; padding: 70px 20px;
  background: var(--card); border: 1px solid var(--border);
  border-radius: 14px; margin-top: 4px;
}


@media (max-width: 760px) { .setup-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .setup-grid { grid-template-columns: 1fr; } }


.stab-layout {
  display: flex;
  min-height: calc(100vh - 80px);
  }

.stab-sidebar {
  width: 190px;
  flex-shrink: 0;
  padding: 20px 0 40px;
  border-left: 1px solid var(--border);
  background: var(--card);
}

.stab-sidebar-title {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--text-muted);
  letter-spacing: .07em;
  text-transform: uppercase;
  padding: 0 16px 14px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.stab-item {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 10px 16px;
  border: none;
  background: none;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: .15s;
  text-align:end;
  font-family: inherit;
  border-right: 3px solid transparent;
}
.stab-item:hover { color: var(--text); background: rgba(255,255,255,.03); }
.stab-item.active {
  color: var(--gold, var(--neutral-accent));
  background: rgba(156,163,175,.07);
  border-right-color: var(--gold, var(--neutral-accent));
  font-weight: 600;
}

.stab-main {
  flex: 1;
  padding: 24px 28px 60px;
  min-width: 0;
  max-width: 720px;
}

.stab-section-title {
  font-size: 12px;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 10px;
}
.stab-main .stab-section-title + .settings-section { margin-bottom: 24px; }
.stab-main .stab-section-title:not(:first-child) { margin-top: 24px; }


.stab-page-header { margin-bottom: 18px; }
.stab-page-title  { font-size: 18px; font-weight: 700; color: var(--text); margin-bottom: 3px; }
.stab-page-sub    { font-size: 12.5px; color: var(--text-muted); }


.conn-section-label {
  font-size: 11.5px; font-weight: 700; color: var(--text-muted);
  text-transform: uppercase; letter-spacing: .06em;
  margin: 20px 0 8px;
}
.conn-section-label:first-of-type { margin-top: 0; }


.conn-list { display: flex; flex-direction: column; }
.conn-row {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 13px 0;
  border-bottom: 1px solid var(--border);
}
.conn-row:last-child { border-bottom: none; }
.conn-row-icon { font-size: 22px; width: 32px; text-align: center; flex-shrink: 0; }
.conn-row-info { flex: 1; }
.conn-row-name { font-size: 13px; font-weight: 600; color: var(--text); }
.conn-row-desc { font-size: 11.5px; color: var(--text-muted); margin-top: 2px; }


.conn-toggle {
  width: 42px; height: 24px; border-radius: 99px;
  background: rgba(255,255,255,.12);
  border: none; cursor: pointer;
  position: relative; transition: background .2s;
  flex-shrink: 0;
  padding: 0;
}
.conn-toggle:disabled { opacity: .35; cursor: default; }
.conn-toggle.on { background: var(--accent-soft); }
.conn-toggle::after {
  content: '';
  position: absolute;
  width: 18px; height: 18px; border-radius: 50%;
  background: #fff; top: 3px;
  right: 3px; transition: right .2s;
}
.conn-toggle.on::after { right: calc(100% - 21px); }


.conn-gear-btn {
  background: none; border: none; cursor: pointer;
  color: var(--text-muted); padding: 4px;
  border-radius: 6px; transition: .15s; display: flex; align-items: center;
}
.conn-gear-btn:hover { color: var(--text); background: rgba(255,255,255,.06); }


.ai-feat-list { display: flex; flex-direction: column; gap: 10px; }
.ai-feat-card {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px;
  background: var(--bg, #0E0E0E);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.ai-feat-ico  { font-size: 22px; flex-shrink: 0; width: 32px; text-align: center; }
.ai-feat-info { flex: 1; }
.ai-feat-name { font-size: 13px; font-weight: 600; color: var(--text); }
.ai-feat-status { font-size: 12px; color: var(--text-muted); margin-top: 3px; }


@media (max-width: 680px) {
  .stab-layout { flex-direction: column; }
  .stab-sidebar { width: 100%; border-left: none; border-bottom: 1px solid var(--border); padding: 14px 0 0; display: flex; flex-wrap: wrap; gap: 0; }
  .stab-sidebar-title { display: none; }
  .stab-item { display: inline-flex; width: auto; border-right: none; border-bottom: 3px solid transparent; padding: 9px 13px; font-size: 12px; }
  .stab-item.active { border-right-color: transparent; border-bottom-color: var(--gold, var(--neutral-accent)); }
  .stab-main { padding: 18px 14px 40px; }
}


.settings-wrap { max-width: 860px; margin: 0 auto; padding: 24px 20px 60px; }

.settings-header { margin-bottom: 20px; }
.settings-header h2 { font-size: 20px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 8px; margin: 0 0 4px; }
.settings-header-sub { font-size: 13px; color: var(--text-muted); }


.settings-tabs { display: flex; gap: 6px; flex-wrap: wrap; border-bottom: 1px solid var(--border); padding-bottom: 0; margin-bottom: 24px; }
.settings-tab-btn {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 14px; border: none; background: none;
  color: var(--text-muted); font-size: 13px; font-weight: 500;
  cursor: pointer; border-bottom: 2px solid transparent;
  margin-bottom: -1px; border-radius: 0; transition: .15s;
}
.settings-tab-btn:hover { color: var(--text); }
.settings-tab-btn.active { color: var(--gold, var(--neutral-accent)); border-bottom-color: var(--gold, var(--neutral-accent)); font-weight: 600; }


.settings-section { background: var(--card); border: 1px solid var(--border); border-radius: 14px; padding: 22px; margin-bottom: 20px; }
.settings-section-title { font-size: 13px; font-weight: 600; color: var(--text-muted); display: flex; align-items: center; gap: 6px; margin-bottom: 16px; text-transform: uppercase; letter-spacing: .04em; }


.settings-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.settings-field { display: flex; flex-direction: column; gap: 5px; }
.settings-field label { font-size: 12px; font-weight: 600; color: var(--text-muted); }
.settings-field-full { grid-column: 1 / -1; }
.settings-input {
  background: var(--input-bg, rgba(255,255,255,.05)); border: 1px solid var(--border);
  border-radius: 8px; padding: 9px 12px; font-size: 13px; color: var(--text);
  transition: border-color .15s; outline: none; width: 100%; box-sizing: border-box;
  font-family: inherit;
}
.settings-input:focus { border-color: var(--gold, var(--neutral-accent)); }
.settings-textarea { min-height: 80px; resize: vertical; }

.settings-save-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--gold, var(--neutral-accent)); color: var(--text);
  border: none; border-radius: 8px; padding: 9px 18px;
  font-size: 13px; font-weight: 600; cursor: pointer; transition: .15s;
}
.settings-save-btn:hover { opacity: .88; }


.settings-info-box {
  display: flex; align-items: flex-start; gap: 8px;
  background: rgba(156,163,175,.07); border: 1px solid rgba(156,163,175,.18);
  border-radius: 9px; padding: 11px 14px; font-size: 12.5px;
  color: var(--text-muted); margin-bottom: 18px; line-height: 1.55;
}


.int-cards { display: flex; flex-direction: column; gap: 12px; }
.int-card { background: var(--bg, #0E0E0E); border: 1px solid var(--border); border-radius: 12px; padding: 16px; }
.int-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.int-icon { width: 38px; height: 38px; border-radius: 10px; background: rgba(255,255,255,.06); display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
.int-name { font-size: 14px; font-weight: 600; color: var(--text); }
.int-desc { font-size: 12px; color: var(--text-muted); margin-top: 2px; }
.int-card-head > *:last-child { margin-right: auto; }
.int-chip { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 99px; font-size: 11px; font-weight: 600; }
.int-chip-ok { background: rgba(156,163,175,.15); color: var(--neutral-accent); }
.int-chip-no { background: rgba(239,68,68,.12); color: #F87171; }
.int-detail { font-size: 12px; color: var(--text-muted); }
.int-detail code { background: rgba(255,255,255,.07); padding: 2px 7px; border-radius: 5px; font-size: 11px; color: var(--text); }
.int-detail-warn { color: #F59E0B; }

.int-action-btn {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(156,163,175,.12); border: 1px solid rgba(156,163,175,.25);
  color: var(--gold, var(--neutral-accent)); border-radius: 7px; padding: 6px 14px;
  font-size: 12px; font-weight: 600; cursor: pointer; transition: .15s;
}
.int-action-btn:hover { background: rgba(156,163,175,.2); }
.int-action-danger { background: rgba(239,68,68,.1); border-color: rgba(239,68,68,.25); color: #F87171; }
.int-action-danger:hover { background: rgba(239,68,68,.2); }


.email-config-rows { display: flex; flex-direction: column; gap: 0; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.email-config-row { display: flex; align-items: center; justify-content: space-between; padding: 11px 14px; border-bottom: 1px solid var(--border); }
.email-config-row:last-child { border-bottom: none; }
.ecr-detail { background: rgba(255,255,255,.02); }
.ecr-label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text); }
.ecr-status { font-size: 12px; font-weight: 600; }
.ecr-status.ok { color: var(--neutral-accent); }
.ecr-status.no { color: #F87171; }


.guide-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.guide-card { display: flex; align-items: flex-start; gap: 10px; background: var(--bg, #0E0E0E); border: 1px solid var(--border); border-radius: 10px; padding: 12px; }
.guide-card-ico { width: 32px; height: 32px; border-radius: 8px; background: rgba(156,163,175,.1); display: flex; align-items: center; justify-content: center; color: var(--gold, var(--neutral-accent)); flex-shrink: 0; }
.guide-card-title { font-size: 13px; font-weight: 600; color: var(--text); }
.guide-card-desc { font-size: 11.5px; color: var(--text-muted); margin-top: 3px; line-height: 1.5; }


@media (max-width: 640px) {
  .settings-form { grid-template-columns: 1fr; }
  .guide-cards { grid-template-columns: 1fr; }
  .settings-tabs { gap: 2px; }
  .settings-tab-btn { padding: 7px 10px; font-size: 12px; }
}


.conn-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  margin-left: 6px;
  flex-shrink: 0;
  vertical-align: middle;
  margin-bottom: 1px;
}
.conn-badge {
  display: inline-flex; align-items: center;
  padding: 3px 9px; border-radius: 99px;
  font-size: 11px; font-weight: 600; white-space: nowrap;
}
.conn-strong { background: rgba(156,163,175,.15); color: var(--neutral-accent); }
.conn-medium { background: rgba(156,163,175,.15); color: var(--neutral-accent); }
.conn-weak   { background: rgba(245,158,11,.12); color: #F59E0B; }
.conn-cold   { background: rgba(107,114,128,.12); color: #9CA3AF; }


.cc-section-title {
  font-size: 0.73rem;
  font-weight: 700;
  color: var(--text-muted, #888);
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 0 2px;
  margin: 18px 0 6px;
}
.cc-section { padding: 0 !important; }
.cc-row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 20px;
  border-bottom: 1px solid var(--border, #f0f0f0);
  }
.cc-row:last-child { border-bottom: none; }
.cc-row-info { flex: 1; }
.cc-row-label { font-size: 0.87rem; font-weight: 600; color: var(--text-primary, #181B21); }
.cc-row-desc  { font-size: 0.73rem; color: var(--text-muted, #888); margin-top: 2px; line-height: 1.5; }


.cc-toggle {
  position: relative;
  width: 42px;
  height: 24px;
  border-radius: 99px;
  background: var(--border, #ddd);
  border: none;
  cursor: pointer;
  transition: background .2s;
  flex-shrink: 0;
}
.cc-toggle::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  transition: transform .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.cc-toggle.on { background: var(--accent, #6c63ff); }
.cc-toggle.on::after { transform: translateX(18px); }


.wm-field-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.wm-field-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-secondary, #555);
  display: flex;
  align-items: center;
  gap: 8px;
}
.wm-field-label span { font-weight: 400; color: var(--text-muted, #aaa); }


.wm-thumb {
  width: 54px; height: 40px;
  object-fit: contain;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 6px;
  background: #fafafa;
  padding: 3px;
}
.wm-thumb-empty {
  width: 54px; height: 40px;
  border: 1.5px dashed var(--border, #ddd);
  border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-muted, #bbb);
}
.wm-upload-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px;
  border: 1.5px solid var(--border, #ddd);
  border-radius: 7px;
  font-size: 0.78rem;
  cursor: pointer;
  background: var(--surface, #fff);
  color: var(--text-secondary, #555);
  transition: all .15s;
}
.wm-upload-btn:hover { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }
.wm-clear-btn {
  padding: 5px 8px;
  border: 1.5px solid var(--border, #ddd);
  border-radius: 6px;
  background: none;
  cursor: pointer;
  color: var(--text-muted, #aaa);
  transition: all .15s;
}
.wm-clear-btn:hover { border-color: #ef4444; color: #ef4444; }


.wm-pos-grid {
  display: grid;
  grid-template-columns: repeat(3, 36px);
  gap: 4px;
}
.wm-pos-cell {
  width: 36px; height: 36px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 6px;
  background: var(--surface, #fff);
  cursor: pointer;
  font-size: 1rem;
  color: var(--text-muted, #999);
  transition: all .15s;
  display: flex; align-items: center; justify-content: center;
}
.wm-pos-cell:hover  { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }
.wm-pos-cell.sel    { background: var(--accent, #6c63ff); border-color: var(--accent, #6c63ff); color: #fff; }


.wm-slider {
  width: 100%;
  accent-color: var(--accent, #6c63ff);
  cursor: pointer;
}


.wm-preview {
  position: relative;
  width: 100%;
  max-width: 300px;
  height: 140px;
  border-radius: 8px;
  overflow: hidden;
  border: 1.5px solid var(--border, #e0e0e0);
}
.wm-preview-bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #EBECF6 0%, #c5cdd8 100%);
}
.wm-preview-logo {
  position: absolute;
  max-width: 50%;
  pointer-events: none;
}
.wm-preview-empty {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.78rem;
  color: var(--text-muted, #aaa);
}


.prp-card-img,
.prp-modal-img { position: relative; }

.first-login-profile-overlay {
  position: fixed; inset: 0; z-index: 100000;
  display: grid; place-items: center; padding: 22px;
  background: rgba(3, 8, 15, .82); backdrop-filter: blur(12px);
}
.first-login-profile-card {
  width: min(100%, 480px); max-height: calc(100vh - 44px); overflow: auto;
  display: grid; gap: 10px; padding: 30px;
  color: #ECEDF7; background: var(--bg);
  border: 1px solid rgba(212,175,90,.32); border-radius: 18px;
  box-shadow: 0 26px 90px rgba(0,0,0,.55);
}
.first-login-profile-brand { display:flex; align-items:center; gap:10px; color:#d4af5a; font-size:11px; font-weight:800; letter-spacing:.12em; }
.first-login-profile-brand img { width:36px; height:36px; object-fit:contain; }
.first-login-profile-card h2 { margin:8px 0 0; font-size:24px; }
.first-login-profile-card p { margin:0 0 8px; color:#9ca9b7; line-height:1.55; }
.first-login-profile-card label { margin-top:4px; font-size:12px; font-weight:700; color:#D4D5DF; }
.first-login-profile-card input { width:100%; min-height:46px; padding:0 13px; border:1px solid var(--border); border-radius:10px; background:#0b121a; color:#F7F8FF; font:inherit; }
.first-login-profile-card input:focus { outline:2px solid rgba(212,175,90,.35); border-color:#d4af5a; }
.first-login-profile-card input:disabled { opacity:.68; cursor:not-allowed; }
.first-login-profile-card small { color:#8492a1; line-height:1.45; }
.first-login-profile-error { min-height:20px; color:#fb7185; font-size:12px; }
.first-login-profile-card button { min-height:46px; border:0; border-radius:10px; font-weight:800; cursor:pointer; }
.first-login-profile-card button[type="submit"] { background:#d4af5a; color:#11121C; }
.first-login-profile-card button:disabled { opacity:.6; cursor:wait; }
.first-login-profile-logout { background:transparent; color:#9ca9b7; }



.an-wrap { max-width:1100px; margin:0 auto; padding:24px 20px 60px; }


.an-hdr { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:20px; flex-wrap:wrap; }
.an-title  { font-size:20px; font-weight:700; color:var(--text); margin:0 0 3px; }
.an-subtitle { font-size:12.5px; color:var(--text-muted); }
.an-hdr-right { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }


.an-period-tabs { display:flex; gap:3px; background:rgba(255,255,255,.05); border-radius:8px; padding:3px; }
.an-period-tab {
  padding:5px 14px; font-size:12px; font-weight:600; color:var(--text-muted);
  border-radius:5px; cursor:pointer; background:none; border:none;
  font-family:inherit; transition:.15s; white-space:nowrap;
}
.an-period-tab.active { background:var(--gold,var(--neutral-accent)); color:var(--text); }
.an-period-tab:hover:not(.active) { color:var(--text); }


.an-refresh-btn {
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(255,255,255,.06); border:1px solid var(--border);
  color:var(--text-muted); border-radius:8px;
  padding:7px 14px; font-size:12px; font-weight:600;
  cursor:pointer; transition:.15s; font-family:inherit; flex-shrink:0;
}
.an-refresh-btn:hover { background:rgba(255,255,255,.1); color:var(--text); }


.an-metric-bar-row {
  display:grid; grid-template-columns:repeat(5,1fr);
  gap:12px; margin-bottom:20px;
}
.an-metric-col {
  background:var(--card); border:1px solid var(--border);
  border-radius:14px; padding:16px 14px 14px; text-align:center;
  transition:box-shadow .2s;
}
.an-metric-col:hover { box-shadow:0 4px 20px rgba(0,0,0,.15); }
.an-mbar-group {
  display:flex; align-items:flex-end; justify-content:center;
  gap:4px; height:60px; margin-bottom:10px;
}
.an-mbar { width:10px; border-radius:4px 4px 0 0; min-height:2px; transition:height .5s cubic-bezier(.4,0,.2,1); }
.an-metric-total { font-size:26px; font-weight:800; color:var(--text); line-height:1; }
.an-metric-lbl   { font-size:11px; color:var(--text-muted); margin-top:4px; }


.an-main-layout { display:grid; grid-template-columns:1fr 270px; gap:16px; align-items:start; }
.an-left-panel  { display:flex; flex-direction:column; gap:16px; }
.an-right-panel { display:flex; flex-direction:column; gap:16px; }


.an-card { background:var(--card); border:1px solid var(--border); border-radius:14px; padding:18px; }
.an-card-title {
  display:flex; align-items:center; gap:6px;
  font-size:11px; font-weight:700; color:var(--text-muted);
  text-transform:uppercase; letter-spacing:.05em; margin-bottom:16px;
}


.an-src-row { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.an-src-row:last-of-type { margin-bottom:0; }
.an-src-rank { width:16px; font-size:11px; font-weight:700; color:var(--text-muted); flex-shrink:0; text-align:center; }
.an-src-name { width:100px; flex-shrink:0; font-size:12px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:end; }
.an-src-bar-wrap { flex:1; height:8px; background:rgba(255,255,255,.06); border-radius:99px; overflow:hidden; }
.an-src-bar { height:100%; border-radius:99px; transition:width .5s; min-width:2px; }
.an-src-cnt { width:26px; font-size:12px; font-weight:700; color:var(--text); text-align:start; flex-shrink:0; }
.an-src-pct { width:32px; font-size:11px; color:var(--text-muted); text-align:start; flex-shrink:0; }


.an-total-row {
  display:flex; justify-content:space-between; align-items:center;
  margin-top:14px; padding-top:10px; border-top:1px solid var(--border);
  font-size:12px; color:var(--text-muted);
}
.an-total-row b { color:var(--text); font-size:14px; }


.an-two-mini { display:grid; grid-template-columns:1fr 1fr; gap:16px; }


.an-donut-wrap  { margin:8px 0 12px; }
.an-donut-legend { display:flex; flex-direction:column; gap:6px; }
.an-legend-row  { display:flex; align-items:center; gap:6px; font-size:11px; }
.an-legend-dot  { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.an-legend-lbl  { flex:1; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.an-legend-val  { font-weight:700; color:var(--text); }


.an-bar-row { display:flex; align-items:center; gap:10px; margin-bottom:9px; }
.an-bar-row:last-child { margin-bottom:0; }
.an-bar-label { width:110px; flex-shrink:0; font-size:12px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:end; }
.an-bar-track { flex:1; height:9px; background:rgba(255,255,255,.06); border-radius:99px; overflow:hidden; }
.an-bar-fill  { height:100%; border-radius:99px; transition:width .4s; min-width:2px; }
.an-bar-val   { width:28px; flex-shrink:0; font-size:12px; font-weight:700; color:var(--text); text-align:start; }


.an-perf-card { flex:1; }
.an-agent-row { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--border); }
.an-agent-row:last-child { border-bottom:none; }
.an-rank {
  width:24px; height:24px; border-radius:50%;
  background:rgba(255,255,255,.08); color:var(--text-muted);
  font-size:11px; font-weight:700;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.an-rank.top { background:rgba(156,163,175,.12); font-size:14px; }
.an-agent-avatar {
  width:30px; height:30px; border-radius:50%;
  background:var(--gold,var(--neutral-accent)); color:var(--text);
  font-size:13px; font-weight:700;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.an-agent-name  { flex:1; font-size:13px; color:var(--text); }
.an-agent-score { font-size:12px; font-weight:700; color:var(--gold,var(--neutral-accent)); white-space:nowrap; }


.an-loading { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:80px 20px; }
.an-spinner { width:32px; height:32px; border-radius:50%; border:3px solid var(--border); border-top-color:var(--gold,var(--neutral-accent)); animation:an-spin .7s linear infinite; }
@keyframes an-spin { to { transform:rotate(360deg); } }


.an-empty   { text-align:center; padding:16px 0; font-size:13px; color:var(--text-muted); }
.an-footer  { display:flex; align-items:center; gap:12px; margin-top:20px; }
.an-updated { font-size:11.5px; color:var(--text-muted); display:flex; align-items:center; gap:5px; }


@media (max-width:960px) {
  .an-metric-bar-row { grid-template-columns:repeat(3,1fr); }
  .an-main-layout    { grid-template-columns:1fr; }
}
@media (max-width:640px) {
  .an-metric-bar-row { grid-template-columns:1fr 1fr; }
  .an-two-mini       { grid-template-columns:1fr; }
  .an-src-name       { width:70px; }
}


.anl-tab-bar {
  display: flex;
  gap: 4px;
  padding: 14px 20px 0;
  border-bottom: 2px solid var(--border, #eee);
  background: var(--surface, #fff);
}
.anl-tab {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 9px 18px 11px;
  border: none;
  background: none;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted, #888);
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  border-radius: 8px 8px 0 0;
  transition: color .15s, border-color .15s, background .15s;
}
.anl-tab:hover { color: var(--text-primary, #333); background: var(--bg, #f5f5f5); }
.anl-tab-active {
  color: var(--accent, #6c63ff);
  border-bottom-color: var(--accent, #6c63ff);
  background: none;
}



.notes-wrap { max-width: 780px; margin: 0 auto; padding: 24px 20px 60px; }

.notes-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px;
}
.notes-header h2 {
  font-size: 20px; font-weight: 700; color: var(--text);
  display: flex; align-items: center; gap: 8px; margin: 0;
}
.notes-new-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--gold, var(--neutral-accent)); color: var(--text);
  border: none; border-radius: 8px; padding: 8px 16px;
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: .15s; font-family: inherit;
}
.notes-new-btn:hover { opacity: .88; }


.notes-tabs {
  display: flex; gap: 4px; flex-wrap: wrap;
  border-bottom: 1px solid var(--border); margin-bottom: 18px;
}
.notes-tab-btn {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 8px 14px; border: none; background: none;
  color: var(--text-muted); font-size: 13px; font-weight: 500;
  cursor: pointer; border-bottom: 2px solid transparent;
  margin-bottom: -1px; transition: .15s; font-family: inherit;
}
.notes-tab-btn:hover { color: var(--text); }
.notes-tab-btn.active { color: var(--gold,var(--neutral-accent)); border-bottom-color: var(--gold,var(--neutral-accent)); font-weight: 600; }
.notes-tab-count {
  background: rgba(156,163,175,.18); color: var(--gold,var(--neutral-accent));
  font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 99px;
}


.notes-form {
  background: var(--card); border: 1px solid var(--border);
  border-radius: 14px; padding: 16px; margin-bottom: 18px;
}
.notes-form-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
}
.notes-form-title {
  display: flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; color: var(--text);
}
.notes-form-footer {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 12px; flex-wrap: wrap; gap: 10px;
}
.notes-link-wrap { display: flex; align-items: center; gap: 8px; }
.notes-link-label { font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 4px; white-space: nowrap; }
.notes-link-select {
  background: var(--input-bg,rgba(255,255,255,.05)); border: 1px solid var(--border);
  border-radius: 7px; color: var(--text); font-size: 12px; padding: 5px 10px;
  font-family: inherit; outline: none; max-width: 200px;
}
.notes-link-select:focus { border-color: var(--gold,var(--neutral-accent)); }


.notes-mention-wrap { position: relative; }
.notes-textarea {
  width: 100%; box-sizing: border-box;
  background: var(--input-bg,rgba(255,255,255,.05)); border: 1px solid var(--border);
  border-radius: 9px; color: var(--text); font-size: 13.5px; line-height: 1.6;
  padding: 10px 12px; font-family: inherit; resize: vertical; outline: none;
  transition: border-color .15s;
}
.notes-textarea:focus { border-color: var(--gold,var(--neutral-accent)); }
.notes-mention-menu {
  position: absolute; top: 100%; right: 0; left: 0; z-index: 200;
  background: var(--card); border: 1px solid var(--border);
  border-radius: 9px; box-shadow: 0 8px 24px rgba(0,0,0,.4);
  overflow: hidden; margin-top: 2px;
}
.notes-mention-item {
  padding: 9px 14px; font-size: 13px; color: var(--text);
  cursor: pointer; transition: .1s;
}
.notes-mention-item:hover { background: rgba(156,163,175,.1); color: var(--gold,var(--neutral-accent)); }


.notes-save-btn {
  display: inline-flex; align-items: center; gap: 5px;
  background: var(--gold,var(--neutral-accent)); color: var(--text);
  border: none; border-radius: 7px; padding: 7px 14px;
  font-size: 12px; font-weight: 700; cursor: pointer; font-family: inherit;
  transition: .15s;
}
.notes-save-btn:hover { opacity: .88; }
.notes-cancel-btn {
  display: inline-flex; align-items: center; gap: 4px;
  background: none; border: 1px solid var(--border);
  color: var(--text-muted); border-radius: 7px; padding: 6px 12px;
  font-size: 12px; cursor: pointer; font-family: inherit; transition: .15s;
}
.notes-cancel-btn:hover { border-color: var(--text-muted); color: var(--text); }


.notes-mentions-preview { display: flex; flex-wrap: wrap; gap: 4px; }
.notes-mention-chip {
  background: rgba(156,163,175,.12); color: var(--gold,var(--neutral-accent));
  font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 99px;
}


.notes-card {
  background: var(--card); border: 1px solid var(--border);
  border-radius: 12px; padding: 14px 16px; margin-bottom: 10px;
  transition: border-color .15s;
}
.notes-card:hover { border-color: rgba(156,163,175,.2); }

.notes-card-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 10px;
}
.notes-avatar {
  width: 30px; height: 30px; border-radius: 8px;
  background: rgba(156,163,175,.15); color: var(--gold,var(--neutral-accent));
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; flex-shrink: 0;
}
.notes-card-meta { flex: 1; min-width: 0; }
.notes-author { font-size: 13px; font-weight: 600; color: var(--text); display: block; }
.notes-date   { font-size: 11px; color: var(--text-muted); }

.notes-linked-badge {
  display: inline-flex; align-items: center;
  font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 99px;
  white-space: nowrap;
}
.notes-linked-customer { background: rgba(99,102,241,.15); color: #818CF8; }
.notes-linked-deal     { background: rgba(16,185,129,.12); color: #34D399; }

.notes-card-actions {
  display: flex; gap: 4px; opacity: 0; transition: opacity .15s;
}
.notes-card:hover .notes-card-actions { opacity: 1; }
.notes-action-btn {
  background: none; border: 1px solid var(--border); color: var(--text-muted);
  border-radius: 6px; padding: 4px 7px; cursor: pointer; transition: .12s;
  display: flex; align-items: center; line-height: 1;
}
.notes-action-btn:hover { color: var(--text); border-color: var(--text-muted); }
.notes-del-btn:hover { color: var(--danger,var(--danger)); border-color: var(--danger,var(--danger)); }

.notes-content {
  font-size: 13.5px; color: var(--text); line-height: 1.7;
  word-break: break-word;
}
.notes-at {
  color: var(--gold,var(--neutral-accent)); font-weight: 600;
}
.notes-mention-list { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 4px; }


.notes-edit-wrap { margin-top: 4px; }
.notes-edit-actions { display: flex; gap: 8px; margin-top: 8px; }


.notes-empty {
  text-align: center; padding: 60px 20px;
  color: var(--text-muted); font-size: 14px;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
}

.notes-loading { text-align: center; padding: 40px; color: var(--text-muted); font-size: 13px; }


.lm-note-rich { padding: 8px 0; border-bottom: 1px solid var(--hairline); }
.lm-note-rich:last-child { border-bottom: none; }
.lm-note-rich-content { font-size: 12.5px; color: var(--text); line-height: 1.6; word-break: break-word; }
.lm-note-rich-meta {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; color: var(--text-muted); margin-top: 4px;
}
.lm-note-del {
  background: none; border: none; color: var(--text-muted); cursor: pointer;
  padding: 2px; margin-right: auto; opacity: .6; transition: .12s;
  display: flex; align-items: center;
}
.lm-note-del:hover { color: #F87171; opacity: 1; }


.lm-note-rich-input {
  width: 100%; box-sizing: border-box; resize: none;
  background: rgba(255,255,255,.04); border: 1px solid var(--hairline);
  border-radius: 8px; color: var(--text); font-size: 12.5px; padding: 8px 10px;
  font-family: inherit; outline: none; line-height: 1.5; transition: border-color .15s;
}
.lm-note-rich-input:focus { border-color: var(--lm-gold-light, var(--neutral-accent)); }


@media (max-width: 600px) {
  .notes-form-footer { flex-direction: column; align-items: flex-start; }
  .notes-link-select { max-width: 100%; width: 100%; }
}





.cl-dial-row {
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(156,163,175,.07); border: 1px solid rgba(156,163,175,.18);
  border-radius: 10px; padding: 10px 14px;
}
.cl-phone-num {
  font-size: 16px; font-weight: 700; letter-spacing: .04em;
  color: var(--text); direction: ltr;
}
.cl-dial-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--accent-soft); color: #fff;
  border: none; border-radius: 8px; padding: 8px 16px;
  font-size: 13px; font-weight: 700; cursor: pointer;
  text-decoration: none; font-family: inherit; transition: .15s;
}
.cl-dial-btn:hover { background: var(--accent-soft); }


.cl-outcome-grid {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px;
}
.cl-outcome-btn {
  background: rgba(255,255,255,.05); border: 1px solid var(--border);
  color: var(--text-muted); border-radius: 20px; padding: 5px 12px;
  font-size: 12px; font-weight: 500; cursor: pointer;
  font-family: inherit; transition: .12s; white-space: nowrap;
}
.cl-outcome-btn:hover { border-color: var(--gold,var(--neutral-accent)); color: var(--gold,var(--neutral-accent)); }
.cl-outcome-btn.active {
  background: rgba(156,163,175,.15); border-color: var(--gold,var(--neutral-accent));
  color: var(--gold,var(--neutral-accent)); font-weight: 700;
}


button.crm-ll-call-ic {
  display: inline-flex; align-items: center; justify-content: center;
  background: none; border: none; cursor: pointer;
  color: var(--text-muted); padding: 4px; border-radius: 5px;
  transition: color .12s, background .12s;
}
button.crm-ll-call-ic:hover {
  color: var(--accent-text); background: rgba(34,197,94,.1);
}





.lhub-tabs {
  display: flex; gap: 4px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  margin-bottom: 20px; padding-bottom: 0;
}

.lhub-tab {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 16px; border: none; background: none;
  color: rgba(255,255,255,.45); font-size: 13px; font-weight: 500;
  cursor: pointer; border-bottom: 2px solid transparent;
  margin-bottom: -1px; font-family: inherit; transition: .15s;
  border-radius: 0;
}
.lhub-tab:hover { color: rgba(255,255,255,.75); }
.lhub-tab.active {
  color: var(--gold, var(--neutral-accent));
  border-bottom-color: var(--gold, var(--neutral-accent));
  font-weight: 700;
}
.lhub-tab svg { opacity: .8; }
.lhub-tab.active svg { opacity: 1; }



#page-owners,
#page-owners * {
  box-sizing: border-box;
}

#page-owners {
  direction: ltr;
  color: var(--text, #1E2127);
}

.own-root {
  width: 100%;
  padding: 30px 32px 80px;
}

.own-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}

.own-eyebrow {
  color: var(--primary, #797E86);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .16em;
  margin-bottom: 7px;
}

.own-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.own-title {
  margin: 0;
  color: var(--text, #1E2127);
  font-size: 24px;
  line-height: 1.2;
  font-weight: 800;
}

.own-subtitle {
  margin: 7px 0 0;
  color: var(--text-muted, #718096);
  font-size: 12px;
}

.own-count-chip {
  border: 1px solid var(--border);
  border-radius: 999px;
  background: #fff;
  color: #607088;
  padding: 4px 9px;
  font-size: 10px;
  font-weight: 700;
}

.own-btn-add,
.own-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  border-radius: 12px;
  background: var(--primary, #797E86);
  color: #fff;
  min-height: 42px;
  padding: 0 18px;
  font: 700 12px/1 inherit;
  cursor: pointer;
}

.own-btn-add:hover,
.own-btn-primary:hover {
  background: #62676F;
}

.own-btn-primary:disabled {
  cursor: wait;
  opacity: .55;
}

.own-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(150px, 180px)) auto;
  gap: 9px;
  margin-bottom: 12px;
}

.own-search-wrap,
.own-filter {
  min-height: 42px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: #fff;
  color: #718096;
}

.own-search-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
}

.own-search {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text, #1E2127);
  font: 500 12px/1.4 inherit;
}

.own-filter {
  outline: 0;
  padding: 0 11px;
  font: 600 11px/1.4 inherit;
}

.own-search-wrap:focus-within,
.own-filter:focus {
  border-color: var(--primary, #797E86);
  box-shadow: 0 0 0 3px rgba(121, 126, 134,.09);
}

.own-view-toggle {
  display: flex;
  align-items: center;
  gap: 3px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: #fff;
  padding: 3px;
}

.own-view-toggle button {
  min-width: 62px;
  height: 34px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #718096;
  font: 700 10px/1 inherit;
  cursor: pointer;
}

.own-view-toggle button.active {
  background: #f4ead0;
  color: #797E86;
}

.own-stat-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
  margin-bottom: 14px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: #fff;
}

.own-stat {
  min-height: 66px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-right: 1px solid #EAEBF5;
}

.own-stat:last-child {
  border-right: 0;
}

.own-stat-val {
  color: #797E86;
  font-size: 20px;
  font-weight: 800;
}

.own-stat-lbl {
  color: #8290a3;
  font-size: 10px;
}

.own-loading,
.own-empty {
  min-height: 300px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  color: #718096;
}

.own-loading span,
.own-empty span {
  font-size: 11px;
}

.own-empty strong {
  color: #1E2127;
  font-size: 14px;
}

.own-empty-icon {
  width: 64px;
  height: 64px;
  border-radius: 20px;
  display: grid;
  place-items: center;
  background: #eef7f4;
  color: #797E86;
  font-size: 30px;
}

.own-spinner {
  width: 28px;
  height: 28px;
  border: 3px solid #dce9e5;
  border-top-color: #797E86;
  border-radius: 50%;
  animation: own-spin .75s linear infinite;
}

@keyframes own-spin {
  to { transform: rotate(360deg); }
}

.own-list-shell {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #fff;
}

.own-table {
  width: 100%;
  min-width: 1050px;
  border-collapse: collapse;
  text-align:start;
}

.own-table thead {
  background: #F5F6FF;
}

.own-table th {
  height: 44px;
  padding: 0 16px;
  color: #63738b;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.own-row {
  cursor: pointer;
}

.own-row:hover {
  background: #f8fbfa;
}

.own-row td {
  height: 67px;
  padding: 8px 16px;
  border-top: 1px solid #ECEDF7;
  color: #1E2127;
  font-size: 11px;
  vertical-align: middle;
}

.own-person {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 220px;
}

.own-person > span:last-child,
.own-card-info {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.own-person b,
.own-card-info b,
.own-cell-main,
.own-budget {
  overflow: hidden;
  color: #1C1F25;
  font-size: 11px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.own-person small,
.own-row td small,
.own-card-info small {
  display: block;
  max-width: 210px;
  overflow: hidden;
  color: #8190a3;
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.own-avatar {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: #e6f4f0;
  color: #62676F;
  font-size: 11px;
  font-weight: 850;
}

.own-avatar.large {
  width: 42px;
  height: 42px;
  flex-basis: 42px;
}

.own-pill,
.own-sync {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 23px;
  border-radius: 999px;
  padding: 0 9px;
  border: 1px solid var(--border);
  background: var(--card);
  color: #65758b;
  font-size: 9px;
  font-weight: 750;
  white-space: nowrap;
}

.own-pill.is-primary,
.own-sync.is-synced {
  border-color: #c9e8df;
  background: #eaf8f4;
  color: #62676F;
}

.own-budget {
  color: #797E86;
}

.own-date {
  color: #63738b;
  font-size: 9px;
  white-space: nowrap;
}

.own-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(250px, 1fr));
  gap: 12px;
}

.own-card {
  width: 100%;
  min-height: 172px;
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #fff;
  color: #1E2127;
  text-align:start;
  cursor: pointer;
}

.own-card:hover {
  border-color: #C6CBD3;
  box-shadow: 0 10px 26px rgba(51, 54, 60,.08);
}

.own-card-top {
  display: flex;
  align-items: center;
  gap: 10px;
}

.own-card-info {
  flex: 1;
}

.own-card-contact {
  margin: 14px 0 11px;
  color: #4f6076;
  font-size: 11px;
}

.own-card-pref {
  margin-top: 8px;
  color: #7c8ba0;
  font-size: 9px;
}

/* Contacts card headline (r189). The name and the number are what a person needs before deciding
   to open a record, so they are the two dominant lines; agent, status and source move below them.
   `.own-card-info b` already sets a size, so the name selector has to be at least as specific. */
.own-card-info b.own-card-name {
  font-size: 13px;
  font-weight: 800;
  color: #1C1F25;
}
.own-card-info .own-card-phone {
  display: block;
  max-width: 100%;
  overflow: hidden;
  font-size: 12px;
  font-weight: 700;
  color: #2E3137;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* a number stays left-to-right and self-contained even inside a Persian or Arabic card */
  direction: ltr;
  text-align: start;
  unicode-bidi: isolate;
}
.own-card-info .own-card-phone.is-empty {
  color: #9AA3B0;
  font-weight: 600;
}
.own-card-contact:empty {
  margin: 0;
}
.own-card-sub {
  margin-top: 9px;
  overflow: hidden;
  color: #797E86;
  font-size: 10px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.dark .own-card-info b.own-card-name,
body.dark .own-card-info .own-card-phone {
  color: var(--text, #EDEEF8);
}
body.dark .own-card-info .own-card-phone.is-empty,
body.dark .own-card-sub {
  color: var(--text-muted, #9AA3B0);
}

.own-load-more-wrap {
  display: flex;
  justify-content: center;
  padding: 18px 0;
}

.own-load-more,
.own-btn-secondary {
  border: 1px solid #DFE0EA;
  border-radius: 10px;
  background: #fff;
  color: #617188;
  min-height: 38px;
  padding: 0 16px;
  font: 700 11px/1 inherit;
  cursor: pointer;
}

.own-modal-backdrop,
.own-panel-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 520;
  background: rgba(13, 16, 22,.62);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  animation: none !important;
  transition: none !important;
}

.own-modal-backdrop.visible {
  display: flex;
  align-items: center;
  justify-content: center;
}

.own-panel-overlay.visible {
  display: flex;
  justify-content: flex-end;
}

/* On a phone the detail panel is a full screen, not a sheet with something peeking out behind it:
   it covers the bottom navigation too, so the only way on or off it is its own close button. */
@media (max-width: 900px) {
  .own-panel-overlay {
    height: 100vh;
    height: 100dvh;
  }
}

.own-modal,
.own-panel {
  background: #fff;
  color: #1E2127;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

.own-modal {
  width: min(760px, 96vw);
  max-height: 92vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(15, 18, 24,.25);
}

.own-modal-hdr,
.own-panel-hdr {
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--border);
}

.own-modal-hdr {
  justify-content: space-between;
  padding: 16px 20px;
}

.own-modal-hdr small {
  color: #797E86;
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .14em;
}

.own-modal-hdr h3 {
  margin: 3px 0 0;
  font-size: 16px;
}

.own-modal-close,
.own-panel-close {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  color: var(--text-secondary);
  font-size: 19px;
  cursor: pointer;
}

.own-modal-body {
  overflow-y: auto;
  padding: 16px 20px;
}

.own-form-section {
  padding: 14px 0;
  border-bottom: 1px solid #EBECF6;
}

.own-form-section:first-child {
  padding-top: 0;
}

.own-form-section:last-of-type {
  border-bottom: 0;
}

.own-form-section h4 {
  margin: 0 0 12px;
  color: #22252B;
  font-size: 12px;
}

.own-field-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.own-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 11px;
  color: #68778c;
  font-size: 10px;
  font-weight: 650;
}

.own-field b {
  color: #d03f45;
}

.own-input {
  width: 100%;
  min-height: 39px;
  border: 1px solid #E3E4EE;
  border-radius: 10px;
  outline: 0;
  background: #fff;
  color: #21242A;
  padding: 0 11px;
  font: 500 11px/1.4 inherit;
}

.own-input:focus {
  border-color: #797E86;
  box-shadow: 0 0 0 3px rgba(121, 126, 134,.08);
}

.own-textarea {
  min-height: 76px;
  padding-top: 10px;
  resize: vertical;
}

.own-form-err,
.own-panel-err,
.own-error {
  color: #bf2f38;
  font-size: 11px;
}

.own-form-err {
  border: 1px solid #f2cbd0;
  border-radius: 9px;
  background: #fff5f6;
  padding: 9px 11px;
}

.own-modal-ftr {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  padding: 13px 20px;
  border-top: 1px solid var(--border);
}

.own-panel {
  width: min(720px, calc(100vw - 260px));
  height: 100vh;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--border);
  box-shadow: -18px 0 50px rgba(15, 18, 24,.18);
}

.own-panel-hdr {
  min-height: 84px;
  padding: 13px 18px;
}

.own-panel-avatar {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: #e5f5f0;
  color: #62676F;
  font-size: 15px;
  font-weight: 850;
}

.own-panel-identity {
  flex: 1;
  min-width: 0;
}

.own-panel-name {
  overflow: hidden;
  margin: 0 0 4px;
  color: #1E2127;
  font-size: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.own-panel-source {
  color: #7c8ba0;
  font-size: 10px;
}

.own-panel-edit-btn {
  min-height: 35px;
  border: 1px solid #D4D5DF;
  border-radius: 10px;
  background: #edf8f5;
  color: #62676F;
  padding: 0 13px;
  font: 750 10px/1 inherit;
  cursor: pointer;
}

.own-panel-actions {
  display: flex;
  gap: 7px;
  padding: 10px 18px;
  border-bottom: 1px solid #EAEBF5;
}

.own-panel-actions:empty {
  display: none;
}

.own-panel-actions a {
  min-height: 33px;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: #fff;
  color: #797E86;
  padding: 0 12px;
  font-size: 10px;
  font-weight: 750;
  text-decoration: none;
}

.own-panel-loading,
.own-panel-err {
  flex: 1;
  display: grid;
  place-items: center;
}

.own-panel-body {
  flex: 1;
  overflow-y: auto;
  padding: 15px 18px 28px;
}

.own-panel-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
  margin-bottom: 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
}

.own-panel-kpis > div {
  min-height: 64px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 12px;
  border-right: 1px solid #EAEBF5;
}

.own-panel-kpis > div:last-child {
  border-right: 0;
}

.own-panel-kpis span,
.own-detail span {
  color: #8895a6;
  font-size: 9px;
}

.own-panel-kpis b {
  margin-top: 5px;
  color: #797E86;
  font-size: 11px;
}

.own-panel-section {
  margin-top: 10px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  padding: 14px;
}

.own-panel-section h3 {
  margin: 0 0 12px;
  color: #22252B;
  font-size: 11px;
}

.own-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.own-section-head > span {
  color: #797E86;
  font-size: 9px;
  font-weight: 750;
}

.own-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 18px;
}

.own-detail {
  min-height: 42px;
  display: grid;
  grid-template-columns: minmax(100px, 42%) 1fr;
  align-items: center;
  gap: 8px;
  border-top: 1px solid #F0F1FB;
}

.own-detail:nth-child(-n+2) {
  border-top: 0;
}

.own-detail b {
  overflow: hidden;
  color: #2F3238;
  font-size: 10px;
  font-weight: 650;
  text-overflow: ellipsis;
}

.own-detail .ltr {
  direction: ltr;
  text-align: left;
}

.own-blueprint {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.own-blueprint button {
  min-height: 34px;
  border: 1px solid #D4D5DF;
  border-radius: 9px;
  background: #edf8f5;
  color: #62676F;
  padding: 0 12px;
  font: 750 10px/1 inherit;
  cursor: pointer;
}

.own-muted,
.own-panel-notes {
  color: #7d8b9d;
  font-size: 10px;
  line-height: 1.7;
}

.own-panel-notes {
  margin: 0;
  white-space: pre-wrap;
}

[hidden] {
  display: none !important;
}

body.dark .own-list-shell,
body.dark .own-card,
body.dark .own-search-wrap,
body.dark .own-filter,
body.dark .own-view-toggle,
body.dark .own-stat-bar,
body.dark .own-modal,
body.dark .own-panel,
body.dark .own-panel-section,
body.dark .own-input,
body.dark .own-btn-secondary,
body.dark .own-modal-close,
body.dark .own-panel-close {
  background: var(--card, #191C22);
  border-color: var(--border, #303339);
  color: var(--text, #EDEEF8);
}

body.dark .own-title,
body.dark .own-row td,
body.dark .own-person b,
body.dark .own-card-info b,
body.dark .own-cell-main,
body.dark .own-modal-hdr h3,
body.dark .own-form-section h4,
body.dark .own-panel-name,
body.dark .own-panel-section h3,
body.dark .own-detail b {
  color: var(--text, #EDEEF8);
}

body.dark .own-table thead,
body.dark .own-row:hover {
  background: rgba(255,255,255,.035);
}

@media (max-width: 1180px) {
  .own-toolbar {
    grid-template-columns: minmax(230px, 1fr) repeat(2, minmax(140px, 1fr));
  }
  .own-view-toggle,
  #own-filter-owner {
    grid-row: 2;
  }
  .own-grid {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
  }
}

@media (max-width: 768px) {
  .own-root {
    padding: 18px 12px 80px;
  }
  .own-header {
    align-items: stretch;
    flex-direction: column;
  }
  .own-btn-add {
    width: 100%;
  }
  .own-toolbar {
    display: flex;
    flex-direction: column;
  }
  .own-view-toggle,
  #own-filter-owner {
    grid-row: auto;
  }
  .own-stat-bar {
    grid-template-columns: repeat(2, 1fr);
  }
  .own-stat:nth-child(2) {
    border-right: 0;
  }
  .own-stat:nth-child(-n+2) {
    border-bottom: 1px solid #EAEBF5;
  }
  .own-grid {
    grid-template-columns: 1fr;
  }
  /* ── Contact Detail on a phone ───────────────────────────────────────────
     Two engine-specific traps shaped this block, and both are worth keeping written down.

     The close control is NOT position:fixed. .own-panel-overlay carries backdrop-filter, which by
     spec makes it the containing block for fixed-position descendants; on iOS Safari that
     combination painted the button outside the composited layer - present in the DOM and
     hit-testable in a headless browser, invisible to the person holding the phone. It is an
     ordinary first item of the header instead, which also mirrors correctly in Persian and Arabic
     for free, because the header is a flex row that follows the document direction.

     The header is NOT position:sticky either. The panel is a flex column whose body is the only
     scroller, so the header already cannot scroll away - sticky added nothing, and in WebKit it
     displaced the header down over its own siblings (measured at 320px: flow position 0-76,
     rendered at 66-142, sitting on top of the action row). position:relative keeps it painting
     above the body with none of that behaviour. */
  .own-panel {
    width: 100vw;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .own-panel-hdr {
    position: relative;
    z-index: 2;
    flex: 0 0 auto;
    min-height: 76px;
    padding: 10px 12px;
    /* clears the notch / Dynamic Island when the CRM runs as an installed app */
    padding-top: max(10px, env(safe-area-inset-top, 0px));
    background: var(--card, #fff);
  }
  /* the action row, spinner and error line are fixed-size; only the body takes the slack */
  #own-panel-overlay .own-panel-actions,
  #own-panel-overlay .own-panel-err,
  #own-panel-overlay .own-panel-loading {
    flex: 0 0 auto;
  }
  #own-panel-overlay .own-panel-close {
    position: static !important;
    inset: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    z-index: auto !important;
    order: -1;
    flex: 0 0 auto;
    align-self: center;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
    font-size: 22px;
  }
  .own-panel-body {
    flex: 1 1 auto;
    min-height: 0;
    padding: 12px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  .own-panel-edit-btn {
    padding: 0 10px;
  }
  .own-panel-kpis,
  .own-detail-grid {
    grid-template-columns: 1fr 1fr;
  }
  .own-panel-kpis > div:nth-child(2) {
    border-right: 0;
  }
  .own-panel-kpis > div:nth-child(-n+2) {
    border-bottom: 1px solid #EAEBF5;
  }
  .own-detail:nth-child(-n+2) {
    border-top: 1px solid #F0F1FB;
  }
  .own-detail:nth-child(1) {
    border-top: 0;
  }
  .own-modal {
    width: 100vw;
    max-height: 100vh;
    height: 100vh;
    border: 0;
    border-radius: 0;
  }
}

@media (max-width: 480px) {
  .own-title {
    font-size: 21px;
  }
  .own-field-row,
  .own-panel-kpis,
  .own-detail-grid {
    grid-template-columns: 1fr;
  }
  .own-stat-bar {
    grid-template-columns: repeat(2, 1fr);
  }
  .own-panel-kpis > div {
    border-right: 0;
    border-bottom: 1px solid #EAEBF5;
  }
  .own-panel-kpis > div:last-child {
    border-bottom: 0;
  }
  .own-detail {
    grid-template-columns: minmax(90px, 38%) 1fr;
  }
}





.dev-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0;
}


.dev-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 12px;
  border-bottom: 1px solid var(--border);
  gap: 12px;
  flex-shrink: 0;
}

.dev-topbar-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--text);
}

.dev-topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}


.dev-search-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.dev-search-ico {
  position: absolute;
  right: 10px;
  color: var(--text-muted);
  pointer-events: none;
}

.dev-search {
  padding: 7px 28px 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font-size: .82rem;
  width: 190px;
  transition: border-color .15s;
}
.dev-search:focus {
  outline: none;
  border-color: var(--primary);
}


.dev-new-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s, transform .1s;
}
.dev-new-btn:hover { background: var(--primary-dark, #5b53d4); transform: translateY(-1px); }
.dev-new-btn:active { transform: none; }


.dev-list-wrap {
  flex: 1;
  overflow-y: auto;
  padding: 20px;
}


.dev-loading {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 64px 0;
}

.dev-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--border);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: devSpin .65s linear infinite;
}

@keyframes devSpin { to { transform: rotate(360deg); } }


.dev-error {
  color: var(--danger, #ef4444);
  text-align: center;
  padding: 32px;
  font-size: .9rem;
}


.dev-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 64px 20px;
  gap: 10px;
  text-align: center;
}
.dev-empty-ico  { font-size: 2.5rem; }
.dev-empty-title { font-size: 1rem; font-weight: 600; color: var(--text); }
.dev-empty-sub  { font-size: .85rem; color: var(--text-muted); }
.dev-add-first-btn {
  margin-top: 8px;
  padding: 9px 20px;
  background: var(--primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: .85rem;
  font-weight: 600;
  cursor: pointer;
}
.dev-add-first-btn:hover { opacity: .9; }


.dev-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 14px;
}
.dev-table-wrap{
  overflow:auto;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface, #fff);
}
.dev-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
  direction:ltr;
}
.dev-table th{
  position:sticky;top:0;z-index:1;
  background:var(--head-bg, #f6f4ef);
  text-align:start;
  padding:10px 12px;
  font-size:11px;font-weight:700;color:var(--text-muted);
  white-space:nowrap;
  border-bottom:1px solid var(--border);
}
.dev-table td{
  padding:9px 12px;
  border-bottom:1px solid var(--border);
  vertical-align:middle;
}
.dev-table tr:hover td{background:var(--row-hover, #faf8f3);cursor:pointer}
.dev-namecell{display:flex;align-items:center;gap:10px;min-width:180px}
.dev-logo-sm,.dev-initials-sm{
  width:36px;height:36px;border-radius:8px;flex-shrink:0;object-fit:contain;
  border:1px solid var(--border);background:var(--bg, #f5f5f5);
}
.dev-initials-sm{
  display:flex;align-items:center;justify-content:center;
  background:var(--dev-c, #6c63ff);color:#fff;font-size:12px;font-weight:700;object-fit:unset;
}
.dev-namecol{display:flex;flex-direction:column;gap:2px;min-width:0}
.dev-row-name{font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
.dev-row-sub{font-size:11px;color:var(--text-muted)}


.dev-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
  cursor: pointer;
  transition: box-shadow .15s, border-color .15s, transform .12s;
  display: flex;
  flex-direction: column;
  gap: 10px;
  }
.dev-card:hover {
  border-color: var(--primary);
  box-shadow: 0 4px 16px rgba(0,0,0,.08);
  transform: translateY(-2px);
}

.dev-card-head {
  display: flex;
  align-items: center;
  gap: 12px;
}

.dev-logo {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  object-fit: contain;
  border: 1px solid var(--border);
  background: var(--bg, #f5f5f5);
  flex-shrink: 0;
}

.dev-initials {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  background: var(--dev-c, #6c63ff);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 700;
  flex-shrink: 0;
  letter-spacing: -.5px;
}

.dev-card-info {
  min-width: 0;
  flex: 1;
}
.dev-card-name {
  font-size: .9rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dev-card-city {
  font-size: .76rem;
  color: var(--text-muted);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dev-card-stats {
  display: flex;
  gap: 16px;
  align-items: center;
}
.dev-stat {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.dev-stat-val {
  font-size: .88rem;
  font-weight: 700;
  color: var(--text);
}
.dev-stat-lbl {
  font-size: .7rem;
  color: var(--text-muted);
}

.dev-card-web {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: .73rem;
  color: var(--text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.dev-load-more-btn {
  padding: 8px 24px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font-size: .82rem;
  cursor: pointer;
}
.dev-load-more-btn:hover { border-color: var(--primary); color: var(--primary); }


.dev-panel-overlay {
  position: fixed;
  inset: 0;
  z-index: 600;
  background: transparent;
  pointer-events: none;
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
  visibility: hidden;
  opacity: 0;
  transition: background .22s ease, opacity .22s ease, visibility 0s linear .24s;
}

.dev-panel-overlay.dev-panel-open {
  pointer-events: all;
  background: rgba(0,0,0,.28);
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
}


.dev-panel {
  width: min(560px, 96vw);
  height: 100%;
  background: var(--surface, #fff);
  display: flex;
  flex-direction: column;
  box-shadow: -4px 0 32px rgba(0,0,0,.14);
  transform: translateX(100%);
  transition: transform .22s cubic-bezier(.4,0,.2,1);
  }

.dev-panel-overlay.dev-panel-open .dev-panel {
  transform: translateX(0);
}


.dev-panel-hdr {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.dev-panel-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-muted);
  padding: 4px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  order: 1; 
}
.dev-panel-close:hover { background: var(--bg, #f2f2f2); color: var(--text); }

.dev-panel-back {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
}

.dev-panel-back:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.dev-panel-title {
  font-size: .98rem;
  font-weight: 700;
  color: var(--text);
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


.dev-panel-body {
  flex: 1;
  overflow-y: auto;
  padding: 0 16px 24px;
}


.dev-panel-hero {
  display: flex;
  gap: 14px;
  padding: 18px 0 12px;
  align-items: flex-start;
}

.dev-panel-logo {
  width: 72px;
  height: 72px;
  border-radius: 14px;
  object-fit: contain;
  border: 1px solid var(--border);
  background: var(--bg, #f5f5f5);
  flex-shrink: 0;
}

.dev-panel-initials {
  width: 72px;
  height: 72px;
  border-radius: 14px;
  background: var(--dev-c, #6c63ff);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  font-weight: 700;
  flex-shrink: 0;
}

.dev-panel-details {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  flex: 1;
}

.dev-detail-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .8rem;
  color: var(--text-muted);
  min-width: 0;
}
.dev-detail-row a {
  color: var(--primary);
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dev-detail-row a:hover { text-decoration: underline; }


.dev-panel-desc {
  font-size: .82rem;
  color: var(--text-muted);
  line-height: 1.55;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
  white-space: pre-line;
}


.dev-panel-stats {
  display: flex;
  gap: 24px;
  padding: 14px 0;
  border-bottom: 1px solid var(--border);
}

.dev-pstat {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.dev-pstat-val {
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--text);
}
.dev-pstat-lbl {
  font-size: .72rem;
  color: var(--text-muted);
}


.dev-panel-acts {
  display: flex;
  gap: 8px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
}

.dev-act-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 7px 14px;
  border-radius: 8px;
  font-size: .8rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  transition: background .13s, border-color .13s;
}
.dev-act-edit:hover { border-color: var(--primary); color: var(--primary); background: var(--primary-light, #EEEFF9); }
.dev-act-del:hover  { border-color: var(--danger, #ef4444); color: var(--danger, #ef4444); background: #fef2f2; }


.dev-panel-section-title {
  font-size: .78rem;
  font-weight: 700;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 14px 0 8px;
}

.dev-props-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.dev-prop-row {
  background: var(--bg, #f8f8f8);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 12px;
  cursor: pointer;
  transition: border-color .13s, background .13s;
  }
.dev-prop-row:hover { border-color: var(--primary); background: var(--primary-light, #EEEFF9); }

.dev-prop-name {
  font-size: .85rem;
  font-weight: 600;
  color: var(--text);
}
.dev-prop-meta {
  font-size: .74rem;
  color: var(--text-muted);
  margin-top: 2px;
}
.dev-prop-price {
  font-size: .76rem;
  color: var(--primary);
  font-weight: 600;
  margin-top: 3px;
}

.dev-prop-empty {
  font-size: .82rem;
  color: var(--text-muted);
  text-align: center;
  padding: 16px 0;
}


.dev-panel-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding-top: 14px;
}

.dev-panel-section-head .dev-panel-section-title {
  padding: 0;
}

.dev-project-count {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: .72rem;
}

.dev-project-search-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  width: min(210px, 48%);
  padding: 7px 9px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface);
  color: var(--text-muted);
}

.dev-project-search {
  min-width: 0;
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: .76rem;
}

.dev-projects-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-top: 10px;
}

.dev-project-row {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
  transition: border-color .18s ease, box-shadow .18s ease;
}

.dev-project-row:hover,
.dev-project-row.is-expanded {
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
  box-shadow: 0 7px 22px rgba(19, 22, 28, .06);
}

.dev-project-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: 11px 12px;
  border: 0;
  background: transparent;
  color: inherit;
  text-align:start;
  cursor: pointer;
}

.dev-project-cover {
  width: 78px;
  height: 66px;
  flex: 0 0 78px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg);
  object-fit: cover;
}

.dev-project-cover-empty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
}

.dev-project-copy,
.dev-project-side {
  display: flex;
  align-items: center;
  min-width: 0;
}

.dev-project-copy {
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
}

.dev-project-name {
  overflow: hidden;
  max-width: 100%;
  color: var(--text);
  font-size: .84rem;
  font-weight: 720;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dev-project-meta {
  overflow: hidden;
  max-width: 100%;
  color: var(--text-muted);
  font-size: .7rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dev-project-payment {
  overflow: hidden;
  max-width: 100%;
  color: var(--primary);
  font-size: .68rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dev-project-inventory-summary {
  overflow: hidden;
  max-width: 100%;
  color: var(--text-muted);
  font-size: .68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dev-project-side {
  flex-shrink: 0;
  gap: 7px;
}

.dev-project-status {
  padding: 4px 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 10%, transparent);
  color: var(--primary);
  font-size: .66rem;
  font-weight: 700;
}

.dev-project-chevron {
  display: inline-flex;
  color: var(--text-muted);
  transition: transform .2s ease;
}

.dev-project-row.is-expanded .dev-project-chevron {
  transform: rotate(180deg);
}

.dev-project-detail {
  display: none;
  padding: 0 12px 12px;
  border-top: 1px solid var(--border);
}

.dev-project-row.is-expanded .dev-project-detail {
  display: block;
  animation: devProjectReveal .2s ease-out;
}

@keyframes devProjectReveal {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.dev-project-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding-top: 11px;
}

.dev-project-detail-grid div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 9px;
  border-radius: 8px;
  background: var(--bg);
}

.dev-project-detail-grid span,
.dev-project-note span {
  color: var(--text-muted);
  font-size: .65rem;
}

.dev-project-detail-grid strong {
  overflow: hidden;
  color: var(--text);
  font-size: .74rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dev-project-note {
  margin-top: 9px;
  color: var(--text);
  font-size: .73rem;
  line-height: 1.55;
}

.dev-project-note span {
  display: block;
  margin-bottom: 2px;
  font-weight: 650;
}

.dev-project-properties-btn,
.dev-project-more {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--primary);
  cursor: pointer;
  font: inherit;
  font-size: .72rem;
  font-weight: 650;
}

.dev-project-properties-btn {
  margin-top: 10px;
  padding: 7px 10px;
}

.dev-project-more {
  width: 100%;
  padding: 10px;
}

.dev-project-property-modal {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.dev-project-property-modal button {
  display: flex;
  flex-direction: column;
  gap: 3px;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface);
  color: var(--text);
  text-align:start;
  cursor: pointer;
}

.dev-project-property-modal button:hover {
  border-color: var(--primary);
  background: color-mix(in srgb, var(--primary) 5%, var(--surface));
}

.dev-project-property-modal small {
  color: var(--text-muted);
}


.dev-panel-back[hidden] {
  display: none;
}

.dev-panel-project-view .dev-panel-body {
  padding: 0 18px 28px;
}

.dev-project-page {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-top: 16px;
  direction: ltr;
}

.dev-project-gallery,
.dev-project-gallery-main {
  position: relative;
}

.dev-project-gallery-main {
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: #EDEEF8;
}

.dev-project-gallery-main > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.dev-project-gallery-count {
  position: absolute;
  right: 10px;
  bottom: 10px;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(19, 22, 28, .76);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  backdrop-filter: blur(5px);
}

.dev-gallery-nav {
  position: absolute;
  top: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  transform: translateY(-50%);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 50%;
  background: rgba(19, 22, 28,.62);
  color: #fff;
  cursor: pointer;
  backdrop-filter: blur(5px);
}

.dev-gallery-nav:hover {
  background: rgba(19, 22, 28,.82);
}

.dev-gallery-prev { left: 10px; }
.dev-gallery-next { right: 10px; }

.dev-project-thumbs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 9px 1px 2px;
  scrollbar-width: thin;
}

.dev-project-thumb {
  position: relative;
  overflow: hidden;
  width: 76px;
  height: 54px;
  flex: 0 0 76px;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 9px;
  background: var(--bg);
  cursor: pointer;
}

.dev-project-thumb.is-active {
  border-color: var(--primary);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 16%, transparent);
}

.dev-project-thumb img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.dev-project-thumb span {
  position: absolute;
  inset-inline: 3px;
  bottom: 3px;
  overflow: hidden;
  padding: 2px 4px;
  border-radius: 5px;
  background: rgba(19, 22, 28,.72);
  color: #fff;
  font-size: .55rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dev-project-gallery-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 150px;
  border: 1px dashed var(--border);
  border-radius: 15px;
  background: var(--bg);
  color: var(--text-muted);
  font-size: .8rem;
}

.dev-project-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.dev-project-title-row h2 {
  margin: 0;
  color: var(--text);
  font-size: 1.15rem;
  line-height: 1.35;
}

.dev-project-title-row p {
  margin: 4px 0 0;
  color: var(--text-muted);
  font-size: .76rem;
}

.dev-project-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.dev-project-facts > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
}

.dev-project-facts span {
  color: var(--text-muted);
  font-size: .66rem;
}

.dev-project-facts strong {
  overflow: hidden;
  color: var(--text);
  font-size: .78rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dev-project-content-card {
  margin: 0;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}

.dev-project-content-card h3,
.dev-project-more-details summary {
  margin: 0 0 8px;
  color: var(--text);
  font-size: .82rem;
  font-weight: 750;
}

.dev-project-content-card h3 span {
  margin-left: 4px;
  color: var(--text-muted);
  font-weight: 600;
}

.dev-project-content-card p {
  margin: 0;
  color: var(--text-muted);
  font-size: .76rem;
  line-height: 1.7;
  white-space: pre-line;
}

.dev-project-content-card a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 9px;
  color: var(--primary);
  font-size: .74rem;
  font-weight: 700;
  text-decoration: none;
}

.dev-project-amenities {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.dev-project-amenities span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 8%, var(--surface));
  color: var(--text);
  font-size: .7rem;
}

.dev-project-more-details summary {
  margin: 0;
  cursor: pointer;
}

.dev-project-more-details[open] summary {
  margin-bottom: 8px;
}

.dev-project-inventory-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.dev-project-inventory-grid div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--surface) 92%, var(--primary));
}

.dev-project-inventory-grid strong {
  overflow: hidden;
  font-size: .75rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dev-project-inventory-grid span {
  flex-shrink: 0;
  color: var(--primary);
  font-size: .7rem;
  font-weight: 700;
}

.dev-project-inventory-types {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.dev-project-inventory-types span {
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--border));
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 8%, var(--surface));
  color: var(--text);
  font-size: .72rem;
  font-weight: 700;
}

.dev-project-inventory-note {
  margin: 10px 0 0;
  color: var(--text-muted);
  font-size: .7rem;
  line-height: 1.55;
}

.dev-project-linked-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.dev-project-linked-list button {
  display: flex;
  flex-direction: column;
  gap: 3px;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg);
  color: var(--text);
  text-align:start;
  cursor: pointer;
}

.dev-project-linked-list button:hover {
  border-color: var(--primary);
  background: color-mix(in srgb, var(--primary) 5%, var(--surface));
}

.dev-project-linked-list span {
  font-size: .78rem;
  font-weight: 700;
}

.dev-project-linked-list small {
  color: var(--text-muted);
  font-size: .67rem;
}

@media (max-width: 640px) {
  .dev-panel-section-head {
    align-items: stretch;
    flex-direction: column;
  }

  .dev-project-search-wrap {
    width: 100%;
  }

  .dev-project-detail-grid {
    grid-template-columns: 1fr;
  }

  .dev-panel {
    width: 100vw;
    max-width: 100vw;
  }

  .dev-project-main {
    gap: 9px;
    padding: 9px;
  }

  .dev-project-cover {
    width: 68px;
    height: 58px;
    flex-basis: 68px;
  }

  .dev-project-side .dev-project-status {
    display: none;
  }

  .dev-panel-project-view .dev-panel-body {
    padding: 0 12px 24px;
  }

  .dev-project-facts {
    grid-template-columns: 1fr;
  }

  .dev-project-inventory-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dev-panel-overlay,
  .dev-panel,
  .dev-project-thumb {
    transition: none;
  }
}





#page-contracts { padding: 0; }

.contracts-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 24px 16px;
  border-bottom: 1px solid var(--border);
}
.contracts-header h1 { font-size: 18px; font-weight: 800; }
.contracts-header .sub { font-size: 12px; color: var(--text-muted); margin-top: 2px; }


.contract-upload-zone {
  border: 2px dashed rgba(156,163,175,.3);
  border-radius: 14px;
  padding: 32px 20px;
  text-align: center;
  cursor: pointer;
  transition: .2s;
  background: rgba(156,163,175,.03);
  margin: 20px 24px;
}
.contract-upload-zone:hover,
.contract-upload-zone.drag-over {
  border-color: var(--gold);
  background: rgba(156,163,175,.07);
}
.contract-upload-zone svg { color: var(--gold); opacity: .7; margin-bottom: 10px; }
.contract-upload-zone p { font-size: 13px; color: var(--text-muted); }
.contract-upload-zone b { color: var(--gold); }
#contract-file-input { display: none; }


.contract-create-form {
  margin: 0 24px 20px;
  background: var(--card-bg, var(--sidebar-bg));
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 20px;
  display: none;
}
.contract-create-form.visible { display: block; }
.contract-create-form .file-chip {
  display: flex; align-items: center; gap: 8px;
  background: rgba(156,163,175,.1);
  border: 1px solid rgba(156,163,175,.25);
  border-radius: 8px; padding: 8px 12px; margin-bottom: 16px;
  font-size: 13px;
}
.contract-create-form .file-chip svg { color: var(--gold); flex-shrink: 0; }
.contract-create-form .file-chip .fname {
  flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600;
}
.contract-create-form .file-chip .btn-remove {
  background: none; border: none; color: var(--text-muted);
  cursor: pointer; padding: 2px; font-size: 16px; line-height: 1; flex-shrink: 0;
}
.contract-create-form .form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }


.contracts-list { padding: 0 24px 24px; display: flex; flex-direction: column; gap: 10px; }
.contracts-empty {
  text-align: center; padding: 40px 20px; color: var(--text-muted); font-size: 13px;
}
.contracts-empty svg { opacity: .35; margin-bottom: 10px; }

.contract-card {
  background: var(--card-bg, var(--sidebar-bg));
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex; align-items: center; gap: 12px;
  transition: border-color .15s;
}
.contract-card:hover { border-color: rgba(156,163,175,.35); }

.contract-card .cc-icon {
  width: 40px; height: 40px; border-radius: 10px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(156,163,175,.1);
}
.contract-card .cc-icon svg { color: var(--gold); }

.contract-card .cc-body { flex: 1; min-width: 0; }
.contract-card .cc-title { font-size: 14px; font-weight: 700; margin-bottom: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.contract-card .cc-meta { font-size: 11.5px; color: var(--text-muted); display: flex; gap: 8px; flex-wrap: wrap; }

.contract-card .cc-actions { display: flex; gap: 6px; flex-shrink: 0; }
.cc-action-btn {
  background: none; border: 1px solid var(--border); border-radius: 8px;
  padding: 6px 10px; cursor: pointer; font-size: 12px; color: var(--text-muted);
  transition: .15s; display: flex; align-items: center; gap: 4px; font-family: inherit;
}
.cc-action-btn:hover { border-color: var(--gold); color: var(--gold); }
.cc-action-btn.danger:hover { border-color: var(--danger, #EF4444); color: var(--danger, #EF4444); }
.cc-action-btn svg { width: 13px; height: 13px; }


.sign-status {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10.5px; font-weight: 700;
  padding: 3px 9px; border-radius: 99px; flex-shrink: 0;
}
.sign-status.pending  { background: rgba(234,179,8,.12);  color: #EAB308; border: 1px solid rgba(234,179,8,.25); }
.sign-status.signed   { background: rgba(34,197,94,.12);  color: var(--accent-text); border: 1px solid rgba(34,197,94,.25); }
.sign-status.expired  { background: rgba(239,68,68,.12);  color: #EF4444; border: 1px solid rgba(239,68,68,.25); }
.sign-status.cancelled{ background: rgba(156,163,175,.1); color: #9CA3AF; border: 1px solid rgba(156,163,175,.2); }
.sign-status .dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }


.share-link-box {
  display: flex; align-items: center; gap: 8px;
  background: var(--input-bg, rgba(255,255,255,.06));
  border: 1px solid var(--border); border-radius: 8px;
  padding: 10px 12px; margin: 12px 0;
}
.share-link-box input {
  flex: 1; background: none; border: none; outline: none;
  color: var(--text); font-size: 12px; font-family: monospace; direction: ltr;
}
.share-link-box button {
  background: none; border: none; cursor: pointer; color: var(--gold); padding: 2px;
}
.share-wa-btn {
  display: flex; align-items: center; gap: 8px; width: 100%;
  background: #25D366; color: #fff; border: none; border-radius: 10px;
  padding: 11px 16px; font-size: 13px; font-weight: 700; cursor: pointer; font-family: inherit;
  margin-top: 8px; justify-content: center; transition: .15s;
}
.share-wa-btn:hover { filter: brightness(1.1); }


.contract-create-form .file-chip .btn-chip-edit {
  background: none; border: 1px solid rgba(156,163,175,.3); border-radius: 6px;
  color: var(--gold); cursor: pointer; padding: 3px 8px; font-size: 11px;
  font-family: inherit; display: inline-flex; align-items: center; gap: 4px;
  flex-shrink: 0; transition: .15s; margin-right: auto;
}
.contract-create-form .file-chip .btn-chip-edit:hover { background: rgba(156,163,175,.1); }


.cpl-summary-chip {
  display: flex; align-items: center; gap: 7px;
  background: rgba(156,163,175,.07); border: 1px solid rgba(156,163,175,.2);
  border-radius: 8px; padding: 8px 12px; margin-bottom: 14px;
  font-size: 12px; color: var(--text-muted);
}


.cpl-overlay {
  display: none;
  flex-direction: column;
  position: fixed; inset: 0; z-index: 300;
  background: var(--bg, #0d1117);
}
.cpl-overlay.visible { display: flex; }


.cpl-hdr {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 12px 20px;
  background: var(--card, #161c22); border-bottom: 1px solid var(--border);
  flex-shrink: 0; flex-wrap: wrap;
}
.cpl-hdr-left { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cpl-hdr-title {
  display: flex; align-items: center; gap: 7px;
  font-size: 15px; font-weight: 700; color: var(--text);
}
.cpl-hdr-sub { font-size: 11.5px; color: var(--text-muted); }
.cpl-hdr-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; flex-wrap: wrap; }

.cpl-field-info {
  font-size: 11.5px; color: var(--text-muted);
  background: rgba(255,255,255,.05); border-radius: 6px; padding: 5px 10px;
  border: 1px solid var(--border); white-space: nowrap;
}
.cpl-field-info.placed { color: var(--gold); border-color: rgba(156,163,175,.3); background: rgba(156,163,175,.07); }


.cpl-body {
  flex: 1; overflow-y: auto; padding: 24px 0;
  display: flex; flex-direction: column; align-items: center; gap: 0;
  -webkit-overflow-scrolling: touch;
  user-select: none;
}


.cpl-page-label {
  font-size: 11px; color: var(--text-muted);
  text-align: center; margin-bottom: 8px; margin-top: 20px;
}
.cpl-page-label:first-child { margin-top: 0; }


.cpl-page-wrap {
  position: relative; cursor: crosshair;
  box-shadow: 0 4px 24px rgba(0,0,0,.55);
  border-radius: 6px; overflow: hidden;
  border: 2px solid transparent; transition: border-color .15s;
  margin-bottom: 24px;
}
.cpl-page-wrap:hover { border-color: rgba(156,163,175,.3); }


.cpl-sig-field {
  position: absolute;
  border: 2px dashed var(--gold, var(--neutral-accent));
  border-radius: 6px;
  background: rgba(156,163,175,.1);
  cursor: grab;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 2px;
  transition: background .15s;
  min-width: 80px; min-height: 28px;
}
.cpl-sig-field:hover { background: rgba(156,163,175,.18); }
.cpl-sig-field:active { cursor: grabbing; }
.cpl-field-inner {
  display: flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700; color: var(--gold, var(--neutral-accent));
  white-space: nowrap; pointer-events: none;
}
.cpl-field-hint {
  font-size: 9px; color: rgba(156,163,175,.6);
  pointer-events: none; white-space: nowrap;
}


.cpl-loading {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 14px; padding: 60px 20px; color: var(--text-muted); font-size: 13px;
}
.cpl-spinner {
  width: 34px; height: 34px; border-radius: 50%;
  border: 3px solid rgba(156,163,175,.2); border-top-color: var(--gold, var(--neutral-accent));
  animation: cpl-spin .75s linear infinite;
}
@keyframes cpl-spin { to { transform: rotate(360deg); } }
.cpl-error { padding: 40px 20px; color: var(--danger, #EF4444); font-size: 13px; text-align: center; }

@media (max-width: 600px) {
  .contracts-header, .contract-upload-zone,
  .contract-create-form, .contracts-list { padding-left: 14px; padding-right: 14px; }
  .contract-create-form .form-row-2 { grid-template-columns: 1fr; }
  .contract-card .cc-meta { gap: 4px; }
  .cpl-hdr { flex-direction: column; align-items: flex-start; }
  .cpl-hdr-right { width: 100%; justify-content: flex-end; }
}





#page-agent-tracker { direction: inherit; }


.at-root {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 4px 60px;
}


.at-tabs {
  display: flex;
  gap: 4px;
  background: rgba(255,255,255,.04);
  border-radius: 14px;
  padding: 5px;
  margin-bottom: 20px;
  overflow-x: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
  border: 1px solid rgba(255,255,255,.07);
}
.at-tabs::-webkit-scrollbar { display: none; }
.at-tab {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted, var(--text-secondary));
  white-space: nowrap;
  background: none;
  border: none;
  cursor: pointer;
  transition: all .18s;
  position: relative;
}
.at-tab:hover { color: var(--neutral-accent); background: rgba(156,163,175,.08); }
.at-tab.active {
  background: linear-gradient(135deg, color-mix(in srgb,var(--neutral-accent) 28%,transparent), color-mix(in srgb,var(--neutral-accent) 12%,transparent));
  color: var(--neutral-accent);
  border: 1px solid rgba(156,163,175,.3);
  box-shadow: 0 2px 12px rgba(156,163,175,.12);
}
.at-badge {
  background: #EF4444;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  padding: 1px 5px;
  border-radius: 99px;
  min-width: 16px;
  text-align: center;
}


.at-status-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(255,255,255,.04);
  border-radius: 14px;
  padding: 16px 20px;
  margin-bottom: 16px;
  border: 1px solid rgba(255,255,255,.08);
}
.at-status-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--card2);
  flex-shrink: 0;
  box-shadow: 0 0 8px currentColor;
  transition: background .3s;
}
.at-status-dot.at-s-green  { background: var(--accent-soft); box-shadow: 0 0 10px #22c55e88; }
.at-status-dot.at-s-gold   { background: var(--neutral-accent); box-shadow: 0 0 10px color-mix(in srgb,var(--neutral-accent) 28%,transparent); }
.at-status-dot.at-s-blue   { background: #60a5fa; box-shadow: 0 0 10px #60a5fa88; }
.at-status-dot.at-s-purple { background: #a78bfa; box-shadow: 0 0 10px #a78bfa88; }
.at-status-dot.at-s-teal   { background: #B8BDC5; box-shadow: 0 0 10px #2dd4bf88; }
.at-status-dot.at-s-red    { background: #f87171; box-shadow: 0 0 10px #f8717188; }
.at-status-dot.at-s-grey   { background: var(--card2); }
.at-status-info { flex: 1; }
.at-status-label {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: #ECECEC;
}
.at-status-since {
  font-size: 11px;
  color: var(--text-muted, var(--text-secondary));
}
.at-clock {
  font-size: 22px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--neutral-accent);
  letter-spacing: .5px;
}


.at-hero-row {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
  align-items: center;
}
.at-hero-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 24px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  border: none;
  transition: all .2s;
  flex: 1;
  justify-content: center;
}
.at-hero-checkin {
  background: linear-gradient(135deg, var(--accent-soft), var(--accent-soft));
  color: #fff;
  box-shadow: 0 4px 18px rgba(34,197,94,.3);
}
.at-hero-checkin:hover { transform: translateY(-1px); box-shadow: 0 6px 24px rgba(34,197,94,.4); }
.at-hero-checkout {
  background: linear-gradient(135deg, #ef4444, var(--danger-light));
  color: #fff;
  box-shadow: 0 4px 18px rgba(239,68,68,.3);
}
.at-hero-checkout:hover { transform: translateY(-1px); box-shadow: 0 6px 24px rgba(239,68,68,.4); }
.at-break-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 12px 18px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  color: var(--text-muted, var(--text-secondary));
  transition: all .18s;
  white-space: nowrap;
}
.at-break-btn:hover { background: rgba(255,255,255,.12); color: #ECECEC; }


.at-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 24px;
}
.at-stat-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  padding: 14px 16px;
  text-align: center;
  transition: border-color .18s;
}
.at-stat-card:hover { border-color: rgba(156,163,175,.25); }
.at-stat-val {
  font-size: 24px;
  font-weight: 800;
  color: var(--neutral-accent);
  line-height: 1;
  margin-bottom: 4px;
}
.at-stat-key {
  font-size: 11px;
  color: var(--text-muted, var(--text-secondary));
  font-weight: 500;
}
.at-stat-danger .at-stat-val { color: #f87171; }


.at-section-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-muted, var(--text-secondary));
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.at-section-title::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(255,255,255,.07);
  display: block;
}


.at-quick-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 24px;
}
.at-quick-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 14px 8px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted, var(--text-secondary));
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  cursor: pointer;
  text-align: center;
  line-height: 1.3;
  transition: all .18s;
}
.at-quick-btn svg { width: 20px; height: 20px; flex-shrink: 0; }
.at-quick-btn:hover {
  background: rgba(255,255,255,.09);
  color: #ECECEC;
  border-color: rgba(255,255,255,.15);
  transform: translateY(-1px);
}
.at-quick-gold {
  color: var(--neutral-accent);
  background: rgba(156,163,175,.08);
  border-color: rgba(156,163,175,.2);
}
.at-quick-gold:hover { background: rgba(156,163,175,.15); }


.at-score-row {
  display: flex;
  gap: 0;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 20px;
}
.at-score-today, .at-score-week, .at-score-month, .at-score-rank {
  flex: 1;
  padding: 16px 12px;
  text-align: center;
  border-left: 1px solid rgba(255,255,255,.06);
}
.at-score-today:last-child, .at-score-rank { border-left: none; }
.at-score-num {
  display: block;
  font-size: 28px;
  font-weight: 900;
  color: var(--neutral-accent);
  line-height: 1;
}
.at-score-num.sm { font-size: 20px; }
.at-rank-num {
  display: block;
  font-size: 20px;
  font-weight: 900;
  color: #a78bfa;
  line-height: 1;
}
.at-score-lbl {
  display: block;
  font-size: 10px;
  color: var(--text-muted, var(--text-secondary));
  margin-top: 4px;
  font-weight: 500;
}


.at-timeline { position: relative; padding-right: 24px; }
.at-timeline::before {
  content: '';
  position: absolute;
  right: 7px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: rgba(255,255,255,.07);
}
.at-timeline-item {
  position: relative;
  padding: 0 0 16px 0;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.at-tl-dot {
  position: absolute;
  right: -18px;
  top: 4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--neutral-accent);
  border: 2px solid rgba(0,0,0,.3);
  flex-shrink: 0;
}
.at-tl-time {
  font-size: 11px;
  color: var(--text-muted, var(--text-secondary));
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  padding-top: 2px;
  min-width: 38px;
}
.at-tl-body { flex: 1; }
.at-tl-title { font-size: 13px; font-weight: 600; color: #ECECEC; }
.at-tl-desc { font-size: 11px; color: var(--text-muted, var(--text-secondary)); margin-top: 2px; }
.at-timeline-empty {
  text-align: center;
  color: var(--text-muted, var(--text-secondary));
  font-size: 13px;
  padding: 30px 0;
}


.at-filter-row {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.at-filter-input {
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  color: #ECECEC;
  font-size: 13px;
  font-family: inherit;
  flex: 1;
  min-width: 100px;
}
.at-filter-input:focus { outline: none; border-color: rgba(156,163,175,.4); }
.at-filter-btn {
  padding: 8px 16px;
  border-radius: 8px;
  background: rgba(156,163,175,.15);
  border: 1px solid rgba(156,163,175,.3);
  color: var(--neutral-accent);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.at-att-list { display: flex; flex-direction: column; gap: 8px; }
.at-att-card {
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  padding: 14px 16px;
  transition: border-color .18s;
}
.at-att-card:hover { border-color: rgba(156,163,175,.2); }
.at-att-date { font-size: 12px; color: var(--text-muted, var(--text-secondary)); min-width: 70px; font-weight: 600; }
.at-att-times { flex: 1; }
.at-att-in  { font-size: 13px; font-weight: 700; color: var(--accent-text); }
.at-att-out { font-size: 13px; font-weight: 700; color: #f87171; }
.at-att-work { font-size: 11px; color: var(--neutral-accent); margin-top: 2px; }
.at-att-status {
  padding: 3px 10px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 700;
}
.at-att-present { background: rgba(34,197,94,.15); color: var(--accent-text); }
.at-att-late    { background: rgba(251,191,36,.15); color: #fbbf24; }
.at-att-absent  { background: rgba(239,68,68,.15); color: #f87171; }
.at-att-wfh     { background: rgba(96,165,250,.15); color: #60a5fa; }
.at-att-on_leave { background: rgba(167,139,250,.15); color: #a78bfa; }


.at-req-toolbar {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  align-items: center;
}
.at-new-req-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--neutral-accent), var(--neutral-accent));
  border: none;
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.at-req-list { display: flex; flex-direction: column; gap: 8px; }
.at-req-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  transition: border-color .18s;
}
.at-req-card:hover { border-color: rgba(156,163,175,.2); }
.at-req-icon {
  width: 34px;
  height: 34px;
  border-radius: 8px;
  background: rgba(156,163,175,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--neutral-accent);
}
.at-req-body { flex: 1; }
.at-req-title { font-size: 14px; font-weight: 600; color: #ECECEC; }
.at-req-meta { font-size: 11px; color: var(--text-muted, var(--text-secondary)); margin-top: 3px; }
.at-req-chip {
  padding: 3px 10px;
  border-radius: 99px;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
  align-self: flex-start;
}
.at-chip-pending  { background: rgba(251,191,36,.15); color: #fbbf24; }
.at-chip-approved { background: rgba(34,197,94,.15); color: var(--accent-text); }
.at-chip-rejected { background: rgba(239,68,68,.15); color: #f87171; }
.at-chip-cancelled{ background: rgba(100,116,139,.15); color: var(--text-secondary); }
.at-chip-draft    { background: rgba(100,116,139,.12); color: var(--text-secondary); }
.at-chip-submitted{ background: rgba(96,165,250,.15); color: #60a5fa; }


.at-mgr-cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 20px;
}
.at-mgr-card {
  border-radius: 12px;
  padding: 14px 12px;
  text-align: center;
  border: 1px solid rgba(255,255,255,.07);
}
.at-mgc-val { font-size: 24px; font-weight: 900; line-height: 1; }
.at-mgc-lbl { font-size: 10px; color: var(--text-muted,var(--text-secondary)); margin-top: 4px; font-weight: 500; }
.at-mgc-green  { background: rgba(34,197,94,.08);  border-color: rgba(34,197,94,.2);  }
.at-mgc-green  .at-mgc-val { color: var(--accent-text); }
.at-mgc-red    { background: rgba(239,68,68,.08);  border-color: rgba(239,68,68,.2);  }
.at-mgc-red    .at-mgc-val { color: #f87171; }
.at-mgc-gold   { background: rgba(156,163,175,.08); border-color: rgba(156,163,175,.2); }
.at-mgc-gold   .at-mgc-val { color: var(--neutral-accent); }
.at-mgc-blue   { background: rgba(96,165,250,.08); border-color: rgba(96,165,250,.2); }
.at-mgc-blue   .at-mgc-val { color: #60a5fa; }
.at-mgc-purple { background: rgba(167,139,250,.08); border-color: rgba(167,139,250,.2); }
.at-mgc-purple .at-mgc-val { color: #a78bfa; }
.at-mgc-teal   { background: rgba(184, 189, 197,.08); border-color: rgba(184, 189, 197,.2); }
.at-mgc-teal   .at-mgc-val { color: #B8BDC5; }
.at-mgc-orange { background: rgba(251,146,60,.08); border-color: rgba(251,146,60,.2); }
.at-mgc-orange .at-mgc-val { color: #fb923c; }

.at-mgr-toolbar { display: flex; gap: 8px; margin-bottom: 12px; align-items: center; }


.at-agents-table-wrap { overflow-x: auto; border-radius: 12px; border: 1px solid rgba(255,255,255,.07); }
.at-agents-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.at-agents-table th {
  background: rgba(255,255,255,.04);
  padding: 10px 14px;
  text-align:end;
  font-size: 11px;
  font-weight: 700;
  color: var(--text-muted,var(--text-secondary));
  white-space: nowrap;
  border-bottom: 1px solid rgba(255,255,255,.07);
}
.at-agents-table td {
  padding: 11px 14px;
  border-bottom: 1px solid rgba(255,255,255,.04);
  color: #ECECEC;
  white-space: nowrap;
  vertical-align: middle;
}
.at-agents-table tr:last-child td { border-bottom: none; }
.at-agents-table tr:hover td { background: rgba(255,255,255,.025); }
.at-table-empty { text-align: center; color: var(--text-muted,var(--text-secondary)); padding: 30px !important; }
.at-tbl-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  margin-left: 6px;
  vertical-align: middle;
}
.at-agents-table .at-view-btn {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  background: rgba(156,163,175,.12);
  border: 1px solid rgba(156,163,175,.25);
  color: var(--neutral-accent);
  cursor: pointer;
}


.at-lb-tabs { display: flex; gap: 4px; }
.at-lb-tab {
  padding: 4px 12px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  color: var(--text-muted,var(--text-secondary));
  cursor: pointer;
  transition: all .15s;
}
.at-lb-tab.active { background: rgba(156,163,175,.15); border-color: rgba(156,163,175,.3); color: var(--neutral-accent); }
.at-leaderboard { display: flex; flex-direction: column; gap: 6px; }
.at-lb-row {
  display: flex;
  align-items: center;
  gap: 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 10px;
  padding: 10px 14px;
  transition: border-color .15s;
}
.at-lb-row:hover { border-color: rgba(156,163,175,.2); }
.at-lb-row-clickable { cursor: pointer; }
.at-lb-row-clickable:hover { border-color: rgba(156,163,175,.4); background: rgba(156,163,175,.06); }
.at-lb-rank {
  font-size: 16px;
  font-weight: 900;
  min-width: 28px;
  text-align: center;
}
.at-lb-rank-1 { color: #fbbf24; }
.at-lb-rank-2 { color: var(--text-secondary); }
.at-lb-rank-3 { color: #fb923c; }
.at-lb-name { flex: 1; font-size: 13px; font-weight: 600; color: #ECECEC; }
.at-lb-team { font-size: 11px; color: var(--text-muted,var(--text-secondary)); }
.at-lb-score { font-size: 16px; font-weight: 800; color: var(--neutral-accent); }


.at-report-form { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.07); border-radius: 16px; padding: 20px; }
.at-report-header {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 700;
  color: #ECECEC;
  margin-bottom: 20px;
}
.at-report-date-badge {
  font-size: 12px;
  color: var(--text-muted,var(--text-secondary));
  background: rgba(255,255,255,.06);
  padding: 3px 10px;
  border-radius: 99px;
}
.at-report-stats-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 16px;
}
.at-rs-field label { display: block; font-size: 11px; color: var(--text-muted,var(--text-secondary)); margin-bottom: 4px; font-weight: 600; }
.at-rs-input {
  width: 100%;
  padding: 8px 10px;
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  color: #ECECEC;
  font-size: 13px;
  font-family: inherit;
  box-sizing: border-box;
}
.at-rs-input:focus { outline: none; border-color: rgba(156,163,175,.4); }
.at-rpt-label { display: block; font-size: 12px; color: var(--text-muted,var(--text-secondary)); margin-bottom: 4px; font-weight: 600; }
.at-rpt-textarea {
  width: 100%;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  color: #ECECEC;
  font-size: 13px;
  font-family: inherit;
  resize: vertical;
  margin-bottom: 12px;
  box-sizing: border-box;
  }
.at-rpt-textarea:focus { outline: none; border-color: rgba(156,163,175,.4); }
.at-rpt-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.at-review-block {
  background: rgba(96,165,250,.06);
  border: 1px solid rgba(96,165,250,.2);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 12px;
}
.at-review-label { font-size: 11px; color: #60a5fa; font-weight: 700; margin-bottom: 4px; }
.at-review-text { font-size: 13px; color: #ECECEC; }


.at-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.6);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.at-modal-overlay[hidden] {
  display: none !important;
}
.at-modal-box {
  background: #1a1a24;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px;
  width: 100%;
  max-width: 460px;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 24px 64px rgba(0,0,0,.6);
}
.at-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  font-size: 15px;
  font-weight: 700;
  color: #ECECEC;
}
.at-modal-close {
  width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: rgba(255,255,255,.07);
  border: none; cursor: pointer;
  color: var(--text-muted,var(--text-secondary));
  font-size: 18px; line-height: 1;
}
.at-modal-close:hover { background: rgba(255,255,255,.13); color: #ECECEC; }
.at-modal-body { padding: 20px; }
/* The footer is a DIRECT child of .at-modal-box (header / scrollable body /
   pinned footer) — the row structure the mobile grid/flex rules were always
   written for. It must never live inside the scrolling body: when the box
   shrinks (keyboard, stale --app-vh on iOS PWA), Submit would end up in an
   unscrolled region — the "missing Submit Request" mobile bug. */
.at-modal-footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 0; padding: 0 20px 20px; }

.at-field-active-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(34,197,94,.08);
  border: 1px solid rgba(34,197,94,.2);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 16px;
  font-size: 14px;
  font-weight: 600;
  color: var(--accent-text);
}
.at-active-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--accent-soft);
  box-shadow: 0 0 8px var(--accent-soft);
  animation: at-pulse 1.5s infinite;
}
@keyframes at-pulse {
  0%,100% { box-shadow: 0 0 6px var(--accent-soft); }
  50% { box-shadow: 0 0 14px var(--accent-soft); }
}
.at-elapsed-timer { margin-right: auto; font-variant-numeric: tabular-nums; font-size: 16px; font-weight: 800; }

.at-end-btn { background: linear-gradient(135deg, #ef4444, var(--danger-light)) !important; }

.at-req-date-row { display: flex; gap: 10px; }


.at-loading {
  text-align: center;
  color: var(--text-muted,var(--text-secondary));
  font-size: 13px;
  padding: 30px 0;
}


@media (max-width: 640px) {
  .at-stats-grid { grid-template-columns: repeat(3, 1fr); gap: 7px; }
  .at-stat-val { font-size: 18px; }
  .at-quick-grid { grid-template-columns: repeat(2, 1fr); }
  .at-mgr-cards { grid-template-columns: repeat(2, 1fr); }
  .at-score-row { flex-wrap: wrap; }
  .at-score-today,.at-score-week,.at-score-month,.at-score-rank { min-width: 50%; }
  .at-report-stats-row { grid-template-columns: repeat(2, 1fr); }
  .at-hero-btn { padding: 12px 16px; font-size: 14px; }
  .at-clock { font-size: 18px; }
  .at-agents-table th:nth-child(n+5),
  .at-agents-table td:nth-child(n+5) { display: none; }
}
@media (max-width: 400px) {
  .at-quick-grid { grid-template-columns: repeat(2, 1fr); }
  .at-stats-grid { grid-template-columns: repeat(2, 1fr); }
}


#page-agent-tracker [hidden],
.at-modal-overlay[hidden] { display: none !important; }

.at-root {
  max-width: 1240px;
  padding: 6px 8px 72px;
  color: var(--text);
}
.at-page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin: 2px 0 20px;
}
.at-page-head h2 { margin: 2px 0 4px; font-size: clamp(24px,3vw,34px); color: var(--text); }
.at-page-head p { margin: 0; color: var(--muted); font-size: 13px; }
.at-page-head .at-eyebrow { color: var(--primary); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.at-crm-health {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--card);
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}
.at-crm-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--card2); }
.at-crm-health.is-connected .at-crm-dot { background: #10b981; box-shadow: 0 0 0 4px rgba(16,185,129,.12); }
.at-crm-health.is-error .at-crm-dot { background: #ef4444; box-shadow: 0 0 0 4px rgba(239,68,68,.1); }
.at-tabs,
.at-status-banner,
.at-stat-card,
.at-score-row,
.at-report-form,
.at-req-card,
.at-att-row,
.at-lb-row,
.at-agents-table-wrap { background: var(--card); border-color: var(--border); }
.at-tab,
.at-section-title,
.at-status-since,
.at-stat-card span,
.at-score-row span,
.at-form-help,
.at-tl-time,
.at-tl-body p,
.at-req-card span,
.at-att-row small,
.at-lb-row span { color: var(--muted); }
.at-status-info strong,
.at-stat-card strong,
.at-score-row strong,
.at-tl-body strong,
.at-req-card strong,
.at-att-row strong,
.at-lb-row strong,
.at-agents-table td,
.at-report-header { color: var(--text); }
.at-stat-card {
  display: flex;
  min-height: 92px;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
}
.at-stat-card strong { font-size: 25px; line-height: 1; font-variant-numeric: tabular-nums; }
.at-stat-card span { font-size: 11px; font-weight: 650; }
.at-stat-card.at-stat-danger strong { color: var(--danger); }
.at-score-row > div {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 16px 12px;
  text-align: center;
  border-right: 1px solid var(--border);
}
.at-score-row > div:last-child { border-right: 0; }
.at-score-row strong { font-size: 22px; font-variant-numeric: tabular-nums; }
.at-score-row span { font-size: 11px; }
.at-timeline { padding: 0; }
.at-timeline::before { left: 70px; right: auto; background: var(--border); }
.at-timeline-item { gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.at-tl-time { width: 54px; min-width: 54px; }
.at-tl-body p { margin: 4px 0 0; font-size: 12px; }
.at-active-activity {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  margin-bottom: 14px;
  border: 1px solid rgba(16,185,129,.25);
  border-radius: 14px;
  background: rgba(16,185,129,.08);
}
.at-active-activity div { display: flex; flex-direction: column; gap: 3px; }
.at-active-activity span { color: var(--muted); font-size: 11px; }
.at-att-row {
  display: grid;
  grid-template-columns: minmax(170px,1.5fr) auto repeat(3,minmax(85px,.6fr));
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 12px;
}
.at-att-row > div { display: flex; flex-direction: column; gap: 2px; }
.at-req-card { align-items: center; justify-content: space-between; }
.at-req-card > div { display: flex; flex-direction: column; gap: 4px; }
.at-report-stats-row label,
.at-req-date-row label { color: var(--muted); font-size: 11px; font-weight: 650; }
.at-report-stats-row input,
.at-rpt-label input,
.at-rpt-label select,
.at-rpt-label textarea,
.at-req-date-row input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-top: 5px;
  padding: 10px 11px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--card);
  color: var(--text);
  font: inherit;
}
.at-rpt-label { margin: 0 0 13px; color: var(--muted); }
.at-form-help { margin: -10px 0 18px; font-size: 12px; }
.at-mgr-card { display: flex; flex-direction: column; gap: 6px; }
.at-mgr-card strong { font-size: 24px; }
.at-mgr-card span { color: var(--muted); font-size: 11px; }
.at-agents-table th { text-align:start; background: var(--surface-muted); border-color: var(--border); }
.at-agents-table td { border-color: var(--border); }
.at-status-pill { display: inline-flex; padding: 4px 8px; border-radius: 999px; background: var(--surface-muted); font-size: 11px; }
.at-lb-row > div { display: flex; flex: 1; flex-direction: column; gap: 3px; }
.at-modal-box { background: var(--card); border-color: var(--border); }
.at-modal-header { color: var(--text); border-color: var(--border); }
.at-modal-close { color: var(--muted); background: var(--surface-muted); }
#at-fa-modal .at-modal-box { max-width: 780px; }
.at-req-date-row > label { flex: 1; min-width: 0; }
.at-rpt-label input[readonly] { background: var(--surface-muted); color: var(--muted); }
.at-contact-combobox {
  position: relative;
  margin: 5px 0 13px;
}
.at-contact-trigger {
  display: flex;
  width: 100%;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card);
  color: var(--muted);
  font: inherit;
  text-align:start;
  cursor: pointer;
}
.at-contact-trigger:hover,
.at-contact-trigger:focus,
.at-contact-trigger[aria-expanded="true"] {
  border-color: var(--primary);
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent);
}
.at-contact-trigger.has-value { color: var(--text); }
.at-contact-chevron { color: var(--muted); font-size: 16px; transition: transform .16s ease; }
.at-contact-trigger[aria-expanded="true"] .at-contact-chevron { transform: rotate(180deg); }
.at-contact-panel {
  position: absolute;
  z-index: 1200;
  inset: calc(100% + 5px) 0 auto;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
  box-shadow: 0 18px 45px rgba(19, 22, 28,.18);
}
.at-contact-search {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin: 0 0 5px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-muted);
  color: var(--text);
  font: inherit;
  font-size: 12px;
}
.at-contact-search:focus { border-color: var(--primary); outline: none; }
.at-contact-options { max-height: 210px; overflow-y: auto; }
.at-contact-option {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 12px;
  text-align:start;
  cursor: pointer;
}
.at-contact-option:hover,
.at-contact-option:focus { background: var(--surface-muted); outline: none; }
.at-contact-option small { color: var(--muted); font-size: 10px; direction: ltr; }
.at-contact-empty { padding: 14px 10px; color: var(--muted); font-size: 11px; text-align: center; }
.at-reference-picker { position: relative; }
.at-reference-results {
  position: absolute;
  z-index: 1100;
  inset: calc(100% + 4px) 0 auto;
  max-height: 250px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
  box-shadow: 0 18px 45px rgba(19, 22, 28,.2);
}
.at-reference-option {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--text);
  text-align:start;
  cursor: pointer;
}
.at-reference-option:hover,
.at-reference-option:focus { background: var(--surface-muted); outline: none; }
.at-reference-option span { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.at-reference-option strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.at-reference-option small,
.at-reference-option em { color: var(--muted); font-size: 10px; font-style: normal; }
.at-reference-empty { padding: 16px; color: var(--muted); font-size: 12px; text-align: center; }
.at-map-field {
  margin: 4px 0 14px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-muted);
}
.at-map-field-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.at-map-field-head > div { display: flex; flex-direction: column; gap: 2px; }
.at-map-field-head strong { color: var(--text); font-size: 12px; }
.at-map-field-head span { color: var(--muted); font-size: 10px; }
.at-location-map {
  width: 100%;
  height: 270px;
  overflow: hidden;
  margin-bottom: 10px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--card2);
}
.at-location-map .leaflet-control-attribution { font-size: 9px; }
.at-map-coordinates {
  margin-top: -8px;
  color: var(--muted);
  font-size: 10px;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 800px) {
  .at-page-head { align-items: flex-start; flex-direction: column; }
  .at-stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .at-mgr-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .at-att-row { grid-template-columns: 1fr auto; }
  .at-att-row > div:nth-last-child(-n+3) { display: none; }
}
@media (max-width: 520px) {
  .at-root { padding-inline: 0; padding-bottom:calc(96px + env(safe-area-inset-bottom,0px)); scroll-padding-top:calc(64px + env(safe-area-inset-top,0px)); scroll-padding-bottom:calc(88px + env(safe-area-inset-bottom,0px)); }
  .at-page-head { margin-inline: 4px; }
  .at-tabs { position: sticky; top: 0; z-index: 8; background:var(--bg); }
  .at-stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .at-stat-card { min-height: 82px; padding: 12px 8px; }
  .at-quick-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .at-score-row { display: grid; grid-template-columns: repeat(2,1fr); }
  .at-score-row > div { border-bottom: 1px solid var(--border); }
  .at-report-stats-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .at-req-date-row { flex-direction: column; }
  .at-modal-overlay {
    align-items:flex-end;
    padding:calc(8px + env(safe-area-inset-top,0px)) 0 calc(66px + env(safe-area-inset-bottom,0px));
  }
  .at-modal-box {
    width:100%;
    max-width:none;
    height:min(760px,calc(100dvh - 74px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)));
    max-height:none;
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto;
    overflow:hidden;
    border-width:1px 0 0;
    border-radius:20px 20px 0 0;
    box-shadow:0 -18px 55px rgba(19, 22, 28,.2);
  }
  .at-modal-header {
    min-height:64px;
    padding:12px 16px;
    background:var(--card);
  }
  .at-modal-close { width:44px; height:44px; flex:0 0 44px; font-size:22px; }
  .at-modal-body {
    min-height:0;
    padding:16px;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .at-modal-body input,
  .at-modal-body select,
  .at-modal-body textarea { font-size:16px !important; }
  .at-modal-footer {
    min-height:68px;
    margin:0;
    padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));
    align-items:center;
    background:color-mix(in srgb,var(--card) 96%,transparent);
    border-top:1px solid var(--border);
    box-shadow:0 -10px 28px rgba(19, 22, 28,.08);
  }
  .at-modal-footer .btn {
    min-width:0;
    min-height:46px;
    flex:1 1 0;
    margin:0;
    padding:10px 12px;
    border-radius:12px;
    font-size:13px;
    white-space:normal;
  }
  .at-modal-footer .btn-primary { flex-grow:1.35; }
  .at-map-field-head { align-items: flex-start; flex-direction: column; }
  .at-location-map { height: 230px; }
}

@media (max-width: 640px) {
  .fdp-popup {
    inset:auto 10px calc(72px + env(safe-area-inset-bottom,0px)) 10px !important;
    width:auto;
    max-height:calc(100dvh - 92px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
    border-radius:20px;
    overflow:auto;
    direction:ltr;
  }
  .fdp-footer {
    position:sticky;
    bottom:0;
    z-index:2;
    display:grid;
    grid-template-columns:1fr 1fr;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));
    box-shadow:0 -8px 20px rgba(19, 22, 28,.08);
  }
  .fdp-footer .btn { min-height:44px; margin:0; border-radius:11px; font-size:13px; }
  .fdp-footer [data-fn="today"] { background:var(--primary); color:#fff; border-color:var(--primary); }
  .zcal-actions .zcal-action:first-child {
    min-width:0;
    border-color:color-mix(in srgb,var(--primary) 35%,var(--border));
    background:color-mix(in srgb,var(--primary) 10%,var(--card));
    color:var(--primary);
    font-weight:800;
  }
}

.at-team-today { margin: 22px 0; }
.at-section-title-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.at-team-summary {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.at-team-summary article {
  display: flex;
  min-height: 72px;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
}
.at-team-summary strong { color: var(--text); font-size: 22px; }
.at-team-summary span { color: var(--muted); font-size: 11px; }
.at-team-today-list { display: flex; flex-direction: column; gap: 8px; }
.at-team-row {
  display: grid;
  grid-template-columns: minmax(220px,1.35fr) minmax(210px,1.4fr) repeat(3,minmax(70px,.55fr)) auto;
  align-items: center;
  gap: 12px;
  padding: 11px 13px;
  border: 1px solid var(--border);
  border-left: 4px solid var(--border);
  border-radius: 12px;
  background: var(--card);
}
.at-team-present,.at-team-late { border-left-color: #10b981; }
.at-team-absent { border-left-color: #ef4444; }
.at-team-on_leave,.at-team-approved_absence { border-left-color: #8b5cf6; }
.at-team-on_mission,.at-team-with_client,.at-team-viewing,.at-team-in_meeting { border-left-color: #3b82f6; }
.at-team-person,.at-table-person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.at-team-person img,.at-table-person img,.at-team-avatar {
  width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; object-fit: cover;
}
.at-team-avatar { display: grid; place-items: center; background: rgba(var(--primary-rgb),.13); color: var(--primary); font-size: 11px; font-weight: 800; }
.at-team-person > div,.at-team-state { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.at-team-row strong { color: var(--text); font-size: 12px; }
.at-team-row small,.at-table-reason { color: var(--muted); font-size: 10px; white-space: normal; }
.at-team-state small { line-height: 1.4; }
.at-team-actions { display: flex; justify-content: flex-end; }
.at-table-reason { display: block; max-width: 260px; margin-top: 4px; }
.at-att-row-detailed { grid-template-columns: minmax(180px,1.1fr) auto repeat(3,minmax(75px,.5fr)) minmax(180px,1fr) auto; }
.at-att-reason strong { white-space: normal; font-size: 11px; }
.at-photo-field {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  margin: 4px 0 14px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-muted);
}
.at-photo-field > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.at-photo-field strong { color: var(--text); font-size: 12px; }
.at-photo-field span { color: var(--muted); font-size: 10px; }
.at-photo-button,.at-map-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid color-mix(in srgb,var(--primary) 35%,var(--border));
  border-radius: 9px;
  background: color-mix(in srgb,var(--primary) 9%,var(--card));
  color: var(--primary);
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
  text-decoration: none;
}
.at-photo-preview { grid-column: 1/-1; }
.at-photo-preview figure { display: flex; align-items: center; gap: 10px; margin: 0; }
.at-photo-preview img { width: 84px; height: 62px; border-radius: 9px; object-fit: cover; }
.at-photo-preview figcaption { color: var(--muted); font-size: 10px; }
.at-evidence-box { max-width: 720px; }
.at-evidence-summary p { color: var(--muted); font-size: 12px; line-height: 1.6; }
.at-evidence-summary dl { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
.at-evidence-summary dl div { padding: 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-muted); }
.at-evidence-summary dt { color: var(--muted); font-size: 9px; }
.at-evidence-summary dd { margin: 4px 0 0; color: var(--text); font-size: 12px; font-weight: 700; }
.at-evidence-photos { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 14px; }
.at-evidence-photos figure { margin: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-muted); }
.at-evidence-photos img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.at-evidence-photos figcaption { padding: 8px 10px; color: var(--muted); font-size: 10px; }

@media (max-width: 800px) {
  .at-team-row { grid-template-columns: 1fr auto; }
  .at-team-row > div:nth-child(n+3):not(.at-team-actions) { display: none; }
  .at-team-summary { grid-template-columns: repeat(2,1fr); }
  .at-att-row-detailed { grid-template-columns: 1fr auto; }
  .at-att-row-detailed > div:nth-child(n+3) { display: none; }
}
@media (max-width: 520px) {
  .at-photo-field { grid-template-columns: 1fr; }
  .at-photo-preview { grid-column: 1; }
  .at-evidence-summary dl { grid-template-columns: repeat(2,1fr); }
  .at-evidence-photos { grid-template-columns: 1fr; }
}



.txn-root {
  max-width: 1500px;
  margin: 0 auto;
  padding: 28px 32px 80px;
  color: var(--text, var(--text));
}
.txn-header, .txn-toolbar, .txn-list-hdr, .txn-agent-row,
.txn-modal-hdr, .txn-detail-row, .txn-agent-nums {
  display: flex;
  align-items: center;
}
.txn-header { justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.txn-title { margin: 0; font-size: 24px; font-weight: 800; letter-spacing: -.025em; }
.txn-subtitle { margin: 5px 0 0; color: var(--text-muted, #718096); font-size: 13px; }
.txn-header-right { display: flex; align-items: center; gap: 10px; }
.txn-period-tabs {
  display: flex; gap: 3px; padding: 4px; border: 1px solid var(--border, var(--border-strong));
  border-radius: 12px; background: var(--card, #fff);
}
.txn-ptab {
  border: 0; border-radius: 9px; padding: 8px 13px; background: transparent;
  color: var(--text-muted, var(--text-secondary)); font: 600 12px/1 inherit; cursor: pointer;
}
.txn-ptab:hover { color: var(--text, var(--text)); background: var(--bg, #F7F8FF); }
.txn-ptab.active { color: #60656D; background: var(--card2); box-shadow: inset 0 0 0 1px #DDDEE8; }

.txn-toolbar {
  gap: 12px; padding: 12px; margin-bottom: 14px; border: 1px solid var(--border, var(--border-strong));
  border-radius: 14px; background: var(--card, #fff);
}
.txn-search-wrap {
  min-width: 240px; flex: 1; display: flex; align-items: center; gap: 9px;
  height: 42px; padding: 0 13px; border: 1px solid var(--border, var(--border-strong));
  border-radius: 10px; color: #8492a6; background: var(--card, #fff);
}
.txn-search { width: 100%; border: 0; outline: 0; color: var(--text, var(--text)); background: transparent; font: 400 13px/1 inherit; }
.txn-search::placeholder { color: #97a3b3; }
.txn-agent-filter-wrap {
  display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 10px 0 13px;
  border: 1px solid var(--border, var(--border-strong)); border-radius: 10px; color: var(--text-muted, var(--text-secondary));
  font-size: 11px; font-weight: 700; background: var(--card, #fff);
}
.txn-agent-filter {
  min-width: 175px; border: 0; outline: 0; color: var(--text, var(--text));
  background: transparent; font: 600 13px/1 inherit;
}
.txn-scope-label {
  display: none; padding: 8px 12px; border-radius: 999px; color: #60656D;
  background: var(--card2); font-size: 12px; font-weight: 700;
}

.txn-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.txn-stat-card {
  min-height: 96px; display: flex; align-items: center; gap: 14px; padding: 18px;
  border: 1px solid var(--border, var(--border-strong)); border-radius: 14px; background: var(--card, #fff);
}
.txn-stat-main { border-color: #DFE0EA; }
.txn-stat-gold { border-color: #eadfbd; }
.txn-stat-icon {
  width: 44px; height: 44px; flex: 0 0 44px; display: grid; place-items: center;
  border-radius: 12px;
}
.txn-si-sales { color: #747981; background: var(--card2); }
.txn-si-comm { color: #a87913; background: #fbf4df; }
.txn-si-pct { color: #286bc0; background: var(--card2); }
.txn-si-count { color: #7356bd; background: #EEEFF9; }
.txn-stat-val { margin-bottom: 6px; font-size: 20px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.txn-stat-lbl { color: var(--text-muted, #718096); font-size: 11px; font-weight: 600; }

.txn-main { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 14px; align-items: start; }
.txn-list-col, .txn-agent-col {
  overflow: hidden; border: 1px solid var(--border, var(--border-strong)); border-radius: 14px; background: var(--card, #fff);
}
.txn-list-hdr { min-height: 52px; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid var(--border, var(--border)); }
.txn-list-title { font-size: 14px; font-weight: 750; }
.txn-list-count { margin-left: 8px; color: var(--text-muted, #718096); font-size: 11px; }
.txn-source-badge { padding: 5px 9px; border-radius: 999px; color: #60656D; background: var(--card2); font-size: 10px; font-weight: 750; }
.txn-loading, .txn-agent-loading { display: flex; justify-content: center; padding: 42px 0; }
.txn-spinner { width: 24px; height: 24px; border: 3px solid #d8e9e5; border-top-color: #747981; border-radius: 50%; animation: txn-spin .75s linear infinite; }
.txn-spinner-sm { width: 17px; height: 17px; border-width: 2px; }
@keyframes txn-spin { to { transform: rotate(360deg); } }
.txn-empty { flex-direction: column; align-items: center; gap: 7px; padding: 58px 20px; color: var(--text-muted, #718096); text-align: center; }
.txn-empty strong { color: var(--text, var(--text)); font-size: 14px; }
.txn-empty span { font-size: 12px; }
.txn-table-wrap { overflow-x: auto; }
.txn-table { width: 100%; min-width: 860px; border-collapse: collapse; font-size: 12px; }
.txn-table thead th {
  padding: 11px 14px; border-bottom: 1px solid var(--border, var(--border)); color: var(--text-muted, #718096);
  background: var(--bg, #F9FAFF); font-size: 10px; font-weight: 750; letter-spacing: .035em;
  text-align:start; text-transform: uppercase; white-space: nowrap;
}
.txn-row { border-bottom: 1px solid var(--border, #F0F1FB); cursor: pointer; }
.txn-row:last-child { border-bottom: 0; }
.txn-row:hover { background: #f7fbfa; }
.txn-row td { padding: 13px 14px; vertical-align: middle; }
.txn-prop-name { max-width: 190px; overflow: hidden; color: var(--text, var(--text)); font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.txn-prop-code, .txn-buyer-phone, .txn-date { margin-top: 3px; color: var(--text-muted, #718096); font-size: 10px; }
.txn-buyer, .txn-money { color: var(--text, var(--text)); white-space: nowrap; }
.txn-buyer-phone { direction: ltr; }
.txn-agent-chip { display: inline-flex; padding: 4px 8px; border-radius: 999px; color: #60656D; background: var(--card2); font-size: 10px; font-weight: 700; white-space: nowrap; }
.txn-no-agent { color: var(--text-muted, #718096); }
.txn-money { font-variant-numeric: tabular-nums; }
.txn-comm-val { color: #747981; font-weight: 750; }
.txn-pct-badge { display: inline-flex; padding: 4px 7px; border-radius: 999px; color: #286bc0; background: var(--card2); font-size: 10px; font-weight: 750; }
.txn-load-more-wrap { justify-content: center; padding: 12px; border-top: 1px solid var(--border, var(--border)); }
.txn-load-more { padding: 8px 18px; border: 1px solid var(--border, var(--border-strong)); border-radius: 9px; color: #60656D; background: var(--card, #fff); font: 700 12px/1 inherit; cursor: pointer; }

.txn-agent-col { position: sticky; top: 18px; padding: 16px; }
.txn-agent-hdr { margin-bottom: 12px; font-size: 12px; font-weight: 800; letter-spacing: .045em; text-transform: uppercase; }
.txn-agent-list { display: flex; flex-direction: column; gap: 7px; }
.txn-agent-empty { padding: 26px 8px; color: var(--text-muted, #718096); font-size: 12px; text-align: center; }
.txn-agent-row {
  width: 100%; gap: 9px; padding: 9px; border: 1px solid transparent; border-radius: 10px;
  color: inherit; background: transparent; font-family: inherit; text-align:start; cursor: pointer;
}
.txn-agent-row:hover { border-color: #d8e8e4; background: #f7fbfa; }
.txn-agent-row.active { border-color: #D4D5DF; background: #edf8f5; }
.txn-agent-row:disabled { opacity: 1; cursor: default; }
.txn-agent-rank { width: 22px; flex: 0 0 22px; padding-top: 1px; color: var(--text-secondary); font-size: 13px; font-weight: 800; text-align: center; }
.txn-agent-row:nth-child(1) .txn-agent-rank { color: #b78013; }
.txn-agent-info { min-width: 0; flex: 1; }
.txn-agent-name { overflow: hidden; margin-bottom: 6px; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.txn-agent-bar-wrap { height: 4px; overflow: hidden; margin-bottom: 5px; border-radius: 9px; background: #EDEEF8; }
.txn-agent-bar { height: 100%; border-radius: inherit; background: #747981; transition: width .25s ease; }
.txn-agent-nums { justify-content: space-between; color: var(--text-muted, #718096); font-size: 9px; }
.txn-agent-comm { color: #60656D; font-weight: 700; }

.txn-modal-backdrop {
  display: none; position: fixed; inset: 0; z-index: 500; align-items: center; justify-content: center;
  padding: 20px; background: rgba(19, 22, 28, .55); backdrop-filter: blur(3px);
}
.txn-modal-backdrop.visible { display: flex; }
.txn-modal {
  width: 510px; max-width: 100%; max-height: 88vh; overflow-y: auto;
  border: 1px solid var(--border, var(--border-strong)); border-radius: 16px; background: var(--card, #fff);
  box-shadow: 0 24px 70px rgba(19, 22, 28, .22);
}
.txn-modal-hdr { justify-content: space-between; padding: 17px 20px; border-bottom: 1px solid var(--border, var(--border)); }
.txn-detail-source { display: block; margin-bottom: 4px; color: #747981; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.txn-detail-context { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; color: var(--text-muted, #718096); font-size: 10px; }
.txn-detail-context strong { color: #60656D; font-weight: 750; }
.txn-modal-title { max-width: 390px; overflow: hidden; margin: 0; font-size: 16px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.txn-modal-close { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--border, var(--border-strong)); border-radius: 9px; color: #718096; background: transparent; cursor: pointer; }
.txn-modal-body { padding: 16px 20px 20px; }
.txn-detail-grid { display: flex; flex-direction: column; gap: 3px; }
.txn-detail-row { align-items: flex-start; gap: 14px; padding: 10px 11px; border-radius: 8px; }
.txn-detail-row:nth-child(odd) { background: var(--bg, #F9FAFF); }
.txn-detail-highlight { margin: 3px 0; border: 1px solid #dce9e5; background: #f7fbfa !important; }
.txn-detail-gold.txn-detail-highlight { border-color: #eadfbd; background: #F8F9FF !important; }
.txn-dl { min-width: 125px; padding-top: 2px; color: var(--text-muted, #718096); font-size: 11px; font-weight: 650; }
.txn-dv { flex: 1; color: var(--text, var(--text)); font-size: 13px; line-height: 1.5; }
.txn-dv-big { font-size: 16px; font-weight: 800; }
.txn-dv small { color: var(--text-muted, #718096); font-size: 11px; }
.txn-profit { color: #747981; }
.txn-loss { color: #d14343; }
.txn-detail-notes .txn-dv { color: var(--text-muted, #718096); font-size: 12px; }
.txn-detail-actions { display: flex; justify-content: flex-end; margin-top: 14px; }
.txn-detail-actions a, .txn-detail-actions button { padding: 9px 14px; border: 0; border-radius: 9px; color: #fff; background: #747981; font: 700 12px/1 inherit; text-decoration: none; cursor: pointer; }


.txn-finance-section {
  margin-top: 14px; overflow: hidden; border: 1px solid var(--border, var(--border-strong));
  border-radius: 16px; background: var(--card, #fff);
}
.txn-finance-header {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 20px; border-bottom: 1px solid var(--border, var(--border));
}
.txn-finance-eyebrow {
  display: block; margin-bottom: 5px; color: #747981; font-size: 9px;
  font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.txn-finance-header h2 { margin: 0; font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.txn-finance-header p { margin: 5px 0 0; color: var(--text-muted, #718096); font-size: 11px; }
.txn-finance-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.txn-finance-filter-wrap {
  display: flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 10px 0 12px;
  border: 1px solid var(--border, var(--border-strong)); border-radius: 9px; color: var(--text-muted, #718096);
  font-size: 10px; font-weight: 750;
}
.txn-finance-filter-wrap select {
  min-width: 170px; border: 0; outline: 0; color: var(--text, var(--text));
  background: transparent; font: 650 12px/1 inherit;
}
.txn-finance-btn {
  min-height: 38px; padding: 0 13px; border: 1px solid #747981; border-radius: 9px;
  color: #fff; background: #747981; font: 700 11px/1 inherit; cursor: pointer;
}
.txn-finance-btn-secondary { border-color: var(--border, var(--border-strong)); color: var(--text, var(--text)); background: var(--card, #fff); }
.txn-finance-btn:disabled { opacity: .45; cursor: not-allowed; }
.txn-finance-loading { display: flex; justify-content: center; padding: 44px; }
.txn-finance-stats {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  border-bottom: 1px solid var(--border, var(--border));
}
.txn-finance-stats article { padding: 17px 20px; border-right: 1px solid var(--border, var(--border)); }
.txn-finance-stats article:last-child { border-right: 0; }
.txn-finance-stats span { display: block; margin-bottom: 7px; color: var(--text-muted, #718096); font-size: 10px; font-weight: 650; }
.txn-finance-stats strong { font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; }
.txn-finance-credit strong { color: #747981; }
.txn-finance-deduction strong { color: #c94b4b; }
.txn-finance-net { background: #f3faf8; }
.txn-finance-net strong { color: #60656D; }
.txn-finance-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(310px, .75fr); gap: 14px; padding: 14px; background: var(--bg, #F9FAFF); }
.txn-finance-panel { overflow: hidden; border: 1px solid var(--border, var(--border-strong)); border-radius: 12px; background: var(--card, #fff); }
.txn-finance-panel-head { display: flex; align-items: center; justify-content: space-between; min-height: 46px; padding: 0 14px; border-bottom: 1px solid var(--border, var(--border)); }
.txn-finance-panel-head strong { font-size: 12px; font-weight: 800; }
.txn-finance-panel-head span { color: var(--text-muted, #718096); font-size: 9px; }
.txn-finance-table-wrap { overflow-x: auto; }
.txn-finance-table { width: 100%; min-width: 920px; border-collapse: collapse; }
.txn-finance-table th {
  padding: 9px 11px; border-bottom: 1px solid var(--border, var(--border)); color: var(--text-muted, #718096);
  background: var(--bg, #F9FAFF); font-size: 9px; font-weight: 800; text-align:start; text-transform: uppercase; white-space: nowrap;
}
.txn-finance-table td { padding: 11px; border-bottom: 1px solid var(--border, #F0F1FB); font-size: 11px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.txn-finance-table tr:last-child td { border-bottom: 0; }
.txn-finance-row { cursor: pointer; }
.txn-finance-row:hover { background: #f7fbfa; }
.txn-finance-row.active { background: #edf8f5; }
.txn-finance-row td:first-child strong, .txn-finance-row td:first-child small { display: block; }
.txn-finance-row td:first-child strong { max-width: 180px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; }
.txn-finance-row td:first-child small { margin-top: 3px; color: var(--text-muted, #718096); font-size: 9px; }
.txn-not-set { display: inline-flex; padding: 4px 7px; border-radius: 999px; color: #9a6700; background: #fff7dc; font-size: 9px; font-weight: 750; }
.txn-finance-positive, .txn-finance-net-value { color: #60656D; font-weight: 750; }
.txn-finance-negative { color: #c94b4b; font-weight: 750; }
.txn-finance-empty { padding: 25px 14px !important; color: var(--text-muted, #718096); font-size: 11px; text-align: center; }
.txn-finance-side { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.txn-ledger-list, .txn-salary-history { max-height: 290px; overflow-y: auto; }
.txn-ledger-item, .txn-salary-item {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 11px 13px; border-bottom: 1px solid var(--border, #F0F1FB);
}
.txn-ledger-item:last-child, .txn-salary-item:last-child { border-bottom: 0; }
.txn-ledger-item > div:first-child, .txn-salary-item > div { min-width: 0; }
.txn-ledger-item strong, .txn-ledger-item small, .txn-salary-item strong, .txn-salary-item small, .txn-salary-item span { display: block; }
.txn-ledger-type { display: inline-flex; margin-bottom: 4px; padding: 3px 6px; border-radius: 999px; color: #6b4b08; background: #fff5d5; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.txn-ledger-credit .txn-ledger-type { color: #60656D; background: var(--card2); }
.txn-ledger-item strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.txn-ledger-item small, .txn-salary-item small { margin-top: 3px; color: var(--text-muted, #718096); font-size: 8px; }
.txn-ledger-amount { flex: 0 0 auto; text-align:end; }
.txn-ledger-amount strong { color: #c94b4b; font-size: 11px; }
.txn-ledger-credit .txn-ledger-amount strong { color: #747981; }
.txn-salary-item > div:last-child { text-align:end; }
.txn-salary-item span { overflow: hidden; max-width: 150px; color: var(--text-muted, #718096); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.txn-finance-modal { width: 560px; }
.txn-finance-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.txn-finance-form-grid label { display: flex; flex-direction: column; gap: 6px; }
.txn-finance-form-grid label > span { color: var(--text-muted, #718096); font-size: 10px; font-weight: 700; }
.txn-finance-form-grid input, .txn-finance-form-grid select, .txn-finance-form-grid textarea {
  width: 100%; box-sizing: border-box; border: 1px solid var(--border, var(--border-strong)); border-radius: 9px;
  outline: 0; color: var(--text, var(--text)); background: var(--card, #fff); font: 400 12px/1.4 inherit;
}
.txn-finance-form-grid input, .txn-finance-form-grid select { height: 40px; padding: 0 10px; }
.txn-finance-form-grid textarea { resize: vertical; padding: 10px; }
.txn-finance-form-wide { grid-column: 1 / -1; }
.txn-finance-form-footer { display: flex; justify-content: flex-end; gap: 8px; padding: 13px 20px 17px; border-top: 1px solid var(--border, var(--border)); }

@media (max-width: 1020px) {
  .txn-main { grid-template-columns: 1fr; }
  .txn-agent-col { position: static; }
  .txn-finance-grid { grid-template-columns: 1fr; }
  .txn-finance-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 780px) {
  .txn-root { padding: 18px 14px 72px; }
  .txn-header { align-items: flex-start; flex-direction: column; }
  .txn-header-right, .txn-period-tabs { width: 100%; }
  .txn-period-tabs { overflow-x: auto; }
  .txn-ptab { flex: 1 0 auto; }
  .txn-toolbar { align-items: stretch; flex-direction: column; }
  .txn-search-wrap { min-width: 0; }
  .txn-agent-filter-wrap { justify-content: space-between; }
  .txn-agent-filter { min-width: 0; flex: 1; }
  .txn-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .txn-finance-header { align-items: stretch; flex-direction: column; }
  .txn-finance-actions { justify-content: flex-start; }
  .txn-finance-filter-wrap { width: 100%; box-sizing: border-box; justify-content: space-between; }
  .txn-finance-filter-wrap select { min-width: 0; flex: 1; }
  .txn-finance-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .txn-finance-stats article { border-right: 1px solid var(--border, var(--border)); border-bottom: 1px solid var(--border, var(--border)); }
  .txn-finance-stats .txn-finance-net { grid-column: 1 / -1; }
  .txn-finance-side { display: flex; }
}
@media (max-width: 460px) {
  .txn-root { padding-inline: 10px; }
  .txn-title { font-size: 21px; }
  .txn-stat-card { min-height: 86px; padding: 12px; gap: 10px; }
  .txn-stat-icon { width: 36px; height: 36px; flex-basis: 36px; }
  .txn-stat-val { font-size: 15px; }
  .txn-stat-lbl { font-size: 9px; }
  .txn-modal-backdrop { padding: 10px; }
  .txn-dl { min-width: 100px; }
  .txn-finance-grid { padding: 8px; gap: 8px; }
  .txn-finance-form-grid { grid-template-columns: 1fr; }
  .txn-finance-form-wide { grid-column: auto; }
  .txn-finance-actions .txn-finance-btn { flex: 1; }
}





.kpi-root {
  padding: 20px 20px 80px;
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
}


.kpi-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.kpi-header-left { display: flex; align-items: center; gap: 10px; }
.kpi-title {
  font-size: 22px;
  font-weight: 800;
  color: var(--text, var(--text));
  margin: 0;
}
.kpi-month-label {
  font-size: 13px;
  color: var(--text-muted, #6b7280);
  background: rgba(255,255,255,.05);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 20px;
  padding: 3px 10px;
}
.kpi-header-right { display: flex; align-items: center; gap: 10px; }


.kpi-month-nav {
  display: flex;
  align-items: center;
  gap: 0;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 10px;
  overflow: hidden;
}
.kpi-month-btn {
  background: transparent;
  border: none;
  color: var(--text-muted, #6b7280);
  padding: 8px 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  transition: background .12s, color .12s;
}
.kpi-month-btn:hover:not(:disabled) { background: rgba(255,255,255,.06); color: var(--text, var(--text)); }
.kpi-month-btn:disabled { opacity: .3; cursor: default; }
.kpi-month-val {
  font-size: 13px;
  font-weight: 600;
  color: var(--text, var(--text));
  padding: 0 12px;
  min-width: 110px;
  text-align: center;
  border-right: 1px solid var(--border, rgba(255,255,255,.08));
  border-left: 1px solid var(--border, rgba(255,255,255,.08));
}

.kpi-btn-targets {
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(156,163,175,.1);
  border: 1px solid rgba(156,163,175,.25);
  color: var(--gold, var(--neutral-accent));
  border-radius: 10px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  transition: background .15s;
}
.kpi-btn-targets:hover { background: rgba(156,163,175,.18); }


.kpi-org-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.kpi-org-card {
  background: rgba(255,255,255,.04);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 12px;
  padding: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.kpi-org-icon {
  width: 38px; height: 38px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.kpi-oi-view    { background: rgba(99,102,241,.12); color: #818cf8; }
.kpi-oi-contact { background: rgba(34,197,94,.10);  color: var(--accent-text); }
.kpi-oi-deal    { background: rgba(156,163,175,.12); color: var(--gold, var(--neutral-accent)); }
.kpi-oi-agents  { background: rgba(14,165,233,.1);  color: #38bdf8; }

.kpi-org-val {
  font-size: 22px;
  font-weight: 800;
  color: var(--text, var(--text));
  line-height: 1;
  margin-bottom: 3px;
}
.kpi-org-val small { font-size: 13px; color: var(--text-muted, #6b7280); font-weight: 400; margin-right: 3px; }
.kpi-org-lbl { font-size: 11px; color: var(--text-muted, #6b7280); }


.kpi-loading { display: flex; justify-content: center; padding: 60px 0; }
.kpi-spinner {
  width: 26px; height: 26px;
  border: 3px solid rgba(156,163,175,.2);
  border-top-color: var(--gold, var(--neutral-accent));
  border-radius: 50%;
  animation: kpi-spin .8s linear infinite;
}
@keyframes kpi-spin { to { transform: rotate(360deg); } }

.kpi-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 60px 20px;
  color: var(--text-muted, #6b7280);
  font-size: 13px;
}


.kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 12px;
}
.kpi-agent-card {
  background: rgba(255,255,255,.03);
  border: 1px solid var(--border, rgba(255,255,255,.08));
  border-radius: 14px;
  padding: 14px;
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.kpi-agent-card:hover { border-color: rgba(156,163,175,.3); background: rgba(156,163,175,.03); }

.kpi-agent-card-top {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.kpi-agent-avatar {
  width: 40px; height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold, var(--neutral-accent)) 0%, var(--neutral-accent) 100%);
  color: var(--text);
  font-weight: 800;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.kpi-agent-identity { flex: 1; min-width: 0; }
.kpi-agent-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--text, var(--text));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kpi-agent-pos { font-size: 11px; color: var(--text-muted, #6b7280); margin-top: 2px; }


.kpi-avg-ring {
  width: 44px; height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
  flex-shrink: 0;
  border: 3px solid;
}
.kpi-ring-done { border-color: var(--accent); color: var(--accent-text); background: rgba(34,197,94,.08); }
.kpi-ring-warn { border-color: #f59e0b; color: #f59e0b; background: rgba(245,158,11,.08); }
.kpi-ring-low  { border-color: #ef4444; color: #ef4444; background: rgba(239,68,68,.08); }
.kpi-no-target-badge {
  font-size: 10px;
  color: var(--text-muted, #6b7280);
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  padding: 3px 7px;
  white-space: nowrap;
  flex-shrink: 0;
}


.kpi-krows { display: flex; flex-direction: column; gap: 9px; }
.kpi-krow { display: flex; flex-direction: column; gap: 4px; }
.kpi-krow-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.kpi-krow-lbl {
  font-size: 11px;
  color: var(--text-muted, #6b7280);
  display: flex;
  align-items: center;
  gap: 4px;
}
.kpi-krow-nums {
  display: flex;
  align-items: center;
  gap: 3px;
  font-size: 12px;
}
.kpi-actual { font-weight: 700; color: var(--text, var(--text)); }
.kpi-sep    { color: var(--text-muted, #6b7280); }
.kpi-target { color: var(--text-muted, #6b7280); }

.kpi-pct-badge {
  font-size: 10px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 20px;
  margin-right: 4px;
}
.kpi-pct-done { background: rgba(34,197,94,.12);  color: var(--accent-text); }
.kpi-pct-warn { background: rgba(245,158,11,.12); color: #f59e0b; }
.kpi-pct-low  { background: rgba(239,68,68,.12);  color: #ef4444; }
.kpi-no-target .kpi-krow-lbl { opacity: .5; }

.kpi-bar-bg {
  height: 6px;
  background: rgba(255,255,255,.07);
  border-radius: 3px;
  overflow: hidden;
}
.kpi-bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width .4s ease;
  min-width: 2px;
}


.kpi-modal-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 500;
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  align-items: center;
  justify-content: center;
}
.kpi-modal-backdrop.visible { display: flex; }

.kpi-modal {
  background: var(--surface, #181B21);
  border: 1px solid var(--border, rgba(255,255,255,.1));
  border-radius: 18px;
  width: 560px;
  max-width: 96vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  animation: kpi-modal-in .22s cubic-bezier(.22,1,.36,1);
}
@keyframes kpi-modal-in {
  from { transform: scale(.94) translateY(10px); opacity: 0; }
  to   { transform: scale(1)   translateY(0);    opacity: 1; }
}
.kpi-modal-hdr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px 12px;
  border-bottom: 1px solid var(--border, rgba(255,255,255,.08));
  flex-shrink: 0;
}
.kpi-modal-title { font-size: 15px; font-weight: 700; color: var(--text, var(--text)); margin: 0; }
.kpi-modal-close {
  background: transparent;
  border: none;
  color: var(--text-muted, #6b7280);
  cursor: pointer;
  padding: 6px;
  border-radius: 8px;
  display: flex;
  transition: background .12s, color .12s;
}
.kpi-modal-close:hover { background: rgba(255,255,255,.06); color: var(--text, var(--text)); }

.kpi-modal-body { padding: 14px 20px; overflow-y: auto; flex: 1; }
.kpi-modal-desc { font-size: 12px; color: var(--text-muted, #6b7280); margin-bottom: 14px; }
.kpi-modal-ftr {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 12px 20px 16px;
  border-top: 1px solid var(--border, rgba(255,255,255,.08));
  flex-shrink: 0;
}

.kpi-targets-table-wrap { overflow-x: auto; }
.kpi-targets-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.kpi-targets-table thead th {
  background: rgba(255,255,255,.03);
  color: var(--text-muted, #6b7280);
  font-size: 11px;
  font-weight: 600;
  text-align:end;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border, rgba(255,255,255,.07));
}
.kpi-targets-table tbody tr { border-bottom: 1px solid rgba(255,255,255,.04); }
.kpi-targets-table tbody tr:last-child { border-bottom: none; }
.kpi-targets-table tbody td { padding: 8px 10px; }
.kpi-tgt-name { font-size: 13px; font-weight: 600; color: var(--text, var(--text)); }
.kpi-tgt-input {
  background: rgba(255,255,255,.05);
  border: 1px solid var(--border, rgba(255,255,255,.1));
  border-radius: 8px;
  color: var(--text, var(--text));
  font-size: 13px;
  font-family: inherit;
  padding: 5px 8px;
  width: 70px;
  text-align: center;
  outline: none;
  transition: border-color .12s;
}
.kpi-tgt-input:focus { border-color: rgba(156,163,175,.5); }

.kpi-targets-err {
  font-size: 12px;
  color: #f87171;
  background: rgba(239,68,68,.08);
  border: 1px solid rgba(239,68,68,.2);
  border-radius: 8px;
  padding: 8px 12px;
  margin-top: 10px;
}

.kpi-btn-primary {
  background: var(--gold, var(--neutral-accent));
  color: var(--text);
  border: none;
  border-radius: 10px;
  padding: 9px 22px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  transition: opacity .15s;
}
.kpi-btn-primary:hover { opacity: .88; }
.kpi-btn-primary:disabled { opacity: .5; cursor: default; }
.kpi-btn-secondary {
  background: transparent;
  border: 1px solid var(--border, rgba(255,255,255,.1));
  color: var(--text-muted, #6b7280);
  border-radius: 10px;
  padding: 9px 18px;
  font-size: 13px;
  cursor: pointer;
  font-family: inherit;
  transition: border-color .12s, color .12s;
}
.kpi-btn-secondary:hover { border-color: rgba(255,255,255,.2); color: var(--text, var(--text)); }


.kpi-hist-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 400;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  justify-content: flex-end;
}
.kpi-hist-overlay.visible { display: flex; }

.kpi-hist-panel {
  width: 380px;
  max-width: 100vw;
  height: 100vh;
  background: var(--surface, #181B21);
  border-left: 1px solid var(--border, rgba(255,255,255,.08));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: kpi-slide-in .28s cubic-bezier(.22,1,.36,1) both;
}
@keyframes kpi-slide-in {
  from { transform: translateX(100%); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}
.kpi-hist-hdr {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 14px;
  border-bottom: 1px solid var(--border, rgba(255,255,255,.08));
  flex-shrink: 0;
  background: linear-gradient(180deg, rgba(156,163,175,.06) 0%, transparent 100%);
}
.kpi-hist-close {
  background: transparent;
  border: none;
  color: var(--text-muted, #6b7280);
  cursor: pointer;
  padding: 6px;
  border-radius: 8px;
  display: flex;
  transition: background .12s, color .12s;
  flex-shrink: 0;
}
.kpi-hist-close:hover { background: rgba(255,255,255,.06); color: var(--text, var(--text)); }
.kpi-hist-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--text, var(--text));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kpi-hist-body {
  flex: 1;
  overflow-y: auto;
  padding: 14px;
}
.kpi-hist-body::-webkit-scrollbar { width: 4px; }
.kpi-hist-body::-webkit-scrollbar-thumb { background: rgba(255,255,255,.1); border-radius: 2px; }

.kpi-hist-months { display: flex; flex-direction: column; gap: 16px; }
.kpi-hist-month {
  background: rgba(255,255,255,.03);
  border: 1px solid var(--border, rgba(255,255,255,.07));
  border-radius: 12px;
  padding: 12px;
}
.kpi-hist-mlabel {
  font-size: 12px;
  font-weight: 700;
  color: var(--gold, var(--neutral-accent));
  margin-bottom: 10px;
}
.kpi-hist-bars { display: flex; flex-direction: column; gap: 8px; }
.kpi-hist-bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.kpi-hist-type {
  font-size: 11px;
  color: var(--text-muted, #6b7280);
  min-width: 34px;
}
.kpi-hist-bar-bg { flex: 1; }
.kpi-hist-nums {
  font-size: 11px;
  color: var(--text, var(--text));
  font-weight: 600;
  min-width: 36px;
  text-align:start;
}


@media (max-width: 768px) {
  .kpi-root { padding: 14px 12px 80px; }
  .kpi-org-stats { grid-template-columns: repeat(2, 1fr); }
  .kpi-grid { grid-template-columns: 1fr; }
  .kpi-header { flex-direction: column; align-items: stretch; }
  .kpi-header-right { flex-wrap: wrap; }
  .kpi-hist-panel { width: 100vw; }
}





.mch-root {
  padding: 0 0 40px 0;
  min-height: 100%;
}


.mch-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px 12px;
  flex-wrap: wrap;
}
.mch-title {
  font-size: 1.3rem;
  font-weight: 700;
  margin: 0 0 2px;
  color: var(--text-primary, #181B21);
}
.mch-subtitle {
  font-size: 0.8rem;
  color: var(--text-muted, #888);
}
.mch-search-wrap {
  position: relative;
}
.mch-search-icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 15px;
  height: 15px;
  color: var(--text-muted, #999);
  pointer-events: none;
}
.mch-search {
  padding: 8px 34px 8px 12px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 8px;
  font-size: 0.85rem;
  width: 230px;
  background: var(--surface, #fff);
  color: var(--text-primary, #181B21);
  outline: none;
  transition: border-color .2s;
  }
.mch-search:focus { border-color: var(--accent, #6c63ff); }


.mch-tabs {
  display: flex;
  gap: 4px;
  padding: 0 24px 12px;
  border-bottom: 1.5px solid var(--border, #e8e8e8);
}
.mch-tab {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 16px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 8px;
  font-size: 0.82rem;
  cursor: pointer;
  background: var(--surface, #fff);
  color: var(--text-secondary, #666);
  transition: all .2s;
}
.mch-tab:hover { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }
.mch-tab-active {
  background: var(--accent, #6c63ff);
  border-color: var(--accent, #6c63ff);
  color: #fff !important;
}


.mch-loading {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 60px 0;
}
.mch-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 60px 0;
  color: var(--text-muted, #999);
  font-size: 0.9rem;
}
.mch-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--border, #e0e0e0);
  border-top-color: var(--accent, #6c63ff);
  border-radius: 50%;
  animation: mch-spin .7s linear infinite;
}
@keyframes mch-spin { to { transform: rotate(360deg); } }


.mch-list {
  padding: 12px 24px 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mch-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: var(--surface, #fff);
  border: 1.5px solid var(--border, #e8e8e8);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
  }
.mch-card:hover {
  border-color: var(--accent, #6c63ff);
  box-shadow: 0 2px 10px rgba(108,99,255,.08);
}
.mch-card-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--accent-light, #ECEDF7);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--accent, #6c63ff);
}
.mch-card-avatar svg { width: 18px; height: 18px; }
.mch-prop-avatar { background: var(--teal-light, #e0f4f1); color: var(--teal, #7E838B); }
.mch-card-info { flex: 1; min-width: 0; }
.mch-card-name {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-primary, #181B21);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mch-card-sub {
  font-size: 0.75rem;
  color: var(--text-muted, #888);
  margin-top: 2px;
}
.mch-card-prefs, .mch-card-addr {
  font-size: 0.72rem;
  color: var(--text-muted, #aaa);
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mch-card-linked {
  font-size: 0.72rem;
  color: var(--teal, #7E838B);
  margin-top: 3px;
}
.mch-no-budget, .mch-no-prefs { color: var(--text-muted, #bbb); font-size: 0.72rem; }
.mch-card-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex-shrink: 0;
}
.mch-budget {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--green, var(--accent-text));
}
.mch-price {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--accent, #6c63ff);
}
.mch-code { font-size: 0.72rem; color: var(--text-muted, #aaa); font-weight: 400; }
.mch-card-arrow { font-size: 1.1rem; color: var(--text-muted, #ccc); }
.mch-match-badge {
  font-size: 0.7rem;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 20px;
  background: var(--accent, #6c63ff);
  color: #fff;
}
.mch-match-zero { background: var(--border, #e0e0e0); color: var(--text-muted, #999); }


.mch-load-more {
  display: flex;
  justify-content: center;
  padding: 16px;
}
.mch-btn-more {
  padding: 8px 24px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 8px;
  background: var(--surface, #fff);
  font-size: 0.82rem;
  cursor: pointer;
  color: var(--text-secondary, #666);
  transition: all .2s;
}
.mch-btn-more:hover { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }




.mch-panel-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0);
  z-index: 1200;
  display: flex;
  justify-content: flex-start;   
  pointer-events: none;
  transition: background .22s ease;
}
.mch-panel-overlay-open {
  background: rgba(0,0,0,.38);
  pointer-events: all;
}


.mch-panel {
  width: min(500px, 100vw);
  height: 100%;
  background: var(--surface, #fff);
  display: flex;
  flex-direction: column;
  transform: translateX(-100%);  
  transition: transform .28s cubic-bezier(.4,0,.2,1);
  box-shadow: 4px 0 32px rgba(0,0,0,.14);
  overflow: hidden;
  }
.mch-panel-overlay-open .mch-panel { transform: translateX(0); }


.mch-panel-hdr {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px 14px;
  border-bottom: 1px solid var(--border, #eee);
  flex-shrink: 0;
  background: var(--surface, #fff);
}
.mch-panel-avatar {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: var(--accent, #6c63ff);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.88rem;
  font-weight: 700;
  flex-shrink: 0;
  letter-spacing: .5px;
}
.mch-panel-hdr-info { flex: 1; min-width: 0; }
.mch-panel-name {
  font-size: 0.94rem;
  font-weight: 700;
  color: var(--text-primary, #181B21);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mch-panel-meta {
  font-size: 0.74rem;
  color: var(--text-muted, #888);
  margin-top: 3px;
}
.mch-panel-hdr-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.mch-panel-close {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: none;
  background: var(--bg, #f5f5f5);
  cursor: pointer;
  color: var(--text-muted, #999);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, color .15s;
}
.mch-panel-close:hover {
  background: var(--border, #e8e8e8);
  color: var(--text-primary, #333);
}
.mch-btn-prefs {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px;
  background: var(--bg, #f5f5f5);
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 7px;
  font-size: 0.76rem;
  cursor: pointer;
  color: var(--text-secondary, #555);
  transition: all .2s;
  white-space: nowrap;
}
.mch-btn-prefs:hover { border-color: var(--accent, #6c63ff); color: var(--accent, #6c63ff); }


.mch-panel-count-bar {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px 18px;
  background: #f0fdf4;
  border-bottom: 1px solid #dcfce7;
  font-size: 0.78rem;
  font-weight: 600;
  color: #15803d;
  flex-shrink: 0;
}
.mch-count-icon {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}


.mch-prefs-form {
  padding: 14px 18px;
  background: var(--bg, #F8F9FF);
  border-bottom: 1px solid var(--border, #eee);
  flex-shrink: 0;
}
.mch-prefs-title { font-size: 0.82rem; font-weight: 600; color: var(--text-primary, #333); margin-bottom: 10px; }
.mch-prefs-grid { display: flex; flex-direction: column; gap: 8px; }
.mch-prefs-label { font-size: 0.74rem; color: var(--text-muted, #888); display: block; }
.mch-prefs-types { display: flex; flex-wrap: wrap; gap: 6px; }
.mch-type-chip {
  padding: 4px 10px;
  border: 1.5px solid var(--border, #ddd);
  border-radius: 20px;
  font-size: 0.74rem;
  cursor: pointer;
  transition: all .15s;
  background: var(--surface, #fff);
  color: var(--text-secondary, #555);
}
.mch-type-chip:hover { border-color: var(--accent, #6c63ff); }
.mch-type-chip-sel { background: var(--accent, #6c63ff); border-color: var(--accent, #6c63ff); color: #fff; }
.mch-prefs-input {
  padding: 7px 10px;
  border: 1.5px solid var(--border, #e0e0e0);
  border-radius: 7px;
  font-size: 0.82rem;
  width: 100%;
  box-sizing: border-box;
  background: var(--surface, #fff);
  color: var(--text-primary, #181B21);
  outline: none;
  }
.mch-prefs-input:focus { border-color: var(--accent, #6c63ff); }
.mch-prefs-ftr { display: flex; gap: 8px; margin-top: 12px; }
.mch-btn-primary {
  padding: 7px 16px;
  background: var(--accent, #6c63ff);
  color: #fff;
  border: none;
  border-radius: 7px;
  font-size: 0.82rem;
  cursor: pointer;
  transition: opacity .2s;
}
.mch-btn-primary:hover { opacity: .88; }
.mch-btn-secondary {
  padding: 7px 16px;
  background: var(--surface, #fff);
  color: var(--text-secondary, #555);
  border: 1.5px solid var(--border, #ddd);
  border-radius: 7px;
  font-size: 0.82rem;
  cursor: pointer;
  transition: border-color .2s;
}
.mch-btn-secondary:hover { border-color: var(--accent, #6c63ff); }


.mch-panel-body { flex: 1; overflow-y: auto; }


.mch-panel-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 60px 16px;
  color: var(--text-muted, #aaa);
  font-size: 0.82rem;
}


.mch-panel-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 60px 24px;
  color: var(--text-muted, #bbb);
  font-size: 0.85rem;
  text-align: center;
}
.mch-hint { font-size: 0.75rem; color: var(--accent, #6c63ff); }


.mch-panel-err {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 50px 24px;
  color: var(--text-muted, #aaa);
  font-size: 0.85rem;
  text-align: center;
}
.mch-btn-retry {
  padding: 7px 18px;
  background: var(--accent, #6c63ff);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 0.82rem;
  cursor: pointer;
  margin-top: 4px;
  transition: opacity .2s;
}
.mch-btn-retry:hover { opacity: .85; }


.mch-result-table { padding: 6px 0; }

.mch-result-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border, #f0f0f0);
  cursor: pointer;
  transition: background .12s;
  position: relative;
}
.mch-result-row:hover { background: var(--bg, #F8F9FF); }
.mch-result-row:last-child { border-bottom: none; }


.mch-row-rank {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--bg, #F0F1FB);
  color: var(--text-muted, #999);
  font-size: 0.7rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}


.mch-row-main { flex: 1; min-width: 0; }
.mch-row-name-wrap { display: flex; align-items: center; gap: 8px; }
.mch-row-avatar {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.mch-row-name {
  font-size: 0.87rem;
  font-weight: 600;
  color: var(--text-primary, #181B21);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mch-code { font-size: 0.74rem; color: var(--text-muted, #aaa); font-weight: 400; }
.mch-row-details {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
}
.mch-dtag {
  font-size: 0.71rem;
  padding: 2px 7px;
  border-radius: 5px;
  background: var(--bg, #F0F1FB);
  color: var(--text-secondary, #666);
}
.mch-row-reasons {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 5px;
}
.mch-reason {
  font-size: 0.67rem;
  padding: 2px 7px;
  border-radius: 20px;
  background: var(--accent-light, #ECEDF7);
  color: var(--accent, #6c63ff);
  font-weight: 500;
}


.mch-row-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  flex-shrink: 0;
  min-width: 80px;
}
.mch-row-price { font-size: 0.74rem; color: var(--accent, #6c63ff); font-weight: 600; }


.mch-score-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 4px 10px;
  border-radius: 8px;
  line-height: 1.2;
  min-width: 54px;
}
.mch-score-pct { font-size: 0.86rem; font-weight: 800; }
.mch-score-lbl { font-size: 0.62rem; font-weight: 500; opacity: .75; }
.mch-score-high { background: #dcfce7; color: #15803d; }
.mch-score-mid  { background: #fef9c3; color: #854d0e; }
.mch-score-low  { background: #fee2e2; color: #b91c1c; }


.mch-btn-link {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: var(--accent, #6c63ff);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 0.71rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity .2s;
  white-space: nowrap;
}
.mch-btn-link:hover { opacity: .82; }





.hrp-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 400;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  align-items: flex-start;
  justify-content: flex-end;
}
.hrp-overlay.visible { display: flex; }


.hrp-panel {
  width: 420px;
  max-width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--surface, #181B21);
  border-left: 1px solid var(--border, rgba(255,255,255,0.08));
  overflow: hidden;
  animation: hrp-slide-in 0.28s cubic-bezier(.22,1,.36,1) both;
}
@keyframes hrp-slide-in {
  from { transform: translateX(100%); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}


.hrp-header {
  position: relative;
  padding: 28px 20px 20px;
  background: linear-gradient(180deg, rgba(156,163,175,.08) 0%, transparent 100%);
  border-bottom: 1px solid var(--border, rgba(255,255,255,0.08));
  display: flex;
  align-items: flex-start;
  gap: 14px;
  flex-shrink: 0;
}

.hrp-close {
  position: absolute;
  top: 12px;
  left: 12px;
  background: transparent;
  border: none;
  color: var(--text-muted, #6b7280);
  cursor: pointer;
  padding: 6px;
  border-radius: 8px;
  display: flex;
  transition: background .15s, color .15s;
}
.hrp-close:hover { background: rgba(255,255,255,.06); color: var(--text, var(--text)); }

.hrp-avatar-wrap { position: relative; flex-shrink: 0; }
.hrp-avatar {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--gold, var(--neutral-accent)) 0%, var(--neutral-accent) 100%);
  color: #000;
  font-weight: 700;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: .5px;
}
.hrp-active-dot {
  position: absolute;
  bottom: 1px;
  right: 1px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--card2);
  border: 2px solid var(--surface, #181B21);
}
.hrp-active-dot.active { background: var(--accent-soft); }

.hrp-identity { flex: 1; min-width: 0; }
.hrp-name {
  font-size: 18px;
  font-weight: 700;
  color: var(--text, var(--text));
  margin: 0 0 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hrp-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
}
.hrp-role-chip {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 20px;
  background: rgba(156,163,175,.15);
  color: var(--gold, var(--neutral-accent));
  border: 1px solid rgba(156,163,175,.25);
}
.hrp-team { font-size: 12px; color: var(--text-muted, #6b7280); }

.hrp-contact-row { display: flex; gap: 10px; flex-wrap: wrap; }
.hrp-contact-item {
  font-size: 11px;
  color: var(--text-muted, #6b7280);
  direction: ltr;
}


.hrp-loading {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: var(--text-muted, #6b7280);
  font-size: 13px;
}
.hrp-spinner {
  width: 28px;
  height: 28px;
  border: 3px solid rgba(156,163,175,.2);
  border-top-color: var(--gold, var(--neutral-accent));
  border-radius: 50%;
  animation: hrp-spin 0.8s linear infinite;
}
@keyframes hrp-spin { to { transform: rotate(360deg); } }

.hrp-error {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  color: #f87171;
  font-size: 13px;
  text-align: center;
}


.hrp-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.hrp-body::-webkit-scrollbar { width: 4px; }
.hrp-body::-webkit-scrollbar-thumb { background: rgba(255,255,255,.1); border-radius: 2px; }


.hrp-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.hrp-stat-card {
  background: rgba(255,255,255,.04);
  border: 1px solid var(--border, rgba(255,255,255,0.08));
  border-radius: 10px;
  padding: 10px 6px;
  text-align: center;
}
.hrp-stat-val {
  font-size: 20px;
  font-weight: 700;
  color: var(--gold, var(--neutral-accent));
  line-height: 1;
  margin-bottom: 4px;
}
.hrp-stat-lbl {
  font-size: 10px;
  color: var(--text-muted, #6b7280);
  line-height: 1.2;
}


.hrp-section {
  background: rgba(255,255,255,.03);
  border: 1px solid var(--border, rgba(255,255,255,0.08));
  border-radius: 12px;
  padding: 12px 14px;
}
.hrp-section-title {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted, #6b7280);
  text-transform: uppercase;
  letter-spacing: .6px;
  margin-bottom: 10px;
}


.hrp-sparkline-wrap {
  width: 100%;
  overflow: hidden;
}
.hrp-sparkline-wrap canvas {
  display: block;
  width: 100%;
}


.hrp-att-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  margin-bottom: 10px;
}
.hrp-att-chip {
  border-radius: 8px;
  padding: 8px 4px;
  text-align: center;
}
.hrp-att-present { background: rgba(34,197,94,.12);  border: 1px solid rgba(34,197,94,.2); }
.hrp-att-late    { background: rgba(245,158,11,.12); border: 1px solid rgba(245,158,11,.2); }
.hrp-att-absent  { background: rgba(239,68,68,.12);  border: 1px solid rgba(239,68,68,.2); }
.hrp-att-leave   { background: rgba(139,92,246,.12); border: 1px solid rgba(139,92,246,.2); }

.hrp-att-num {
  display: block;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 3px;
}
.hrp-att-present .hrp-att-num { color: var(--accent-text); }
.hrp-att-late    .hrp-att-num { color: #f59e0b; }
.hrp-att-absent  .hrp-att-num { color: #ef4444; }
.hrp-att-leave   .hrp-att-num { color: #8b5cf6; }

.hrp-att-lbl { font-size: 10px; color: var(--text-muted, #6b7280); }

.hrp-att-extra {
  display: flex;
  gap: 16px;
  font-size: 11px;
  color: var(--text-muted, #6b7280);
}
.hrp-att-extra b { color: var(--text, var(--text)); font-weight: 600; }


.hrp-cal {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 3px;
}
.hrp-cal-cell {
  aspect-ratio: 1;
  border-radius: 3px;
  transition: transform .1s;
  cursor: default;
}
.hrp-cal-cell:hover { transform: scale(1.3); z-index: 1; }


.hrp-activity-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.hrp-act-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.hrp-act-icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: rgba(156,163,175,.12);
  border: 1px solid rgba(156,163,175,.2);
  color: var(--gold, var(--neutral-accent));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.hrp-act-info { flex: 1; min-width: 0; }
.hrp-act-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--text, var(--text));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hrp-act-desc {
  font-size: 11px;
  color: var(--text-muted, #6b7280);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hrp-act-time {
  font-size: 10px;
  color: var(--text-muted, #6b7280);
  white-space: nowrap;
  flex-shrink: 0;
}


.hrp-footer-info {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text-muted, #6b7280);
  padding: 4px 0 8px;
  border-top: 1px solid var(--border, rgba(255,255,255,0.08));
  margin-top: auto;
}


.hrp-empty {
  font-size: 12px;
  color: var(--text-muted, #6b7280);
  text-align: center;
  padding: 16px 0;
}


@media (max-width: 480px) {
  .hrp-panel { width: 100vw; }
  .hrp-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .hrp-cal { grid-template-columns: repeat(6, 1fr); }
}



/* Removed: html,body{direction:ltr;text-align:left}. Declared here, thousands of lines after
   the layout rules, it overrode the inherited direction from <html dir> for the ENTIRE app —
   with it in place the sidebar and every logical property stayed in LTR orientation no matter
   what language was selected. Direction now comes from <html dir> alone. */
.mention-autocomplete{position:absolute;background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:9999;max-height:180px;overflow-y:auto;min-width:190px;padding:4px}
body.dark .mention-autocomplete{background:#262626;border-color:#424242}
.mention-option{padding:8px 12px;cursor:pointer;border-radius:7px;display:flex;align-items:center;gap:8px;font-size:13px}
.mention-option:hover{background:var(--card2)}
body.dark .mention-option:hover{background:#363636}
.mention-avatar{width:24px;height:24px;border-radius:6px;background:linear-gradient(135deg,var(--primary),#34d399);color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}
.mention-role{font-size:10px;color:var(--text-secondary);margin-left:auto}
.pwa-install-chip{
  position:static;
  inset:auto;
  z-index:auto;
  min-height:36px;
  padding:0 11px;
  border:1px solid var(--border);
  background:var(--card);
  color:var(--text-light);
  border-radius:10px;
  font:600 12px/1 inherit;
  box-shadow:none;
  cursor:pointer;
}
.chat-window-shell{flex:1;display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}
[data-locale-contract="en-only"] .rtl-only,[data-locale-contract="en-only"] .language-selector{display:none!important}


.ac-shell{max-width:1440px;margin:0 auto;padding:28px;color:var(--text);font-family:inherit}
.ac-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:22px}
.ac-header h2{margin:0;font-size:24px;letter-spacing:-.03em}.ac-header p,.ac-section-head p{margin:6px 0 0;color:var(--text-muted);font-size:13px}
.ac-primary{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:12px;padding:11px 17px;background:#787D85;color:#fff;font:700 13px inherit;cursor:pointer;box-shadow:0 8px 22px rgba(120, 125, 133,.18)}
.ac-tabs{display:flex;gap:5px;border-bottom:1px solid var(--border);margin-bottom:20px}.ac-tabs button{border:0;background:transparent;padding:11px 15px;color:var(--text-muted);font:700 13px inherit;cursor:pointer;border-bottom:2px solid transparent}.ac-tabs button.active{color:#787D85;border-bottom-color:#787D85}
.ac-content{background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 28px rgba(19, 22, 28,.05);overflow:hidden}
.ac-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px 18px;border-bottom:1px solid var(--border);color:var(--text-muted);font-size:12px}
.ac-search{display:flex;align-items:center;gap:9px;width:min(440px,70%);border:1px solid var(--border);background:var(--bg);border-radius:10px;padding:0 12px}.ac-search input{width:100%;border:0;outline:0;background:transparent;padding:10px 0;color:var(--text);font:500 13px inherit}
.ac-table-wrap,.ac-matrix-wrap,.ac-edit-matrix{overflow:auto}.ac-table,.ac-matrix{width:100%;border-collapse:collapse}.ac-table th,.ac-table td{padding:13px 16px;text-align:start;border-bottom:1px solid var(--border);font-size:12px;white-space:nowrap}.ac-table th{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);background:color-mix(in srgb,var(--bg) 70%,var(--card))}
.ac-user{display:flex;align-items:center;gap:10px}.ac-user strong,.ac-user small{display:block}.ac-user strong{font-size:13px}.ac-user small{font-size:11px;color:var(--text-muted);margin-top:2px}.ac-avatar{width:34px;height:34px;border-radius:10px;background:#e8f5f1;color:#5F646C;display:flex;align-items:center;justify-content:center;font-weight:800;overflow:hidden}.ac-avatar img{width:100%;height:100%;object-fit:cover}
.ac-chip,.ac-status{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:800}.ac-chip.role{background:var(--card2);color:#4338ca}.ac-chip.profile{background:#ecfdf5;color:#047857}.ac-status.active{background:#ecfdf5;color:#047857}.ac-status.inactive{background:#fef2f2;color:#b91c1c}
.ac-agent-code{display:inline-flex;max-width:160px;overflow:hidden;text-overflow:ellipsis;border-radius:7px;padding:5px 8px;background:var(--bg);color:var(--text);font-size:10px;font-weight:750}
.ac-status.pending{background:#fff7ed;color:#9a3412}.ac-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px}.ac-row-actions button{display:inline-flex;align-items:center;justify-content:center;gap:5px;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:9px;padding:7px 10px;font:700 11px inherit;cursor:pointer}
.ac-section-head{padding:20px 22px;border-bottom:1px solid var(--border)}.ac-section-head h3{margin:0;font-size:17px}
.ac-role-tree{padding:20px 24px 28px}.ac-role-node{position:relative;margin-left:calc(var(--level) * 30px)}.ac-role-node:not(:first-child){margin-top:8px}.ac-role-card{min-height:54px;display:flex;align-items:center;gap:11px;border:1px solid var(--border);border-radius:12px;padding:9px 13px;background:var(--card);position:relative}.ac-role-node[style*="--level:1"]>.ac-role-card:before,.ac-role-node[style*="--level:2"]>.ac-role-card:before{content:"";position:absolute;left:-22px;width:17px;border-top:1px dashed var(--border)}.ac-role-icon{width:32px;height:32px;border-radius:9px;background:#effaf7;color:#0f8f75;display:flex;align-items:center;justify-content:center}.ac-role-card strong,.ac-role-card small{display:block}.ac-role-card strong{font-size:13px}.ac-role-card small{font-size:10px;color:var(--text-muted);margin-top:3px}.ac-role-card em{margin-left:auto;color:var(--text-muted);font:600 11px inherit}
.ac-profile-list{padding:18px;display:grid;gap:12px}.ac-profile-card{border:1px solid var(--border);border-radius:13px;background:var(--card);overflow:hidden}.ac-profile-card summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;cursor:pointer}.ac-profile-card summary::-webkit-details-marker{display:none}.ac-profile-card summary strong,.ac-profile-card summary small{display:block}.ac-profile-card summary small{font-size:10px;color:var(--text-muted);margin-top:3px}
.ac-matrix th,.ac-matrix td{padding:8px 10px;border-top:1px solid var(--border);text-align:center;font-size:10px;white-space:nowrap}.ac-matrix th:first-child,.ac-matrix td:first-child{text-align:start;position:sticky;left:0;background:var(--card);z-index:1}.ac-perm-dot{color:#D4D5DF;font-weight:800}.ac-perm-dot.on{color:#787D85}
.ac-modal{max-width:940px!important}.ac-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.ac-form-grid label{display:grid;gap:6px;color:var(--text-muted);font-size:11px;font-weight:700}.ac-info{margin:14px 0 0;padding:10px 12px;border-radius:10px;background:#F5F6FF;color:#1d4ed8;font-size:11px}.ac-form-section{margin-top:18px;border:1px solid var(--border);border-radius:12px;overflow:hidden}.ac-form-section>div:first-child{padding:12px 14px}.ac-form-section strong,.ac-form-section small{display:block}.ac-form-section small{margin-top:3px;color:var(--text-muted);font-size:10px}.ac-edit-matrix{max-height:340px}.ac-edit-matrix input{accent-color:#787D85}.ac-loading{padding:40px;text-align:center;color:var(--text-muted)}
.ac-group-field{grid-column:1/-1}.ac-group-select{min-height:96px!important;padding:6px!important}.ac-group-select option{padding:7px 9px;border-radius:6px}.ac-group-field small{font-size:9px;font-weight:500}
.ac-kiosk-face-modal{max-width:720px!important}.ac-kiosk-face-form{display:grid;grid-template-columns:190px minmax(0,1fr);gap:22px;align-items:start}.ac-kiosk-face-preview-wrap{display:grid;gap:9px;text-align:center;color:var(--text-muted);font-size:10px;font-weight:750}.ac-kiosk-face-preview-wrap img,.ac-kiosk-face-placeholder{width:190px;aspect-ratio:1;object-fit:cover;border:1px solid var(--border);border-radius:12px;background:var(--bg)}.ac-kiosk-face-placeholder{display:flex;align-items:center;justify-content:center;color:#5F646C;font-size:38px;font-weight:850}.ac-kiosk-face-fields{display:grid;gap:13px}.ac-kiosk-face-fields>label:first-child{display:grid;gap:6px;color:var(--text-muted);font-size:11px;font-weight:750}.ac-kiosk-face-picker{position:relative;display:grid;grid-template-columns:34px 1fr;column-gap:10px;align-items:center;min-height:92px;padding:14px;border:1px dashed #787D85;border-radius:10px;background:color-mix(in srgb,#787D85 5%,var(--card));cursor:pointer}.ac-kiosk-face-picker>span{grid-row:1/3;width:34px;height:34px;border-radius:9px;background:#787D85;color:#fff;display:flex;align-items:center;justify-content:center}.ac-kiosk-face-picker strong,.ac-kiosk-face-picker small{display:block}.ac-kiosk-face-picker strong{font-size:12px}.ac-kiosk-face-picker small{margin-top:3px;color:var(--text-muted);font-size:10px;line-height:1.5}.ac-kiosk-face-picker input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.ac-kiosk-face-fields p{margin:0;color:var(--text-muted);font-size:10px;line-height:1.6}
@media(max-width:768px){
  .ac-shell{padding:14px}.ac-header{align-items:stretch;flex-direction:column}.ac-primary{justify-content:center}.ac-content{border-radius:12px}.ac-toolbar{align-items:stretch;flex-direction:column}.ac-search{width:100%}.ac-role-tree{padding:14px}.ac-role-node{margin-left:calc(var(--level) * 16px)}.ac-form-grid{grid-template-columns:1fr}.ac-modal{width:calc(100vw - 20px)!important;max-height:92vh}.ac-edit-matrix{max-height:280px}
  .ac-table-wrap{overflow:visible;padding:10px;background:var(--bg)}
  .ac-table,.ac-table tbody,.ac-table tr,.ac-table td{display:block;width:100%;min-width:0!important}
  .ac-table thead{display:none}
  .ac-table tr{margin-bottom:10px;padding:12px;border:1px solid var(--border);border-radius:8px;background:var(--card);box-shadow:0 3px 12px rgba(19, 22, 28,.035)}
  .ac-table td{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 2px;border:0;white-space:normal;text-align:end}
  .ac-table td:first-child{display:block;padding-top:0;padding-bottom:12px;border-bottom:1px solid var(--border);text-align:start}
  .ac-table td:not(:first-child)::before{flex:0 0 auto;color:var(--text-muted);font-size:9px;font-weight:800;letter-spacing:0;text-transform:uppercase}
  .ac-table td:nth-child(2)::before{content:"Agent code"}.ac-table td:nth-child(3)::before{content:"Role"}.ac-table td:nth-child(4)::before{content:"Profile"}.ac-table td:nth-child(5)::before{content:"Visibility"}.ac-table td:nth-child(6)::before{content:"Kiosk face"}.ac-table td:nth-child(7)::before{content:"Status"}.ac-table td:nth-child(8)::before{content:"Actions"}
  .ac-row-actions,.ac-row-actions button{width:100%}.ac-row-actions{display:grid;grid-template-columns:1fr 1fr}.ac-row-actions button{min-height:40px}
  .ac-agent-code{max-width:62%;overflow-wrap:anywhere;white-space:normal;text-align:start}
}
@media(max-width:600px){.ac-kiosk-face-modal{width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important}.ac-kiosk-face-form{grid-template-columns:1fr}.ac-kiosk-face-preview-wrap img,.ac-kiosk-face-placeholder{width:min(190px,60vw);margin:0 auto}.ac-kiosk-face-picker{min-height:104px}}


#small-modal.syncUi-data-modal .modal{width:min(1120px,96vw);max-width:1120px;max-height:92vh}
#small-modal.syncUi-data-modal #small-modal-body{max-height:72vh;overflow:auto;padding:22px}
.syncUi-panel{display:grid;gap:16px;color:var(--text)}
.syncUi-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.syncUi-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.syncUi-box{border:1px solid var(--border);border-radius:14px;background:var(--card);padding:16px}
.syncUi-box h3{margin:0 0 10px;font-size:15px}
.syncUi-label{display:block;font-size:12px;font-weight:750;color:var(--text-light);margin:0 0 6px}
.syncUi-control{width:100%;min-height:44px;border:1px solid var(--border);border-radius:10px;background:var(--input-bg,var(--card));color:var(--text);padding:9px 11px;font:inherit}
.syncUi-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.syncUi-btn{min-height:42px;border:1px solid var(--border);border-radius:10px;padding:8px 14px;background:var(--card);color:var(--text);font-weight:750;cursor:pointer}
.syncUi-btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}
.syncUi-btn.warn{background:#9b6b16;color:#fff;border-color:#9b6b16}
.syncUi-btn:disabled{opacity:.55;cursor:not-allowed}
.syncUi-note{font-size:12px;color:var(--text-muted);line-height:1.7}
.syncUi-status{border-radius:10px;padding:10px 12px;background:var(--track);font-size:12px;white-space:pre-wrap}
.syncUi-map-wrap{overflow:auto;border:1px solid var(--border);border-radius:12px;max-height:420px}
.syncUi-map-table{width:100%;border-collapse:collapse;min-width:760px}
.syncUi-map-table th,.syncUi-map-table td{padding:9px 10px;border-bottom:1px solid var(--border);text-align:start;vertical-align:middle;font-size:12px}
.syncUi-map-table th{position:sticky;top:0;background:var(--card2);z-index:2}
.syncUi-map-table select{min-width:260px}
.syncUi-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.syncUi-kpi{padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--card2)}
.syncUi-kpi b{display:block;font-size:20px;margin-top:5px}
.syncUi-run{display:grid;grid-template-columns:1fr auto;gap:10px;border-bottom:1px solid var(--border);padding:9px 0;font-size:12px}
@media(max-width:760px){.syncUi-grid,.syncUi-grid-3,.syncUi-kpis{grid-template-columns:1fr}.syncUi-actions .syncUi-btn{width:100%}}


.dash-command-center{
  --dc-ink:var(--text);
  --dc-muted:var(--text-muted);
  --dc-line:#E7E8F2;
  --dc-soft:#FAFBFF;
  --dc-green:#636870;
  --dc-gold:var(--warning);
  padding:34px 32px 64px!important;
  color:var(--dc-ink);
  background:
    radial-gradient(circle at 96% 2%,rgba(99, 104, 112,.07),transparent 24rem),
    linear-gradient(180deg,var(--card) 0,#F7F8FF 100%);
}

.dc-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:22px}
.dc-eyebrow,.dc-panel-head small,.dc-attention header small{margin:0 0 7px;color:var(--dc-green);font-size:10px;font-weight:800;letter-spacing:.18em}
#dash-greeting h1{margin:0;font-size:34px;line-height:1.12;font-weight:450;letter-spacing:-.035em}
#dash-greeting h1 strong{font-weight:800}
#dash-greeting-sub{display:flex;align-items:center;gap:8px;margin-top:9px;color:var(--dc-muted);font-size:12px}
#dash-greeting-sub strong{color:var(--text)}
.dc-sub-alert{padding:4px 8px;border-radius:999px;background:#fff1f2;color:#be123c;font-weight:700}
.dc-agent-filter{display:flex;flex-direction:column;gap:5px;min-width:220px}
.dc-agent-filter span{font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--text-secondary);text-transform:uppercase}
.dc-agent-filter select{height:42px;padding:0 38px 0 13px;border:1px solid #D4D5DF;border-radius:12px;background:#fff;color:var(--dc-ink);font-size:13px;font-weight:700;outline:none}
.dc-agent-filter select:focus{border-color:var(--border-strong);box-shadow:0 0 0 3px rgba(99, 104, 112,.12)}
.dc-scope-badge{display:inline-flex;align-items:center;gap:8px;padding:10px 13px;border:1px solid #cfe8e4;border-radius:999px;background:#f0fdfa;color:var(--text-secondary);font-size:12px;font-weight:750}
.dc-scope-badge i{width:7px;height:7px;border-radius:50%;background:#10b981;box-shadow:0 0 0 4px rgba(16,185,129,.12)}
/* r211: searchable Assigned Agent scope + active-filter chip */
.dc-scope-wrap{display:flex;flex-direction:column;gap:8px;min-width:min(100%,320px)}
.dc-scope-wrap .dc-agent-filter{display:flex;flex-direction:column;gap:6px;width:100%;min-width:0}
.dc-scope-wrap .dc-agent-filter>span{font-size:11px;font-weight:750;color:var(--dc-muted)}
.dc-scope-wrap .dc-admin-user-combo{width:100%}
.dc-scope-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 10px 7px 12px;border:1px solid #cfe8e4;border-radius:999px;background:#f0fdfa;color:#134e4a;font-size:12px;font-weight:700;max-width:100%}
.dc-scope-chip span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dc-scope-chip button{display:inline-grid;place-items:center;width:20px;height:20px;border:0;border-radius:50%;background:#0f766e;color:#fff;font-size:12px;line-height:1;cursor:pointer}
.dc-scope-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.dc-scope-team{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid #D4D5DF;border-radius:999px;background:#fff;color:var(--text);font-size:12px;font-weight:700;cursor:pointer}
.dc-scope-team[aria-pressed="true"]{border-color:#0f766e;background:#f0fdfa;color:#134e4a}
.dc-source-note{margin:6px 0 0;font-size:10.5px;color:var(--text-secondary)}
.dc-points-panel{padding:0 16px 14px}
.dc-points-def{margin:0 0 8px;font-size:11.5px;color:var(--text-secondary);line-height:1.5}
.dc-points-def code{font-size:11px;background:#F5F6FF;padding:1px 5px;border-radius:5px}
.dc-points-table{width:100%;max-width:100%;border-collapse:collapse;font-size:11px}
.dc-points-table th,.dc-points-table td{padding:6px 6px;border-bottom:1px solid var(--border);text-align:end;white-space:nowrap}
.dc-points-table th:first-child,.dc-points-table td:first-child{text-align:start}
.dc-points-table th{color:var(--text-secondary);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.dc-points-table td.dc-points-total{font-weight:800;color:#134e4a}
.dc-points-warn{color:#b45309;font-weight:700}

.dc-assistant-card{position:relative;display:flex;gap:18px;margin-bottom:18px;padding:20px;border:1px solid #E1E2EC;border-radius:18px;background:linear-gradient(135deg,#fff 0,#fbfdfd 64%,#eefbf8 100%);box-shadow:0 12px 35px rgba(19, 22, 28,.045);overflow:hidden}
.dc-assistant-card:after{content:"";position:absolute;right:-34px;top:-42px;width:150px;height:150px;border:1px solid rgba(99, 104, 112,.12);border-radius:50%}
.dc-assistant-mark{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:13px;background:var(--accent);color:#fff;box-shadow:0 8px 18px rgba(99, 104, 112,.2)}
.dc-assistant-mark svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.4}
.dc-assistant-main{position:relative;z-index:1;flex:1;min-width:0}
#dash-assistant-compose{border:1px solid #E3E4EE;border-radius:13px;background:#fff;overflow:hidden}
#dash-assistant-input{display:block;width:100%;min-height:42px;padding:12px 14px 8px;border:0!important;resize:none;background:transparent!important;color:var(--dc-ink);font:inherit;outline:0}
#dash-assistant-toolbar{display:flex;align-items:center;gap:8px;padding:5px 7px 7px;color:var(--dc-muted)}
#dash-assistant-toolbar button{display:grid;place-items:center;width:31px;height:31px;border:0;border-radius:9px;background:transparent;color:var(--text-secondary);cursor:pointer}
#dash-assistant-toolbar button:hover{background:var(--card2);color:var(--text-secondary)}
#dash-assistant-label{font-size:11px;font-weight:700}
#dash-assistant-toolbar-right{display:flex;gap:4px;margin-left:auto}
#dash-assistant-send-btn{background:var(--accent)!important;color:#fff!important}
#dash-assistant-suggestions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
#dash-assistant-suggestions button{padding:6px 10px;border:1px solid var(--border);border-radius:999px;background:#fff;color:var(--text-secondary);font-size:11px;cursor:pointer}
#dash-assistant-suggestions button:hover{border-color:#C3C8D0;color:var(--text-secondary)}
#dash-assistant-recent,#dash-assistant-messages:empty,#dash-assistant-attachments:empty{display:none}

.dc-status-strip{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;padding:12px 15px;border:1px solid var(--border);border-radius:13px;background:var(--accent-soft);color:var(--text-secondary);font-size:12px}
.dc-status-strip span{display:flex;align-items:center;gap:9px;font-weight:650}
.dc-status-strip span i{width:8px;height:8px;border-radius:50%;background:var(--accent-soft)}
.dc-status-strip button{border:0;background:transparent;color:var(--text-secondary);font-size:12px;font-weight:750;cursor:pointer}
.dc-status-strip.warning{border-color:var(--warning);background:var(--warning-light)}.dc-status-strip.warning span i{background:var(--warning)}

.dc-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:18px}
.dc-metric-card{position:relative;display:flex;align-items:center;gap:13px;min-height:116px;padding:17px;border:1px solid var(--dc-line);border-radius:16px;background:#fff;text-align:start;cursor:pointer;overflow:hidden;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.dc-metric-card:before{content:"";position:absolute;inset:auto -25px -35px auto;width:100px;height:100px;border-radius:50%;background:currentColor;opacity:.045}
.dc-metric-card:hover{transform:translateY(-2px);border-color:var(--border-strong);box-shadow:0 12px 28px rgba(19, 22, 28,.07)}
.dc-metric-card.teal{color:var(--text-secondary)}.dc-metric-card.blue{color:var(--accent-text)}.dc-metric-card.violet{color:var(--accent-text)}.dc-metric-card.gold{color:#a16207}.dc-metric-card.red{color:var(--danger)}
.dc-metric-icon{display:grid;place-items:center;flex:0 0 43px;width:43px;height:43px;border-radius:13px;background:currentColor}
.dc-metric-icon svg{width:21px;height:21px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dc-metric-copy{display:flex;flex-direction:column;min-width:0;color:var(--dc-ink)}
.dc-metric-copy small{font-size:11px;color:var(--dc-muted);font-weight:700}.dc-metric-copy strong{margin:2px 0;font-size:27px;letter-spacing:-.04em}.dc-metric-copy em{font-style:normal;font-size:10.5px;color:var(--text-secondary)}
.dc-metric-arrow{position:absolute;right:13px;top:12px;color:#D4D5DF;font-size:14px}

.dc-main-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:16px;margin-bottom:16px}
.dc-detail-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:16px;margin-bottom:16px}
.dc-panel{height:100%;border:1px solid var(--dc-line);border-radius:18px;background:var(--card);box-shadow:0 8px 24px rgba(19, 22, 28,.035);overflow:hidden}
.dc-panel-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 19px 14px;border-bottom:1px solid var(--border)}
.dc-panel-head h2,.dc-attention h2{margin:0;font-size:15px;letter-spacing:-.01em}.dc-panel-head small{display:block;margin-bottom:4px;font-size:9px}
.dc-panel-head>button{padding:7px 10px;border:1px solid var(--border);border-radius:9px;background:#fff;color:var(--text-secondary);font-size:10.5px;font-weight:700;cursor:pointer}
.dc-panel-head>button:hover{border-color:#C3C8D0;color:var(--text-secondary)}

.dc-chart-wrap{display:grid;grid-template-columns:170px 1fr;align-items:center;gap:22px;padding:22px 24px 25px}
.dc-donut{position:relative;width:148px;height:148px;border-radius:50%}
.dc-donut:after{content:"";position:absolute;inset:21px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--card2)}
.dc-donut>div{position:absolute;z-index:1;inset:0;display:grid;place-content:center;text-align:center}.dc-donut strong{display:block;font-size:25px;line-height:1}.dc-donut span{display:block;margin-top:4px;color:var(--text-secondary);font-size:10px}
.dc-chart-legend{display:flex;flex-direction:column;gap:9px}.dc-chart-legend>div{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:8px;font-size:11px;color:var(--text-secondary)}.dc-chart-legend i{width:8px;height:8px;border-radius:3px}.dc-chart-legend strong{color:var(--dc-ink)}
.dc-range-toggle{display:flex;padding:3px;border-radius:9px;background:var(--card2)}.dc-range-toggle button{padding:5px 8px;border:0;border-radius:7px;background:transparent;color:var(--text-secondary);font-size:10px;cursor:pointer}.dc-range-toggle button.active{background:#fff;color:var(--text-secondary);box-shadow:0 1px 4px rgba(19, 22, 28,.1)}
.dc-source-list{display:flex;flex-direction:column;gap:15px;padding:22px 20px 25px}.dc-source-row{display:grid;grid-template-columns:24px minmax(95px,.7fr) minmax(90px,1fr) 24px;align-items:center;gap:10px;font-size:11px}.dc-source-rank{color:var(--text-secondary);font-size:9px;font-weight:800}.dc-source-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text);font-weight:650}.dc-source-bar{height:7px;border-radius:999px;background:var(--card2);overflow:hidden}.dc-source-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),#B8BDC5)}.dc-source-row strong{text-align:end}

.dc-team-table{padding:5px 0 8px}.dc-team-row{display:grid;grid-template-columns:minmax(210px,1.4fr) repeat(4,54px) minmax(90px,.6fr);align-items:center;gap:8px;width:100%;padding:10px 16px;border:0;border-bottom:1px solid var(--border);background:#fff;color:var(--text);text-align:start;font-size:11px}.dc-team-row:not(.dc-team-header){cursor:pointer}.dc-team-row:not(.dc-team-header):hover{background:var(--accent-soft)}.dc-team-header{color:var(--text-secondary);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.dc-agent-cell{display:flex;align-items:center;gap:9px;min-width:0}.dc-rank{width:15px;color:var(--text-secondary);font-size:9px}.dc-avatar{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:11px;background:var(--accent-soft);color:var(--text-secondary);font-style:normal;font-weight:800;overflow:hidden}.dc-avatar img{width:100%;height:100%;object-fit:cover}.dc-agent-cell em{display:flex;flex-direction:column;min-width:0;font-style:normal;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dc-agent-cell small{margin-top:2px;color:var(--danger);font-size:8.5px;font-weight:600}.dc-score{display:grid;grid-template-columns:1fr 24px;align-items:center;gap:6px}.dc-score:before{content:"";grid-column:1;grid-row:1;height:5px;border-radius:999px;background:var(--card2)}.dc-score i{grid-column:1;grid-row:1;display:block;height:5px;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent))}.dc-score b{font-size:10px;text-align:end}

.dc-task-list,.dc-focus-list{display:flex;flex-direction:column;padding:7px 14px 11px}
.dc-task-list button,.dc-focus-list button{display:flex;align-items:center;gap:11px;width:100%;padding:11px 5px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);text-align:start;cursor:pointer}.dc-task-list button:hover,.dc-focus-list button:hover{color:var(--text-secondary)}.dc-task-check{flex:0 0 16px;width:16px;height:16px;border:1.5px solid #D4D5DF;border-radius:5px}.dc-task-list button.overdue .dc-task-check{border-color:#fb7185;background:#fff1f2}.dc-task-list button span,.dc-focus-list button span:nth-child(2){display:flex;flex:1;flex-direction:column;min-width:0}.dc-task-list strong,.dc-focus-list strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dc-task-list small,.dc-focus-list small{margin-top:3px;color:var(--text-secondary);font-size:9.5px}.dc-task-list em,.dc-focus-list em{padding:4px 7px;border-radius:999px;background:var(--card2);color:var(--text-secondary);font-size:8.5px;font-style:normal;font-weight:750}.dc-task-list button.overdue em{background:#fff1f2;color:#be123c}
.dc-focus-icon{display:grid!important;place-items:center!important;flex:0 0 32px!important;width:32px!important;height:32px!important;border-radius:10px;background:#eefbf8;color:var(--text-secondary)}.dc-focus-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}

.dc-attention{margin-top:16px;padding:19px;border:1px solid var(--border);border-radius:17px;background:#fff}.dc-attention header{display:flex;align-items:baseline;gap:12px;margin-bottom:13px}.dc-attention header small{margin:0}.dc-attention>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.dc-attention button{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:13px;border:1px solid var(--border);border-left:3px solid var(--border);border-radius:12px;background:#fff;text-align:start;cursor:pointer}.dc-attention button.danger{border-left-color:#ef4444}.dc-attention button.warning{border-left-color:#f59e0b}.dc-attention button span{font-size:10.5px;color:var(--text-secondary);font-weight:700}.dc-attention button strong{grid-row:1/3;grid-column:2;font-size:23px}.dc-attention button i{font-size:9px;color:var(--text-secondary);font-style:normal;font-weight:700}
.dc-empty{margin:0;padding:24px;color:var(--text-secondary);font-size:11px;text-align:center}

.dc-admin-center{margin-bottom:18px;padding:18px;border:1px solid var(--border-strong);border-radius:17px;background:linear-gradient(135deg,var(--bg),#272A30);color:#fff;box-shadow:0 12px 30px rgba(19, 22, 28,.1)}
.dc-admin-center>header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
.dc-admin-center>header small{display:block;margin-bottom:4px;color:#D3D4DE;font-size:9px;font-weight:800;letter-spacing:.18em}
.dc-admin-center>header h2{margin:0;font-size:15px}.dc-admin-center>header>span{padding:5px 9px;border:1px solid rgba(211, 212, 222,.22);border-radius:999px;background:rgba(99, 104, 112,.2);color:var(--text);font-size:9px;font-weight:750}
.dc-admin-action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.dc-admin-action-grid>button{position:relative;display:flex;align-items:center;gap:11px;min-height:82px;padding:13px;border:1px solid rgba(255,255,255,.11);border-radius:13px;background:rgba(255,255,255,.06);color:#fff;text-align:start;cursor:pointer;transition:.18s}
.dc-admin-action-grid>button:hover{transform:translateY(-2px);border-color:rgba(211, 212, 222,.45);background:rgba(255,255,255,.1)}
.dc-admin-action-grid i{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:var(--accent);color:#fff}
.dc-admin-action-grid svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dc-admin-action-grid span{display:flex;flex:1;flex-direction:column;min-width:0}.dc-admin-action-grid strong{font-size:11px}.dc-admin-action-grid small{margin-top:3px;color:var(--text-secondary);font-size:8.8px;line-height:1.35}.dc-admin-action-grid em{position:absolute;right:10px;top:9px;color:#D3D4DE;font-size:8px;font-style:normal;font-weight:700}

body.dc-admin-modal-open{overflow:hidden}
.dc-admin-modal{position:fixed;z-index:10020;inset:0;display:grid;place-items:center;padding:22px}
.dc-admin-modal[hidden]{display:none}
.dc-admin-backdrop{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(3, 6, 12,.62);backdrop-filter:blur(5px);cursor:default}
.dc-admin-dialog{position:relative;display:flex;flex-direction:column;width:min(820px,calc(100vw - 32px));max-height:min(760px,calc(100vh - 34px));border:1px solid #E3E4EE;border-radius:18px;background:#fff;color:var(--text);box-shadow:0 30px 80px rgba(3, 6, 12,.28);overflow:hidden;animation:dcAdminIn .2s ease-out}
@keyframes dcAdminIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
.dc-admin-dialog>header{display:flex;align-items:center;justify-content:space-between;padding:17px 19px;border-bottom:1px solid #ECEDF7}.dc-admin-dialog>header small{display:block;margin-bottom:3px;color:var(--text-secondary);font-size:8px;font-weight:850;letter-spacing:.16em}.dc-admin-dialog>header h2{margin:0;font-size:17px}
.dc-admin-close{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--text-secondary);font-size:20px;cursor:pointer}
.dc-admin-modal-body{flex:1;min-height:0;padding:18px;overflow:auto}
.dc-admin-dialog>footer{display:flex;justify-content:flex-end;gap:9px;padding:13px 18px;border-top:1px solid #ECEDF7;background:var(--card)}
.dc-admin-dialog>footer button{height:38px;padding:0 14px;border-radius:10px;font-size:11px;font-weight:750;cursor:pointer}.dc-admin-cancel{border:1px solid #E3E4EE;background:#fff;color:var(--text-secondary)}.dc-admin-apply{border:1px solid var(--border-strong);background:var(--accent);color:#fff}.dc-admin-apply:disabled{opacity:.6;cursor:wait}
.dc-admin-form-grid,.dc-admin-score-form{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:15px}.dc-admin-form-grid label,.dc-admin-score-form label,.dc-admin-form-grid .dc-admin-field,.dc-admin-score-form .dc-admin-field,.dc-admin-picker-head label{display:flex;flex-direction:column;gap:6px}.dc-admin-form-grid label>span,.dc-admin-score-form label>span,.dc-admin-form-grid .dc-admin-field>span,.dc-admin-score-form .dc-admin-field>span,.dc-admin-picker-head label>span{color:var(--text-secondary);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.dc-admin-form-grid select,.dc-admin-score-form select,.dc-admin-score-form input,.dc-admin-score-form textarea,.dc-admin-picker-head input{width:100%;min-height:40px;padding:9px 11px;border:1px solid #E3E4EE!important;border-radius:10px!important;background:#fff!important;color:var(--text)!important;font:inherit;font-size:11px;outline:none}.dc-admin-form-grid select:focus,.dc-admin-score-form select:focus,.dc-admin-score-form input:focus,.dc-admin-score-form textarea:focus,.dc-admin-picker-head input:focus{border-color:var(--border-strong)!important;box-shadow:0 0 0 3px rgba(99, 104, 112,.1)}
.dc-admin-user-combo{position:relative}.dc-admin-user-combo>input[type=search]{width:100%;min-height:40px;padding:9px 38px 9px 11px;border:1px solid #E3E4EE!important;border-radius:10px!important;background:#fff!important;color:var(--text)!important;font:inherit;font-size:11px;outline:none}.dc-admin-user-combo>input[type=search]::-webkit-search-cancel-button{display:none}.dc-admin-user-combo.open>input[type=search],.dc-admin-user-combo>input[type=search]:focus{border-color:var(--border-strong)!important;box-shadow:0 0 0 3px rgba(99, 104, 112,.1)}
.dc-admin-combo-toggle{position:absolute;z-index:2;right:3px;top:3px;display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:8px;background:transparent;color:var(--text-secondary);cursor:pointer}.dc-admin-combo-toggle:hover{background:var(--card2);color:var(--text-secondary)}.dc-admin-combo-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:.16s}.dc-admin-user-combo.open .dc-admin-combo-toggle svg{transform:rotate(180deg)}
.dc-admin-user-options{position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;max-height:250px;padding:5px;border:1px solid #E3E4EE;border-radius:11px;background:#fff;box-shadow:0 18px 45px rgba(19, 22, 28,.16);overflow:auto}.dc-admin-user-options[hidden]{display:none}.dc-admin-user-options>button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:9px 10px;border:0;border-radius:8px;background:transparent;color:var(--text);text-align:start;cursor:pointer}.dc-admin-user-options>button[hidden]{display:none}.dc-admin-user-options>button:hover,.dc-admin-user-options>button[aria-selected=true]{background:#eefbf8;color:var(--text-secondary)}.dc-admin-user-options>button span{display:flex;flex:1;flex-direction:column;min-width:0}.dc-admin-user-options>button strong{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dc-admin-user-options>button small{margin-top:2px;color:var(--text-secondary);font-size:8.7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dc-admin-user-options>button i{display:none;font-size:11px;font-style:normal}.dc-admin-user-options>button[aria-selected=true] i{display:block}.dc-admin-user-empty{position:absolute;z-index:21;top:calc(100% + 6px);left:0;right:0;margin:0;padding:16px;border:1px solid #E3E4EE;border-radius:11px;background:#fff;color:var(--text-secondary);font-size:10px;text-align:center;box-shadow:0 18px 45px rgba(19, 22, 28,.16)}.dc-admin-user-empty[hidden]{display:none}
.dc-admin-score-form .wide{grid-column:1/-1}.dc-admin-score-form textarea{resize:vertical}
.dc-admin-picker-head{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;margin-bottom:10px}.dc-admin-picker-head label{flex:1}.dc-admin-picker-head>strong{padding-bottom:10px;color:var(--text-secondary);font-size:10px;white-space:nowrap}
.dc-admin-record-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:330px;padding:2px;overflow:auto}
.dc-admin-record{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #EAEBF5;border-radius:11px;background:#fff;cursor:pointer}.dc-admin-record:hover{border-color:#C3C8D0;background:#f7fffd}.dc-admin-record input{accent-color:var(--accent)}.dc-admin-record span{display:flex;flex:1;flex-direction:column;min-width:0}.dc-admin-record strong{font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dc-admin-record small{margin-top:3px;color:var(--text-secondary);font-size:8.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dc-admin-note{margin:13px 0 0;padding:10px 11px;border-radius:10px;background:var(--card2);color:var(--text-secondary);font-size:9.5px;line-height:1.5}.dc-admin-loading,.dc-admin-error{margin:0;padding:40px;text-align:center;color:var(--text-secondary);font-size:11px}.dc-admin-error{color:#be123c}
.dc-admin-rule-list{display:flex;flex-direction:column;gap:8px}.dc-admin-rule{display:grid;grid-template-columns:20px 1fr 90px;align-items:center;gap:10px;padding:11px;border:1px solid #EAEBF5;border-radius:11px}.dc-admin-rule>input[type=checkbox]{accent-color:var(--accent)}.dc-admin-rule>span{display:flex;flex-direction:column}.dc-admin-rule strong{font-size:10.5px;text-transform:capitalize}.dc-admin-rule small{margin-top:2px;color:var(--text-secondary);font-size:8.8px}.dc-admin-rule>input[type=number]{width:100%;height:36px;padding:0 9px;border:1px solid #E3E4EE!important;border-radius:9px!important;background:#fff!important;color:var(--text)!important}


#page-dashboard.dash-command-center #dash-greeting{margin-bottom:0;color:var(--dc-ink)}
#page-dashboard.dash-command-center #dash-greeting h1{color:var(--dc-ink)}
#page-dashboard.dash-command-center #dash-greeting-sub{margin-bottom:0;color:var(--dc-muted)}
#page-dashboard.dash-command-center #dash-assistant-card{
  border:1px solid #E1E2EC!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,#fff 0,#fbfdfd 64%,#eefbf8 100%)!important;
  color:var(--dc-ink)!important;
  box-shadow:0 12px 35px rgba(19, 22, 28,.045)!important;
}
#page-dashboard.dash-command-center #dash-assistant-compose{background:#fff!important}
#page-dashboard.dash-command-center #dash-assistant-input{color:var(--dc-ink)!important}
#page-dashboard.dash-command-center #dash-assistant-toolbar{border-color:var(--border)!important}
#page-dashboard.dash-command-center #dash-assistant-suggestions button{background:#fff!important;color:var(--text-secondary)!important}
#page-dashboard.dash-command-center .dc-agent-filter select{
  border-color:#D4D5DF!important;
  background:#fff!important;
  color:var(--dc-ink)!important;
}

@media(max-width:1100px){
  .dash-command-center{padding:26px 22px 52px!important}
  .dc-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dc-detail-grid{grid-template-columns:1fr}
  .dc-admin-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  .dash-command-center{padding:18px 14px 44px!important}
  .dc-hero{align-items:stretch;flex-direction:column;gap:15px}
  #dash-greeting h1{font-size:27px}
  #dash-greeting-sub{align-items:flex-start;flex-wrap:wrap;font-size:10.5px}
  .dc-agent-filter{min-width:0}.dc-agent-filter select{width:100%}
  .dc-assistant-card{padding:14px;gap:10px}.dc-assistant-mark{display:none}
  #dash-assistant-label{display:none}
  .dc-metric-grid{grid-template-columns:1fr 1fr;gap:9px}
  .dc-metric-card{min-height:104px;padding:13px;gap:10px}.dc-metric-icon{width:36px;height:36px;flex-basis:36px}.dc-metric-icon svg{width:18px;height:18px}.dc-metric-copy strong{font-size:23px}.dc-metric-copy em{font-size:9px}
  .dc-main-grid,.dc-detail-grid{grid-template-columns:1fr}
  .dc-chart-wrap{grid-template-columns:125px 1fr;gap:13px;padding:18px 15px}.dc-donut{width:118px;height:118px}.dc-donut:after{inset:17px}
  .dc-source-row{grid-template-columns:20px minmax(80px,.8fr) minmax(70px,1fr) 20px}
  /* r211: the leaderboard becomes stacked cards on phones - no horizontal scroll, no 550px minimum */
  .dc-team-table{overflow:visible;padding:4px 10px 10px}
  .dc-team-header{display:none}
  .dc-team-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px 8px;min-width:0;width:100%;padding:12px;margin-top:8px;border:1px solid var(--border);border-radius:14px}
  .dc-team-row .dc-agent-cell{grid-column:1/-1}
  .dc-team-row>strong{position:relative;padding-top:14px;font-size:14px;text-align:start}
  .dc-team-row>strong:before{content:attr(data-label);position:absolute;top:0;inset-inline-start:0;font-size:8.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--text-secondary)}
  .dc-team-row .dc-score{grid-column:1/-1}
  /* the 8-column points breakdown scrolls INSIDE its own panel; ancestors may shrink to the
     viewport (grid items default to min-width:auto, which is what blew the column out) */
  #dash-team-col,.dc-team-panel,.dc-focus-panel,.dc-tasks-panel,.dc-panel{min-width:0;max-width:100%}
  .dc-points-panel{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .dc-points-table{display:table;width:auto;min-width:560px}
  .dc-scope-wrap{min-width:0;max-width:100%}
  .dc-scope-wrap .dc-admin-user-combo{width:100%;max-width:100%}
  .dc-attention>div{grid-template-columns:1fr}
  .dc-status-strip{align-items:flex-start}.dc-status-strip button{white-space:nowrap}
  .dc-admin-center{padding:14px}.dc-admin-center>header{align-items:flex-start}.dc-admin-center>header>span{display:none}
  .dc-admin-action-grid{grid-template-columns:1fr 1fr;gap:8px}.dc-admin-action-grid>button{min-height:78px;padding:11px}.dc-admin-action-grid small{display:none}
  .dc-admin-modal{padding:0;place-items:end center}.dc-admin-dialog{width:100%;max-height:min(92dvh, var(--app-vh, 100dvh));border-radius:18px 18px 0 0}
  .dc-admin-record-list{grid-template-columns:1fr}.dc-admin-form-grid,.dc-admin-score-form{grid-template-columns:1fr}.dc-admin-score-form .wide{grid-column:auto}
}

@media(max-width:430px){
  .dc-metric-grid{grid-template-columns:1fr}
  .dc-metric-card{min-height:92px}
  .dc-chart-wrap{grid-template-columns:1fr;justify-items:center}.dc-chart-legend{width:100%}
}

.dc-admin-user-options>button .dc-admin-option-avatar{
  display:grid!important;
  place-items:center!important;
  flex:0 0 30px!important;
  width:30px!important;
  min-width:30px!important;
  max-width:30px!important;
  height:30px!important;
  padding:0!important;
  overflow:hidden;
  border-radius:50%;
  background:var(--accent-soft);
  color:var(--text-secondary);
  font-size:9px;
  font-weight:800;
}
.dc-admin-user-options>button .dc-admin-option-avatar img{width:100%;height:100%;object-fit:cover}
.dc-admin-user-options>button .dc-admin-option-copy{
  display:flex!important;
  flex:1!important;
  flex-direction:column!important;
  min-width:0;
}



#page-settings,
#page-settings .page-content,
#settings-content{background:var(--bg);min-width:0}
#settings-content{padding:0!important}
.settings-pro-shell{width:100%;max-width:1480px;margin:0 auto;padding:28px clamp(18px,3vw,42px) 48px;text-align:start;color:var(--text)}
.settings-pro-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px}
.settings-pro-eyebrow{display:block;margin-bottom:5px;color:#787D85;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.settings-pro-header h1{margin:0;font-size:clamp(25px,2vw,32px);line-height:1.15;letter-spacing:-.035em}
.settings-pro-header p{margin:7px 0 0;color:var(--text-muted);font-size:13px}
.settings-pro-context{display:flex;align-items:center;gap:10px;min-width:190px;padding:10px 13px;border:1px solid var(--border);border-radius:13px;background:var(--card);box-shadow:0 4px 16px rgba(19, 22, 28,.035)}
.settings-pro-context>svg{color:#787D85}.settings-pro-context span,.settings-pro-context strong,.settings-pro-context small{display:block}
.settings-pro-context strong{font-size:12px}.settings-pro-context small{margin-top:2px;color:var(--text-muted);font-size:10px}
.settings-pro-tabs{display:flex;align-items:center;gap:4px;margin-bottom:24px;padding:5px;border:1px solid var(--border);border-radius:14px;background:var(--card);box-shadow:0 5px 20px rgba(19, 22, 28,.035);overflow-x:auto;scrollbar-width:none}
.settings-pro-tabs::-webkit-scrollbar{display:none}
.settings-pro-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 15px;border:0;border-radius:10px;background:transparent;color:var(--text-muted);font:700 12px inherit;white-space:nowrap;cursor:pointer;transition:background .18s ease,color .18s ease,box-shadow .18s ease}
.settings-pro-tabs button:hover{background:color-mix(in srgb,var(--bg) 75%,var(--card));color:var(--text)}
.settings-pro-tabs button.active{background:var(--card2);color:#5F646C;box-shadow:inset 0 0 0 1px rgba(120, 125, 133,.12)}
.settings-pro-main{width:100%;min-width:0;text-align:start}
.settings-pro-main>.settings-section{max-width:none;margin:0}

.settings-profile{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,.8fr);gap:20px;align-items:start}
.settings-profile-hero{grid-column:1/-1;display:flex;align-items:center;gap:18px;padding:22px 24px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(135deg,var(--card) 0%,color-mix(in srgb,var(--card2) 44%,var(--card)) 100%);box-shadow:0 8px 28px rgba(19, 22, 28,.045)}
.settings-profile-avatar{width:72px;height:72px;flex:0 0 72px;display:grid;place-items:center;border:3px solid var(--card);border-radius:20px;overflow:hidden;background:#787D85;color:#fff;font-size:21px;font-weight:850;box-shadow:0 8px 22px rgba(120, 125, 133,.2)}
.settings-profile-avatar img{width:100%;height:100%;object-fit:cover}.settings-profile-identity{min-width:0;flex:1}
.settings-profile-kicker{margin-bottom:3px;color:#787D85;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.settings-profile-identity h2{margin:0;font-size:23px;letter-spacing:-.025em}
.settings-profile-email{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:5px;color:var(--text-muted);font-size:12px}
.settings-profile-verified,.settings-profile-pending{display:inline-flex;align-items:center;gap:4px;padding:3px 7px;border-radius:999px;font-size:9px;font-weight:800}
.settings-profile-verified{background:#dcfce7;color:#047857}.settings-profile-pending{background:#fff7ed;color:#c2410c}
.settings-profile-badges{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.settings-profile-badges span{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid rgba(120, 125, 133,.13);border-radius:999px;background:var(--card);color:#5F646C;font-size:10px;font-weight:750}
.settings-avatar-action{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 13px;border:1px solid var(--border);border-radius:10px;background:var(--card);color:var(--text);font:700 11px inherit;cursor:pointer}
.settings-profile-card,.settings-access-summary{border:1px solid var(--border);border-radius:18px;background:var(--card);box-shadow:0 8px 28px rgba(19, 22, 28,.045);overflow:hidden}
.settings-card-heading{display:flex;align-items:center;gap:11px;padding:18px 20px;border-bottom:1px solid var(--border)}
.settings-card-icon{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border-radius:10px;background:var(--card2);color:#5F646C}
.settings-card-heading strong,.settings-card-heading small{display:block}.settings-card-heading strong{font-size:14px}.settings-card-heading small{margin-top:3px;color:var(--text-muted);font-size:10px;font-weight:500}
.settings-profile-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;padding:20px}
.settings-profile-form label{display:grid;gap:7px;color:var(--text-muted);font-size:10px;font-weight:750}
.settings-profile-form label>small{margin-top:-2px;font-size:9px;font-weight:500}
.settings-input{width:100%;height:42px;padding:0 12px;border:1px solid var(--border);border-radius:10px;outline:none;background:var(--bg);color:var(--text);font:600 12px inherit;transition:border-color .18s ease,box-shadow .18s ease}
.settings-input:focus{border-color:#787D85;box-shadow:0 0 0 3px rgba(120, 125, 133,.12)}
.settings-input:disabled{opacity:.7;cursor:not-allowed}
.settings-profile-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px;padding:15px 20px;border-top:1px solid var(--border);background:color-mix(in srgb,var(--bg) 55%,var(--card))}
.settings-save-message{margin-right:auto;color:var(--text-muted);font-size:10px}.settings-save-message.success{color:#047857}.settings-save-message.error{color:#b91c1c}
.settings-save-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 16px;border:0;border-radius:10px;background:#787D85;color:#fff;font:800 11px inherit;cursor:pointer;box-shadow:0 7px 18px rgba(120, 125, 133,.18)}
.settings-save-btn:disabled{opacity:.65;cursor:wait}
.settings-access-grid{display:grid;grid-template-columns:1fr 1fr}
.settings-access-grid>div{min-width:0;padding:18px 20px;border-bottom:1px solid var(--border)}
.settings-access-grid>div:nth-child(odd){border-right:1px solid var(--border)}.settings-access-grid>div:nth-last-child(-n+2){border-bottom:0}
.settings-access-grid span,.settings-access-grid strong{display:block}.settings-access-grid span{color:var(--text-muted);font-size:9px;font-weight:750;text-transform:uppercase;letter-spacing:.05em}
.settings-access-grid strong{margin-top:6px;font-size:12px;overflow-wrap:anywhere}.settings-access-grid strong.is-active{color:#047857}

.settings-users-enterprise{width:100%;min-width:0}
.settings-users-enterprise .ac-shell{max-width:none;margin:0;padding:0;text-align:start}
.settings-users-enterprise .ac-header{margin-bottom:20px}
.settings-users-enterprise .ac-content{border-radius:16px}
.settings-users-enterprise .ac-toolbar{}.settings-users-enterprise .ac-search{order:-1}
.settings-users-enterprise .ac-table{table-layout:auto}
.settings-users-enterprise .ac-table th,.settings-users-enterprise .ac-table td{text-align:start}
.settings-users-enterprise .ac-user{}
.settings-users-enterprise .ac-role-tree,.settings-users-enterprise .ac-profile-list{text-align:start}

@media(max-width:980px){
  .settings-profile{grid-template-columns:1fr}
  .settings-profile-hero{grid-column:1}
  .settings-access-summary{grid-column:1}
}
@media(max-width:768px){
  .settings-pro-shell{padding:16px 12px 32px}
  .settings-pro-header{align-items:flex-start;margin-bottom:16px}
  .settings-pro-context{display:none}
  .settings-pro-tabs{margin:0 -1px 16px;border-radius:12px}
  .settings-pro-tabs button{min-height:38px;padding:0 12px}
  .settings-profile{gap:13px}
  .settings-profile-hero{align-items:flex-start;flex-wrap:wrap;padding:17px;border-radius:14px}
  .settings-profile-avatar{width:58px;height:58px;flex-basis:58px;border-radius:16px;font-size:17px}
  .settings-profile-identity{flex-basis:calc(100% - 80px)}
  .settings-profile-identity h2{font-size:19px}
  .settings-avatar-action{width:100%;justify-content:center}
  .settings-profile-card,.settings-access-summary{border-radius:14px}
  .settings-profile-form{grid-template-columns:1fr;padding:16px}
  .settings-profile-actions{align-items:stretch;flex-direction:column;padding:14px 16px}
  .settings-save-message{margin:0}.settings-save-btn{width:100%}
  .settings-access-grid{grid-template-columns:1fr}
  .settings-access-grid>div,.settings-access-grid>div:nth-child(odd){border-right:0;border-bottom:1px solid var(--border)}
  .settings-access-grid>div:last-child{border-bottom:0}
  .settings-users-enterprise .ac-shell{padding:0}
  .settings-users-enterprise .ac-header{gap:12px}.settings-users-enterprise .ac-header h2{font-size:20px}
  .settings-users-enterprise .ac-tabs{overflow-x:auto;scrollbar-width:none}
  .settings-users-enterprise .ac-table-wrap{overflow:visible;padding:10px;background:var(--bg)}
  .settings-users-enterprise .ac-table,.settings-users-enterprise .ac-table tbody,.settings-users-enterprise .ac-table tr,.settings-users-enterprise .ac-table td{display:block;width:100%;min-width:0}
  .settings-users-enterprise .ac-table thead{display:none}
  .settings-users-enterprise .ac-table tr{margin-bottom:10px;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--card);box-shadow:0 3px 12px rgba(19, 22, 28,.035)}
  .settings-users-enterprise .ac-table td{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 2px;border:0;white-space:normal;text-align:end}
  .settings-users-enterprise .ac-table td:first-child{display:block;padding-top:0;padding-bottom:12px;border-bottom:1px solid var(--border);text-align:start}
  .settings-users-enterprise .ac-table td:not(:first-child)::before{flex:0 0 auto;color:var(--text-muted);font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
  .settings-users-enterprise .ac-table td:nth-child(2)::before{content:"Agent code"}
  .settings-users-enterprise .ac-table td:nth-child(3)::before{content:"Role"}
  .settings-users-enterprise .ac-table td:nth-child(4)::before{content:"Profile"}
  .settings-users-enterprise .ac-table td:nth-child(5)::before{content:"Visibility"}
  .settings-users-enterprise .ac-table td:nth-child(6)::before{content:"Kiosk face"}
  .settings-users-enterprise .ac-table td:nth-child(7)::before{content:"Status"}
  .settings-users-enterprise .ac-table td:nth-child(8)::before{content:"Actions"}
  .settings-users-enterprise .ac-row-actions,.settings-users-enterprise .ac-row-actions button{width:100%}
  .settings-users-enterprise .ac-row-actions button{min-height:38px}
  .settings-users-enterprise .ac-role-tree{padding:12px}
  .settings-users-enterprise .ac-role-node{margin-left:calc(var(--level) * 12px)}
  .settings-users-enterprise .ac-role-card em{display:none}
  .settings-users-enterprise .ac-profile-list{padding:10px}
}




:root {
  /* This block is the app's real palette: the :root/body.light/body.dark sets earlier in the
     file are overridden from here. Teal accent, warm bone day ground, near-black night ground.
     ONE interaction colour; amber and brick mean STATUS and nothing else.
     The sidebar ground is no longer a fixed navy — it is themed, so it belongs to body.light /
     body.dark below and not here. */
  --enterprise-accent: #0F8A78;
  --enterprise-accent-hover: #0D7A69;
  --enterprise-accent-soft: rgba(15, 138, 120, .10);
  --enterprise-canvas: #F7F4EE;
  --enterprise-surface: #FFFDF9;
  --enterprise-surface-2: #E9E2D5;
  --enterprise-line: #E6DFD2;
  --enterprise-line-strong: #DED6C6;
  --enterprise-ink: #2A2622;
  --enterprise-muted: #4A443C;
  --enterprise-shadow: 0 1px 2px rgba(42, 38, 34, .05);
  --enterprise-shadow-lg: 0 20px 48px rgba(42, 38, 34, .16);
  --enterprise-radius: 18px;
  --enterprise-control-h: 40px;
  /* Both were referenced as var(--brand,<teal>) / var(--ok,<teal>) but never defined, so the
     fallback always won. --ok was an OLIVE #5A7D33 — a second green with no place in a
     one-accent palette; "ok" is the accent now. */
  --brand: var(--enterprise-accent);
  --ok: var(--enterprise-accent);
  --action-primary: #0F8A78;
  --action-primary-hover: #0D7A69;
  --action-info: #0F8A78;
  --action-success: #0F8A78;
  --action-warning: #8A6A14;
  --action-danger: #B03E30;
}

body.light {
  --primary: var(--enterprise-accent);
  --primary-dark: var(--enterprise-accent-hover);
  --primary-light: var(--enterprise-accent-soft);
  --primary-glass: rgba(15, 138, 120, .07);
  --neutral-accent: var(--enterprise-accent);
  --neutral-accent-strong: var(--enterprise-accent-hover);
  --neutral-accent-soft: var(--enterprise-accent-soft);
  --neutral-border: var(--enterprise-line-strong);
  --bg: var(--enterprise-canvas);
  --surface: var(--enterprise-canvas);
  --card: var(--enterprise-surface);
  --card2: var(--enterprise-surface-2);
  --input-bg: var(--enterprise-surface);
  --track: var(--enterprise-surface-2);
  --head-bg: var(--enterprise-surface-2);
  --elevated: var(--enterprise-surface-2);
  --sidebar-bg: #F2EDE4;
  --border: var(--enterprise-line);
  --border-strong: var(--enterprise-line-strong);
  --border-light: #EFE9DE;
  --hairline: var(--enterprise-line);
  --border-gold: var(--enterprise-line-strong);
  --text: var(--enterprise-ink);
  --text-light: var(--enterprise-muted);
  --text-secondary: var(--enterprise-muted);
  --text-muted: #6B6459;
  /* The brief names two accents on purpose: #0F8A78 fills, #0D7A69 is the accent for TEXT and
     icons on a light ground. White on #0F8A78 is 4.26:1 — under the 4.5 the brief itself asks
     for at body size; on #0D7A69 it is 5.24:1, so that is what filled controls use. */
  --accent: var(--enterprise-accent);
  --accent-text: #0D7A69;
  --accent-fill: #0D7A69;
  --accent-soft: var(--enterprise-accent-soft);
  --on-accent: #FFFFFF;
  --warning: #8A6A14;
  --warning-light: rgba(154, 115, 24, .10);
  --danger: #B03E30;
  --danger-light: rgba(192, 72, 58, .10);
  --gold: var(--enterprise-accent);
  --gold-light: var(--enterprise-accent-hover);
  --gold-grad: linear-gradient(135deg, var(--enterprise-accent), var(--enterprise-accent-hover));
  --shadow: var(--enterprise-shadow);
  --shadow-md: 0 6px 18px rgba(42, 38, 34, .07);
  --shadow-lg: var(--enterprise-shadow-lg);
}

body.dark {
  /* Night mode is the same teal, lifted so it reads on a near-black ground. Text on the accent
     is #04231E rather than white: 6.3:1 instead of 2.3:1. */
  --primary: #17B39C;
  --primary-dark: #33D3BA;
  --primary-light: rgba(23, 179, 156, .12);
  --primary-glass: rgba(23, 179, 156, .08);
  --neutral-accent: #17B39C;
  --neutral-accent-strong: #33D3BA;
  --neutral-accent-soft: rgba(23, 179, 156, .12);
  --neutral-border: #26292C;
  --bg: #0D0E0F;
  --surface: #0D0E0F;
  --card: #16181A;
  --card2: #24282B;
  --input-bg: #0F1113;
  --track: #24282B;
  --head-bg: #24282B;
  --elevated: #24282B;
  --sidebar-bg: #101113;
  --border: #1E2124;
  --border-strong: #26292C;
  --border-light: #1E2124;
  --hairline: #1E2124;
  --border-gold: #26292C;
  --text: #E8EAEC;
  --text-light: #C9CED3;
  --text-secondary: #C9CED3;
  --text-muted: #9AA0A6;
  --accent: #17B39C;
  --accent-text: #33D3BA;
  --accent-fill: #17B39C;
  --accent-soft: rgba(23, 179, 156, .12);
  --on-accent: #04231E;
  --warning: #D9A13B;
  --warning-light: rgba(217, 161, 59, .12);
  --danger: #E2705F;
  --danger-light: rgba(226, 112, 95, .12);
  --gold: #17B39C;
  --gold-light: #33D3BA;
  --gold-grad: linear-gradient(135deg, #17B39C, #33D3BA);
}

/* ══ Dandelion shared design tokens (r226) ═════════════════════════════════════
   ONE semantic vocabulary for the CRM and the Marketing Hub (which snapshots this file).
   Every value is an ALIAS of the real palette above, so nothing here changes a colour on its
   own - it names the system so pages stop inventing unrelated colours, radii and shadows.
   Declared on <body>, NOT :root: a custom property substitutes var() on the element that
   declares it, and the themed --card/--bg/--text live on body.light/body.dark - an alias on
   :root would freeze to the line-1 light value and never follow dark mode.
   Also DEFINES the tokens the file already referenced but never declared (--accent x48,
   --text-primary x16, --text-secondary x11, --surface-2, --input-bg, --bg-card ...). Until now
   those resolved to their literal light-theme fallbacks (#181B21 text in dark mode, a stray
   #6c63ff purple accent, transparent cards) - the "unreadable dark text" and "cards merge into
   the background" defects. Putting them on the palette fixes every usage at once. */
body {
  /* canvas + surfaces */
  --app-bg: var(--bg);
  --surface-1: var(--card);
  --surface-2: var(--card2, var(--surface-muted));
  --surface-elevated: var(--card);
  --sidebar-surface: var(--sidebar-bg);
  --sidebar-item-hover: rgba(255,255,255,.06);
  --sidebar-item-active: rgba(255,255,255,.10);
  --sidebar-text: #ECECEC;          /* the sidebar is dark in BOTH themes, so these are constants */
  --sidebar-text-muted: #8A8A8A;
  /* lines */
  --border-subtle: var(--border-light);
  --border-strong: var(--border);
  /* text */
  --text-primary: var(--text);
  --text-secondary: var(--text-light);
  /* brand + status (semantic) */
  --brand-primary: var(--primary);
  --brand-primary-hover: var(--primary-dark);
  --brand-primary-soft: var(--primary-light);
  --status-success: var(--success);
  --status-warning: var(--warning);
  --status-danger: var(--danger);
  --status-info: var(--info);
  --focus-ring: 0 0 0 3px rgba(var(--primary-rgb), .28);
  /* elevation */
  --shadow-card: var(--shadow);
  --shadow-raised: var(--shadow-md);
  --shadow-modal: var(--shadow-lg);
  /* geometry: 8px rhythm */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-pill: 999px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-8: 48px;
  --control-height: var(--enterprise-control-h, 40px);
  --topbar-height: var(--topbar-h, 64px);
  --sidebar-width: var(--sidebar-w, 256px);
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  /* motion */
  --motion-fast: .15s;
  --motion-base: .2s;
  /* ── previously-referenced-but-undefined tokens, now on the palette ── */
  --accent: var(--primary);
  --accent-light: var(--primary-light);
  --bg-card: var(--card);
  --bg-subtle: var(--surface-muted);
  --input-bg: var(--card);
  --line: var(--border-light);
  --hover: var(--primary-glass);
  --green: var(--success);
  --red: var(--danger);
  --teal: var(--primary);
  --teal-light: var(--primary-light);
}
@media (prefers-reduced-motion: reduce) { body { --motion-fast: 0s; --motion-base: 0s; } }

html,
body {
  background: var(--bg);
  color: var(--text);
  font-family: Inter, "Segoe UI", Tahoma, Arial, sans-serif;
  text-rendering: optimizeLegibility;
}

body {
  overflow-x: hidden;
}

html[data-locale-contract="en-only"]:not(.locale-ready) body {
  opacity: 0;
}

html[data-locale-contract="en-only"].locale-ready body {
  opacity: 1;
  transition: opacity .16s ease;
}

button,
input,
select,
textarea {
  font: inherit;
}

button,
[role="button"],
a,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}

:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--primary) 28%, transparent);
  outline-offset: 2px;
}


#sidebar {
  width: var(--sidebar-w);
  background: var(--sidebar-bg) !important;
  border-color: rgba(255, 255, 255, .08) !important;
  box-shadow: none !important;
  transition: transform .22s ease;
}

.sidebar-logo {
  min-height: 68px;
  padding: 14px 16px;
  border-color: rgba(255, 255, 255, .08);
}

.sidebar-logo-img {
  width: 36px;
  height: 36px;
  border-radius: 10px;
}

.sidebar-logo span {
  color: var(--text);
  font-size: 13.5px;
  font-weight: 700;
}

.sidebar-logo .sub {
  color: #8d9bb0;
  font-size: 10.5px;
  font-weight: 500;
}

.sidebar-nav {
  padding: 10px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, .14) transparent;
}

.nav-section {
  padding: 16px 10px 6px;
  /* Measured on the real sidebar ground (#2A2E33, fixed dark in both themes): #74839a gave 3.55:1,
     under the 4.5 a 9.5px uppercase label needs. var(--card2) gives 5.33:1. The size goes up with it —
     9.5px at .09em tracking is a label you squint at, and there are now eight of them. */
  color: var(--card2);
  font-size: 10.5px;
  letter-spacing: .08em;
}

.nav-item {
  min-height: 40px;
  margin: 1px 0;
  padding: 9px 10px;
  gap: 10px;
  border-radius: 9px;
  color: #abb7c8;
  font-size: 12.5px;
  font-weight: 500;
  /* Restated so this later block cannot silently drop the shared alignment contract. */
  justify-content: flex-start;
  text-align: start;
}

.nav-item:hover {
  background: rgba(255, 255, 255, .065);
  color: #fff;
}

.nav-item.active {
  background: rgba(255, 255, 255, .10);
  color: #fff;
  font-weight: 650;
  /* Logical edge marker: box-shadow has no logical form, so the inset-shadow pair this
     replaced needed one rule per direction. border-inline-start lands on the correct
     edge in en/fa/ar from a single declaration. */
  border-inline-start: 3px solid var(--primary-on-dark);
}

.nav-item.active svg {
  color: var(--primary-on-dark);
}

.sidebar-footer {
  padding: 12px 14px max(12px, env(safe-area-inset-bottom));
  border-color: rgba(255, 255, 255, .08);
}

#main {
  min-width: 0;
}

#topbar,
body.light #topbar {
  min-height: 64px;
  height: 64px;
  padding: 0 24px;
  background: color-mix(in srgb, var(--card) 94%, transparent) !important;
  border-color: var(--border) !important;
  box-shadow: 0 1px 0 rgba(19, 22, 28, .02) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.topbar-title {
  color: var(--text);
  font-size: 15px;
  font-weight: 700;
}

.topbar-actions {
  min-width: 0;
  gap: 8px;
}

.topbar-utility-btn,
.pwa-install-chip,
#assistant-fab {
  min-height: 38px;
  height: 38px;
  padding: 0 11px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--card);
  color: var(--text-light);
  box-shadow: none;
}

.topbar-utility-btn:hover,
.pwa-install-chip:hover,
#assistant-fab:hover {
  border-color: #bfccd9;
  background: var(--surface-muted);
  color: var(--text);
}

#topbar-add-lead-btn {
  min-height: 40px;
  border-radius: 9px;
  background: var(--primary);
  border-color: var(--primary);
  box-shadow: 0 3px 10px rgba(117, 122, 130, .18);
}

#content {
  min-width: 0;
  padding: clamp(18px, 2.2vw, 32px);
  padding-bottom: 72px;
  background: var(--bg);
}

.page {
  width: 100%;
  max-width: 1600px;
  min-width: 0;
  margin-inline: auto;
  color: var(--text);
}

#content .page {
  --bg: var(--enterprise-canvas);
  --surface: var(--enterprise-canvas);
  --card: var(--enterprise-surface);
  --card2: var(--enterprise-surface-2);
  --track: var(--enterprise-surface-2);
  --head-bg: var(--enterprise-surface-2);
  --border: var(--enterprise-line);
  --border-light: #F0F1FB;
  --hairline: var(--enterprise-line);
  --text: var(--enterprise-ink);
  --text-light: var(--enterprise-muted);
  --text-muted: #666670;
  --primary: var(--enterprise-accent);
  --primary-dark: var(--enterprise-accent-hover);
  --gold: var(--enterprise-accent);
  --gold-light: #A0A5AD;
  --gold-grad: linear-gradient(135deg, var(--enterprise-accent), #62676F);
  --border-gold: #D5D6E0;
}

body.dark #content .page {
  --bg: #13161C;
  --surface: #13161C;
  --card: #1D2026;
  --card2: #22252B;
  --track: #22252B;
  --head-bg: #22252B;
  --border: #34373D;
  --border-light: #2D3036;
  --hairline: #34373D;
  --text: #E8EAEC;
  --text-light: #a9b6c7;
  --text-muted: #7f8da0;
  --primary: #9EA3AB;
  --primary-dark: #7D828A;
  --gold: #9EA3AB;
  --gold-light: #B9BEC6;
  --gold-grad: linear-gradient(135deg, #9EA3AB, #7D828A);
  --border-gold: rgba(158, 163, 171, .35);
}

#small-modal,
#modal,
.lead-modal-overlay,
.hrp-overlay,
.kpi-modal-backdrop {
  --primary: var(--enterprise-accent);
  --primary-dark: var(--enterprise-accent-hover);
  --gold: var(--enterprise-accent);
  --gold-light: #A0A5AD;
  --gold-grad: linear-gradient(135deg, var(--enterprise-accent), #62676F);
  --card2: var(--enterprise-surface-2);
  --track: var(--enterprise-surface-2);
  --hairline: var(--enterprise-line);
  --border-gold: #D5D6E0;
}

body.dark #small-modal,
body.dark #modal,
body.dark .lead-modal-overlay,
body.dark .hrp-overlay,
body.dark .kpi-modal-backdrop {
  --primary: #9EA3AB;
  --primary-dark: #7D828A;
  --gold: #9EA3AB;
  --gold-light: #B9BEC6;
  --gold-grad: linear-gradient(135deg, #9EA3AB, #7D828A);
  --card2: #22252B;
  --track: #22252B;
  --hairline: #34373D;
  --border-gold: rgba(158, 163, 171, .35);
}

#page-team-chat {
  max-width: none;
  /* --topbar-h (see :root) tracks #topbar's real height per breakpoint, including the
     tc-thread-open state where the topbar is hidden entirely. A bare 64px here used to disagree
     with the topbar's actual 60px/auto(min 64px)/0(hidden) heights, so the chat panel was either
     a few pixels short (desktop) or 64px short of what it should reclaim once the topbar hides
     (mobile thread view) - budget the composer never had, that a hardcoded number could not know
     was actually free. */
  height: calc(100dvh - var(--topbar-h)) !important;
}
/* #page-team-chat sets its own padding:0 (index.html), but it is a CHILD of #content, whose own
   clamp(18px,2.2vw,32px) top padding still pushes it down by that much - real, measured space the
   height formula above did not know to subtract, so the composer rendered a matching amount below
   the viewport on desktop (mobile already zeroes this via body.tc-thread-open #content above).
   Full-bleed #content for this one page instead of guessing its padding into the height calc too. */
#content:has(#page-team-chat.active) { padding: 0 !important; }


.page h1,
.page h2,
.page h3,
.modal h1,
.modal h2,
.modal h3 {
  color: var(--text);
  letter-spacing: -.018em;
}

.page h1,
.page .page-title,
.own-title,
.txn-title,
.mch-title {
  font-size: clamp(21px, 2vw, 28px);
  line-height: 1.25;
  font-weight: 750;
}

.page > [class$="-root"] > [class$="-header"],
.own-header,
.txn-header,
.mch-header,
.contracts-header,
.prp-head,
.tls-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  gap: 16px;
  margin-bottom: 18px;
}

.page > [class$="-root"] > [class$="-header"] > *,
.own-header > *,
.txn-header > *,
.mch-header > *,
.contracts-header > * {
  min-width: 0;
}


.card,
.stat-card,
.syncUi-box,
.settings-card,
.an-card,
.txn-card,
.kpi-card,
.own-card,
.mch-card,
.at-card {
  border: 1px solid var(--border) !important;
  border-radius: var(--enterprise-radius) !important;
  background: var(--card) !important;
  box-shadow: var(--enterprise-shadow) !important;
}

.card-header,
.modal-header,
.modal-footer {
  border-color: var(--border) !important;
}

.card-header {
  min-height: 52px;
  padding: 13px 16px;
}

.card-body {
  padding: 16px;
}

.stats-grid,
.dash-kpi-grid,
.dgl-kpi-grid,
.txn-stats,
.kpi-org-stats,
.at-stats-grid {
  gap: 12px !important;
}

.stat-card {
  min-height: 116px;
  padding: 16px;
}

.stat-value {
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.15;
}


.btn,
.syncUi-btn,
.own-btn-add,
.at-filter-btn,
.tls-v1 button,
.page button:not(.nav-item) {
  max-width: 100%;
}

.btn {
  min-height: var(--enterprise-control-h);
  justify-content: center;
  padding: 8px 14px;
  border-radius: 9px;
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1.2;
}

.btn-sm {
  min-height: 34px;
  padding: 6px 11px;
}

.btn-xs {
  min-height: 30px;
  padding: 5px 9px;
}

.btn-primary,
.syncUi-btn.primary,
.own-btn-add {
  background: var(--action-primary) !important;
  border-color: var(--action-primary) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.btn-primary:hover,
.syncUi-btn.primary:hover,
.own-btn-add:hover {
  background: var(--action-primary-hover) !important;
  border-color: var(--action-primary-hover) !important;
}

.btn-success {
  background: var(--action-success) !important;
  border-color: var(--action-success) !important;
  color: #fff !important;
}

.btn-warning {
  background: var(--action-warning) !important;
  border-color: var(--action-warning) !important;
  color: #fff !important;
}

.btn-danger {
  background: var(--action-danger) !important;
  border-color: var(--action-danger) !important;
  color: #fff !important;
}

.btn-info {
  background: var(--action-info) !important;
  border-color: var(--action-info) !important;
  color: #fff !important;
}

.btn-success:hover,
.btn-warning:hover,
.btn-danger:hover,
.btn-info:hover {
  filter: brightness(.9);
}

.btn-ghost {
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text-light);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select,
textarea,
.syncUi-control {
  min-width: 0;
  min-height: var(--enterprise-control-h);
  border: 1px solid var(--border) !important;
  border-radius: 9px !important;
  background: var(--card) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus,
.syncUi-control:focus {
  border-color: var(--primary) !important;
  outline: 3px solid color-mix(in srgb, var(--primary) 12%, transparent) !important;
  outline-offset: 0;
}

input::placeholder,
textarea::placeholder {
  color: var(--text-muted);
  opacity: 1;
}


[class*="filter-bar"],
[class*="filterbar"],
[class$="-filters"],
[class$="-toolbar"],
[class$="-actions"],
[class$="-tabs"],
.tab-bar,
.detail-actions,
.syncUi-actions {
  min-width: 0;
  gap: 8px;
}

[class*="filter-bar"],
[class*="filterbar"],
[class$="-filters"],
[class$="-toolbar"] {
  border-color: var(--border) !important;
}

.tab-btn,
[class$="-tab"],
[class*="-tab "] {
  min-height: 38px;
  border-radius: 8px;
  white-space: nowrap;
}

.tab-btn.active,
[class$="-tab"].active,
[class$="-tab"][class*="active"],
[class*="-tab-active"] {
  color: var(--primary) !important;
  border-color: color-mix(in srgb, var(--primary) 30%, var(--border)) !important;
  background: var(--primary-light) !important;
}


.page table,
.modal table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--text);
}

.page table thead tr,
.modal table thead tr {
  background: var(--surface-muted) !important;
}

.page table th,
.modal table th {
  height: 42px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border) !important;
  color: var(--text-light) !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap;
}

.page table td,
.modal table td {
  min-height: 48px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--border-light) !important;
  color: var(--text);
  font-size: 12.5px;
  vertical-align: middle;
}

.page table tbody tr:last-child td,
.modal table tbody tr:last-child td {
  border-bottom: 0 !important;
}

.page table tbody tr:hover td {
  background: color-mix(in srgb, var(--primary) 3.5%, var(--card)) !important;
}

[class*="table-wrap"],
[class*="table-container"],
.table-responsive {
  max-width: 100%;
  overflow-x: auto;
  border-color: var(--border) !important;
  border-radius: var(--enterprise-radius) !important;
  scrollbar-width: thin;
}


.modal-overlay,
.lead-modal-overlay,
[class$="-backdrop"],
[class$="-overlay"] {
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.modal,
.modal-content,
.lead-modal,
.hrp-panel,
.kpi-modal {
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  background: var(--card) !important;
  color: var(--text);
  box-shadow: var(--enterprise-shadow-lg) !important;
}

.lead-modal,
.hrp-panel {
  border-radius: 14px 0 0 14px !important;
}

html[dir="ltr"] .lead-modal,
html[dir="ltr"] .hrp-panel {
  border-radius: 0 14px 14px 0 !important;
}


.lead-modal-overlay,
.hrp-overlay {
  perspective: 2400px !important;
  animation: enterpriseOverlayIn .28s ease both !important;
}

.lead-modal,
.hrp-panel {
  transform-origin: right center !important;
  backface-visibility: hidden;
  will-change: transform, opacity;
  animation: enterprisePageOpen .68s cubic-bezier(.2, .82, .22, 1) both !important;
}

.lead-modal.closing,
.hrp-panel.closing {
  animation: enterprisePageClose .48s cubic-bezier(.55, .02, .72, .32) both !important;
}

html[dir="rtl"] .lead-modal,
html[dir="rtl"] .hrp-panel {
  transform-origin: left center !important;
  animation-name: enterprisePageOpenRtl !important;
}

html[dir="rtl"] .lead-modal.closing,
html[dir="rtl"] .hrp-panel.closing {
  animation-name: enterprisePageCloseRtl !important;
}

@keyframes enterpriseOverlayIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes enterprisePageOpen {
  0% { opacity: .15; transform: translateX(10%) rotateY(78deg) scale(.985); }
  72% { opacity: 1; transform: translateX(0) rotateY(-2deg) scale(1); }
  100% { opacity: 1; transform: translateX(0) rotateY(0) scale(1); }
}

@keyframes enterprisePageClose {
  0% { opacity: 1; transform: translateX(0) rotateY(0) scale(1); }
  100% { opacity: 0; transform: translateX(9%) rotateY(72deg) scale(.985); }
}

@keyframes enterprisePageOpenRtl {
  0% { opacity: .15; transform: translateX(-10%) rotateY(-78deg) scale(.985); }
  72% { opacity: 1; transform: translateX(0) rotateY(2deg) scale(1); }
  100% { opacity: 1; transform: translateX(0) rotateY(0) scale(1); }
}

@keyframes enterprisePageCloseRtl {
  0% { opacity: 1; transform: translateX(0) rotateY(0) scale(1); }
  100% { opacity: 0; transform: translateX(-9%) rotateY(-72deg) scale(.985); }
}

.modal-header,
.modal-footer {
  min-height: 58px;
  padding: 14px 18px;
  background: var(--card) !important;
}

.modal-body,
#small-modal-body {
  color: var(--text);
}

.form-row,
.form-grid,
[class*="form-grid"],
[class*="contact-grid"] {
  min-width: 0;
}


#page-dashboard #dash-greeting {
  margin-bottom: 2px;
  color: var(--text);
  font-size: clamp(22px, 2.3vw, 30px);
  font-weight: 750;
  letter-spacing: -.025em;
}

#page-dashboard #dash-greeting-sub {
  margin-bottom: 18px;
  color: var(--text-light);
}

#page-dashboard #dash-assistant-card {
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  background: var(--card) !important;
  box-shadow: var(--enterprise-shadow) !important;
}


#page-search .pf-shell,
#page-team-chat > div,
#assistant-panel,
.zcal-root {
  max-width: 100%;
  min-width: 0;
}

#assistant-panel {
  border: 1px solid var(--border) !important;
  border-radius: 14px !important;
  box-shadow: var(--enterprise-shadow-lg) !important;
}

#mobile-bottom-nav {
  border-color: var(--border) !important;
  background: color-mix(in srgb, var(--card) 96%, transparent) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}


@media (max-width: 1024px) {
  #content {
    padding: 18px;
    padding-bottom: 84px;
  }

  .stats-grid,
  .dgl-kpi-grid,
  .txn-stats,
  .kpi-org-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .an-main-layout,
  .txn-main {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 768px) {
  :root {
    --enterprise-control-h: 44px;
  }

  html,
  body,
  #app,
  #main,
  #content,
  .page {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  #sidebar {
    width: min(84vw, 300px) !important;
    padding-top: env(safe-area-inset-top);
  }

  #topbar,
  body.light #topbar {
    min-height: 60px !important;
    height: 60px !important;
    padding: 7px 10px !important;
    gap: 8px !important;
    overflow: hidden;
  }

  .topbar-leading {
    flex: 0 1 auto !important;
    min-width: 0;
    gap: 7px;
  }

  .topbar-logo {
    display: none;
  }

  .topbar-title {
    max-width: clamp(90px, 29vw, 160px) !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .topbar-actions {
    flex: 1 1 auto;
    justify-content: flex-end;
    overflow: visible !important;
  }

  /* #lang-switch is whitelisted: the language control is the only way to reach FA/AR on a
     phone, and this allowlist was what removed it from the mobile header entirely. */
  /* Settings must survive on mobile: it is now the only route to Language, and the profile and
     logout it used to sit beside have moved into the sidebar. */
  .topbar-actions > :not(#assistant-fab):not(#topbar-add-lead-btn):not(#alert-bell-wrap):not(#menu-toggle):not(#topbar-theme-btn):not(#topbar-lang):not(#topbar-settings-btn) {
    display: none !important;
  }

  #menu-toggle,
  #topbar-add-lead-btn,
  #topbar-alert-btn {
    display: inline-flex !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    flex: 0 0 42px !important;
    padding: 0 !important;
    align-items: center;
    justify-content: center;
    border-radius: 10px !important;
  }

  #alert-bell-wrap {
    display: block !important;
    flex: 0 0 42px !important;
  }

  #content {
    padding: 14px 12px calc(84px + env(safe-area-inset-bottom)) !important;
    overflow-x: clip;
  }

  .page > [class$="-root"] > [class$="-header"],
  .own-header,
  .txn-header,
  .mch-header,
  .contracts-header,
  .prp-head,
  .tls-head {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 14px;
  }

  [class$="-header-right"],
  [class$="-head-right"],
  [class$="-actions"],
  .syncUi-actions {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
  }

  [class$="-header-right"] > *,
  [class$="-head-right"] > * {
    min-width: 0;
  }

  [class*="search-wrap"] {
    flex: 1 1 180px;
    min-width: 0;
  }

  [class*="search-wrap"] input,
  [class$="-search"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  [class*="filter-bar"],
  [class*="filterbar"],
  [class$="-filters"],
  [class$="-toolbar"] {
    display: flex !important;
    width: 100%;
    max-width: 100%;
    flex-wrap: wrap !important;
    align-items: stretch !important;
  }

  [class*="filter-bar"] > *,
  [class*="filterbar"] > *,
  [class$="-filters"] > *,
  [class$="-toolbar"] > * {
    flex: 1 1 150px;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  [class$="-tabs"],
  .tab-bar,
  .detail-tabs,
  .detail-subtabs {
    display: flex !important;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  [class$="-tabs"]::-webkit-scrollbar,
  .tab-bar::-webkit-scrollbar,
  .detail-tabs::-webkit-scrollbar,
  .detail-subtabs::-webkit-scrollbar {
    display: none;
  }

  [class$="-tab"],
  .tab-btn,
  .detail-tab,
  .detail-subtab {
    flex: 0 0 auto !important;
    min-height: 42px;
    scroll-snap-align: start;
  }

  .stats-grid,
  .dash-kpi-grid,
  .dgl-kpi-grid,
  .dgl-status-bar,
  .txn-stats,
  .kpi-org-stats,
  .at-stats-grid,
  .myp-status-grid,
  .syncUi-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
  }

  .stat-card {
    min-height: 104px;
    padding: 13px;
  }

  .card-header,
  .card-body {
    padding: 13px;
  }

  [class*="table-wrap"],
  [class*="table-container"],
  .table-responsive {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    border-radius: 10px !important;
    -webkit-overflow-scrolling: touch;
  }

  .page table,
  .modal table {
    min-width: 680px;
  }

  .page table th,
  .modal table th,
  .page table td,
  .modal table td {
    padding: 10px;
  }

  .modal-overlay,
  .lead-modal-overlay,
  [class$="-backdrop"],
  [class$="-overlay"] {
    padding: 0 !important;
  }

  .modal,
  .modal-content,
  .lead-modal,
  .hrp-panel,
  .kpi-modal {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - env(safe-area-inset-top)) !important;
    margin: 0 !important;
    border-radius: 16px 16px 0 0 !important;
  }

  .lead-modal,
  .hrp-panel {
    height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    animation-duration: .5s !important;
  }

  .modal-footer {
    position: sticky;
    bottom: 0;
    z-index: 4;
    padding-bottom: max(14px, env(safe-area-inset-bottom));
  }

  .modal-footer .btn {
    flex: 1 1 140px;
  }

  .form-row.cols-2,
  .settings-form,
  .contract-create-form .form-row-2,
  .syncUi-grid,
  .syncUi-grid-3,
  [class*="contact-grid"] {
    grid-template-columns: 1fr !important;
  }

  #page-search .pf-shell {
    grid-template-columns: 1fr !important;
  }

  #page-search .pf-sidebar {
    width: 100% !important;
    max-height: 46dvh;
    overflow-y: auto;
  }

  #page-team-chat {
    height: calc(100dvh - 60px - 68px) !important;
    padding: 0 !important;
  }

  /* ── Mobile assistant = full-screen app surface, on the SAME shell pattern as
        the team-chat thread (see body.tc-thread-open #page-team-chat): fixed to
        the VISUAL viewport via --app-vh/--app-vh-top (keyboard- and iOS-pan-
        correct — raw 100dvh does NOT shrink for the keyboard), safe-area added
        to top and removed from height so nothing double-counts, and the shell
        chrome (topbar + bottom nav) hidden while open via body.assistant-open —
        exactly how the app already treats full-screen surfaces. z 200 clears
        the bottom nav (110) and stays under the modal layers. ── */
  #assistant-panel {
    position: fixed !important;
    /* Glued to the VISUAL viewport top. The status-bar inset is applied as
       INTERNAL padding (--asst-safe, published by the shell viewport writer) and
       shrinks as the iOS keyboard pan itself carries the panel below the status
       bar — the previous top formula added offsetTop AND the full safe inset,
       which double-counted during the pan: the real-iPhone keyboard bug where
       CRM content appeared above the assistant and the composer sank behind
       the keyboard. With top == --app-vh-top the panel ALWAYS starts at the
       exact visible top, so 0px of underlying CRM can ever show above it. */
    top: var(--app-vh-top, 0px) !important;
    padding-top: var(--asst-safe, env(safe-area-inset-top, 0px));
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: var(--app-vh, 100svh) !important;
    max-height: var(--app-vh, 100svh) !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    z-index: 200 !important;
    transform: none !important;
    min-height: 0;
  }
  body.assistant-open #topbar { display: none !important; }
  body.assistant-open #mobile-bottom-nav { display: none !important; }
  /* fixed must resolve against the viewport, never a transformed shell ancestor */
  body.assistant-open #app,
  body.assistant-open #main,
  body.assistant-open #content { transform: none !important; filter: none !important; }
  /* full height chain: header/quota/composer fixed, messages take the rest */
  #assistant-panel-header,
  #assistant-quota-bar,
  #assistant-attachments,
  #assistant-input-row { flex: 0 0 auto; }
  #assistant-messages {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  /* compact header at narrow widths: subtitle yields before controls do */
  #assistant-panel-header { padding: 10px 12px !important; }
  .assistant-head-titles small { max-width: 150px; }
  /* the desktop readable-column gutters are far too wide on a phone -
     compact paddings give the textarea real room at 320px */
  #assistant-messages { padding-left: 14px !important; padding-right: 14px !important; }
  #assistant-attachments { padding-left: 14px !important; padding-right: 14px !important; }
  #assistant-input-row { padding-left: 10px !important; padding-right: 10px !important; gap: 8px !important; }
  .assistant-newmsg-pill{ bottom:calc(92px + env(safe-area-inset-bottom, 0px)); }
  html.kb-open #assistant-input-row { padding-bottom: 12px !important; }
  /* while the assistant owns the screen the document must not move under it */
  body.assistant-open { overflow: hidden !important; overscroll-behavior: none; }

  #mobile-bottom-nav {
    height: calc(68px + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -8px 24px rgba(19, 22, 28, .08);
  }

  #mobile-bottom-nav button {
    min-width: 48px;
    min-height: 48px;
  }
}

@media (max-width: 480px) {
  #content {
    padding-inline: 10px !important;
  }

  .page h1,
  .page .page-title,
  .own-title,
  .txn-title,
  .mch-title {
    font-size: 21px;
  }

  .stats-grid,
  .dash-kpi-grid,
  .dgl-kpi-grid,
  .dgl-status-bar,
  .txn-stats,
  .kpi-org-stats,
  .at-stats-grid,
  .myp-status-grid,
  .syncUi-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  [class$="-header-right"] > .btn,
  [class$="-head-right"] > .btn,
  .contracts-header > .btn,
  .own-btn-add {
    flex: 1 1 100%;
    width: 100%;
  }

  [class$="-actions"] > .btn,
  .syncUi-actions > .syncUi-btn {
    flex: 1 1 calc(50% - 4px);
  }

  .page table {
    min-width: 620px;
  }
}

@media (max-width: 360px) {
  .stats-grid,
  .dash-kpi-grid,
  .dgl-kpi-grid,
  .dgl-status-bar,
  .txn-stats,
  .kpi-org-stats,
  .at-stats-grid,
  .myp-status-grid,
  .syncUi-kpis {
    grid-template-columns: 1fr !important;
  }

  .topbar-title {
    max-width: 90px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media print {
  #sidebar,
  #topbar,
  #mobile-bottom-nav,
  #assistant-panel,
  #assistant-fab {
    display: none !important;
  }

  #main {
    margin: 0 !important;
  }

  #content {
    padding: 0 !important;
  }

  .page {
    max-width: none;
  }
}


#content,
#content > .page,
#content .page.active {
  background-color: var(--bg) !important;
}


#content #page-team-chat.tch-gold-v2 {
  --bg: var(--enterprise-canvas);
  --surface: var(--enterprise-surface-2);
  --card: var(--enterprise-surface);
  --card2: var(--enterprise-surface);
  --border: var(--enterprise-line);
  --border-light: #F0F1FB;
  --hairline: var(--enterprise-line);
  --text: var(--enterprise-ink);
  --text-light: var(--enterprise-muted);
  --text-muted: #666670;
  --track: var(--enterprise-surface-2);
  --nav-hover: var(--enterprise-accent-soft);
  --btn-border: var(--enterprise-line);
  --bubble-other: var(--enterprise-surface);
  --ok: var(--enterprise-accent);
  --ok-text: var(--enterprise-accent);
  --ok-bg: var(--enterprise-accent-soft);
}
body.dark #content #page-team-chat.tch-gold-v2 {
  --bg: #13161C;
  --surface: #1D2026;
  --card: #1D2026;
  --card2: #22252B;
  --border: #34373D;
  --border-light: #2D3036;
  --hairline: #34373D;
  --text: #E8EAEC;
  --text-light: #a9b6c7;
  --text-muted: #7f8da0;
  --track: #22252B;
  --nav-hover: rgba(158, 163, 171,.12);
  --btn-border: #34373D;
  --bubble-other: #1D2026;
  --ok: #9EA3AB;
  --ok-text: #B9BEC6;
  --ok-bg: rgba(158, 163, 171,.12);
}
#team-chat-content,
#page-team-chat .tch-wrap,
#page-team-chat .tch-sidebar,
#page-team-chat #tc-chat-wrap,
#page-team-chat .chat-window-shell {
  min-height: 0 !important;
  height: 100%;
}
#page-team-chat #conv-list,
#page-team-chat .tch-messages {
  min-height: 0;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
#page-team-chat .tch-online-dot[hidden] { display: none !important; }
#page-team-chat .tch-presence-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  display: inline-block;
  border-radius: 50%;
  background: var(--card2);
}
#page-team-chat .tch-presence-dot.is-online { background: var(--ok); }
#page-team-chat .tch-chat-head-status.is-offline { color: var(--text-muted); }
#page-team-chat .tch-new-group-form { padding: 16px; }
#page-team-chat .tch-new-group-members { margin-top: 14px; }
#page-team-chat .tch-new-group-members > div { display: grid; gap: 7px; margin-top: 8px; max-height: 280px; overflow-y: auto; }
#page-team-chat .tch-member-option { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 9px; cursor: pointer; }
#page-team-chat .tch-new-group-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.tch-modal-title { display: inline-flex; align-items: center; gap: 7px; }


#page-search.srch-v1 { --filters-width: 280px; }
#page-search .pf-shell { grid-template-columns: var(--filters-width) minmax(0,1fr); }
#page-search .pf-assistant {
  grid-column: 1 / -1;
  grid-row: 1;
  position: static;
  height: auto;
  min-height: 58px;
  display: grid;
  grid-template-columns: minmax(220px,280px) minmax(260px,1fr);
  align-items: stretch;
}
#page-search .asst-head { border-bottom: 0; border-inline-end: 1px solid var(--pf-line); }
#page-search .asst-toggle {
  margin-inline-start: auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 34px;
  padding: 0 9px;
  border: 1px solid var(--pf-line);
  border-radius: 9px;
  background: var(--pf-surface);
  color: var(--pf-muted);
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
}
#page-search .asst-toggle svg { transition: transform .18s ease; }
#page-search .pf-assistant.is-expanded .asst-toggle svg { transform: rotate(180deg); }
#page-search .asst-input { grid-column: 2; border-top: 0; align-self: center; }
#page-search .asst-body { display: none; grid-column: 1 / -1; max-height: 210px; border-top: 1px solid var(--pf-line); }
#page-search .pf-assistant.is-expanded .asst-body { display: block; }
#page-search .pf-sidebar,
#page-search .pf-main { grid-row: 2; }


#prop-modal-overlay {
  background: rgba(2,8,18,.08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#prop-detail-modal {
  width: min(80vw,1280px) !important;
  box-shadow: -16px 0 42px rgba(19, 22, 28,.18) !important;
}
#prop-detail-modal .lm-body { grid-template-columns: minmax(0,1.65fr) minmax(280px,.85fr); }
#prop-detail-modal .lm-col { padding: 18px 22px; gap: 16px; }
#prop-detail-modal .lm-field { padding: 8px 0; }
#prop-detail-modal .lm-field .k { width: 132px; }
#prop-detail-modal .prp-modal-img { height: 220px; }

.dev-project-title-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.dev-project-map-primary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--primary);
  border-radius: 9px;
  background: var(--primary);
  color: #fff !important;
  text-decoration: none !important;
  font-size: 12px;
  font-weight: 700;
}

.crm-deal-progress { min-width: 150px; display: grid; gap: 5px; }
.crm-deal-progress-track { height: 6px; overflow: hidden; border-radius: 999px; background: var(--track); }
.crm-deal-progress-track > span { display: block; width: var(--deal-progress); height: 100%; border-radius: inherit; background: var(--stage-c,var(--primary)); }
.crm-deal-progress-label { color: var(--text-muted); font-size: 10.5px; font-weight: 650; }

@media (max-width: 768px) {
  /* #assistant-fab is whitelisted: the mobile AI entry point lives in the header
     beside the bell (the hidden pwa/logout buttons between them collapse away). */
  .topbar-actions > :not(#assistant-fab):not(#topbar-add-lead-btn):not(#alert-bell-wrap):not(#topbar-settings-btn):not(#menu-toggle):not(#topbar-theme-btn):not(#topbar-lang) { display: none !important; }
  #assistant-fab {
    display: inline-flex !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    flex: 0 0 42px !important;
    border-radius: 12px !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #topbar-theme-btn {
    display: inline-flex !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
    padding: 0 !important;
    align-items: center;
    justify-content: center;
  }
  [class$="-tabs"], .tab-bar, .detail-tabs, .detail-subtabs {
    width: calc(100% + 24px) !important;
    max-width: none !important;
    margin-inline: -12px !important;
    padding-inline: 12px !important;
    scroll-padding-inline: 12px;
  }
  #page-search .pf-assistant { display: flex; grid-column: auto; grid-row: auto; }
  #page-search .asst-head { border-inline-end: 0; border-bottom: 1px solid var(--pf-line); }
  #page-search .asst-input { order: 2; }
  #page-search .asst-body { order: 3; max-height: 180px; }
  #page-search .pf-sidebar,
  #page-search .pf-main { grid-row: auto; }
  #prop-detail-modal { width: 100vw !important; }
  #prop-detail-modal .lm-body { grid-template-columns: 1fr; }
  .dev-project-title-row { align-items: flex-start; }
  .dev-project-title-actions { width: 100%; justify-content: flex-start; }
}

@media (max-width: 420px) {
  #topbar-add-lead-btn { display: none !important; }
  #content { padding-inline: 12px !important; }
  #page-search .asst-copy span,
  #page-search .asst-toggle span { display: none; }
}

.at-today-location {
  margin: 12px 0 18px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
  display: grid;
  gap: 8px;
}
.at-today-location-head { display: grid; gap: 4px; }
.at-today-location-head strong { font-size: 12px; }
.at-today-location-head span, .at-today-address {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.at-today-map, .at-evidence-map {
  width: 100%;
  height: 180px;
  border: 0;
  border-radius: 10px;
  background: color-mix(in srgb, var(--border) 35%, var(--card));
}
.at-today-location-actions { display: flex; flex-wrap: wrap; gap: 8px; }

.prp-zoho-media{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.prp-media-slot{border:1px solid var(--line,var(--border));border-radius:12px;padding:10px;background:#fff}
.prp-media-slot strong{display:block;margin-bottom:6px;font-size:12px}
.prp-media-preview{position:relative;height:92px;border-radius:8px;overflow:hidden;background:#EDEEF8;display:grid;place-items:center}
.prp-media-preview img{width:100%;height:100%;object-fit:cover}
.prp-slot-empty{color:#8a9099;font-size:12px}
.prp-card-img,.prp-modal-img,.prp-media-preview{position:relative}
.prp-card-img::before,.prp-modal-img::before,.prp-media-preview::before{
  content:attr(data-address);
  position:absolute;left:8px;bottom:8px;z-index:3;
  color:#fff;font-size:11px;font-weight:700;letter-spacing:.01em;
  background:rgba(20, 23, 29,.55);padding:3px 7px;border-radius:6px;max-width:calc(100% - 16px);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none
}
.priv-docs-modal{position:fixed;inset:0;z-index:12000;background:rgba(19, 22, 28,.45);display:grid;place-items:center;padding:18px}
.priv-docs-modal[hidden]{display:none!important}
.priv-docs-card{width:min(860px,100%);max-height:90vh;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:18px;padding:18px}
.priv-docs-card header{display:flex;justify-content:space-between;align-items:center;gap:12px}
.priv-docs-card header h3{margin:0;font-size:18px}
.priv-docs-card header button{width:36px;height:36px;border:1px solid var(--border);border-radius:50%;background:#fff;cursor:pointer}
.priv-docs-sub{color:#6b7280;font-size:12px}
.priv-docs-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.priv-docs-field span{display:block;margin-bottom:4px;color:#6b7280;font-size:11px;font-weight:700}
.priv-docs-files{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.priv-docs-file{border:1px solid #F0F1FB;border-radius:12px;padding:10px;display:grid;gap:6px}
.priv-docs-card footer{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
@media(max-width:720px){
  .prp-zoho-media,.priv-docs-grid,.priv-docs-files{grid-template-columns:1fr}
}

.prp-record-tabs{
  display:flex;gap:6px;padding:0 22px;border-bottom:1px solid var(--lm-border,var(--border));
  background:var(--lm-card,#fff);flex-shrink:0;
}
.prp-record-tab{
  appearance:none;border:0;background:transparent;cursor:pointer;font-family:inherit;
  padding:12px 14px 11px;font-size:13px;font-weight:700;color:var(--lm-muted,#6b7280);
  border-bottom:2px solid transparent;margin-bottom:-1px;
}
.prp-record-tab.is-on{color:var(--lm-text,var(--text));border-bottom-color:var(--lm-gold,#c4a574)}
.prp-record-tab[data-locked="1"]{opacity:.7}
#prop-detail-modal .lm-body.is-wide-tab{grid-template-columns:1fr}
#prop-detail-modal .lm-body.is-wide-tab .lm-side{display:none!important}
#prop-detail-modal .lm-body.is-wide-tab .lm-main{border-inline-end:none}
.prp-tab-help{margin:4px 0 12px;color:#6b7280;font-size:12px;line-height:1.5}
.prp-photos-layout{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:auto auto;gap:12px}
.prp-photo-card{border:1px solid var(--line,var(--border));border-radius:14px;background:#fff;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.prp-photo-card.is-hero{grid-column:1;grid-row:1 / span 2}
.prp-photo-card header{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid #F0F1FB}
.prp-photo-card header strong{font-size:12px}
.prp-photo-frame{position:relative;min-height:140px;background:#EDEEF8}
.prp-photo-card.is-hero .prp-photo-frame{min-height:280px;flex:1}
.prp-photo-frame .prp-media-preview,.prp-photo-frame .prp-img-add{height:100%;min-height:140px}
.prp-photo-frame .prp-media-preview{height:100% !important}
.prp-photo-card.is-hero .prp-photo-frame .prp-media-preview,
.prp-photo-card.is-hero .prp-photo-frame .prp-img-add{min-height:280px}
.prp-photo-frame img{width:100%;height:100%;object-fit:cover;display:block}
.prp-photo-count{position:absolute;top:10px;right:10px;z-index:2;background:rgba(20, 23, 29,.7);color:#fff;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:700}
.prp-gallery-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:8px}
.prp-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.prp-gallery-add,.prp-gallery-tile{
  display:flex;flex-direction:column;gap:8px;min-height:170px;border-radius:14px;overflow:hidden;padding:0;
  border:1px solid var(--border);background:#fff;cursor:pointer;text-align:start;font-family:inherit;
}
.prp-gallery-add{align-items:center;justify-content:center;border-style:dashed;padding:16px;color:#6b7280}
.prp-gallery-add strong{color:var(--text);font-size:13px}
.prp-gallery-add span,.prp-gallery-tile span{font-size:11px;padding:0 10px 10px;color:#6b7280;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prp-gallery-tile img{width:100%;height:128px;object-fit:cover;display:block;background:#EDEEF8}
.prp-docs-files-title{margin:8px 0;font-size:13px}
@media(max-width:900px){
  .prp-photos-layout{grid-template-columns:1fr}
  .prp-photo-card.is-hero{grid-column:auto;grid-row:auto}
}

.prp-photo-slots{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}

#prop-detail-modal,
.lead-modal{
  height:100vh !important;
  max-height:100vh !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}
#prop-detail-modal .lm-header,
#prop-detail-modal .lm-stats,
#prop-detail-modal .prp-record-tabs,
.lead-modal .lm-header,
.lead-modal .lm-stats{
  flex-shrink:0;
}
#prop-detail-modal .lm-body,
.lead-modal .lm-body{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
#prop-detail-modal .lm-col{
  min-height:min-content;
  overflow:visible;
}
.prp-form-stack{display:flex;flex-direction:column;gap:16px}
.prp-gallery-head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:12px;
}
.prp-tab-help{
  margin:4px 0 0;font-size:12px;font-weight:600;color:var(--lm-muted,#6b7280);line-height:1.45;
}
.prp-gallery-fields{display:grid;grid-template-columns:1fr;gap:14px;align-items:start}
@media (min-width:960px){
  .prp-gallery-fields{grid-template-columns:1fr 1fr}
  .prp-gallery-fields .prp-field-card:first-child{grid-column:1/-1}
}
.prp-field-card{
  border:1px solid var(--lm-border,var(--border));
  border-radius:14px;
  background:var(--lm-card,#fff);
  padding:14px 16px;
}
.prp-field-card.is-on{border-color:#cfe8dc}
.prp-field-card.is-off{border-style:dashed;background:var(--lm-surface,#fafaf8)}
.prp-field-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.prp-field-head h3{margin:0;font-size:13px;font-weight:800}
.prp-status{
  flex-shrink:0;font-size:11px;font-weight:800;padding:4px 9px;border-radius:999px;
  border:1px solid transparent;
}
.prp-status.is-on{background:#e8f7f2;color:#6A6F77;border-color:#b8e6d8}
.prp-status.is-off{background:var(--card2);color:#6b7280}
.prp-file-btn{
  display:inline-flex;align-items:center;justify-content:center;margin-top:10px;
  min-height:36px;padding:0 14px;border-radius:10px;cursor:pointer;
  border:1px solid var(--lm-border-gold,#d4c4a0);background:#F6F7FF;color:#6b5428;
  font-size:12px;font-weight:800;
}
.prp-thumbs{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.prp-thumb{
  position:relative;width:118px;border-radius:12px;overflow:hidden;
  border:1px solid var(--border);background:#f6f4ef;
}
.prp-thumb img{width:118px;height:88px;object-fit:cover;display:block}
.prp-thumb-preview{
  position:relative;display:block;width:100%;padding:0;border:0;background:transparent;
  cursor:zoom-in;overflow:hidden;text-align:inherit;
}
.prp-thumb-preview img{transition:transform .2s ease,filter .2s ease}
.prp-thumb-preview:hover img,.prp-thumb-preview:focus-visible img{transform:scale(1.04);filter:brightness(.86)}
.prp-thumb-preview:focus-visible{outline:2px solid var(--primary,#797E86);outline-offset:-2px}
.prp-thumb-zoom{
  position:absolute;left:50%;top:44px;translate:-50% -50%;display:grid;place-items:center;
  width:30px;height:30px;border-radius:10px;background:rgba(11, 14, 20,.76);color:#fff;
  font-size:18px;line-height:1;opacity:0;transform:scale(.82);transition:.18s;pointer-events:none;
}
.prp-thumb-preview:hover .prp-thumb-zoom,.prp-thumb-preview:focus-visible .prp-thumb-zoom{opacity:1;transform:scale(1)}
.prp-thumb figcaption{
  font-size:10px;padding:5px 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#6b7280;
}
.prp-thumb figcaption a{color:#6b5428;text-decoration:none;font-weight:700}
.prp-thumb-del{
  position:absolute;z-index:3;top:6px;right:6px;width:22px;height:22px;border:0;border-radius:50%;
  background:rgba(20, 23, 29,.78);color:#fff;cursor:pointer;font-size:14px;line-height:22px;
}
.prp-gallery-tab{position:relative}
.prp-gallery-tab.is-busy{min-height:220px}
.prp-gallery-tab.is-busy .prp-gallery-fields,.prp-gallery-tab.is-busy .prp-gallery-head{filter:saturate(.65);opacity:.58}
.prp-gallery-progress{
  position:absolute;z-index:8;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;
  border-radius:14px;background:color-mix(in srgb,var(--card,#fff) 78%,transparent);
  color:var(--text,var(--text));font-size:12px;backdrop-filter:blur(4px);
}
.prp-gallery-progress[hidden]{display:none!important}
.prp-gallery-progress span{
  width:18px;height:18px;border:2px solid color-mix(in srgb,var(--primary,#797E86) 24%,transparent);
  border-top-color:var(--primary,#797E86);border-radius:50%;animation:ppm-spin .7s linear infinite;
}
.prp-drop{
  min-width:148px;min-height:88px;padding:10px;border:1px dashed #d4c4a0;border-radius:12px;
  display:grid;place-items:center;color:#8a7a5a;font-size:12px;font-weight:700;cursor:pointer;text-align:center;
}
.prp-file-chip{display:grid;place-items:center;height:88px;padding:8px;font-size:11px;text-align:center}
.prp-doc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.prp-doc-input{
  display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;
  padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:#fff;
}
.prp-doc-input em{font-style:normal;font-weight:700;margin-inline-start:6px;color:#9ca3af}
.prp-doc-input.is-filled{border-color:#b8e6d8;background:#f3fbf8}
.prp-doc-input.is-filled em{color:#6A6F77}
.prp-doc-input.is-empty{border-style:dashed;background:#fffdf8}
.prp-doc-input.is-empty em{color:#b45309}
@media (max-width:720px){
  .prp-doc-grid{grid-template-columns:1fr}
  .prp-gallery-fields{grid-template-columns:1fr}
}

.tg-card{
  margin-top:18px;padding:14px 16px;border:1px solid var(--lm-border,var(--border));
  border-radius:14px;background:var(--card,#fff);
}
.tg-card h3{margin:0;font-size:13px;font-weight:800}
.tg-card p{margin:6px 0 0;font-size:12px;color:#6b7280;line-height:1.45}
.tg-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.telegram-connect-primary{
  min-height:46px;padding:0 22px;background:#229ED9!important;color:#fff!important;
  border:1px solid #1888bd!important;box-shadow:0 9px 22px rgba(34,158,217,.28)!important;
  font-size:13px!important;font-weight:800!important;
}
.telegram-connect-primary:hover{background:#1888bd!important;opacity:1!important}
.tg-bot-form{display:grid;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid #eee}
.tg-bot-form input{max-width:420px}


.howto-card{
  margin-top:18px;padding:14px 16px;border:1px solid var(--lm-border,var(--border));
  border-radius:14px;background:var(--card,#fff);
}
.howto-card h3{margin:0;font-size:13px;font-weight:800}
.howto-steps{margin:8px 0 0;padding-inline-start:18px;font-size:12px;color:#6b7280;line-height:1.55}
.howto-steps li{margin:5px 0}
.howto-steps b{color:var(--text);font-weight:700}

@media (max-width: 900px){
  .tg-actions,.telegram-connect-primary{width:100%}
  /* r211: the Dashboard KPI cards (#dashboard-stats), the hero (greeting + Assigned-Agent scope
     filter) and the status strip MUST stay visible and usable on mobile — they carry their own
     responsive styles below. Only the legacy modal/list stat clutter is hidden on small screens. */
  #prop-detail-modal .lm-stats,
  .lead-modal .lm-stats,
  .prp-chips,
  .prp-count,
  .crm-dl-count{
    display:none !important;
  }
  #page-search .pf-shell{
    display:flex !important;
    flex-direction:column;
  }
  #page-search .pf-sidebar{order:2; position:static; max-height:none;}
  #page-search .pf-assistant{order:3;}
  #page-search .pf-shell > section:not(.pf-assistant){order:1;}
  #prop-detail-modal .lm-close,
  .lead-modal .lm-close,
  .own-panel-close,
  .own-modal-close,
  .txn-modal-close,
  .hrp-close,
  .dev-panel-close{
    position:fixed !important;
    /* track the VISUAL viewport: when the iOS keyboard pans the layout viewport,
       --app-vh-top carries the pan - a plain fixed top:10px ends up scrolled out of the
       visible area, leaving the user with no reachable close button. */
    top: calc(var(--app-vh-top, 0px) + max(10px, env(safe-area-inset-top, 0px)));
    right: 10px;
    left: auto !important;
    z-index: 130010;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
    display: grid !important;
    place-items: center;
    background: #fff !important;
    color: #111 !important;
    border: 1px solid var(--border) !important;
    border-radius: 12px !important;
    pointer-events: auto !important;
  }
  .pwa-install-banner:not([hidden]){
    display:flex;
    align-items:center;
    justify-content:center;
    position:fixed;
    left:12px;
    right:12px;
    bottom: calc(68px + env(safe-area-inset-bottom, 0px));
    z-index: 115;
    min-height: 44px;
    padding: 10px 14px;
    border: 1px solid var(--border, var(--border));
    border-radius: 12px;
    background: var(--card, #fff);
    color: var(--text, #111);
    font: 700 13px/1.3 inherit;
    cursor: pointer;
  }
}
.pwa-install-banner{display:none;}
.pwa-install-banner[hidden]{display:none !important;}
@media (max-width: 900px){
  .pwa-install-banner:not([hidden]){display:flex !important;}
}


/* r80 mobile cards + contacts redesign */
.own-stat-bar,.own-eyebrow,.own-subtitle{display:none !important}
.own-card-rows{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:10px 0 8px;
}
.own-card-actions{
  display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;
}
.own-act{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:34px;padding:0 12px;border-radius:9px;
  border:1px solid #DFE0EA;background:#fff;color:#2E3137;
  font:700 11px/1 inherit;text-decoration:none;cursor:pointer;
}
.own-act-open{background:#797E86;border-color:#797E86;color:#fff}
.dev-card{}
.dev-m-list,.srch-m-list,.crm-dl-m-list,#txn-cards{
  display:flex;flex-direction:column;gap:10px;
}
.srch-m-card,.txn-m-card{
  background:var(--card,#fff);border:1px solid var(--border,var(--border));
  border-radius:14px;padding:12px 14px;cursor:pointer;
}
.srch-m-card.is-picked{border-color:#c4a574;background:rgba(196,165,116,.1)}
.srch-m-top{display:flex;align-items:center;gap:10px}
.srch-m-top .srch-namecol{flex:1;min-width:0}
.srch-m-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.srch-m-actions{display:flex;gap:8px;margin-top:10px}
.txn-m-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.txn-m-top b{font-size:14px}
.txn-m-top span,.txn-m-mid{color:var(--text-muted,#6b7280);font-size:12px}
.txn-m-foot{display:flex;justify-content:space-between;margin-top:8px;font-weight:800}
#txn-cards{display:none}
@media (min-width: 901px){
  .crm-dl-m-list,.srch-m-list,.dev-m-list{display:none !important}
}
@media (max-width: 900px){
  .own-eyebrow,.own-subtitle,.own-stat-bar,.own-view-toggle{display:none !important}
  .own-header{align-items:center;margin-bottom:12px;gap:10px}
  .own-title{font-size:20px}
  .own-toolbar{
    position:sticky;top:0;z-index:30;
    grid-template-columns:1fr 1fr;
    background:var(--bg,#F6F7FF);
    padding:8px 0 10px;margin-bottom:10px;
  }
  .own-search-wrap{grid-column:1 / -1}
  /* #page-owners pins the module to direction:ltr for the desktop table. The card list is built
     entirely on logical properties (text-align:start, flex), so on a phone it can simply follow the
     document direction and mirror properly in Persian and Arabic - the detail panel, which lives
     outside #page-owners, already did. The number itself stays LTR via .own-card-phone. */
  #page-owners{direction:inherit}
  .own-grid{grid-template-columns:1fr;gap:10px}
  .own-card{min-height:0;padding:14px}
  .own-card-info b.own-card-name{font-size:16px;line-height:1.25}
  .own-card-info .own-card-phone{font-size:15px;line-height:1.3}
  .own-card-info{gap:2px}
  .own-card-sub{margin-top:8px;font-size:11px}
  .own-card-rows{margin:8px 0 6px}
  .own-card-contact{margin:0}
  .prp-viewtog,.prp-chips,.prp-count{display:none !important}
  .prp-filters{
    position:sticky;top:0;z-index:28;
    background:var(--bg,#F6F7FF);padding-top:6px;
  }
  .prp-search,.crm-dl-search,.dev-search-wrap,.txn-search-wrap,.pf-searchbox{
    width:100%;min-width:0;
  }
  .crm-dl-head{flex-wrap:wrap}
  .crm-dl-search{order:3;flex:1 1 100%}
  #page-deals .crm-ll-wrap,
  #txn-table-wrap,
  .srch-table-wrap,
  .dev-table-wrap,
  .prp-wrap{display:none !important}
  #txn-cards{display:flex !important}
  .dev-card-stats{justify-content:space-between}
  .dev-stat{align-items:flex-start}
}


/* r81 mobile fixed shell: chrome stays put, only #content scrolls */
@media (max-width: 900px) {
  html, body {
    width: 100%;
    max-width: 100%;
    height: 100svh;
    max-height: 100svh;
    overflow: hidden;
    overscroll-behavior: none;
  }
  html.crm-mobile-lock,
  html.crm-mobile-lock body {
    height: var(--app-vh, 100svh);
    max-height: var(--app-vh, 100svh);
  }
  #auth-boot-screen,
  #login-screen {
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  #app {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100vw;
    min-height: 0;
    height: var(--app-vh, 100svh);
    max-height: var(--app-vh, 100svh);
    overflow: hidden;
  }
  #main {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    overflow: hidden !important;
  }
  #topbar {
    position: relative !important;
    top: auto !important;
    flex: 0 0 auto !important;
    height: calc(56px + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(56px + env(safe-area-inset-top, 0px)) !important;
    max-height: calc(56px + env(safe-area-inset-top, 0px)) !important;
    padding: env(safe-area-inset-top, 0px) 10px 0 !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    overflow: hidden !important;
    width: 100% !important;
    box-sizing: border-box !important;
    z-index: 80 !important;
  }
  #topbar-date { display: none !important; }
  .topbar-actions {
    overflow: hidden !important;
    flex-wrap: nowrap !important;
  }
  #content {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    width: 100% !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
    padding: 10px 10px calc(80px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .pwa-install-banner:not([hidden]) + #content {
    padding-bottom: calc(128px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .page {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden;
  }
  .own-toolbar,
  .prp-filters,
  .crm-dl-head,
  .dev-topbar,
  .txn-toolbar,
  .txn-header {
    position: sticky;
    top: 0;
    z-index: 25;
    background: var(--bg, #F6F7FF);
  }
  #mobile-bottom-nav {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
  }
}


/* r82 login hint, captcha, hide in-app install */
body.auth-app #pwa-install-banner,
body.auth-app #pwa-install-chip{display:none !important}
.pwa-login-hint{
  display:flex;align-items:flex-start;gap:10px;
  margin:0 0 16px;padding:12px 12px 12px 14px;
  border:1px solid #d7e4de;border-radius:14px;background:#f3faf7;text-align:start;
}
.pwa-login-hint[hidden]{display:none !important}
.pwa-login-hint strong{display:block;font-size:13px;color:#12372c}
.pwa-login-hint span{display:block;margin-top:3px;font-size:12px;color:#4b635b;line-height:1.35}
.pwa-login-hint-go{
  margin-left:auto;min-height:36px;padding:0 12px;border:0;border-radius:10px;
  background:#797E86;color:#fff;font:700 12px/1 inherit;cursor:pointer;white-space:nowrap;
}
.pwa-login-hint-x{
  width:32px;height:32px;border:0;border-radius:8px;background:transparent;
  color:#5b7169;font-size:18px;cursor:pointer;line-height:1;
}
.captcha-block{
  border:1px solid #d5e0da;border-radius:16px;background:#f7faf8;padding:14px;
}
.captcha-copy{margin:0 0 10px;font-size:12px;color:#5b7169;line-height:1.4}
.captcha-canvas{
  width:176px;height:56px;border-radius:10px;border:1px solid #d7e2dc;background:#eef4f1;
}
.captcha-ans{width:92px !important}

/* ===== r83 mobile ux audit (16 Aug 2026) ===== */
#tc-sidebar-wrap{ display:flex; flex-direction:column; }
#tc-chat-wrap{ display:flex; flex-direction:column; }
#alert-bell-panel.abell-sheet{
  position:fixed !important;
  top:calc(56px + env(safe-area-inset-top, 0px) + 8px) !important;
  left:12px !important;
  right:12px !important;
  width:auto !important;
  max-width:none !important;
  max-height:calc(100dvh - 140px) !important;
  z-index:200000 !important;
  /* was `inset-inline-end:auto !important` — same property as `right` in LTR, declared
     later, so it cancelled the `right:12px` above and the panel shrink-to-fit to its
     content width (measured 1305px on a 390px viewport). Pin both logical edges instead. */
  inset-inline-start:12px !important;
  inset-inline-end:12px !important;
  box-sizing:border-box !important;
}
.mch-loading{ display:none; }

@media (max-width: 900px){
  #page-deals .crm-dl-m-list{
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    visibility:visible !important;
  }
  #page-deals .crm-dl-card{
    display:block !important;
    background:var(--card,#fff);
    border:1px solid var(--border,var(--border));
    border-radius:14px;
    padding:13px 15px;
  }
  #page-deals .crm-ll-wrap{ display:none !important; }

  #page-properties .prp-filters,
  #page-properties.prp-gold-v2 .prp-filters{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:8px;
    align-items:stretch;
  }
  #page-properties .prp-search,
  #page-properties.prp-gold-v2 .prp-search{
    grid-column:1 / -1;
    min-width:0 !important;
    width:100%;
    flex:none !important;
  }
  #page-properties .prp-select,
  #page-properties.prp-gold-v2 .prp-filters .prp-select{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:40px;
  }

  .crm-dl-tabs,
  #page-deals.crm-gold-v2 .crm-dl-tabs,
  .settings-pro-tabs,
  .at-tabs{
    scroll-padding-inline:20px;
    -webkit-mask-image:linear-gradient(to right, #000 0%, #000 calc(100% - 28px), transparent 100%);
    mask-image:linear-gradient(to right, #000 0%, #000 calc(100% - 28px), transparent 100%);
  }
  .at-tab{ scroll-margin-inline:16px; }

  .dc-admin-center>header>div{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    min-width:0;
    flex:1;
  }
  .dc-admin-center>header small,
  .dc-admin-center>header h2{
    position:static !important;
    transform:none !important;
    margin:0;
    line-height:1.35;
  }
  .dc-admin-center>header h2{ color:#fff !important; }
  .dc-admin-center>header small{ color:#D3D4DE !important; }

  .dc-detail-grid{ grid-template-columns:1fr !important; }
  .dc-chart-wrap{ grid-template-columns:1fr !important; }
  .dc-admin-action-grid{ grid-template-columns:1fr !important; }
  .dc-panel{ overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; }
  #dash-command-center, .dash-command-center{ max-width:100%; overflow-x:hidden; }

  #page-search .srch-table .pf-stat,
  #page-search .srch-stat,
  #page-search td .pf-stat{
    position:static !important;
    top:auto !important;
    inset:auto !important;
  }
  #page-search .pf-photo,
  #page-search .pf-card{ position:relative; }
  #page-search .pf-photo .pf-stat{
    position:absolute !important;
    top:9px;
    inset-inline-start:9px;
  }
  #page-search .pf-mainhead{
    flex-direction:column;
    align-items:stretch;
  }
  #page-search .activeFilterChips{
    order:3;
    width:100%;
    position:static;
  }

  body.light .lhub-tab{ color:#4b5563; }
  body.light .lhub-tab:hover{ color:var(--text); }
  body.light .lhub-tabs{ border-bottom-color:var(--border); }
  body.light #page-learn .page-sub,
  body.light #page-kb .page-sub{
    color:#4b5563;
  }
  #page-learn .page-sub{ color:var(--text-muted,#6b7280); }

  .lm-header{
    display:flex !important;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    padding:10px 12px 12px;
  }
  .lm-title{
    flex:1 1 100%;
    order:-1;
    min-width:0;
    width:100%;
  }
  .lm-title h2{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:16px;
    max-width:100%;
  }
  .lm-convert, .lm-edit{ font-size:11px; padding:6px 8px; }

  .zcal-top{ padding-inline:12px; overflow:visible; }
  .zcal-titlebar{
    direction:ltr;
    padding-inline:4px;
    gap:8px;
  }
  .zcal-icon-btn{ flex-shrink:0; }

  .notes-card-head{ min-width:0; }
  .notes-card-meta{ flex:1; min-width:0; }
  .notes-author{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
  }
  .notes-card-actions{ opacity:1 !important; flex-shrink:0; }

  #page-todos.tgl-gold-v2 .tgl-controlbar{ align-items:flex-start; }
  #page-todos.tgl-gold-v2 .tgl-seg-tabs{
    align-self:flex-start;
    max-height:46px;
    overflow:hidden;
  }
  #page-todos.tgl-gold-v2 .tgl-tab{
    max-height:40px;
    padding:7px 14px;
    align-self:center;
  }

  .at-filter-row{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .at-filter-row .at-filter-btn,
  .at-filter-row select.at-filter-input{ grid-column:1 / -1; }
  .at-filter-input[type="date"]{
    min-width:0;
    width:100%;
    min-height:42px;
  }

  html.crm-mobile-lock #page-team-chat{
    height:100% !important;
    padding:0 !important;
  }
  #tc-sidebar-wrap{
    width:100% !important;
    display:none !important;
  }
  #tc-sidebar-wrap.tc-show{ display:flex !important; }
  #tc-chat-wrap{ display:none !important; }
  #tc-chat-wrap.tc-show,
  #page-team-chat.is-tc-open #tc-chat-wrap{ display:flex !important; }
  #page-team-chat.is-tc-open #tc-sidebar-wrap{ display:none !important; }
  .tch-conv-name{
    max-width:none !important;
    min-width:0;
    flex:1;
  }

  #small-modal .modal-footer:empty{ display:none !important; }
}

body.light .dc-admin-center>header h2{ color:#fff !important; }
body.light .dc-admin-center>header small{ color:#D3D4DE !important; }

/* ===== r84 deal wizard + compact mobile lists ===== */
.deal-wiz-hint{margin:0 0 10px;font-size:12px;color:var(--text-muted);line-height:1.45}
.deal-wiz-rail{display:flex;gap:6px;overflow-x:auto;padding-bottom:8px;margin-bottom:12px;scroll-padding-inline:8px;-webkit-overflow-scrolling:touch}
.deal-wiz-rail button{flex-shrink:0;border:1px solid var(--border);background:var(--card,#fff);color:var(--text-muted);border-radius:999px;padding:6px 10px;font:700 11px inherit;cursor:pointer}
.deal-wiz-rail button.is-on{background:var(--active-pill,var(--bg));color:var(--text);border-color:var(--neutral-border,#c4a574)}
.deal-wiz-pane-title{font-size:13px;font-weight:800;margin:0 0 10px}
.deal-wiz-nav{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.lm-fields:empty{display:none}
.lm-block:has(.lm-fields:empty){display:none}

@media (max-width: 900px){
  html.crm-mobile-lock .topbar-logo{ display:none !important; }
  html.crm-mobile-lock .topbar-leading,
  html.crm-mobile-lock .topbar-brand{
    flex:1 1 auto !important;
    min-width:0 !important;
  }
  html.crm-mobile-lock .topbar-title-wrap{
    flex:1 1 auto !important;
    min-width:0 !important;
    max-width:100%;
  }
  html.crm-mobile-lock #page-title{
    display:block !important;
    max-width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    font-size:16px !important;
    font-weight:700 !important;
  }
  html.crm-mobile-lock .topbar-actions{ flex-shrink:0; }

  .ztask-kicker,
  .ztask-hero p{ display:none !important; }
  .ztask-hero{
    padding:10px 12px !important;
    gap:10px !important;
    align-items:center !important;
    box-shadow:none !important;
  }
  .ztask-hero h1{ font-size:18px !important; margin:0 !important; }
  .ztask-primary{ min-height:38px !important; width:auto !important; flex-shrink:0; }
  .ztask-stats{ display:none !important; }
  .ztask-shell{ gap:10px !important; }
  .ztask-toolbar{
    flex-wrap:wrap !important;
    padding:8px !important;
    gap:8px !important;
    align-items:stretch !important;
  }
  .ztask-tabs{ max-height:40px; overflow:hidden; }
  .ztask-tabs button{ max-height:36px; }
  .ztask-search{ min-width:0 !important; width:100% !important; }
  .ztask-filters{ width:100%; flex-wrap:wrap; }

  .own-eyebrow, .own-subtitle, .own-stat-bar{ display:none !important; }
  .own-header{ margin-bottom:10px !important; gap:8px !important; align-items:center !important; }
  .own-title{ font-size:18px !important; }
  .own-toolbar{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    margin-bottom:10px !important;
    align-items:start !important;
  }
  .own-search-wrap{ grid-column:1 / -1; }
  .own-search-wrap,
  .own-filter{
    min-height:40px !important;
    max-height:40px !important;
    height:40px !important;
    width:100% !important;
  }
  .own-view-toggle{ display:none !important; }
}

/* ===== r87 mobile app chrome: full-screen sheets, tap targets, cards, tables ===== */
@media (max-width: 900px) {
  html.crm-mobile-lock .modal-overlay,
  html.crm-mobile-lock #small-modal.modal-overlay {
    padding: 0 !important;
    align-items: flex-end !important;
    justify-content: stretch !important;
    /* was inset:0 - top must follow --app-vh-top (visualViewport.offsetTop): when iOS pans the
       layout viewport for a focused input, top:0 left the overlay's bottom edge (the footer)
       exactly offsetTop px above the keyboard, with a blank band between. */
    top: var(--app-vh-top, 0px) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    width: 100% !important;
    height: var(--app-vh, 100dvh) !important;
    max-height: var(--app-vh, 100dvh) !important;
    z-index: 300000 !important;
  }
  html.crm-mobile-lock .modal-overlay .modal,
  html.crm-mobile-lock #small-modal .modal {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: min(92dvh, var(--app-vh, 100dvh)) !important;
    min-height: 0 !important;
    margin: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }
  html.crm-mobile-lock #small-modal.crm-form-gold-v2 .modal,
  html.crm-mobile-lock #small-modal.task-modal-gold-v2 .modal,
  html.crm-mobile-lock #small-modal.usr-modal-gold-v2 .modal,
  html.crm-mobile-lock #small-modal.adv-modal-gold-v2 .modal,
  html.crm-mobile-lock #small-modal.rent-modal-gold-v2 .modal,
  html.crm-mobile-lock #small-modal.blueprint-modal-v1 .modal,
  html.crm-mobile-lock #small-modal.ztask-form-modal .modal {
    height: 100% !important;
    max-height: none !important;
    border-radius: 0 !important;
  }
  html.crm-mobile-lock .modal-header {
    flex: 0 0 auto !important;
    position: sticky;
    top: 0;
    z-index: 3;
    min-height: 56px;
    padding: 8px 12px !important;
  }
  html.crm-mobile-lock .modal-close,
  html.crm-mobile-lock #small-modal.crm-form-gold-v2 .modal-close {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }
  html.crm-mobile-lock .modal-body,
  html.crm-mobile-lock #small-modal-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    padding: 14px 14px 18px !important;
  }
  html.crm-mobile-lock .modal-footer,
  html.crm-mobile-lock #small-modal-footer,
  html.crm-mobile-lock #small-modal.crm-form-gold-v2 .modal-footer {
    flex: 0 0 auto !important;
    display: flex !important;
    position: sticky;
    bottom: 0;
    z-index: 4;
    gap: 8px;
    align-items: center;
    min-height: 64px;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  }
  html.crm-mobile-lock .modal-footer:empty,
  html.crm-mobile-lock #small-modal-footer:empty {
    display: none !important;
    min-height: 0 !important;
    padding: 0 !important;
  }
  html.crm-mobile-lock .modal-footer .btn,
  html.crm-mobile-lock #small-modal-footer .btn {
    flex: 1 1 0;
    min-height: 44px !important;
    justify-content: center;
  }
  html.crm-mobile-lock #small-modal-body footer.wide {
    position: sticky;
    bottom: 0;
    z-index: 3;
    display: flex;
    gap: 8px;
    background: var(--card, #171717);
    padding: 10px 0 calc(8px + env(safe-area-inset-bottom, 0px));
  }
  html.crm-mobile-lock #small-modal-body footer.wide button {
    flex: 1 1 0;
    min-height: 44px !important;
  }
  html.crm-mobile-lock .crm-dl-card-contact:empty { display: none !important; }
  html.crm-mobile-lock .ztask-title-cell small button,
  html.crm-mobile-lock .ztask-row button.ztask-start,
  html.crm-mobile-lock .ztask-row a {
    min-height: 36px;
    min-width: 44px;
  }
  html.crm-mobile-lock .deal-wiz-nav {
    position: sticky;
    bottom: 0;
    z-index: 2;
    background: var(--card, #fff);
    padding: 10px 0 6px;
  }
  html.crm-mobile-lock .deal-wiz-nav .btn { min-height: 44px; flex: 1 1 0; }

  html.crm-mobile-lock .form-control,
  html.crm-mobile-lock select.form-control,
  html.crm-mobile-lock textarea.form-control,
  html.crm-mobile-lock input.form-control {
    min-height: 44px;
    font-size: 16px !important;
  }
  html.crm-mobile-lock .btn,
  html.crm-mobile-lock .crm-add-btn,
  html.crm-mobile-lock .ztask-primary,
  html.crm-mobile-lock .prp-new,
  html.crm-mobile-lock .own-btn-add,
  html.crm-mobile-lock .crm-showmore-btn {
    min-height: 44px;
  }
  html.crm-mobile-lock .ztask-primary { min-height: 44px !important; }
  html.crm-mobile-lock .mbn-btn { min-height: 48px; }
  html.crm-mobile-lock #small-modal-body > div > button {
    min-height: 52px;
  }

  html.crm-mobile-lock .prp-title h2 { display: none !important; }
  html.crm-mobile-lock .prp-head {
    margin: 0 0 8px !important;
    padding: 0 !important;
    gap: 6px !important;
  }
  html.crm-mobile-lock .prp-count { font-size: 12px; line-height: 1.35; }
  html.crm-mobile-lock #page-properties .prp-filters,
  html.crm-mobile-lock #page-properties.prp-gold-v2 .prp-filters {
    gap: 6px !important;
    margin-bottom: 8px !important;
  }
  html.crm-mobile-lock #page-properties .prp-select,
  html.crm-mobile-lock #page-properties.prp-gold-v2 .prp-filters .prp-select {
    height: 40px !important;
    min-height: 40px;
    font-size: 13px !important;
  }

  html.crm-mobile-lock .crm-dl-card,
  html.crm-mobile-lock .prp-card,
  html.crm-mobile-lock .dc-panel,
  html.crm-mobile-lock .stat-card,
  html.crm-mobile-lock .own-card,
  html.crm-mobile-lock .notes-card {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  html.crm-mobile-lock #page-dashboard .stats-grid,
  html.crm-mobile-lock #page-dashboard .dash-kpi-grid,
  html.crm-mobile-lock .dc-admin-action-grid {
    grid-template-columns: 1fr !important;
  }

  html.crm-mobile-lock .ztask-table { overflow: visible !important; box-shadow: none !important; border: 0 !important; background: transparent !important; }
  html.crm-mobile-lock .ztask-table-head { display: none !important; }
  html.crm-mobile-lock .ztask-row {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    min-height: 0 !important;
    padding: 12px 14px !important;
    margin: 0 0 10px !important;
    border: 1px solid var(--zt-line, var(--border)) !important;
    border-radius: 14px !important;
    background: var(--card, #fff) !important;
    grid-template-columns: none !important;
  }
  html.crm-mobile-lock .ztask-row > div,
  html.crm-mobile-lock .ztask-row > .ztask-title-cell,
  html.crm-mobile-lock .ztask-row > .ztask-owner,
  html.crm-mobile-lock .ztask-row > .ztask-actions {
    width: 100%;
    min-width: 0;
    padding: 0 !important;
  }
  html.crm-mobile-lock .ztask-title-cell { align-items: flex-start !important; }
  html.crm-mobile-lock .ztask-check { width: 28px; height: 28px; min-width: 28px; }
  html.crm-mobile-lock .ztask-actions {
    display: flex !important;
    justify-content: flex-end;
    gap: 8px;
  }
  html.crm-mobile-lock .ztask-actions button {
    min-width: 44px;
    min-height: 44px;
  }
  html.crm-mobile-lock .crm-ll-wrap,
  html.crm-mobile-lock .at-table-wrap,
  html.crm-mobile-lock .table-scroll {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  html.crm-mobile-lock .lead-modal-overlay {
    padding: 0 !important;
    align-items: stretch !important;
    inset: 0 !important;
    z-index: var(--z-detail-modal, 300000) !important;
  }
  html.crm-mobile-lock .lead-modal-overlay .lm-modal,
  html.crm-mobile-lock .lead-modal-overlay .lead-modal {
    width: 100% !important;
    max-width: none !important;
    height: var(--app-vh, 100dvh) !important;
    max-height: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
  }
}

/* r88 hamburger full-square hit */
@media (max-width: 768px) {
  #menu-toggle {
    position: relative !important;
    z-index: 6 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
    pointer-events: auto !important;
    -webkit-tap-highlight-color: rgba(var(--primary-rgb), 0.22);
  }
  #menu-toggle svg,
  #menu-toggle svg * {
    pointer-events: none !important;
  }
  #menu-toggle::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    z-index: 1;
  }

  #mobile-bottom-nav {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  #mobile-bottom-nav > div {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: space-around !important;
  }
  #mobile-bottom-nav .mbn-btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    min-height: 48px !important;
    height: 100% !important;
    pointer-events: auto !important;
    position: relative !important;
    touch-action: manipulation !important;
    cursor: pointer !important;
  }
  #mobile-bottom-nav .mbn-btn svg,
  #mobile-bottom-nav .mbn-btn svg * {
    pointer-events: none !important;
  }
}
/* Property image verification and creation-date polish. */
.prp-created-date{white-space:nowrap;font-variant-numeric:tabular-nums}
.prp-card-created{display:inline-flex;align-items:center;gap:5px;color:var(--text-muted);white-space:nowrap}
.prp-card-foot{gap:10px;flex-wrap:wrap}
.prp-card-foot .prp-card-deal{margin-inline-start:auto}
.prp-image-verify-overlay{position:fixed;inset:0;z-index:10080;display:grid;place-items:center;padding:18px;background:rgba(9,16,24,.68);opacity:0;transition:opacity .18s ease}
.prp-image-verify-overlay.open{opacity:1}
.prp-image-verify{width:min(760px,100%);max-height:min(860px,calc(100dvh - 36px));overflow:auto;border:1px solid var(--border);border-radius:8px;background:var(--card);color:var(--text);box-shadow:0 28px 90px rgba(0,0,0,.32)}
.prp-image-verify header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 22px 14px;border-bottom:1px solid var(--border)}
.prp-image-verify header span{display:block;margin-bottom:4px;color:var(--gold);font-size:10px;font-weight:800;text-transform:uppercase}
.prp-image-verify h2{margin:0;font-size:22px;letter-spacing:0}
.prp-image-verify header button{width:38px;height:38px;border:0;border-radius:50%;background:var(--surface);color:var(--text);font-size:24px;cursor:pointer}
.prp-image-verify-preview{aspect-ratio:16/9;margin:18px 22px 0;overflow:hidden;border:1px solid var(--border);border-radius:6px;background:#0d1117}
.prp-image-verify-preview img{width:100%;height:100%;display:block;object-fit:contain}
.prp-image-verify-meta{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:1px;margin:16px 22px;background:var(--border);border:1px solid var(--border);border-radius:6px;overflow:hidden}
.prp-image-verify-meta>div{min-width:0;padding:12px;background:var(--card)}
.prp-image-verify-meta small,.prp-image-verify-meta b{display:block}
.prp-image-verify-meta small{margin-bottom:5px;color:var(--text-muted);font-size:10px;text-transform:uppercase}
.prp-image-verify-meta b{overflow:hidden;color:var(--text);font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.prp-image-verify-meta .is-good{color:#159570}.prp-image-verify-meta .is-warn{color:#c98218;white-space:normal}
.prp-image-verify>p{margin:0;padding:0 22px;color:var(--text-muted);font-size:12px;line-height:1.55}
.prp-image-verify footer{display:flex;justify-content:flex-end;gap:10px;padding:18px 22px 22px}
.prp-image-verify footer button{min-height:42px;padding:0 18px;border-radius:6px;font-weight:750;cursor:pointer}
.prp-verify-cancel{border:1px solid var(--border);background:transparent;color:var(--text)}
.prp-verify-use{border:1px solid #757A82;background:#757A82;color:#fff}
@media(max-width:700px){
  .prp-image-verify-overlay{align-items:end;padding:0}
  .prp-image-verify{width:100%;max-height:92dvh;border-width:1px 0 0;border-radius:8px 8px 0 0}
  .prp-image-verify-meta{grid-template-columns:1fr 1fr}
  .prp-image-verify footer{position:sticky;bottom:0;background:var(--card);border-top:1px solid var(--border)}
  .prp-image-verify footer button{flex:1}
}

/* r129: modal actions always clear the mobile navigation. */
@media (max-width: 900px) {
  body:has(.modal-overlay:not(.hidden)) #mobile-bottom-nav,
  body:has(.prp-detail-overlay.open) #mobile-bottom-nav,
  body:has([class$="-overlay"].open) #mobile-bottom-nav { display:none !important; }
  .modal-overlay:not(.hidden), .prp-detail-overlay.open, [class$="-overlay"].open { z-index:300000 !important; }
  .modal-footer, #small-modal-footer, [class$="-modal-footer"] {
    bottom:0 !important;
    padding-bottom:calc(14px + env(safe-area-inset-bottom,0px)) !important;
  }
}
.settings-work-heading{margin-top:22px}
.settings-reminder-toggle{display:flex;align-items:flex-start;gap:12px;margin-top:16px;padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface-muted);cursor:pointer}
.settings-reminder-toggle input{width:20px;height:20px;margin-top:2px;accent-color:var(--primary)}
.settings-reminder-toggle span,.settings-reminder-toggle strong,.settings-reminder-toggle small{display:block}
.settings-reminder-toggle small{margin-top:4px;color:var(--text-muted);line-height:1.45}

/* Kiosk device connection requests in Admin Center. */
.ac-kiosk-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
.ac-kiosk-mode-note{display:flex;align-items:flex-start;gap:12px;margin:0 0 16px;padding:13px 15px;border:1px solid var(--border);border-radius:11px;background:var(--surface-muted)}
.ac-kiosk-mode-note strong{flex:0 0 auto;color:var(--text);font-size:11px}
.ac-kiosk-mode-note span{color:var(--text-muted);font-size:11px;line-height:1.55}
.ac-kiosk-mode-note.open{border-color:#f5c979;background:#fff8e8}
.ac-kiosk-mode-note.open strong{color:#9a5d00}
.ac-kiosk-mode-note.enforced{border-color:#a7e0ce;background:#effbf7}
.ac-kiosk-mode-note.enforced strong{color:#047857}
.ac-kiosk-device{display:grid;gap:3px;max-width:300px;white-space:normal}
.ac-kiosk-device strong{font-size:12px}.ac-kiosk-device small{overflow:hidden;color:var(--text-muted);font-size:9px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}
.ac-kiosk-table code{padding:2px 5px;border-radius:5px;background:var(--surface-muted);font-size:10px}
.ac-kiosk-table .ac-row-actions button.danger{border-color:#fecaca;color:#b91c1c}
@media(max-width:840px){
  .ac-kiosk-head{align-items:flex-start}.ac-kiosk-mode-note{display:grid;gap:5px}
  .ac-kiosk-table td:nth-child(2)::before{content:"Status"!important}
  .ac-kiosk-table td:nth-child(3)::before{content:"Requested"!important}
  .ac-kiosk-table td:nth-child(4)::before{content:"Last seen"!important}
  .ac-kiosk-table td:nth-child(5)::before{content:"Last IP"!important}
  .ac-kiosk-table td:nth-child(6)::before{content:"Location"!important}
  .ac-kiosk-table td:nth-child(7)::before{content:"Actions"!important}
}

/* CRM r113 — task actions stay visible while the form scrolls. */
#small-modal.ztask-form-modal .modal-body{display:flex;flex:1;flex-direction:column;min-height:0;padding:0!important;overflow:hidden}
#small-modal.ztask-form-modal .ztask-form{flex:1;min-height:0;padding:18px;overflow:auto}
#small-modal.ztask-form-modal .ztask-modal-footer{
  display:flex;flex:0 0 auto;justify-content:flex-end;gap:8px;padding:12px 18px;
  border-top:1px solid var(--hairline,var(--border));background:var(--card2);
  box-shadow:0 -10px 24px color-mix(in srgb,var(--shadow,#000) 12%,transparent);
}
#small-modal.ztask-form-modal .ztask-modal-footer button{min-height:40px;padding:0 17px;border-radius:10px;font:800 11px/1 inherit;cursor:pointer}
#small-modal.ztask-form-modal .ztask-modal-footer .secondary{border:1px solid var(--btn-border);background:var(--card);color:var(--text-light)}
#small-modal.ztask-form-modal .ztask-modal-footer .primary{min-width:132px;border:1px solid var(--ok);background:var(--ok);color:#fff}
#small-modal.ztask-form-modal .ztask-modal-footer .primary:disabled{opacity:.6;cursor:wait}

/* CRM r113 — enterprise AI briefing bar for Property Search. */
#page-search .pf-assistant{
  grid-template-columns:minmax(340px,360px) minmax(0,1fr);
  min-height:122px;border-radius:16px;
  box-shadow:0 10px 30px rgba(19, 22, 28,.055);
}
#page-search .asst-head{padding:14px;border-inline-end:1px solid var(--pf-line);background:linear-gradient(145deg,var(--pf-gold-soft),var(--pf-surface))}
#page-search .asst-avatar{width:42px;height:42px;border-radius:13px;box-shadow:0 8px 18px color-mix(in srgb,var(--pf-gold) 24%,transparent)}
#page-search .asst-copy{gap:5px}
#page-search .asst-copy{flex:1}
#page-search .asst-copy>div{display:flex;align-items:center;gap:8px;min-width:0}
#page-search .asst-copy b{font-size:14px;letter-spacing:-.01em;white-space:nowrap}
#page-search .asst-copy>span{max-width:215px;font-size:10.5px;line-height:1.4}
#page-search .asst-ready{display:inline-flex!important;align-items:center;gap:5px;padding:3px 7px;border:1px solid color-mix(in srgb,#10b981 28%,transparent);border-radius:99px;background:color-mix(in srgb,#10b981 10%,transparent);color:#10b981!important;font-size:9px!important;font-weight:800;white-space:nowrap}
#page-search .asst-ready i{width:6px;height:6px;border-radius:50%;background:#10b981;box-shadow:0 0 0 3px color-mix(in srgb,#10b981 14%,transparent)}
#page-search .asst-toggle{align-self:flex-start;min-width:34px;width:34px;padding:0;background:transparent}
#page-search .asst-toggle span{display:none}
#page-search .asst-workspace{display:flex;flex-direction:column;justify-content:center;gap:9px;min-width:0;padding:15px 17px}
#page-search .asst-input{position:relative;display:flex;align-self:stretch;align-items:center;grid-column:auto;width:100%;gap:8px;padding:0;border:0}
#page-search .asst-prompt-icon{position:absolute;z-index:1;inset-inline-start:14px;color:var(--pf-gold);pointer-events:none}
#page-search .asst-input input{height:46px;padding:0 138px 0 42px;border-radius:12px;background:var(--pf-canvas);font-size:13px;box-shadow:inset 0 0 0 1px transparent;transition:.18s}
#page-search .asst-input input:focus{border-color:var(--pf-gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--pf-gold) 13%,transparent)}
#page-search .asst-send{position:absolute;inset-inline-end:5px;top:5px;width:auto;height:36px;padding:0 13px;gap:7px;border-radius:9px;font-size:11px;font-weight:800;font-family:inherit}
#page-search .asst-send span{display:inline}
#page-search .asst-shortcuts{display:flex;align-items:center;gap:6px;min-width:0;overflow-x:auto;scrollbar-width:none}
#page-search .asst-shortcuts::-webkit-scrollbar{display:none}
#page-search .asst-shortcuts>span{color:var(--pf-muted);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
#page-search .asst-shortcuts button{flex:0 0 auto;padding:4px 8px;border:1px solid var(--pf-line);border-radius:99px;background:transparent;color:var(--pf-muted);font:700 9.5px/1.2 inherit;cursor:pointer}
#page-search .asst-shortcuts button:hover{border-color:var(--pf-gold);color:var(--pf-ink);background:var(--pf-gold-soft)}
#page-search .asst-body{grid-column:1/-1;max-height:230px;padding:14px 16px;background:var(--pf-canvas)}
#page-search .srch-table td .pf-stat{position:static!important;inset:auto!important}

/* CRM r113 — actionable approval queue. */
.at-req-card.at-req-awaiting-action{border-color:color-mix(in srgb,var(--neutral-accent) 38%,transparent);box-shadow:inset 3px 0 0 var(--neutral-accent)}
.at-req-card .at-req-main{display:flex;flex:1;flex-direction:column;gap:5px;min-width:0}
.at-req-heading{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.at-req-heading strong{color:var(--text,#ececec);font-size:14px}
.at-req-heading em{padding:2px 7px;border-radius:99px;background:color-mix(in srgb,var(--neutral-accent) 12%,transparent);color:var(--neutral-accent);font-size:9px;font-style:normal;font-weight:800}
.at-req-main>span,.at-req-main>small{color:var(--text-muted,var(--text-secondary));font-size:10.5px}
.at-req-main>p{margin:2px 0;color:var(--text-light,#D4D5DF);font-size:11.5px;line-height:1.55}
.at-req-decision-note{color:var(--text,var(--text))!important}
.at-req-side{display:flex;align-items:flex-end;flex-direction:column;gap:10px;flex:0 0 auto}
.at-req-actions{display:flex;gap:6px}
.at-req-actions button{min-height:34px;padding:0 12px;border-radius:8px;font:800 10.5px/1 inherit;cursor:pointer}
.at-req-approve{border:1px solid var(--accent);background:var(--accent-soft);color:#fff}
.at-req-reject{border:1px solid color-mix(in srgb,#ef4444 50%,transparent);background:color-mix(in srgb,#ef4444 10%,transparent);color:#f87171}
body.light .at-req-card{background:#fff;border-color:var(--border)}
body.light .at-req-heading strong{color:var(--text)}
body.light .at-req-main>p{color:var(--text-secondary)}

/* CRM r113 — command-center dark theme uses one coherent surface system. */
body.dark #page-dashboard.dash-command-center{
  --dc-ink:var(--text);--dc-muted:var(--text-muted);--dc-line:var(--border);--dc-soft:var(--card2);--dc-green:var(--accent);
  color:var(--dc-ink);background:radial-gradient(circle at 96% 2%,rgba(99, 104, 112,.13),transparent 25rem),linear-gradient(180deg,#101012 0,#0c0c0e 100%);
}
body.dark #page-dashboard.dash-command-center #dash-greeting h1,
body.dark #page-dashboard.dash-command-center #dash-greeting-sub strong{color:var(--dc-ink)}
body.dark #page-dashboard.dash-command-center .dc-sub-alert{background:rgba(190,18,60,.17);color:#fda4af}
body.dark #page-dashboard.dash-command-center #dash-assistant-card{border-color:var(--dc-line)!important;background:linear-gradient(135deg,#1b1b1e 0,#171719 66%,#122521 100%)!important;color:var(--dc-ink)!important;box-shadow:0 14px 34px rgba(0,0,0,.22)!important}
body.dark #page-dashboard.dash-command-center #dash-assistant-compose{border-color:#343438!important;background:#121214!important}
body.dark #page-dashboard.dash-command-center #dash-assistant-input{color:var(--dc-ink)!important}
body.dark #page-dashboard.dash-command-center #dash-assistant-toolbar{border-color:#2b2b2d!important;color:var(--dc-muted)}
body.dark #page-dashboard.dash-command-center #dash-assistant-toolbar button:hover{background:#252528;color:#D0D1DB}
body.dark #page-dashboard.dash-command-center #dash-assistant-suggestions button{border-color:#343438!important;background:#171719!important;color:#b8b8bf!important}
body.dark #page-dashboard.dash-command-center .dc-agent-filter select{border-color:#343438!important;background:#171719!important;color:var(--dc-ink)!important}
body.dark #page-dashboard.dash-command-center .dc-scope-badge{border-color:#4A4F57;background:#20252D;color:#BEC3CB}
body.dark #page-dashboard.dash-command-center .dc-status-strip{border-color:#444951;background:#10241f;color:#cbd5d1}
body.dark #page-dashboard.dash-command-center .dc-status-strip.warning{border-color:#654915;background:#2b2110;color:#e6d2a8}
body.dark #page-dashboard.dash-command-center .dc-metric-card,
body.dark #page-dashboard.dash-command-center .dc-panel,
body.dark #page-dashboard.dash-command-center .dc-attention{border-color:var(--dc-line);background:#171719;box-shadow:0 10px 26px rgba(0,0,0,.18)}
body.dark #page-dashboard.dash-command-center .dc-metric-card:hover{border-color:#62676F;box-shadow:0 12px 30px rgba(0,0,0,.3)}
body.dark #page-dashboard.dash-command-center .dc-panel-head{border-color:#2a2a2d}
body.dark #page-dashboard.dash-command-center .dc-panel-head>button{border-color:#343438;background:#202023;color:#c4c4ca}
body.dark #page-dashboard.dash-command-center .dc-donut:after{background:#171719;box-shadow:inset 0 0 0 1px #2b2b2d}
body.dark #page-dashboard.dash-command-center .dc-chart-legend>div,
body.dark #page-dashboard.dash-command-center .dc-source-name{color:#c4c4ca}
body.dark #page-dashboard.dash-command-center .dc-range-toggle{background:#101012}
body.dark #page-dashboard.dash-command-center .dc-range-toggle button{color:#8f8f98}
body.dark #page-dashboard.dash-command-center .dc-range-toggle button.active{background:#29292d;color:#BEC3CB;box-shadow:none}
body.dark #page-dashboard.dash-command-center .dc-source-bar,
body.dark #page-dashboard.dash-command-center .dc-score:before{background:#29292d}
body.dark #page-dashboard.dash-command-center .dc-team-row{border-color:#29292d;background:#171719;color:#D4D5DF}
body.dark #page-dashboard.dash-command-center .dc-team-row:not(.dc-team-header):hover{background:#1d2624}
body.dark #page-dashboard.dash-command-center .dc-avatar{background:#282D35;color:#BFC4CC}
body.dark #page-dashboard.dash-command-center .dc-task-list button,
body.dark #page-dashboard.dash-command-center .dc-focus-list button{border-color:#29292d;color:#D4D5DF}
body.dark #page-dashboard.dash-command-center .dc-task-list em,
body.dark #page-dashboard.dash-command-center .dc-focus-list em{background:#29292d;color:#a1a1aa}
body.dark #page-dashboard.dash-command-center .dc-focus-icon{background:#132c27;color:#B9BEC6}
body.dark #page-dashboard.dash-command-center .dc-attention button{border-color:#343438;background:#1c1c1f}
body.dark #page-dashboard.dash-command-center .dc-attention button span{color:#c4c4ca}
body.dark #page-dashboard.dash-command-center .dc-empty{color:#85858f}
body.dark .dc-admin-dialog{border-color:#343438;background:#171719;color:var(--dc-ink)}
body.dark .dc-admin-dialog>header,
body.dark .dc-admin-dialog>footer{border-color:#2b2b2d;background:#171719}

@media(max-width:768px){
  #page-search .pf-assistant{min-height:0}
  #page-search .asst-head{border-inline-end:0}
  #page-search .asst-workspace{padding:13px}
  #page-search .asst-input input{padding-inline-end:52px}
  #page-search .asst-send{width:36px;padding:0;justify-content:center}
  #page-search .asst-send span{display:none}
  #page-search .asst-shortcuts{padding-bottom:2px}
  .at-req-card{align-items:stretch!important;flex-direction:column}
  .at-req-side{align-items:flex-start}
  #small-modal.ztask-form-modal .ztask-modal-footer button{flex:1}
}

/* Enterprise property publishing — one deliberate form replaces browser prompts. */
#small-modal.property-publish-modal-v1{
  --ppm-accent:#636870;
  --ppm-accent-soft:rgba(99, 104, 112,.09);
  --ppm-accent-line:rgba(99, 104, 112,.25);
  --ppm-ink:var(--text,#18211f);
  --ppm-muted:var(--text-muted,#64706d);
  --ppm-panel:var(--card,#fff);
  --ppm-soft:var(--surface-muted,#f6f8f7);
  --ppm-line:var(--border,#e3e8e6);
  background:rgba(8,18,17,.58);
  backdrop-filter:blur(12px);
}
body.dark #small-modal.property-publish-modal-v1{
  --ppm-accent:#B0B5BD;
  --ppm-accent-soft:rgba(176, 181, 189,.1);
  --ppm-accent-line:rgba(176, 181, 189,.25);
  --ppm-ink:#eef4f2;
  --ppm-muted:#9ba9a5;
  --ppm-panel:#191b1b;
  --ppm-soft:#202322;
  --ppm-line:#303534;
  background:rgba(0,0,0,.72);
}
#small-modal.property-publish-modal-v1 .modal{
  width:min(780px,calc(100vw - 32px))!important;
  max-width:780px!important;
  max-height:min(92vh,900px);
  overflow:hidden;
  border:1px solid var(--ppm-line);
  border-radius:20px;
  background:var(--ppm-panel);
  box-shadow:0 30px 90px rgba(4,16,14,.28);
}
#small-modal.property-publish-modal-v1 .modal-header{
  min-height:66px;
  padding:17px 24px;
  border-color:var(--ppm-line);
  background:var(--ppm-panel);
}
#small-modal.property-publish-modal-v1 .modal-title{
  color:var(--ppm-ink);
  font-size:15px;
  font-weight:780;
  letter-spacing:-.01em;
}
#small-modal.property-publish-modal-v1 .modal-close{
  width:34px;
  height:34px;
  border:1px solid var(--ppm-line);
  border-radius:10px;
  color:var(--ppm-muted);
}
#small-modal.property-publish-modal-v1 .modal-close:hover{background:var(--ppm-soft);color:var(--ppm-ink)}
#small-modal.property-publish-modal-v1 .modal-body{padding:0;background:var(--ppm-panel)}
#small-modal.property-publish-modal-v1 .modal-footer{
  align-items:center;
  min-height:76px;
  padding:14px 24px;
  border-color:var(--ppm-line);
  background:var(--ppm-panel);
}
.ppm-shell{color:var(--ppm-ink)}
.ppm-hero{
  display:grid;
  grid-template-columns:54px minmax(0,1fr) auto;
  align-items:center;
  gap:15px;
  padding:22px 24px;
  border-bottom:1px solid var(--ppm-line);
  background:linear-gradient(135deg,var(--ppm-accent-soft),transparent 64%);
}
.ppm-logo{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border:1px solid var(--ppm-accent-line);
  border-radius:16px;
  background:var(--ppm-panel);
  color:var(--ppm-accent);
  font-size:14px;
  font-weight:850;
  letter-spacing:-.03em;
  box-shadow:0 8px 24px rgba(45, 50, 58,.08);
}
.ppm-logo.is-bayut{background:#e7f7ed;color:#118448;border-color:#bde7cb}
.ppm-logo.is-pf{background:#EDEEF8;color:#6d45a8;border-color:#ded0f6}
.ppm-logo.is-website{background:#e7f5f2;color:var(--text-secondary);border-color:#DADBE5}
body.dark .ppm-logo.is-bayut{background:#173025;color:#78dda0;border-color:#28563a}
body.dark .ppm-logo.is-pf{background:#292234;color:#c4a8ed;border-color:#493b60}
body.dark .ppm-logo.is-website{background:#17302d;color:#C0C5CD;border-color:#464B53}
.ppm-eyebrow{display:block;margin-bottom:4px;color:var(--ppm-accent);font-size:10px;font-weight:850;letter-spacing:.13em}
.ppm-hero h3{margin:0;color:var(--ppm-ink);font-size:18px;font-weight:820;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ppm-hero p{margin:5px 0 0;color:var(--ppm-muted);font-size:12px;line-height:1.45}
.ppm-state{
  max-width:150px;
  padding:7px 10px;
  border:1px solid var(--ppm-line);
  border-radius:999px;
  color:var(--ppm-muted);
  background:var(--ppm-panel);
  font-size:10px;
  font-weight:780;
  line-height:1.2;
  text-align:center;
}
.ppm-state.is-live{border-color:var(--ppm-accent-line);background:var(--ppm-accent-soft);color:var(--ppm-accent)}
.ppm-section{padding:20px 24px;border-bottom:1px solid var(--ppm-line)}
.ppm-section.is-summary{border-bottom:0;background:var(--ppm-soft)}
.ppm-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}
.ppm-section-head>div{display:flex;align-items:center;gap:9px}
.ppm-section-head h4{margin:0;color:var(--ppm-ink);font-size:13px;font-weight:800}
.ppm-section-head>small{max-width:310px;color:var(--ppm-muted);font-size:10px;line-height:1.45;text-align:end}
.ppm-step{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;background:var(--ppm-accent-soft);color:var(--ppm-accent);font-size:9px;font-weight:850}
.ppm-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ppm-mode-card{position:relative;display:flex;align-items:flex-start;gap:10px;min-height:72px;padding:13px 14px;border:1px solid var(--ppm-line);border-radius:13px;background:var(--ppm-panel);cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}
.ppm-mode-card:hover{border-color:var(--ppm-accent-line);background:var(--ppm-accent-soft)}
.ppm-mode-card:has(input:checked){border-color:var(--ppm-accent);background:var(--ppm-accent-soft);box-shadow:0 0 0 2px var(--ppm-accent-soft)}
.ppm-mode-card input{width:16px;height:16px;margin:2px 0 0;accent-color:var(--ppm-accent);flex:0 0 auto}
.ppm-mode-card span{display:flex;flex-direction:column;gap:4px}
.ppm-mode-card b{color:var(--ppm-ink);font-size:12px;font-weight:780}
.ppm-mode-card small{color:var(--ppm-muted);font-size:10px;line-height:1.4}
.ppm-fields-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ppm-field{position:relative;margin-top:12px}
.ppm-fields-grid .ppm-field{margin-top:0}
.ppm-field[hidden]{display:none!important}
.ppm-field label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px;color:var(--ppm-ink);font-size:11px;font-weight:760}
.ppm-field label span{color:var(--ppm-muted);font-size:9px;font-weight:600;text-align:end}
.ppm-input{
  display:block;
  width:100%;
  height:43px;
  padding:0 12px;
  border:1px solid var(--ppm-line)!important;
  border-radius:10px!important;
  outline:0;
  background:var(--ppm-panel)!important;
  color:var(--ppm-ink)!important;
  font:500 12px/1.2 inherit;
  direction:ltr;
  text-align:left;
  transition:border-color .15s,box-shadow .15s;
}
.ppm-input:focus{border-color:var(--ppm-accent)!important;box-shadow:0 0 0 3px var(--ppm-accent-soft)!important}
.ppm-input::placeholder{color:var(--ppm-muted);opacity:.68}
.ppm-field>small{display:block;margin-top:6px;color:var(--ppm-muted);font-size:9px;line-height:1.4}
.ppm-location-combobox{position:relative}
.ppm-location-combobox .ppm-input{padding-right:36px;background-image:linear-gradient(45deg,transparent 50%,var(--ppm-muted) 50%),linear-gradient(135deg,var(--ppm-muted) 50%,transparent 50%);background-position:calc(100% - 17px) 18px,calc(100% - 12px) 18px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.ppm-location-results{position:absolute;z-index:35;top:calc(100% + 6px);left:0;right:0;max-height:248px;overflow:auto;padding:5px;border:1px solid var(--ppm-line);border-radius:12px;background:var(--ppm-panel);box-shadow:0 18px 45px rgba(7,30,26,.2)}
.ppm-location-option{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:10px 11px;border:0;border-bottom:1px solid var(--ppm-line);border-radius:8px;background:transparent;color:var(--ppm-ink);text-align:start;cursor:pointer}
.ppm-location-option:last-child{border-bottom:0}.ppm-location-option:hover,.ppm-location-option:focus{outline:0;background:var(--ppm-accent-soft)}
.ppm-location-option>span{display:flex;min-width:0;flex-direction:column;gap:3px}.ppm-location-option b{font-size:11px;font-weight:780}.ppm-location-option small{max-width:340px;color:var(--ppm-muted);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ppm-location-option em{flex:0 0 auto;padding:4px 7px;border-radius:7px;background:var(--ppm-soft);color:var(--ppm-accent);font-size:9px;font-style:normal;font-weight:750}
.ppm-location-message{padding:14px;color:var(--ppm-muted);font-size:10px;line-height:1.45;text-align:center}.ppm-location-message.is-error{color:#c24130}.ppm-location-message.is-loading{display:flex;align-items:center;justify-content:center;gap:8px}.ppm-location-message.is-loading span{width:12px;height:12px;border:2px solid var(--ppm-accent-line);border-top-color:var(--ppm-accent);border-radius:50%;animation:ppm-spin .7s linear infinite}
.ppm-location-selected{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:7px;padding:9px 10px;border:1px solid var(--ppm-accent-line);border-radius:10px;background:var(--ppm-accent-soft)}
.ppm-location-selected[hidden]{display:none!important}.ppm-location-selected>span{display:flex;min-width:0;flex-direction:column;gap:2px}.ppm-location-selected b{color:var(--ppm-ink);font-size:10px}.ppm-location-selected small{color:var(--ppm-accent);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ppm-location-selected button{display:grid;place-items:center;width:24px;height:24px;border:0;border-radius:8px;background:var(--ppm-panel);color:var(--ppm-muted);font-size:16px;cursor:pointer}
.ppm-existing-link{position:absolute;right:8px;top:35px;padding:5px 8px;border-radius:7px;background:var(--ppm-soft);color:var(--ppm-accent);font-size:9px;font-weight:700;text-decoration:none}
.ppm-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.ppm-shell[data-portal="website"] .ppm-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr));padding:20px 24px}
.ppm-check{display:flex;align-items:center;gap:9px;min-height:56px;padding:10px;border:1px solid var(--ppm-line);border-radius:11px;background:var(--ppm-panel)}
.ppm-check-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;flex:0 0 auto;font-size:11px;font-weight:850}
.ppm-check.is-ready .ppm-check-icon{background:var(--ppm-accent-soft);color:var(--ppm-accent)}
.ppm-check.is-missing .ppm-check-icon{background:rgba(194,65,48,.1);color:#c24130}
.ppm-check>span:last-child{display:flex;min-width:0;flex-direction:column;gap:3px}
.ppm-check b{color:var(--ppm-ink);font-size:10px;font-weight:760}
.ppm-check small{color:var(--ppm-muted);font-size:9px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ppm-operation{display:flex;align-items:center;justify-content:space-between;margin:20px 24px 0;padding:14px 16px;border:1px solid var(--ppm-accent-line);border-radius:12px;background:var(--ppm-accent-soft)}
.ppm-operation span{color:var(--ppm-muted);font-size:11px}.ppm-operation strong{color:var(--ppm-accent);font-size:12px}
.ppm-media-section{position:relative;background:var(--ppm-panel)}
.ppm-media-section .ppm-section-head>small b{color:var(--ppm-accent);font-weight:780}
.ppm-media-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}.ppm-media-toolbar>span{color:var(--ppm-muted);font-size:9px;line-height:1.45}
.ppm-media-add{display:inline-flex;align-items:center;justify-content:center;min-width:102px;height:34px;padding:0 12px;border:1px solid var(--ppm-accent-line);border-radius:9px;background:var(--ppm-accent-soft);color:var(--ppm-accent);font-size:10px;font-weight:780;cursor:pointer;white-space:nowrap}.ppm-media-add:hover{border-color:var(--ppm-accent);filter:brightness(1.02)}.ppm-media-add:has(input:disabled){opacity:.55;cursor:wait}
.ppm-media-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;max-height:230px;overflow:auto;padding:1px 2px 3px}
.ppm-media-card{position:relative;min-width:0;margin:0;border:1px solid var(--ppm-line);border-radius:11px;background:var(--ppm-soft);overflow:hidden}
.ppm-media-preview{position:relative;display:block;width:100%;height:82px;padding:0;border:0;background:var(--ppm-soft);cursor:zoom-in;overflow:hidden}.ppm-media-preview img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .2s}.ppm-media-preview:hover img{transform:scale(1.045)}
.ppm-media-zoom{position:absolute;right:6px;bottom:6px;display:grid;place-items:center;width:22px;height:22px;border:1px solid rgba(255,255,255,.3);border-radius:7px;background:rgba(8,18,16,.66);color:#fff;font-size:13px;opacity:0;transition:opacity .15s}.ppm-media-preview:hover .ppm-media-zoom{opacity:1}
.ppm-media-card figcaption{display:flex;min-width:0;flex-direction:column;gap:1px;padding:7px 8px}.ppm-media-card figcaption span{color:var(--ppm-ink);font-size:9px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ppm-media-card figcaption small{color:var(--ppm-muted);font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ppm-media-delete{position:absolute;top:6px;left:6px;display:grid;place-items:center;width:23px;height:23px;padding:0;border:1px solid rgba(255,255,255,.28);border-radius:7px;background:rgba(116,28,20,.82);color:#fff;font:600 16px/1 inherit;cursor:pointer;opacity:0;transition:opacity .15s}.ppm-media-card:hover .ppm-media-delete,.ppm-media-delete:focus{opacity:1}
.ppm-media-empty{grid-column:1/-1;display:flex;min-height:92px;align-items:center;justify-content:center;flex-direction:column;gap:5px;border:1px dashed var(--ppm-line);border-radius:11px;color:var(--ppm-muted)}.ppm-media-empty b{color:var(--ppm-ink);font-size:11px}.ppm-media-empty span{font-size:9px}
.ppm-media-error{margin-top:9px;padding:8px 10px;border-radius:8px;background:rgba(194,65,48,.08);color:#b23a2a;font-size:9px;line-height:1.4}
.ppm-media-progress{position:absolute;z-index:5;inset:0;display:flex;align-items:center;justify-content:center;gap:9px;border-radius:0;background:color-mix(in srgb,var(--ppm-panel) 84%,transparent);backdrop-filter:blur(3px);color:var(--ppm-ink)}.ppm-media-progress[hidden]{display:none!important}.ppm-media-progress span{width:18px;height:18px;border:2px solid var(--ppm-accent-line);border-top-color:var(--ppm-accent);border-radius:50%;animation:ppm-spin .7s linear infinite}.ppm-media-progress b{font-size:11px}.ppm-media-section.is-busy{min-height:150px}
.ppm-error{margin:14px 24px 20px;padding:11px 13px;border:1px solid rgba(194,65,48,.28);border-radius:10px;background:rgba(194,65,48,.08);color:#b23a2a;font-size:11px;font-weight:650;line-height:1.5}
body.dark .ppm-error{color:#ff9a8c}
.ppm-footer-note{display:flex;align-items:center;gap:9px;margin-right:auto;color:var(--ppm-muted)}
.ppm-footer-note>span:last-child{display:flex;flex-direction:column;gap:2px}.ppm-footer-note b{color:var(--ppm-ink);font-size:10px}.ppm-footer-note small{font-size:9px}
.ppm-lock{display:grid;place-items:center;width:27px;height:27px;border-radius:9px;background:var(--ppm-accent-soft);color:var(--ppm-accent);font-size:11px;font-weight:850}
#small-modal.property-publish-modal-v1 .btn{min-height:40px;border-radius:10px;padding:0 16px;font-size:11px;font-weight:750}
#small-modal.property-publish-modal-v1 .btn-ghost{border:1px solid var(--ppm-line);background:var(--ppm-panel);color:var(--ppm-ink)}
#small-modal.property-publish-modal-v1 .btn-primary{border:1px solid var(--ppm-accent);background:var(--ppm-accent);color:#fff;box-shadow:none}
body.dark #small-modal.property-publish-modal-v1 .btn-primary{color:#0b2622}
.ppm-submit{display:inline-flex;align-items:center;gap:8px;justify-content:center;min-width:148px}
.ppm-submit:disabled,#ppm-cancel:disabled{opacity:.65;cursor:wait}
.ppm-spinner{display:none;width:13px;height:13px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:ppm-spin .7s linear infinite}
.ppm-submit.is-loading .ppm-spinner{display:inline-block}
@keyframes ppm-spin{to{transform:rotate(360deg)}}

@media(max-width:680px){
  #small-modal.property-publish-modal-v1{padding:0!important;align-items:flex-end!important}
  #small-modal.property-publish-modal-v1 .modal{width:100%!important;max-width:none!important;max-height:96vh!important;border-radius:20px 20px 0 0!important}
  #small-modal.property-publish-modal-v1 .modal-header,.ppm-hero,.ppm-section,#small-modal.property-publish-modal-v1 .modal-footer{padding-left:16px;padding-right:16px}
  .ppm-hero{grid-template-columns:46px minmax(0,1fr)}
  .ppm-logo{width:44px;height:44px;border-radius:13px}
  .ppm-state{grid-column:2;justify-self:start;margin-top:-5px}
  .ppm-section-head{display:block}.ppm-section-head>small{display:block;margin:6px 0 0 36px;text-align:start}
  .ppm-mode-grid,.ppm-fields-grid,.ppm-summary-grid,.ppm-shell[data-portal="website"] .ppm-summary-grid{grid-template-columns:1fr}
  .ppm-media-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:280px}.ppm-media-toolbar{align-items:flex-start;flex-direction:column}.ppm-media-add{width:100%}
  .ppm-shell[data-portal="website"] .ppm-summary-grid{padding:16px}
  .ppm-footer-note{display:none}
  #small-modal.property-publish-modal-v1 .modal-footer .btn{flex:1}
}

/* property-gallery-draft-r118 */
.prp-field-actions,.prp-gallery-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.prp-field-actions{flex-shrink:0}
.prp-field-card.has-draft{border-color:color-mix(in srgb,var(--primary,#797E86) 52%,var(--lm-border,var(--border)));box-shadow:0 0 0 2px color-mix(in srgb,var(--primary,#797E86) 8%,transparent)}
.prp-change-summary{display:inline-flex;align-items:center;gap:7px;margin-top:10px;padding:7px 10px;border:1px solid color-mix(in srgb,var(--primary,#797E86) 30%,var(--lm-border,var(--border)));border-radius:10px;background:color-mix(in srgb,var(--primary,#797E86) 7%,var(--lm-card,#fff));color:var(--lm-muted,#6b7280);font-size:11px;font-weight:650}
.prp-change-summary b,.prp-change-summary strong{color:var(--primary,#797E86);font-weight:850}.prp-change-summary span{opacity:.55}
.prp-clear-field,.prp-delete-all,.prp-discard-gallery,.prp-apply-gallery{appearance:none;border-radius:10px;min-height:36px;padding:0 12px;font:750 11px/1.2 inherit;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.prp-clear-field,.prp-delete-all{border:1px solid color-mix(in srgb,#dc3545 44%,var(--lm-border,var(--border)));background:color-mix(in srgb,#dc3545 8%,var(--lm-card,#fff));color:#b42332}
.prp-delete-all{min-height:38px;padding:0 14px}
.prp-discard-gallery{border:1px solid var(--lm-border,#E3E4EE);background:var(--lm-card,#fff);color:var(--lm-muted,#5f6975)}
.prp-apply-gallery{min-height:38px;border:1px solid var(--primary,#797E86);background:var(--primary,#797E86);color:#fff;box-shadow:0 6px 18px color-mix(in srgb,var(--primary,#797E86) 24%,transparent)}
.prp-clear-field:hover,.prp-clear-field:focus-visible{background:color-mix(in srgb,#dc3545 14%,var(--lm-card,#fff));border-color:#dc3545}
.prp-delete-all:hover,.prp-delete-all:focus-visible{background:color-mix(in srgb,#dc3545 16%,var(--lm-card,#fff));border-color:#dc3545}
.prp-discard-gallery:hover,.prp-discard-gallery:focus-visible{border-color:var(--lm-muted,#7b8490);background:color-mix(in srgb,var(--lm-muted,#7b8490) 7%,var(--lm-card,#fff))}
.prp-apply-gallery:hover,.prp-apply-gallery:focus-visible{filter:brightness(.92)}
.prp-clear-field:focus-visible,.prp-delete-all:focus-visible,.prp-discard-gallery:focus-visible,.prp-apply-gallery:focus-visible{outline:3px solid color-mix(in srgb,var(--primary,#797E86) 25%,transparent);outline-offset:2px}
.prp-clear-field:active,.prp-delete-all:active,.prp-discard-gallery:active,.prp-apply-gallery:active{transform:translateY(1px)}
.prp-clear-field:disabled,.prp-delete-all:disabled,.prp-discard-gallery:disabled,.prp-apply-gallery:disabled{opacity:.55;cursor:wait;transform:none}
.prp-thumb.is-pending-add{border-color:color-mix(in srgb,var(--primary,#797E86) 58%,#fff);box-shadow:0 0 0 2px color-mix(in srgb,var(--primary,#797E86) 10%,transparent)}
.prp-thumb.is-pending-remove{border-style:dashed;border-color:#d67b85;background:color-mix(in srgb,#dc3545 7%,var(--lm-card,#fff))}
.prp-thumb.is-pending-remove .prp-thumb-preview img{filter:grayscale(.72);opacity:.44}
.prp-thumb-state{position:absolute;z-index:4;left:6px;top:6px;padding:4px 7px;border-radius:8px;color:#fff;font-size:9px;font-weight:850;line-height:1;box-shadow:0 2px 8px rgba(0,0,0,.16);pointer-events:none}
.prp-thumb-state.is-add{background:var(--primary,#797E86)}.prp-thumb-state.is-remove{background:#b42332}
.prp-thumb-del.is-undo{background:#8b6722;font-size:15px}
body.dark .prp-apply-gallery{color:#071f1a}
@media(max-width:640px){.prp-gallery-head{align-items:stretch;flex-direction:column}.prp-gallery-head-actions{justify-content:flex-start}.prp-field-head{align-items:stretch;flex-direction:column}.prp-field-actions{justify-content:space-between}.prp-change-summary{display:flex;flex-wrap:wrap}.prp-apply-gallery{flex:1}}
.ppm-result{display:flex;flex-direction:column;align-items:center;gap:12px;padding:22px 24px 6px;text-align:center}
.ppm-result-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;flex:0 0 auto}
.ppm-result-success .ppm-result-icon{background:var(--ppm-accent-soft);color:var(--ppm-accent)}
.ppm-result-warning .ppm-result-icon{background:rgba(191,144,15,.12);color:#bf900f}
.ppm-result-error .ppm-result-icon{background:rgba(194,65,48,.1);color:#c24130}
.ppm-result-icon svg{width:26px;height:26px}
.ppm-result h4{margin:0;font-size:15px;font-weight:800;color:var(--ppm-ink)}
.ppm-result-error-message{width:100%;padding:10px 12px;border:1px solid rgba(194,65,48,.28);border-radius:10px;background:rgba(194,65,48,.08);color:#b23a2a;font-size:11.5px;font-weight:600;line-height:1.5;text-align:end}
body.dark .ppm-result-error-message{color:#ff9a8c}
.ppm-result-grid{display:flex;flex-direction:column;gap:6px;width:100%;padding:12px;border:1px solid var(--ppm-line);border-radius:11px;background:var(--ppm-panel)}
.ppm-result-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11.5px}
.ppm-result-row span{color:var(--ppm-muted)}
.ppm-result-row b{color:var(--ppm-ink);font-weight:750}
.ppm-result-warnings{width:100%;text-align:end;padding:10px 12px;border:1px solid rgba(191,144,15,.3);border-radius:10px;background:rgba(191,144,15,.08);font-size:11px;color:#8a6a0b}
body.dark .ppm-result-warnings{color:#e8c66a}
.ppm-result-warnings b{display:block;margin-bottom:4px;font-size:11px}
.ppm-result-warnings ul{margin:0;padding-inline-start:18px}
.ppm-tech-details{width:100%;text-align:end}
.ppm-tech-details summary{cursor:pointer;font-size:11px;font-weight:700;color:var(--ppm-muted);padding:6px 0}
.ppm-tech-details pre{margin:6px 0 0;padding:10px;border-radius:9px;background:var(--ppm-panel-strong,rgba(0,0,0,.04));border:1px solid var(--ppm-line);font-size:10px;line-height:1.5;text-align:left;direction:ltr;white-space:pre-wrap;word-break:break-word;max-height:240px;overflow:auto}
body.dark .ppm-tech-details pre{background:rgba(255,255,255,.04)}
.ppm-result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;width:100%;padding:6px 0 4px}
@media(max-width:640px){.ppm-result{padding:18px 16px 4px}.ppm-result-icon{width:44px;height:44px}.ppm-result-icon svg{width:22px;height:22px}}

/* ============================================================================
   iOS input auto-zoom prevention  (appended last so it wins on specificity/order)
   ----------------------------------------------------------------------------
   Mobile Safari zooms the page whenever a focused text control has a computed
   font-size below 16px. The existing mobile rules set 12-14.5px on inputs (e.g.
   `input,select,textarea{font-size:14px!important}` in the max-width:768px block),
   which is what produced the zoom-on-focus. 16px is the threshold, not a design
   choice - the controls keep their existing height/padding so the visual design is
   unchanged; only the text metric moves.

   Deliberately covers the INNER inputs of custom controls too (combobox / searchable
   dropdown / tag input / chat / note composer), because fixing only native inputs is
   the usual way this bug survives.
   ============================================================================ */
@media (max-width: 768px) {
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea,
  .form-control,
  [contenteditable="true"],
  .search-bar input,
  .search-bar select,
  .tag-input-wrap input,
  .chat-input,
  .note-composer-textarea,
  #tc-chat-wrap input,
  #tc-chat-wrap textarea,
  #dash-assistant-input,
  .prp-combobox input,
  .combobox-search input,
  [role="combobox"] input,
  [data-combobox] input {
    font-size: 16px !important;
  }
}

/* Scoped, not global: removes the 300ms double-tap-zoom delay on interactive
   controls without touching normal page scrolling or pinch-zoom on content.
   `touch-action: none` is intentionally NOT used anywhere here. */
@media (max-width: 768px) {
  button, .btn, .prp-record-tab, .lm-iconbtn, #mobile-bottom-nav a, #mobile-bottom-nav button {
    touch-action: manipulation;
  }
}

/* ============================================================================
   Property Contact combobox + nested Add-Contact layer (.pfc-*)
   Uses existing theme tokens (var(--card), var(--border), var(--text)) so Light
   and Dark both work. The nested layer stacks by DOM order inside the top-level
   host; its z-index only needs to clear the property modal overlay family.
   ============================================================================ */
.pfc-combo{position:relative;width:100%}
.pfc-row{display:flex;gap:8px;align-items:center}
.pfc-input{flex:1;min-width:0}
.pfc-add{white-space:nowrap;flex-shrink:0}
.pfc-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:min(260px,40dvh);overflow-y:auto;
  background:var(--card,#fff);border:1.5px solid var(--border,#E1E2EC);border-radius:12px;
  box-shadow:0 12px 32px rgba(0,0,0,.18);z-index:20}
.pfc-opt{display:block;width:100%;text-align:start;padding:11px 14px;background:none;border:0;
  border-bottom:1px solid var(--border,var(--border));color:var(--text,#1C1F25);font-size:14px;cursor:pointer}
.pfc-opt:last-child{border-bottom:0}
.pfc-opt:hover,.pfc-opt:focus{background:var(--hover,rgba(var(--primary-rgb),.08))}
.pfc-empty{padding:12px 14px;color:var(--text-muted,var(--text-secondary));font-size:13px}
.pfc-hint{display:block;margin-top:4px;color:var(--text-muted,var(--text-secondary));font-size:12px}

/* nested Add-Contact layer: fixed viewport-bound card, safe-area aware, keyboard-stable height */
.pfc-layer{position:fixed;inset:0;background:rgba(19, 22, 28,.55);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
  padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px));z-index:1500}
.pfc-layer-card{background:var(--card,#fff);color:var(--text,#1C1F25);width:min(100%,440px);
  max-height:min(88dvh,640px);display:flex;flex-direction:column;border-radius:18px;
  border:1px solid var(--border,#E1E2EC);box-shadow:0 24px 60px rgba(0,0,0,.28)}
.pfc-layer-head{display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;border-bottom:1px solid var(--border,var(--border));flex-shrink:0}
.pfc-layer-head h3{margin:0;font-size:16px}
.pfc-layer-x{background:none;border:0;font-size:22px;line-height:1;color:var(--text-muted,var(--text-secondary));
  cursor:pointer;padding:4px 8px;min-width:44px;min-height:36px}
.pfc-layer-body{padding:14px 18px;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:6px}
.pfc-layer-body .form-label{margin-top:6px}
.pfc-layer-foot{display:flex;justify-content:flex-end;gap:10px;padding:12px 18px;
  border-top:1px solid var(--border,var(--border));flex-shrink:0}
@media (max-width:768px){
  .pfc-layer{align-items:flex-end;padding:0}
  .pfc-layer-card{width:100%;border-radius:18px 18px 0 0;
    max-height:calc(92dvh - env(safe-area-inset-bottom,0px))}
}

/* ============================================================================
   Real-viewport modal sizing (mobile) — fixes the iPhone keyboard jump.
   ----------------------------------------------------------------------------
   Root cause on iOS Safari: the keyboard does not shrink the LAYOUT viewport;
   fixed elements and vh/dvh keep full-screen metrics while Safari PANS the page
   (visualViewport.offsetTop). The overlay therefore slid off-screen and the
   modal stayed centered/max-height'd against a height that no longer matched
   what the user could see -> footer floating high above a blank band.

   Fix: on mobile the overlay is pinned to the REAL visible viewport, using
   --app-visible-height / --app-visible-offset maintained by the shared
   VisualViewport engine in app.js (rAF-throttled). Fallback when visualViewport
   is unsupported: 100dvh / offset 0 - identical to previous behavior.
   The modal itself is a column (header / scrollable body / footer already
   separate flex children), so the footer sits at the bottom of the VISIBLE
   area, immediately above the keyboard, and only the body scrolls.
   Desktop (>768px) is untouched.
   ============================================================================ */
@media (max-width: 768px) {
  /* Overlay/modal sizing is owned by the r87 crm-mobile-lock rules (higher specificity), which
     now track --app-vh/--app-vh-top. This block keeps only what r87 does not cover. */
  .modal-body{
    /* the ONLY scrolling region; header+footer are fixed flex siblings */
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  body.modal-open{
    /* NO touch-action:none here - touch-action composes down the ancestor chain, so it would
       also disable finger-scrolling inside the modal body. overflow:hidden plus the overlay's
       offset tracking is the correct lock. */
    overflow: hidden !important;
  }
  body.modal-open #app{
    /* belt-and-braces: background content cannot scroll while a modal is open */
    overflow: hidden;
  }
  /* Nested Add-Contact layer: same real-viewport treatment (it previously used
     its own bottom-sheet sizing against dvh, which has the same iOS blind spot). */
  .pfc-layer{
    top: var(--app-vh-top, 0px) !important;
    bottom: auto !important;
    height: var(--app-vh, 100dvh) !important;
    align-items: center !important;
    padding: 10px 14px !important;
  }
  .pfc-layer-card{
    max-height: 100% !important;
    border-radius: 18px !important;
    width: 100% !important;
  }
}

/* ============================================================================
   Global mobile keyboard/viewport coverage for the NON-.modal-overlay modal
   families. The r87 crm-mobile-lock rules already cover every .modal-overlay
   (small-modal, confirm, todo-detail) plus #lead-modal; this block extends the
   same --app-vh / --app-vh-top mechanism (shared VisualViewport engine, rAF-
   throttled, resize+scroll) to the remaining fixed overlays, so all forms get:
   overlay pinned to the ACTUAL visible viewport, footer above the keyboard,
   internal body as the only scroller. Fallbacks equal the previous behavior
   when visualViewport is unsupported.
   ============================================================================ */
@media (max-width: 900px) {
  html.crm-mobile-lock .at-modal-overlay,
  html.crm-mobile-lock .own-modal-backdrop,
  html.crm-mobile-lock .txn-modal-backdrop,
  html.crm-mobile-lock .kpi-modal-backdrop,
  html.crm-mobile-lock .kpi-hist-overlay,
  html.crm-mobile-lock .hrp-overlay,
  html.crm-mobile-lock .lead-modal-overlay,
  html.crm-mobile-lock .first-login-profile-overlay,
  html.crm-mobile-lock .prp-image-verify-overlay,
  html.crm-mobile-lock .dc-admin-modal {
    top: var(--app-vh-top, 0px) !important;
    bottom: auto !important;
    height: var(--app-vh, 100dvh) !important;
    max-height: var(--app-vh, 100dvh) !important;
  }
  /* the inner sheets/cards of those families must fit the visible overlay and
     scroll internally rather than growing past the keyboard */
  html.crm-mobile-lock .at-modal-box,
  html.crm-mobile-lock .own-modal,
  html.crm-mobile-lock .txn-modal-card,
  html.crm-mobile-lock .kpi-modal-card,
  html.crm-mobile-lock .hrp-card,
  html.crm-mobile-lock .dc-admin-modal-body {
    max-height: 100% !important;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  html.crm-mobile-lock .at-modal-body,
  html.crm-mobile-lock .own-modal-body,
  html.crm-mobile-lock .txn-modal-body,
  html.crm-mobile-lock .lm-body {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    min-height: 0;
    flex: 1 1 auto;
  }
}

/* ============================================================================
   Notes action buttons — complete the state matrix in BOTH themes.
   Everything is token-based (--danger, --gold, --border, --text*) so Light and
   Dark each resolve their own palette; no single-theme hardcodes. Previously
   these five button classes had zero focus/active/disabled styling.
   ============================================================================ */
.notes-action-btn:focus-visible,
.notes-save-btn:focus-visible,
.notes-cancel-btn:focus-visible,
.nc-tool-btn:focus-visible,
.gnote-item-del:focus-visible{
  outline:2px solid var(--gold,var(--neutral-accent));
  outline-offset:2px;
}
.notes-action-btn:active,
.notes-cancel-btn:active,
.nc-tool-btn:active{ background:var(--border-light); }
.notes-save-btn:active{ opacity:.78; }
.notes-action-btn:disabled,
.notes-save-btn:disabled,
.notes-cancel-btn:disabled,
.nc-tool-btn:disabled{
  opacity:.45; cursor:not-allowed; pointer-events:none;
}
/* destructive icon buttons keep readable idle contrast in dark mode too */
body.dark .gnote-item-del{ opacity:.65; }

/* ============================================================================
   Bottom navigation — proper Light/Dark state matrix.
   Previous state: inactive buttons had NO color (UA buttontext -> near-black
   even on the dark card), and active used the gray accent (#9CA3AF), which in
   Light mode was FAINTER than the inactive black - inverted emphasis. All
   token-based; each theme resolves its own values. Appended last so it wins
   the earlier equal-specificity body.light/.dark accent rules.
   ============================================================================ */
.mbn-btn{ color:var(--text-muted) !important; }
.mbn-btn svg{ stroke:var(--text-muted) !important; }
body.light .mbn-btn.active,
body.dark .mbn-btn.active{
  color:var(--text) !important;
  background:var(--border-light) !important;
}
body.light .mbn-btn.active svg,
body.dark .mbn-btn.active svg{ stroke:var(--text) !important; }
.mbn-btn.active span{ font-weight:800; }
.mbn-btn:active{ background:var(--border-light) !important; }
.mbn-btn:focus-visible{ outline:2px solid var(--gold,var(--neutral-accent)); outline-offset:-2px; }
/* badge already uses var(--danger) + white text - correct in both themes */

/* Mobile modal close button: guaranteed 44x44 touch target (was ~28px), both themes. */
@media (max-width: 900px) {
  html.crm-mobile-lock .modal-close{
    min-width: 44px; min-height: 44px;
    display: flex; align-items: center; justify-content: center;
  }
}

/* ============================================================================
   Contact form footers vs iOS home-indicator / Android gesture bar.
   The own-form modal and the Property "Add Contact" child layer fill the whole
   visual viewport on mobile (crm-mobile-lock), which puts their Save/Cancel row
   flush against the device safe area - on real phones the buttons sit in the
   home-indicator zone and read as "covered by the bottom bar". Pad the footers
   by the safe-area inset (single source: this is the ONLY place the inset is
   added inside these modals, so it is never counted twice). When the keyboard
   is open the card ends above the keyboard, where the extra padding is inert.
   ============================================================================ */
@media (max-width: 900px) {
  .own-modal-ftr {
    padding-bottom: calc(13px + env(safe-area-inset-bottom, 0px));
  }
  .pfc-layer-foot {
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  }
}

/* ==================== Deal Workflow workspace + Viewed/Unseen badges ==================== */
.dwf-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.dwf-stage{background:var(--track,rgba(0,0,0,.06));color:var(--text);font-size:11px;font-weight:800;
  padding:3px 10px;border-radius:99px;letter-spacing:.4px}
.dwf-stage.is-done{background:color-mix(in srgb, var(--success,var(--accent-soft)) 18%, transparent);color:var(--success,var(--accent-text))}
.dwf-stage.is-warn{background:color-mix(in srgb, var(--danger,var(--danger-light)) 14%, transparent);color:var(--danger,var(--danger))}
.dwf-meta,.dwf-counts{font-size:11.5px;color:var(--text-muted)}
.dwf-tabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--border-light,var(--border));
  margin-bottom:12px;padding-bottom:8px}
.dwf-tab{background:none;border:1px solid var(--border);border-radius:99px;padding:6px 12px;font-size:12px;
  font-weight:700;color:var(--text-light);cursor:pointer;font-family:inherit;min-height:34px}
.dwf-tab.on{background:var(--text);color:var(--card);border-color:var(--text)}
.dwf-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.dwf-prop{border:1px solid var(--border-light,var(--border));border-radius:12px;padding:12px;margin-bottom:10px}
.dwf-prop.is-selected{border-color:var(--gold,#b08d3e);box-shadow:0 0 0 1px var(--gold,#b08d3e)}
.dwf-prop-head{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;margin-bottom:8px}
.dwf-flags i{font-style:normal;font-size:10px;font-weight:800;background:var(--track,rgba(0,0,0,.06));
  padding:2px 7px;border-radius:99px;margin-inline-start:4px;color:var(--text-light)}
.dwf-ok{color:var(--success,var(--accent-text))!important}
.dwf-missing{font-size:12px;font-weight:700;color:var(--danger,var(--danger))}
.dwf-missing.dwf-ok{color:var(--success,var(--accent-text))}
.dwf-doc-row{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--border-light,var(--border));flex-wrap:wrap}
.dwf-doc-name{flex:1;min-width:180px;font-size:12.5px}
.dwf-doc-status{font-size:10px;font-weight:800;padding:2px 8px;border-radius:99px;background:var(--track,rgba(0,0,0,.06));color:var(--text-light)}
.dwf-doc-status.is-approved,.dwf-doc-status.is-uploaded{background:color-mix(in srgb, var(--success,var(--accent-soft)) 16%, transparent);color:var(--success,var(--accent-text))}
.dwf-doc-status.is-missing,.dwf-doc-status.is-rejected,.dwf-doc-status.is-expired{background:color-mix(in srgb, var(--danger,var(--danger-light)) 12%, transparent);color:var(--danger,var(--danger))}
.dwf-aml{margin-top:14px;padding-top:10px;border-top:1px solid var(--border-light,var(--border))}
.dwf-aml-note{font-size:12px;color:var(--danger,var(--danger));margin-top:4px}
.dwf-pdfs{margin-bottom:10px}
.dwf-pdf-row{display:flex;align-items:center;gap:8px;justify-content:space-between;font-size:12px;
  padding:6px 0;border-bottom:1px dashed var(--border-light,var(--border));flex-wrap:wrap}
.dwf-booking-done{padding:14px;border:1px solid var(--border);border-radius:12px;font-size:13px;display:grid;gap:4px}
.btn-xs{padding:5px 10px!important;font-size:11.5px!important;min-height:32px}
.dwf-badge{font-size:9.5px;font-weight:800;padding:1px 6px;border-radius:99px;vertical-align:2px}
.dwf-badge-new{background:color-mix(in srgb, var(--gold,#b08d3e) 20%, transparent);color:var(--gold,#8a6d2f)}
.dwf-badge-viewed{background:var(--track,rgba(0,0,0,.06));color:var(--text-muted)}
.dwf-badge-unseen-btn{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:11px;padding:0 2px}
.dwf-viewchips{display:flex;gap:6px;margin:0 0 10px;flex-wrap:wrap}
.dwf-chip{background:none;border:1px solid var(--border);border-radius:99px;padding:4px 11px;font-size:11.5px;
  font-weight:700;color:var(--text-light);cursor:pointer;font-family:inherit;min-height:30px}
.dwf-chip.on{background:var(--text);color:var(--card);border-color:var(--text)}
@media (max-width:900px){
  .dwf-doc-name{min-width:120px}
  .dwf-actions .btn{flex:1 1 auto}
}

/* Contact child layers must sit ABOVE the parent modal: the mobile rule gives every open
   .modal-overlay z-index:300000!important, which silently buried the z-1500 child layer under
   its own parent (Add Contact inside Property/Deal forms). Toasts (z 2147483000) stay on top. */
.pfc-layer{z-index:300001!important}
.pfc-input-row{display:flex;gap:8px;align-items:stretch}
.pfc-input-row .pfc-input{flex:1;min-width:0}

/* ==================== Deal Workflow UX refactor: gated stepper + shell ==================== */
.dwf-stepper{display:flex;align-items:stretch;gap:0;margin:0 0 14px;overflow-x:auto;
  border-bottom:1px solid var(--border-light,var(--border));padding-bottom:10px;
  position:sticky;top:0;background:var(--card);z-index:5}
.dwf-step{display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;
  font-family:inherit;padding:6px 8px;border-radius:10px;min-height:44px;text-align:start;flex-shrink:0}
.dwf-step__badge{display:grid;place-items:center;width:26px;height:26px;border-radius:99px;
  border:2px solid var(--border);color:var(--text-light);font-size:12px;font-weight:800;flex-shrink:0}
.dwf-step__copy{display:flex;flex-direction:column;line-height:1.15}
.dwf-step__copy b{font-size:12px;color:var(--text-light)}
.dwf-step__copy small{font-size:10px;color:var(--text-muted);max-width:150px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.dwf-step.is-done .dwf-step__badge{border-color:var(--success,var(--accent));color:var(--success,var(--accent-text));
  background:color-mix(in srgb, var(--success,var(--accent-soft)) 12%, transparent)}
.dwf-step.is-done .dwf-step__copy b{color:var(--text)}
.dwf-step.is-current{background:color-mix(in srgb, var(--gold,#b08d3e) 10%, transparent)}
.dwf-step.is-current .dwf-step__badge{border-color:var(--gold,#b08d3e);color:var(--gold,#8a6d2f)}
.dwf-step.is-current .dwf-step__copy b{color:var(--text)}
.dwf-step.is-locked{opacity:.45;cursor:not-allowed}
.dwf-step.is-blocked .dwf-step__badge{border-color:var(--danger,var(--danger));color:var(--danger,var(--danger))}
.dwf-step.is-blocked .dwf-step__copy small{color:var(--danger,var(--danger))}
.dwf-step:focus-visible{outline:2px solid var(--gold,#b08d3e);outline-offset:2px}
.dwf-step__connector{align-self:center;width:18px;height:2px;background:var(--border);flex-shrink:0}
.dwf-body{min-height:280px;overscroll-behavior:contain}
.dwf-footer-hint{font-size:11.5px;color:var(--text-muted);margin-inline-end:auto;align-self:center}
.dwf-fieldset{border:1px solid var(--border-light,var(--border));border-radius:12px;
  padding:12px 14px;margin:0 0 12px;min-width:0}
.dwf-fieldset legend,.dwf-fieldset summary{font-size:12px;font-weight:800;color:var(--text-light);
  padding:0 6px;cursor:default}
.dwf-collapse summary{cursor:pointer;padding:2px 0}
.dwf-error-summary{background:color-mix(in srgb, var(--danger,var(--danger-light)) 10%, transparent);
  color:var(--danger,var(--danger));font-size:12.5px;padding:10px 12px;border-radius:10px;margin-bottom:10px}
.form-control.is-invalid{border-color:var(--danger,var(--danger))!important}
.dwf-prop-summary{font-size:12px;color:var(--text-light);margin-bottom:8px}
/* r214: Properties stage — Property Selection / Other Items sub-tabs + selectable property cards */
.dwf-subtabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px;border-bottom:1px solid var(--border-light,var(--border));padding-bottom:8px}
.dwf-subtab{background:none;border:1px solid var(--border);border-radius:99px;padding:6px 14px;font-size:12.5px;font-weight:800;color:var(--text-light);cursor:pointer;font-family:inherit;min-height:36px}
.dwf-subtab.on{background:var(--text);color:var(--card);border-color:var(--text)}
.dwf-sel-title{font-size:16px;font-weight:800;margin:2px 0 12px;color:var(--text)}
.dwf-selection{display:grid;gap:10px;min-width:0}
.dwf-selcard{display:grid;grid-template-columns:auto 72px minmax(0,1fr);gap:12px;align-items:center;border:1px solid var(--border-light,var(--border));border-radius:12px;padding:10px 12px;cursor:pointer;background:var(--card);min-width:0;margin:0}
.dwf-selcard:hover{border-color:var(--text-muted)}
.dwf-selcard.is-on{border-color:var(--gold,#b08d3e);box-shadow:0 0 0 1px var(--gold,#b08d3e);background:color-mix(in srgb, var(--gold,#b08d3e) 6%, var(--card))}
.dwf-selcard input[type=radio]{width:18px;height:18px;margin:0;accent-color:var(--gold,#b08d3e);flex-shrink:0;cursor:pointer}
.dwf-selcard-thumb{width:72px;height:56px;border-radius:8px;object-fit:cover;background:var(--track,rgba(0,0,0,.06));display:block;border:1px solid var(--border-light,var(--border))}
.dwf-selcard-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.dwf-selcard-title{font-size:13.5px;color:var(--text);overflow:hidden;text-overflow:ellipsis}
.dwf-selcard-line{font-size:11.5px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dwf-selcard-price{font-size:12.5px;color:var(--gold,#8a6d2f);margin-top:2px}
.dwf-sel-empty{padding:18px 12px}
#small-modal-footer #dwf-selcontinue{white-space:nowrap}
@media (max-width:900px){
  .dwf-selcard{grid-template-columns:auto 60px minmax(0,1fr);gap:10px;padding:10px}
  .dwf-selcard-thumb{width:60px;height:48px}
  .dwf-sel-title{font-size:15px}
  #small-modal-footer #dwf-selcontinue{flex:1 1 auto}
  #small-modal-footer #dwf-selhint{flex-basis:100%;margin-inline-end:0}
}
/* r215: Documents & AML — header, KYC facts, grouped conditional checklist */
.dwf-docs-head{margin:0 0 12px;padding:10px 12px;border:1px solid var(--border-light,var(--border));border-radius:12px;background:var(--surface-muted,var(--card))}
.dwf-docs-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px}
.dwf-mode-badge{font-size:10.5px;font-weight:800;padding:2px 9px;border-radius:99px;letter-spacing:.3px;background:var(--track,rgba(0,0,0,.06));color:var(--text-light)}
.dwf-mode-badge.is-offplan{background:color-mix(in srgb, var(--accent-soft) 16%, transparent);color:#1d4ed8}
.dwf-mode-badge.is-ready{background:color-mix(in srgb, var(--success,var(--accent-soft)) 16%, transparent);color:var(--success,var(--accent-text))}
.dwf-mode-badge.is-unknown{background:color-mix(in srgb, var(--danger,var(--danger-light)) 12%, transparent);color:var(--danger,var(--danger))}
.dwf-docs-sub{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:4px;font-size:12.5px;color:var(--text-light)}
.dwf-docs-count{font-weight:800;color:var(--text)}
.dwf-kyc{border:1px solid var(--border-light,var(--border));border-radius:12px;padding:10px 12px;margin-bottom:12px}
.dwf-kyc .form-group{margin-bottom:8px}
.dwf-req-star{color:var(--danger,var(--danger));display:none}
.form-group.is-required .dwf-req-star{display:inline}
.dwf-group{margin:0 0 12px}
.dwf-group-title{display:flex;align-items:baseline;gap:8px;font-size:13px;font-weight:800;margin:6px 0 2px;color:var(--text)}
.dwf-group-title small{font-weight:700;color:var(--text-muted);font-size:11.5px}
.dwf-doc-name{display:flex;flex-direction:column;gap:1px;min-width:0}
.dwf-doc-name b{font-size:12.5px;font-weight:700}
.dwf-doc-req{font-size:10.5px;color:var(--text-muted)}
.dwf-doc-req.is-req{color:var(--gold,#8a6d2f);font-weight:800}
.dwf-doc-file{font-size:11px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px}
.dwf-doc-status.is-accepted{background:color-mix(in srgb, var(--success,var(--accent-soft)) 16%, transparent);color:var(--success,var(--accent-text))}
.dwf-doc-status.is-needs_replacement{background:color-mix(in srgb, #d97706 16%, transparent);color:#b45309}
.dwf-doc-status.is-pending,.dwf-doc-status.is-more_info_required{background:color-mix(in srgb, #d97706 16%, transparent);color:#b45309}
.dwf-doc-row.is-missing.is-required .dwf-doc-name b{color:var(--text)}
.dwf-upload-btn.is-disabled{opacity:.5;pointer-events:none}
.dwf-bad{color:var(--danger,var(--danger));font-weight:800}
#small-modal-footer #dwf-docs-hint{max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:900px){
  .dwf-doc-row{gap:6px}
  .dwf-doc-file{max-width:160px}
  #small-modal-footer #dwf-docs-hint{flex-basis:100%;max-width:100%;white-space:normal;margin-inline-end:0}
  #small-modal-footer #dwf-docs-continue,#small-modal-footer #dwf-docs-submit,#small-modal-footer #dwf-docs-recheck,#small-modal-footer #dwf-docs-next{flex:1 1 auto}
}
.dwf-advanced{margin-top:10px;font-size:12px;color:var(--text-muted)}
.dwf-basics-summary .lm-kv-row{display:flex;justify-content:space-between;gap:10px;padding:7px 0;
  border-bottom:1px dashed var(--border-light,var(--border));font-size:13px}

/* selection action bar + deal context bar (Property Search) */
.pf-deal-context.is-sticky{position:sticky;top:0;z-index:6}
.srch-selbar{position:sticky;top:0;z-index:7;display:flex;align-items:center;gap:10px;
  justify-content:space-between;flex-wrap:wrap;background:var(--card);border:1px solid var(--gold,#b08d3e);
  border-radius:12px;padding:9px 12px;margin-bottom:10px;font-size:12.5px;
  box-shadow:0 6px 18px rgba(0,0,0,.10)}
.srch-selbar-actions{display:flex;gap:8px;flex-wrap:wrap}
.pdl-none{font-size:11px;color:var(--text-muted)}
.pdl-chip{display:inline-block;font-size:10.5px;font-weight:700;background:var(--track,rgba(0,0,0,.06));
  color:var(--text-light);border-radius:99px;padding:2px 9px;cursor:pointer;max-width:170px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
.pdl-chip.is-ctx{background:color-mix(in srgb, var(--gold,#b08d3e) 18%, transparent);color:var(--gold,#8a6d2f)}
.pdl-ctx-note{display:block;font-size:10px;color:var(--gold,#8a6d2f);font-weight:700}
.pdl-popover{position:fixed;z-index:300005;background:var(--card);color:var(--text);
  border:1px solid var(--border);border-radius:12px;box-shadow:0 18px 48px rgba(0,0,0,.25);
  padding:10px 12px;max-height:320px;overflow:auto}
.pdl-pop-head{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;margin-bottom:6px}
.pdl-pop-head button{background:none;border:none;font-size:16px;cursor:pointer;color:var(--text-muted);
  min-width:32px;min-height:32px}
.pdl-pop-row{padding:7px 0;border-top:1px dashed var(--border-light,var(--border));font-size:12px;
  display:flex;flex-direction:column;gap:2px}
.pdl-pop-row.is-restricted{color:var(--text-muted);font-style:italic}
.lm-more-wrap{position:relative;display:inline-block}
.lm-more-menu{position:absolute;top:100%;inset-inline-end:0;background:var(--card);
  border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.18);
  padding:6px;z-index:20;min-width:130px}
.lm-more-menu button{display:block;width:100%;background:none;border:none;font-family:inherit;
  padding:9px 10px;font-size:12.5px;color:var(--danger,var(--danger));cursor:pointer;text-align:start;
  border-radius:8px}
.lm-more-menu button:hover{background:var(--track,rgba(0,0,0,.06))}
.crm-dl-selprop{display:block;font-size:10.5px;color:var(--gold,#8a6d2f);margin-top:2px}
.crm-dl-card-wf{display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin-top:8px;padding-top:8px;border-top:1px dashed var(--border-light,var(--border));font-size:11.5px;
  color:var(--text-light)}

/* mobile workflow shell: full height, vertical accordion stepper, sticky footer */
@media (max-width: 900px){
  .dwf-stepper{flex-direction:column;gap:2px;position:static;max-height:none;overflow:visible;
    padding-bottom:6px}
  .dwf-step__connector{display:none}
  .dwf-step{width:100%;min-height:48px}
  .dwf-step__copy small{max-width:none;white-space:normal}
  .dwf-step:not(.is-active):not(.is-current) .dwf-step__copy small{display:none}
  .srch-selbar{position:fixed;left:8px;right:8px;top:auto;
    bottom:calc(76px + env(safe-area-inset-bottom,0px));margin:0}
}
@media (min-width: 901px){
  #small-modal.crm-form-gold-v2 .modal{max-width:1100px}
}

/* Holiday Home module (VPS-native port of the Zoho HH widget) */
#page-holiday-homes .form-row{display:grid;gap:12px;margin-bottom:10px}
#page-holiday-homes .form-row.cols-2{grid-template-columns:1fr 1fr}
#page-holiday-homes .form-field{display:flex;flex-direction:column;gap:4px;min-width:0}
#page-holiday-homes .form-field .form-input{width:100%}
#page-holiday-homes .form-label{font-size:11.5px;font-weight:700;color:var(--text-muted)}
#page-holiday-homes textarea.form-input{resize:vertical}
@media (max-width:768px){ #page-holiday-homes .form-row.cols-2{grid-template-columns:1fr} }

/* ============================================================================
   Mobile card design system — Daily Media + Holiday Home ONLY (CRM).
   Scoped strictly to #page-daily-media and #page-holiday-homes so no other CRM
   module's spacing changes, and the public website is untouched entirely.
   One coherent pattern: same border, radius, padding, heading, badges, targets.
   ============================================================================ */
:root{
  --dmhh-card-radius:14px;
  --dmhh-card-pad:13px;
  --dmhh-gap:10px;
  --dmhh-touch:44px;
}
#page-daily-media .dmhh-card,
#page-holiday-homes .dmhh-card{
  border:1px solid var(--border-light,var(--border));
  border-radius:var(--dmhh-card-radius);
  padding:var(--dmhh-card-pad);
  background:var(--bg-card,transparent);
  display:flex;flex-direction:column;gap:7px;
  min-width:0;overflow-wrap:anywhere;
}
#page-daily-media .dmhh-card-head,
#page-holiday-homes .dmhh-card-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:8px;flex-wrap:wrap;
}
#page-daily-media .dmhh-title,
#page-holiday-homes .dmhh-title{font-size:13.5px;font-weight:800;line-height:1.35;min-width:0}
#page-daily-media .dmhh-sub,
#page-holiday-homes .dmhh-sub{font-size:11.5px;color:var(--text-muted)}
#page-daily-media .dmhh-meta,
#page-holiday-homes .dmhh-meta{
  display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;
}
#page-daily-media .dmhh-meta b,
#page-holiday-homes .dmhh-meta b{font-weight:800}
#page-daily-media .dmhh-badges,
#page-holiday-homes .dmhh-badges{display:flex;flex-wrap:wrap;gap:5px}
#page-daily-media .dmhh-actions,
#page-holiday-homes .dmhh-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
#page-daily-media .dmhh-actions .btn,
#page-holiday-homes .dmhh-actions .btn{min-height:38px;display:inline-flex;align-items:center}

/* Mobile: business record lists become cards; tables are hidden (not h-scrolled) */
@media (max-width:760px){
  #page-daily-media .dmhh-desktop-only,
  #page-holiday-homes .dmhh-desktop-only{display:none !important}
  #page-daily-media .dmhh-cards,
  #page-holiday-homes .dmhh-cards{display:grid;grid-template-columns:1fr;gap:var(--dmhh-gap)}
  /* touch targets */
  #page-daily-media .dmhh-actions .btn,
  #page-holiday-homes .dmhh-actions .btn,
  #page-daily-media .btn-xs,
  #page-holiday-homes .btn-xs{min-height:var(--dmhh-touch);padding-left:14px;padding-right:14px}
  /* nothing in these two modules may push the document sideways */
  #page-daily-media,#page-holiday-homes{overflow-x:hidden}
  #page-daily-media *,#page-holiday-homes *{max-width:100%}
  #page-daily-media img,#page-holiday-homes img{height:auto}
  /* horizontally scrollable section tab strip (Holiday Home has 9 sections) */
  #page-holiday-homes .dmhh-tabstrip{
    display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;padding-bottom:4px;margin-bottom:10px;
  }
  #page-holiday-homes .dmhh-tabstrip::-webkit-scrollbar{display:none}
  #page-holiday-homes .dmhh-tabstrip .btn{flex:0 0 auto;min-height:40px}
  /* right rail becomes stacked accordion sections, not an endless column */
  #page-holiday-homes .dmhh-rail-acc summary{
    cursor:pointer;font-size:13px;font-weight:800;padding:11px 2px;list-style:none;
    display:flex;justify-content:space-between;align-items:center;
  }
  #page-holiday-homes .dmhh-rail-acc summary::-webkit-details-marker{display:none}
  #page-holiday-homes .dmhh-rail-acc[open] summary{border-bottom:1px solid var(--border-light,var(--border));margin-bottom:9px}
  /* calendar keeps its matrix, but scrolling stays INSIDE the component */
  #page-holiday-homes .dmhh-cal-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
  #page-holiday-homes .dmhh-cal-scroll > *{min-width:302px}
  /* modals fit 320-430px */
  #hh-media-modal > div,#hh-pf-modal > div{max-height:92vh;padding:14px !important}
}
@media (min-width:761px){
  #page-daily-media .dmhh-cards,
  #page-holiday-homes .dmhh-cards{display:none}
}

/* Self-profile: password card grid + mobile stacking (scoped to the profile surfaces) */
.selfpass-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:760px){
  .selfpass-grid{grid-template-columns:1fr}
  #page-profile .settings-pro-shell,#page-profile .settings-pro-main{padding-left:10px;padding-right:10px}
  #page-profile .settings-profile-hero{flex-direction:column;align-items:flex-start;gap:10px}
  #page-profile .settings-card-actions .settings-save-btn,
  #page-profile .settings-telegram-card .settings-save-btn{min-height:44px;width:100%;justify-content:center}
  #page-profile .settings-input{min-height:44px}
  #page-profile{overflow-x:hidden}
}

/* ============================================================================
   Data module (2026-08-24) — desktop table + mobile CARD system.
   Deliberately a SEPARATE block rather than adding #page-data to the
   Daily Media / Holiday Home selector lists, so no existing module's rules
   change. Reuses the same --dmhh-* tokens for one coherent look.
   ============================================================================ */
#page-data .dmhh-card{
  border:1px solid var(--border-light,var(--border));
  border-radius:var(--dmhh-card-radius);
  padding:var(--dmhh-card-pad);
  background:var(--card);
  display:flex;flex-direction:column;gap:7px;
  min-width:0;overflow-wrap:anywhere;
}
#page-data .dmhh-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;flex-wrap:wrap}
#page-data .dmhh-title{font-size:13.5px;font-weight:800;line-height:1.35;min-width:0}
#page-data .dmhh-sub{font-size:11.5px;color:var(--text-muted)}
#page-data .dmhh-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px}
#page-data .dmhh-meta b{font-weight:800}
#page-data .dmhh-badges{display:flex;flex-wrap:wrap;gap:5px}
#page-data .dmhh-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
/* default OFF so a fractional viewport (760.5px) can never show table AND cards together */
#page-data .dmhh-cards{display:none}
#page-data .dmhh-actions .btn{min-height:38px;display:inline-flex;align-items:center}

/* Blueprint / contact-status pills. Colours mirror the Zoho picklist colours. */
#page-data .dt-pill{
  display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;
  font-size:11px;font-weight:700;line-height:1.6;white-space:nowrap;
  border:1px solid var(--border-light,var(--border));background:var(--track,rgba(0,0,0,.05));
}
#page-data .dt-pill i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 auto}
#page-data .dt-pill.is-none{color:#6b7280}
#page-data .dt-pill.is-owner{color:#a07800}
#page-data .dt-pill.is-fulfill{color:#9b3fb5}
#page-data .dt-pill.is-convertible{color:#1c8f20}
#page-data .dt-pill.is-notuseful{color:#c53434}
#page-data .dt-pill.is-new{color:#6b7280}
#page-data .dt-pill.is-contacted{color:#1c7f8f}

/* Desktop toolbar */
#page-data .dt-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
/* .form-input has no global rule in this stylesheet - the Data module styles its own controls */
#page-data .form-input,
#page-data select.form-input,
#page-data input.form-input,
#page-data textarea.form-input{
  min-height:38px;background:var(--card);color:var(--text);
  border:1px solid var(--border);border-radius:10px;padding:8px 12px;
  font-family:inherit;font-size:12.5px;box-sizing:border-box;
}
#page-data textarea.form-input{resize:vertical;min-height:74px}
#page-data .form-input:focus{outline:none;border-color:var(--ok,var(--primary))}
#page-data .dt-field{display:flex;flex-direction:column;gap:4px;min-width:0}
#page-data .dt-field label{font-size:11.5px;font-weight:700;color:var(--text-muted)}
#page-data .dt-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:760px){ #page-data .dt-grid{grid-template-columns:1fr} }
#small-modal .form-input{
  width:100%;min-height:38px;background:var(--card);color:var(--text);
  border:1px solid var(--border);border-radius:10px;padding:8px 12px;
  font-family:inherit;font-size:12.5px;box-sizing:border-box;
}
#small-modal textarea.form-input{resize:vertical;min-height:74px}
#small-modal .dt-field{display:flex;flex-direction:column;gap:4px;min-width:0;margin-bottom:10px}
#small-modal .dt-field label{font-size:11.5px;font-weight:700;color:var(--text-muted)}
#small-modal .dt-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:760px){ #small-modal .dt-grid{grid-template-columns:1fr} }
#page-data .dt-search{position:relative;flex:1 1 240px;min-width:0}
#page-data .dt-search input{width:100%;padding-left:32px}
#page-data .dt-search-ic{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none;display:flex}
#page-data .dt-pager{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
#page-data .dt-count{font-size:12px;color:var(--text-muted)}
#page-data .dt-empty{
  padding:34px 16px;text-align:center;color:var(--text-muted);font-size:13px;
  border:1px dashed var(--border-light,var(--border));border-radius:var(--dmhh-card-radius);
}
#page-data .dt-table{width:100%;border-collapse:collapse}
#page-data .dt-table th{
  text-align:start;font-size:11.5px;font-weight:800;color:var(--text-muted);
  padding:9px 10px;border-bottom:1px solid var(--border-light,var(--border));white-space:nowrap;
}
#page-data .dt-table th.sortable{cursor:pointer;user-select:none}
#page-data .dt-table th.sortable:hover{color:var(--text)}
#page-data .dt-table td{padding:10px;border-bottom:1px solid var(--border-light,var(--border));font-size:13px;vertical-align:middle}
#page-data .dt-table tbody tr:hover{background:var(--track,rgba(0,0,0,.03))}
#page-data .dt-wrap{overflow-x:auto;max-width:100%}

/* Import wizard + detail sheet */
#page-data .dt-step{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
#page-data .dt-step span{
  font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;
  background:var(--track,rgba(0,0,0,.06));color:var(--text-muted);
}
#page-data .dt-step span.on{background:var(--primary,var(--primary));color:#fff}
#small-modal.dt-modal-wide .modal{max-width:920px !important;width:min(920px,97vw) !important}
#small-modal.dt-modal-wide .dt-maprow{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:center;margin-bottom:7px}
#small-modal.dt-modal-wide .dt-step{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
#small-modal.dt-modal-wide .dt-step span{font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--track,rgba(0,0,0,.06));color:var(--text-muted)}
#small-modal.dt-modal-wide .dt-step span.on{background:var(--ok,var(--primary));color:#fff}
#small-modal .dt-actlist{display:flex;flex-direction:column;gap:8px;max-height:340px;overflow:auto}
#small-modal .dt-act{border-left:3px solid var(--border);padding:6px 0 6px 10px;font-size:12.5px}
#small-modal .dt-act.is-contact{border-left-color:#1c7f8f}
#small-modal .dt-act.is-status{border-left-color:#9b3fb5}
#small-modal .dt-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;border:1px solid var(--border-light,var(--border));background:var(--track,rgba(0,0,0,.05))}
#small-modal .dt-pill i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 auto}
#small-modal .dt-pill.is-none,#small-modal .dt-pill.is-new{color:#6b7280}
#small-modal .dt-pill.is-owner{color:#a07800}
#small-modal .dt-pill.is-fulfill{color:#9b3fb5}
#small-modal .dt-pill.is-convertible{color:#1c8f20}
#small-modal .dt-pill.is-notuseful{color:#c53434}
#small-modal .dt-pill.is-contacted{color:#1c7f8f}
#page-data .dt-maprow{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:center;margin-bottom:7px}
#page-data .dt-actlist{display:flex;flex-direction:column;gap:8px;max-height:340px;overflow:auto}
#page-data .dt-act{border-left:3px solid var(--border);padding:6px 0 6px 10px;font-size:12.5px}
#page-data .dt-act.is-contact{border-left-color:#1c7f8f}
#page-data .dt-act.is-status{border-left-color:#9b3fb5}

/* Mobile: cards replace the table entirely — the table is HIDDEN, never h-scrolled */
@media (max-width:760px){
  #page-data .dmhh-desktop-only{display:none !important}
  #page-data .dmhh-cards{display:grid;grid-template-columns:1fr;gap:var(--dmhh-gap)}
  #page-data .dmhh-actions .btn,#page-data .btn-xs{min-height:var(--dmhh-touch);padding-left:14px;padding-right:14px}
  #page-data{overflow-x:hidden}
  #page-data *{max-width:100%}
  #page-data .dt-bar{gap:7px}
  #page-data .dt-search{flex:1 1 100%}
  #page-data .dt-pager{justify-content:space-between}
  #small-modal.dt-modal-wide .dt-maprow{grid-template-columns:1fr;gap:4px}
}
@media (min-width:761px){
  #page-data .dt-mobile-only{display:none}
}

/* ============================================================================
   r171 — shared mobile overlay layer (Dashboard modal audit, 24 Aug 2026)

   The r129 block keys nav-suppression and z-index escalation off
   `[class$="-overlay"].open`. Two real overlays match neither half of that:
   `.dc-admin-modal` (class does not end in "-overlay") and `.lead-modal-overlay`
   (toggled via style.display, never gets `.open`). They therefore kept their
   base z-index and left #mobile-bottom-nav painted underneath them, and their
   footers got none of the safe-area padding `.modal-footer` receives.

   Rather than patch individual buttons, every mobile overlay family is listed
   once here and put on the same ladder as `.modal-overlay` (300000), below
   `.pfc-layer` (300001).
   ============================================================================ */
@media (max-width: 900px) {
  /* one rung for every overlay family */
  .dc-admin-modal:not([hidden]),
  .lead-modal-overlay[style*="display: flex"],
  .lead-modal-overlay[style*="display:flex"] {
    z-index: 300000 !important;
  }

  /* the bottom nav must never sit over an open overlay */
  body:has(.dc-admin-modal:not([hidden])) #mobile-bottom-nav,
  body:has(.lead-modal-overlay[style*="display: flex"]) #mobile-bottom-nav,
  body:has(.lead-modal-overlay[style*="display:flex"]) #mobile-bottom-nav,
  body:has(#alert-bell-panel.abell-sheet[style*="display: block"]) #mobile-bottom-nav,
  body:has(#alert-bell-panel.abell-sheet[style*="display:block"]) #mobile-bottom-nav {
    display: none !important;
  }

  /* Dashboard admin sheet: header and footer stay reachable while the body scrolls,
     mirroring what ui.css already does for .modal-header / .modal-footer. */
  .dc-admin-dialog { min-height: 0; }
  .dc-admin-dialog > header {
    position: sticky; top: 0; z-index: 3;
    background: #fff; padding-top: calc(17px + env(safe-area-inset-top, 0px));
  }
  body.dark .dc-admin-dialog > header { background: #171719; }
  .dc-admin-dialog > footer {
    position: sticky; bottom: 0; z-index: 4;
    padding-bottom: calc(13px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .dc-admin-dialog > footer button { min-height: 44px; }
  .dc-admin-modal-body { -webkit-overflow-scrolling: touch; }

  /* The agent combobox is absolutely positioned inside an overflow:auto body, so on a
     short sheet its list was clipped. Cap it and let the body scroll to it instead. */
  .dc-admin-user-options { max-height: 46dvh; overflow-y: auto; }
}

/* Track the real (keyboard-aware) viewport, not the layout viewport. */
html.crm-mobile-lock .dc-admin-modal {
  top: var(--app-vh-top, 0px) !important;
  bottom: auto !important;
  height: var(--app-vh, 100dvh) !important;
  max-height: var(--app-vh, 100dvh) !important;
}
html.crm-mobile-lock .dc-admin-dialog {
  max-height: min(92dvh, var(--app-vh, 100dvh)) !important;
}
html.crm-mobile-lock #alert-bell-panel.abell-sheet {
  max-height: calc(var(--app-vh, 100dvh) - 140px) !important;
}

/* ============================================================================
   r172 — Property Smart Search (four sources + ChatGPT). Scoped to #page-search.
   ============================================================================ */
#page-search .ss-panel{
  border:1px solid var(--border);border-radius:14px;background:var(--card);
  padding:13px 15px;margin-bottom:12px;
}
#page-search .ss-srcstrip{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
#page-search .ss-src{
  display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;
  font-size:11.5px;font-weight:600;border:1px solid var(--border);color:var(--text-muted);white-space:nowrap;
}
#page-search .ss-src i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 auto}
#page-search .ss-src b{font-weight:800}
#page-search .ss-src.is-ok{color:var(--success,var(--accent-text));border-color:color-mix(in srgb,var(--success,var(--accent)) 34%,transparent)}
#page-search .ss-src.is-warn{color:#d97706;border-color:color-mix(in srgb,#d97706 34%,transparent)}
#page-search .ss-src.is-fail{color:var(--danger,var(--danger));border-color:color-mix(in srgb,var(--danger,var(--danger)) 34%,transparent)}
#page-search .ss-src.is-skip{opacity:.6}
#page-search .ss-src.is-pending{opacity:.5}
#page-search .ss-retry{
  margin-inline-start:4px;border:0;background:none;color:inherit;font:inherit;
  text-decoration:underline;cursor:pointer;padding:0;
}
#page-search .ss-srcsum{font-size:11.5px;color:var(--text-muted);margin-inline-start:auto}

#page-search .ss-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:11px}
#page-search .ss-chips-lbl{font-size:11px;font-weight:800;color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase}
#page-search .ss-chip{
  display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;cursor:pointer;
  font-size:12px;font-weight:700;font-family:inherit;
  border:1px solid color-mix(in srgb,var(--ok,var(--primary)) 40%,transparent);
  background:color-mix(in srgb,var(--ok,var(--primary)) 12%,transparent);color:var(--text);
}
#page-search .ss-chip i{font-style:normal;opacity:.6}
#page-search .ss-chip:hover{border-color:var(--danger,var(--danger));color:var(--danger,var(--danger))}

#page-search .ss-progress{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:13px}
#page-search .ss-spin{
  width:18px;height:18px;border-radius:50%;flex:0 0 auto;
  border:2px solid var(--border);border-top-color:var(--ok,var(--primary));animation:ssSpin .8s linear infinite;
}
@keyframes ssSpin{to{transform:rotate(360deg)}}
#page-search .ss-summary{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:11px;font-size:13px}
#page-search .ss-summary .ss-sub{font-size:11.5px;color:var(--text-muted)}
#page-search .ss-clear{margin-inline-start:auto}
#page-search .ss-partial{
  margin-top:10px;padding:8px 11px;border-radius:10px;font-size:12px;
  background:color-mix(in srgb,#d97706 12%,transparent);color:#b45309;
  border:1px solid color-mix(in srgb,#d97706 30%,transparent);
}
#page-search .ss-error{font-size:13px}
#page-search .ss-error p{margin:6px 0 10px;color:var(--text-muted)}
#page-search .ss-zero b{font-size:14px}
#page-search .ss-zero p{margin:6px 0 0;color:var(--text-muted);font-size:12.5px}

#page-search .ss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
#page-search .ss-card{
  display:flex;flex-direction:column;border:1px solid var(--border);border-radius:14px;
  background:var(--card);overflow:hidden;min-width:0;
}
#page-search .ss-card-media{aspect-ratio:16/10;background:var(--track,rgba(0,0,0,.05));overflow:hidden}
#page-search .ss-card-media img{width:100%;height:100%;object-fit:cover;display:block}
#page-search .ss-noimg{display:block;width:100%;height:100%}
#page-search .ss-card-body{display:flex;flex-direction:column;gap:6px;padding:12px 13px;min-width:0}
#page-search .ss-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
#page-search .ss-title{margin:0;font-size:13.5px;font-weight:800;line-height:1.35;min-width:0;overflow-wrap:anywhere}
#page-search .ss-score{
  flex:0 0 auto;font-size:11px;font-weight:800;padding:3px 8px;border-radius:999px;
  background:color-mix(in srgb,var(--ok,var(--primary)) 15%,transparent);color:var(--ok,var(--primary));
}
#page-search .ss-sub{font-size:11.5px;color:var(--text-muted);overflow-wrap:anywhere}
#page-search .ss-badges{display:flex;flex-wrap:wrap;gap:5px}
#page-search .ss-badge{
  font-size:10.5px;font-weight:800;padding:2px 9px;border-radius:999px;white-space:nowrap;
  border:1px solid var(--border);color:var(--text-muted);
}
#page-search .ss-badge.ss-b-property{color:var(--text-secondary);border-color:color-mix(in srgb,var(--border-strong) 40%,transparent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
#page-search .ss-badge.ss-b-project{color:var(--accent-text);border-color:color-mix(in srgb,var(--accent) 40%,transparent);background:color-mix(in srgb,var(--accent-soft) 12%,transparent)}
#page-search .ss-badge.ss-b-bayut{color:var(--accent-text);border-color:color-mix(in srgb,var(--accent) 40%,transparent);background:color-mix(in srgb,var(--accent-soft) 12%,transparent)}
#page-search .ss-badge.ss-b-propertyfinder{color:#c2410c;border-color:color-mix(in srgb,#c2410c 40%,transparent);background:color-mix(in srgb,#c2410c 12%,transparent)}
#page-search .ss-meta{display:flex;flex-wrap:wrap;gap:5px 12px;font-size:12px;color:var(--text-muted)}
#page-search .ss-price{font-size:14px;font-weight:800}
#page-search .ss-price.is-na{font-size:12px;font-weight:600;color:var(--text-muted)}
#page-search .ss-why{
  font-size:11.5px;line-height:1.5;padding:7px 9px;border-radius:9px;
  background:var(--track,rgba(0,0,0,.04));color:var(--text-light,var(--text));
}
#page-search .ss-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}

@media (max-width:900px){
  #page-search .ss-grid{grid-template-columns:1fr;gap:10px}
  #page-search .ss-card{flex-direction:row}
  #page-search .ss-card-media{flex:0 0 108px;aspect-ratio:auto;min-height:100%}
  #page-search .ss-panel,#page-search .ss-card{max-width:100%}
  #page-search .ss-srcsum{margin-inline-start:0;width:100%}
  #page-search .ss-actions .pf-btn{min-height:44px;display:inline-flex;align-items:center}
  #page-search .ss-clear{min-height:44px}
}
@media (max-width:430px){
  #page-search .ss-card{flex-direction:column}
  #page-search .ss-card-media{flex:none;aspect-ratio:16/10;min-height:0}
}

/* r173 — publish modal: publication state, history and preflight blocking */
#small-modal.property-publish-modal-v1 .ppm-pubstate{
  margin:10px 0 4px;padding:10px 12px;border-radius:10px;font-size:12px;
  border:1px solid var(--border);background:var(--track,rgba(0,0,0,.04));
}
#small-modal.property-publish-modal-v1 .ppm-pubstate.is-rejected{
  border-color:color-mix(in srgb,var(--danger,var(--danger)) 40%,transparent);
  background:color-mix(in srgb,var(--danger,var(--danger-light)) 10%,transparent);
}
#small-modal.property-publish-modal-v1 .ppm-pubstate.is-block{
  border-color:color-mix(in srgb,var(--danger,var(--danger)) 55%,transparent);
  background:color-mix(in srgb,var(--danger,var(--danger-light)) 12%,transparent);
}
#small-modal.property-publish-modal-v1 .ppm-pubstate ul{margin:6px 0 0;padding-inline-start:18px}
#small-modal.property-publish-modal-v1 .ppm-pubstate li{margin:2px 0}
#small-modal.property-publish-modal-v1 .ppm-pubrow{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;margin:2px 0}
#small-modal.property-publish-modal-v1 .ppm-pubrow span{color:var(--text-muted);min-width:104px}
#small-modal.property-publish-modal-v1 .ppm-pubrow em{font-style:normal;color:var(--text-muted)}
#small-modal.property-publish-modal-v1 .ppm-pubrow.is-reason b{color:var(--danger,var(--danger))}
#small-modal.property-publish-modal-v1 .ppm-pubhist{font-size:11.5px;color:var(--text-muted)}
#small-modal.property-publish-modal-v1 .ppm-newnotice{
  margin:8px 0 4px;padding:9px 12px;border-radius:10px;font-size:12px;
  border:1px solid color-mix(in srgb,#d97706 38%,transparent);
  background:color-mix(in srgb,#d97706 10%,transparent);color:#b45309;
}

/* r174 — Dashboard application launchers (Marketing Hub) */
#page-dashboard .dc-launchers{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px;margin:0 0 16px}
#page-dashboard .dc-launch-card{
  display:flex;align-items:center;gap:13px;padding:14px 16px;border-radius:14px;
  border:1px solid var(--border);background:var(--card);color:var(--text);
  text-decoration:none;transition:.15s;min-width:0;
}
#page-dashboard .dc-launch-card:hover{
  border-color:var(--ok,var(--primary));
  box-shadow:0 6px 18px rgba(0,0,0,.08);
  transform:translateY(-1px);
}
#page-dashboard .dc-launch-card:focus-visible{outline:2px solid var(--ok,var(--primary));outline-offset:2px}
#page-dashboard .dc-launch-icon{
  flex:0 0 auto;display:grid;place-items:center;width:42px;height:42px;border-radius:12px;
  background:color-mix(in srgb,var(--ok,var(--primary)) 14%,transparent);color:var(--ok,var(--primary));
}
#page-dashboard .dc-launch-icon svg{width:21px;height:21px}
#page-dashboard .dc-launch-copy{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
#page-dashboard .dc-launch-copy strong{font-size:14px;font-weight:800;line-height:1.3}
#page-dashboard .dc-launch-copy small{font-size:11.5px;color:var(--text-muted);overflow-wrap:anywhere}
#page-dashboard .dc-launch-go{flex:0 0 auto;color:var(--text-muted);display:flex}
#page-dashboard .dc-launch-go svg{width:17px;height:17px}
#page-dashboard .dc-launch-card:hover .dc-launch-go{color:var(--ok,var(--primary))}

@media (max-width:760px){
  #page-dashboard .dc-launchers{grid-template-columns:1fr;margin-bottom:13px}
  /* comfortable touch target on every supported phone width */
  #page-dashboard .dc-launch-card{min-height:64px;padding:13px 14px}
  #page-dashboard .dc-launch-copy small{font-size:11px}
}
@media (max-width:360px){
  #page-dashboard .dc-launch-icon{width:38px;height:38px}
  #page-dashboard .dc-launch-copy strong{font-size:13.5px}
}

/* ============================================================================
   r175 — Data module: dense professional grid, row actions, record modal.
   Desktop = sticky-header table (horizontal scroll INSIDE the wrapper only).
   Mobile  = cards (the table is display:none, never h-scrolled).
   ============================================================================ */
#page-data .dt-wrap{
  border:1px solid var(--border);border-radius:14px;background:var(--card);
  overflow:auto;max-height:calc(100vh - 300px);max-width:100%;
}
#page-data .dt-table{width:100%;border-collapse:separate;border-spacing:0;min-width:1180px;font-size:12.5px}
#page-data .dt-table thead th{
  position:sticky;top:0;z-index:2;
  background:var(--head-bg,var(--track,var(--card2)));
  border-bottom:1.5px solid var(--border-gold,var(--border));
  color:var(--text-muted);font-size:10.5px;font-weight:800;letter-spacing:.03em;
  text-transform:uppercase;text-align:start;padding:10px 11px;white-space:nowrap;
}
body.dark #page-data .dt-table thead th{background:#1c1c1f}
#page-data .dt-table th.sortable{cursor:pointer;user-select:none}
#page-data .dt-table th.sortable:hover{color:var(--text)}
#page-data .dt-sort{font-style:normal;margin-inline-start:4px;font-size:9px}
#page-data .dt-table td{
  padding:9px 11px;border-bottom:1px solid var(--hairline,var(--border));
  vertical-align:middle;white-space:nowrap;
}
#page-data .dt-table tbody tr{cursor:pointer;transition:.12s}
#page-data .dt-table tbody tr:hover td{background:var(--active-pill,var(--track,rgba(0,0,0,.03)))}
#page-data .dt-table tbody tr.is-sel td{background:color-mix(in srgb,var(--ok,var(--primary)) 9%,transparent)}
#page-data .dt-ellip{display:inline-block;max-width:170px;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
#page-data .dt-muted{color:var(--text-muted)}
#page-data .dt-c-check{width:38px}
#page-data .dt-c-check input,#page-data .dt-mcheck{accent-color:var(--ok,var(--primary));width:15px;height:15px;cursor:pointer}
#page-data .dt-c-act{width:52px;text-align:center}
#page-data .dt-c-num{width:78px}
#page-data .dt-c-date{width:132px}
#page-data .dt-c-phone{width:140px}
#page-data .dt-c-pill{width:118px}
#page-data .dt-c-name b{display:block;max-width:210px;overflow:hidden;text-overflow:ellipsis}
#page-data .dt-c-name small{display:block;font-size:10.5px;color:var(--text-muted)}
#page-data .dt-c-owner{white-space:nowrap}
#page-data .dt-avatar{
  display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;
  margin-inline-end:6px;font-size:10px;font-weight:800;vertical-align:middle;
  background:color-mix(in srgb,var(--ok,var(--primary)) 16%,transparent);color:var(--ok,var(--primary));
}
#page-data .dt-count{
  display:inline-block;min-width:22px;text-align:center;padding:1px 7px;border-radius:999px;
  font-size:11px;font-weight:800;
  background:color-mix(in srgb,var(--accent-soft) 14%,transparent);color:var(--accent-text);
}

/* Row actions — WhatsApp / Phone */
#page-data .dt-act,#small-modal .dt-act{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  width:30px;height:30px;border-radius:9px;cursor:pointer;border:1px solid transparent;
  text-decoration:none;transition:.12s;
}
#page-data .dt-act.is-lg,#small-modal .dt-act.is-lg{width:auto;height:38px;padding:0 14px;font-size:12.5px;font-weight:700}
#page-data .dt-act-wa,#small-modal .dt-act-wa{background:color-mix(in srgb,#25D366 15%,transparent);color:#128C7E;border-color:color-mix(in srgb,#25D366 34%,transparent)}
#page-data .dt-act-wa:hover,#small-modal .dt-act-wa:hover{background:#25D366;color:#fff}
#page-data .dt-act-tel,#small-modal .dt-act-tel{background:color-mix(in srgb,var(--ok,var(--primary)) 14%,transparent);color:var(--ok,var(--primary));border-color:color-mix(in srgb,var(--ok,var(--primary)) 32%,transparent)}
#page-data .dt-act-tel:hover,#small-modal .dt-act-tel:hover{background:var(--ok,var(--primary));color:#fff}
#page-data .dt-act.is-off,#small-modal .dt-act.is-off{opacity:.32;cursor:not-allowed;background:var(--track,rgba(0,0,0,.05));color:var(--text-muted)}
#page-data .dt-selbar{
  display:flex;align-items:center;gap:10px;padding:9px 13px;margin-bottom:10px;border-radius:11px;
  background:color-mix(in srgb,var(--ok,var(--primary)) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--ok,var(--primary)) 30%,transparent);font-size:12.5px;
}

/* Record modal */
#small-modal .dt-dhead{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:14px}
#small-modal .dt-dbadges{display:flex;gap:6px;flex-wrap:wrap}
#small-modal .dt-dacts{display:flex;gap:8px;flex-wrap:wrap}
#small-modal .dt-dsec{margin-bottom:16px}
#small-modal .dt-dsec h5{
  margin:0 0 9px;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
  color:var(--text-muted);padding-bottom:6px;border-bottom:1px solid var(--border);
}
#small-modal .dt-dgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px 16px}
#small-modal .dt-dfield{display:flex;flex-direction:column;gap:2px;min-width:0}
#small-modal .dt-dfield>span{font-size:10.5px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em}
#small-modal .dt-dfield>b{font-size:13px;font-weight:600;overflow-wrap:anywhere}
#small-modal .dt-dfield.is-edit>b,#small-modal .dt-dfield.is-edit select{font-weight:600}
#small-modal .dt-span2{grid-column:1/-1}
#small-modal .dt-act-row{border-left:3px solid var(--border);padding:6px 0 6px 10px;font-size:12.5px}
#small-modal .dt-act-row.is-contact{border-left-color:#1c7f8f}
#small-modal .dt-act-row.is-status{border-left-color:#9b3fb5}
#small-modal .dt-muted{color:var(--text-muted);font-size:11.5px}

@media (max-width:760px){
  /* cards only — the grid is hidden, so the page never scrolls sideways */
  #page-data .dt-wrap{display:none}
  #page-data .dmhh-card.is-sel{border-color:var(--ok,var(--primary))}
  #page-data .dmhh-actions .dt-act.is-lg{min-height:44px}
  #page-data .dt-mcheck{width:18px;height:18px;margin-top:2px}
  #small-modal .dt-dgrid{grid-template-columns:1fr}
  #small-modal .dt-dhead{flex-direction:column;align-items:flex-start}
}

/* ═══ r176 — Data module delete controls + confirmation layer ═══════════════ */
.dt-danger-sep{display:inline-block;width:1px;align-self:stretch;margin:0 3px;background:var(--hairline)}
.dt-danger-btn{background:#B42318;border-color:#B42318;color:#fff;display:inline-flex;align-items:center;gap:6px}
.dt-danger-btn:hover{background:#912018;border-color:#912018;color:#fff}
.dt-danger-btn:disabled{opacity:.55;cursor:not-allowed}
.dt-danger-ghost{background:transparent;border:1px solid #F0A9A2;color:#B42318;display:inline-flex;align-items:center;gap:6px}
.dt-danger-ghost:hover{background:#FEF3F2;border-color:#B42318;color:#912018}
body.dark .dt-danger-ghost{border-color:#7A2A22;color:#FDA29B}
body.dark .dt-danger-ghost:hover{background:#3A1512;border-color:#F97066;color:#FECDCA}
.dt-selbar{display:flex;flex-wrap:wrap;align-items:center;gap:9px}
.dt-selbar-quiet{opacity:.92}
.dt-selnote{font-size:11.5px;line-height:1.45;color:var(--muted);max-width:52ch}

.dtdel-layer{position:fixed;inset:0;z-index:400000;display:grid;place-items:center;padding:18px;
  background:rgba(9,16,24,.62);overflow-y:auto}
.dtdel-box{width:min(520px,100%);max-height:min(92dvh,var(--app-vh,100dvh));overflow:auto;
  background:var(--card);color:var(--text);border:1px solid var(--hairline);border-radius:16px;
  box-shadow:0 26px 70px rgba(0,0,0,.4)}
.dtdel-head{display:flex;align-items:center;gap:10px;padding:16px 18px 10px}
.dtdel-head h3{margin:0;font-size:16.5px;font-weight:800;line-height:1.3}
.dtdel-ic{display:inline-grid;place-items:center;width:30px;height:30px;flex:0 0 auto;border-radius:9px;
  background:#FEF3F2;color:#B42318}
body.dark .dtdel-ic{background:#3A1512;color:#FDA29B}
.dtdel-body{padding:0 18px 4px}
.dtdel-lead{margin:0 0 9px;font-size:13.5px;line-height:1.55}
.dtdel-warn{color:#B42318;font-weight:650}
body.dark .dtdel-warn{color:#FDA29B}
.dtdel-note{margin:0 0 9px;font-size:12px;line-height:1.5;color:var(--muted)}
.dtdel-list{margin:6px 0 10px;padding-left:18px;font-size:12.5px;line-height:1.6;max-height:190px;overflow:auto}
.dtdel-more{list-style:none;margin-left:-18px;color:var(--muted)}
.dtdel-filters{list-style:none;margin:8px 0 10px;padding:9px 11px;border:1px solid var(--hairline);
  border-radius:10px;background:var(--card2,transparent);font-size:12.5px}
.dtdel-filters li{display:flex;justify-content:space-between;gap:12px;padding:2px 0}
.dtdel-filters span{color:var(--muted)}
.dtdel-filters b{text-align:end;word-break:break-word}
.dtdel-type{display:block;padding:4px 18px 0}
.dtdel-type>span{display:block;font-size:12px;color:var(--muted);margin-bottom:5px}
.dtdel-type code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:700;
  background:var(--card2,rgba(127,127,127,.14));padding:1px 5px;border-radius:5px;color:var(--text)}
.dtdel-input{width:100%;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em;
  padding:9px 11px;border:1px solid var(--hairline);border-radius:9px;background:var(--card);color:var(--text)}
.dtdel-input:focus{outline:2px solid #B42318;outline-offset:1px}
.dtdel-msg{display:block;min-height:15px;margin-top:5px;font-size:11.5px}
.dtdel-msg.is-ok{color:#067647}
.dtdel-msg.is-bad{color:#B42318}
body.dark .dtdel-msg.is-ok{color:#75E0A7}
body.dark .dtdel-msg.is-bad{color:#FDA29B}
.dtdel-foot{display:flex;justify-content:flex-end;gap:9px;padding:14px 18px 16px;flex-wrap:wrap}
.dtdel-go{background:#B42318;border-color:#B42318;color:#fff}
.dtdel-go:hover:not(:disabled){background:#912018;border-color:#912018;color:#fff}
.dtdel-go:disabled{opacity:.5;cursor:not-allowed}
@media (max-width:760px){
  .dtdel-box{width:100%}
  .dtdel-foot{flex-direction:column-reverse}
  .dtdel-foot .btn{width:100%;justify-content:center}
}

/* ═══ r177 — Property shared read-only state ═══════════════════════════════ */
.prp-readonly{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;margin-inline-end:6px;
  border-radius:999px;font-size:11px;font-weight:750;line-height:1.3;white-space:nowrap;
  background:#FEF6E7;color:#8A5A00;border:1px solid #F2C879}
.prp-readonly::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto}
body.dark .prp-readonly{background:#3A2A08;color:#F5C86B;border-color:#7A5A14}
@media (max-width:760px){
  .prp-readonly{font-size:10px;padding:3px 8px}
}

/* ═══ r178 — Property Visibility & Sharing toggles ═════════════════════════ */
.prp-toggle-row{display:flex;align-items:flex-start;gap:11px;padding:9px 0}
.prp-toggle-row+.prp-toggle-row{border-top:1px solid var(--hairline)}
.prp-toggle-text{min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:7px}
.prp-toggle-text b{font-size:13px;font-weight:750}
.prp-toggle-text small{flex:1 0 100%;font-size:11.5px;line-height:1.45;color:var(--muted)}
.prp-toggle-state{font-size:10px;font-weight:850;letter-spacing:.04em;padding:2px 7px;border-radius:999px;
  background:var(--hairline);color:var(--muted)}
.prp-toggle-state.is-on{background:#E7F6EC;color:#067647}
body.dark .prp-toggle-state.is-on{background:#0C2E1C;color:#75E0A7}
.prp-toggle-note{margin-top:8px;padding:7px 10px;border-radius:9px;font-size:11.5px;line-height:1.45;
  background:#FEF6E7;color:#8A5A00;border:1px solid #F2C879}
body.dark .prp-toggle-note{background:#3A2A08;color:#F5C86B;border-color:#7A5A14}

/* Touch target stays >=44px tall even though the track is 24px. */
.prp-switch{flex:0 0 auto;display:inline-grid;place-items:center;width:46px;min-height:44px;padding:0;
  border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.prp-switch-track{position:relative;display:block;width:42px;height:24px;border-radius:999px;
  background:#CDCED8;transition:background .18s ease}
.prp-switch-thumb{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.32);transition:transform .18s ease}
.prp-switch.is-on .prp-switch-track{background:#067647}
.prp-switch.is-on .prp-switch-thumb{transform:translateX(18px)}
body.dark .prp-switch-track{background:#4A5058}
body.dark .prp-switch.is-on .prp-switch-track{background:#12945A}
.prp-switch:focus-visible{outline:2px solid var(--accent,#067647);outline-offset:3px;border-radius:999px}
.prp-toggle-row.is-locked{opacity:.62}
.prp-toggle-row.is-locked .prp-switch{cursor:not-allowed}
.prp-switch.is-busy{pointer-events:none}
.prp-switch.is-busy .prp-switch-thumb{animation:prp-switch-pulse .7s ease-in-out infinite}
@keyframes prp-switch-pulse{0%,100%{opacity:1}50%{opacity:.45}}
@media (max-width:760px){
  .prp-toggle-row{padding:11px 0;gap:13px}
  .prp-toggle-text b{font-size:14px}
  .prp-switch{width:56px;min-height:48px}
  .prp-switch-track{width:50px;height:28px}
  .prp-switch-thumb{width:22px;height:22px}
  .prp-switch.is-on .prp-switch-thumb{transform:translateX(22px)}
}

/* ═══ r181 — Portal listing state + Unpublish ══════════════════════════════ */
.ppub-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:9px 0}
.ppub-row+.ppub-row{border-top:1px solid var(--hairline)}
.ppub-meta{min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:7px}
.ppub-meta b{font-size:13px;font-weight:750}
.ppub-meta small{flex:1 0 100%;font-size:11px;color:var(--muted);word-break:break-all}
.ppub-meta small.ppub-note{color:#8A5A00}
body.dark .ppub-meta small.ppub-note{color:#F5C86B}
.ppub-state{font-size:10px;font-weight:850;letter-spacing:.03em;padding:2px 8px;border-radius:999px;white-space:nowrap}
.ppub-state.is-live{background:#E7F6EC;color:#067647}
.ppub-state.is-inactive{background:#FEF3F2;color:#B42318}
.ppub-state.is-unknown,.ppub-state.is-none{background:var(--hairline);color:var(--muted)}
body.dark .ppub-state.is-live{background:#0C2E1C;color:#75E0A7}
body.dark .ppub-state.is-inactive{background:#3A1512;color:#FDA29B}
.ppub-btn{flex:0 0 auto;background:transparent;border:1px solid #F0A9A2;color:#B42318;
  display:inline-flex;align-items:center;gap:6px;min-height:36px}
.ppub-btn:hover:not(:disabled){background:#FEF3F2;border-color:#B42318}
.ppub-btn.is-off,.ppub-btn:disabled{opacity:.45;cursor:not-allowed}
body.dark .ppub-btn{border-color:#7A2A22;color:#FDA29B}
.ppub-res{margin:2px 0 10px;border:1px solid var(--hairline);border-radius:10px;overflow:hidden}
.ppub-res-row{display:flex;justify-content:space-between;gap:12px;padding:7px 11px;font-size:12.5px}
.ppub-res-row+.ppub-res-row{border-top:1px solid var(--hairline)}
.ppub-res-row span{color:var(--muted)}
.ppub-res-row b{text-align:end;word-break:break-word}
.ppub-raw{margin-top:8px;font-size:11.5px}
.ppub-raw summary{cursor:pointer;color:var(--muted)}
.ppub-raw pre{margin:6px 0 0;padding:8px;border-radius:8px;background:var(--card2,rgba(127,127,127,.12));
  overflow:auto;max-height:200px;font-size:11px;line-height:1.45}
@media (max-width:760px){
  .ppub-row{flex-direction:column;align-items:stretch;gap:8px;padding:11px 0}
  .ppub-btn{width:100%;justify-content:center;min-height:44px}
  .ppub-res-row{flex-direction:column;gap:2px}
  .ppub-res-row b{text-align:start}
}

/* ═══ r182 — Smart Search media placeholder ════════════════════════════════ */
/* A record with genuinely no usable image shows the Dandelion mark, never a bare
   grey rectangle, a broken-image icon, or another listing's photo. */
#page-search .ss-noimg{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;width:100%;height:100%;
  background:linear-gradient(135deg,#12161C 0%,#1B2129 100%);color:#C9A227;
  border:0;text-align:center;-webkit-user-select:none;user-select:none}
#page-search .ss-noimg b{font-size:19px;font-weight:900;letter-spacing:.08em;line-height:1;opacity:.95}
#page-search .ss-noimg small{font-size:9.5px;font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;color:rgba(201,162,39,.62)}
body.light #page-search .ss-noimg{background:linear-gradient(135deg,var(--card2) 0%,#E9EAF4 100%);color:#8A6D12}
body.light #page-search .ss-noimg small{color:rgba(138,109,18,.65)}
@media (max-width:760px){
  #page-search .ss-noimg b{font-size:16px}
  #page-search .ss-noimg small{font-size:8.5px}
}

/* ═══ r184 — Search Property inventory mode + off-plan project results ═════ */
.srch-mode{display:flex;gap:6px;margin:0 0 12px;padding:4px;border-radius:11px;
  background:var(--card2,rgba(127,127,127,.12));flex-wrap:wrap}
.srch-mode-btn{flex:1 1 auto;min-height:38px;padding:7px 10px;border:0;border-radius:8px;
  background:transparent;color:var(--muted);font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
.srch-mode-btn.is-on{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.18)}
.srch-mode-btn:hover:not(.is-on){color:var(--text)}

/* SOURCE selector — multi-select chips for the four real sources. Deliberately a
   single compact row so it costs almost no vertical space above the results. */
.srch-srcsel{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 12px}
.srch-srcsel-lbl{font-size:11px;font-weight:800;letter-spacing:.04em;color:var(--muted);
  text-transform:uppercase;margin-inline-end:2px}
.srch-src-btn{min-height:30px;padding:5px 12px;border:1px solid var(--hairline);border-radius:999px;
  background:transparent;color:var(--muted);font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap}
.srch-src-btn:hover:not(.is-on){color:var(--text);border-color:var(--muted)}
.srch-src-btn.is-on{background:var(--accent,#d9b45a);border-color:var(--accent,#d9b45a);color:#12161c}
.srch-src-btn:focus-visible{outline:2px solid var(--accent,#d9b45a);outline-offset:2px}
@media (max-width:640px){
  .srch-srcsel{gap:5px}
  .srch-srcsel-lbl{width:100%;margin:0 0 2px}
  .srch-src-btn{flex:1 1 auto;text-align:center;padding:6px 9px}
}

.srch-proj-head{display:flex;align-items:baseline;gap:9px;margin:2px 0 10px;font-size:13.5px}
.srch-proj-head small{color:var(--muted);font-size:11px}
.srch-proj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:14px;margin-bottom:18px}
.srch-proj-card{border:1px solid var(--hairline);border-radius:14px;overflow:hidden;background:var(--card);
  display:flex;flex-direction:column}
.srch-proj-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--card2,rgba(127,127,127,.1))}
.srch-proj-media img{width:100%;height:100%;object-fit:cover;display:block}
.srch-proj-media .ss-noimg{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;width:100%;height:100%;background:linear-gradient(135deg,#12161C,#1B2129);color:#C9A227}
.srch-proj-media .ss-noimg b{font-size:18px;font-weight:900;letter-spacing:.08em}
.srch-proj-media .ss-noimg small{font-size:9px;letter-spacing:.05em;text-transform:uppercase;color:rgba(201,162,39,.6)}
.srch-proj-badge{position:absolute;top:8px;left:8px;padding:3px 9px;border-radius:999px;
  background:#4C1D95;color:#EBECF6;font-size:10px;font-weight:850;letter-spacing:.04em}
.srch-proj-body{padding:11px 12px 12px;display:flex;flex-direction:column;gap:7px;flex:1}
.srch-proj-body h4{margin:0;font-size:14px;font-weight:750;line-height:1.3}
.srch-proj-sub{font-size:11.5px;color:var(--muted);line-height:1.4}
.srch-proj-meta{display:flex;flex-direction:column;gap:3px;font-size:11.5px;color:var(--muted)}
.srch-proj-meta b{color:var(--text);font-weight:650}
.srch-proj-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.srch-proj-avail{font-size:10px;font-weight:850;letter-spacing:.03em;padding:3px 8px;border-radius:999px}
.srch-proj-avail.is-avail{background:#E7F6EC;color:#067647}
.srch-proj-avail.is-sold{background:#FEF3F2;color:#B42318}
.srch-proj-avail.is-unpub{background:#FEF6E7;color:#8A5A00}
.srch-proj-avail.is-unknown{background:var(--hairline);color:var(--muted)}
body.dark .srch-proj-avail.is-avail{background:#0C2E1C;color:#75E0A7}
body.dark .srch-proj-avail.is-sold{background:#3A1512;color:#FDA29B}
body.dark .srch-proj-avail.is-unpub{background:#3A2A08;color:#F5C86B}
.srch-type-badge{display:inline-block;padding:2px 7px;border-radius:999px;font-size:9.5px;font-weight:850;
  letter-spacing:.04em;background:#0E7490;color:#CFFAFE;margin-inline-end:6px}
.srch-pd-media{aspect-ratio:16/9;border-radius:11px;overflow:hidden;margin-bottom:12px;position:relative}
.srch-pd-media img{width:100%;height:100%;object-fit:cover;display:block}
.srch-pd-media .ss-noimg{display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:100%;height:100%;background:linear-gradient(135deg,#12161C,#1B2129);color:#C9A227}
.srch-pd-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:12.5px;
  border-bottom:1px solid var(--hairline)}
.srch-pd-row span{color:var(--muted)}
.srch-pd-row b{text-align:end;word-break:break-word}
.srch-pd-src{margin-top:10px;font-size:11px;color:var(--muted)}
@media (max-width:760px){
  .srch-proj-grid{grid-template-columns:1fr}
  .srch-mode-btn{font-size:11.5px;min-height:42px}
}

/* ═══ r188 — portal listing source badges ══════════════════════════════════ */
.srch-badge-bayut{background:#4D525A;color:#D1FAE5}
.srch-badge-pf{background:#1E3A8A;color:#DBEAFE}


/* ═══ r191 — Search Property productization: views, project detail, deal, mobile ═══ */
/* Entity vs Source badges are deliberately distinct concepts. */
.ent-badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:9.5px;font-weight:850;
  letter-spacing:.04em;white-space:nowrap}
.ent-badge.ent-property{background:#0E7490;color:#CFFAFE}
.ent-badge.ent-project{background:#4C1D95;color:#EBECF6}
.ent-badge.ent-bayut{background:#4D525A;color:#D1FAE5}
.ent-badge.ent-pf{background:#1E3A8A;color:#DBEAFE}
.ent-badge.on-media{position:absolute;top:8px;left:8px;z-index:2}
.srch-src{font-size:10.5px;color:var(--muted);white-space:nowrap}

.srch-resbar{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin:0 0 12px}
.srch-viewtoggle{display:inline-flex;gap:4px;padding:3px;border-radius:9px;background:var(--card2,rgba(127,127,127,.12))}
.srch-viewtoggle button{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:5px 11px;border:0;
  border-radius:7px;background:transparent;color:var(--muted);font-size:11.5px;font-weight:700;cursor:pointer}
.srch-viewtoggle button.is-on{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.18)}

/* Desktop LIST — dense and scannable */
.srch-list-wrap{overflow-x:auto;border:1px solid var(--hairline);border-radius:12px;background:var(--card)}
.srch-list{width:100%;border-collapse:collapse;font-size:12.5px;min-width:1040px}
.srch-list thead th{position:sticky;top:0;z-index:2;background:var(--card2,var(--card));text-align:start;
  padding:9px 10px;font-size:10.5px;font-weight:800;letter-spacing:.03em;color:var(--muted);
  border-bottom:1px solid var(--hairline);white-space:nowrap}
.srch-list td{padding:8px 10px;border-bottom:1px solid var(--hairline);vertical-align:middle}
.srch-lrow:hover{background:var(--card2,rgba(127,127,127,.06))}
.srch-list .c-img{width:64px}
.srch-lthumb{display:block;width:54px;height:40px;border-radius:7px;overflow:hidden;background:var(--card2,rgba(127,127,127,.12))}
.srch-lthumb img{width:100%;height:100%;object-fit:cover;display:block}
.srch-list .c-title b{display:block;font-weight:700;line-height:1.35}
.srch-list .c-title small{display:block;font-size:10.5px;color:var(--muted)}
.srch-list .c-price{white-space:nowrap;text-align:end}
/* The list table is deliberately wider than the viewport (12 dense columns), so a
   plain right-hand Actions column ends up hundreds of pixels beyond the horizontal
   scroll viewport - measured 903px off-screen at 1366 and 353px at 1920. It is
   therefore PINNED to the right edge of the scroller so every row's actions are
   reachable without scrolling. 3 x 30px buttons + 2 x 5px gaps + 2 x 10px cell
   padding = 120px, so the column must be wider than that or the buttons wrap and
   the 56px rows grow. */
.srch-list .c-act{width:132px;position:sticky;right:0;z-index:3;background:var(--card);
  box-shadow:-10px 0 12px -10px rgba(0,0,0,.5)}
/* A sticky cell MUST be opaque or the scrolled-under columns bleed through it
   ("Actions" printed over "Area"). Note: --card2 is DEFINED-BUT-EMPTY in this theme,
   and var(--card2, fallback) does NOT use the fallback in that case - it makes the
   whole declaration invalid at computed-value time and the background is dropped.
   So these two rules deliberately use a literal tint over the reliable --card. */
/* !important is required, not stylistic: the global dark theme sets
   `body.dark th{background:rgba(255,255,255,.04)!important}` and
   `body.dark tr:hover td{background:rgba(255,255,255,.07)!important}`. Those values are
   TRANSLUCENT, which is fine for a normal cell but lets the scrolled-under columns show
   through a STICKY one ("Actions" printed over "Area"). We keep the same visual tint but
   paint it over an opaque base. */
.srch-list thead th.c-act{z-index:5;
  background-color:var(--card) !important;
  background-image:linear-gradient(rgba(255,255,255,.04),rgba(255,255,255,.04)) !important}
.srch-lrow:hover .c-act{
  background-color:var(--card) !important;
  background-image:linear-gradient(rgba(255,255,255,.07),rgba(255,255,255,.07)) !important}
.srch-actions{display:flex;gap:5px;flex-wrap:nowrap;align-items:center;justify-content:flex-end}
.srch-act{display:inline-grid;place-items:center;width:30px;height:30px;border:1px solid var(--hairline);
  border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.srch-act:hover{color:var(--text);border-color:var(--muted);background:var(--card2,rgba(127,127,127,.12))}
.srch-act:focus-visible{outline:2px solid var(--accent,#d9b45a);outline-offset:1px;color:var(--text)}

/* CARD view */
.srch-uni-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(252px,1fr));gap:14px}
.srch-uni-card{border:1px solid var(--hairline);border-radius:14px;overflow:hidden;background:var(--card);
  display:flex;flex-direction:column}
.srch-uni-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--card2,rgba(127,127,127,.1))}
.srch-uni-media img{width:100%;height:100%;object-fit:cover;display:block}
.srch-uni-src{position:absolute;bottom:8px;right:8px;padding:2px 8px;border-radius:999px;
  background:rgba(0,0,0,.62);color:#fff;font-size:9.5px;font-weight:700}
.srch-uni-body{padding:11px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.srch-uni-body h4{margin:0;font-size:13.5px;font-weight:750;line-height:1.35}
.srch-uni-sub,.srch-uni-facts{font-size:11.5px;color:var(--muted);line-height:1.4}
.srch-uni-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto}
.srch-pager{display:flex;align-items:center;justify-content:center;gap:14px;padding:16px 0;font-size:12.5px;color:var(--muted)}

/* Project detail sheet */
/* The sheet used to grow to its full content height (3000px+) and the OVERLAY scrolled
   it, so the header and its close button scrolled off the top. The shell is now bounded
   by the viewport and the BODY scrolls internally, with the header pinned. */
.proj-ov{position:fixed;inset:0;z-index:300000;background:rgba(6,10,14,.72);
  overflow:hidden;padding:24px;display:flex;align-items:flex-start;justify-content:center}
.proj-sheet{max-width:1120px;width:100%;margin:0 auto;background:var(--card);border:1px solid var(--hairline);
  border-radius:16px;overflow:hidden;max-height:calc(100dvh - 48px);display:flex;flex-direction:column}
.proj-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:18px 20px;
  border-bottom:1px solid var(--hairline);flex-wrap:wrap;flex:0 0 auto;background:var(--card);
  position:sticky;top:0;z-index:2}
.proj-head h2{margin:5px 0 3px;font-size:21px;font-weight:800;line-height:1.25}
.proj-head p{margin:0;font-size:12.5px;color:var(--muted)}
.proj-head-act{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.proj-close{width:34px;height:34px;border:1px solid var(--hairline);border-radius:9px;background:transparent;
  color:var(--muted);cursor:pointer}
/* min-height:0 is required or the flex item refuses to shrink and never scrolls.
   overscroll-behavior keeps the wheel inside the modal at the ends. */
.proj-body{padding:18px 20px 26px;overflow-y:auto;flex:1 1 auto;min-height:0;
  overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.proj-galleryblock{margin-bottom:20px}
.proj-herowrap{position:relative}
.proj-hero{aspect-ratio:16/7;border-radius:13px;overflow:hidden;background:var(--card2,rgba(127,127,127,.1))}
.proj-nav{position:absolute;top:50%;transform:translateY(-50%);display:grid;place-items:center;
  width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;color:#fff;
  background:rgba(0,0,0,.55);z-index:2}
.proj-nav:hover{background:rgba(0,0,0,.78)}
.proj-nav:focus-visible{outline:2px solid var(--accent,#C9A227);outline-offset:2px}
.proj-nav.prev{left:10px}
.proj-nav.next{right:10px}
.proj-gcount{position:absolute;right:12px;bottom:10px;padding:3px 10px;border-radius:999px;
  background:rgba(0,0,0,.62);color:#fff;font-size:11px;font-weight:700;z-index:2}
.proj-hero img{width:100%;height:100%;object-fit:cover;display:block}
.proj-thumbs{display:flex;gap:8px;margin-top:9px;overflow-x:auto;padding-bottom:4px}
.proj-thumb{flex:0 0 92px;height:62px;border-radius:9px;overflow:hidden;border:2px solid transparent;
  background:var(--card2,rgba(127,127,127,.12));cursor:pointer;padding:0}
.proj-thumb.is-on{border-color:var(--accent,#C9A227)}
.proj-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.proj-sec{margin-bottom:20px}
.proj-sec h3{margin:0 0 9px;font-size:13px;font-weight:800;letter-spacing:.03em;color:var(--muted);
  text-transform:uppercase}
.proj-kvgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px 20px}
.proj-kv{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--hairline);font-size:12.5px}
.proj-kv span{color:var(--muted)}
.proj-kv b{text-align:end;word-break:break-word}
.proj-desc{margin:0;font-size:13px;line-height:1.65;white-space:pre-line}
.proj-table-wrap{overflow-x:auto;border:1px solid var(--hairline);border-radius:11px}
.proj-table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:520px}
.proj-table th{text-align:start;padding:9px 11px;font-size:10.5px;font-weight:800;color:var(--muted);
  border-bottom:1px solid var(--hairline);white-space:nowrap}
.proj-table td{padding:8px 11px;border-bottom:1px solid var(--hairline)}
.proj-chips{display:flex;flex-wrap:wrap;gap:7px}
.proj-chips span{padding:4px 11px;border-radius:999px;background:var(--card2,rgba(127,127,127,.12));font-size:11.5px}
.proj-fresh{margin:14px 0 0;font-size:11px;color:var(--muted)}

/* Deal shortlist */
.deal-assign-counts{font-size:11px;font-weight:600;color:var(--muted);margin-inline-start:8px}
.deal-assign-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:12px}
.deal-assign-card{border:1px solid var(--hairline);border-radius:12px;overflow:hidden;background:var(--card)}
.deal-assign-card.is-missing{opacity:.55}
.deal-assign-media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--card2,rgba(127,127,127,.1))}
.deal-assign-media img{width:100%;height:100%;object-fit:cover;display:block}
.deal-assign-body{padding:9px 10px;display:flex;flex-direction:column;gap:5px}
.deal-assign-body b{font-size:12.5px;line-height:1.35}
.deal-assign-body small{font-size:11px;color:var(--muted)}
.deal-assign-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px}
.deal-assign-act{display:flex;gap:6px;flex-wrap:wrap}
.deal-assign-rm{color:#B42318}
.deal-pick-list{max-height:340px;overflow:auto;margin-top:10px;border:1px solid var(--hairline);border-radius:10px}
.deal-pick-row{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  padding:10px 12px;border:0;border-bottom:1px solid var(--hairline);background:transparent;
  color:var(--text);text-align:start;cursor:pointer;min-height:48px}
.deal-pick-row:hover{background:var(--card2,rgba(127,127,127,.08))}
.deal-pick-main b{display:block;font-size:13px}
.deal-pick-main small{display:block;font-size:11px;color:var(--muted)}

/* Mobile */
.srch-mbar{display:none}
.srch-sheet-ov{position:fixed;inset:0;z-index:300010;background:rgba(6,10,14,.6);display:flex;align-items:flex-end}
.srch-sheet{width:100%;max-height:88dvh;display:flex;flex-direction:column;background:var(--card);
  border-radius:18px 18px 0 0;border-top:1px solid var(--hairline)}
.srch-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;
  border-bottom:1px solid var(--hairline);font-size:14px}
.srch-sheet-x{width:34px;height:34px;border:1px solid var(--hairline);border-radius:9px;background:transparent;
  color:var(--muted);cursor:pointer}
.srch-sheet-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 16px}
.srch-sheet-foot{display:flex;gap:9px;padding:12px 16px;border-top:1px solid var(--hairline)}
.srch-sheet-foot .btn{flex:1;min-height:46px;justify-content:center}
body.srch-sheet-open{overflow:hidden}
.srch-ai-q{width:100%;resize:vertical;font-family:inherit}
.srch-ai-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.srch-ai-chips button{padding:6px 12px;border:1px solid var(--hairline);border-radius:999px;
  background:transparent;color:var(--text);font-size:11.5px;cursor:pointer;min-height:36px}

/* ═══ r247 — the in-app PDF viewer ════════════════════════════════════════
   Only used when the CRM is running installed, where a PDF opened in a "new tab" has no tab bar
   and no back button. The header and the footer are the way back, and they are always on screen:
   the document scrolls inside the frame, never the sheet. */
.pdf-view-ov{position:fixed;inset:0;z-index:400001;display:flex;background:rgba(9,12,18,.72);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
body.pdf-view-open{overflow:hidden}
.pdf-view{display:flex;flex-direction:column;width:100%;height:100%;min-height:0;
  background:var(--card,#fff);color:var(--text,#111)}
.pdf-view-hd{display:flex;align-items:center;gap:10px;flex:0 0 auto;
  padding:max(8px,env(safe-area-inset-top,0px)) 12px 8px;border-bottom:1px solid var(--border,var(--border))}
.pdf-view-hd b{font-size:14px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pdf-view-x{width:44px;height:44px;min-width:44px;min-height:44px;display:grid;place-items:center;
  border:1px solid var(--border,var(--border));border-radius:12px;background:var(--card,#fff);
  color:var(--text,#111);font-size:22px;line-height:1;cursor:pointer;flex:0 0 auto}
.pdf-view-frame{flex:1 1 auto;min-height:0;width:100%;border:0;background:var(--bg,#f6f6f8)}
.pdf-view-ft{display:flex;gap:9px;flex:0 0 auto;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));
  border-top:1px solid var(--border,var(--border))}
.pdf-view-ft .btn{flex:1;min-height:46px;justify-content:center;align-items:center;display:inline-flex}

/* ═══ r246 — every way out is reachable with a thumb ═══════════════════════
   A phone audit of all 21 full-screen layers found four whose close control was drawn for a
   mouse: 28px on the KPI target editor, 32px on KPI history, 38px on the PDF options dialog and
   30px on the assistant panel. They are the only control that layer offers, and on a phone a
   missed tap on a modal's × is not a small annoyance - there is no Escape key behind it. The
   rest of the app settled on 44px; these follow it. The icon inside keeps its own size. */
@media (max-width: 900px){
  .kpi-modal-close,
  .kpi-hist-close,
  .srch-pdf-close,
  #assistant-panel-close{
    width:44px !important;
    height:44px !important;
    min-width:44px;
    min-height:44px;
    display:grid !important;
    place-items:center;
    flex:0 0 auto;
  }
}

/* ═══ r246 — the Filters drawer is a STACK, not a filter bar ═══════════════
   The mobile blanket rule `[class$="-filters"]{display:flex;flex-wrap:wrap}` exists to make
   horizontal filter BARS wrap on a phone. The drawer's host element used to be called
   `srch-drawer-filters`, so that attribute selector caught it too and laid the whole vertical
   filter list out as a wrapping two-column row: every section became `flex:1 1 150px`, and
   `align-items:stretch` blew the All / Off-plan / Ready buttons up to 86px tall next to 32px
   source chips. Renaming the host to `-filterset` takes it out of that selector's reach; this
   block then states the layout it actually wants. Keep the name out of `*-filters`. */
.srch-drawer-filterset{
  /* The --pf-* palette is declared on #page-search.srch-v1, and the sheet is a child of <body>,
     so without this every extended rule below would resolve its colours to nothing. */
  --pf-line: var(--border);
  --pf-surface: var(--card);
  --pf-canvas: var(--bg);
  --pf-ink: var(--text);
  --pf-muted: var(--text-muted);
  --pf-gold: var(--gold);
  --pf-gold-soft: color-mix(in srgb, var(--gold) 14%, transparent);
  display:flex;flex-direction:column;gap:2px;width:100%;
}
/* Its controls are styled by #page-search selectors that the sheet - a direct child of <body> -
   sits outside of. Each of those rules now names the drawer too; these are the few values that
   should differ on a phone rather than be inherited. */
.srch-drawer-filterset .pf-scroll{max-height:min(46vh,340px)}
.srch-drawer-filterset .pf-check{padding:9px 6px;font-size:13px;min-height:44px}
.srch-drawer-filterset .pf-check input{width:20px;height:20px}
.srch-drawer-filterset .filterToggle{padding:13px 2px;font-size:13.5px}
.srch-drawer-filterset .pf-input{padding:11px 12px;font-size:16px}  /* 16px: anything smaller makes iOS zoom the page on focus */
.pf-pick-search{position:sticky;top:0;z-index:1;padding:2px 2px 8px;background:var(--card,#fff)}
.pf-pick-sep{height:1px;margin:6px 4px;background:var(--hairline,rgba(127,127,127,.25))}
.pf-pick-more{padding:8px 6px;color:var(--muted,#6b7280);font-size:11.5px}
.srch-drawer-filterset > *{width:100%;flex:0 0 auto}

/* Both selector rows are for fingers here, so they get the same 44px target as the rest of the
   phone UI — and the three inventory buttons stay on ONE row: wrapping left "Ready" alone on a
   second line at 360px, which reads as a different control rather than a third option. */
@media (max-width:900px){
  .srch-mode{flex-wrap:nowrap}
  .srch-mode-btn{flex:1 1 0;min-height:44px;min-width:0;padding:7px 6px;font-size:12px;
    overflow:hidden;text-overflow:ellipsis}
  .srch-src-btn{min-height:44px;padding:8px 14px;font-size:12px}
  .srch-drawer-filterset .filter-section{border-radius:10px}
  .srch-drawer-filterset .filterToggle{min-height:44px}
}

@media (max-width:768px){
  .srch-mbar{display:flex;gap:9px;margin:0 0 12px}
  .srch-mbtn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:46px;
    border:1px solid var(--hairline);border-radius:11px;background:var(--card);color:var(--text);
    font-size:13px;font-weight:700;cursor:pointer;position:relative}
  .srch-mcount{position:absolute;top:-6px;right:10px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;
    background:#B42318;color:#fff;font-size:10px;font-weight:850;display:grid;place-items:center;font-style:normal}
  #srch-sidebar{display:none!important}
  .srch-list-wrap{display:none}
  .srch-uni-grid{grid-template-columns:1fr}
  .srch-viewtoggle button span{display:none}
  .proj-ov{padding:0}
  .proj-nav{width:34px;height:34px}
  .proj-sheet{border-radius:0;height:100dvh;max-height:100dvh}
  .proj-kvgrid{grid-template-columns:1fr}
  .deal-assign-grid{grid-template-columns:1fr}
  .proj-thumbs{scroll-snap-type:x mandatory}
  .proj-thumb{scroll-snap-align:start}
}

/* ═══ r193 — list density: keep rows compact and scannable ════════════════ */
.srch-list td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:210px}
.srch-list .c-title{max-width:260px}
.srch-list .c-title b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srch-list .c-img,.srch-list .c-type,.srch-list .c-act{max-width:none;overflow:visible}
.srch-list tbody tr{height:56px}
.srch-list .c-price{max-width:130px}

/* Multi-role chips in the user editor. Chips instead of a free-text field so the
   saved value can only ever be valid role keys. */
.ac-roles-field{grid-column:1/-1}
.ac-rolechips{display:flex;flex-wrap:wrap;gap:7px;padding:8px 0 2px;align-items:center}
.ac-rolechip{min-height:32px;padding:5px 13px;border-radius:999px;border:1px solid var(--hairline);
  background:transparent;color:var(--muted);font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
.ac-rolechip:hover:not(.is-on){color:var(--text);border-color:var(--muted)}
.ac-rolechip.is-on{background:var(--accent,#C9A227);border-color:var(--accent,#C9A227);color:#12161c}
.ac-rolechip:focus-visible{outline:2px solid var(--accent,#C9A227);outline-offset:2px}
.ac-rolechip-primary,.ac-rolechip-hint{font-size:11px;color:var(--muted)}
@media (max-width:640px){ .ac-rolechip{flex:1 1 auto;text-align:center} }

/* ═══ NOTES — mobile card redesign ════════════════════════════════════════
   The desktop card packs avatar + author + date + linked badge + actions into ONE
   flex row. Below ~640px that row cannot fit, so the badge collided with the
   actions and long author/lead names pushed the card past the viewport.
   Mobile now gives the card a deliberate vertical hierarchy:
       avatar + author/date        (row, actions pinned right)
       linked entity badge         (own full-width line)
       body                        (clamped, tap to expand)
       mentions                    (wrapping chips)
   Desktop is untouched — everything here is inside the media query. */
@media (max-width:640px){
  .notes-card{padding:13px 14px;border-radius:14px;margin-bottom:10px;overflow:hidden}
  .notes-card-head{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;min-width:0}
  .notes-avatar{flex:0 0 auto}
  .notes-card-meta{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
  .notes-author{font-weight:700;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .notes-date{font-size:11px;color:var(--muted);white-space:nowrap}
  /* Badge onto its own line so it can never collide with the action buttons. */
  .notes-linked-badge{order:4;flex:1 1 100%;margin-top:2px;max-width:100%;
    display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* Always visible on touch (no hover) and a real 36px target. */
  .notes-card-actions{opacity:1 !important;flex:0 0 auto;display:flex;gap:6px;margin-inline-start:auto}
  .notes-action-btn{width:36px;height:36px;display:grid;place-items:center;border-radius:9px}
  /* Long words and URLs must wrap, never widen the card. */
  .notes-content{margin-top:9px;font-size:13.5px;line-height:1.55;
    overflow-wrap:anywhere;word-break:break-word;
    display:-webkit-box;-webkit-line-clamp:8;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer}
  .notes-content.is-expanded{-webkit-line-clamp:unset;display:block;overflow:visible}
  .notes-content a{overflow-wrap:anywhere}
  .notes-mention-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
  .notes-mention-chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  /* Create/Edit: keep Save/Cancel reachable above the keyboard. */
  .notes-edit-wrap{margin-top:9px}
  .notes-textarea{width:100%;max-width:100%;font-size:16px;min-height:96px;max-height:40vh}
  .notes-edit-actions{display:flex;gap:8px;margin-top:9px;position:sticky;bottom:0;
    padding-top:8px;background:var(--card)}
  .notes-edit-actions button{flex:1 1 auto;min-height:42px}
  .notes-mention-menu{max-width:calc(100vw - 44px);max-height:44vh;overflow-y:auto}
  .notes-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}
}
@media (max-width:360px){
  .notes-card{padding:11px 12px}
  .notes-action-btn{width:34px;height:34px}
}

/* ═══ TEAM CHAT — day separators, bubble hygiene, mobile keyboard ═════════ */
.tch-date-sep{display:flex;align-items:center;gap:10px;margin:14px 4px 10px;
  color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.03em}
.tch-date-sep::before,.tch-date-sep::after{content:"";flex:1;height:1px;background:var(--hairline)}
.tch-date-sep span{padding:2px 10px;border-radius:999px;background:var(--card2,rgba(127,127,127,.12));white-space:nowrap}
/* Long words, URLs and pasted text must wrap instead of widening the thread. */
.tch-bubble{overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap;max-width:min(78%,560px)}
.tch-bubble a{overflow-wrap:anywhere}
@media (max-width:768px){
  /* 100dvh does NOT follow the software keyboard - it tracks the *dynamic* viewport (browser
     chrome showing/hiding) only. On iOS the keyboard leaves dvh unchanged, so the chat container
     stayed full height and the composer ended up behind the keyboard. The app shell already
     publishes the real visible height as --app-vh from window.visualViewport
     (_crmLockMobileViewport), and html/body are already sized to it, so the chat simply fills
     its parent instead of asserting a viewport height of its own. */
  #page-team-chat.tch-gold-v2 .tch-wrap{height:100%;max-height:100%;min-height:0}
  .tch-bubble{max-width:86%}
  .tch-composer,.tch-input-row{padding-bottom:calc(6px + env(safe-area-inset-bottom))}
  .tch-messages{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
}
@media (max-width:360px){
  .tch-bubble{max-width:90%;font-size:13px}
  .tch-date-sep{margin:11px 2px 8px}
}

/* At 320px the in-chat search button pushed past the header edge (measured: right edge
   beyond the viewport). Let the header wrap and cap the control instead of hiding it. */
@media (max-width:360px){
  .tch-chat-head,.tch-chat-header{flex-wrap:wrap;min-width:0}
  .tch-search-in-chat{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto}
}

/* ── Editable Profile permission matrix (Settings → Users & Access → Profiles) ──
   The matrix is wider than a phone, so it scrolls INSIDE .pp-wrap. The page itself must
   never scroll sideways, hence max-width:100% here and min-width:0 on the flex parents. */
.pp-search-row{padding:14px 18px 0}
.pp-search{width:100%;max-width:360px}
.pp-card .pp-body{border-top:1px solid var(--border)}
.pp-sumright{display:inline-flex;align-items:center;gap:8px;flex-shrink:0}
.pp-dirty-dot{width:8px;height:8px;border-radius:50%;background:#e0a11b;display:inline-block;flex-shrink:0}
.pp-toolbar{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px 4px}
.pp-wrap{overflow-x:auto;overflow-y:hidden;max-width:100%;-webkit-overflow-scrolling:touch}
.pp-matrix{min-width:520px}
.pp-matrix td.pp-modname{text-align:start;font-size:11px;font-weight:600}
.pp-matrix th,.pp-matrix td{padding:9px 8px}
/* The sticky module column must be OPAQUE: body.dark th{} sets a translucent background
   with !important, which would let scrolled cells show through it. */
.pp-matrix th:first-child,.pp-matrix td:first-child{position:sticky;left:0;z-index:2;background:var(--card) !important}
.pp-cell{text-align:center}
.pp-box{display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:34px;cursor:pointer;margin:0}
.pp-box input[type=checkbox]{width:17px;height:17px;accent-color:#787D85;cursor:pointer;margin:0}
.pp-locked{opacity:.65;cursor:not-allowed}
.pp-lockmark{font-weight:800;color:#D4D5DF}
.pp-lockmark.on{color:#787D85}
.pp-locked::after{content:'🔒';font-size:9px;margin-left:3px;opacity:.6}
.pp-rowtools{white-space:nowrap;text-align:end}
.pp-mini{font-size:10px;padding:3px 7px;margin-left:4px;border:1px solid var(--border);border-radius:6px;
  background:var(--card);color:var(--text-muted);cursor:pointer}
.pp-mini:hover{color:var(--text);border-color:var(--brand,#787D85)}
.pp-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  padding:12px 16px;border-top:1px solid var(--border)}
.pp-status{font-size:11px;color:var(--text-muted)}
.pp-footer-btns{display:inline-flex;gap:8px;flex-shrink:0}

/* Phones: a 7-column matrix cannot be read through a 247px window - the module name
   alone fills it and the header scrolls out of sight. Below 480px each module becomes a
   self-contained card with its actions labelled, so nothing scrolls sideways at all. */
@media (max-width:480px){
  .pp-search-row{padding:12px 12px 0}
  .pp-search{max-width:100%}
  .pp-toolbar{padding:10px 12px 2px}
  .pp-toolbar .btn{flex:1 1 auto;min-width:0}
  .pp-footer{padding:10px 12px;flex-direction:column;align-items:stretch}
  .pp-footer-btns{width:100%}
  .pp-footer-btns .btn{flex:1 1 0;min-width:0}
  .ac-profile-list{padding:12px}

  .pp-wrap{overflow-x:hidden;padding:8px 12px}
  /* .page table{min-width:620px} is a global phone rule for scrollable tables; this
     layout does not scroll, so it must outrank it on specificity. */
  .pp-wrap table.pp-matrix,.pp-wrap table.pp-matrix tbody{display:block;min-width:0;width:100%}
  .pp-matrix thead{display:none}
  .pp-matrix tr{display:block;border:1px solid var(--border);border-radius:11px;
    background:var(--card);padding:10px 12px;margin-bottom:9px}
  .pp-matrix tr[hidden]{display:none}
  .pp-matrix td{display:block;border-top:0;padding:0;white-space:normal}
  .pp-matrix td.pp-modname,.pp-matrix th:first-child,.pp-matrix td:first-child{
    position:static;font-size:12px;font-weight:700;margin-bottom:8px;background:transparent !important}
  .pp-matrix td.pp-cell{display:inline-flex;align-items:center;gap:6px;width:50%;
    padding:5px 0;font-size:11px;color:var(--text-muted);text-align:start;vertical-align:top}
  .pp-matrix td.pp-cell::before{content:attr(data-action);order:2;text-transform:capitalize}
  .pp-locked::after{order:3}
  .pp-box{min-width:26px;min-height:26px;order:1}
  .pp-rowtools{display:block;text-align:start;margin-top:8px;padding-top:8px;
    border-top:1px solid var(--border);white-space:normal}
  .pp-mini{margin:0 6px 0 0;padding:5px 12px;font-size:11px}
}

/* ══ TEAM CHAT — MOBILE ACTIVE THREAD (production keyboard fix, 2026-08-25) ══════════
   Real-device symptom: focusing the composer made the conversation vanish and left the
   global Properties/Sales/more bar floating above the iPhone keyboard.

   Cause: #mobile-bottom-nav is position:fixed;bottom:0 (index.html) and is forced visible
   with `display:flex!important` under @media(max-width:768px). iOS anchors fixed-bottom
   elements to the VISUAL viewport, so when the keyboard opens the bar rides up with it and
   sits on top of the composer. An open thread must own the screen instead. */
@media (max-width: 768px) {
  /* Beats `#mobile-bottom-nav{display:flex!important}` on specificity (0,2,1 vs 0,1,0). */
  body.tc-thread-open #mobile-bottom-nav { display: none !important; }

  /* The CRM topbar (hamburger / bell / theme) is position:sticky;top:0 and kept rendering
     directly beneath the conversation header - two stacked headers on a phone. The thread
     is a full-screen workspace; the topbar returns with the conversation list. */
  body.tc-thread-open #topbar { display: none !important; }

  /* ── THE REAL-IPHONE FIX ────────────────────────────────────────────────────
     html/body are sized to var(--app-vh) (visualViewport.height), but that only
     handles the keyboard SHRINKING the viewport. iOS also PANS the layout viewport
     to chase a focused input, which makes visualViewport.offsetTop grow. An element
     in normal document flow is positioned from the LAYOUT viewport's top, so once
     iOS pans, the chat renders offsetTop pixels ABOVE the visible region - the header
     and messages scroll out of sight and the user sees a blank page. Height alone
     cannot fix that; the container has to be anchored to the VISUAL viewport.

     Every other full-screen mobile surface in this app already does exactly this
     (see the --app-vh-top overlays elsewhere in this file). The active chat thread
     now joins them: fixed, top = the pan offset, height = the visible height.
     z-index 200 clears #mobile-bottom-nav (110) and stays under the modal layers. */
  body.tc-thread-open #page-team-chat {
    position: fixed !important;
    /* This app is installed as a standalone PWA (manifest display:standalone), so there is
       no browser chrome and the web view runs UNDER the iOS status bar / notch. #app carries
       padding-top:env(safe-area-inset-top) for that, but a position:fixed child escapes it -
       which put the conversation header (and its Back arrow) beneath the status bar, where
       iOS swallows the tap. Same formula the close-button overlay already uses on line ~16438:
       the visual-viewport pan PLUS the safe area, with the safe area removed from the height
       so the composer still ends exactly at the bottom of the visible region. */
    top: calc(var(--app-vh-top, 0px) + env(safe-area-inset-top, 0px)) !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    width: 100% !important;
    height: calc(var(--app-vh, 100svh) - env(safe-area-inset-top, 0px)) !important;
    max-height: calc(var(--app-vh, 100svh) - env(safe-area-inset-top, 0px)) !important;
    margin: 0 !important;
    z-index: 200;
    overflow: hidden !important;
    /* A transformed/filtered ancestor would make `fixed` resolve against it instead of
       the viewport; none is set here, and the rule below neutralises the shell's own. */
    transform: none !important;
  }
  /* The chat must not inherit a containing block from the app shell. */
  body.tc-thread-open #app,
  body.tc-thread-open #main,
  body.tc-thread-open #content { transform: none !important; filter: none !important; }

  /* Full height chain: every flex ancestor needs min-height:0 or the messages area
     refuses to shrink and pushes the composer off-screen. */
  body.tc-thread-open #page-team-chat,
  body.tc-thread-open #page-team-chat > *,
  body.tc-thread-open #tc-chat-wrap,
  body.tc-thread-open .chat-window-shell,
  body.tc-thread-open .chat-window-shell > div { min-height: 0 !important; }
  body.tc-thread-open #tc-chat-wrap,
  body.tc-thread-open .chat-window-shell { height: 100% !important; display: flex !important;
    flex-direction: column !important; }

  /* The 72-84px reserved for that bar becomes dead space once it is gone. */
  body.tc-thread-open #content { padding: 0 !important; }

  /* The document must not be the scroller while a thread is open: otherwise focusing the
     textarea scrolls the whole app shell behind the chat. The messages list is the only
     scroller (it already sets overscroll-behavior/-webkit-overflow-scrolling below). */
  body.tc-thread-open { overflow: hidden !important; overscroll-behavior: none; }
  body.tc-thread-open #main { min-height: 0 !important; }

  /* Header / messages / composer: only the middle row scrolls. */
  #page-team-chat.tch-gold-v2 .tch-wrap { display: flex; flex-direction: column; }
  #page-team-chat.tch-gold-v2 .tch-chat-head,
  #page-team-chat.tch-gold-v2 .tch-input-bar { flex: 0 0 auto; }
  #page-team-chat.tch-gold-v2 .tch-messages { flex: 1 1 auto; min-height: 0; overflow-y: auto; }

  /* ── Compact messenger header ──────────────────────────────────────────────
     The full-width "Search conversation" button ate the header on a 390px screen and
     pushed the name/status around. Collapse it to an icon-sized control. */
  .tch-chat-head { gap: 8px; padding: 8px 10px !important; align-items: center; min-height: 52px; }
  .tch-chat-head > div:nth-child(3) { flex: 1 1 auto; min-width: 0; }
  /* The global agent-avatar decorator injects .agent-inline-avatar into any element holding
     an agent name, which (a) duplicates the 38px conversation avatar sitting right beside it
     and (b) switches the name to display:inline-flex, so it sizes to its content and slides
     out from under the ellipsis. Both are suppressed here, in the chat header only - the
     decorator keeps working everywhere else in the CRM. */
  .tch-chat-head .tch-chat-head-name .agent-inline-avatar { display: none !important; }
  .tch-chat-head .tch-chat-head-name {
    display: block !important; max-width: 100%; font-size: 14px; line-height: 1.2;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .tch-chat-head-status { font-size: 10px; line-height: 1.2; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; }
  .tch-search-in-chat {
    flex: 0 0 auto; width: 38px; height: 38px; padding: 0 !important; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 0 !important; line-height: 0; border-radius: 10px;
  }
  .tch-search-in-chat svg { font-size: 0; width: 17px; height: 17px; flex: 0 0 auto; }

  /* ── Compact composer ──────────────────────────────────────────────────────
     16px minimum on the textarea: anything smaller makes Safari zoom the page on focus,
     which is itself a layout jump. */
  .tch-input-bar { padding: 6px 8px calc(6px + env(safe-area-inset-bottom, 0px)) !important; }
  .tch-input-row { gap: 6px; align-items: flex-end; }
  .tch-input-box { flex: 1 1 auto; min-width: 0; }
  .tch-input-row textarea {
    font-size: 16px !important; line-height: 1.35; min-height: 40px; max-height: 116px;
    padding: 9px 12px; overflow-y: auto; resize: none; width: 100%;
  }
  .tch-attach-btn, .tch-send-btn {
    flex: 0 0 auto; width: 44px; height: 44px; min-width: 44px;
    display: inline-flex; align-items: center; justify-content: center; padding: 0;
  }
}

/* Desktop is untouched by all of the above: no viewport locking, no hidden navigation. */

/* ══ TEAM CHAT — CONVERSATION LIST FILLS THE PHONE SCREEN (r222) ═══════════════════
   The list lives inside the normal app shell (topbar + bottom nav visible), so its height
   is the visible viewport minus those two. Every ancestor needs min-height:0 or the flex
   column refuses to shrink and the list gets clipped instead of scrolling. */
@media (max-width: 768px) {
  /* MUST stay scoped to `.active`. `.page{display:none}` is what hides every inactive page,
     and an unqualified `#page-team-chat{display:flex !important}` here overrode it - so the
     Team Chat page rendered as an empty ~700px flex box on top of EVERY other mobile page,
     pushing their content far down the screen. `display` is never set on the page root now;
     only the inner wrappers get the flex column, and only while Chat is the active page. */
  body:not(.tc-thread-open) #page-team-chat.active > .tch-wrap,
  body:not(.tc-thread-open) #page-team-chat.active #team-chat-content,
  body:not(.tc-thread-open) #page-team-chat.active #team-chat-content > div {
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
  }
  body:not(.tc-thread-open) #page-team-chat.active { height: auto !important; min-height: 0 !important; }

  /* The scrollable part of the list, and the pinned "me" row at its foot. */
  #tc-sidebar-wrap .tch-conv-scroll,
  #tc-sidebar-wrap > div:not(.tch-sidebar-me) { min-height: 0; }
  #page-team-chat.tch-gold-v2 .tch-sidebar { height: 100% !important; min-height: 0 !important;
    display: flex !important; flex-direction: column !important; }
  #page-team-chat.tch-gold-v2 .tch-sidebar > *:not(.tch-sidebar-head):not(.tch-sidebar-me) {
    flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  #page-team-chat.tch-gold-v2 .tch-sidebar-me { flex: 0 0 auto; }
}

/* ══ CONVERSATION LIST: let it shrink and scroll (r225) ═══════════════════════════════
   #tc-sidebar-wrap carries an INLINE style="flex-shrink:0" from the renderer. Inline styles
   beat any stylesheet rule that is not !important, so the list refused to shrink below its
   content height (measured 1353px inside an 800px parent) and overflow:hidden then clipped
   the rows that did not fit - the reported "list does not come all the way down".
   Restoring shrink and giving the inner list its own scroller fixes it without touching the
   renderer's markup. */
@media (max-width: 768px) {
  /* #content is a definite-height scroller (measured 796px), so a percentage height on the
     page resolves against it. Without this the whole column grows to content height and the
     inner list never gets a scrollbar. */
  body:not(.tc-thread-open) #page-team-chat.active,
  body:not(.tc-thread-open) #page-team-chat.active #team-chat-content,
  body:not(.tc-thread-open) #page-team-chat.active > .tch-wrap {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }
  #tc-sidebar-wrap {
    flex: 1 1 auto !important;
    flex-shrink: 1 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  /* Everything between the sticky header and the pinned "me" footer scrolls. */
  #page-team-chat.tch-gold-v2 .tch-sidebar > *:not(.tch-sidebar-head):not(.tch-sidebar-me) {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  #page-team-chat.tch-gold-v2 .tch-sidebar-head,
  #page-team-chat.tch-gold-v2 .tch-sidebar-me { flex: 0 0 auto !important; }

  /* The fixed bottom navigation overlays the last rows; reserve its height inside the
     scroller so the final conversation can always be scrolled clear of it. */
  body:not(.tc-thread-open) #page-team-chat.active.tch-gold-v2 .tch-sidebar > *:not(.tch-sidebar-head):not(.tch-sidebar-me) {
    padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ══ AMENITIES — searchable picker + selected-only detail (2026-08-25) ═══════════════
   The form used to render every amenity as a permanent option; on a narrow screen the grid
   collapsed to one full-width row each and the section dominated the page. The picker is
   search + chips + a bounded checklist. Canonical labels and the .pf-amen/value contract are
   unchanged, so what gets saved is byte-identical to before. */
.amen-picker{ display:flex; flex-direction:column; gap:8px; }
.amen-search{ width:100%; }
.amen-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.amen-chip{
  display:inline-flex; align-items:center; gap:5px; padding:4px 6px 4px 10px; border-radius:999px;
  background:color-mix(in srgb, var(--ok, #787D85) 12%, transparent);
  border:1px solid color-mix(in srgb, var(--ok, #787D85) 34%, transparent);
  color:var(--text); font-size:11.5px; font-weight:650; max-width:100%;
}
.amen-chip-x{
  border:0; background:none; cursor:pointer; color:inherit; opacity:.65;
  font-size:15px; line-height:1; padding:0 2px; min-width:20px; min-height:20px;
}
.amen-chip-x:hover{ opacity:1; }
.amen-empty,.amen-noresult{ font-size:11px; color:var(--text-muted); padding:2px 1px; }
.amen-list{
  display:grid; grid-template-columns:repeat(auto-fill, minmax(158px,1fr)); gap:2px;
  max-height:190px; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
  padding:8px; border:1px solid var(--border); border-radius:10px; background:var(--card);
}
.amen-opt{
  display:flex; align-items:center; gap:8px; padding:7px 6px; border-radius:7px;
  font-size:12px; color:var(--text-light); cursor:pointer; min-width:0;
}
.amen-opt:hover{ background:var(--track); color:var(--text); }
.amen-opt[hidden]{ display:none !important; }
.amen-opt span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.amen-opt input{ accent-color:var(--ok, #787D85); flex-shrink:0; width:16px; height:16px; }

/* Property Detail: only what is actually selected, as compact chips. */
.lm-field-amen{ align-items:flex-start; }
.lm-field-amen .v{ display:block; }
.prp-amen-chips{ display:flex; flex-wrap:wrap; gap:6px; min-width:0; }
.prp-amen-chip{
  display:inline-flex; align-items:center; gap:4px; padding:3px 9px; border-radius:999px;
  background:var(--track); border:1px solid var(--border); color:var(--text);
  font-size:11px; font-weight:600; white-space:nowrap;
}
.prp-amen-chip svg{ color:var(--ok, #787D85); flex-shrink:0; }

@media (max-width: 480px){
  .amen-list{ grid-template-columns:1fr 1fr; max-height:172px; padding:6px; }
  .amen-opt{ font-size:11.5px; padding:8px 5px; }   /* taller rows: touch target */
  .amen-chip{ font-size:11px; }
  .prp-amen-chips{ gap:5px; }
}
@media (max-width: 360px){
  .amen-list{ grid-template-columns:1fr; }
}

/* Note privacy hint — states the rule where notes are written (2026-08-25). */
.notes-privacy-hint{
  display:flex; align-items:center; gap:5px; margin:6px 2px 0;
  font-size:10.5px; line-height:1.4; color:var(--text-muted);
}
.notes-privacy-hint svg{ flex-shrink:0; opacity:.8; }
@media (max-width:430px){ .notes-privacy-hint{ font-size:10px; } }

/* ── Deal-context transaction bar ───────────────────────────────────────────
   States which inventory a deal's Property Search is looking at. Mobile-first:
   the chips wrap and stay 38px tall so they remain tappable at 320px. */
.pf-deal-tx{
  display:flex;align-items:center;flex-wrap:wrap;gap:7px;
  margin:0 0 10px;padding:9px 11px;
  border:1px solid var(--border);border-radius:12px;background:var(--card);
}
.pf-deal-tx-label{
  font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--text-muted);
}
.pf-deal-tx .dwf-chip{min-height:34px}
.pf-deal-tx-warn{
  flex:1 1 auto;min-width:0;font-size:11px;font-weight:700;color:var(--warning,#D97706);
}
.pf-deal-tx-count{
  margin-inline-start:auto;font-size:11px;font-weight:700;color:var(--text-muted);
  font-variant-numeric:tabular-nums;white-space:nowrap;
}
@media(max-width:640px){
  .pf-deal-tx{padding:8px 9px;gap:6px}
  .pf-deal-tx-count{margin-inline-start:0;flex:1 1 100%}
  .pf-deal-tx-warn{flex:1 1 100%}
}

/* The in-deal Save action carries a word as well as an icon: inside a Deal this is the
   step that links a property, so it must not look like the icon-only utilities beside it.
   44px tall on touch, per the CRM's own control height. */
.srch-act--deal{
  display:inline-flex;align-items:center;gap:5px;width:auto;padding:0 10px;
  border-color:var(--primary);color:var(--primary);font-weight:750;font-size:11px;
}
.srch-act--deal span{white-space:nowrap}
.srch-act--deal.is-on{
  border-color:var(--border);color:var(--text-muted);background:var(--surface-muted);
}
.srch-act--deal[disabled]{cursor:default}
@media(pointer:coarse){ .srch-act--deal{min-height:38px} }

/* ── Social Accounts (My Profile) ───────────────────────────────────────────
   Provider-neutral rows in the same card language as the Telegram card beside it.
   Mobile-first: rows wrap, actions grow to full width under 640px, avatars keep a
   fixed footprint so a provider image can never distort the layout. */
.sp-social-list{display:flex;flex-direction:column}
.sp-social-row{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 0;border-bottom:1px solid var(--border-light);
}
.sp-social-row:last-child{border-bottom:0}
.sp-social-ava{
  width:38px;height:38px;flex:0 0 38px;border-radius:12px;object-fit:cover;
  border:1px solid var(--border);background:var(--surface-muted);
}
.sp-social-ava--ph{display:flex;align-items:center;justify-content:center;color:var(--text-muted)}
.sp-social-main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 180px}
.sp-social-main strong{font-size:13px;color:var(--text)}
.sp-social-main small{font-size:11px;color:var(--text-muted);line-height:1.5;word-break:break-word}
.sp-social-state{
  font-size:10.5px;font-weight:800;letter-spacing:.02em;white-space:nowrap;
  padding:4px 10px;border-radius:999px;border:1px solid var(--border);
  color:var(--text-muted);background:var(--surface-muted);
}
.sp-social-state.is-ok{color:#15803D;background:#DCFCE7;border-color:transparent}
.sp-social-state.is-warn{color:#92400E;background:#FEF9C3;border-color:transparent}
body.dark .sp-social-state.is-ok{color:#6EE7B7;background:rgba(16,185,129,.16)}
body.dark .sp-social-state.is-warn{color:#FCD34D;background:rgba(234,179,8,.14)}
.sp-social-actions{display:flex;gap:8px;flex-wrap:wrap}
.sp-social-actions .settings-save-btn{min-height:36px}
.sp-social-loading{padding:10px 0;font-size:12px;color:var(--text-muted)}
@media(max-width:640px){
  .sp-social-state{order:2}
  .sp-social-actions{order:3;width:100%}
  .sp-social-actions .settings-save-btn{flex:1 1 auto;justify-content:center;min-height:42px}
}

/* Admin "Manage access" modal: read-only social status block. */
.ac-social-box{
  margin-top:14px;padding:12px 14px;border:1px solid var(--border);
  border-radius:12px;background:var(--surface-muted);
}
.ac-social-title{
  display:flex;align-items:center;gap:7px;margin-bottom:8px;
  font-size:12px;font-weight:800;color:var(--text);
}
.ac-social-title small{font-weight:500;color:var(--text-muted)}
.ac-social-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:5px 0;font-size:12px;color:var(--text-light);
}

.sp-social-more{margin-top:6px}
.sp-social-more summary{
  cursor:pointer;padding:9px 0;font-size:11.5px;font-weight:700;color:var(--text-muted);
  list-style:none;display:flex;align-items:center;gap:6px;
}
.sp-social-more summary::before{content:'▸';transition:transform .15s}
.sp-social-more[open] summary::before{transform:rotate(90deg)}

/* ── Agent Tracker: complete request card (approver view) ───────────────────
   The card carries everything the approver decides on. Facts render as a
   two-column grid on desktop and stack at phone widths; long English addresses
   wrap instead of pushing the layout sideways. */
.at-req-heading{display:flex;align-items:center;gap:10px;min-width:0}
.at-req-avatar{
  width:34px;height:34px;flex:0 0 34px;border-radius:10px;object-fit:cover;
  border:1px solid var(--border);background:var(--surface-muted);
}
.at-req-avatar--ph{display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:800;color:var(--text-muted)}
.at-req-title-wrap{display:flex;flex-direction:column;gap:1px;min-width:0}
.at-req-title-wrap em{font-style:normal;font-size:11px;color:var(--text-muted)}
.at-req-submitted{display:block;margin-top:4px;font-size:11px;color:var(--text-muted)}
.at-req-submitted b{color:var(--text);font-weight:700}
.at-req-facts{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));
  gap:4px 14px;margin:8px 0 2px;padding:8px 10px;
  border:1px solid var(--border-light);border-radius:10px;background:var(--surface-muted);
}
.at-req-facts div{display:flex;gap:6px;min-width:0;font-size:11.5px}
.at-req-facts dt{color:var(--text-muted);font-weight:600;white-space:nowrap}
.at-req-facts dt::after{content:':'}
.at-req-facts dd{margin:0;color:var(--text);font-weight:600;min-width:0;overflow-wrap:anywhere}
.at-req-reason{margin:6px 0 2px;font-size:12px;line-height:1.6;overflow-wrap:anywhere}

/* ── Agent Tracker: full day timeline ─────────────────────────────────────── */
.at-day-summary{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(120px,100%),1fr));
  gap:8px;margin-bottom:12px;
}
.at-day-summary>div{
  padding:9px 11px;border:1px solid var(--border);border-radius:10px;background:var(--card);
  display:flex;flex-direction:column;gap:2px;
}
.at-day-summary small{font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}
.at-day-summary strong{font-size:14px;color:var(--text)}
.at-day-leave{
  margin-bottom:12px;padding:10px 12px;border:1px solid #D6D7E1;border-radius:10px;
  background:var(--primary-light);font-size:12px;line-height:1.7;color:var(--text);
}
.at-day-timeline h4,.at-day-requests h4{
  margin:0 0 8px;font-size:11px;font-weight:800;letter-spacing:.05em;
  text-transform:uppercase;color:var(--text-muted);
}
.at-day-timeline{border:1px solid var(--border);border-radius:12px;padding:12px;background:var(--card)}
.at-ev-row{
  display:flex;align-items:flex-start;gap:10px;padding:7px 0;
  border-bottom:1px solid var(--border-light);
}
.at-ev-row:last-child{border-bottom:0}
.at-ev-time{
  flex:0 0 72px;font-size:11.5px;font-weight:800;color:var(--text);
  font-variant-numeric:tabular-nums;padding-top:1px;
}
.at-ev-dot{
  flex:0 0 22px;width:22px;height:22px;border-radius:999px;display:flex;align-items:center;
  justify-content:center;font-size:11px;background:var(--surface-muted);
  border:1px solid var(--border);color:var(--text-muted);
}
.at-ev-check_in .at-ev-dot{background:#DCFCE7;color:#15803D;border-color:transparent}
.at-ev-check_out .at-ev-dot{background:#FEE2E2;color:#B91C1C;border-color:transparent}
.at-ev-mission .at-ev-dot,.at-ev-field_activity .at-ev-dot{background:#DBEAFE;color:#1D4ED8;border-color:transparent}
body.dark .at-ev-check_in .at-ev-dot{background:rgba(16,185,129,.16);color:#6EE7B7}
body.dark .at-ev-check_out .at-ev-dot{background:rgba(220,38,38,.16);color:#FCA5A5}
body.dark .at-ev-mission .at-ev-dot,body.dark .at-ev-field_activity .at-ev-dot{background:rgba(59,130,246,.16);color:#93C5FD}
.at-ev-body{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.at-ev-body b{font-size:12.5px;color:var(--text)}
.at-ev-body small{font-size:11px;color:var(--text-muted);line-height:1.5;overflow-wrap:anywhere}
.at-ev-loc a{color:var(--primary);font-weight:700}
.at-day-requests{margin-top:12px;font-size:12px;line-height:1.8;color:var(--text-light)}
@media(max-width:480px){
  .at-ev-time{flex-basis:58px;font-size:10.5px}
  .at-req-facts{grid-template-columns:1fr}
}


/* ---- Language switcher (EN / FA / AR) ------------------------------------
   Anchored to the inline-end edge so it opens inward in every direction. */
.lang-switch{position:relative;flex-shrink:0}
.lang-switch-menu{position:absolute;top:calc(100% + 8px);inset-inline-end:0;z-index:60;
  min-width:150px;padding:6px;background:var(--card);border:1.5px solid var(--border);
  border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,.14);display:flex;flex-direction:column;gap:2px}
.lang-switch-menu[hidden]{display:none}
.lang-switch-menu button{all:unset;cursor:pointer;padding:9px 12px;border-radius:8px;
  font-size:13px;color:var(--text);text-align:start;transition:.15s}
.lang-switch-menu button:hover,.lang-switch-menu button:focus-visible{background:var(--track)}
.lang-switch-menu button.is-active{background:rgba(158, 163, 171,.14);font-weight:650}
/* Persian gets the licensed IRANYekan family — see @font-face block, assets/fonts/iranyekan/.
   Arabic keeps its own dedicated stack; the two used to be merged into one Tahoma-first rule,
   which is why Persian rendered in Tahoma instead of a real Persian typeface. Split so each
   language can change independently and neither silently regresses the other. Nearly every
   component below this line reads font-family:inherit, so fixing these two rules is what
   actually reaches buttons, inputs, tables, cards, modals, Team Chat, Calendar and Deal Workflow —
   see html,body{font-family:Inter,…} above for the English stack, left untouched. */
html[lang="fa"] body{font-family:IRANYekan,sans-serif}
html[lang="ar"] body{font-family:"Noto Naskh Arabic","Segoe UI",Tahoma,Arial,sans-serif}


/* ---- Directional icons in RTL (§12) -------------------------------------
   Only icons whose MEANING is direction ("go back", "next page", "expand this
   way") are mirrored. Icons that merely depict an object — phone, WhatsApp,
   user, property, settings, calendar, camera, the logo — are left alone: a
   mirrored telephone or camera is just a broken drawing, not a localised one.
   Scoped to [dir="rtl"] so English is untouched. */
html[dir="rtl"] .tch-back-btn svg,
html[dir="rtl"] .prp-map-back-btn svg,
html[dir="rtl"] .back-btn svg,
html[dir="rtl"] [data-dir-icon] svg,
html[dir="rtl"] .nav-caret,
html[dir="rtl"] .at-contact-chevron,
html[dir="rtl"] .dev-project-chevron,
html[dir="rtl"] .dev-gallery-prev svg,
html[dir="rtl"] .dev-gallery-next svg,
html[dir="rtl"] .pagination .prev svg,
html[dir="rtl"] .pagination .next svg,
html[dir="rtl"] .breadcrumb-sep,
html[dir="rtl"] .lm-nav-prev svg,
html[dir="rtl"] .lm-nav-next svg{transform:scaleX(-1)}




/* ══ Slide-over drawers: one direction-aware rule ═══════════════════════════
   Every one of these panels is docked by its overlay with `justify-content`,
   which IS direction-aware — flex-end means the right edge in LTR and the LEFT
   edge in RTL. The panels then hid themselves with translateX(100%), which is
   NOT direction-aware and always pushes right. In RTL that combination docked
   the panel left and shoved it right, parking the "closed" drawer in the middle
   of the viewport instead of off-canvas.

   --drawer-x is the sign of the inline axis: +1 in LTR, -1 in RTL. One shared
   rule then pushes every drawer along its own inline-end direction, so the
   closed state is fully off-canvas in all three languages. No per-panel pixel
   values, and the open state is untouched. */
:root{ --drawer-x: 1; }
html[dir="rtl"]{ --drawer-x: -1; }

/* Docked at the inline-END edge (overlay uses justify-content:flex-end). */
.ptag-assign-panel,
.dev-panel,
.kpi-hist-panel,
.hrp-panel{ transform: translateX(calc(100% * var(--drawer-x))); }

/* Docked at the inline-START edge (overlay uses justify-content:flex-start). */
.mch-panel{ transform: translateX(calc(-100% * var(--drawer-x))); }

/* Open states win over the closed transform above. */
.ptag-assign-overlay.ptag-assign-open .ptag-assign-panel,
.dev-panel-overlay.dev-panel-open .dev-panel,
.kpi-hist-overlay.kpi-hist-open .kpi-hist-panel,
.hrp-overlay.hrp-open .hrp-panel,
.mch-panel-overlay-open .mch-panel{ transform: translateX(0); }

/* The two animated panels open from the correct edge in RTL as well. Their
   keyframes hardcode +100%, so RTL gets a mirrored pair rather than a hack. */
@keyframes kpi-slide-in-rtl{ from{ transform:translateX(-100%); opacity:0 } to{ transform:translateX(0); opacity:1 } }
@keyframes hrp-slide-in-rtl{ from{ transform:translateX(-100%); opacity:0 } to{ transform:translateX(0); opacity:1 } }
html[dir="rtl"] .kpi-hist-panel{ animation-name: kpi-slide-in-rtl; }
html[dir="rtl"] .hrp-panel{ animation-name: hrp-slide-in-rtl; }

/* Depth shadow falls away from the docked edge, so it flips with direction.
   Borders become logical for the same reason. */
.kpi-hist-panel,.hrp-panel{ border-left:none; border-inline-start:1px solid var(--border, rgba(255,255,255,.08)); }
html[dir="rtl"] .ptag-assign-panel,
html[dir="rtl"] .dev-panel,
html[dir="rtl"] .kpi-hist-panel,
html[dir="rtl"] .hrp-panel{ box-shadow: 4px 0 32px rgba(0,0,0,.14); }
html[dir="rtl"] .mch-panel{ box-shadow: -4px 0 32px rgba(0,0,0,.14); }

/* ══ Sticky table columns (D2) ══════════════════════════════════════════════
   A frozen column pinned with a physical left/right detaches from its row in
   RTL and paints over the cells it should sit beside. Logical insets keep it
   on the correct edge in every direction. Numeric cell CONTENT is untouched. */
.srch-list .c-act{ right:auto; inset-inline-end:0; }
.pp-matrix th:first-child,.pp-matrix td:first-child,
.ac-matrix th:first-child,.ac-matrix td:first-child{ left:auto; inset-inline-start:0; }
html[dir="rtl"] .srch-list .c-act{ box-shadow:10px 0 12px -10px rgba(0,0,0,.5); }

/* ══ Mobile full-screen modal close button (D3) ═════════════════════════════
   Pinned with `right:10px`, the button landed on top of the title in RTL while
   the header slot opposite it sat empty. It now tracks the inline-end edge, and
   the header reserves room for it so the title can never run underneath. */
@media (max-width:768px){
  #prop-detail-modal .lm-close,.lead-modal .lm-close,.own-panel-close,
  .own-modal-close,.txn-modal-close,.hrp-close,.dev-panel-close{
    right:auto !important; left:auto !important;
    inset-inline-end:10px !important; inset-inline-start:auto !important;
  }
  .lead-modal .lm-head,.hrp-head{
    padding-inline-end:56px;
  }
}

/* ---- Settings › Language ------------------------------------------------
   The language control moved out of the top bar into Settings. Cards rather
   than a dropdown, because each option needs to show its own script and
   reading direction — which a collapsed select cannot. */
.lang-card-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.lang-card{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;cursor:pointer;
  background:var(--card);border:1.5px solid var(--border);border-radius:12px;text-align:start;
  font-family:inherit;color:var(--text);transition:border-color .15s,background .15s}
.lang-card:hover{border-color:var(--neutral-accent,var(--primary))}
.lang-card.is-active{border-color:var(--primary);background:rgba(var(--primary-rgb),.08)}
.lang-card-main{flex:1;min-width:0}
.lang-card-name{font-size:14px;font-weight:700;line-height:1.35}
.lang-card-sub{font-size:11px;color:var(--text-muted);margin-top:2px}
.lang-card-note{font-size:11px;color:var(--text-muted);margin-top:4px}
.lang-card-mark{flex-shrink:0;color:var(--primary);display:flex;align-items:center}
/* Each card previews its own script in its own direction. */
.lang-card[aria-pressed] .lang-card-name{unicode-bidi:plaintext}

/* Logout beside the sidebar profile card. */
#sidebar-logout-btn:hover{background:rgba(255,255,255,.09);color:#ECECEC}
#sidebar-logout-btn:focus-visible{outline:2px solid var(--primary-on-dark);outline-offset:2px}

/* ── AI voice input ──────────────────────────────────────────────────────────
   Recording state lives entirely on the mic button and one inline chip inside the
   composer row. There is deliberately NO overlay, backdrop or pointer-events change:
   every other control in the app stays clickable while the microphone is live. */
#assistant-mic-btn.recording,
#dash-assistant-mic-btn.recording{
  background:var(--danger,var(--danger-light)) !important;
  border-color:var(--danger,var(--danger)) !important;
  color:#fff !important;
  animation:asst-rec-pulse 1.6s ease-in-out infinite;
}
@keyframes asst-rec-pulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(220,38,38,.42); }
  50%    { box-shadow:0 0 0 6px rgba(220,38,38,0); }
}
#assistant-mic-btn.busy,
#dash-assistant-mic-btn.busy{ opacity:.62; cursor:progress; }

#assistant-voice-chip{
  display:inline-flex;align-items:center;gap:7px;flex-shrink:0;
  padding:5px 10px;border-radius:999px;
  background:var(--surface-muted,#E1E2ED);color:var(--text,var(--text));
  font:700 11.5px inherit;white-space:nowrap;
  /* in normal flow, never covering anything */
  pointer-events:none;
}
#assistant-voice-chip .vc-time{ font-variant-numeric:tabular-nums;color:var(--text-light,#54555C); }
#assistant-voice-chip .vc-dot{
  width:8px;height:8px;border-radius:50%;background:var(--danger,var(--danger-light));
  animation:asst-rec-blink 1.1s steps(2,start) infinite;
}
@keyframes asst-rec-blink{ 0%,49%{opacity:1} 50%,100%{opacity:.25} }
#assistant-voice-chip .vc-spin{
  width:11px;height:11px;border-radius:50%;
  border:2px solid var(--border,var(--border-strong));border-top-color:var(--primary,#4F5358);
  animation:asst-vc-spin .8s linear infinite;
}
@keyframes asst-vc-spin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){
  #assistant-mic-btn.recording,#dash-assistant-mic-btn.recording{ animation:none; }
  #assistant-voice-chip .vc-dot,#assistant-voice-chip .vc-spin{ animation:none; }
}


/* ── Compact locale control (topbar, beside the theme toggle) ────────────────
   Closed state shows only the locale CODE (EN/FA/AR). The menu is position:fixed and
   placed by _positionLangMenu(), so opening it can never widen the document, add a
   horizontal scrollbar or shift the topbar - a fixed box is out of flow entirely.
   There is no backdrop element, so nothing can be left behind intercepting pointers. */
.tb-lang{ position:relative; flex-shrink:0; display:flex; align-items:center; }
.tb-lang-btn{
  width:34px;height:34px;border-radius:9px;
  border:1px solid var(--border);background:transparent;color:var(--text-light);
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font:800 11.5px/1 inherit;letter-spacing:.04em;
  transition:.2s;flex-shrink:0;
  font-variant-numeric:tabular-nums;
}
.tb-lang-btn:hover{ color:var(--text); border-color:var(--primary); }
.tb-lang-btn:focus-visible{ outline:2px solid var(--primary); outline-offset:2px; }
.tb-lang-btn[aria-expanded="true"]{ color:var(--text); border-color:var(--primary); background:var(--primary-light); }

.tb-lang-menu{
  position:fixed;               /* out of flow: cannot affect page width or layout */
  z-index:100000;
  min-width:64px;
  padding:5px;
  display:flex;flex-direction:column;gap:2px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:11px;
  box-shadow:var(--shadow-lg);
}
.tb-lang-menu[hidden]{ display:none; }   /* explicit: [hidden] must win over display:flex */
.tb-lang-menu button{
  appearance:none;border:0;background:transparent;color:var(--text);
  font:800 11.5px/1 inherit;letter-spacing:.04em;
  padding:8px 12px;border-radius:8px;cursor:pointer;text-align:center;
  min-height:34px;
}
.tb-lang-menu button:hover{ background:var(--surface-muted); }
.tb-lang-menu button:focus-visible{ outline:2px solid var(--primary); outline-offset:-2px; }
.tb-lang-menu button.is-active{ background:var(--primary); color:#fff; }

/* ── Reassign Assigned Agent (Lead + Data) ──────────────────────────────────
   Built from existing CRM tokens only - no new palette, radius or control height.
   Logical properties throughout so FA/AR mirror without a second rule set. */
.lm-assignee{ display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0; }
.lm-assignee > b{ min-width:0; overflow:hidden; text-overflow:ellipsis; }
.lm-reassign-btn{
  display:inline-flex; align-items:center; gap:5px;
  padding:3px 9px; border-radius:var(--radius-sm,8px);
  border:1px solid var(--border); background:var(--card); color:var(--text-light);
  font:700 11px/1 inherit; cursor:pointer; transition:.15s; flex-shrink:0;
}
.lm-reassign-btn:hover{ color:var(--text); border-color:var(--primary); background:var(--primary-light); }
.lm-reassign-btn:focus-visible{ outline:2px solid var(--primary); outline-offset:2px; }

/* Row-level control: quiet until the row is hovered/focused so the table does not turn into a
   wall of dropdowns, but always visible on touch where there is no hover. */
.crm-ll-reassign{
  display:inline-flex; align-items:center; justify-content:center;
  width:24px; height:24px; margin-inline-start:6px; flex-shrink:0;
  border-radius:var(--radius-sm,8px); border:1px solid var(--border);
  background:var(--card); color:var(--text-muted); cursor:pointer;
  opacity:0; transition:opacity .15s, color .15s, border-color .15s;
}
tr:hover .crm-ll-reassign, .dmhh-card:hover .crm-ll-reassign,
.crm-ll-reassign:focus-visible{ opacity:1; }
.crm-ll-reassign:hover{ color:var(--text); border-color:var(--primary); }
.crm-ll-reassign:focus-visible{ outline:2px solid var(--primary); outline-offset:2px; }
@media (hover:none){ .crm-ll-reassign{ opacity:1; } }

.reassign-body{ display:flex; flex-direction:column; gap:12px; }
.reassign-current{ display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 12px; border-radius:var(--radius-sm,8px); background:var(--surface-muted);
  font-size:12.5px; }
.reassign-current > b{ color:var(--text); }
.reassign-label{ font:700 12px/1 inherit; color:var(--text-light); }
.reassign-hint{ font-size:11.5px; color:var(--text-muted); margin:0; }
/* The combobox popup must stay inside the modal on a phone rather than escaping it. */
@media (max-width:640px){
  .reassign-body .dc-admin-user-options{ max-height:44vh; }
}

/* ── Bulk Owner reassignment ────────────────────────────────────────────────
   Built from existing tokens and the existing bulk-bar styling; logical properties so
   FA/AR mirror without a second rule set. */
.crm-ll-bulk-assign{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px;border-radius:var(--radius-sm,8px);
  border:1px solid var(--primary);background:var(--primary);color:#fff;
  font:700 11.5px/1 inherit;cursor:pointer;transition:.15s;flex-shrink:0;
}
.crm-ll-bulk-assign:hover{ background:var(--primary-dark);border-color:var(--primary-dark); }
.crm-ll-bulk-assign:focus-visible{ outline:2px solid var(--primary);outline-offset:2px; }
.crm-ll-bulk-all{
  padding:5px 10px;border-radius:var(--radius-sm,8px);
  border:1px dashed var(--border);background:transparent;color:var(--text-light);
  font:700 11.5px/1 inherit;cursor:pointer;flex-shrink:0;
}
.crm-ll-bulk-all:hover{ color:var(--text);border-color:var(--primary); }
.bulk-warn{
  display:flex;align-items:center;gap:8px;
  padding:9px 11px;border-radius:var(--radius-sm,8px);
  background:var(--warning-light,#FFFBEB);
  border:1px solid color-mix(in srgb, var(--warning,#D97706) 30%, transparent);
  color:var(--text);font-size:12px;font-weight:600;
}
/* The bulk bar must wrap rather than overflow on a phone. */
@media (max-width:640px){
  .crm-ll-bulkbar,.dt-selbar{ flex-wrap:wrap;gap:6px; }
  .crm-ll-bulk-assign,.crm-ll-bulk-all,.crm-ll-bulk-clear,.crm-ll-bulk-del{ min-height:34px; }
}

/* Mobile lead card selection: a real 34px target, never a tiny tap area. */
.crm-dl-card{ position:relative; }
.crm-dl-card-check{
  position:absolute; top:8px; inset-inline-end:8px;
  width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm,8px); cursor:pointer; z-index:2;
}
.crm-dl-card-check input{ width:17px; height:17px; cursor:pointer; }
.crm-dl-card.is-sel{ outline:2px solid var(--primary); outline-offset:-2px; }

/* ══════════════════════════════════════════════════════════════════════════════
   MOBILE BULK SELECTION + REASSIGN  (lead-mobile-bulk-r185)
   Four measured defects, fixed at the cause. Everything here is either mobile-scoped
   or a no-op on desktop; no rule widens a desktop selector.
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── 1. Selected state ────────────────────────────────────────────────────────
   Was: a 2px outline in var(--primary). After the graphite theme conversion
   --primary is #9EA3AB, which on a #1D2026 card with a #34373D border reads as
   "slightly different edge", not "selected". Nothing else changed - same
   background, same border - so a checked card looked unchanged.
   Now: a tinted ground + a solid start-edge rail + the ring, all painted with
   properties that DO NOT participate in layout (background, box-shadow, outline),
   so a card can never change height, width or text position when selected. */
#page-customers.crm-gold-v2 .crm-dl-card.is-sel,
#page-deals.crm-gold-v2 .crm-dl-card.is-sel,
#page-data .dmhh-card.is-sel{
  background:
    linear-gradient(0deg,
      color-mix(in srgb, var(--primary) 13%, transparent),
      color-mix(in srgb, var(--primary) 13%, transparent)),
    var(--card);
  outline:2px solid var(--primary);
  outline-offset:-2px;
  /* the rail is an inset shadow, not a border: zero layout cost, mirrors in RTL
     because it is drawn from the inline-start edge via the logical offset below */
  box-shadow: inset 3px 0 0 0 var(--primary);
}
[dir="rtl"] #page-customers.crm-gold-v2 .crm-dl-card.is-sel,
[dir="rtl"] #page-deals.crm-gold-v2 .crm-dl-card.is-sel,
[dir="rtl"] #page-data .dmhh-card.is-sel{
  box-shadow: inset -3px 0 0 0 var(--primary);
}
/* the Data card previously only moved its border-colour; keep the border stable so
   the card cannot shift, and let the shared selected style above do the work */
@media (max-width:760px){
  #page-data .dmhh-card.is-sel{ border-color:var(--border-light,var(--border)); }
}
/* a checked box should read as checked in both themes */
.crm-dl-card-check input,
#page-data .dt-mcheck{ accent-color: var(--primary); }

/* ── 1b. Hover must not stick on a touch screen ───────────────────────────────
   #page-customers.crm-gold-v2 .crm-dl-card:hover{border-color:var(--border-gold)}
   (ui.css:4162) is NOT inside a hover media query, so after a tap the card kept the
   hover border and sat there looking half-selected next to a really-selected card. */
@media (hover:none){
  #page-customers.crm-gold-v2 .crm-dl-card:hover,
  #page-deals.crm-gold-v2 .crm-dl-card:hover{ border-color:var(--border); }
  #page-customers.crm-gold-v2 .crm-dl-card.is-sel:hover,
  #page-deals.crm-gold-v2 .crm-dl-card.is-sel:hover{ border-color:var(--border); }
}

/* ── 2. One vertical rhythm for the mobile lead card ──────────────────────────
   Was: padding 13px 15px, card margin 9px, top row margin 9px, mid row margin 10px,
   foot padding-top 9px, inline gaps 5/6/8/10px - six different numbers for four
   equivalent seams. The values now come from three card-scoped tokens, so the
   rhythm is stated once and cannot drift per-selector. */
#page-customers.crm-gold-v2 .crm-dl-card,
#page-deals.crm-gold-v2 .crm-dl-card{
  --dlc-pad:14px;      /* card padding, all four sides */
  --dlc-row:10px;      /* vertical seam between sections */
  --dlc-gap:8px;       /* horizontal gap between items in a row */
  --dlc-stack:10px;    /* gap between cards in the list */
  padding:var(--dlc-pad);
  margin-bottom:var(--dlc-stack);
}
#page-customers.crm-gold-v2 .crm-dl-card-top,
#page-deals.crm-gold-v2 .crm-dl-card-top{
  gap:var(--dlc-gap);
  margin-bottom:var(--dlc-row);
  /* the selection control is absolutely positioned at the inline end; without this the
     lead name ran underneath it (measured: name ended at x=359, checkbox spans 332-366) */
  padding-inline-end:34px;
  min-height:22px;
}
#page-customers.crm-gold-v2 .crm-dl-card-mid,
#page-deals.crm-gold-v2 .crm-dl-card-mid{
  gap:var(--dlc-gap);
  margin-bottom:var(--dlc-row);
}
#page-customers.crm-gold-v2 .crm-dl-card-foot,
#page-deals.crm-gold-v2 .crm-dl-card-foot{
  gap:var(--dlc-gap);
  padding:var(--dlc-row) 0 0;
}
#page-customers.crm-gold-v2 .crm-dl-card-mid:empty{ display:none; margin:0; }
/* Deals wraps its cards in .crm-dl-m-list (display:flex; gap:10px) while Leads renders them as
   bare siblings. Both must end up 10px apart, so the margin applies only where there is no
   flex gap to own the seam - otherwise Deals gets 10+10=20px and the two pages drift. */
#page-deals.crm-gold-v2 .crm-dl-m-list > .crm-dl-card,
#page-customers.crm-gold-v2 .crm-dl-m-list > .crm-dl-card,
.crm-dl-m-list > .crm-dl-card{ margin-bottom:0; }
/* the control sits in the padding box, not on top of the card edge */
.crm-dl-card-check{ top:6px; inset-inline-end:6px; }

/* the Data card keeps its own structure (different component) but the same rhythm */
@media (max-width:760px){
  #page-data .dmhh-card{ --dmhh-card-pad:14px; gap:10px; }
  #page-data .dmhh-meta{ gap:6px 14px; }
  #page-data .dmhh-actions{ margin-top:0; gap:8px; }
}

/* ── 3. The agent dropdown must not be clipped by the modal scrollport ────────
   .modal-body is overflow-y:auto and .modal is overflow:hidden, so an
   absolutely-positioned popup inside them was cut to the scrollport: measured
   1 of 15 agents reachable at 390px. The popup is positioned from JS in the
   fixed-position layer instead (see _comboPlaceOptions in app.js); these rules
   only stop the old absolute geometry from fighting it. */
.dc-admin-user-combo.is-floating > .dc-admin-user-options,
.dc-admin-user-combo.is-floating > .dc-admin-user-empty{
  position:fixed;
  left:auto; right:auto; top:auto;
  /* above the modal surface, inside the modal's own stacking context - no global
     z-index inflation: #small-modal already owns the layer at z-index 300000 */
  z-index:40;
}
.dc-admin-user-combo.is-floating > .dc-admin-user-options{
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
/* the old phone cap fought the JS height; the popup is sized to the space it has */
@media (max-width:640px){
  .reassign-body .dc-admin-user-combo.is-floating > .dc-admin-user-options{ max-height:none; }
}
/* 900px, not 768px: that is the width at which this app switches to the mobile card list
   (_crmMobile) and to the crm-mobile-lock modal treatment. Stopping at 768 left a 769-900px
   band running the mobile sheet with the desktop animation and desktop-sized tap targets. */
@media (max-width:900px){
  .dc-admin-user-combo.is-floating > .dc-admin-user-options{ max-height:none; }
  /* a finger-sized row, and never a 300ms tap delay */
  .dc-admin-user-options > button{ min-height:44px; touch-action:manipulation; }
  .dc-admin-combo-toggle{ width:40px; height:40px; top:2px; touch-action:manipulation; }
}

/* ── 4. No jump when the modal opens ──────────────────────────────────────────
   modalIn animates translateY(10px) scale(.97) -> none. Measured on a phone the
   modal box moved 414.7px -> 398.0px and its height 432.6 -> 446.0 while the agent
   list was already open on top of it. Fade only on a phone: nothing moves. */
@media (max-width:900px){
  .modal{ animation:modalFadeIn .16s ease-out; }
  @keyframes modalFadeIn{ from{opacity:0} to{opacity:1} }
}

/* ── 5. iOS input zoom on the 769-900px touch band ────────────────────────────
   The global zoom-prevention block (ui.css:18031) stops at 768px, but this app treats
   everything up to 900px as a touch surface - so an iPad in portrait (820px) focused the
   agent field at 11px and Safari zoomed the whole page. Raising it only for this control:
   the global block is a broader, pre-existing question and is left alone. */
@media (max-width:900px){
  .dc-admin-user-combo > input[type=search]{ font-size:16px !important; }
}

/* ── 6. The per-card Change Agent button on the mobile lead card ──────────────
   .crm-ll-reassign is opacity:0 and revealed by `tr:hover` / `.dmhh-card:hover`
   (ui.css:20258). The mobile LEAD card is `.crm-dl-card`, which that list never covered,
   so the button was invisible on it. @media(hover:none) masks this on a real phone, but
   the mobile card renderer keys off width alone (_crmMobile = innerWidth <= 900), so any
   hover-capable window under 900px - a narrowed desktop, an iPad with a trackpad - showed
   a lead card with an unreachable Change Agent control sitting in a 24px hole. */
.crm-dl-card:hover .crm-ll-reassign{ opacity:1; }
@media (max-width:900px){
  .crm-dl-card .crm-ll-reassign{ opacity:1; }
}

/* ══════════════════════════════════════════════════════════════════════════════
   MOBILE BULK ACTION BAR — bottom-anchored  (lead-mobile-bulk-r186)
   In r185 the bar was inserted above the card list in normal flow, so the FIRST
   selection pushed the whole list down by the bar's height (measured 124px at 390px;
   0px on every later selection). Lifting the bar out of flow removes the cause.
   Mobile only - the desktop table keeps the r185 in-flow pill.

   Every selector here carries the id+class weight of the base rule at ui.css:3987
   (#page-customers.crm-gold-v2 .crm-ll-bulkbar). Without that the base rule's
   margin-bottom:10px, border-radius, gold border and padding all survive and the bar
   floats 10px above the nav still looking like the in-flow pill.
   ══════════════════════════════════════════════════════════════════════════════ */

/* The spacer is inert until bulk mode turns on, so no vertical space is ever reserved
   while nothing is selected. Its height is the bar's MEASURED height plus one seam
   (_crmSyncBulkBarMetrics in app.js), so the last card always clears the bar. */
.crm-bulk-spacer{ height:0; overflow-anchor:none; }
@media (max-width:900px){
  body.crm-bulk-active .crm-bulk-spacer{ height:calc(var(--crm-bulkbar-h, 0px) + 12px); }
}

@media (max-width:900px){
  #page-customers.crm-gold-v2 .crm-ll-bulkbar,
  #page-deals.crm-gold-v2 .crm-ll-bulkbar,
  #page-data .dt-selbar:not(.dt-selbar-quiet){
    position:fixed;
    inset-inline:0;
    /* the bar rests ON the bottom nav where one exists; --crm-bottom-nav-h is measured from
       the live #mobile-bottom-nav (index.html, z-index 110), never hardcoded */
    bottom:var(--crm-bottom-nav-h, 0px);
    /* above the page and the nav so the two can never fight, and far below the modal layer
       (#small-modal is z-index 300000) so the reassign backdrop always covers the bar:
       page > bar > backdrop > modal > agent popup */
    z-index:120;
    margin:0;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    padding:8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
    box-sizing:border-box;
    width:100%; max-width:100%;
    background:var(--card);
    border:0;
    border-top:1px solid var(--border);
    border-radius:0;
    box-shadow:0 -6px 18px rgba(0,0,0,.16);
  }
}
@media (max-width:768px){
  /* #mobile-bottom-nav is display:flex only here, and its own padding-bottom already spans
     the safe area, so the bar sitting on top of it must not add the inset a second time */
  #page-customers.crm-gold-v2 .crm-ll-bulkbar,
  #page-deals.crm-gold-v2 .crm-ll-bulkbar,
  #page-data .dt-selbar:not(.dt-selbar-quiet){ padding-bottom:8px; }
}

/* ── Compact, touch-sized contents ────────────────────────────────────────────
   r185's bar wrapped to three lines at 390px (114px). Two deliberate rows instead of
   whatever wrap produces: the state on top, the actions underneath. */
.crm-ll-bulk-break{ display:none; }
@media (max-width:900px){
  /* forces the wrap between the two rows instead of leaving it to available width,
     so the layout is the same in EN, FA and AR */
  #page-customers.crm-gold-v2 .crm-ll-bulk-break,
  #page-deals.crm-gold-v2 .crm-ll-bulk-break{ display:block; flex:1 0 100%; height:0; margin:0; }

  #page-customers.crm-gold-v2 .crm-ll-bulkbar > span,
  #page-deals.crm-gold-v2 .crm-ll-bulkbar > span{
    flex:1 1 auto; min-width:0;
    font-size:12.5px; font-weight:700; color:var(--text);
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  /* "Select all N filtered" is state, not an action - it shares the top row with the count */
  #page-customers.crm-gold-v2 .crm-ll-bulk-all,
  #page-deals.crm-gold-v2 .crm-ll-bulk-all{
    flex:0 1 auto; min-width:0; max-width:60%;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
    min-height:34px; font-size:11.5px; touch-action:manipulation;
  }
  /* action row */
  #page-customers.crm-gold-v2 .crm-ll-bulkbar > button:not(.crm-ll-bulk-all),
  #page-deals.crm-gold-v2 .crm-ll-bulkbar > button:not(.crm-ll-bulk-all){
    min-height:40px; touch-action:manipulation; font-size:12px;
  }
  #page-customers.crm-gold-v2 .crm-ll-bulk-clear,
  #page-customers.crm-gold-v2 .crm-ll-bulk-del,
  #page-deals.crm-gold-v2 .crm-ll-bulk-del{ flex:0 0 auto; }
  /* Reassign is the primary action: it takes the remaining width and reads first */
  #page-customers.crm-gold-v2 .crm-ll-bulk-assign,
  #page-deals.crm-gold-v2 .crm-ll-bulk-assign{
    flex:1 1 auto; justify-content:center; min-width:0;
    padding-inline:12px; font-size:12.5px;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }

  #page-data .dt-selbar:not(.dt-selbar-quiet) > b,
  #page-data .dt-selbar:not(.dt-selbar-quiet) > span{ flex:1 1 100%; min-width:0; font-size:12.5px; }
  #page-data .dt-selbar:not(.dt-selbar-quiet) .btn{ min-height:40px; }
}

/* ══════════════════════════════════════════════════════════════════════════════
   WORK CENTER  (work-center-r179)
   Built entirely from the CRM's existing tokens, card system, modal and buttons so the
   Work Center reads as part of the same product rather than a second visual language.
   Logical properties throughout, so FA/AR mirror without a second rule set.
   ══════════════════════════════════════════════════════════════════════════════ */
#page-work-projects, #page-work-project, #page-work-forms, #page-work-mine{
  --wc-gap:10px; --wc-pad:14px; --wc-radius:14px;
}
.wc-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px;
  flex-wrap:wrap; margin-bottom:14px; }
.wc-head-title{ display:flex; align-items:center; gap:10px; min-width:0; }
.wc-head-title h2{ font-size:19px; font-weight:800; color:var(--text); margin:0; }
.wc-count{ font-size:12px; color:var(--text-muted); font-weight:700; }
.wc-head-actions{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.wc-btn{ display:inline-flex; align-items:center; gap:6px; }
.wc-back{ display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px;
  border-radius:var(--radius-sm,8px); border:1px solid var(--border); background:var(--card);
  color:var(--text-muted); cursor:pointer; flex-shrink:0; }
.wc-back:hover{ color:var(--text); border-color:var(--primary); }
[dir="rtl"] .wc-back svg{ transform:scaleX(-1); }
.wc-search{ position:relative; display:flex; align-items:center; }
.wc-search svg{ position:absolute; inset-inline-start:9px; color:var(--text-muted); pointer-events:none; }
.wc-search input{ min-height:38px; padding-inline:30px 11px; border-radius:var(--radius-sm,8px);
  border:1px solid var(--border); background:var(--card); color:var(--text); font:600 12.5px/1 inherit; outline:none; }
.wc-search input:focus{ border-color:var(--primary); }
.wc-select{ min-height:38px; padding:0 10px; border-radius:var(--radius-sm,8px);
  border:1px solid var(--border); background:var(--card); color:var(--text); font:700 12px/1 inherit; cursor:pointer; }

/* Cards reuse the CRM card look; one rhythm, no per-element magic numbers. */
.wc-card{ background:var(--card); border:1px solid var(--border); border-radius:var(--wc-radius);
  padding:var(--wc-pad); margin-bottom:var(--wc-gap); cursor:pointer; transition:.15s; }
@media (hover:hover){ .wc-card:hover{ border-color:var(--primary); } }
.wc-card-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:var(--wc-gap); }
.wc-card-name{ font-size:14px; font-weight:800; color:var(--text); min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wc-card-meta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  font-size:11.5px; color:var(--text-muted); margin-bottom:var(--wc-gap); }
.wc-card-meta b{ color:var(--text); font-weight:700; }
.wc-card-foot{ display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding-top:var(--wc-gap); border-top:1px solid var(--border-light,var(--border));
  font-size:11.5px; color:var(--text-muted); }
.wc-card-foot-actions{ justify-content:flex-end; flex-wrap:wrap; }
.wc-chip{ display:inline-flex; align-items:center; padding:2px 8px; border-radius:20px;
  background:var(--surface-muted,var(--card2)); border:1px solid var(--border-light,var(--border));
  font-size:10.5px; font-weight:800; color:var(--text-light); }

.wc-pill{ display:inline-flex; align-items:center; padding:3px 10px; border-radius:20px;
  font-size:10.5px; font-weight:800; text-transform:capitalize; white-space:nowrap; flex-shrink:0; }
.wc-pill-muted{ background:var(--surface-muted,var(--card2)); color:var(--text-muted); border:1px solid var(--border); }
.wc-pill-info{ background:color-mix(in srgb, var(--primary) 16%, transparent); color:var(--text); border:1px solid var(--primary); }
.wc-pill-ok{ background:color-mix(in srgb, var(--ok,var(--accent-soft)) 18%, transparent); color:var(--text); border:1px solid var(--ok,var(--accent)); }
.wc-pill-warn{ background:var(--warning-light,#FFFBEB); color:var(--text);
  border:1px solid color-mix(in srgb, var(--warning,#D97706) 45%, transparent); }
.wc-pill-bad{ background:color-mix(in srgb, var(--danger,var(--danger-light)) 14%, transparent); color:var(--text);
  border:1px solid color-mix(in srgb, var(--danger,var(--danger)) 45%, transparent); }

.wc-progress{ height:6px; border-radius:20px; background:var(--surface-muted,var(--card2));
  overflow:hidden; margin-bottom:var(--wc-gap); }
.wc-progress-lg{ height:9px; margin-bottom:14px; }
.wc-progress-bar{ height:100%; background:var(--primary); border-radius:20px; transition:width .3s ease; }

.wc-summary{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:12px; }
.wc-stat{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius-sm,10px);
  padding:10px 12px; display:flex; flex-direction:column; gap:4px; min-width:0; }
.wc-stat span{ font-size:10.5px; color:var(--text-muted); font-weight:700; }
.wc-stat b{ font-size:16px; color:var(--text); font-weight:800;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.wc-tabs{ display:flex; gap:4px; overflow-x:auto; -webkit-overflow-scrolling:touch;
  border-bottom:1px solid var(--border); margin-bottom:12px; scrollbar-width:none; }
.wc-tabs::-webkit-scrollbar{ display:none; }
.wc-tab{ padding:9px 13px; border:0; background:transparent; color:var(--text-muted);
  font:700 12.5px/1 inherit; cursor:pointer; white-space:nowrap; border-bottom:2px solid transparent;
  min-height:40px; touch-action:manipulation; }
.wc-tab.is-on{ color:var(--text); border-bottom-color:var(--primary); }

.wc-panel{ display:flex; flex-direction:column; gap:var(--wc-gap); }
.wc-panel-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.wc-kv{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  padding:10px 12px; border-radius:var(--radius-sm,8px); background:var(--card);
  border:1px solid var(--border-light,var(--border)); font-size:12.5px; }
.wc-kv > span{ color:var(--text-muted); font-weight:700; flex-shrink:0; }
.wc-kv > b{ color:var(--text); text-align:end; min-width:0; overflow-wrap:anywhere; }
.wc-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  padding:12px var(--wc-pad); border-radius:var(--radius-sm,10px); background:var(--card);
  border:1px solid var(--border); font-size:12.5px; }
.wc-row-block{ flex-direction:column; align-items:stretch; }
.wc-row-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.wc-row-end{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.wc-sub{ display:block; font-size:11px; color:var(--text-muted); margin-top:2px; }
.wc-answers{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:8px; margin-top:10px; }
.wc-answer{ background:var(--surface-muted,var(--card2)); border-radius:var(--radius-sm,8px); padding:8px 10px; min-width:0; }
.wc-answer span{ display:block; font-size:10px; color:var(--text-muted); font-weight:800; text-transform:uppercase; letter-spacing:.03em; }
.wc-answer b{ font-size:12.5px; color:var(--text); overflow-wrap:anywhere; }

/* Workflow step list: the vertical rail makes the order readable at a glance. */
.wc-step{ display:flex; gap:12px; padding:12px var(--wc-pad); border-radius:var(--radius-sm,10px);
  background:var(--card); border:1px solid var(--border); }
.wc-step-active{ border-color:var(--primary); box-shadow:inset 3px 0 0 0 var(--primary); }
[dir="rtl"] .wc-step-active{ box-shadow:inset -3px 0 0 0 var(--primary); }
.wc-step-blocked{ border-color:color-mix(in srgb, var(--warning,#D97706) 55%, transparent); }
.wc-step-rejected{ border-color:color-mix(in srgb, var(--danger,var(--danger)) 55%, transparent); }
.wc-step-completed{ opacity:.82; }
.wc-step-no{ width:26px; height:26px; flex-shrink:0; border-radius:50%; display:grid; place-items:center;
  background:var(--surface-muted,var(--card2)); color:var(--text-light); font:800 11px/1 inherit; }
.wc-step-completed .wc-step-no{ background:var(--primary); color:#fff; }
.wc-step-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.wc-step-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.wc-step-top b{ font-size:13.5px; font-weight:800; color:var(--text); min-width:0; overflow-wrap:anywhere; }
.wc-step-meta{ display:flex; gap:10px; flex-wrap:wrap; font-size:11.5px; color:var(--text-muted); }
.wc-step-meta b{ color:var(--text); }
.wc-step-actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:2px; }
.wc-alert{ display:flex; align-items:flex-start; gap:7px; padding:8px 10px; border-radius:var(--radius-sm,8px);
  background:var(--warning-light,#FFFBEB); color:var(--text); font-size:11.5px; font-weight:600;
  border:1px solid color-mix(in srgb, var(--warning,#D97706) 30%, transparent); }
.wc-alert svg{ flex-shrink:0; margin-top:1px; }

.wc-timeline{ display:flex; flex-direction:column; gap:2px; }
.wc-event{ display:flex; gap:11px; padding:9px 12px; border-radius:var(--radius-sm,8px); }
.wc-event:nth-child(odd){ background:var(--surface-muted,var(--card2)); }
.wc-event b{ display:block; font-size:12.5px; font-weight:700; color:var(--text); overflow-wrap:anywhere; }
.wc-dot{ width:8px; height:8px; border-radius:50%; margin-top:6px; flex-shrink:0; background:var(--text-muted); }
.wc-dot-project{ background:var(--primary); }
.wc-dot-workflow, .wc-dot-step{ background:var(--ok,var(--accent-soft)); }
.wc-dot-task{ background:var(--warning,#D97706); }
.wc-dot-approval{ background:var(--primary); }
.wc-dot-form{ background:var(--ok,var(--accent-soft)); }

.wc-empty{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center;
  padding:40px 18px; color:var(--text-muted); }
.wc-empty b{ font-size:14px; color:var(--text); font-weight:800; }
.wc-empty span{ font-size:12px; max-width:36ch; }
.wc-pager{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:12px;
  font-size:12px; color:var(--text-muted); font-weight:700; }

/* Forms + builder inside the shared #small-modal */
.wc-form{ display:flex; flex-direction:column; gap:9px; }
.wc-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.wc-label{ font:700 11.5px/1.3 inherit; color:var(--text-light); }
.wc-req{ color:var(--danger,var(--danger)); font-style:normal; }
.wc-hint{ display:flex; align-items:flex-start; gap:6px; font-size:11px; color:var(--text-muted); }
.wc-check{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--text); cursor:pointer; }
.wc-check input{ width:17px; height:17px; accent-color:var(--primary); flex-shrink:0; }
.wc-radios{ display:flex; flex-direction:column; gap:6px; }
.wc-field{ display:flex; flex-direction:column; gap:5px; }
.wc-field.has-error .form-control{ border-color:var(--danger,var(--danger)) !important; }
.wc-field-error{ font-size:11px; font-weight:700; color:var(--danger,var(--danger)); }
.wc-note{ display:flex; align-items:center; gap:8px; padding:9px 11px; border-radius:var(--radius-sm,8px);
  font-size:12px; font-weight:600; }
.wc-note-ok{ background:color-mix(in srgb, var(--ok,var(--accent-soft)) 14%, transparent); color:var(--text); }
.wc-note-warn{ background:var(--warning-light,#FFFBEB); color:var(--text); }
.wc-builder{ display:flex; flex-direction:column; gap:10px; margin-top:10px; }
.wc-builder-step{ display:flex; flex-direction:column; gap:8px; padding:12px;
  border-radius:var(--radius-sm,10px); border:1px solid var(--border); background:var(--card2,var(--card)); }
.wc-builder-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.wc-builder-head b{ font-size:12px; font-weight:800; color:var(--text-light); }
.wc-builder-move{ display:flex; gap:4px; }
.wc-add-step{ align-self:flex-start; }
#small-modal.wc-wide-modal .modal{ max-width:720px; }

/* ── Mobile ──────────────────────────────────────────────────────────────────
   The Work Center switches at the same 900px boundary the rest of the app uses. */
@media (max-width:900px){
  .wc-head{ align-items:stretch; }
  .wc-head-actions{ width:100%; }
  .wc-search{ flex:1 1 160px; }
  .wc-search input{ width:100%; }
  .wc-select{ flex:1 1 120px; min-width:0; }
  .wc-head-actions .wc-btn{ flex:1 1 auto; justify-content:center; min-height:40px; }
  .wc-summary{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .wc-form-row{ grid-template-columns:1fr; }
  .wc-row{ flex-direction:column; align-items:stretch; }
  .wc-row-end{ justify-content:flex-start; }
  .wc-kv{ flex-direction:column; gap:4px; }
  .wc-kv > b{ text-align:start; }
  .wc-tab{ font-size:12px; padding:9px 11px; }
  .wc-answers{ grid-template-columns:1fr; }
  .wc-card-foot-actions .btn{ min-height:38px; }
  /* iOS zooms any focused control under 16px: the Work Center forms are filled on phones. */
  .wc-form .form-control, .wc-search input, .wc-select{ font-size:16px !important; }
  #small-modal.wc-wide-modal .modal{ max-width:100%; }
}
@media (max-width:430px){
  .wc-step{ padding:12px; gap:9px; }
  .wc-step-meta{ gap:6px 10px; }
}

/* ══════════════════════════════════════════════════════════════════════════════
   ORG CHART  (org-chart-r180)
   A tab inside the existing Users & Access shell, built from the same tokens as the
   rest of that surface. Logical properties so FA/AR mirror without a second rule set.
   ══════════════════════════════════════════════════════════════════════════════ */
.oc-toolbar{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:12px; }
.oc-stats{ font-size:11.5px; font-weight:800; color:var(--text-muted); margin-inline-start:auto; }
.oc-list{ display:flex; flex-direction:column; gap:8px; }
.oc-row{ background:var(--card); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.oc-row.is-open{ border-color:var(--primary); }
.oc-row.is-inactive{ opacity:.72; }
.oc-main{ display:grid; grid-template-columns:auto minmax(0,2.2fr) minmax(0,1.6fr) auto auto;
  align-items:center; gap:12px; padding:12px 14px; }
.oc-check{ display:flex; align-items:center; justify-content:center; width:26px; flex-shrink:0; }
.oc-check input{ width:17px; height:17px; accent-color:var(--primary); cursor:pointer; }
.oc-who{ min-width:0; cursor:pointer; }
.oc-who b{ display:block; font-size:13.5px; font-weight:800; color:var(--text);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.oc-sub{ display:block; font-size:11px; color:var(--text-muted); margin-top:2px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.oc-label{ display:block; font-size:10px; font-weight:800; color:var(--text-muted);
  text-transform:uppercase; letter-spacing:.03em; margin-bottom:2px; }
.oc-manager, .oc-reports{ min-width:0; }
.oc-manager b, .oc-reports b{ font-size:12.5px; font-weight:700; color:var(--text);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; }
.oc-none{ font-size:12px; font-style:italic; color:var(--text-muted); }
.oc-flag{ font-size:10px; font-style:normal; font-weight:800; color:var(--warning,#D97706); }
.oc-actions{ display:flex; align-items:center; gap:6px; flex-shrink:0; }
.oc-detail{ padding:12px 14px 14px; border-top:1px solid var(--border-light,var(--border));
  background:var(--surface-muted,var(--card2)); }
.oc-chain-wrap{ display:flex; flex-direction:column; gap:12px; }
.oc-crumbs{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.oc-crumb{ display:inline-flex; align-items:center; padding:4px 11px; border-radius:20px;
  background:var(--card); border:1px solid var(--border); font-size:11.5px; font-weight:700; color:var(--text); }
.oc-crumb.is-self{ border-color:var(--primary); background:color-mix(in srgb, var(--primary) 14%, transparent); }
.oc-crumb.is-dim{ opacity:.6; }
.oc-arrow{ color:var(--text-muted); font-style:normal; font-size:12px; }
[dir="rtl"] .oc-arrow{ transform:scaleX(-1); display:inline-block; }
.oc-loading{ font-size:12px; color:var(--text-muted); }
.oc-form{ display:flex; flex-direction:column; gap:10px; }
.oc-kv{ display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:9px 11px; border-radius:8px; background:var(--surface-muted,var(--card2)); font-size:12.5px; }
.oc-kv > span{ color:var(--text-muted); font-weight:700; }
.oc-kv > b{ color:var(--text); min-width:0; overflow-wrap:anywhere; text-align:end; }
.oc-label-f{ font:700 11.5px/1.3 inherit; color:var(--text-light); }
.oc-hint{ font-size:11px; color:var(--text-muted); margin:0; }

@media (max-width:900px){
  /* One card per employee; the grid columns become stacked rows so nothing is clipped. */
  .oc-main{ grid-template-columns:auto 1fr; grid-template-areas:"check who" ". manager" ". reports" ". actions";
    gap:8px 10px; padding:12px; }
  .oc-check{ grid-area:check; align-self:start; }
  .oc-who{ grid-area:who; }
  .oc-manager{ grid-area:manager; }
  .oc-reports{ grid-area:reports; }
  .oc-actions{ grid-area:actions; flex-wrap:wrap; }
  .oc-actions .ac-ghost{ min-height:38px; flex:1 1 auto; justify-content:center; }
  .oc-toolbar .ac-search, .oc-toolbar .ac-select{ flex:1 1 140px; min-width:0; }
  .oc-stats{ margin-inline-start:0; }
  /* iOS zooms a focused control under 16px */
  .oc-toolbar .ac-search, .oc-toolbar .ac-select, .oc-form .form-control{ font-size:16px !important; }
}

/* ══════════════════════════════════════════════════════════════════════════════
   ROLE HIERARCHY — editable  (role-hierarchy-r182)
   Extends the existing .ac-role-tree; no new visual language, same tokens.
   ══════════════════════════════════════════════════════════════════════════════ */
.rh-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.rh-head-actions{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.rh-role-copy{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.rh-parent-hint{ color:var(--text-muted); }
.ac-role-card.is-moved{ border-inline-start:3px solid var(--primary); }
.rh-change{ flex-shrink:0; }
.rh-note{ display:flex; align-items:center; gap:7px; padding:9px 11px; margin-bottom:10px;
  border-radius:var(--radius-sm,8px); background:var(--warning-light,#FFFBEB); color:var(--text);
  border:1px solid color-mix(in srgb, var(--warning,#D97706) 30%, transparent); font-size:12px; font-weight:600; }
.rh-hint{ font-size:12px; color:var(--text-muted); }
.rh-error{ display:flex; align-items:flex-start; gap:7px; font-size:12px; font-weight:700;
  color:var(--danger,var(--danger)); padding:9px 11px; border-radius:var(--radius-sm,8px);
  background:color-mix(in srgb, var(--danger,var(--danger-light)) 10%, transparent); }
.rh-impact{ display:flex; flex-direction:column; gap:9px; }
.rh-impact-head{ display:flex; align-items:center; gap:8px; font-size:13px; font-weight:800; color:var(--text); }
.rh-impact-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.rh-impact-grid > div{ background:var(--surface-muted,var(--card2)); border-radius:var(--radius-sm,8px);
  padding:8px 10px; min-width:0; }
.rh-impact-grid span{ display:block; font-size:10px; font-weight:800; color:var(--text-muted);
  text-transform:uppercase; letter-spacing:.03em; }
.rh-impact-grid b{ font-size:13px; color:var(--text); overflow-wrap:anywhere; }
.rh-impact-list{ display:flex; flex-direction:column; gap:6px; }
.rh-impact-row{ display:flex; flex-direction:column; gap:2px; padding:8px 10px;
  border-radius:var(--radius-sm,8px); background:var(--surface-muted,var(--card2)); font-size:12px; }
.rh-gain{ color:var(--ok,var(--accent-text)); font-weight:700; }
.rh-lose{ color:var(--danger,var(--danger)); font-weight:700; }
.rh-sync-summary{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.rh-sync-list{ display:flex; flex-direction:column; gap:6px; max-height:44vh; overflow-y:auto; }
.rh-sync-row{ display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1.2fr) minmax(0,1fr);
  align-items:center; gap:10px; padding:9px 11px; border-radius:var(--radius-sm,8px);
  background:var(--card); border:1px solid var(--border-light,var(--border)); font-size:12px; }
.rh-sync-who b{ display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-sync-move{ display:flex; align-items:center; gap:7px; min-width:0; }
.rh-sync-move b{ color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rh-sync-end{ display:flex; flex-direction:column; gap:2px; align-items:flex-end; text-align:end; }
/* Org Chart: role column + manager source badge */
.oc-role{ min-width:0; }
.oc-role b{ font-size:12.5px; font-weight:700; color:var(--text); display:block;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.oc-src{ display:inline-flex; align-items:center; margin-top:3px; padding:2px 8px; border-radius:20px;
  font-size:10px; font-weight:800; }
.oc-src-manual{ background:color-mix(in srgb, var(--primary) 16%, transparent); color:var(--text);
  border:1px solid var(--primary); }
.oc-src-auto{ background:var(--surface-muted,var(--card2)); color:var(--text-muted); border:1px solid var(--border); }
.oc-why{ color:var(--warning,#D97706); font-weight:700; }
/* the Org Chart row gains a Role column on desktop */
.oc-main{ grid-template-columns:auto minmax(0,1.8fr) minmax(0,1.1fr) minmax(0,1.4fr) auto auto; }

@media (max-width:900px){
  .rh-head-actions{ width:100%; }
  .rh-head-actions button{ flex:1 1 auto; justify-content:center; min-height:40px; }
  .rh-impact-grid, .rh-sync-summary{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rh-sync-row{ grid-template-columns:1fr; gap:6px; }
  .rh-sync-end{ align-items:flex-start; text-align:start; }
  .ac-role-card{ flex-wrap:wrap; }
  .rh-change{ width:100%; min-height:38px; }
  /* Deep trees must not force horizontal scrolling: cap the indent and lean on the
     "Reports to X" label instead. */
  .ac-role-node{ --level-indent: min(calc(var(--level) * 12px), 24px); }
  .oc-main{ grid-template-columns:auto 1fr;
    grid-template-areas:"check who" ". role" ". manager" ". reports" ". actions"; }
  .oc-role{ grid-area:role; }
  .rh-sync-list{ max-height:52vh; }
}

/* ── Role Hierarchy drag & drop (role-hierarchy-r183) ────────────────────────
   Desktop only. The handle, the target states and the root zone are all logical-property
   based so FA/AR mirror without a second rule set. */
.rh-handle{ cursor:grab; color:var(--text-muted); font-size:13px; line-height:1; letter-spacing:-1px;
  padding-inline-end:2px; flex-shrink:0; user-select:none; }
.rh-handle:active{ cursor:grabbing; }
.ac-role-card[draggable="true"]{ transition:box-shadow .12s, border-color .12s, opacity .12s; }
.ac-role-card.is-drag-source{ opacity:.5; }
body.rh-dragging .ac-role-card.is-valid-target{ border-style:dashed; border-color:var(--primary); }
body.rh-dragging .ac-role-card.is-invalid-target{ opacity:.45; }
body.rh-dragging .ac-role-card.is-drop-over{
  border-style:solid; border-color:var(--primary);
  box-shadow:0 0 0 2px color-mix(in srgb, var(--primary) 40%, transparent);
  background:color-mix(in srgb, var(--primary) 10%, var(--card));
}
.rh-root-zone{ display:none; align-items:center; justify-content:center; gap:7px;
  padding:10px 12px; margin-bottom:10px; border-radius:var(--radius-sm,10px);
  border:1px dashed var(--border); color:var(--text-muted);
  font:700 12px/1 inherit; }
body.rh-dragging .rh-root-zone{ display:flex; }
body.rh-dragging .rh-root-zone.is-valid-target{ border-color:var(--primary); color:var(--text); }
body.rh-dragging .rh-root-zone.is-drop-over{
  border-style:solid; border-color:var(--primary);
  background:color-mix(in srgb, var(--primary) 10%, var(--card)); }
.rh-dnd-hint{ font-size:11px; color:var(--text-muted); margin:0 0 10px; }
[dir="rtl"] .rh-root-zone svg{ transform:none; }

@media (max-width:900px){
  /* Touch build: no drag affordance at all, so a long-press never fights the scroller. */
  .rh-handle, .rh-root-zone, .rh-dnd-hint{ display:none !important; }
}

/* ── Work Center attachment field ──────────────────────────────────────────
   Reuses the CRM's own tokens so it inherits light/dark and RTL without a
   second theme story. The row wraps rather than scrolls, so a long filename
   on a 390px screen never pushes the page sideways. */
.wc-file { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.wc-file-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.wc-file-btn { flex: 0 0 auto; cursor: pointer; }
.wc-file-state { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1 1 12rem; }
.wc-file-name { color: var(--text); text-decoration: underline; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.wc-file-empty { color: var(--muted); }
.wc-file-busy { color: var(--muted); }
.wc-file-err { color: var(--danger, #c0392b); }
.wc-file-x { background: none; border: 0; color: var(--muted); cursor: pointer; padding: 2px 6px;
  font: inherit; text-decoration: underline; }
.wc-file-x:hover { color: var(--danger, #c0392b); }
/* The label is the visible control, so it must show focus when the hidden input has it. */
.wc-file-input:focus-visible + .wc-file-btn { outline: 2px solid var(--brand, #087f65); outline-offset: 2px; }
@media (max-width: 430px) {
  .wc-file { gap: 6px; }
  .wc-file-state { flex-basis: 100%; }
}


/* ── Work Center: parallel task groups (r191) ────────────────────────────────
   A group is a stage that contains tasks running at the same time. The children are indented
   under it and each keeps the ordinary step styling, so the status colours already in use apply
   without a second vocabulary. Everything is token-based and inherits direction, so it mirrors in
   Persian and Arabic and follows both themes. */
.wc-group-children {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
  padding-inline-start: 12px;
  border-inline-start: 2px solid var(--border, var(--border));
}
.wc-group-child {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border, var(--border));
  border-radius: 10px;
  background: var(--card, #fff);
}
.wc-group-child-body { flex: 1; min-width: 0; }
.wc-group-mark {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid var(--border, var(--border));
  color: var(--text-muted, #797E86);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}
.wc-group-child.wc-step-completed .wc-group-mark { color: var(--ok-text, #1F6F45); border-color: currentColor; }
.wc-group-child.wc-step-rejected .wc-group-mark { color: var(--danger, #B4402F); border-color: currentColor; }
.wc-group-child.wc-step-blocked .wc-group-mark { color: var(--warn-text, #8A5A12); border-color: currentColor; }
.wc-group-child.wc-step-cancelled { opacity: .62; }
.wc-group-count b { font-variant-numeric: tabular-nums; }
.wc-chip-group { background: var(--bg, #F6F7FF); }

/* the builder's group editor */
.wc-group-editor {
  margin-top: 10px;
  padding: 12px;
  border: 1px dashed var(--border, var(--border));
  border-radius: 10px;
  background: var(--bg, #F6F7FF);
}
.wc-group-tasks-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin: 6px 0 8px;
}
.wc-group-task {
  padding: 10px 12px;
  margin-bottom: 8px;
  border: 1px solid var(--border, var(--border));
  border-radius: 10px;
  background: var(--card, #fff);
}
@media (max-width: 900px) {
  .wc-group-children { padding-inline-start: 8px; }
  .wc-group-child { padding: 9px 10px; }
  .wc-group-editor { padding: 10px; }
}

/* ── Useful Links (r191) ─────────────────────────────────────────────────────
   A directory, so the desktop view is a table and the phone view is cards - the same split the
   rest of the CRM uses. Everything is token-based and inherits direction, so it follows both
   themes and mirrors in Persian and Arabic; only the domain is pinned LTR. */
.ul-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.ul-head-title { display: flex; align-items: baseline; gap: 10px; }
.ul-head-title h2 { margin: 0; font-size: 20px; font-weight: 800; color: var(--text); }
.ul-count {
  min-width: 26px; padding: 2px 8px; border-radius: 99px;
  background: var(--bg, #F6F7FF); color: var(--text-muted, #797E86);
  font-size: 11px; font-weight: 800; text-align: center; font-variant-numeric: tabular-nums;
}
.ul-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.ul-search-wrap {
  flex: 1 1 240px; min-width: 0; display: flex; align-items: center; gap: 8px;
  padding: 0 12px; height: 40px; border: 1px solid var(--border, var(--border));
  border-radius: 10px; background: var(--card, #fff); color: var(--text-muted, #797E86);
}
.ul-search { flex: 1; min-width: 0; border: 0; outline: none; background: none; color: var(--text); font: inherit; font-size: 13px; }
.ul-filter {
  height: 40px; padding: 0 10px; border: 1px solid var(--border, var(--border));
  border-radius: 10px; background: var(--card, #fff); color: var(--text); font: inherit; font-size: 13px;
}
.ul-table-wrap { overflow-x: auto; border: 1px solid var(--border, var(--border)); border-radius: 12px; background: var(--card, #fff); }
.ul-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ul-table th, .ul-table td { padding: 11px 14px; text-align: start; border-bottom: 1px solid var(--border, var(--border)); vertical-align: middle; }
.ul-table th { font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; color: var(--text-muted, #797E86); background: var(--bg, #F6F7FF); }
.ul-table tbody tr:last-child td { border-bottom: 0; }
.ul-table td b { display: block; color: var(--text); font-weight: 750; }
.ul-table td small { display: block; margin-top: 2px; color: var(--text-muted, #797E86); font-size: 11px; }
.ul-chip { display: inline-block; padding: 3px 9px; border-radius: 99px; background: var(--bg, #F6F7FF); color: var(--text-muted, #797E86); font-size: 11px; font-weight: 700; }
.ul-domain { color: var(--text-muted, #797E86); font-size: 12px; direction: ltr; text-align: start; unicode-bidi: isolate; }
.ul-muted { color: var(--text-muted, #797E86); }
.ul-actions { display: flex; gap: 6px; justify-content: flex-end; white-space: nowrap; }
.ul-cards { display: none; }
.ul-form-err { margin-top: 10px; padding: 9px 11px; border-radius: 9px; background: rgba(180, 64, 47, .1); color: var(--danger, #B4402F); font-size: 12px; }

@media (max-width: 900px) {
  /* the table's four columns cannot fit a phone, so it gives way to cards */
  .ul-table-wrap { display: none; }
  .ul-cards { display: flex; flex-direction: column; gap: 10px; }
  .ul-card {
    display: flex; flex-direction: column; gap: 5px; padding: 14px;
    border: 1px solid var(--border, var(--border)); border-radius: 14px; background: var(--card, #fff);
  }
  .ul-card-title { font-size: 15px; font-weight: 800; color: var(--text); }
  .ul-card .ul-chip { align-self: flex-start; }
  .ul-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
  .ul-card-actions .btn { min-height: 36px; }
  .ul-head h2 { font-size: 18px; }
  .ul-toolbar { gap: 8px; }
}

/* ==================== Calendar connection settings modal (r198) ==================== */
.cal-modal{display:flex;flex-direction:column;gap:12px}
.cal-modal-head{display:flex;align-items:center;gap:8px}
.cal-badge{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13px;padding:4px 10px;border-radius:999px}
.cal-badge.is-ok{color:#0f7b3f;background:rgba(22,163,74,.12)}
.cal-rows{display:flex;flex-direction:column;gap:8px}
.cal-row{display:flex;justify-content:space-between;gap:12px;align-items:baseline;font-size:13px;border-bottom:1px solid var(--border,#e5e7eb);padding-bottom:7px}
.cal-row>span{color:var(--text-muted,#6b7280);flex:0 0 auto}
.cal-row>b{text-align:end;min-width:0}
.cal-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%}
.cal-wrap{word-break:break-word;overflow-wrap:anywhere}
.cal-result.is-ok{color:#0f7b3f}
.cal-result.is-warn{color:#b45309}
.cal-result.is-err{color:var(--danger,var(--danger))}
.cal-run-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:8px}
.cal-run-cell{display:flex;flex-direction:column;gap:2px;background:var(--surface-2,#f8fafc);border:1px solid var(--border,#e5e7eb);border-radius:10px;padding:8px 10px}
.cal-run-cell>span{font-size:11px;color:var(--text-muted,#6b7280)}
.cal-run-cell>b{font-size:18px;font-variant-numeric:tabular-nums}
.cal-run-empty,.cal-run-details{font-size:12px;color:var(--text-muted,#6b7280)}
.cal-run-details{margin-top:2px}
.cal-run-details summary{cursor:pointer;color:var(--brand,var(--accent-text));font-weight:600}
.cal-run-details ul{margin:6px 0 0;padding-inline-start:18px;display:flex;flex-direction:column;gap:4px}
.cal-run-details li{font-size:12px;word-break:break-word}
.cal-empty{display:flex;flex-direction:column;gap:4px}
.cal-empty>b{font-size:14px}
.cal-empty>p{font-size:12px;color:var(--text-muted,#6b7280);margin:0}
.cal-form{display:flex;flex-direction:column;gap:10px}
.cal-field{display:flex;flex-direction:column;gap:4px;font-size:12px}
.cal-field>span{font-weight:600}
.cal-input{width:100%;box-sizing:border-box;padding:9px 11px;border:1px solid var(--border,#d1d5db);border-radius:9px;font-size:14px;background:var(--surface,#fff);color:var(--text)}
.cal-form small{color:var(--text-muted,#6b7280);font-size:11px}
.cal-status-msg{font-size:12px;border-radius:8px;padding:8px 10px}
.cal-status-msg.is-ok{color:#0f7b3f;background:rgba(22,163,74,.10)}
.cal-status-msg.is-error{color:var(--danger,var(--danger));background:rgba(220,38,38,.08)}
.cal-alt{font-size:11px;color:var(--text-muted,#6b7280)}
@media (max-width:480px){
  .cal-row{flex-direction:column;gap:2px}
  .cal-row>b{text-align:start}
  .cal-ellipsis{max-width:100%}
  #small-modal-footer .btn{flex:1 1 auto}
}

/* ==================== Generic Deal-stage inline field block (r200) ==================== */
.dwf-fieldblock{display:flex;flex-direction:column;gap:12px;margin-bottom:14px}
.dwf-missing{background:var(--surface-2,#f8fafc);border:1px solid var(--border,#e5e7eb);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.dwf-missing-head{font-weight:800;font-size:13px;color:var(--text)}
.dwf-allcomplete{color:#0f7b3f;font-weight:700;font-size:13px}
.dwf-stillreq{background:rgba(180,83,9,.08);border:1px solid rgba(180,83,9,.25);border-radius:10px;padding:10px 12px;font-size:12px}
.dwf-stillreq-title{font-weight:800;color:#b45309}
.dwf-stillreq ul{margin:6px 0 0;padding-inline-start:18px;display:flex;flex-direction:column;gap:3px}
.dwf-fieldblock .form-control.is-invalid{border-color:var(--danger,var(--danger));background:rgba(220,38,38,.04)}
.dwf-fieldblock .dwf-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
@media (max-width:480px){ .dwf-fieldblock .dwf-actions{flex-direction:column-reverse} .dwf-fieldblock .dwf-actions .btn{width:100%} }

/* ==================== Deals Assigned-Agent filter (r201) ==================== */
.crm-dl-agentfilter{display:inline-flex;position:relative}
.crm-dl-agentinput{min-width:170px}
.crm-filter-chip{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2,#f1f5f9);border:1px solid var(--border,#d8dee6);border-radius:999px;padding:4px 6px 4px 12px;font-size:12px;font-weight:600;color:var(--text)}
.crm-filter-chip button{border:0;background:transparent;cursor:pointer;font-size:15px;line-height:1;color:var(--text-muted,var(--text-secondary));padding:0 2px;border-radius:50%}
.crm-filter-chip button:hover{color:var(--danger,var(--danger))}
@media (max-width:480px){ .crm-dl-agentinput{min-width:0;width:100%} .crm-dl-agentfilter{flex:1 1 100%} }

/* Fields-complete-but-action-remaining state (distinct from all-complete) — r202 */
.dwf-fieldsok{color:#0f7b3f;font-weight:700;font-size:13px}
/* r203 Deal Contact hardening: inline Contact selector + honest "not linked" state */
.dwf-contact-missing{color:#c0392b;font-weight:700}
.dwf-contactfix{margin-top:8px;padding:10px;border:1px dashed var(--border,#d8dee6);border-radius:8px;background:var(--surface-2,#f7f9fc)}
.dwf-contactfix .pfc-combo{margin:0}
/* r204 AML lifecycle in Documents & AML step */
.dwf-aml-head{margin-bottom:6px}
.dwf-aml-note{margin:6px 0;padding:8px 10px;border-radius:8px;background:var(--surface-2,#f4f7fb);font-size:13px;line-height:1.45}
.dwf-aml-note.dwf-warn{background:rgba(214,158,46,.12);color:#8a6100}
.dwf-aml-note.dwf-bad{background:rgba(192,57,43,.10);color:#a1281c}
.dwf-aml-note.dwf-ok{background:rgba(15,123,63,.10);color:#0f7b3f}
.dwf-officer-controls{margin-top:8px;padding-top:8px;border-top:1px dashed var(--border,#d8dee6);flex-wrap:wrap;gap:6px;align-items:center}
.dwf-doc-status.is-superseded{background:rgba(214,158,46,.15);color:#8a6100}
.dwf-doc-status.is-more_info_required{background:rgba(214,158,46,.15);color:#8a6100}
.dwf-doc-status.is-rejected{background:rgba(192,57,43,.12);color:#a1281c}
/* ==================== r217: Deal Workflow dialog + Documents & AML UX ==================== */
/* Dialog shell: wide on desktop, full-screen sheet on phones; sticky header/footer come from the
   modal's flex column (header, scrollable body, footer). No horizontal overflow at any width. */
#small-modal.dwf-modal .modal{width:min(1080px,96vw)!important;max-width:96vw!important;max-height:min(92vh,980px)!important;display:flex;flex-direction:column}
#small-modal.dwf-modal .modal-body{padding:16px 22px 22px;overflow-x:hidden;overscroll-behavior:contain}
#small-modal.dwf-modal .modal-header{position:sticky;top:0;z-index:6;background:var(--card)}
#small-modal.dwf-modal .modal-footer{position:sticky;bottom:0;z-index:6;flex-wrap:wrap;gap:10px;padding:12px 22px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));background:var(--surface-muted,var(--card))}
#small-modal.dwf-modal .modal-footer .btn{min-height:44px}
#small-modal.dwf-modal .modal-footer .dwf-footer-hint{flex:1 1 220px;min-width:0;white-space:normal;line-height:1.35}
#small-modal.dwf-modal .modal-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
/* Stepper: every stage always visible; wraps into a 5-column grid instead of a clipped strip. */
#small-modal.dwf-modal .dwf-stepper{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;overflow:visible;position:static;padding-bottom:10px;margin:0 0 12px}
#small-modal.dwf-modal .dwf-step{width:100%;min-width:0;padding:6px 8px;gap:8px;align-items:center}
#small-modal.dwf-modal .dwf-step__connector{display:none}
#small-modal.dwf-modal .dwf-step__copy{min-width:0}
#small-modal.dwf-modal .dwf-step__copy b{white-space:normal;line-height:1.15;overflow-wrap:anywhere}
#small-modal.dwf-modal .dwf-step__copy small{max-width:none;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.2;overflow-wrap:anywhere}
.dwf-body{min-width:0}
/* Header summary card */
.dwf-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 18px;padding:12px 14px;border:1px solid var(--border-light,var(--border));border-radius:14px;background:var(--surface-muted,var(--card));margin:0 0 14px}
.dwf-summary-item{min-width:0}
.dwf-summary-item small{display:block;font-size:11px;font-weight:700;color:var(--text-muted);text-transform:none;letter-spacing:.2px;margin-bottom:2px}
.dwf-summary-item b,.dwf-summary-item span{display:block;font-size:13.5px;color:var(--text);overflow-wrap:anywhere}
.dwf-summary-progress{display:flex;align-items:center;gap:8px}
.dwf-summary-bar{flex:1;height:6px;border-radius:99px;background:var(--track,rgba(0,0,0,.08));overflow:hidden;min-width:60px}
.dwf-summary-bar i{display:block;height:100%;background:var(--success,var(--accent-soft));border-radius:99px}
.dwf-summary-next{font-size:12px;color:var(--gold,#8a6d2f);font-weight:700;background:none;border:none;padding:0;cursor:pointer;font-family:inherit;text-align:start}
/* Group cards (accordions) */
.dwf-gcard{border:1px solid var(--border-light,var(--border));border-radius:14px;margin:0 0 12px;background:var(--card);overflow:hidden}
.dwf-gcard>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:12px 14px;min-height:48px;font-weight:800;font-size:13.5px;color:var(--text);user-select:none}
.dwf-gcard>summary::-webkit-details-marker{display:none}
.dwf-gcard>summary::before{content:"";width:8px;height:8px;border-right:2px solid var(--text-muted);border-bottom:2px solid var(--text-muted);transform:rotate(-45deg);transition:.15s;flex-shrink:0}
[dir="rtl"] .dwf-gcard>summary::before{transform:rotate(135deg)}
.dwf-gcard[open]>summary::before{transform:rotate(45deg)}
.dwf-gcard>summary .dwf-gtitle{flex:1;min-width:0;overflow-wrap:anywhere}
.dwf-gprogress{font-size:11.5px;font-weight:800;padding:3px 10px;border-radius:99px;background:var(--track,rgba(0,0,0,.06));color:var(--text-light);white-space:nowrap}
.dwf-gprogress.is-done{background:color-mix(in srgb, var(--success,var(--accent-soft)) 16%, transparent);color:var(--success,var(--accent-text))}
.dwf-gprogress.is-open{background:color-mix(in srgb, #d97706 16%, transparent);color:#b45309}
.dwf-gcard.is-aml{border-color:color-mix(in srgb, var(--gold,#b08d3e) 55%, var(--border))}
.dwf-gcard.is-aml>summary{background:color-mix(in srgb, var(--gold,#b08d3e) 8%, var(--card))}
.dwf-gbody{padding:0 14px 12px}
/* Document rows: a real 4-column table on desktop, stacked cards on phones */
.dwf-docs-table{display:grid;grid-template-columns:minmax(0,1fr) 110px 170px auto;gap:0 12px;align-items:center}
.dwf-docs-table .dwf-th{font-size:11px;font-weight:800;color:var(--text-muted);padding:8px 0 6px;border-bottom:1px solid var(--border-light,var(--border))}
.dwf-doc-row{display:contents}
.dwf-doc-row>*{padding:10px 0;border-bottom:1px solid var(--border-light,var(--border));min-width:0}
.dwf-doc-row:last-child>*{border-bottom:none}
.dwf-doc-name{display:flex;flex-direction:column;gap:2px}
.dwf-doc-name b{font-size:13.5px;font-weight:700;line-height:1.3;white-space:normal;overflow-wrap:anywhere}
.dwf-doc-file{font-size:11.5px;color:var(--text-muted);white-space:normal;overflow-wrap:anywhere;max-width:none}
.dwf-doc-req{display:inline-block;font-size:11px;font-weight:800;padding:3px 9px;border-radius:99px;background:var(--track,rgba(0,0,0,.06));color:var(--text-muted);white-space:nowrap}
.dwf-doc-req.is-req{background:color-mix(in srgb, var(--gold,#b08d3e) 18%, transparent);color:var(--gold,#8a6d2f)}
.dwf-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;padding:5px 11px;border-radius:99px;background:var(--track,rgba(0,0,0,.06));color:var(--text-light);white-space:nowrap}
.dwf-pill::before{content:"";width:8px;height:8px;border-radius:99px;background:currentColor;flex-shrink:0}
.dwf-pill.is-missing{background:color-mix(in srgb, var(--danger,var(--danger-light)) 12%, transparent);color:var(--danger,var(--danger))}
.dwf-pill.is-missing.is-optional{background:var(--track,rgba(0,0,0,.06));color:var(--text-muted)}
.dwf-pill.is-uploaded,.dwf-pill.is-accepted{background:color-mix(in srgb, var(--success,var(--accent-soft)) 16%, transparent);color:var(--success,var(--accent-text))}
.dwf-pill.is-rejected{background:color-mix(in srgb, var(--danger,var(--danger-light)) 14%, transparent);color:var(--danger,var(--danger))}
.dwf-pill.is-needs_replacement{background:color-mix(in srgb, #d97706 18%, transparent);color:#b45309}
/* A retained document: uploaded against a requirement this deal no longer has. It is real work
   somebody did, so it stays legible — but muted, so it never competes with the live checklist. */
.dwf-pill.is-kept{background:var(--track,rgba(0,0,0,.06));color:var(--text-muted);margin-inline-start:6px}
.dwf-doc-row.is-kept .dwf-doc-name b{color:var(--text-muted)}
.dwf-doc-note.is-kept{color:var(--text-muted)}
.dwf-doc-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.dwf-doc-actions .btn{min-height:36px;padding:6px 12px!important;font-size:12px!important;white-space:nowrap}
.dwf-doc-note{grid-column:1 / -1;font-size:12px;color:#b45309;padding:0 0 10px;border-bottom:1px solid var(--border-light,var(--border))}
.dwf-doc-note.is-bad{color:var(--danger,var(--danger))}
.dwf-reason{margin:8px 0 0;padding:8px 10px;border-radius:8px;background:rgba(192,57,43,.08);color:#a1281c;font-size:12.5px}


/* ── PF Project Sync: token + update history ────────────────────────────────────────────────── */
.pf-hist-filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.pf-hist-filters .form-control{min-height:38px;font-size:12.5px;flex:1 1 150px;max-width:230px}
.pf-hist-wrap{overflow-x:auto}
.pf-hist-table{width:100%;font-size:12.5px;min-width:600px}
.pf-hist-when{font-weight:700}
.pf-hist-sub{font-size:11px;color:var(--text-muted);margin-top:2px}
.pf-hist-counters{font-variant-numeric:tabular-nums;color:var(--text-light);white-space:nowrap}
.pf-hist-detail{color:var(--text-muted);max-width:340px;overflow-wrap:anywhere}
.pf-hist-act{text-align:end;white-space:nowrap}
.pf-hist-badge{display:inline-block;font-size:11px;font-weight:800;border-radius:99px;padding:3px 10px;white-space:nowrap}
.pf-hist-badge+.pf-hist-badge{margin-inline-start:6px}
.pf-hist-badge.is-warn{background:color-mix(in srgb, var(--gold,#b08d3e) 14%, transparent);color:var(--gold,#b08d3e)}
.pf-hist-pager{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px solid var(--border-light,var(--border))}
.pf-hist-count{font-size:12px;color:var(--text-muted);font-variant-numeric:tabular-nums}
.pf-hist-pagebtns{display:flex;align-items:center;gap:8px}
.pf-hist-pageno{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums;min-width:52px;text-align:center}
@media (max-width:900px){
  .pf-hist-filters .form-control{max-width:none;flex:1 1 100%}
  .pf-hist-detail{max-width:none}
  .pf-hist-pager{justify-content:center}
}
/* ── Deal document library ──────────────────────────────────────────────────────────────────
   A wide dialog with the list on one side and the file itself on the other. Below 900px — the
   CRM's mobile boundary — the two become one column and the list hands over to the file, with a
   Back control and the back gesture both returning to the list. */
/* It opens ON TOP of the Deal Workflow dialog rather than replacing it, so closing the file list
   puts the user back exactly where they were. Both are .modal-overlay and this one sits earlier in
   the document, so at equal z-index the workflow would paint over it. !important is needed because
   below 900px a blanket rule gives EVERY open overlay z-index:300000!important — which made the two
   tie, and a tie is decided by document order. */
#deal-docs-modal:not(.hidden){z-index:300010!important}
#deal-docs-modal .modal.ddv{max-width:min(1180px,96vw);width:min(1180px,96vw);height:min(88vh,900px);display:flex;flex-direction:column}
#deal-docs-modal .modal-body.ddv-body{flex:1;min-height:0;padding:0;overflow:hidden;display:flex}
.ddv-split{display:grid;grid-template-columns:minmax(260px,320px) 1fr;flex:1;min-height:0;width:100%}
.ddv-list{border-inline-end:1px solid var(--border-light,var(--border));overflow:auto;padding:10px;min-height:0;background:var(--surface-2,transparent)}
.ddv-group{margin-bottom:14px}
.ddv-gtitle{margin:0 0 6px;font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);display:flex;align-items:center;gap:6px}
.ddv-gcount{font-weight:700;color:var(--text-light);background:var(--track,rgba(0,0,0,.06));border-radius:99px;padding:1px 7px}
.ddv-item{display:flex;align-items:flex-start;gap:10px;width:100%;text-align:start;background:transparent;border:1px solid transparent;border-radius:10px;padding:9px 10px;cursor:pointer;color:inherit;min-height:44px}
.ddv-item:hover{background:var(--track,rgba(0,0,0,.05))}
.ddv-item.is-active{background:var(--accent-soft,rgba(0,128,128,.12));border-color:var(--accent,currentColor)}
.ddv-item__text{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.ddv-item__text b{font-size:13px;font-weight:700;overflow-wrap:anywhere}
.ddv-item__text small{font-size:11.5px;color:var(--text-muted);overflow-wrap:anywhere}
.ddv-item__meta{color:var(--text-light)}
.ddv-ico{width:22px;height:26px;flex:none;border-radius:3px;border:1px solid var(--border);background:var(--track,rgba(0,0,0,.05));margin-top:2px;position:relative}
.ddv-ico::after{content:"";position:absolute;inset:auto 4px 4px 4px;height:3px;border-radius:2px;background:var(--text-muted);opacity:.5}
.ddv-ico--image::after{background:var(--success,#2e7d5b);opacity:.85}
.ddv-ico--pdf::after{background:var(--danger,#c0392b);opacity:.85}
.ddv-tag{font-size:10.5px;font-weight:800;border-radius:99px;padding:2px 7px;background:var(--track,rgba(0,0,0,.06));color:var(--text-muted);white-space:nowrap;align-self:center}
.ddv-tag.is-bad{background:color-mix(in srgb, var(--danger,#c0392b) 14%, transparent);color:var(--danger,#c0392b)}
.ddv-view{display:flex;flex-direction:column;min-width:0;min-height:0}
.ddv-vhead{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border-light,var(--border));flex-wrap:wrap}
.ddv-vtitle{display:flex;flex-direction:column;min-width:0;flex:1}
.ddv-vtitle b{font-size:14px;overflow-wrap:anywhere}
.ddv-vtitle small{font-size:11.5px;color:var(--text-muted);overflow-wrap:anywhere}
.ddv-actions{display:flex;gap:8px;flex-wrap:wrap}
.ddv-actions .btn{min-height:36px}
.ddv-back{display:none;gap:6px;align-items:center}
/* A chevron that turns with the writing direction. The borders are PHYSICAL on purpose: logical
   borders flip sides in RTL as well, so the corner ended up pointing down instead of right. Only
   the rotation changes. */
.ddv-back::before{content:"";width:7px;height:7px;border-left:2px solid currentColor;border-top:2px solid currentColor;transform:rotate(-45deg);margin-inline-end:2px}
[dir="rtl"] .ddv-back::before{transform:rotate(135deg)}
.ddv-note{margin:10px 14px 0;padding:8px 10px;border-radius:8px;background:var(--track,rgba(0,0,0,.05));color:var(--text-muted);font-size:12px}
.ddv-stage{flex:1;min-height:0;position:relative;overflow:auto;background:var(--surface-2,rgba(0,0,0,.03));display:flex;align-items:center;justify-content:center;padding:14px}
.ddv-stage--image img{max-width:100%;max-height:100%;transform-origin:center center;transition:transform .12s ease;border-radius:6px;box-shadow:0 2px 14px rgba(0,0,0,.14)}
.ddv-stage--pdf{padding:0;display:block}
.ddv-stage--pdf iframe{width:100%;height:100%;border:0;display:block;background:var(--surface,#fff)}
.ddv-zoom{display:flex;align-items:center;gap:6px;justify-content:center;padding:8px;border-top:1px solid var(--border-light,var(--border))}
.ddv-zoom__val{font-size:12px;font-weight:700;min-width:46px;text-align:center;font-variant-numeric:tabular-nums;color:var(--text-muted)}
.ddv-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:28px;text-align:center;color:var(--text-muted);font-size:13px}
.ddv-state.is-bad{color:var(--danger,#c0392b)}
.ddv-state .ddv-sub{font-size:11.5px;color:var(--text-light)}
.ddv-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.ddv-spinner{width:26px;height:26px;border-radius:50%;border:3px solid var(--border);border-top-color:var(--accent,currentColor);animation:ddvspin .8s linear infinite}
@keyframes ddvspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ddv-spinner{animation-duration:2.4s}.ddv-stage--image img{transition:none}}
@media (max-width:900px){
  #deal-docs-modal .modal.ddv{max-width:100vw;width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .ddv-split{grid-template-columns:1fr}
  .ddv-split.is-list .ddv-view{display:none}
  .ddv-split.is-preview .ddv-list{display:none}
  .ddv-list{border-inline-end:0}
  .ddv-back{display:inline-flex}
  .ddv-stage{padding:8px}
}
/* AML card */
.dwf-aml-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px}
.dwf-aml-grid .form-group{margin-bottom:6px}
.dwf-aml-officer{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:10px;background:var(--surface-muted,var(--card));border:1px solid var(--border-light,var(--border));margin:10px 0}
.dwf-aml-officer b{font-size:13px}
.dwf-timeline{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.dwf-timeline li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start}
.dwf-timeline .dot{width:10px;height:10px;border-radius:99px;background:var(--border);margin-top:5px}
.dwf-timeline .dot.is-ok{background:var(--success,var(--accent-soft))}.dwf-timeline .dot.is-warn{background:#d97706}.dwf-timeline .dot.is-bad{background:var(--danger,var(--danger-light))}
.dwf-timeline .card{padding:9px 11px;border-radius:10px;border:1px solid var(--border-light,var(--border));background:var(--card);font-size:12.5px;line-height:1.45;overflow-wrap:anywhere}
.dwf-timeline .card.is-warn{background:rgba(214,158,46,.10);border-color:rgba(214,158,46,.4)}
.dwf-timeline .card.is-bad{background:rgba(192,57,43,.08);border-color:rgba(192,57,43,.35)}
.dwf-timeline .card.is-ok{background:rgba(15,123,63,.08);border-color:rgba(15,123,63,.35)}
.dwf-timeline .card small{display:block;color:var(--text-muted);font-size:11px;margin-top:2px}
.dwf-redflag-reason{display:none}.dwf-redflag-reason.is-on{display:block}
.dwf-officer-controls .btn{min-height:40px}
.dwf-subhead{font-size:12px;font-weight:800;color:var(--text-muted);margin:12px 0 6px}
/* Phones: full-screen sheet, one card per document, big touch targets */
@media (max-width:640px){
  #small-modal.dwf-modal .modal{width:100%!important;max-width:100%!important;height:100%!important;max-height:100%!important;border-radius:0!important;margin:0!important}
  #small-modal.dwf-modal .modal-body{padding:12px 14px 16px}
  #small-modal.dwf-modal .modal-footer{padding:10px 14px;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}
  #small-modal.dwf-modal .modal-footer .btn{flex:1 1 auto;min-height:48px}
  #small-modal.dwf-modal .dwf-stepper{gap:4px}
  #small-modal.dwf-modal .dwf-step{flex-direction:column;align-items:center;text-align:center;padding:6px 2px;min-height:64px;gap:4px}
  #small-modal.dwf-modal .dwf-step__badge{width:24px;height:24px;font-size:11px}
  #small-modal.dwf-modal .dwf-step__copy b{font-size:10.5px}
  #small-modal.dwf-modal .dwf-step__copy small{display:none}
  .dwf-summary{grid-template-columns:1fr 1fr;gap:8px 12px;padding:10px 12px}
  .dwf-docs-table{grid-template-columns:1fr;gap:10px}
  .dwf-docs-table .dwf-th{display:none}
  .dwf-doc-row{display:grid;grid-template-columns:1fr auto;gap:6px 10px;padding:10px 12px;border:1px solid var(--border-light,var(--border));border-radius:12px;background:var(--card)}
  .dwf-doc-row>*{padding:0;border-bottom:none}
  .dwf-doc-row .dwf-doc-name{grid-column:1 / -1}
  .dwf-doc-row .dwf-doc-actions{grid-column:1 / -1;justify-content:stretch}
  .dwf-doc-actions .btn{flex:1 1 auto;min-height:44px;font-size:13px!important}
  .dwf-doc-note{grid-column:1 / -1;border-bottom:none;padding:0}
  .dwf-aml-grid{grid-template-columns:1fr}
  .dwf-gcard>summary{padding:12px}
  .dwf-gbody{padding:0 10px 10px}
}

.dwf-doc-row.is-flash>*{background:color-mix(in srgb, var(--gold,#b08d3e) 14%, transparent);transition:background .4s}
/* r217: phone touch targets are non-negotiable (wins over .btn-xs) */
@media (max-width:640px){
  #small-modal.dwf-modal .dwf-doc-actions .btn,#small-modal.dwf-modal .dwf-doc-actions .dwf-upload-btn,#small-modal.dwf-modal .dwf-officer-controls .btn{min-height:44px!important;display:inline-flex;align-items:center;justify-content:center}
  #small-modal.dwf-modal .modal-footer .btn{min-height:48px!important}
  #small-modal.dwf-modal .dwf-summary-next{min-height:44px;display:inline-flex;align-items:center}
  #small-modal.dwf-modal .dwf-gcard>summary{min-height:52px}
}

/* ── r218 Rental deals ─────────────────────────────────────────────────────── */
.dwf-kind-badge{display:inline-flex;align-items:center;padding:2px 10px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.02em;background:color-mix(in srgb,var(--enterprise-accent,#0d7c86) 14%,transparent);color:var(--enterprise-accent,#0d7c86);margin-inline-end:8px;white-space:nowrap}
.dwf-field-row .dwf-field-input{grid-column:1 / -1;padding-top:0!important;border-bottom:1px solid var(--border-light,var(--border))}
.dwf-field-row .dwf-doc-actions{display:none}
.dwf-field-row .dwf-field-input .form-control{width:100%}
.dwf-field-row .dwf-field-details{margin-top:6px}
.dwf-field-row .dwf-doc-name label{cursor:pointer}
.dwf-pill.is-completed{background:color-mix(in srgb,var(--success,var(--accent-soft)) 14%,transparent);color:var(--success,var(--accent-text))}
.dwf-lease-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin-top:10px}
.dwf-lease-grid small{display:block;color:var(--text-muted);font-size:11px;margin-bottom:2px}
.dwf-lease-legend{margin-bottom:8px}
.pf-deal-tx-budget{font-size:12px;color:var(--text-muted);margin-inline-start:8px}
@media (max-width:640px){.dwf-lease-grid{grid-template-columns:1fr}.dwf-field-row .dwf-field-input{grid-column:1 / -1}}

/* ── Profile editor: Marketing Hub permission group (v4) ─────────────────── */
.pp-hub{margin-top:14px;border:1px solid var(--border);border-radius:12px;padding:12px 14px;background:var(--card)}
.pp-hub-head{margin-bottom:8px}
.pp-hub-head b{display:block;font-size:13.5px}
.pp-hub-head small{display:block;color:var(--text-muted);margin-top:2px;line-height:1.45}
.pp-hub-closed{color:var(--danger,var(--danger))!important;font-weight:700}
.pp-hub-group{border-top:1px solid var(--border-light,var(--border));padding:6px 0}
.pp-hub-group summary{cursor:pointer;display:flex;align-items:center;gap:8px;padding:6px 0;list-style:none}
.pp-hub-group summary small{color:var(--text-muted);font-weight:700}
.pp-hub-rows{display:grid;gap:4px;padding:2px 0 6px}
.pp-hub-row{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:start;padding:8px 10px;border-radius:10px;cursor:pointer;min-height:44px}
.pp-hub-row:hover{background:var(--surface-muted)}
.pp-hub-row.is-on{background:color-mix(in srgb,var(--enterprise-accent,#0d7c86) 8%,transparent)}
.pp-hub-row input{margin-top:3px;width:18px;height:18px}
.pp-hub-text b{display:block;font-size:13px}
.pp-hub-text small{display:block;color:var(--text-muted);font-size:11.5px;line-height:1.4;margin-top:1px}
.pp-hub-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.pp-hub-tag{font-style:normal;font-size:10.5px;font-weight:700;padding:1px 8px;border-radius:999px;background:var(--surface-muted);border:1px solid var(--border-light,var(--border));color:var(--text-muted)}
.pp-hub-tag.is-implied{color:var(--enterprise-accent,#0d7c86)}
.pp-hub-code{font-size:10.5px;color:var(--text-muted);direction:ltr;unicode-bidi:isolate;align-self:center}
@media (max-width:640px){.pp-hub-row{grid-template-columns:22px minmax(0,1fr)}.pp-hub-code{display:none}}

/* ── Marketing execution roles and routing (Users & Access, r228) ─────────────
   Reuses the access-management surface; only the chip grid is new. */
.mx-chips { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.mx-chip { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--border);
  border-radius: 10px; background: var(--card); cursor: pointer; font-size: 13px; font-weight: 600; min-width: 0; }
.mx-chip input { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: var(--primary, var(--accent-soft)); }
.mx-chip span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mx-chip:has(input:checked) { border-color: var(--primary, var(--accent)); background: color-mix(in srgb, var(--primary, var(--accent-soft)) 10%, transparent); }
.mx-chip:focus-within { outline: 2px solid var(--primary, var(--accent)); outline-offset: 2px; }
#mx-role-members { max-height: 260px; overflow-y: auto; }
@media (max-width: 900px) { .mx-chips { grid-template-columns: 1fr; } }

/* ── a question asked on top of an open form (never reuses #small-modal) ────── */
.crm-confirm-overlay { position: fixed; inset: 0; z-index: 1200; display: flex; align-items: center; justify-content: center;
  padding: 16px; background: rgba(15, 23, 42, .55); backdrop-filter: blur(2px); }
.crm-confirm-box { width: min(420px, 100%); background: var(--card); color: var(--text); border: 1px solid var(--border);
  border-radius: 16px; padding: 20px; box-shadow: 0 24px 60px rgba(0,0,0,.35); }
.crm-confirm-box h3 { margin: 0 0 8px; font-size: 16px; }
.crm-confirm-box p { margin: 0 0 18px; font-size: 14px; line-height: 1.6; color: var(--text-muted); overflow-wrap: anywhere; }
.crm-confirm-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.crm-confirm-actions .btn { min-height: 44px; }
@media (max-width: 480px) { .crm-confirm-actions .btn { flex: 1 1 auto; } }

/* ── overdue reads as a word, not only as a colour (WCAG: never colour alone) ── */
.ztask-overdue-chip { display: inline-block; margin-inline-start: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .02em; white-space: nowrap;
  background: color-mix(in srgb, var(--danger, var(--danger-light)) 16%, transparent);
  color: var(--danger, var(--danger)); border: 1px solid color-mix(in srgb, var(--danger, var(--danger)) 40%, transparent); }

/* ── cards never touch: a shared minimum gutter, horizontal and vertical ────── */
.stats-grid, .cards-grid, .kpi-grid, .an-grid, .dash-grid { gap: 16px !important; }
.card + .card { margin-top: 16px; }

/* ── the bottom navigation must never sit on top of content, a form or a menu ─ */
@media (max-width: 900px) {
  #content { padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px) + 16px) !important; }
  .page { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 8px); }
  /* Anything that floats gets out of the bar's way rather than under it. */
  .dropdown-menu, .select-menu, .ztask-status-menu, .crm-menu { z-index: 120; }
}

/* ── phones: every control is at least 44px tall, the accessible minimum ─────
   Dense desktop rows are untouched; this applies only where fingers are used. */
@media (max-width: 500px) {
  .page button, .page .btn, .page a.btn, .page input[type="button"], .page input[type="submit"],
  .page select, .page input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) {
    min-height: 44px;
  }
  .page .ztask-check, .page .own-check, .page input[type="checkbox"], .page input[type="radio"] {
    min-width: 24px; min-height: 24px;          /* the control itself */
  }
  /* An icon-only button still needs a 44px hit area even when the glyph is small. */
  .page button:has(> svg:only-child) { min-width: 44px; }
  .ztask-actions button, .ac-row-actions button { min-height: 44px; min-width: 44px; }
}

/* Three controls kept a smaller size through their own !important rules; on a phone the
   accessible minimum wins over the compact styling. */
@media (max-width: 500px) {
  .page .btn.btn-xs, .page .btn.btn-sm { min-height: 44px !important; padding-block: 10px !important; }
  .page .ztask-check { min-width: 44px !important; min-height: 44px !important; }
  .page .ztask-start { min-height: 44px !important; }
}

/* ── project data age ────────────────────────────────────────────────────────
   One nightly Property Finder run refreshes the whole project catalogue and
   nothing else does. When it stops, prices and "Sold out" flags keep being
   shown as if they were today's. Every surface that quotes a project figure
   carries this stamp; past the staleness threshold it stops being grey. */
.proj-asof{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border:1px solid var(--border);border-radius:999px;
  color:var(--text-muted);font-size:11px;font-weight:600;white-space:nowrap;
  vertical-align:middle;
}
.proj-asof i{font-style:normal;font-size:10px;line-height:1;opacity:.85}
.proj-asof.is-stale{
  border-color:rgba(217,119,6,.45);background:rgba(217,119,6,.10);color:#b45309;
}
html[data-theme="dark"] .proj-asof.is-stale,
:root:not([data-theme="light"]) .proj-asof.is-stale{ color:#f0b45f; }
.proj-asof.is-stale i{font-weight:800}
.srch-proj-head .proj-asof{margin-inline-start:10px}
.proj-head-copy .proj-asof{margin-top:8px}
@media (max-width:900px){
  .proj-asof{white-space:normal;font-size:11.5px;padding:4px 10px}
  .srch-proj-head .proj-asof{display:flex;margin:8px 0 0;width:fit-content}
}

/* ── sticky identity column on the Leads and Deals tables ────────────────────
   The header row was already sticky; the name was not. These tables carry eight
   columns and scroll sideways below about 1100px, and once "Deal Name" has
   scrolled off there is nothing left to say which row you are reading — the
   agent, budget and stage all belong to a record you can no longer name.
   Columns 1 and 2 (the checkbox and the name) stay put; everything else moves.

   The cells need an opaque ground of their own, because a sticky cell paints
   over the row beneath it. Hover and selection are repeated here so the frozen
   pair never looks detached from its row. */
#page-customers.crm-gold-v2 .crm-ll-table thead th:nth-child(1),
#page-customers.crm-gold-v2 .crm-ll-table thead th:nth-child(2),
#page-deals.crm-gold-v2 .crm-ll-table thead th:nth-child(1),
#page-deals.crm-gold-v2 .crm-ll-table thead th:nth-child(2){
  /* The header cell must paint too. Inheriting --track was not enough: the next header slid
     underneath and the two labels overlapped into "Ag-Deal Name-ned". */
  position:sticky; z-index:4; background:var(--card);
  text-align:start;
}
#page-customers.crm-gold-v2 .crm-ll-table td:nth-child(1),
#page-customers.crm-gold-v2 .crm-ll-table td:nth-child(2),
#page-deals.crm-gold-v2 .crm-ll-table td:nth-child(1),
#page-deals.crm-gold-v2 .crm-ll-table td:nth-child(2){
  position:sticky; z-index:1; background:var(--card);
}
#page-customers.crm-gold-v2 .crm-ll-table th:nth-child(1),
#page-customers.crm-gold-v2 .crm-ll-table td:nth-child(1),
#page-deals.crm-gold-v2 .crm-ll-table th:nth-child(1),
#page-deals.crm-gold-v2 .crm-ll-table td:nth-child(1){ inset-inline-start:0; }
#page-customers.crm-gold-v2 .crm-ll-table th:nth-child(2),
#page-customers.crm-gold-v2 .crm-ll-table td:nth-child(2),
#page-deals.crm-gold-v2 .crm-ll-table th:nth-child(2),
#page-deals.crm-gold-v2 .crm-ll-table td:nth-child(2){ inset-inline-start:34px; }
/* the edge of the frozen pair, so the split is visible while scrolling */
#page-customers.crm-gold-v2 .crm-ll-table th:nth-child(2)::after,
#page-customers.crm-gold-v2 .crm-ll-table td:nth-child(2)::after,
#page-deals.crm-gold-v2 .crm-ll-table th:nth-child(2)::after,
#page-deals.crm-gold-v2 .crm-ll-table td:nth-child(2)::after{
  content:""; position:absolute; top:0; bottom:0; inset-inline-end:-1px; width:1px;
  background:var(--hairline);
}
#page-customers.crm-gold-v2 .crm-ll-row:hover td:nth-child(1),
#page-customers.crm-gold-v2 .crm-ll-row:hover td:nth-child(2),
#page-deals.crm-gold-v2 .crm-ll-row:hover td:nth-child(1),
#page-deals.crm-gold-v2 .crm-ll-row:hover td:nth-child(2){ background:var(--active-pill); }
#page-customers.crm-gold-v2 .crm-ll-row.is-sel td:nth-child(1),
#page-customers.crm-gold-v2 .crm-ll-row.is-sel td:nth-child(2),
#page-deals.crm-gold-v2 .crm-ll-row.is-sel td:nth-child(1),
#page-deals.crm-gold-v2 .crm-ll-row.is-sel td:nth-child(2){
  background:color-mix(in srgb, var(--gold) 8%, var(--card));
}

/* ── contrast corrections, measured ──────────────────────────────────────────
   Now that the app follows the OS theme, both palettes are actually reachable
   and both were measured. These are the text styles that fell below WCAG AA on
   their real backgrounds. Each comment records the ratio that was there.

   NOT changed, and deliberately: .dc-admin-center. Its panel is a dark gradient
   in BOTH themes, so its white text is correct — an audit that reads only
   background-color walks straight past a gradient and blames the page behind it. */

/* 2.82:1 on the amber strip in dark, 3.4:1 in light — a link-looking control. */
.dc-status-strip button{ color:var(--text) }
.dc-status-strip.warning button{ color:#92400e }
body.dark .dc-status-strip.warning button{ color:#fbbf24 }

/* 2.08:1 in light: the provenance line under the dashboard figures. */
.dc-source-note{ color:var(--text-muted) }

/* 1.24:1 — black on a near-black card in dark mode; the number was invisible. */
.dc-metric-card strong,
button.warning strong{ color:var(--text) }

/* 2.01:1 in light: the active tab and its count on a white ground. The page-scoped rules at
   ui.css:4262 carry an id, so the correction has to match that specificity to win. */
#page-customers.crm-gold-v2 .crm-dl-tab.active,
#page-deals.crm-gold-v2 .crm-dl-tab.active{ color:var(--text) }
#page-customers.crm-gold-v2 .crm-dl-tab .crm-dl-tab-n,
#page-deals.crm-gold-v2 .crm-dl-tab .crm-dl-tab-n{ color:var(--text-light) }

/* 2.54:1 in light: a status chip has to be readable, not merely coloured. */
.conn-badge.conn-cold{ color:#4b5563 }
body.dark .conn-badge.conn-cold{ color:#cbd5e1 }

/* 2.11:1 in light: the build stamp under the sidebar user card. It is written by boot.js into
   whatever element holds "build commercial-rNNN"; the sidebar footer is the only place it appears. */
.sidebar-footer div[style*="font-size"], .sidebar > div:last-child > div:last-child{ color:var(--text-light) }

/* 3.76:1 — white on #EF4444 at 9px/800. #DC2626 clears 4.5 with the same red. */
/* A filled counter, so it keeps a solid danger ground. The numeral takes the page colour, not
   white: in dark mode the danger token is a light salmon and white on it is 3.13:1. */
#at-nav-badge, #todo-badge, #prop-list-badge{ background:var(--danger) !important }
body.light #at-nav-badge, body.light #todo-badge, body.light #prop-list-badge{ color:#FFFFFF !important }
body.dark #at-nav-badge, body.dark #todo-badge, body.dark #prop-list-badge{ color:var(--bg) !important }

/* ── permission matrix: groups, readable actions, effective view ─────────────
   The keys did not change; the reading did. Groups use the sidebar's own words
   so the two do not teach different vocabularies, and each column says what it
   permits with the raw key kept underneath for anyone who needs it. */
.pp-matrix thead th span{ display:block; font-size:11px; font-weight:800 }
.pp-matrix thead th small{ display:block; margin-top:1px; color:var(--text-muted); font-size:8.5px; font-weight:600; letter-spacing:.02em }
.pp-group-row td{
  padding:12px 10px 5px !important; border:0 !important;
  color:var(--text-light); font-size:9.5px; font-weight:800; letter-spacing:.09em; text-transform:uppercase;
}
.pp-matrix tbody tr:first-child .pp-group-row td{ padding-top:4px !important }

.pp-eff-hint{ padding:16px 2px; color:var(--text-muted); font-size:12.5px }
.pp-eff-head{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin:6px 0 12px }
.pp-eff-head small{ display:block; margin-top:3px; color:var(--text-muted); font-size:11.5px }
.pp-eff-legend{ display:flex; flex-wrap:wrap; gap:7px }
.pp-eff-cell{ text-align:center }
.pp-eff-no{ color:var(--text-muted); opacity:.5 }
.pp-eff-yes{
  display:inline-flex; align-items:center; gap:5px; padding:2px 8px; border-radius:999px;
  border:1px solid var(--border); font-size:10.5px; font-weight:700; white-space:nowrap;
}
.pp-eff-yes i{ font-style:normal; font-size:9.5px; font-weight:650 }
/* Four sources, four readings — the point is that "granted" is never just granted. */
.pp-eff-yes.src-profile{ border-color:rgba(100,116,139,.4); color:var(--text-light) }
.pp-eff-yes.src-profile-override{ border-color:rgba(37,99,235,.5); background:rgba(37,99,235,.10); color:#1d4ed8 }
.pp-eff-yes.src-user{ border-color:rgba(217,119,6,.5); background:rgba(217,119,6,.12); color:#b45309 }
.pp-eff-yes.src-legacy{ border-color:rgba(220,38,38,.5); background:rgba(220,38,38,.10); color:#b91c1c }
body.dark .pp-eff-yes.src-profile-override{ color:#93c5fd }
body.dark .pp-eff-yes.src-user{ color:#fbbf24 }
body.dark .pp-eff-yes.src-legacy{ color:#fca5a5 }
.pp-eff-matrix td:first-child{ white-space:nowrap }
@media (max-width:900px){
  .pp-eff-yes i{ display:none }              /* the colour and the tooltip carry it on a phone */
  .pp-eff-head{ flex-direction:column; align-items:flex-start }
}

/* The three agent rankings measure three different things — KPI score, commission, field activity.
   Naming the measure is what stops them reading as the same list disagreeing with itself. */
.an-card-note{ margin:-2px 0 10px; color:var(--text-muted); font-size:10.5px; line-height:1.5 }

/* ═══════════════════════════════════════════════════════════════════════════
   DN colour contract — one accent (teal), amber and brick for status only.
   Appended last so it is the final word over the several generations of theme
   rules above it. Everything here reads from the palette funnel; no literals.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Three tokens were referenced but never defined, so their fallbacks — a purple #6c63ff among
   them — were the real colour on screen. Declared on body, never :root: an alias on :root
   freezes to the light value and stops following dark mode. */
body{ --dev-c: var(--accent); --tag-c: var(--accent); --pc: var(--accent); }

/* ── Active menu ───────────────────────────────────────────────────────────
   Soft accent ground, accent label and icon, and a 2px accent bar on the edge
   nearest the content: inset-inline-start is the RIGHT edge in Persian and
   Arabic, the left edge in English. */
.nav-item.active, body.light .nav-item.active, body.dark .nav-item.active,
.tab-btn.active, body.light .tab-btn.active, body.dark .tab-btn.active{
  position:relative;
  background:var(--accent-soft)!important;
  color:var(--accent-text)!important;
}
.nav-item.active svg, body.light .nav-item.active svg, body.dark .nav-item.active svg,
.tab-btn.active svg,
.mbn-btn.active, body.light .mbn-btn.active, body.dark .mbn-btn.active{
  color:var(--accent-text)!important;
}
.mbn-btn.active svg, body.light .mbn-btn.active svg, body.dark .mbn-btn.active svg{
  stroke:var(--accent)!important; color:var(--accent-text)!important;
}
.nav-item.active::before, .tab-btn.active::before{
  content:"";position:absolute;inset-inline-start:0;top:7px;bottom:7px;
  width:2px;border-radius:2px;background:var(--accent);
}
/* the bottom bar has no room for a side rail, so its bar sits under the icon */
.mbn-btn{position:relative}
.mbn-btn.active::before{
  content:"";position:absolute;inset-inline:22%;top:0;height:2px;
  border-radius:2px;background:var(--accent);
}

/* ── Status pills ──────────────────────────────────────────────────────────
   Soft ground, text in the SAME hue, never a filled block. Rented reads as the
   accent, vacant as warning, a near due date as danger. Blue, purple and the
   two greens carried no meaning in this palette and now read as the accent or
   as neutral. */
.badge, .pill, [class^="pill-"], [class*=" pill-"]{
  border-radius:999px!important;
  font-size:12px;
  font-weight:600;
}
.badge-green, .badge-blue, .pill-ok, .pill-gold,
body.light .badge-green, body.dark .badge-green,
body.light .badge-blue,  body.dark .badge-blue{
  background:var(--accent-soft)!important; color:var(--accent-text)!important;
}
.badge-yellow, .badge-orange, .pill-warn,
body.light .badge-yellow, body.dark .badge-yellow,
body.light .badge-orange, body.dark .badge-orange{
  background:var(--warning-light)!important; color:var(--warning)!important;
}
.badge-red, .pill-danger, body.light .badge-red, body.dark .badge-red{
  background:var(--danger-light)!important; color:var(--danger)!important;
}
.badge-purple, .badge-gray, .pill-muted,
body.light .badge-purple, body.dark .badge-purple,
body.light .badge-gray, body.dark .badge-gray{
  background:color-mix(in srgb, var(--text-muted) 12%, transparent)!important;
  color:var(--text-light)!important;
}

/* ── Filled accent controls ────────────────────────────────────────────────
   White on #0F8A78 is 4.26:1, under the 4.5 this palette asks for. #0F8A78
   keeps the bar, the borders and the soft tints; where white text sits ON the
   accent the fill steps to #0D7A69 (5.24:1). Dark mode needs nothing:
   #04231E on #17B39C is 6.3:1. */
.btn-primary, .btn-accent, .btn.primary{
  background:var(--accent-fill)!important;
  border-color:var(--accent-fill)!important;
  color:var(--on-accent)!important;
}
body.light .btn-primary, body.light .btn-accent, body.light .btn.primary{ color:#FFFFFF!important; }

/* ── Shape ─────────────────────────────────────────────────────────────────
   Card 18, field and pill 999, icon box 10. */
.card, .stat-card, .prop-card, .panel{ border-radius:18px; }
input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=color]),
select, textarea, .badge, .pill, .chip{ border-radius:999px; }
.icon-box, .iconbox, .stat-icon, .nav-item svg{ border-radius:10px; }

/* ── Type ──────────────────────────────────────────────────────────────────
   Vazirmatn for Persian and Arabic, IBM Plex Mono for code and shortcut keys. */
html[lang="fa"] body, html[lang="ar"] body,
html[lang="fa"] input, html[lang="fa"] select, html[lang="fa"] textarea, html[lang="fa"] button,
html[lang="ar"] input, html[lang="ar"] select, html[lang="ar"] textarea, html[lang="ar"] button{
  font-family:Vazirmatn, IRANYekan, Tahoma, system-ui, sans-serif;
}
code, kbd, samp, pre, .mono, .kbd{
  font-family:'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* ── Bidi ──────────────────────────────────────────────────────────────────
   Latin numbers, codes and keys inside Persian text: isolate them, or a leading
   "#" and a trailing "+" swap ends of the run. */
.num, .amount, .price, .stat-value, .kpi-value, .metric-value, .mono,
code, kbd, samp, .ltr-num, [data-num], [data-code]{
  direction:ltr; unicode-bidi:isolate; text-align:start;
}

/* ── The sidebar is no longer dark in both themes ──────────────────────────
   It was: `#sidebar{color:#ECECEC}`, `.nav-item{color:#abb7c8}` and a
   `--primary-on-dark` accent all assumed a permanently dark navy ground, which
   is why this palette's light sidebar (#F2EDE4) rendered its labels at 1.01:1.
   The sidebar now takes its foreground from the same tokens as the rest of the
   app, so it follows the theme with everything else. */
#sidebar{
  color:var(--text);
  border-inline-end:1px solid var(--border);
}
body{ --primary-on-dark:var(--accent-text); --avatar-on-dark:var(--accent); }
#sidebar .nav-item, .nav-item{ color:var(--text-light); }
/* the section headings are 10.5px, below the size where muted stays legible */
.nav-section{ color:var(--text-secondary); }
.nav-item:hover{
  background:color-mix(in srgb, var(--text-muted) 10%, transparent);
  color:var(--text);
}
.nav-item.active, body.light .nav-item.active, body.dark .nav-item.active{
  background:var(--accent-soft)!important;
  color:var(--accent-text)!important;
}
.nav-item.active svg, body.light .nav-item.active svg, body.dark .nav-item.active svg,
.sidebar-logo svg{ color:var(--accent-text)!important; }
.sidebar-logo-brand, #sidebar-user-name{ color:var(--text); }
#sidebar-user-role{ color:var(--text-secondary); }
#sidebar-logout-btn{ color:var(--text-light); }
#sidebar-logout-btn:hover{
  background:color-mix(in srgb, var(--text-muted) 10%, transparent);
  color:var(--text);
}

/* ── Dashboard ─────────────────────────────────────────────────────────────
   The dc-* family carried its own palette — slate muted, a white card, and one
   tile colour per hue (blue, violet, gold, red). On the bone ground its text
   measured 1.10:1 to 2.56:1. It reads from the shared tokens now, and the four
   tile hues collapse to the one accent plus the two status colours. */
body{
  --dc-ink:var(--text);
  --dc-muted:var(--text-muted);
  --dc-line:var(--border);
  --dc-soft:var(--card2);
  --dc-green:var(--accent);
  --dc-gold:var(--warning);
}
.dc-metric-card{ background:var(--card); border-color:var(--border); }
.dc-metric-card:hover{ border-color:var(--border-strong); }
.dc-metric-card.teal, .dc-metric-card.blue, .dc-metric-card.violet{ color:var(--accent-text); }
.dc-metric-card.gold{ color:var(--warning); }
.dc-metric-card.red{ color:var(--danger); }
.dc-metric-copy{ color:var(--text); }
.dc-metric-copy small{ color:var(--text-secondary); }
.dc-metric-copy em{ color:var(--text-secondary); }
.dc-metric-arrow{ color:var(--text-muted); }
#dash-greeting-sub, #dash-greeting-sub span, .dc-sub-divider,
.dc-agent-filter span, .dc-range-toggle button,
.dc-source-rank, .dc-team-header span{ color:var(--text-secondary); }
.dc-source-row span, .dc-team-row span{ color:var(--text); }

/* ── The last of the permanently-dark sidebar ─────────────────────────────── */
.sidebar-logo span, #sidebar-user-name{ color:var(--text)!important; }
#sidebar-user-role{ color:var(--text-secondary)!important; }

/* The last three colours that belonged to no family: a green "online" dot, a table header still
   painted in the old slate, and an indigo/green pair set from app.js on two status icons. */
.assistant-fab-dot{ background:var(--accent)!important; }
body.dark th, body.dark table thead th{ color:var(--text-secondary); }
[style*="color:#6366f1"], [style*="color:#6366F1"]{ color:var(--accent-text)!important; }
[style*="color:#16a34a"], [style*="color:#16A34A"], [style*="color:#22c55e"], [style*="color:#22C55E"]{ color:var(--accent-text)!important; }
[style*="color:#92400e"], [style*="color:#92400E"]{ color:var(--warning)!important; }

/* Delete in a record header: a named, destructive control rather than an entry hidden behind a
   "⋯". It is rendered only for someone who holds the module's delete permission, so it needs no
   concealment — and the typed-DELETE confirmation is what actually guards the record. */
.lm-del{
  display:inline-flex;align-items:center;gap:6px;
  min-height:34px;padding:0 12px;
  border:1px solid color-mix(in srgb, var(--danger) 45%, transparent);
  border-radius:999px;
  background:var(--danger-light);
  color:var(--danger);
  font-size:12.5px;font-weight:650;cursor:pointer;
}
.lm-del:hover{ background:color-mix(in srgb, var(--danger) 18%, transparent); }
.lm-del:focus-visible{ outline:2px solid var(--danger); outline-offset:2px; }