:root{--navy:#fff;--navy-2:#f8fafc;--primary:#2563eb;--primary-soft:#eff6ff;--ink:#14213d;--muted:#64748b;--line:#e2e8f0;--canvas:#f5f8fc;--white:#fff;--success:#07875f;--success-bg:#eafaf3;--warning:#b25d06;--warning-bg:#fff7e6;--danger:#c9364b;--danger-bg:#fff0f3;--radius:15px;--shadow:0 8px 30px rgba(30,64,175,.055);font-family:"Inter Variable","Aptos","Segoe UI Variable","Segoe UI",ui-sans-serif,system-ui,-apple-system,sans-serif}
html{background:var(--canvas);scrollbar-color:#cbd5e1 transparent;scrollbar-width:thin}body{background:radial-gradient(circle at 85% -10%,rgba(14,165,233,.08),transparent 26%),linear-gradient(180deg,#f9fbff 0,#f4f7fb 280px,#f5f8fc 100%);color:var(--ink);font-size:14px;line-height:1.55;letter-spacing:0}button,input,select,textarea{font-family:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(37,99,235,.18);outline-offset:2px}
.app-shell{grid-template-columns:284px minmax(0,1fr)}.sidebar{width:284px;padding:16px 13px 18px;background:rgba(255,255,255,.98);border-right:1px solid #e5eaf2;box-shadow:5px 0 24px rgba(15,23,42,.035)}.sidebar-brand{min-height:62px;margin:0 4px 8px;padding:4px 9px 16px;border-bottom:1px solid #edf1f6;gap:11px}.sidebar-brand b{font-size:15px;font-weight:780;color:#0f2748}.sidebar-brand small{color:#8390a5;font-size:10px;font-weight:600}.brand-mark,.brand-mark.small{background:linear-gradient(145deg,#38bdf8,#2563eb 62%,#1d4ed8);border-radius:12px;box-shadow:0 8px 20px rgba(37,99,235,.22)}
.sidebar nav{gap:2px;padding:0 5px 12px 2px;scrollbar-color:#d9e1ec transparent}.sidebar-section{padding:18px 11px 6px;color:#9aa6b8;font-size:9px;font-weight:820;letter-spacing:.15em}.sidebar nav a{min-height:39px;padding:8px 10px;border-radius:10px;color:#58667b;font-size:12.5px;font-weight:620;gap:10px}.sidebar nav a:hover{background:#f2f7ff;color:#1d4ed8;transform:none}.sidebar nav a.active{background:linear-gradient(90deg,#eaf3ff,#f2f7ff);color:#1d4ed8;font-weight:760;box-shadow:inset 3px 0 #3b82f6}.sidebar nav a.sidebar-child{min-height:33px;margin-left:18px;padding:6px 9px 6px 14px;border-left:1px solid #dde5ef;border-radius:0 8px 8px 0;color:#748197;font-size:11.5px}.sidebar nav a.sidebar-child:hover{background:#f7faff;color:#2563eb}.sidebar nav a.sidebar-child.active{border-left-color:#3b82f6;background:#edf5ff;color:#1d4ed8;border-radius:0 9px 9px 0;box-shadow:none}.sidebar-nav-parent{grid-template-columns:minmax(0,1fr) 32px}.sidebar-nav-parent>button{width:29px;height:29px;color:#94a3b8}.sidebar-nav-parent>button:hover{background:#eef5ff;color:#2563eb}.sidebar-footer{margin:8px 5px 0;padding:15px 9px 1px;border-top:1px solid #edf1f6;color:#334155}.sidebar-footer small{color:#94a3b8}
.workspace{grid-column:2}.topbar{height:76px;padding:0 clamp(20px,2.5vw,38px);gap:16px;background:rgba(255,255,255,.88);border-bottom:1px solid #e2e8f0;box-shadow:0 3px 16px rgba(15,23,42,.025);backdrop-filter:blur(18px)}.menu-toggle,.icon-btn{width:40px;height:40px;border-color:#dfe6ef;border-radius:11px;background:#fff;color:#475569}.icon-btn:hover{border-color:#bfdbfe;background:#eff6ff;color:#2563eb}.workspace-switcher{min-width:200px;color:#718096;font-size:9px;font-weight:800;letter-spacing:.1em}.workspace-switcher select{height:40px;border-color:#dfe6ef;border-radius:11px;color:#1e293b}.global-search{height:42px;max-width:650px;border-color:#dfe6ef;border-radius:12px;background:#f7f9fc}.global-search:focus-within{border-color:#93c5fd;background:#fff;box-shadow:0 0 0 4px rgba(37,99,235,.09)}.user-button{padding:5px 7px;border-radius:11px}.user-button:hover{background:#f5f8fc}.avatar{width:38px;height:38px;border:1px solid #dbeafe;background:linear-gradient(145deg,#eff6ff,#e0f2fe);color:#2563eb}
.content{max-width:1660px;padding:36px clamp(24px,3.25vw,52px) 82px}.page-header,.sales-heading{align-items:center;margin-bottom:26px}.page-header>div,.sales-heading>div{max-width:780px}.eyebrow{margin-bottom:7px;color:#2563eb;font-size:9.5px;font-weight:850;letter-spacing:.15em}.page-header h1,.sales-heading h1{margin:0 0 6px;color:#10213c;font-size:clamp(27px,2.1vw,34px);font-weight:790;line-height:1.15;letter-spacing:-.035em}.page-header p,.sales-heading p{color:#6b7890;font-size:13px;line-height:1.65}.panel-title h2{font-size:17px;font-weight:760}.panel-title p{font-size:12px;line-height:1.55;color:#758299}
.panel,.metric-card{border:1px solid #e2e8f0;border-radius:20px;background:rgba(255,255,255,.97);box-shadow:var(--shadow)}.panel{padding:24px}.metric-grid{gap:14px}.metric-card{min-height:122px;padding:21px 22px}.metric-card:before{width:4px;background:linear-gradient(#38bdf8,#2563eb)}.metric-card span{color:#718096;font-size:11px}.metric-card strong{margin:10px 0 5px;color:#10213c;font-size:24px;font-weight:790}.metric-card small{color:#526079;font-size:11px}.summary-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));overflow:hidden;border-radius:16px;box-shadow:0 5px 20px rgba(30,64,175,.04)}.summary-strip>div{min-width:0;padding:18px 22px}.summary-strip b{font-size:20px;font-weight:780}.summary-strip span{font-size:9.5px;font-weight:700;letter-spacing:.07em}
.btn{min-height:42px;padding:9px 16px;border-radius:11px;font-size:12px;font-weight:740}.btn.primary{border-color:#2563eb;background:linear-gradient(135deg,#3b82f6,#2563eb);box-shadow:0 7px 18px rgba(37,99,235,.2)}.btn.primary:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8)}.btn.secondary{border-color:#dce4ee;background:#fff;color:#334155}.btn.secondary:hover{border-color:#bfdbfe;background:#f8fbff;color:#1d4ed8}.btn.ghost{color:#2563eb}label{color:#334155;font-size:12px;font-weight:680}input,select,textarea{min-height:43px;border-color:#d6deea;border-radius:10px;color:#1e293b;font-size:13px}input::placeholder,textarea::placeholder{color:#a1adbe}input:focus,select:focus,textarea:focus{border-color:#60a5fa;box-shadow:0 0 0 4px rgba(37,99,235,.09)}.search-field{min-height:42px;border-color:#dce4ee;border-radius:11px;background:#fff}
.database-grid{gap:12px}.database-card{min-height:74px;padding:14px 15px;border-color:#e0e7f0;border-radius:13px}.database-card:hover{border-color:#bfdbfe;box-shadow:0 5px 16px rgba(37,99,235,.06)}.database-card.active{border-color:#6ee7b7;background:linear-gradient(135deg,#ecfdf5,#f4fff9)}.sales-overview-grid{gap:12px}.sales-overview-grid button,.sales-module-grid button{min-height:84px;padding:14px 15px;border-color:#e0e7f0;border-radius:14px;box-shadow:0 3px 12px rgba(15,23,42,.025)}.sales-overview-grid button:hover,.sales-module-grid button:hover{transform:translateY(-1px);border-color:#93c5fd;background:#fbfdff;box-shadow:0 16px 38px rgba(30,64,175,.1)}.sales-overview-grid button>span,.sales-module-icon,.template-icon{border-radius:11px;background:linear-gradient(145deg,#ecfeff,#eff6ff);color:#0284c7}.sales-overview-grid button b{font-size:12.5px}.sales-overview-grid button small{font-size:10.5px}.sales-overview-grid button.has-data strong{color:#2563eb}
.sales-list-panel,.table-panel{padding:0}.sales-list-head{padding:20px 22px 16px}.sales-toolbar,.table-toolbar{padding:13px 20px;border-color:#e8edf4;background:#f8fafc}.responsive-table th{height:44px;background:#f7f9fc;color:#718096;font-size:9.5px;font-weight:790}.responsive-table td{padding:14px 16px;border-color:#edf1f6;color:#334155;font-size:12px}.responsive-table tbody tr:hover{background:#f8fbff}.badge{padding:5px 9px;font-size:9.5px}.badge.success{background:#e9fbf3;color:#08785a}.badge.info{background:#eaf3ff;color:#1d4ed8}.badge.warning{background:#fff4dc;color:#a85a05}.badge.neutral{background:#f1f5f9;color:#64748b}.empty-mini,.empty-table{border-color:#dce5f0;background:#f9fbfd;color:#718096;border-radius:13px}
.modal-overlay{background:rgba(15,23,42,.42);backdrop-filter:blur(7px)}.modal{border:1px solid rgba(255,255,255,.7);border-radius:20px;box-shadow:0 30px 90px rgba(15,23,42,.23)}.modal-header{padding:22px 25px}.modal-body{padding:23px 25px}.modal-footer{padding:15px 25px}.toast{border-radius:12px;background:#17233a}.sync-footer{left:284px;height:40px;padding:0 36px;border-color:#e4eaf2;background:rgba(255,255,255,.94);color:#748197;font-size:11px}.status-dot{background:#10b981;box-shadow:0 0 0 4px #dcfce7}.muted-dot{background:#94a3b8;box-shadow:none}
@media(max-width:1180px){.app-shell{grid-template-columns:260px minmax(0,1fr)}.sidebar{width:260px}.sync-footer{left:260px}.content{padding-inline:28px}.integration-metrics.metric-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.app-shell{display:block}.sidebar{width:292px;max-width:88vw}.workspace{display:block}.topbar{height:66px;padding:0 14px}.content{padding:25px 15px 76px}.page-header,.sales-heading{align-items:flex-start}.panel{padding:19px}.sync-footer{left:0;padding:0 15px}.workspace-switcher{min-width:0}}
@media(max-width:560px){.page-header,.sales-heading{display:block;margin-bottom:20px}.page-header h1,.sales-heading h1{font-size:25px}.page-header .btn,.sales-heading-actions .btn{width:100%;justify-content:center;margin-top:15px}.metric-grid,.integration-metrics.metric-grid{grid-template-columns:1fr 1fr;gap:9px}.metric-card{min-height:106px;padding:16px}.metric-card strong{font-size:20px}.summary-strip{display:flex;overflow:auto}.summary-strip>div{min-width:145px;padding:15px 17px}.panel{border-radius:16px}.database-grid{grid-template-columns:1fr}.modal{border-radius:20px 20px 0 0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
