:root {
    --primary: #315bea;
    --primary-dark: #2449c8;
    --navy: #101a35;
    --navy-soft: #182545;
    --background: #f5f7fb;
    --surface: #ffffff;
    --border: #e6eaf2;
    --text: #172033;
    --muted: #7a8498;
    --success: #1a9b68;
    --warning: #b87908;
    --danger: #d9535d;
    --info: #287eb7;
    --radius-sm: 10px;
    --radius: 14px;
    --radius-lg: 20px;
    --shadow-sm: 0 2px 8px rgba(24, 38, 70, .04);
    --shadow: 0 10px 30px rgba(24, 38, 70, .06);
    --sidebar-width: 258px;
    --sidebar-collapsed: 78px;
}

* { box-sizing: border-box; }
html { min-width: 320px; }
body { background: var(--background); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: .9rem; -webkit-font-smoothing: antialiased; }
a { color: var(--primary); }
a:hover { color: var(--primary-dark); }
.app-shell { min-height: 100vh; }

/* Layout */
.sidebar { background: linear-gradient(180deg, var(--navy) 0%, #111e3d 100%); color: #fff; height: 100vh; left: 0; position: fixed; top: 0; width: var(--sidebar-width); z-index: 1040; transition: width .2s ease, transform .2s ease; }
.sidebar-inner { display: flex; flex-direction: column; height: 100%; overflow: hidden; padding: 20px 14px 14px; }
.sidebar-head { align-items: center; display: flex; justify-content: space-between; min-height: 42px; padding: 0 8px; }
.brand { align-items: center; color: #fff; display: inline-flex; gap: 11px; min-width: 0; text-decoration: none; }
.brand:hover { color: #fff; }
.brand-mark { align-items: center; background: linear-gradient(135deg, #5e86ff, #315bea); border-radius: 11px; box-shadow: 0 6px 16px rgba(49, 91, 234, .3); display: inline-flex; flex: 0 0 36px; height: 36px; justify-content: center; }
.brand strong { display: block; font-size: 1.02rem; letter-spacing: -.02em; line-height: 1.05; }
.brand small { color: #93a3c6; display: block; font-size: .63rem; letter-spacing: .08em; margin-top: 4px; text-transform: uppercase; }
.nav-caption { color: #7183ad; font-size: .63rem; font-weight: 700; letter-spacing: .13em; margin: 25px 10px 8px; text-transform: uppercase; }
.sidebar .nav-link { align-items: center; border: 1px solid transparent; border-radius: 10px; color: #aebbd5; display: flex; font-weight: 500; gap: 12px; margin: 0; min-height: 41px; padding: .62rem .75rem; transition: background .15s ease, color .15s ease, border-color .15s ease; white-space: nowrap; }
.sidebar .nav-link i { color: #8395bc; flex: 0 0 20px; font-size: 1.05rem; text-align: center; transition: color .15s ease; }
.sidebar .nav-link:hover { background: rgba(255, 255, 255, .065); color: #fff; }
.sidebar .nav-link:hover i, .sidebar .nav-link.active i { color: #b8c9ff; }
.sidebar .nav-link.active { background: linear-gradient(90deg, rgba(75, 111, 243, .34), rgba(75, 111, 243, .1)); border-color: rgba(137, 162, 255, .17); box-shadow: inset 3px 0 0 #7393ff; color: #fff; font-weight: 650; }
.sidebar .lead-nav-group > summary { cursor: pointer; list-style: none; }
.sidebar .lead-nav-group > summary::-webkit-details-marker { display: none; }
.sidebar-footer { border-top: 1px solid rgba(255, 255, 255, .1); margin-top: auto; padding: 15px 4px 0; }
.mini-user { align-items: center; display: flex; gap: 9px; margin: 0 5px 11px; min-width: 0; }
.mini-user-copy, .profile-copy { min-width: 0; }
.mini-user-copy strong, .profile-copy strong { display: block; font-size: .78rem; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-user-copy small, .profile-copy small { color: #91a1c4; display: block; font-size: .68rem; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.logout-link { color: #aebbd5 !important; }
.sidebar-close { background: transparent; border: 0; color: #aebbd5; font-size: 1.1rem; }
.main { margin-left: var(--sidebar-width); min-height: 100vh; transition: margin-left .2s ease; }
.topbar { align-items: center; background: rgba(255, 255, 255, .92); border-bottom: 1px solid var(--border); display: flex; height: 69px; justify-content: space-between; padding: 0 31px; position: sticky; top: 0; z-index: 1020; }
.topbar-left, .topbar-right { align-items: center; display: flex; gap: 14px; }
.topbar-search { align-items: center; background: #f8faff; border: 1px solid var(--border); border-radius: 9px; display: flex; gap: 8px; height: 34px; padding: 0 10px; width: 184px; }.topbar-search i { color: #9aa5b8; font-size: .75rem; }.topbar-search input { background: transparent; border: 0; color: var(--text); font-size: .72rem; min-width: 0; outline: 0; width: 100%; }.topbar-search:focus-within { background: #fff; border-color: #a9bbf5; box-shadow: 0 0 0 .16rem rgba(49,91,234,.08); }.topbar-notification { border: 0; background: transparent; height: 32px; width: 32px; }.topbar-notification:hover { background: #f0f3fa; }
.topbar-title .eyebrow { color: var(--muted); display: block; font-size: .65rem; letter-spacing: .08em; margin-bottom: 2px; text-transform: uppercase; }
.topbar-title strong { font-size: .89rem; font-weight: 650; }
.today-label { align-items: center; color: var(--muted); display: inline-flex; font-size: .76rem; gap: 7px; }
.icon-button { align-items: center; background: #fff; border: 1px solid var(--border); border-radius: 9px; color: #52617b; display: inline-flex; height: 37px; justify-content: center; transition: background .15s ease, border-color .15s ease, color .15s ease; width: 37px; }
.topbar-notification { text-decoration: none; }
.icon-button:hover { background: #f0f3fa; border-color: #d4dcef; color: var(--primary); }
.profile-trigger { align-items: center; background: transparent; border: 0; color: var(--text); display: inline-flex; gap: 9px; padding: 2px 0 2px 5px; }
.profile-trigger > i { color: #8d97a9; font-size: .66rem; }
.avatar { align-items: center; background: #e7edff; border: 1px solid #d7e0ff; border-radius: 50%; color: var(--primary); display: inline-flex; flex: 0 0 33px; font-size: .76rem; font-weight: 750; height: 33px; justify-content: center; }
.avatar-sm { background: rgba(115, 147, 255, .18); border-color: rgba(157, 177, 255, .2); color: #c8d4ff; flex-basis: 30px; height: 30px; }
.content-wrap { padding: 0 28px; }
.content { margin: 0 auto; max-width: 1540px; padding: 28px 0 42px; }
.sidebar-backdrop { background: rgba(9, 16, 34, .46); inset: 0; opacity: 0; pointer-events: none; position: fixed; transition: opacity .2s ease; z-index: 1030; }

/* Shared components */
.page-heading { align-items: flex-end; display: flex; gap: 18px; justify-content: space-between; margin-bottom: 22px; }
.page-heading h1 { font-size: 1.45rem; font-weight: 750; letter-spacing: -.035em; margin: 3px 0 0; }
.page-heading .eyebrow { color: var(--muted); font-size: .72rem; font-weight: 600; }
.page-heading .subheading { color: var(--muted); font-size: .78rem; margin-top: 5px; }
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.card:hover { border-color: #dfe5f1; }
.kpi { border-left: 0 !important; overflow: hidden; padding: 17px 18px !important; position: relative; }
.kpi::before { background: var(--kpi-color, var(--primary)); content: ""; inset: 0 auto 0 0; position: absolute; width: 4px; }
.kpi .label { color: var(--muted); font-size: .69rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.kpi .value { color: var(--text); font-size: 1.52rem; font-weight: 760; letter-spacing: -.05em; line-height: 1.1; }
.kpi .kpi-icon { align-items: center; background: color-mix(in srgb, var(--kpi-color, var(--primary)) 11%, white); border-radius: 10px; color: var(--kpi-color, var(--primary)); display: inline-flex; height: 34px; justify-content: center; width: 34px; }
.section-title { align-items: center; display: flex; justify-content: space-between; margin-bottom: 16px; }
.section-title h2 { font-size: .92rem; font-weight: 700; letter-spacing: -.01em; margin: 0; }
.section-title small { color: var(--muted); font-size: .73rem; }
.toolbar-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 13px; }
.btn { border-radius: 9px; font-size: .8rem; font-weight: 650; padding: .58rem .85rem; transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--primary); border-color: var(--primary); box-shadow: 0 4px 10px rgba(49, 91, 234, .15); }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); box-shadow: 0 6px 14px rgba(49, 91, 234, .23); }
.btn-light { background: #fff; border-color: var(--border); color: #52617b; }
.btn-light:hover { background: #f7f9fd; border-color: #cfd8ea; color: var(--primary); }
.btn-dark { background: var(--navy); border-color: var(--navy); }
.btn-outline-primary { border-color: #cbd7ff; color: var(--primary); }
.btn-outline-primary:hover { background: #eef2ff; border-color: #aebeff; color: var(--primary-dark); }
.form-label { color: #526079; font-size: .76rem; font-weight: 650; margin-bottom: 6px; }
.form-control, .form-select { background-color: #fff; border: 1px solid #dce3ef; border-radius: 9px; color: var(--text); font-size: .82rem; min-height: 38px; padding: .52rem .72rem; }
.form-control::placeholder { color: #a0a9b9; }
.form-control:focus, .form-select:focus { border-color: #8da7ff; box-shadow: 0 0 0 .2rem rgba(49, 91, 234, .11); }
.form-text { color: var(--muted); font-size: .72rem; }
.table { --bs-table-bg: transparent; color: var(--text); margin-bottom: 0; }
.table > :not(caption) > * > * { border-bottom-color: #eef1f6; padding: .78rem .8rem; vertical-align: middle; }
.table thead th { background: #fbfcfe; color: #8791a4; font-size: .66rem; font-weight: 750; letter-spacing: .075em; text-transform: uppercase; white-space: nowrap; }
.table thead tr:first-child th:first-child { border-top-left-radius: var(--radius); }
.table thead tr:first-child th:last-child { border-top-right-radius: var(--radius); }
.table tbody tr { transition: background .12s ease; }
.table tbody tr:hover { background: #f8faff; }
.table td { font-size: .8rem; }
.table-responsive { border-radius: var(--radius); }
.badge { border-radius: 7px; font-size: .67rem; font-weight: 700; padding: .4em .63em; }
.badge-soft { background: #edf1ff; color: #3d5bc0; }
.status-deal { background: #e5f7ef; color: #168052; }.status-lost { background: #ffedef; color: #c64855; }.status-offer { background: #fff4da; color: #a96d00; }.status-new { background: #edf1ff; color: #3d5bc0; }
.empty { color: var(--muted); padding: 44px 18px; text-align: center; }
.empty i { color: #b3bfd5; }
.app-alert { border: 0; border-radius: 11px; box-shadow: var(--shadow-sm); font-size: .8rem; margin-bottom: 20px; padding: .75rem 1rem; }
.app-alert.alert-success { background: #eaf8f1; color: #16734b; }.app-alert.alert-danger { background: #fff0f1; color: #a83844; }
.dropdown-menu { border-radius: 11px; font-size: .8rem; min-width: 180px; padding: 7px; }
.dropdown-item { border-radius: 7px; padding: .55rem .65rem; }
.dropdown-item:hover { background: #f1f4fb; color: var(--primary); }
.pagination { gap: 4px; margin: 0; }
.page-link { border: 0; border-radius: 7px !important; color: #68758d; font-size: .75rem; min-width: 30px; padding: .42rem .62rem; text-align: center; }
.page-link:hover { background: #edf1ff; color: var(--primary); }.page-item.active .page-link { background: var(--primary); color: #fff; }
.import-details { position: relative; }.import-details summary { cursor: pointer; list-style: none; }.import-details summary::-webkit-details-marker { display: none; }.import-popover { background: #fff; border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 16px 35px rgba(24, 38, 70, .14); min-width: 260px; padding: 13px; position: absolute; right: 0; top: calc(100% + 8px); width: min(300px, 90vw); z-index: 20; }.import-popover .form-text { line-height: 1.45; }

/* Dashboard */
.dashboard-hero { align-items: center; background: linear-gradient(115deg, #182849 0%, #243b73 100%); border: 0; border-radius: var(--radius-lg); color: #fff; display: flex; justify-content: space-between; margin-bottom: 18px; overflow: hidden; padding: 22px 25px; position: relative; }
.dashboard-hero::after { border: 1px solid rgba(255,255,255,.12); border-radius: 50%; content: ""; height: 220px; position: absolute; right: 7%; top: -125px; width: 220px; }
.dashboard-hero .eyebrow { color: #a9b9e2; font-size: .7rem; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }.dashboard-hero h1 { font-size: 1.35rem; letter-spacing: -.035em; margin: 5px 0 3px; }.dashboard-hero p { color: #b8c5e2; font-size: .78rem; margin: 0; }
.dashboard-hero .period-pill { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.13); border-radius: 8px; color: #e7ecff; font-size: .73rem; padding: .48rem .7rem; position: relative; z-index: 1; }
.dashboard-heading { align-items: center; margin-bottom: 20px; }.dashboard-heading .period-pill { background: #fff; border: 1px solid var(--border); border-radius: 9px; color: #59667e; font-size: .73rem; padding: .55rem .75rem; }
.funnel-row { align-items: center; display: grid; gap: 10px; grid-template-columns: 1fr 44px 1fr 44px 1fr; }.funnel-step { background: #f8faff; border: 1px solid #e7ecf6; border-radius: 12px; padding: 13px 14px; }.funnel-step .funnel-label { color: var(--muted); font-size: .72rem; }.funnel-step strong { display: block; font-size: 1.15rem; margin-top: 4px; }.funnel-step small { color: var(--muted); font-size: .68rem; }.funnel-arrow { color: #adb8cc; font-size: 1.2rem; text-align: center; }
.value-summary { align-items: center; border-bottom: 1px solid #eef1f6; display: flex; justify-content: space-between; padding: 12px 0; }.value-summary:last-child { border-bottom: 0; }.value-summary span { color: var(--muted); font-size: .77rem; }.value-summary strong { font-size: .88rem; }

/* Dashboard command center */
.dashboard-topline { align-items: flex-end; display: flex; justify-content: space-between; margin-bottom: 20px; }
.dashboard-topline h1 { color: var(--navy); font-size: 1.82rem; font-weight: 780; letter-spacing: -.055em; margin: 4px 0 0; }
.dashboard-topline .eyebrow { color: #52617b; font-size: .78rem; }
.dashboard-period { align-items: center; background: #fff; border: 1px solid #dfe5f1; border-radius: 10px; color: #52617b; display: inline-flex; font-size: .75rem; padding: .62rem .78rem; white-space: nowrap; }
.dashboard-kpis { margin-bottom: 16px; }
.dashboard-kpi-card { border-color: #dce5f6; min-height: 156px; overflow: hidden; padding: 16px 17px 10px; position: relative; }
.dashboard-kpi-card::before { background: var(--kpi-color, var(--primary)); content: ""; height: 2px; inset: 0 0 auto; opacity: .9; position: absolute; }
.dashboard-kpi-card .kpi-caption { color: #53627c; display: block; font-size: .72rem; font-weight: 650; }
.dashboard-kpi-card .kpi-number { color: var(--navy); display: block; font-size: 1.55rem; font-weight: 780; letter-spacing: -.055em; line-height: 1.2; margin-top: 7px; white-space: nowrap; }
.dashboard-kpi-card .kpi-note { color: var(--muted); display: block; font-size: .68rem; margin-top: 5px; white-space: nowrap; }
.dashboard-kpi-card .kpi-note i { color: #13a765; font-size: .86rem; vertical-align: -1px; }
.dashboard-kpi-card .kpi-icon { align-items: center; background: color-mix(in srgb, var(--kpi-color, var(--primary)) 12%, white); border-radius: 11px; color: var(--kpi-color, var(--primary)); display: inline-flex; flex: 0 0 42px; font-size: 1.25rem; height: 42px; justify-content: center; width: 42px; }
.kpi-sparkline { display: block; height: 43px; margin-top: 6px; overflow: visible; width: 100%; }
.kpi-sparkline polyline { fill: none; stroke: var(--kpi-color, var(--primary)); stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; vector-effect: non-scaling-stroke; }
.dashboard-panel { padding: 17px 18px; }
.panel-heading { align-items: flex-start; display: flex; gap: 12px; justify-content: space-between; margin-bottom: 15px; }
.panel-heading h2 { color: var(--navy); font-size: 1rem; font-weight: 750; letter-spacing: -.025em; margin: 0; }
.panel-heading small { color: var(--muted); display: block; font-size: .69rem; margin-top: 4px; }
.metric-pill { background: #f1f4fb; border-radius: 8px; color: #52617b; font-size: .68rem; padding: .43rem .55rem; white-space: nowrap; }
.panel-link { color: var(--primary); font-size: .7rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.panel-link:hover { color: var(--primary-dark); }
.funnel-layout { align-items: center; display: grid; gap: 22px; grid-template-columns: minmax(0, 1.05fr) minmax(135px, .95fr); min-height: 211px; }
.funnel-stack { display: flex; flex-direction: column; gap: 3px; justify-content: center; padding: 5px 0; position: relative; }
.funnel-stack::before { border-left: 1px dashed #d8e0ee; bottom: -3px; content: ""; left: 50%; position: absolute; top: -3px; z-index: 0; }
.funnel-layer { align-items: center; clip-path: polygon(6% 0, 94% 0, 86% 100%, 14% 100%); color: #fff; display: flex; flex-direction: column; height: 43px; justify-content: center; margin: 0 auto; min-width: 92px; position: relative; text-shadow: 0 1px 2px rgba(15, 33, 70, .2); transition: filter .15s ease, transform .15s ease; z-index: 1; }
.funnel-layer:hover { filter: brightness(1.04); transform: scaleX(1.025); z-index: 2; }
.funnel-layer strong { font-size: 1.02rem; letter-spacing: -.02em; line-height: 1.05; }.funnel-layer span { font-size: .61rem; font-weight: 650; opacity: .95; }
.funnel-layer.status-new { background: linear-gradient(135deg, #4b94ff, #2565df); }.funnel-layer.status-offer { background: linear-gradient(135deg, #ffc04b, #f19b0b); }.funnel-layer.status-deal { background: linear-gradient(135deg, #3ad18a, #16a766); }.funnel-layer.status-lost { background: linear-gradient(135deg, #ff6b78, #e74253); }
.funnel-legend { display: grid; gap: 0; }
.funnel-legend > div { border-bottom: 1px solid #eef1f6; padding: 9px 0; }.funnel-legend > div:last-child { border-bottom: 0; }
.funnel-legend > div, .source-list > div { align-items: center; display: grid; gap: 7px; grid-template-columns: 10px minmax(0, 1fr) auto; }
.funnel-legend span:not(.legend-dot), .source-list span:not(.legend-dot) { color: #52617b; font-size: .7rem; }
.funnel-legend strong, .source-list strong { color: var(--navy); font-size: .72rem; }
.legend-dot { background: #bdc7d9; border-radius: 50%; display: inline-block; height: 8px; width: 8px; }.legend-dot.status-new { background: #347bf1; }.legend-dot.status-offer { background: #ffae20; }.legend-dot.status-deal { background: #1eb875; }.legend-dot.status-lost { background: #ef5363; }
.chart-legend { align-items: center; display: flex; gap: 12px; }.chart-legend span { color: #52617b; font-size: .68rem; }.chart-legend .legend-dot { margin-right: 4px; }
.dot-blue { background: #2670ed; }.dot-green { background: #17ad6a; }
.trend-chart { min-height: 211px; padding-top: 5px; }.trend-chart svg { display: block; height: 178px; overflow: visible; width: 100%; }.grid-line { stroke: #e7edf7; stroke-dasharray: 2 4; stroke-width: 1; }.trend-leads, .trend-deals { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 3; vector-effect: non-scaling-stroke; }.trend-leads { stroke: #2670ed; }.trend-deals { stroke: #17ad6a; }.trend-labels { color: #7d8aa3; display: flex; font-size: .64rem; justify-content: space-between; padding: 5px 4px 0; }
.dashboard-chart-canvas { display: none !important; height: 178px !important; width: 100% !important; }.trend-chart.chart-enhanced .dashboard-chart-canvas { display: block !important; }.trend-chart.chart-enhanced .trend-fallback { display: none; }
.source-chart-wrap { align-items: center; display: grid; gap: 19px; grid-template-columns: 145px minmax(0, 1fr); min-height: 211px; }.source-donut { align-items: center; border-radius: 50%; display: flex; height: 145px; justify-content: center; position: relative; width: 145px; }.source-donut::before { background: #fff; border-radius: 50%; content: ""; height: 82px; position: absolute; width: 82px; }.source-donut > div { position: relative; text-align: center; z-index: 1; }.source-donut strong { color: var(--navy); display: block; font-size: 1.15rem; line-height: 1.1; }.source-donut span { color: var(--muted); display: block; font-size: .62rem; margin-top: 4px; }.source-list { display: grid; gap: 10px; }
.recent-list, .activity-feed, .conversion-list { display: grid; gap: 0; }.recent-lead, .activity-item, .conversion-item { align-items: center; border-top: 1px solid #eef1f6; display: flex; gap: 10px; min-width: 0; padding: 10px 0; }.recent-lead:first-child, .activity-item:first-child, .conversion-item:first-child { border-top: 0; padding-top: 0; }.recent-lead:last-child, .activity-item:last-child, .conversion-item:last-child { padding-bottom: 0; }
.recent-avatar { align-items: center; background: #edf1ff; border-radius: 50%; color: var(--primary); display: inline-flex; flex: 0 0 30px; font-size: .72rem; font-weight: 750; height: 30px; justify-content: center; }.recent-main { min-width: 0; }.recent-main strong, .activity-copy strong { color: var(--navy); display: block; font-size: .73rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.recent-main small, .activity-copy small { color: var(--muted); display: block; font-size: .65rem; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.recent-value { color: var(--navy); font-size: .69rem; font-weight: 700; margin-left: auto; text-align: right; white-space: nowrap; }.recent-value small { color: var(--muted); display: block; font-size: .6rem; font-weight: 500; margin-top: 3px; }
.activity-item { align-items: flex-start; gap: 10px; }.activity-icon { align-items: center; background: #edf1ff; border-radius: 50%; color: var(--primary); display: inline-flex; flex: 0 0 30px; height: 30px; justify-content: center; }.activity-icon.offer { background: #fff4da; color: #bc7900; }.activity-icon.deal { background: #e4f7ee; color: #168052; }.activity-icon.lost { background: #ffedef; color: #c64855; }.activity-copy { flex: 1; min-width: 0; }.activity-item > time, .activity-time { color: var(--muted); font-size: .61rem; white-space: nowrap; }
.conversion-item { align-items: flex-start; }.conversion-item .conversion-copy { flex: 1; min-width: 0; }.conversion-copy strong { color: var(--navy); display: block; font-size: .72rem; }.conversion-copy small { color: var(--muted); display: block; font-size: .63rem; margin-top: 3px; }.conversion-value { color: var(--navy); font-size: .68rem; font-weight: 700; white-space: nowrap; }.conversion-status { align-self: center; }

/* Pipeline and timeline */
.pipeline-column { background: #eef2f8; border: 1px solid #e5e9f1; border-radius: 12px; min-height: 390px; padding: 10px; }.pipeline-column-head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 9px; }.pipeline-column-head strong { font-size: .78rem; }.pipeline-column-head small { color: var(--muted); font-size: .68rem; }.pipeline-card { background: #fff; border: 1px solid #e5eaf3; border-radius: 11px; color: var(--text) !important; margin-bottom: 8px; padding: 12px; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }.pipeline-card:hover { border-color: #bdcbf6; box-shadow: 0 8px 18px rgba(30,55,90,.09); transform: translateY(-2px); }.pipeline-card .pipeline-value { color: var(--primary); font-size: .78rem; font-weight: 700; }.timeline { border-left: 2px solid #e3e8f2; margin-left: 8px; padding-left: 22px; }.timeline-item { margin-bottom: 19px; position: relative; }.timeline-item::before { background: var(--primary); border: 3px solid #e9efff; border-radius: 50%; content: ""; height: 12px; left: -29px; position: absolute; top: 2px; width: 12px; }.timeline-item:last-child { margin-bottom: 0; }.timeline-item .timeline-title { font-size: .81rem; font-weight: 700; }.timeline-item .timeline-meta { color: var(--muted); font-size: .69rem; margin-top: 3px; }.timeline-item .timeline-note { color: #5f6c83; font-size: .76rem; line-height: 1.5; margin-top: 5px; }

/* Desktop collapse */
body.sidebar-collapsed .sidebar { width: var(--sidebar-collapsed); }.sidebar-collapsed .main { margin-left: var(--sidebar-collapsed); }.sidebar-collapsed .sidebar-inner { padding-left: 12px; padding-right: 12px; }.sidebar-collapsed .brand { justify-content: center; }.sidebar-collapsed .brand > span:last-child, .sidebar-collapsed .nav-caption, .sidebar-collapsed .sidebar .nav-link span, .sidebar-collapsed .mini-user-copy { display: none; }.sidebar-collapsed .sidebar .nav-link { justify-content: center; padding-left: 0; padding-right: 0; }.sidebar-collapsed .sidebar .nav-link i { margin: 0; }.sidebar-collapsed .mini-user { justify-content: center; }.sidebar-collapsed .logout-link { justify-content: center; }.sidebar-collapsed .sidebar-footer { padding-left: 0; padding-right: 0; }

@media (max-width: 991.98px) {
    .sidebar { transform: translateX(-100%); width: min(var(--sidebar-width), 86vw); }.sidebar.show { transform: translateX(0); }.sidebar-backdrop.show { opacity: 1; pointer-events: auto; }.main, .sidebar-collapsed .main { margin-left: 0; }.topbar { height: 62px; padding: 0 16px; }.content-wrap { padding: 0 16px; }.content { padding-top: 20px; }.sidebar-collapsed .sidebar { width: min(var(--sidebar-width), 86vw); }.sidebar-collapsed .sidebar-inner { padding: 20px 14px 14px; }.sidebar-collapsed .brand > span:last-child, .sidebar-collapsed .nav-caption, .sidebar-collapsed .sidebar .nav-link span, .sidebar-collapsed .mini-user-copy { display: block; }.sidebar-collapsed .sidebar .nav-link, .sidebar-collapsed .mini-user, .sidebar-collapsed .logout-link { justify-content: flex-start; }.today-label { display: none; }.dashboard-topline { align-items: flex-start; }.dashboard-kpi-card { min-height: 145px; }.funnel-layout, .source-chart-wrap { gap: 13px; }.source-chart-wrap { grid-template-columns: 125px minmax(0, 1fr); }.source-donut { height: 125px; width: 125px; }
}
@media (max-width: 575.98px) {
    .page-heading { align-items: flex-start; flex-direction: column; gap: 12px; }.page-heading .btn { width: 100%; }.dashboard-hero { align-items: flex-start; flex-direction: column; gap: 15px; padding: 19px; }.dashboard-hero .period-pill { align-self: stretch; text-align: center; }.funnel-row { gap: 7px; grid-template-columns: 1fr; }.funnel-arrow { transform: rotate(90deg); }.table > :not(caption) > * > * { padding-left: .62rem; padding-right: .62rem; }.profile-copy { display: none !important; }.content { padding-bottom: 28px; }.dashboard-topline { align-items: flex-start; flex-direction: column; gap: 12px; }.dashboard-topline h1 { font-size: 1.55rem; }.dashboard-period { align-self: stretch; justify-content: space-between; }.dashboard-panel { padding: 15px; }.funnel-layout, .source-chart-wrap { grid-template-columns: 1fr; }.funnel-stack { margin: 0 auto; max-width: 280px; width: 100%; }.funnel-legend { grid-template-columns: 1fr 1fr; margin-top: 7px; }.trend-chart { min-height: 190px; }.source-chart-wrap { justify-items: center; }.source-list { width: 100%; }.recent-value { font-size: .64rem; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* Authentication */
.auth-page { background: #f3f6fc; min-height: 100vh; }
.auth-shell { display: grid; grid-template-columns: minmax(360px, .9fr) minmax(440px, 1.1fr); min-height: 100vh; }
.auth-brand-panel { background: linear-gradient(145deg, #101a35, #1c3265); color: #fff; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 44px clamp(32px, 6vw, 100px); position: relative; }
.auth-brand-panel::before { border: 1px solid rgba(255,255,255,.1); border-radius: 50%; content: ""; height: 490px; position: absolute; right: -210px; top: 10%; width: 490px; }.auth-brand-panel::after { background: rgba(87,126,255,.17); border-radius: 50%; content: ""; filter: blur(2px); height: 260px; left: -120px; position: absolute; top: 45%; width: 260px; }
.auth-brand, .auth-form-panel, .auth-copy, .auth-footer { position: relative; z-index: 1; }.auth-brand { align-items: center; display: inline-flex; gap: 11px; }.auth-brand strong { display: block; font-size: 1.05rem; }.auth-brand small { color: #95a6ce; display: block; font-size: .63rem; letter-spacing: .08em; margin-top: 3px; text-transform: uppercase; }.auth-copy { max-width: 470px; }.auth-copy .eyebrow, .auth-form-card .eyebrow { color: var(--primary); font-size: .7rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }.auth-copy .eyebrow { color: #9fb4f6; }.auth-copy h1 { font-size: clamp(2rem, 3vw, 3rem); letter-spacing: -.055em; line-height: 1.08; margin: 13px 0 17px; }.auth-copy p { color: #afbddb; font-size: .9rem; line-height: 1.7; max-width: 410px; }.auth-points { display: grid; gap: 12px; margin-top: 28px; }.auth-points span { color: #dbe4ff; font-size: .8rem; }.auth-points i { color: #8ca8ff; font-size: 1rem; margin-right: 9px; }.auth-footer { color: #8294bd; font-size: .7rem; }
.auth-form-panel { align-items: center; display: flex; justify-content: center; padding: 35px; }.auth-form-card { max-width: 410px; width: 100%; }.auth-form-card h1 { font-size: 1.65rem; font-weight: 760; letter-spacing: -.045em; margin: 9px 0 7px; }.auth-subtitle { color: var(--muted); font-size: .8rem; margin-bottom: 28px; }.auth-form-card .form-label { color: #4c5870; }.input-icon-wrap { align-items: center; position: relative; }.input-icon-wrap > i { color: #9ba5b6; left: 13px; pointer-events: none; position: absolute; z-index: 2; }.input-icon-wrap .form-control { padding-left: 38px; }.input-action-wrap .form-control { padding-right: 42px; }.input-action { background: transparent; border: 0; color: #929db0; height: 36px; position: absolute; right: 3px; top: 1px; width: 38px; z-index: 2; }.input-action:hover { color: var(--primary); }.auth-form-card .form-check-label { color: #768197; font-size: .76rem; }.auth-form-card .form-check-input:checked { background-color: var(--primary); border-color: var(--primary); }
@media (max-width: 767.98px) { .auth-shell { display: block; }.auth-brand-panel { display: none; }.auth-form-panel { min-height: 100vh; padding: 28px 20px; }.auth-brand-dark strong { color: var(--navy); }.auth-brand-dark small { color: var(--muted); }.auth-form-card h1 { font-size: 1.5rem; } }
.notification-count { align-items: center; background: #e5484d; border: 2px solid #fff; border-radius: 999px; color: #fff; display: flex; font-size: .58rem; font-weight: 700; height: 17px; justify-content: center; line-height: 1; min-width: 17px; padding: 0 3px; position: absolute; right: -4px; top: -5px; }