:root {
    --bg: #f4f6fb;
    --bg-accent: radial-gradient(circle at 10% 10%, rgba(110, 163, 255, 0.24), transparent 35%), radial-gradient(circle at 80% 15%, rgba(108, 224, 197, 0.18), transparent 30%), radial-gradient(circle at 40% 90%, rgba(255, 203, 168, 0.18), transparent 34%);
    --surface: rgba(255, 255, 255, 0.76);
    --surface-strong: #ffffff;
    --text: #0e1320;
    --muted: #5e6a84;
    --primary: #1f66ff;
    --primary-dark: #0f4fd4;
    --border: rgba(21, 33, 61, 0.12);
    --success: #1ea672;
    --error: #d64545;
    --warning: #c17a17;
    --radius-lg: 20px;
    --radius-md: 14px;
    --radius-sm: 10px;
    --shadow: 0 16px 45px rgba(15, 37, 84, 0.13);
}

/* Manager call script */
body.route-scripts.route-clients .content-wrap {
    background: #f4f6fa;
}

body.route-scripts.route-clients .main-content {
    overflow-x: clip;
}

body.route-scripts.route-clients .sales-script {
    width: min(1460px, 100%);
    margin: 1rem auto 2.5rem;
    padding: 0 1.25rem 3rem;
    color: #1e293b;
}

body.route-scripts.route-clients .sales-script-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(285px, 0.8fr);
    gap: 2rem;
    align-items: end;
    padding: clamp(1.75rem, 4vw, 3.25rem);
    border-radius: 28px;
    background: linear-gradient(135deg, #1068ec 0%, #287ff6 57%, #6aa5ff 100%);
    color: #fff;
    box-shadow: 0 20px 42px rgba(31, 101, 221, 0.19);
}

body.route-scripts.route-clients .sales-script-eyebrow,
body.route-scripts.route-clients .sales-script-section-title > div > span,
body.route-scripts.route-clients .sales-script-step small {
    display: block;
    font-size: 0.73rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.route-scripts.route-clients .sales-script-eyebrow {
    color: rgba(255, 255, 255, 0.76);
}

body.route-scripts.route-clients .sales-script-hero h1 {
    max-width: 760px;
    margin: 0.7rem 0 0;
    color: #fff;
    font-size: clamp(2rem, 4.2vw, 4rem);
    line-height: 0.98;
    letter-spacing: -0.055em;
}

body.route-scripts.route-clients .sales-script-hero p {
    max-width: 650px;
    margin: 1.25rem 0 0;
    color: rgba(255, 255, 255, 0.84);
    font-size: 1.03rem;
    line-height: 1.55;
}

body.route-scripts.route-clients .sales-script-hero-goal {
    display: grid;
    gap: 0.28rem;
    padding: 1.3rem;
    border: 1px solid rgba(255, 255, 255, 0.26);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(10px);
}

body.route-scripts.route-clients .sales-script-goal-icon {
    display: grid;
    width: 2.15rem;
    height: 2.15rem;
    margin-bottom: 0.65rem;
    place-items: center;
    border-radius: 10px;
    background: #fff;
    color: #166ceb;
    font-size: 1.35rem;
    font-weight: 800;
}

body.route-scripts.route-clients .sales-script-hero-goal > span:not(.sales-script-goal-icon),
body.route-scripts.route-clients .sales-script-hero-goal small {
    color: rgba(255, 255, 255, 0.77);
    font-size: 0.84rem;
}

body.route-scripts.route-clients .sales-script-hero-goal strong {
    font-size: 1.45rem;
    line-height: 1.15;
}

body.route-scripts.route-clients .sales-script-layout {
    display: grid;
    grid-template-columns: minmax(235px, 0.62fr) minmax(0, 1.78fr);
    gap: 1.25rem;
    align-items: start;
    margin-top: 1.25rem;
}

body.route-scripts.route-clients .sales-script-pocket,
body.route-scripts.route-clients .sales-script-card {
    border: 1px solid #e1e7f0;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(30, 41, 59, 0.045);
}

body.route-scripts.route-clients .sales-script-pocket {
    padding: 1.25rem;
}

body.route-scripts.route-clients .sales-script-pocket-head {
    display: grid;
    gap: 0.22rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e8edf4;
}

body.route-scripts.route-clients .sales-script-pocket-head span {
    color: #16233b;
    font-size: 1.05rem;
    font-weight: 800;
}

body.route-scripts.route-clients .sales-script-pocket-head small,
body.route-scripts.route-clients .sales-script-pocket-list span {
    color: #718096;
    line-height: 1.43;
}

body.route-scripts.route-clients .sales-script-pocket-list {
    display: grid;
    gap: 0.85rem;
    margin: 1rem 0;
    padding: 0;
    list-style: none;
    counter-reset: pocket;
}

body.route-scripts.route-clients .sales-script-pocket-list li {
    position: relative;
    padding-left: 2rem;
    counter-increment: pocket;
}

body.route-scripts.route-clients .sales-script-pocket-list li::before {
    position: absolute;
    top: 0.05rem;
    left: 0;
    display: grid;
    width: 1.35rem;
    height: 1.35rem;
    place-items: center;
    border-radius: 50%;
    background: #e9f2ff;
    color: #146fea;
    content: counter(pocket);
    font-size: 0.7rem;
    font-weight: 800;
}

body.route-scripts.route-clients .sales-script-pocket-list b,
body.route-scripts.route-clients .sales-script-pocket-list span {
    display: block;
    font-size: 0.82rem;
}

body.route-scripts.route-clients .sales-script-pocket-list b {
    margin-bottom: 0.14rem;
    color: #24334d;
}

body.route-scripts.route-clients .sales-script-pocket-note {
    padding: 0.8rem;
    border-radius: 14px;
    background: #f5f8fd;
    color: #53637a;
    font-size: 0.78rem;
    line-height: 1.45;
}

body.route-scripts.route-clients .sales-script-main {
    display: grid;
    gap: 1.25rem;
}

body.route-scripts.route-clients .sales-script-card {
    padding: clamp(1.15rem, 2.7vw, 2rem);
}

body.route-scripts.route-clients .sales-script-section-title {
    display: flex;
    gap: 0.85rem;
    align-items: center;
    margin-bottom: 1.35rem;
}

body.route-scripts.route-clients .sales-script-number {
    display: grid;
    flex: 0 0 auto;
    width: 2.45rem;
    height: 2.45rem;
    place-items: center;
    border-radius: 11px;
    background: #eaf3ff;
    color: #126eea;
    font-size: 0.78rem;
    font-weight: 900;
}

body.route-scripts.route-clients .sales-script-section-title > div > span,
body.route-scripts.route-clients .sales-script-step small {
    color: #8997ab;
}

body.route-scripts.route-clients .sales-script-section-title h2 {
    margin: 0.2rem 0 0;
    color: #1b273a;
    font-size: clamp(1.2rem, 2vw, 1.65rem);
    line-height: 1.1;
    letter-spacing: -0.035em;
}

body.route-scripts.route-clients .sales-script-checks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

body.route-scripts.route-clients .sales-script-checks > div {
    padding: 0.9rem 0.95rem 0.9rem 2.55rem;
    border-radius: 15px;
    background: #f5f8fc;
    color: #4c5b71;
    font-size: 0.86rem;
    line-height: 1.45;
}

body.route-scripts.route-clients .sales-script-checks > div::before {
    position: absolute;
    margin: 0.08rem 0 0 -1.58rem;
    color: #138d54;
    content: '✓';
    font-size: 1rem;
    font-weight: 900;
}

body.route-scripts.route-clients .sales-script-tip {
    margin: 1rem 0 0;
    padding: 0.85rem 1rem;
    border-left: 3px solid #2d7cf4;
    border-radius: 0 12px 12px 0;
    background: #f0f6ff;
    color: #52647b;
    font-size: 0.88rem;
    line-height: 1.5;
}

body.route-scripts.route-clients .sales-script-tip b {
    color: #1d4f9f;
}

body.route-scripts.route-clients .sales-script-steps {
    display: grid;
    gap: 0;
}

body.route-scripts.route-clients .sales-script-step {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: 0.8rem;
    padding: 1rem 0;
    border-top: 1px solid #e8edf3;
}

body.route-scripts.route-clients .sales-script-step:first-child {
    padding-top: 0;
    border-top: 0;
}

body.route-scripts.route-clients .sales-script-step:last-child {
    padding-bottom: 0;
}

body.route-scripts.route-clients .sales-script-step > span {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: 50%;
    background: #1b74ee;
    color: #fff;
    font-size: 0.82rem;
    font-weight: 900;
}

body.route-scripts.route-clients .sales-script-step h3 {
    margin: 0.2rem 0 0.6rem;
    color: #24334d;
    font-size: 1rem;
}

body.route-scripts.route-clients .sales-script blockquote {
    margin: 0;
    padding: 0.8rem 1rem;
    border-radius: 12px;
    background: #f6f8fb;
    color: #40516a;
    font-size: 0.91rem;
    line-height: 1.55;
}

body.route-scripts.route-clients .sales-script-question-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

body.route-scripts.route-clients .sales-script-question-chips span,
body.route-scripts.route-clients .sales-script-statuses {
    border-radius: 10px;
    background: #f0f5fc;
    color: #4c6380;
}

body.route-scripts.route-clients .sales-script-question-chips span {
    padding: 0.48rem 0.62rem;
    font-size: 0.8rem;
    line-height: 1.35;
}

body.route-scripts.route-clients .sales-script-branch-grid,
body.route-scripts.route-clients .sales-script-industry-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

body.route-scripts.route-clients .sales-script details {
    overflow: hidden;
    border: 1px solid #e3e9f1;
    border-radius: 14px;
    background: #fff;
}

body.route-scripts.route-clients .sales-script summary {
    display: flex;
    gap: 0.7rem;
    align-items: center;
    padding: 0.85rem 1rem;
    color: #2b3a52;
    cursor: pointer;
    font-size: 0.88rem;
    font-weight: 750;
    line-height: 1.35;
    list-style: none;
}

body.route-scripts.route-clients .sales-script summary::-webkit-details-marker {
    display: none;
}

body.route-scripts.route-clients .sales-script summary::after {
    margin-left: auto;
    color: #2b77e9;
    content: '+';
    font-size: 1.25rem;
    font-weight: 500;
}

body.route-scripts.route-clients .sales-script details[open] summary {
    border-bottom: 1px solid #e7edf5;
    background: #f8fbff;
}

body.route-scripts.route-clients .sales-script details[open] summary::after {
    content: '−';
}

body.route-scripts.route-clients .sales-script-branch-grid details p {
    margin: 0;
    padding: 0.8rem 1rem 0.95rem;
    color: #5d6b80;
    font-size: 0.84rem;
    line-height: 1.48;
}

body.route-scripts.route-clients .sales-script-objection-list {
    display: grid;
    gap: 0.65rem;
}

body.route-scripts.route-clients .sales-script-objection-list blockquote {
    margin: 0 0.75rem 0.75rem;
}

body.route-scripts.route-clients .sales-script-industry-grid article {
    padding: 0.9rem 1rem;
    border-radius: 14px;
    background: #f7f9fc;
}

body.route-scripts.route-clients .sales-script-industry-grid article > span {
    display: inline-block;
    padding: 0.28rem 0.5rem;
    border-radius: 7px;
    background: #e5f0ff;
    color: #126de9;
    font-size: 0.73rem;
    font-weight: 850;
}

body.route-scripts.route-clients .sales-script-industry-grid p {
    margin: 0.6rem 0 0;
    color: #55657b;
    font-size: 0.86rem;
    line-height: 1.48;
}

body.route-scripts.route-clients .sales-script-after-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 0.75rem;
}

body.route-scripts.route-clients .sales-script-after-grid > div {
    padding: 1rem;
    border-radius: 15px;
    background: #f7f9fc;
}

body.route-scripts.route-clients .sales-script-after-grid h3 {
    margin: 0;
    color: #2a3850;
    font-size: 0.92rem;
}

body.route-scripts.route-clients .sales-script-after-grid ul {
    display: grid;
    gap: 0.38rem;
    margin: 0.65rem 0 0;
    padding-left: 1rem;
    color: #627188;
    font-size: 0.83rem;
    line-height: 1.38;
}

body.route-scripts.route-clients .sales-script-statuses {
    margin: 0.65rem 0 0;
    padding: 0.75rem;
    font-size: 0.84rem;
    line-height: 1.55;
}

body.route-scripts.route-clients .sales-script-finish {
    margin-top: 0.9rem;
    padding: 1rem 1.1rem;
    border-radius: 14px;
    background: #edf8f1;
    color: #277244;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.5;
}

@media (min-width: 1000px) {
    body.route-scripts.route-clients .sales-script-pocket {
        position: sticky;
        top: 1rem;
    }
}

@media (max-width: 900px) {
    body.route-scripts.route-clients .sales-script-layout,
    body.route-scripts.route-clients .sales-script-hero {
        grid-template-columns: 1fr;
    }

    body.route-scripts.route-clients .sales-script-checks {
        grid-template-columns: 1fr;
    }

    body.route-scripts.route-clients .sales-script-pocket-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 1.25rem;
    }
}

@media (max-width: 600px) {
    body.route-scripts.route-clients .sales-script {
        margin-top: 0.55rem;
        padding: 0 0.65rem 1.5rem;
    }

    body.route-scripts.route-clients .sales-script-hero,
    body.route-scripts.route-clients .sales-script-card,
    body.route-scripts.route-clients .sales-script-pocket {
        border-radius: 19px;
    }

    body.route-scripts.route-clients .sales-script-hero {
        gap: 1.25rem;
        padding: 1.35rem;
    }

    body.route-scripts.route-clients .sales-script-hero h1 {
        font-size: 2.15rem;
    }

    body.route-scripts.route-clients .sales-script-hero p {
        font-size: 0.9rem;
    }

    body.route-scripts.route-clients .sales-script-pocket-list,
    body.route-scripts.route-clients .sales-script-branch-grid,
    body.route-scripts.route-clients .sales-script-industry-grid,
    body.route-scripts.route-clients .sales-script-after-grid {
        grid-template-columns: 1fr;
    }

    body.route-scripts.route-clients .sales-script-layout,
    body.route-scripts.route-clients .sales-script-main {
        gap: 0.75rem;
    }

    body.route-scripts.route-clients .sales-script-card,
    body.route-scripts.route-clients .sales-script-pocket {
        padding: 1rem;
    }

    body.route-scripts.route-clients .sales-script-section-title {
        margin-bottom: 1rem;
    }

    body.route-scripts.route-clients .sales-script-section-title h2 {
        font-size: 1.25rem;
    }

    body.route-scripts.route-clients .sales-script-step {
        grid-template-columns: 1.9rem minmax(0, 1fr);
        gap: 0.65rem;
    }
}

/* Admin reports */
body.route-reports.route-clients .reports-screen {
    display: grid;
    gap: 0.95rem;
    margin-top: 1rem;
    padding: 0.2rem 0 1rem;
}

body.route-reports.route-clients .reports-screen > *,
body.route-reports.route-clients .reports-kpi-grid,
body.route-reports.route-clients .reports-detail-grid,
body.route-reports.route-clients .reports-kpi-card,
body.route-reports.route-clients .reports-panel,
body.route-reports.route-clients .reports-table-panel,
body.route-reports.route-clients .reports-activity-panel {
    min-width: 0;
}

body.route-reports.route-clients .reports-intro,
body.route-reports.route-clients .reports-panel-head,
body.route-reports.route-clients .reports-activity-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

body.route-reports.route-clients .reports-eyebrow {
    display: block;
    margin-bottom: 0.25rem;
    color: #2672ff;
    font-size: 0.73rem;
    font-weight: 800;
    letter-spacing: 0.09em;
}

body.route-reports.route-clients .reports-intro h1,
body.route-reports.route-clients .reports-panel h2,
body.route-reports.route-clients .reports-table-panel h2,
body.route-reports.route-clients .reports-activity-panel h2 {
    margin: 0;
    color: #161b28;
    letter-spacing: -0.045em;
}

body.route-reports.route-clients .reports-intro h1 {
    font-size: clamp(1.7rem, 2.7vw, 2.25rem);
    line-height: 100%;
}
body.route-reports.route-clients .reports-panel h2,
body.route-reports.route-clients .reports-table-panel h2,
body.route-reports.route-clients .reports-activity-panel h2 { font-size: 1.02rem; }

body.route-reports.route-clients .reports-intro p,
body.route-reports.route-clients .reports-panel-head p {
    margin: 0.3rem 0 0;
    color: #8d96a5;
    font-size: 0.84rem;
    font-weight: 600;
}

body.route-reports.route-clients .reports-period-badge,
body.route-reports.route-clients .reports-alert-chip,
body.route-reports.route-clients .reports-success-chip {
    display: inline-flex;
    align-items: center;
    min-height: 31px;
    padding: 0.35rem 0.8rem;
    border-radius: 999px;
    white-space: nowrap;
    font-size: 0.75rem;
    font-weight: 800;
}

body.route-reports.route-clients .reports-period-badge { color: #2871f9; background: #eaf2ff; }
body.route-reports.route-clients .reports-alert-chip { color: #d54646; background: #fff0f0; }
body.route-reports.route-clients .reports-success-chip { color: #159358; background: #eaf8f0; }
body.route-reports.route-clients .reports-call-result-chips { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.4rem; }

body.route-reports.route-clients .reports-filter-card,
body.route-reports.route-clients .reports-panel,
body.route-reports.route-clients .reports-table-panel,
body.route-reports.route-clients .reports-activity-panel {
    border: 1px solid #e2e7ef;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 9px 24px rgba(30, 50, 82, 0.055);
}

body.route-reports.route-clients .reports-filter-card { padding: 0.8rem; }

body.route-reports.route-clients .reports-filter-form {
    display: grid;
    grid-template-columns: minmax(230px, 1.5fr) minmax(145px, 0.72fr) minmax(145px, 0.72fr) auto;
    gap: 0.65rem;
    align-items: end;
}

body.route-reports.route-clients .reports-filter-field { display: grid; gap: 0.3rem; }
body.route-reports.route-clients .reports-filter-field > span {
    color: #8b95a6;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

body.route-reports.route-clients .reports-filter-field select,
body.route-reports.route-clients .reports-filter-field input {
    width: 100%;
    min-height: 42px;
    border: 1px solid #d8e0ed;
    border-radius: 11px;
    background: #f9fbff;
    color: #22344f;
    font: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    padding: 0 0.75rem;
}

body.route-reports.route-clients .reports-filter-submit { min-height: 42px; padding-inline: 1.25rem; color: #fff; }

body.route-reports.route-clients .reports-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

body.route-reports.route-clients .reports-kpi-card {
    min-width: 0;
    min-height: 153px;
    padding: 1.15rem 1.2rem;
    border: 1px solid #e5e9f0;
    border-radius: 19px;
    background: #fff;
    box-shadow: 0 10px 22px rgba(29, 47, 78, 0.05);
}

body.route-reports.route-clients .reports-kpi-label {
    display: block;
    color: #8c96a5;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

body.route-reports.route-clients .reports-kpi-card strong {
    display: block;
    margin-top: 0.55rem;
    color: #171c28;
    font-size: clamp(1.62rem, 2.4vw, 2.22rem);
    line-height: 1;
    letter-spacing: -0.055em;
}

body.route-reports.route-clients .reports-kpi-card small {
    display: block;
    margin-top: 0.68rem;
    color: #7c8798;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.35;
}

body.route-reports.route-clients .reports-kpi-card.is-blue { border-top: 3px solid #2a70ff; }
body.route-reports.route-clients .reports-kpi-card.is-violet { border-top: 3px solid #8a67ed; }
body.route-reports.route-clients .reports-kpi-card.is-green { border-top: 3px solid #1da86e; }
body.route-reports.route-clients .reports-kpi-card.is-amber { border-top: 3px solid #f39a25; }

body.route-reports.route-clients .reports-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.85rem;
}

body.route-reports.route-clients .reports-panel,
body.route-reports.route-clients .reports-table-panel,
body.route-reports.route-clients .reports-activity-panel { padding: 1.1rem 1.2rem; }

body.route-reports.route-clients .reports-result-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    margin-top: 1rem;
}

body.route-reports.route-clients .reports-result-grid > div {
    padding: 0.68rem 0.72rem;
    border-radius: 12px;
    background: #f7f9fc;
}

body.route-reports.route-clients .reports-result-grid span,
body.route-reports.route-clients .reports-list-metrics dt {
    color: #8a94a5;
    font-size: 0.72rem;
    font-weight: 700;
}

body.route-reports.route-clients .reports-result-grid strong {
    display: block;
    margin-top: 0.18rem;
    color: #1a2230;
    font-size: 1.15rem;
}

body.route-reports.route-clients .reports-list-metrics { margin: 0.85rem 0 0; }
body.route-reports.route-clients .reports-list-metrics > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.43rem 0;
    border-bottom: 1px solid #edf0f4;
}
body.route-reports.route-clients .reports-list-metrics > div:last-child { border-bottom: 0; }
body.route-reports.route-clients .reports-list-metrics dd { margin: 0; color: #1a2130; font-size: 0.9rem; font-weight: 800; }
body.route-reports.route-clients .reports-list-metrics .is-danger dd { color: #db4c4c; }
body.route-reports.route-clients .reports-list-metrics .is-success dd { color: #159358; }

body.route-reports.route-clients .reports-table-panel .table-wrap {
    max-width: 100%;
    margin-top: 0.75rem;
    overflow-x: auto;
}
body.route-reports.route-clients .reports-table { min-width: 720px; }
body.route-reports.route-clients .reports-table th { color: #8791a2; font-size: 0.7rem; letter-spacing: 0.055em; text-transform: uppercase; }
body.route-reports.route-clients .reports-table td { color: #344054; font-size: 0.85rem; }
body.route-reports.route-clients .reports-table td small { margin-left: 0.2rem; color: #8c96a5; font-weight: 700; }
body.route-reports.route-clients .reports-table .reports-call-split { display: block; margin: 0.18rem 0 0; font-size: 0.68rem; white-space: nowrap; }

/* Managers can create a meeting, client or task from every screen. */
body.role-manager .manager-create-fab {
    position: fixed;
    right: 1.5rem;
    bottom: 1.5rem;
    z-index: 70;
}

body.role-manager .manager-create-menu { position: relative; }
body.role-manager .manager-create-menu summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 50%;
    background: #0071e3;
    color: #ffffff;
    cursor: pointer;
    list-style: none;
    box-shadow: 0 10px 24px rgba(0, 113, 227, 0.34);
    transition: transform 0.18s ease, background-color 0.18s ease;
}

body.role-manager .manager-create-menu summary::-webkit-details-marker { display: none; }
body.role-manager .manager-create-menu summary svg { width: 25px; height: 25px; }
body.role-manager .manager-create-menu[open] summary { background: #005bb8; transform: rotate(45deg); }

body.role-manager .manager-create-menu-popover {
    position: absolute;
    right: 0;
    bottom: calc(100% + 0.65rem);
    display: grid;
    min-width: 154px;
    padding: 0.42rem;
    border: 1px solid #dce3ed;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 14px 30px rgba(28, 44, 72, 0.18);
}

body.role-manager .manager-create-menu-popover button {
    min-height: 38px;
    padding: 0.5rem 0.72rem;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #27364d;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 750;
    text-align: left;
    cursor: pointer;
}

body.role-manager .manager-create-menu-popover button:hover { background: #f1f6ff; color: #0071e3; }

@media (max-width: 860px) {
    body.role-manager .manager-create-fab { right: 1rem; bottom: max(1rem, env(safe-area-inset-bottom)); }
    body.role-manager .manager-create-menu summary { width: 52px; height: 52px; }
}
body.route-reports.route-clients .reports-money-cell { color: #178c57 !important; font-weight: 800; }
body.route-reports.route-clients .reports-danger-cell { color: #da4d4d !important; font-weight: 800; }
body.route-reports.route-clients .reports-inactive { display: block; color: #a0a7b2; font-size: 0.68rem; font-weight: 700; }

body.route-reports.route-clients .reports-activity-list { display: grid; margin-top: 0.8rem; }
body.route-reports.route-clients .reports-activity-item {
    padding: 0.78rem 0;
    border-bottom: 1px solid #edf0f4;
}
body.route-reports.route-clients .reports-activity-item:last-child { border-bottom: 0; }
body.route-reports.route-clients .reports-activity-main { min-width: 0; }
body.route-reports.route-clients .reports-activity-main strong { display: block; color: #202837; font-size: 0.9rem; }
body.route-reports.route-clients .reports-activity-main span,
body.route-reports.route-clients .reports-activity-main p,
body.route-reports.route-clients .reports-activity-meta time { color: #8993a3; font-size: 0.76rem; font-weight: 600; }
body.route-reports.route-clients .reports-activity-main p { margin: 0.28rem 0 0; color: #596579; }
body.route-reports.route-clients .reports-activity-meta { display: grid; justify-items: end; gap: 0.3rem; text-align: right; }
body.route-reports.route-clients .reports-empty-state { margin: 0.95rem 0 0; }

@media (max-width: 1080px) {
    body.route-reports.route-clients .reports-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.route-reports.route-clients .reports-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    body.route-reports.route-clients .reports-intro,
    body.route-reports.route-clients .reports-panel-head,
    body.route-reports.route-clients .reports-activity-item { gap: 0.65rem; }
    body.route-reports.route-clients .reports-intro { display: grid; }
    body.route-reports.route-clients .reports-filter-form { grid-template-columns: 1fr 1fr; }
    body.route-reports.route-clients .reports-filter-manager,
    body.route-reports.route-clients .reports-filter-submit { grid-column: 1 / -1; }
}

/* The sales playbook is intentionally isolated in its own document: its
   typography and reading rhythm remain exactly as approved, while CRM keeps
   ownership of the sidebar and application shell around it. */
body.route-scripts .page-content,
body.route-manager_plan .page-content {
    padding: 0;
    overflow: hidden;
}

body.route-scripts .scripts-embed,
body.route-manager_plan .scripts-embed {
    width: 100%;
    min-height: calc(100vh - 1px);
}

body.route-scripts .scripts-embed-frame,
body.route-manager_plan .scripts-embed-frame {
    display: block;
    width: 100%;
    height: calc(100vh - 1px);
    min-height: 720px;
    border: 0;
    background: #fff;
}

@media (max-width: 720px) {
    body.route-scripts .scripts-embed-frame,
    body.route-manager_plan .scripts-embed-frame {
        min-height: 100vh;
        height: 100vh;
    }
}

@media (max-width: 520px) {
    body.route-reports.route-clients .reports-kpi-grid,
    body.route-reports.route-clients .reports-filter-form { grid-template-columns: 1fr; }
    body.route-reports.route-clients .reports-filter-manager,
    body.route-reports.route-clients .reports-filter-submit { grid-column: auto; }
    body.route-reports.route-clients .reports-activity-item { display: grid; }
    body.route-reports.route-clients .reports-activity-meta { justify-items: start; text-align: left; }
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    min-height: 100%;
}

body {
    font-family: 'Manrope', sans-serif;
    color: var(--text);
    background: var(--bg-accent), var(--bg);
    line-height: 1.45;
}

a {
    color: var(--primary);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.app-shell {
    width: min(1440px, calc(100% - 2rem));
    margin: 1rem auto 2rem;
}

.glass {
    background: var(--surface);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.42);
    box-shadow: var(--shadow);
}

.app-layout {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.sidebar {
    border-radius: var(--radius-lg);
    padding: 1rem;
    position: sticky;
    top: 1rem;
    min-height: calc(100vh - 2rem);
    display: flex;
    flex-direction: column;
}

.brand-block {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.brand-dot {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1f66ff, #60c8ff);
    box-shadow: 0 8px 22px rgba(31, 102, 255, 0.35);
}

.brand-block strong {
    display: block;
    font-size: 0.95rem;
}

.brand-block small {
    color: var(--muted);
    font-size: 0.75rem;
}

.sidebar-nav {
    margin-top: 1rem;
    display: grid;
    gap: 0.35rem;
}

.sidebar-nav a {
    padding: 0.62rem 0.72rem;
    border-radius: 12px;
    font-weight: 600;
    color: #24385f;
    border: 1px solid transparent;
}

.sidebar-nav a.active,
.sidebar-nav a:hover {
    background: rgba(31, 102, 255, 0.13);
    border-color: rgba(31, 102, 255, 0.18);
    text-decoration: none;
}

.sidebar-footer {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid rgba(14, 30, 62, 0.12);
    display: grid;
    gap: 0.65rem;
}

.sidebar-user {
    display: grid;
    gap: 0.2rem;
}

.sidebar-user strong {
    font-size: 0.9rem;
}

.sidebar-user small {
    color: var(--muted);
    font-size: 0.8rem;
}

.btn-full {
    width: 100%;
}

.content-wrap {
    min-width: 0;
}

.content-wrap-auth {
    width: min(900px, 100%);
    margin: 0 auto;
}

.page-header {
    margin-bottom: 1rem;
}

.page-header h1 {
    margin: 0;
    font-size: clamp(1.35rem, 2.6vw, 2rem);
    letter-spacing: -0.02em;
}

.page-header p {
    margin: 0.3rem 0 0;
    color: var(--muted);
}

.global-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    margin: 0 0 0.65rem;
    padding: 0.5rem 0.82rem;
    border: 0;
    border-bottom: 1px solid #e7ebf0;
    background: #ffffff;
}

body.route-clients .global-page-header {
    margin-left: -1.1rem;
    margin-right: -1.1rem;
    padding-left: 1.1rem;
    padding-right: 1.1rem;
}

body.route-dashboard.role-manager .global-page-header {
    margin-left: -0.9rem;
    margin-right: -0.9rem;
    padding-left: 0.9rem;
    padding-right: 0.9rem;
}

.global-page-header-left {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 1.8rem;
}

.global-page-header h1 {
    margin: 0;
    color: #1e2430;
    font-size: 1rem;
    letter-spacing: 0;
    line-height: 1.08;
}

.global-page-date {
    display: inline-flex;
    align-items: center;
    gap: 0.36rem;
    margin-left: 0.95rem;
    color: #505050;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.global-page-date svg {
    width: 16px;
    height: 16px;
}

.global-page-header-right {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.56rem;
    min-width: 0;
    margin-left: auto;
}

.global-quick-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.48rem;
    flex: 0 0 auto;
}

.global-quick-action {
    min-height: 38px;
    padding: 0.5rem 1rem;
    border-radius: 999px;
    border: 1px solid #cfd4db;
    background: #ffffff;
    color: #2a2f37;
    font-family: inherit;
    font-size: 0.78rem;
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: none;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.global-quick-action:hover {
    background: #f7f8fb;
}

.global-quick-action.is-primary:hover {
    background: #3f3f3a;
}

.global-quick-action.is-primary {
    border-color: #4c4c46;
    background: #4c4c46;
    color: #ffffff;
}

@media (max-width: 1180px) {
    .global-page-header {
        align-items: flex-start;
    }

    .global-page-header-right {
        flex: 1 1 auto;
        flex-wrap: wrap;
        row-gap: 0.42rem;
    }

    .global-focus-chip {
        max-width: 100%;
    }

    .global-quick-actions {
        width: 100%;
    }
}

.global-focus-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.36rem;
    border-radius: 999px;
    padding: 0.42rem 0.72rem;
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    max-width: 560px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.global-focus-chip-icon {
    width: 16px;
    height: 16px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.global-focus-chip-icon svg {
    width: 14px;
    height: 14px;
}

.global-focus-chip-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.global-focus-chip.is-good {
    background: #e9f8ee;
    color: #1f9754;
}

.global-focus-chip.is-good .global-focus-chip-icon {
    background: rgba(31, 151, 84, 0.16);
}

.global-focus-chip.is-warn {
    background: #fff7e8;
    color: #ae7816;
}

.global-focus-chip.is-warn .global-focus-chip-icon {
    background: rgba(174, 120, 22, 0.16);
}

.global-focus-chip.is-danger {
    background: #ffe8e8;
    color: #d43636;
}

.global-focus-chip.is-danger .global-focus-chip-icon {
    background: rgba(212, 54, 54, 0.16);
}

.global-bell-btn {
    position: relative;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 10px;
    background: #ef1d1d;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.global-bell-btn svg {
    width: 16px;
    height: 16px;
}

.global-bell-badge {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 16px;
    height: 16px;
    border-radius: 999px;
    background: #111827;
    color: #ffffff;
    border: 1px solid #ffffff;
    font-size: 0.62rem;
    line-height: 1;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.2rem;
}

.card {
    background: var(--surface-strong);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 1rem;
    margin-bottom: 1rem;
}

.grid-cards {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
}

.grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.stat-card strong,
.mini-card strong {
    font-size: clamp(1.4rem, 3vw, 2rem);
    letter-spacing: -0.02em;
}

.stat-card h3,
.mini-card h3 {
    margin: 0 0 0.4rem;
    font-size: 0.9rem;
    color: var(--muted);
    font-weight: 700;
}

.stat-card small {
    display: block;
    margin-top: 0.3rem;
    font-size: 0.78rem;
    line-height: 1.3;
}

.muted {
    color: var(--muted);
}

.section-title-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.section-title-row h2 {
    margin: 0;
    font-size: 1.1rem;
}

.table-wrap {
    overflow: auto;
}

.table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.table th,
.table td {
    text-align: left;
    border-bottom: 1px solid rgba(16, 33, 61, 0.1);
    padding: 0.62rem 0.55rem;
    vertical-align: top;
}

.table th {
    white-space: nowrap;
    color: #1e3156;
    font-size: 0.8rem;
}

.truncate-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.35;
    max-height: 2.7em;
    word-break: break-word;
    white-space: normal;
}

.table .truncate-2 {
    max-width: 210px;
}

.table .truncate-wide {
    max-width: 290px;
}

.form-grid {
    display: grid;
    gap: 0.72rem;
}

.two-cols {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

label {
    display: grid;
    gap: 0.32rem;
    font-size: 0.85rem;
    color: #1e2f52;
    font-weight: 600;
}

input,
select,
textarea {
    width: 100%;
    border-radius: var(--radius-sm);
    border: 1px solid rgba(14, 29, 61, 0.17);
    padding: 0.64rem 0.72rem;
    font: inherit;
    background: #ffffff;
    color: var(--text);
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: rgba(31, 102, 255, 0.6);
    box-shadow: 0 0 0 4px rgba(31, 102, 255, 0.12);
}

label.field-has-error {
    color: var(--error);
}

input.is-invalid,
select.is-invalid,
textarea.is-invalid {
    border-color: rgba(214, 69, 69, 0.8);
    box-shadow: 0 0 0 3px rgba(214, 69, 69, 0.14);
}

input.is-invalid:focus,
select.is-invalid:focus,
textarea.is-invalid:focus {
    border-color: rgba(214, 69, 69, 0.9);
    box-shadow: 0 0 0 4px rgba(214, 69, 69, 0.18);
}

textarea {
    resize: vertical;
}

.full-row {
    grid-column: 1 / -1;
}

.form-actions,
.form-actions-inline {
    display: flex;
    gap: 0.6rem;
    align-items: center;
    flex-wrap: wrap;
}

.inline-form {
    display: inline-flex;
    gap: 0.45rem;
    align-items: center;
    margin: 0;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 0.56rem 0.92rem;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    color: var(--text);
    background: #eef2fb;
}

.btn:hover {
    transform: translateY(-1px);
    text-decoration: none;
}

.btn-primary {
    background: linear-gradient(135deg, var(--primary), #4f8dff);
    color: #fff;
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--primary-dark), #3278ff);
}

.btn-ghost {
    background: rgba(255, 255, 255, 0.75);
    border-color: rgba(18, 37, 73, 0.17);
}

.btn-call {
    background: linear-gradient(135deg, #12a975, #2bd69a);
    color: #fff;
    box-shadow: 0 12px 26px rgba(31, 176, 121, 0.33);
}

.btn-call-hero {
    margin-top: 1rem;
    width: 100%;
    padding: 0.9rem 1rem;
    font-size: 1.05rem;
}

.status-chip {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    border-radius: 999px;
    padding: 0.22rem 0.58rem;
    font-size: 0.76rem;
    font-weight: 700;
    border: 1px solid transparent;
    background: #eef3ff;
    color: #1d4faf;
}

.status-chip-btn {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    margin: 0;
    font: inherit;
    line-height: 1;
    cursor: pointer;
}

.status-chip-btn:focus-visible {
    outline: 2px solid rgba(47, 112, 232, 0.6);
    outline-offset: 2px;
}

.status-new {
    background: #eef3ff;
    color: #1d4faf;
    border-color: #cfdbff;
}

.status-work {
    background: #eaf2ff;
    color: #1748a6;
    border-color: #c7dbff;
}

.status-missed,
.status-waiting {
    background: #fff2e7;
    color: #a75a11;
    border-color: #ffd8b4;
}

.status-callback,
.status-potential {
    background: #ecf8ff;
    color: #0d6ea7;
    border-color: #bde8ff;
}

.status-meeting {
    background: #f3edff;
    color: #5f36ac;
    border-color: #d9caff;
}

.status-success,
.status-done {
    background: #e7f8ef;
    color: #137447;
    border-color: #bce9d1;
}

.status-success {
    gap: 0.32rem;
}

.status-success::before {
    content: "\2713";
    width: 14px;
    height: 14px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #26ad62;
    color: #ffffff;
    font-size: 0.58rem;
    line-height: 1;
    font-weight: 900;
    pointer-events: none;
}

.status-drop {
    background: #ffeef0;
    color: #b73245;
    border-color: #ffc8d0;
}

.status-archive {
    background: #f0f2f6;
    color: #4c5972;
    border-color: #d6dbe6;
}

.status-open {
    background: #fff8e6;
    color: #8d6512;
    border-color: #f2dfac;
}

.status-default {
    background: #eef3ff;
    color: #1d4faf;
    border-color: #cfdbff;
}

.icon-btn {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    border: 1px solid rgba(18, 37, 73, 0.2);
    background: rgba(255, 255, 255, 0.85);
    color: #1f4ea8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s ease, background 0.2s ease;
}

.icon-btn:hover {
    background: rgba(31, 102, 255, 0.12);
    transform: translateY(-1px);
}

.icon-btn svg {
    width: 18px;
    height: 18px;
}

.details-list {
    margin: 0;
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 0.35rem 0.75rem;
}

.details-list dt {
    color: var(--muted);
    font-size: 0.86rem;
}

.details-list dd {
    margin: 0;
}

.timeline {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.6rem;
}

.timeline li {
    border: 1px solid rgba(24, 43, 77, 0.15);
    border-radius: 14px;
    padding: 0.68rem;
}

.timeline-head {
    display: flex;
    justify-content: space-between;
    gap: 0.6rem;
    margin-bottom: 0.3rem;
}

.timeline p {
    margin: 0.2rem 0;
}

.timeline small {
    color: var(--muted);
}

.filters-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.72rem;
    align-items: end;
}

.filters-grid-clients {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.clients-live-search-wrap {
    display: grid;
    gap: 0.45rem;
    margin-bottom: 0.85rem;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    overflow: hidden;
}

body.route-clients {
    background: radial-gradient(circle at 18% 12%, rgba(47, 97, 204, 0.14), transparent 40%),
        radial-gradient(circle at 90% 5%, rgba(31, 182, 130, 0.09), transparent 35%),
        #060b18;
    color: #e6ecfb;
}

body.route-clients .app-shell {
    width: min(1440px, calc(100% - 1rem));
    margin: 0.5rem auto;
}

body.route-clients .app-layout {
    gap: 0;
    grid-template-columns: 230px minmax(0, 1fr);
}

body.route-clients .sidebar {
    border-radius: 18px 0 0 18px;
    background: linear-gradient(180deg, rgba(12, 19, 36, 0.98), rgba(8, 13, 26, 0.98));
    border: 1px solid rgba(49, 70, 109, 0.45);
    box-shadow: none;
    padding: 1rem 0.8rem;
    min-height: calc(100vh - 1rem);
    top: 0.5rem;
}

body.route-clients .brand-block strong {
    color: #f0f5ff;
}

body.route-clients .brand-block small {
    color: #7784a0;
}

body.route-clients .sidebar-nav {
    margin-top: 1.1rem;
}

body.route-clients .sidebar-nav a {
    color: #90a0bd;
    border: 1px solid transparent;
}

body.route-clients .sidebar-nav a.active,
body.route-clients .sidebar-nav a:hover {
    color: #53a5ff;
    background: rgba(26, 107, 214, 0.2);
    border-color: rgba(56, 128, 230, 0.32);
}

body.route-clients .sidebar-footer {
    border-top-color: rgba(57, 79, 116, 0.5);
}

body.route-clients .sidebar-user strong {
    color: #f0f5ff;
}

body.route-clients .sidebar-user small {
    color: #7d8ba6;
}

body.route-clients .logout-form .btn-ghost {
    background: rgba(32, 47, 75, 0.64);
    border-color: rgba(79, 102, 143, 0.36);
    color: #b5c3dd;
}

body.route-clients .content-wrap {
    background: linear-gradient(180deg, rgba(6, 11, 25, 0.98), rgba(4, 8, 20, 0.98));
    border: 1px solid rgba(49, 70, 109, 0.45);
    border-left: 0;
    border-radius: 0;
    padding: 1.25rem 1.35rem;
    min-height: calc(100vh - 1rem);
}

.clients-screen {
    display: grid;
    gap: 0rem;
}

.clients-topbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.9rem;
}

.clients-topbar h1 {
    margin: 0;
    font-size: clamp(1.5rem, 2.4vw, 2.25rem);
    letter-spacing: -0.02em;
    color: #f3f7ff;
}

.clients-top-actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.clients-icon-action {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(66, 90, 130, 0.45);
    background: rgba(15, 26, 50, 0.86);
    color: #9db4dd;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.clients-icon-action svg {
    width: 18px;
    height: 18px;
}

.clients-add-btn {
    background: linear-gradient(135deg, #2c7dff, #53a4ff);
    color: #fff;
    border: 1px solid rgba(96, 160, 255, 0.6);
}

.clients-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

body.route-clients .clients-screen .card {
    background: linear-gradient(165deg, rgba(13, 22, 41, 0.96), rgba(10, 18, 35, 0.96));
    border: 1px solid rgba(37, 56, 90, 0.6);
    box-shadow: none;
}

.clients-overview-card {
    display: grid;
    grid-template-rows: auto auto auto 1fr auto;
    gap: 0.75rem;
    min-height: 214px;
    padding: 1.35rem 1.5rem 1.25rem;
    border-radius: 27px;
    background: #ffffff;
    border: 1px solid #e8ebef;
    box-shadow: none;
}

.clients-overview-card-overdue {
    border-color: #f3d4d4;
}

.clients-overview-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
}

.clients-overview-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.clients-overview-icon svg {
    width: 22px;
    height: 22px;
}

.clients-overview-icon-total {
    background: #dfeafd;
    color: #296cff;
}

.clients-overview-icon-overdue {
    background: #f8dddd;
    color: #ff3942;
}

.clients-overview-icon-meeting {
    background: #f6e7ac;
    color: #dc7a00;
}

.clients-overview-icon-calls {
    background: #e6ddfb;
    color: #7c3cff;
}

.clients-overview-chip {
    min-height: 30px;
    padding: 0.28rem 0.85rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.clients-overview-chip-green {
    background: #effaf3;
    color: #17b46a;
    border: 1px solid #c6efda;
}

.clients-overview-chip-danger {
    background: #fff0f0;
    color: #ff3942;
    border: 1px solid #f5d2d2;
}

.clients-overview-chip-amber {
    background: #fff7dc;
    color: #dc8b00;
    border: 1px solid #efd99d;
}

.clients-overview-chip-violet {
    background: #f0eaff;
    color: #7c3cff;
    border: 1px solid #e3d6ff;
}

.clients-overview-value {
    margin: 0;
    color: #0f1730;
    font-size: clamp(2.65rem, 3.3vw, 3.85rem);
    line-height: 0.9;
    font-weight: 800;
    letter-spacing: -0.055em;
}

.clients-overview-value-danger {
    color: #ff2f39;
}

.clients-overview-label {
    margin: -0.05rem 0 0;
    color: #a0a8b7;
    font-size: 0.86rem;
    line-height: 1.25;
    font-weight: 700;
}

.clients-overview-progress {
    width: 100%;
    height: 7px;
    border-radius: 999px;
    overflow: hidden;
    background: #edf1f6;
    align-self: end;
}

.clients-overview-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
}

.clients-overview-progress-total span {
    background: linear-gradient(90deg, #2a70ff 0%, #3e88ff 100%);
}

.clients-overview-progress-danger {
    background: #f7d8d8;
}

.clients-overview-progress-danger span {
    background: linear-gradient(90deg, #ff525a 0%, #ff7c82 100%);
}

.clients-overview-meta,
.clients-overview-meta-row {
    margin: 0;
    color: #a0a8b7;
    font-size: 0.83rem;
    line-height: 1.2;
    font-weight: 600;
}

.clients-overview-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.clients-overview-meta-row strong {
    color: #ff3942;
    font-size: 0.95rem;
    font-weight: 800;
}

.clients-overview-days {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
    align-self: end;
}

.clients-overview-days span {
    min-height: 30px;
    padding: 0.3rem 0.5rem;
    border-radius: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f6ebbb;
    color: #dc8b00;
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: lowercase;
}

.clients-overview-bars {
    display: flex;
    align-items: flex-end;
    gap: 0.42rem;
    min-height: 46px;
    align-self: end;
}

.clients-overview-bars span {
    flex: 1 1 0;
    min-width: 0;
    border-radius: 10px;
    background: #ddd5ef;
}

.clients-overview-bars span.is-today {
    background: linear-gradient(180deg, #7f4bff 0%, #7b39f6 100%);
}

.clients-toolbar-card {
    padding: 0.88rem;
}

.clients-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.4fr);
    gap: 0.75rem;
    align-items: center;
}

.clients-search-label {
    margin: 0;
    display: block;
}

.clients-search-input-wrap {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-radius: 14px;
    border: 1px solid rgba(55, 80, 125, 0.6);
    padding: 0.66rem 0.74rem;
    background: rgba(6, 14, 30, 0.74);
}

.clients-search-input-wrap svg {
    width: 16px;
    height: 16px;
    color: #6f84aa;
    flex: 0 0 auto;
}

.clients-search-input-wrap input {
    border: 0;
    background: transparent;
    color: #dce5f8;
    padding: 0;
    box-shadow: none;
}

.clients-search-input-wrap input::placeholder {
    color: #637593;
}

.clients-search-input-wrap input:focus {
    box-shadow: none;
}

.clients-filter-form {
    display: grid;
    grid-template-columns: minmax(130px, 1fr) minmax(180px, 1.2fr) auto;
    gap: 0.6rem;
    align-items: center;
}

.clients-filter-form label {
    margin: 0;
    display: block;
}

.clients-filter-form select {
    border-color: rgba(55, 80, 125, 0.6);
    background: rgba(6, 14, 30, 0.74);
    color: #d9e4fb;
}

.clients-filter-actions {
    display: flex;
    gap: 0.45rem;
}

.clients-filter-actions .btn {
    font-size: 13px;
    padding: 0.42rem 0.7rem;
}

body.route-clients .clients-filter-actions .btn-ghost {
    background: rgba(29, 45, 71, 0.74);
    border-color: rgba(67, 92, 134, 0.55);
    color: #bac9e3;
}

.clients-table-card {
    padding: 0;
    overflow: hidden;
}

.clients-table th {
    padding: 0.9rem 0.95rem;
    border-bottom-color: rgba(45, 65, 100, 0.6);
    color: #667a9f;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.clients-table td {
    padding: 0.9rem 0.95rem;
    border-bottom-color: rgba(29, 45, 72, 0.74);
    color: #c8d4eb;
    vertical-align: middle;
}

.clients-table tbody tr:hover td {
    background: rgba(19, 32, 55, 0.52);
}

.company-cell {
    display: flex;
    align-items: center;
    gap: 0.68rem;
    min-width: 180px;
}

.company-cell-icon {
    width: 28px;
    height: 28px;
    border-radius: 9px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.78rem;
    color: #67aeff;
    background: rgba(31, 96, 184, 0.24);
}

.company-cell-icon.company-cell-icon--1 {
    background: #3f7ff3;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--2 {
    background: #6166e8;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--3 {
    background: #ff7b13;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--4 {
    background: #18b981;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--5 {
    background: #e25492;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--6 {
    background: #4f9df8;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--7 {
    background: #17a7c8;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--8 {
    background: #8f63f8;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--9 {
    background: #f59f0b;
    color: #ffffff;
}

.company-cell-icon.company-cell-icon--10 {
    background: #5057d8;
    color: #ffffff;
}

.company-link {
    color: #f1f5ff;
    font-weight: 600;
}

.company-link:hover {
    color: #98c3ff;
    text-decoration: none;
}

.phone-nowrap {
    display: inline-block;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    font-feature-settings: 'tnum' 1;
    letter-spacing: 0.01em;
    color: #d9e3f8;
}

.clients-next-contact {
    display: inline-block;
    color: #97a8c8;
    white-space: nowrap;
}

.client-rating-note {
    margin: -0.4rem 0 0.2rem;
    font-size: 0.77rem;
    color: #667592;
}

.client-rating-note span {
    color: #465779;
    font-weight: 700;
}

body.route-clients .clients-table .status-chip {
    border-color: transparent;
    font-weight: 700;
}

body.route-clients .clients-table .status-new {
    background: rgba(58, 116, 230, 0.22);
    color: #79b2ff;
}

body.route-clients .clients-table .status-work {
    background: rgba(41, 121, 246, 0.22);
    color: #61acff;
}

body.route-clients .clients-table .status-missed {
    background: rgba(233, 124, 36, 0.2);
    color: #f9a355;
}

body.route-clients .clients-table .status-callback {
    background: rgba(45, 187, 145, 0.2);
    color: #5fe1b7;
}

body.route-clients .clients-table .status-meeting {
    background: #fbf1cf;
    color: #9a6a00;
}

body.route-clients .clients-table .status-drop {
    background: rgba(212, 86, 106, 0.22);
    color: #ff95aa;
}

body.route-clients .clients-table .status-success {
    background: rgba(48, 183, 123, 0.2);
    color: #7ae1b3;
}

body.route-clients .clients-table .status-archive {
    background: rgba(122, 136, 163, 0.2);
    color: #adb7c8;
}

body.route-clients .clients-table .btn-call {
    padding: 0.5rem 0.82rem;
    box-shadow: none;
    border: 1px solid rgba(54, 168, 123, 0.48);
    background: linear-gradient(145deg, rgba(15, 87, 66, 0.92), rgba(19, 108, 80, 0.92));
}

body.route-clients .clients-table .icon-btn {
    border-color: rgba(66, 90, 130, 0.55);
    background: rgba(10, 20, 40, 0.75);
    color: #90a6cc;
}

body.route-clients .clients-table .icon-btn:hover {
    background: rgba(34, 55, 88, 0.72);
    transform: none;
}

body.route-clients .client-drawer {
    background: rgba(3, 8, 20, 0.72);
}

body.route-clients .client-drawer .modal-dialog.card {
    background: linear-gradient(170deg, rgba(11, 20, 39, 0.98), rgba(8, 16, 32, 0.98));
    border: 1px solid rgba(42, 64, 101, 0.66);
    box-shadow: -20px 0 48px rgba(3, 10, 24, 0.66);
}

body.route-clients .client-drawer .section-title-row {
    border-bottom: 1px solid rgba(42, 64, 101, 0.6);
    padding-bottom: 0.8rem;
    margin-bottom: 0.9rem;
}

body.route-clients .client-drawer .section-title-row h2 {
    color: #eef3ff;
}

body.route-clients .client-drawer .js-close-client-modal.btn-ghost,
body.route-clients .client-drawer .js-close-client-create-modal.btn-ghost {
    background: rgba(29, 45, 71, 0.74);
    border-color: rgba(67, 92, 134, 0.55);
    color: #bac9e3;
}

body.route-clients .client-edit-form label {
    color: #9eb0d2;
}

body.route-clients .client-edit-form input,
body.route-clients .client-edit-form select,
body.route-clients .client-edit-form textarea {
    background: rgba(6, 14, 30, 0.76);
    border-color: rgba(54, 79, 125, 0.72);
    color: #dee7fb;
}

body.route-clients .client-edit-form input::placeholder,
body.route-clients .client-edit-form textarea::placeholder {
    color: #6f82a6;
}

body.route-clients .client-edit-form input:focus,
body.route-clients .client-edit-form select:focus,
body.route-clients .client-edit-form textarea:focus {
    border-color: rgba(82, 137, 232, 0.88);
    box-shadow: 0 0 0 4px rgba(56, 108, 209, 0.2);
}

body.route-clients .client-edit-form label.field-has-error {
    color: #ff9fa7;
}

body.route-clients .client-edit-form input.is-invalid,
body.route-clients .client-edit-form select.is-invalid,
body.route-clients .client-edit-form textarea.is-invalid {
    border-color: rgba(246, 114, 123, 0.92);
    box-shadow: 0 0 0 4px rgba(227, 78, 94, 0.2);
}

body.route-clients .client-edit-form .form-actions {
    border-top: 1px solid rgba(42, 64, 101, 0.5);
    padding-top: 0.85rem;
}

body.route-clients .client-rating-note {
    color: #7487ab;
}

body.route-clients .client-rating-note span {
    color: #aec2e7;
}

body.route-clients .client-edit-form .btn-primary {
    background: linear-gradient(135deg, #2c7dff, #53a4ff);
    border-color: rgba(87, 148, 255, 0.66);
}

body.route-clients .client-history-panel {
    border-right-color: rgba(42, 64, 101, 0.6);
}

body.route-clients .client-history-panel h3 {
    color: #eaf0ff;
}

body.route-clients .client-history-item {
    background: rgba(7, 16, 33, 0.86);
    border-color: rgba(49, 72, 113, 0.62);
}

body.route-clients .client-history-item p {
    color: #d5e0f7;
}

body.route-clients .client-history-head time,
body.route-clients .client-history-item small,
body.route-clients .client-drawer .muted {
    color: #8499bf;
}

body.route-clients .client-history-item .status-chip {
    border-color: transparent;
    font-weight: 700;
}

body.route-clients .client-history-item .status-new {
    background: rgba(58, 116, 230, 0.22);
    color: #79b2ff;
}

body.route-clients .client-history-item .status-work {
    background: rgba(41, 121, 246, 0.22);
    color: #61acff;
}

body.route-clients .client-history-item .status-missed {
    background: rgba(233, 124, 36, 0.2);
    color: #f9a355;
}

body.route-clients .client-history-item .status-callback {
    background: rgba(45, 187, 145, 0.2);
    color: #5fe1b7;
}

body.route-clients .client-history-item .status-meeting {
    background: #fbf1cf;
    color: #9a6a00;
}

body.route-clients .client-history-item .status-drop {
    background: rgba(212, 86, 106, 0.22);
    color: #ff95aa;
}

body.route-clients .client-history-item .status-success {
    background: rgba(48, 183, 123, 0.2);
    color: #7ae1b3;
}

body.route-clients .client-history-item .status-archive {
    background: rgba(122, 136, 163, 0.2);
    color: #adb7c8;
}

.flash-stack {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 1700;
    display: grid;
    gap: 0.55rem;
    width: auto;
    max-width: calc(100vw - 1.5rem);
    justify-items: end;
    align-content: start;
    margin: 0;
    pointer-events: none;
}

.flash {
    --flash-accent: #2f70e8;
    --flash-soft: #e9efff;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 0.52rem;
    align-items: flex-start;
    border-radius: 14px;
    border: 1px solid rgba(47, 77, 128, 0.18);
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 16px 32px rgba(24, 46, 88, 0.16);
    width: fit-content;
    max-width: min(420px, calc(100vw - 1.5rem));
    padding: 0.62rem 0.9rem;
    font-size: 13px;
    font-weight: 600;
    color: #243a5d;
    line-height: 1.35;
    pointer-events: auto;
    animation: flash-slide-in 0.22s ease-out both;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.flash.is-hiding {
    opacity: 0;
    transform: translate3d(10px, -4px, 0) scale(0.98);
}

.flash::before {
    content: "i";
    width: 18px;
    height: 18px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--flash-soft);
    color: var(--flash-accent);
    font-size: 0.66rem;
    font-weight: 800;
    line-height: 1;
    margin-top: 1px;
}

.flash-success {
    --flash-accent: #1f9e68;
    --flash-soft: #e5f6ee;
}

.flash-error {
    --flash-accent: #cb455f;
    --flash-soft: #fdecef;
}

.flash-warning {
    --flash-accent: #b57a17;
    --flash-soft: #fdf3df;
}

.flash-info {
    --flash-accent: #2f70e8;
    --flash-soft: #e9efff;
}

.flash-success::before {
    content: "\2713";
}

.flash-error::before,
.flash-warning::before {
    content: "!";
}

.flash-info::before {
    content: "i";
    font-weight: 700;
}

@keyframes flash-slide-in {
    from {
        opacity: 0;
        transform: translate3d(8px, -6px, 0) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1);
    }
}

.progress-bar {
    width: 100%;
    height: 16px;
    border-radius: 999px;
    background: #e8edf9;
    overflow: hidden;
}

.progress-bar > span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #1f66ff, #3ea6ff);
    border-radius: inherit;
}

.queue-block {
    margin-bottom: 1.1rem;
}

.queue-block h3 {
    margin: 0 0 0.55rem;
    font-size: 0.96rem;
    color: #1e3156;
}

.calls-activity-card {
    margin-bottom: 0.7rem;
}

.calls-activity-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.58rem;
}

.calls-activity-grid.calls-activity-grid--manager {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.calls-activity-item {
    border: 1px solid #e2e7f0;
    border-radius: 12px;
    padding: 0.52rem 0.58rem;
    background: #ffffff;
    display: grid;
    gap: 0.22rem;
}

.calls-activity-item.is-alert {
    border-color: #f1bbbb;
    background: #fff2f2;
}

.calls-activity-item.is-meeting {
    border-color: #bfd6ff;
    background: #eff5ff;
}

.calls-activity-label {
    margin: 0;
    color: #798497;
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.25;
}

.calls-activity-value {
    margin: 0;
    color: #1f2430;
    font-size: 1.22rem;
    line-height: 1.1;
    letter-spacing: -0.01em;
}

.calls-activity-item.is-alert .calls-activity-value {
    color: #c44c4c;
}

.calls-activity-item.is-meeting .calls-activity-value {
    color: #1f66d8;
}

.calls-activity-item.is-good {
    border-color: #bce5c7;
    background: #effaf2;
}

.calls-activity-item.is-good .calls-activity-value {
    color: #2f9f62;
}

.calls-activity-item.is-warn {
    border-color: #f2d8a4;
    background: #fff7e9;
}

.calls-activity-item.is-warn .calls-activity-value {
    color: #bf8200;
}

.calls-activity-item.is-risk {
    border-color: #f1bbbb;
    background: #fff2f2;
}

.calls-activity-item.is-risk .calls-activity-value {
    color: #c44c4c;
}

.calls-activity-note {
    margin: 0;
    color: #8b96a8;
    font-size: 0.74rem;
    line-height: 1.22;
}

.calls-company-cell {
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}

.calls-meeting-note {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    font-size: 0.71rem;
    line-height: 1.2;
    color: #9b6f00;
    background: #fff3cf;
    border: 1px solid #f3d68c;
    border-radius: 999px;
    padding: 0.08rem 0.42rem;
    font-weight: 700;
}

.call-focus-card {
    background: linear-gradient(145deg, #f2fbff, #f8fff8);
}

.modal {
    position: fixed;
    inset: 0;
    background: rgba(9, 18, 36, 0.45);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    z-index: 100;
}

.modal.is-open {
    display: flex;
}

.modal-dialog {
    width: min(620px, 100%);
    margin: 0;
}

.modal-dialog-xl {
    width: min(940px, 100%);
}

.status-quick-modal .modal-dialog {
    width: min(460px, calc(100vw - 16px));
    margin: 0;
}

.status-quick-company {
    margin: -0.3rem 0 0.5rem;
    font-size: 0.85rem;
}

.status-quick-form {
    gap: 0.68rem;
}

.status-quick-form textarea {
    min-height: 84px;
}

.client-drawer {
    padding: 0;
    align-items: stretch;
    justify-content: flex-end;
}

.client-drawer .modal-dialog {
    width: min(1120px, calc(100vw - 16px));
    margin: 0;
    height: 100dvh;
    border-radius: 16px 0 0 16px;
    border-right: 0;
    box-shadow: -20px 0 45px rgba(15, 32, 72, 0.2);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.client-create-modal {
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
}

.client-create-modal .modal-dialog {
    width: min(760px, calc(100vw - 16px));
    height: auto;
    max-height: calc(100dvh - 16px);
    border-radius: 16px;
    border-right: 1px solid rgba(21, 39, 77, 0.14);
    overflow: auto;
    box-shadow: 0 22px 46px rgba(15, 32, 72, 0.24);
}

.client-create-form {
    padding-left: 0;
    overflow: visible;
}

.client-edit-drawer-layout {
    display: grid;
    grid-template-columns: minmax(320px, 0.8fr) minmax(0, 1.2fr);
    grid-template-areas: "history form";
    gap: 1rem;
    flex: 1;
    min-height: 0;
}

.client-edit-form {
    grid-area: form;
    padding-left: 0.2rem;
    overflow: auto;
}

.client-history-panel {
    grid-area: history;
    border-right: 1px solid rgba(20, 37, 71, 0.14);
    padding-right: 1rem;
    min-height: 0;
    overflow: auto;
}

.client-history-panel h3 {
    margin: 0 0 0.7rem;
    font-size: 1rem;
}

.client-history-list {
    display: grid;
    gap: 0.65rem;
}

.client-history-item {
    border: 1px solid rgba(21, 39, 77, 0.14);
    border-radius: 12px;
    padding: 0.62rem 0.7rem;
    background: #fbfdff;
}

.client-history-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 0.35rem;
}

.client-history-head time {
    color: var(--muted);
    font-size: 0.82rem;
    white-space: nowrap;
}

.client-history-item p {
    margin: 0 0 0.32rem;
}

.client-history-item small {
    color: var(--muted);
}

.call-summary {
    display: flex;
    justify-content: space-between;
    gap: 0.7rem;
    border: 1px solid rgba(24, 43, 77, 0.12);
    border-radius: 10px;
    padding: 0.56rem 0.68rem;
    background: #f8fbff;
}

.hidden {
    display: none !important;
}

.script-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.script-card {
    border: 1px solid rgba(23, 45, 83, 0.12);
    border-radius: 14px;
    padding: 0.8rem;
    background: #fbfdff;
}

.script-card header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.8rem;
}

.script-card h3 {
    margin: 0;
    font-size: 1rem;
}

.script-card pre {
    margin: 0.6rem 0;
    font-family: inherit;
    font-size: 0.92rem;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.checkbox-row {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.checkbox-row input[type='checkbox'] {
    width: auto;
}

.auth-wrap {
    min-height: calc(100vh - 4rem);
    display: grid;
    place-items: center;
}

.auth-card {
    width: min(520px, 100%);
    background: var(--surface);
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 24px;
    padding: 1.3rem;
    box-shadow: var(--shadow);
}

.auth-card.auth-card-login {
    padding-bottom: 2.5rem;
}

.auth-card h1 {
    margin: 0;
    font-size: 1.5rem;
}

.auth-card p {
    color: var(--muted);
}

.auth-form-error {
    margin: -0.1rem 0 0;
    padding: 0.72rem 0.85rem;
    border: 1px solid #f0bcc5;
    border-radius: 12px;
    background: #fff1f3;
    color: #b6344b;
    font-size: 0.86rem;
    font-weight: 600;
    line-height: 1.4;
}

.auth-form-error[hidden] {
    display: none;
}

.auth-help {
    margin-top: 0.9rem;
    border-top: 1px solid rgba(13, 29, 57, 0.13);
    padding-top: 0.8rem;
    color: var(--muted);
    font-size: 0.85rem;
    display: grid;
    gap: 0.25rem;
}

@media (max-width: 1180px) {
    .app-layout {
        grid-template-columns: 200px minmax(0, 1fr);
    }

    body.route-clients .app-layout {
        grid-template-columns: 210px minmax(0, 1fr);
    }

    .grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .clients-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .clients-toolbar {
        grid-template-columns: 1fr;
    }

    .clients-filter-form {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .clients-filter-actions {
        grid-column: 1 / -1;
    }

    .filters-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .filters-grid-clients {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .client-edit-drawer-layout {
        grid-template-columns: 1fr;
        grid-template-areas:
            "form"
            "history";
    }

    .client-edit-form {
        padding-left: 0;
    }

    .client-history-panel {
        border-right: 0;
        border-left: 0;
        border-top: 1px solid rgba(20, 37, 71, 0.14);
        padding-right: 0;
        padding-top: 0.9rem;
        max-height: 320px;
    }

    body.route-clients .client-history-panel {
        border-top-color: rgba(42, 64, 101, 0.6);
    }
}

@media (max-width: 860px) {
    .app-shell {
        width: calc(100% - 1rem);
    }

    body.route-clients .app-shell {
        width: calc(100% - 0.6rem);
        margin: 0.3rem auto;
    }

    .app-layout {
        grid-template-columns: 1fr;
    }

    body.route-clients .content-wrap {
        border-left: 1px solid rgba(49, 70, 109, 0.45);
        border-radius: 0 0 18px 18px;
        min-height: 0;
        padding: 1rem 0.8rem;
    }

    .sidebar {
        position: static;
        min-height: 0;
    }

    body.route-clients .sidebar {
        min-height: 0;
        border-radius: 18px 18px 0 0;
    }

    .sidebar-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: auto;
    }

    .sidebar-nav a {
        text-align: center;
    }

    .grid-2,
    .grid-3,
    .grid-4,
    .script-grid,
    .two-cols,
    .filters-grid {
        grid-template-columns: 1fr;
    }

    .clients-topbar {
        flex-direction: column;
        align-items: flex-start;
    }

    .clients-top-actions {
        width: 100%;
        justify-content: space-between;
    }

    .flash-stack {
        top: 0.75rem;
        right: 0.75rem;
        left: 0.75rem;
        width: auto;
        max-width: none;
        justify-items: stretch;
    }

    .flash {
        width: 100%;
        max-width: none;
    }

    .clients-metrics {
        grid-template-columns: 1fr;
    }

    .clients-filter-form {
        grid-template-columns: 1fr;
    }

    .filters-grid-clients {
        grid-template-columns: 1fr;
    }

    .client-drawer .modal-dialog {
        width: 100vw;
        border-radius: 0;
    }

    .details-list {
        grid-template-columns: 1fr;
    }

    .details-list dt {
        font-weight: 700;
    }

    .details-list dd {
        margin-bottom: 0.5rem;
    }

    .table th,
    .table td {
        font-size: 0.82rem;
    }

    .btn-call {
        width: 100%;
        font-size: 1rem;
        padding: 0.86rem 1rem;
    }

    .btn-call-hero {
        font-size: 1.12rem;
        padding: 1rem;
    }
}

/* Light theme override for clients page and edit drawer */
body.route-clients {
    background: radial-gradient(circle at 15% 8%, rgba(128, 172, 255, 0.2), transparent 45%),
        radial-gradient(circle at 88% 4%, rgba(102, 216, 187, 0.14), transparent 36%),
        #f4f7fc;
    color: #16233d;
}

body.route-clients .sidebar {
    background: linear-gradient(180deg, #ffffff, #f7faff);
    border: 1px solid rgba(47, 77, 128, 0.18);
    box-shadow: 0 14px 36px rgba(25, 52, 97, 0.1);
}

body.route-clients .brand-block strong {
    color: #13233f;
}

body.route-clients .brand-block small {
    color: #6a7c9d;
}

body.route-clients .sidebar-nav a {
    color: #3d5278;
}

body.route-clients .sidebar-nav a.active,
body.route-clients .sidebar-nav a:hover {
    color: #1a64d9;
    background: rgba(44, 122, 237, 0.12);
    border-color: rgba(44, 122, 237, 0.2);
}

body.route-clients .sidebar-footer {
    border-top-color: rgba(54, 86, 137, 0.18);
}

body.route-clients .sidebar-user strong {
    color: #162844;
}

body.route-clients .sidebar-user small {
    color: #6f83a8;
}

body.route-clients .logout-form .btn-ghost {
    background: #f3f7ff;
    border-color: rgba(51, 85, 138, 0.22);
    color: #3b547d;
}

body.route-clients .content-wrap {
    background: linear-gradient(180deg, #fbfdff, #f6f9ff);
    border: 1px solid rgba(47, 77, 128, 0.18);
    border-left: 0;
}

body.route-clients .clients-screen .card {
    background: #ffffff;
    border: 1px solid rgba(42, 73, 125, 0.14);
    box-shadow: 0 10px 26px rgba(23, 50, 99, 0.08);
}

.clients-topbar h1 {
    color: #142746;
}

.clients-icon-action {
    border-color: rgba(47, 77, 128, 0.24);
    background: #f4f8ff;
    color: #5f76a0;
}

.clients-metric-card strong {
    color: #132746;
}

.clients-metric-card p {
    color: #687da0;
}

.clients-toolbar-card {
    background: #ffffff;
}

.clients-search-input-wrap {
    border-color: rgba(47, 77, 128, 0.22);
    background: #f8fbff;
}

.clients-search-input-wrap svg {
    color: #6d84ad;
}

.clients-search-input-wrap input {
    color: #1d2f4f;
}

.clients-search-input-wrap input::placeholder {
    color: #7d91b4;
}

.clients-filter-form select {
    border-color: rgba(47, 77, 128, 0.22);
    background: #f8fbff;
    color: #1f3252;
}

body.route-clients .clients-filter-actions .btn-ghost {
    background: #f5f8ff;
    border-color: rgba(50, 83, 136, 0.22);
    color: #3b5782;
}

.clients-table th {
    border-bottom-color: rgba(44, 75, 126, 0.14);
    color: #6f84a8;
}

.clients-table td {
    border-bottom-color: rgba(44, 75, 126, 0.12);
    color: #253a5f;
}

.clients-table tbody tr:hover td {
    background: #f7faff;
}

.company-cell-icon {
    background: rgba(38, 108, 219, 0.14);
    color: #2269ce;
}

.company-link {
    color: #17305a;
}

.company-link:hover {
    color: #1f65d6;
}

.phone-nowrap {
    color: #203759;
}

.clients-next-contact {
    color: #6e84a7;
}

body.route-clients .clients-table .status-chip {
    border-color: rgba(46, 78, 129, 0.18);
}

body.route-clients .clients-table .status-chip-btn:hover {
    filter: saturate(1.06);
}

body.route-clients .clients-table .btn-call {
    border: 1px solid rgba(20, 152, 104, 0.46);
    background: linear-gradient(145deg, #13a974, #2fd19a);
    color: #fff;
}

body.route-clients .clients-table .icon-btn {
    border-color: rgba(47, 77, 128, 0.24);
    background: #f5f8ff;
    color: #426395;
}

body.route-clients .clients-table .icon-btn:hover {
    background: #eaf1ff;
}

body.route-clients .client-drawer {
    background: rgba(17, 36, 68, 0.22);
}

body.route-clients .status-quick-modal {
    background: rgba(17, 36, 68, 0.22);
}

body.route-clients .status-quick-modal .modal-dialog.card {
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid rgba(45, 75, 124, 0.2);
    box-shadow: 0 24px 44px rgba(29, 57, 103, 0.18);
}

body.route-clients .status-quick-company {
    color: #6f84a7;
}

body.route-clients .client-drawer .modal-dialog.card {
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid rgba(45, 75, 124, 0.2);
    box-shadow: -18px 0 38px rgba(29, 57, 103, 0.2);
}

body.route-clients .client-create-modal .modal-dialog {
    border-right-color: rgba(45, 75, 124, 0.2);
    box-shadow: 0 24px 44px rgba(29, 57, 103, 0.18);
}

body.route-clients .client-drawer .section-title-row {
    border-bottom: 1px solid rgba(48, 79, 131, 0.16);
}

body.route-clients .client-drawer .section-title-row h2 {
    color: #162844;
}

body.route-clients .client-drawer .js-close-client-modal.btn-ghost,
body.route-clients .client-drawer .js-close-client-create-modal.btn-ghost {
    background: #f4f8ff;
    border-color: rgba(48, 79, 131, 0.22);
    color: #3e5882;
}

body.route-clients .client-edit-form label {
    color: #415a84;
}

body.route-clients .client-edit-form input,
body.route-clients .client-edit-form select,
body.route-clients .client-edit-form textarea {
    background: #ffffff;
    border-color: rgba(48, 79, 131, 0.2);
    color: #1e3355;
}

body.route-clients .client-edit-form input::placeholder,
body.route-clients .client-edit-form textarea::placeholder {
    color: #8698b5;
}

body.route-clients .client-edit-form input:focus,
body.route-clients .client-edit-form select:focus,
body.route-clients .client-edit-form textarea:focus {
    border-color: rgba(56, 118, 220, 0.6);
    box-shadow: 0 0 0 4px rgba(56, 118, 220, 0.14);
}

body.route-clients .client-edit-form .form-actions {
    border-top: 1px solid rgba(48, 79, 131, 0.16);
}

body.route-clients .client-rating-note {
    color: #7388ac;
}

body.route-clients .client-rating-note span {
    color: #3f5e8f;
}

body.route-clients .client-history-panel {
    border-right-color: rgba(48, 79, 131, 0.16);
}

body.route-clients .client-history-panel h3 {
    color: #1e3355;
}

body.route-clients .client-history-item {
    background: #f8fbff;
    border-color: rgba(48, 79, 131, 0.16);
}

body.route-clients .client-history-item p {
    color: #2b4066;
}

body.route-clients .client-history-head time,
body.route-clients .client-history-item small,
body.route-clients .client-drawer .muted {
    color: #768bac;
}

/* Shared module visuals across all authenticated pages */
body.route-clients .page-header h1 {
    color: #162844;
}

body.route-clients .page-header p,
body.route-clients .muted {
    color: #6f84a7;
}

body.route-clients .card {
    background: #ffffff;
    border: 1px solid rgba(42, 73, 125, 0.14);
    box-shadow: 0 10px 26px rgba(23, 50, 99, 0.08);
}

body.route-clients .table th {
    border-bottom-color: rgba(44, 75, 126, 0.14);
    color: #6f84a8;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.76rem;
}

body.route-clients .table td {
    border-bottom-color: rgba(44, 75, 126, 0.12);
    color: #253a5f;
}

body.route-clients .table tbody tr:hover td {
    background: #f7faff;
}

body.route-clients .queue-block h3,
body.route-clients .section-title-row h2,
body.route-clients .stat-card h3,
body.route-clients .mini-card h3 {
    color: #4e658e;
}

body.route-clients .stat-card strong,
body.route-clients .mini-card strong {
    color: #142847;
}

body.route-clients label {
    color: #415a84;
}

body.route-clients input,
body.route-clients select,
body.route-clients textarea {
    border-color: rgba(48, 79, 131, 0.2);
    color: #1e3355;
    background: #ffffff;
}

body.route-clients input::placeholder,
body.route-clients textarea::placeholder {
    color: #8698b5;
}

body.route-clients .btn-ghost {
    background: #f5f8ff;
    border-color: rgba(50, 83, 136, 0.22);
    color: #3b5782;
}

body.route-clients .table th,
body.route-clients .clients-table th {
    color: #4d4d4d;
}

/* Status chips palette from provided reference */
body.route-clients .status-chip,
body.route-clients .clients-table .status-chip,
body.route-clients .client-history-item .status-chip {
    border-color: transparent;
    font-weight: 600;
    box-shadow: none;
}

body.route-clients .status-missed,
body.route-clients .clients-table .status-missed,
body.route-clients .client-history-item .status-missed,
body.route-clients .status-waiting {
    background: #fbe1cf;
    color: #ef6528;
}

body.route-clients .status-work,
body.route-clients .clients-table .status-work,
body.route-clients .client-history-item .status-work {
    background: #dce7ff;
    color: #2f70e8;
}

body.route-clients .status-callback,
body.route-clients .clients-table .status-callback,
body.route-clients .client-history-item .status-callback,
body.route-clients .status-potential {
    background: #ece3ff;
    color: #6f5be2;
}

body.route-clients .status-meeting,
body.route-clients .clients-table .status-meeting,
body.route-clients .client-history-item .status-meeting {
    background: #fbecc9;
    color: #9a6a00;
}

body.route-clients .status-new,
body.route-clients .clients-table .status-new,
body.route-clients .client-history-item .status-new {
    background: #d9eef9;
    color: #2e9dd6;
}

body.route-clients .status-drop,
body.route-clients .clients-table .status-drop,
body.route-clients .client-history-item .status-drop {
    background: #f7dde3;
    color: #da5e79;
}

body.route-clients .status-success,
body.route-clients .clients-table .status-success,
body.route-clients .client-history-item .status-success,
body.route-clients .status-done {
    background: #dff2e3;
    color: #1fa14a;
}

body.route-clients .status-archive {
    background: #eceff4;
    color: #6c778d;
}

body.route-clients .status-default {
    background: #dce7ff;
    color: #2f70e8;
}

/* Unified sidebar style for all CRM pages */
body.route-clients {
    background: #eef1f5;
}

body.route-clients .app-shell {
    width: 100%;
    margin: 0;
}

body.route-clients .app-layout {
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 0;
    min-height: 100dvh;
}

body.route-clients.sidebar-expanded .app-layout {
    grid-template-columns: 188px minmax(0, 1fr);
}

body.route-clients .sidebar {
    background: #f2f4f7;
    border: 1px solid #d9dee6;
    border-left: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0.85rem 0.45rem;
    min-height: 100dvh;
    top: 0;
    overflow: visible;
}

body.route-clients .brand-dot {
    display: none;
}

body.route-clients .brand-block {
    gap: 0.5rem;
    padding: 0 0 0.45rem;
    justify-content: center;
}

body.route-clients .sidebar-brand-icon {
    width: 22px;
    height: 22px;
    border-radius: 7px;
    background: #2f73f5;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

body.route-clients .sidebar-brand-icon svg {
    width: 14px;
    height: 14px;
}

body.route-clients .brand-block strong {
    font-size: 1rem;
    color: #1b1f27;
    letter-spacing: -0.01em;
}

body.route-clients .brand-block small {
    font-size: 0.68rem;
    color: #8a94a6;
}

body.route-clients .brand-block > div {
    display: none;
}

body.route-clients.sidebar-expanded .brand-block {
    justify-content: flex-start;
    padding: 0 0.25rem 0.55rem;
}

body.route-clients.sidebar-expanded .brand-block > div {
    display: block;
}

body.route-clients .sidebar-nav {
    margin-top: 0.25rem;
    gap: 0.22rem;
    overflow: visible;
}

body.route-clients .sidebar-nav-label {
    display: none;
}

body.route-clients .sidebar-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    width: 46px;
    height: 46px;
    margin: 0 auto;
    padding: 0;
    border-radius: 12px;
    color: #2f343d;
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.2;
    border: 1px solid transparent;
    text-decoration: none;
    position: relative;
}

body.route-clients .sidebar-nav-icon {
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #8d96a7;
    flex: 0 0 auto;
}

body.route-clients .sidebar-nav-icon svg {
    width: 20px;
    height: 20px;
}

body.route-clients .sidebar-nav-text {
    display: none;
}

body.route-clients:not(.sidebar-expanded) .sidebar-nav a::after {
    content: attr(data-nav-label);
    position: absolute;
    left: calc(100% + 10px);
    top: 50%;
    transform: translateY(-50%) translateX(-4px);
    background: #ffffff;
    border: 1px solid #d6dde9;
    border-radius: 9px;
    box-shadow: 0 8px 18px rgba(14, 28, 55, 0.12);
    padding: 0.35rem 0.55rem;
    font-size: 0.75rem;
    line-height: 1.1;
    color: #2b3442;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.16s ease, transform 0.16s ease;
    z-index: 8;
}

body.route-clients:not(.sidebar-expanded) .sidebar-nav a:hover::after {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

body.route-clients .sidebar-nav a:hover {
    background: #e8ecf3;
    border-color: #d9dfe9;
    color: #20252d;
    text-decoration: none;
}

body.route-clients .sidebar-nav a.active {
    background: #e7c979;
    border-color: #e7c979;
    color: #3c3320;
}

body.route-clients .sidebar-nav a.active .sidebar-nav-icon {
    color: #3c3320;
}

body.route-clients.sidebar-expanded .sidebar-nav-label {
    display: block;
    margin: 0 0 0.38rem;
    padding: 0 0.48rem;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #a3a9b5;
}

body.route-clients.sidebar-expanded .sidebar-nav a {
    justify-content: flex-start;
    gap: 0.48rem;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0.5rem;
    border-radius: 9px;
}

body.route-clients.sidebar-expanded .sidebar-nav-text {
    display: inline;
}

body.route-clients.sidebar-expanded .sidebar-nav a::after {
    display: none;
}

body.route-clients .sidebar-footer {
    padding-top: 0.7rem;
    gap: 0.5rem;
    border-top: 1px solid #dce1e8;
    align-items: center;
}

body.route-clients .sidebar-collapse-toggle {
    width: 30px;
    height: 30px;
    border: 1px solid #d8dee9;
    border-radius: 8px;
    background: #ffffff;
    color: #7a8497;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin: 0 auto 0.1rem;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

body.route-clients .sidebar-collapse-toggle svg {
    width: 16px;
    height: 16px;
    transition: transform 0.2s ease;
}

body.route-clients .sidebar-collapse-toggle:hover {
    background: #f4f7fc;
    border-color: #ced6e5;
    color: #5f6d86;
}

body.route-clients.sidebar-expanded .sidebar-collapse-toggle svg {
    transform: rotate(180deg);
}

body.route-clients .sidebar-user {
    display: flex;
    align-items: center;
    gap: 0.48rem;
    justify-content: center;
    width: 100%;
}

body.route-clients .sidebar-user-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e5ebf7;
    color: #31579e;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    flex: 0 0 auto;
}

body.route-clients .sidebar-user-meta {
    display: none;
}

body.route-clients .sidebar-user strong {
    font-size: 0.74rem;
    color: #2a3039;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.route-clients .sidebar-user small {
    font-size: 0.63rem;
    color: #9aa2b0;
}

body.route-clients .logout-form .btn-ghost {
    border-radius: 8px;
    min-height: 34px;
    width: 36px;
    padding: 0;
    background: #f6f8fb;
    border: 1px solid #d8deea;
    color: #7a8497;
    font-size: 0.74rem;
    font-weight: 600;
    gap: 0;
    justify-content: center;
}

body.route-clients .logout-form .sidebar-nav-text {
    display: none;
}

body.route-clients .logout-form {
    width: 100%;
    display: flex;
    justify-content: center;
}

body.route-clients.sidebar-expanded .sidebar-footer {
    align-items: stretch;
}

body.route-clients.sidebar-expanded .sidebar-collapse-toggle {
    margin: 0 0.2rem 0.1rem auto;
}

body.route-clients.sidebar-expanded .sidebar-user {
    justify-content: flex-start;
}

body.route-clients.sidebar-expanded .sidebar-user-meta {
    display: grid;
    gap: 0.02rem;
    min-width: 0;
}

body.route-clients.sidebar-expanded .logout-form .btn-ghost {
    width: 100%;
    padding: 0.38rem 0.5rem;
    gap: 0.32rem;
    justify-content: center;
}

body.route-clients.sidebar-expanded .logout-form .sidebar-nav-text {
    display: inline;
}

body.route-clients.sidebar-expanded .logout-form {
    display: block;
}

body.route-clients .sidebar-logout-icon {
    width: 14px;
    height: 14px;
    margin: 0 auto;
}

body.route-clients .content-wrap {
    background: linear-gradient(180deg, #fbfdff, #f6f8fc);
    border: 1px solid #dce3ef;
    border-radius: 0;
    padding: 0 1.1rem 1rem;
}

@media (max-width: 1180px) {
    body.route-clients .app-layout {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    body.route-clients.sidebar-expanded .app-layout {
        grid-template-columns: 170px minmax(0, 1fr);
    }
}

@media (max-width: 860px) {
    body.route-clients .app-layout {
        grid-template-columns: 1fr;
    }

    body.route-clients .sidebar {
        position: static;
        min-height: 0;
        border-left: 1px solid #d9dee6;
        border-radius: 14px 14px 0 0;
    }

    body.route-clients .sidebar-collapse-toggle {
        display: none;
    }

    body.route-clients .brand-block {
        justify-content: flex-start;
        padding: 0 0.25rem 0.55rem;
    }

    body.route-clients .brand-block > div {
        display: block;
    }

    body.route-clients .sidebar-nav-label {
        display: block;
        margin: 0 0 0.38rem;
        padding: 0 0.48rem;
        font-size: 0.62rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #a3a9b5;
    }

    body.route-clients .sidebar-nav {
        grid-template-columns: 1fr;
        overflow: visible;
    }

    body.route-clients .sidebar-nav a {
        justify-content: flex-start;
        gap: 0.48rem;
        width: 100%;
        height: auto;
        margin: 0;
        padding: 0.5rem;
        border-radius: 9px;
        text-align: left;
    }

    body.route-clients .sidebar-nav-icon,
    body.route-clients .sidebar-nav-icon svg {
        width: 16px;
        height: 16px;
    }

    body.route-clients .sidebar-nav-text,
    body.route-clients .logout-form .sidebar-nav-text {
        display: inline;
    }

    body.route-clients .sidebar-nav a::after {
        display: none;
    }

    body.route-clients .sidebar-footer {
        align-items: stretch;
    }

    body.route-clients .sidebar-user {
        justify-content: flex-start;
    }

    body.route-clients .sidebar-user-meta {
        display: grid;
        gap: 0.02rem;
        min-width: 0;
    }

    body.route-clients .logout-form .btn-ghost {
        width: 100%;
        padding: 0.38rem 0.5rem;
        gap: 0.32rem;
        justify-content: flex-start;
    }
}

/* Mobile navigation + Calls page adaptive */
.mobile-topbar,
.sidebar-mobile-close,
.mobile-nav-backdrop {
    display: none;
}

@media (max-width: 860px) {
    body.route-clients .global-page-header {
        display: none;
    }

    body.route-clients .app-shell {
        width: 100%;
        margin: 0;
    }

    body.route-clients .app-layout {
        display: block;
    }

    body.route-clients .content-wrap {
        border: 0;
        border-radius: 0;
        min-height: 100dvh;
        padding: 0.82rem 0.72rem 1rem;
    }

    body.route-clients.mobile-nav-open {
        overflow: hidden;
    }

    body.route-clients .mobile-topbar {
        display: flex;
        align-items: center;
        gap: 0.55rem;
        margin: -0.16rem 0 0.64rem;
        position: sticky;
        top: 0;
        z-index: 2020;
        background: linear-gradient(180deg, #fbfdff, #f6f8fc);
        padding: 0.25rem 0 0.35rem;
    }

    body.route-clients .mobile-topbar-title {
        font-size: 0.95rem;
        color: #1b2e4f;
        letter-spacing: -0.01em;
    }

    body.route-clients .mobile-menu-btn {
        display: inline-flex;
        width: 34px;
        height: 34px;
        border-radius: 10px;
        border: 1px solid #d8dfeb;
        background: #ffffff;
        color: #324f82;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex: 0 0 auto;
    }

    body.route-clients .mobile-menu-btn svg {
        width: 17px;
        height: 17px;
    }

    body.route-clients .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        width: min(82vw, 292px);
        height: 100dvh;
        min-height: 100dvh;
        margin: 0;
        border-radius: 0 14px 14px 0;
        z-index: 2150;
        transform: translateX(-105%);
        transition: transform 0.24s ease;
        box-shadow: 0 18px 38px rgba(15, 31, 58, 0.2);
        padding: 0.9rem 0.65rem;
    }

    body.route-clients.mobile-nav-open .sidebar {
        transform: translateX(0);
    }

    body.route-clients .sidebar-mobile-close {
        display: inline-flex;
        width: 28px;
        height: 28px;
        margin-left: auto;
        border: 1px solid #d8dfeb;
        border-radius: 8px;
        background: #ffffff;
        color: #6c7990;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex: 0 0 auto;
    }

    body.route-clients .sidebar-mobile-close svg {
        width: 14px;
        height: 14px;
    }

    body.route-clients .mobile-nav-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 2100;
        border: 0;
        padding: 0;
        background: rgba(19, 33, 55, 0.38);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s ease;
    }

    body.route-clients.mobile-nav-open .mobile-nav-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    body.route-clients .sidebar-nav {
        grid-template-columns: 1fr;
        overflow: auto;
        max-height: calc(100dvh - 190px);
        padding-right: 0.15rem;
    }

    body.route-clients .sidebar-nav a {
        text-align: left;
    }

    body.route-clients .calls-queue-card {
        padding: 0.74rem 0.62rem;
    }

    body.route-clients .calls-activity-card {
        padding: 0.7rem 0.62rem;
    }

    body.route-clients .calls-activity-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.48rem;
    }

    body.route-clients .calls-activity-item {
        padding: 0.5rem 0.52rem;
    }

    body.route-clients .calls-activity-value {
        font-size: 1.08rem;
    }

    body.route-clients .calls-queue-card .table-wrap {
        overflow: visible;
    }

    body.route-clients .calls-table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    body.route-clients .calls-table thead {
        display: none;
    }

    body.route-clients .calls-table,
    body.route-clients .calls-table tbody,
    body.route-clients .calls-table tr,
    body.route-clients .calls-table td {
        display: block;
        width: 100%;
    }

    body.route-clients .calls-table tbody {
        display: grid;
        gap: 0.64rem;
    }

    body.route-clients .calls-table tr {
        border: 1px solid #dce4ef;
        border-radius: 13px;
        background: #ffffff;
        padding: 0.6rem 0.64rem 0.65rem;
        box-shadow: 0 8px 20px rgba(22, 49, 92, 0.08);
    }

    body.route-clients .calls-table td {
        border: 0;
        padding: 0.28rem 0;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 0.7rem;
    }

    body.route-clients .calls-table td::before {
        content: attr(data-label);
        flex: 0 0 100px;
        font-size: 0.7rem;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: #8898b3;
        line-height: 1.35;
        padding-top: 0.08rem;
    }

    body.route-clients .calls-table td[data-label="Действие"] {
        padding-top: 0.48rem;
    }

    body.route-clients .calls-table td[data-label="Действие"]::before {
        display: none;
    }

    body.route-clients .calls-table td[data-label="Действие"] .btn-call {
        width: 100%;
    }

    body.route-clients .calls-table .truncate-2,
    body.route-clients .calls-table .truncate-wide {
        max-width: none;
    }

    body.route-clients .calls-table .status-chip,
    body.route-clients .calls-table .clients-next-contact {
        margin-left: auto;
    }

    body.route-clients .queue-block {
        margin-bottom: 0.84rem;
    }

    body.route-clients .queue-block h3 {
        margin-bottom: 0.48rem;
        font-size: 0.9rem;
    }

    body.route-clients .call-summary {
        display: grid;
        gap: 0.15rem;
    }

    body.route-clients .call-result-modal .modal-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
        overflow: auto;
    }

    body.route-clients .call-result-modal .form-actions {
        display: grid;
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    body.route-clients .calls-activity-grid {
        grid-template-columns: 1fr;
    }
}

/* Tasks module */
body.route-clients .tasks-table td {
    vertical-align: middle;
}

/* Meetings module */
body.route-clients .meetings-filter-form {
    grid-template-columns: minmax(240px, 1.8fr) minmax(130px, 0.9fr) minmax(145px, 1fr) minmax(145px, 1fr) auto;
    align-items: center;
}

body.route-clients .meetings-filter-form .meetings-search-field {
    min-width: 0;
}

body.route-clients .meetings-filter-form input[type='date'] {
    width: 100%;
    min-height: 40px;
}

body.route-clients .meetings-table td {
    vertical-align: middle;
}

body.route-clients .meetings-table .meeting-col-check,
body.route-clients .meetings-table .meeting-col-check-head {
    width: 34px;
    min-width: 34px;
    padding-left: 0.7rem;
    padding-right: 0.3rem;
    text-align: center;
}

body.route-clients .meetings-table .meeting-col-check .inline-form {
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body.route-clients .meetings-table .meeting-col-actions-head,
body.route-clients .meetings-table .meeting-col-actions {
    width: 48px;
    min-width: 48px;
    padding-left: 0.35rem;
    padding-right: 0.95rem;
    text-align: right;
}

body.route-clients .meetings-table .meeting-col-actions .icon-btn {
    width: 30px;
    height: 30px;
    border-radius: 9px;
}

body.route-clients .meetings-table tr.is-done td {
    color: #9aa2b1;
    background: #f6f7f9;
}

body.route-clients .meetings-overview-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 0.9rem;
}

body.route-clients .meetings-overview-card {
    display: grid;
    grid-template-rows: auto auto auto 1fr auto;
    gap: 0.72rem;
    min-height: 214px;
    padding: 1.35rem 1.5rem 1.25rem;
    border-radius: 27px;
    background: #ffffff;
    border: 1px solid #e8ebef;
    box-shadow: none;
}

body.route-clients .meetings-overview-card-waiting {
    border-color: #f3ddb8;
}

body.route-clients .meetings-overview-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
}

body.route-clients .meetings-overview-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

body.route-clients .meetings-overview-icon svg {
    width: 22px;
    height: 22px;
}

body.route-clients .meetings-overview-icon-total {
    background: #dfeafd;
    color: #296cff;
}

body.route-clients .meetings-overview-icon-waiting {
    background: #f7e4c7;
    color: #ff7a00;
}

body.route-clients .meetings-overview-icon-done {
    background: #cdeedc;
    color: #139963;
}

body.route-clients .meetings-overview-icon-today {
    background: #f6dce1;
    color: #ff3650;
}

body.route-clients .meetings-overview-chip {
    min-height: 30px;
    padding: 0.28rem 0.85rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

body.route-clients .meetings-overview-chip-green,
body.route-clients .meetings-overview-chip-green-soft {
    background: #effaf3;
    color: #17b46a;
    border: 1px solid #c6efda;
}

body.route-clients .meetings-overview-chip-amber {
    background: #fff4e1;
    color: #ff7a00;
    border: 1px solid #f0d6ac;
}

body.route-clients .meetings-overview-chip-muted {
    background: #f5f6f8;
    color: #9ca4b2;
    border: 1px solid #e8ebef;
}

body.route-clients .meetings-overview-value {
    margin: 0;
    color: #0f1730;
    font-size: clamp(2.65rem, 3.3vw, 3.85rem);
    line-height: 0.9;
    font-weight: 800;
    letter-spacing: -0.055em;
}

body.route-clients .meetings-overview-value-amber {
    color: #ff6d00;
}

body.route-clients .meetings-overview-label {
    margin: -0.05rem 0 0;
    color: #98a1b1;
    font-size: 0.86rem;
    line-height: 1.25;
    font-weight: 700;
}

body.route-clients .meetings-overview-progress {
    width: 100%;
    height: 6px;
    border-radius: 999px;
    overflow: hidden;
    background: #edf1f6;
    align-self: end;
}

body.route-clients .meetings-overview-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
}

body.route-clients .meetings-overview-progress-total span {
    background: linear-gradient(90deg, #2a70ff 0%, #3e88ff 100%);
}

body.route-clients .meetings-overview-progress-amber {
    background: #f4e0b7;
}

body.route-clients .meetings-overview-progress-amber span {
    background: linear-gradient(90deg, #ff8600 0%, #ff8600 100%);
}

body.route-clients .meetings-overview-meta,
body.route-clients .meetings-overview-meta-row {
    margin: 0;
    color: #a0a8b7;
    font-size: 0.83rem;
    line-height: 1.2;
    font-weight: 600;
}

body.route-clients .meetings-overview-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

body.route-clients .meetings-overview-meta-strong {
    font-size: 0.95rem;
    font-weight: 800;
}

body.route-clients .meetings-overview-meta-strong-blue {
    color: #2a70ff;
}

body.route-clients .meetings-overview-meta-strong-amber {
    color: #ff7a00;
}

body.route-clients .meetings-overview-weekdays {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.56rem;
    align-self: end;
}

body.route-clients .meetings-overview-weekdays span {
    min-height: 30px;
    padding: 0.28rem 0.4rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f3f5f7;
    color: #c4cad4;
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: lowercase;
}

body.route-clients .meetings-overview-weekdays span.is-active {
    background: #ccefdc;
    color: #139963;
}

body.route-clients .meetings-overview-bars {
    display: flex;
    align-items: flex-end;
    gap: 0.42rem;
    min-height: 46px;
    align-self: end;
}

body.route-clients .meetings-overview-bars span {
    flex: 1 1 0;
    min-width: 0;
    border-radius: 10px;
    background: #f0d7de;
}

body.route-clients .meetings-overview-bars span.is-current {
    background: #ff435b;
}

body.route-clients .meeting-complete-modal .modal-dialog {
    width: min(620px, calc(100vw - 16px));
    max-height: calc(100dvh - 16px);
    overflow: auto;
}

body.route-clients .meeting-create-modal .modal-dialog {
    width: min(760px, calc(100vw - 16px));
    max-height: calc(100dvh - 16px);
    overflow: auto;
}

body.route-clients .meeting-edit-modal .modal-dialog {
    width: min(760px, calc(100vw - 16px));
    max-height: calc(100dvh - 16px);
    overflow: auto;
}

body.route-clients .meeting-create-form {
    padding-top: 0.2rem;
}

body.route-clients .meeting-create-form textarea {
    min-height: 96px;
}

body.route-clients .meeting-edit-form {
    padding-top: 0.2rem;
}

body.route-clients .meeting-edit-form textarea {
    min-height: 108px;
}

body.route-clients .meeting-complete-company {
    margin: -0.2rem 0 0.6rem;
}

body.route-clients .meeting-complete-form textarea {
    min-height: 108px;
}

body.route-clients .tasks-table .clients-next-contact {
    color: #5e7599;
    font-weight: 600;
}

body.route-clients .tasks-table .task-col-check {
    width: 30px;
    min-width: 30px;
    padding-left: 0.95rem;
    padding-right: 0.35rem;
    text-align: center;
}

body.route-clients .tasks-table .task-col-check-head {
    width: 30px;
    min-width: 30px;
    padding-left: 0.35rem;
    padding-right: 0.35rem;
    text-align: center;
}

body.route-clients .tasks-table .task-col-actions-head,
body.route-clients .tasks-table .task-col-actions {
    width: 48px;
    min-width: 48px;
    padding-left: 0.35rem;
    padding-right: 1.15rem;
    text-align: right;
}

body.route-clients .tasks-table .task-col-actions .icon-btn {
    width: 30px;
    height: 30px;
    border-radius: 9px;
}

body.route-clients .task-actions {
    position: relative;
    display: inline-flex;
    justify-content: flex-end;
    width: 100%;
}

body.route-clients .task-actions-toggle {
    color: #5a7095;
}

body.route-clients .task-actions-toggle svg {
    width: 16px;
    height: 16px;
}

body.route-clients .task-actions-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 162px;
    padding: 0.34rem;
    border: 1px solid #dfe3ec;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 12px 26px rgba(18, 36, 68, 0.14);
    display: none;
    z-index: 30;
}

body.route-clients .task-actions.is-open .task-actions-menu {
    display: block;
}

body.route-clients .task-actions-item {
    width: 100%;
    padding: 0.54rem 0.62rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #253a5f;
    text-align: left;
    font: inherit;
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.22;
    cursor: pointer;
}

body.route-clients .task-actions-item:hover {
    background: #f6f8fc;
}

body.route-clients .task-actions-item.is-danger {
    color: #b03d4c;
}

body.route-clients .task-actions-item.is-danger:hover {
    background: #fff3f5;
}

body.route-clients .task-actions-delete-form {
    margin: 0;
}

body.route-clients .task-toggle-form {
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body.route-clients .task-check {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    cursor: pointer;
}

body.route-clients .task-check input {
    position: absolute;
    inset: 0;
    opacity: 0;
    margin: 0;
    cursor: pointer;
}

body.route-clients .task-check span {
    width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 1.5px solid #c3cad8;
    background: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.2s ease, background 0.2s ease;
}

body.route-clients .task-check input:checked + span {
    background: #e4f5ea;
    border-color: #68bf8a;
}

body.route-clients .task-check input:checked + span::before {
    content: "";
    width: 8px;
    height: 4px;
    border-left: 2px solid #2f9f62;
    border-bottom: 2px solid #2f9f62;
    transform: rotate(-45deg) translateY(-1px);
}

body.route-clients .task-title-btn {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    margin: 0;
    width: 100%;
    text-align: left;
    color: #17305a;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

body.route-clients .task-title-btn:hover {
    color: #1f65d6;
}

body.route-clients .task-title-btn:focus-visible {
    outline: 2px solid rgba(47, 112, 232, 0.5);
    outline-offset: 2px;
    border-radius: 6px;
}

body.route-clients .tasks-table tr.is-done td {
    color: #9aa2b1;
    background: #f6f7f9;
}

body.route-clients .tasks-table tr.is-done .task-title-text,
body.route-clients .tasks-table tr.is-done .task-desc-text {
    text-decoration: line-through;
    color: #a1a9b8;
}

body.route-clients .tasks-table tr.is-done .task-title-btn {
    color: #a1a9b8;
}

body.route-clients .task-create-modal {
    background: rgba(17, 36, 68, 0.22);
}

body.route-clients .task-edit-modal {
    background: rgba(17, 36, 68, 0.22);
}

body.route-clients .task-view-modal {
    background: rgba(17, 36, 68, 0.22);
}

body.route-clients .task-view-modal .modal-dialog {
    width: min(760px, calc(100vw - 16px));
    max-height: calc(100dvh - 16px);
    overflow: auto;
    border: 1px solid rgba(45, 75, 124, 0.2);
    box-shadow: 0 24px 44px rgba(29, 57, 103, 0.18);
}

body.route-clients .task-view-content {
    display: grid;
    gap: 0.9rem;
}

body.route-clients .task-view-grid {
    margin: 0;
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 0.45rem 0.8rem;
}

body.route-clients .task-view-grid dt {
    color: #6f84a7;
    font-size: 0.82rem;
    font-weight: 700;
}

body.route-clients .task-view-grid dd {
    margin: 0;
    color: #233a5f;
}

body.route-clients .task-view-description-block h3 {
    margin: 0 0 0.42rem;
    color: #4e658e;
    font-size: 0.95rem;
}

body.route-clients .task-view-description {
    margin: 0;
    border: 1px solid rgba(48, 79, 131, 0.16);
    border-radius: 12px;
    background: #f8fbff;
    padding: 0.72rem 0.78rem;
    white-space: pre-wrap;
    word-break: break-word;
    color: #2b4066;
}

body.route-clients .task-create-modal .modal-dialog {
    width: min(760px, calc(100vw - 16px));
    max-height: calc(100dvh - 16px);
    overflow: auto;
    border: 1px solid rgba(45, 75, 124, 0.2);
    box-shadow: 0 24px 44px rgba(29, 57, 103, 0.18);
}

body.route-clients .task-edit-modal .modal-dialog {
    width: min(760px, calc(100vw - 16px));
    max-height: calc(100dvh - 16px);
    overflow: auto;
    border: 1px solid rgba(45, 75, 124, 0.2);
    box-shadow: 0 24px 44px rgba(29, 57, 103, 0.18);
}

body.route-clients .task-edit-form {
    padding-top: 0.2rem;
}

body.route-clients .task-edit-form textarea {
    min-height: 96px;
}

body.route-clients .task-create-form {
    padding-top: 0.2rem;
}

body.route-clients .task-create-form textarea {
    min-height: 96px;
}

@media (max-width: 1180px) {
    body.route-clients .meetings-overview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    body.route-clients .meetings-filter-form {
        grid-template-columns: 1fr;
    }

    body.route-clients .meetings-table .meeting-col-check,
    body.route-clients .meetings-table .meeting-col-check-head {
        width: 24px;
        min-width: 24px;
        padding-left: 0.2rem;
        padding-right: 0.2rem;
    }

    body.route-clients .meetings-table .meeting-col-actions-head,
    body.route-clients .meetings-table .meeting-col-actions {
        width: 36px;
        min-width: 36px;
        padding-left: 0.2rem;
        padding-right: 0.2rem;
    }

    body.route-clients .meeting-complete-modal .modal-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
    }

    body.route-clients .meeting-create-modal .modal-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
    }

    body.route-clients .meeting-edit-modal .modal-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
    }

    body.route-clients .meetings-overview-grid {
        grid-template-columns: 1fr;
    }

    body.route-clients .meetings-overview-card {
        padding: 1rem;
        border-radius: 20px;
    }

    body.route-clients .tasks-table .task-col-check {
        width: 24px;
        min-width: 24px;
        padding-left: 0.2rem;
        padding-right: 0.2rem;
    }

    body.route-clients .tasks-table .task-col-check-head {
        width: 24px;
        min-width: 24px;
        padding-left: 0.2rem;
        padding-right: 0.2rem;
    }

    body.route-clients .tasks-table .task-col-actions-head,
    body.route-clients .tasks-table .task-col-actions {
        width: 36px;
        min-width: 36px;
        padding-left: 0.2rem;
        padding-right: 0.2rem;
    }

    body.route-clients .task-actions-menu {
        right: -2px;
        min-width: 148px;
    }

    body.route-clients .task-view-modal .modal-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
    }

    body.route-clients .task-view-grid {
        grid-template-columns: 1fr;
        gap: 0.24rem;
    }

    body.route-clients .task-view-grid dt {
        margin-top: 0.26rem;
    }

    body.route-clients .task-create-modal .modal-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
    }

    body.route-clients .task-edit-modal .modal-dialog {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
    }
}

/* Admin dashboard */
body.route-clients .admin-kpi-cards {
    margin-bottom: 0.75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.route-clients .admin-kpi-card {
    min-height: 130px;
    display: grid;
    gap: 0.34rem;
    align-content: start;
}

body.route-clients .admin-kpi-card small {
    color: #7f8a9c;
    line-height: 1.3;
}

body.route-clients .admin-plan-table td {
    vertical-align: middle;
}

body.route-clients .admin-plan-meter {
    width: 100%;
    height: 8px;
    border-radius: 999px;
    background: #ebedf1;
    overflow: hidden;
    margin-bottom: 0.28rem;
}

body.route-clients .admin-plan-meter > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #2f73f5, #59a0ff);
}

body.route-clients .admin-chip {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    border: 1px solid #dce2ec;
    background: #f5f7fb;
    color: #55637b;
    padding: 0.18rem 0.5rem;
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0.1rem 0.22rem 0.1rem 0;
    white-space: nowrap;
}

body.route-clients .admin-chip.is-ok {
    border-color: #cde7d7;
    background: #ecf8f1;
    color: #1f9a56;
}

body.route-clients .admin-chip.is-warn {
    border-color: #f0dfb7;
    background: #fff8e8;
    color: #ba851c;
}

body.route-clients .admin-panels-grid {
    margin-bottom: 0.75rem;
}

body.route-clients .admin-panel-card {
    display: grid;
    gap: 0.65rem;
}

body.route-clients .admin-mini-kpi-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.48rem;
}

body.route-clients .admin-mini-kpi {
    border: 1px solid #e5e8ef;
    border-radius: 11px;
    background: #ffffff;
    padding: 0.45rem 0.55rem;
    display: grid;
    gap: 0.2rem;
}

body.route-clients .admin-mini-kpi span {
    color: #7f8a9c;
    font-size: 0.76rem;
    font-weight: 600;
    line-height: 1.2;
}

body.route-clients .admin-mini-kpi strong {
    color: #1f2430;
    font-size: 1.2rem;
    letter-spacing: -0.01em;
    line-height: 1;
}

body.route-clients .admin-subtitle {
    margin: 0;
    color: #5f6e87;
    font-size: 0.86rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-weight: 700;
}

body.route-clients .admin-compact-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.38rem;
}

body.route-clients .admin-compact-list li {
    border: 1px solid #e5e8ef;
    border-radius: 11px;
    background: #ffffff;
    padding: 0.5rem 0.58rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.65rem;
}

body.route-clients .admin-compact-list strong {
    color: #1f2430;
    font-size: 0.9rem;
    line-height: 1.24;
}

body.route-clients .admin-compact-list span {
    color: #7c8799;
    font-size: 0.82rem;
    line-height: 1.25;
    text-align: right;
}

body.route-clients .admin-funnel-text {
    margin: 0;
    color: #69788f;
    font-size: 0.9rem;
    line-height: 1.35;
}

body.route-clients .admin-funnel-text strong {
    color: #1f2430;
}

body.route-clients .admin-funnel-text code {
    border: 1px solid #e5e8ef;
    border-radius: 6px;
    background: #f6f8fb;
    color: #4a5a73;
    padding: 0.02rem 0.32rem;
    font-size: 0.82em;
}

body.route-clients .admin-money-meta {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

body.route-clients .admin-money-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.28rem;
    border: 1px solid #e5e8ef;
    border-radius: 999px;
    background: #fafbfe;
    padding: 0.28rem 0.54rem;
    color: #66758d;
    font-size: 0.8rem;
    line-height: 1.2;
    font-weight: 600;
}

body.route-clients .admin-money-meta strong {
    color: #1f2430;
    font-size: 0.83rem;
}

body.route-clients .admin-money-table td strong {
    font-size: 0.92rem;
}

/* Settings and account */
body.route-clients .settings-note {
    margin: 0.1rem 0 0;
    font-size: 0.82rem;
}

body.route-clients .settings-managers-table td {
    vertical-align: top;
}

body.route-clients .settings-contacts-cell {
    display: grid;
    gap: 0.2rem;
}

body.route-clients .settings-contacts-cell span {
    color: #4b5a71;
    font-size: 0.84rem;
}

body.route-clients .settings-inline-action {
    margin-top: 0.35rem;
}

body.route-clients .settings-plan-form,
body.route-clients .settings-password-form,
body.route-clients .settings-access-form {
    display: grid;
    gap: 0.38rem;
}

body.route-clients .settings-plan-form input,
body.route-clients .settings-password-form input,
body.route-clients .settings-access-form select {
    min-width: 140px;
}

body.route-clients .settings-access-form .checkbox-row {
    margin: 0;
}

body.route-clients .account-grid {
    margin-bottom: 0.75rem;
}

body.route-clients .account-summary-cards .stat-card {
    min-height: 120px;
}

body.route-clients .account-alert {
    margin: 0;
    border-radius: 12px;
    border: 1px solid transparent;
    padding: 0.5rem 0.62rem;
    font-size: 0.86rem;
    font-weight: 600;
}

body.route-clients .account-alert.is-warning {
    border-color: #f0dfb7;
    background: #fff8e8;
    color: #ba851c;
}

body.route-account.role-manager .account-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1.2rem;
    padding: 1.15rem 1.35rem;
    border: 0;
    border-radius: 22px;
    background: linear-gradient(120deg, #2f74b0 0%, #1e4d84 62%, #1d3f6b 100%);
    color: #f8fbff;
    overflow: hidden;
}

body.route-account.role-manager .account-hero::before,
body.route-account.role-manager .account-hero::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.05);
    pointer-events: none;
}

body.route-account.role-manager .account-hero::before {
    width: 260px;
    height: 260px;
    right: 320px;
    top: 18px;
}

body.route-account.role-manager .account-hero::after {
    width: 220px;
    height: 220px;
    right: -30px;
    top: 8px;
}

body.route-account.role-manager .account-hero-profile,
body.route-account.role-manager .account-hero-stats {
    position: relative;
    z-index: 1;
}

body.route-account.role-manager .account-hero-profile {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}

body.route-account.role-manager .account-hero-avatar-wrap {
    position: relative;
    flex: 0 0 auto;
}

body.route-account.role-manager .account-hero-avatar {
    width: 96px;
    height: 96px;
    border-radius: 18px;
    border: 2px solid rgba(255, 255, 255, 0.26);
    background: linear-gradient(180deg, rgba(152, 214, 255, 0.18) 0%, rgba(255, 255, 255, 0.06) 100%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 1.16rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    backdrop-filter: blur(8px);
}

body.route-account.role-manager .account-hero-avatar-action {
    position: absolute;
    right: -6px;
    bottom: -6px;
    width: 30px;
    height: 30px;
    border-radius: 999px;
    border: 0;
    background: #d6f132;
    color: #20354f;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(17, 28, 43, 0.18);
}

body.route-account.role-manager .account-hero-avatar-action svg {
    width: 15px;
    height: 15px;
}

body.route-account.role-manager .account-hero-main {
    min-width: 0;
    display: grid;
    gap: 0.2rem;
}

body.route-account.role-manager .account-hero-kicker-row {
    display: flex;
    align-items: center;
    gap: 0.58rem;
    flex-wrap: wrap;
}

body.route-account.role-manager .account-hero-kicker {
    color: rgba(214, 232, 249, 0.76);
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body.route-account.role-manager .account-hero-role-badge {
    min-height: 22px;
    border-radius: 999px;
    background: #b1d430;
    color: #2f5a12;
    padding: 0.18rem 0.56rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

body.route-account.role-manager .account-hero-main h2 {
    margin: 0;
    color: #ffffff;
    font-size: 2.1rem;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -0.02em;
}

body.route-account.role-manager .account-hero-main p {
    margin: 0;
    color: rgba(228, 239, 251, 0.78);
    font-size: 0.86rem;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.route-account.role-manager .account-hero-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    gap: 0.68rem;
}

body.route-account.role-manager .account-hero-stat-card {
    min-height: 88px;
    border-radius: 16px;
    border: 1px solid rgba(203, 223, 243, 0.25);
    background: rgba(255, 255, 255, 0.08);
    padding: 0.82rem 0.96rem;
    display: grid;
    align-content: start;
    gap: 0.18rem;
    backdrop-filter: blur(10px);
}

body.route-account.role-manager .account-hero-stat-card span {
    color: rgba(219, 232, 247, 0.74);
    font-size: 0.7rem;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.route-account.role-manager .account-hero-stat-card strong {
    color: #ffffff;
    font-size: 0.98rem;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -0.03em;
}

body.route-account.role-manager .account-hero-stat-card small {
    color: rgba(220, 233, 247, 0.64);
    font-size: 0.76rem;
    line-height: 1.2;
    font-weight: 600;
}

body.route-account.role-manager .account-performance-section {
    margin-top: 1rem;
}

body.route-account.role-manager .account-performance-head {
    display: flex;
    align-items: center;
    gap: 0.46rem;
    margin-bottom: 0.82rem;
}

body.route-account.role-manager .account-performance-head-icon {
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #92a0b5;
}

body.route-account.role-manager .account-performance-head-icon svg {
    width: 16px;
    height: 16px;
}

body.route-account.role-manager .account-performance-head h2 {
    margin: 0;
    color: #3c4658;
    font-size: 0.94rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.route-account.role-manager .account-performance-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.86rem;
}

body.route-account.role-manager .account-metric-card {
    position: relative;
    min-width: 0;
    min-height: 222px;
    padding: 1rem 1.08rem;
    border-radius: 18px;
    border: 1px solid #e2e7ee;
    background: #ffffff;
    box-shadow: none;
    overflow: hidden;
    display: grid;
    align-content: start;
    gap: 0.82rem;
}

body.route-account.role-manager .account-metric-card::after {
    content: "";
    position: absolute;
    top: -26px;
    right: -20px;
    width: 120px;
    height: 120px;
    border-radius: 999px;
    background: rgba(80, 106, 154, 0.05);
    pointer-events: none;
}

body.route-account.role-manager .account-metric-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.58rem;
    position: relative;
    z-index: 1;
}

body.route-account.role-manager .account-metric-icon {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body.route-account.role-manager .account-metric-icon svg {
    width: 18px;
    height: 18px;
}

body.route-account.role-manager .account-metric-icon.is-blue {
    background: #edf3ff;
    color: #2e6bff;
}

body.route-account.role-manager .account-metric-icon.is-green {
    background: #ebf8f0;
    color: #2f9a57;
}

body.route-account.role-manager .account-metric-icon.is-gold {
    background: #fff5e3;
    color: #d48a09;
}

body.route-account.role-manager .account-metric-icon.is-red {
    background: #fff0f2;
    color: #ef4662;
}

body.route-account.role-manager .account-metric-pill {
    min-height: 24px;
    border-radius: 999px;
    padding: 0.16rem 0.62rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;
    border: 1px solid transparent;
}

body.route-account.role-manager .account-metric-pill.is-danger {
    background: #fff0f2;
    border-color: #ffd0d9;
    color: #df324d;
}

body.route-account.role-manager .account-metric-pill.is-warn {
    background: #fff7e7;
    border-color: #f7deb0;
    color: #c08112;
}

body.route-account.role-manager .account-metric-pill.is-good {
    background: #eef8f1;
    border-color: #d3ebda;
    color: #2f9458;
}

body.route-account.role-manager .account-metric-pill.is-muted {
    background: #f3f5f7;
    border-color: #e2e7ee;
    color: #748195;
}

body.route-account.role-manager .account-metric-pill.is-gold {
    background: #fff3de;
    border-color: #f5d9a2;
    color: #cb8610;
}

body.route-account.role-manager .account-metric-pill.is-red {
    background: #fff1f4;
    border-color: #ffd7df;
    color: #e24863;
}

body.route-account.role-manager .account-metric-progress-layout {
    display: flex;
    align-items: center;
    gap: 0.92rem;
    min-width: 0;
    position: relative;
    z-index: 1;
}

body.route-account.role-manager .account-metric-ring {
    --metric-progress-fill: calc(var(--metric-progress, 0) * 1%);
    position: relative;
    width: 76px;
    height: 76px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: conic-gradient(#4a7bff var(--metric-progress-fill), #e6ecf5 0);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body.route-account.role-manager .account-metric-ring::before {
    content: "";
    position: absolute;
    inset: 7px;
    border-radius: inherit;
    background: #ffffff;
}

body.route-account.role-manager .account-metric-ring span {
    position: relative;
    z-index: 1;
    color: #2c62e7;
    font-size: 0.92rem;
    line-height: 1;
    font-weight: 800;
}

body.route-account.role-manager .account-metric-main-copy {
    min-width: 0;
    display: grid;
    gap: 0.28rem;
}

body.route-account.role-manager .account-metric-title {
    margin: 0;
    color: #97a0ae;
    font-size: 0.88rem;
    line-height: 1.2;
    font-weight: 600;
}

body.route-account.role-manager .account-metric-main-copy strong,
body.route-account.role-manager .account-metric-value-row strong,
body.route-account.role-manager .account-metric-money-value {
    color: #11192a;
    font-size: 1.2rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -0.03em;
}

body.route-account.role-manager .account-metric-main-copy strong {
    font-size: 2.1rem;
}

body.route-account.role-manager .account-metric-value-row {
    display: flex;
    align-items: baseline;
    gap: 0.18rem;
    position: relative;
    z-index: 1;
}

body.route-account.role-manager .account-metric-value-row strong {
    font-size: 1.9rem;
}

body.route-account.role-manager .account-metric-value-row span {
    color: #c2c8d2;
    font-size: 1.18rem;
    line-height: 1;
    font-weight: 700;
}

body.route-account.role-manager .account-metric-bar {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 7px;
    border-radius: 999px;
    background: #edf1f5;
    overflow: hidden;
}

body.route-account.role-manager .account-metric-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #39a762 0%, #64c181 100%);
}

body.route-account.role-manager .account-metric-meta-row {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.56rem;
}

body.route-account.role-manager .account-metric-meta-row small {
    color: #8e98a8;
    font-size: 0.78rem;
    line-height: 1.2;
    font-weight: 700;
}

body.route-account.role-manager .account-metric-meta-row small:first-child {
    color: #2b9d59;
}

body.route-account.role-manager .account-metric-money-value {
    position: relative;
    z-index: 1;
    font-size: 2rem;
}

body.route-account.role-manager .account-metric-money-value.is-dark {
    color: #131b2c;
}

body.route-account.role-manager .account-metric-list {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 0.34rem;
}

body.route-account.role-manager .account-metric-list div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

body.route-account.role-manager .account-metric-list span {
    color: #959ead;
    font-size: 0.8rem;
    line-height: 1.2;
    font-weight: 600;
}

body.route-account.role-manager .account-metric-list strong {
    color: #566071;
    font-size: 0.8rem;
    line-height: 1.2;
    font-weight: 700;
}

body.route-account.role-manager .account-metric-list div.is-accent span,
body.route-account.role-manager .account-metric-list div.is-accent strong {
    color: #d28709;
}

body.route-account.role-manager .account-metric-inline-note {
    position: relative;
    z-index: 1;
    color: #8b95a5;
    font-size: 0.8rem;
    line-height: 1.2;
    font-weight: 600;
}

body.route-account.role-manager .account-metric-bonus-box {
    position: relative;
    z-index: 1;
    margin-top: auto;
    border-radius: 14px;
    border: 1px solid transparent;
    padding: 0.38rem 0.86rem;
    display: grid;
    gap: 0.16rem;
}

body.route-account.role-manager .account-metric-bonus-head {
    display: flex;
    align-items: baseline;
    gap: 0.36rem;
    min-width: 0;
    white-space: nowrap;
}

body.route-account.role-manager .account-metric-bonus-box span {
    font-size: 0.55rem;
    line-height: 1.2;
    font-weight: 800;
    text-transform: uppercase;
    white-space: nowrap;
}

body.route-account.role-manager .account-metric-bonus-box strong {
    font-size: 1rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -0.03em;
    white-space: nowrap;
}

body.route-account.role-manager .account-metric-bonus-box small {
    font-size: 0.78rem;
    line-height: 1.2;
    font-weight: 600;
}

body.route-account.role-manager .account-metric-bonus-box.is-danger {
    background: #fff1f4;
    border-color: #ffd9e0;
    color: #e5435e;
}

body.route-account.role-manager .account-metric-bonus-box.is-good {
    background: #eef8f1;
    border-color: #d3ebda;
    color: #2f9458;
}

body.route-account.role-manager .account-metric-footnote {
    position: relative;
    z-index: 1;
    margin: 0;
    color: #8993a2;
    font-size: 0.84rem;
    line-height: 1.3;
    font-weight: 600;
}

body.route-account.role-manager .account-metric-footnote strong {
    color: #2d64ef;
    font-weight: 800;
}

body.route-account.role-manager .account-grid {
    margin-top: 0.9rem;
}

@media (max-width: 1280px) {
    body.route-account.role-manager .account-hero {
        grid-template-columns: 1fr;
    }

    body.route-account.role-manager .account-hero-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.route-account.role-manager .account-performance-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    body.route-account.role-manager .account-hero {
        padding: 0.98rem 0.92rem;
        border-radius: 18px;
    }

    body.route-account.role-manager .account-hero-profile {
        align-items: flex-start;
    }

    body.route-account.role-manager .account-hero-avatar {
        width: 78px;
        height: 78px;
        font-size: 1rem;
    }

    body.route-account.role-manager .account-hero-main h2 {
        font-size: 1.7rem;
    }

    body.route-account.role-manager .account-hero-stats {
        grid-template-columns: 1fr;
    }

    body.route-account.role-manager .account-performance-grid {
        grid-template-columns: 1fr;
    }

    body.route-account.role-manager .account-metric-card {
        min-height: 0;
    }

    body.route-account.role-manager .account-metric-progress-layout {
        align-items: center;
    }
}

/* Manager dashboard */
body.route-dashboard.role-manager .dashboard-manager-layout {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
    min-height: calc(100vh - 2rem);
    height: calc(100vh - 2rem);
}

body.route-dashboard.role-manager .dashboard-manager-main {
    min-width: 0;
    display: grid;
    gap: 0.68rem;
    padding: 0;
}

body.route-dashboard.role-manager .dashboard-manager-main > section {
    margin: 0;
}

body.route-dashboard.role-manager .dashboard-sidepanel {
    position: sticky;
    top: 0;
    align-self: start;
    min-height: calc(100vh - 2rem);
    height: calc(100vh - 2rem);
    max-height: calc(100vh - 2rem);
    border-radius: 0;
    border: 0;
    border-right: 1px solid rgba(255, 255, 255, 0.75);
    background: linear-gradient(180deg, #a77826 0%, #87570f 49%, #1a345b 100%);
    color: #fff5df;
    padding: 0.82rem 0.82rem 0.74rem;
    display: grid;
    gap: 0.62rem;
    overflow-y: auto;
}

body.route-dashboard.role-manager .dashboard-sidepanel-welcome {
    display: grid;
    gap: 0.14rem;
}

body.route-dashboard.role-manager .dashboard-sidepanel-welcome span {
    color: rgba(255, 246, 226, 0.82);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.route-dashboard.role-manager .dashboard-sidepanel-welcome strong {
    color: #ffffff;
    font-size: 1.32rem;
    line-height: 1.06;
    letter-spacing: -0.02em;
    font-weight: 800;
}

body.route-dashboard.role-manager .dashboard-sidepanel-section {
    border-top: 1px solid rgba(255, 235, 196, 0.18);
    padding-top: 0.62rem;
    display: grid;
    gap: 0.42rem;
}

body.route-dashboard.role-manager .dashboard-sidepanel-section h2 {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #fff0cd;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

body.route-dashboard.role-manager .dashboard-sidepanel-section h2::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(215, 255, 73, 0.16);
    flex: 0 0 auto;
}

body.route-dashboard.role-manager .dashboard-sidepanel-goal-card {
    border-radius: 14px;
    border: 1px solid rgba(255, 232, 184, 0.24);
    background: rgba(255, 255, 255, 0.04);
    padding: 0.52rem 0.56rem;
    display: grid;
    gap: 0.08rem;
}

body.route-dashboard.role-manager .dashboard-sidepanel-goal-main {
    margin: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 0.32rem;
    line-height: 1;
}

body.route-dashboard.role-manager .dashboard-sidepanel-goal-main strong {
    color: #ffffff;
    font-size: 2.2rem;
    line-height: 1;
    letter-spacing: -0.03em;
    font-weight: 800;
}

body.route-dashboard.role-manager .dashboard-sidepanel-goal-main span {
    color: rgba(255, 239, 210, 0.9);
    font-size: 0.86rem;
    font-weight: 700;
}

body.route-dashboard.role-manager .dashboard-sidepanel-goal-card p {
    margin: 0;
    color: rgba(255, 237, 204, 0.84);
    font-size: 0.8rem;
    line-height: 1.3;
}

body.route-dashboard.role-manager .dashboard-sidepanel-calls {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.24rem;
}

body.route-dashboard.role-manager .dashboard-sidepanel-calls li {
    display: grid;
    grid-template-columns: 25px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.45rem;
    color: rgba(255, 241, 214, 0.92);
    font-size: 0.89rem;
    font-weight: 600;
}

body.route-dashboard.role-manager .dashboard-sidepanel-calls li strong {
    color: #ffffff;
    font-size: 1.48rem;
    line-height: 1;
    letter-spacing: -0.02em;
    font-weight: 800;
}

body.route-dashboard.role-manager .dashboard-sidepanel-call-icon {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

body.route-dashboard.role-manager .dashboard-sidepanel-call-icon svg {
    width: 12px;
    height: 12px;
}

body.route-dashboard.role-manager .dashboard-sidepanel-call-icon.is-connected {
    background: rgba(74, 150, 255, 0.2);
    border-color: rgba(160, 206, 255, 0.35);
    color: #b6dcff;
}

body.route-dashboard.role-manager .dashboard-sidepanel-call-icon.is-callback {
    background: rgba(172, 127, 255, 0.2);
    border-color: rgba(205, 173, 255, 0.35);
    color: #dbc8ff;
}

body.route-dashboard.role-manager .dashboard-sidepanel-call-icon.is-missed {
    background: rgba(255, 164, 72, 0.2);
    border-color: rgba(255, 210, 164, 0.35);
    color: #ffd9ac;
}

body.route-dashboard.role-manager .dashboard-sidepanel-call-icon.is-refuse {
    background: rgba(255, 92, 92, 0.2);
    border-color: rgba(255, 169, 169, 0.34);
    color: #ffc5c5;
}

body.route-dashboard.role-manager .dashboard-sidepanel-activity {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.2rem;
    align-items: end;
    padding-top: 0.16rem;
    min-height: 66px;
}

body.route-dashboard.role-manager .dashboard-sidepanel-activity-item {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 0.22rem;
}

body.route-dashboard.role-manager .dashboard-sidepanel-activity-bar {
    width: 100%;
    max-width: 12px;
    height: clamp(4px, calc(var(--activity-ratio, 8) * 0.54px), 54px);
    border-radius: 6px;
    background: rgba(255, 246, 226, 0.34);
}

body.route-dashboard.role-manager .dashboard-sidepanel-activity-item.is-today .dashboard-sidepanel-activity-bar {
    background: #cbff2f;
    box-shadow: 0 0 0 1px rgba(203, 255, 47, 0.14);
}

body.route-dashboard.role-manager .dashboard-sidepanel-activity-label {
    color: rgba(255, 237, 205, 0.72);
    font-size: 0.62rem;
    font-weight: 700;
    line-height: 1;
    text-transform: lowercase;
}

body.route-dashboard.role-manager .dashboard-sidepanel-activity-item.is-today .dashboard-sidepanel-activity-label {
    color: #e9ffc0;
}

body.route-dashboard.role-manager .dashboard-sidepanel-conversion-list {
    display: grid;
    gap: 0.46rem;
}

body.route-dashboard.role-manager .dashboard-sidepanel-conversion-item {
    display: grid;
    gap: 0.18rem;
}

body.route-dashboard.role-manager .dashboard-sidepanel-conversion-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    color: rgba(255, 239, 210, 0.83);
    font-size: 0.8rem;
    line-height: 1.2;
}

body.route-dashboard.role-manager .dashboard-sidepanel-conversion-head strong {
    color: #ffffff;
    font-size: 0.94rem;
    font-weight: 800;
    letter-spacing: -0.01em;
}

body.route-dashboard.role-manager .dashboard-sidepanel-conversion-track {
    width: 100%;
    height: 3px;
    border-radius: 999px;
    background: rgba(255, 244, 225, 0.24);
    overflow: hidden;
}

body.route-dashboard.role-manager .dashboard-sidepanel-conversion-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #cbff2f 0%, #a9eb45 100%);
}

.manager-dashboard {
    display: grid;
    gap: 0.65rem;
}

.manager-dashboard-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
}

.manager-dashboard-head h1 {
    margin: 0;
    font-size: clamp(1.15rem, 1.9vw, 1.55rem);
    letter-spacing: -0.01em;
    color: #1f2430;
}

.manager-dashboard-head-meta {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.dashboard-date-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    border-radius: 999px;
    border: 1px solid #d8dde7;
    background: #f7f8fb;
    color: #7d8799;
    font-size: 0.92rem;
    font-weight: 600;
    padding: 0.38rem 0.78rem;
    white-space: nowrap;
}

.dashboard-date-icon {
    width: 16px;
    height: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.dashboard-date-icon svg {
    width: 16px;
    height: 16px;
}

.dashboard-focus-day {
    display: inline-flex;
    align-items: center;
    gap: 0.46rem;
    border-radius: 14px;
    border: 1px solid #d9e0ea;
    border-left-width: 4px;
    border-left-color: #97a4bc;
    background: #f8fafc;
    padding: 0.38rem 0.62rem 0.38rem 0.56rem;
    max-width: min(800px, 72vw);
    min-width: 0;
}

.dashboard-focus-icon {
    width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #546077;
    flex: 0 0 auto;
}

.dashboard-focus-icon svg {
    width: 18px;
    height: 18px;
}

.dashboard-focus-title {
    margin: 0;
    color: #5e6a82;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.dashboard-focus-text {
    margin: 0;
    color: #242d3b;
    font-size: 0.84rem;
    line-height: 1.25;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.dashboard-focus-day.is-good {
    background: #edf9f2;
    border-color: #cfead8;
    border-left-color: #22a05d;
}

.dashboard-focus-day.is-good .dashboard-focus-icon {
    color: #1f9a56;
}

.dashboard-focus-day.is-good .dashboard-focus-title {
    color: #2d8b5a;
}

.dashboard-focus-day.is-risk {
    background: #fff8ec;
    border-color: #f4e3c4;
    border-left-color: #d6a233;
}

.dashboard-focus-day.is-risk .dashboard-focus-icon {
    color: #bd851a;
}

.dashboard-focus-day.is-risk .dashboard-focus-title {
    color: #a87412;
}

.dashboard-focus-day.is-danger {
    background: #feefef;
    border-color: #f4d0d0;
    border-left-color: #d15454;
}

.dashboard-focus-day.is-danger .dashboard-focus-icon {
    color: #c44c4c;
}

.dashboard-focus-day.is-danger .dashboard-focus-title {
    color: #b73f3f;
}

body.route-dashboard.role-manager .dashboard-hero-focus-row {
    margin: 0.24rem 0 0;
    display: flex;
    align-items: center;
}

body.route-dashboard.role-manager .dashboard-hero-focus-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.36rem;
    border-radius: 999px;
    padding: 0.6rem 0.82rem;
    font-size: 0.82rem;
    line-height: 1.2;
    font-weight: 500;
    white-space: nowrap;
}

body.route-dashboard.role-manager .dashboard-hero-focus-chip.is-danger {
    background: #ffffff;
    color: #ef3737;
}

body.route-dashboard.role-manager .dashboard-hero-focus-prefix {
    font-weight: 800;
}

body.route-dashboard.role-manager .dashboard-hero-focus-text {
    font-weight: 500;
}

body.route-dashboard.role-manager .dashboard-hero-focus-chip.is-warn {
    background: #fff5e4;
    color: #bf8718;
}

body.route-dashboard.role-manager .dashboard-hero-focus-chip.is-good {
    background: #eaf8f1;
    color: #1f9a56;
}

body.route-dashboard.role-manager .dashboard-hero-focus-icon {
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

body.route-dashboard.role-manager .dashboard-hero-focus-icon svg {
    width: 14px;
    height: 14px;
}

body.route-dashboard.role-manager .dashboard-hero-strip {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.72rem;
    overflow: visible;
}

body.route-dashboard.role-manager .dashboard-hero-cell {
    min-width: 0;
    padding: 1.15rem 1.12rem 1.02rem;
    display: grid;
    align-content: start;
    gap: 0;
    min-height: 172px;
    border: 1px solid #dde3ea;
    border-radius: 16px;
    background: #ffffff;
}

body.route-dashboard.role-manager .dashboard-hero-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.55rem;
}

body.route-dashboard.role-manager .dashboard-hero-title {
    margin: 0;
    color: #8a909d;
    font-size: 0.84rem;
    line-height: 1.2;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    font-weight: 700;
}

body.route-dashboard.role-manager .dashboard-hero-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    min-height: 24px;
    border-radius: 999px;
    padding: 0.16rem 0.6rem;
    font-size: 0.78rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

body.route-dashboard.role-manager .dashboard-hero-pill.is-trend::before {
    content: "\2197";
    font-size: 0.72rem;
    line-height: 1;
    margin-right: 0.04rem;
}

body.route-dashboard.role-manager .dashboard-hero-pill.is-danger {
    background: #ffe9e9;
    color: #ef3737;
}

body.route-dashboard.role-manager .dashboard-hero-pill.is-warn {
    background: #f5e7c5;
    color: #c18a1e;
}

body.route-dashboard.role-manager .dashboard-hero-pill.is-good {
    background: #d9f0df;
    color: #198a52;
}

body.route-dashboard.role-manager .dashboard-hero-value {
    margin: 0.62rem 0 0;
    font-size: clamp(2.55rem, 3vw, 2.95rem);
    line-height: 0.98;
    letter-spacing: -0.03em;
    color: #17233a;
    font-weight: 800;
}

body.route-dashboard.role-manager .dashboard-hero-value-money {
    letter-spacing: -0.035em;
}

body.route-dashboard.role-manager .dashboard-hero-meta {
    margin: 0.2rem 0 0;
    color: #7f8898;
    font-size: 0.92rem;
    line-height: 1.3;
}

body.route-dashboard.role-manager .dashboard-hero-progress {
    margin-top: 0.74rem;
    width: 100%;
    height: 4px;
    border-radius: 999px;
    background: #eceff4;
    overflow: hidden;
}

body.route-dashboard.role-manager .dashboard-hero-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #d9a43f 0%, #cf9530 100%);
}

body.route-dashboard.role-manager .dashboard-hero-progress.is-calls span {
    background: linear-gradient(90deg, #2f8cff 0%, #69b3ff 100%);
}

body.route-dashboard.role-manager .dashboard-hero-note {
    margin: 0.42rem 0 0;
    color: #99a1ae;
    font-size: 0.86rem;
    line-height: 1.25;
}

body.route-dashboard.role-manager .dashboard-hero-alert {
    margin: 0.66rem 0 0;
    display: inline-flex;
    align-items: center;
    gap: 0.34rem;
    font-size: 0.92rem;
    line-height: 1.24;
    font-weight: 700;
}

body.route-dashboard.role-manager .dashboard-hero-alert svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

body.route-dashboard.role-manager .dashboard-hero-alert.is-danger {
    color: #ef3737;
}

body.route-dashboard.role-manager .dashboard-hero-alert.is-warn {
    color: #c18a1e;
}

body.route-dashboard.role-manager .dashboard-hero-alert.is-good {
    color: #198a52;
}

body.route-dashboard.role-manager .dashboard-hero-meeting-line {
    margin: 0.6rem 0 0;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.92rem;
    line-height: 1.24;
    min-width: 0;
    white-space: nowrap;
}

body.route-dashboard.role-manager .dashboard-hero-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #e9a107;
    box-shadow: 0 0 0 3px rgba(233, 161, 7, 0.15);
    flex: 0 0 auto;
}

body.route-dashboard.role-manager .dashboard-hero-meeting-status {
    color: #d58d11;
    font-weight: 700;
}

body.route-dashboard.role-manager .dashboard-hero-meeting-when {
    color: #cf8608;
    font-size: 0.9rem;
    font-weight: 600;
}

body.route-dashboard.role-manager .dashboard-hero-meeting-company {
    color: #1e2430;
    font-weight: 700;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.route-dashboard.role-manager .dashboard-hero-task-list {
    margin: 0.62rem 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.42rem;
}

body.route-dashboard.role-manager .dashboard-hero-task-line {
    display: grid;
    grid-template-columns: 8px minmax(0, 1fr);
    align-items: start;
    column-gap: 0.44rem;
    row-gap: 0.12rem;
}

body.route-dashboard.role-manager .dashboard-hero-task-line .dashboard-hero-dot {
    margin-top: 0.34rem;
    box-shadow: 0 0 0 2px rgba(233, 161, 7, 0.12);
}

body.route-dashboard.role-manager .dashboard-hero-task-title-text {
    color: #1f2736;
    font-size: 0.7rem;
    line-height: 1.24;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.route-dashboard.role-manager .dashboard-hero-task-due {
    grid-column: 2;
    color: #8a93a3;
    font-size: 0.6rem;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.route-dashboard.role-manager .dashboard-hero-empty {
    margin: 0.72rem 0 0;
    color: #9aa3b1;
    font-size: 0.95rem;
    line-height: 1.3;
    font-weight: 600;
}

body.route-dashboard.role-manager .dashboard-hero-bonus {
    margin: 0.56rem 0 0;
    color: #1e9a56;
    font-size: 0.94rem;
    line-height: 1.3;
    font-weight: 700;
}

.manager-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.75rem;
}

.dashboard-tile {
    display: grid;
    gap: 0.72rem;
    align-content: start;
    min-height: 188px;
}

.dashboard-tile-head {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
}

.dashboard-tile-icon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.dashboard-tile-icon svg {
    width: 23px;
    height: 23px;
}

.dashboard-tile-icon-calls {
    background: #dceefa;
    color: #1477ea;
}

.dashboard-tile-icon-sales {
    background: #dff4e6;
    color: #239a56;
}

.dashboard-tile-icon-meetings {
    background: #eadcfb;
    color: #9b53dd;
}

.dashboard-tile-icon-tasks {
    background: #faecd7;
    color: #f19a00;
}

.dashboard-tile-icon-goal-done {
    background: #dff4e6;
    color: #239a56;
}

.dashboard-tile-icon-goal-pending {
    background: #f9e2e2;
    color: #cc4c4c;
}

.dashboard-kpi-block {
    min-width: 0;
}

.dashboard-kpi-label {
    margin: 0;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #8f95a3;
    font-weight: 700;
}

.dashboard-kpi-value {
    margin: 0.15rem 0 0;
    font-size: 2.1rem;
    line-height: 1;
    letter-spacing: -0.02em;
    color: #1f2430;
    font-weight: 800;
}

.dashboard-progress-line {
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: #e7e9ee;
    overflow: hidden;
}

.dashboard-progress-line > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: #1477ea;
}

.dashboard-progress-line-sales > span {
    background: #239a56;
}

.dashboard-kpi-note {
    margin: 0;
    color: #7f8694;
    font-size: 0.86rem;
}

.dashboard-call-result {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    border-radius: 10px;
    border: 1px solid #e2e7f0;
    padding: 0.36rem 0.52rem;
    font-size: 0.82rem;
    line-height: 1.3;
    font-weight: 700;
}

.dashboard-call-result-icon {
    width: 14px;
    height: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.dashboard-call-result-icon svg {
    width: 14px;
    height: 14px;
}

.dashboard-call-result.is-red {
    border-color: #efc2c2;
    background: #fceeee;
    color: #c44c4c;
}

.dashboard-call-result.is-yellow {
    border-color: #f0dfb7;
    background: #fff8e9;
    color: #b8841f;
}

.dashboard-call-result.is-green {
    border-color: #c7e8d2;
    background: #ecf8f1;
    color: #1f9a56;
}

.dashboard-plan-head {
    display: grid;
    gap: 0.2rem;
}

.dashboard-plan-date {
    color: #8e97a8;
    font-size: 0.82rem;
    font-weight: 600;
}

.dashboard-carryover {
    margin: 0.55rem 0 0;
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    font-size: 0.88rem;
    font-weight: 700;
}

.dashboard-carryover svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

.dashboard-carryover.is-pending {
    color: #c44c4c;
}

.dashboard-carryover.is-done {
    color: #1f9a56;
}

.dashboard-carryover-row {
    margin-top: 0.4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
    flex-wrap: wrap;
}

.dashboard-carryover-row .dashboard-carryover {
    margin: 0;
}

.dashboard-carryover-progress {
    margin: 0;
    color: #7f8694;
    font-size: 0.86rem;
    font-weight: 600;
    white-space: nowrap;
}

.dashboard-engagement-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.86rem;
    align-items: stretch;
}

.dashboard-engagement-grid .card {
    margin: 0;
    padding: 0;
    border: 1px solid #d8dee7;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: none;
    overflow: hidden;
    height: 100%;
    min-height: 0;
}

.dashboard-engagement-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
    padding: 1rem 1rem 0.9rem;
    border-bottom: 1px solid #edf1f5;
}

.dashboard-engagement-head h2 {
    margin: 0;
    color: #11192a;
    font-size: 1.98rem;
    line-height: 1;
    letter-spacing: -0.02em;
    font-weight: 800;
}

.dashboard-attention-card {
    display: grid;
    align-content: start;
}

.dashboard-attention-head-actions {
    display: flex;
    align-items: center;
    gap: 0.46rem;
}

.dashboard-attention-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 29px;
    border-radius: 999px;
    padding: 0.2rem 0.62rem;
    font-size: 0.77rem;
    line-height: 1;
    font-weight: 700;
    border: 1px solid transparent;
    white-space: nowrap;
}

.dashboard-attention-chip.is-overdue {
    background: #ffe8ea;
    border-color: #ffc8cf;
    color: #e34252;
}

.dashboard-attention-chip.is-today {
    background: #e7f0ff;
    border-color: #cadbff;
    color: #1f68e8;
}

.dashboard-attention-chip.is-tomorrow {
    background: #eef1f7;
    border-color: #dfe5ef;
    color: #768399;
}

.dashboard-engagement-mini-btn {
    width: 28px;
    height: 28px;
    border: 1px solid #d9dfe8;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #97a2b4;
    text-decoration: none;
    background: #f5f7fa;
    flex: 0 0 auto;
}

.dashboard-engagement-mini-btn svg {
    width: 13px;
    height: 13px;
}

.dashboard-attention-alert {
    margin: 0.84rem 1rem 0;
    border-radius: 14px;
    background: #ec7580;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.66rem 0.72rem;
}

.dashboard-attention-alert-text {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    color: #ffffff;
    font-size: 0.95rem;
    line-height: 1.2;
    font-weight: 700;
}

.dashboard-attention-alert-text svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.dashboard-attention-alert-btn {
    min-height: 34px;
    border-radius: 11px;
    background: #ffffff;
    color: #e04354;
    border: 0;
    padding: 0.38rem 0.72rem;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    white-space: nowrap;
}

.dashboard-attention-alert-btn svg {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
}

.dashboard-attention-list {
    margin: 0;
    padding: 0.56rem 1rem 0;
    list-style: none;
    display: grid;
}

.dashboard-attention-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.56rem;
    padding: 0.56rem 0;
    border-bottom: 1px solid #eef2f6;
}

.dashboard-attention-item:last-child {
    border-bottom: 0;
}

.dashboard-attention-avatar {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #40506a;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    flex: 0 0 auto;
    background: #e2ebfb;
}

.dashboard-attention-item:nth-child(5n + 1) .dashboard-attention-avatar {
    background: #dde9ff;
    color: #3766cb;
}

.dashboard-attention-item:nth-child(5n + 2) .dashboard-attention-avatar {
    background: #ebdefd;
    color: #7d4ed5;
}

.dashboard-attention-item:nth-child(5n + 3) .dashboard-attention-avatar {
    background: #d9f2e6;
    color: #278461;
}

.dashboard-attention-item:nth-child(5n + 4) .dashboard-attention-avatar {
    background: #fbe0e4;
    color: #bf3e5d;
}

.dashboard-attention-item:nth-child(5n + 5) .dashboard-attention-avatar {
    background: #fbecc8;
    color: #c5721f;
}

.dashboard-attention-main {
    min-width: 0;
    display: grid;
    gap: 0.16rem;
}

.dashboard-attention-main strong {
    color: #1a2435;
    font-size: 1rem;
    line-height: 1.2;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dashboard-attention-main span {
    color: #8f99ab;
    font-size: 0.84rem;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dashboard-attention-delta {
    min-height: 28px;
    border-radius: 999px;
    padding: 0.18rem 0.56rem;
    font-size: 0.77rem;
    line-height: 1;
    font-weight: 700;
    border: 1px solid transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.dashboard-attention-delta.is-overdue {
    background: #ffeaec;
    border-color: #ffcfd5;
    color: #ea4a58;
}

.dashboard-attention-delta.is-today {
    background: #fff2d8;
    border-color: #f8dcaa;
    color: #ce8a17;
}

.dashboard-attention-delta.is-tomorrow {
    background: #edf2f8;
    border-color: #dee5ef;
    color: #74839a;
}

.dashboard-attention-action {
    min-height: 30px;
    border-radius: 999px;
    padding: 0.24rem 0.74rem;
    border: 1px solid #d5dce7;
    background: #f5f7fa;
    color: #6d7a90;
    font-size: 0.76rem;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.dashboard-attention-footer-note {
    margin: 0;
    border-top: 1px solid #edf1f5;
    padding: 0.76rem 1rem 0.82rem;
    color: #9aa5b8;
    font-size: 0.92rem;
    line-height: 1.2;
    display: flex;
    align-items: baseline;
    gap: 0.45rem;
}

.dashboard-attention-footer-note strong {
    color: #1b2536;
    font-size: 1.1rem;
    font-weight: 800;
    line-height: 1;
}

.dashboard-meetings-days-card {
    display: grid;
    align-content: start;
}

.dashboard-engagement-open-btn {
    min-height: 34px;
    border-radius: 999px;
    padding: 0.36rem 0.92rem;
    border: 1px solid #ced6e1;
    color: #616f85;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1;
    background: #f2f5f8;
}

.dashboard-engagement-open-btn:hover {
    border-color: #bac4d3;
    background: #eaf0f5;
}

.dashboard-meetings-days-grid {
    display: grid;
}

.dashboard-meetings-day-card {
    border: 0;
    border-bottom: 1px solid #edf1f5;
    border-radius: 0;
    background: transparent;
    padding: 0.86rem 1rem;
    display: grid;
    align-content: start;
    min-height: 167px;
}

.dashboard-meetings-day-card:last-child {
    border-bottom: 0;
}

.dashboard-meetings-day-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.55rem;
}

.dashboard-meetings-day-head h3 {
    margin: 0;
    color: #69768a;
    font-size: 0.94rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.dashboard-meetings-day-count {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.76rem;
    line-height: 1;
    font-weight: 800;
    color: #6c7a8f;
    background: #edf1f5;
}

.dashboard-meetings-day-list {
    margin: 0.8rem 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.58rem;
}

.dashboard-meetings-day-item {
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr);
    align-items: center;
    gap: 0.62rem;
    border: 1px solid #e6ebf2;
    border-radius: 11px;
    padding: 0.5rem 0.58rem;
    background: #ffffff;
}

.dashboard-meetings-time {
    display: grid;
    gap: 0.08rem;
}

.dashboard-meetings-time strong {
    font-size: 1rem;
    line-height: 1;
    color: #1f2430;
    letter-spacing: -0.01em;
}

.dashboard-meetings-time span {
    color: #8d95a5;
    font-size: 0.76rem;
    line-height: 1.2;
}

.dashboard-meetings-main {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.54rem;
}

.dashboard-meetings-main strong {
    flex: 1;
    min-width: 0;
    color: #212833;
    font-size: 0.92rem;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dashboard-meetings-date-badge {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    border: 1px solid transparent;
    font-size: 0.66rem;
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;
}

.dashboard-meetings-date-badge.is-overdue {
    color: #d64253;
    background: #ffecef;
    border-color: #ffd5db;
}

.dashboard-meetings-date-badge.is-today {
    color: #cc7d16;
    background: #fff2dd;
    border-color: #f8ddb0;
}

.dashboard-meetings-date-badge.is-tomorrow {
    color: #7e8ca1;
    background: #f0f3f7;
    border-color: #dfe5ec;
}

.dashboard-meetings-phone {
    flex: 0 0 auto;
    color: #7f8ca1;
    font-size: 0.78rem;
    line-height: 1.2;
    font-weight: 600;
    white-space: nowrap;
}

.dashboard-meetings-day-card .dashboard-empty {
    margin: 2.35rem 0 0;
    color: #c5ccd8;
    font-size: 0.95rem;
    line-height: 1.25;
    text-align: center;
    display: grid;
    justify-items: center;
    gap: 0.48rem;
}

.dashboard-meetings-day-card .dashboard-empty::before {
    content: "";
    width: 16px;
    height: 16px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Crect x='4' y='6' width='16' height='14' rx='2' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M8 4.5v3M16 4.5v3M4 10h16' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Crect x='4' y='6' width='16' height='14' rx='2' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M8 4.5v3M16 4.5v3M4 10h16' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

@media (min-width: 861px) {
    .dashboard-meetings-days-card {
        height: 100%;
        grid-template-rows: auto minmax(0, 1fr);
        min-height: 0;
    }

    .dashboard-meetings-days-grid {
        min-height: 0;
        grid-template-rows: repeat(2, minmax(0, 1fr));
    }

    .dashboard-meetings-day-card {
        min-height: 0;
        grid-template-rows: auto minmax(0, 1fr);
    }

    .dashboard-meetings-day-list {
        min-height: 0;
        overflow-y: auto;
        align-content: start;
        padding-right: 0.2rem;
        scrollbar-width: thin;
        scrollbar-color: #c9d2de transparent;
    }

    .dashboard-meetings-day-list::-webkit-scrollbar {
        width: 6px;
    }

    .dashboard-meetings-day-list::-webkit-scrollbar-thumb {
        background: #c9d2de;
        border-radius: 999px;
    }

    .dashboard-meetings-day-list::-webkit-scrollbar-track {
        background: transparent;
    }
}

.dashboard-activity-ten-card {
    margin-top: 0.86rem;
    border: 1px solid #d8dee7;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: none;
    overflow: hidden;
}

.dashboard-activity-ten-head {
    padding: 1.06rem 1.08rem 0.72rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
}

.dashboard-activity-ten-title h2 {
    margin: 0;
    color: #121b2c;
    font-size: 2.02rem;
    line-height: 1;
    letter-spacing: -0.02em;
    font-weight: 800;
}

.dashboard-activity-ten-title p {
    margin: 0.28rem 0 0;
    color: #8692a6;
    font-size: 0.9rem;
    line-height: 1.25;
}

.dashboard-activity-ten-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.dashboard-activity-ten-action {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    border: 1px solid #dbe1ea;
    background: #f4f6f9;
    color: #97a2b4;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: default;
}

.dashboard-activity-ten-action svg {
    width: 14px;
    height: 14px;
}

.dashboard-activity-ten-chart-wrap {
    position: relative;
    padding: 1.9rem 1.08rem 0.5rem;
    min-height: 204px;
}

.dashboard-activity-ten-plan-line {
    position: absolute;
    left: 1.08rem;
    right: 1.08rem;
    border-top: 1px dashed #c8d0dc;
    pointer-events: none;
}

.dashboard-activity-ten-plan-line span {
    position: absolute;
    left: 0;
    top: -1.05rem;
    color: #a1abbc;
    font-size: 0.78rem;
    line-height: 1;
    font-weight: 700;
    text-transform: lowercase;
}

.dashboard-activity-ten-bars {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    gap: 0.58rem;
    align-items: end;
    min-height: 154px;
}

.dashboard-activity-ten-item {
    min-width: 0;
    display: grid;
    gap: 0.4rem;
    justify-items: center;
    align-content: end;
}

.dashboard-activity-ten-bar {
    width: min(34px, 100%);
    min-width: 16px;
    border-radius: 5px 5px 0 0;
    background: #d2d7e0;
    display: block;
}

.dashboard-activity-ten-bar.is-neutral {
    background: #d2d7e0;
}

.dashboard-activity-ten-bar.is-peak {
    background: #cbe92f;
}

.dashboard-activity-ten-bar.is-today {
    background: #3f72e8;
}

.dashboard-activity-ten-bar.is-empty {
    min-height: 4px;
    opacity: 0.75;
}

.dashboard-activity-ten-label {
    color: #8f9aad;
    font-size: 0.75rem;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

.dashboard-activity-ten-foot {
    padding: 0.7rem 1.08rem 1rem;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.9rem;
}

.dashboard-activity-ten-range {
    color: #96a2b4;
    font-size: 0.9rem;
    line-height: 1.2;
    font-weight: 600;
}

.dashboard-activity-ten-total {
    margin: 0;
    text-align: right;
    display: grid;
    gap: 0.14rem;
}

.dashboard-activity-ten-total span {
    color: #8f9bad;
    font-size: 0.86rem;
    line-height: 1.2;
    font-weight: 600;
}

.dashboard-activity-ten-total strong {
    color: #10192b;
    font-size: 2rem;
    line-height: 1;
    letter-spacing: -0.02em;
    font-weight: 800;
}

.dashboard-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.38rem;
}

.dashboard-list li {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr);
    align-items: start;
    gap: 0.45rem;
    color: #5f6675;
    font-size: 0.95rem;
    line-height: 1.35;
}

.dashboard-list li strong {
    color: #222935;
    font-weight: 700;
}

.dashboard-list li small {
    margin-left: 0.4rem;
    color: #9aa3b5;
    font-size: 0.8rem;
}

.dashboard-dot {
    width: 7px;
    height: 7px;
    border-radius: 999px;
    margin-top: 0.45rem;
}

.dashboard-dot-meetings {
    background: #9b53dd;
}

.dashboard-dot-tasks {
    background: #f19a00;
}

.dashboard-empty {
    margin: 0;
    color: #8992a2;
    font-size: 0.92rem;
    line-height: 1.4;
}

.dashboard-goal-metrics {
    margin-top: 0.2rem;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.42rem;
}

.dashboard-goal-metrics strong {
    font-size: 2.05rem;
    line-height: 1;
    letter-spacing: -0.02em;
    color: #1f2430;
}

.dashboard-goal-metrics span {
    font-size: 0.98rem;
    color: #7f8694;
    font-weight: 600;
}

.dashboard-goal-state {
    margin: 0;
    font-size: 0.88rem;
    font-weight: 700;
}

.dashboard-goal-state.is-done {
    color: #1f9a56;
}

.dashboard-goal-state.is-pending {
    color: #c44c4c;
}

@media (max-width: 1380px) {
    body.route-clients .admin-kpi-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.route-dashboard.role-manager .dashboard-manager-layout {
        grid-template-columns: 194px minmax(0, 1fr);
    }

    body.route-clients .admin-mini-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.route-clients .settings-grid {
        grid-template-columns: 1fr;
    }

    body.route-dashboard.role-manager .dashboard-hero-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-engagement-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-activity-ten-title h2 {
        font-size: 1.72rem;
    }

    .dashboard-activity-ten-bars {
        gap: 0.5rem;
    }

    .manager-dashboard-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-money-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-money-item:nth-child(2n + 1) {
        border-left: 0;
    }

    .dashboard-money-item:nth-child(n + 3) {
        border-top: 1px solid #e7eaf0;
    }
}

@media (max-width: 860px) {
    body.route-clients .admin-kpi-cards {
        grid-template-columns: 1fr;
    }

    body.route-dashboard.role-manager .dashboard-manager-layout {
        grid-template-columns: 1fr;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel {
        position: static;
        top: auto;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-calls li strong {
        font-size: 1.72rem;
    }

    .dashboard-engagement-head {
        padding: 0.86rem 0.86rem 0.8rem;
    }

    .dashboard-engagement-head h2 {
        font-size: 1.5rem;
    }

    .dashboard-attention-head-actions {
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .dashboard-attention-alert {
        margin-left: 0.86rem;
        margin-right: 0.86rem;
        flex-wrap: wrap;
    }

    .dashboard-attention-list {
        padding-left: 0.86rem;
        padding-right: 0.86rem;
    }

    .dashboard-attention-item {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .dashboard-attention-delta,
    .dashboard-attention-action {
        margin-top: 0.2rem;
    }

    .dashboard-attention-footer-note {
        padding-left: 0.86rem;
        padding-right: 0.86rem;
    }

    .dashboard-meetings-day-card {
        padding-left: 0.86rem;
        padding-right: 0.86rem;
        min-height: 150px;
    }

    .dashboard-activity-ten-head {
        padding: 0.9rem 0.86rem 0.62rem;
    }

    .dashboard-activity-ten-title h2 {
        font-size: 1.38rem;
    }

    .dashboard-activity-ten-chart-wrap {
        padding: 1.6rem 0.86rem 0.45rem;
        min-height: 192px;
    }

    .dashboard-activity-ten-plan-line {
        left: 0.86rem;
        right: 0.86rem;
    }

    .dashboard-activity-ten-bars {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        row-gap: 0.7rem;
    }

    .dashboard-activity-ten-foot {
        padding: 0.62rem 0.86rem 0.92rem;
    }

    .dashboard-activity-ten-total strong {
        font-size: 1.6rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-activity {
        padding-top: 0.2rem;
    }

    body.route-clients .admin-mini-kpi-grid {
        grid-template-columns: 1fr;
    }

    body.route-clients .admin-compact-list li {
        flex-direction: column;
        align-items: flex-start;
    }

    body.route-clients .admin-compact-list span {
        text-align: left;
    }

    body.route-clients .settings-plan-form input,
    body.route-clients .settings-password-form input,
    body.route-clients .settings-access-form select {
        min-width: 0;
        width: 100%;
    }

    body.route-clients .settings-managers-table td {
        min-width: 180px;
    }

    .manager-dashboard-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .manager-dashboard-head-meta {
        width: 100%;
        justify-content: flex-start;
    }

    .dashboard-focus-day {
        max-width: 100%;
    }

    body.route-dashboard.role-manager .dashboard-hero-strip {
        grid-template-columns: 1fr;
    }

    body.route-dashboard.role-manager .dashboard-hero-cell {
        min-height: 0;
        padding: 1rem 1rem 0.92rem;
    }

    body.route-dashboard.role-manager .dashboard-hero-meeting-line {
        white-space: normal;
        flex-wrap: wrap;
    }

    body.route-dashboard.role-manager .dashboard-hero-focus-chip {
        white-space: normal;
    }

    .manager-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-tile {
        min-height: 0;
    }

    .dashboard-money-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-money-head h2 {
        font-size: 1.58rem;
    }

    .dashboard-money-item {
        min-height: 0;
        border-left: 0;
        border-top: 1px solid #e7eaf0;
        padding: 0.8rem 0.9rem;
    }

    .dashboard-money-item:first-child {
        border-top: 0;
    }

    .dashboard-money-progress {
        padding: 0.62rem 0.9rem 0.66rem;
    }

    .dashboard-money-progress-row {
        flex-wrap: wrap;
    }

    .dashboard-attention-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .dashboard-meetings-days-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-meetings-day-item {
        grid-template-columns: 68px minmax(0, 1fr);
    }

    .dashboard-carryover-progress {
        white-space: normal;
    }
}

/* Global flat white style across all CRM pages */
body.route-clients {
    background: #ededed;
}

body.page-clients.route-clients .clients-screen:not(.tasks-screen),
body.route-clients .clients-screen {
    gap: 0;
}

body.route-clients .content-wrap {
    background: #f0f0f0;
    border: 1px solid #dddddd;
    border-left: 0;
}

body.route-clients .card {
    background: #ffffff;
    border: 1px solid #e5e5e5;
    box-shadow: none;
}

body.route-clients .page-header {
    display: none !important;
}

body.route-clients .clients-topbar {
    justify-content: flex-end;
}

body.route-clients .clients-topbar > div:first-child {
    display: none;
}

body.route-dashboard.role-manager .manager-dashboard-head {
    display: none;
}

body.route-clients .sidebar,
body.route-clients .calls-table tr {
    box-shadow: none;
}

body.route-clients .table tbody tr:hover td,
body.route-clients .clients-table tbody tr:hover td {
    background: #fafafa;
}

body.route-clients .modal,
body.route-clients .status-quick-modal,
body.route-clients .client-drawer,
body.route-clients .client-create-modal,
body.route-clients .task-create-modal,
body.route-clients .task-edit-modal,
body.route-clients .task-view-modal {
    background: rgba(18, 18, 18, 0.16);
}

body.route-clients .modal-dialog,
body.route-clients .modal-dialog.card,
body.route-clients .status-quick-modal .modal-dialog.card,
body.route-clients .client-drawer .modal-dialog.card,
body.route-clients .client-create-modal .modal-dialog,
body.route-clients .task-create-modal .modal-dialog,
body.route-clients .task-edit-modal .modal-dialog,
body.route-clients .task-view-modal .modal-dialog {
    background: #ffffff;
    border: 1px solid #e5e5e5;
    box-shadow: none;
}

body.route-clients .task-view-description,
body.route-clients .call-summary {
    background: #ffffff;
    border-color: #e5e5e5;
}

body.route-clients .flash {
    background: #ffffff;
    box-shadow: none;
}

/* Client edit modal redesign */
body.route-clients .client-drawer {
    padding: 1.5rem;
    align-items: center;
    justify-content: center;
    background: rgba(17, 18, 24, 0.18);
}

body.route-clients .client-drawer .modal-dialog.modal-dialog-xl.card {
    width: min(1080px, calc(100vw - 32px));
    height: auto;
    max-height: calc(100dvh - 32px);
    border-radius: 26px;
    border: 1px solid #e5e7ee;
    background: #f7f7f8;
    overflow: hidden;
}

body.route-clients .client-edit-shell {
    display: flex;
    flex-direction: column;
    min-height: min(730px, calc(100dvh - 32px));
}

body.route-clients .client-edit-topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.2rem 0.85rem;
    border-bottom: 1px solid #e5e7ee;
    background: #f7f7f8;
}

body.route-clients .client-edit-topbar-main {
    display: flex;
    align-items: center;
    gap: 0.95rem;
    min-width: 0;
}

body.route-clients .client-edit-avatar {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #dfe9ff;
    color: #2f70e8;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

body.route-clients .client-edit-topbar h2 {
    margin: 0;
    color: #2b2f3a;
    font-size: 1.1rem;
    font-weight: 700;
    white-space: nowrap;
}

body.route-clients .client-edit-topbar-rating {
    margin: 0 0 0 0.35rem;
    color: #1e72ff;
    font-size: 0.96rem;
    font-weight: 600;
    white-space: nowrap;
}

body.route-clients .client-edit-topbar-rating span {
    font-weight: 700;
}

body.route-clients .client-edit-topbar-status {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    color: #2d313a;
    font-size: 0.98rem;
    font-weight: 600;
}

body.route-clients .client-edit-topbar-status select {
    min-width: 132px;
    height: 40px;
    border-radius: 14px;
    border: 1px solid #cfd3dc;
    background: #f7f7f8;
    color: #434854;
    font-size: 0.96rem;
    font-weight: 500;
    padding: 0 2.2rem 0 0.95rem;
    box-shadow: none;
}

body.route-clients .client-edit-close {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 12px;
    background: #ececef;
    color: #8e929d;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

body.route-clients .client-edit-close svg {
    width: 18px;
    height: 18px;
}

body.route-clients .client-edit-close:hover {
    background: #e5e6ea;
    color: #5c6170;
}

body.route-clients .client-edit-drawer-layout {
    display: grid;
    grid-template-columns: 392px minmax(0, 1fr);
    gap: 1.3rem;
    padding: 1rem 1.2rem 0;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

body.route-clients .client-history-panel {
    border-right: 0;
    padding: 0;
    min-width: 0;
    overflow: auto;
}

body.route-clients .client-history-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin-bottom: 0.8rem;
}

body.route-clients .client-history-panel-title {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
}

body.route-clients .client-history-panel-title svg,
body.route-clients .client-history-panel-icon svg {
    width: 19px;
    height: 19px;
}

body.route-clients .client-history-panel-title svg {
    color: #c2a8ff;
}

body.route-clients .client-history-panel-icon {
    color: #8b8f9a;
}

body.route-clients .client-history-panel h3 {
    margin: 0;
    color: #2d313a;
    font-size: 1rem;
    font-weight: 700;
}

body.route-clients .client-history-list {
    display: grid;
    gap: 0.75rem;
    padding-right: 0.2rem;
}

body.route-clients .client-history-item {
    border: 0;
    border-radius: 20px;
    padding: 0.82rem 0.95rem 0.78rem;
    background: #efeff7;
}

body.route-clients .client-history-item.is-empty {
    background: #f0f1f4;
}

body.route-clients .client-history-item:has(.status-callback),
body.route-clients .client-history-item:has(.status-work) {
    background: #ecebf7;
}

body.route-clients .client-history-item:has(.status-meeting) {
    background: #f4f0e3;
}

body.route-clients .client-history-item:has(.status-missed) {
    background: #f8ede3;
}

body.route-clients .client-history-item:has(.status-success) {
    background: #e9f4e8;
}

body.route-clients .client-history-item:has(.status-drop) {
    background: #f7e9ea;
}

body.route-clients .client-history-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
    margin-bottom: 0.52rem;
}

body.route-clients .client-history-head-main {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
}

body.route-clients .client-history-item .status-chip {
    border: 0;
    border-radius: 10px;
    padding: 0.42rem 0.78rem;
    font-size: 12px;
    font-weight: 700;
}

body.route-clients .client-history-current {
    color: #30a722;
    font-size: 12px;
    font-weight: 600;
}

body.route-clients .client-history-head time {
    color: #848895;
    font-size: 0.94rem;
    font-weight: 500;
    white-space: nowrap;
}

body.route-clients .client-history-item p {
    margin: 0 0 0.58rem;
    color: #282c36;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.38;
}

body.route-clients .client-history-item small {
    color: #777c88;
    font-size: 12px;
    line-height: 1.45;
}

body.route-clients .client-edit-fields.client-edit-form {
    align-content: start;
    gap: 0.78rem 0.85rem;
    min-height: 0;
    overflow: auto;
    padding-right: 0.15rem;
}

body.route-clients .client-edit-fields.client-edit-form label {
    display: grid;
    gap: 0.38rem;
    color: #2d313a;
    font-size: 0.96rem;
    font-weight: 600;
}

body.route-clients .client-edit-label-row {
    display: inline-flex;
    align-items: baseline;
    gap: 0.22rem;
    flex-wrap: wrap;
}

body.route-clients .client-edit-fields.client-edit-form input,
body.route-clients .client-edit-fields.client-edit-form select,
body.route-clients .client-edit-fields.client-edit-form textarea {
    min-height: 38px;
    border-radius: 14px;
    border: 1px solid #cfd3dc;
    background: #f7f7f8;
    color: #3d414b;
    font-size: 0.98rem;
    font-weight: 500;
    box-shadow: none;
}

body.route-clients .client-edit-fields.client-edit-form input,
body.route-clients .client-edit-fields.client-edit-form select {
    padding: 0.66rem 0.9rem;
}

body.route-clients .client-edit-fields.client-edit-form textarea {
    min-height: 76px;
    padding: 0.76rem 0.9rem;
    resize: vertical;
}

body.route-clients .client-edit-map-row {
    display: flex;
    align-items: center;
    margin-top: -0.12rem;
}

body.route-clients .client-edit-map-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0.7rem 0.95rem;
    border-radius: 14px;
    background: #eef4ff;
    color: #2f70e8;
    font-size: 0.92rem;
    font-weight: 700;
    text-decoration: none;
    transition: background 0.18s ease, color 0.18s ease;
}

body.route-clients .client-edit-map-link:hover {
    background: #e2ecff;
    color: #205dd0;
}

body.route-clients .client-edit-map-link.is-disabled {
    pointer-events: none;
    background: #eef1f5;
    color: #96a0b0;
}

body.route-clients .client-edit-fields.client-edit-form input::placeholder,
body.route-clients .client-edit-fields.client-edit-form textarea::placeholder {
    color: #a9adb8;
    font-weight: 500;
}

body.route-clients .client-edit-fields.client-edit-form input:focus,
body.route-clients .client-edit-fields.client-edit-form select:focus,
body.route-clients .client-edit-fields.client-edit-form textarea:focus,
body.route-clients .client-edit-topbar-status select:focus {
    border-color: #7da8ff;
    box-shadow: 0 0 0 3px rgba(47, 112, 232, 0.12);
}

body.route-clients .client-edit-fields.client-edit-form .required-mark {
    color: #ff4b4b;
    font-weight: 700;
}

body.route-clients .client-edit-field-note {
    color: #4a4e58;
    font-weight: 500;
}

body.route-clients .client-edit-fields.client-edit-form label.field-has-error {
    color: #d6506a;
}

body.route-clients .client-edit-fields.client-edit-form input.is-invalid,
body.route-clients .client-edit-fields.client-edit-form select.is-invalid,
body.route-clients .client-edit-fields.client-edit-form textarea.is-invalid {
    border-color: #f18d9d;
    box-shadow: 0 0 0 3px rgba(225, 79, 108, 0.1);
}

body.route-clients .client-edit-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 0.82rem 1.2rem 0.92rem;
    border-top: 1px solid #e5e7ee;
    background: #f7f7f8;
}

body.route-clients .client-edit-footer .btn {
    min-width: 164px;
    height: 46px;
    border-radius: 16px;
    font-size: 0.98rem;
    font-weight: 700;
}

body.route-clients .client-edit-footer .btn-ghost {
    background: #ececef;
    border-color: #ececef;
    color: #2f333d;
}

body.route-clients .client-edit-footer .btn-primary {
    background: linear-gradient(180deg, #1780ff, #0d6ff2);
    border-color: #1780ff;
    color: #ffffff;
}

@media (max-width: 1040px) {
    body.route-clients .client-drawer .modal-dialog.modal-dialog-xl.card {
        width: min(980px, calc(100vw - 20px));
    }

    body.route-clients .client-edit-topbar {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    body.route-clients .client-edit-close {
        grid-column: 2;
        grid-row: 1;
        justify-self: end;
    }

    body.route-clients .client-edit-topbar-status {
        grid-column: 1 / -1;
        justify-self: start;
    }

    body.route-clients .client-edit-drawer-layout {
        grid-template-columns: 1fr;
    }

    body.route-clients .client-history-panel,
    body.route-clients .client-edit-fields.client-edit-form {
        overflow: visible;
    }
}

@media (max-width: 720px) {
    body.route-clients .client-drawer {
        padding: 0.5rem;
    }

    body.route-clients .client-drawer .modal-dialog.modal-dialog-xl.card {
        width: calc(100vw - 12px);
        max-height: calc(100dvh - 12px);
        border-radius: 22px;
    }

    body.route-clients .client-edit-shell {
        min-height: auto;
    }

    body.route-clients .client-edit-topbar {
        padding: 0.9rem;
        gap: 0.8rem;
    }

    body.route-clients .client-edit-topbar-main {
        flex-wrap: wrap;
    }

    body.route-clients .client-edit-topbar h2 {
        font-size: 1rem;
    }

    body.route-clients .client-edit-topbar-rating {
        margin-left: 0;
        width: 100%;
        font-size: 0.85rem;
    }

    body.route-clients .client-edit-drawer-layout {
        padding: 0.9rem;
        gap: 1rem;
    }

    body.route-clients .client-edit-fields.client-edit-form {
        grid-template-columns: 1fr;
    }

    body.route-clients .client-edit-footer {
        padding: 0.9rem;
        flex-direction: column-reverse;
    }

    body.route-clients .client-edit-footer .btn {
        width: 100%;
        min-width: 0;
    }
}

body.route-clients .clients-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.15rem 0.1rem 0.25rem;
}

body.route-clients .clients-pagination-info {
    color: #6b7280;
    font-size: 0.84rem;
    white-space: nowrap;
}

body.route-clients .pagination-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.35rem;
}

body.route-clients .pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    border-radius: 10px;
    padding: 0 0.6rem;
    border: 1px solid #d7dbe3;
    background: #ffffff;
    color: #3d4b63;
    font-size: 0.83rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

body.route-clients .pagination-link:hover {
    background: #f6f9ff;
    border-color: #b8c6e0;
    color: #1f66ff;
}

body.route-clients .pagination-link.is-active {
    background: #1f66ff;
    border-color: #1f66ff;
    color: #ffffff;
    pointer-events: none;
}

body.route-clients .pagination-dots {
    color: #9ca3af;
    font-weight: 600;
    font-size: 0.9rem;
    padding: 0 0.1rem;
}

body.route-clients .calls-queue-controls {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
}

body.route-clients .calls-per-page-form,
body.route-clients .calls-per-page-form label {
    display: inline-flex;
    align-items: center;
}

body.route-clients .clients-filter-form select[name='per_page'],
body.route-clients .calls-per-page-form select[name='per_page'] {
    min-width: 92px;
}

@media (max-width: 860px) {
    body.route-clients .clients-pagination {
        flex-direction: column;
        align-items: stretch;
    }

    body.route-clients .clients-pagination-info {
        white-space: normal;
    }

    body.route-clients .pagination-nav {
        justify-content: flex-start;
    }

    body.route-clients .calls-queue-controls {
        width: 100%;
        justify-content: space-between;
    }
}

/* Sidebar redesign: warm gold gradient style */
body.route-clients .app-layout {
    grid-template-columns: 74px minmax(0, 1fr);
}

body.route-clients.sidebar-expanded .app-layout {
    grid-template-columns: 182px minmax(0, 1fr);
}

body.route-clients .sidebar {
    background: linear-gradient(180deg, #c59b46 0%, #a97720 52%, #865607 100%);
    border: 0;
    border-right: 1px solid rgba(255, 244, 214, 0.34);
    border-radius: 0;
    box-shadow: inset 0 1px 0 rgba(255, 248, 226, 0.35);
    color: #fff0c9;
    padding: 0.86rem 0.34rem 0.62rem;
}

body.route-clients .brand-block {
    justify-content: center;
    padding: 0 0 0.44rem;
    gap: 0.38rem;
}

body.route-clients .sidebar-brand-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: rgba(255, 250, 237, 0.16);
    border: 1px solid rgba(255, 243, 213, 0.34);
    color: #fff9e6;
    box-shadow: inset 0 1px 0 rgba(255, 252, 243, 0.28);
}

body.route-clients .sidebar-brand-icon svg {
    width: 20px;
    height: 20px;
}

body.route-clients .brand-block strong {
    color: #fff3d2;
}

body.route-clients .brand-block small {
    color: rgba(255, 236, 198, 0.78);
}

body.route-clients .sidebar-nav {
    margin-top: 0.28rem;
    gap: 0.36rem;
}

body.route-clients .sidebar-nav a {
    width: 44px;
    height: 44px;
    margin: 0 auto;
    border-radius: 14px;
    border: 1px solid transparent;
    color: rgba(255, 241, 207, 0.92);
}

body.route-clients .sidebar-nav-icon {
    width: 20px;
    height: 20px;
    color: currentColor;
}

body.route-clients .sidebar-nav-icon svg {
    width: 20px;
    height: 20px;
}

body.route-clients .sidebar-nav a:hover {
    background: rgba(255, 252, 240, 0.14);
    border-color: rgba(255, 242, 208, 0.24);
    color: #ffffff;
}

body.route-clients .sidebar-nav a.active {
    background: rgba(255, 249, 236, 0.28);
    border-color: rgba(255, 243, 212, 0.46);
    color: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 253, 246, 0.34);
}

body.route-clients .sidebar-nav a.active .sidebar-nav-icon {
    color: #ffffff;
}

body.route-clients:not(.sidebar-expanded) .sidebar-nav a::after {
    background: #3c2908;
    border-color: rgba(255, 239, 203, 0.25);
    color: #fff1c9;
    box-shadow: 0 10px 20px rgba(40, 26, 4, 0.34);
}

body.route-clients .sidebar-footer {
    border-top: 1px solid rgba(255, 240, 204, 0.24);
    padding-top: 0.64rem;
}

body.route-clients .sidebar-collapse-toggle {
    border: 0;
    background: transparent;
    color: rgba(255, 245, 221, 0.95);
    box-shadow: none;
}

body.route-clients .sidebar-collapse-toggle:hover {
    background: rgba(255, 252, 242, 0.23);
    color: #ffffff;
}

body.route-clients .sidebar-user-avatar {
    width: 34px;
    height: 34px;
    border: 1px solid rgba(255, 241, 206, 0.42);
    background: rgba(78, 49, 9, 0.38);
    color: #fff8e5;
    box-shadow: inset 0 1px 0 rgba(255, 245, 220, 0.2);
}

body.route-clients .sidebar-user strong {
    color: #fff2ce;
}

body.route-clients .sidebar-user small {
    color: rgba(255, 232, 190, 0.78);
}

body.route-clients .logout-form .btn-ghost {
    border: 0;
    background: transparent;
    color: rgba(255, 244, 218, 0.95);
    box-shadow: none;
}

body.route-clients .logout-form .btn-ghost:hover {
    background: rgba(255, 252, 242, 0.24);
    color: #ffffff;
}

body.route-clients .sidebar-logout-icon {
    color: currentColor;
}

body.route-clients.sidebar-expanded .brand-block {
    justify-content: flex-start;
    padding: 0 0.22rem 0.52rem;
}

body.route-clients.sidebar-expanded .sidebar-nav-label {
    color: rgba(255, 231, 185, 0.78);
}

body.route-clients.sidebar-expanded .sidebar-nav a {
    width: 100%;
    height: auto;
    margin: 0;
    justify-content: flex-start;
    gap: 0.52rem;
    padding: 0.5rem 0.56rem;
    border-radius: 12px;
}

body.route-clients.sidebar-expanded .sidebar-nav-text,
body.route-clients.sidebar-expanded .logout-form .sidebar-nav-text {
    color: #fff1cc;
}

body.route-clients.sidebar-expanded .sidebar-user {
    justify-content: flex-start;
}

body.route-clients.sidebar-expanded .logout-form .btn-ghost {
    justify-content: flex-start;
}

@media (max-width: 1180px) {
    body.route-clients .app-layout {
        grid-template-columns: 70px minmax(0, 1fr);
    }

    body.route-clients.sidebar-expanded .app-layout {
        grid-template-columns: 170px minmax(0, 1fr);
    }
}

@media (max-width: 860px) {
    body.route-clients .mobile-menu-btn {
        border-color: rgba(206, 170, 105, 0.42);
        background: #fff7e8;
        color: #9b6a17;
    }

    body.route-clients .sidebar {
        width: min(82vw, 290px);
        border-radius: 0;
        box-shadow: 0 18px 38px rgba(68, 45, 8, 0.32);
    }

    body.route-clients .sidebar-mobile-close {
        border-color: rgba(255, 241, 208, 0.34);
        background: rgba(255, 252, 242, 0.16);
        color: #fff5db;
    }
}

/* Manager dashboard: only the compact navigation remains fixed on the left.
   The dashboard itself owns its complete width, like the approved reference. */
@media (min-width: 861px) {
    body.route-dashboard.role-manager {
        --mgr-sidebar-w: 60px;
    }

    body.route-dashboard.role-manager.sidebar-expanded {
        --mgr-sidebar-w: 172px;
    }

    body.route-dashboard.role-manager .app-shell {
        width: 100%;
        margin: 0;
    }

    body.route-dashboard.role-manager .app-layout {
        display: block;
        min-height: 100vh;
    }

    body.route-dashboard.role-manager .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 140;
        width: var(--mgr-sidebar-w);
        min-height: 100vh;
        height: 100vh;
        padding: 0.78rem 0.32rem 0.62rem;
    }

    body.route-dashboard.role-manager .brand-block {
        padding-bottom: 0.56rem;
    }

    body.route-dashboard.role-manager .sidebar-brand-icon {
        width: 34px;
        height: 34px;
        border-radius: 11px;
    }

    body.route-dashboard.role-manager .sidebar-brand-icon svg {
        width: 17px;
        height: 17px;
    }

    body.route-dashboard.role-manager .sidebar-nav {
        gap: 0.42rem;
    }

    body.route-dashboard.role-manager .sidebar-nav a {
        width: 40px;
        height: 40px;
        border-radius: 13px;
    }

    body.route-dashboard.role-manager .sidebar-nav-icon {
        width: 18px;
        height: 18px;
    }

    body.route-dashboard.role-manager .sidebar-nav-icon svg {
        width: 18px;
        height: 18px;
    }

    body.route-dashboard.role-manager .sidebar-footer {
        padding-top: 0.52rem;
        gap: 0.44rem;
    }

    body.route-dashboard.role-manager .sidebar-collapse-toggle {
        width: 29px;
        height: 29px;
        margin: 0 auto;
        border-radius: 10px;
    }

    body.route-dashboard.role-manager .sidebar-user-avatar {
        width: 33px;
        height: 33px;
    }

    body.route-dashboard.role-manager .logout-form .btn-ghost {
        min-height: 30px;
        padding: 0.2rem 0;
    }

    body.route-dashboard.role-manager .content-wrap {
        margin-left: var(--mgr-sidebar-w);
        min-height: 100vh;
        padding: 0 0.9rem 0.9rem;
    }

    body.route-dashboard.role-manager .dashboard-manager-layout {
        display: block;
        min-height: 0;
        height: auto;
        padding-left: 0;
    }

    body.route-dashboard.role-manager .dashboard-manager-main {
        padding: 0;
    }
}

@media (max-width: 860px) {
    body.route-dashboard.role-manager .content-wrap {
        padding: 0.66rem;
    }

    body.route-dashboard.role-manager .dashboard-manager-layout {
        grid-template-columns: 1fr;
        min-height: 0;
        gap: 0.64rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel {
        position: static;
        top: auto;
        min-height: 0;
        height: auto;
        max-height: none;
        border-radius: 14px;
        border: 1px solid rgba(255, 228, 170, 0.3);
    }

    body.route-dashboard.role-manager .dashboard-manager-main {
        padding: 0;
    }
}

/* Manager dashboard: slim rail + blue focus panel (desktop) */
@media (min-width: 861px) {
    body.route-dashboard.role-manager {
        --mgr-sidebar-w: 58px;
        --mgr-panel-w: 360px;
        background: #edf0f4;
    }

    body.route-dashboard.role-manager.sidebar-expanded {
        --mgr-sidebar-w: 172px;
    }

    body.route-dashboard.role-manager .app-shell {
        width: 100%;
        margin: 0;
    }

    body.route-dashboard.role-manager .app-layout {
        display: block;
        min-height: 100vh;
    }

    body.route-dashboard.role-manager .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 160;
        width: var(--mgr-sidebar-w);
        min-height: 100vh;
        height: 100vh;
        border: 0;
        border-right: 1px solid #c9d0da;
        border-radius: 0;
        box-shadow: none;
        background: #f2f3f5;
        color: #838d9e;
        padding: 0.9rem 0.22rem 0.72rem;
    }

    body.route-dashboard.role-manager .sidebar::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 2px;
        background: #c2ce38;
    }

    body.route-dashboard.role-manager .brand-block {
        justify-content: center;
        gap: 0;
        padding: 0 0 0.55rem;
    }

    body.route-dashboard.role-manager .brand-block > div {
        display: none;
    }

    body.route-dashboard.role-manager .sidebar-brand-icon {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        border: 1px solid #d4dae4;
        background: #f9fafc;
        color: #2f3744;
        box-shadow: none;
    }

    body.route-dashboard.role-manager .sidebar-brand-icon svg {
        width: 17px;
        height: 17px;
    }

    body.route-dashboard.role-manager .sidebar-mobile-close {
        display: none;
    }

    body.route-dashboard.role-manager .sidebar-nav {
        margin-top: 0.44rem;
        gap: 0.52rem;
    }

    body.route-dashboard.role-manager .sidebar-nav-label {
        display: none;
    }

    body.route-dashboard.role-manager .sidebar-nav a {
        width: 40px;
        height: 40px;
        margin: 0 auto;
        padding: 0;
        border-radius: 13px;
        border: 1px solid transparent;
        background: transparent;
        color: #8f98a9;
        justify-content: center;
    }

    body.route-dashboard.role-manager .sidebar-nav a[data-nav-label='Аккаунт'] {
        display: none;
    }

    body.route-dashboard.role-manager .sidebar-nav-icon {
        width: 19px;
        height: 19px;
        color: currentColor;
    }

    body.route-dashboard.role-manager .sidebar-nav-icon svg {
        width: 19px;
        height: 19px;
    }

    body.route-dashboard.role-manager .sidebar-nav a:hover {
        background: #e8edf4;
        border-color: #dde4ee;
        color: #677283;
    }

    body.route-dashboard.role-manager .sidebar-nav a.active {
        background: #d7e5f3;
        border-color: #d7e5f3;
        color: #202c3e;
        box-shadow: none;
    }

    body.route-dashboard.role-manager .sidebar-nav a.active .sidebar-nav-icon {
        color: #202c3e;
    }

    body.route-dashboard.role-manager .sidebar-nav-text {
        display: none;
    }

    body.route-dashboard.role-manager .sidebar-footer {
        margin-top: auto;
        border-top: 0;
        padding-top: 0.5rem;
        gap: 0.52rem;
        align-items: center;
    }

    body.route-dashboard.role-manager .sidebar-footer-tools {
        display: grid;
        gap: 0.4rem;
    }

    body.route-dashboard.role-manager .sidebar-footer-tool {
        width: 30px;
        height: 30px;
        border: 0;
        background: transparent;
        color: #929bab;
        border-radius: 9px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        cursor: pointer;
    }

    body.route-dashboard.role-manager .sidebar-footer-tool svg {
        width: 16px;
        height: 16px;
    }

    body.route-dashboard.role-manager .sidebar-footer-tool:hover {
        background: #e8edf4;
        color: #697385;
    }

    body.route-dashboard.role-manager .sidebar-collapse-toggle {
        position: fixed;
        left: calc(var(--mgr-sidebar-w) - 3px);
        top: 50%;
        z-index: 190;
        transform: translate(-50%, -50%);
        width: 24px;
        height: 32px;
        border: 1px solid #d4d9e1;
        border-radius: 10px;
        background: #f6f7f9;
        color: #99a2b2;
        margin: 0;
        box-shadow: none;
    }

    body.route-dashboard.role-manager .sidebar-collapse-toggle svg {
        width: 14px;
        height: 14px;
    }

    body.route-dashboard.role-manager .sidebar-collapse-toggle:hover {
        background: #eceff4;
        color: #7d8798;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-collapse-toggle svg {
        transform: rotate(180deg);
    }

    body.route-dashboard.role-manager .sidebar-user {
        justify-content: center;
        gap: 0;
    }

    body.route-dashboard.role-manager .sidebar-user-avatar {
        width: 32px;
        height: 32px;
        border: 1px solid #d4dae4;
        background: #dfe3ea;
        color: #1f2735;
        font-size: 0.72rem;
        font-weight: 800;
        box-shadow: none;
    }

    body.route-dashboard.role-manager .sidebar-user-meta,
    body.route-dashboard.role-manager .logout-form {
        display: none;
    }

    body.route-dashboard.role-manager.sidebar-expanded .brand-block {
        justify-content: flex-start;
        padding: 0 0.3rem 0.55rem;
        gap: 0.5rem;
    }

    body.route-dashboard.role-manager.sidebar-expanded .brand-block > div {
        display: block;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-nav-label {
        display: block;
        margin: 0 0 0.35rem;
        padding: 0 0.48rem;
        font-size: 0.62rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: #a0a8b7;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-nav a {
        width: 100%;
        height: 40px;
        margin: 0;
        padding: 0 0.58rem;
        justify-content: flex-start;
        gap: 0.45rem;
        border-radius: 11px;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-nav-text {
        display: inline;
        color: #475263;
        font-size: 0.83rem;
        font-weight: 600;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-nav a.active .sidebar-nav-text {
        color: #202c3e;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-footer {
        align-items: stretch;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-footer-tools {
        grid-template-columns: repeat(2, 30px);
        justify-content: flex-start;
        padding-left: 0.18rem;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-user {
        justify-content: flex-start;
        padding-left: 0.26rem;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-user-meta {
        display: grid;
        gap: 0.04rem;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-user strong {
        font-size: 0.76rem;
        color: #2f3a4a;
    }

    body.route-dashboard.role-manager.sidebar-expanded .sidebar-user small {
        font-size: 0.64rem;
        color: #8b95a8;
    }

    body.route-dashboard.role-manager .content-wrap {
        margin-left: calc(var(--mgr-sidebar-w) + var(--mgr-panel-w));
        min-height: 100vh;
        padding: 0 1rem 1rem;
        border: 0;
        background: #edf0f4;
    }

    body.route-dashboard.role-manager .dashboard-manager-layout {
        display: block;
        min-height: 0;
        height: auto;
        padding-left: 0;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel {
        position: fixed;
        top: 0;
        left: var(--mgr-sidebar-w);
        width: var(--mgr-panel-w);
        min-height: 100vh;
        height: 100vh;
        max-height: 100vh;
        border-radius: 0;
        border: 0;
        border-right: 1px solid rgba(255, 255, 255, 0.62);
        background: #7eadd2;
        color: #eef6ff;
        padding: 2rem 1.35rem 1.2rem;
        display: flex;
        flex-direction: column;
        gap: 1.16rem;
        overflow-y: auto;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-welcome {
        display: grid;
        gap: 0.06rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-welcome span {
        color: rgba(240, 248, 255, 0.88);
        font-size: 0.8rem;
        line-height: 1;
        font-weight: 500;
        letter-spacing: 2px;
        text-transform: uppercase;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-welcome strong {
        color: #ffffff;
        font-size: 1.7rem;
        line-height: 1;
        letter-spacing: 0;
        font-weight: 600;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-section {
        border-top: 1px solid rgba(235, 245, 255, 0.24);
        padding-top: 1rem;
        display: grid;
        gap: 0.6rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-section.is-goal {
        border-top: 0;
        padding-top: 0.2rem;
        gap: 0.56rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-section h2 {
        margin: 0;
        display: inline-flex;
        align-items: center;
        gap: 0.46rem;
        color: rgba(236, 246, 255, 0.85);
        font-size: 0.72rem;
        line-height: 1.2;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-section h2::before {
        content: "";
        width: 6px;
        height: 6px;
        border-radius: 999px;
        background: #ffffff;
        box-shadow: none;
        flex: 0 0 auto;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-wrap {
        display: flex;
        justify-content: center;
        padding-top: 0.24rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-ring {
        width: min(278px, calc(var(--mgr-panel-w) - 54px));
        aspect-ratio: 1;
        position: relative;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-svg {
        width: 100%;
        height: 100%;
        display: block;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-track {
        fill: none;
        stroke: #8eb8dc;
        stroke-width: 11;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-progress {
        fill: none;
        stroke: #f7fbff;
        stroke-width: 11;
        stroke-linecap: round;
        transform: rotate(-90deg);
        transform-origin: 50% 50%;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-center {
        position: absolute;
        inset: 0;
        display: grid;
        justify-items: center;
        align-content: center;
        gap: 0.22rem;
        text-align: center;
        z-index: 1;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 62px;
        height: 36px;
        border-radius: 11px;
        background: transparent;
        color: #ffffff;
        font-size: 1.8rem;
        line-height: 1;
        font-weight: 800;
        letter-spacing: -0.02em;
        padding: 0 0.65rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-caption {
        color: rgba(239, 247, 255, 0.92);
        font-size: 0.8rem;
        line-height: 1.25;
        font-weight: 600;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-conversion-list {
        display: grid;
        gap: 0.72rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-conversion-item {
        display: grid;
        gap: 0.24rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-conversion-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.45rem;
        color: #ffffff;
        font-size: 0.96rem;
        line-height: 1.2;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-conversion-head strong {
        color: #f6fbff;
        font-size: 1.08rem;
        line-height: 1;
        font-weight: 800;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-conversion-track {
        width: 100%;
        height: 4px;
        border-radius: 999px;
        background: rgba(226, 238, 250, 0.26);
        overflow: hidden;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-conversion-track span {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: #ffffff;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-section.is-income {
        margin-top: auto;
        gap: 0.72rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-grid {
        display: grid;
        gap: 0.56rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-top {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.74rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-main {
        display: grid;
        gap: 0.16rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-main span {
        color: rgba(232, 243, 255, 0.84);
        font-size: 0.72rem;
        line-height: 1.2;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-main strong {
        color: #ffffff;
        font-size: 2.96rem;
        line-height: 1;
        font-weight: 800;
        letter-spacing: -0.03em;
        white-space: nowrap;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-divider {
        height: 1px;
        background: rgba(233, 244, 255, 0.24);
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-bottom {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0.5rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-mini {
        display: grid;
        gap: 0.12rem;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-mini span {
        color: rgba(232, 243, 255, 0.84);
        font-size: 0.68rem;
        line-height: 1.15;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-mini strong {
        color: #ffffff;
        font-size: 1.7rem;
        line-height: 1;
        letter-spacing: -0.02em;
        font-weight: 600;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-mini small {
        color: #fff;
        font-size: 0.7rem;
        line-height: 1.2;
        font-weight: 600;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-income-mini.is-bonus strong {
        color: #caea2d;
    }

    body.route-dashboard.role-manager .dashboard-manager-main {
        padding: 0;
    }
}

@media (min-width: 861px) and (max-width: 1380px) {
    body.route-dashboard.role-manager {
        --mgr-panel-w: 338px;
    }

    body.route-dashboard.role-manager .dashboard-sidepanel-goal-ring {
        width: min(250px, calc(var(--mgr-panel-w) - 56px));
    }
}

/* Sidebar lock: unified dashboard style on all desktop pages */
@media (min-width: 861px) {
    body.route-clients {
        --crm-sidebar-unified-w: 58px;
    }

    body.route-clients .app-layout {
        grid-template-columns: var(--crm-sidebar-unified-w) minmax(0, 1fr) !important;
        gap: 0;
        min-height: 100vh;
    }

    body.route-clients.sidebar-expanded .app-layout {
        grid-template-columns: var(--crm-sidebar-unified-w) minmax(0, 1fr) !important;
    }

    body.route-clients .sidebar {
        width: var(--crm-sidebar-unified-w) !important;
        min-width: var(--crm-sidebar-unified-w);
        height: 100dvh;
        min-height: 100dvh;
        border: 0;
        border-right: 1px solid #c9d0da;
        border-radius: 0;
        box-shadow: none;
        background: #f2f3f5;
        color: #838d9e;
        padding: 0.9rem 0.22rem 0.72rem;
        overflow: visible !important;
        position: sticky;
        top: 0;
        z-index: 24;
    }

    body.route-clients .brand-block {
        justify-content: center;
        gap: 0;
        padding: 0 0 0.55rem;
    }

    body.route-clients .brand-block > div,
    body.route-clients .sidebar-nav-label,
    body.route-clients .sidebar-nav-text,
    body.route-clients .logout-form .sidebar-nav-text,
    body.route-clients .sidebar-user-meta {
        display: none !important;
    }

    body.route-clients .sidebar-brand-icon {
        width: 34px;
        height: 34px;
        border-radius: 999px;
        border: 1px solid #d4dae4;
        background: #f9fafc;
        color: #2f3744;
        box-shadow: none;
    }

    body.route-clients .sidebar-brand-icon svg {
        width: 17px;
        height: 17px;
    }

    body.route-clients .sidebar-nav {
        margin-top: 0.44rem;
        gap: 0.52rem;
    }

    body.route-clients .sidebar-nav a {
        width: 40px;
        height: 40px;
        margin: 0 auto;
        padding: 0;
        border-radius: 13px;
        border: 1px solid transparent;
        background: transparent;
        color: #8f98a9;
        justify-content: center;
    }

    body.route-clients .sidebar-nav-icon {
        width: 19px;
        height: 19px;
        color: currentColor;
    }

    body.route-clients .sidebar-nav-icon svg {
        width: 19px;
        height: 19px;
    }

    body.route-clients .sidebar-nav a:hover {
        background: #e8edf4;
        border-color: #dde4ee;
        color: #677283;
    }

    body.route-clients .sidebar-nav a.active {
        background: #d7e5f3;
        border-color: #d7e5f3;
        color: #202c3e;
        box-shadow: none;
    }

    body.route-clients .sidebar-nav a.active .sidebar-nav-icon {
        color: #202c3e;
    }

    body.route-clients .sidebar-nav a::after {
        content: attr(data-nav-label);
        position: absolute;
        left: calc(100% + 10px);
        top: 50%;
        transform: translateY(-50%) translateX(-4px);
        background: #ffffff;
        border: 1px solid #d6dde9;
        border-radius: 9px;
        box-shadow: 0 8px 18px rgba(14, 28, 55, 0.12);
        padding: 0.35rem 0.55rem;
        font-size: 0.75rem;
        line-height: 1.1;
        color: #2b3442;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.16s ease, transform 0.16s ease;
        z-index: 40;
    }

    body.route-clients .sidebar-nav a:hover::after {
        opacity: 1;
        transform: translateY(-50%) translateX(0);
    }

    body.route-clients .sidebar-collapse-toggle {
        display: none !important;
    }

    body.route-clients .sidebar-footer {
        margin-top: auto;
        border-top: 0;
        padding-top: 0.5rem;
        gap: 0.52rem;
        align-items: center;
    }

    body.route-clients .sidebar-footer-tools {
        width: 100%;
        display: grid;
        justify-items: center;
        align-items: center;
        gap: 0.4rem;
    }

    body.route-clients .sidebar-footer-tool {
        width: 40px;
        height: 40px;
        border-radius: 13px;
        border: 1px solid transparent;
        background: transparent;
        color: #929bab;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto;
        text-decoration: none;
        padding: 0;
    }

    body.route-clients .sidebar-footer-tool:hover {
        background: #e8edf4;
        color: #697385;
    }

    body.route-clients .sidebar-footer-tool svg {
        width: 19px;
        height: 19px;
    }

    body.route-clients .sidebar-user {
        justify-content: center;
        gap: 0;
    }

    body.route-clients .sidebar-user-avatar {
        width: 32px;
        height: 32px;
        border: 1px solid #d4dae4;
        background: #dfe3ea;
        color: #1f2735;
        font-size: 0.72rem;
        font-weight: 800;
        box-shadow: none;
    }

    body.route-dashboard.role-manager.sidebar-expanded {
        --mgr-sidebar-w: 58px;
    }
}

/* Manager dashboard: compact hero typography */
body.route-dashboard.role-manager .dashboard-hero-title {
    font-size: 0.6rem;
}

body.route-dashboard.role-manager .dashboard-hero-pill {
    font-size: 0.6rem;
}

body.route-dashboard.role-manager .dashboard-hero-alert {
    font-size: 0.7rem;
}

body.route-dashboard.role-manager .dashboard-hero-note {
    font-size: 0.7rem;
}

body.route-dashboard.role-manager .dashboard-hero-meta {
    font-size: 0.7rem;
}

body.route-dashboard.role-manager .dashboard-hero-meeting-when {
    font-size: 0.7rem;
}

body.route-dashboard.role-manager .dashboard-hero-meeting-line {
    font-size: 0.7rem;
}

body.route-clients .logout-form .btn-ghost {
    width: 40px;
    height: 40px;
    min-height: 40px;
    border-radius: 13px;
    border: 1px solid transparent;
    background: transparent;
    color: #8f98a9;
    box-shadow: none;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body.route-clients .logout-form .btn-ghost:hover {
    background: #e8edf4;
    border-color: #dde4ee;
    color: #677283;
}

body.route-clients .sidebar-logout-icon {
    width: 19px;
    height: 19px;
    color: currentColor;
}

.dashboard-engagement-head h2 {
    font-weight: 600;
    font-size: 0.9rem;
}

.dashboard-attention-chip {
    font-size: 0.6rem;
}

.dashboard-attention-list {
    max-height: 318px;
    overflow-y: auto;
    padding-right: 0.32rem;
    margin-right: 0.2rem;
}

.dashboard-attention-list::-webkit-scrollbar {
    width: 6px;
}

.dashboard-attention-list::-webkit-scrollbar-thumb {
    background: #d7dde6;
    border-radius: 999px;
}

.dashboard-attention-list::-webkit-scrollbar-track {
    background: transparent;
}

.dashboard-attention-footer-note {
    margin-top: auto;
}

.dashboard-activity-ten-title h2 {
    font-size: 0.9rem;
}

.dashboard-attention-footer-note {
    font-size: 0.7rem;
}

.dashboard-attention-footer-note strong {
    font-size: 0.9rem;
}

.dashboard-activity-ten-chart-wrap {
    padding-top: 2.35rem;
}

@media (max-width: 860px) {
    .dashboard-activity-ten-chart-wrap {
        padding-top: 1.95rem;
    }
}

/* Calls page redesign */
body.route-calls.route-clients .calls-overview {
    margin-bottom: 1rem;
}

body.route-calls.route-clients .calls-overview-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

body.route-calls.route-clients .calls-overview-grid.is-manager {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

body.route-calls.route-clients .calls-stat-card {
    min-width: 0;
    min-height: 125px;
    border-radius: 24px;
    border: 1px solid #e8ebef;
    background: #ffffff;
    padding: 1rem 1.1rem;
    display: grid;
    align-content: start;
    gap: 0.56rem;
    box-shadow: none;
}

body.route-calls.route-clients .calls-stat-card--idle.is-alert {
    border-color: #f2cfd2;
}

body.route-calls.route-clients .calls-stat-card--idle.is-meeting {
    border-color: #cfe0ff;
    background: #f5f9ff;
}

body.route-calls.route-clients .calls-stat-card--plan {
    border-color: #f2c988;
    background: #fff4e3;
}

body.route-calls.route-clients .calls-stat-card--plan.is-good {
    border-color: #cce7d5;
    background: #eff8f2;
}

body.route-calls.route-clients .calls-stat-card--plan.is-good .calls-stat-value,
body.route-calls.route-clients .calls-stat-card--plan.is-good .calls-stat-label,
body.route-calls.route-clients .calls-stat-card--plan.is-good .calls-stat-plan-row strong,
body.route-calls.route-clients .calls-stat-card--plan.is-good .calls-stat-plan-row span {
    color: #2b9558;
}

body.route-calls.route-clients .calls-stat-card--plan.is-good .calls-stat-progress {
    background: #dfeee4;
}

body.route-calls.route-clients .calls-stat-card--plan.is-good .calls-stat-progress span {
    background: linear-gradient(90deg, #33a560 0%, #53c678 100%);
}

body.route-calls.route-clients .calls-stat-head {
    display: flex;
    align-items: center;
    gap: 0.56rem;
    min-width: 0;
}

body.route-calls.route-clients .calls-stat-icon {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}

body.route-calls.route-clients .calls-stat-icon svg {
    width: 16px;
    height: 16px;
}

body.route-calls.route-clients .calls-stat-label {
    margin: 0;
    color: #666666;
    font-size: 0.74rem;
    line-height: 1.2;
    font-weight: 800;
}

body.route-calls.route-clients .calls-stat-card--idle .calls-stat-label,
body.route-calls.route-clients .calls-stat-card--idle .calls-stat-icon {
    color: #ff3942;
}

body.route-calls.route-clients .calls-stat-card--plan .calls-stat-label,
body.route-calls.route-clients .calls-stat-card--plan .calls-stat-icon {
    color: #f06f00;
}

body.route-calls.route-clients .calls-stat-value {
    margin: 0;
    color: #0f1730;
    font-size: clamp(2.2rem, 2.8vw, 3.2rem);
    line-height: 0.95;
    font-weight: 800;
    letter-spacing: -0.04em;
}

body.route-calls.route-clients .calls-stat-card--idle.is-alert .calls-stat-value {
    color: #ff3942;
}

body.route-calls.route-clients .calls-stat-card--idle.is-meeting .calls-stat-value {
    color: #2b6dff;
}

body.route-calls.route-clients .calls-stat-card--plan .calls-stat-value {
    color: #ff6c00;
}

body.route-calls.route-clients .calls-stat-note {
    margin: 0;
    color: #9a9a9a;
    font-size: 0.74rem;
    line-height: 1.45;
    font-weight: 600;
}

body.route-calls.route-clients .calls-stat-card--idle .calls-stat-note {
    color: #ff6c00;
}

body.route-calls.route-clients .calls-stat-progress {
    width: 100%;
    height: 12px;
    border-radius: 999px;
    background: rgba(240, 184, 113, 0.28);
    overflow: hidden;
}

body.route-calls.route-clients .calls-stat-progress span {
    display: block;
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, #f06f00 0%, #f2a244 100%);
}

body.route-calls.route-clients .calls-stat-plan-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.56rem;
}

body.route-calls.route-clients .calls-stat-plan-row strong,
body.route-calls.route-clients .calls-stat-plan-row span {
    color: #f06f00;
    font-size: 0.72rem;
    line-height: 1.2;
    font-weight: 800;
    white-space: nowrap;
}

body.route-calls.route-clients .calls-board-card {
    padding: 0;
    border-radius: 22px;
    border: 1px solid #e3e7ec;
    background: #ffffff;
    box-shadow: none;
    overflow: hidden;
}

body.route-calls.route-clients .calls-board-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem 1.5rem 1.2rem;
}

body.route-calls.route-clients .calls-board-heading h2 {
    margin: 0;
    color: #5b5b5b;
    font-size: 1.08rem;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -0.03em;
}

body.route-calls.route-clients .calls-board-heading p {
    margin: 0.45rem 0 0;
    color: #a2a2a2;
    font-size: 0.8rem;
    line-height: 1.3;
    font-weight: 600;
}

body.route-calls.route-clients .calls-board-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.72rem;
    flex-wrap: wrap;
}

body.route-calls.route-clients .calls-board-total {
    color: #6f7688;
    font-size: 0.78rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

body.route-calls.route-clients .calls-board-per-page-form {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

body.route-calls.route-clients .calls-board-per-page-form > span {
    color: #848b99;
    font-size: 0.78rem;
    line-height: 1;
    font-weight: 700;
}

body.route-calls.route-clients .calls-board-per-page-form label {
    display: inline-flex;
    align-items: center;
}

body.route-calls.route-clients .calls-board-per-page-form select {
    min-width: 78px;
    height: 46px;
    border-radius: 16px;
    border: 1px solid #d9dee6;
    background: #f7f8fa;
    color: #677186;
    font-size: 0.84rem;
    font-weight: 700;
    text-align: center;
    padding: 0 2.1rem 0 1rem;
}

body.route-calls.route-clients .calls-board-icon-btn,
body.route-calls.route-clients .calls-board-filter-btn {
    height: 46px;
    border-radius: 16px;
    border: 1px solid #d9dee6;
    background: #f7f8fa;
    color: #7d8595;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.42rem;
    text-decoration: none;
    padding: 0 0.92rem;
    font-size: 0.84rem;
    line-height: 1;
    font-weight: 800;
    cursor: pointer;
    user-select: none;
    list-style: none;
}

body.route-calls.route-clients .calls-board-icon-btn {
    width: 46px;
    padding: 0;
}

body.route-calls.route-clients .calls-board-icon-btn svg,
body.route-calls.route-clients .calls-board-filter-btn svg {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
}

body.route-calls.route-clients .calls-board-filter-menu {
    position: relative;
}

body.route-calls.route-clients .calls-board-filter-menu summary::-webkit-details-marker {
    display: none;
}

body.route-calls.route-clients .calls-board-filter-popover {
    position: absolute;
    right: 0;
    top: calc(100% + 0.5rem);
    z-index: 20;
    width: 260px;
    border-radius: 16px;
    border: 1px solid #dfe4eb;
    background: #ffffff;
    color: #6d7585;
    font-size: 0.78rem;
    line-height: 1.45;
    font-weight: 600;
    padding: 0.8rem 0.88rem;
    box-shadow: 0 10px 30px rgba(26, 39, 60, 0.08);
}

body.route-calls.route-clients .calls-board-group {
    border-top: 1px solid #edf1f5;
}

body.route-calls.route-clients .calls-board-group-head {
    display: flex;
    align-items: center;
    gap: 0.62rem;
    padding: 1rem 1.5rem;
}

body.route-calls.route-clients .calls-board-group.is-call .calls-board-group-head {
    background: #ecf4ff;
}

body.route-calls.route-clients .calls-board-group.is-callback .calls-board-group-head {
    background: #f2edff;
}

body.route-calls.route-clients .calls-board-group.is-missed .calls-board-group-head {
    background: #f8f1e7;
}

body.route-calls.route-clients .calls-board-group-head h3 {
    margin: 0;
    font-size: 0.82rem;
    line-height: 1;
    font-weight: 800;
}

body.route-calls.route-clients .calls-board-group.is-call .calls-board-group-head h3 {
    color: #2966f3;
}

body.route-calls.route-clients .calls-board-group.is-callback .calls-board-group-head h3 {
    color: #7e48f4;
}

body.route-calls.route-clients .calls-board-group.is-missed .calls-board-group-head h3 {
    color: #eb6500;
}

body.route-calls.route-clients .calls-board-group-count {
    min-width: 30px;
    height: 30px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    font-size: 0.82rem;
    line-height: 1;
    font-weight: 800;
}

body.route-calls.route-clients .calls-board-group.is-call .calls-board-group-count {
    background: rgba(41, 102, 243, 0.08);
    border-color: rgba(41, 102, 243, 0.2);
    color: #2966f3;
}

body.route-calls.route-clients .calls-board-group.is-callback .calls-board-group-count {
    background: rgba(126, 72, 244, 0.08);
    border-color: rgba(126, 72, 244, 0.18);
    color: #7e48f4;
}

body.route-calls.route-clients .calls-board-group.is-missed .calls-board-group-count {
    background: rgba(235, 101, 0, 0.08);
    border-color: rgba(235, 101, 0, 0.18);
    color: #eb6500;
}

body.route-calls.route-clients .calls-board-table-wrap {
    overflow-x: auto;
}

body.route-calls.route-clients .calls-board-table {
    width: 100%;
    min-width: 1100px;
    border-collapse: collapse;
}

body.route-calls.route-clients .calls-board-table thead th {
    padding: 1rem 1.5rem;
    text-align: left;
    color: #4d4d4d;
    font-size: 0.74rem;
    line-height: 1;
    font-weight: 800;
    text-transform: uppercase;
    border-bottom: 1px solid #edf1f5;
    background: #ffffff;
    white-space: nowrap;
}

body.route-calls.route-clients .calls-board-table thead th:last-child {
    width: 180px;
}

body.route-calls.route-clients .calls-board-table tbody td {
    padding: 1.05rem 1.5rem;
    border-bottom: 1px solid #edf1f5;
    vertical-align: middle;
    background: #ffffff;
}

body.route-calls.route-clients .calls-board-table tbody tr:last-child td {
    border-bottom: 0;
}

body.route-calls.route-clients .calls-board-company {
    display: flex;
    align-items: center;
    gap: 0.78rem;
    min-width: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    text-align: left;
}

body.route-calls.route-clients .calls-board-company .company-cell-icon {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    font-size: 0.8rem;
    font-weight: 800;
}

body.route-calls.route-clients .calls-board-company-main {
    min-width: 0;
    display: grid;
    gap: 0.26rem;
}

body.route-calls.route-clients .calls-board-company-link {
    color: #2a68d1;
    font-size: 0.8rem;
    line-height: 1.25;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.route-calls.route-clients .calls-board-company-link:hover {
    color: #174fa8;
}

body.route-calls.route-clients .calls-board-company:hover .calls-board-company-link,
body.route-calls.route-clients .calls-board-company:focus-visible .calls-board-company-link {
    color: #174fa8;
    text-decoration: underline;
    text-underline-offset: 0.16em;
}

body.route-calls.route-clients .calls-board-company:focus-visible {
    outline: 3px solid rgba(42, 104, 209, 0.22);
    outline-offset: 5px;
    border-radius: 12px;
}

body.route-calls.route-clients .calls-board-meeting-tag {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 24px;
    border-radius: 999px;
    border: 1px solid #efc777;
    background: #fff5dc;
    color: #c57b08;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 800;
    padding: 0.1rem 0.5rem;
    white-space: nowrap;
}

body.route-calls.route-clients .calls-board-cell-text,
body.route-calls.route-clients .calls-board-phone,
body.route-calls.route-clients .calls-board-note {
    display: inline-block;
    max-width: 100%;
    color: #5a6477;
    font-size: 0.8rem;
    line-height: 1.35;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.route-calls.route-clients .calls-board-note {
    display: -webkit-box;
    max-width: 280px;
    color: #737d8f;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    word-break: break-word;
    max-height: 2.7em;
}

body.route-calls.route-clients .calls-board-next-contact {
    display: inline-flex;
    align-items: center;
    color: #5a6477;
    font-size: 0.8rem;
    line-height: 1.2;
    font-weight: 800;
    white-space: nowrap;
}

body.route-calls.route-clients .calls-board-next-contact.is-overdue {
    color: #ff3942;
}

body.route-calls.route-clients .calls-board-call-btn {
    min-width: 142px;
    min-height: 50px;
    padding: 0 1.1rem;
    border-radius: 18px;
    box-shadow: none;
    font-size: 0.88rem;
    line-height: 1;
    font-weight: 800;
    position: relative;
}

body.route-calls.route-clients .calls-board-call-btn::before {
    content: "";
    width: 17px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.46rem;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath d='M6.8 4.5h3.1l1.3 4.2-2 1.7a13.9 13.9 0 0 0 4.4 4.4l1.7-2 4.2 1.3v3.1a1.4 1.4 0 0 1-1.5 1.4C10.5 18.3 5.7 13.5 5.4 6A1.4 1.4 0 0 1 6.8 4.5Z' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath d='M6.8 4.5h3.1l1.3 4.2-2 1.7a13.9 13.9 0 0 0 4.4 4.4l1.7-2 4.2 1.3v3.1a1.4 1.4 0 0 1-1.5 1.4C10.5 18.3 5.7 13.5 5.4 6A1.4 1.4 0 0 1 6.8 4.5Z' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.route-calls.route-clients .calls-board-empty {
    padding: 1.2rem 1.5rem 1.35rem;
    color: #9098a5;
    font-size: 0.88rem;
    line-height: 1.4;
    font-weight: 600;
}

body.route-calls.route-clients .calls-board-card .clients-pagination {
    padding: 1rem 1.5rem 1.2rem;
    border-top: 1px solid #edf1f5;
}

@media (max-width: 1480px) {
    body.route-calls.route-clients .calls-overview-grid {
        gap: 0.62rem;
    }

    body.route-calls.route-clients .calls-overview-grid.is-manager {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    body.route-calls.route-clients .calls-stat-card {
        min-height: 125px;
        padding: 0.88rem 0.82rem 0.82rem;
        gap: 0.66rem;
        border-radius: 18px;
    }

    body.route-calls.route-clients .calls-stat-label {
        font-size: 0.64rem;
    }

    body.route-calls.route-clients .calls-stat-value {
        font-size: clamp(1.76rem, 2.1vw, 2.45rem);
    }

    body.route-calls.route-clients .calls-stat-note {
        font-size: 0.64rem;
    }

    body.route-calls.route-clients .calls-stat-progress {
        height: 9px;
    }

    body.route-calls.route-clients .calls-stat-plan-row strong,
    body.route-calls.route-clients .calls-stat-plan-row span {
        font-size: 0.62rem;
    }
}

@media (max-width: 1040px) {
    body.route-calls.route-clients .calls-overview-grid,
    body.route-calls.route-clients .calls-overview-grid.is-manager {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.route-calls.route-clients .calls-board-head {
        align-items: flex-start;
        flex-direction: column;
    }

    body.route-calls.route-clients .calls-board-toolbar {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 860px) {
    body.route-clients .sidebar-footer-tools { display: none !important; }
    body.route-calls.route-clients .calls-overview-grid,
    body.route-calls.route-clients .calls-overview-grid.is-manager {
        grid-template-columns: 1fr;
        gap: 0.72rem;
    }

    body.route-calls.route-clients .calls-stat-card {
        min-height: 0;
        padding: 1rem 1rem 0.92rem;
        border-radius: 20px;
        gap: 0.76rem;
    }

    body.route-calls.route-clients .calls-stat-value {
        font-size: 2.5rem;
    }

    body.route-calls.route-clients .calls-board-head {
        padding: 1rem 1rem 0.92rem;
    }

    body.route-calls.route-clients .calls-board-toolbar {
        gap: 0.56rem;
    }

    body.route-calls.route-clients .calls-board-filter-popover {
        width: 220px;
    }

    body.route-calls.route-clients .calls-board-group-head {
        padding: 0.84rem 1rem;
    }

    body.route-calls.route-clients .calls-board-table {
        min-width: 100%;
    }

    body.route-calls.route-clients .calls-board-table thead {
        display: none;
    }

    body.route-calls.route-clients .calls-board-table,
    body.route-calls.route-clients .calls-board-table tbody,
    body.route-calls.route-clients .calls-board-table tr,
    body.route-calls.route-clients .calls-board-table td {
        display: block;
        width: 100%;
    }

    body.route-calls.route-clients .calls-board-table tbody {
        display: grid;
        gap: 0.72rem;
        padding: 0.9rem 1rem 1rem;
    }

    body.route-calls.route-clients .calls-board-table tbody td {
        padding: 0.28rem 0;
        border: 0;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 0.8rem;
        background: transparent;
    }

    body.route-calls.route-clients .calls-board-table tbody tr {
        border: 1px solid #e6ebf2;
        border-radius: 16px;
        padding: 0.86rem 0.94rem 0.94rem;
        background: #ffffff;
    }

    body.route-calls.route-clients .calls-board-table td::before {
        content: attr(data-label);
        flex: 0 0 102px;
        color: #8a92a2;
        font-size: 0.68rem;
        line-height: 1.3;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        padding-top: 0.08rem;
    }

    body.route-calls.route-clients .calls-board-table td[data-label="Компания"]::before,
    body.route-calls.route-clients .calls-board-table td[data-label="Действие"]::before {
        display: none;
    }

    body.route-calls.route-clients .calls-board-company {
        width: 100%;
    }

    body.route-calls.route-clients .calls-board-note {
        max-width: none;
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    body.route-calls.route-clients .calls-board-call-btn {
        width: 100%;
        min-width: 0;
        justify-content: center;
    }

    body.route-calls.route-clients .calls-board-card .clients-pagination {
        padding: 0.9rem 1rem 1rem;
    }
}

body.route-scripts.route-clients .scripts-screen {
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-metric-card {
    min-height: 128px;
    display: grid;
    align-content: start;
    gap: 0.46rem;
    padding: 1rem 1.04rem 0.94rem;
    border-radius: 20px;
}

body.route-scripts.route-clients .scripts-metric-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.66rem;
}

body.route-scripts.route-clients .scripts-metric-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

body.route-scripts.route-clients .scripts-metric-icon svg {
    width: 20px;
    height: 20px;
}

body.route-scripts.route-clients .scripts-metric-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    border-radius: 999px;
    padding: 0.3rem 0.72rem;
    font-size: 0.68rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

body.route-scripts.route-clients .scripts-metric-card strong {
    font-size: 2rem;
    line-height: 1;
    letter-spacing: -0.03em;
    color: #17233a;
}

body.route-scripts.route-clients .scripts-metric-card p {
    margin: 0;
    color: #8790a0;
    font-size: 0.76rem;
    line-height: 1.45;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-metric-card.is-active .scripts-metric-icon {
    background: #eaf7ef;
    color: #22945d;
}

body.route-scripts.route-clients .scripts-metric-card.is-active .scripts-metric-pill {
    background: #dff3e7;
    color: #22945d;
}

body.route-scripts.route-clients .scripts-metric-card.is-sphere .scripts-metric-icon {
    background: #eaf1ff;
    color: #396fee;
}

body.route-scripts.route-clients .scripts-metric-card.is-sphere .scripts-metric-pill {
    background: #e3edff;
    color: #396fee;
}

body.route-scripts.route-clients .scripts-metric-card.is-current .scripts-metric-icon {
    background: #fff1df;
    color: #ef7d19;
}

body.route-scripts.route-clients .scripts-metric-card.is-current .scripts-metric-pill {
    background: #fff0df;
    color: #ef7d19;
}

body.route-scripts.route-clients .scripts-metric-card.is-faq .scripts-metric-icon {
    background: #f8eafb;
    color: #ae53d8;
}

body.route-scripts.route-clients .scripts-metric-card.is-faq .scripts-metric-pill {
    background: #f5e4fb;
    color: #ae53d8;
}

body.route-scripts.route-clients .scripts-toolbar-card,
body.route-scripts.route-clients .scripts-library-card,
body.route-scripts.route-clients .scripts-editor-card,
body.route-scripts.route-clients .scripts-showcase-card {
    border-radius: 22px;
}

body.route-scripts.route-clients .scripts-toolbar-card {
    padding: 1rem 1.04rem 1.02rem;
}

body.route-scripts.route-clients .scripts-toolbar-head,
body.route-scripts.route-clients .scripts-library-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
}

body.route-scripts.route-clients .scripts-toolbar-head h2,
body.route-scripts.route-clients .scripts-library-head h2,
body.route-scripts.route-clients .scripts-showcase-head h2 {
    margin: 0;
    color: #17233a;
    font-size: 1.15rem;
    line-height: 1.12;
    font-weight: 700;
    letter-spacing: 0;
}

body.route-scripts.route-clients .scripts-toolbar-head p,
body.route-scripts.route-clients .scripts-library-head p,
body.route-scripts.route-clients .scripts-showcase-note,
body.route-scripts.route-clients .scripts-showcase-kicker {
    margin: 0.24rem 0 0;
    color: #8a92a2;
    font-size: 0.76rem;
    line-height: 1.45;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-toolbar-body {
    display: grid;
    gap: 0.8rem;
    margin-top: 0.9rem;
}

body.route-scripts.route-clients .scripts-search-label {
    display: block;
    margin: 0;
}

body.route-scripts.route-clients .scripts-search-input-wrap {
    display: flex;
    align-items: center;
    gap: 0.52rem;
    min-height: 48px;
    padding: 0.76rem 0.86rem;
    border-radius: 15px;
    border: 1px solid #dfe5ee;
    background: #ffffff;
}

body.route-scripts.route-clients .scripts-search-input-wrap svg {
    width: 17px;
    height: 17px;
    color: #8992a3;
    flex: 0 0 auto;
}

body.route-scripts.route-clients .scripts-search-input-wrap input {
    border: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
    color: #17233a;
}

body.route-scripts.route-clients .scripts-search-input-wrap input::placeholder {
    color: #959ead;
}

body.route-scripts.route-clients .scripts-filter-hidden {
    display: none;
}

body.route-scripts.route-clients .scripts-sphere-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

body.route-scripts.route-clients .scripts-sphere-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0.62rem 0.9rem;
    border-radius: 999px;
    border: 1px solid #dce2eb;
    background: #f7f9fc;
    color: #667083;
    font-size: 0.74rem;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

body.route-scripts.route-clients .scripts-sphere-chip:hover {
    background: #edf3ff;
    color: #2b63de;
    border-color: #d1defa;
}

body.route-scripts.route-clients .scripts-sphere-chip.is-active {
    background: #e8f0ff;
    color: #2e66e2;
    border-color: #cddcff;
    box-shadow: inset 0 0 0 1px rgba(46, 102, 226, 0.04);
}

body.route-scripts.route-clients .scripts-stage {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-showcase-card {
    min-height: 460px;
    display: grid;
    align-content: start;
    gap: 0.92rem;
    padding: 1rem 1.04rem 1rem;
}

body.route-scripts.route-clients .scripts-showcase-card.is-call {
    border-color: rgba(52, 116, 236, 0.2);
}

body.route-scripts.route-clients .scripts-showcase-card.is-meeting {
    border-color: rgba(165, 91, 226, 0.2);
}

body.route-scripts.route-clients .scripts-showcase-card.is-faq {
    border-color: rgba(239, 125, 25, 0.2);
}

body.route-scripts.route-clients .scripts-showcase-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.82rem;
}

body.route-scripts.route-clients .scripts-showcase-kicker {
    margin-top: 0;
}

body.route-scripts.route-clients .scripts-showcase-pills,
body.route-scripts.route-clients .scripts-library-pills,
body.route-scripts.route-clients .scripts-showcase-actions,
body.route-scripts.route-clients .scripts-library-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.44rem;
}

body.route-scripts.route-clients .scripts-content-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    border-radius: 999px;
    padding: 0.26rem 0.64rem;
    font-size: 0.66rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

body.route-scripts.route-clients .scripts-content-pill.is-call {
    background: #e6f0ff;
    color: #2f6fe6;
}

body.route-scripts.route-clients .scripts-content-pill.is-meeting {
    background: #f2e8ff;
    color: #8c4fe3;
}

body.route-scripts.route-clients .scripts-content-pill.is-faq {
    background: #fff0df;
    color: #ef7d19;
}

body.route-scripts.route-clients .scripts-content-pill.is-sphere {
    background: #f2f4f8;
    color: #6c7484;
}

body.route-scripts.route-clients .scripts-content-pill.is-active {
    background: #e6f4eb;
    color: #22945d;
}

body.route-scripts.route-clients .scripts-content-pill.is-inactive {
    background: #f5f0f0;
    color: #9a7b7b;
}

body.route-scripts.route-clients .scripts-content-steps {
    display: grid;
    gap: 0.68rem;
}

body.route-scripts.route-clients .scripts-content-step {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 0.7rem;
    align-items: flex-start;
    padding: 0.68rem 0.72rem;
    border-radius: 16px;
    background: #f8fafc;
    border: 1px solid #eef2f6;
}

body.route-scripts.route-clients .scripts-content-step-num {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    background: #ffffff;
    color: #17233a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.82rem;
    line-height: 1;
    font-weight: 800;
    border: 1px solid #e4e9f0;
}

body.route-scripts.route-clients .scripts-content-step p {
    margin: 0;
    color: #33405c;
    font-size: 0.82rem;
    line-height: 1.55;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-showcase-footer {
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding-top: 0.4rem;
}

body.route-scripts.route-clients .scripts-showcase-meta,
body.route-scripts.route-clients .scripts-library-meta {
    display: grid;
    gap: 0.18rem;
    color: #8a92a2;
    font-size: 0.68rem;
    line-height: 1.45;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-empty-state {
    min-height: 210px;
    display: grid;
    place-content: center;
    gap: 0.24rem;
    text-align: center;
    border: 1px dashed #dce4ee;
    border-radius: 18px;
    background: #fbfcfe;
    padding: 1rem;
}

body.route-scripts.route-clients .scripts-empty-state strong {
    color: #17233a;
    font-size: 1rem;
}

body.route-scripts.route-clients .scripts-empty-state p {
    margin: 0;
    color: #8a92a2;
    font-size: 0.78rem;
    line-height: 1.5;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-empty-state.is-library {
    min-height: 180px;
}

body.route-scripts.route-clients .scripts-library-card,
body.route-scripts.route-clients .scripts-editor-card {
    padding: 1rem 1.04rem;
}

body.route-scripts.route-clients .scripts-library-counter {
    min-width: 44px;
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eef3fb;
    color: #2f6fe6;
    font-size: 1rem;
    line-height: 1;
    font-weight: 800;
}

body.route-scripts.route-clients .scripts-library-list {
    display: grid;
    gap: 0.72rem;
    margin-top: 0.9rem;
}

body.route-scripts.route-clients .scripts-library-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
    padding: 0.9rem 0.94rem;
    border-radius: 18px;
    border: 1px solid #ebeff4;
    background: #fbfcfe;
}

body.route-scripts.route-clients .scripts-library-item.is-muted {
    opacity: 0.82;
}

body.route-scripts.route-clients .scripts-library-main {
    min-width: 0;
    display: grid;
    gap: 0.38rem;
}

body.route-scripts.route-clients .scripts-library-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

body.route-scripts.route-clients .scripts-library-title-row h3 {
    margin: 0;
    color: #17233a;
    font-size: 0.96rem;
    line-height: 1.25;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-library-excerpt {
    margin: 0;
    color: #748093;
    font-size: 0.76rem;
    line-height: 1.55;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-library-side {
    flex: 0 0 auto;
    display: grid;
    justify-items: end;
    gap: 0.52rem;
}

body.route-scripts.route-clients .scripts-editor-form {
    margin-top: 0.9rem;
    display: grid;
    gap: 0.86rem;
}

body.route-scripts.route-clients .scripts-editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-editor-type-switcher {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.56rem;
}

body.route-scripts.route-clients .scripts-editor-type-option {
    position: relative;
    display: inline-flex;
    align-items: center;
}

body.route-scripts.route-clients .scripts-editor-type-option input {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
}

body.route-scripts.route-clients .scripts-editor-type-option span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0.7rem 0.94rem;
    border-radius: 999px;
    border: 1px solid #dce2eb;
    background: #f8fafc;
    color: #6c7484;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 800;
    cursor: pointer;
}

body.route-scripts.route-clients .scripts-editor-type-option.is-active span,
body.route-scripts.route-clients .scripts-editor-type-option input:checked + span {
    background: #e8f0ff;
    border-color: #cbd9ff;
    color: #2e66e2;
}

body.route-scripts.route-clients .scripts-editor-textarea textarea {
    min-height: 240px;
    resize: vertical;
}

body.route-scripts.route-clients .scripts-editor-checkbox {
    color: #6b7485;
    font-size: 0.78rem;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-editor-actions {
    margin-top: 0.1rem;
}

@media (max-width: 1320px) {
    body.route-scripts.route-clients .scripts-stage {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.route-scripts.route-clients .scripts-showcase-card.is-faq {
        grid-column: 1 / -1;
        min-height: 0;
    }
}

@media (max-width: 1120px) {
    body.route-scripts.route-clients .scripts-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.route-scripts.route-clients .scripts-library-item,
    body.route-scripts.route-clients .scripts-showcase-footer,
    body.route-scripts.route-clients .scripts-toolbar-head,
    body.route-scripts.route-clients .scripts-library-head,
    body.route-scripts.route-clients .scripts-library-title-row {
        flex-direction: column;
        align-items: flex-start;
    }

    body.route-scripts.route-clients .scripts-library-side {
        width: 100%;
        justify-items: start;
    }
}

@media (max-width: 860px) {
    body.route-scripts.route-clients .scripts-metrics,
    body.route-scripts.route-clients .scripts-stage,
    body.route-scripts.route-clients .scripts-editor-grid {
        grid-template-columns: 1fr;
    }

    body.route-scripts.route-clients .scripts-toolbar-card,
    body.route-scripts.route-clients .scripts-library-card,
    body.route-scripts.route-clients .scripts-editor-card,
    body.route-scripts.route-clients .scripts-showcase-card {
        padding: 0.92rem;
        border-radius: 18px;
    }

    body.route-scripts.route-clients .scripts-showcase-card {
        min-height: 0;
    }

    body.route-scripts.route-clients .scripts-showcase-pills,
    body.route-scripts.route-clients .scripts-library-pills,
    body.route-scripts.route-clients .scripts-showcase-actions,
    body.route-scripts.route-clients .scripts-library-actions,
    body.route-scripts.route-clients .scripts-editor-type-switcher {
        width: 100%;
    }

    body.route-scripts.route-clients .scripts-content-step {
        grid-template-columns: 30px minmax(0, 1fr);
        gap: 0.56rem;
        padding: 0.62rem;
    }

    body.route-scripts.route-clients .scripts-content-step-num {
        width: 30px;
        height: 30px;
        border-radius: 10px;
        font-size: 0.76rem;
    }
}

body.route-scripts.route-clients .scripts-screen {
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-hero-card,
body.route-scripts.route-clients .scripts-sidebar-card,
body.route-scripts.route-clients .scripts-content-card,
body.route-scripts.route-clients .scripts-editor-card {
    border-radius: 22px;
    box-shadow: none;
}

body.route-scripts.route-clients .scripts-hero-card {
    padding: 1rem 1.04rem 1.04rem;
}

body.route-scripts.route-clients .scripts-hero-head,
body.route-scripts.route-clients .scripts-library-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

body.route-scripts.route-clients .scripts-hero-kicker {
    display: inline-block;
    color: #8d95a3;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.route-scripts.route-clients .scripts-hero-head h2,
body.route-scripts.route-clients .scripts-sidebar-head h2,
body.route-scripts.route-clients .scripts-content-head h2,
body.route-scripts.route-clients .scripts-library-head h2 {
    margin: 0.22rem 0 0;
    color: #18243b;
    font-size: 1.26rem;
    line-height: 1.08;
    font-weight: 700;
    letter-spacing: 0;
}

body.route-scripts.route-clients .scripts-hero-head p,
body.route-scripts.route-clients .scripts-sidebar-head p,
body.route-scripts.route-clients .scripts-content-kicker,
body.route-scripts.route-clients .scripts-library-head p {
    margin: 0.28rem 0 0;
    color: #8a92a2;
    font-size: 0.76rem;
    line-height: 1.5;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-hero-toolbar {
    margin-top: 0.9rem;
}

body.route-scripts.route-clients .scripts-search-label {
    display: block;
    margin: 0;
}

body.route-scripts.route-clients .scripts-search-input-wrap {
    display: flex;
    align-items: center;
    gap: 0.52rem;
    min-height: 48px;
    padding: 0.76rem 0.86rem;
    border-radius: 16px;
    border: 1px solid #dfe5ee;
    background: #fafbfd;
}

body.route-scripts.route-clients .scripts-search-input-wrap svg {
    width: 17px;
    height: 17px;
    color: #8992a3;
    flex: 0 0 auto;
}

body.route-scripts.route-clients .scripts-search-input-wrap input {
    border: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
    color: #17233a;
}

body.route-scripts.route-clients .scripts-search-input-wrap input::placeholder {
    color: #959ead;
}

body.route-scripts.route-clients .scripts-filter-hidden {
    display: none;
}

body.route-scripts.route-clients .scripts-sphere-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 0.82rem;
}

body.route-scripts.route-clients .scripts-sphere-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0.62rem 0.92rem;
    border-radius: 999px;
    border: 1px solid #dde3eb;
    background: #f7f9fc;
    color: #687183;
    font-size: 0.74rem;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

body.route-scripts.route-clients .scripts-sphere-chip:hover {
    background: #edf3ff;
    border-color: #d1ddf5;
    color: #2f66e0;
}

body.route-scripts.route-clients .scripts-sphere-chip.is-active {
    background: #e8f0ff;
    border-color: #cddcff;
    color: #2f66e0;
}

body.route-scripts.route-clients .scripts-layout {
    display: grid;
    grid-template-columns: 310px minmax(0, 1fr);
    gap: 0.72rem;
    align-items: start;
}

body.route-scripts.route-clients .scripts-sidebar-card {
    position: sticky;
    top: 5.2rem;
    padding: 1rem;
    display: grid;
    gap: 0.86rem;
}

body.route-scripts.route-clients .scripts-section-nav {
    display: grid;
    gap: 0.52rem;
}

body.route-scripts.route-clients .scripts-section-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.72rem;
    padding: 0.78rem 0.84rem;
    border-radius: 18px;
    border: 1px solid #e7ebf1;
    background: #fafbfd;
    text-decoration: none;
}

body.route-scripts.route-clients .scripts-section-link.is-call {
    border-color: #dce8ff;
    background: #f7faff;
}

body.route-scripts.route-clients .scripts-section-link.is-meeting {
    border-color: #eadcf8;
    background: #fbf8ff;
}

body.route-scripts.route-clients .scripts-section-link.is-faq {
    border-color: #f5e4cf;
    background: #fffaf4;
}

body.route-scripts.route-clients .scripts-section-link-main {
    min-width: 0;
    display: grid;
    gap: 0.16rem;
}

body.route-scripts.route-clients .scripts-section-link-main strong {
    color: #18243b;
    font-size: 0.82rem;
    line-height: 1.3;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-section-link-main small {
    color: #8b93a2;
    font-size: 0.68rem;
    line-height: 1.4;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-section-link-badge {
    min-width: 32px;
    height: 32px;
    padding: 0 0.45rem;
    border-radius: 11px;
    background: #ffffff;
    border: 1px solid #e4e9f0;
    color: #18243b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.76rem;
    line-height: 1;
    font-weight: 800;
    flex: 0 0 auto;
}

body.route-scripts.route-clients .scripts-sidebar-divider {
    height: 1px;
    background: #edf1f5;
}

body.route-scripts.route-clients .scripts-sidebar-library h3 {
    margin: 0;
    color: #18243b;
    font-size: 0.9rem;
    line-height: 1.2;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-sidebar-empty {
    margin: 0.5rem 0 0;
    color: #8b93a2;
    font-size: 0.74rem;
    line-height: 1.5;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-sidebar-library-list {
    display: grid;
    gap: 0.62rem;
    margin-top: 0.66rem;
}

body.route-scripts.route-clients .scripts-sidebar-library-item {
    display: grid;
    gap: 0.34rem;
    padding: 0.76rem 0.8rem;
    border-radius: 16px;
    background: #fafbfd;
    border: 1px solid #ebeff4;
}

body.route-scripts.route-clients .scripts-sidebar-library-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.42rem;
    flex-wrap: wrap;
}

body.route-scripts.route-clients .scripts-sidebar-library-item strong {
    color: #18243b;
    font-size: 0.8rem;
    line-height: 1.35;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-sidebar-library-item p {
    margin: 0;
    color: #7a8597;
    font-size: 0.72rem;
    line-height: 1.5;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-sidebar-library-item small,
body.route-scripts.route-clients .scripts-showcase-meta {
    color: #8a92a2;
    font-size: 0.68rem;
    line-height: 1.45;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-content-column {
    display: grid;
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-content-card {
    padding: 1rem 1.04rem;
    display: grid;
    gap: 0.92rem;
}

body.route-scripts.route-clients .scripts-content-head,
body.route-scripts.route-clients .scripts-showcase-footer,
body.route-scripts.route-clients .scripts-showcase-actions,
body.route-scripts.route-clients .scripts-library-actions,
body.route-scripts.route-clients .scripts-library-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

body.route-scripts.route-clients .scripts-showcase-pills,
body.route-scripts.route-clients .scripts-library-pills {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.44rem;
}

body.route-scripts.route-clients .scripts-content-title {
    margin: 0;
    color: #17233a;
    font-size: 1.02rem;
    line-height: 1.28;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-content-fallback {
    padding: 0.72rem 0.82rem;
    border-radius: 16px;
    background: #f7f9fc;
    border: 1px solid #e7edf5;
    color: #7a8497;
    font-size: 0.74rem;
    line-height: 1.5;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-content-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    border-radius: 999px;
    padding: 0.28rem 0.66rem;
    font-size: 0.66rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

body.route-scripts.route-clients .scripts-content-pill.is-call {
    background: #e6f0ff;
    color: #2f6fe6;
}

body.route-scripts.route-clients .scripts-content-pill.is-meeting {
    background: #f2e8ff;
    color: #8b4fe2;
}

body.route-scripts.route-clients .scripts-content-pill.is-faq {
    background: #fff0df;
    color: #ef7d19;
}

body.route-scripts.route-clients .scripts-content-pill.is-sphere {
    background: #f1f4f8;
    color: #697284;
}

body.route-scripts.route-clients .scripts-content-pill.is-inactive {
    background: #f4ecec;
    color: #9a7a7a;
}

body.route-scripts.route-clients .scripts-content-steps {
    display: grid;
    gap: 0.62rem;
}

body.route-scripts.route-clients .scripts-content-step {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 0.68rem;
    align-items: flex-start;
    padding: 0.76rem 0.82rem;
    border-radius: 18px;
    background: #fafbfd;
    border: 1px solid #ebeff4;
}

body.route-scripts.route-clients .scripts-content-step-num {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    border: 1px solid #e4e9f0;
    background: #ffffff;
    color: #18243b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    line-height: 1;
    font-weight: 800;
}

body.route-scripts.route-clients .scripts-content-step p {
    margin: 0;
    color: #32405d;
    font-size: 0.82rem;
    line-height: 1.58;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-showcase-footer {
    margin-top: 0.18rem;
}

body.route-scripts.route-clients .scripts-empty-state {
    min-height: 210px;
    display: grid;
    place-content: center;
    gap: 0.24rem;
    text-align: center;
    border: 1px dashed #dce4ee;
    border-radius: 18px;
    background: #fbfcfe;
    padding: 1rem;
}

body.route-scripts.route-clients .scripts-empty-state strong {
    color: #17233a;
    font-size: 1rem;
}

body.route-scripts.route-clients .scripts-empty-state p {
    margin: 0;
    color: #8a92a2;
    font-size: 0.78rem;
    line-height: 1.5;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-editor-card {
    padding: 1rem 1.04rem;
}

body.route-scripts.route-clients .scripts-editor-form {
    margin-top: 0.9rem;
    display: grid;
    gap: 0.86rem;
}

body.route-scripts.route-clients .scripts-editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-editor-type-switcher {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.56rem;
}

body.route-scripts.route-clients .scripts-editor-type-option {
    position: relative;
    display: inline-flex;
    align-items: center;
}

body.route-scripts.route-clients .scripts-editor-type-option input {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
}

body.route-scripts.route-clients .scripts-editor-type-option span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0.7rem 0.94rem;
    border-radius: 999px;
    border: 1px solid #dce2eb;
    background: #f8fafc;
    color: #6c7484;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 800;
    cursor: pointer;
}

body.route-scripts.route-clients .scripts-editor-type-option.is-active span,
body.route-scripts.route-clients .scripts-editor-type-option input:checked + span {
    background: #e8f0ff;
    border-color: #cbd9ff;
    color: #2e66e2;
}

body.route-scripts.route-clients .scripts-editor-textarea textarea {
    min-height: 240px;
    resize: vertical;
}

body.route-scripts.route-clients .scripts-editor-checkbox {
    color: #6b7485;
    font-size: 0.78rem;
    font-weight: 700;
}

@media (max-width: 1180px) {
    body.route-scripts.route-clients .scripts-layout {
        grid-template-columns: 1fr;
    }

    body.route-scripts.route-clients .scripts-sidebar-card {
        position: static;
        top: auto;
    }
}

@media (max-width: 860px) {
    body.route-scripts.route-clients .scripts-hero-card,
    body.route-scripts.route-clients .scripts-sidebar-card,
    body.route-scripts.route-clients .scripts-content-card,
    body.route-scripts.route-clients .scripts-editor-card {
        padding: 0.92rem;
        border-radius: 18px;
    }

    body.route-scripts.route-clients .scripts-hero-head,
    body.route-scripts.route-clients .scripts-library-head,
    body.route-scripts.route-clients .scripts-content-head,
    body.route-scripts.route-clients .scripts-showcase-footer,
    body.route-scripts.route-clients .scripts-library-title-row {
        flex-direction: column;
        align-items: flex-start;
    }

    body.route-scripts.route-clients .scripts-editor-grid {
        grid-template-columns: 1fr;
    }

    body.route-scripts.route-clients .scripts-content-step {
        grid-template-columns: 30px minmax(0, 1fr);
        gap: 0.56rem;
        padding: 0.66rem 0.7rem;
    }

    body.route-scripts.route-clients .scripts-content-step-num {
        width: 30px;
        height: 30px;
        border-radius: 10px;
        font-size: 0.76rem;
    }
}

body.route-scripts.route-clients .scripts-screen {
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-page-card,
body.route-scripts.route-clients .scripts-doc-card,
body.route-scripts.route-clients .scripts-list-card,
body.route-scripts.route-clients .scripts-editor-card {
    border-radius: 22px;
    box-shadow: none;
}

body.route-scripts.route-clients .scripts-page-card,
body.route-scripts.route-clients .scripts-list-card,
body.route-scripts.route-clients .scripts-editor-card {
    padding: 1rem 1.04rem;
}

body.route-scripts.route-clients .scripts-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

body.route-scripts.route-clients .scripts-page-kicker {
    display: inline-block;
    color: #8d95a3;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.route-scripts.route-clients .scripts-page-head h2,
body.route-scripts.route-clients .scripts-doc-head h3 {
    margin: 0.24rem 0 0;
    color: #18243b;
    font-size: 1.2rem;
    line-height: 1.08;
    font-weight: 700;
    letter-spacing: 0;
}

body.route-scripts.route-clients .scripts-page-head p,
body.route-scripts.route-clients .scripts-doc-kicker {
    margin: 0.28rem 0 0;
    color: #8a92a2;
    font-size: 0.76rem;
    line-height: 1.5;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-page-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
    margin-top: 0.86rem;
}

body.route-scripts.route-clients .scripts-search-label {
    display: block;
    margin: 0;
    flex: 1 1 auto;
}

body.route-scripts.route-clients .scripts-search-input-wrap {
    display: flex;
    align-items: center;
    gap: 0.52rem;
    min-height: 48px;
    padding: 0.76rem 0.86rem;
    border-radius: 16px;
    border: 1px solid #dfe5ee;
    background: #fafbfd;
}

body.route-scripts.route-clients .scripts-search-input-wrap svg {
    width: 17px;
    height: 17px;
    color: #8992a3;
    flex: 0 0 auto;
}

body.route-scripts.route-clients .scripts-search-input-wrap input {
    border: 0;
    padding: 0;
    background: transparent;
    box-shadow: none;
    color: #17233a;
}

body.route-scripts.route-clients .scripts-search-input-wrap input::placeholder {
    color: #959ead;
}

body.route-scripts.route-clients .scripts-filter-hidden {
    display: none;
}

body.route-scripts.route-clients .scripts-page-info {
    flex: 0 0 auto;
    display: grid;
    justify-items: end;
    gap: 0.08rem;
}

body.route-scripts.route-clients .scripts-page-info strong {
    color: #18243b;
    font-size: 1.4rem;
    line-height: 1;
    font-weight: 800;
}

body.route-scripts.route-clients .scripts-page-info span {
    color: #8a92a2;
    font-size: 0.7rem;
    line-height: 1.35;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-sphere-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 0.82rem;
}

body.route-scripts.route-clients .scripts-sphere-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0.62rem 0.92rem;
    border-radius: 999px;
    border: 1px solid #dde3eb;
    background: #f7f9fc;
    color: #687183;
    font-size: 0.74rem;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
}

body.route-scripts.route-clients .scripts-sphere-chip.is-active {
    background: #e8f0ff;
    border-color: #cddcff;
    color: #2f66e0;
}

body.route-scripts.route-clients .scripts-docs-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-doc-card {
    display: grid;
    align-content: start;
    gap: 0.84rem;
    padding: 1rem 1.04rem;
    min-height: 420px;
}

body.route-scripts.route-clients .scripts-doc-card.is-call {
    border-color: rgba(52, 116, 236, 0.18);
}

body.route-scripts.route-clients .scripts-doc-card.is-meeting {
    border-color: rgba(165, 91, 226, 0.18);
}

body.route-scripts.route-clients .scripts-doc-card.is-faq {
    border-color: rgba(239, 125, 25, 0.18);
}

body.route-scripts.route-clients .scripts-doc-head,
body.route-scripts.route-clients .scripts-doc-footer,
body.route-scripts.route-clients .scripts-doc-actions,
body.route-scripts.route-clients .scripts-list-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

body.route-scripts.route-clients .scripts-doc-pills {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.44rem;
}

body.route-scripts.route-clients .scripts-doc-title {
    color: #17233a;
    font-size: 1rem;
    line-height: 1.32;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-doc-fallback {
    padding: 0.72rem 0.82rem;
    border-radius: 16px;
    background: #f7f9fc;
    border: 1px solid #e7edf5;
    color: #7a8497;
    font-size: 0.74rem;
    line-height: 1.5;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-content-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    border-radius: 999px;
    padding: 0.28rem 0.66rem;
    font-size: 0.66rem;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

body.route-scripts.route-clients .scripts-content-pill.is-call {
    background: #e6f0ff;
    color: #2f6fe6;
}

body.route-scripts.route-clients .scripts-content-pill.is-meeting {
    background: #f2e8ff;
    color: #8b4fe2;
}

body.route-scripts.route-clients .scripts-content-pill.is-faq {
    background: #fff0df;
    color: #ef7d19;
}

body.route-scripts.route-clients .scripts-content-pill.is-sphere {
    background: #f1f4f8;
    color: #697284;
}

body.route-scripts.route-clients .scripts-content-pill.is-inactive {
    background: #f4ecec;
    color: #9a7a7a;
}

body.route-scripts.route-clients .scripts-doc-steps {
    display: grid;
    gap: 0.62rem;
}

body.route-scripts.route-clients .scripts-doc-step {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 0.68rem;
    align-items: flex-start;
    padding: 0.76rem 0.82rem;
    border-radius: 18px;
    background: #fafbfd;
    border: 1px solid #ebeff4;
}

body.route-scripts.route-clients .scripts-doc-step-num {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    border: 1px solid #e4e9f0;
    background: #ffffff;
    color: #18243b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    line-height: 1;
    font-weight: 800;
}

body.route-scripts.route-clients .scripts-doc-step p {
    margin: 0;
    color: #32405d;
    font-size: 0.82rem;
    line-height: 1.58;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-doc-footer {
    margin-top: auto;
}

body.route-scripts.route-clients .scripts-doc-meta {
    display: grid;
    gap: 0.18rem;
    color: #8a92a2;
    font-size: 0.68rem;
    line-height: 1.45;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-empty-state {
    min-height: 210px;
    display: grid;
    place-content: center;
    gap: 0.24rem;
    text-align: center;
    border: 1px dashed #dce4ee;
    border-radius: 18px;
    background: #fbfcfe;
    padding: 1rem;
}

body.route-scripts.route-clients .scripts-empty-state strong {
    color: #17233a;
    font-size: 1rem;
}

body.route-scripts.route-clients .scripts-empty-state p {
    margin: 0;
    color: #8a92a2;
    font-size: 0.78rem;
    line-height: 1.5;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-empty-state.is-list {
    min-height: 170px;
}

body.route-scripts.route-clients .scripts-list-items {
    display: grid;
    gap: 0.72rem;
    margin-top: 0.9rem;
}

body.route-scripts.route-clients .scripts-list-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
    padding: 0.9rem 0.94rem;
    border-radius: 18px;
    border: 1px solid #ebeff4;
    background: #fbfcfe;
}

body.route-scripts.route-clients .scripts-list-item.is-muted {
    opacity: 0.82;
}

body.route-scripts.route-clients .scripts-list-main {
    min-width: 0;
    display: grid;
    gap: 0.38rem;
}

body.route-scripts.route-clients .scripts-list-main strong {
    color: #17233a;
    font-size: 0.96rem;
    line-height: 1.25;
    font-weight: 700;
}

body.route-scripts.route-clients .scripts-list-main p {
    margin: 0;
    color: #748093;
    font-size: 0.76rem;
    line-height: 1.55;
    font-weight: 600;
}

body.route-scripts.route-clients .scripts-list-side {
    flex: 0 0 auto;
    display: grid;
    justify-items: end;
    gap: 0.52rem;
}

body.route-scripts.route-clients .scripts-editor-form {
    margin-top: 0.9rem;
    display: grid;
    gap: 0.86rem;
}

body.route-scripts.route-clients .scripts-editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.72rem;
}

body.route-scripts.route-clients .scripts-editor-type-switcher {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.56rem;
}

body.route-scripts.route-clients .scripts-editor-type-option {
    position: relative;
    display: inline-flex;
    align-items: center;
}

body.route-scripts.route-clients .scripts-editor-type-option input {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
}

body.route-scripts.route-clients .scripts-editor-type-option span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 0.7rem 0.94rem;
    border-radius: 999px;
    border: 1px solid #dce2eb;
    background: #f8fafc;
    color: #6c7484;
    font-size: 0.72rem;
    line-height: 1;
    font-weight: 800;
    cursor: pointer;
}

body.route-scripts.route-clients .scripts-editor-type-option.is-active span,
body.route-scripts.route-clients .scripts-editor-type-option input:checked + span {
    background: #e8f0ff;
    border-color: #cbd9ff;
    color: #2e66e2;
}

body.route-scripts.route-clients .scripts-editor-textarea textarea {
    min-height: 240px;
    resize: vertical;
}

body.route-scripts.route-clients .scripts-editor-checkbox {
    color: #6b7485;
    font-size: 0.78rem;
    font-weight: 700;
}

@media (max-width: 1320px) {
    body.route-scripts.route-clients .scripts-docs-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.route-scripts.route-clients .scripts-doc-card.is-faq {
        grid-column: 1 / -1;
        min-height: 0;
    }
}

@media (max-width: 1120px) {
    body.route-scripts.route-clients .scripts-page-toolbar,
    body.route-scripts.route-clients .scripts-page-head,
    body.route-scripts.route-clients .scripts-doc-head,
    body.route-scripts.route-clients .scripts-doc-footer,
    body.route-scripts.route-clients .scripts-list-item,
    body.route-scripts.route-clients .scripts-list-title-row {
        flex-direction: column;
        align-items: flex-start;
    }

    body.route-scripts.route-clients .scripts-list-side {
        width: 100%;
        justify-items: start;
    }
}

@media (max-width: 860px) {
    body.route-scripts.route-clients .scripts-docs-grid,
    body.route-scripts.route-clients .scripts-editor-grid {
        grid-template-columns: 1fr;
    }

    body.route-scripts.route-clients .scripts-page-card,
    body.route-scripts.route-clients .scripts-doc-card,
    body.route-scripts.route-clients .scripts-list-card,
    body.route-scripts.route-clients .scripts-editor-card {
        padding: 0.92rem;
        border-radius: 18px;
    }

    body.route-scripts.route-clients .scripts-doc-card {
        min-height: 0;
    }

    body.route-scripts.route-clients .scripts-doc-step {
        grid-template-columns: 30px minmax(0, 1fr);
        gap: 0.56rem;
        padding: 0.66rem 0.7rem;
    }

    body.route-scripts.route-clients .scripts-doc-step-num {
        width: 30px;
        height: 30px;
        border-radius: 10px;
        font-size: 0.76rem;
    }
}

body.page-clients.route-clients .clients-table-card {
    padding: 0;
    border-radius: 26px;
    border: 1px solid #e8ebf0;
    background: #ffffff;
    overflow: hidden;
}

body.page-clients.route-clients .clients-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
}

body.page-clients.route-clients .clients-table th {
    padding: 1rem 1.05rem;
    border-bottom: 1px solid #eef1f4;
    color: #9aa3b1;
    font-size: 0.72rem;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    background: #ffffff;
    white-space: nowrap;
}

body.page-clients.route-clients .clients-table td {
    padding: 1.08rem 1.05rem;
    border-bottom: 1px solid #eef1f4;
    color: #5d6677;
    font-size: 0.95rem;
    line-height: 1.35;
    font-weight: 600;
    background: #ffffff;
    vertical-align: middle;
}

body.page-clients.route-clients .clients-table tbody tr:last-child td {
    border-bottom: 0;
}

body.page-clients.route-clients .clients-table tbody tr:hover td {
    background: #fcfdff;
}

body.page-clients.route-clients .clients-col-company {
    width: 22%;
}

body.page-clients.route-clients .clients-col-contact,
body.page-clients.route-clients .clients-col-phone,
body.page-clients.route-clients .clients-col-next,
body.page-clients.route-clients .clients-col-status,
body.page-clients.route-clients .clients-col-owner {
    white-space: nowrap;
}

body.page-clients.route-clients .clients-col-comment {
    width: 22%;
}

body.page-clients.route-clients .clients-col-contact {
    width: 14%;
}

body.page-clients.route-clients .clients-col-phone {
    width: 12%;
}

body.page-clients.route-clients .clients-col-next {
    width: 12%;
}

body.page-clients.route-clients .clients-col-status {
    width: 10%;
}

body.page-clients.route-clients .clients-col-owner {
    width: 12%;
}

body.page-clients.route-clients .company-cell {
    display: flex;
    align-items: center;
    gap: 0.76rem;
    min-width: 0;
}

body.page-clients.route-clients .company-cell-main {
    min-width: 0;
    display: block;
}

body.page-clients.route-clients .company-cell-icon {
    width: 46px;
    height: 46px;
    border-radius: 999px;
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 1;
    border: 0;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--1 {
    background: #dfeafc;
    color: #2d6be6;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--2 {
    background: #ece4fb;
    color: #7b4fe2;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--3 {
    background: #dff5ee;
    color: #10906f;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--4 {
    background: #fff0df;
    color: #ea7b17;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--5 {
    background: #fde4ea;
    color: #d84f7d;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--6 {
    background: #e3f5fb;
    color: #1f96b7;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--7 {
    background: #e9f8df;
    color: #5a9d21;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--8 {
    background: #f5eaff;
    color: #9556e8;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--9 {
    background: #fff2cf;
    color: #bd8d00;
}

body.page-clients.route-clients .company-cell-icon.company-cell-icon--10 {
    background: #e5ecff;
    color: #486de3;
}

body.page-clients.route-clients .company-link {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #2468d2;
    font-size: 0.94rem;
    line-height: 1.25;
    font-weight: 700;
    text-decoration: none;
}

body.page-clients.route-clients .company-link:hover {
    color: #1f5dc0;
}

body.page-clients.route-clients .clients-cell-text,
body.page-clients.route-clients .phone-nowrap {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #5d6677;
    font-size: 0.92rem;
    line-height: 1.35;
    font-weight: 600;
}

body.page-clients.route-clients .phone-nowrap {
    letter-spacing: 0;
}

body.page-clients.route-clients .clients-comment-text {
    display: -webkit-box;
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    word-break: break-word;
    max-height: 2.7em;
    color: #a1a9b6;
    font-size: 0.9rem;
    line-height: 1.35;
    font-weight: 600;
}

body.page-clients.route-clients .clients-next-contact {
    display: inline-flex;
    align-items: center;
    gap: 0.52rem;
    color: #667181;
    font-size: 0.9rem;
    line-height: 1.2;
    font-weight: 700;
    white-space: nowrap;
}

body.page-clients.route-clients .clients-next-contact.is-overdue {
    color: #ff4654;
}

body.page-clients.route-clients .clients-next-contact-dot {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: currentColor;
    flex: 0 0 auto;
}

body.page-clients.route-clients .clients-table .status-chip,
body.page-clients.route-clients .clients-table .status-chip-btn {
    min-height: 38px;
    padding: 0.5rem 0.84rem;
    border-radius: 999px;
    border-width: 1px;
    border-style: solid;
    font-size: 0.74rem;
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: none;
}

body.page-clients.route-clients .clients-table .status-chip::before,
body.page-clients.route-clients .clients-table .status-chip-btn::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 999px;
    display: inline-block;
    margin-right: 0.52rem;
    background: currentColor;
    vertical-align: middle;
}

body.page-clients.route-clients .clients-table .status-success::before {
    content: "✓";
    width: auto;
    height: auto;
    border-radius: 0;
    background: transparent;
    margin-right: 0.42rem;
    font-size: 0.82rem;
    line-height: 1;
    font-weight: 900;
    color: #1f7f43;
}

body.page-clients.route-clients .clients-table .status-work {
    background: #eef5ff;
    color: #2f72ea;
    border-color: #b9d4ff;
}

body.page-clients.route-clients .clients-table .status-callback {
    background: #f1ebff;
    color: #7a52e2;
    border-color: #d9caff;
}

body.page-clients.route-clients .clients-table .status-meeting {
    background: #fff6e1;
    color: #d08800;
    border-color: #efc95c;
}

body.page-clients.route-clients .clients-table .status-missed {
    background: #fdf0e5;
    color: #eb7c1a;
    border-color: #f3c58d;
}

body.page-clients.route-clients .clients-table .status-new {
    background: #e5f3fb;
    color: #2e9dd6;
    border-color: #b9dff0;
}

body.page-clients.route-clients .clients-table .status-drop {
    background: #f8e8eb;
    color: #da5e79;
    border-color: #efc0ca;
}

body.page-clients.route-clients .clients-table .status-success {
    background: #e8f6eb;
    color: #249c52;
    border-color: #bfe2c8;
}

body.page-clients.route-clients .clients-table .status-archive {
    background: #f2f4f7;
    color: #7c8797;
    border-color: #d9dee5;
}

body.page-clients.route-clients .clients-table .status-default {
    background: #eff3f8;
    color: #5f6f86;
    border-color: #dce2ea;
}

body.page-clients.route-clients .clients-table .status-chip-btn {
    cursor: pointer;
}

body.page-clients.route-clients .clients-table .status-chip-btn:hover {
    filter: none;
    opacity: 0.92;
}

body.page-clients.route-clients .clients-col-actions {
    width: 98px;
}

body.page-clients.route-clients .clients-row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.46rem;
}

body.page-clients.route-clients .clients-action-btn {
    width: 38px;
    height: 38px;
    border-radius: 13px;
    border: 1px solid #eaedf1;
    background: #f7f8fa;
    color: #9aa3b1;
    box-shadow: none;
}

body.page-clients.route-clients .clients-action-btn:hover {
    background: #eef2f7;
    color: #798395;
    transform: none;
}

body.page-clients.route-clients .clients-action-btn svg {
    width: 17px;
    height: 17px;
}

body.page-clients.route-clients .clients-action-btn.is-call {
    text-decoration: none;
}

@media (max-width: 1380px) {
    body.page-clients.route-clients .clients-table th,
    body.page-clients.route-clients .clients-table td {
        padding-left: 0.88rem;
        padding-right: 0.88rem;
    }

    body.page-clients.route-clients .company-cell-icon {
        width: 42px;
        height: 42px;
        font-size: 0.84rem;
    }

    body.page-clients.route-clients .clients-col-company {
        width: 20%;
    }

    body.page-clients.route-clients .clients-col-comment {
        width: 18%;
    }
}

@media (max-width: 1080px) {
    body.page-clients.route-clients .clients-table th,
    body.page-clients.route-clients .clients-table td {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    body.page-clients.route-clients .clients-row-actions {
        gap: 0.52rem;
    }

    body.page-clients.route-clients .clients-action-btn {
        width: 38px;
        height: 38px;
        border-radius: 13px;
    }
}

body {
    background: #edf0f4;
}

.content-wrap,
.content-wrap-auth,
body.route-clients .content-wrap {
    background: #edf0f4;
}

body.page-clients.route-clients .clients-toolbar-card {
    padding: 0.8rem 0.94rem;
    border-radius: 22px;
    overflow: visible;
}

body.page-clients.route-clients .clients-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.62rem;
    align-items: center;
}

body.page-clients.route-clients .clients-search-label {
    min-width: 0;
}

body.page-clients.route-clients .clients-search-input-wrap {
    min-height: 40px;
    border-radius: 14px;
    border: 1px solid #d9dfe7;
    background: #f7f9fc;
    padding: 0.72rem 0.82rem;
    gap: 0.52rem;
}

body.page-clients.route-clients .clients-search-input-wrap svg {
    width: 15px;
    height: 15px;
    color: #98a1b0;
}

body.page-clients.route-clients .clients-search-input-wrap input,
body.page-clients.route-clients .clients-search-input-wrap input::placeholder {
    color: #8e97a5;
    font-size: 0.82rem;
    font-weight: 600;
}

body.page-clients.route-clients .clients-search-input-wrap input {
    color: #384150;
}

body.page-clients.route-clients .clients-filter-form {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.56rem;
    flex-wrap: wrap;
}

body.page-clients.route-clients .clients-filter-inline-label {
    display: block;
    margin: 0;
}

body.page-clients.route-clients .clients-quick-presets {
    display: inline-flex;
    align-items: center;
    gap: 0.38rem;
    flex-wrap: wrap;
}

body.page-clients.route-clients .clients-quick-preset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 0.78rem;
    border-radius: 999px;
    border: 1px solid #d9dfe7;
    background: #f7f9fc;
    color: #697384;
    font-size: 0.74rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

body.page-clients.route-clients .clients-quick-preset:hover {
    background: #eff4fa;
    border-color: #cfd6e1;
    color: #4e5868;
    text-decoration: none;
}

body.page-clients.route-clients .clients-quick-preset.is-active {
    background: #eaf1ff;
    border-color: #c9d8ff;
    color: #2e67da;
}

body.page-clients.route-clients .clients-filter-inline-label select,
body.page-clients.route-clients .clients-filter-popover select {
    min-width: 122px;
    height: 40px;
    border-radius: 14px;
    border: 1px solid #d9dfe7;
    background: #ffffff;
    color: #5d6676;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 0 2.3rem 0 0.95rem;
    box-shadow: none;
}

body.page-clients.route-clients .clients-filter-inline-label select:focus,
body.page-clients.route-clients .clients-filter-popover select:focus {
    border-color: #c9d2de;
    box-shadow: none;
}

body.page-clients.route-clients .clients-toolbar-refresh,
body.page-clients.route-clients .clients-filter-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border-radius: 14px;
    border: 1px solid #d9dfe7;
    background: #f7f9fc;
    color: #7c8594;
    text-decoration: none;
    box-shadow: none;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

body.page-clients.route-clients .clients-toolbar-refresh:hover,
body.page-clients.route-clients .clients-filter-toggle:hover {
    background: #f0f4f9;
    border-color: #cfd6e1;
    color: #5d6674;
    text-decoration: none;
}

body.page-clients.route-clients .clients-toolbar-refresh {
    width: 40px;
    padding: 0;
}

body.page-clients.route-clients .clients-toolbar-reset svg {
    width: 15px;
    height: 15px;
}

body.page-clients.route-clients .clients-toolbar-refresh svg,
body.page-clients.route-clients .clients-filter-toggle svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}

body.page-clients.route-clients .clients-filter-menu {
    position: relative;
}

body.page-clients.route-clients .clients-filter-menu summary {
    list-style: none;
}

body.page-clients.route-clients .clients-filter-menu summary::-webkit-details-marker {
    display: none;
}

body.page-clients.route-clients .clients-filter-toggle {
    gap: 0.4rem;
    padding: 0 0.9rem;
    font-size: 0.8rem;
    font-weight: 800;
    cursor: pointer;
    user-select: none;
}

body.page-clients.route-clients .clients-filter-popover {
    position: absolute;
    top: calc(100% + 0.52rem);
    right: 0;
    z-index: 24;
    width: 292px;
    border-radius: 18px;
    border: 1px solid #d9dfe7;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(28, 40, 60, 0.08);
    padding: 0.84rem 0.88rem;
}

body.page-clients.route-clients .clients-filter-popover-grid {
    display: grid;
    gap: 0.68rem;
}

body.page-clients.route-clients .clients-filter-popover label {
    display: grid;
    gap: 0.32rem;
    margin: 0;
}

body.page-clients.route-clients .clients-filter-popover label span {
    color: #8e97a5;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.02em;
}

body.page-clients.route-clients .clients-filter-date-range {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.58rem;
}

body.page-clients.route-clients .clients-filter-date-range input[type='date'] {
    width: 100%;
    height: 40px;
    border-radius: 14px;
    border: 1px solid #d9dfe7;
    background: #ffffff;
    color: #5d6676;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 0 0.78rem;
    box-shadow: none;
}

body.page-clients.route-clients .clients-filter-date-range input[type='date']:focus {
    border-color: #c9d2de;
    box-shadow: none;
}

body.page-clients.route-clients .clients-filter-actions {
    margin-top: 0.78rem;
    display: flex;
    justify-content: flex-end;
}

body.page-clients.route-clients .clients-filter-actions .btn {
    min-height: 36px;
    padding: 0.46rem 0.82rem;
    border-radius: 12px;
    font-size: 0.76rem;
    font-weight: 800;
}

    body.page-clients.route-clients .clients-filter-actions .btn-ghost {
        background: #f6f8fb;
        border-color: #d9dfe7;
        color: #5f6878;
    }

    body.page-clients.route-clients .clients-filter-period-presets {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
        gap: 0.38rem;
    }

    body.page-clients.route-clients .clients-filter-period-presets .clients-quick-preset {
        width: 100%;
        padding-inline: 0.35rem;
    }

@media (max-width: 1180px) {
    body.page-clients.route-clients .clients-toolbar {
        grid-template-columns: 1fr;
    }

    body.page-clients.route-clients .clients-filter-form {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

@media (max-width: 860px) {
    body.page-clients.route-clients .clients-toolbar-card {
        padding: 0.72rem;
    }

    body.page-clients.route-clients .clients-filter-form {
        width: 100%;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto auto;
        row-gap: 0.52rem;
    }

    body.page-clients.route-clients .clients-filter-inline-label select {
        width: 100%;
        min-width: 0;
    }

    body.page-clients.route-clients .clients-quick-presets {
        grid-column: 1 / -1;
    }

body.page-clients.route-clients .clients-filter-popover {
        left: 0;
        right: auto;
        width: min(292px, calc(100vw - 2rem));
    }
}

[data-async-root] {
    position: relative;
}

[data-async-root].is-loading {
    pointer-events: none;
    overflow: hidden;
}

[data-async-root].is-loading > :not(.async-skeleton) {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.12s ease;
}

.async-skeleton {
    position: absolute;
    inset: 0;
    z-index: 4;
    pointer-events: none;
}

.async-skeleton__metric,
.async-skeleton__toolbar,
.async-skeleton__table-card,
.async-skeleton__group,
.async-skeleton__table-row,
.async-skeleton__avatar,
.async-skeleton__line,
.async-skeleton__pill,
.async-skeleton__counter {
    position: relative;
    overflow: hidden;
}

.async-skeleton__metric::after,
.async-skeleton__toolbar::after,
.async-skeleton__table-card::after,
.async-skeleton__table-row::after,
.async-skeleton__avatar::after,
.async-skeleton__line::after,
.async-skeleton__pill::after,
.async-skeleton__group::after,
.async-skeleton__counter::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(237, 240, 244, 0) 0%,
        rgba(237, 240, 244, 0.35) 35%,
        rgba(237, 240, 244, 0.9) 50%,
        rgba(237, 240, 244, 0.35) 65%,
        rgba(237, 240, 244, 0) 100%
    );
    transform: translateX(-100%);
    animation: asyncShimmer 1.05s linear infinite;
}

.async-skeleton--panel {
    display: grid;
    gap: 0.9rem;
}

.async-skeleton__metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.async-skeleton__metric {
    min-height: 164px;
    border-radius: 28px;
    background: #ffffff;
}

.async-skeleton__toolbar {
    min-height: 72px;
    border-radius: 24px;
    background: #ffffff;
}

.async-skeleton__table-card {
    min-height: 480px;
    border-radius: 28px;
    padding: 1.25rem 1.35rem;
    background: #ffffff;
}

.async-skeleton__table-card::after {
    border-radius: inherit;
}

.async-skeleton__table-row {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 96px;
    align-items: center;
    gap: 1rem;
    min-height: 62px;
    padding: 0.35rem 0;
    background: transparent;
}

.async-skeleton__table-row + .async-skeleton__table-row {
    margin-top: 1rem;
}

.async-skeleton__avatar,
.async-skeleton__counter {
    border-radius: 999px;
    background: #e3e8ef;
}

.async-skeleton__avatar {
    width: 48px;
    height: 48px;
}

.async-skeleton__copy {
    display: grid;
    gap: 0.56rem;
}

.async-skeleton__line {
    display: block;
    border-radius: 999px;
    min-height: 12px;
    background: #e3e8ef;
}

.async-skeleton__line--lg {
    width: min(320px, 72%);
}

.async-skeleton__line--sm {
    width: min(180px, 46%);
    min-height: 10px;
}

.async-skeleton__line--group {
    width: 140px;
}

.async-skeleton__pill {
    min-height: 36px;
    border-radius: 999px;
    background: #e3e8ef;
}

.async-skeleton--calls {
    display: grid;
    gap: 1rem;
}

.async-skeleton--calls .async-skeleton__toolbar {
    min-height: 108px;
    border-radius: 28px;
}

.async-skeleton__group {
    border-radius: 28px;
    padding: 1.1rem 1.2rem;
    background: #ffffff;
}

.async-skeleton__group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.async-skeleton__counter {
    width: 34px;
    height: 34px;
}

.async-skeleton__list {
    display: grid;
    gap: 0.9rem;
}

@keyframes asyncShimmer {
    from {
        transform: translateX(-100%);
    }

    to {
        transform: translateX(100%);
    }
}

@media (max-width: 1180px) {
    .async-skeleton__metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .async-skeleton__metrics {
        grid-template-columns: 1fr;
    }

    .async-skeleton__metric {
        min-height: 118px;
    }

    .async-skeleton__toolbar {
        min-height: 64px;
    }

    .async-skeleton__table-card {
        min-height: 320px;
        padding: 1rem;
    }

    .async-skeleton__table-row {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .async-skeleton__pill {
        display: none;
    }
}

body.route-calls.route-clients .calls-board-search-field {
    min-width: min(320px, 42vw);
    margin: 0;
}

body.route-calls.route-clients .calls-board-search-wrap {
    min-height: 42px;
    border-radius: 14px;
    border: 1px solid #dfe4eb;
    background: #ffffff;
    padding: 0.7rem 0.82rem;
}

body.route-calls.route-clients .calls-board-search-wrap svg {
    color: #98a1b0;
}

body.route-calls.route-clients .calls-board-search-wrap input,
body.route-calls.route-clients .calls-board-search-wrap input::placeholder {
    color: #9099a9;
    font-size: 0.82rem;
    font-weight: 600;
}

body.route-calls.route-clients .calls-board-search-wrap input {
    color: #334052;
}

@media (max-width: 1180px) {
    body.route-calls.route-clients .calls-board-search-field {
        min-width: min(100%, 360px);
        flex: 1 1 100%;
    }
}

/* Final cascade position for the manager dashboard reference theme. */
body.route-dashboard.role-manager .content-wrap { margin-left:var(--mgr-sidebar-w) !important; padding:28px clamp(18px,2.4vw,36px) 36px !important; background:#f5f5f7 !important; }
body.route-dashboard.role-manager .dashboard-manager-layout { grid-template-columns:232px minmax(0,1fr) !important; height:auto !important; background:#f5f5f7 !important; }
body.route-dashboard.role-manager .dashboard-sidepanel { height:100vh !important; min-height:100vh !important; max-height:100vh !important; padding:26px 18px !important; gap:20px !important; color:#1d1d1f !important; border:0 !important; border-right:1px solid rgba(0,0,0,.07) !important; background:#fff !important; box-shadow:none !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-welcome span,body.route-dashboard.role-manager .dashboard-sidepanel-section h2,body.route-dashboard.role-manager .dashboard-sidepanel-goal-card p,body.route-dashboard.role-manager .dashboard-sidepanel-conversion-head,body.route-dashboard.role-manager .dashboard-sidepanel-income-main span,body.route-dashboard.role-manager .dashboard-sidepanel-income-mini span,body.route-dashboard.role-manager .dashboard-sidepanel-income-mini small { color:#6e6e73 !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-welcome strong,body.route-dashboard.role-manager .dashboard-sidepanel-section h2,body.route-dashboard.role-manager .dashboard-sidepanel-goal-main strong,body.route-dashboard.role-manager .dashboard-sidepanel-conversion-head strong,body.route-dashboard.role-manager .dashboard-sidepanel-income-main strong,body.route-dashboard.role-manager .dashboard-sidepanel-income-mini strong { color:#1d1d1f !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-section { border-color:rgba(0,0,0,.07) !important; padding-top:18px !important; gap:12px !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-section h2::before { background:#0071e3 !important; box-shadow:0 0 0 3px rgba(0,113,227,.1) !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-goal-track { stroke:#e8e8ed !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-goal-progress { stroke:#0071e3 !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-goal-badge { color:#1d1d1f !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-goal-caption { color:#98989d !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-conversion-track { height:5px !important; background:#ebebef !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-conversion-track span,body.route-dashboard.role-manager .dashboard-hero-progress span,body.route-dashboard.role-manager .dashboard-hero-progress.is-calls span { background:linear-gradient(90deg,#0071e3,#0a84ff) !important; }
body.route-dashboard.role-manager .dashboard-sidepanel-section.is-income { margin-top:auto !important; }
body.route-dashboard.role-manager .dashboard-manager-main { gap:22px !important; padding:38px clamp(24px,4vw,56px) 56px !important; max-width:1320px !important; }
body.route-dashboard.role-manager .dashboard-reference-topbar { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }
body.route-dashboard.role-manager .dashboard-reference-eyebrow { margin:0 0 6px; color:#0071e3; font-size:13px; font-weight:700; }
body.route-dashboard.role-manager .dashboard-reference-topbar h1 { margin:0; color:#1d1d1f; font-size:clamp(30px,3.4vw,40px); line-height:1.04; letter-spacing:-.04em; }
body.route-dashboard.role-manager .dashboard-reference-date { margin:8px 0 0; color:#6e6e73; font-size:15px; }
body.route-dashboard.role-manager .dashboard-reference-actions { display:flex; gap:10px; flex-wrap:wrap; }
body.route-dashboard.role-manager .dashboard-reference-actions .btn { min-height:42px; border-radius:13px; box-shadow:none; }
body.route-dashboard.role-manager .manager-dashboard { gap:22px !important; }
body.route-dashboard.role-manager .dashboard-hero-focus-chip { width:100% !important; padding:14px 18px !important; border:1px solid rgba(0,0,0,.06) !important; border-radius:16px !important; background:#fff !important; color:#1d1d1f !important; box-shadow:0 1px 2px rgba(0,0,0,.04) !important; }
body.route-dashboard.role-manager .dashboard-hero-focus-icon { width:30px !important; height:30px !important; padding:7px; border-radius:9px; color:#0071e3 !important; background:rgba(0,113,227,.1) !important; }
body.route-dashboard.role-manager .dashboard-hero-strip { gap:16px !important; }
body.route-dashboard.role-manager .dashboard-hero-cell,body.route-dashboard.role-manager .dashboard-engagement-grid>.card,body.route-dashboard.role-manager .dashboard-activity-ten-card { border-color:rgba(0,0,0,.06) !important; border-radius:22px !important; background:#fff !important; box-shadow:0 1px 3px rgba(0,0,0,.04),0 10px 34px rgba(0,0,0,.05) !important; }
body.route-dashboard.role-manager .dashboard-hero-cell { min-height:180px !important; padding:22px !important; }
body.route-dashboard.role-manager .dashboard-hero-title { color:#98989d !important; font-size:11.5px !important; letter-spacing:.06em !important; }
body.route-dashboard.role-manager .dashboard-hero-value { color:#1d1d1f !important; }
body.route-dashboard.role-manager .dashboard-hero-progress { background:#ebebef !important; }
body.route-dashboard.role-manager .dashboard-hero-pill.is-warn { color:#9a5b00 !important; background:rgba(255,159,10,.16) !important; }
body.route-dashboard.role-manager .dashboard-hero-pill.is-good { color:#248a3d !important; background:rgba(52,199,89,.14) !important; }
body.route-dashboard.role-manager .dashboard-hero-pill.is-danger { color:#c4271f !important; background:rgba(255,59,48,.12) !important; }
@media (max-width:1080px) { body.route-dashboard.role-manager .dashboard-manager-layout { grid-template-columns:1fr !important; } body.route-dashboard.role-manager .dashboard-sidepanel { position:static !important; order:2; height:auto !important; min-height:0 !important; max-height:none !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; border-top:1px solid rgba(0,0,0,.07) !important; border-right:0 !important; } }
@media (max-width:720px) { body.route-dashboard.role-manager .dashboard-manager-main { padding:28px 18px 44px !important; } body.route-dashboard.role-manager .dashboard-reference-actions { width:100%; } body.route-dashboard.role-manager .dashboard-reference-actions .btn { flex:1 1 auto; justify-content:center; } body.route-dashboard.role-manager .dashboard-sidepanel { grid-template-columns:1fr !important; } }

/* Exact manager-dashboard composition from the approved reference. */
.crm-reference-dashboard { display:grid; gap:22px; color:#1d1d1f; font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif; }
.crm-ref-topbar { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.crm-ref-eyebrow { margin:0 0 6px; color:#0071e3; font-size:13px; font-weight:700; }
.crm-ref-topbar h1 { margin:0; font-size:clamp(30px,3.4vw,40px); letter-spacing:-.04em; line-height:1.04; }
.crm-ref-date { margin:8px 0 0; color:#6e6e73; font-size:15px; }
.crm-ref-actions { display:flex; flex-wrap:wrap; gap:10px; }
.crm-ref-actions .btn { min-height:42px; border-radius:13px; box-shadow:none; }
.crm-ref-focus { display:flex; align-items:center; gap:12px; padding:14px 18px; border:1px solid rgba(0,0,0,.06); border-radius:16px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.04); }
.crm-ref-focus p { margin:0; color:#6e6e73; font-size:15px; }.crm-ref-focus p strong { color:#1d1d1f; }
.crm-ref-bolt { display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:rgba(0,113,227,.1); color:#0071e3; font-size:22px; line-height:1; }
.crm-ref-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.crm-ref-card { border:1px solid rgba(0,0,0,.06); border-radius:22px; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.04),0 10px 34px rgba(0,0,0,.05); }
.crm-ref-kpi { display:grid; align-content:start; gap:4px; min-height:176px; padding:22px; }
.crm-ref-kpi-head,.crm-ref-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }.crm-ref-kpi-head>span { color:#98989d; font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.crm-ref-kpi-head b { padding:4px 9px; border-radius:999px; font-size:12px; white-space:nowrap; background:rgba(52,199,89,.14); color:#248a3d; }.crm-ref-kpi-head b.is-blue { background:rgba(0,113,227,.1); color:#0071e3; }.crm-ref-kpi-head b.is-warn { background:rgba(255,159,10,.16); color:#9a5b00; }.crm-ref-kpi-head b.is-danger { background:rgba(255,59,48,.12); color:#c4271f; }
.crm-ref-value { margin-top:10px; font-size:40px; font-weight:700; letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums; }.crm-ref-value small { color:#98989d; font-size:22px; }.crm-ref-kpi p { margin:8px 0 0; color:#6e6e73; font-size:13.5px; }.crm-ref-kpi p.is-amber,.crm-ref-overdue { color:#9a5b00; font-weight:650; }
.crm-ref-zone { display:grid; grid-template-columns:1.55fr 1fr; gap:16px; }.crm-ref-panel-head { align-items:flex-start; padding:20px 24px 0; }.crm-ref-panel-head h2 { margin:0; font-size:18px; letter-spacing:-.02em; }.crm-ref-panel-head p { margin:2px 0 0; color:#98989d; font-size:13px; }.crm-ref-panel-head>a { color:#0071e3; font-size:14px; font-weight:600; text-decoration:none; }
.crm-ref-plan-content { display:flex; align-items:center; gap:28px; padding:24px; }.crm-ref-ring { position:relative; flex:0 0 148px; width:148px; height:148px; }.crm-ref-ring svg { width:148px; height:148px; transform:rotate(-90deg); }.crm-ref-ring circle { fill:none; stroke:#ebebef; stroke-width:12; }.crm-ref-ring .crm-ref-ring-progress { stroke:#0071e3; stroke-linecap:round; }.crm-ref-ring>div { position:absolute; inset:0; display:grid; place-content:center; text-align:center; }.crm-ref-ring strong { font-size:34px; letter-spacing:-.03em; }.crm-ref-ring span { margin-top:4px; color:#98989d; font-size:12.5px; }
.crm-ref-funnel { display:grid; flex:1; gap:16px; min-width:0; }.crm-ref-funnel p { display:flex; justify-content:space-between; margin:0 0 7px; font-size:13.5px; }.crm-ref-funnel p span { color:#6e6e73; }.crm-ref-funnel i,.crm-ref-income-bar { display:block; height:6px; overflow:hidden; border-radius:999px; background:#ebebef; }.crm-ref-funnel em,.crm-ref-income-bar span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#0071e3,#0a84ff); }
.crm-ref-income-card { padding-bottom:24px; }.crm-ref-income-value { padding:25px 24px 0; font-size:40px; font-weight:700; letter-spacing:-.04em; line-height:1; }.crm-ref-income-sub { margin:8px 24px 0; color:#6e6e73; font-size:14px; }.crm-ref-income-sub b { color:#1d1d1f; }.crm-ref-income-bar { height:8px; margin:18px 24px 5px; }.crm-ref-income-label { display:flex; justify-content:space-between; margin:0 24px; color:#98989d; font-size:12px; }.crm-ref-income-stats { display:flex; gap:10px; margin:20px 24px 0; }.crm-ref-income-stats div { flex:1; display:grid; gap:3px; padding:12px 10px; border-radius:14px; background:#fbfbfd; }.crm-ref-income-stats small { color:#98989d; font-size:10px; font-weight:700; }.crm-ref-income-stats b { font-size:16px; letter-spacing:-.02em; }.crm-ref-income-stats span { color:#248a3d; font-size:12px; font-weight:700; }
.crm-ref-list-head { align-items:center; }.crm-ref-segments { display:flex; gap:2px; padding:3px; border-radius:11px; background:#eeeef0; }.crm-ref-segments span { padding:6px 9px; color:#6e6e73; font-size:12px; white-space:nowrap; }.crm-ref-segments .is-current { border-radius:9px; background:#fff; color:#1d1d1f; box-shadow:0 1px 2px rgba(0,0,0,.08); }.crm-ref-list,.crm-ref-meetings { padding:6px 10px 12px; }.crm-ref-row,.crm-ref-meeting-row { display:flex; align-items:center; gap:14px; padding:14px; border-radius:14px; }.crm-ref-row+.crm-ref-row,.crm-ref-meeting-row+.crm-ref-meeting-row { border-top:1px solid rgba(0,0,0,.07); }.crm-ref-avatar { display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; border-radius:12px; color:#fff; font-size:15px; font-weight:700; }.crm-ref-avatar-0{background:linear-gradient(160deg,#ff6b6b,#e23744)}.crm-ref-avatar-1{background:linear-gradient(160deg,#34c759,#248a3d)}.crm-ref-avatar-2{background:linear-gradient(160deg,#0a84ff,#0057c7)}.crm-ref-avatar-3{background:linear-gradient(160deg,#af52de,#8944ab)}.crm-ref-avatar-4{background:linear-gradient(160deg,#ff9f0a,#d97a00)}
.crm-ref-row>div,.crm-ref-meeting-row p { display:grid; gap:2px; flex:1; min-width:0; margin:0; }.crm-ref-row strong,.crm-ref-meeting-row b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; }.crm-ref-row small,.crm-ref-meeting-row span { color:#98989d; font-size:13px; }.crm-ref-row>a { padding:7px 12px; border:1px solid rgba(0,0,0,.07); border-radius:10px; color:#1d1d1f; font-size:13px; font-weight:600; text-decoration:none; }.crm-ref-meeting-row>div { flex:0 0 52px; display:grid; gap:2px; }.crm-ref-meeting-row>div strong { font-size:16px; }.crm-ref-meeting-row>div small { color:#98989d; font-size:11px; }.crm-ref-meeting-row em { padding:4px 9px; border-radius:999px; background:rgba(255,159,10,.16); color:#9a5b00; font-size:11.5px; font-style:normal; font-weight:700; }.crm-ref-empty { padding:20px 14px; color:#98989d; }
@media(max-width:1080px){.crm-ref-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.crm-ref-zone{grid-template-columns:1fr}}@media(max-width:720px){.crm-ref-actions{width:100%}.crm-ref-actions .btn{flex:1;justify-content:center}.crm-ref-kpis{grid-template-columns:1fr}.crm-ref-plan-content{flex-direction:column;align-items:stretch}.crm-ref-ring{align-self:center}.crm-ref-list-head{align-items:flex-start;flex-direction:column}.crm-ref-segments{max-width:100%;overflow:auto}.crm-ref-row,.crm-ref-meeting-row{gap:9px;padding:12px}.crm-ref-row>a{display:none}.crm-ref-overdue{font-size:12px}.crm-ref-income-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-left:16px;margin-right:16px}.crm-ref-panel-head{padding-left:18px;padding-right:18px}}

/* Clients and calls: frame and density from the approved workspace references. */
body.page-clients.route-clients .content-wrap,
body.route-calls.route-clients .content-wrap { padding:32px clamp(20px,3vw,44px) 52px; background:#f5f5f7; }
body.page-clients.route-clients .global-page-header,
body.route-calls.route-clients .global-page-header { margin:0 0 24px; padding:0; border:0; background:transparent; }
body.page-clients.route-clients .global-page-header-left,
body.route-calls.route-clients .global-page-header-left { gap:16px; }
body.page-clients.route-clients .global-page-header h1,
body.route-calls.route-clients .global-page-header h1 { color:#1d1d1f; font-size:clamp(24px,2.4vw,30px); font-weight:700; letter-spacing:-.03em; }
body.page-clients.route-clients .global-page-date,
body.route-calls.route-clients .global-page-date { margin:0; color:#6e6e73; font-size:14px; font-weight:500; }
body.page-clients.route-clients .global-focus-chip,
body.route-calls.route-clients .global-focus-chip { padding:8px 15px; color:#d73b35; background:rgba(255,59,48,.12); font-size:13.5px; font-weight:600; }
body.page-clients.route-clients .global-quick-action,
body.route-calls.route-clients .global-quick-action { min-height:38px; padding:9px 16px; border-radius:12px; border-color:#e2e3e7; color:#1d1d1f; font-size:14px; font-weight:600; }
body.page-clients.route-clients .global-quick-action.is-primary,
body.route-calls.route-clients .global-quick-action.is-primary { border-color:#0071e3; background:#0071e3; box-shadow:0 4px 14px rgba(0,113,227,.28); }
body.page-clients.route-clients .clients-screen { gap:18px; }
body.page-clients.route-clients .clients-metrics { gap:16px; }
body.page-clients.route-clients .clients-overview-card { min-height:150px; padding:20px; border-radius:18px; border-color:#e3e3e7; box-shadow:0 8px 26px rgba(20,25,35,.04); }
body.page-clients.route-clients .clients-toolbar-card { padding:0; border:0; background:transparent; box-shadow:none; }
body.page-clients.route-clients .clients-toolbar { gap:12px; }
body.page-clients.route-clients .clients-search-input-wrap { min-height:46px; border-radius:14px; background:#fff; box-shadow:0 2px 8px rgba(20,25,35,.04); }
body.page-clients.route-clients .clients-filter-inline-label select,
body.page-clients.route-clients .clients-quick-preset,
body.page-clients.route-clients .clients-toolbar-refresh,
body.page-clients.route-clients .clients-filter-toggle { min-height:46px; border-radius:12px; background:#fff; box-shadow:0 2px 8px rgba(20,25,35,.04); }
body.route-calls.route-clients .calls-overview { margin-bottom:22px; }
body.route-calls.route-clients .calls-stat-card { min-height:150px; padding:20px; border-radius:18px; gap:7px; box-shadow:0 8px 26px rgba(20,25,35,.04); }
body.route-calls.route-clients .calls-stat-head { justify-content:space-between; }
body.route-calls.route-clients .calls-stat-icon { width:40px; height:40px; border-radius:12px; background:#eaf3ff; color:#0071e3; }
body.route-calls.route-clients .calls-stat-icon svg { width:20px; height:20px; }
body.route-calls.route-clients .calls-stat-card--idle .calls-stat-icon { background:rgba(255,59,48,.12); color:#ff3b30; }
body.route-calls.route-clients .calls-stat-card--plan .calls-stat-icon { background:rgba(255,159,10,.16); color:#ff9f0a; }
body.route-calls.route-clients .calls-stat-chip { display:inline-flex; align-items:center; min-height:25px; padding:5px 10px; border-radius:999px; font-size:12px; line-height:1; font-weight:700; white-space:nowrap; }
body.route-calls.route-clients .calls-stat-chip.is-danger { color:#ff3b30; background:rgba(255,59,48,.12); }
body.route-calls.route-clients .calls-stat-chip.is-amber { color:#c47700; background:rgba(255,159,10,.16); }
body.route-calls.route-clients .calls-stat-value { font-size:34px; color:#1d1d1f; }
body.route-calls.route-clients .calls-stat-card--idle.is-alert .calls-stat-value { color:#ff3b30; }
body.route-calls.route-clients .calls-stat-card--plan { background:#fff7e8; border-color:rgba(255,159,10,.25); }
body.route-calls.route-clients .calls-stat-card--plan .calls-stat-value { color:#ff9f0a; }
body.route-calls.route-clients .calls-stat-label { color:#6e6e73; font-size:13.5px; font-weight:500; }
body.route-calls.route-clients .calls-stat-note { color:#98989d; font-size:12.5px; font-weight:500; }
body.route-calls.route-clients .calls-stat-card--idle .calls-stat-note { color:#d73b35; }
body.route-calls.route-clients .calls-stat-progress { height:6px; }
body.route-calls.route-clients .calls-board-card { border-radius:18px; border-color:#e3e3e7; box-shadow:0 8px 26px rgba(20,25,35,.04); }
body.route-calls.route-clients .calls-board-head { padding:22px 24px 18px; }
body.route-calls.route-clients .calls-board-heading h2 { color:#1d1d1f; font-size:19px; font-weight:650; }
@media (max-width:860px){body.page-clients.route-clients .content-wrap,body.route-calls.route-clients .content-wrap{padding:24px 16px 40px}body.page-clients.route-clients .global-page-header,body.route-calls.route-clients .global-page-header{display:none}.calls-stat-chip{max-width:calc(100% - 48px);overflow:hidden;text-overflow:ellipsis}}

/* Measured desktop geometry of crm-clients.html and crm-calls.html. */
@media (min-width:861px){
    body.page-clients.route-clients .sidebar,
    body.route-calls.route-clients .sidebar { width:auto !important; padding:22px 15px 20px !important; }
    body.page-clients.route-clients .app-layout,
    body.route-calls.route-clients .app-layout { grid-template-columns:76px minmax(0,1fr) !important; }
    body.page-clients.route-clients .content-wrap,
    body.route-calls.route-clients .content-wrap { margin-left:0; }
    body.page-clients.route-clients .sidebar-brand-icon,
    body.route-calls.route-clients .sidebar-brand-icon { width:38px; height:38px; border-radius:11px; color:#fff; background:linear-gradient(160deg,#0071e3,#0a84ff); box-shadow:0 4px 12px rgba(0,113,227,.35); }
    body.page-clients.route-clients .sidebar-brand-icon svg,
    body.route-calls.route-clients .sidebar-brand-icon svg { display:none; }
    body.page-clients.route-clients .sidebar-brand-icon::after,
    body.route-calls.route-clients .sidebar-brand-icon::after { content:"c"; font-size:17px; font-weight:700; line-height:1; }
    body.page-clients.route-clients .sidebar-nav a,
    body.route-calls.route-clients .sidebar-nav a { width:46px; height:46px; border-radius:13px; }
    body.page-clients.route-clients .clients-overview-card { display:flex; flex-direction:column; height:198px; min-height:198px; padding:20px; border-radius:18px; gap:0; }
    body.page-clients.route-clients .clients-overview-head { margin-bottom:10px; }
    body.page-clients.route-clients .clients-overview-icon { width:40px; height:40px; border-radius:12px; }
    body.page-clients.route-clients .clients-overview-icon svg { width:20px; height:20px; }
    body.page-clients.route-clients .clients-overview-chip { min-height:25px; padding:5px 10px; font-size:12px; }
    body.page-clients.route-clients .clients-overview-value { font-size:34px; }
    body.page-clients.route-clients .clients-overview-label { margin:7px 0 0; font-size:13.5px; font-weight:500; }
    body.page-clients.route-clients .clients-overview-progress { height:6px; margin-top:auto; }
    body.page-clients.route-clients .clients-overview-meta,
    body.page-clients.route-clients .clients-overview-meta-row { margin-top:7px; font-size:12.5px; }
    body.page-clients.route-clients .clients-overview-days { margin-top:auto; gap:8px; }
    body.page-clients.route-clients .clients-overview-days span { min-height:26px; border-radius:8px; }
    body.page-clients.route-clients .clients-overview-bars { min-height:26px; margin-top:auto; gap:6px; }
    body.page-clients.route-clients .clients-overview-bars span { border-radius:7px; }
}

/* Exact table rhythm from the supplied clients and calls references. */
@media (min-width:861px){
    body.page-clients.route-clients .clients-table { table-layout:fixed; }
    body.page-clients.route-clients .clients-table th,
    body.page-clients.route-clients .clients-table td { padding:16px !important; }
    body.page-clients.route-clients .clients-table th:first-child,
    body.page-clients.route-clients .clients-table td:first-child { width:24.24%; padding-left:24px !important; }
    body.page-clients.route-clients .clients-table th:nth-child(2),
    body.page-clients.route-clients .clients-table td:nth-child(2) { width:8.52%; }
    body.page-clients.route-clients .clients-table th:nth-child(3),
    body.page-clients.route-clients .clients-table td:nth-child(3) { width:11.55%; }
    body.page-clients.route-clients .clients-table th:nth-child(4),
    body.page-clients.route-clients .clients-table td:nth-child(4) { width:20.78%; }
    body.page-clients.route-clients .clients-table th:nth-child(5),
    body.page-clients.route-clients .clients-table td:nth-child(5) { width:12.70%; }
    body.page-clients.route-clients .clients-table th:nth-child(6),
    body.page-clients.route-clients .clients-table td:nth-child(6) { width:11.55%; }
    body.page-clients.route-clients .clients-table th:last-child,
    body.page-clients.route-clients .clients-table td:last-child { width:10.66%; padding-right:24px !important; }
    body.page-clients.route-clients .clients-col-phone .phone-nowrap { white-space:normal; overflow:visible; text-overflow:clip; }
    body.page-clients.route-clients .company-cell-icon { width:40px; height:40px; border-radius:11px; color:#fff !important; }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--1 { background:linear-gradient(160deg,#ff6b6b,#e23744); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--2 { background:linear-gradient(160deg,#34c759,#248a3d); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--3 { background:linear-gradient(160deg,#0a84ff,#0057c7); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--4 { background:linear-gradient(160deg,#af52de,#8944ab); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--5 { background:linear-gradient(160deg,#ff9f0a,#d97a00); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--6 { background:linear-gradient(160deg,#ff2d92,#c21e6b); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--7 { background:linear-gradient(160deg,#30b0c7,#08798f); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--8 { background:linear-gradient(160deg,#5e5ce6,#3634a3); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--9 { background:linear-gradient(160deg,#ff9f0a,#c46b00); }
    body.page-clients.route-clients .company-cell-icon.company-cell-icon--10 { background:linear-gradient(160deg,#34c759,#198747); }
    body.route-calls.route-clients .calls-overview { margin-bottom:23px; }
    body.route-calls.route-clients .calls-stat-card { min-height:208px; }
    body.route-calls.route-clients .calls-overview-grid.is-manager { gap:14px; }
    body.route-calls.route-clients .calls-board-group.is-call .calls-board-group-head { background:#fff; padding:14px 24px 0; }
    body.route-calls.route-clients .calls-board-group.is-call .calls-board-group-head h3 { padding-bottom:12px; border-bottom:2px solid #0071e3; }
    body.route-calls.route-clients .calls-board-group.is-call .calls-board-group-count { margin-bottom:12px; }
    body.route-calls.route-clients .calls-board-table { min-width:0; table-layout:fixed; }
    body.route-calls.route-clients .calls-board-table th { padding:14px 16px; }
    body.route-calls.route-clients .calls-board-table tbody td { padding:0.55rem 1.5rem; }
    body.route-calls.route-clients .calls-board-table thead th { white-space:nowrap; line-height:1.18; }
    body.route-calls.route-clients .calls-board-phone { white-space:nowrap; overflow:visible; text-overflow:clip; }
    body.route-calls.route-clients .calls-board-table th:first-child,
    body.route-calls.route-clients .calls-board-table td:first-child { width:260px; padding-left:24px; }
    body.route-calls.route-clients .calls-board-table th:nth-child(2),
    body.route-calls.route-clients .calls-board-table td:nth-child(2) { width:70px; }
    body.route-calls.route-clients .calls-board-table th:nth-child(3),
    body.route-calls.route-clients .calls-board-table td:nth-child(3) { width:170px; }
    body.route-calls.route-clients .calls-board-table th:nth-child(4),
    body.route-calls.route-clients .calls-board-table td:nth-child(4) { width:105px; }
    body.route-calls.route-clients .calls-board-table th:nth-child(5),
    body.route-calls.route-clients .calls-board-table td:nth-child(5) { width:150px; }
    body.route-calls.route-clients .calls-board-table th:nth-child(6),
    body.route-calls.route-clients .calls-board-table td:nth-child(6) { width:220px; }
    body.route-calls.route-clients .calls-board-table th:last-child,
    body.route-calls.route-clients .calls-board-table td:last-child { width:150px; padding-right:24px; }
    body.route-calls.route-clients .calls-board-call-btn { min-width:108px; min-height:40px; padding:0 0.75rem; border-radius:12px; font-size:0.78rem; }
}

/* Meetings and tasks use the same compact workspace as Clients and Calls. */
body.route-meetings.route-clients .content-wrap,
body.route-tasks.route-clients .content-wrap { padding:32px clamp(20px,3vw,44px) 52px; background:#f5f5f7; }
body.route-meetings.route-clients .global-page-header,
body.route-tasks.route-clients .global-page-header { margin:0 0 24px; padding:0; border:0; background:transparent; }
body.route-meetings.route-clients .global-page-header-left,
body.route-tasks.route-clients .global-page-header-left { gap:16px; }
body.route-meetings.route-clients .global-page-header h1,
body.route-tasks.route-clients .global-page-header h1 { color:#1d1d1f; font-size:clamp(24px,2.4vw,30px); font-weight:700; letter-spacing:-.03em; }
body.route-meetings.route-clients .global-page-date,
body.route-tasks.route-clients .global-page-date { margin:0; color:#6e6e73; font-size:14px; font-weight:500; }
body.route-meetings.route-clients .global-focus-chip,
body.route-tasks.route-clients .global-focus-chip { padding:8px 15px; color:#d73b35; background:rgba(255,59,48,.12); font-size:13.5px; font-weight:600; }
body.route-meetings.route-clients .global-quick-action,
body.route-tasks.route-clients .global-quick-action { min-height:38px; padding:9px 16px; border-radius:12px; border-color:#e2e3e7; color:#1d1d1f; font-size:14px; font-weight:600; }
body.route-meetings.route-clients .global-quick-action.is-primary,
body.route-tasks.route-clients .global-quick-action.is-primary { border-color:#0071e3; background:#0071e3; box-shadow:0 4px 14px rgba(0,113,227,.28); }

body.route-meetings.route-clients .meetings-screen,
body.route-tasks.route-clients .tasks-screen { gap:0; }
body.route-meetings.route-clients .meetings-overview-grid,
body.route-tasks.route-clients .meetings-overview-grid { gap:16px; margin:0; }
body.route-meetings.route-clients .meetings-overview-card,
body.route-tasks.route-clients .meetings-overview-card { min-height:198px; padding:20px; border:1px solid #e3e3e7; border-radius:18px; background:#fff; box-shadow:0 8px 26px rgba(20,25,35,.04); }
body.route-meetings.route-clients .meetings-overview-card,
body.route-tasks.route-clients .meetings-overview-card { min-height:172px; height:172px; padding:16px 18px; gap:0; }
body.route-meetings.route-clients .meetings-overview-card-waiting,
body.route-tasks.route-clients .meetings-overview-card-waiting { border-color:rgba(255,159,10,.26); background:#fffaf1; }
body.route-meetings.route-clients .meetings-overview-head,
body.route-tasks.route-clients .meetings-overview-head { margin-bottom:10px; }
body.route-meetings.route-clients .meetings-overview-icon,
body.route-tasks.route-clients .meetings-overview-icon { width:40px; height:40px; border-radius:12px; }
body.route-meetings.route-clients .meetings-overview-icon svg,
body.route-tasks.route-clients .meetings-overview-icon svg { width:20px; height:20px; }
body.route-meetings.route-clients .meetings-overview-chip,
body.route-tasks.route-clients .meetings-overview-chip { min-height:25px; padding:5px 10px; border:0; font-size:12px; }
body.route-meetings.route-clients .meetings-overview-value,
body.route-tasks.route-clients .meetings-overview-value { font-size:34px; color:#1d1d1f; }
body.route-meetings.route-clients .meetings-overview-value-amber,
body.route-tasks.route-clients .meetings-overview-value-amber { color:#c47700; }
body.route-meetings.route-clients .meetings-overview-label,
body.route-tasks.route-clients .meetings-overview-label { margin:7px 0 0; color:#6e6e73; font-size:13.5px; font-weight:500; }
body.route-meetings.route-clients .meetings-overview-progress,
body.route-tasks.route-clients .meetings-overview-progress { height:6px; margin-top:auto; }
body.route-meetings.route-clients .meetings-overview-meta,
body.route-meetings.route-clients .meetings-overview-meta-row,
body.route-tasks.route-clients .meetings-overview-meta,
body.route-tasks.route-clients .meetings-overview-meta-row { margin-top:7px; font-size:12.5px; }
body.route-meetings.route-clients .meetings-overview-weekdays,
body.route-tasks.route-clients .meetings-overview-weekdays { margin-top:auto; gap:8px; }
body.route-meetings.route-clients .meetings-overview-weekdays span,
body.route-tasks.route-clients .meetings-overview-weekdays span { min-height:26px; border-radius:8px; }
body.route-meetings.route-clients .meetings-overview-bars,
body.route-tasks.route-clients .meetings-overview-bars { min-height:26px; margin-top:auto; gap:6px; }
body.route-meetings.route-clients .meetings-overview-bars span,
body.route-tasks.route-clients .meetings-overview-bars span { border-radius:7px; }

body.route-meetings.route-clients .clients-toolbar-card,
body.route-tasks.route-clients .clients-toolbar-card { padding:14px 16px; border:1px solid #e3e3e7; border-radius:18px; background:#fff; box-shadow:0 8px 26px rgba(20,25,35,.04); }
body.route-meetings.route-clients .meetings-filter-form,
body.route-tasks.route-clients .clients-toolbar { gap:12px; }
body.route-meetings.route-clients .clients-search-input-wrap,
body.route-tasks.route-clients .clients-search-input-wrap { min-height:46px; border-radius:14px; background:#f8f8fa; box-shadow:none; }
body.route-meetings.route-clients .meetings-filter-form select,
body.route-meetings.route-clients .meetings-filter-form input[type='date'],
body.route-tasks.route-clients .clients-filter-form select { min-height:42px; border-radius:12px; background:#f8f8fa; }
body.route-meetings.route-clients .clients-filter-actions .btn-ghost,
body.route-tasks.route-clients .clients-filter-actions .btn-ghost { min-height:42px; border-radius:12px; }

body.route-meetings.route-clients .clients-table-card,
body.route-tasks.route-clients .clients-table-card { overflow:hidden; border:1px solid #e3e3e7; border-radius:18px; background:#fff; box-shadow:0 8px 26px rgba(20,25,35,.04); }
body.route-meetings.route-clients .table-wrap,
body.route-tasks.route-clients .table-wrap { overflow-x:auto; }
body.route-meetings.route-clients .meetings-table,
body.route-tasks.route-clients .tasks-table { width:100%; min-width:0; table-layout:fixed; }
body.route-meetings.route-clients .meetings-table th,
body.route-tasks.route-clients .tasks-table th { padding:14px 16px; color:#98989d; background:#fbfbfc; font-size:11px; font-weight:700; letter-spacing:.055em; line-height:1.18; text-transform:uppercase; white-space:nowrap; }
body.route-meetings.route-clients .meetings-table td,
body.route-tasks.route-clients .tasks-table td { padding:0.7rem 1rem; color:#303036; font-size:13.5px; vertical-align:middle; }
body.route-meetings.route-clients .meetings-table th:first-child,
body.route-meetings.route-clients .meetings-table td:first-child,
body.route-tasks.route-clients .tasks-table th:first-child,
body.route-tasks.route-clients .tasks-table td:first-child { padding-left:20px; }
body.route-meetings.route-clients .meetings-table th:last-child,
body.route-meetings.route-clients .meetings-table td:last-child,
body.route-tasks.route-clients .tasks-table th:last-child,
body.route-tasks.route-clients .tasks-table td:last-child { padding-right:20px; }
body.route-meetings.route-clients .meetings-table tbody tr:hover td,
body.route-tasks.route-clients .tasks-table tbody tr:hover td { background:#f8fbff; }
body.route-meetings.route-clients .meeting-status-chip,
body.route-tasks.route-clients .tasks-table .status-chip { display:inline-flex; align-items:center; min-height:26px; padding:5px 10px; border-radius:999px; font-size:12px; font-weight:650; white-space:nowrap; }
body.route-meetings.route-clients .meeting-col-actions .icon-btn,
body.route-tasks.route-clients .task-col-actions .icon-btn { width:34px; height:34px; border-radius:10px; }
body.route-meetings.route-clients .clients-pagination,
body.route-tasks.route-clients .clients-pagination { margin-top:0; }

@media (min-width:861px){
    body.route-tasks.route-clients .tasks-screen > .clients-topbar { display:none; }
    body.route-meetings.route-clients .sidebar,
    body.route-tasks.route-clients .sidebar { width:auto !important; padding:22px 15px 20px !important; }
    body.route-meetings.route-clients .app-layout,
    body.route-tasks.route-clients .app-layout { grid-template-columns:76px minmax(0,1fr) !important; }
    body.route-meetings.route-clients .sidebar-brand-icon,
    body.route-tasks.route-clients .sidebar-brand-icon { width:38px; height:38px; border-radius:11px; color:#fff; background:linear-gradient(160deg,#0071e3,#0a84ff); box-shadow:0 4px 12px rgba(0,113,227,.35); }
    body.route-meetings.route-clients .sidebar-brand-icon svg,
    body.route-tasks.route-clients .sidebar-brand-icon svg { display:none; }
    body.route-meetings.route-clients .sidebar-brand-icon::after,
    body.route-tasks.route-clients .sidebar-brand-icon::after { content:"c"; font-size:17px; font-weight:700; line-height:1; }
    body.route-meetings.route-clients .sidebar-nav a,
    body.route-tasks.route-clients .sidebar-nav a { width:46px; height:46px; border-radius:13px; }
    body.route-meetings.route-clients .meetings-table th:first-child,
    body.route-meetings.route-clients .meetings-table td:first-child { width:5%; }
    body.role-manager.route-meetings.route-clients .meetings-table th:nth-child(2),
    body.role-manager.route-meetings.route-clients .meetings-table td:nth-child(2) { width:22%; }
    body.role-manager.route-meetings.route-clients .meetings-table th:nth-child(3),
    body.role-manager.route-meetings.route-clients .meetings-table td:nth-child(3) { width:28%; }
    body.role-manager.route-meetings.route-clients .meetings-table th:nth-child(4),
    body.role-manager.route-meetings.route-clients .meetings-table td:nth-child(4) { width:16%; }
    body.role-manager.route-meetings.route-clients .meetings-table th:nth-child(5),
    body.role-manager.route-meetings.route-clients .meetings-table td:nth-child(5) { width:13%; }
    body.role-manager.route-meetings.route-clients .meetings-table th:nth-child(6),
    body.role-manager.route-meetings.route-clients .meetings-table td:nth-child(6) { width:11%; }
    body.role-manager.route-meetings.route-clients .meetings-table th:last-child,
    body.role-manager.route-meetings.route-clients .meetings-table td:last-child { width:5%; }
    body.role-admin.route-meetings.route-clients .meetings-table th:nth-child(2),
    body.role-admin.route-meetings.route-clients .meetings-table td:nth-child(2) { width:17%; }
    body.role-admin.route-meetings.route-clients .meetings-table th:nth-child(3),
    body.role-admin.route-meetings.route-clients .meetings-table td:nth-child(3) { width:22%; }
    body.role-admin.route-meetings.route-clients .meetings-table th:nth-child(4),
    body.role-admin.route-meetings.route-clients .meetings-table td:nth-child(4) { width:14%; }
    body.role-admin.route-meetings.route-clients .meetings-table th:nth-child(5),
    body.role-admin.route-meetings.route-clients .meetings-table td:nth-child(5) { width:15%; }
    body.role-admin.route-meetings.route-clients .meetings-table th:nth-child(6),
    body.role-admin.route-meetings.route-clients .meetings-table td:nth-child(6) { width:12%; }
    body.role-admin.route-meetings.route-clients .meetings-table th:nth-child(7),
    body.role-admin.route-meetings.route-clients .meetings-table td:nth-child(7) { width:10%; }
    body.role-admin.route-meetings.route-clients .meetings-table th:last-child,
    body.role-admin.route-meetings.route-clients .meetings-table td:last-child { width:5%; }
    body.route-tasks.route-clients .tasks-table th:first-child,
    body.route-tasks.route-clients .tasks-table td:first-child { width:5%; }
    body.role-manager.route-tasks.route-clients .tasks-table th:nth-child(2),
    body.role-manager.route-tasks.route-clients .tasks-table td:nth-child(2) { width:24%; }
    body.role-manager.route-tasks.route-clients .tasks-table th:nth-child(3),
    body.role-manager.route-tasks.route-clients .tasks-table td:nth-child(3) { width:27%; }
    body.role-manager.route-tasks.route-clients .tasks-table th:nth-child(4),
    body.role-manager.route-tasks.route-clients .tasks-table td:nth-child(4) { width:16%; }
    body.role-manager.route-tasks.route-clients .tasks-table th:nth-child(5),
    body.role-manager.route-tasks.route-clients .tasks-table td:nth-child(5) { width:22%; }
    body.role-manager.route-tasks.route-clients .tasks-table th:last-child,
    body.role-manager.route-tasks.route-clients .tasks-table td:last-child { width:6%; }
    body.role-admin.route-tasks.route-clients .tasks-table th:nth-child(2),
    body.role-admin.route-tasks.route-clients .tasks-table td:nth-child(2) { width:19%; }
    body.role-admin.route-tasks.route-clients .tasks-table th:nth-child(3),
    body.role-admin.route-tasks.route-clients .tasks-table td:nth-child(3) { width:21%; }
    body.role-admin.route-tasks.route-clients .tasks-table th:nth-child(4),
    body.role-admin.route-tasks.route-clients .tasks-table td:nth-child(4) { width:14%; }
    body.role-admin.route-tasks.route-clients .tasks-table th:nth-child(5),
    body.role-admin.route-tasks.route-clients .tasks-table td:nth-child(5) { width:15%; }
    body.role-admin.route-tasks.route-clients .tasks-table th:nth-child(6),
    body.role-admin.route-tasks.route-clients .tasks-table td:nth-child(6) { width:20%; }
    body.role-admin.route-tasks.route-clients .tasks-table th:last-child,
    body.role-admin.route-tasks.route-clients .tasks-table td:last-child { width:6%; }
}

@media (max-width:860px){
    body.route-meetings.route-clients .content-wrap,
    body.route-tasks.route-clients .content-wrap { padding:24px 16px 40px; }
    body.route-meetings.route-clients .global-page-header,
    body.route-tasks.route-clients .global-page-header { display:none; }
    body.route-meetings.route-clients .meetings-overview-grid,
    body.route-tasks.route-clients .meetings-overview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    body.route-meetings.route-clients .clients-toolbar-card,
    body.route-tasks.route-clients .clients-toolbar-card { padding:12px; }
}

@media (max-width:560px){
    body.route-meetings.route-clients .meetings-overview-grid,
    body.route-tasks.route-clients .meetings-overview-grid { grid-template-columns:1fr; }
}

body.page-clients.route-clients .clients-overview-card { min-height:172px; height:172px; padding:16px 18px; }
body.route-account.route-clients .global-page-header { display:none; }
body.route-account.route-clients .account-hero { margin-top:1rem; }
body.route-account.route-clients .account-performance-section { display:none; }

/* Keep the global action and focus card consistent on every CRM page. */
body.route-clients .global-quick-action.is-primary,
body.route-clients .global-quick-action.is-primary:hover { color:#fff !important; }
body.route-clients .global-focus-chip { flex:0 1 560px; max-width:560px; padding:14px 18px; border:1px solid rgba(0,0,0,.06); border-radius:16px; background:#fff !important; color:#1d1d1f !important; box-shadow:0 1px 2px rgba(0,0,0,.04); font-size:15px; font-weight:500; gap:12px; }
body.route-clients .global-focus-chip-icon { width:30px; height:30px; border-radius:9px; color:#0071e3 !important; background:rgba(0,113,227,.1) !important; }
body.route-clients .global-focus-chip-icon svg { width:16px; height:16px; }

@media (min-width:1200px){
    body.route-meetings.route-clients .meetings-filter-form { grid-template-columns:minmax(280px,1fr) 210px 150px 150px 130px auto; gap:12px; }
    body.route-tasks.route-clients .clients-toolbar { grid-template-columns:minmax(320px,1fr) auto; }
    body.route-tasks.route-clients .clients-filter-form { display:flex; flex-wrap:nowrap; align-items:center; gap:12px; }
    body.route-tasks.route-clients .clients-filter-form label { flex:0 0 auto; }
    body.route-tasks.route-clients .clients-filter-form label:nth-of-type(1) select { width:150px; }
    body.route-tasks.route-clients .clients-filter-form label:nth-of-type(2) select { width:220px; }
    body.route-tasks.route-clients .clients-filter-form label:nth-of-type(3) select { width:140px; }
    body.route-tasks.route-clients .clients-filter-actions { flex:0 0 auto; }
}

/* One desktop navigation rail across every CRM section. */
@media (min-width:861px){
    body.route-clients { --crm-sidebar-unified-w:76px; }
    body.route-dashboard.role-manager { --mgr-sidebar-w:76px; }
    body.route-clients .app-layout { grid-template-columns:76px minmax(0,1fr) !important; }
    body.route-clients .sidebar { width:auto !important; min-width:76px; padding:22px 15px 20px !important; }
    body.route-clients .sidebar::before { display:none; }
    body.route-clients .sidebar-brand-icon { width:38px; height:38px; border:0; border-radius:11px; color:#fff; background:linear-gradient(160deg,#0071e3,#0a84ff); box-shadow:0 4px 12px rgba(0,113,227,.35); }
    body.route-clients .sidebar-brand-icon svg { display:none; }
    body.route-clients .sidebar-brand-icon::after { content:"c"; font-size:17px; font-weight:700; line-height:1; }
    body.route-clients .sidebar-nav a { width:46px; height:46px; border-radius:13px; }

    /* The manager dashboard used a separate legacy rail. Match it to Calls exactly. */
    body.route-dashboard.role-manager .sidebar { width:76px !important; min-width:76px !important; border:0 !important; border-right:1px solid #c9d0da !important; border-radius:0 !important; box-shadow:none !important; background:#f2f3f5 !important; color:#838d9e !important; padding:22px 15px 20px !important; }
    body.route-dashboard.role-manager .sidebar::before { display:none !important; }
    body.route-dashboard.role-manager .brand-block { justify-content:center; gap:0; padding:0 0 0.55rem; }
    body.route-dashboard.role-manager .brand-block > div,
    body.route-dashboard.role-manager .sidebar-nav-label,
    body.route-dashboard.role-manager .sidebar-nav-text,
    body.route-dashboard.role-manager .logout-form .sidebar-nav-text,
    body.route-dashboard.role-manager .sidebar-user-meta { display:none !important; }
    body.route-dashboard.role-manager .sidebar-brand-icon { width:38px !important; height:38px !important; border:0 !important; border-radius:11px !important; color:#fff !important; background:linear-gradient(160deg,#0071e3,#0a84ff) !important; box-shadow:0 4px 12px rgba(0,113,227,.35) !important; }
    body.route-dashboard.role-manager .sidebar-brand-icon svg { display:none !important; }
    body.route-dashboard.role-manager .sidebar-brand-icon::after { content:"c"; font-size:17px; font-weight:700; line-height:1; }
    body.route-dashboard.role-manager .sidebar-nav { margin-top:0.44rem; gap:0.52rem; }
    body.route-dashboard.role-manager .sidebar-nav a { width:46px !important; height:46px !important; margin:0 auto; padding:0; border-radius:13px; border:1px solid transparent; background:transparent; color:#8f98a9; justify-content:center; }
    body.route-dashboard.role-manager .sidebar-nav a[data-nav-label='Аккаунт'] { display:flex !important; }
    body.route-dashboard.role-manager .sidebar-nav-icon,
    body.route-dashboard.role-manager .sidebar-nav-icon svg { width:19px; height:19px; color:currentColor; }
    body.route-dashboard.role-manager .sidebar-nav a:hover { background:#e8edf4; border-color:#dde4ee; color:#677283; }
    body.route-dashboard.role-manager .sidebar-nav a.active { background:#d7e5f3; border-color:#d7e5f3; color:#202c3e; box-shadow:none; }
    body.route-dashboard.role-manager .sidebar-nav a.active .sidebar-nav-icon { color:#202c3e; }
    body.route-dashboard.role-manager .sidebar-footer { margin-top:auto; border-top:0; padding-top:0.5rem; gap:0.52rem; align-items:center; }
    body.route-dashboard.role-manager .sidebar-footer-tools { width:100%; display:grid; justify-items:center; align-items:center; gap:0.4rem; }
    body.route-dashboard.role-manager .sidebar-footer-tool { width:40px; height:40px; border-radius:13px; border:1px solid transparent; background:transparent; color:#929bab; display:inline-flex; align-items:center; justify-content:center; margin:0 auto; padding:0; }
    body.route-dashboard.role-manager .sidebar-footer-tool:hover { background:#e8edf4; color:#697385; }
    body.route-dashboard.role-manager .sidebar-footer-tool svg { width:19px; height:19px; }
    body.route-dashboard.role-manager .sidebar-user { justify-content:center; gap:0; }
    body.route-dashboard.role-manager .sidebar-user-avatar { width:32px; height:32px; border:1px solid #d4dae4; background:#dfe3ea; color:#1f2735; font-size:0.72rem; font-weight:800; box-shadow:none; }
    body.route-dashboard.role-manager .logout-form { display:block !important; width:40px; }
    body.route-dashboard.role-manager .logout-form .btn-ghost { width:40px; height:40px; min-height:40px; padding:0; border:1px solid transparent; border-radius:13px; background:transparent; color:#8f98a9; box-shadow:none; }
    body.route-dashboard.role-manager .logout-form .btn-ghost:hover { background:#e8edf4; border-color:#dde4ee; color:#677283; }
}

/* Mobile sidebar: keep the navigation readable and touch-friendly. */
@media (max-width: 860px) {
    body.route-clients .mobile-menu-btn {
        border-color: #d8dfeb !important;
        background: #ffffff !important;
        color: #324f82 !important;
    }

    body.route-clients .sidebar {
        width: min(82vw, 292px) !important;
        padding: 0.95rem 0.72rem !important;
        border: 0 !important;
        border-right: 1px solid #e1e7f0 !important;
        border-radius: 0 16px 16px 0 !important;
        background: #ffffff !important;
        color: #26364f !important;
        box-shadow: 0 18px 38px rgba(24, 42, 72, 0.2) !important;
    }

    body.route-clients .brand-block {
        justify-content: flex-start !important;
        padding: 0 0.2rem 0.78rem !important;
        gap: 0.56rem !important;
    }

    body.route-clients .sidebar-brand-icon {
        width: 38px !important;
        height: 38px !important;
        border: 1px solid #d6e3f7 !important;
        border-radius: 11px !important;
        background: #edf4ff !important;
        color: #2870ef !important;
        box-shadow: none !important;
    }

    body.route-clients .brand-block strong { color: #1d2c43 !important; }
    body.route-clients .brand-block small { color: #8290a5 !important; }

    body.route-clients .sidebar-mobile-close {
        width: 32px !important;
        height: 32px !important;
        border-color: #d8e1ed !important;
        border-radius: 10px !important;
        background: #f8faff !important;
        color: #697b94 !important;
    }

    body.route-clients .sidebar-nav-label {
        margin: 0 0 0.42rem !important;
        padding: 0 0.22rem !important;
        color: #9aa7b9 !important;
    }

    body.route-clients .sidebar-nav {
        margin-top: 0 !important;
        gap: 0.28rem !important;
        padding-right: 0 !important;
    }

    body.route-clients .sidebar-nav a {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        min-height: 46px !important;
        height: 46px !important;
        margin: 0 !important;
        padding: 0 0.72rem !important;
        gap: 0.7rem !important;
        border: 1px solid transparent !important;
        border-radius: 12px !important;
        background: transparent !important;
        color: #53657e !important;
        text-align: left !important;
    }

    body.route-clients .sidebar-nav-icon,
    body.route-clients .sidebar-nav-icon svg {
        width: 19px !important;
        height: 19px !important;
        color: currentColor !important;
        flex: 0 0 19px;
    }

    body.route-clients .sidebar-nav-text {
        display: inline !important;
        font-size: 0.88rem !important;
        font-weight: 700 !important;
    }

    body.route-clients .sidebar-nav a:hover {
        background: #f4f7fc !important;
        border-color: #e2e9f4 !important;
        color: #365a91 !important;
    }

    body.route-clients .sidebar-nav a.active,
    body.route-clients .sidebar-nav a.active:hover {
        background: #eaf2ff !important;
        border-color: #d9e7fb !important;
        color: #2368db !important;
        box-shadow: none !important;
    }

    body.route-clients .sidebar-nav a.active .sidebar-nav-icon { color: #2368db !important; }

    body.route-clients .sidebar-footer {
        border-top: 1px solid #e9edf3 !important;
        padding-top: 0.75rem !important;
    }

    body.route-clients .sidebar-user-avatar {
        border-color: #d9e4f1 !important;
        background: #eef3f9 !important;
        color: #34445c !important;
        box-shadow: none !important;
    }

    body.route-clients .sidebar-user strong { color: #27364d !important; }
    body.route-clients .sidebar-user small { color: #8b98aa !important; }
    body.route-clients .logout-form .btn-ghost { color: #77869b !important; }
}

/* Clients: a desktop data table is unreadable on a phone, so each record becomes a card. */
@media (max-width: 860px) {
    body.page-clients.route-clients .clients-table-card {
        width: 100%;
        min-width: 0;
        overflow: visible;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    body.page-clients.route-clients .clients-table-card .table-wrap,
    body.page-clients.route-clients .clients-table,
    body.page-clients.route-clients .clients-table tbody {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        overflow: visible;
    }

    body.page-clients.route-clients .clients-table thead {
        display: none;
    }

    body.page-clients.route-clients .clients-table tbody tr.js-client-row {
        display: block;
        position: relative;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
        margin: 0 0 0.72rem;
        padding: 0.9rem;
        border: 1px solid #e3e7ed;
        border-radius: 16px;
        background: #ffffff;
        box-shadow: 0 5px 18px rgba(26, 38, 58, 0.045);
    }

    body.page-clients.route-clients .clients-table tbody tr.js-client-row td {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        width: 100% !important;
        min-height: 2.25rem;
        padding: 0.46rem 0 !important;
        border: 0;
        background: transparent;
        color: #435166;
        font-size: 0.84rem;
        text-align: right;
        white-space: normal;
    }

    body.page-clients.route-clients .clients-table tbody tr.js-client-row td::before {
        content: attr(data-label);
        flex: 0 0 6.5rem;
        padding-right: 0.7rem;
        color: #949eae;
        font-size: 0.68rem;
        font-weight: 800;
        letter-spacing: 0.045em;
        line-height: 1.5;
        text-align: left;
        text-transform: uppercase;
    }

    body.page-clients.route-clients .clients-table tbody tr.js-client-row td.clients-col-company {
        display: block;
        min-height: 0;
        padding: 0 0 0.72rem !important;
        margin-bottom: 0.22rem;
        border-bottom: 1px solid #edf0f4;
        text-align: left;
    }

    body.page-clients.route-clients .clients-table tbody tr.js-client-row td.clients-col-company::before {
        display: none;
    }

    /* Contact person is secondary information; keep the mobile card preview focused on the company and next action. */
    body.page-clients.route-clients .clients-table tbody tr.js-client-row td.clients-col-contact {
        display: none;
    }

    body.page-clients.route-clients .clients-table .company-cell {
        min-width: 0;
        gap: 0.62rem;
    }

    body.page-clients.route-clients .clients-table .company-cell-icon {
        width: 36px;
        height: 36px;
        border-radius: 11px;
        font-size: 0.74rem;
    }

    body.page-clients.route-clients .clients-table .company-link,
    body.page-clients.route-clients .clients-table .clients-cell-text,
    body.page-clients.route-clients .clients-table .clients-comment-text,
    body.page-clients.route-clients .clients-table .clients-next-contact,
    body.page-clients.route-clients .clients-table .status-chip,
    body.page-clients.route-clients .clients-table .status-chip-btn {
        max-width: calc(100% - 6.5rem);
        overflow: hidden;
        text-overflow: ellipsis;
    }

    body.page-clients.route-clients .clients-table .company-link {
        display: block;
        max-width: none;
        color: #26354d;
        font-size: 0.94rem;
        font-weight: 800;
    }

    body.page-clients.route-clients .clients-table td.clients-col-company .company-cell {
        padding-right: 7.8rem;
    }

    body.page-clients.route-clients .clients-table tbody tr.js-client-row td.clients-col-status {
        position: absolute;
        top: 0.9rem;
        right: 0.9rem;
        display: block;
        width: auto !important;
        min-height: 0;
        margin: 0;
        padding: 0 !important;
        border: 0;
    }

    body.page-clients.route-clients .clients-table tbody tr.js-client-row td.clients-col-status::before {
        display: none;
    }

    body.page-clients.route-clients .clients-table td.clients-col-status .status-chip,
    body.page-clients.route-clients .clients-table td.clients-col-status .status-chip-btn {
        max-width: 7.2rem;
        white-space: nowrap;
    }

    body.page-clients.route-clients .clients-table .clients-row-actions {
        width: auto;
        justify-content: flex-end;
        gap: 0.42rem;
    }

    body.page-clients.route-clients .clients-table td.clients-col-actions::before {
        align-self: center;
    }

    body.page-clients.route-clients .clients-table td.clients-col-actions {
        padding-top: 0.62rem !important;
        margin-top: 0.18rem;
        border-top: 1px solid #edf0f4;
    }

    body.page-clients.route-clients .clients-table tbody tr:not(.js-client-row) td[colspan] {
        display: block;
        padding: 1.15rem !important;
        border: 1px solid #e3e7ed;
        border-radius: 16px;
        background: #ffffff;
        color: #7a8698;
        text-align: center;
    }
}

@media (max-width: 860px) {
    body.page-clients.route-clients .clients-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
    }

    body.page-clients.route-clients .clients-overview-card {
        min-height: 0;
        height: 174px;
        padding: 0.85rem;
        border-radius: 16px;
        gap: 0.3rem;
        overflow: hidden;
    }

    body.page-clients.route-clients .clients-overview-head { margin-bottom: 0.35rem; }
    body.page-clients.route-clients .clients-overview-icon { width: 36px; height: 36px; border-radius: 11px; }
    body.page-clients.route-clients .clients-overview-icon svg { width: 18px; height: 18px; }
    body.page-clients.route-clients .clients-overview-chip { min-height: 24px; padding: 0.22rem 0.5rem; font-size: 0.66rem; }
    body.page-clients.route-clients .clients-overview-value { font-size: 2.25rem; }
    body.page-clients.route-clients .clients-overview-label { margin-top: 0.2rem; font-size: 0.75rem; }
    body.page-clients.route-clients .clients-overview-meta,
    body.page-clients.route-clients .clients-overview-meta-row { font-size: 0.7rem; }
    body.page-clients.route-clients .clients-overview-days { gap: 0.32rem; }
    body.page-clients.route-clients .clients-overview-days span { min-height: 22px; padding: 0.2rem; border-radius: 8px; font-size: 0.62rem; }
    body.page-clients.route-clients .clients-overview-bars { min-height: 20px; gap: 0.25rem; }
    body.page-clients.route-clients .clients-overview-bars span { border-radius: 6px; }
}

/* Meetings: use the same compact, scroll-free mobile layout as Clients. */
@media (max-width: 860px) {
    body.route-meetings.route-clients .meetings-overview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
    }

    body.route-meetings.route-clients .meetings-overview-card {
        min-height: 0;
        height: 174px;
        padding: 0.85rem;
        border-radius: 16px;
        gap: 0.3rem;
        overflow: hidden;
    }

    body.route-meetings.route-clients .meetings-overview-head { margin-bottom: 0.35rem; }
    body.route-meetings.route-clients .meetings-overview-icon { width: 36px; height: 36px; border-radius: 11px; }
    body.route-meetings.route-clients .meetings-overview-icon svg { width: 18px; height: 18px; }
    body.route-meetings.route-clients .meetings-overview-chip { min-height: 24px; padding: 0.22rem 0.5rem; font-size: 0.66rem; }
    body.route-meetings.route-clients .meetings-overview-value { font-size: 2.25rem; }
    body.route-meetings.route-clients .meetings-overview-label { margin-top: 0.2rem; font-size: 0.75rem; }
    body.route-meetings.route-clients .meetings-overview-meta,
    body.route-meetings.route-clients .meetings-overview-meta-row { font-size: 0.7rem; }
    body.route-meetings.route-clients .meetings-overview-weekdays { gap: 0.32rem; }
    body.route-meetings.route-clients .meetings-overview-weekdays span { min-height: 22px; padding: 0.2rem; border-radius: 8px; font-size: 0.62rem; }
    body.route-meetings.route-clients .meetings-overview-bars { min-height: 20px; gap: 0.25rem; }
    body.route-meetings.route-clients .meetings-overview-bars span { border-radius: 6px; }

    body.route-meetings.route-clients .clients-table-card,
    body.route-meetings.route-clients .clients-table-card .table-wrap,
    body.route-meetings.route-clients .meetings-table,
    body.route-meetings.route-clients .meetings-table tbody {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        overflow: visible;
    }

    body.route-meetings.route-clients .clients-table-card {
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    body.route-meetings.route-clients .meetings-table thead { display: none; }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row {
        display: block;
        position: relative;
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
        margin: 0 0 0.72rem;
        padding: 0.9rem;
        border: 1px solid #e3e7ed;
        border-radius: 16px;
        background: #ffffff;
        box-shadow: 0 5px 18px rgba(26, 38, 58, 0.045);
    }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        width: 100% !important;
        min-height: 2.25rem;
        padding: 0.46rem 0 !important;
        border: 0;
        background: transparent;
        color: #435166;
        font-size: 0.84rem;
        text-align: right;
        white-space: normal;
    }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td::before {
        content: attr(data-label);
        flex: 0 0 6.5rem;
        padding-right: 0.7rem;
        color: #949eae;
        font-size: 0.68rem;
        font-weight: 800;
        letter-spacing: 0.045em;
        line-height: 1.5;
        text-align: left;
        text-transform: uppercase;
    }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td.meeting-col-company {
        display: block;
        min-height: 0;
        margin-bottom: 0.22rem;
        padding: 0 7.8rem 0.72rem 2.25rem !important;
        border-bottom: 1px solid #edf0f4;
        color: #26354d;
        font-size: 0.94rem;
        font-weight: 800;
        text-align: left;
    }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td.meeting-col-company::before,
    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td.meeting-col-check::before,
    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td.meeting-col-status::before {
        display: none;
    }

    body.route-meetings.route-clients .meetings-table .meeting-company-text,
    body.route-meetings.route-clients .meetings-table .meeting-description-text,
    body.route-meetings.route-clients .meetings-table .meeting-at-text,
    body.route-meetings.route-clients .meetings-table .meeting-created-text {
        max-width: calc(100% - 6.5rem);
        overflow: hidden;
        text-overflow: ellipsis;
    }

    body.route-meetings.route-clients .meetings-table .meeting-company-text { display: block; max-width: none; }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td.meeting-col-check {
        position: absolute;
        top: 1rem;
        left: 0.9rem;
        display: block;
        width: auto !important;
        min-height: 0;
        margin: 0;
        padding: 0 !important;
    }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td.meeting-col-status {
        position: absolute;
        top: 0.9rem;
        right: 0.9rem;
        display: block;
        width: auto !important;
        min-height: 0;
        margin: 0;
        padding: 0 !important;
    }

    body.route-meetings.route-clients .meetings-table .meeting-status-chip {
        max-width: 7.2rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td.meeting-col-created { display: none; }

    body.route-meetings.route-clients .meetings-table tbody tr.js-meeting-row td.meeting-col-actions {
        margin-top: 0.18rem;
        padding-top: 0.62rem !important;
        border-top: 1px solid #edf0f4;
    }

    body.route-meetings.route-clients .meetings-table .meeting-col-actions .icon-btn { width: 34px; height: 34px; }

    body.route-meetings.route-clients .meetings-table tbody tr:not(.js-meeting-row) td[colspan] {
        display: block;
        padding: 1.15rem !important;
        border: 1px solid #e3e7ed;
        border-radius: 16px;
        background: #ffffff;
        color: #7a8698;
        text-align: center;
    }
}

/* Meetings filters: keep the phone toolbar to a single compact control row. */
body.route-meetings.route-clients .meetings-filter-form {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.56rem;
}

body.route-meetings.route-clients .meetings-filter-form .clients-filter-inline-label {
    display: block;
    margin: 0;
}

body.route-meetings.route-clients .meetings-filter-form .clients-filter-inline-label select,
body.route-meetings.route-clients .meetings-filter-form .clients-filter-popover select {
    min-width: 122px;
    height: 40px;
    padding: 0 2.3rem 0 0.95rem;
    border: 1px solid #d9dfe7;
    border-radius: 14px;
    background: #ffffff;
    color: #5d6676;
    font-size: 0.82rem;
    font-weight: 700;
    box-shadow: none;
}

body.route-meetings.route-clients .meetings-filter-form .clients-toolbar-refresh,
body.route-meetings.route-clients .meetings-filter-form .clients-filter-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border: 1px solid #d9dfe7;
    border-radius: 14px;
    background: #f7f9fc;
    color: #7c8594;
    text-decoration: none;
}

body.route-meetings.route-clients .meetings-filter-form .clients-toolbar-refresh {
    width: 40px;
    padding: 0;
}

body.route-meetings.route-clients .meetings-filter-form .clients-toolbar-refresh svg,
body.route-meetings.route-clients .meetings-filter-form .clients-filter-toggle svg {
    width: 16px;
    height: 16px;
}

body.route-meetings.route-clients .meetings-filter-form .clients-toolbar-reset svg { width: 15px; height: 15px; }
body.route-meetings.route-clients .meetings-filter-form .clients-filter-menu { position: relative; }
body.route-meetings.route-clients .meetings-filter-form .clients-filter-menu summary { list-style: none; }
body.route-meetings.route-clients .meetings-filter-form .clients-filter-menu summary::-webkit-details-marker { display: none; }

body.route-meetings.route-clients .meetings-filter-form .clients-filter-toggle {
    gap: 0.4rem;
    padding: 0 0.9rem;
    font-size: 0.8rem;
    font-weight: 800;
    cursor: pointer;
    user-select: none;
}

body.route-meetings.route-clients .meetings-filter-form .clients-filter-popover {
    position: absolute;
    top: calc(100% + 0.52rem);
    right: 0;
    z-index: 24;
    width: 292px;
    padding: 0.84rem 0.88rem;
    border: 1px solid #d9dfe7;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(28, 40, 60, 0.08);
}

body.route-meetings.route-clients .meetings-filter-form .clients-filter-popover-grid { display: grid; gap: 0.68rem; }
body.route-meetings.route-clients .meetings-filter-form .clients-filter-popover label { display: grid; gap: 0.32rem; margin: 0; }
body.route-meetings.route-clients .meetings-filter-form .clients-filter-popover label span { color: #8e97a5; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.02em; }
body.route-meetings.route-clients .meetings-filter-form .clients-filter-date-range { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.58rem; }
body.route-meetings.route-clients .meetings-filter-form .clients-filter-date-range input[type='date'] { width: 100%; height: 40px; padding: 0 0.78rem; border: 1px solid #d9dfe7; border-radius: 14px; background: #ffffff; color: #5d6676; font-family: inherit; font-size: 0.82rem; font-weight: 700; box-shadow: none; }

@media (max-width: 860px) {
    body.route-meetings.route-clients .clients-toolbar-card { padding: 0.72rem; }
    body.route-meetings.route-clients .clients-toolbar { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr); gap: 0.52rem; }
    body.route-meetings.route-clients .meetings-filter-form { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) auto auto auto; gap: 0.52rem; }
    body.route-meetings.route-clients .meetings-filter-form .clients-filter-inline-label select { width: 100%; min-width: 0; }
    body.route-meetings.route-clients .meetings-filter-form .clients-filter-popover { left: auto; right: 0; width: min(292px, calc(100vw - 2rem)); }
}

/* Calls: match the compact two-column mobile metric cards used by Clients and Meetings. */
@media (max-width: 860px) {
    body.route-calls.route-clients .calls-overview-grid,
    body.route-calls.route-clients .calls-overview-grid.is-manager {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.7rem;
    }

    body.route-calls.route-clients .calls-stat-card {
        min-height: 0;
        height: 174px;
        padding: 0.85rem;
        border-radius: 16px;
        gap: 0.3rem;
        overflow: hidden;
    }

    body.route-calls.route-clients .calls-stat-head { margin-bottom: 0.35rem; }
    body.route-calls.route-clients .calls-stat-icon { width: 36px; height: 36px; border-radius: 11px; }
    body.route-calls.route-clients .calls-stat-icon svg { width: 18px; height: 18px; }
    body.route-calls.route-clients .calls-stat-chip { min-height: 24px; padding: 0.22rem 0.5rem; font-size: 0.66rem; }
    body.route-calls.route-clients .calls-stat-value { font-size: 2.25rem; }
    body.route-calls.route-clients .calls-stat-label { font-size: 0.75rem; line-height: 1.25; }
    body.route-calls.route-clients .calls-stat-note { display: -webkit-box; overflow: hidden; font-size: 0.7rem; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
    body.route-calls.route-clients .calls-stat-progress { height: 6px; margin-top: auto; }
    body.route-calls.route-clients .calls-stat-plan-row { gap: 0.32rem; }
    body.route-calls.route-clients .calls-stat-plan-row strong,
    body.route-calls.route-clients .calls-stat-plan-row span { overflow: hidden; font-size: 0.68rem; text-overflow: ellipsis; }
    body.route-calls.route-clients .calls-stat-card--per-hour { display: none; }
}

/* Client profile is opened from several screens. Keep its mobile behaviour shared. */
@media (max-width: 720px) {
    body.route-clients .client-drawer {
        align-items: stretch;
        justify-content: stretch;
        padding: 0;
    }

    body.route-clients .client-drawer .modal-dialog,
    body.route-clients .client-drawer .modal-dialog.modal-dialog-xl.card {
        width: 100vw;
        height: 100dvh;
        max-height: none;
        margin: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    body.route-clients .client-edit-shell {
        height: 100dvh;
        min-height: 100dvh;
        overflow: hidden;
    }

    body.route-clients .client-edit-topbar {
        flex: 0 0 auto;
    }

    body.route-clients .client-edit-drawer-layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "form"
            "history";
        flex: 1 1 auto;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    body.route-clients .client-edit-form,
    body.route-clients .client-history-panel {
        min-height: auto;
        overflow: visible;
    }

    body.route-clients .client-edit-footer {
        flex: 0 0 auto;
        padding-bottom: max(0.9rem, env(safe-area-inset-bottom));
    }
}

/* Full call-script reference material */
body.route-scripts.route-clients .sales-script-lead {
    margin: -0.25rem 0 1.1rem;
    color: #596a80;
    font-size: 0.92rem;
    line-height: 1.55;
}

body.route-scripts.route-clients .sales-script-logic-table {
    overflow: hidden;
    border: 1px solid #e2e8f1;
    border-radius: 15px;
}

body.route-scripts.route-clients .sales-script-logic-table > div {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    border-top: 1px solid #e8edf4;
}

body.route-scripts.route-clients .sales-script-logic-table > div:first-child {
    border-top: 0;
}

body.route-scripts.route-clients .sales-script-logic-table span,
body.route-scripts.route-clients .sales-script-logic-table b {
    padding: 0.72rem 0.85rem;
    color: #66758a;
    font-size: 0.82rem;
    line-height: 1.43;
}

body.route-scripts.route-clients .sales-script-logic-table span + span,
body.route-scripts.route-clients .sales-script-logic-table b + b {
    border-left: 1px solid #e8edf4;
}

body.route-scripts.route-clients .sales-script-logic-table .sales-script-logic-head {
    background: #f5f8fc;
}

body.route-scripts.route-clients .sales-script-logic-table .sales-script-logic-head b:first-child {
    color: #a05e5e;
}

body.route-scripts.route-clients .sales-script-logic-table .sales-script-logic-head b:last-child {
    color: #177045;
}

body.route-scripts.route-clients .sales-script-subtitle {
    margin: 1.25rem 0 0.7rem;
    color: #2b3a52;
    font-size: 1rem;
}

body.route-scripts.route-clients .sales-script-reason-chips span {
    background: #f6f8fb;
    color: #526278;
}

body.route-scripts.route-clients .sales-script-inline-note {
    margin: -0.2rem 0 0.6rem;
    color: #718097;
    font-size: 0.83rem;
}

body.route-scripts.route-clients .sales-script-ready-script {
    margin: 0 0 1rem;
    border-color: #cfe1ff;
    background: #f5f9ff;
}

body.route-scripts.route-clients .sales-script-detail-copy {
    padding: 0.9rem 1rem 1rem;
    color: #596a80;
    font-size: 0.86rem;
    line-height: 1.53;
}

body.route-scripts.route-clients .sales-script-detail-copy p {
    margin: 0 0 0.78rem;
}

body.route-scripts.route-clients .sales-script-detail-copy p:last-child {
    margin-bottom: 0;
}

body.route-scripts.route-clients .sales-script-detail-copy ol {
    display: grid;
    gap: 0.42rem;
    margin: 0 0 0.85rem;
    padding-left: 1.25rem;
}

body.route-scripts.route-clients .sales-script-detail-copy blockquote {
    margin-top: 0.75rem;
}

body.route-scripts.route-clients .sales-script-industry-grid details {
    min-width: 0;
}

body.route-scripts.route-clients .sales-script-followups {
    margin-bottom: 0.85rem;
}

@media (max-width: 600px) {
    body.route-scripts.route-clients .sales-script-logic-table > div {
        grid-template-columns: 1fr;
    }

    body.route-scripts.route-clients .sales-script-logic-table span + span,
    body.route-scripts.route-clients .sales-script-logic-table b + b {
        border-top: 1px solid #e8edf4;
        border-left: 0;
    }

    body.route-scripts.route-clients .sales-script-logic-table .sales-script-logic-head b:last-child {
        display: none;
    }
}

/* The client editor is one scrollable column on phones. Explicit ordering avoids
   the history pane being placed into an implicit grid row over form fields. */
@media (max-width: 720px) {
    body.route-clients .client-edit-drawer-layout {
        display: flex;
        flex-direction: column;
        gap: 1.25rem;
        padding: 0.9rem;
    }

    body.route-clients .client-edit-fields.client-edit-form {
        order: 1;
        width: 100%;
        min-width: 0;
    }

    body.route-clients .client-history-panel {
        order: 2;
        width: 100%;
        min-width: 0;
        padding-top: 1.15rem;
        border-top: 1px solid #e5e9f0;
    }
}