/* V51: Jumplify brand/desktop language adapted to Retencja.
   Original Balletino assets, semantic statuses and responsive behavior preserved. */
:root {
  --ink:#0b0d23; --muted:#6b7280; --bg:#f2f4f7; --line:#e4e7ec;
  --red:#6c41ff; --red2:#6c41ff; --soft:#f0ebff;
  --module:#6c41ff; --module2:#6c41ff; --module-soft:#f0ebff;
  --module-line:#ded5ff; --module-ink:#5731d8;
  --radius:12px; --shadow:0 8px 26px #0b0d2309;
  --brand-gradient:linear-gradient(135deg,#6c41ff 0%,#ff2d7a 54%,#ff9a00 100%);
}
html,body {font-family:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.5}
body {background:radial-gradient(circle at 88% 0%,#6c41ff0b,transparent 24%),var(--bg)}
button,input,select,textarea {font-family:inherit}
h1,h2,h3,h4,strong,b {font-weight:600}
button,label,.form-field {font-weight:600}
button {touch-action:manipulation}
button:focus-visible,a:focus-visible,summary:focus-visible {outline:2px solid var(--module);outline-offset:3px}
.btn {border-radius:8px;padding:10px 14px;font-weight:600;min-height:40px;transition:background-color .15s,border-color .15s}
.btn:hover {transform:none}
.btn-primary,.btn.primary {background:var(--brand-gradient);border-color:transparent;box-shadow:0 5px 14px #ff2d7a18}
.btn-primary:hover,.btn.primary:hover {background:linear-gradient(135deg,#5830e0 0%,#e72369 54%,#e68b00 100%)}
.btn-dark,.btn.dark {background:#303740}
.btn-light:hover,.btn.light:hover {background:#f4f5f6;border-color:#bcc3cb}
.btn.compact {border-radius:5px;min-height:34px;font-size:12px}
.input,.form-field input,.form-field select,.form-field textarea {border-radius:6px;padding:10px 12px}
.input:focus,.form-field input:focus,.form-field select:focus,.form-field textarea:focus {border-color:#a993ff;box-shadow:0 0 0 3px #6c41ff13}
.sidebar {background:radial-gradient(circle at 18% -4%,#6c41ff2e,transparent 24%),radial-gradient(circle at 96% 14%,#ff2d7a17,transparent 21%),#0b0d23;color:#fff;border-color:#ffffff0f;padding:20px 15px 18px}
.side-logo-wrap {padding:8px 12px 18px;margin-bottom:0;border-color:#ffffff14}
.side-logo-wrap img {max-width:158px;background:#fff;border-radius:5px;padding:9px}
.module-identity {background:none;border:0;border-radius:0;margin:0;padding:15px 12px 17px;gap:0}
.module-icon {display:none}
.module-identity strong {font-size:15px;color:#fff;font-weight:600}
.module-identity span:not(.module-icon) {font-size:11px;color:#a5abc3}
.nav,.sidebar .admin-sep {gap:3px}
.nav button {display:flex;align-items:center;gap:10px;padding:10px 12px;min-height:42px;border-radius:9px;font-size:13px;font-weight:500;color:#bfc4d7;line-height:1.35}
.nav button:hover {background:#ffffff0c;color:#fff}
.nav button.active {position:relative;background:linear-gradient(100deg,#6c41ff2e,#ff2d7a16);color:#fff;box-shadow:inset 0 0 0 1px #ffffff0e;font-weight:600}
.nav button.active:before {content:"";position:absolute;left:0;top:7px;bottom:7px;width:2px;border-radius:2px;background:var(--brand-gradient)}
.nav-icon {width:18px;height:18px;flex:0 0 18px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.nav button small {font-size:9px;letter-spacing:.03em;font-weight:500;color:#929ab8;margin-left:auto}
.nav button.active small {color:#e9e2ff}
.admin-sep {border-top:1px solid #ffffff14;margin-top:10px;padding-top:10px}
.role-box {border:0;border-top:1px solid #ffffff14;border-radius:0;background:none;padding:12px 6px 0;font-size:12px;margin-bottom:0}
.role-box span {font-size:10px;color:#a5abc3}
.side-bottom .btn {font-size:12px;min-height:36px;margin-top:10px;background:#ffffff08;color:#d8dcef;border-color:#ffffff1f}
.side-bottom .btn:hover {background:#ffffff12;border-color:#ffffff33}
.sidebar button:focus-visible {outline-color:#af96ff}
.sidebar .nav {scrollbar-color:#40445d #0b0d23}
.content {padding:0 24px 40px;width:100%;max-width:none;margin:0;min-width:0}
.topbar {background:transparent;color:var(--ink);border:0;border-bottom:1px solid var(--line);padding:18px 0 14px;margin-bottom:14px;gap:14px;border-radius:0}
.topbar .module-pill {display:inline-block;background:none;color:#6c41ff;padding:0;margin-bottom:5px;font-size:9px;letter-spacing:.14em;border-radius:0}
.topbar h1 {font-size:28px;letter-spacing:-.025em;margin-top:0!important;line-height:1.25;font-weight:600}
.user-chip {background:none;border:0;padding:0;border-radius:0;font-size:12px;color:#6b7280}
.avatar {width:30px;height:30px;border-radius:10px;background:var(--brand-gradient);color:#fff;font-size:12px;font-weight:600}
.card,.case-panel,.table-wrap {border-radius:12px;box-shadow:var(--shadow)}
.card,.case-panel {padding:18px}
.info-card {border-radius:6px;padding:14px}
.info-card.accent {background:#f6f3ff;border-color:var(--module-line)}
.info-card>span,.kpi small {font-weight:500;letter-spacing:.02em}
.kpi strong {font-size:29px;font-weight:600;letter-spacing:-.03em}
.table-wrap th,.crm-directory-table th {background:#fafbfc;color:#616b7c;text-transform:none;font-size:12px;font-weight:600;letter-spacing:0}
.table-wrap th,.table-wrap td {padding:13px 14px}
.table-wrap tbody tr:hover,.crm-directory-table tbody tr:hover {background:#fcfbff}
.status-pill,.role-pill {border-radius:4px;font-weight:600;letter-spacing:0}
.empty,.view-loading {border-radius:8px;background:#fff;box-shadow:none}
.view-loading {border-color:var(--line)}
.module-pill,.module-loader-label {background:var(--soft);color:var(--module-ink);border-radius:4px;box-shadow:none;font-weight:600;padding:5px 8px;letter-spacing:.06em}
.hero {background:radial-gradient(circle at 15% 0%,#6c41ff40,transparent 50%),radial-gradient(circle at 90% 75%,#ff2d7a22,transparent 45%),#0b0d23}
.hero:before,.hero:after {display:none}
.hero h1 {font-size:52px;font-weight:600}
.hero p {font-size:18px}
.logo-card {border-radius:8px;box-shadow:none}
.badges {gap:18px}.badge {border:0;background:none;border-radius:0;padding:0;font-size:13px;font-weight:400}
.login-mode-note {border-radius:6px}.workspace-kicker {font-weight:500}
.login-box h2 {font-size:28px;font-weight:600}
.crm-head h2 {display:none} /* The page title already names this view. */
.crm-kicker,.nw-kicker {color:var(--muted);font-weight:600;letter-spacing:.05em}
.crm-head .crm-kicker {display:none}
.crm-head p,.nw-head p {font-size:13px;color:var(--muted)}
.crm-source-panel,.crm-client-page,.crm-result,.crm-search,.crm-detail-grid section,.crm-relations,
.nw-course-page,.nw-facility,.nw-source,.nw-metric,.crm-source,.crm-metrics article {border-color:var(--line);border-radius:12px}
.crm-source-panel,.crm-client-page,.nw-course-page {padding:20px}
.crm-alert {background:#f5f2ff;border-color:var(--module-line);color:#594a7a;border-radius:6px}
.crm-client-work-summary,.crm-client-sections>section,.nw-quality {background:#f8f9fc;border-color:var(--line);border-radius:6px}
.crm-history-card,.crm-client-page .crm-source-course {border-color:var(--line);border-radius:6px}
.crm-client-avatar {background:#f0ebff;color:var(--module-ink);border-radius:8px;font-size:20px;font-weight:600}
.crm-client-heading h3 {font-size:24px;letter-spacing:-.02em;font-weight:600}
.crm-client-fields dt,.crm-client-work-summary span {color:var(--muted);font-size:12px}
.crm-client-name,.crm-course-link,.nw-course-open,.crm-history-card a,.crm-contact-row-card a {color:var(--module);font-weight:600}
.crm-directory-states button,.crm-workspace-tabs button,.crm-client-tabs button {border-color:var(--line);color:#535b66;border-radius:5px;font-weight:500;padding:10px 13px}
.crm-directory-states button[aria-pressed=true] {background:var(--soft);border-color:var(--module-line);color:var(--module-ink);font-weight:600}
.crm-workspace-tabs,.crm-client-tabs {gap:0;border-bottom:1px solid var(--line)}
.crm-workspace-tabs button,.crm-client-tabs button {background:none;border:0;border-bottom:2px solid transparent;border-radius:0;padding:12px 15px;margin-bottom:-1px}
.crm-workspace-tabs button[aria-pressed=true],.crm-client-tabs button[aria-selected=true] {background:none;color:var(--module-ink);border-color:var(--module);font-weight:600}
.crm-directory-filters input,.crm-directory-filters select,[data-contact-filters] input,[data-contact-filters] select,
[data-activity-form] textarea,[data-activity-form] input,[data-activity-form] select,[data-owner-form] textarea,[data-owner-form] select {border-color:#cbd1d8;border-radius:5px;background:#fff}
.crm-directory-table td {border-color:#e6e9ec;padding:14px 12px}
.crm-client-status,.crm-chip,.nw-badge,.crm-source b {border-radius:4px;font-weight:500}
.crm-directory-hint,.crm-directory-heading p,.crm-directory-table small,.crm-source-meta,.crm-last {color:var(--muted)}
.crm-client-page [data-source-close] {border-color:var(--line);border-radius:5px;color:var(--ink);font-size:13px}
.nw-alert {border-radius:6px}.nw-facility summary b {color:var(--module)}
.crm-directory-pager {font-variant-numeric:tabular-nums}
.case-date-filters,.dup-summary,.ops-queue-toolbar,.ops-urgent-item {border-radius:8px;border-color:var(--line);box-shadow:none;background:#fff}
.ops-kpi.ok,.ops-kpi.warn,.ops-kpi.danger {background:#fff}
.cdf-fields input,.cdf-fields select,.ops-search-wrap,.ops-queue-toolbar select {border-radius:5px;border-color:#cbd1d8;font-weight:400}
.cdf-fields label {font-weight:500}
.ops-sla,.dup-badge,.activenow-toggle {border-radius:4px;font-weight:600;letter-spacing:0}
@media(min-width:961px) {
  .app {grid-template-columns:248px minmax(0,1fr)}
  .sidebar .admin-sep {gap:3px}
  .sidebar .nav {scrollbar-width:thin;scrollbar-gutter:auto}
}
@media(min-width:961px) and (max-width:1180px) {
  .app {grid-template-columns:224px minmax(0,1fr)}
  .content {padding:22px 20px 56px}
  .nav button {padding:10px 8px;gap:8px;font-size:12px}
  .nav button small {font-size:8px}
  .side-logo-wrap img {max-width:142px}
}
@media(max-width:960px) {
  .sidebar {padding:12px 14px}
  .side-logo-wrap {padding:0 0 10px;max-width:none}
  .side-logo-wrap img {width:132px}
  .module-identity {padding:9px 0 12px;margin:0;max-width:none}
  .module-identity div {display:flex;align-items:baseline;gap:10px}
  .nav button {padding:10px;gap:8px}
  .side-bottom {display:flex;align-items:center;gap:14px;margin-top:12px;border-top:1px solid #ffffff14;padding-top:10px}
  .role-box {min-width:0;flex:1;border:0;padding:0;margin:0}
  .side-bottom .btn {width:auto;margin:0}
  .content {padding:20px 16px 56px}
}
@media(max-width:650px) {
  .topbar {flex-direction:row;align-items:center;padding:14px;margin-bottom:20px}
  .topbar h1 {font-size:23px}
  .user-chip {align-self:auto}.user-chip #userName {display:none}
  .nav button {font-size:12px;gap:7px}.nav button small {font-size:8px}
  .crm-source-panel,.crm-client-page,.nw-course-page {padding:14px}
  .crm-directory-table td {padding:7px 0}
  .crm-client-heading h3 {font-size:21px}
  .crm-workspace-tabs button,.crm-client-tabs button {padding:11px 9px;font-size:12px}
}
@media(prefers-reduced-motion:reduce) {.btn {transition:none}}

/* Brand accent identifies navigation/actions; alert and financial status colors remain semantic. */
.crm-directory-tools summary,[data-follow-up],.info-card a {color:var(--module)}
.crm-workspace-tabs button[aria-pressed=true],.crm-client-tabs button[aria-selected=true] {border-bottom-width:3px}
.crm-client-avatar {border-left:3px solid var(--module)}


/* V52: use the available workspace; keep the case list above the fold. */
html,body {font-size:15px}
:root {--muted:#596477}
.nav button {font-size:14px}
.topbar h1 {font-size:26px}
.table-wrap td,.crm-directory-table td {font-size:14px;line-height:1.45;padding:10px 12px}
.table-wrap th,.crm-directory-table th {font-size:12px;padding:11px 12px;color:#4f5b6c}
.table-wrap td small {font-size:12px;line-height:1.4;color:#596477}
#instructorAlerts {padding:14px 16px;margin:0}
.instructor-alert-head {display:flex;align-items:center;justify-content:space-between;gap:12px}
#instructorAlerts h2 {font-size:17px;margin:0;line-height:1.4}
.instructor-alert-results p {margin:7px 0;font-size:13px;line-height:1.45}
.instructor-alert-help {margin-top:8px;font-size:12px;color:#596477}
.instructor-alert-help summary {cursor:pointer;width:fit-content;font-weight:500}
.instructor-alert-help p {max-width:1000px;margin:8px 0;line-height:1.5}
#view>.grid.cards {gap:10px;margin-top:10px}
#view>.grid.cards>.kpi {padding:12px 16px;display:grid;grid-template-columns:1fr auto;column-gap:12px;align-items:center}
#view>.grid.cards>.kpi strong {grid-column:2;grid-row:1 / span 2;font-size:27px;margin:0}
#view>.grid.cards>.kpi span {margin:3px 0 0}
.dup-summary {padding:10px 14px;margin:10px 0;gap:12px}
.dup-summary p {margin-top:3px}
.case-date-filters {padding:12px 14px;margin-bottom:10px}
.cdf-presets {margin:8px 0;gap:6px}
.cdf-fields {gap:10px}
.cdf-fields input,.cdf-fields select {height:38px}
.cdf-summary {margin-top:8px;font-size:12px}
.ops-queue-toolbar {margin:10px 0;padding:10px;gap:8px}
.ops-search-wrap input,.ops-queue-toolbar select {padding-top:8px;padding-bottom:8px}
.crm-view,.nw-view {gap:12px}
.crm-source-panel,.crm-client-page,.nw-course-page {padding:16px}
.crm-directory-filters {gap:10px}
.crm-workspace-tabs button,.crm-client-tabs button {padding:10px 14px}
@media(min-width:1600px) {
  .content {padding-left:28px;padding-right:28px}
}
@media(max-width:650px) {
  .instructor-alert-head {align-items:flex-start;flex-wrap:wrap}
  .nav button {font-size:13px}
  #view>.grid.cards>.kpi {padding:12px}
  #view>.grid.cards>.kpi strong {font-size:24px}
  .crm-directory-table td {padding:7px 0}
}
@media(min-width:1200px) {
  .case-date-filters {display:grid;grid-template-columns:1fr auto;gap:8px 16px;align-items:center}
  .cdf-title {display:block;font-size:13px}
  .cdf-title span {display:block;font-size:11px;margin-top:3px}
  .cdf-presets {margin:0}
  .cdf-fields,.cdf-summary,.cdf-error {grid-column:1 / -1}
  .cdf-fields {margin-top:0}
  .cdf-summary {margin:0}
  .ops-queue-toolbar {grid-template-columns:minmax(250px,1fr) minmax(150px,190px) minmax(140px,180px) auto auto auto}
  .ops-queue-count {grid-column:auto}
}
@media(min-width:1600px) {
  .instructor-alert-results {display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 24px;margin-top:8px}
  .instructor-alert-results p {margin:0}
  .instructor-alert-results .table-wrap {flex:0 0 100%}
  .topbar {padding-top:14px;padding-bottom:10px}
}
.cdf-fields label {margin:0}

/* V53: task-oriented navigation and progressive disclosure. */
.nav-section {display:block;padding:12px 12px 5px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#a5abc3;font-weight:600}
.nav-data:not(:has(~ #crmNav:not(.hidden))):not(:has(~ #networkNav:not(.hidden))),
.nav-reports:not(:has(~ #analyticsNav:not(.hidden))),.nav-admin:not(:has(~ #usersNav:not(.hidden))) {display:none}
.nav button {min-height:38px;padding-top:8px;padding-bottom:8px}
.nw-diagnostics,.technical-settings {border:1px solid var(--line);border-radius:10px;padding:12px 16px;background:#fff;min-width:0}
.nw-diagnostics summary,.technical-settings summary {cursor:pointer;font-weight:600;font-size:13px}
.nw-diagnostics>*:not(summary) {margin-top:12px}
.nw-revision {overflow-wrap:anywhere;font-size:12px;color:var(--muted)}
.nw-head h2,.nw-head .nw-kicker {display:none}
.nw-metrics {grid-template-columns:repeat(2,minmax(0,1fr))}
.nw-tools label,.crm-directory-filters label {margin:0}
.crm-directory-states {margin:10px 0}
.crm-directory-tools {margin:8px 0}
.dup-help {display:inline-block;margin-left:12px;font-size:12px;color:var(--muted)}
.dup-help summary {cursor:pointer}
.dup-help[open] {display:block;margin:8px 0}
.ops-queue-count {font-weight:500;font-size:12px}
@media(max-width:960px){.nav-section {grid-column:1 / -1;padding:9px 6px 2px}}
@media(max-width:650px){.dup-help {display:block;margin:6px 0}.nw-metrics {grid-template-columns:1fr 1fr}}

.nw-freshness {margin:0;font-size:12px;color:var(--muted)}

.mobile-nav-toggle {display:none}
@media(max-width:960px){
 .mobile-nav-toggle {display:block;width:100%;min-height:42px;padding:8px 12px;border:1px solid #ffffff33;border-radius:8px;background:#ffffff0b;color:#fff;text-align:left;font:inherit}
 .mobile-nav-toggle[aria-expanded="false"]~.nav {display:none}
 .side-logo-wrap {padding-bottom:6px;border:0}
 .side-logo-wrap img {width:112px;padding:6px}
 .module-identity {padding:5px 0 8px}
 .side-bottom {margin-top:8px;padding-top:8px}
}