/* Bella: wine + pearl with light navigation, shared by every application screen. */
:root {
  --plum:#542737; --orchid:#99677e; --blush:#e8dde1; --ivory:#f8f8f6;
  --surface-bright:#fdfdfb; --selected:#e8dde1; --message-background:#e7d9df;
  --canvas:#e7e8e6; --surface:#f8f8f6; --surface-soft:#efefed; --surface-inset:#d8dcda;
  --ink:#302d30; --muted:#555b57; --border:#b6bcb8; --line:#d6dbd7;
  --divider-strong:#a2aaa5; --divider-soft:#b6bcb8; --control-border:#7e8580;
  --panel-shadow:0 6px 20px #30383010,0 1px 3px #3038300a;
}
body{background:var(--canvas);color:var(--ink)}
h1{color:var(--plum)}
.page-heading{padding-top:29px;padding-bottom:27px}
.page-heading p,.breadcrumb,.breadcrumb strong,.page-footer{color:var(--muted)}
.eyebrow{color:#755665}.topbar{border-bottom:1px solid var(--divider-strong)}

/* Light navigation: wine is reserved for selection, headings and actions. */
.sidebar{background:var(--surface);color:var(--plum);border-right:1px solid var(--border);box-shadow:3px 0 12px #30383008}
.sidebar .brand{filter:none}
.sidebar .workspace{border-color:var(--border)}.sidebar .workspace-icon{background:var(--selected);color:var(--plum)}
.sidebar .workspace strong,.sidebar .user strong{color:var(--plum)}
.sidebar .workspace small,.sidebar .user small,.sidebar .nav-caption{color:var(--muted)}
.sidebar .nav-item{color:var(--plum)}.sidebar .nav-item:hover{background:var(--surface-soft)}
.sidebar .nav-item.active{background:var(--plum);color:var(--surface-bright);box-shadow:0 3px 8px #54273718}
.sidebar .nav-item.active b{background:#ffffff22;color:var(--surface-bright)}
.sidebar .assistant-card{background:var(--surface-soft);border-color:var(--border)}
.sidebar .assistant-card strong{color:var(--plum)}.sidebar .assistant-card p{color:var(--muted)}
.sidebar .user{border-top:1px solid var(--border);margin-top:20px;padding-top:18px}
.sidebar .user-avatar{background:var(--selected);color:var(--plum)}

/* Pearl panels above a mineral canvas, with distinct inset surfaces. */
.contacts-card,.workspace-card,.contact-stats>div,.pipeline-toolbar,.inbox-shell{background:var(--surface);border-color:var(--border);box-shadow:var(--panel-shadow)}
.workspace-card>h2{padding-bottom:15px;margin-bottom:18px;border-bottom:1px solid var(--divider-strong)}
.contact-stats>div{border-top:3px solid #956b7c}.stat-icon{background:#e8dde1;color:#542737}
.contacts-card-heading{background:var(--surface);border-bottom:1px solid var(--divider-strong);padding-top:24px;padding-bottom:24px}
.contacts-card-heading h2,.contacts-card h2{color:var(--plum)}.contacts-card-heading p{color:var(--muted)}
.contacts-toolbar{background:var(--surface-soft);padding-top:20px;border-bottom:1px solid var(--border)}
.contacts-result-bar,.contacts-bottom{background:var(--surface-soft);border-color:var(--border);color:var(--muted)}
.contacts-bottom{border-top:1px solid var(--divider-strong)}
.contacts-table th,.report-table th{background:var(--surface-inset);color:#414743;border-color:var(--divider-strong);font-weight:700;letter-spacing:.8px}
.contacts-table thead th{border-top:1px solid var(--divider-strong);border-bottom:1px solid var(--divider-strong)}
.contacts-table td,.report-table td{border-bottom-color:var(--line)}
.contacts-table tbody tr:nth-child(even),.report-table tbody tr:nth-child(even){background:#f0f1ee}
.contacts-table tbody tr:hover{background:#e5e8e4}.contact-person strong{color:var(--plum)}

/* Control boundaries are stronger than decorative separators. */
.search,.composer,.notes textarea{background:var(--surface-bright);border-color:var(--control-border);box-shadow:inset 0 1px 2px #30383005}
.contacts-filter select,.contact-block select,.move-label select,.workspace-card input:not([type=checkbox]),.workspace-card select,.workspace-card textarea,dialog input,#contact-editor select,#contact-editor textarea,.live-login-form input{background:var(--surface);border-color:var(--control-border)}
.secondary,.quick-replies button{background:var(--surface);border-color:var(--control-border);color:#542737;font-weight:600;box-shadow:0 1px 2px #30383008}
.secondary:hover,.quick-replies button:hover{background:#e5e8e4;border-color:#626b64}
.primary,.send-button{box-shadow:0 3px 8px #54273720}.primary:hover{background:#6c354b}
button:focus-visible,a:focus-visible{outline-color:#87425e}
input:focus,textarea:focus,select:focus{outline-color:#87425e}
.demo-pill{background:#f5e9f0;border-color:#b597ab;color:#63405a}
.live-pill{background:#e4eee5;border-color:#acc6b3;color:#345c43}
.avatar{background:#e3c8d8;color:#69425b}.avatar.lilac{background:#dcd1e7;color:#665279}.avatar.peach{background:#eddbc9;color:#886245}.avatar.sage{background:#d5e3d6;color:#496b52}

/* Attendance: list, header, status, history and writing area have distinct roles. */
.conversation-panel{background:var(--surface);border-right:2px solid var(--divider-strong)}
.list-title{background:var(--surface-soft)}.list-title h2 span{background:#d8dcda;color:#49514b}
.filters{background:var(--surface);border-bottom:1px solid var(--divider-strong)}
.filters button{color:#555b57}.filters button.selected{background:var(--plum);color:#fff8f2}
.conversation{border-bottom-color:var(--line)}.conversation:hover{background:#efefed}
.conversation.chosen{background:var(--selected);border-left-color:var(--plum)}
.list-footer{background:var(--surface-soft);border-top:1px solid var(--border);color:var(--muted)}
.chat{background:var(--surface-inset)}
.chat-header{background:var(--surface-bright);border-bottom:2px solid var(--divider-strong)}
.assistant-banner{background:#efefed;border-left:4px solid var(--plum);border-bottom:1px solid var(--divider-strong);position:relative;z-index:1}
.assistant-banner small{color:#555b57}.messages{scrollbar-color:#a2aaa5 transparent}
.bubble{background:var(--surface-bright);border-color:#b6bcb8;box-shadow:0 2px 5px #3038300d}
.outgoing .bubble{background:var(--message-background);border-color:#b99aa8}.bubble p{color:#302d30}
.message-author{color:#542737}.message-time{color:#555b57}
.day-divider span{background:#f8f8f6;border-color:#b6bcb8;color:#555b57}.system-message{color:#555b57}
.composer-area{background:var(--surface-bright);border-top:2px solid var(--divider-strong)}
.composer textarea::placeholder{color:#555b57}
.contact-panel{background:#efefed;border-left:2px solid var(--divider-strong)}
.contact-title{padding-bottom:12px;border-bottom:1px solid var(--divider-strong)}.contact-block{border-top-color:var(--border)}

/* Related screens share the same surface hierarchy. */
.overview-contact,.connection-row,.team-row{border-color:var(--line)}.overview-contact:hover{background:var(--surface-soft)}
.welcome-banner{background:#d8dcda;border-color:#a2aaa5;box-shadow:var(--panel-shadow)}.welcome-banner p{color:#414743}
.inline-notice,.privacy-note{background:#efefed;border-color:#b6bcb8;color:#555b57}
.shortcut-grid a,.opportunity-chat{background:#efefed;color:#542737}.shortcut-grid a:hover,.opportunity-chat:hover{background:#dfe3df}
.bar-track{background:#d8dcda}.bar-track>span{background:#8c586e}
.greeting-preview{background:#e7d9df;border:1px solid #b99aa8}
.connection-row>span{background:#efefed;color:#555b57}
.kanban-column{background:#d8dcda;border-color:#a2aaa5}
.kanban-column>header{background:#c9cfcb;border-bottom:1px solid #929c94;border-radius:11px 11px 0 0}
.kanban-count{background:var(--surface);color:#542737}
.opportunity-card{background:var(--surface);border-color:#a2aaa5;box-shadow:0 3px 8px #3038300c}.kanban-empty{color:#555b57}
dialog{background:var(--surface);border-color:#929c94;box-shadow:0 24px 80px #30202b40}dialog::backdrop{background:#301b2b80}
.contact-details-hero,.contact-definition>div{border-color:var(--border)}
.login-page,.login-form-side{background:var(--canvas)}.login-story{background:#d8dcda}.login-story p{color:#414743}
.login-box{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:30px;box-shadow:0 12px 36px #30383018;max-width:425px}
.login-profile{background:#efefed;border-color:#b6bcb8}.demo-entry{border-color:var(--border)}.live-scope-note{color:var(--muted)}
.live-mobile-nav{border-bottom:1px solid var(--divider-strong);padding-bottom:12px}
.mobile-page-nav button{background:#d8dcda;color:#414743}.mobile-page-nav button.active{background:var(--plum);color:#fff8f2}
@media(max-width:680px){.contacts-card-heading{padding-top:19px;padding-bottom:19px}.contacts-toolbar{padding-top:16px}.login-box{padding:24px 20px}.login-form-side{padding:25px 14px}.page-heading{padding-top:22px;padding-bottom:22px}.conversation-panel{border-right:0}}

/* Carry the same colors through legacy component styles and all dialogs. */
.contacts-card h2 span,.list-title h2 span{background:var(--surface-inset);color:var(--muted)}
.contacts-filter>span,.contact-stats span:not(.stat-icon),.contact-person small,.contacts-help,.editor-intro,
.contact-definition dt,.contact-details-hero p,.pipeline-toolbar>span,.pipeline-guidance,.pipeline-footnote,
.opportunity-phone,.opportunity-note,.opportunity-owner,.move-label,.overview-contact small,
.workspace-card p,.workspace-card .small-note,.small-note,.team-row small,.toggle-row small,.form-footer>span,
.report-bar>div:first-child,.report-heading p,.message-metrics span,.appointment-row small,
.login-story>small,.login-box>p,.login-profile small,.login-box .login-disclaimer,.demo-entry small,
.preview,.conversation-line small,.conversation-meta small,.chat-name>span,.contact-summary>span:last-child,
.notes small,.privacy-note p,.composer-hint,.composer-hint span:first-child,.live-status,.live-loading{color:var(--muted)}
.conversation-line strong,.contact-summary h3,.list-title h2,.contact-title h2,.chat-name h2,
.contacts-result-bar select,.contact-stats strong,.opportunity-name,.kanban-column h2,.overview-contact strong,
.workspace-card h2,.workspace-card label,.welcome-banner h2,.report-heading strong,.message-metrics strong,
.appointment-row strong,.login-box h2,.live-login-form label,.field-label,.phone,.owner,.greeting-preview strong,
.text-link,.icon-button,.assistant-banner>span:nth-child(2),.assistant-banner button{color:var(--plum)}
.primary,.send-button{background:var(--plum);color:var(--surface-bright)}
.primary:hover,.send-button:hover{background:#6c354b}
.contacts-table td,.report-table td{color:var(--ink)}
.contacts-filter select,.contact-block select,.move-label select,.workspace-card input:not([type=checkbox]),
.workspace-card select,.workspace-card textarea,dialog input,dialog select,dialog textarea,
#contact-editor select,#contact-editor textarea,#pipeline-detail textarea,.live-login-form input,
.search input,.composer textarea,.notes textarea{background:var(--surface-bright);color:var(--plum);border-color:var(--control-border)}
.search input,.composer textarea{background:transparent}
.search input::placeholder,.workspace-card input::placeholder,.workspace-card textarea::placeholder,
dialog input::placeholder,dialog textarea::placeholder{color:var(--muted);opacity:1}
.workspace-page form input:focus,.workspace-page form textarea:focus{background:var(--surface-bright)}
.toggle-row input{accent-color:var(--plum)}
.tiny-tag,.interest-tag,.opportunity-interest,.policy-chip{background:var(--selected);color:var(--plum)}
.stage-badge{background:var(--selected);color:var(--plum)}
.stage-badge.new{background:#e8ebe5;color:#4d5c40}
.stage-badge.scheduled{background:#e4eee7;color:#345c43}
.stage-badge.finished{background:#e9e9e8;color:#555b57}
.stage-badge:not(.new):not(.scheduled):not(.finished){background:var(--selected);color:var(--plum)}
.owner-dot{background:#956b7c}.owner-dot.human{background:#6e8267}
.tiny-tag.human{background:#e6e9e4;color:#405a49}
.kanban{scrollbar-color:#a2aaa5 var(--surface-soft)}.kanban-drop{scrollbar-color:#a2aaa5 transparent}
.kanban-drop.drag-over{background:var(--selected);border-color:#99677e}
.opportunity-card:hover{border-color:#956b7c;box-shadow:0 4px 12px #54273712}
.opportunity-note{border-left-color:var(--border)}.opportunity-owner,.form-footer,.appointment-row{border-color:var(--line)}
.welcome-banner{background:var(--surface);border-left:4px solid var(--plum)}
.mini-bella{background:var(--selected)}
.icon-button:hover{background:var(--selected)}
.avatar{background:var(--selected);color:var(--plum)}
.message-time svg{color:var(--muted)}