/* =========================================================
   CREATIVITY BUSINESS SOLUTION - MAIN DESIGN SYSTEM
   Performance-first: system fonts, solid surfaces, no blur.
========================================================= */

* { box-sizing: border-box; }

:root {
    --cbs-shell-top:var(--cbs-header-height);
    --cbs-top-nav-height:58px;
    --cbs-header-height: 68px;
    --cbs-footer-height: 44px;
    --cbs-sidebar-width: 252px;
    --cbs-sidebar-collapsed: 76px;
    --cbs-radius-sm: 8px;
    --cbs-radius: 12px;
    --cbs-radius-lg: 16px;
    --cbs-page-gap: 16px;
    --cbs-transition: 150ms ease;

    --cbs-accent: #4f8df7;
    --cbs-accent-strong: #3277ea;
    --cbs-accent-soft: #172b49;
    --cbs-accent-faint: #121f32;
    --cbs-accent-border: #2c4e78;

    --cbs-bg: #111722;
    --cbs-bg-raised: #151d29;
    --cbs-surface: #181f2b;
    --cbs-surface-2: #1c2634;
    --cbs-surface-3: #223044;
    --cbs-sidebar: #0f1620;
    --cbs-header: #101721;
    --cbs-footer: #101721;
    --cbs-text: #f2f5f8;
    --cbs-text-2: #c8d1dc;
    --cbs-muted: #93a0b2;
    --cbs-border: #2d3c50;
    --cbs-border-soft: #223044;
    --cbs-input: #141d29;
    --cbs-danger: #ef6b6b;
    --cbs-danger-soft: #3b2628;
    --cbs-success: #66c987;
    --cbs-success-soft: #22382b;
    --cbs-shadow: 0 8px 22px rgba(0, 0, 0, .14);
}

html[data-mode="light"] {
    --cbs-bg: #f4f7fb;
    --cbs-bg-raised: #ffffff;
    --cbs-surface: #ffffff;
    --cbs-surface-2: #f8fafc;
    --cbs-surface-3: #f1f5f9;
    --cbs-sidebar: #fbfcfe;
    --cbs-header: #ffffff;
    --cbs-footer: #ffffff;
    --cbs-text: #172033;
    --cbs-text-2: #4a5568;
    --cbs-muted: #748096;
    --cbs-border: #dce3ec;
    --cbs-border-soft: #e8edf3;
    --cbs-input: #f8fafc;
    --cbs-danger: #d94d4d;
    --cbs-danger-soft: #fff1f1;
    --cbs-success: #2f9f5a;
    --cbs-success-soft: #edf9f1;
    --cbs-shadow: 0 8px 22px rgba(32, 48, 72, .07);

    --cbs-accent-soft: #eaf2ff;
    --cbs-accent-faint: #f4f8ff;
    --cbs-accent-border: #cbdcff;
}

html[data-accent="blue"] {
    --cbs-accent: #4f8df7;
    --cbs-accent-strong: #3277ea;
}
html[data-accent="teal"] {
    --cbs-accent: #32aaa0;
    --cbs-accent-strong: #238b82;
    --cbs-accent-soft: #173331;
    --cbs-accent-faint: #122624;
    --cbs-accent-border: #2b5c58;
}
html[data-accent="green"] {
    --cbs-accent: #55ad69;
    --cbs-accent-strong: #3b9252;
    --cbs-accent-soft: #1d3423;
    --cbs-accent-faint: #16271b;
    --cbs-accent-border: #356143;
}
html[data-accent="violet"] {
    --cbs-accent: #8b78e6;
    --cbs-accent-strong: #725dd6;
    --cbs-accent-soft: #2a2542;
    --cbs-accent-faint: #201c32;
    --cbs-accent-border: #4d4475;
}
html[data-accent="orange"] {
    --cbs-accent: #d68a49;
    --cbs-accent-strong: #c4722f;
    --cbs-accent-soft: #392b20;
    --cbs-accent-faint: #2b2119;
    --cbs-accent-border: #6a4d34;
}
html[data-accent="rose"] {
    --cbs-accent: #d56f8d;
    --cbs-accent-strong: #c55174;
    --cbs-accent-soft: #3a252d;
    --cbs-accent-faint: #2c1c22;
    --cbs-accent-border: #6d4150;
}

