:root {
      --brand: #051d5e;
      --brand-2: #0a2c82;
      --brand-3: #123c9c;
      --brand-orange: #FFA412;
      --brand-orange-tint: #FFF3DF;
      --brand-orange-ink: #9a6500;
      --brand-gray: #E6E6E6;
      --bg: #f7faff;
      --panel: #ffffff;
      --ink: #1b2748;
      --muted: #5a6680;
      --line: #e6ecf6;
      --line-strong: #d9e0ed;
      --accent: #0a2c82;
      --accent2: #123c9c;
      --bad: #b42318;
      --good: #087443;
      --warn: #b86b00;
      --text: var(--ink);
      --surface: #ffffff;
      --surface-muted: #f8fbff;
      --radius: 8px;
      --shadow: 0 1px 3px rgba(5, 29, 94, .04);
      --shadow-lg: 0 6px 20px rgba(5, 29, 94, .07);
    }
    * { box-sizing: border-box; }
    body {
      margin:0;
      background: var(--bg);
      color:var(--ink);
      font:15px/1.55 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    }
    h1, h2, h3, h4, h5, h6,
    .nav-chip,
    .stat b,
    .kpi-card__value {
      font-family: Rubik, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    }
    a { color:var(--accent); text-decoration:none; font-weight:600; }
    a:hover { color:var(--brand-3); }
    .wrap { width:100%; max-width:min(1260px, calc(100vw - 32px)); margin:0 auto; padding:28px 0 56px; position:relative; min-width:0; }
    .wrap > * { min-width:0; }
    .wrap:has(.legal-tasks-page),
    .wrap:has(.legal-workspace-page),
    .wrap:has(.legal-bitrix-page),
    .wrap:has(.legal-casebook-page),
    .wrap:has(.o2-page),
    .wrap:has(.legal-document-page) {
      max-width:min(1720px, calc(100vw - 36px));
    }
    .nav {
      display:flex;
      gap:18px;
      align-items:center;
      justify-content:space-between;
      padding:14px 28px;
      background:var(--brand);
      color:var(--surface);
      border-bottom:3px solid var(--brand-orange);
    }
    .brand { display:flex; align-items:center; gap:16px; min-width:0; color:var(--surface); }
    .brand img { width:auto; max-width:42vw; height:40px; display:block; }
    .brand span { padding-left:16px; border-left:1px solid var(--line); font-weight:700; letter-spacing:.01em; white-space:nowrap; color:var(--brand); }
    .nav-right { display:flex; align-items:center; gap:16px; color:var(--surface); font-size:14px; }
    .nav a { color:var(--surface); }
    .nav-profile-link {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:34px;
      padding:7px 11px;
      border:1px solid color-mix(in srgb, var(--surface) 32%, transparent);
      border-radius:8px;
      color:var(--surface);
      font-weight:700;
      white-space:nowrap;
    }
    .nav-profile-link:hover {
      background:color-mix(in srgb, var(--surface) 12%, transparent);
      color:var(--surface);
    }
    .nav-exit { border:1px solid color-mix(in srgb, var(--surface) 32%, transparent); border-radius:8px; padding:7px 12px; color:var(--surface); }
    .nav-exit:hover { background:color-mix(in srgb, var(--surface) 12%, transparent); color:var(--surface); }
    .nav .muted { color:color-mix(in srgb, var(--surface) 74%, transparent); }
    .nav .nav-user b { color:var(--surface); }
    .curator-nav {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      padding:8px 28px;
      background:#ffffff;
      border-bottom:1px solid var(--line);
      position:sticky;
      top:0;
      z-index:10;
    }
    .desktop-nav-row {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      width:100%;
      min-width:0;
    }
    .mobile-nav-menu { display:none; }
    .curator-links, .history-controls { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
    .nav-chip {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:32px;
      border:1px solid #c8d3e5;
      border-radius:8px;
      padding:6px 10px;
      background:#f8fbff;
      color:var(--brand);
      font-weight:700;
      font-size:14px;
      box-shadow:none;
    }
    .nav-group {
      position:relative;
      display:inline-flex;
      min-width:0;
    }
    .nav-group summary {
      list-style:none;
      cursor:pointer;
      gap:8px;
      user-select:none;
    }
    .nav-group summary::-webkit-details-marker {
      display:none;
    }
    .nav-group-summary::after {
      content:"";
      width:7px;
      height:7px;
      border-right:2px solid currentColor;
      border-bottom:2px solid currentColor;
      transform:rotate(45deg) translateY(-1px);
      flex:0 0 auto;
    }
    .nav-group[open] .nav-group-summary {
      background:var(--brand-orange);
      border-color:var(--brand-orange);
      color:var(--brand);
    }
    .nav-group[open] .nav-group-summary::after {
      transform:rotate(225deg) translateY(-1px);
    }
    .nav-group-menu {
      position:absolute;
      top:calc(100% + 8px);
      right:0;
      z-index:40;
      display:grid;
      gap:6px;
      min-width:210px;
      max-width:min(300px, calc(100vw - 32px));
      overflow:auto;
      padding:8px;
      border:1px solid var(--line);
      border-radius:8px;
      background:#ffffff;
      box-shadow:0 18px 40px rgba(5,29,94,.14);
    }
    .nav-group-menu .nav-chip {
      width:100%;
      justify-content:flex-start;
      text-align:left;
      white-space:normal;
    }
    .nav-button { cursor:pointer; font:inherit; }
    h1 { margin:0 0 14px; font-size:28px; line-height:1.15; color:var(--brand); font-weight:700; letter-spacing:0; }
    h2 { margin:24px 0 10px; font-size:19px; color:var(--brand); font-weight:600; }
    .panel {
      background:#ffffff;
      border:1px solid var(--line);
      border-radius:var(--radius);
      padding:22px 24px;
      margin:14px 0;
      box-shadow:var(--shadow);
      min-width:0;
    }
    .panel h2:first-child { margin-top:0; }
    .grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
    .stats-grid { grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); }
    .stat {
      background:#fff;
      border:1px solid var(--line);
      border-left:3px solid var(--brand-3);
      border-radius:var(--radius);
      padding:14px 16px;
      box-shadow:var(--shadow);
    }
    .stat b { display:block; font-size:24px; color:var(--brand); line-height:1.1; margin-bottom:4px; font-weight:700; }
    a.stat { color:var(--ink); }
    .stat-link { display:block; transition:transform .12s, border-color .12s, box-shadow .12s; }
    .stat-link:hover { transform:translateY(-1px); border-color:var(--brand-3); box-shadow:var(--shadow-lg); }
    .month-close-panel {
      border-left:5px solid var(--brand-3);
      background:linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
    }
    .month-close-panel h2 {
      margin:4px 0 6px;
    }
    .month-close-panel.is-ready,
    .month-close-panel.is-closed {
      border-left-color:var(--good);
    }
    .month-close-panel.is-blocked {
      border-left-color:var(--warn);
    }
    .month-close-route-notice {
      display:flex;
      align-items:flex-start;
      gap:10px;
      margin:0 0 12px;
      border:1px solid var(--line);
      border-left:5px solid var(--brand-3);
      border-radius:var(--radius);
      background:#fff;
      padding:10px 12px;
      box-shadow:var(--shadow);
    }
    .month-close-route-notice b {
      color:var(--ink);
      white-space:nowrap;
    }
    .month-close-route-notice span {
      color:var(--muted);
    }
    .month-close-route-notice.good {
      border-left-color:var(--good);
      background:#f2fbf5;
    }
    .month-close-route-notice.warn {
      border-left-color:var(--warn);
      background:#fff8eb;
    }
    .month-close-main {
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:18px;
    }
    .month-close-kicker {
      color:var(--muted);
      font-size:12px;
      font-weight:800;
      letter-spacing:.06em;
      text-transform:uppercase;
    }
    .month-close-status {
      display:flex;
      align-items:center;
      gap:8px;
      flex-wrap:wrap;
      margin-top:10px;
    }
    .month-close-badge {
      display:inline-flex;
      align-items:center;
      min-height:28px;
      border-radius:999px;
      padding:5px 10px;
      font-size:13px;
      font-weight:800;
      background:#eef4ff;
      color:var(--brand);
    }
    .month-close-badge.good {
      background:#e9f8ef;
      color:var(--good);
    }
    .month-close-badge.warn {
      background:var(--brand-orange-tint);
      color:var(--brand-orange-ink);
    }
    .month-close-action {
      display:flex;
      justify-content:flex-end;
      min-width:190px;
    }
    .month-close-action form {
      margin:0;
    }
    .month-close-action button[disabled] {
      cursor:not-allowed;
      opacity:.68;
      background:#eef2f7;
      color:#657189;
    }
    .month-close-disabled-help {
      margin-top:16px;
      border:1px solid #f1d49b;
      border-radius:var(--radius);
      background:#fff8eb;
      color:#664100;
      padding:12px 14px;
    }
    .month-close-disabled-help b {
      display:block;
      margin-bottom:6px;
      color:#583900;
    }
    .month-close-disabled-help ul {
      margin:0;
      padding-left:18px;
    }
    .month-close-disabled-help li + li {
      margin-top:4px;
    }
    .month-close-approvals .legal-task-table td,
    .month-close-overview-page .legal-task-table td {
      vertical-align:top;
    }
    .month-close-overview-page .legal-task-table-wrap {
      overflow-x:auto;
    }
    .month-close-filter-form {
      display:grid;
      grid-template-columns:minmax(110px, 140px) minmax(220px, 1fr) minmax(130px, 150px) minmax(130px, 150px) auto;
      gap:8px;
      align-items:end;
      min-width:min(100%, 840px);
    }
    .month-close-filter-form input,
    .month-close-filter-form select {
      margin:0;
    }
    .month-close-filter-form button {
      min-height:40px;
      white-space:nowrap;
    }
    .month-close-table {
      min-width:1280px;
      table-layout:auto;
      font-size:13px;
    }
    .month-close-table th,
    .month-close-table td {
      overflow-wrap:anywhere;
      vertical-align:top;
    }
    .month-close-table th {
      white-space:nowrap;
    }
    .month-close-compact-page {
      gap:12px;
    }
    .month-close-compact-page .panel {
      margin:0;
      padding:16px;
    }
    .month-close-compact-hero {
      display:grid;
      gap:12px;
      border-left:5px solid var(--brand-3);
      background:linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
    }
    .month-close-compact-head {
      display:grid;
      grid-template-columns:minmax(220px, .62fr) minmax(620px, 1.38fr);
      gap:14px;
      align-items:start;
    }
    .month-close-compact-title h1,
    .payments-compact-head h1 {
      margin:2px 0 6px;
    }
    .month-close-compact-title p,
    .payments-compact-head p {
      margin:0;
      max-width:620px;
    }
    .month-close-compact-page .month-close-filter-form {
      width:100%;
      min-width:0;
      grid-template-columns:minmax(96px, 120px) minmax(180px, 1.35fr) minmax(130px, .8fr) minmax(150px, .9fr) minmax(150px, .9fr) auto;
      align-items:end;
    }
    .month-close-compact-page .month-close-filter-form input,
    .month-close-compact-page .month-close-filter-form select {
      min-height:36px;
      padding:8px 10px;
      font-size:13px;
    }
    .month-close-compact-page .month-close-filter-form button {
      min-height:36px;
      padding:8px 13px;
    }
    .month-close-summary-grid {
      grid-template-columns:repeat(6, minmax(0, 1fr));
      gap:8px;
    }
    .month-close-summary-grid .home-summary-card {
      padding:10px 12px;
      box-shadow:none;
      background:#ffffff;
    }
    .month-close-summary-grid .home-summary-card b {
      font-size:22px;
      margin-top:2px;
    }
    .month-close-table-head {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      margin-bottom:10px;
    }
    .month-close-table-head h2 {
      margin:0 0 3px;
      font-size:18px;
    }
    .month-close-table-head p {
      margin:0;
      font-size:13px;
    }
    .month-close-compact-page .month-close-table th,
    .month-close-compact-page .month-close-table td {
      padding:8px 10px;
      font-size:12.5px;
    }
    .month-close-compact-page .month-close-table th.mc-col-name,
    .month-close-compact-page .month-close-table td.mc-col-name { min-width:200px; max-width:250px; }
    .month-close-compact-page .month-close-table th.mc-col-supervisor,
    .month-close-compact-page .month-close-table td.mc-col-supervisor { min-width:150px; max-width:210px; }
    .month-close-compact-page .month-close-table th.mc-col-formula,
    .month-close-compact-page .month-close-table td.mc-col-formula { min-width:190px; max-width:320px; }
    .month-close-compact-page .month-close-final-salary-form {
      min-width:160px;
      max-width:220px;
      gap:6px;
    }
    .month-close-compact-page .month-close-pagination {
      margin-top:10px;
    }
    .month-close-table th.mc-col-name,
    .month-close-table td.mc-col-name { min-width:220px; max-width:280px; }
    .month-close-table th.mc-col-position,
    .month-close-table td.mc-col-position { min-width:150px; max-width:210px; }
    .month-close-table th.mc-col-supervisor,
    .month-close-table td.mc-col-supervisor { min-width:170px; max-width:230px; }
    .month-close-table th.mc-col-status,
    .month-close-table td.mc-col-status { min-width:130px; white-space:nowrap; }
    .month-close-table th.mc-col-note,
    .month-close-table td.mc-col-note { min-width:150px; max-width:220px; }
    .month-close-table th.mc-col-date,
    .month-close-table td.mc-col-date { min-width:128px; white-space:nowrap; }
    .month-close-table th.mc-col-approver,
    .month-close-table td.mc-col-approver { min-width:170px; max-width:230px; }
    .month-close-table th.mc-col-card,
    .month-close-table td.mc-col-card { min-width:170px; white-space:nowrap; }
    .month-close-table th.mc-col-calc-type,
    .month-close-table td.mc-col-calc-type { min-width:96px; white-space:nowrap; }
    .month-close-table th.mc-col-formula,
    .month-close-table td.mc-col-formula { min-width:220px; max-width:360px; }
    .month-close-table th.mc-col-amount,
    .month-close-table td.mc-col-amount { min-width:150px; white-space:nowrap; }
    .month-close-table th.mc-col-payment,
    .month-close-table td.month-close-payment-cell { min-width:150px; white-space:nowrap; }
    .month-close-table th.mc-col-gd-note,
    .month-close-table td.mc-col-gd-note { min-width:260px; max-width:340px; }
    .month-close-table th[class^="mc-col-"],
    .month-close-table td[class^="mc-col-"],
    .month-close-table td.month-close-payment-cell {
      width:auto;
    }
    .month-close-summary-link {
      color:inherit;
      text-decoration:none;
    }
    .month-close-summary-link:hover {
      border-color:var(--accent);
      box-shadow:0 10px 24px rgba(37,99,235,.12);
    }
    .month-close-pagination {
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:12px;
      margin-top:14px;
      flex-wrap:wrap;
      color:var(--muted);
      font-size:13px;
    }
    .month-close-pagination nav {
      display:flex;
      gap:6px;
      align-items:center;
      flex-wrap:wrap;
    }
    .month-close-pagination a,
    .month-close-pagination .is-active {
      min-width:32px;
      min-height:32px;
      padding:7px 10px;
      border:1px solid var(--line);
      border-radius:8px;
      text-align:center;
      text-decoration:none;
      color:var(--text);
      background:#fff;
    }
    .month-close-pagination .is-active {
      border-color:var(--accent);
      background:rgba(37,99,235,.08);
      font-weight:700;
    }
    .month-close-pagination-note {
      margin:12px 0 0;
    }
    .month-close-muted-cell {
      color:var(--muted);
      text-align:center;
    }
    .month-close-calc-form,
    .month-close-final-salary-form,
    .month-close-note-form {
      display:grid;
      gap:8px;
      min-width:240px;
      max-width:360px;
    }
    .month-close-calc-form textarea,
    .month-close-final-salary-form textarea,
    .month-close-note-form textarea {
      min-height:64px;
      resize:vertical;
    }
    .month-close-calc-form p,
    .month-close-note-form p {
      margin:0;
    }
    .month-close-proposed-before-final {
      display:grid;
      gap:6px;
      padding:10px;
      border:1px solid var(--line);
      border-radius:8px;
      background:#f8fafc;
    }
    .month-close-note-form button {
      justify-self:start;
    }
    .month-close-final-salary-form {
      min-width:180px;
      max-width:260px;
    }
    .month-close-final-salary-form input,
    .month-close-final-salary-form select,
    .month-close-final-salary-form textarea {
      padding:7px 9px;
      font-size:12px;
    }
    .month-close-final-salary-form textarea {
      min-height:52px;
    }
    .month-close-final-salary-form button {
      min-height:30px;
      padding:6px 10px;
      justify-self:start;
    }
    .month-close-payment-cell p {
      margin:4px 0 6px;
    }
    .month-close-payment-form {
      margin:8px 0 0;
    }
    .month-close-payment-form button {
      padding:6px 10px;
      min-height:32px;
    }
    .month-close-calc-summary {
      display:grid;
      gap:6px;
      min-width:160px;
      max-width:340px;
    }
    .month-close-calc-summary b {
      font-size:16px;
      color:var(--ink);
    }
    .month-close-formula {
      color:var(--muted);
      font-size:13px;
      line-height:1.35;
      white-space:pre-wrap;
      overflow-wrap:anywhere;
    }
    .payments-page {
      display:grid;
      gap:12px;
    }
    .payments-page .panel {
      margin:0;
      padding:16px;
    }
    .payments-compact-hero {
      display:grid;
      gap:12px;
      border-left:5px solid var(--brand-3);
      background:linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
    }
    .payments-compact-head {
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
    }
    .payments-page .payment-section-tabs {
      justify-content:flex-end;
      margin:0;
    }
    .payments-page .stats-grid {
      grid-template-columns:repeat(5, minmax(0, 1fr));
      gap:8px;
    }
    .payments-page .stat {
      min-height:66px;
      padding:10px 12px;
      box-shadow:none;
      background:#ffffff;
    }
    .payments-page .stat b {
      font-size:20px;
      margin-bottom:2px;
    }
    .payments-controls-grid {
      display:grid;
      grid-template-columns:minmax(220px, .7fr) minmax(420px, 1.3fr);
      gap:12px;
      align-items:start;
    }
    .payments-controls-grid:empty {
      display:none;
    }
    .payments-controls-grid .payment-imports-panel:only-child {
      grid-column:1 / -1;
    }
    .payments-page .payment-upload-form,
    .payments-page .payment-report-filters,
    .payments-page .payment-periods {
      min-width:0;
    }
    .payments-page .payment-upload-form h2,
    .payments-page .payment-report-filters h2,
    .payments-page .payment-periods h2,
    .payments-page .payment-report-table h2 {
      margin:0 0 6px;
      font-size:18px;
    }
    .payments-page .payment-upload-form label,
    .payments-page .payment-report-filters label {
      margin:8px 0 4px;
      font-size:13px;
    }
    .payment-upload-grid {
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
      gap:8px;
      align-items:end;
    }
    .payments-page .payment-upload-grid input,
    .payments-page .payment-upload-grid select,
    .payments-page input[type="file"] {
      min-height:36px;
      padding:8px 10px;
      font-size:13px;
    }
    .payments-page .payment-final-check {
      min-height:36px;
      margin:8px 0 0;
    }
    .payments-page .toolbar {
      margin-top:10px;
    }
    .payments-page .toolbar button,
    .payments-page .toolbar .button {
      min-height:36px;
      padding:8px 13px;
    }
    .payments-page .payment-periods .curator-links {
      display:flex;
      flex-wrap:wrap;
      gap:6px;
      max-height:126px;
      overflow:auto;
    }
    .payment-imports-panel {
      padding:14px;
    }
    .payment-panel-head {
      display:flex;
      align-items:flex-start;
      justify-content:space-between;
      gap:12px;
      margin-bottom:10px;
    }
    .payment-panel-head h2 {
      margin:0 0 3px;
    }
    .payment-panel-head p {
      margin:0;
      font-size:13px;
    }
    .payment-import-list {
      display:grid;
      gap:6px;
      max-height:238px;
      overflow:auto;
      padding-right:4px;
    }
    .payment-import-item {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      min-height:46px;
      padding:8px 10px;
      border:1px solid #dbe6f4;
      border-radius:8px;
      background:#f9fbff;
      color:#13264b;
      text-decoration:none;
    }
    .payment-import-item:hover {
      border-color:#9eb8df;
      background:#f4f8ff;
    }
    .payment-import-item.active {
      border-color:#1d6fdc;
      background:#eef6ff;
      box-shadow:inset 3px 0 0 #1d6fdc;
    }
    .payment-import-item span:first-child {
      display:grid;
      gap:2px;
      min-width:0;
    }
    .payment-import-item b,
    .payment-import-item small {
      overflow:hidden;
      text-overflow:ellipsis;
      white-space:nowrap;
    }
    .payment-import-item small {
      color:#64748b;
      font-size:12px;
      font-weight:600;
    }
    .payments-page .payment-periods .nav-chip,
    .payments-page .payment-section-tabs .nav-chip {
      min-height:34px;
      padding:7px 10px;
      font-size:13px;
    }
    .payments-page .payment-report-table .cabinet-zone-head {
      align-items:center;
      margin-bottom:8px;
    }
    .payments-page .payment-report-table .cabinet-zone-head h2 {
      margin:0 0 3px;
    }
    .payments-page .payment-report-table .cabinet-zone-head p {
      margin:0;
      font-size:13px;
    }
    .payments-page .payments-table {
      font-size:13px;
    }
    .payments-page .payments-table th,
    .payments-page .payments-table td {
      padding:8px 10px;
    }
    .payments-page .table-sort-button {
      min-height:28px;
      padding:4px 6px;
      font-size:12px;
    }
    @media (max-width: 1180px) {
      .month-close-compact-head,
      .payments-controls-grid {
        grid-template-columns:1fr;
      }
      .month-close-summary-grid {
        grid-template-columns:repeat(3, minmax(0, 1fr));
      }
      .payments-page .stats-grid {
        grid-template-columns:repeat(3, minmax(0, 1fr));
      }
    }
    @media (max-width: 820px) {
      .month-close-compact-page .month-close-filter-form {
        grid-template-columns:1fr;
      }
      .month-close-summary-grid,
      .payments-page .stats-grid {
        grid-template-columns:repeat(2, minmax(0, 1fr));
      }
      .payments-compact-head {
        flex-direction:column;
      }
      .payments-page .payment-section-tabs {
        justify-content:flex-start;
        width:100%;
      }
      .payments-page .payment-section-tabs .nav-chip {
        flex:1 1 auto;
        justify-content:center;
      }
    }
    @media (max-width: 520px) {
      .month-close-summary-grid,
      .payments-page .stats-grid {
        grid-template-columns:1fr;
      }
    }
    label { display:block; font-weight:600; margin:12px 0 6px; color:#293557; }
    input, select, textarea {
      width:100%;
      border:1px solid var(--line-strong);
      border-radius:8px;
      padding:10px 12px;
      font:inherit;
      background:#fff;
      color:var(--ink);
      outline:none;
      transition:border-color .15s, box-shadow .15s;
    }
    input:focus, select:focus, textarea:focus { border-color:var(--brand-3); box-shadow:0 0 0 3px rgba(18,60,156,.12); }
    select.field-error, input.field-error, textarea.field-error { border-color:var(--bad); box-shadow:0 0 0 3px rgba(180,35,24,.14); background:#fff7f6; }
    textarea { min-height:132px; resize:vertical; }
    button, .button {
      display:inline-block;
      border:0;
      border-radius:8px;
      padding:10px 16px;
      background:var(--brand);
      color:#fff;
      font-weight:600;
      cursor:pointer;
      box-shadow:0 1px 2px rgba(5,29,94,.18);
      transition:background .12s, box-shadow .12s;
    }
    button:hover, .button:hover { background:var(--brand-2); box-shadow:0 2px 6px rgba(5,29,94,.20); }
    .secondary { background:#ffffff; color:var(--brand); border:1px solid var(--line-strong); box-shadow:none; }
    .secondary:hover { background:#f4f7fd; color:var(--brand-2); }
    .button.disabled,
    .button.disabled:hover {
      background:#f3f5f9;
      color:#8a95aa;
      border-color:#d8dfec;
      box-shadow:none;
      cursor:not-allowed;
    }
    .danger-lite {
      background:#fff8f6;
      color:var(--bad);
      border:1px solid #f2c8c1;
      box-shadow:none;
    }
    .danger-lite:hover {
      background:#fff0ee;
      color:var(--bad);
      box-shadow:0 2px 7px rgba(180,35,24,.10);
    }
    .danger-action-form {
      display:flex;
      justify-content:flex-end;
      margin:0;
      padding-left:12px;
    }
    .danger-action-form .danger-lite {
      min-height:34px;
      padding:7px 12px;
      border-width:1.5px;
      font-weight:700;
    }
    td.employee-danger-action,
    th.employee-danger-action,
    td.month-close-danger-action,
    th.month-close-danger-action {
      background:#fffaf9;
      border-left:1px solid #f3d4ce;
      text-align:right;
      min-width:132px;
    }
    .muted { color:var(--muted); }
    .pill { display:inline-flex; align-items:center; border-radius:999px; padding:4px 9px; font-size:12px; font-weight:700; background:#eef4ff; color:var(--brand); white-space:nowrap; }
    .pill.ok { background:#edf9f2; color:var(--good); }
    .pill.warn { background:#fff7e8; color:var(--warn); }
    .pill.bad { background:#fff0ee; color:var(--bad); }
    .status-pill {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:26px;
      border:1px solid var(--line);
      border-radius:999px;
      padding:4px 10px;
      background:var(--brand-gray);
      color:var(--brand);
      font-family:Rubik, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
      font-size:12px;
      font-weight:700;
      line-height:1.2;
      white-space:nowrap;
    }
    .status-pill.action,
    .status-pill.urgent,
    .status-pill.bad {
      border-color:var(--brand-orange);
      background:var(--brand-orange);
      color:var(--brand);
    }
    .status-pill.warn {
      border-color:var(--brand-orange);
      background:var(--brand-orange-tint);
      color:var(--brand);
    }
    .status-pill.info,
    .status-pill.ok {
      border-color:var(--line-strong);
      background:var(--surface-muted);
      color:var(--brand);
    }
    .status-pill.neutral,
    .status-pill.muted {
      border-color:var(--brand-gray);
      background:var(--brand-gray);
      color:var(--brand);
    }
    .standard-checklist { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:8px; margin-top:8px; }
    .standard-checklist .check-row { display:flex; gap:9px; align-items:flex-start; margin:0; border:1px solid var(--line); border-radius:8px; padding:10px; background:#fff; font-weight:700; }
    .standard-checklist input[type=checkbox] { width:auto; margin-top:3px; }
    table {
      width:100%;
      border-collapse:separate;
      border-spacing:0;
      background:#fff;
      border:1px solid var(--line);
      border-radius:var(--radius);
      overflow:hidden;
      box-shadow:var(--shadow);
    }
    .table-scroll {
      max-width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      border-radius:var(--radius);
    }
    .table-scroll > table {
      margin:0;
    }
    .table-scroll::-webkit-scrollbar {
      height:10px;
    }
    .table-scroll::-webkit-scrollbar-track {
      background:#edf3fb;
      border-radius:999px;
    }
    .table-scroll::-webkit-scrollbar-thumb {
      background:#c4d1e3;
      border:2px solid #edf3fb;
      border-radius:999px;
    }
    th, td { padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top; text-align:left; }
    th { background:#f7faff; color:var(--muted); font-size:13px; font-weight:600; letter-spacing:0; }
    tr:last-child td { border-bottom:0; }
    .table-sort-button {
      display:inline-flex;
      align-items:center;
      gap:6px;
      min-height:0;
      padding:0;
      border:0;
      background:transparent;
      color:inherit;
      box-shadow:none;
      font:inherit;
      font-weight:700;
      text-align:left;
      cursor:pointer;
    }
    .table-sort-button:hover {
      background:transparent;
      color:var(--brand);
      box-shadow:none;
    }
    .table-sort-button::after {
      content:"↕";
      color:#8a96ad;
      font-size:11px;
      line-height:1;
    }
    .table-sort-button.active[data-sort-dir="asc"]::after {
      content:"↑";
      color:var(--brand);
    }
    .table-sort-button.active[data-sort-dir="desc"]::after {
      content:"↓";
      color:var(--brand);
    }
    .history-detail-row td { background:#fbfdff; padding-top:0; }
    .history-detail {
      border:1px solid var(--line);
      border-radius:8px;
      background:#fff;
      padding:12px;
      margin-top:2px;
    }
    .history-detail summary { cursor:pointer; color:var(--brand); font-weight:700; }
    .history-detail h3 { margin:14px 0 6px; color:var(--brand); font-size:16px; }
    .call-text {
      white-space:pre-wrap;
      max-height:260px;
      overflow:auto;
      border:1px solid var(--line);
      border-radius:8px;
      background:#f7faff;
      padding:12px;
      margin:6px 0 0;
    }
    .ai-summary-box {
      white-space:pre-wrap;
      border-left:5px solid var(--brand-2);
      background:#f7faff;
      border-radius:8px;
      padding:12px;
    }
    .click-row { cursor:pointer; }
    .click-row:hover td { background:#f7faff; }
    .badge { display:inline-block; padding:4px 9px; border-radius:8px; font-size:12px; font-weight:700; background:#e9eef8; color:var(--brand); }
    .correct { color:var(--good); }
    .incorrect { color:var(--bad); }
    .card-question { border-top:3px solid #edf3ff; padding-top:18px; margin-top:18px; }
    .small { font-size:13px; }
    .danger { color:var(--bad); font-weight:700; }
    .steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin:16px 0; }
    .step { display:block; border:1px solid var(--line); border-radius:8px; padding:14px; background:#fff; color:var(--muted); font-weight:500; }
    .step b { display:block; color:var(--brand); margin-bottom:4px; }
    a.step:hover { border-color:var(--brand-3); box-shadow:var(--shadow-lg); }
    .step.active { border-color:var(--brand); box-shadow:var(--shadow-lg); }
    .step.done { background:#edf3ff; color:var(--brand); }
    .progress-wrap { height:12px; border-radius:999px; background:#dce5f4; overflow:hidden; margin:14px 0 8px; }
    .progress-bar { height:100%; width:0; background:linear-gradient(90deg, var(--brand), var(--brand-2)); transition:width .2s ease; }
    .toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:14px 0; }
    .inline-form {
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin:0;
    }
    .registration-invites-header {
      border:1px solid #d7e4fb;
      border-radius:8px;
      background:#ffffff;
      padding:14px 20px;
      box-shadow:var(--shadow);
    }
    .invite-dashboard {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
    }
    .invite-dashboard h1 {
      margin:0 0 2px;
    }
    .invite-dashboard .kicker {
      margin-bottom:4px;
    }
    .invite-stats {
      display:flex;
      flex-wrap:wrap;
      justify-content:flex-end;
      gap:8px;
    }
    .invite-stat {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:28px;
      border-radius:999px;
      padding:5px 12px;
      font-size:13px;
      font-weight:800;
      white-space:nowrap;
    }
    .invite-stat.ok { background:#e9f8ef; color:var(--good); }
    .invite-stat.warn { background:#fff3dc; color:#a35a00; }
    .invite-stat.info { background:#edf3ff; color:var(--brand-3); }
    .invite-create-panel {
      border-top:4px solid var(--brand-3);
      background:#fff;
    }
    .invite-movement-panel {
      border-top:4px solid var(--good);
    }
    .invite-panel-heading {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:14px;
      margin-bottom:12px;
    }
    .invite-panel-heading h2 {
      margin-top:2px;
    }
    .invite-panel-heading p {
      margin:4px 0 0;
    }
    .invite-panel-badge {
      display:inline-flex;
      align-items:center;
      min-height:30px;
      border-radius:999px;
      padding:5px 11px;
      background:#edf7f1;
      color:var(--good);
      font-size:13px;
      font-weight:800;
      white-space:nowrap;
    }
    .invite-onboarding-action {
      flex-direction:column;
      align-items:flex-end;
      gap:5px;
    }
    .invite-onboarding-action button {
      min-height:36px;
      padding:8px 14px;
      white-space:nowrap;
    }
    .invite-form-grid {
      display:grid;
      grid-template-columns:minmax(220px, 1.15fr) minmax(200px, .95fr) minmax(280px, 1.35fr) minmax(190px, auto);
      gap:12px;
      align-items:end;
    }
    .invite-form-grid label {
      margin:0;
    }
    .invite-form-grid .form-actions {
      margin:0;
    }
    .invite-form-grid .form-actions button {
      width:100%;
      min-height:44px;
      white-space:nowrap;
    }
    .invite-unit-field select {
      border-color:#9bb7ef;
      background:#f8fbff;
      font-weight:700;
    }
    .invite-created-inline {
      display:grid;
      grid-template-columns:minmax(0, 1fr) auto;
      gap:12px;
      align-items:end;
      margin-top:12px;
      border:1px solid #cfe1f8;
      border-radius:8px;
      background:#f8fbff;
      padding:12px 14px;
    }
    .invite-created-inline .kicker {
      color:var(--good);
      margin-bottom:4px;
    }
    .invite-created-inline .copyable-input {
      margin:0;
      min-height:38px;
      font-weight:800;
    }
    .invite-created-actions {
      display:flex;
      gap:8px;
      align-items:center;
      justify-content:flex-end;
    }
    .invite-created-actions .button,
    .invite-created-actions button {
      min-height:36px;
      padding:8px 14px;
    }
    .invite-table-wrap {
      overflow-x:auto;
    }
    .invite-table {
      min-width:980px;
      table-layout:fixed;
    }
    .invite-table th,
    .invite-table td {
      vertical-align:middle;
    }
    .invite-table th:nth-child(1),
    .invite-table td:nth-child(1) { width:21%; }
    .invite-table th:nth-child(2),
    .invite-table td:nth-child(2) { width:22%; }
    .invite-table th:nth-child(3),
    .invite-table td:nth-child(3) { width:16%; }
    .invite-table th:nth-child(4),
    .invite-table td:nth-child(4) { width:25%; }
    .invite-table th:nth-child(5),
    .invite-table td:nth-child(5) { width:16%; }
    .invite-next-step b {
      display:block;
      color:var(--brand);
      margin-bottom:2px;
    }
    .invite-action-cell {
      display:flex;
      flex-wrap:wrap;
      gap:8px;
      align-items:center;
    }
    .invite-details {
      position:relative;
    }
    .invite-details summary {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:34px;
      border:1px solid #b9c8dd;
      border-radius:8px;
      background:#fff;
      color:var(--brand);
      padding:7px 12px;
      font-size:13px;
      font-weight:800;
      cursor:pointer;
      list-style:none;
    }
    .invite-details summary::-webkit-details-marker {
      display:none;
    }
    .invite-detail-box {
      position:absolute;
      right:0;
      z-index:5;
      min-width:280px;
      max-width:360px;
      margin-top:8px;
      border:1px solid #d5e1f2;
      border-radius:8px;
      background:#fff;
      padding:12px;
      box-shadow:var(--shadow-lg);
      color:var(--text);
      font-size:13px;
      line-height:1.45;
    }
    .invite-onboarding-history {
      min-width:190px;
      text-align:right;
    }
    .invite-onboarding-history summary {
      display:inline-flex;
      align-items:center;
      min-height:34px;
      border:1px solid #cfdced;
      border-radius:8px;
      background:#fff;
      color:var(--brand);
      padding:7px 12px;
      font-size:13px;
      font-weight:800;
      cursor:pointer;
      list-style:none;
    }
    .invite-onboarding-history summary::-webkit-details-marker {
      display:none;
    }
    .invite-onboarding-history .invite-table-wrap {
      position:absolute;
      right:28px;
      z-index:4;
      max-width:440px;
      margin-top:8px;
      border:1px solid #d5e1f2;
      border-radius:8px;
      background:#fff;
      padding:10px;
      box-shadow:var(--shadow-lg);
      text-align:left;
    }
    .invite-unit-card {
      display:grid;
      gap:3px;
      border:1px solid #bfd2f6;
      border-left:5px solid var(--brand-3);
      border-radius:8px;
      background:linear-gradient(135deg, #f8fbff 0%, #ffffff 66%);
      padding:10px 12px;
      box-shadow:0 1px 3px rgba(5,29,94,.05);
    }
    .invite-unit-eyebrow {
      color:var(--brand-3);
      font-size:11px;
      font-weight:800;
      letter-spacing:.04em;
      text-transform:uppercase;
    }
    .invite-unit-title {
      color:var(--brand);
      font-size:15px;
      line-height:1.25;
    }
    .invite-unit-meta {
      color:var(--muted);
      font-size:13px;
      font-weight:700;
    }
    .invite-revoke-form button {
      min-height:34px;
      padding:7px 11px;
      white-space:nowrap;
    }
    .home-page { display:grid; gap:16px; }
    .home-hero {
      display:grid;
      grid-template-columns:minmax(0, 1fr) minmax(280px, 420px);
      gap:16px;
      align-items:stretch;
      margin-bottom:2px;
    }
    .home-hero > div {
      min-width:0;
      border:1px solid var(--line);
      border-radius:8px;
      background:var(--surface);
      padding:22px;
      box-shadow:var(--shadow);
    }
    .home-hero h1 { margin:4px 0 6px; }
    .home-hero p { margin:0; color:var(--muted); }
    .home-eyebrow {
      display:inline-flex;
      color:var(--brand);
      font-size:12px;
      font-weight:800;
      text-transform:uppercase;
      letter-spacing:.04em;
    }
    .home-work-time {
      display:flex;
      flex-direction:column;
      justify-content:center;
      gap:6px;
    }
    .home-work-time span,
    .home-summary-card span,
    .home-action-sub {
      color:var(--muted);
      font-size:13px;
      font-weight:700;
    }
    .home-work-time strong {
      color:var(--brand);
      font-size:28px;
      line-height:1.12;
    }
    .home-summary-grid {
      display:grid;
      grid-template-columns:repeat(3, minmax(0, 1fr));
      gap:12px;
    }
    .home-summary-card {
      min-width:0;
      border:1px solid var(--line);
      border-radius:8px;
      background:var(--surface);
      padding:16px;
      box-shadow:var(--shadow);
    }
    .home-summary-card b {
      display:block;
      margin-top:4px;
      color:var(--brand);
      font-size:20px;
      line-height:1.2;
    }
    .home-actions-panel { margin:0; }
    .home-action-grid {
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
      gap:10px;
    }
    .home-action-tile {
      display:grid;
      gap:5px;
      min-height:82px;
      align-content:center;
      border:1px solid var(--line);
      border-radius:8px;
      background:var(--surface-muted);
      padding:14px;
      color:var(--ink);
      box-shadow:none;
    }
    .home-action-tile:hover {
      border-color:var(--brand-3);
      background:#fff;
      color:var(--ink);
      box-shadow:var(--shadow);
    }
    .home-action-tile.primary {
      border-color:color-mix(in srgb, var(--brand) 35%, var(--line));
      background:#eef6ff;
    }
    .home-action-tile.sales {
      border-color:#fed7aa;
      background:#fff7ed;
    }
    .home-action-title {
      color:var(--brand);
      font-weight:800;
    }
    .developer-viewer-home .warn-panel {
      border-color:#fbbf24;
      border-left:5px solid #f59e0b;
      background:#fffbeb;
    }
    .home-dev-grid {
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
      gap:12px;
    }
    .home-dev-section {
      display:grid;
      gap:10px;
      min-width:0;
      border:1px solid #d8e4f6;
      border-top:4px solid var(--brand-2);
      border-radius:8px;
      background:#fff;
      padding:18px;
      box-shadow:var(--shadow);
    }
    .home-dev-section h2 {
      margin:0;
      color:var(--brand);
      font-size:21px;
      line-height:1.2;
    }
    .home-dev-section p {
      margin:0;
      color:var(--muted);
      font-weight:700;
      line-height:1.45;
    }
    .home-dev-section .toolbar {
      margin:4px 0 0;
    }
    .sales-checkpoints-page {
      display:grid;
      gap:18px;
    }
    .sales-checkpoints-hero {
      display:grid;
      grid-template-columns:minmax(0, 1fr) minmax(240px, 340px);
      gap:18px;
      align-items:stretch;
      border:1px solid #cfe2ff;
      border-radius:12px;
      padding:22px;
      background:linear-gradient(135deg, #eef6ff 0%, #ffffff 48%, #fff7ed 100%);
      box-shadow:var(--shadow);
    }
    .sales-checkpoints-hero h1 {
      margin:6px 0 8px;
      color:var(--brand);
      font-size:32px;
      line-height:1.1;
    }
    .sales-checkpoints-hero p {
      max-width:720px;
      margin:0;
      color:var(--muted);
      font-size:16px;
    }
    .sales-checkpoints-target {
      display:grid;
      align-content:center;
      gap:8px;
      border:1px solid #fde68a;
      border-radius:12px;
      padding:18px;
      background:#fffbeb;
      color:#92400e;
    }
    .sales-checkpoints-target b {
      color:#b45309;
      font-size:34px;
      line-height:1;
    }
    .sales-checkpoints-grid {
      display:grid;
      grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
      gap:12px;
    }
    .sales-checkpoints-grid article {
      border:1px solid var(--line);
      border-top:5px solid var(--brand-3);
      border-radius:10px;
      background:#fff;
      padding:16px;
      box-shadow:var(--shadow);
    }
    .sales-checkpoints-grid article:nth-child(2) { border-top-color:#f59e0b; }
    .sales-checkpoints-grid article:nth-child(3) { border-top-color:#059669; }
    .sales-checkpoints-grid article:nth-child(4) { border-top-color:#7c3aed; }
    .sales-checkpoints-grid span {
      display:block;
      color:var(--muted);
      font-weight:800;
      font-size:13px;
      text-transform:uppercase;
    }
    .sales-checkpoints-grid b {
      display:block;
      margin:6px 0;
      color:var(--brand);
      font-size:20px;
    }
    .sales-checkpoints-grid p {
      margin:0;
      color:var(--muted);
    }
    .sales-checkpoints-image-panel {
      overflow:hidden;
    }
    .sales-checkpoints-image {
      display:block;
      width:100%;
      height:auto;
      margin-top:14px;
      border:1px solid var(--line);
      border-radius:10px;
      background:#fff;
    }
    .sales-regulations-image-panel {
      overflow:hidden;
    }
    .sales-regulations-image {
      display:block;
      width:100%;
      height:auto;
      margin-top:14px;
      border:1px solid var(--line);
      border-radius:10px;
      background:#fff;
    }
    .sales-regulations-text > summary {
      cursor:pointer;
      font-weight:800;
      color:var(--brand);
    }
    .sales-regulations-text[open] > summary {
      margin-bottom:10px;
    }
    .quick-form { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; align-items:end; }
    .voice-control { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:8px; }
    .voice-button { background:#fff; color:var(--brand); border:1px solid #c8d3e5; box-shadow:none; padding:8px 12px; }
    .voice-button.recording { background:#fff7f6; color:var(--bad); border-color:#f0b8b0; }
    .speak-controls { display:flex; flex-wrap:wrap; gap:8px; margin:8px 0 12px; }
    .speak-button.speaking { background:#fff7e8; color:var(--warn); border-color:#f3c780; }
    .simulator-thread { display:grid; gap:10px; margin:14px 0; }
    .sim-turn { border:1px solid var(--line); border-radius:8px; padding:12px; background:#fff; }
    .sim-turn.client { border-left:5px solid var(--brand); background:#f7faff; }
    .sim-turn.manager { border-left:5px solid var(--good); }
    .sim-role { display:block; color:var(--muted); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; margin-bottom:4px; }
    .simulator-wait { display:none; border-left:5px solid var(--warn); }
    .simulator-wait.active { display:block; }
    .voice-wave {
      display:none;
      align-items:center;
      gap:3px;
      height:28px;
      min-width:104px;
      padding:4px 9px;
      border:1px solid #c8d3e5;
      border-radius:8px;
      background:#f8fbff;
    }
    .voice-wave span {
      display:block;
      width:4px;
      height:8px;
      border-radius:999px;
      background:var(--brand);
      opacity:.85;
      transform-origin:center;
    }
    .voice-control.recording .voice-wave { display:flex; }
    .voice-control.recording .voice-wave span { animation:voiceWave .82s ease-in-out infinite; }
    .voice-wave span:nth-child(2) { animation-delay:.08s; }
    .voice-wave span:nth-child(3) { animation-delay:.16s; }
    .voice-wave span:nth-child(4) { animation-delay:.24s; }
    .voice-wave span:nth-child(5) { animation-delay:.32s; }
    .voice-wave span:nth-child(6) { animation-delay:.40s; }
    .voice-wave span:nth-child(7) { animation-delay:.48s; }
    .voice-wave span:nth-child(8) { animation-delay:.56s; }
    @keyframes voiceWave {
      0%, 100% { transform:scaleY(.55); opacity:.45; }
      50% { transform:scaleY(2.7); opacity:1; }
    }
    .upload-note { background:#f7faff; border:1px dashed #9db3da; border-radius:8px; padding:14px; }
    .upload-dropzone {
      display:flex;
      align-items:center;
      justify-content:center;
      min-height:150px;
      margin:12px 0;
      padding:24px;
      border:2px dashed #9db3da;
      border-radius:8px;
      background:#f7faff;
      color:var(--muted);
      text-align:center;
      font-weight:600;
      cursor:pointer;
      transition:border-color .15s ease, background .15s ease, color .15s ease;
    }
    .upload-dropzone:hover,
    .upload-dropzone.dragover {
      border-color:var(--brand);
      background:#edf4ff;
      color:var(--ink);
    }
    .upload-dropzone input { display:none; }
    .upload-file-list {
      display:none;
      margin:8px 0 0;
      padding:10px 12px;
      border:1px solid #d8e1f0;
      border-radius:8px;
      background:#fff;
      color:var(--ink);
      font-size:13px;
      line-height:1.45;
    }
    .upload-file-list.active { display:block; }
    .upload-progress {
      display:none;
      align-items:center;
      gap:10px;
      margin-top:10px;
      padding:12px 14px;
      border:1px solid #c8d3e5;
      border-radius:8px;
      background:#f7faff;
      color:var(--ink);
      font-weight:600;
    }
    .upload-progress.active { display:flex; }
    .upload-error {
      display:none;
      margin-top:10px;
      padding:12px 14px;
      border:1px solid #f0b8b0;
      border-radius:8px;
      background:#fff7f6;
      color:var(--bad);
      font-weight:700;
    }
    .upload-error.active { display:block; }
    .upload-spinner {
      width:18px;
      height:18px;
      border:3px solid #d7e0ef;
      border-top-color:var(--brand);
      border-radius:50%;
      animation:spin .8s linear infinite;
      flex:0 0 auto;
    }
    @keyframes spin { to { transform:rotate(360deg); } }
    .pass-banner { border-left:6px solid var(--good); }
    .pass-banner.fail { border-left-color:var(--bad); }
    .pass-banner.pending { border-left-color:var(--warn); }
    .retake-banner {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      padding:12px 14px;
      border:1px solid #f0b8b0;
      border-left:5px solid var(--bad);
      background:#fff7f6;
      color:var(--ink);
      box-shadow:var(--shadow);
    }
    .retake-banner__content {
      display:flex;
      flex-wrap:wrap;
      align-items:center;
      gap:8px;
      min-width:0;
    }
    .retake-banner__label {
      display:inline-flex;
      align-items:center;
      min-height:26px;
      border-radius:999px;
      padding:4px 10px;
      background:#fff0ee;
      color:var(--bad);
      font-size:12px;
      line-height:1;
      font-weight:800;
      text-transform:uppercase;
      white-space:nowrap;
    }
    .retake-banner__actions {
      display:flex;
      align-items:center;
      gap:8px;
      flex:0 0 auto;
    }
    .retake-banner__action {
      padding:8px 12px;
      white-space:nowrap;
    }
    .retake-banner__dismiss {
      display:inline-flex;
      align-items:center;
      justify-content:center;
      width:34px;
      min-width:34px;
      height:34px;
      min-height:34px;
      padding:0;
      border:1px solid #f0b8b0;
      border-radius:8px;
      background:#fff;
      color:var(--bad);
      box-shadow:none;
      font-size:22px;
      line-height:1;
    }
    .retake-banner__dismiss:hover {
      background:#fff0ee;
      color:#8a1f1f;
      box-shadow:none;
    }
    .retake-banner[hidden] { display:none; }
    .login-shell {
      min-height:calc(100vh - 72px);
      display:grid;
      grid-template-columns:minmax(0,1.05fr) minmax(360px,.75fr);
      align-items:center;
      gap:34px;
      padding:30px 0;
      width:100%;
      max-width:100%;
      min-width:0;
      box-sizing:border-box;
    }
    .login-hero {
      color:#fff;
      background:linear-gradient(135deg, #031548 0%, var(--brand) 62%, var(--brand-2) 100%);
      border-radius:8px;
      padding:42px;
      min-height:480px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      overflow:hidden;
      position:relative;
      box-shadow:0 10px 32px rgba(5,29,94,.14);
    }
    .login-brand-pattern {
      position:absolute;
      right:-120px;
      bottom:-250px;
      width:360px;
      height:520px;
      opacity:.98;
      z-index:0;
      pointer-events:none;
    }
    .login-brand-pattern::before,
    .login-brand-pattern::after,
    .login-brand-pattern span {
      content:"";
      position:absolute;
      inset:0;
      clip-path:polygon(0 0, 52% 50%, 0 100%, 31% 100%, 83% 50%, 31% 0);
    }
    .login-brand-pattern::before {
      left:-86px;
      background:#e6e6e6;
      opacity:.95;
    }
    .login-brand-pattern::after {
      left:-20px;
      background:#ffa412;
    }
    .login-brand-pattern span {
      left:142px;
      width:150px;
      background:#fff;
      opacity:.92;
    }
    .login-hero::after {
      content:"";
      position:absolute;
      right:-80px;
      bottom:-100px;
      width:360px;
      height:360px;
      background:url("/assets/nssd-mark.png") center/contain no-repeat;
      opacity:.08;
    }
    .login-logo { width:min(360px, 78vw); height:auto; position:relative; z-index:1; }
    .login-title { position:relative; z-index:1; max-width:620px; }
    .login-title h1 { color:#fff; font-size:46px; margin-bottom:14px; }
    .login-title p { color:rgba(255,255,255,.78); font-size:18px; margin:0; }
    .login-card {
      align-self:center;
      width:100%;
      max-width:460px;
      min-width:0;
      justify-self:center;
      box-sizing:border-box;
    }
    .login-card.panel { padding:22px 24px; }
    .login-card form, .login-card input, .login-card select, .login-card button {
      min-width:0;
      max-width:100%;
      box-sizing:border-box;
    }
    .login-card-brand {
      display:flex;
      align-items:center;
      gap:12px;
      margin-bottom:14px;
    }
    .login-card-brand img {
      width:42px;
      height:42px;
      object-fit:contain;
      flex:none;
    }
    .login-card h1 { margin-bottom:10px; }
    .login-card h2 { margin-top:22px; }
    .login-profile {
      margin-top:14px;
      border:1px solid var(--line);
      border-radius:8px;
      background:#f8fbff;
      overflow:hidden;
    }
    .login-profile summary {
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      padding:11px 12px;
      color:var(--brand);
      font-weight:700;
      cursor:pointer;
      list-style:none;
    }
    .login-profile summary::-webkit-details-marker { display:none; }
    .login-profile summary::after {
      content:"";
      width:10px;
      height:10px;
      flex:none;
      border-right:2px solid var(--brand);
      border-bottom:2px solid var(--brand);
      transform:rotate(45deg) translateY(-2px);
      transition:transform .15s ease;
    }
    .login-profile[open] summary::after { transform:rotate(225deg) translateY(-2px); }
    .login-profile-fields {
      padding:0 12px 12px;
      border-top:1px solid var(--line);
    }
    .login-profile:not([open]) .login-profile-fields { display:none; }
    .login-submit-row { margin:16px 0 0; }
    .login-submit-row button { width:100%; }
    .login-help-row { margin:10px 0 0; font-size:14px; }
    .login-help-row a { color:var(--brand); font-weight:700; }
    .ok-note { color:var(--ok); background:#eefbf3; border:1px solid #bfe9cd; border-radius:8px; padding:10px 12px; }
    .kicker { color:var(--brand-2); text-transform:uppercase; letter-spacing:.08em; font-size:12px; font-weight:700; margin-bottom:8px; }
    @media (max-width: 820px) {
      body { font-size:16px; background:#f6f8fc; }
      body::before { display:none; }
      .nav { align-items:flex-start; flex-direction:column; }
      .nav-right { width:100%; justify-content:space-between; align-items:flex-start; gap:10px; font-size:14px; }
      .nav-profile-link { min-height:34px; padding:6px 9px; }
      .curator-nav { position:static; align-items:stretch; flex-direction:column; padding:8px 14px; gap:8px; }
      .history-controls { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
      .curator-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
      .curator-links .nav-chip, .history-controls .nav-chip { min-width:0; width:100%; padding-left:6px; padding-right:6px; min-height:40px; font-size:13px; }
      .curator-links .nav-group { width:100%; display:block; }
      .curator-links .nav-group-summary { width:100%; min-height:40px; }
      .nav-group-menu {
        position:static;
        min-width:0;
        max-width:none;
        margin-top:6px;
        box-shadow:none;
      }
      .nav-group-menu .nav-chip { justify-content:center; text-align:center; }
      .brand span { display:none; }
      .brand img { width:auto; max-width:68vw; height:38px; }
      .wrap { max-width:100%; padding:16px 10px 34px; }
      h1 { font-size:27px; line-height:1.14; }
      h2 { font-size:20px; line-height:1.2; }
      .panel { padding:14px; margin:12px 0; box-shadow:0 8px 22px rgba(5,29,94,.07); }
      .grid, .quick-form, .steps, .standard-checklist, .home-hero, .home-summary-grid { grid-template-columns:1fr; gap:10px; }
      .invite-dashboard { align-items:flex-start; flex-direction:column; }
      .invite-stats { justify-content:flex-start; }
      .invite-panel-heading { flex-direction:column; }
      .invite-form-grid { grid-template-columns:1fr; }
      .invite-panel-badge { white-space:normal; }
      .invite-onboarding-action { align-items:stretch; width:100%; }
      .invite-created-inline { grid-template-columns:1fr; }
      .invite-created-actions { justify-content:stretch; }
      .invite-created-actions .button, .invite-created-actions button { flex:1 1 auto; text-align:center; }
      .invite-action-cell { display:grid; grid-template-columns:1fr; align-items:stretch; }
      .invite-action-cell .inline-form, .invite-action-cell button { width:100%; }
      .invite-details summary { width:100%; }
      .invite-detail-box { position:static; min-width:0; max-width:none; }
      .invite-onboarding-history { width:100%; text-align:left; }
      .invite-onboarding-history summary { width:100%; justify-content:center; }
      .invite-onboarding-history .invite-table-wrap { position:static; max-width:none; margin-top:8px; }
      .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
      .stat { padding:12px; }
      .stat b { font-size:24px; }
      .retake-banner { align-items:stretch; flex-direction:column; }
      .retake-banner__content { align-items:flex-start; flex-direction:column; }
      .retake-banner__actions { width:100%; }
      .retake-banner__action { flex:1 1 auto; text-align:center; }
      .retake-banner__dismiss { width:44px; min-width:44px; height:44px; min-height:44px; }
      .login-shell { grid-template-columns:1fr; }
      .login-hero { min-height:300px; padding:26px; }
      .login-title h1 { font-size:34px; }
      .toolbar { display:grid; grid-template-columns:1fr; gap:8px; align-items:stretch; }
      .toolbar .button, .toolbar button { width:100%; text-align:center; min-height:44px; }
      button, .button, input, select, textarea { min-height:44px; }
      textarea { min-height:150px; }
      .call-text { max-height:430px; font-size:15px; }
      table {
        display:block;
        overflow:visible;
        border:0;
        border-radius:0;
        background:transparent;
        box-shadow:none;
      }
      table thead, table tbody, table tr, table td { display:block; width:100%; }
      table tr {
        margin:0 0 12px;
        border:1px solid var(--line);
        border-radius:8px;
        background:#fff;
        box-shadow:0 8px 22px rgba(5,29,94,.07);
        overflow:hidden;
      }
      table tr.mobile-table-head { display:none; }
      table th { display:none; }
      table td {
        display:grid;
        grid-template-columns:minmax(105px, 34%) minmax(0, 1fr);
        gap:10px;
        padding:10px 12px;
        border-bottom:1px solid var(--line);
        overflow-wrap:anywhere;
      }
      table td:last-child { border-bottom:0; }
      table td::before {
        content:attr(data-label);
        color:var(--muted);
        font-size:12px;
        line-height:1.25;
        font-weight:700;
        text-transform:uppercase;
        letter-spacing:.02em;
      }
      table td:not([data-label]) { grid-template-columns:1fr; }
      table td:not([data-label])::before { display:none; }
      .page-view-row-meta { display:inline-block; }
      table td a:not(.button):not(.nav-chip):not(.test-progress-chip) {
        display:inline-flex;
        align-items:center;
        min-height:36px;
      }
      .program-switch .nav-chip { min-height:40px; }
      .sales-checkpoints-hero { grid-template-columns:1fr; }
    }
    @media (max-width: 520px) {
      .nav { padding:12px 14px; }
      .nav-right { flex-direction:column; }
      .nav-exit { width:100%; text-align:center; }
      .curator-links { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .history-controls { grid-template-columns:1fr; }
      .stats-grid { grid-template-columns:1fr; }
      .login-hero { display:none; }
      .login-shell { min-height:auto; padding:0; overflow:hidden; }
      .login-card { max-width:none; }
      .login-card.panel { padding:16px; margin:0; }
      .login-card-brand { align-items:flex-start; }
      .login-card-brand img { width:38px; height:38px; }
      .login-card h1 { font-size:24px; }
      .login-profile summary { align-items:flex-start; }
      table td { grid-template-columns:1fr; gap:4px; }
      table td::before { margin-bottom:2px; }
    }

/* --- Round 1 additions: accessibility + reduced motion --- */
.correct::before { content: "✓\00a0"; font-weight: 700; }
.incorrect::before { content: "✕\00a0"; font-weight: 700; }
.pill.ok::before { content: "✓\00a0"; }
.pill.bad::before { content: "✕\00a0"; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .stat-link:hover { transform: none !important; }
}

/* --- Round 3: empty state pattern --- */
tr.empty-row td {
  background: #fafcff;
  text-align: center;
  padding: 28px 20px;
}
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}
.empty-state[hidden] {
  display: none;
}
.empty-state::before {
  content: "";
  width: 32px;
  height: 24px;
  border: 2px solid #c8d3e5;
  border-top-color: #9db3da;
  border-radius: 6px;
  background:
    linear-gradient(135deg, transparent 46%, #c8d3e5 47% 53%, transparent 54%) center/100% 100% no-repeat,
    #fff;
  opacity: .95;
  margin-bottom: 4px;
}
.empty-state-title {
  font-weight: 700;
  color: var(--ink);
  font-size: 15px;
}
.empty-state-hint {
  color: var(--muted);
  font-size: 13px;
  max-width: 460px;
}
@media (max-width: 820px) {
  .month-close-main {
    flex-direction:column;
  }
  .month-close-action {
    justify-content:flex-start;
    min-width:0;
  }
  tr.empty-row td { padding: 22px 14px; }
  .empty-state::before { width: 28px; height: 21px; }
}

/* --- Round 5: highlighted action tiles for dashboard primary CTAs --- */
.action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin: 4px 0 14px;
}
.action-tile {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px;
  background: #ffffff;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-3);
  border-radius: var(--radius);
  color: var(--ink);
  text-decoration: none;
  font-weight: 500;
  box-shadow: var(--shadow);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.action-tile:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-lg);
  border-color: var(--brand-3);
  color: var(--ink);
}
.action-tile-icon {
  font-size: 26px;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 2px;
}
.action-tile-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.action-tile-title { font-weight: 700; color: var(--brand); font-size: 15px; }
.action-tile-sub { font-size: 13px; color: var(--muted); font-weight: 400; }
/* Per-action accent colors */
.action-tile.training      { border-left-color: var(--brand-3); }
.action-tile.simulator     { border-left-color: var(--good); }
.action-tile.simulator .action-tile-title { color: var(--good); }
.action-tile.helper        { border-left-color: #f5a623; }
.action-tile.helper .action-tile-title { color: #a86700; }
.action-tile.tests         { border-left-color: var(--good); }
.action-tile.tests .action-tile-title { color: var(--good); }
.action-tile.tests.test-status-passed {
  border-color: #bfe8cf;
  border-left-color: var(--good);
  background: linear-gradient(135deg, #effbf4 0%, #ffffff 100%);
}
.action-tile.tests.test-status-passed .action-tile-title,
.action-tile.tests.test-status-passed .action-tile-icon {
  color: var(--good);
}
.action-tile.tests.test-status-retake {
  border-color: #efc1bb;
  border-left-color: var(--bad);
  background: linear-gradient(135deg, #fff6f5 0%, #ffffff 100%);
}
.action-tile.tests.test-status-retake .action-tile-title,
.action-tile.tests.test-status-retake .action-tile-icon {
  color: var(--bad);
}
.action-tile.tests.test-status-pending,
.action-tile.tests.test-status-draft {
  border-color: #f2d19b;
  border-left-color: var(--warn);
  background: linear-gradient(135deg, #fffaf0 0%, #ffffff 100%);
}
.action-tile.tests.test-status-pending .action-tile-title,
.action-tile.tests.test-status-pending .action-tile-icon,
.action-tile.tests.test-status-draft .action-tile-title,
.action-tile.tests.test-status-draft .action-tile-icon {
  color: #9a5d00;
}
.action-tile.tests.test-status-todo {
  border-left-color: var(--brand-3);
}
.action-tile.tests.test-status-todo .action-tile-title {
  color: var(--brand);
}
.action-tile.tests.test-status-locked {
  border-color: #dbe3ef;
  border-left-color: #aab6c6;
  background: #f6f8fb;
}
.action-tile.tests.test-status-locked .action-tile-title,
.action-tile.tests.test-status-locked .action-tile-icon {
  color: #687487;
}
.action-tile.onboarding    { border-left-color: #7c5cff; }
.action-tile.onboarding .action-tile-title { color: #5d43d6; }
.action-tile.forbidden     { border-left-color: var(--warn); }
.action-tile.forbidden .action-tile-title { color: var(--warn); }
.action-tile.api           { border-left-color: #0f766e; }
.action-tile.api .action-tile-title { color: #0f766e; }
.action-tile.tasks         { border-left-color: #7c3aed; }
.action-tile.tasks .action-tile-title { color: #6d28d9; }
.forbidden-rule-grid {
  display: grid;
  gap: 12px;
  margin: 12px 0 22px;
}
.forbidden-rule-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) minmax(0, 1fr);
  gap: 10px;
  padding: 14px;
  border: 1px solid #d8e2f1;
  border-left: 5px solid var(--warn);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
}
.forbidden-rule-part {
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid #e1e8f3;
  border-radius: 8px;
  background: #f9fbff;
}
.forbidden-rule-part b {
  display: block;
  margin-bottom: 6px;
  font-size: 12px;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.forbidden-rule-part span {
  display: block;
  color: #273452;
  font-size: 14px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.forbidden-rule-part.danger {
  border-color: #efc1bb;
  background: #fff6f5;
}
.forbidden-rule-part.danger b { color: var(--bad); }
.forbidden-rule-part.bad {
  border-color: #f2d19b;
  background: #fffaf0;
}
.forbidden-rule-part.bad b { color: #9a5d00; }
.forbidden-rule-part.good {
  border-color: #bfe8cf;
  background: #edf9f2;
}
.forbidden-rule-part.good b { color: var(--good); }
.action-tile.is-complete {
  border-color: #bfe8cf;
  border-left-color: var(--good);
  background: linear-gradient(135deg, #effbf4 0%, #ffffff 100%);
}
.action-tile.is-complete .action-tile-title,
.action-tile.is-complete .action-tile-icon {
  color: var(--good);
}
.action-tile.is-complete .action-tile-sub {
  color: #3c6f54;
}
.action-tile.is-disabled {
  background: #f6f8fb;
  border-color: #dbe3ef;
  border-left-color: #aab6c6;
  box-shadow: none;
  color: #687487;
}
.action-tile.is-disabled:hover {
  transform: none;
  box-shadow: none;
  border-color: #dbe3ef;
}
.action-tile.is-disabled .action-tile-title,
.action-tile.is-disabled .action-tile-icon {
  color: #687487;
}
.route-progress-panel {
  border-left: 5px solid var(--good);
}
.route-progress-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.route-progress-head h2 {
  margin: 0 0 4px;
}
.route-progress-head p {
  margin: 0;
}
.route-progress-head strong {
  color: var(--brand);
  font-size: 32px;
  line-height: 1;
}
.route-progress-wrap {
  margin-top: 12px;
}
.route-progress-wrap .progress-bar {
  background: linear-gradient(90deg, var(--good), #66c98b);
}
.learning-ai-form {
  display: grid;
  gap: 10px;
}
.learning-ai-message {
  margin-top: 14px;
}
.learning-ai-message h3 {
  margin: 0 0 6px;
  font-size: 15px;
}
.learning-ai-message p {
  overflow-wrap: anywhere;
}
.learning-ai-sources {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.learning-ai-sources ol {
  margin: 10px 0 0;
  padding-left: 20px;
}
.learning-ai-feedback {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.learning-ai-admin-table {
  table-layout: fixed;
}
.learning-ai-admin-table th:nth-child(1),
.learning-ai-admin-table td:nth-child(1) {
  width: 17%;
}
.learning-ai-admin-table th:nth-child(2),
.learning-ai-admin-table td:nth-child(2) {
  width: 10%;
}
.learning-ai-admin-table th:nth-child(3),
.learning-ai-admin-table td:nth-child(3),
.learning-ai-admin-table th:nth-child(4),
.learning-ai-admin-table td:nth-child(4) {
  width: 24%;
}
.learning-ai-admin-table p {
  margin: 0 0 6px;
  overflow-wrap: anywhere;
}
.learning-ai-admin-table details {
  max-width: 100%;
}
.learning-ai-feedback-badge {
  display: inline-flex;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef4ff;
  color: var(--brand);
  font-size: 12px;
  font-weight: 700;
}
.learning-ai-feedback-badge.bad {
  background: #fff3f0;
  color: var(--bad);
}
@media (max-width: 980px) {
  .learning-ai-admin-table {
    table-layout: auto;
  }
}
.certificate-route-card {
  grid-column: 1 / -1;
  position: relative;
  overflow: hidden;
  min-height: 172px;
  border: 1px solid #dfe6f2;
  border-left: 5px solid #ffa412;
  border-radius: var(--radius);
  background:
    linear-gradient(135deg, rgba(255,164,18,.10), rgba(5,29,94,.04)),
    #fff;
  box-shadow: var(--shadow);
}
.certificate-route-card summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
}
.certificate-route-card summary::-webkit-details-marker { display: none; }
.certificate-route-copy,
.certificate-route-lock {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.certificate-route-kicker {
  color: #a86700;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.certificate-route-title {
  color: var(--brand);
  font-size: 20px;
  font-weight: 800;
}
.certificate-route-sub {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.certificate-route-badge {
  flex: none;
  border-radius: 999px;
  background: rgba(30, 124, 74, .11);
  color: var(--good);
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 800;
}
.certificate-route-reveal {
  display: grid;
  grid-template-columns: minmax(260px, 1.1fr) minmax(220px, .9fr);
  gap: 18px;
  align-items: center;
  padding: 0 20px 20px;
}
.certificate-route-actions p { margin-top: 0; color: var(--muted); }
.certificate-route-locked-preview {
  position: absolute;
  inset: 14px 16px;
  filter: blur(5px);
  opacity: .58;
  transform: scale(1.02);
  pointer-events: none;
}
.certificate-route-card.is-locked {
  min-height: 190px;
  cursor: default;
}
.certificate-route-card.is-locked::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,.46);
  z-index: 1;
}
.certificate-route-card.is-locked .certificate-route-lock {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 20px;
}
.certificate-mini-preview {
  position: relative;
  min-height: 132px;
  border: 1px solid #e2e8f2;
  border-radius: var(--radius);
  background:
    linear-gradient(90deg, rgba(5,29,94,.12) 0 8px, transparent 8px calc(100% - 8px), rgba(255,164,18,.25) calc(100% - 8px)),
    radial-gradient(circle at 50% -30%, #ffffff 0, #fff8e9 45%, #f4f7fc 100%);
  box-shadow: inset 0 0 0 5px rgba(255,255,255,.72);
  display: grid;
  place-items: center;
  padding: 18px;
  text-align: center;
}
.certificate-mini-logo {
  position: absolute;
  top: 12px;
  left: 16px;
  color: var(--brand);
  font-size: 12px;
  font-weight: 900;
}
.certificate-mini-title {
  color: var(--brand);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: .18em;
}
.certificate-mini-rule {
  width: 120px;
  height: 2px;
  background: linear-gradient(90deg, transparent, #ffa412, transparent);
  margin-top: -10px;
}
.certificate-mini-name {
  color: var(--brand);
  font-size: 16px;
  font-weight: 800;
}
.certificate-mini-role,
.certificate-mini-score {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.next-step-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 18px;
  border-left: 6px solid var(--brand-3);
  background:
    linear-gradient(135deg, rgba(255, 164, 18, .14), rgba(255,255,255,0) 38%),
    #fff;
}
.next-step-panel[hidden] { display: none; }
.next-step-panel.test,
.next-step-panel.final { border-left-color: var(--good); }
.next-step-panel.attention { border-left-color: var(--warn); }
.next-step-panel.done { border-left-color: var(--brand); }
.next-step-dismiss {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--muted);
  box-shadow: none;
  font-size: 22px;
  line-height: 1;
}
.next-step-dismiss:hover {
  background: #eef3ff;
  color: var(--brand);
  box-shadow: none;
}
.next-step-icon {
  width: 58px;
  height: 58px;
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #eef3ff;
  color: var(--brand);
  font-size: 30px;
  flex: none;
}
.next-step-label {
  display: inline-flex;
  align-items: center;
  color: var(--brand);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.next-step-body h2 {
  margin: 3px 0 5px;
  color: var(--brand);
}
.next-step-body p {
  margin: 0;
  color: var(--muted);
  overflow-wrap: anywhere;
}
.next-step-button {
  white-space: normal;
  text-align: center;
}
.cabinet-zone {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.cabinet-zone-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.cabinet-zone-head h2 { margin: 0; }
.cabinet-zone-head p { margin: 6px 0 0; }
.manager-dashboard-page {
  display: grid;
  gap: 12px;
}
.manager-dashboard-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.manager-dashboard-title-row h1 {
  margin: 0;
}
.manager-dashboard-jump-links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}
.manager-dashboard-jump-links .button {
  min-height: 36px;
  padding: 8px 12px;
  font-size: 13px;
}
.manager-dashboard-overview {
  display: grid;
  grid-template-columns: minmax(270px, .85fr) minmax(380px, 1.4fr);
  gap: 12px;
  align-items: stretch;
}
.manager-dashboard-overview .route-progress-panel {
  height: 100%;
  margin: 0;
  padding: 16px 18px;
}
.manager-dashboard-page .route-progress-head {
  gap: 10px;
}
.manager-dashboard-page .route-progress-head h2 {
  font-size: 18px;
}
.manager-dashboard-page .route-progress-head strong {
  font-size: 30px;
}
.manager-dashboard-page .route-progress-wrap {
  margin-top: 10px;
}
.manager-dashboard-stats-card {
  display: flex;
  align-items: stretch;
  min-width: 0;
}
.manager-dashboard-stats-card .stats-grid {
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.manager-dashboard-page .stat {
  min-height: 72px;
  padding: 12px 14px;
}
.manager-dashboard-page .stat b {
  font-size: 22px;
}
.manager-dashboard-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
  gap: 12px;
  align-items: start;
}
.manager-dashboard-main-flow,
.manager-dashboard-side-flow {
  display: grid;
  gap: 12px;
  min-width: 0;
}
.manager-dashboard-page .panel {
  margin: 0;
  padding: 18px;
}
.manager-dashboard-side-flow .panel {
  padding: 16px;
}
.manager-dashboard-page .cabinet-zone {
  gap: 10px;
}
.manager-dashboard-page .cabinet-zone-head {
  align-items: center;
  gap: 12px;
}
.manager-dashboard-page .cabinet-zone-head h2 {
  font-size: 18px;
}
.manager-dashboard-page .cabinet-zone-head p {
  font-size: 13px;
  line-height: 1.35;
}
.manager-dashboard-page .action-grid {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  margin: 0;
}
.manager-dashboard-page .action-tile {
  min-height: 76px;
  padding: 12px 14px;
}
.manager-dashboard-page .action-tile-icon {
  font-size: 22px;
}
.manager-dashboard-page .action-tile-sub {
  font-size: 12px;
  line-height: 1.35;
}
.manager-dashboard-page .month-close-main {
  gap: 12px;
}
.manager-dashboard-page .month-close-panel h2 {
  font-size: 18px;
}
.manager-dashboard-page .month-close-action {
  min-width: 150px;
}
.manager-dashboard-side-flow .month-close-main {
  flex-direction: column;
}
.manager-dashboard-side-flow .month-close-action {
  justify-content: stretch;
  width: 100%;
}
.manager-dashboard-side-flow .month-close-action button,
.manager-dashboard-side-flow .month-close-action form {
  width: 100%;
}
.manager-dashboard-side-flow .action-grid {
  grid-template-columns: 1fr;
}
.manager-dashboard-page .legal-task-cabinet-summary {
  justify-content: flex-start;
}
.manager-dashboard-page table {
  font-size: 13px;
}
@media (max-width: 1100px) {
  .manager-dashboard-overview,
  .manager-dashboard-layout {
    grid-template-columns: 1fr;
  }
  .manager-dashboard-side-flow {
    order: -1;
  }
  .manager-dashboard-stats-card .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 820px) {
  .manager-dashboard-title-row {
    align-items: flex-start;
    flex-direction: column;
  }
  .manager-dashboard-jump-links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }
  .manager-dashboard-jump-links .button {
    width: 100%;
    text-align: center;
  }
  .manager-dashboard-page .panel {
    padding: 14px;
  }
  .manager-dashboard-page .action-grid,
  .manager-dashboard-stats-card .stats-grid {
    grid-template-columns: 1fr;
  }
}
.legal-task-cabinet-panel.has-active-tasks {
  border-left: 5px solid var(--warn);
}
.legal-task-cabinet-panel.has-urgent-tasks {
  border-left-color: var(--bad);
  box-shadow: 0 14px 30px rgba(184, 57, 43, .12);
}
.legal-task-cabinet-summary {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}
.legal-import-lifecycle {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.legal-import-source-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin: 10px 0 12px;
}
.legal-import-source-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 10px;
  align-items: start;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.legal-import-source-card:has(input:checked) {
  border-color: var(--brand);
  box-shadow: inset 4px 0 0 var(--brand);
  background: #f7fbff;
}
.legal-import-source-card strong {
  color: var(--brand);
}
.legal-import-source-card span {
  grid-column: 2;
  color: var(--muted);
  font-size: 13px;
}
.legal-import-review-block {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.legal-import-alias-list,
.legal-import-problem-list {
  display: grid;
  gap: 10px;
}
.legal-import-alias-row {
  display: grid;
  grid-template-columns: minmax(210px, 1fr) minmax(260px, 1.4fr) auto;
  gap: 12px;
  align-items: end;
  padding: 10px 12px;
  border-left: 4px solid var(--warn);
  background: #fffaf0;
}
.legal-import-alias-row > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  align-items: center;
}
.legal-import-alias-row > div .muted {
  flex-basis: 100%;
  font-size: 12px;
}
.legal-import-problem-row {
  padding: 12px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--bad);
  background: #fff;
}
.legal-import-problem-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.legal-import-problem-head > div {
  display: flex;
  align-items: center;
  gap: 8px;
}
.legal-import-skip {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 7px;
  color: var(--muted);
}
.legal-import-edit-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 10px;
}
.legal-import-technical-report {
  margin-top: 16px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}
.legal-import-technical-report summary {
  cursor: pointer;
  color: var(--brand);
  font-weight: 700;
}
@media (max-width: 1100px) {
  .legal-import-edit-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }
  .legal-import-alias-row {
    grid-template-columns: 1fr 1fr;
  }
  .legal-import-alias-row .button {
    grid-column: 2;
    justify-self: start;
  }
}
@media (max-width: 680px) {
  .legal-import-edit-grid,
  .legal-import-alias-row {
    grid-template-columns: 1fr;
  }
  .legal-import-alias-row .button {
    grid-column: 1;
  }
  .legal-import-problem-head {
    align-items: flex-start;
    flex-direction: column;
  }
}
.testing-zone { border-left: 5px solid var(--good); }
.learning-zone { border-left: 5px solid var(--brand-3); }
/* Primary tile: filled brand background for the main call-to-action */
.action-tile.primary {
  background: var(--brand);
  color: #fff;
  border: 1px solid var(--brand);
  border-left: 4px solid var(--brand-3);
  box-shadow: var(--shadow);
}
.action-tile.primary .action-tile-title { color: #fff; }
.action-tile.primary .action-tile-sub   { color: rgba(255,255,255,.78); }
.action-tile.primary:hover {
  background: var(--brand-2);
  border-color: var(--brand-2);
  color: #fff;
  box-shadow: var(--shadow-lg);
}
/* Buttons styled as tiles need their default <button> padding/border reset */
button.action-tile {
  width: 100%;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-3);
  text-align: left;
  font: inherit;
  cursor: pointer;
}
button.action-tile.primary { border-color: var(--brand); border-left-color: var(--brand-3); }
@media (max-width: 820px) {
  .action-grid { grid-template-columns: 1fr; }
  .action-tile { padding: 14px; }
  .forbidden-rule-card {
    grid-template-columns: 1fr;
  }
  .route-progress-head {
    align-items: stretch;
    flex-direction: column;
  }
  .route-progress-head strong {
    font-size: 28px;
  }
  .certificate-route-reveal { grid-template-columns: 1fr; }
  .certificate-route-card summary {
    align-items: flex-start;
    flex-direction: column;
  }
  .certificate-route-card.is-locked { min-height: 220px; }
  .next-step-panel {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  .next-step-button {
    grid-column: 1 / -1;
    width: 100%;
  }
  .next-step-dismiss {
    grid-column: 3;
    grid-row: 1;
  }
  .onboarding-reading-hero { flex-direction: column; }
  .onboarding-resource-stack { align-items: stretch; }
}

.training-material-link {
  align-self: flex-start;
  margin-top: 8px;
}

.onboarding-page {
  display: grid;
  gap: 18px;
}
.onboarding-hero-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
  padding: 28px;
  border: 1px solid #d8e2f1;
  border-left: 6px solid var(--brand-3);
  border-radius: var(--radius);
  background: linear-gradient(135deg, #ffffff 0%, #f4f8ff 58%, #eef7f1 100%);
  box-shadow: var(--shadow);
}
.onboarding-hero-panel.os {
  border-left-color: var(--good);
  background: linear-gradient(135deg, #ffffff 0%, #f5fbf7 58%, #f4f1ff 100%);
}
.onboarding-hero-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 12px;
  min-width: 0;
}
.onboarding-hero-copy h1 {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0;
  color: var(--brand);
  font-size: 34px;
  line-height: 1.08;
  letter-spacing: 0;
}
.onboarding-hero-emoji {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
  font-size: 26px;
}
.onboarding-hero-copy p {
  max-width: 760px;
  margin: 0;
  color: #4d5a70;
  font-size: 16px;
  line-height: 1.55;
}
.onboarding-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
}
.onboarding-presentation-button,
a.button.onboarding-presentation-button,
a.button.onboarding-presentation-button:visited {
  border: 1px solid #ef9f28;
  background: linear-gradient(135deg, #ffb13d 0%, #f07a2a 100%);
  color: #fff;
  box-shadow: 0 12px 26px rgba(240, 122, 42, .28);
}
.onboarding-presentation-button:hover,
a.button.onboarding-presentation-button:hover {
  border-color: #df641b;
  background: linear-gradient(135deg, #ffc05a 0%, #df641b 100%);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 16px 32px rgba(240, 122, 42, .34);
}
.onboarding-presentation-card {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 120px;
  padding: 18px;
  border: 1px solid #c8d8ee;
  border-left: 5px solid var(--brand-3);
  border-radius: var(--radius);
  background: #fff;
  color: var(--ink);
  text-decoration: none;
  box-shadow: var(--shadow);
}
.onboarding-presentation-card:hover {
  border-color: var(--brand-3);
  box-shadow: var(--shadow-lg);
}
.onboarding-presentation-card.static {
  pointer-events: none;
}
.onboarding-presentation-card b {
  display: block;
  color: var(--brand);
  font-size: 18px;
  margin-bottom: 4px;
}
.onboarding-presentation-card small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}
.onboarding-presentation-card.full-material-card {
  border-color: #f4b763;
  border-left-color: #f07a2a;
  background: linear-gradient(135deg, #fffaf0 0%, #fff4de 100%);
}
.onboarding-presentation-card.full-material-card:hover {
  border-color: #df641b;
  background: linear-gradient(135deg, #fff7e6 0%, #ffe7bf 100%);
}
.onboarding-presentation-card.full-material-card .onboarding-resource-icon {
  background: #fff;
  box-shadow: 0 10px 22px rgba(240, 122, 42, .18);
}
.onboarding-presentation-card.full-material-card b {
  color: #9a4a0f;
}
.full-material-panel {
  margin: 16px 0;
}
.full-material-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.onboarding-section-head.compact {
  margin-bottom: 10px;
}
.onboarding-section-head.compact h2 {
  font-size: 22px;
  margin: 4px 0 0;
}
.material-completion-hint {
  align-self: center;
  padding: 10px 12px;
  border: 1px solid #f4b763;
  border-radius: 8px;
  background: #fff7e6;
  color: #9a4a0f;
  font-weight: 700;
}
.material-viewer-page {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 4px;
  background: var(--bg);
}
.material-viewer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 42px;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  box-shadow: var(--shadow);
}
.material-viewer-top .badge {
  display: none;
}
.material-viewer-top h1 {
  margin: 0;
  font-size: 15px;
  line-height: 1.1;
}
.material-file-meta {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.material-viewer-top .toolbar {
  gap: 6px;
}
.material-viewer-top .button,
.material-viewer-top button {
  min-height: 32px;
  padding: 6px 10px;
  font-size: 13px;
}
.material-video-panel {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: var(--bg);
  box-shadow: none;
}
.material-video-title {
  flex: none;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.material-video-list {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 1px;
}
.material-video-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  flex: 0 0 auto;
  padding: 6px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--bg);
  color: var(--brand);
  box-shadow: none;
}
.material-video-link:hover {
  color: var(--brand-3);
  background: #fff;
  border-color: #c8d3e5;
}
.material-video-link b {
  font-size: 13px;
  white-space: nowrap;
}
.material-video-link small {
  opacity: .9;
  font-size: 12px;
  white-space: nowrap;
}
.material-viewer-shell {
  flex: 1;
  min-height: 0;
  position: relative;
  overflow: hidden;
}
.material-fullscreen-button {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 18px;
  border: 2px solid rgba(255,255,255,.92);
  border-radius: var(--radius);
  background: var(--brand-3);
  color: var(--brand);
  font-size: 16px;
  font-weight: 800;
  box-shadow: 0 10px 28px rgba(5,29,94,.24);
}
.material-fullscreen-button:hover {
  background: #ffb733;
  color: var(--brand);
  box-shadow: 0 12px 34px rgba(5,29,94,.30);
}
.material-frame-fallback {
  position: absolute;
  left: 14px;
  right: 220px;
  bottom: 14px;
  z-index: 6;
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 620px;
  padding: 10px 12px;
  border: 1px solid #b8d4ff;
  border-left: 5px solid var(--brand-2);
  border-radius: var(--radius);
  background: rgba(255,255,255,.96);
  color: var(--brand);
  box-shadow: 0 12px 34px rgba(5,29,94,.18);
}
.material-frame-fallback[hidden] {
  display: none;
}
.material-frame-fallback b {
  flex: none;
}
.material-frame-fallback span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}
.material-frame-fallback .button {
  flex: none;
  min-height: 38px;
  padding: 8px 12px;
  white-space: nowrap;
}
.material-exit-button {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 18px;
  border: 2px solid rgba(255,255,255,.94);
  border-radius: var(--radius);
  background: var(--bad);
  color: #fff;
  text-decoration: none;
  font-size: 16px;
  font-weight: 800;
  box-shadow: 0 10px 28px rgba(180,35,24,.24);
}
.material-exit-button:visited {
  color: #fff;
}
.material-exit-button:hover {
  background: #8f1d14;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 12px 34px rgba(180,35,24,.30);
}
.material-loader {
  position: absolute;
  inset: 1px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 7px;
  background: #f8fbff;
  color: var(--brand);
  text-align: center;
  transition: opacity .22s ease, visibility .22s ease;
}
.material-loader b {
  font-size: 16px;
}
.material-loader span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}
.material-loader.is-soft {
  background: rgba(248,251,255,.86);
}
.material-loader.is-hidden {
  opacity: 0;
  visibility: hidden;
}
.material-viewer-frame {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
}
.personal-data-watermarked {
  height: min(76vh, 860px);
}
.personal-data-form {
  display: grid;
  gap: 16px;
}
.personal-data-consent-card {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 14px;
  align-items: flex-start;
  margin: 0;
  padding: 16px;
  border: 1px solid #cdd9e8;
  border-radius: 8px;
  background: linear-gradient(180deg, #fff 0%, #f7fbff 100%);
  box-shadow: 0 10px 24px rgba(23, 44, 77, .08);
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.personal-data-consent-card:hover {
  border-color: #8fb3dc;
  box-shadow: 0 14px 30px rgba(23, 44, 77, .12);
}
.personal-data-check-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.personal-data-check-mark {
  position: relative;
  display: inline-flex;
  width: 30px;
  height: 30px;
  margin-top: 1px;
  border: 2px solid #9fb1c7;
  border-radius: 7px;
  background: #fff;
  box-shadow: inset 0 0 0 3px #fff;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.personal-data-check-mark::after {
  content: "";
  position: absolute;
  left: 8px;
  top: 4px;
  width: 8px;
  height: 15px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  opacity: 0;
  transform: rotate(45deg) scale(.85);
  transition: opacity .16s ease, transform .16s ease;
}
.personal-data-check-input:focus-visible + .personal-data-check-mark {
  outline: 3px solid rgba(36, 115, 184, .25);
  outline-offset: 3px;
}
.personal-data-check-input:checked + .personal-data-check-mark {
  border-color: #0b7a53;
  background: #0b7a53;
  box-shadow: inset 0 0 0 3px #0b7a53, 0 8px 18px rgba(11, 122, 83, .22);
  transform: translateY(-1px);
}
.personal-data-check-input:checked + .personal-data-check-mark::after {
  opacity: 1;
  transform: rotate(45deg) scale(1);
}
.personal-data-consent-card:has(.personal-data-check-input:checked) {
  border-color: #8bc6a8;
  background: linear-gradient(180deg, #fbfffd 0%, #f1fbf5 100%);
}
.personal-data-check-copy {
  display: grid;
  gap: 6px;
  color: var(--ink);
  line-height: 1.45;
}
.personal-data-check-copy b {
  font-size: 16px;
}
.personal-data-check-copy small {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}
.personal-data-code-pill {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border: 1px solid #d7e1ed;
  border-radius: 999px;
  background: #fff;
  color: var(--brand);
  font-weight: 800;
  white-space: nowrap;
}
.material-text-viewer {
  white-space: pre-wrap;
  margin: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  color: var(--ink);
  box-shadow: var(--shadow);
  font-family: inherit;
  font-size: 16px;
  line-height: 1.65;
  height: 100%;
  overflow: auto;
  user-select: text;
}
@media (max-width: 720px) {
  .material-viewer-page {
    padding: 3px;
    gap: 3px;
  }
  .material-viewer-top {
    align-items: stretch;
    flex-direction: column;
    min-height: auto;
  }
  .material-viewer-top .toolbar {
    width: 100%;
  }
  .material-viewer-top .toolbar .button,
  .material-viewer-top .toolbar button {
    flex: 1 1 0;
    text-align: center;
  }
  .material-viewer-top h1 {
    font-size: 15px;
  }
  .material-fullscreen-button {
    top: 10px;
    right: 10px;
    min-height: 44px;
    padding: 10px 13px;
    font-size: 14px;
  }
  .material-frame-fallback {
    left: 10px;
    right: 10px;
    bottom: 64px;
    flex-direction: column;
    align-items: stretch;
    gap: 7px;
    max-width: none;
  }
  .material-frame-fallback .button {
    width: 100%;
    justify-content: center;
  }
  .material-exit-button {
    right: 10px;
    bottom: 10px;
    min-height: 44px;
    padding: 10px 13px;
    font-size: 14px;
  }
  .material-video-panel {
    align-items: stretch;
    flex-direction: column;
    gap: 6px;
  }
}
.onboarding-route {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.onboarding-route-compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 16px;
}
.onboarding-route-step {
  min-width: 0;
  min-height: 92px;
  padding: 14px;
  border: 1px solid #d8e2f1;
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
}
.onboarding-route-step:nth-child(1) { border-left: 5px solid #2f80ed; }
.onboarding-route-step:nth-child(2) { border-left: 5px solid #8b5cf6; }
.onboarding-route-step:nth-child(3) { border-left: 5px solid #18a058; }
.onboarding-route-step:nth-child(4) { border-left: 5px solid #f59e0b; }
.onboarding-route-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  line-height: 1;
  border-radius: 8px;
  background: #f4f7fd;
  color: var(--brand);
  font-weight: 800;
  font-size: 20px;
  margin-bottom: 10px;
}
.onboarding-route-step.done .onboarding-route-icon {
  background: #eaf7f0;
  color: var(--good);
}
.onboarding-route-step.current {
  border-color: #9ec5fe;
  background: #f7fbff;
}
.onboarding-route-step.current .onboarding-route-icon {
  background: #eaf3ff;
  color: #1d62b7;
}
.onboarding-route-step.todo {
  background: #fbfcfe;
}
.onboarding-route-step em {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.onboarding-route-step b {
  display: block;
  color: var(--brand);
  font-size: 14px;
  margin-bottom: 3px;
}
.onboarding-route-step small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.onboarding-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding-top: 4px;
}
.onboarding-section-head h2 {
  margin: 6px 0 0;
  color: var(--brand);
}
.onboarding-reading-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.onboarding-reading-hero p { margin: 8px 0 0; }
.onboarding-resource-stack {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  min-width: min(360px, 100%);
}
.onboarding-resource-link {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand-3);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  text-decoration: none;
  box-shadow: var(--shadow);
}
.onboarding-resource-link:hover {
  border-color: var(--brand-3);
  box-shadow: var(--shadow-lg);
}
.onboarding-resource-link b {
  display: block;
  color: var(--brand);
  font-size: 15px;
}
.onboarding-resource-link span span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-top: 2px;
}
.onboarding-resource-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  border-radius: 8px;
  background: #edf3ff;
  color: var(--brand);
  font-size: 18px;
  font-weight: 800;
}
.onboarding-lesson-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
}
.onboarding-lesson-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 100%;
  padding: 18px;
  border: 1px solid #d8e2f1;
  border-left: 5px solid var(--brand-3);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
}
.onboarding-lesson-card.theme-1 { border-left-color: #2f80ed; background: #f8fbff; }
.onboarding-lesson-card.theme-2 { border-left-color: #18a058; background: #f7fcf9; }
.onboarding-lesson-card.theme-3 { border-left-color: #8b5cf6; background: #fbf9ff; }
.onboarding-lesson-card.theme-4 { border-left-color: #f59e0b; background: #fffaf1; }
.onboarding-lesson-card.theme-5 { border-left-color: #ef4444; background: #fff7f7; }
.onboarding-lesson-card.theme-6 { border-left-color: #0891b2; background: #f2fbfd; }
.onboarding-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.onboarding-card-top > .badge {
  flex: 0 0 auto;
  max-width: 100%;
  white-space: nowrap;
}
.onboarding-card-meta {
  display: inline-flex;
  align-items: center;
  flex: 1 1 150px;
  gap: 8px;
  min-width: 0;
}
.onboarding-emoji {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  line-height: 1;
  border-radius: var(--radius);
  background: #fff;
  box-shadow: 0 1px 4px rgba(5,29,94,.12);
  font-size: 22px;
}
.onboarding-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  flex: 0 0 36px;
  width: 36px;
  min-width: 36px;
  height: 36px;
  line-height: 1;
  border-radius: 8px;
  background: #f4f7fd;
  color: var(--brand);
  font-weight: 800;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.onboarding-lesson-card.theme-1 .onboarding-step { background: #eaf3ff; color: #1d62b7; }
.onboarding-lesson-card.theme-2 .onboarding-step { background: #e8f7ef; color: #137947; }
.onboarding-lesson-card.theme-3 .onboarding-step { background: #f1ebff; color: #6541c7; }
.onboarding-lesson-card.theme-4 .onboarding-step { background: #fff1d7; color: #9a5d00; }
.onboarding-lesson-card.theme-5 .onboarding-step { background: #ffe8e8; color: #b42318; }
.onboarding-lesson-card.theme-6 .onboarding-step { background: #def7fb; color: #09677e; }
.onboarding-lesson-card h2 {
  margin: 0;
  font-size: 19px;
  line-height: 1.25;
}
.onboarding-lesson-card ul,
.onboarding-bullet-list {
  margin: 0;
  padding-left: 18px;
}
.onboarding-lesson-card li,
.onboarding-bullet-list li {
  margin: 7px 0;
  line-height: 1.5;
}
.onboarding-next-step,
.onboarding-gate {
  border-left: 5px solid var(--brand-3);
}
.onboarding-next-step.ok { border-left-color: var(--good); }
.onboarding-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
  border: 1px solid #d8e2f1;
  border-left: 5px solid var(--brand-3);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
}
.onboarding-cta.ok {
  border-left-color: var(--good);
  background: #f7fcf9;
}
.onboarding-cta b {
  display: block;
  color: var(--brand);
  margin-bottom: 4px;
}
.onboarding-cta span {
  display: block;
  color: var(--muted);
  line-height: 1.4;
}
.onboarding-complete-form {
  margin: 0;
  flex-shrink: 0;
}
.onboarding-gate {
  padding-left: 14px;
}
.onboarding-gate-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.onboarding-test-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  margin-top: 14px;
}
.onboarding-test-form { margin: 0; }
.onboarding-test-disabled {
  cursor: pointer;
  background: #f7f8fb;
  border-color: #dce3ef;
  border-left-color: #b8c2d4;
  color: var(--muted);
  box-shadow: none;
  user-select: none;
}
.onboarding-test-disabled:hover {
  transform: none;
  box-shadow: none;
  border-color: #dce3ef;
}
.onboarding-test-disabled:focus-visible {
  outline: 3px solid rgba(36, 99, 235, .24);
  outline-offset: 3px;
}
.onboarding-test-disabled .action-tile-title { color: #687487; }
.onboarding-test-disabled .action-tile-icon { opacity: .7; }
.disabled-tile-toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  z-index: 1200;
  max-width: min(560px, calc(100vw - 32px));
  padding: 13px 16px;
  border-radius: var(--radius);
  background: #162033;
  color: #fff;
  box-shadow: 0 18px 42px rgba(14, 24, 42, .28);
  font-size: 14px;
  line-height: 1.45;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 14px);
  transition: opacity .18s ease, transform .18s ease;
}
.disabled-tile-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}
@media (max-width: 640px) {
  .disabled-tile-toast {
    left: 16px;
    right: 16px;
    bottom: 16px;
    max-width: none;
    transform: translateY(14px);
  }
  .disabled-tile-toast.is-visible { transform: translateY(0); }
}
.onboarding-active-test {
  display: grid;
  gap: 12px;
}
.learning-test-action {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}
.test-action-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.repeat-attempt-form {
  margin: 0;
}
.repeat-attempt-button {
  white-space: nowrap;
}

.tests-compact,
.tests-status-panel {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.tests-compact h2,
.tests-status-panel h2 { margin-top:0; }
.tests-compact p,
.tests-status-panel p { margin:6px 0 0; }
.tests-status-panel > div:first-child { min-width:0; }
.tests-status-panel #test-start {
  flex:0 0 min(360px, 100%);
  width:min(360px, 100%);
}
.tests-status-panel #test-start form { margin-top:0 !important; }
.tests-status-panel #test-start .action-grid { margin-bottom:0; }
.onboarding-tests-panel {
  align-items: stretch;
  flex-direction: column;
}
.onboarding-tests-panel #test-start {
  flex: 1 1 auto;
  width: 100%;
}
.onboarding-tests-panel .onboarding-test-list {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  margin-top: 0;
}
@media (max-width: 820px) {
  .onboarding-hero-panel { grid-template-columns: 1fr; padding: 20px; }
  .onboarding-hero-copy h1 { font-size: 28px; }
  .onboarding-hero-actions { width: 100%; }
  .onboarding-hero-actions .button { flex: 1 1 160px; text-align: center; }
  .onboarding-route { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .onboarding-section-head { align-items: flex-start; flex-direction: column; }
  .onboarding-cta { align-items: stretch; flex-direction: column; }
  .onboarding-complete-form button { width: 100%; }
  .tests-compact,
  .tests-status-panel {
    align-items:stretch;
    flex-direction:column;
  }
  .tests-status-panel #test-start { width:100%; }
  .onboarding-gate-head { flex-direction: column; }
}

@media (max-width: 420px) {
  .onboarding-route { grid-template-columns: 1fr; }
  .onboarding-lesson-grid { grid-template-columns: minmax(0, 1fr); }
}

/* --- Program switcher chips (lightweight replacement of program_tabs buttons) --- */
.program-switch {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--muted);
}
.program-switch .label { font-weight: 600; color: var(--muted); margin-right: 4px; }
.program-switch .nav-chip { min-height: 28px; padding: 4px 10px; font-size: 13px; font-weight: 600; }
.nav-chip.active {
  background: var(--brand-orange);
  color: var(--brand);
  border-color: var(--brand-orange);
}
.nav-chip.active:hover {
  background: var(--brand-orange);
  color: var(--brand);
}
.nav-chip.chat-nav-unread {
  background:#fff7e8;
  border-color:#f0c36d;
  color:var(--warn);
}
.nav-chip.disabled {
  cursor: default;
  background: #f3f6fa;
  border-color: #d7e0ec;
  color: #8190a5;
  box-shadow: none;
}
.nav-chip.disabled:hover {
  background: #f3f6fa;
  color: #8190a5;
}

/* --- Nav user info: stack name on top, role + email below in muted small text --- */
.nav-user {
  display: inline-flex;
  flex-direction: column;
  line-height: 1.25;
  text-align: right;
}
.nav-user b { color: var(--brand); font-weight: 600; font-size: 14px; }
.nav-user .small { color: var(--muted); font-size: 12px; }
.nav-avatar-link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  flex:none;
}
.user-avatar {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:50%;
  object-fit:cover;
  background:#edf3fb;
  border:2px solid #fff;
  box-shadow:0 4px 12px rgba(5,29,94,.12);
  color:var(--brand);
  font-weight:800;
}
.nav-avatar-img {
  width:38px;
  height:38px;
  font-size:13px;
}
.avatar-large {
  width:92px;
  height:92px;
  font-size:28px;
}
.rating-manager-cell {
  display:flex;
  align-items:center;
  gap:10px;
  min-width:220px;
}
.rating-avatar {
  width:38px;
  height:38px;
  font-size:13px;
  flex:none;
}
.avatar-profile-row {
  display:flex;
  align-items:center;
  gap:16px;
  margin:10px 0 18px;
}

.legal-document-review-input,
.legal-document-review-add-form input,
.legal-document-review-add-form select,
.legal-document-review-add-form textarea {
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
.legal-document-review-add-form {
  display:grid;
  grid-template-columns:minmax(180px, 1fr) minmax(220px, 1.2fr) minmax(150px, .8fr) 90px minmax(260px, 1.4fr) auto;
  gap:10px;
  align-items:start;
  margin-top:14px;
}
.legal-document-review-text {
  max-height:420px;
  overflow:auto;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
@media (max-width: 980px) {
  .legal-document-review-add-form {
    grid-template-columns:1fr;
  }
}

.ops-maintenance-panel textarea {
  width:100%;
  max-width:100%;
  box-sizing:border-box;
}
.operator-status-page {
  max-width:760px;
}
.operator-status-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:12px;
}
.operator-status-card {
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:12px;
  min-height:150px;
  padding:16px;
  border:1px solid #dce5f0;
  border-left-width:6px;
  border-radius:8px;
  background:#fff;
  box-shadow:0 6px 18px rgba(5,29,94,.06);
}
.operator-status-card.ok { border-left-color:var(--ok); }
.operator-status-card.warn { border-left-color:var(--warn); }
.operator-status-card.bad { border-left-color:var(--bad); }
.operator-status-card strong {
  display:block;
  margin:5px 0 8px;
  font-size:24px;
  line-height:1.15;
  color:var(--brand);
  overflow-wrap:anywhere;
}
.operator-status-title {
  display:block;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
  text-transform:uppercase;
}
.operator-status-card p {
  margin:8px 0 0;
  color:var(--muted);
  overflow-wrap:anywhere;
}
.maintenance-page {
  min-height:60vh;
  display:grid;
  place-items:center;
}
.maintenance-box {
  max-width:620px;
  padding:30px;
  border:1px solid #dce5f0;
  border-radius:8px;
  background:#fff;
  box-shadow:0 8px 24px rgba(5,29,94,.08);
}