html[data-mode="light"][data-accent="teal"] { --cbs-accent-soft:#e7f7f5; --cbs-accent-faint:#f3fbfa; --cbs-accent-border:#bee7e2; }
html[data-mode="light"][data-accent="green"] { --cbs-accent-soft:#edf8ef; --cbs-accent-faint:#f6fbf7; --cbs-accent-border:#cde8d2; }
html[data-mode="light"][data-accent="violet"] { --cbs-accent-soft:#f0edff; --cbs-accent-faint:#f8f6ff; --cbs-accent-border:#d8d0fb; }
html[data-mode="light"][data-accent="orange"] { --cbs-accent-soft:#fff3e8; --cbs-accent-faint:#fff9f3; --cbs-accent-border:#efd7bf; }
html[data-mode="light"][data-accent="rose"] { --cbs-accent-soft:#fff0f4; --cbs-accent-faint:#fff7f9; --cbs-accent-border:#efcbd6; }

html, body {
    margin: 0;
    min-height: 100%;
    color: var(--cbs-text);
    background: var(--cbs-bg);
    font-family: var(--cbs-font-family, "Segoe UI", Arial, sans-serif);
    font-size: 14px;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body, input, button, select, textarea { font: inherit; }
a { color: inherit; }
button, a, input { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
img, svg { display: block; }

.cbs-icon {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cbs-icon-button {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border: 1px solid var(--cbs-border);
    border-radius: 10px;
    color: var(--cbs-text-2);
    background: var(--cbs-surface);
    cursor: pointer;
    text-decoration: none;
    transition: border-color var(--cbs-transition), background var(--cbs-transition), color var(--cbs-transition);
}

.cbs-icon-button:hover {
    color: var(--cbs-accent);
    border-color: var(--cbs-accent-border);
    background: var(--cbs-accent-faint);
}

.cbs-button {
    min-height: 42px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 10px;
    border: 1px solid var(--cbs-border);
    background: var(--cbs-surface);
    color: var(--cbs-text);
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: background var(--cbs-transition), border-color var(--cbs-transition), transform var(--cbs-transition);
}

.cbs-button:hover { border-color: var(--cbs-accent-border); }
.cbs-button:active { transform: translateY(1px); }
.cbs-button-primary { color: #fff; border-color: var(--cbs-accent-strong); background: var(--cbs-accent-strong); }
.cbs-button-primary:hover { background: var(--cbs-accent); border-color: var(--cbs-accent); }

/* =========================================================
   PUBLIC DEFAULT / LOGIN PAGE
========================================================= */

.cbs-public-body { overflow-x: hidden; }

.cbs-public-header {
    position: fixed;
    z-index: 1200;
    top: 0;
    left: 0;
    right: 0;
    height: var(--cbs-header-height);
    padding: 0 clamp(16px, 3vw, 42px);
    display: flex;
    align-items: center;
    gap: 24px;
    border-bottom: 1px solid var(--cbs-accent-border);
    background: var(--cbs-header);
}

.cbs-brand,
.cbs-app-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: var(--cbs-text);
    text-decoration: none;
}

.cbs-brand img { width: 42px; height: 42px; }
.cbs-brand-copy { line-height: 1.05; }
.cbs-brand-copy strong { display: block; font-size: 16px; letter-spacing: -.01em; }
.cbs-brand-copy small { display: block; margin-top: 4px; color: var(--cbs-muted); font-size: 11px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }

.cbs-public-nav {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 4px;
}

.cbs-public-nav a {
    padding: 9px 12px;
    border-radius: 9px;
    color: var(--cbs-text-2);
    text-decoration: none;
    font-weight: 650;
}

.cbs-public-nav a:hover { color: var(--cbs-accent); background: var(--cbs-accent-faint); }

.cbs-public-actions { display: flex; align-items: center; gap: 8px; }

.cbs-public-main {
    min-height: 100dvh;
    padding: calc(var(--cbs-header-height) + 28px) clamp(18px, 4vw, 56px) calc(var(--cbs-footer-height) + 28px);
    display: grid;
    align-items: center;
}

.cbs-public-grid {
    width: min(1380px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(360px, 460px);
    gap: clamp(28px, 5vw, 74px);
    align-items: center;
}

.cbs-public-intro { min-width: 0; }
.cbs-eyebrow { margin-bottom: 12px; color: var(--cbs-accent); font-size: 12px; font-weight: 800; letter-spacing: .12em; }

.cbs-public-intro h1 {
    max-width: 820px;
    margin: 0;
    font-size: clamp(38px, 5.2vw, 70px);
    line-height: .99;
    letter-spacing: -.055em;
}

.cbs-public-lead {
    max-width: 820px;
    margin: 20px 0 0;
    color: var(--cbs-text-2);
    font-size: clamp(15px, 1.4vw, 18px);
    line-height: 1.65;
}

.cbs-feature-grid {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.cbs-feature-card {
    min-height: 84px;
    padding: 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid var(--cbs-accent-border);
    border-radius: var(--cbs-radius);
    background: var(--cbs-surface);
}

.cbs-feature-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    color: var(--cbs-accent);
    border: 1px solid var(--cbs-accent-border);
    border-radius: 10px;
    background: var(--cbs-accent-faint);
}

.cbs-feature-card strong { display:block; font-size: 14px; }
.cbs-feature-card small { display:block; margin-top:4px; color:var(--cbs-muted); font-size:12px; line-height:1.35; }

.cbs-public-note {
    margin-top: 12px;
    padding: 13px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--cbs-accent-border);
    border-radius: var(--cbs-radius);
    color: var(--cbs-text-2);
    background: var(--cbs-accent-faint);
    line-height: 1.5;
}
.cbs-public-note .cbs-icon { color: var(--cbs-accent); }

.cbs-public-preview {
    width: min(760px, 100%);
    height: auto;
    margin-top: 22px;
    border: 1px solid var(--cbs-accent-border);
    border-radius: var(--cbs-radius-lg);
    background: var(--cbs-surface);
    box-shadow: var(--cbs-shadow);
}

.cbs-login-card {
    padding: clamp(22px, 3vw, 34px);
    border: 1px solid var(--cbs-accent-border);
    border-radius: var(--cbs-radius-lg);
    background: var(--cbs-surface);
    box-shadow: var(--cbs-shadow);
}

.cbs-login-heading { display:flex; align-items:center; gap:13px; margin-bottom:24px; }
.cbs-login-heading img { width:48px; height:48px; }
.cbs-login-heading span { display:block; color:var(--cbs-muted); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }
.cbs-login-heading h2 { margin:4px 0 0; font-size:24px; letter-spacing:-.03em; }

.cbs-form-group { margin-bottom: 16px; }
.cbs-form-group label { display:block; margin:0 0 7px 2px; color:var(--cbs-text-2); font-size:12px; font-weight:750; }

.cbs-input-shell {
    min-height: 50px;
    padding: 0 10px 0 13px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--cbs-border);
    border-radius: 10px;
    background: var(--cbs-input);
    transition: border-color var(--cbs-transition), background var(--cbs-transition), box-shadow var(--cbs-transition);
}

.cbs-input-shell > .cbs-icon { color: var(--cbs-accent); }
.cbs-input-shell:hover { border-color: var(--cbs-accent-border); }
.cbs-input-shell:focus-within { border-color: var(--cbs-accent); box-shadow: 0 0 0 3px var(--cbs-accent-soft); }

.cbs-input {
    width: 100%;
    min-width: 0;
    height: 48px;
    padding: 0;
    border: 0;
    outline: 0;
    color: var(--cbs-text);
    background: transparent;
    font-size: 15px;
}
.cbs-input::placeholder { color: var(--cbs-muted); opacity: .75; }

.cbs-input-action {
    width: 38px;
    height: 36px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    border:0;
    border-radius:8px;
    color:var(--cbs-muted);
    background:transparent;
    cursor:pointer;
}
.cbs-input-action:hover { color:var(--cbs-accent); background:var(--cbs-accent-faint); }

.cbs-field-error { display:block; margin:6px 0 0 2px; color:var(--cbs-danger); font-size:12px; font-weight:650; }

.cbs-alert {
    margin-bottom: 16px;
    padding: 12px 13px;
    display:flex;
    align-items:flex-start;
    gap:9px;
    border-radius:10px;
    line-height:1.45;
}
.cbs-alert-error { color: var(--cbs-danger); border:1px solid var(--cbs-danger); background:var(--cbs-danger-soft); }

.cbs-login-button { width:100%; margin-top:2px; }
.cbs-login-button.is-loading { cursor:wait; opacity:.78; }
.cbs-login-footnote { margin:14px 0 0; color:var(--cbs-muted); text-align:center; font-size:12px; }

.cbs-public-footer,
.cbs-app-footer {
    position: fixed;
    z-index: 1100;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--cbs-footer-height);
    padding: 0 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid var(--cbs-accent-border);
    background: var(--cbs-footer);
    color: var(--cbs-muted);
    font-size: 12px;
}


.cbs-logout-card { width:min(480px,100%); margin:auto; text-align:center; }
.cbs-logout-logo { width:64px; height:64px; margin:0 auto 18px; }
.cbs-logout-title { margin:0; font-size:28px; letter-spacing:-.03em; }
.cbs-logout-text { margin:12px 0 22px; color:var(--cbs-muted); line-height:1.6; }

/* =========================================================
   AUTHENTICATED APPLICATION SHELL
========================================================= */

.cbs-app-body { overflow-x: hidden; }

.cbs-app-header {
    position: fixed;
    z-index: 1300;
    top: 0;
    left: 0;
    right: 0;
    height: var(--cbs-header-height);
    padding: 0 14px;
    display: grid;
    grid-template-columns: minmax(300px, auto) minmax(240px, 620px) minmax(300px, auto);
    align-items: center;
    gap: 18px;
    border-bottom: 1px solid var(--cbs-accent-border);
    background: var(--cbs-header);
}

.cbs-app-header-left,
.cbs-app-header-actions { display:flex; align-items:center; gap:9px; min-width:0; }
.cbs-app-header-actions { justify-content:flex-end; }
.cbs-app-header-center { min-width:0; }

.cbs-menu-button { border-color: var(--cbs-accent-border); background:var(--cbs-accent-faint); color:var(--cbs-accent); }

.cbs-app-brand img { width:36px; height:36px; }
.cbs-app-brand > span { display:flex; flex-direction:column; font-weight:800; line-height:1.05; white-space:nowrap; }
.cbs-app-brand small { margin-top:3px; color:var(--cbs-muted); font-size:10px; font-weight:650; letter-spacing:.03em; }
.cbs-header-divider { width:1px; height:30px; margin:0 3px; background:var(--cbs-border); }
.cbs-page-title { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:17px; font-weight:750; }

.cbs-global-search {
    height: 42px;
    padding: 0 12px;
    display:flex;
    align-items:center;
    gap:9px;
    border:1px solid var(--cbs-border);
    border-radius:10px;
    background:var(--cbs-input);
}
.cbs-global-search .cbs-icon { color:var(--cbs-muted); }
.cbs-global-search input { width:100%; min-width:0; border:0; outline:0; color:var(--cbs-text); background:transparent; }
.cbs-global-search input::placeholder { color:var(--cbs-muted); }
.cbs-search-shortcut { color:var(--cbs-muted); font-size:10px; white-space:nowrap; }

.cbs-notification-button { position:relative; }
.cbs-notification-button::after { content:""; position:absolute; top:8px; right:8px; width:6px; height:6px; border-radius:50%; background:var(--cbs-accent); }

.cbs-user-box {
    min-height: 42px;
    padding: 4px 9px 4px 5px;
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--cbs-border);
    border-radius:10px;
    background:var(--cbs-surface);
}
.cbs-user-avatar { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; color:#fff; background:var(--cbs-accent-strong); font-weight:800; }
.cbs-user-copy { display:flex; flex-direction:column; min-width:0; line-height:1.1; }
.cbs-user-copy strong { max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
.cbs-user-copy small { margin-top:3px; color:var(--cbs-muted); font-size:10px; }

.cbs-sidebar {
    position: fixed;
    z-index: 1200;
    top: var(--cbs-header-height);
    left: 0;
    bottom: var(--cbs-footer-height);
    width: var(--cbs-sidebar-width);
    border-right: 1px solid var(--cbs-accent-border);
    background: var(--cbs-sidebar);
    transition: width var(--cbs-transition), transform var(--cbs-transition);
}

.cbs-sidebar-inner { height:100%; overflow-y:auto; padding:12px 10px 18px; scrollbar-width:thin; scrollbar-color:var(--cbs-border) transparent; }
.cbs-nav { display:flex; flex-direction:column; gap:8px; }

.cbs-nav-link {
    min-height: 44px;
    padding: 0 11px;
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid var(--cbs-border-soft);
    border-radius:10px;
    color:var(--cbs-text-2);
    background:var(--cbs-surface);
    text-decoration:none;
    font-weight:650;
    transition: border-color var(--cbs-transition), background var(--cbs-transition), color var(--cbs-transition);
}

.cbs-nav-link:hover {
    color:var(--cbs-text);
    border-color:var(--cbs-accent-border);
    background:var(--cbs-accent-faint);
}

.cbs-nav-link.is-active {
    color:var(--cbs-text);
    border-color:var(--cbs-accent-border);
    background:var(--cbs-accent-soft);
}
.cbs-nav-link.is-active .cbs-icon { color:var(--cbs-accent); }

.cbs-nav-group {
    padding: 6px;
    border: 1px solid var(--cbs-accent-border);
    border-radius: 12px;
    background: var(--cbs-accent-faint);
}

.cbs-nav-group-toggle {
    width:100%;
    min-height:32px;
    padding:0 6px 0 7px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border:0;
    color:var(--cbs-muted);
    background:transparent;
    cursor:pointer;
    font-size:10px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.cbs-nav-group-toggle .cbs-icon { width:15px; height:15px; transition:transform var(--cbs-transition); }
.cbs-nav-group.is-open .cbs-nav-group-toggle .cbs-icon { transform:rotate(180deg); }
.cbs-nav-group-body { display:none; flex-direction:column; gap:6px; }
.cbs-nav-group.is-open .cbs-nav-group-body { display:flex; }

.cbs-sidebar-overlay { display:none; }

.cbs-app-main {
    min-height: 100dvh;
    margin-left: var(--cbs-sidebar-width);
    padding: calc(var(--cbs-header-height) + 18px) 18px calc(var(--cbs-footer-height) + 18px);
    transition: margin-left var(--cbs-transition);
}

body.cbs-sidebar-collapsed .cbs-sidebar { width:var(--cbs-sidebar-collapsed); }
body.cbs-sidebar-collapsed .cbs-app-main { margin-left:var(--cbs-sidebar-collapsed); }
body.cbs-sidebar-collapsed .cbs-sidebar-inner { padding-left:8px; padding-right:8px; }
body.cbs-sidebar-collapsed .cbs-nav-group { padding:5px; }
body.cbs-sidebar-collapsed .cbs-nav-group-toggle span { display:none; }
body.cbs-sidebar-collapsed .cbs-nav-group-toggle { justify-content:center; min-height:20px; }
body.cbs-sidebar-collapsed .cbs-nav-group-toggle .cbs-icon { width:12px; height:12px; }
body.cbs-sidebar-collapsed .cbs-nav-link { justify-content:center; padding:0; }
body.cbs-sidebar-collapsed .cbs-nav-link span { display:none; }

/* =========================================================
   PAGE / DASHBOARD COMPONENTS
========================================================= */

.cbs-page-shell { width:min(1500px, 100%); margin:0 auto; }
.cbs-page-head { margin-bottom:16px; display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
.cbs-page-head h1 { margin:0; font-size:26px; letter-spacing:-.035em; }
.cbs-page-head p { margin:5px 0 0; color:var(--cbs-muted); line-height:1.5; }
.cbs-page-actions { display:flex; align-items:center; gap:8px; }

.cbs-kpi-grid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; }
.cbs-kpi-card {
    min-height: 118px;
    padding: 16px;
    display:flex;
    align-items:flex-start;
    gap:12px;
    border:1px solid var(--cbs-accent-border);
    border-radius:var(--cbs-radius);
    background:var(--cbs-surface);
}
.cbs-kpi-icon { width:42px; height:42px; display:grid; place-items:center; flex:0 0 auto; border:1px solid var(--cbs-accent-border); border-radius:11px; color:var(--cbs-accent); background:var(--cbs-accent-faint); }
.cbs-kpi-copy small { display:block; color:var(--cbs-muted); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.cbs-kpi-value { margin-top:7px; font-size:24px; font-weight:800; letter-spacing:-.035em; }
.cbs-kpi-change { margin-top:5px; color:var(--cbs-success); font-size:11px; font-weight:700; }

.cbs-dashboard-grid { margin-top:12px; display:grid; grid-template-columns:minmax(0, 1.5fr) minmax(300px, .7fr); gap:12px; }
.cbs-card { border:1px solid var(--cbs-accent-border); border-radius:var(--cbs-radius); background:var(--cbs-surface); }
.cbs-card-head { min-height:50px; padding:0 15px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--cbs-border-soft); }
.cbs-card-head strong { font-size:14px; }
.cbs-card-body { padding:15px; }

.cbs-module-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px; }
.cbs-module-card { min-height:108px; padding:14px; border:1px solid var(--cbs-border); border-radius:10px; background:var(--cbs-bg-raised); }
.cbs-module-card .cbs-feature-icon { margin-bottom:12px; }
.cbs-module-card strong { display:block; }
.cbs-module-card small { display:block; margin-top:5px; color:var(--cbs-muted); line-height:1.45; }

.cbs-activity-list { display:flex; flex-direction:column; }
.cbs-activity-item { padding:12px 0; display:flex; gap:10px; border-bottom:1px solid var(--cbs-border-soft); }
.cbs-activity-item:last-child { border-bottom:0; }
.cbs-activity-icon { width:34px; height:34px; display:grid; place-items:center; flex:0 0 auto; border-radius:9px; color:var(--cbs-accent); background:var(--cbs-accent-faint); border:1px solid var(--cbs-accent-border); }
.cbs-activity-copy { min-width:0; }
.cbs-activity-copy strong { display:block; font-size:12px; }
.cbs-activity-copy small { display:block; margin-top:4px; color:var(--cbs-muted); font-size:11px; }

.cbs-status-dot { width:7px; height:7px; display:inline-block; margin:0 4px; border-radius:50%; background:var(--cbs-success); }

/* =========================================================
   THEME PANEL + TOAST
========================================================= */

.cbs-theme-panel {
    position: fixed;
    z-index: 3000;
    top: calc(var(--cbs-shell-top,var(--cbs-header-height)) + 10px);
    right: 12px;
    width: 300px;
    padding: 16px;
    display: none;
    border: 1px solid var(--cbs-accent-border);
    border-radius: 14px;
    background: var(--cbs-surface);
    box-shadow: var(--cbs-shadow);
}
.cbs-theme-panel.is-open { display:block; }
.cbs-theme-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.cbs-theme-head strong { display:block; font-size:15px; }
.cbs-theme-head small { display:block; margin-top:4px; color:var(--cbs-muted); font-size:11px; }
.cbs-theme-label { margin:16px 0 7px; color:var(--cbs-muted); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.cbs-theme-modes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.cbs-theme-modes button { min-height:40px; display:flex; align-items:center; justify-content:center; gap:7px; border:1px solid var(--cbs-border); border-radius:9px; color:var(--cbs-text-2); background:var(--cbs-bg-raised); cursor:pointer; font-weight:700; }
.cbs-theme-modes button.is-active { color:var(--cbs-accent); border-color:var(--cbs-accent-border); background:var(--cbs-accent-faint); }
.cbs-accent-row { display:grid; grid-template-columns:repeat(6, 1fr); gap:8px; }
.cbs-accent { width:34px; height:34px; border:2px solid transparent; border-radius:9px; cursor:pointer; }
.cbs-accent.is-active { outline:2px solid var(--cbs-text); outline-offset:2px; }
.cbs-accent-blue { background:#4f8df7; }
.cbs-accent-teal { background:#32aaa0; }
.cbs-accent-green { background:#55ad69; }
.cbs-accent-violet { background:#8b78e6; }
.cbs-accent-orange { background:#d68a49; }
.cbs-accent-rose { background:#d56f8d; }

.cbs-toast {
    position:fixed;
    z-index:4000;
    right:18px;
    bottom:calc(var(--cbs-footer-height) + 16px);
    max-width:330px;
    padding:11px 13px;
    display:none;
    border:1px solid var(--cbs-accent-border);
    border-radius:10px;
    color:var(--cbs-text);
    background:var(--cbs-surface);
    box-shadow:var(--cbs-shadow);
    font-size:12px;
}
.cbs-toast.is-visible { display:block; }

/* =========================================================
   ACCESSIBILITY / MOTION
========================================================= */

:focus-visible { outline:2px solid var(--cbs-accent); outline-offset:2px; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: .001ms !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }
}

/* =========================================================
   PAGE BLUEPRINTS
   Direct-page and record-detail layout rules live in:
   /SiteMaster/PageBlueprint.css
   Phone/tablet overrides remain in /SiteMaster/Phone.css.
========================================================= */

/* =========================================================
   SITE MASTER REDESIGN v20260829_09
   Solid, fast surfaces. Dark canvas is deeper; #181F2B is the primary raised surface.
   Center menus slide UP over the main menu.
========================================================= */
:root {
    --cbs-header-height: 64px;
    --cbs-footer-height: 42px;
    --cbs-sidebar-width: 250px;
    --cbs-sidebar-collapsed: 72px;

    --cbs-bg: #111722;
    --cbs-bg-raised: #141c27;
    --cbs-surface: #181f2b;
    --cbs-surface-2: #1c2634;
    --cbs-surface-3: #223044;
    --cbs-sidebar: #0d141e;
    --cbs-header: #0e151f;
    --cbs-footer: #0e151f;
    --cbs-input: #131c28;
    --cbs-text: #f5f8fb;
    --cbs-text-2: #cbd5e1;
    --cbs-muted: #91a0b4;
    --cbs-border: #2b3b50;
    --cbs-border-soft: #213044;
    --cbs-shadow: 0 8px 24px rgba(0,0,0,.22);

    --cbs-green:#61d159;
    --cbs-blue:#4a9cff;
    --cbs-orange:#ff7a2f;
    --cbs-amber:#f5ba17;
    --cbs-violet:#b06cf0;
    --cbs-cyan:#22c9c3;
    --cbs-lime:#88d94c;
    --cbs-rose:#ee6f8d;
}

html[data-mode="light"] {
    --cbs-bg:#f3f6fa;
    --cbs-bg-raised:#ffffff;
    --cbs-surface:#ffffff;
    --cbs-surface-2:#f7f9fc;
    --cbs-surface-3:#edf2f7;
    --cbs-sidebar:#ffffff;
    --cbs-header:#ffffff;
    --cbs-footer:#ffffff;
    --cbs-input:#f5f8fb;
    --cbs-text:#172133;
    --cbs-text-2:#4f5f73;
    --cbs-muted:#78869a;
    --cbs-border:#d8e0ea;
    --cbs-border-soft:#e8edf3;
    --cbs-shadow:0 7px 20px rgba(35,52,76,.07);
}

.cbs-app-header {
    height:var(--cbs-header-height);
    padding:0 18px 0 20px;
    display:grid;
    grid-template-columns:minmax(360px, 1fr) minmax(330px, 520px) minmax(360px, 1fr);
    gap:18px;
    align-items:center;
    border-bottom:1px solid var(--cbs-border-soft);
    background:var(--cbs-header);
    box-shadow:none;
}

.cbs-app-header-left { gap:12px; }
.cbs-app-brand { min-width:205px; gap:9px; }
.cbs-app-brand img { width:37px; height:37px; }
.cbs-app-brand > span { font-size:19px; line-height:1.05; }
.cbs-app-brand > span small { margin-top:4px; color:var(--cbs-cyan); font-size:10px; letter-spacing:.03em; }
.cbs-menu-button { margin-left:4px; border-color:transparent; background:transparent; }
.cbs-menu-button:hover { background:var(--cbs-surface); }
.cbs-header-page-copy { min-width:0; padding-left:4px; }
.cbs-page-title { display:block; overflow:hidden; color:var(--cbs-text); font-size:17px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.cbs-page-subtitle { display:block; margin-top:2px; color:var(--cbs-muted); font-size:10px; }
.cbs-header-divider { display:none; }

.cbs-global-search {
    height:39px;
    border-color:var(--cbs-border);
    border-radius:8px;
    background:var(--cbs-input);
}
.cbs-global-search .cbs-icon { color:var(--cbs-muted); }
.cbs-global-search input { color:var(--cbs-text); }
.cbs-global-search input::placeholder { color:var(--cbs-muted); }
.cbs-search-shortcut { border-color:var(--cbs-border); background:var(--cbs-surface-2); }

.cbs-app-header-actions { gap:7px; }
.cbs-header-quick-add {
    width:38px; height:38px; display:grid; place-items:center; border:0; border-radius:50%;
    color:#fff; background:var(--cbs-accent); cursor:pointer;
    transition:transform 140ms ease, filter 140ms ease;
}
.cbs-header-quick-add:hover { transform:translateY(-1px) rotate(4deg); filter:brightness(1.08); }
.cbs-header-quick-add .cbs-icon { width:20px; height:20px; }
.cbs-app-header-actions .cbs-icon-button { width:38px; height:38px; border-color:transparent; background:transparent; }
.cbs-app-header-actions .cbs-icon-button:hover { border-color:var(--cbs-border); background:var(--cbs-surface); }
.cbs-notification-button { position:relative; }
.cbs-action-badge { position:absolute; top:2px; right:1px; min-width:16px; height:16px; padding:0 4px; display:grid; place-items:center; border:2px solid var(--cbs-header); border-radius:999px; color:#fff; background:var(--cbs-accent); font-size:8px; font-weight:900; }
.cbs-user-box { min-width:140px; border:0; background:transparent; }
.cbs-user-avatar { border-color:var(--cbs-border); background:var(--cbs-surface-2); }

.cbs-sidebar {
    top:var(--cbs-header-height);
    bottom:var(--cbs-footer-height);
    width:var(--cbs-sidebar-width);
    overflow:hidden;
    border-right:1px solid var(--cbs-border-soft);
    background:var(--cbs-sidebar);
    transition:width 190ms ease, transform 190ms ease;
}
.cbs-sidebar-stage { position:relative; width:100%; height:100%; overflow:hidden; }
.cbs-sidebar-main { height:100%; padding:13px 9px 12px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--cbs-border) transparent; }
.cbs-sidebar-label { margin:4px 10px 10px; color:var(--cbs-muted); font-size:9px; font-weight:850; letter-spacing:.09em; text-transform:uppercase; }
.cbs-nav-main { display:grid; gap:4px; }
.cbs-nav-group { margin-top:10px; padding-top:8px; border-top:1px solid var(--cbs-border-soft); }
.cbs-nav-group:first-of-type { margin-top:8px; }
.cbs-nav-group-title { margin:0 9px 6px; color:var(--cbs-accent); font-size:9px; font-weight:900; letter-spacing:.075em; text-transform:uppercase; }
.cbs-nav-group .cbs-nav-entry { min-height:39px; }
.cbs-nav-group .cbs-nav-icon { width:28px; height:28px; border-radius:7px; }
.cbs-nav-group .cbs-nav-icon .cbs-icon { width:17px; height:17px; }
.cbs-nav-entry {
    width:100%; min-height:42px; padding:0 9px; display:grid; grid-template-columns:30px minmax(0,1fr) 18px; align-items:center; gap:8px;
    border:1px solid transparent; border-radius:8px; color:var(--cbs-text-2); background:transparent;
    text-align:left; text-decoration:none; cursor:pointer;
    transition:background 140ms ease, border-color 140ms ease, color 140ms ease, transform 140ms ease;
}
.cbs-nav-entry:hover { transform:translateX(2px); border-color:var(--cbs-border-soft); background:var(--cbs-surface); color:var(--cbs-text); }
.cbs-nav-entry.is-active { border-color:color-mix(in srgb, var(--cbs-accent) 28%, var(--cbs-border)); background:color-mix(in srgb, var(--cbs-accent) 10%, var(--cbs-surface)); color:var(--cbs-text); }
.cbs-nav-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; color:var(--cbs-blue); background:color-mix(in srgb, currentColor 10%, transparent); }
.cbs-nav-icon .cbs-icon { width:18px; height:18px; }
.cbs-nav-text { min-width:0; overflow:hidden; font-size:12px; font-weight:650; text-overflow:ellipsis; white-space:nowrap; }
.cbs-nav-arrow { width:14px; height:14px; color:var(--cbs-muted); }

[data-color="green"] .cbs-nav-icon,[data-color="green"] .cbs-sub-icon { color:var(--cbs-green); }
[data-color="blue"] .cbs-nav-icon,[data-color="blue"] .cbs-sub-icon { color:var(--cbs-blue); }
[data-color="orange"] .cbs-nav-icon,[data-color="orange"] .cbs-sub-icon { color:var(--cbs-orange); }
[data-color="amber"] .cbs-nav-icon,[data-color="amber"] .cbs-sub-icon { color:var(--cbs-amber); }
[data-color="violet"] .cbs-nav-icon,[data-color="violet"] .cbs-sub-icon { color:var(--cbs-violet); }
[data-color="cyan"] .cbs-nav-icon,[data-color="cyan"] .cbs-sub-icon { color:var(--cbs-cyan); }
[data-color="lime"] .cbs-nav-icon,[data-color="lime"] .cbs-sub-icon { color:var(--cbs-lime); }
[data-color="rose"] .cbs-nav-icon,[data-color="rose"] .cbs-sub-icon { color:var(--cbs-rose); }
[data-color="neutral"] .cbs-nav-icon,[data-color="neutral"] .cbs-sub-icon { color:var(--cbs-muted); }

.cbs-quick-actions { margin-top:14px; padding:10px 8px 8px; border:1px solid var(--cbs-border-soft); border-radius:9px; background:color-mix(in srgb, var(--cbs-surface) 45%, transparent); }
.cbs-quick-actions-title { margin-bottom:6px; display:flex; align-items:center; gap:7px; color:var(--cbs-text-2); font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.cbs-quick-actions-title .cbs-icon { width:14px; height:14px; color:var(--cbs-cyan); }
.cbs-quick-actions a { min-height:30px; padding:0 5px; display:flex; align-items:center; gap:8px; border-radius:6px; color:var(--cbs-muted); font-size:11px; text-decoration:none; }
.cbs-quick-actions a:hover { color:var(--cbs-text); background:var(--cbs-surface-2); }
.cbs-quick-actions a .cbs-icon { width:14px; height:14px; color:var(--cbs-cyan); }

/* The requested behavior: submenu begins below the sidebar and slides UP over it. */
.cbs-center-panel {
    position:absolute; z-index:4; inset:0; display:flex; flex-direction:column;
    border-right:1px solid var(--cbs-border-soft); background:var(--cbs-sidebar);
    opacity:.4; pointer-events:none; transform:translateY(102%);
    transition:transform 240ms cubic-bezier(.2,.72,.2,1), opacity 180ms ease;
    will-change:transform;
}
.cbs-center-panel.is-open { opacity:1; pointer-events:auto; transform:translateY(0); }
.cbs-center-panel-head { min-height:62px; padding:12px 13px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--cbs-border-soft); }
.cbs-center-panel-head small { display:block; margin-bottom:2px; color:var(--cbs-muted); font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.cbs-center-panel-head strong { color:var(--cbs-accent); font-size:14px; }
.cbs-center-panel-head button { width:32px; height:32px; display:grid; place-items:center; border:0; border-radius:8px; color:var(--cbs-muted); background:transparent; cursor:pointer; }
.cbs-center-panel-head button:hover { color:var(--cbs-text); background:var(--cbs-surface); }
.cbs-center-links { flex:1 1 auto; min-height:0; padding:10px 8px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--cbs-border) transparent; }
.cbs-center-links > a { min-height:56px; margin-bottom:5px; padding:7px 8px; display:grid; grid-template-columns:36px minmax(0,1fr); align-items:center; gap:9px; border:1px solid var(--cbs-border-soft); border-radius:8px; color:var(--cbs-text-2); background:var(--cbs-bg-raised); text-decoration:none; transition:border-color 140ms ease, background 140ms ease, transform 140ms ease; }
.cbs-center-links > a:hover { transform:translateX(2px); border-color:color-mix(in srgb, var(--cbs-accent) 34%, var(--cbs-border)); background:var(--cbs-surface-2); }
.cbs-sub-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:8px; background:color-mix(in srgb, currentColor 11%, transparent); }
.cbs-sub-icon .cbs-icon { width:19px; height:19px; }
.cbs-center-links strong { display:block; color:var(--cbs-text); font-size:11.5px; font-weight:750; line-height:1.2; }
.cbs-center-links small { display:block; margin-top:3px; overflow:hidden; color:var(--cbs-muted); font-size:9.5px; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.cbs-center-divider { margin:13px 5px 8px; display:flex; align-items:center; gap:8px; color:var(--cbs-accent); font-size:9px; font-weight:850; letter-spacing:.07em; text-transform:uppercase; }
.cbs-center-divider::after { content:""; height:1px; flex:1 1 auto; background:var(--cbs-border-soft); }
.cbs-center-back { min-height:48px; margin:9px; display:flex; align-items:center; justify-content:center; gap:8px; border:1px solid var(--cbs-border); border-radius:8px; color:var(--cbs-text); background:var(--cbs-surface); cursor:pointer; font-weight:750; transition:border-color 140ms ease, background 140ms ease, transform 140ms ease; }
.cbs-center-back:hover { transform:translateY(-1px); border-color:var(--cbs-accent-border); background:var(--cbs-accent-faint); color:var(--cbs-accent); }

body.cbs-sidebar-collapsed .cbs-sidebar { width:var(--cbs-sidebar-collapsed); }
body.cbs-sidebar-collapsed .cbs-app-main { margin-left:var(--cbs-sidebar-collapsed); }
body.cbs-sidebar-collapsed .cbs-sidebar-main { padding-left:8px; padding-right:8px; }
body.cbs-sidebar-collapsed .cbs-sidebar-label, body.cbs-sidebar-collapsed .cbs-nav-group-title, body.cbs-sidebar-collapsed .cbs-nav-text, body.cbs-sidebar-collapsed .cbs-nav-arrow, body.cbs-sidebar-collapsed .cbs-quick-actions { display:none; }
body.cbs-sidebar-collapsed .cbs-nav-group { margin-top:4px; padding-top:4px; border-top:0; }
body.cbs-sidebar-collapsed .cbs-nav-entry { grid-template-columns:1fr; padding:0; justify-items:center; }

.cbs-app-main { margin-left:var(--cbs-sidebar-width); padding:calc(var(--cbs-shell-top,var(--cbs-header-height)) + 16px) 18px calc(var(--cbs-footer-height) + 16px); background:var(--cbs-bg); transition:margin-left 190ms ease; }
.cbs-app-footer { height:var(--cbs-footer-height); padding:0 18px; justify-content:space-between; border-top:1px solid var(--cbs-border-soft); background:var(--cbs-footer); font-size:10px; }
.cbs-footer-left,.cbs-footer-right { display:flex; align-items:center; gap:9px; min-width:0; color:var(--cbs-muted); }
.cbs-footer-left strong { color:var(--cbs-cyan); font-weight:750; }
.cbs-footer-divider { width:1px; height:15px; background:var(--cbs-border); }
.cbs-status-dot { background:var(--cbs-green); box-shadow:none; }

/* =========================================================
   HOME DASHBOARD - visual system from approved concept.
========================================================= */
.cbs-home-dashboard { max-width:1540px; margin:0 auto; }
.cbs-home-head { margin-bottom:14px; display:flex; align-items:flex-end; justify-content:space-between; gap:14px; }
.cbs-home-head h1 { margin:0; font-size:19px; letter-spacing:-.02em; }
.cbs-home-head p { margin:4px 0 0; color:var(--cbs-muted); font-size:11px; }
.cbs-home-filters { display:flex; gap:8px; }
.cbs-filter-chip { min-height:36px; padding:0 12px; display:flex; align-items:center; gap:7px; border:1px solid var(--cbs-border); border-radius:8px; color:var(--cbs-text-2); background:var(--cbs-surface); font-size:11px; }

.cbs-overview-kpis { margin-bottom:13px; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
.cbs-overview-kpi { min-height:88px; padding:12px; display:grid; grid-template-columns:42px 1fr; gap:10px; align-items:center; border:1px solid var(--cbs-border); border-radius:9px; background:var(--cbs-surface); transition:transform 150ms ease,border-color 150ms ease,background 150ms ease; }
.cbs-overview-kpi:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--kpi-color,var(--cbs-accent)) 45%,var(--cbs-border)); background:var(--cbs-surface-2); }
.cbs-overview-kpi-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:50%; color:var(--kpi-color,var(--cbs-accent)); background:color-mix(in srgb,var(--kpi-color,var(--cbs-accent)) 12%,transparent); }
.cbs-overview-kpi-icon .cbs-icon { width:23px; height:23px; }
.cbs-overview-kpi small { color:var(--cbs-muted); font-size:10px; }
.cbs-overview-kpi strong { display:block; margin-top:3px; color:var(--cbs-text); font-size:17px; }
.cbs-overview-kpi em { display:block; margin-top:4px; color:var(--cbs-green); font-size:8.5px; font-style:normal; font-weight:750; }

.cbs-center-card-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; }
.cbs-dashboard-center-card { min-height:138px; padding:13px 13px 11px; position:relative; overflow:hidden; border:1px solid var(--cbs-border); border-radius:9px; background:var(--cbs-surface); cursor:pointer; transition:transform 150ms ease,border-color 150ms ease,background 150ms ease; }
.cbs-dashboard-center-card::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--center-color,var(--cbs-accent)); opacity:.8; }
.cbs-dashboard-center-card:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--center-color,var(--cbs-accent)) 45%,var(--cbs-border)); background:var(--cbs-surface-2); }
.cbs-center-card-top { display:grid; grid-template-columns:42px 1fr 18px; gap:10px; align-items:center; }
.cbs-center-card-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:10px; color:var(--center-color,var(--cbs-accent)); background:color-mix(in srgb,var(--center-color,var(--cbs-accent)) 11%,transparent); }
.cbs-center-card-icon .cbs-icon { width:24px; height:24px; }
.cbs-center-card-title strong { display:block; color:var(--cbs-text); font-size:12px; }
.cbs-center-card-title small { display:block; margin-top:4px; color:var(--cbs-muted); font-size:9.5px; line-height:1.35; }
.cbs-center-card-chevron { color:var(--cbs-muted); }
.cbs-center-card-stats { margin-top:13px; padding-top:10px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--cbs-border-soft); }
.cbs-center-card-stat { min-width:0; padding:0 8px; border-right:1px solid var(--cbs-border-soft); }
.cbs-center-card-stat:first-child { padding-left:0; }
.cbs-center-card-stat:last-child { padding-right:0; border-right:0; }
.cbs-center-card-stat small { display:block; overflow:hidden; color:var(--cbs-muted); font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.cbs-center-card-stat strong { display:block; margin-top:3px; overflow:hidden; color:var(--cbs-text); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }

.cbs-dashboard-bottom { margin-top:12px; display:grid; grid-template-columns:1fr 1fr; gap:11px; }
.cbs-dashboard-panel { min-height:168px; padding:13px; border:1px solid var(--cbs-border); border-radius:9px; background:var(--cbs-surface); }
.cbs-dashboard-panel-head { margin-bottom:8px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.cbs-dashboard-panel-head strong { font-size:12px; }
.cbs-dashboard-panel-head span { color:var(--cbs-muted); font-size:9px; }
.cbs-dashboard-list { display:grid; }
.cbs-dashboard-list-row { min-height:31px; display:grid; grid-template-columns:18px minmax(0,1fr) auto; gap:8px; align-items:center; border-bottom:1px solid var(--cbs-border-soft); color:var(--cbs-text-2); font-size:9.5px; }
.cbs-dashboard-list-row:last-child { border-bottom:0; }
.cbs-dashboard-list-row .cbs-icon { width:14px; height:14px; color:var(--row-color,var(--cbs-accent)); }
.cbs-dashboard-list-row small { color:var(--cbs-muted); font-size:8.5px; }
.cbs-dashboard-list-row a { color:var(--cbs-cyan); text-decoration:none; font-size:8.5px; }

/* Generic module placeholder used while individual center pages are built. */
.cbs-module-placeholder { max-width:1150px; margin:0 auto; }
.cbs-module-placeholder-card { min-height:400px; padding:34px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid var(--cbs-border); border-radius:12px; background:var(--cbs-surface); text-align:center; }
.cbs-module-placeholder-icon { width:64px; height:64px; margin-bottom:16px; display:grid; place-items:center; border-radius:16px; color:var(--cbs-accent); background:var(--cbs-accent-faint); }
.cbs-module-placeholder-icon .cbs-icon { width:30px; height:30px; }
.cbs-module-placeholder-card h1 { margin:0; font-size:22px; }
.cbs-module-placeholder-card p { max-width:560px; margin:9px auto 18px; color:var(--cbs-muted); line-height:1.55; }

@media (prefers-reduced-motion: reduce) {
    .cbs-center-panel,.cbs-nav-entry,.cbs-center-links>a,.cbs-dashboard-center-card,.cbs-overview-kpi,.cbs-header-quick-add { transition:none!important; }
}

.cbs-color-green { --kpi-color:var(--cbs-green); --center-color:var(--cbs-green); --row-color:var(--cbs-green); }
.cbs-color-blue { --kpi-color:var(--cbs-blue); --center-color:var(--cbs-blue); --row-color:var(--cbs-blue); }
.cbs-color-orange { --kpi-color:var(--cbs-orange); --center-color:var(--cbs-orange); --row-color:var(--cbs-orange); }
.cbs-color-amber { --kpi-color:var(--cbs-amber); --center-color:var(--cbs-amber); --row-color:var(--cbs-amber); }
.cbs-color-violet { --kpi-color:var(--cbs-violet); --center-color:var(--cbs-violet); --row-color:var(--cbs-violet); }
.cbs-color-cyan { --kpi-color:var(--cbs-cyan); --center-color:var(--cbs-cyan); --row-color:var(--cbs-cyan); }
.cbs-color-lime { --kpi-color:var(--cbs-lime); --center-color:var(--cbs-lime); --row-color:var(--cbs-lime); }
.cbs-color-rose { --kpi-color:var(--cbs-rose); --center-color:var(--cbs-rose); --row-color:var(--cbs-rose); }
.cbs-notification-button::after { content:none; }

/* =========================================================
   SITE MASTER POLISH v20260829_11
   - calm monochrome dark palette; slightly darker than #181F2B
   - main menu and slide-up submenu use the exact same color
   - flat centered group headings, collapsible and expanded by default
   - compact business identity block inspired by the supplied reference
   - persistent selected/active navigation state
========================================================= */
html[data-mode="dark"] {
    --cbs-bg:#11161f;
    --cbs-bg-raised:#151b25;
    --cbs-surface:#181f2b;
    --cbs-surface-2:#1b2330;
    --cbs-surface-3:#202a38;
    --cbs-sidebar:#0b1018;
    --cbs-header:#0b1018;
    --cbs-footer:#0b1018;
    --cbs-input:#141b25;
    --cbs-text:#f3f6fa;
    --cbs-text-2:#c7d0dc;
    --cbs-muted:#8996a8;
    --cbs-border:#293545;
    --cbs-border-soft:#1d2734;
    --cbs-shadow:0 9px 24px rgba(0,0,0,.22);
}

/* The rail and every slide-up center menu deliberately share one color. */
html[data-mode="dark"] .cbs-sidebar,
html[data-mode="dark"] .cbs-sidebar-main,
html[data-mode="dark"] .cbs-center-panel {
    background:#0b1018;
}
html[data-mode="dark"] .cbs-sidebar { border-right-color:#1b2532; }
html[data-mode="dark"] .cbs-center-panel { border-right-color:#1b2532; }

/* Compact customer/business identity: logo at left, name and address stacked. */
.cbs-client-identity {
    min-height:62px;
    margin:0 6px 11px;
    padding:7px 5px 10px;
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    align-items:center;
    gap:9px;
    border:0;
    border-radius:0;
    background:transparent;
}
.cbs-client-logo-wrap {
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border:0;
    border-radius:50%;
    background:var(--cbs-surface-2);
    overflow:hidden;
}
.cbs-client-logo { width:30px; height:30px; object-fit:contain; display:block; }
.cbs-client-copy { min-width:0; line-height:1.15; }
.cbs-client-copy strong,
.cbs-client-copy small { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cbs-client-copy strong { color:var(--cbs-text); font-size:11.5px; font-weight:800; }
.cbs-client-copy small { margin-top:4px; color:var(--cbs-muted); font-size:9px; font-weight:600; }

.cbs-sidebar-label {
    margin:2px 10px 8px;
    color:#69778a;
    font-size:8.5px;
    font-weight:800;
    letter-spacing:.10em;
}

/* Groups are flat: no surrounding card or separator. */
.cbs-nav-group {
    margin-top:12px;
    padding:0;
    border:0;
    background:transparent;
}
.cbs-nav-group:first-of-type { margin-top:7px; }
.cbs-nav-group-title {
    position:relative;
    width:100%;
    min-height:28px;
    margin:0 0 5px;
    padding:0 28px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:0;
    outline:0;
    color:color-mix(in srgb,var(--cbs-accent) 74%,#dbe7f5);
    background:transparent;
    cursor:pointer;
    font:inherit;
    font-size:10px;
    font-weight:850;
    letter-spacing:.065em;
    text-align:center;
    text-transform:uppercase;
    transition:color 140ms ease,opacity 140ms ease;
}
.cbs-nav-group-title:hover { color:var(--cbs-accent); }
.cbs-nav-group-title::after { content:none; }
.cbs-nav-group-title span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cbs-nav-group-chevron {
    position:absolute;
    right:8px;
    width:13px;
    height:13px;
    color:var(--cbs-muted);
    transition:transform 150ms ease,color 150ms ease;
}
.cbs-nav-group-title:hover .cbs-nav-group-chevron { color:var(--cbs-accent); }
.cbs-nav-group.is-collapsed .cbs-nav-group-chevron { transform:rotate(-90deg); }

html[data-mode="light"] .cbs-nav-group-title { color:color-mix(in srgb,var(--cbs-accent) 72%,#53657c); background:transparent; }

/* Keep selected navigation useful, but quieter than the previous revision. */
.cbs-nav-entry { position:relative; overflow:hidden; }
.cbs-nav-entry::before {
    content:"";
    position:absolute;
    top:8px;
    bottom:8px;
    left:0;
    width:3px;
    border-radius:0 3px 3px 0;
    background:var(--cbs-accent);
    opacity:0;
    transform:scaleY(.5);
    transition:opacity 140ms ease,transform 140ms ease;
}
.cbs-nav-entry.is-active {
    border-color:color-mix(in srgb,var(--cbs-accent) 28%,var(--cbs-border));
    background:color-mix(in srgb,var(--cbs-accent) 10%,var(--cbs-sidebar));
    color:var(--cbs-text);
}
.cbs-nav-entry.is-active::before { opacity:1; transform:scaleY(1); }
.cbs-nav-entry.is-active .cbs-nav-text { font-weight:800; }
.cbs-nav-entry.is-active .cbs-nav-arrow { color:var(--cbs-accent); }

.cbs-center-links > a { position:relative; overflow:hidden; }
.cbs-center-links > a::before {
    content:"";
    position:absolute;
    top:8px;
    bottom:8px;
    left:0;
    width:3px;
    border-radius:0 3px 3px 0;
    background:var(--cbs-accent);
    opacity:0;
    transform:scaleY(.5);
    transition:opacity 140ms ease,transform 140ms ease;
}
.cbs-center-links > a.is-active,
.cbs-center-links > a[aria-current="page"] {
    border-color:color-mix(in srgb,var(--cbs-accent) 32%,var(--cbs-border));
    background:color-mix(in srgb,var(--cbs-accent) 11%,#0b1018);
}
.cbs-center-links > a.is-active::before,
.cbs-center-links > a[aria-current="page"]::before { opacity:1; transform:scaleY(1); }
.cbs-center-links > a.is-active strong,
.cbs-center-links > a[aria-current="page"] strong { color:var(--cbs-text); font-weight:850; }
.cbs-center-links > a.is-active small,
.cbs-center-links > a[aria-current="page"] small { color:#aab5c4; }

/* Sidebar collapsed: identity reduces to logo; group headings disappear as before. */
body.cbs-sidebar-collapsed .cbs-client-identity {
    min-height:48px;
    margin:0 0 7px;
    padding:5px;
    grid-template-columns:1fr;
    justify-items:center;
}
body.cbs-sidebar-collapsed .cbs-client-copy { display:none; }
body.cbs-sidebar-collapsed .cbs-client-logo-wrap { width:36px; height:36px; }
body.cbs-sidebar-collapsed .cbs-nav-group-title { display:none; }

@media (max-width:860px) {
    .cbs-client-identity { min-height:62px; margin-bottom:9px; }
    body.cbs-sidebar-collapsed .cbs-client-identity {
        min-height:62px;
        margin:0 6px 9px;
        padding:7px 5px 10px;
        grid-template-columns:38px minmax(0,1fr);
        justify-items:stretch;
    }
    body.cbs-sidebar-collapsed .cbs-client-copy { display:block; }
    .cbs-nav-group-title { min-height:30px; }
}


/* =========================================================
   APPLICATION COLOR SYSTEM v20260829_12
   Inspired by the approved Creativity Ordering Solution look.
   IMPORTANT: navigation layout and sidebar menu color stay unchanged.
========================================================= */
html[data-mode="dark"] {
    --cbs-bg:#04142e;
    --cbs-bg-raised:#08172d;
    --cbs-surface:#0b162b;
    --cbs-surface-2:#0d1d39;
    --cbs-surface-3:#102442;
    --cbs-header:#101f39;
    --cbs-footer:#101f39;
    --cbs-input:#07172e;
    --cbs-text:#f7f9fd;
    --cbs-text-2:#c8d4e4;
    --cbs-muted:#91a6c0;
    --cbs-border:#1d3a61;
    --cbs-border-soft:#122b4b;
    --cbs-shadow:0 10px 26px rgba(0,0,0,.22);

    --cbs-accent:#1687ff;
    --cbs-accent-strong:#0874e8;
    --cbs-accent-soft:#0c2d55;
    --cbs-accent-faint:#071f3d;
    --cbs-accent-border:#1d4c7f;
}

html[data-accent="blue"] {
    --cbs-accent:#1687ff;
    --cbs-accent-strong:#0874e8;
    --cbs-accent-soft:#0c2d55;
    --cbs-accent-faint:#071f3d;
    --cbs-accent-border:#1d4c7f;
}

/* Header/footer use the same deep navy family as the reference. */
html[data-mode="dark"] .cbs-app-header,
html[data-mode="dark"] .cbs-app-footer {
    background:#101f39;
    border-color:#1b3c66;
}
html[data-mode="dark"] .cbs-global-search,
html[data-mode="dark"] .cbs-user-box,
html[data-mode="dark"] .cbs-icon-button {
    border-color:#1b3c66;
}

/* Do not restyle or recolor the approved main/sub navigation. */
html[data-mode="dark"] .cbs-sidebar,
html[data-mode="dark"] .cbs-sidebar-main,
html[data-mode="dark"] .cbs-center-panel {
    background:#0b1018;
}


/* =========================================================
   TYPOGRAPHY + SHELL POLISH v20260829_13
   - larger, clearer system typography (no external font download)
   - compact centered business profile inspired by supplied reference
   - subtle animated header/footer background shapes; transform-only
   - navigation structure and menu/submenu colors remain unchanged
========================================================= */

html, body {
    font-family: var(--cbs-font-family, "Segoe UI", Arial, sans-serif);
    font-size: 15px;
    font-weight: 450;
    letter-spacing: .002em;
}

/* Stronger application typography without making the shell bulky. */
.cbs-app-brand > span { font-size:20px; font-weight:850; letter-spacing:-.018em; }
.cbs-app-brand > span small { font-size:10.5px; font-weight:750; letter-spacing:.045em; }
.cbs-page-title { font-size:18px; font-weight:850; letter-spacing:-.018em; }
.cbs-page-subtitle { font-size:10.5px; font-weight:600; }
.cbs-global-search input { font-size:13px; font-weight:550; }
.cbs-search-shortcut { font-size:10px; font-weight:700; }
.cbs-user-copy strong { font-size:13px; font-weight:800; }
.cbs-user-copy small { font-size:10.5px; font-weight:650; }
.cbs-nav-text { font-size:13px; font-weight:700; }
.cbs-nav-entry.is-active .cbs-nav-text { font-weight:850; }
.cbs-nav-group-title { font-size:10.5px; font-weight:900; }
.cbs-center-panel-head strong { font-size:15px; font-weight:850; }
.cbs-center-links strong { font-size:12.5px; font-weight:800; }
.cbs-center-links small { font-size:10px; font-weight:550; }
.cbs-center-back { font-size:12px; font-weight:800; }
.cbs-quick-actions-title { font-size:10.5px; font-weight:850; }
.cbs-quick-actions a { font-size:11.5px; font-weight:600; }
.cbs-app-footer { font-size:11px; font-weight:600; }

/* Current business profile: centered avatar/logo, business name, then location/address. */
.cbs-client-identity {
    min-height:112px;
    margin:0 6px 12px;
    padding:10px 6px 12px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;
    text-align:center;
    border:0;
    background:transparent;
}
.cbs-client-logo-wrap {
    width:52px;
    height:52px;
    flex:0 0 auto;
    border:1px solid color-mix(in srgb,var(--cbs-border) 82%,#ffffff 18%);
    border-radius:50%;
    background:#f6f8fb;
    box-shadow:0 5px 14px rgba(0,0,0,.16);
    overflow:hidden;
}
.cbs-client-logo {
    width:100%;
    height:100%;
    padding:6px;
    object-fit:contain;
    border-radius:50%;
}
.cbs-client-copy {
    width:100%;
    min-width:0;
    line-height:1.15;
    text-align:center;
}
.cbs-client-copy strong,
.cbs-client-copy small {
    display:block;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.cbs-client-copy strong {
    position:relative;
    width:fit-content;
    padding-right:14px;
    color:var(--cbs-text);
    font-size:12.5px;
    font-weight:850;
    letter-spacing:-.01em;
}
.cbs-client-copy strong::after {
    content:"";
    position:absolute;
    top:50%;
    right:1px;
    width:5px;
    height:5px;
    border-right:1.5px solid var(--cbs-muted);
    border-bottom:1.5px solid var(--cbs-muted);
    transform:translateY(-70%) rotate(45deg);
}
.cbs-client-copy small {
    width:min(190px,100%);
    margin-top:4px;
    color:var(--cbs-muted);
    font-size:9.5px;
    font-weight:600;
}

/* Collapsed desktop rail keeps only the business mark. */
body.cbs-sidebar-collapsed .cbs-client-identity {
    min-height:56px;
    margin:0 0 8px;
    padding:4px 0 7px;
    display:flex;
}
body.cbs-sidebar-collapsed .cbs-client-logo-wrap { width:40px; height:40px; }
body.cbs-sidebar-collapsed .cbs-client-copy { display:none; }

/* Header/footer decorative bands. No blur/glass; only solid/gradient shapes. */
.cbs-app-header,
.cbs-app-footer {
    isolation:isolate;
    overflow:hidden;
}
.cbs-app-header > *,
.cbs-app-footer > * {
    position:relative;
    z-index:3;
}
.cbs-app-header::before,
.cbs-app-footer::before {
    content:"";
    position:absolute;
    z-index:0;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(90deg,
            color-mix(in srgb,var(--cbs-accent) 8%,transparent) 0%,
            transparent 24%,
            transparent 72%,
            color-mix(in srgb,var(--cbs-accent) 7%,transparent) 100%);
}
.cbs-app-header::after {
    content:"";
    position:absolute;
    z-index:1;
    top:-64px;
    left:15%;
    width:360px;
    height:112px;
    border-radius:0 0 120px 120px;
    background:linear-gradient(110deg,
        color-mix(in srgb,var(--cbs-accent) 17%,transparent),
        color-mix(in srgb,var(--cbs-accent) 4%,transparent));
    pointer-events:none;
    transform:translate3d(0,0,0) skewX(-16deg);
    animation:cbsHeaderBandMove 16s ease-in-out infinite alternate;
}
.cbs-app-footer::after {
    content:"";
    position:absolute;
    z-index:1;
    right:12%;
    bottom:-76px;
    width:390px;
    height:108px;
    border-radius:120px 120px 0 0;
    background:linear-gradient(110deg,
        color-mix(in srgb,var(--cbs-accent) 4%,transparent),
        color-mix(in srgb,var(--cbs-accent) 15%,transparent));
    pointer-events:none;
    transform:translate3d(0,0,0) skewX(18deg);
    animation:cbsFooterBandMove 18s ease-in-out infinite alternate;
}

@keyframes cbsHeaderBandMove {
    from { transform:translate3d(-26px,0,0) skewX(-16deg); }
    to   { transform:translate3d(88px,0,0) skewX(-16deg); }
}
@keyframes cbsFooterBandMove {
    from { transform:translate3d(24px,0,0) skewX(18deg); }
    to   { transform:translate3d(-92px,0,0) skewX(18deg); }
}

/* A thin accent stroke gives the strips a little more life without extra height. */
html[data-mode="dark"] .cbs-app-header { box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--cbs-accent) 22%,#1b3c66); }
html[data-mode="dark"] .cbs-app-footer { box-shadow:inset 0 1px 0 color-mix(in srgb,var(--cbs-accent) 18%,#1b3c66); }
html[data-mode="light"] .cbs-app-header::after,
html[data-mode="light"] .cbs-app-footer::after { opacity:.45; }

@media (prefers-reduced-motion:reduce) {
    .cbs-app-header::after,
    .cbs-app-footer::after { animation:none !important; }
}

@media (max-width:860px) {
    html, body { font-size:15px; }
    .cbs-client-identity {
        min-height:104px;
        margin:0 5px 10px;
        padding:8px 5px 10px;
    }
    .cbs-client-logo-wrap { width:48px; height:48px; }
    .cbs-client-copy strong { font-size:12px; }
    .cbs-client-copy small { font-size:9.5px; }
}


/* =========================================================
   APPEARANCE SYSTEM v20260830_14
   Fixes dark-mode accent application, adds brighter accents,
   keeps light-mode selected submenus light, and adds 3 font sizes.
========================================================= */
:root {
    --cbs-font-scale:1;
    --cbs-accent-glow:rgba(89,168,255,.24);
}

html[data-font-size="small"]  { --cbs-font-scale:.90; }
html[data-font-size="medium"] { --cbs-font-scale:1; }
html[data-font-size="large"]  { --cbs-font-scale:1.12; }

/* Dark mode accents are intentionally declared AFTER the dark palette.
   This prevents dark mode from forcing every accent back to blue. */
html[data-mode="dark"][data-accent="blue"] {
    --cbs-accent:#59a8ff; --cbs-accent-strong:#2f8fff;
    --cbs-accent-soft:#12355f; --cbs-accent-faint:#0a2545; --cbs-accent-border:#2e6498;
    --cbs-accent-glow:rgba(89,168,255,.28);
}
html[data-mode="dark"][data-accent="cyan"] {
    --cbs-accent:#3de4ee; --cbs-accent-strong:#16c8d4;
    --cbs-accent-soft:#103a43; --cbs-accent-faint:#09282f; --cbs-accent-border:#2a6972;
    --cbs-accent-glow:rgba(61,228,238,.26);
}
html[data-mode="dark"][data-accent="teal"] {
    --cbs-accent:#46d5bf; --cbs-accent-strong:#23bba5;
    --cbs-accent-soft:#123b35; --cbs-accent-faint:#0b2925; --cbs-accent-border:#2d6b62;
    --cbs-accent-glow:rgba(70,213,191,.25);
}
html[data-mode="dark"][data-accent="green"] {
    --cbs-accent:#79e493; --cbs-accent-strong:#4fca70;
    --cbs-accent-soft:#183b25; --cbs-accent-faint:#10291a; --cbs-accent-border:#3f704e;
    --cbs-accent-glow:rgba(121,228,147,.24);
}
html[data-mode="dark"][data-accent="lime"] {
    --cbs-accent:#b0eb63; --cbs-accent-strong:#8fd23b;
    --cbs-accent-soft:#2b3c18; --cbs-accent-faint:#1d2910; --cbs-accent-border:#60773b;
    --cbs-accent-glow:rgba(176,235,99,.23);
}
html[data-mode="dark"][data-accent="violet"] {
    --cbs-accent:#ac92ff; --cbs-accent-strong:#8d6ff0;
    --cbs-accent-soft:#2d2852; --cbs-accent-faint:#201c3a; --cbs-accent-border:#5d5290;
    --cbs-accent-glow:rgba(172,146,255,.28);
}
html[data-mode="dark"][data-accent="orange"] {
    --cbs-accent:#ff9f5a; --cbs-accent-strong:#f07e2f;
    --cbs-accent-soft:#452c19; --cbs-accent-faint:#301e11; --cbs-accent-border:#7c5536;
    --cbs-accent-glow:rgba(255,159,90,.28);
}
html[data-mode="dark"][data-accent="amber"] {
    --cbs-accent:#ffd05a; --cbs-accent-strong:#eeb62e;
    --cbs-accent-soft:#443718; --cbs-accent-faint:#2e250f; --cbs-accent-border:#776338;
    --cbs-accent-glow:rgba(255,208,90,.25);
}
html[data-mode="dark"][data-accent="rose"] {
    --cbs-accent:#ff86a8; --cbs-accent-strong:#eb648b;
    --cbs-accent-soft:#452534; --cbs-accent-faint:#301923; --cbs-accent-border:#7b465a;
    --cbs-accent-glow:rgba(255,134,168,.27);
}
html[data-mode="dark"][data-accent="pink"] {
    --cbs-accent:#ff83dc; --cbs-accent-strong:#e95bc4;
    --cbs-accent-soft:#45243e; --cbs-accent-faint:#30182b; --cbs-accent-border:#7c466e;
    --cbs-accent-glow:rgba(255,131,220,.27);
}

/* Light-mode companions keep the accent lively without making surfaces dark. */
html[data-mode="light"][data-accent="blue"]   { --cbs-accent:#247ff0; --cbs-accent-strong:#1269d2; --cbs-accent-soft:#e8f2ff; --cbs-accent-faint:#f3f8ff; --cbs-accent-border:#b9d7fb; --cbs-accent-glow:rgba(36,127,240,.16); }
html[data-mode="light"][data-accent="cyan"]   { --cbs-accent:#079bad; --cbs-accent-strong:#087f8d; --cbs-accent-soft:#e3f8fa; --cbs-accent-faint:#f2fcfd; --cbs-accent-border:#b7e5ea; --cbs-accent-glow:rgba(7,155,173,.14); }
html[data-mode="light"][data-accent="teal"]   { --cbs-accent:#168f80; --cbs-accent-strong:#0e776a; --cbs-accent-soft:#e5f7f4; --cbs-accent-faint:#f2fbfa; --cbs-accent-border:#bce5df; --cbs-accent-glow:rgba(22,143,128,.14); }
html[data-mode="light"][data-accent="green"]  { --cbs-accent:#389b52; --cbs-accent-strong:#287d3e; --cbs-accent-soft:#eaf7ee; --cbs-accent-faint:#f5fbf7; --cbs-accent-border:#c7e5cf; --cbs-accent-glow:rgba(56,155,82,.13); }
html[data-mode="light"][data-accent="lime"]   { --cbs-accent:#6d9d1d; --cbs-accent-strong:#567f13; --cbs-accent-soft:#f0f8df; --cbs-accent-faint:#f8fced; --cbs-accent-border:#d7e7b5; --cbs-accent-glow:rgba(109,157,29,.13); }
html[data-mode="light"][data-accent="violet"] { --cbs-accent:#7459d9; --cbs-accent-strong:#5f45c1; --cbs-accent-soft:#efedff; --cbs-accent-faint:#f8f7ff; --cbs-accent-border:#d4cdf8; --cbs-accent-glow:rgba(116,89,217,.15); }
html[data-mode="light"][data-accent="orange"] { --cbs-accent:#d8732c; --cbs-accent-strong:#bd5c17; --cbs-accent-soft:#fff0e3; --cbs-accent-faint:#fff8f2; --cbs-accent-border:#efd0b6; --cbs-accent-glow:rgba(216,115,44,.14); }
html[data-mode="light"][data-accent="amber"]  { --cbs-accent:#b67c00; --cbs-accent-strong:#976600; --cbs-accent-soft:#fff5d9; --cbs-accent-faint:#fffbef; --cbs-accent-border:#ead79d; --cbs-accent-glow:rgba(182,124,0,.13); }
html[data-mode="light"][data-accent="rose"]   { --cbs-accent:#c84f76; --cbs-accent-strong:#ad365d; --cbs-accent-soft:#ffedf3; --cbs-accent-faint:#fff7fa; --cbs-accent-border:#edc5d2; --cbs-accent-glow:rgba(200,79,118,.14); }
html[data-mode="light"][data-accent="pink"]   { --cbs-accent:#c44ba6; --cbs-accent-strong:#a9368d; --cbs-accent-soft:#ffecfa; --cbs-accent-faint:#fff6fd; --cbs-accent-border:#ecc4e2; --cbs-accent-glow:rgba(196,75,166,.14); }

/* Accent dots are intentionally brighter and softly luminous. */
.cbs-accent-row { grid-template-columns:repeat(5,1fr); gap:10px; }
.cbs-accent {
    width:38px; height:38px; justify-self:center; border-radius:11px;
    box-shadow:0 0 0 1px rgba(255,255,255,.04),0 0 12px color-mix(in srgb,currentColor 20%,transparent);
    transition:transform 130ms ease, box-shadow 130ms ease, outline-color 130ms ease;
}
.cbs-accent:hover { transform:translateY(-1px) scale(1.05); }
.cbs-accent.is-active { outline:2px solid var(--cbs-text); outline-offset:3px; box-shadow:0 0 18px var(--cbs-accent-glow); }
.cbs-accent-blue   { color:#59a8ff; background:#59a8ff; }
.cbs-accent-cyan   { color:#3de4ee; background:#3de4ee; }
.cbs-accent-teal   { color:#46d5bf; background:#46d5bf; }
.cbs-accent-green  { color:#79e493; background:#79e493; }
.cbs-accent-lime   { color:#b0eb63; background:#b0eb63; }
.cbs-accent-violet { color:#ac92ff; background:#ac92ff; }
.cbs-accent-orange { color:#ff9f5a; background:#ff9f5a; }
.cbs-accent-amber  { color:#ffd05a; background:#ffd05a; }
.cbs-accent-rose   { color:#ff86a8; background:#ff86a8; }
.cbs-accent-pink   { color:#ff83dc; background:#ff83dc; }

/* Give the selected accent some life without expensive filters. */
.cbs-button-primary,
.cbs-header-quick-add {
    box-shadow:0 0 0 1px color-mix(in srgb,var(--cbs-accent) 28%,transparent),0 0 16px var(--cbs-accent-glow);
}
.cbs-theme-modes button.is-active,
.cbs-theme-font-sizes button.is-active {
    box-shadow:0 0 0 1px color-mix(in srgb,var(--cbs-accent) 18%,transparent),0 0 12px color-mix(in srgb,var(--cbs-accent-glow) 70%,transparent);
}
.cbs-nav-entry.is-active::before,
.cbs-center-links > a.is-active::before,
.cbs-center-links > a[aria-current="page"]::before {
    box-shadow:0 0 10px var(--cbs-accent-glow);
}
.cbs-app-brand > span small,
.cbs-footer-left strong { color:var(--cbs-accent); }

/* Light mode selected submenu must stay on the light surface. */
.cbs-center-links > a.is-active,
.cbs-center-links > a[aria-current="page"] {
    background:color-mix(in srgb,var(--cbs-accent) 10%,var(--cbs-sidebar));
}
html[data-mode="light"] .cbs-center-links > a.is-active,
html[data-mode="light"] .cbs-center-links > a[aria-current="page"] {
    color:var(--cbs-text);
    border-color:color-mix(in srgb,var(--cbs-accent) 30%,var(--cbs-border));
    background:color-mix(in srgb,var(--cbs-accent) 9%,#ffffff);
}
html[data-mode="light"] .cbs-center-links > a.is-active strong,
html[data-mode="light"] .cbs-center-links > a[aria-current="page"] strong { color:var(--cbs-text); }
html[data-mode="light"] .cbs-center-links > a.is-active small,
html[data-mode="light"] .cbs-center-links > a[aria-current="page"] small { color:var(--cbs-muted); }

/* Three global website font sizes. Shared shell uses the same scale token. */
html, body { font-size:calc(15px * var(--cbs-font-scale)); }
.cbs-app-brand > span { font-size:calc(15px * var(--cbs-font-scale)); }
.cbs-app-brand > span small { font-size:calc(10.5px * var(--cbs-font-scale)); }
.cbs-page-title { font-size:calc(18px * var(--cbs-font-scale)); }
.cbs-page-subtitle { font-size:calc(10.5px * var(--cbs-font-scale)); }
.cbs-global-search input { font-size:calc(13px * var(--cbs-font-scale)); }
.cbs-search-shortcut { font-size:calc(10px * var(--cbs-font-scale)); }
.cbs-user-copy strong { font-size:calc(13px * var(--cbs-font-scale)); }
.cbs-user-copy small { font-size:calc(10.5px * var(--cbs-font-scale)); }
.cbs-nav-text { font-size:calc(13px * var(--cbs-font-scale)); }
.cbs-nav-group-title { font-size:calc(10.5px * var(--cbs-font-scale)); }
.cbs-center-panel-head strong { font-size:calc(15px * var(--cbs-font-scale)); }
.cbs-center-links strong { font-size:calc(12.5px * var(--cbs-font-scale)); }
.cbs-center-links small { font-size:calc(10px * var(--cbs-font-scale)); }
.cbs-center-back { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-quick-actions-title { font-size:calc(10.5px * var(--cbs-font-scale)); }
.cbs-quick-actions a { font-size:calc(11.5px * var(--cbs-font-scale)); }
.cbs-app-footer { font-size:calc(11px * var(--cbs-font-scale)); }
.cbs-client-copy strong { font-size:calc(12.5px * var(--cbs-font-scale)); }
.cbs-client-copy small { font-size:calc(9.5px * var(--cbs-font-scale)); }
.cbs-button { font-size:calc(14px * var(--cbs-font-scale)); }
.cbs-theme-head strong { font-size:calc(15px * var(--cbs-font-scale)); }
.cbs-theme-head small { font-size:calc(11px * var(--cbs-font-scale)); }
.cbs-theme-label { font-size:calc(10px * var(--cbs-font-scale)); }
.cbs-theme-modes button { font-size:calc(13px * var(--cbs-font-scale)); }

.cbs-theme-font-sizes {
    display:grid; grid-template-columns:repeat(3,1fr); gap:7px;
}
.cbs-theme-font-sizes button {
    min-height:48px; padding:5px 4px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    border:1px solid var(--cbs-border); border-radius:9px; color:var(--cbs-text-2); background:var(--cbs-bg-raised);
    cursor:pointer; font-weight:750; font-size:11px;
}
.cbs-theme-font-sizes button:hover { color:var(--cbs-text); border-color:var(--cbs-accent-border); }
.cbs-theme-font-sizes button.is-active { color:var(--cbs-accent); border-color:var(--cbs-accent-border); background:var(--cbs-accent-faint); }
.cbs-font-size-sample { line-height:1; color:var(--cbs-accent); font-weight:900; }
.cbs-font-size-sample.is-small { font-size:13px; }
.cbs-font-size-sample.is-medium { font-size:16px; }
.cbs-font-size-sample.is-large { font-size:20px; }

@media (max-width:860px) {
    html, body { font-size:calc(15px * var(--cbs-font-scale)); }
}


/* Font scale coverage for public/login, dashboard and module shells. */
.cbs-brand-copy strong { font-size:calc(16px * var(--cbs-font-scale)); }
.cbs-brand-copy small { font-size:calc(11px * var(--cbs-font-scale)); }
.cbs-public-nav a { font-size:calc(14px * var(--cbs-font-scale)); }
.cbs-eyebrow { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-public-lead { font-size:calc(16px * var(--cbs-font-scale)); }
.cbs-feature-card strong { font-size:calc(14px * var(--cbs-font-scale)); }
.cbs-feature-card small { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-login-heading span { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-login-heading h2 { font-size:calc(24px * var(--cbs-font-scale)); }
.cbs-form-group label { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-login-input { font-size:calc(15px * var(--cbs-font-scale)); }
.cbs-field-error { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-login-footnote { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-public-footer { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-home-head h1 { font-size:calc(19px * var(--cbs-font-scale)); }
.cbs-home-head p { font-size:calc(11px * var(--cbs-font-scale)); }
.cbs-filter-chip { font-size:calc(11px * var(--cbs-font-scale)); }
.cbs-overview-kpi small { font-size:calc(10px * var(--cbs-font-scale)); }
.cbs-overview-kpi strong { font-size:calc(17px * var(--cbs-font-scale)); }
.cbs-overview-kpi em { font-size:calc(8.5px * var(--cbs-font-scale)); }
.cbs-center-card-title strong { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-center-card-title small { font-size:calc(9.5px * var(--cbs-font-scale)); }
.cbs-center-card-stat small { font-size:calc(8px * var(--cbs-font-scale)); }
.cbs-center-card-stat strong { font-size:calc(11px * var(--cbs-font-scale)); }
.cbs-dashboard-panel-head strong { font-size:calc(12px * var(--cbs-font-scale)); }
.cbs-dashboard-panel-head span { font-size:calc(9px * var(--cbs-font-scale)); }
.cbs-dashboard-list-row { font-size:calc(9.5px * var(--cbs-font-scale)); }
.cbs-dashboard-list-row small,
.cbs-dashboard-list-row a { font-size:calc(8.5px * var(--cbs-font-scale)); }
.cbs-module-placeholder-card h1 { font-size:calc(22px * var(--cbs-font-scale)); }

/* =========================================================
   TYPOGRAPHY ROLE LOCK v20260830_17
   One shared type scale for the application shell and all
   page blueprints. Primary copy matches navigation copy;
   secondary copy is consistently one step smaller.
========================================================= */
:root {
    --cbs-font-primary:calc(13px * var(--cbs-font-scale));
    --cbs-font-secondary:calc(10.5px * var(--cbs-font-scale));
    --cbs-font-label:calc(9.5px * var(--cbs-font-scale));
}

/* Shell navigation + submenu use the same primary/secondary roles. */
.cbs-nav-text,
.cbs-center-links strong,
.cbs-user-copy strong { font-size:var(--cbs-font-primary); }
.cbs-center-links small,
.cbs-user-copy small,
.cbs-client-copy small { font-size:var(--cbs-font-secondary); }
.cbs-nav-group-title,
.cbs-quick-actions-title { font-size:var(--cbs-font-label); }
.cbs-quick-actions a { font-size:var(--cbs-font-secondary); }

/* Dashboard/main workspace copy follows the same roles. KPI values/headings remain intentionally larger. */
.cbs-home-head p,
.cbs-filter-chip,
.cbs-overview-kpi small,
.cbs-center-card-title small,
.cbs-center-card-stat strong,
.cbs-dashboard-panel-head span,
.cbs-dashboard-list-row,
.cbs-dashboard-list-row small,
.cbs-dashboard-list-row a { font-size:var(--cbs-font-secondary); }
.cbs-center-card-title strong,
.cbs-dashboard-panel-head strong { font-size:var(--cbs-font-primary); }
.cbs-center-card-stat small { font-size:var(--cbs-font-label); }


/* =========================================================
   CLASSIC MODE v20260830_18
   Deep navy base inspired by the hosting-panel reference.
   Surface "heat" follows the selected accent using color-mix.
   No blur/glass; all effects remain lightweight.
========================================================= */
html[data-mode="classic"] {
    --cbs-bg:color-mix(in srgb,#04142d 94%,var(--cbs-accent) 6%);
    --cbs-bg-raised:color-mix(in srgb,#071a38 91%,var(--cbs-accent) 9%);
    --cbs-surface:color-mix(in srgb,#0a2144 89%,var(--cbs-accent) 11%);
    --cbs-surface-2:color-mix(in srgb,#0c274d 87%,var(--cbs-accent) 13%);
    --cbs-surface-3:color-mix(in srgb,#102f59 84%,var(--cbs-accent) 16%);
    --cbs-sidebar:color-mix(in srgb,#06162f 92%,var(--cbs-accent) 8%);
    --cbs-header:color-mix(in srgb,#071b37 91%,var(--cbs-accent) 9%);
    --cbs-footer:color-mix(in srgb,#071b37 91%,var(--cbs-accent) 9%);
    --cbs-input:color-mix(in srgb,#071a35 93%,var(--cbs-accent) 7%);
    --cbs-text:#f7f9fd;
    --cbs-text-2:#cbd7e8;
    --cbs-muted:#92a8c3;
    --cbs-border:color-mix(in srgb,#23486f 76%,var(--cbs-accent) 24%);
    --cbs-border-soft:color-mix(in srgb,#153453 82%,var(--cbs-accent) 18%);
    --cbs-danger:#ff7b7b;
    --cbs-danger-soft:#3c2026;
    --cbs-success:#72dc93;
    --cbs-success-soft:#173726;
    --cbs-shadow:0 10px 26px rgba(0,0,0,.24);
}

/* Classic keeps the main and slide-up menus in the same color family. */
html[data-mode="classic"] .cbs-sidebar,
html[data-mode="classic"] .cbs-sidebar-main,
html[data-mode="classic"] .cbs-center-panel {
    background:var(--cbs-sidebar);
    border-color:var(--cbs-border-soft);
}

html[data-mode="classic"] .cbs-app-header,
html[data-mode="classic"] .cbs-app-footer {
    background:var(--cbs-header);
    border-color:var(--cbs-border);
    box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--cbs-accent) 26%,#17395e);
}
html[data-mode="classic"] .cbs-app-footer {
    background:var(--cbs-footer);
    box-shadow:inset 0 1px 0 color-mix(in srgb,var(--cbs-accent) 22%,#17395e);
}
html[data-mode="classic"] .cbs-global-search,
html[data-mode="classic"] .cbs-user-box,
html[data-mode="classic"] .cbs-icon-button {
    border-color:var(--cbs-border);
}

/* Reuse the lively dark accents in Classic mode. */
html[data-mode="classic"][data-accent="blue"]   { --cbs-accent:#59a8ff; --cbs-accent-strong:#2f8fff; --cbs-accent-soft:#12355f; --cbs-accent-faint:#0a2545; --cbs-accent-border:#2e6498; --cbs-accent-glow:rgba(89,168,255,.30); }
html[data-mode="classic"][data-accent="cyan"]   { --cbs-accent:#3de4ee; --cbs-accent-strong:#16c8d4; --cbs-accent-soft:#103a43; --cbs-accent-faint:#09282f; --cbs-accent-border:#2a6972; --cbs-accent-glow:rgba(61,228,238,.29); }
html[data-mode="classic"][data-accent="teal"]   { --cbs-accent:#46d5bf; --cbs-accent-strong:#23bba5; --cbs-accent-soft:#123b35; --cbs-accent-faint:#0b2925; --cbs-accent-border:#2d6b62; --cbs-accent-glow:rgba(70,213,191,.28); }
html[data-mode="classic"][data-accent="green"]  { --cbs-accent:#79e493; --cbs-accent-strong:#4fca70; --cbs-accent-soft:#183b25; --cbs-accent-faint:#10291a; --cbs-accent-border:#3f704e; --cbs-accent-glow:rgba(121,228,147,.27); }
html[data-mode="classic"][data-accent="lime"]   { --cbs-accent:#b0eb63; --cbs-accent-strong:#8fd23b; --cbs-accent-soft:#2b3c18; --cbs-accent-faint:#1d2910; --cbs-accent-border:#60773b; --cbs-accent-glow:rgba(176,235,99,.26); }
html[data-mode="classic"][data-accent="violet"] { --cbs-accent:#ac92ff; --cbs-accent-strong:#8d6ff0; --cbs-accent-soft:#2d2852; --cbs-accent-faint:#201c3a; --cbs-accent-border:#5d5290; --cbs-accent-glow:rgba(172,146,255,.30); }
html[data-mode="classic"][data-accent="orange"] { --cbs-accent:#ff9f5a; --cbs-accent-strong:#f07e2f; --cbs-accent-soft:#452c19; --cbs-accent-faint:#301e11; --cbs-accent-border:#7c5536; --cbs-accent-glow:rgba(255,159,90,.30); }
html[data-mode="classic"][data-accent="amber"]  { --cbs-accent:#ffd05a; --cbs-accent-strong:#eeb62e; --cbs-accent-soft:#443718; --cbs-accent-faint:#2e250f; --cbs-accent-border:#776338; --cbs-accent-glow:rgba(255,208,90,.28); }
html[data-mode="classic"][data-accent="rose"]   { --cbs-accent:#ff86a8; --cbs-accent-strong:#eb648b; --cbs-accent-soft:#452534; --cbs-accent-faint:#301923; --cbs-accent-border:#7b465a; --cbs-accent-glow:rgba(255,134,168,.30); }
html[data-mode="classic"][data-accent="pink"]   { --cbs-accent:#ff83dc; --cbs-accent-strong:#e95bc4; --cbs-accent-soft:#45243e; --cbs-accent-faint:#30182b; --cbs-accent-border:#7c466e; --cbs-accent-glow:rgba(255,131,220,.30); }

/* Heat the major Classic surfaces from the chosen accent. */
html[data-mode="classic"] .cbs-overview-kpi,
html[data-mode="classic"] .cbs-dashboard-center-card,
html[data-mode="classic"] .cbs-direct-grid-card,
html[data-mode="classic"] .cbs-detail-info-card,
html[data-mode="classic"] .cbs-direct-toolbar,
html[data-mode="classic"] .cbs-detail-toolbar,
html[data-mode="classic"] .cbs-standard-table-card,
html[data-mode="classic"] .cbs-theme-panel {
    background:color-mix(in srgb,var(--cbs-surface) 91%,var(--cbs-accent) 9%);
    border-color:color-mix(in srgb,var(--cbs-border) 72%,var(--cbs-accent) 28%);
}

html[data-mode="classic"] .cbs-nav-entry:hover,
html[data-mode="classic"] .cbs-center-links > a:hover,
html[data-mode="classic"] .cbs-direct-grid-row:hover,
html[data-mode="classic"] .cbs-data-grid-row:hover,
html[data-mode="classic"] .cbs-customer-list-card:hover {
    background:color-mix(in srgb,var(--cbs-surface-2) 80%,var(--cbs-accent) 20%);
    box-shadow:0 0 16px color-mix(in srgb,var(--cbs-accent-glow) 72%,transparent);
}

/* Site.Master menu layout - full-height rail, business profile, and animated groups. */
.cbs-app-body .cbs-app-header { left:var(--cbs-sidebar-width); grid-template-columns:minmax(120px,1fr) minmax(180px,420px) auto; gap:16px; padding:0 20px; transition:left var(--cbs-shell-duration,280ms) cubic-bezier(.2,.75,.25,1); }
.cbs-app-body .cbs-sidebar { top:0; z-index:1400; display:flex; flex-direction:column; border-right:1px solid var(--cbs-border); transition:width var(--cbs-shell-duration,280ms) cubic-bezier(.2,.75,.25,1),transform var(--cbs-shell-duration,280ms) cubic-bezier(.2,.75,.25,1); }
.cbs-app-body .cbs-app-main { transition:margin-left var(--cbs-shell-duration,280ms) cubic-bezier(.2,.75,.25,1); }
.cbs-sidebar-business { position:relative; height:auto; min-height:128px; flex:0 0 auto; overflow:hidden; border-bottom:1px solid var(--cbs-accent-border); background:linear-gradient(150deg,var(--cbs-header),var(--cbs-sidebar)); transition:min-height var(--cbs-shell-duration,280ms) cubic-bezier(.2,.75,.25,1); }
.cbs-sidebar-business>.cbs-menu-button { position:absolute; top:12px; right:10px; z-index:2; width:34px; height:34px; margin:0; border:1px solid var(--cbs-accent-border); background:var(--cbs-accent-faint); color:var(--cbs-accent); transition:background 160ms ease,color 160ms ease,transform var(--cbs-shell-duration,280ms); }
.cbs-sidebar-business>.cbs-menu-button:hover { background:var(--cbs-accent-soft); transform:rotate(4deg); }
.cbs-app-body .cbs-client-identity { width:100%; min-height:0; margin:0; padding:12px 14px 8px; display:flex; flex-direction:column; gap:6px; text-align:center; }
.cbs-app-body .cbs-client-logo-wrap { width:46px; height:46px; border:1px solid var(--cbs-accent-border); border-radius:12px; background:#fff; box-shadow:0 4px 14px rgba(0,0,0,.12); text-decoration:none; transition:width var(--cbs-shell-duration,280ms),height var(--cbs-shell-duration,280ms); }
.cbs-app-body .cbs-client-logo { padding:5px; border-radius:0; }
.cbs-app-body .cbs-client-copy { display:block; max-height:none; opacity:1; transform:translateY(0); transition:opacity 140ms ease,transform var(--cbs-shell-duration,280ms); }
.cbs-app-body .cbs-client-copy strong { width:100%; padding:0; white-space:normal; overflow-wrap:anywhere; line-height:1.4; }
.cbs-app-body .cbs-client-copy strong::after { content:none; }
.cbs-app-body .cbs-client-copy small { width:100%; max-width:225px; margin-top:4px; white-space:normal; line-height:1.35; overflow-wrap:anywhere; }
.cbs-app-body .cbs-sidebar-stage { flex:1 1 auto; min-height:0; min-width:0; width:100%; height:auto; }
.cbs-app-body .cbs-sidebar-main { min-width:0; width:100%; height:100%; padding:10px 9px 14px; overflow-x:hidden; overscroll-behavior:contain; scrollbar-color:var(--cbs-accent-border) transparent; }
.cbs-app-body .cbs-nav-main { min-width:0; width:100%; grid-template-columns:minmax(0,1fr); gap:6px; }
.cbs-app-body .cbs-nav-group { min-width:0; width:100%; margin-top:9px; padding:0; border:0; background:transparent; }
.cbs-app-body .cbs-nav-group:first-of-type { margin-top:0; }
.cbs-app-body .cbs-nav-group-title { position:relative; display:flex; width:100%; height:34px; min-height:0; margin:0 0 5px; padding:0 21px 0 0; gap:7px; overflow:hidden; border:0; border-radius:4px; background:transparent; color:var(--cbs-accent); font-size:var(--cbs-font-group); font-weight:800; letter-spacing:.045em; line-height:1.2; opacity:1; transition:height var(--cbs-shell-duration,280ms),margin var(--cbs-shell-duration,280ms),opacity 160ms ease,color 160ms ease; }
.cbs-app-body .cbs-nav-group-title::before,.cbs-app-body .cbs-nav-group-title::after { content:""; display:block; position:static; height:1px; flex:1 1 16px; min-width:8px; background:var(--cbs-accent-border); }
.cbs-app-body .cbs-nav-group-title>span { flex:0 1 auto; max-width:calc(100% - 32px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cbs-app-body .cbs-nav-group-chevron { right:2px; color:var(--cbs-accent); }
.cbs-app-body .cbs-nav-group-title:hover { color:var(--cbs-text); background:var(--cbs-accent-faint); }
.cbs-app-body .cbs-nav-group-body { min-width:0; width:100%; display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:1fr; opacity:1; transform:translateY(0); transition:grid-template-rows var(--cbs-shell-duration,280ms) cubic-bezier(.2,.75,.25,1),opacity 160ms ease,transform var(--cbs-shell-duration,280ms); }
.cbs-nav-group-items { min-width:0; width:100%; min-height:0; overflow:hidden; display:grid; grid-template-columns:minmax(0,1fr); gap:2px; }
.cbs-app-body .cbs-nav-group.is-collapsed .cbs-nav-group-body { grid-template-rows:0fr; opacity:0; transform:translateY(-5px); pointer-events:none; }
.cbs-app-body .cbs-nav-entry { min-width:0; max-width:100%; min-height:41px; grid-template-columns:30px minmax(0,1fr) 14px; gap:9px; padding:0 9px; }
.cbs-app-body .cbs-nav-text,.cbs-app-body .cbs-nav-arrow { display:block; opacity:1; transform:translateX(0); transition:opacity 150ms ease,transform var(--cbs-shell-duration,280ms); }
.cbs-app-body .cbs-nav-entry .cbs-nav-icon { width:30px; height:30px; }
.cbs-app-body .cbs-quick-actions { display:block; opacity:1; transition:opacity 160ms ease; }
.cbs-app-body .cbs-mobile-menu-button { display:none; }
.cbs-app-body .cbs-app-header-left { min-width:0; }
.cbs-app-body .cbs-header-page-copy { display:block; padding:0; }
.cbs-app-body .cbs-page-title { display:block; }
.cbs-app-body .cbs-user-copy { max-width:130px; }
.cbs-app-body .cbs-app-footer { z-index:1500; }
@media (min-width:861px) {
    body.cbs-sidebar-collapsed .cbs-app-header { left:var(--cbs-sidebar-collapsed); }
    body.cbs-sidebar-collapsed .cbs-sidebar-business { height:100px; min-height:100px; }
    body.cbs-sidebar-collapsed .cbs-sidebar-business>.cbs-menu-button { top:9px; right:calc((var(--cbs-sidebar-collapsed) - 34px)/2); }
    body.cbs-sidebar-collapsed .cbs-client-identity { display:flex; margin:0; padding:51px 0 7px; min-height:0; gap:0; }
    body.cbs-sidebar-collapsed .cbs-client-logo-wrap { width:36px; height:36px; }
    body.cbs-sidebar-collapsed .cbs-client-copy { display:none; max-height:0; opacity:0; transform:translateY(-5px); pointer-events:none; }
    body.cbs-sidebar-collapsed .cbs-nav-group-title { display:none; height:0; margin:0; opacity:0; pointer-events:none; }
    body.cbs-sidebar-collapsed .cbs-nav-group { margin-top:4px; padding:0; }
    body.cbs-sidebar-collapsed .cbs-nav-group-body { grid-template-rows:1fr!important; opacity:1!important; transform:none!important; pointer-events:auto!important; }
    body.cbs-sidebar-collapsed .cbs-nav-entry { min-width:0; width:100%; max-width:100%; display:flex; align-items:center; justify-content:center; gap:0; padding:0; }
    body.cbs-sidebar-collapsed .cbs-nav-entry .cbs-nav-icon { display:grid; flex:0 0 30px; margin:0; }
    body.cbs-sidebar-collapsed .cbs-nav-text,body.cbs-sidebar-collapsed .cbs-nav-arrow { display:none; opacity:0; transform:translateX(-8px); pointer-events:none; }
    body.cbs-sidebar-collapsed .cbs-nav-entry .cbs-nav-text { width:0; }
    body.cbs-sidebar-collapsed .cbs-quick-actions { display:none; height:0; margin:0; padding:0; overflow:hidden; opacity:0; pointer-events:none; }
}


/* =========================================================
   NAVIGATION LAYOUT v20261007_05
   Top navigation fix: force the inherited vertical .cbs-nav
   flex direction back to a horizontal desktop menu.
   Same menu can live on the Left Side or Top Side.
   Phone/tablet continue to use the mobile drawer.
   ========================================================= */
@media (min-width:861px) {
    html[data-navigation-layout="top"] {
        --cbs-shell-top:calc(var(--cbs-header-height) + var(--cbs-top-nav-height));
    }

    html[data-navigation-layout="top"] .cbs-app-body .cbs-app-header {
        left:0;
        grid-template-columns:minmax(220px,1fr) minmax(280px,520px) auto;
    }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-app-main,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-app-main {
        margin-left:0;
        padding-top:calc(var(--cbs-shell-top) + 16px);
    }

    html[data-navigation-layout="top"] .cbs-app-body .cbs-sidebar,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-sidebar {
        top:var(--cbs-header-height);
        right:0;
        bottom:auto;
        width:auto;
        height:var(--cbs-top-nav-height);
        display:flex;
        flex-direction:row;
        overflow:visible;
        border-right:0;
        border-bottom:1px solid var(--cbs-accent-border);
        background:var(--cbs-sidebar);
        box-shadow:0 6px 18px rgba(0,0,0,.10);
    }

    html[data-navigation-layout="top"] .cbs-sidebar-business,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-sidebar-business {
        width:min(260px,24vw);
        height:var(--cbs-top-nav-height);
        min-height:var(--cbs-top-nav-height);
        flex:0 0 auto;
        border-right:1px solid var(--cbs-border-soft);
        border-bottom:0;
        background:linear-gradient(110deg,var(--cbs-header),var(--cbs-sidebar));
    }
    html[data-navigation-layout="top"] .cbs-sidebar-business>.cbs-menu-button { display:none; }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-client-identity,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-client-identity {
        height:100%; min-height:0; margin:0; padding:6px 12px;
        display:grid; grid-template-columns:38px minmax(0,1fr); align-items:center; gap:9px; text-align:left;
    }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-client-logo-wrap,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-client-logo-wrap { width:36px; height:36px; }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-client-copy,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-client-copy {
        display:block; max-height:none; opacity:1; transform:none; text-align:left; pointer-events:auto;
    }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-client-copy strong,
    html[data-navigation-layout="top"] .cbs-app-body .cbs-client-copy small { margin-left:0; margin-right:0; text-align:left; white-space:nowrap; }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-client-copy small { max-width:200px; }

    html[data-navigation-layout="top"] .cbs-sidebar-stage { flex:1 1 auto; min-width:0; height:var(--cbs-top-nav-height); overflow:visible; }
    html[data-navigation-layout="top"] .cbs-sidebar-main {
        width:100%; height:100%; padding:0 8px; overflow:visible; display:flex; align-items:center;
    }
    html[data-navigation-layout="top"] .cbs-nav-main {
        width:100%; min-width:0; height:100%;
        display:flex; flex-direction:row; flex-wrap:nowrap;
        align-items:center; justify-content:flex-start; gap:6px;
        overflow:visible;
    }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-group {
        width:auto; min-width:0; max-width:180px; height:100%; margin:0; padding:0;
        position:relative; flex:1 1 0; display:flex; align-items:center;
    }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-group-title {
        width:100%; min-width:0; max-width:none; height:40px; margin:0; padding:0 25px 0 10px;
        display:flex; justify-content:center;
        border:1px solid color-mix(in srgb,var(--cbs-accent) 18%,var(--cbs-border));
        border-radius:8px;
        color:var(--cbs-text);
        background:color-mix(in srgb,var(--cbs-surface) 90%,var(--cbs-accent) 10%);
        box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 7%,transparent);
        font-size:var(--cbs-font-primary); font-weight:800; line-height:1;
        text-transform:none; letter-spacing:0;
        white-space:nowrap; opacity:1; pointer-events:auto;
        transition:color 140ms ease,background 140ms ease,border-color 140ms ease,box-shadow 140ms ease,transform 140ms ease;
    }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title::before,
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title::after { display:none; }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title>span { max-width:155px; }
    html[data-navigation-layout="top"] .cbs-nav-group.is-top-open>.cbs-nav-group-title,
    html[data-navigation-layout="top"] .cbs-nav-group-title:hover {
        color:var(--cbs-accent);
        border-color:var(--cbs-accent-border);
        background:color-mix(in srgb,var(--cbs-accent) 16%,var(--cbs-surface));
        box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 10%,transparent),0 0 12px color-mix(in srgb,var(--cbs-accent-glow) 45%,transparent);
        transform:translateY(-1px);
    }
    html[data-navigation-layout="top"] .cbs-nav-group.is-top-open .cbs-nav-group-chevron { transform:rotate(180deg); color:var(--cbs-accent); }

    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-body,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-group-body {
        position:absolute; z-index:1750; top:calc(100% + 7px); left:0;
        width:310px; max-height:min(68vh,620px); padding:7px;
        display:block; overflow:auto; border:1px solid var(--cbs-accent-border); border-radius:10px;
        background:var(--cbs-sidebar); box-shadow:0 18px 38px rgba(0,0,0,.28);
        opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-6px) scale(.985);
        transition:opacity 150ms ease,transform 170ms ease,visibility 0s linear 170ms;
    }
    html[data-navigation-layout="top"] .cbs-nav-group.is-top-open>.cbs-nav-group-body {
        opacity:1; visibility:visible; pointer-events:auto; transform:none; transition-delay:0s;
    }
    html[data-navigation-layout="top"] .cbs-nav-group:nth-last-child(-n+3)>.cbs-nav-group-body { left:auto; right:0; }
    html[data-navigation-layout="top"] .cbs-nav-group-items { display:grid; gap:3px; }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-entry,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-entry {
        width:100%; min-height:42px; display:grid; grid-template-columns:30px minmax(0,1fr) 14px;
        justify-items:stretch; gap:9px; padding:0 9px;
    }
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-text,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-arrow { display:block; width:auto; opacity:1; transform:none; pointer-events:auto; }
    html[data-navigation-layout="top"] .cbs-quick-actions { display:none!important; }

    /* Second-level center panel becomes a wide top flyout. */
    html[data-navigation-layout="top"] .cbs-center-panel {
        position:fixed; z-index:1800;
        inset:auto;
        top:calc(var(--cbs-header-height) + var(--cbs-top-nav-height) + 8px);
        left:50%; right:auto; bottom:auto;
        width:min(760px,calc(100vw - 32px)); max-height:calc(100dvh - var(--cbs-shell-top) - var(--cbs-footer-height) - 24px);
        border:1px solid var(--cbs-accent-border); border-radius:12px; background:var(--cbs-sidebar); box-shadow:0 22px 48px rgba(0,0,0,.32);
        opacity:0; visibility:hidden; pointer-events:none; transform:translate(-50%,-8px) scale(.985);
        transition:opacity 160ms ease,transform 190ms ease,visibility 0s linear 190ms;
    }
    html[data-navigation-layout="top"] .cbs-center-panel.is-open {
        opacity:1; visibility:visible; pointer-events:auto; transform:translate(-50%,0) scale(1); transition-delay:0s;
    }
    html[data-navigation-layout="top"] .cbs-center-links {
        display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:10px; max-height:calc(100dvh - var(--cbs-shell-top) - var(--cbs-footer-height) - 150px);
    }
    html[data-navigation-layout="top"] .cbs-center-links>a { margin:0; }
    html[data-navigation-layout="top"] .cbs-center-back { margin:0 10px 10px; }
}

@media (min-width:861px) and (max-width:1120px) {
    html[data-navigation-layout="top"] .cbs-sidebar-business { width:170px; }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-client-copy small { display:none; }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title { min-width:0; max-width:none; padding-left:7px; padding-right:21px; font-size:var(--cbs-font-primary); }
}

/* =========================================================
   TOP NAVIGATION TYPOGRAPHY REFINEMENT v20261007_10
   Cleaner text navigation: smaller/lighter type, no boxed items.
   ========================================================= */
@media (min-width:861px) {
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-group-title {
        height:38px;
        padding:0 21px 0 8px;
        border:0 !important;
        border-radius:0 !important;
        color:var(--cbs-text-2);
        background:transparent !important;
        box-shadow:none !important;
        font-size:calc(12px * var(--cbs-font-scale,1)) !important;
        font-weight:650 !important;
        letter-spacing:.005em;
        line-height:1.2;
        transform:none !important;
    }

    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title>span {
        position:relative;
        max-width:160px;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    html[data-navigation-layout="top"] .cbs-nav-group.is-top-open>.cbs-nav-group-title,
    html[data-navigation-layout="top"] .cbs-nav-group-title:hover,
    html[data-navigation-layout="top"] .cbs-nav-group-title:focus-visible {
        color:var(--cbs-accent);
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        transform:none !important;
    }

    html[data-navigation-layout="top"] .cbs-nav-group-title>span::after {
        content:"";
        position:absolute;
        left:50%;
        right:50%;
        bottom:-8px;
        height:2px;
        border-radius:999px;
        background:var(--cbs-accent);
        opacity:0;
        transition:left 140ms ease,right 140ms ease,opacity 140ms ease;
    }

    html[data-navigation-layout="top"] .cbs-nav-group.is-top-open>.cbs-nav-group-title>span::after,
    html[data-navigation-layout="top"] .cbs-nav-group-title:hover>span::after,
    html[data-navigation-layout="top"] .cbs-nav-group-title:focus-visible>span::after {
        left:0;
        right:0;
        opacity:1;
    }

    html[data-navigation-layout="top"] .cbs-nav-group-chevron {
        width:12px;
        height:12px;
        color:var(--cbs-muted);
    }
}

/* =========================================================
   TOP NAVIGATION + HEADER CONTEXT REFINEMENT v20261007_11
   - faint accent outlines, no filled button look
   - lighter menu/flyout typography
   - top layout swaps app brand and current-page breadcrumb context
   ========================================================= */
.cbs-header-brand-swap,
.cbs-top-page-context { display:none; }

@media (min-width:861px) {
    html[data-navigation-layout="top"] .cbs-app-header-left {
        min-width:0;
        align-items:center;
    }

    html[data-navigation-layout="top"] .cbs-header-page-copy { display:none !important; }
    html[data-navigation-layout="top"] .cbs-header-brand-swap {
        min-width:0;
        display:inline-flex;
        align-items:center;
        gap:9px;
        color:var(--cbs-text);
        text-decoration:none;
    }
    html[data-navigation-layout="top"] .cbs-header-brand-swap img {
        width:31px;
        height:31px;
        flex:0 0 31px;
        object-fit:contain;
    }
    html[data-navigation-layout="top"] .cbs-header-brand-swap strong {
        min-width:0;
        overflow:hidden;
        font-size:var(--cbs-font-primary);
        font-weight:700;
        letter-spacing:-.008em;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    /* In top navigation the first slot becomes the current-page breadcrumb. */
    html[data-navigation-layout="top"] .cbs-sidebar-business {
        width:min(320px,27vw);
        background:transparent;
    }
    html[data-navigation-layout="top"] .cbs-sidebar-business .cbs-client-identity { display:none !important; }
    html[data-navigation-layout="top"] .cbs-top-page-context {
        width:100%;
        height:100%;
        min-width:0;
        padding:0 14px;
        display:flex;
        align-items:center;
        gap:7px;
        overflow:hidden;
        color:var(--cbs-text-2);
        border-right:1px solid var(--cbs-border-soft);
        background:color-mix(in srgb,var(--cbs-surface) 35%,transparent);
        white-space:nowrap;
    }
    html[data-navigation-layout="top"] .cbs-top-page-section {
        flex:0 1 auto;
        min-width:0;
        overflow:hidden;
        color:var(--cbs-muted);
        font-size:var(--cbs-font-secondary);
        font-weight:600;
        text-overflow:ellipsis;
    }
    html[data-navigation-layout="top"] .cbs-top-page-separator {
        flex:0 0 auto;
        color:var(--cbs-accent);
        font-size:14px;
        font-weight:500;
    }
    html[data-navigation-layout="top"] .cbs-top-page-title {
        flex:0 1 auto;
        min-width:0;
        overflow:hidden;
        color:var(--cbs-text);
        font-size:var(--cbs-font-primary);
        font-weight:700;
        text-overflow:ellipsis;
    }

    /* Menu headings: very light glow outline, no filled-button appearance. */
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-group-title {
        height:36px;
        padding:0 21px 0 9px;
        border:1px solid color-mix(in srgb,var(--cbs-accent) 11%,var(--cbs-border-soft)) !important;
        border-radius:7px !important;
        color:var(--cbs-text-2);
        background:transparent !important;
        box-shadow:0 0 7px color-mix(in srgb,var(--cbs-accent-glow) 10%,transparent) !important;
        font-size:calc(11.5px * var(--cbs-font-scale,1)) !important;
        font-weight:600 !important;
        letter-spacing:.002em;
        transform:none !important;
    }
    html[data-navigation-layout="top"] .cbs-nav-group-title>span::after { display:none !important; }
    html[data-navigation-layout="top"] .cbs-nav-group.is-top-open>.cbs-nav-group-title,
    html[data-navigation-layout="top"] .cbs-nav-group-title:hover,
    html[data-navigation-layout="top"] .cbs-nav-group-title:focus-visible {
        color:var(--cbs-accent);
        border-color:color-mix(in srgb,var(--cbs-accent) 30%,var(--cbs-border)) !important;
        background:color-mix(in srgb,var(--cbs-accent) 3%,transparent) !important;
        box-shadow:0 0 10px color-mix(in srgb,var(--cbs-accent-glow) 22%,transparent) !important;
    }

    /* The flyout remains clear, but text no longer looks heavy. */
    html[data-navigation-layout="top"] .cbs-center-panel-head strong {
        font-size:var(--cbs-font-primary);
        font-weight:700;
        letter-spacing:0;
    }
    html[data-navigation-layout="top"] .cbs-center-panel-head small {
        font-weight:600;
    }
    html[data-navigation-layout="top"] .cbs-center-links strong {
        font-weight:650;
        letter-spacing:0;
    }
    html[data-navigation-layout="top"] .cbs-center-links small {
        font-weight:500;
    }
}

@media (min-width:861px) and (max-width:1120px) {
    html[data-navigation-layout="top"] .cbs-sidebar-business { width:220px; }
    html[data-navigation-layout="top"] .cbs-top-page-section { display:none; }
    html[data-navigation-layout="top"] .cbs-top-page-separator { display:none; }
    html[data-navigation-layout="top"] .cbs-app-body .cbs-nav-group-title,
    html[data-navigation-layout="top"] body.cbs-sidebar-collapsed .cbs-nav-group-title {
        padding-left:7px;
        padding-right:18px;
        font-size:calc(11px * var(--cbs-font-scale,1)) !important;
    }
}